@charset "utf-8";

/* CSS 鼠标效果 */

@import url('xiaoguo.css');



@import url('https://fonts.googleapis.com/css?family=Noto+Sans+SC:300,400,500,700,900');

* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding: 0; margin: 0;}

body{ font-size: 16px; color: #666; overflow-x: hidden; font-family:'Noto Sans SC',"PingFang SC",Arial,"Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif !important;font-weight: 300;}

ul,li,ol,dl,dt,dd,p,h1,h2,h3,h4,h5,h6,header,footer{ list-style: none; padding: 0; margin: 0; display: block;}

input,textarea,select,button{ outline:none; font-family:'Noto Sans SC',"microsoft yahei",Helvetica,Arial,Verdana,sans-serif; }

::-webkit-input-placeholder {color: #aaa;}

::-moz-placeholder {color: #aaa;}

:-ms-input-placeholder {color: #aaa;}

input::-webkit-outer-spin-button,

input::-webkit-inner-spin-button {

-webkit-appearance: none;

}

input[ type= "number" ] {

    -moz-appearance: textfield;

}



a { text-decoration: none; color:#000; transition: color 0.56s ease;}

a:hover{ color: #6baf28;}



.clearfix:after{content:"";height:0;line-height:0;display:block;visibility:hidden;clear:both}

.clearfix{zoom:1;}

.clear{ clear:both}

.overflow{overflow-y:hidden;}



.fl{float: left;}

.fr{float: right;}





img{ display: inline-block; vertical-align:middle;max-width:100%;max-height:100%;height: auto; border: none;}



.wrap{ width: 1520px; margin: 0 auto;}

.w1200{ width: 1200px; margin: 0 auto;}

.ovh{overflow: hidden;}

.pos_r{ position: relative;}





/*顶部*/

.header{ width: 100%; height:80px; background:#fff; box-shadow: 0 0 10px rgba(0,0,0,.08); position: fixed; left: 0; top: 0; z-index: 99999;  transition: all .4s;}

.header .logo{ position: fixed; left: 0; top: 0;}

.header .nav{ float: right; padding-top: 16px;}

.header .nav ul li{ float: left; margin-left: 40px; position: relative;}

.header .nav>ul>li>a{ color: #000; font-size: 18px; font-weight: normal;  border-radius: 8px; padding: 0 15px; line-height: 50px; display: block;  transition: all .4s; }

.header .nav>ul>li>a:hover,.header .nav>ul>li.on a{ color: #fff; background: #9dc757; }

.header .menu-toggle{display: none;}



/*首页bannner*/

.banner { position: relative; width: 100%; margin-top: 80px;}

.banner .swiper-container{ width:100%; overflow:hidden;}

.banner .swiper-container .swiper-slide img{width:100%;}

.banner .pagination { position: absolute;z-index: 20; left: 50%; bottom:30px; transform: translate(-50%, 0);}

.banner .swiper-pagination-switch {display: inline-block; width:13px; height: 13px; background:#fff; margin:0 7px; border-radius: 20px;  cursor: pointer; position: relative;}

.banner .swiper-active-switch {background: #9dc757; opacity: 1;}



.neiBanner{ position: relative; margin-top: 80px;}

.neiBanner img{ width: 100%; }





.title{ text-align: center; margin-bottom: 45px; padding-top: 30px; background: url(../images/titleBg.png) no-repeat center top;}

.title h2{ font-size: 48px; font-weight: 300; color: #6baf28; line-height:1; padding-bottom: 18px; display: inline-block; position: relative;}

.title h2::before{ content: ""; width: 19px; height: 30px; background: url(../images/icon01.png) no-repeat center; position: absolute; left: 0%; bottom: 10px; margin-left: -30px;}

.title h2::after{ content: ""; width: 46px; height: 63px; background: url(../images/icon02.png) no-repeat center; position: absolute; right: 0%; bottom: 25px; margin-right: -55px;}

.title p{ font-size: 18px; color: #333; font-weight: 300; line-height: 1;}



.iabout{ padding: 100px 0 300px; background: url(../images/aboutBg.jpg) no-repeat center; background-size: cover;}

.iabout .box{ padding-top: 40px;}

.iabout .box ul{ margin: 0 -46px;}

.iabout .box ul li{ width: 25%; padding: 0 46px; float: left;}

.iabout .box ul li a{ display: block; position: relative;}

.iabout .box ul li a::after{ content: ""; width: 100%; height: 100%; background: url(../images/iaboutBg.png) no-repeat right bottom; padding: 18px; box-sizing: content-box; position: absolute; left:50%; top: 50%;  transform: translate(-50%, -50%);}

.iabout .box ul li ol{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 11;}

.iabout .box ul li ol dl{ height: 222px; display: inline-block; position: relative; left: 50%; top: 50%; transform: translate(-50%, -50%);}

.iabout .box ul li ol h3{ float: right; font-size: 20px; color: #fff; font-weight: normal; line-height: 1.8; writing-mode:vertical-rl; border-left: 1px solid #fff; border-right: 1px solid #fff; margin-left: 9px; margin-top: 70px;  transition: all .4s;}

.iabout .box ul li ol dt{ float: left; width: 0; color: #fff; writing-mode:vertical-rl; text-align: center; overflow: hidden; transition: all .4s;}

.iabout .box ul li img{ width: 100%;  border-radius: 50%; overflow: hidden;}

.iabout .box ul li a:hover ol dt{ width:auto;}



.offlineActivities{ margin-top: -160px;}

.offlineActivities .box ul li a{ display: block; position: relative; overflow: hidden;}

.offlineActivities .box ul li{ width: 25%; float: left;}

.offlineActivities .box ul li:nth-child(6){ width: 50%;}

.offlineActivities .box ul li h3{ padding: 18px;  color: #fff; font-weight: normal; letter-spacing:2px; writing-mode:vertical-rl;  background: #9dc757; position: absolute; right: 28px; top: 28px; z-index: 11;}

.offlineActivities .box ul li h3::after{ content: ""; width: calc(100% - 12px); height: calc(100% - 12px); border: #fff solid 1px;  position: absolute; top: 5px; left: 5px;}



.introduction{ padding: 80px 0 180px; background: url(../images/introductionBg.jpg) no-repeat center;}

.introduction .box{ height: 850px; display: inline-block;}

.introduction .box h3{ float: right; color: #9dc757; font-size: 20px; line-height: 1.8; font-weight: normal; letter-spacing:1px; padding: 3px 0;  writing-mode:vertical-rl; border-left: 1px solid #9dc757; border-right: 1px solid #9dc757; }

.introduction .box dt{ color: #000; font-weight: normal; letter-spacing:1px; line-height:1.8; writing-mode:vertical-rl; padding: 0 20px; background: rgba(255,255,255,0.67);}



.popularActivities{ padding: 80px 0 100px; background: url(../images/popularActivitiesBg.jpg) no-repeat center; background-size:cover;}

.popularActivities .view{ width: 1174px; float: left;}

.popularActivities .view .swiper-slide a{ border-radius: 20px; overflow: hidden; display: block; position: relative;}

.popularActivities .view .swiper-slide ol{ width: 100%; padding: 20px; color: #fff; background: rgba(0,0,0,0.6); position: absolute; left: 0; bottom: 0;}

.popularActivities .view .swiper-slide ol dl{ overflow: hidden; margin-bottom: 15px;}

.popularActivities .view .swiper-slide ol dl i{ background: #6baf28; font-style:normal; font-weight: normal; line-height: 26px; padding: 0 10px; margin-right: 10px; float: left;}

.popularActivities .view .swiper-slide ol dl h3{ float: left;}

.popularActivities .view .swiper-slide ol dl span{ float: right;}

.popularActivities .preview{ width: 326px; height: 726px; padding: 55px 0; float: right; position: relative;}

.popularActivities .preview .swiper-container{ height: 620px; overflow: hidden;}

.popularActivities .preview .swiper-container .swiper-slide{  box-sizing: border-box;}

.popularActivities .preview .swiper-container .swiper-slide dl{ border-radius: 10px; overflow: hidden; position: relative; cursor: pointer;}

.popularActivities .preview .swiper-container .swiper-slide p{ width: 100%; height: 40px; padding: 0 10px; color: #fff; text-align: center; line-height: 40px; background: rgba(0, 0, 0, .7); position: absolute; left: 0; bottom: 0; z-index: 11;}

.popularActivities .preview .swiper-container .swiper-slide.active-nav p{ background: #6baf28;}

.popularActivities .preview .arrow-left{ width: 64px; height: 26px; background: url(../images/arrow_top.png) no-repeat center; position: absolute; left: 50%; top: 10px; margin-left: -32px; z-index: 11;}

.popularActivities .preview .arrow-left:hover{background: url(../images/arrow_top02.png) no-repeat center;}

.popularActivities .preview .arrow-right{ width: 64px; height: 26px; background: url(../images/arrow_bottom.png) no-repeat center;  position: absolute; left: 50%; bottom:10px; margin-left: -32px; z-index: 11;}

.popularActivities .preview .arrow-right:hover{background: url(../images/arrow_bottom02.png) no-repeat center;}



.yuding{ padding: 88px 0 210px; position: relative; z-index: 11;}

.message{ width: 50%; height: 590px; padding:50px 33px; background: url(../images/messageBg.png) no-repeat center top; float: left;}

.message dl{ text-align: center; font-size: 24px; color: #fff; font-weight: normal; line-height: 1; margin-bottom: 40px;}

.message ul{ margin: 0 -18px;}

.message ul li{ width: 50%; padding: 0 18px; margin-bottom: 15px; float: left;}

.message ul ol{ width: 100%; padding: 0 18px; }

.message input{ width: 100%; height: 44px; font-size: 16px; background: #fff; border: none; border-radius: 5px; padding: 0 10px;}

.message textarea{ width: 100%; height: 196px; font-size: 16px; background: #fff; border: none; border-radius: 5px; padding: 10px; margin-bottom: 30px;}

.message button{ width: 126px; height: 46px; color: #6baf28; font-size: 18px; background: #fff; border-radius: 46px; border: none; margin:0 auto; display: block; cursor: pointer;}

.message button:hover{ background: #6baf28; color: #fff; box-shadow: 0 5px 5px rgba(0,0,0,.3);}

.map{ width: 50%; height:572px; font-size: 14px; float: left; }



.about{ padding: 30px 0 240px; position: relative; z-index: 11;}

.about .aboutNav{ text-align: center; margin-bottom: 50px;}

.about .aboutNav li{ background: #9dc757; display: inline-block; margin: 0 15px; position: relative;}

.about .aboutNav li a{ color: #fff; font-size: 20px; padding: 15px 30px; position: relative; z-index: 11; display: block;}

.about .aboutNav li:hover,.about .aboutNav li.on{ background: #7da53c;}

.about .aboutNav li::after{ content: ""; width: calc(100% - 12px); height: calc(100% - 12px); border: #fff solid 1px;  position: absolute; top: 5px; left: 5px;}

.about .text{ color: #000; font-size: 18px; line-height: 1.8;}

.about .slideBox{ padding-top: 20px;}

.about .slideBox .view{ margin-bottom: 15px;}

.about .slideBox .preview{ padding: 0 15px; position: relative;}

.about .slideBox .preview .swiper-slide{ padding: 0 7px; box-sizing: border-box; cursor: pointer;}

.about .slideBox .preview .swiper-slide.active-nav dl{ border:#7da53c solid 2px;}

.about .slideBox .preview .arrow-left,.about .slideBox .preview .arrow-right{ width: 12px; height: 20px; position: absolute; top: 50%; margin-top: -10px;}

.about .slideBox .preview .arrow-left{ background: url(../images/arrow-left.png) no-repeat center; left: 0;}

.about .slideBox .preview .arrow-right{ background: url(../images/arrow-right.png) no-repeat center; right:0;}



.offline{ padding: 30px 0;}

.offline ul{ overflow: hidden;}

.offline ul li{ width: 33.3333%; padding: 0 5px; margin-bottom: 10px; float: left;}

.offline ul li a{ position: relative; border-radius: 20px; overflow: hidden; display: block;}

.offline ul li a h3{ width: 136px; height: 50px; line-height: 50px; background: #fff; text-align: center; font-size: 20px; color: #6baf28; font-weight: normal; position: absolute; left: 50%; bottom: 22px; margin-left: -68px;}

.offline ul li a h3::after{ content: ""; width: calc(100% - 12px); height: calc(100% - 12px); border: #6baf28 solid 1px;  position: absolute; top: 5px; left: 5px;}



.hotTop{ background: #f1f1f1; padding: 30px 0;}

.hotTop dl{ width: 50%; float: left;}

.hotTop ol{ width: 50%; padding-left: 50px; float: left;}

.hotTop ol li{ margin-bottom: 30px; border-bottom: #6baf28 solid 1px; padding-bottom: 10px;}

.hotTop ol li h3{ font-size: 24px; color: #6baf28; font-weight: normal; line-height: 1; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; margin-bottom: 15px;}

.hotTop ol li dd{ font-weight: normal; color: #000;}

.hotTop ol li dd span{ display: inline-block; background: #6baf28; color: #fff; padding:2px 10px; margin-right: 10px;}

.hotTop ol li dd span.end{ background: #b8b8b8;}

.hotTop ol .text{ color: #999; font-weight: normal; line-height: 1.8;}

.hotTop ol .text .more{ color: #f20005;}



.hotList{ padding: 36px 0 230px;}

.hotList ul{ margin: 0 -60px; padding-bottom: 30px;}

.hotList ul li{ width: 50%; padding: 0 60px; margin-bottom: 30px; float: left;}

.hotList ul li a{display: block;}

.hotList ul li a:hover{ box-shadow: 0 0 10px rgba(0,0,0,.3);}

.hotList ul li dl{ padding-bottom: 61.925%; position: relative; overflow: hidden;}

.hotList ul li dl img{position:absolute;top:0; bottom:0;left:0;right:0; width:100%; height: 100%; margin:auto;}

.hotList ul li ol{ height: 105px; padding: 20px 24px; background: #f2f2f2;}

.hotList ul li ol h3{ font-size: 20px; font-weight: 500; color: #000; line-height: 1; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; margin-bottom: 12px;}

.hotList ul li ol dt{ font-weight: normal; color: #000;}

.hotList ul li ol span{ display: inline-block; background: #6baf28; color: #fff; padding:2px 10px; margin-right: 10px;}

.hotList ul li ol span.end{ background: #b8b8b8;}



.hot_view{ padding: 50px 0 230px; position: relative; z-index: 11;}

.hot_view .hotHead{ text-align: center; margin-bottom: 30px; border-bottom: #6baf28 solid 1px; padding-bottom: 10px;}

.hot_view .hotHead h3{ font-size: 24px; color: #6baf28; font-weight: normal; line-height: 1; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; margin-bottom: 15px;}

.hot_view .hotHead dd{ font-weight: normal; color: #000;}

.hot_view .hotHead dd span{ display: inline-block; background: #6baf28; color: #fff; padding:2px 10px; margin-right: 10px;}

.hot_view .hotHead dd span.end{ background: #b8b8b8;}

.hot_view .text{ color: #999; font-weight: normal; line-height: 1.8;}

.hot_view .page{ padding-top: 50px; font-size: 18px; font-weight: normal;}

.hot_view .page li{ margin-bottom: 10px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}



.traffic{ padding: 30px 0 240px; position: relative; z-index: 11;}

.traffic .box{ overflow: hidden; padding-top: 40px;}

.traffic .box ul{ width: 50%; padding-right: 20px; float: left;}

.traffic .box .text{ color: #000; font-size: 18px; font-weight: normal; line-height: 1.8; padding-top: 20px; }

.mapBox{ width: 100%; height:520px; font-size: 14px; }



.contact{ padding: 50px 0 240px; position: relative; z-index: 11;}

.contact ul{ padding: 0 60px;}

.contact ul li{ width: 33.33%; padding: 0 60px; float: left;}

.contact ul li dt{ width: 138px; height: 138px; line-height: 114px; text-align: center; background: #9dc757; border: #f4f4f4 solid 12px; border-radius: 100px; margin: 0 auto; position: relative; z-index: 11;}

.contact ul li ol{ height: 200px; background: #f4f4f4; margin-top: -70px; padding: 70px 25px 25px; text-align: center; font-size: 18px; font-weight: normal; color: #000;}

.contact ul li ol dd{ color: #9dc757; font-size: 20px; font-weight: normal; margin-bottom: 10px;}



.yudingBox{ height: 1050px; padding-top: 235px;}

.yudingBox .message{ width: 760px; float: none; margin: 0 auto;}



.footer{ background: url(../images/footerBg.png) no-repeat center top; background-size: cover; color: #fff;}

.footer a{ color: #fff;}

.footer .wrap{ position: relative; padding-top: 66px;}

.footer .wrap::before{ content: ""; width: 229px; height: 128px; background:url(../images/footer01.png) no-repeat center; position: absolute; left: 0; top: -100px;}

.footer .wrap::after{ content: ""; width: 421px; height: 294px; background:url(../images/footer02.png) no-repeat center; position: absolute; right: 0; top: -260px;}

.footer .footer_l{ width: 50%; float: left;}

.footer .footer_l .fnav{ overflow: hidden; margin-left: -35px; margin-bottom: 45px;}

.footer .footer_l .fnav li{ float: left; margin-left: 35px;}

.footer .footer_l .fnav li a{ font-size: 18px; color: #fff;}

.footer .footer_l .fcontact{  overflow: hidden; white-space: nowrap;  margin-bottom: 45px; margin-left: -50px;}

.footer .footer_l .fcontact ul{ float: left; overflow: hidden; margin-left: 50px;}

.footer .footer_l .fcontact ul dl{ float: left; margin-right: 10px;}

.footer .footer_l .fcontact ul ol{ float: left; font-size: 18px; font-weight: normal; padding-top: 5px;}

.footer .footer_l .fcontact ul ol h3{ font-size: 16px; font-weight: normal; line-height: 1; opacity: 0.6; margin-bottom: 10px;}

.footer .footer_l .fcontact ul ol h4{ font-size: 30px; font-weight: bold; line-height: 1;}

.footer .footer_l .copyright{ line-height: 60px; border-top: 1px solid #fff;}

.footer .footer_r{ width: 50%; padding-top: 10px; float: right;}

.footer .footer_r .ewm{ overflow: hidden;float: right;}

.footer .footer_r .ewm li{ float: left; margin-left: 20px; text-align: center; color: #fff;}



/*===/分页=============================*/

.fenye { text-align: center; font-size: 15px; width: 100%; height: 40px; margin: 20px 0 0px;}

.fenye .prev, .fenye .next { width: 40px; height: 40px; line-height: 40px; color: #666;margin-right: 5px; display: inline-block; font-family: "宋体";font-size: 17px; background: #fff; border: #EBEBEB solid 1px;border-radius: 6px;}

.fenye a { width: 40px; height: 40px; line-height: 40px;  color: #666; margin-right: 5px;display: inline-block; background: #fff; border: #EBEBEB solid 1px; border-radius: 6px;}

.fenye a:hover {color: #fff; background: #242a34; border: #242a34 solid 1px;}

.fenye a.current { color: #fff;  background: #242a34; margin-right: 5px; border: #242a34 solid 1px;}





@media only screen and (min-width: 1680px) and (max-width: 1920px){



}



@media only screen and (min-width: 1440px) and (max-width: 1679px){

.wrap{ width: 1380px;}

.header .nav ul li{ margin-left: 14px;}



.popularActivities .view{ width: 1060px;}

.popularActivities .preview{ width: 300px; height: 690px; padding: 45px 0;}



.hotList ul{ margin: 0 -40px;}

.hotList ul li{ padding: 0 40px;}



.footer .footer_l{ width: 55%;}

.footer .footer_r{ width: 45%;}

}



@media only screen and (min-width: 1280px) and (max-width: 1439px){

.wrap{ width: 1220px;}

.header .logo{ width: 500px;}

.header .nav ul li{ margin-left: 10px;}

.header .nav>ul>li>a{ font-size: 17px;}



.title h2{ font-size: 40px;}



.iabout .box ul{ margin: 0 -30px;}

.iabout .box ul li{ padding: 0 30px;}

.iabout .box ul li a::after{ background:none; }

.iabout .box ul li ol dl{ height: 200px;}

.iabout .box ul li ol h3{  margin-top: 60px;  margin-left:0;}

.iabout .box ul li ol dt{ font-size: 15px;}



.popularActivities .view{ width: 940px;}

.popularActivities .preview{ width: 260px; height: 588px; padding: 42px 0;}

.popularActivities .preview .swiper-container{ height: 510px;}



.hotList ul{ margin: 0 -20px;}

.hotList ul li{ padding: 0 20px;}



.contact ul{ margin: 0 -30px;}

.contact ul li{ padding: 0 30px;}



.yudingBox{ height: 960px;}



.footer .footer_l{ width: 60%;}

.footer .footer_l .fnav{ margin-left: -30px;}

.footer .footer_l .fnav li{ margin-left: 30px;}

.footer .footer_r{ width: 40%;}

.footer .footer_r .ewm li{ width: 140px;}

}



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

.wrap{ width: 960px;}

.w1200{ width: 960px;}



.header .logo{ width: 350px;}

.header .nav ul li{ margin-left: 5px;}

.header .nav>ul>li>a{ font-size: 17px; padding: 0 10px;}



.title h2{ font-size: 40px;}



.iabout .box ul{ margin: 0 -10px;}

.iabout .box ul li{ padding: 0 10px;}

.iabout .box ul li a::after{ background:none; }

.iabout .box ul li ol dl{ height: 200px;}

.iabout .box ul li ol h3{  margin-top: 60px;  margin-left:0;}

.iabout .box ul li ol dt{ font-size: 15px;}



.popularActivities .view{ width: 760px;}

.popularActivities .preview{ width: 180px; height: 470px; padding: 50px 0;}

.popularActivities .preview .swiper-container{ height:390px;}



.hotList ul{ margin: 0 -20px;}

.hotList ul li{ padding: 0 20px;}



.contact ul{ margin: 0 -10px;}

.contact ul li{ padding: 0 10px;}



.yudingBox{ height: 960px;}



.footer .footer_l{ width: 55%;}

.footer .footer_l .fnav{ margin-left: -30px; margin-bottom: 30px;}

.footer .footer_l .fnav li{ margin-left: 30px;}

.footer .footer_l .fnav li a{ font-size: 16px;}

.footer .footer_l .fcontact{ margin-bottom: 18px;}

.footer .footer_l .fcontact ul{ margin-bottom: 10px; float: none;}

.footer .footer_l .fcontact ul dl{ height: 45px;}

.footer .footer_l .fcontact ul ol h3{ margin-bottom: 3px;}

.footer .footer_l .fcontact ul ol h4{ font-size: 20px;}

.footer .footer_l .fcontact ul ol{ font-size: 15px;}

.footer .footer_r{ width: 45%;}

.footer .footer_r .ewm li{ width: 120px;}

}



@media screen and (max-width:999px){

    body{ padding-top: 60px;font-size: 15px;}

    .wrap{ width: 100%; padding: 0 15px;}

    .w1200{ width: 100%; padding: 0 15px;}





    .header{ width: 100%; height:60px; background: #fff;   box-shadow: 0 0 5px rgba(0,0,0,.1);  position: fixed; top: 0; left: 0; z-index: 99999; }

    .header .logo{ width: 200px; height: 60px; background: url(../images/logo02.png) no-repeat 15px center; background-size: auto 48px;}

    .header .logo img{display: none;}

    .header .logo a{ display: block; height: 60px; line-height:60px;}

    .header .nav{  float: none; position: fixed; top: 60px; left: 0; width: 100%; height: calc(100vh - 60px);  border-top: #eee solid 1px;  background: #fff; display: none; padding-top: 0; }

    .header .nav ul li{ float: none; margin-left: 0; border-bottom: #eee solid 1px; position: relative;}

    .header .nav>ul>li>a{ color: #000; font-size: 18px; font-weight: normal;  border-radius: 0; padding: 0 15px; line-height: 50px; display: block;  transition: all .4s; }

    .header .nav>ul>li>a:hover,.header .nav>ul>li.on a{ color: #fff; background: #9dc757; }



    .header .menu-toggle{ width:60px; height:60px; position:absolute; right:0; top:0; z-index:99999; display:block;}

    .header .menu-toggle span{ width:35px; height:2px; background:#6baf28;display:block; position:relative; opacity:1;transition:all 300ms; margin:30px 0 0 12px;}

    .header .menu-toggle span:before{ content:"";width:35px; height:2px; background:#6baf28;display:block; position:absolute; left:0; top:-10px;transition:all 300ms;}

    .header .menu-toggle span:after{ content:"";width:35px; height:2px; background:#6baf28;display:block;position:absolute; left:0; top:10px;transition:all 300ms;}

    .header .menu-toggle.cur span{background-color:transparent;}

    .header .menu-toggle.cur span:before{transform:rotate(45deg); top:0px;}

    .header .menu-toggle.cur span:after{transform:rotate(-45deg); top:0px;}



    /*首页bannner*/

    .banner { position: relative; width: 100%; margin-top: 0;}

    .banner .swiper-container{ width:100%; overflow:hidden;}

    .banner .swiper-container .swiper-slide img{width:100%;}

    .banner .pagination { width: 100%; height: 20px; text-align: center; background:none; padding:0; border-radius: 30px;  position: absolute;z-index: 20; left: 0%; bottom:10px; transform: translate(0, 0);}

    .banner .swiper-pagination-switch {display: inline-block; width:6px; height: 6px; background:#fff; margin:0 2px; border-radius: 20px;  cursor: pointer; position: relative;}

    .banner .swiper-active-switch { width:6px; height: 6px; background: #9dc757; opacity: 1;}



    .neiBanner{ position: relative; margin: 0; overflow: hidden;}

    .neiBanner img{ width: 120%; }



    .title{  margin-bottom: 30px; padding-top: 25px; background: url(../images/titleBg.png) no-repeat center top; background-size: auto 32px;}

    .title h2{ font-size: 28px; padding-bottom: 12px;}

    .title h2::before{ content: ""; width: 19px; height: 30px; background: url(../images/icon01.png) no-repeat center; position: absolute; left: 0%; bottom: 10px; margin-left: -30px;}

    .title h2::after{ content: ""; width:35px; height: 48px; background: url(../images/icon02.png) no-repeat center; background-size: cover; position: absolute; right: 10px; bottom: 15px; margin-right: -55px;}

    .title p{ font-size: 14px;}



    .iabout{ padding: 50px 0 200px;}

    .iabout .box{ padding-top: 0px;}

    .iabout .box ul{ margin: 0 -10px;}

    .iabout .box ul li{ width: 50%; padding: 0 10px; margin-bottom: 15px; float: left;}

    .iabout .box ul li a::after{ display: none;}

    .iabout .box ul li ol{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 11;}

    .iabout .box ul li ol h3{ float: right; font-size: 20px; color: #fff; font-weight: normal; line-height: 1.8; writing-mode:vertical-rl; border-left: 1px solid #fff; border-right: 1px solid #fff; margin-left: 0; margin-top: 70px;  transition: all .4s;}

    .iabout .box ul li ol dt{ display: none;}

    .iabout .box ul li a:hover ol dt{ width:0;}



    .offlineActivities{ margin-top: -140px;}

    .offlineActivities .box ul li{ width: 50%; float: left;}

    .offlineActivities .box ul li img{ width: 100%;}

    .offlineActivities .box ul li:nth-child(6){ width: 50%;}

    .offlineActivities .box ul li:nth-child(6) img{ width: auto; height: 100%;}

    .offlineActivities .box ul li a{ height: 136px; display: block; position: relative; overflow: hidden;}

    .offlineActivities .box ul li h3{ padding: 15px; font-size: 15px;  white-space: nowrap; font-weight: normal; letter-spacing:2px; writing-mode:inherit;   position: absolute; right: inherit; left: 50%; top: 50%; z-index: 11; transform: translate(-50%, -50%);}

    .offlineActivities .box ul li h3::after{ content: ""; width: calc(100% - 12px); height: calc(100% - 12px); border: #fff solid 1px;  position: absolute; top: 5px; left: 5px;}



    .introduction{ padding: 80px 0 50px; background: url(../images/introductionBg.jpg) no-repeat center; background-size: cover;}

    .introduction .box{ height: 450px; display: inline-block;}

    .introduction .box h3{ display: none;}

    .introduction .box dt{ font-size: 14px; letter-spacing:0; line-height:1.6; writing-mode:inherit; padding: 15px; background: rgba(255,255,255,0.67);}



    .popularActivities{ padding: 50px 0 50px; background: url(../images/popularActivitiesBg.jpg) no-repeat center; background-size:cover;}

    .popularActivities .view{ width: 100%; float: none;}

    .popularActivities .view .swiper-slide a{ border-radius:10px; overflow: hidden; display: block; position: relative;}

    .popularActivities .view .swiper-slide ol{ width: 100%; padding: 15px; color: #fff; background: rgba(0,0,0,0.6); position: absolute; left: 0; bottom: 0;}

    .popularActivities .view .swiper-slide ol dl{ overflow: hidden; margin-bottom: 0;}

    .popularActivities .view .swiper-slide ol dl i{ font-size: 14px; line-height: 26px; padding: 0 5px; margin-right: 10px; float: left;}

    .popularActivities .view .swiper-slide ol dl h3{ font-size: 14px;}

    .popularActivities .view .swiper-slide ol dl span{ font-size: 12px;line-height: 2;}

    .popularActivities .view .swiper-slide ol dt{display: none; }

    .popularActivities .preview{ width: 100%; height: auto; padding: 15px 0; float: none; position: relative;}

    .popularActivities .preview .swiper-container{ width: 90%; height: auto; overflow: hidden;}

    .popularActivities .preview .swiper-container .swiper-slide{  box-sizing: border-box; padding: 0 5px;}

    .popularActivities .preview .swiper-container .swiper-slide dl{ border-radius: 10px; overflow: hidden; position: relative; cursor: pointer;}

    .popularActivities .preview .swiper-container .swiper-slide p{ width: 100%; height: 26px; line-height: 26px; font-size: 12px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}

    .popularActivities .preview .swiper-container .swiper-slide.active-nav p{ background: #6baf28;}

    .popularActivities .preview .arrow-left{ width: 12px; height: 20px; background: url(../images/arrow-left.png) no-repeat center; position: absolute; left: 0%; top: 50%; margin-left: 0; margin-top: -10px; z-index: 11;}

    .popularActivities .preview .arrow-left:hover{background: url(../images/arrow-left.png) no-repeat center;}

    .popularActivities .preview .arrow-right{ width: 12px; height: 20px; background: url(../images/arrow-right.png) no-repeat center;  position: absolute; left: inherit; right: 0; bottom:inherit; top: 50%; margin-left:0; margin-top: -10px; z-index: 11;}

    .popularActivities .preview .arrow-right:hover{background: url(../images/arrow-right.png) no-repeat center;}



    .yuding{ padding: 50px 0 60px; position: relative; z-index: 11;}

    .message{ width: 100%; height: auto; padding:30px 20px; background: url(../images/messageBg.png) no-repeat center top; float: none;}

    .message dl{ text-align: center; font-size: 20px; color: #fff; font-weight: normal; line-height: 1; margin-bottom:20px;}

    .message ul{ margin: 0 -5px;}

    .message ul li{ width: 50%; padding: 0 5px; margin-bottom: 10px; float: left;}

    .message ul ol{ width: 100%; padding: 0 5px; }

    .message input{ width: 100%; height: 44px; font-size: 15px; background: #fff; border: none; border-radius: 5px; padding: 0 10px;}

    .message textarea{ width: 100%; height: 100px; font-size: 15px; background: #fff; border: none; border-radius: 5px; padding: 10px; margin-bottom: 10px;}

    .message button{ width: 126px; height: 46px; color: #6baf28; font-size: 18px; background: #fff; border-radius: 46px; border: none; margin:0 auto; display: block; cursor: pointer;}

    .message button:hover{ background: #6baf28; color: #fff; box-shadow: 0 5px 5px rgba(0,0,0,.3);}

    .map{ width:100%; height:300px; font-size: 14px; float: none; }



    .about{ padding: 30px 0 60px; position: relative; z-index: 11;}

    .about .aboutNav{ text-align: center; margin-bottom: 20px;}

    .about .aboutNav li{ background: #9dc757; display: inline-block; margin: 0 2px; position: relative;}

    .about .aboutNav li a{ color: #fff; font-size: 14px; padding: 10px 10px; position: relative; z-index: 11; display: block;}

    .about .aboutNav li:hover{ background: #7da53c;}

    .about .aboutNav li::after{ content: ""; width: calc(100% - 12px); height: calc(100% - 12px); border: #fff solid 1px;  position: absolute; top: 5px; left: 5px;}

    .about .text{ color: #000; font-size: 15px; line-height: 1.8;}

    .about .slideBox{ padding-top: 20px;}

    .about .slideBox .view{ margin-bottom: 15px;}

    .about .slideBox .preview{ padding: 0 15px; position: relative;}

    .about .slideBox .preview .swiper-slide{ padding: 0 7px; box-sizing: border-box; cursor: pointer;}

    .about .slideBox .preview .swiper-slide.active-nav dl{ border:#7da53c solid 2px;}

    .about .slideBox .preview .arrow-left,.about .slideBox .preview .arrow-right{ width: 12px; height: 20px; position: absolute; top: 50%; margin-top: -10px;}

    .about .slideBox .preview .arrow-left{ background: url(../images/arrow-left.png) no-repeat center; left: 0;}

    .about .slideBox .preview .arrow-right{ background: url(../images/arrow-right.png) no-repeat center; right:0;}



    .offline{ padding: 30px 0;}

    .offline ul{ overflow: hidden;}

    .offline ul li{ width:50%; padding: 0 5px; margin-bottom: 10px; float: left;}

    .offline ul li a{ position: relative; border-radius: 10px; overflow: hidden; display: block;}

    .offline ul li a h3{ width: 120px; height: 50px; line-height: 50px;  font-size: 16px; color: #6baf28;  position: absolute; left: 50%; bottom: 22px; margin-left: -60px;}

    .offline ul li a h3::after{ content: ""; width: calc(100% - 12px); height: calc(100% - 12px); border: #6baf28 solid 1px;  position: absolute; top: 5px; left: 5px;}



    .hotTop{ background: #f1f1f1; padding: 30px 0;}

    .hotTop dl{ width: 100%; float: none; margin-bottom: 10px;}

    .hotTop ol{ width: 100%; padding-left: 0; float: none;}

    .hotTop ol li{ margin-bottom: 10px; border-bottom: #6baf28 solid 1px; padding-bottom: 10px;}

    .hotTop ol li h3{ font-size: 18px; margin-bottom: 15px;}

    .hotTop ol li dd{ font-weight: normal; color: #000;}

    .hotTop ol li dd span{ display: inline-block; background: #6baf28; color: #fff; padding:2px 10px; margin-right: 10px;}

    .hotTop ol li dd span.end{ background: #b8b8b8;}

    .hotTop ol .text{ color: #999; font-weight: normal; line-height: 1.5;}

    .hotTop ol .text .more{ color: #f20005;}



    .hotList{ padding: 36px 0 60px;}

    .hotList ul{ margin: 0 -5px; padding-bottom: 20px;}

    .hotList ul li{ width: 50%; padding: 0 5px; margin-bottom: 10px; float: left;}

    .hotList ul li a{display: block;}

    .hotList ul li a:hover{ box-shadow: 0 0 10px rgba(0,0,0,.3);}

    .hotList ul li dl{ padding-bottom: 61.925%; position: relative; overflow: hidden;}

    .hotList ul li dl img{position:absolute;top:0; bottom:0;left:0;right:0; width:100%; height: 100%; margin:auto;}

    .hotList ul li ol{ height: 105px; padding: 10px; background: #f2f2f2;}

    .hotList ul li ol h3{ font-size:16px; font-weight: 500; color: #000; line-height: 1; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; margin-bottom: 12px;}

    .hotList ul li ol dt{ font-weight: normal; color: #000; font-size: 12px;}

    .hotList ul li ol span{ font-size: 13px; padding:2px 5px; margin-right: 10px; float: none;}

    .hotList ul li ol span.end{ background: #b8b8b8;}



    .hot_view{ padding: 40px 0 60px; position: relative; z-index: 11;}

    .hot_view .hotHead{ text-align: center; margin-bottom: 30px; border-bottom: #6baf28 solid 1px; padding-bottom: 10px;}

    .hot_view .hotHead h3{ font-size: 20px; color: #6baf28; font-weight: normal; line-height: 1; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; margin-bottom: 15px;}

    .hot_view .hotHead dd{ font-size: 12px;}

    .hot_view .hotHead dd span{ font-size: 13px; padding:2px 10px; margin-right: 10px;}

    .hot_view .hotHead dd span.end{ background: #b8b8b8;}

    .hot_view .text{ color: #999; font-weight: normal; line-height: 1.7;}

    .hot_view .page{ padding-top: 30px; font-size: 16px; font-weight: normal;}

    .hot_view .page li{ margin-bottom: 5px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}



    .traffic{ padding: 30px 0 60px; position: relative; z-index: 11; overflow: hidden;}

    .traffic .box{ overflow: hidden; padding-top: 40px;}

    .traffic .box ul{ width: 100%; padding-right: 0px; float: none; margin-bottom: 20px;}

    .traffic .box ul img{ height: 60px;}

    .traffic .box .text{ color: #000; font-size: 15px; font-weight: normal; line-height: 1.6; padding-top: 10px; }

    .mapBox{ width: 100%; height:200px; font-size: 14px;  overflow: hidden; }



    .contact{ padding: 50px 0 60px; position: relative; z-index: 11;}

    .contact ul{ padding: 0 20px;}

    .contact ul li{ width: 100%; padding: 0 20px; margin-bottom: 20px; float: none;}

    .contact ul li dt{ width: 90px; height: 90px; line-height: 70px;border: #f4f4f4 solid 10px; }

    .contact ul li dt img{ height: 35px;}

    .contact ul li ol{ height: 180px; background: #f4f4f4; margin-top: -50px; padding: 60px 20px 20px; text-align: center; font-size: 15px; }

    .contact ul li ol dd{ color: #9dc757; font-size: 16px; font-weight: normal; margin-bottom: 10px;}



    .yudingBox{ height: 500px; padding-top: 70px;}

    .yudingBox .message{ width: 100%; float: none; margin: 0 auto;}



    .footer{ background: url(../images/footerBg.png) no-repeat center top; background-size: cover; color: #fff;}

    .footer a{ color: #fff;}

    



    .footer .footer_l{ width: 65%;}

    .footer .wrap{ position: relative; padding-top:50px;}

    .footer .wrap::before{display: none;}

    .footer .wrap::after{ display: none;}

    .footer .footer_l .fnav{ margin-left: -30px; margin-bottom: 30px;}

    .footer .footer_l .fnav li{ margin-left: 30px;}

    .footer .footer_l .fnav li a{ font-size: 16px;}

    .footer .footer_l .fcontact{ margin-bottom: 18px; white-space: inherit;}

    .footer .footer_l .fcontact ul{ margin-bottom: 10px; float: none;}

    .footer .footer_l .fcontact ul dl{ height: 40px;}

    .footer .footer_l .fcontact ul ol{ padding-left:50px; float: none;}

    .footer .footer_l .fcontact ul ol h3{ margin-bottom: 3px;}

    .footer .footer_l .fcontact ul ol h4{ font-size: 20px;}

    .footer .footer_l .fcontact ul ol{ font-size: 15px;}

    .footer .footer_l .copyright{ line-height: 1.6; padding: 20px 0;}

    .footer .footer_r{ width: 30%;}

    .footer .footer_r .ewm li{ width: 90px;}





    /*===/分页=============================*/

    .fenye { text-align: center; font-size: 15px; width: 100%; height: 40px; margin: 10px 0 0px;}

    .fenye .prev, .fenye .next { width: 36px; height: 36px; line-height: 36px; margin-right: 3px; font-size: 17px; }

    .fenye a { width: 36px; height: 36px; line-height: 36px; margin-right: 3px;}

    .fenye a:hover {color: #fff; background: #242a34; border: #242a34 solid 1px;}

    .fenye a.current { color: #fff;  background: #242a34; margin-right: 3px; border: #242a34 solid 1px;}



}