@charset "utf-8";

/* CSS Document */

#header { height: 750px !important; }

#key h2 {
	position: absolute;
	right: 0px;
	bottom: 0;
}

#key .content { height: 750px; }

#key {
	background: url(../img/scene/key.jpg) no-repeat center center/cover;
	height: 750px !important;
}

#sec1 .cl01 .left {
	width: 590px;
	padding-top: 165px;
	margin-left: -116px;
}

#sec1 .cl02 {
	position: relative;
	min-height: 400px;
}

#sec1 .cl01 .right {
	width: 728px;
	right: -118px;
	min-height: 726px;
	position: absolute;
}

#sec1 .cl01 h3 {
	position: absolute;
	top: 444px;
	right: 117px;
}

#sec1 .cl02 .right {
	width: 580px;
	line-height: 34px;
	letter-spacing: 1px;
	margin-right: -10px;
	padding-top: 136px;
}

#sec1 .cl02 .left {
	width: 702px;
	left: -300px;
	min-height: 747px;
	position: absolute;
	top: 0px;
}

#sec1 .cl02 h3 {
	position: absolute;
	top: 461px;
	right: 5px;
}

#sec1 .cl03 {
	position: relative;
	min-height: 500px;
}

#sec1 .cl03 .right {
	width: 865px;
	height: 645px;
	position: absolute;
	top: 11px;
	right: -181px;
}

#sec1 .cl03 h3 {
	position: absolute;
	top: 450px;
	right: 429px;
}

#sec1 { padding-bottom: 300px; }

#sec1 .cl03 .left {
	font-size: 14px;
	line-height: 34px;
	letter-spacing: 1px;
	padding-top: 250px;
	width: 359px;
}

#sec2 {
	background: url(../img/index/line_yellow.jpg) repeat-x center bottom, url(../img/scene/sec2.png) no-repeat center top/cover;
	margin-top: -338px;
	padding-bottom: 107px;
}

#sec2 .left {
	width: 371px;
	margin-left: -27px;
	padding-top: 254px;
}

#sec2 .right {
	width: 427px;
	color: #FFFFFF;
	font-size: 14px;
	line-height: 34px;
	letter-spacing: 1px;
	padding-top: 203px;
}

#sec2 h2 {
	padding-top: 50px;
	padding-bottom: 22px;
}

#sec3 { background: url(../img/scene/sec3_top.jpg) repeat center top; }

#sec3 .bg {
	background: url(../img/scene/sec3_bottom.png) no-repeat center bottom;
	background-size: contain;
}

#sec3 h2 {
	text-align: center;
	padding-top: 110px;
	padding-bottom: 20px;
}

#sec3 .cl01 {
	background: url(../img/scene/sec3_cl01.png) no-repeat center 20px;
	padding-bottom: 174px;
}

#sec3 .cl01 .point01 {
	position: absolute;
	top: -26px;
	left: -12px;
	z-index: 1;
}

#sec3 .cl01 .left {
	position: relative;
	top: 42px;
	left: -15px;
}

#sec3 .cl01 .pt01 {
	position: absolute;
	top: 10px;
	left: 10px;
}

#sec3 .cl01 h3 {
	position: absolute;
	top: 61px;
	left: 311px;
	z-index: 1;
}

#sec3 .cl01 .right {
	width: 338px;
	font-size: 14px;
	line-height: 34px;
	letter-spacing: 1px;
	padding-top: 332px;
}

#sec3 .cl02 { background: url(../img/scene/sec3_cl03.png) no-repeat center 84px; }

#sec3 .cl02 .left {
	font-size: 14px;
	line-height: 34px;
	letter-spacing: 1px;
	width: 303px;
	padding-top: 407px;
	padding-bottom: 182px;
}

#sec3 .cl02 .right {
	width: 685px;
	position: relative;
	min-height: 644px;
	right: -60px;
	top: 74px;
}

#sec3 .point02 {
	position: absolute;
	z-index: 1;
	top: -16px;
	right: 38px;
}

#sec3 .pt02 {
	position: absolute;
	top: 10px;
	right: 25px;
}

#sec3 .pt03 {
	position: absolute;
	top: 369px;
	left: -21px;
}

#sec3 .pt04 {
	position: absolute;
	top: 384px;
	right: -40px;
}

#sec3 .cl02 h3 {
	position: absolute;
	top: 10px;
	left: -523px;
}

#sec3 .cl03 { background: url(../img/scene/sec3_cl04.png) no-repeat center top; }

#sec3 .cl03 .right {
	font-size: 14px;
	line-height: 34px;
	letter-spacing: 1px;
	width: 292px;
	padding-top: 266px;
	padding-right: 76px;
}

#sec3 .cl03 .left {
	position: relative;
	width: 611px;
	height: 636px;
}

#sec3 .point03 {
	position: absolute;
	top: 0;
	left: -17px;
	z-index: 99999;
}

#sec3 .pt05 {
	position: absolute;
	top: 0;
	left: -99px;
}

#sec3 .cl03 h3 {
	position: absolute;
	top: 0;
	right: -449px;
}

#sec3 li { float: left; }

#sec3 ul {
	padding-top: 81px;
	padding-left: 200px;
}

#sec3 h4 {
	padding-top: 270px;
	padding-bottom: 119px;
}