@charset "utf-8";
.section-top{padding-top:10px;}

.section-top .left-pic{width: 480px;float: left;}
.left-pic .swiper-slide img{display: block;width: 100%;}
.left-pic .swiper-slide{cursor: pointer;border: 2px solid transparent;box-sizing: border-box;width: 76px;}
.left-pic .swiper-slide:hover,.left-pic .swiper-slide.swiper-slide-there{border-color: #00913a;}
.left-pic .details-preview>img{display: block;width: 100%;}
.left-pic .swiper-container{padding: 0 20px;margin-top: 15px;}
.left-pic .swiper-button-prev,.left-pic .swiper-button-next{width: 16px;height: 100%;top: 0;margin-top: 0;background-color: #fff;background-size: 20px;box-sizing: border-box;border: 1px solid #ccc;}
.left-pic .swiper-button-prev{left: 0;background-image: url("/img/public/prev.png");}
.left-pic .swiper-button-next{right: 0;background-image: url("/img/public/next.png");}
.left-pic .swiper-button-prev.swiper-button-disabled{opacity: 0.8;}
.left-pic .swiper-pagination{display: none;}


#preview{position: relative;}
#look{width: 80px;  height: 80px;  position: absolute;  left: 0;  top: 0;  background: rgba(255, 255, 255, 0.4);cursor: move; display: none;}
#bigPic{width: 500px;  height: 500px;  position: absolute;  left: 105%;  top: 0;  overflow: hidden; box-sizing: border-box; border: 1px solid #ccc;  display: none;z-index: 100;}
#bigPic>img{display: block;width: 1000px;position: absolute;}

.right-detail{width: 650px;float: right;}
.right-detail .colors>a{width: 15px;height: 15px;display: inline-block;margin: 10px;position: relative;color: transparent;}
.right-detail .colors>a:before{ content: ""; position: absolute;left: -4px; top: -4px;right: -4px;bottom: -4px;border: 1px solid #ccc;}
.right-detail .colors>a.active:before{border-color: #00913a;}

.right-detail .title{padding: 20px;background: #fff5ec;}

.right-detail .describe{font-size: 12px;font-size: 1.2rem;color: #aaa;margin-top: 15px;}
.right-detail .name{font-size: 20px;font-size: 2rem;}
.group{line-height: 35px;margin: 25px 0;}
.group2{margin: 40px 0;}
.group .colors{margin-left: 75px;font-size: 0;}
.group .names{float: left;width: 75px;}
.group>.lt,.group>.rt{width: 50%;}
.group .infor{width: 118px;margin-left: 75px;text-indent: 15px;position: relative;}
.group .format{border: 1px solid #00913a;border-radius: 5px;width: 310px;margin-left: 75px;text-indent: 30px;}
#attached{margin-left: 75px;height: 33px;width: 310px;text-indent: 30px;position: relative;}
#hard .hardText,#all .allText,#attached .attachedText{border: 1px solid #00913a;border-radius: 5px;width: 100%;cursor: pointer;background: url("../img/public/down.png") no-repeat 90% center;background-size: 16px;}
#hard .hardExport,#all .allExport,#attached .attachedExport{position: absolute;top: 32px;background: #fff;left: 0;width: 100%;z-index: 80;cursor: pointer;display: none;border: 1px solid #00913a; border-radius: 0 5px;padding-top: 10px;border-top: none;}
#format .formatExport p:hover,#attached .attachedExport p:hover{color: #00913a;}
.group .service img{width: 20px;vertical-align: text-top;margin-right: 5px;}
.group .service>li{display: inline-block;margin-right: 15px;color: #aaa;}
.group .txt{color: #aaa;margin-left: 75px;}
.group .submitbtn{display: inline-block;width: 136px;height: 40px;line-height: 40px;text-align: center;color:#fff;background: #00913a;margin-left: 80px;}
.group .service{margin-left: 75px;}
.right-detail .price{display: inline-block;}
.right-detail .price>span{font-size: 24px;font-size: 2.4rem;color: #ff0000;padding: 0 3px;}

.section-bottom{margin-top:100px;}
.section-bottom .tab-box .tab{float: left;height: 54px;line-height: 54px;width: 154px;text-align: center;cursor: pointer;}
.section-bottom .tab-box{height: 52px;border-bottom: 2px solid #ccc;font-size: 20px;font-size: 2rem;}
.section-bottom .tab-box .active{background: #00913a;color: #fff;}
.content-box>div{display: none;}
.content-box .line{font-size: 0;padding: 20px 0;border-top: 1px solid #caffe5;}
.content-box .line:first-child{border-top: none;}
.content-box .line>div{float: left;font-size: 18px;font-size: 1.8rem;}
.content-box .line .middle p{font-size: 14px;font-size: 1.4rem;opacity: 0.8;}
.content-box .middle li{margin-bottom: 8px;}
.content-box .line .left{width: 240px;color: #00913a;font-size: 30px;font-size: 3rem;line-height: 204px;height: 204px;}
.content-box .line .left>span{font-size: 18px;font-size: 1.8rem;}
.content-box .line .middle{width: 330px;}
.content-box .right li{margin-bottom: 8px;height: 45px;line-height: 45px;opacity: 0.8;}


.content-box .bbanner img{display: block;width: 100%;}
.content-box .pack .text-box{width: 50%;}
.content-box .pack .pic{width: 50%;}
.content-box .pack .pic>img{width: 100%;display: block;}
.content-box .text-box .font1{font-size: 38px;font-size: 3.8rem;opacity: 0.85;line-height: 1.6;}
.content-box .text-box .font2{opacity: 0.8;line-height: 1.8;margin-top: 30px;}
.content-box .text-box .text{width: 60%;margin: 167px auto;}
.content-box .wrap{margin-top: 30px;}
.relate .title{text-align: center;position: relative;margin: 100px 0 50px;}
.relate .title:before{content: "";position: absolute;width: 100%;background: #ccc;height: 2px;top: 50%;margin-top: -1px;left: 0;z-index: -1;}
.relate .title span{padding: 0 25px;background: #fff;font-size: 20px;font-size: 2rem;}
.relate .cell{float: left;width: 23%;margin: 0 1% 30px;box-shadow: 0 0 3px #ccc;}
.relate .cell img{width: 100%;display: block;}
.relate .cell .txt{padding: 15px 15px 30px; }
.relate .price span{color: red;font-size: 16px;font-size: 1.6rem;margin-left: 3px;}
.relate .name{display: block;line-height: 24px; height: 48px; overflow: hidden; margin-top: 10px;display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.relate .name:hover{color: #00913a;}

/*表单*/
#cover{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.8);z-index: 1002;display: none;}
#cover .close{position: absolute;right: 50px;top: 30px;color: #fff;width: 50px;  height: 50px;  font-size: 56px;  line-height: 46px;  text-align: center; cursor: pointer;}
.stay { position: absolute; top: 50%;left: 50%; margin-left: -420px; margin-top: -208px; width: 840px;padding: 35px 20px ;box-sizing: border-box;background: #fff;border-radius: 4px;}
.stay h1{font-size: 28px;font-size: 2.8rem;text-align: center;padding-bottom:20px;}
.stay .frame{width: 50%;float: left;padding: 0 5px;box-sizing: border-box;margin-bottom: 20px;}
.stay .frame p{font-size: 16px;font-size: 1.6rem;padding-bottom: 10px;float: left;}
.stay .frame input{background: #efefef;width: 100%;height: 45px;padding:0 10px;box-sizing: border-box;float: left;font-size: 14px;font-size: 1.4rem;}
.stay input.sub{width: 80px;margin: 0 auto;display: block;border: 1px solid #00a051;border-radius: 2px;padding: 5px 0;background: #fff;font-size: 14px;font-size: 1.4rem;}
.stay input.sub:hover{background: #00a051;color: #fff;}


.content-box1 p img{width: 100%;display: block;}
.navigation { padding: 20px;    padding-bottom: 30px;}
.navigation>a {color: #004e99; padding-right: 5px;font-size: 14px;font-size: 1.4rem;}
.navigation>a:last-child { color: #777;}

@media screen and (max-width:1219px) {
    .section-top .left-pic{width: 400px;}
    #bigPic{width: 400px;height: 400px;}
    .right-detail{width: calc(95% - 400px); width: -webkit-calc(95% - 400px); width: -moz-calc(95% - 400px);}
    .relate .cell .txt{padding: 10px 6px;}
    .group{margin: 10px 0;line-height: 32px;}
    .right-detail .colors>p{margin: 5px 8px;}
    .group .format{margin-top: 15px;margin-bottom: 15px;}
    .content-box .text-box .text{margin: 90px auto;width: 76%;}
}
@media screen and (max-width:1024px){
    .right-detail{width: 80%;margin: 30px auto 0;float: none;}
    .section-top{padding-top: 20px;}
    .section-top .left-pic{ float: none; margin: 0 auto;}
    .left-pic .swiper-button-prev, .left-pic .swiper-button-next,#preview{display: none;}
    .left-pic .swiper-pagination{display: block;}
    .left-pic .swiper-slide{width: 100%;}
    .left-pic .swiper-container{padding: 0;margin-top: 0;}
    .left-pic .swiper-slide:hover, .left-pic .swiper-slide.swiper-slide-there{border: none;}
    .content-box .text-box .text{width: 80%;    margin: 45px auto;}
    .content-box .text-box .font1{font-size: 24px;font-size: 2.4rem;}
    .content-box .line>div{font-size: 14px;font-size: 1.4rem;}
    .content-box .line .middle p{font-size: 12px;font-size: 1.2rem;}
    .content-box .line .left{font-size: 16px;font-size: 1.6rem; width: 25%;height: 172px;line-height: 172px;}
    .content-box .line .middle{width: 50%;}
    .content-box .right li{height: 35px;line-height: 35px;}
    .content-box .line .left>span{font-size: 12px;font-size: 1.2rem;}
    .section-bottom .tab-box .tab{font-size: 14px;font-size: 1.4rem;height: 40px;line-height: 40px;}
    .section-bottom .tab-box{height: 39px;border-bottom-width: 1px;}
    .stay{width: 80%;margin-left: 0;left: 10%;}
}
@media screen and (max-width:768px){
    .right-detail .name{font-size: 14px;font-size: 1.4rem;}
    .content-box .pack .pic{float: none;width: 100%;}
    .content-box .pack .text-box{float: none;width: 100%;}
    .content-box .wrap{width: 100%;}
    .stay h1{font-size: 20px;font-size: 2rem;}
    .stay .frame p{font-size: 14px;font-size: 1.4rem;line-height: 40px;float: left;padding-bottom: 5px;}
    /*.stay .frame:last-child p{line-height: normal;}*/
    .stay .frame input{font-size: 12px;font-size: 1.2rem; width: calc(100% - 70px); width: -webkit-calc(100% - 70px);width: -moz-calc(100% - 70px); height: 40px; float: right;}
    /*.stay .frame:last-child input{width: 100%;}*/
    .stay .frame{width: 100%;float: none;margin-bottom: 12px;}
    .stay{padding: 20px;margin-top: -214px;}
    #cover .close{right: 20px;top: 15px;}
    .content-box2 img{ width: 100%;display: block;}
    .content-box2 p{padding:0 10px;box-sizing: border-box;}
}
@media screen and (max-width:540px){
    .section-top .left-pic{width: 100%;}
    .section-top .wrap{width: 100%;}
    .section-top{padding-top: 0;}
    .right-detail{width: 94%;margin-top: 10px;}
    .relate .cell{width: 48%;}
    .relate .title{margin: 60px 0 30px;}
    .content-box .wrap{margin-top: 0;}
    .group .format,#attached{width: 200px;}
    .group .infor{text-indent: 10px;}
    .group>.lt, .group>.rt{float: none;width: 100%;margin-bottom: 10px;}
    .right-detail .price>span{font-size: 16px;font-size: 1.6rem;}
    .group .submitbtn{height: 32px;line-height: 32px;margin-left: 40px;}
    .group2{margin: 18px 0;}
    .content-box .bbanner img{width: 148%;position: relative;left: -19%;}
    .content-box .bbanner{overflow: hidden;}
    .content-box .text-box .font1{font-size: 20px;font-size: 2rem;}
}