.sub_top{background-image: url("../img/s04_cn01_01.jpg");height: 440px;}
.sub_top_txt p{color: #afabac;}
.sub_top .sub_top_txt h1{color: #fff;font-size: 48px;}
.sub_top br{display:none;}
.p_20{font-size: 20px;}
.p_21{font-size: 21px;}
.p_22{font-size: 22px;}
.m_img{display: none !important;}

h1,h2,p{text-align: center;}
/* .custom_p1{color:#2f90d6;font-weight: bold;font-size: 18px;margin-bottom: 20px;} */

.section_div > section{padding: 60px 55px;background-position: top center;}

.section1{background: url("../img/s04_cn01_01.gif") repeat;text-align: center;}
.section1 *{color: #fff;text-align: center;}
.section1 > h1{margin-bottom: 30px;}
.section1 > h4{color: #ffff8a;margin: 18px 0 35px 0;}
.section1 > span{position: relative;display: inline-block;width: 100%;max-width: 581px;overflow: hidden;}
.section1 > span > span{position: absolute;display: block;top: 0;height:226px;padding-top: 57px;}
.section1 > span > .span1{left:0% ;width:40.8% ;}
.section1 > span > .span2{left:54% ;width:44% ;}
.section1 > span > span h3{color: #f95b5c;}
.section1 > span > span h3,.section1 > span > span .p_22{margin-bottom: 24px;}

.section2{
	background-color:#e6e7e9;
	background-image: -webkit-linear-gradient(to bottom left,#e6e7e9,#fefaf7);
	background-image: -ms-linear-gradient(to bottom left,#e6e7e9,#fefaf7);
	background-image: -moz-linear-gradient(to bottom left,#e6e7e9,#fefaf7);
	background-image: -o-linear-gradient(to bottom left,#e6e7e9,#fefaf7);
	background-image: linear-gradient(to bottom left,#e6e7e9,#fefaf7);
	}
.section2 > *{text-align: center;}	
.section2 > .p_21{color: #8d81cb;}	
.section2 > h4{margin:18px 0 33px 0; }
.section2 > .span1{display: block;border: 1px solid #333b69;background-color: #fff;padding: 0 10px;}
.section2 > .span1 > span{margin:27px auto;display: block;width: 100%;max-width: 985px;text-align: left; }
.section2 > .span1 > span img{margin-top: 17px;}
.section2 > .span1 > span h3{display: inline-block;margin-right: 25px;}
.section2 > .span1 > span .p2{display: inline-block;}
.section2 > .span1 > span > span{display: block;float: left;}
.section2 > .span1 > span > .span1{width: 60.1%;text-align: center;}
.section2 > .span1 > span > .span2{width: 39.9%;}
.section2 > .span1 > span > .span1 .p3{padding: 5px 10px;background: #61b3db;color: #fff;display: inline-block;margin-top: 5px;border: 1px solid #3998c8;}
.section2 > .span1 > span > .span2 .p4{margin: 0 auto;max-width: 367px;padding: 5px 0;background: #ff583d;color: #fff;margin-top: 5px;border: 1px solid #c13119;}
.section2 > .img1{margin-bottom: 22px;}
.section2 > .p5{color: #2f2f2f;margin-bottom: 10px;}
.section2 > .p5 span{color:#61aedc;border-bottom: 1px solid #61aedc; }
.section2 > h3 span{color:#8f84d0;border-bottom: 1px solid #8f84d0; }
.section2 > .p6{color: #fff;max-width: 275px;background:#9d92d4;margin: 20px auto 45px auto;padding: 13px 0;border-radius:30px; position: relative;padding-left: 25px;}
.section2 > .p6:AFTER {content: "";background: url("/img/sub_common_bg.png");position: absolute;width:18px;height: 20px;background-position: 0 -1067px;
top: 50%;left: 70px; margin-top: -10px;}
.section2 > .span2{background-repeat: repeat;display: block;border: 3px solid #343c6d;}
.section2 > .span2 .p7{background:#3c3e53 ;color: #fff;max-width: 360px;padding:10px 0; margin:0 auto 35px auto; }
.section2 > .span2 .p7 .span2{color: #5e6174;margin: 0 53px 0 43px;font-weight: normal; }
.section2 > .span2 .span_choice{display: block;padding:42px 48px; }
.section2 > .span2 .span_choice li{width: 48%;border: 1px solid #cdcdcd;padding: 14px 7px 7px 7px;background: #fff;cursor: pointer;}
.section2 > .span2 .span_choice > ul > .on{background: #5862a0;}
.section2 > .span2 .span_choice > ul > .on > h4,.section2 > .span2 .span_choice > ul > .on > h3{color: #fff;}
.section2 > .span2 .span_choice .li1{margin-right: 4%;}
.section2 > .span2 .span_choice .chk_span{width: 20px;height: 20px;border: 1px solid #3e97d3;display: block;margin: 0 auto;margin-bottom: 10px;}
.section2 > .span2 .span_choice .chk_span_on{background-color:#eaff60;position: relative;}
.section2 > .span2 .span_choice .chk_span_on:AFTER{position: absolute;top: -15px;left: -6px;width: 36px;height: 32px;background-position: 0 -1086px;
content: "";background-image:url("/img/sub_common_bg.png"); }
.section2 > .span2 .span_choice li h3{margin-bottom: 13px;}
.section2 > .span2 > .span_result{display: block;height: 0;overflow: hidden;opacity:0;margin: 0 48px;}
.section2 > .span2 > .span_result img{margin: 0 auto;}
.section2 > .span2 > .on{height: auto;padding: 35px 0 45px 0;border-top:1px dashed #c5c5c5;
	overflow: visible;
	-webkit-transition-property: opacity;
	-webkit-transition-duration: 1s;opacity:1;
	transition-property: opacity;
	transition-duration: 1s;opacity:1;}
.span_result > div{position: relative;}	
.span_result > div a{position: absolute;}

.span_result1 > .pc_img .a1{width: 14.5%;height: 7%;top: 90.5%;left: 17%;}
.span_result1 > .pc_img .a2{width: 14.5%;height: 7%;top: 90.5%;left: 68.7%;}
.span_result1 > .m_img .a1{width: 49.5%;height: 80%;top: 21%;left: 0%;}
.span_result1 > .m_img .a2{width: 49.5%;height: 80%;top: 21%;left: 50.8%;}	

.span_result2 > .pc_img .a1{width: 14.5%;height: 7%;top: 90.5%;left: 5.5%;}
.span_result2 > .pc_img .a2{width: 14.5%;height: 7%;top: 90.5%;left: 30.5%;}
.span_result2 > .pc_img .a3{width: 14.5%;height: 7%;top: 90.5%;left: 55.5%;}
.span_result2 > .pc_img .a4{width: 14.5%;height: 7%;top: 90.5%;left: 80.5%;}	
.span_result2 > .m_img .a1{width: 49%;height: 43.5%;top: 12%;left: 0%;}
.span_result2 > .m_img .a2{width: 49%;height: 43.5%;top: 12%;left: 50.8%;}
.span_result2 > .m_img .a3{width: 49%;height: 43.5%;top: 56.5%;left: 0%;}
.span_result2 > .m_img .a4{width: 49%;height: 43.5%;top: 56.5%;left: 50.8%;}	

.section2 > .p51{color: #2f2f2f; margin-bottom: 10px; margin-top: 35px;}
.section2 > .span3 {background-repeat: repeat;display: block;border: 3px solid #343c6d;margin-top: 23px;padding: 35px 40px;}
.section2 > .span3 > ul{background: #fff;border: 1px solid #ccc;padding: 10px;}
.section2 > .span3 > ul .li0{width: 100%;display: none;margin:5px 0 15px 0;}
.section2 > .span3 > ul .li1{width: 70%;}
.section2 > .span3 > ul .li1 p span{color: #7669d5;}
.section2 > .span3 > ul .li2{width: 30%;}
.section2 > .span3 > ul .li2 img{margin: 0 0 0 auto;}
.section2 > .span3 > ul .li1 a{width: 138px;height: 33px;color:#3e3c52;border: 1px solid #39383d;  line-height:33px;  font-size:20px;font-weight:bold;
	-webkit-box-shadow: 2px 2px 0px 0px #000002;
    -moz-box-shadow: 2px 2px 0px 0px #000002;
    box-shadow: 2px 2px 0px 0px #000002; }

.section2 > .span3 > ul .li1 h3{margin-top: 20px;}
.section2>.span3>ul .li1 p{margin: 25px 0 15px 0;}

.h3_custom1{color:#6f64e6;}

.section3{background: top left;background-repeat:no-repeat;height: auto; }
.section3 > *{text-align: left;}
.section3 > h1{color: #fff;margin-bottom: 25px;}
.section3 > p{color: #d2c9c4;margin-bottom: 30px}
.section3 > .p3{color: #f7b897;}
.section3 > img{margin-left: 0;}



@media only screen and (max-width: 1023px) {
	.sub_top{height: 256px;background-size:cover;}
	.sub_top .sub_top_txt h1{font-size: 38px;}
	.sub_top br{display:block;}
	.section_div > section{padding: 40px 20px;}
	.section1 p br{display: block;}
	
	.section2 > .span1 > span h3{display: block;margin-bottom: 7px;}
	.section2 > .span1 > span .p2{display: block;text-align: left;}
	.section2 > .span1 > span > .span1 .p3,
	.section2 > .span1 > span > .span2 .p4{font-size: 11px;}
	.section2 > .img1{width: 150px;}
	.section2 > .span2 .span_choice{padding: 18px 8px 13px 8px;}
	.section2 > .span2 .span_choice li{width: 49%;padding: 8px 4px 4px 4px;}
	.section2 > .span2 .span_choice .li1{margin-right: 2%;}
	.section2 > .span2 .span_choice li h4{font-size: 13px;}
	.section2 > .span2 .span_choice li h3{font-size: 16px;}
	.section2 > .span2 .p7{max-width: 250px;font-size: 18px;}
	.section2 > .span2 .p7 .span2{margin: 0 23px 0 13px;}
	.section2 > .span2 > .on{padding: 18px 0 13px 0;}
	.section2 > .span2 > .span_result{margin: 0 8px;}
	
	.section2 > .span3 > ul .li0{display: block;}
	.section2 > .span3 > ul .li1 h3{display: none;}
	
	.section2>.span3{padding: 10px;}
	.section2>.span3>ul{max-width: 590px;margin: 0 auto;}
	.section2>.span3>ul .li1{width:50%;padding-right: 10px;}
	.section2>.span3>ul .li2{width:50%;}
	.section2>.span3>ul .li2 img{margin: 0 auto;}
	.section2 > .span3 > ul .li0 h3{font-size: 26px;}
}

@media only screen and (max-width: 640px) {
	.pc_img{display: none !important;}
	.m_img{display: block !important;}
	
	.section2 > .span3 > ul .li0 h3{font-size: 23px;}
	.section2>.span3>ul .li1 p{font-size: 14px;line-height: normal;}
	
}

@media only screen and (max-width: 565px) {
	.section1 > span > span{padding-top: 25px;}
	.section1 > span > span p{font-size: 10px;line-height: 15px;}
	.section1 > span > span h3, .section1 > span > span .p_22{font-size: 15px;margin-bottom: 10px;line-height: 20px;}
	
	.section2>.span3>ul .li1 p{font-size: 11px;line-height: normal;}
	.section2>.span3>ul .li1 a{width: 120px;height: 25px;font-size: 16px;line-height: 25px;}
}
@media only screen and (max-width: 470px) {
	.section2>.span3>ul .li1 p{margin: 0 0 10px 0;}
}

@media all and (min-width:1024px) and (max-width:1199px) {
	.section2>.span3{padding: 25px 20px;}
	.section2>.span3>ul .li1 p{font-size: 15px;}
	
}