@charset "utf-8";
@media print{
	.no-print{display: none;}
}

html { overflow-y:none; }
body { overflow-x:hidden; }

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-table;
}

.imgfade { position: relative; display: block; }
.imgfade img{
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  opacity: 1;
  filter: alpha(opacity=1);
}
.imgfade:hover img{
	opacity: 0.7;
	filter: alpha(opacity=70);
}

.fade {
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.fade:hover {
opacity: 0.8;
filter: alpha(opacity=80);
}

#contentArea li,#contentArea > .inner > h2,.infade{
	visibility: hidden;
}

.fadeIn {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	visibility: visible !important;
}
@-webkit-keyframes fadeIn {
	0% { opacity: 0; }
	99.9%,to{ opacity: 1; }
}
@keyframes fadeIn {
	0% { opacity: 0;  }
	99.9%,to{ opacity: 1; }
}
.fadeIn2 {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1.5s;
	-ms-animation-duration:1.5s;
	animation-duration:1.5s;
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	visibility: visible !important;
}
@-webkit-keyframes fadeIn2 {
	0% { opacity: 0; }
	99.9%,to{ opacity: 1; }
}
@keyframes fadeIn2 {
	0% { opacity: 0;  }
	99.9%,to{ opacity: 1; }
}

.fadeInDown {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-30px); }
	99.9%,to{ opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); }
	99.9%,to{ opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}


.basebtn { background: #1D2089; width: 272px; height:64px; margin: 0 auto; visibility: hidden; }
.basebtn a{ margin: 0 5px 5px; padding: 5px 0 0; display: block; position: relative; overflow: hidden; background: none; }
.basebtn a img{
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
 opacity: 1;
}
.basebtn a img.on{
	position: absolute;
	z-index: 1;
	top: 5px;
	opacity: 0 !important;
}
.basebtn a:hover img{ opacity: 0; }
.basebtn a:hover img.on{ opacity: 1 !important; }

.basebtn a:before{
	content: "";
	background: #fff;
	position: absolute;
	width: 0; height: 100%;
	display: inline-block;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	z-index: 0;
}
.basebtn a:hover:before{
	width: 100%;
}
.btn_cm{
	margin-bottom: 160px;
}
.graphic_newIcon{ position: relative; }

.mt50{ margin-top: 50px !important;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */


.pcNon { display:none; }

.layer { display:none; }

#pageTop { position:fixed; bottom: 3%; right: 1%; width: 80px; height: 80px; z-index: 20; }
#pageTop a { display:block; }
/**/

.avoid-clicks {
	pointer-events: none!important;
}
.avoid-hover{
	opacity: 1!important;
	-webkit-transition: none!important;
	transition: none!important;
}

@media only screen and (min-width: 641px) and  (max-width: 960px) {

	.layer { display:none; }
	.noAnime { display:none; }
	.graphic_newIcon:before { top: 20.31%; left: 28.96%; width: 21.46%;}

	#pageTop {
		width: 80px;
		height: 80px;
		width: 8.3%;
		height: auto;
	}
}

@media only screen and (max-width: 640px) {
	.layer { position:absolute; top:0; left:0; width:100%; height:100%; opacity:1; z-index:6!important; }
	.layer img { width:100%; height:100%; }

	#pageTop,
	.spNon,
	.anim_bg { display:none !important; }
	.pcNon { display:block; }

	#Cont { position:relative; }

	.indexLink { display:block; width:46%; height:100%; position:absolute; top:0; left:0; z-index:300000; }
	.sp_memu{
		display:block;
		width:30%;
		height:100%;
		position:absolute;
		top:0;
		right:0;
		z-index:300000;
	}
	.graphic_newIcon{ position: relative; }

	.basebtn { background: #1D2089; width: 46%; height:auto; margin: 0 auto; visibility: hidden; }
	.basebtn a{ margin: 0 3px 3px; padding: 0 0 0; display: block; position: relative; overflow: hidden; background: none; }
	.basebtn a img{
		 -webkit-transition: all 0s ease-out;
		 -moz-transition: all 0s ease-out;
		 -ms-transition: all 0s ease-out;
		 transition: all 0s ease-out;
		 opacity: 1;
	}
	.basebtn a img.on{
	  position: absolute;
	  z-index: 1;
	  top: 3px;
	  opacity: 0 !important;
	}
	.basebtn a:hover img{ opacity: 1; }
	.basebtn a:hover img.on{ opacity: 0 !important; }

	.basebtn a:before{
		 content: "";
		 background: #fff;
		 position: absolute;
		 width: 0; height: 100%;
		 display: inline-block;
		 -webkit-transition: all 0.3s ease-out;
		 -moz-transition: all 0.3s ease-out;
		 -ms-transition: all 0.3s ease-out;
		 transition: all 0.3s ease-out;
		 z-index: 0;
	}
	.basebtn a:hover:before{
	  width: 0;
	}


}