@charset "utf-8";

/* LAYOUT */
body { -webkit-text-size-adjust: 100%; }
#intro { display: flex; overflow: hidden; margin: 0 auto; -webkit-overflow-scrolling : touch; }
#intro .item { cursor: pointer; position: relative; display: flex; justify-content: center; align-items: center; width:33.33333%; height:100vh; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#intro .item.bg1 { background:url("../images/intro/slide1.jpg") no-repeat center; background-size:cover; }
#intro .item.bg2 { background:url("../images/intro/slide2.jpg") no-repeat center; background-size:cover; }
#intro .item.bg3 { background:url("../images/intro/slide3.jpg") no-repeat center; background-size:cover; }
#intro .item:after { content:""; position:absolute; left:0; top:0; right:0; bottom:0; background-color:rgba(0, 0, 0, 0.5); -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }

#intro .item:hover { width:50%; }
#intro .item:hover:after { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0; visibility: hidden; }

#intro .banner { z-index:1; width: 250px; margin:0 auto; }
#intro .banner ul { margin:0; padding:0; }
#intro .banner li { list-style:none; line-height:0; text-align:center; }
#intro .banner li.v1 { height:72px; }
#intro .banner li.v2 { height:72px; }
#intro .banner img { width:100%; }
#intro .banner:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#intro .slogan { z-index:1; position:absolute; width: 350px; left:9.3%; right:9.3%; top:65px; }
#intro .slogan img { width:100%; }





@media screen and (max-width:800px) {

	#intro { flex-direction: column; }
	#intro .item { justify-content: center; align-items: center; width:auto; height:33.33333vh; }

	#intro .item:hover { width:auto; height:50vh; }

	#intro .banner { width: 300px; margin:0 auto; }
	#intro .banner li { padding:0 20%; }
	#intro .banner li.v1 { height:auto; }
	#intro .banner li.v2 { display:none; }

	#intro .slogan { display:none; }

}

