@import url('common.css');

@media only screen and (max-width:750px){
    .breadcrumb{display:flex}
    .breadcrumb a{display:none}
    .breadcrumb a:first-child{display:block}
    .breadcrumb span{display:block}
}

.header{border-bottom:1px #eee solid}

.product .base{display:flex;margin-bottom:55px}
.product .base .pic_mobile{display:none}
.product .base .pic_pc{width:460px;margin-right:80px}
.product .base .pic_pc .big_img{width:460px;height:460px;display:flex;justify-content:center;align-items:center;border:1px #eee solid;border-radius:20px}
.product .base .pic_pc .big_img img{max-width:100%;max-height:100%}
.thumb{width:460px;margin-top:20px}
.thumb .slideBox{overflow:hidden;zoom:1;position:relative}
.thumb .tempWrap{width:390px !important;margin:0 auto}
.thumb .sPrev,.thumb .sNext{position:absolute;left:0;top:28px;display:block;width:32px;height:32px;background:url(../images/arrow_left.png) center center no-repeat}
.thumb .sNext{left:auto;right:0;background:url(../images/arrow_right.png) center center no-repeat}
.thumb ul{overflow:hidden;zoom:1}
.thumb ul li{width:86px;height:86px;margin-right:10px;float:left;display:flex;overflow:hidden;align-items:center;justify-content:center;border:2px solid #ccc;cursor:pointer;border-radius:5px}
.thumb ul li.active,.thumb ul li:hover{border:2px #0E38A8 solid}
.thumb ul li img{max-width:95%;max-height:95%}
.product .base .info{width:760px}
.product .base .info .sn{padding:40px 0 20px}
.product .base .info .name{margin-bottom:40px;font-size:30px;color:#344455;font-weight:bold;}
.product .base .info .note{font-size:16px;line-height:32px;margin-bottom:60px}
.product .base .info .btn{display:flex}
.product .base .info .btn a{width:165px;padding-left:30px;height:55px;line-height:55px;color:#fff;border-radius:50px;font-weight:bold}
.product .base .info .btn a:first-child{background:#344455 url(../images/50.png) no-repeat 130px center;margin-right:15px}
.product .base .info .btn a:last-child{background:#03407E url(../images/59.png) no-repeat 125px center}
.product .base .info .btn a:first-child:hover{background:#000 url(../images/50.png) no-repeat 130px center;margin-right:15px}
.product .base .info .btn a:last-child:hover{background:#0E38A8 url(../images/59.png) no-repeat 125px center}

@media only screen and (max-width:750px){
    .product .base{display:block;margin-bottom:30px}
    .product .base .pic_pc{display:none}
    .product .base .pic_mobile{display:block}
    .product .base .pic_mobile .swiper-slide{display:flex;justify-content:center;align-items:center;margin-bottom:50px}
    .product .base .pic_mobile .swiper-slide img{max-width:100%;max-height:100%}
    .product .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.product .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{background:#03407E;}
    .product .base .info{width:auto;margin:0 20px}
    .product .base .info .sn{padding-bottom:10px}
    .product .base .info .name{margin-bottom:10px;font-size:24px}
    .product .base .info .note{font-size:14px;line-height:22px;margin-bottom:20px}
    .product .base .info .btn{display:flex}
    .product .base .info .btn a{width:135px;padding-left:30px;height:55px;line-height:55px;color:#fff;border-radius:50px;font-weight:bold}
    .product .base .info .btn a{width:110px;height:40px;line-height:40px;padding-left:20px}
    .banner .info a:hover{width:110px;}
    .product .base .info .btn a:first-child{background:#344455 url(../images/50.png) no-repeat 100px center;}
    .product .base .info .btn a:last-child{background:#03407E url(../images/59.png) no-repeat 95px center}
    .product .base .info .btn a:first-child:hover{background:#344455 url(../images/50.png) no-repeat 100px center;}
    .product .base .info .btn a:last-child:hover{background:#03407E url(../images/59.png) no-repeat 95px center}
}

.product .other{background:#F6F6F6;padding:55px 0}
.product .other .tag{height:65px;display:flex;align-items:center;background:#A5A8AF;border-radius:50px;padding-left:50px}
.product .other .tag span{padding:0 30px;height:50px;line-height:50px;color:#fff;font-size:16px;font-weight:bold;text-align:center;margin-right:40px;cursor:pointer}
.product .other .tag span.active{background:#03407E url(../images/dot1.png) no-repeat 30px center;border-radius:50px;text-align:left;padding-left:55px}
.product .other .con{display:none}
.product .other .con>div{background:#fff;border-radius:20px;margin-top:20px}
.product .other .con .tit{padding-left:50px;font-size:20px;height:65px;line-height:65px;color:#030B1B;font-weight:bold;background:url(../images/down.png) no-repeat 1250px center;cursor:pointer}
.product .other .con .tit:hover{color:#03407E;background:url(../images/down_hover.png) no-repeat 1250px center}
.product .other .con .tit.up{background:url(../images/up.png) no-repeat 1250px center;}
.product .other .con .tit.up:hover{background:url(../images/up_hover.png) no-repeat 1250px center;}
.product .other .con .content{display:none;padding:20px 50px 30px 50px}
.product .other .con1 .content p{color:#333;line-height:25px;font-size:16px}
.product .other .con1 .content img{max-width:1200px;display:block;margin:20px auto}

@media only screen and (max-width:750px){
    .product .other{background:#eee;padding:10px 0 20px}
    .product .other .tag{height:40px;background:none;border-radius:0;padding-left:0;margin-bottom:20px;overflow-x:auto;white-space:nowrap}
    .product .other .tag span{padding:0 20px;height:40px;line-height:40px;color:#000;margin-right:0;}
    .product .other .tag span.active{background:none;border-radius:0;text-align:center;padding-left:0;border-bottom:2px solid #03407E;padding:0 20px;color:#03407E}
    .product .other .con>div{border-radius:0;margin-top:10px}
    .product .other .con .tit{padding-left:20px;font-size:16px;height:50px;line-height:50px;background:url(../images/down.png) no-repeat 95% center;border-bottom:1px #eee solid}
    .product .other .con .tit:hover{color:#030B1B;background:url(../images/down.png) no-repeat 95% center}
    .product .other .con .tit.up{color:#030B1B;background:url(../images/up.png) no-repeat 95% center;}
    .product .other .con .tit.up:hover{color:#030B1B;background:url(../images/up.png) no-repeat 95% center;}
    .product .other .con .content{padding:0 20px}
    .product .other .con1 .content{padding:20px}
    .product .other .con1 .content p{line-height:22px;font-size:14px}
    .product .other .con1 .content img{max-width:calc(100% - 40px);}
}

.product .other .con2 .introduce{display:flex;justify-content:space-between;align-items:center}
.product .other .con2 .item{padding:20px 0;border-bottom:1px #eee solid;display:flex;justify-content:space-between;align-items:center}
.product .other .con2 .item:last-child{border-bottom:0}
.product .other .con2 .info{display:flex;align-items:center}
.product .other .con2 .icon{width:86px;height:86px;border:2px solid #eee;background:url(../images/48.png) no-repeat center center;margin-right:30px;border-radius:20px}
.product .other .con2>div:nth-child(2) .icon{background:url(../images/53.png) no-repeat center center}
.product .other .con2 .name{margin-bottom:5px;font-weight:bold;font-size:16px;color:#344455}
.product .other .con2 .note{font-size:14px}
.product .other .con2 .btn{display:block;width:90px;height:45px;background:#344455 url(../images/50.png) no-repeat center center;border-radius:50px}
.product .other .con2 .btn:hover{background:#03407E url(../images/50.png) no-repeat center center}

@media only screen and (max-width:750px){
    .product .other .con2 .introduce{padding:20px 0}
    .product .other .con2 .item{padding:20px 0;}
    .product .other .con2 .icon{display:none}
    .product .other .con2 .info{width:calc(100% - 70px)}
    .product .other .con2 .name{font-size:14px;}
    .product .other .con2 .note{font-size:12px}
    .product .other .con2 .btn{width:60px;height:35px;}
    .product .other .con2 .btn:hover{background:#03407E url(../images/50.png) no-repeat center center}
}

.product .other .con3 .content{display:block}
.product .other .con3 .item{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-bottom:1px #eee solid;}
.product .other .con3 .info{display:flex;align-items:center}
.product .other .con3 .icon{display:block;width:86px;height:86px;border:2px solid #eee;margin-right:30px;border-radius:20px}
.product .other .con3 .name{margin-bottom:5px;font-weight:bold;font-size:16px;color:#344455}
.product .other .con3 .note{font-size:14px}
.product .other .con3 .btn{display:block;width:90px;height:45px;background:#344455 url(../images/50.png) no-repeat center center;border-radius:50px}
.product .other .con3 .btn:hover{background:#03407E url(../images/50.png) no-repeat center center}

@media only screen and (max-width:750px){
    .product .other .con3 .item{padding:20px 0}
    .product .other .con3 .icon{display:none}
    .product .other .con3 .info{width:calc(100% - 70px)}
    .product .other .con3 .name{font-size:14px;}
    .product .other .con3 .note{font-size:12px}
    .product .other .con3 .btn{width:60px;height:35px;}
    .product .other .con3 .btn:hover{background:#03407E url(../images/50.png) no-repeat center center}
}

.product .other .con4 .content{display:block}
.product .other .con4 .item{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-bottom:1px #eee solid;}
.product .other .con4 .info{display:flex;align-items:center}
.product .other .con4 .icon{display:block;width:86px;height:86px;border:2px solid #eee;margin-right:30px;border-radius:20px}
.product .other .con4 .name{margin-bottom:5px;font-weight:bold;font-size:16px;color:#344455}
.product .other .con4 .note{font-size:14px}
.product .other .con4 .btn{display:block;width:90px;height:45px;background:#344455 url(../images/50.png) no-repeat center center;border-radius:50px}
.product .other .con4 .btn:hover{background:#03407E url(../images/50.png) no-repeat center center}

@media only screen and (max-width:750px){
    .product .other .con4 .item{padding:20px 0;}
    .product .other .con4 .icon{display:none}
    .product .other .con4 .info{width:calc(100% - 70px)}
    .product .other .con4 .name{font-size:14px;}
    .product .other .con4 .note{font-size:12px}
    .product .other .con4 .btn{width:60px;height:35px;}
    .product .other .con4 .btn:hover{background:#03407E url(../images/50.png) no-repeat center center}
}

.product .other .con5 .content{display:block;cursor:pointer}
.product .other .con5 .item{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-bottom:1px #eee solid;}
.product .other .con5 .info{display:flex;align-items:center}
.product .other .con5 .icon{display:block;width:86px;height:86px;border:2px solid #eee;margin-right:30px;border-radius:20px}
.product .other .con5 .txt{width:970px}
.product .other .con5 .name{margin-bottom:5px;font-weight:bold;font-size:16px;color:#344455}
.product .other .con5 .name:hover{color:#03407E}
.product .other .con5 .note{font-size:14px}
.product .other .con5 .btn{display:block;width:90px;height:45px;background:url(../images/52.png) no-repeat center center;border-radius:50px}
.product .other .con5 .btn:hover{background:url(../images/60.png) no-repeat center center}

@media only screen and (max-width:750px){
    .product .other .con5 .item{padding:20px 0;}
    .product .other .con5 .icon{width:60px;height:60px;border:0;margin-right:10px}
    .product .other .con5 .txt{width:calc(100% - 70px)}
    .product .other .con5 .name{margin-bottom:0;font-size:14px;}
    .product .other .con5 .name:hover{color:#344455}
    .product .other .con5 .note{display:none}
    .product .other .con5 .btn{display:none}
}