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

/*css reset*/
html,body,ul,li,ol,dl,dd,dt,p,h1,h2,h3,h4,h5,h6,form,fieldset,legend,img,input{margin:0;padding:0;}
body{font-size:14px;font-family: '微软雅黑';}
ul,ol,li{list-style:none;}
b,strong{font-weight:normal;}
i,em{font-style:normal;}
a,u{text-decoration: none;}
h1,h2,h3,h4,h5,h6{font-size:16px;font-weight:normal;}
input{outline:none;}
img{display:block; border:0;}
.clearfix:after{content:"";clear:both;display:block;height:0;overflow:hidden;visibility: hidden;}/*清除浮动*/

.sectiondiv{ min-width: 320px;  width: 100%; }
.white_container{ width:100%; background-color:white; }
.gray_container{ background:#f2f2f2; width: 100%;}
.main_container{ max-width:1190px; margin: 0 auto;}
.top30{margin-top:3%;}
.top60{margin-top:8%;}
.paddingtop48{ padding-top:2.5%}
.nomargin{ margin:0!important;}
.aligncenter{ text-align:center;}

.main_title{ padding-left: 0;border-bottom: 1px solid #3a5b92; padding-top: 3%;}
.main_title span{ font-size:24px; display: inline-block;color:white;font-weight: bold; background-color: #3a5b92;padding:5px 24px; position: relative;}
.main_title span:before{ content:""; position:absolute; right:-36px; top:0; border-top:21px solid transparent; border-right:18px solid transparent; border-bottom: 21px solid #3a5b92; border-left:18px solid #3a5b92; }



/*banner*/
.banner_container{ position:relative;}
.logo_content{ position:absolute; z-index: 10;top: 0;left: 16%;}
.device {width: 100%;margin: 0 auto;position: relative;}
.arrow-left{background: url(../../images/wlml/arrows.png) no-repeat left top;position: absolute;left: 10px;top: 50%;margin-top: -15px;width: 17px;height: 30px;z-index: 99}
.arrow-right{background: url(../../images/wlml/arrows.png) no-repeat left bottom;position: absolute;right: 10px;top: 50%;margin-top: -15px;width: 17px;height: 30px;z-index: 99}
.pagination{position: absolute;left: 0;text-align: center;bottom:5px;width: 100%;z-index: 888}
.swiper-container {width: 100%;}
.swiper-slide{ position:relative;}
.swiper-pagination-switch {display: inline-block;width: 10px;height: 10px;border-radius: 10px;background: #999;box-shadow: 0px 1px 2px #555 inset;margin: 0 3px;cursor: pointer;}
.swiper-active-switch {background: #fff;}
.banner_container .swiper-slide img{ display:block;}
.banner_container .swiper-slide .bgimg{min-height: 300px;}

.banner_text{ position: absolute;top:0; left: 16%;  margin-top: 6%; width: 70%;}
.banner_text .banner_p01{ font-size:36px;color:white; font-weight: bold; text-shadow: 2px 2px 10px #101010;}
.banner_text .banner_p01 span{ color:#f9f501; font-size: 46px; margin-left:20px;}
.banner_mainimg{position: absolute;top:16px; left: 52%; width: 28.645%;}

.banner_text2{ position: absolute;top:0; left: 16%;  margin-top: 6%; width: 70%;z-index: 999;}
.banner_text2 .banner_p02{ font-size:38px;color:white; font-weight: bold; text-shadow: 2px 2px 10px #101010;}
.banner_text2 .banner_p02 span{ color:#f9f501; font-size: 46px; margin-left:20px;}
.banner_mainimg2{position: absolute;top:30px; left: 52%; width: 32.2%;z-index:998;}

/*介绍*/
.introduce_container{ padding:34px; background-color: #e7e7e7;}
.introduce_container p{font-size:18px; color:#333333; font-weight: bold; text-indent: 2em; line-height: 30px;}
.introduce_container span{font-size:18px; color:#333333; display: block;text-indent: 2em; line-height: 30px;}

/*目录本展示*/
.booklist_container{}
.booklist_container li{float:left; padding:1.18%; background-color: white;box-shadow: 0px 1px 2px #555; margin-top: 20px; margin-right: 2.521%; width: 20.588%}
.booklist_container li.marginLi{margin-right: 0;}
.booklist_container li:hover a .books:before{content: "";position:absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: black; opacity: 0.4;}
.booklist_container li .books{ position: relative;}
.booklist_container li .books img{width:100%;}
.booklist_container li .booksdesc{ text-align: center;}
.booklist_container li .booksdesc p{ color: #333333; font-size:16px; line-height: 24px; padding-top: 12px;}
.booklist_container li .booksdesc p span{ color:#ff7200; font-weight: bold;}

/*联系方式*/
.contact_container{ padding:34px; background-color: #fff;position: relative }
.contact_container .tel_icon{ width:6.2184%; float:left;}
.contact_container .wx_code{ width: 180px;position: absolute;top: 20px;right: 20px;}
.contact_container .contact_msg{ float:left;width: 90%; margin-left:2%}
.contact_container .contact_msg p{ font-size:24px; line-height: 48px; color:#333; font-weight: bold;}
.contact_container .contact_msg span{font-size:20px; line-height: 48px; color:#333; display: block;}

/*底部*/
.bottom_container{ background-color: #3b3b3b; padding-bottom: 30px;}
.bottom_container .bottom_nav{ display: table; margin: auto; padding:20px 0;}
.bottom_container .bottom_nav li{float:left; padding:0 10px; border-right:1px solid #dedede;}
.bottom_container .bottom_nav li a{ color:#dedede; font-size:14px;}
.bottom_container .bottom_txt{ text-align: center;}
.bottom_container .bottom_txt span{ color:#dedede; display: block; line-height: 30px;font-size:14px;}
.bottom_container .bottom_txt span a{color:#dedede;}


@media screen and (min-width:1000px){

}
@media screen and (max-width:1780px){
	.logo_content{ left:10%;}
	.banner_text{left:10%;}
	.banner_mainimg{left:60%}
}

@media screen and (max-width:1320px){
	.banner_text .banner_p01{ font-size:30px;}
	.banner_text .banner_p01 span{font-size:42px;}

	.banner_text2{left:16%}
	.banner_mainimg2{top:54px;}
}

@media screen and (max-width:1170px){
	.banner_container .swiper-slide .bgimg{ max-height:300px; width: auto; }
	.device{max-height:300px;}
	.swiper-container{max-height:300px;}
	.logo_content{ left:5%;}
	.banner_text{left:5%; top:10%}
	.banner_mainimg{left:64%;top:10%}

	.banner_text2{left:9%;top:26px;}
	.banner_mainimg2{top:80px;}


}
@media screen and (max-width:1000px){
	.banner_container .swiper-slide .bgimg{ max-height:280px; width: auto; }
	.device{max-height:280px;}
	.swiper-container{max-height:280px;}
	.banner_text .banner_p01{ font-size:24px;}
	.banner_text .banner_p01 span{font-size:34px;}
    .logo_content{ left:5%;}
	.banner_text{left:5%; top:24%}
	.banner_mainimg{left:70%;top:32%}

	.banner_text2{left:5%;top:54px;}
	.banner_mainimg2{top:94px; left: 59%;}
	.banner_text2 .banner_p02{ font-size:30px;}
    .banner_text2 .banner_p02 span{ font-size: 36px;}

	.booklist_container li .booksdesc p{ font-size:14px;}

}
@media screen and (max-width:900px){
	.contact_container .wx_code{width: 160px;}
}
@media screen and (max-width:700px){
    .banner_container .swiper-slide .bgimg{ max-height:350px; width: auto; }
	.device{max-height:350px;}
	.swiper-container{max-height:350px;}
	.banner_text{width:80%}
	.banner_text .banner_p01{ font-size:25px;}
	.banner_text .banner_p01 span{font-size:30px; margin-left: 10px;}
    .logo_content{ left:5%;}
	.banner_text{left:10%; top:9%}
	.banner_mainimg{left:30%;top:50%;width: 38%;}
	.banner_text2{left:5%;top:42px; width: 90%;text-align: center;}
	.banner_mainimg2{top:180px; left: 30%; width: 45%;}
	.banner_text2 .banner_p02{ font-size:26px;}
    .banner_text2 .banner_p02 span{ font-size: 30px;}

	.main_title span{ font-size:16px; padding:5px 20px;}
	.main_title span:before{border-top:16px solid transparent;border-bottom: 16px solid #3a5b92;}

	.introduce_container{ padding:20px; }
	.introduce_container p{font-size:16px; }
	.introduce_container span{font-size:16px;}

	.booklist_container li{ float:none; width: 84%; margin:20px auto; padding:4%;}
	.booklist_container li.marginLi{margin-right: 4%;}

	.contact_container{ padding:20px;}
	.contact_container .contact_msg p{font-size:16px; line-height: 26px;}
	.contact_container .contact_msg span{ font-size:14px; line-height: 26px;}
	.contact_container .wx_code{width: 100px;top:10px}
}

@media screen and (min-width:401px) and (max-width:500px){
	.banner_text .banner_p01{ font-size:20px;}
	.banner_text .banner_p01 span{font-size:24px; margin-left: 10px;}
    .logo_content{ left:5%;}
	.banner_text{width:90%;left:10%; top:13%}
	.banner_mainimg{left:22%;top:48%;width: 53%;}

	.banner_text2{top:55px; }
	.banner_mainimg2{top:178px; left: 16%; width: 62%;}
	.banner_text2 .banner_p02{ font-size:24px;}
    .banner_text2 .banner_p02 span{ font-size: 28px;}
	.contact_container .wx_code{width:100%;position:relative;margin-left: 30px;}
}
@media screen and (min-width:320px) and (max-width:400px){
	.banner_text .banner_p01{ font-size:20px;}
	.banner_text .banner_p01 span{font-size:22px; margin-left: 10px;}
    .logo_content{ left:5%;}
	.banner_text{left:10%; top:13%}
	.banner_mainimg{left:22%;top:48%;width: 53%;}

	.banner_text2{top:63px; }
	.banner_mainimg2{top:180px; left: 12%; width: 72%;}
	.banner_text2 .banner_p02{ font-size:24px;}
    .banner_text2 .banner_p02 span{ font-size: 28px;}
	.contact_container .wx_code{width:100%;position:relative;margin-left: 30px;}
}