body,div,dl,dt,dd,ul,li,ol,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,a { margin: 0; padding: 0; font-family: "microsoft yahei"; } body { color: #666666; margin: 0 auto; background: #fff; line-height: 1.5; } body a { text-decoration: none; font-style: normal; font-weight: normal; } body i,body em,body strong { font-style: normal; } body ol,body ul,body li { list-style: none; } body h1,body h2,body h3,body h4,body h5,body h6 { font-weight: normal; } body input,body textarea,body select { outline: none; border: none; -webkit-appearance: none; } body img { max-width: 100%; border: none; } body .clearfix { *zoom: 1; } body .clearfix:after { content: ''; display: table; clear: both; } body .list:after { content: ''; display: inline-block; width: 100%; } body .clear { clear: both; } body .wrap { width: 100%; } body .container { width: 96%; height: auto; padding: 0 2%; } body .main { width: 100%; height: auto; } body .rel { position: relative; } body .flex { display: inline-block; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } body .msg { -webkit-flex: 1; flex: 1; -moz-box-flex: 1; -ms-flex: 1; } .inner{ width: 1060px; margin: 0 auto; } .xz { transition: all 1s; } .xz:hover { transform: translateY(-15px); } .xz1 { transition: all .5s ease; box-shadow: 20px 38px 34px -26px rgba(0, 0, 0, 0.2); /* Above is shorthand for: border-top-left-radius: 255px 15px; border-top-right-radius: 15px 225px; border-bottom-right-radius: 225px 15px; border-bottom-left-radius:15px 255px; */ } .xz1:hover { box-shadow: 2px 8px 4px -6px rgba(0, 0, 0, 0.3); } html{ font-size: 100px; } .bole { font-weight: bold; } .text_center { text-align: center; display: block; } .he { display: flex; justify-content: center; align-items: center; } .box_b { display: flex; justify-content: space-between; } .line_13 { line-height: 1.3; } .li_b_w { position: relative; } .li_b_c { position: absolute; bottom: 0; left: 0; right: 0; width: 100%; text-align: center; } .li_b_c2 { position: absolute; display: block; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; text-align: center; } .box_a_c { display: flex; justify-content: space-between; align-items: stretch; } .box_a_c2 { display: flex; flex-direction: column; justify-content: space-between; } .box_a_c2 { display: flex; flex-direction: column; justify-content: space-around; } .box_m { display: block; margin: 0 auto; } .box_pc { position: absolute; top: 0; bottom: 0; margin: auto 0; } .lead .box{ border: 2px solid #d8b388 !important; } .lead .box .t { position: absolute; top: -2px; left: -2px; } .lead .box .r { top: -2px; position: absolute; right: -2px; transform: rotate(90deg); } .lead .box .b { position: absolute; right: -2px; bottom: -2px; transform: rotate(180deg); } .lead .box .l { position: absolute; bottom: -2px; left: -2px; transform: rotate(270deg); } .main_f .container .tabber{ border-left: 2px solid rgba(0,0,0,0); } .main_f .container .tabber .ac { color: #f8c300; background-color: #4f1f28; border: 2px solid #f8c300; } .main_f .container .tabber .ac img { /*display: block;*/ } .main_f .container .tabber .t{ position: absolute; top: -2px; left: -2px; } .main_f .container .tabber .r{ position: absolute; top: -2px; right: -2px;transform:rotate(90deg); } .main_f .container .tabber .b{ position: absolute; right: -2px; bottom: -2px;transform:rotate(180deg); } .main_f .container .tabber .l{ position: absolute; left: -2px; bottom: -2px;transform:rotate(270deg); } .main_f .container .tabber .ac h5 { color: #f8c300; } .main_b .box .text{ border: 3px solid #d0b699; } .main_b .box .text .t{ position: absolute; top: -3px; left: -3px; } .main_b .box .text .r{ position: absolute; top: -3px; right: -3px;transform:rotate(90deg); } .main_b .box .text .b{ position: absolute; right: -3px; bottom: -3px;transform:rotate(180deg); } .main_b .box .text .l{ position: absolute; left: -3px; bottom: -3px;transform:rotate(270deg); } .main_f .container .tabber li{ border: 2px solid #fffcf5; } .box_W { margin: 50px 0; } .header { padding: 20px 0 25px 0; box-sizing: border-box; background-color: #1c999b; } .header .inner { display: flex; justify-content: space-between; align-items: center; } .nav { background-color: #f39500; } .nav ul { display: flex; justify-content: space-between; } .nav ul li { flex: 1; height: 52px; line-height: 52px; text-align: center; } .nav ul li a { color: #ffffff; font-size: 18px; } .nav ul li:hover { background-color: white; } .nav ul li:hover a { color: #f39500; } .banner { height: 650px; display: block; background: url("/templets/ms_new/special/swcc/images/banner.png") no-repeat top center; cursor: pointer; } .banner .inner { position: relative; } .banner a { position: absolute; left: 332px; width: 237px; height: 54px; display: flex; align-items: center; justify-content: center; color: #ffffff; font-size: 20px; border-radius: 5px; font-weight: bold; top: 450px; background: #68374a; } .banner a img { margin-right: 10px; } .title { color: #ff3535; font-size: 40px; font-weight: bold; text-align: center; margin-bottom: 40px; line-height: 1; } .main_a .inner { border-bottom: 1px solid #eaeaea; } .main_a .box { display: flex; width: 950px; margin: 0 auto; justify-content: space-between; } .main_a .box .find { height: 230px; display: flex; justify-content: space-between; } .main_a .box .find .tabber { width: 62px; } .main_a .box .find .tabber span { display: block; height: 47px; color: #ffffff; font-size: 26px; line-height: 47px; background-color: #20c8c9; font-weight: bold; text-align: center; } .main_a .box .find .tabber h6 { width: 62px; height: 183px; padding-top: 10px; box-sizing: border-box; display: flex; color: #ffffff; justify-content: center; font-size: 20px; font-weight: bold; background-color: #1c999b; } .main_a .box .find .tabber h6 i { display: block; width: 20px; } .main_a .box .find img { display: none; box-sizing: border-box; border: 1px solid #ff9c00; } .main_a .box .ac { width: 425px; } .main_a .box .ac .tabber { width: 62px; } .main_a .box .ac .tabber span { display: block; height: 47px; color: #ffffff; font-size: 26px; line-height: 47px; background-color: #ffa10e; font-weight: bold; text-align: center; } .main_a .box .ac .tabber h6 { width: 62px; height: 183px; padding-top: 10px; box-sizing: border-box; display: flex; color: #ffffff; font-size: 20px; font-weight: bold; background-color: #ed8000; } .main_a .box .ac img { display: block; } .main_a .a1 { width: 480px; margin: 0 auto; margin-top: 40px; } .main_a .a1 dt { text-align: center; color: #333333; font-size: 18px; font-weight: bold; display: flex; justify-content: center; align-items: center; margin-bottom: 10px; } .main_a .a1 dt img { margin-right: 10px; } .main_a .a1 dd { height: 40px; line-height: 40px; box-sizing: border-box; } .main_a .a1 dd a { font-size: 16px; color: #666666; border-bottom: 1px dashed #d1d1d1 ; display: inline-block; } .main_a .a1 dd a font { color: #ff0000; font-size: 16px; } .main_a .a1 .ac { border: none; } .main_a .a2 { width: 570px; margin: 0 auto; overflow: hidden; display: flex; height: 55px; border-radius: 10px; border: 1px solid #ff9c00; align-items: center; margin-top: 30px ; margin-bottom: 50px ; justify-content: space-between; } .main_a .a2 h5 { color: #333333; font-size: 16px; width: 365px; text-align: center; } .main_a .a2 h6 { flex: 1; text-align: center; color: #ffffff; font-size: 20px; background-color: #f39500; font-weight: bold; line-height: 55px; } .main_b .box { display: flex; justify-content: space-between; align-items: center; width: 885px; margin: 0 auto; } .main_b .box div { position: relative; } .main_b .box div a { position: absolute; left: 0; right: 0; margin: 0 auto; bottom: 60px; display: block; width: 275px; height: 55px; line-height: 55px; text-align: center; border-radius: 5px; color: #de8800; font-size: 20px; font-weight: bold; background-color: #ffff00; } .main_c { background-color: #20b6b7; } .main_c .inner { height: 740px; padding: 40px 0 60px 0; box-sizing: border-box; background: url("/templets/ms_new/special/swcc/images/c1.jpg") no-repeat right bottom; } .main_c .title { color: white; } .main_c .c1 { margin-left: 55px; } .main_c .c1 dl dt { color: #20b6b7; font-size: 20px; margin-bottom: 10px; width: 338px; height: 57px; line-height: 57px; text-align: center; font-weight: bold; position: relative; background-color: #ffff00; } .main_c .c1 dl dt img { position: absolute; top: 0; left: -34px; } .main_c .c1 dl dd { line-height: 40px; display: flex; align-items: center; height: 40px; } .main_c .c1 dl dd img { margin-right: 5px; } .main_c .c1 dl dd h4 { border-bottom: 1px dashed #90dbdb; color: #ffffff; font-size: 16px; display: inline-block; } .main_c .c1 dl .ac { border: none; } .main_c .pic { margin-top: 70px; } .main_d { position: relative; border-bottom: 1px solid #eaeaea; } .main_d .inner { position: relative; } .main_d .pic { position: absolute; top: -50px; left: 165px; } .main_d .d1 { width: 556px; margin-left: 350px; box-sizing: border-box; } .main_d .d1 h3 { color: #ff3535; line-height: 1; font-size: 40px; font-weight: bold; } .main_d .d1 h3 a { color: #f39500; font-size: 61px; } .main_d .d1 h3 a i { font-size: 40px; } .main_d .d1 h2 { text-align: center; color: #ff3535; font-size: 18px; margin-top: 10px; } .main_d .d1 h6 { color: #666666; font-size: 16px; margin-top: 10px; } .main_d .d2 { display: flex; margin-top: 35px; justify-content: space-between; align-items: stretch; } .main_d .d2 .right { display: flex; flex-direction: column; justify-content: space-around; } .main_d .d2 .right .box { width: 550px; height: 230px; background-image: url("/templets/ms_new/special/swcc/images/d3.png"); padding: 30px 0; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; } .main_d .d2 .right .box h6 { font-size: 26px; color: white; text-align: center; line-height: 1; font-weight: bold; } .main_d .d2 .right .box h5 { color: #ffffff; font-size: 22px; font-weight: bold; text-align: center; } .main_d .d2 .right .box h5 a { color: #ffff00; font-size: 28px; font-weight: bold; } .main_d .d2 .right .box h5 i { color: white; font-size: 16px; font-weight: normal; } .main_d .d2 .right .box div h4 { width: 330px; margin: 0 auto; display: flex; align-items: center; color: #ffffff; font-size: 16px; } .main_d .d2 .right .box div h4 img { margin-right: 5px; } .main_d .d2 .right .box div h3 { width: 480px; margin: 0 auto; display: flex; align-items: center; color: #ffffff; font-size: 16px; } .main_d .d2 .right .box div h3 img { margin-right: 5px; } .main_d .d2 .right .box div h3 span { color: #ffff00; } .main_d .a2 { width: 570px; margin: 0 auto; overflow: hidden; display: flex; height: 55px; border-radius: 10px; border: 1px solid #ff9c00; align-items: center; margin-top: 30px ; margin-bottom: 50px ; justify-content: space-between; } .main_d .a2 h5 { color: #333333; font-size: 16px; width: 365px; text-align: center; } .main_d .a2 h6 { flex: 1; display: flex; justify-content: center; align-items: center; color: #ffffff; font-size: 20px; background-color: #f39500; font-weight: bold; line-height: 55px; } .main_d .a2 h6 img { margin-right: 5px; } .main_e .lead { color: #666666; font-size: 16px; width: 530px; margin: 0 auto; padding: 25px 50px; box-sizing: border-box; border-radius: 10px; border: 1px dashed #8fdadb; } .main_e .pic { margin: 30px 0; position: relative; } .main_e .pic .gif { position: absolute; left: 326px; top: 83px; width: 342px; height: 166px; } .main_e .lead1 { color: #f39500; font-size: 16px; width: 700px; margin: 0 auto; margin-bottom: 30px; padding: 25px 55px; box-sizing: border-box; border: 1px dashed #f39500; border-radius: 10px; } .main_e .box { width: 1060px; margin: 0 auto; display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap; } .main_e .box li { width: 520px; display: flex; justify-content: space-between; align-items: stretch; height: 130px; } .main_e .box li .img { width: 135px; height: 130px; display: flex; justify-content: center; align-items: center; background-color: #20b6b7; } .main_e .box li .text { flex: 1; background-color: #f0ffff; display: flex; padding: 0 20px ; box-sizing: border-box; justify-content: center; flex-direction: column; } .main_e .box li .text h3 { color: #333333; font-size: 18px; font-weight: bold; } .main_e .box li .text h6 { color: #666666; font-size: 16px; } .main_e .box li:nth-child(n+3) { margin-top: 20px; } .main_e .a2 { width: 480px; margin: 0 auto; overflow: hidden; display: flex; height: 55px; border-radius: 10px; border: 1px solid #ff9c00; align-items: center; margin-top: 30px ; margin-bottom: 50px ; justify-content: space-between; } .main_e .a2 h5 { color: #333333; font-size: 16px; width: 275px; text-align: center; } .main_e .a2 h6 { flex: 1; display: flex; justify-content: center; align-items: center; color: #ffffff; font-size: 20px; background-color: #f39500; font-weight: bold; line-height: 55px; } .main_e .a2 h6 img { margin-right: 5px; } .main_f { padding: 50px 0; background-color: #20b6b7; } .main_f .title { color: white; } .main_f .box { width: 820px; margin: 0 auto; } .main_f .box .top { display: flex; justify-content: space-between; align-items: stretch; height: 123px; } .main_f .box .top h3 { width: 50px; background-color: #ffff00; color: #1c999b; font-size: 20px; font-weight: bold; display: flex; justify-content: center; align-items: center; writing-mode: tb-rl; } .main_f .box .top div { flex: 1; border-left: 1px solid #1c999b; background-color: white; display: flex; justify-content: center; align-items: center; padding: 0 30px; box-sizing: border-box; } .main_f .box .top div h6 { color: #666666; font-size: 16px; } .main_f .box .top div h6 span { color: #ff0000; font-size: 21px; font-weight: bold; } .main_f .box .bottom { margin-top: 40px; display: flex; align-items: stretch; justify-content: space-between; } .main_f .box .bottom .pic { border: 4px solid #16a7a9; width: 400px; box-sizing: border-box; } .main_f .box .bottom .text { width: 375px; display: flex; justify-content: space-around; flex-direction: column; } .main_f .box .bottom .text h3 { color: #ffff00; font-size: 36px; font-weight: bold; } .main_f .box .bottom .text h4 { width: 135px; height: 40px; text-align: center; line-height: 40px; background-color: white; color: #00abac; font-size: 22px; font-weight: bold; } .main_f .box .bottom .text h5 { color: white; font-size: 16px; } .main_f .box .bottom .text h5 a { color: #ffff00; } .main_f .box .bottom .text .button { display: flex; } .main_f .box .bottom .text .button a { width: 160px; height: 50px; border-radius: 100px; background-color: #ffff00; text-align: center; line-height: 50px; color: #00abac; font-size: 22px; font-weight: bold; } .main_f .box .bottom .text .button a:last-child { margin-left: 20px; background-color: white; } .main_g .inner { border-bottom: 1px solid #eaeaea; padding-bottom: 50px; } .main_g .box { width: 1000px; margin: 0 auto; position: relative; } .main_g .box .swiper-container { width: 765px; padding-bottom: 45px; margin: 0 auto; } .main_g .box .swiper-container .swiper-slide i { display: block; position: relative; } .main_g .box .swiper-container .swiper-slide i h6 { position: absolute; bottom: 0; text-align: center; left: 0; width: 100%; height: 42px; line-height: 42px; color: #ffffff; background-color: rgba(0, 0, 0, 0.4); font-size: 18px; } .main_g .box .swiper-button-prev { background-image: url("/templets/ms_new/special/swcc/images/g1.png"); background-size: 78px 78px; width: 78px; height: 78px; } .main_g .box .swiper-button-next { background-image: url("/templets/ms_new/special/swcc/images/g2.png"); background-size: 78px 78px; width: 78px; height: 78px; } .main_g .box .swiper-pagination-bullet { width: 20px; opacity: 1; background-color: #c9c9c9; height: 20px; } .main_g .box .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 0; } .main_g .box .swiper-pagination-bullet-active { background-color: #20b6b7; } .main_h .box { width: 980px; margin: 0 auto; display: flex; justify-content: space-between; align-items: stretch; } .main_h .box .left { height: 600px; width: 440px; display: flex; justify-content: space-between; flex-direction: column; } .main_h .box .left .top { height: 450px; position: relative; overflow: hidden; } .main_h .box .left .top li { font-size: 16px; color: #666666; line-height: 1; margin-bottom: 25px; } .main_h .box .left .top li span { color: #ff3535; } .main_h .box .left .top li .bb { font-weight: bold; } .main_h .box .left .bottom { height: 130px; } .main_h .box .right { width: 512px; display: flex; justify-content: space-between; flex-direction: column; } .main_h .box .right .top { padding-top: 40px; box-sizing: border-box; position: relative; } .main_h .box .right .top img { position: absolute; top: 0; left: 0; } .main_h .box .right .bottom { position: relative; } .main_h .box .right .bottom .gif { position: absolute; background-color: #231815; width: 128px; height: 86px; top: 22px; overflow: hidden; } .main_h .box .right .bottom .gif img { margin-top: -7px; } .main_h .box .right .bottom .gif h6 { position: absolute; width: 100%; text-align: center; color: #ffffff; font-size: 14px; bottom: 0; left: 0; } .main_h .box .right .bottom .gif2 { left: 63px; } .main_h .box .right .bottom .gif1 { left: 196px; } .main_h .box .right .bottom .gif3 { left: 329px; } .main_h .a2 { width: 570px; margin: 0 auto; overflow: hidden; display: flex; height: 55px; border-radius: 10px; border: 1px solid #ff9c00; align-items: center; margin-top: 40px ; margin-bottom: 50px ; justify-content: space-between; } .main_h .a2 h5 { color: #333333; font-size: 16px; width: 365px; text-align: center; } .main_h .a2 h6 { flex: 1; text-align: center; color: #ffffff; font-size: 20px; background-color: #f39500; font-weight: bold; line-height: 55px; } .main_i { height: 640px; padding: 50px 0; box-sizing: border-box; background: url("/templets/ms_new/special/swcc/images/i1.jpg") no-repeat center; } .main_i .inner { width: 980px; display: flex; justify-content: space-between; align-items: center; } .main_i .inner .left { width: 515px ; } .main_i .inner .left h6 { color: #333333; font-size: 24px; margin-bottom: 20px; font-weight: bold; } .main_i .inner .left .box { height: 410px; } .main_i .inner .left .box .find h5 { color: #ffffff; font-size: 16px; height: 40px; line-height: 40px; padding-left: 20px; box-sizing: border-box; margin-bottom: 3px; background: #1c999b; } .main_i .inner .left .box .find h4 { color: #333333; font-size: 16px; margin: 12px 0 20px 0; display: none; } .main_i .inner .left .box .ac h5 { background: #f39500; } .main_i .inner .left .box .ac h4 { display: block; } .main_i .inner .right { width: 360px; height: 487px; background-color: #fdfaf9; padding: 30px 35px; box-sizing: border-box; position: relative; } .main_i .inner .right h4 { color: #ff3535; font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 25px; } .main_i .inner .right input[type=text] { width: 100%; display: block; height: 50px; margin-bottom: 10px; text-align: center; color: #666666; font-size: 16px; border: 1px solid #fbdeb0; } .main_i .inner .right textarea { width: 100%; font-family: 微软雅黑; font-size: 16px; resize: none; border: 1px solid #fbdeb0; text-align: center; border-image: initial; border-radius: 5px; padding: 15px 0; box-sizing: border-box; } .main_i .inner .right input[type=button] { display: block; margin: 20px auto; width: 190px; border-radius: 100px; background-color: #ff3535; height: 50px; border: 0; color: #ffffff; font-size: 20px; font-weight: bold; } .main_i .inner .right h5 { position: absolute; bottom: 0; left: 0; color: #ffffff; font-size: 14px; text-align: center; line-height: 43px; height: 43px; background-color: #1c999b; width: 360px; } .main_j { margin-bottom: 90px; } .main_j .title { margin-bottom: 10px; } .main_j .inner { width: 1060px; margin: 0 auto; position: relative; } .main_j .inner .pic { position: absolute; bottom: -90px; left: 0; } .main_j h6 { text-align: center; font-size: 12px; color: #ff3535; line-height: 1; } .main_j ul { display: flex; justify-content: space-between; } .main_j ul li { width: 256px; } .main_j ul li img { margin: 40px 0 10px 0; } .main_j ul li h5 { text-align: center; color: #666666; font-size: 16px; } footer { padding: 53px 0 65px 0; background-color: #1c999b; } footer .inner { width: 980px; margin: 0 auto; } footer .top { display: flex; justify-content: space-between; align-items: stretch; padding-bottom: 40px; border-bottom: 1px solid #56dfe1; } footer .top .left { width: 380px; display: block; } footer .top .left h6 { text-align: center; color: #ffffff; font-size: 16px; margin-top: 20px; } footer .top .right { display: flex; justify-content: space-between; flex-direction: column; } footer .top .right .h44 { color: #ffffff; font-size: 26px; } footer .top .right h5 { color: #ffffff; font-size: 16px; } footer .top .right .xz { color: #1c999b; font-size: 20px; font-weight: bold; margin-top: 20px; background-color: #ffff00; border-radius: 5px; width: 350px; height: 60px; display: flex; justify-content: center; align-items: center; } footer .top .right .xz img { margin-right: 10px; } footer .bottom { margin-top: 40px; } footer .bottom ul { display: flex; margin-bottom: 20px; justify-content: center; align-items: center; } footer .bottom ul li { width: 90px; border-right: 2px solid white; text-align: center; } footer .bottom ul li a { color: #ffffff; font-size: 18px; } footer .bottom ul li:last-child { border-right: 0; } footer .bottom h6 { color: #ffffff; text-align: center ; font-size: 16px; } footer .bottom h6 a { color: #ffff00; }