@charset "utf-8";

/* topappeal */
.topappeal {
	min-height: 640px;
	overflow: hidden;
	position: relative;
	z-index: 100;
}

/* pager */
.topappeal .pager {
	position: fixed;
	top: -200px;
	right: 20px;
	width: 10px;
	z-index: 100;
}

.topappeal .pager li {
	margin: 20px 0;
}

.topappeal .pager li a {
	display: block;
	width: 14px;
	height: 14px;
	line-height: 0;
	background: url(../img/top/topappeal/page.png) center center no-repeat;
}

.topappeal .pager li a.current,
.topappeal .pager li a:hover {
	background: url(../img/top/topappeal/page_on.png) center center no-repeat;
}

.topappeal .pager li a:hover {
	margin: 12px 0;
}

/* section */
.topappeal .section {
	width: 100%;
	overflow: hidden;
	position: relative;
	text-align: left;
}

.topappeal .section .secbg {
	min-width: 1180px;
	min-height: 500px;
	position: relative;
	background-size: cover;
	background-repeat: no-repeat;
}

.topappeal .section .secstage {
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: left;
	z-index: 90;
}

.topappeal .section .page_prev,
.topappeal .section .page_next {
	width: 42px;
	height: 28px;
	position: absolute;
	left: 50%;
	margin-left: -21px;
	z-index: 1000;
}

.topappeal .section .page_prev {
	top: 20px;
	background: url(../img/top/topappeal/page_prev.png) top center no-repeat;
}

.topappeal .section .page_next {
	bottom: 20px;
	background: url(../img/top/topappeal/page_next.png) top center no-repeat;
}

.topappeal .section .page_prev:hover {
	background: url(../img/top/topappeal/page_prev_on.png) top center no-repeat;
}

.topappeal .section .page_next:hover {
	background: url(../img/top/topappeal/page_next_on.png) top center no-repeat;
}

.topappeal #section01 .secbg { background: url(../img/top/topappeal/section01/section01.jpg) no-repeat center top; }
.topappeal #section02 .secbg { background-image: url(../img/top/topappeal/section02/section02.jpg); }
.topappeal #section03 .secbg { background-image: url(../img/top/topappeal/section03/section03.jpg); }

/* section01 */
#section01 .secstage .copy {
	width: 540px;
	height: 60px;
	position: absolute;
	margin-top: -182px;
	margin-left: -245px;
}

#section01 .secstage .text {
	width: 560px;
	height: 60px;
	position: absolute;
	margin-top: -116px;
	margin-left: -255px;
}

#section01 .secstage .photo {
	width: 158px;
	height: 142px;
	position: absolute;
	margin-top: -48px;
	margin-left: -52px;
}

#section01 .secstage .link {
	width: 209px;
	height: 36px;
	position: absolute;
	margin-top: 108px;
	margin-left: -77px;
}

/* section02 */
#section02 .secstage .copy {
	width: 364px;
	height: 60px;
	position: absolute;
	margin-left: -78px;
}

#section02 .secstage .text {
	width: 436px;
	height: 60px;
	position: absolute;
	margin-top: 60px;
	margin-left: -78px;
}

#section02 .secstage .link {
	width: 209px;
	height: 36px;
	position: absolute;
	margin-top: 146px;
	margin-left: 142px;
}

#section02 .thums {
	width: 100%;
	min-width: 1180px;
	height: 260px;
	overflow: hidden;
	position: absolute;
	top: 120px;
}

#section02 .thums li {
	float: left;
	width: 182px;
	margin: 28px;
}

/* section03 */
#section03 .secstage .copy {
	width: 340px;
	height: 60px;
	position: absolute;
	margin-top: -251px;
	margin-left: -325px;
}

#section03 .secstage .text {
	width: 468px;
	height: 60px;
	position: absolute;
	margin-top: -183px;
	margin-left: -325px;
}

#section03 .secstage .link {
	width: 209px;
	height: 36px;
	position: absolute;
	margin-top: -100px;
	margin-left: -325px;
}

#section03 .secstage .photo {
	min-width: 1180px;
	min-height: 500px;
	position: absolute;
}

#section03 .secstage .photo img {
	width: 100%;
	margin-left: 160px;
}

/* bottom_navigation */
.bottom_navigation{
	display: none;
}