@charset "utf-8";
/* CSS Document */

h1,h2,h3,p.txt,ul{
	text-align: left;
}

/*ローディング*/
#top #loader {
    width: 24px;
    height: 24px;
    display: block;
    position: fixed;
    _position: absolute; /* IE6対策 */
    top: 50%;
    left: 50%;
    margin-top: -12px; /* heightの半分のマイナス値 */
    margin-left: -12px; /* widthの半分のマイナス値 */
    z-index: 100;
    background: url(../images/loading.gif) no-repeat;
	-webkit-background-size: 24px;
	-moz-background-size: 24px;
	background-size: 24px;
}
#top #fade {
    width: 100%;
    height: 100%;
    display: block;
    background-color: #fff;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 9999;
}

/*wrapper ローディング用*/
#top #wrapper{
	overflow: hidden;
	opacity: 0;
}
/************
 #intro
 ************
----------------------------------------- */

/* .photoArea
----------------------------------------- */
#intro .photoArea{
	margin: 80px auto 0;
	max-width: 800px;
	width: 100%;
	max-height: 532px;
	height: 100%;
	position: relative;
	opacity: 0;
}
#intro .photoArea .sliderWrap li{
	width: 100%;
	/*background: #ff0000;*/
	text-align: center;
}
#intro .photoArea .sliderWrap li .sWrap{
}
#intro .photoArea .sliderWrap li img{
	max-width: 800px;
	max-height: 532px;
}
#intro .photoArea .sliderWrap .bx-pager-link span{
	display: none;
}
#intro .photoArea .sliderWrap .bx-prev{
	display: none;
}
#intro .photoArea .sliderWrap .bx-next{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 99;
	cursor: pointer;
	text-indent: -9898px;
}
	@media screen and (max-width: 840px) {

	}
	@media screen and (max-width: 840px) {
		#intro .photoArea{
			padding: 20px;
			max-height: inherit;
		}
		#intro .photoArea .sliderWrap li img{
			max-width: 600px;
			/*max-height: 532px;*/
		}
	}
	@media screen and (max-width: 750px) {
		#intro .photoArea .sliderWrap li .sWrap{
			display: table-cell;
			vertical-align: middle;
		}
		#intro .photoArea .sliderWrap li img{
			max-width: 100%;
			max-height: 100%;
		}
	}
	@media screen and (max-width: 640px) {
		#intro .photoArea .sliderWrap li .sWrap{
			display: table-cell;
			vertical-align: middle;
		}
		#intro .photoArea .sliderWrap li img{
			max-width: 100%;
			max-height: 100%;
		}
	}
/* h1
----------------------------------------- */
#intro .inner{
	position: relative;
	margin: 0 auto;
	max-width: 800px;
	width: 100%;
}
#intro h1{
	position: absolute;
    bottom: 71px;
    right: -77px;
	text-indent: -9898px;
	z-index: 100;
	background-image: url(../images/logo.svg);
	background-repeat: no-repeat;
	display: block;
	background-position: 0 0;
	width: 156px;
	height: 27px;
	cursor: pointer;
}
	@media screen and (max-width: 970px) {
		#intro h1{
		    right: -10px;
		}
	}
	@media screen and (max-width: 840px) {
		#intro h1{
		    right: 5px;
		}
	}
	@media screen and (max-width: 640px) {
		#intro h1{
		    position: fixed;
		    margin-right: 0;
		    margin-top: 0;
		    right: 15px;
		    bottom: 20px;
			width: 100px;
			height: 21px;
		}
	}
#intro h1:hover {  
    opacity: 0.6 !important;  
    filter: alpha(opacity=60);  
	-ms-filter: "alpha( opacity=60 )" !important;
    -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; 
} 
@media screen and (max-width: 670px) {
		#intro h1{  
		    display: none;
		} 
	}
	@media screen and (max-width: 640px) {
		#intro h1{  
		    display: none;
		} 
	}

/* .control
----------------------------------------- */
#intro .control{
	position: fixed;
	bottom: 52px;
	right: 52px;
	z-index: 99;
	opacity: 0;
}
#intro .control ul{
	overflow: hidden;
}
#intro .control ul li{
	float: left;
}
#intro .control ul li:first-child{

}
#intro .control button#stop{
	margin-right: 14px;
	background: url(../images/stop.png) 50% 50% no-repeat;
	border: none;
	cursor: pointer;
	text-indent: -9999px;
	width: 8px;
	-webkit-background-size: 8px;
	-moz-background-size: 8px;
	background-size: 8px;
}
#intro .control button#play{
	background: url(../images/play.png) 50% 50% no-repeat;
	border: none;
	cursor: pointer;
	text-indent: -9999px;
	width: 8px;
	-webkit-background-size: 8px;
	-moz-background-size: 8px;
	background-size: 8px;
}
#intro .control button#play.nowplay,
#intro .control button#stop.nowstop{
	opacity:0.3;
	filter:alpha(opacity=30);
	-ms-filter: "alpha( opacity=30 )";
}
#intro .control button:focus {
	outline: none;
}
/************
 #topCon
 ************/

#topCon{
	display: none;
}