/*---------------------------------//index banner-----------------------------------*/


.area_visual {overflow:hidden; position: relative; width:100%; height:450px; background: url(../images/loading.gif) center center no-repeat; }
.area_visual .ul_visual li {display:none; overflow:hidden; position:absolute; top:0; left:0; width:100%; height:0; padding-top:450px; background-repeat:no-repeat; background-position:center center;background-size:cover;font-family: "微软雅黑";}
.area_visual .ul_visual li.li1 {display:block ;}
.area_visual .ul_visual li.li1 {background-image:url(../images/main/img_visual_11.jpg);}
.area_visual .ul_visual li.li2 {background-image:url(../images/main/img_visual_22.jpg);}
.area_visual .ul_visual li.li3 {background-image:url(../images/main/img_visual_33.jpg);}
.area_visual .ul_visual li.li4 {background-image:url(../images/main/img_visual_44.jpg);}
.area_visual .ul_visual li.li5 {background-image:url(../images/main/img_visual_5.jpg);}

.area_visual .ul_visual li p {display:none; position:absolute; left:50%; opacity:0; color:#0F387B;}
.area_visual .ul_visual li .txt_1 {font: normal 24px/36px  "微软雅黑",Arial, "宋体";  padding:15px 15px;letter-spacing: 3px;
background-color: rgba(255,255,255,0.7); border-radius:5px; /*border-bottom:3px solid rgba(230,0,33,0.8);*/
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#E5ffffff,endColorstr=#E5ffffff);/*ie6*/
}
.etxt {/*font: normal 24px/36px  Arial !important; letter-spacing:0 !important;*/ font-family:Arial, Helvetica, sans-serif;
}


.area_visual .ul_visual li .txt_1 span{font: bold 30px/40px  "微软雅黑",Arial, "宋体"; color:#153057;}
.area_visual .ul_visual li .txt_1 .span_block {font-family:'Arial';}
.area_visual .ul_visual li.li1 .txt_1 {margin-top:35px; margin-left:8%;}
.area_visual .ul_visual li.li2 .txt_1 {margin-top:45px ; margin-left:-530px;}
.area_visual .ul_visual li.li3 .txt_1 {margin-top:45px; margin-left:-530px;  }
.area_visual .ul_visual li.li4 .txt_1 {margin-top:45px; margin-left:-530px;  }


/*.area_visual .ul_visual li.li1 .txt_1 {top:3%; margin-left:120px; width:430px; height:290px; background:url(../images/main/visual_110.png) no-repeat; font-size:0; text-indent:-10000px;}
*/.area_visual .ul_visual li.li1 .txt_2 {top:41%; margin-left:9px; width:350px; height:60px;}
.area_visual .ul_visual li.li1 .img_1 {top:50%; margin-left:-281px; width:430px; height:290px; background:url(../images/main/visual_11.png) no-repeat;}


/*.area_visual .ul_visual li.li2 .txt_1 {top:3%; margin-left:120px; width:430px; height:290px; background:url(../images/main/visual_22.png) no-repeat; font-size:0; text-indent:-10000px;}
.area_visual .ul_visual li.li2 .txt_2 {top:40%; margin-left:-420px; width:470px; height:65px; font-size:18px; line-height:28px;color:#FFF;}*/
/*.area_visual .ul_visual li.li2 .txt_1 {top:17.5%; margin-left:-420px; width:420px; height:90px; font-size:54px;color:#FFF;font-family:'微软雅黑';}
.area_visual .ul_visual li.li2 .txt_2 {top:42.5%; margin-left:-420px; width:435px; height:65px;color:#FFF;font-family:'微软雅黑';}*/
.area_visual .ul_visual li.li2 .img_1 {top:10%; margin-left:120px; width:430px; height:290px; background:url(../images/main/visual_22.png) no-repeat;}

/*.area_visual .ul_visual li.li3 .txt_1 {top:3%; margin-left:120px; width:430px; height:290px; background:url(../images/main/visual_33.png) no-repeat; font-size:0; text-indent:-10000px;}*/
.area_visual .ul_visual li.li3 .txt_2 {top:33%; margin-left:90px; width:335px; height:65px; font-size:18px; line-height:28px;}
.area_visual .ul_visual li.li3 .img_1 {top:30%; margin-left:120px; width:430px; height:290px; background:url(../images/main/visual_33.png) no-repeat;}



.area_visual .ul_visual li.li3 .img_2 {top:-5%; margin-left:-221px; width:175px; height:236px; background:url(../images/main/img_visual_3_2.png) no-repeat;}

/* .area_visual .ul_visual li.li4 .txt_1 {top:13.5%; margin-left:-420px; width:467px; height:103px; font-size:54px; color:#FFF;} */
.area_visual .ul_visual li.li4 .txt_2 {top:40%; margin-left:-420px; width:470px; height:65px; font-size:18px; line-height:28px;color:#FFF;}
.area_visual .ul_visual li.li4 .img_5 {top:0%; margin-left:-209px; width:170px; height:100%; background:url(../images/main/img_visual_4_1.png) no-repeat;}
.area_visual .ul_visual li.li4 .img_6 {top:49.5%; margin-left:-446px; width:0; height:47px; background:url(../images/main/img_visual_4_2.png) no-repeat;}
/* 2014-05-31 추가 */

.area_visual .ul_visual li.li5 .txt_1 {top:2.5%; margin-left:-67px; width:560px; height:55px; text-align:center; font-size:50px;}
.area_visual .ul_visual li.li5 .txt_2 {top:17.5%; margin-left:-77px; width:580px; height:30px; font-size:18px; text-align:center;}
.area_visual .ul_visual li.li5 .img_4 {top:55.55%; margin-left:45px; width:139px; height:107px; background:url(../images/main/img_visual_5_1.png) no-repeat; opacity:1;}
.area_visual .ul_visual li.li5 .img_3 {top:57.25%; margin-left:49px; width:0; max-width:108px; height:65px; background-color:#abdb12;}

.area_visual .ul_arrow a {position: relative; width:100%; top:50%;  margin-top:-45px;  font-size:0;}
.area_visual .ul_arrow .li_prev a {position:absolute; left:2%; top:; width:45px; height:45px; background: url(../images/main/prev.png) left center no-repeat; }
.area_visual .ul_arrow .li_next a {position:absolute; right:2%; top:; width:45px; height:45px; background: url(../images/main/next.png) left center no-repeat; } 

/*.area_visual .ul_arrow a {position:absolute; top:50%; left:50%; width:45px; margin-top:-27px; padding-top:54px; font-size:0;}
.area_visual .ul_arrow .li_prev a {margin-left:-560px; background: url(../images/main/l.png) left center no-repeat; }
.area_visual .ul_arrow .li_next a {margin-left:523px; background: url(../images/main/r.png) left center no-repeat; } */



.area_visual .ul_play{position:absolute; bottom:9px;  left:50%;}
.area_visual .ul_play li {float:left; }
.area_visual .ul_play li a {display:none; width:16px; padding-top:17px; background: url(../images/main/play.png) left top no-repeat; font-size:0;}
.area_visual .ul_play li.on a {display:block;}
.area_visual .ul_play li.li_start a {background: url(../images/main/play.png) left center no-repeat;}
.area_visual .ul_play li.li_stop a {background: url(../images/main/pash.png) left center no-repeat;}

.area_visual .ul_pos {position:absolute; bottom:-22px; left:50%;}
.ul_pos li { display:block; float:left;  }
.ul_pos li a,
.ul_pos li span {display:block; width:12px; height:12px; float:left; margin:0 1px 10px 1px; border-radius:6px; background:#FFF;  text-indent:-9999px;}
.ul_pos li.on a,
.ul_pos li.on span { background:#2A76CA;}





/*slide*/
#slide { background-color:#000;
	display:none;
	width:100%;
	height:900px;
	margin:0;
	padding:0;
	position:relative;
	z-index:1; :
}
#slide.loading{
	background:url(../img/loader.gif) no-repeat 50% 50%;
}
#slide.loading,
#slide.available{
	display:block;
}
#slide ul{
	margin:0 auto;
	padding:0;
	width:100%;
	height:900px;
	list-style:none;
	position:relative;
	z-index:1;
}
#slide li{
	width:100%;
	height:100%;
	display:none;
	margin:0;
	padding:150px 0 0 0;
	position:absolute;
	top:0;
	left:0;
	text-align:center;
	opacity:0;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-transition: opacity 1s;
	transition: opacity 1s;
}
:root #slide li{
	display:block;
}
#slide li.active{
	opacity:1;
	display:block;
	z-index:1;
	-webkit-transition: opacity 2s;
	transition: opacity 2s;
}
#slide li:after{
	content:"";
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:2;
}
#slide li.active:after{
	cursor:pointer;
}
#slide li a{
	position:relative;
	display:block;
	height:0;
	width:100%;
	padding:700px 0 0 0;
	max-width:1200px;
	margin:0 auto;
	overflow:hidden;
}
#slide li a:before,
#slide li a:after{
	content:"";
	display:block;
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-position:0 0;
	position:absolute;
	z-index:1;
}
#slide li a:before{
	z-index:2;
}
#slide li.active a:before{
	-webkit-animation: taglineText 2s;
	animation: taglineText 2s;
}

@-webkit-keyframes taglineText{
	0% {
		-webkit-transform: translateY(10%);
	}
	100% {
		-webkit-transform: translateY(0px);
	}
}
@keyframes taglineText{
	0% {
		transform: translateY(10%);
	}
	100% {
		transform: translateY(0px);
	}
}
#slide-01.loaded{
	background:url(../img/index01.jpg) no-repeat 50% 0;
}

#slide-01.loaded a:before{
	height:380px ;
	width:510px;
	top:20%;
	left:0;
	background-image:url(../img/text3.png);
	background-position:left top;
}

/*#slide-01.loaded a:after{
	top:0;
	left:0;
	width:695px;
	height:689px;
	background-image:url(../img/ .png);
	background-position:right top;
	background-size:auto 100%;
}*/
#slide-02.loaded{
	background:url(../img/index02.jpg) no-repeat 50% 0;
}
#slide-02.loaded a:before{
	height:380px ;
	width:510px;
	top:20%;
	right:0;
	background-image:url(../img/text3.png);
	background-position:right top;
}
/*html:root #slide-02.loaded a:before{
	background-image:url(../img/slide2text.png), url(../img/slide2text_2.png);
	background-position:right top, right bottom;
	background-size:100% auto;
}
#slide-02.loaded a:after{
	bottom:0;
	left:0;
	width:688px;
	height:662px;
	background-image:url(../img/.png);
	background-position:left top;
	background-size:auto 100%;
}
*/
#slide-03.loaded{
	background:url(../img/index03.jpg) no-repeat 50% 0;
}
#slide-03.loaded a:before{
	height:380px ;
	width:510px;
	top:20%;
	left:0;
	background-image:url(../img/text3.png);
	background-position:left top;
}
/*html:root #slide-03.loaded a:before{
	background-image:url(../img/slide3text.png), url(../img/slide3text_2.png);
	background-position:left top, left bottom;
	background-size:100% auto;
}
#slide-03.loaded a:after{
	bottom:0;
	right:0;
	width:468px;
	height:656px;
	background-image:url(../img/.png);
	background-position:right top;
	background-size:auto 100%;
}*/

@media(min-width: 1600px) {
	#slide{
		height:900px;
	}
	#slide li{
		background-size:100% auto !important;
	}
	#slide.loading + #collections,
	#slide.available + #collections{
		margin-top:-210px !important;
	}
}
@media(max-width: 1200px) {
	#slide{
		height:900px;
	}
	#slide li{
		background-size:auto 100% !important;
	}
	#slide #slide-01 a:before,
	#slide #slide-03 a:before{
		left:10px;
	}
	#slide #slide-02 a:before{
		right:10px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		top:15%;
	}
	#slide #slide-01 a:after,
	#slide #slide-02 a:after,
	#slide #slide-03 a:after{
		height:100%;
		width:100%;
	}
}
@media(max-width: 1100px) {
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		top:10%;
	}
}
@media(max-width: 1000px) {
	#slide{
		height:800px;
	}
	#slide li a{
		padding-top:600px;
	}

}
@media(max-width: 900px) {
	#slide{
		height:750px;
	}
	#slide li a{
		padding-top:550px;
	}
}
@media(max-width: 850px) {
	#slideControler{
		display:block;
	}
	#slide{
		height:700px;
	}
	#slide li{
		padding-top:125px;
	}
	#slide li a{
		padding-top:575px;
	}
	html:root #slide-01.loaded a:before{
		background-image:url(../img/slide1text_smt.png);
		background-position:left top;
		background-size:auto 100%;
		margin-left:10%;
	}
	html:root #slide-02.loaded a:before{
		background-image:url(../img/slide2text_smt.png);
		background-position:right top;
		background-size:auto 100%;
		margin-right:7.5%;
	}
	html:root #slide-03.loaded a:before{
		background-image:url(../img/slide3text_smt.png);
		background-position:left top;
		background-size:auto 100%;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		top:auto;
		bottom:40%;
		height:190px;
	}

	#slide.loading + #collections,
	#slide.available + #collections{
		margin-top:35px !important;
	}
}
@media(max-width: 800px) {
	#slide{
		height:650px;
	}
	#slide li a{
		padding-top:525px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:180px;
	}
}
@media(max-width: 750px) {
	#slide{
		height:600px;
	}
	#slide li a{
		padding-top:475px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:170px;
	}
}
@media(max-width: 700px) {
	#slide{
		height:550px;
	}
	#slide li a{
		padding-top:425px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:160px;
	}
}
@media(max-width: 640px) {
	#slide{
		height:500px;
	}
	#slide li{
		padding-top:100px;
	}
	#slide li a{
		padding-top:400px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:145px;
	}
}
@media(max-width: 600px) {
	#slide{
		height:475px;
	}
	#slide li a{
		padding-top:375px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:135px;
	}
}
@media(max-width: 550px) {
	#slide{
		height:450px;
	}
	#slide li a{
		padding-top:350px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:125px;
	}
}
@media(max-width: 500px) {
	#slide{
		height:400px;
	}
	#slide li a{
		padding-top:300px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:115px;
	}
}
@media(max-width: 450px) {
	#slide{
		height:350px;
	}
	#slide li{
		padding-top:75px;
	}
	#slide li a{
		padding-top:275px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:105px;
	}
}
@media(max-width: 400px) {
	#slide{
		height:325px;
	}
	#slide li a{
		padding-top:250px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:95px;
	}
}
@media(max-width: 360px) {
	#slide{
		height:300px;
	}
	#slide li a{
		padding-top:225px;
	}
	#slide #slide-01 a:before,
	#slide #slide-02 a:before,
	#slide #slide-03 a:before{
		height:85px;
	}
}