*{ box-sizing: border-box;font-family: "寰蒋闆呴粦";}
.clear{ clear: both;}
.left{ float: left;}
.right{ float:left;}

.banner{ width: 1233px; height: 665px; margin: 0 auto; position: relative; background: url(banner.png) center center no-repeat;}
.banner a{ position: absolute; left: 2%; top: 30px;}
.daoyu{ width: 1219px; height: 274px; margin: 0 auto; background: url(daoyubg.png) center center no-repeat; margin-top: -130px; padding-top: 1px;}
.daoyu p{ font-size: 20px; text-indent: 2em; font-weight: bold; width: 1076px; margin:0 auto; margin-top: 80px; line-height: 38px;}
.daoyu p span{ float:right;}

.section1,.section2,.section3,.section4{ width:1233px; margin: 40px auto;}
.section1{ height: 375px; margin-top: 70px;}
.section1 .left{ width: 700px;height: 413px;}
.section1 .left a{ display: block;width: 700px; height: 413px;}
.section1 .left img{ width: 700px; height: 413px;}
.section1 .right{ width: 500px; margin-left: 20px;}
.section1 .right ul li{ width:500px;  background-color: #fff;  height: 92px; line-height:92px; margin-bottom: 14px; padding: 0 18px; box-shadow: 1px 1px 4px 2px #eee;}
.section1 .right ul li:hover,.section1 .right ul li.active{ box-shadow: 4px 4px 10px #ddd; background-image: url(arrow.png) left center no-repeat; color: #355E92;}
li.active a{color: #355E92;}
.section1 .right ul li a{ display: inline-block; vertical-align: middle; line-height: 25px; font-weight: bold;}
.title{ width: 100%; height: 121px;line-height: 121px; background: url(titlebg.png) center center no-repeat; font-size: 42px; font-weight: bold; text-align: center; position: relative;} 
.title a{ position: absolute; right:0; top:60px; font-size: 15px; font-weight: normal; line-height: 0; color: #999;}
.section2 ul{ width: 1200px; margin: 30px auto;}
.section2 ul li{ width: 400px; height: 150px; float: left; border-left:1px solid #ddd; border-right: 1px solid #ddd; margin-left: -1px; padding:  10px 33px;}
.section2 ul li a{ font-weight: bold; display: inline-block; height: 42px;}
.section2 ul li p{ font-size: 14px; margin-top: 20px; color: #999;}
.section3bg{ background-color: #DFEDFF; height: 573px; background-image: url(linebg2.png);}
.section3{ padding-top: 40px;}
.section3 ul{ margin-top: 40px;}
.section3 ul li{ width: 380px; height:265px; border-radius: 10px; background-color: #fff; border-top:6px solid #1677FF; float: left; margin-left: 30px; padding: 30px;}
.section3 ul li a{ font-size: 18px; display: block; font-weight: bold; height: 100px;}
.section3 ul li p{ line-height:30px; color:#999}
.section3 ul{ display: none;}
.switch{ width: 200px; margin: 0 auto; margin-top: 30px;}
.switch span{ display: inline-block; width: 33px; height: 12px; background-color: #fff; margin:0 4px;}
.switch span.active,.switch span:hover{ background-color:#0A7AFF;}
.section4 ul li{ clear: both; width: 100%; height: 270px; border: 1px solid #0A7AFF; margin-top: 30px; position:relative}
.section4 ul li:hover *{ color:#355E92;}
.section4 ul li .pic{ width: 480px; position: absolute;  top: 0;}
.section4 ul li .pic img{ width: 480px; height: 268px;}
.section4 ul li .text{ width: 753px; padding: 36px 31px; position: absolute;  top: 0;}
.section4 ul li:nth-child(odd) .pic{left: 0; }
.section4 ul li:nth-child(odd) .text{right: 0;}
.section4 ul li:nth-child(even) .pic{right: 0; }
.section4 ul li:nth-child(even) .text{left: 0;}
.text .tit{ font-size: 20px; font-weight: bold;}
.text p{ margin-top: 30px; color: #999; font-weight: bold; font-size: 16px; line-height: 25px;}
.text .more{ display: block; width: 104px; height: 40px; border: 1px solid#ddd; text-align: center; line-height: 40px; font-size: 18px; float: right; margin-top: 20px;}