/* --------------------------------------------------------------------- */
/* HEADER */
/* --------------------------------------------------------------------- */
.pagination > li {display: none;}
#HEADER * {margin: 0px;}
#HEADER {
	width: 100%;
	height: 100%;
	display: block;
	position: fixed;
	z-index: 100;
}
#HEADER ul {list-style: none; display: block; padding: 0px;}
#HEADER.top {height: 100%;}
#HEADER.top #globalNav {z-index: 9999;}

/* 畫面主文字區塊位置 */
#HEADER.top .copybox {
	width: 100%;
	height: 100%;
	margin: 0;
	position: absolute;
	top: -80px;
	left: 0;
	text-transform: uppercase;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9000;
}
#HEADER.top .copybox .photo {
	width: 100%;
	max-width: 865px;
}
#HEADER.top .copybox .photo img {width: 100%; max-width: 100%;}
/* 畫面主文字區塊圖片大小 */
#HEADER.top .copybox .img .photo img {
	max-width: 100%;
	height: auto;
}
/* 畫面下方按鈕 */
#HEADER.top .scrollTo {
	font-size: 16px;
	width: 300px;
	color: #333;
	display: block;
	background-color: transparent;
	text-align: center;
	margin: 0 auto;
	border: none;
	text-decoration: none;
	position: absolute;
	bottom: 280px;
	left: 0;
	right: 0;
	z-index: 9000;
}
#HEADER.top .scrollTo .time-pc {
	width: 300px;
	margin: 15px 0;
	display: block;
}
#HEADER.top .scrollTo .time-rwd {display: none;}
#HEADER.top .scrollTo span {
	width: 100%;
	float: left;
	padding-top: 5px;
}
#HEADER.top .scrollTo a {
	font-size: 20px;
	color: #fff;
	padding: 15px 50px;
	background-color: #000;
	border-radius: 3px;
	text-decoration: none;
	position: relative;
	top: 0px;
}
#HEADER.top .scrollTo a:hover {
	color: #fff;
	background-color: #b01f24;
}
.wrapper,
#HEADER {
	-webkit-transition: all 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940);
	-moz-transition: all 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940);
	-ms-transition: all 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940);
	-o-transition: all 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940);
	transition: all 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940);
}
/* 畫面文字區塊顯示隱藏 */
.cp-logo-pc {display: block;}
.cp-logo-rw {display: none;}

/* --------------------------------------------------------------------- */
/* TOP SLIDER */
/* --------------------------------------------------------------------- */
.top #mainVisual {
	position: relative;
	height: 100%;
	top: 0;
	left: 0;
	display: block;
	z-index: 0;
}
.top #mainVisual:after {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.top #mainVisual * {max-width: inherit;}
.top #mainVisual ul {
	width: 100%;
	height: 100%;
	list-style: none;
	display: block;
}
.top #mainVisual img.slideImg {
	height: 100%;
	width: auto;
	text-align: center;
	margin: 0 auto;
}
.top #mainVisual ul li img.slideImg  {display: block;}

@media screen and (max-width: 1440px) {
#HEADER.top .copybox {top: -60px;}
#HEADER.top .copybox .photo {max-width: 720px;}	
#HEADER.top .scrollTo {bottom: 200px;}	
}

@media screen and (max-width: 1280px) {
#HEADER.top .copybox {top: -50px;}
#HEADER.top .copybox .photo {max-width: 600px;}	
#HEADER.top .scrollTo {bottom: 150px;}		
}

@media screen and (max-width: 1199px) {
#HEADER.top .copybox {top: -50px;}
#HEADER.top .copybox .photo {max-width: 640px;}	
#HEADER.top .scrollTo {bottom: 180px;}	
}

@media screen and (max-width: 991px) {
#HEADER.top .copybox {top: -80px;}	
#HEADER.top .copybox .photo {max-width: 700px;}
#HEADER.top::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0);
	z-index: 9000;
}
#HEADER.top .scrollTo {bottom: 310px;}	
.cp-logo-pc {display: none;}
.cp-logo-rw {display: block;}		
}

@media screen and (max-width: 767px) {
#HEADER.top .copybox .photo {max-width: 520px;}
#HEADER.top .copybox {top: -80px;}		
#HEADER.top .scrollTo {bottom: 250px;}	
}

@media screen and (max-width: 480px) {
#HEADER.top .copybox {top: -60px;}	
#HEADER.top .copybox .photo {
	width: 100%;
	max-width: 480px;
	padding: 0 0px;
	margin: 0 auto;
}
#HEADER.top .scrollTo {bottom: 160px;}
#HEADER.top .scrollTo .time-pc {display: none;}
#HEADER.top .scrollTo .time-rwd {	
	width: 100%;
	margin: 5px 0 8px 0;
	display: block;
}	
#HEADER.top .scrollTo span {padding-top: 0px;}	
#HEADER.top .scrollTo a {
	font-size: 16px;
	padding: 10px 20px;
	position: relative;
	top: 0px;
}	
}