 
 
 
 /* Style of square magnify area under the cursor */
.MagicZoomPup {
border: 1px solid #aaa;
background: #fff;
cursor:url(graphics/zoomin.cur),pointer;
}

/* Style of loading message and icon shown during load */
.MagicZoomLoading {
border: 1px solid #ccc;
background: #fff url(graphics/loader.gif) no-repeat 2px 50%;
padding: 4px 4px 4px 24px !important;
margin: 0;
text-decoration: none;
text-align: left;
line-height: 1.5em;
font-size: 8pt;
font-family: sans-serif;
color: #444;
}

.x-a{width: 100%;font-size: 0;text-align: center;margin-top: .6rem;margin-bottom: 0.65rem; }
.x-b{width: 100%;margin: 0 auto; }
.x-c{display: inline-block;width: 100%;vertical-align: top;}
.x-d{margin-bottom: 0.25rem;}
.x-e{width: 100%;position: relative;}
.x-e:hover{overflow: visible;}
.x-e:hover .swiper-slide{visibility: hidden !important;}
.x-e:hover .swiper-slide.swiper-slide-active{visibility: visible !important;}
.x-e:hover .swiper-slide .MagicZoomPlusHint{visibility: hidden !important;}
.MagicZoomPlusHint{visibility: hidden !important;}
.x-e:hover .swiper-slide.swiper-slide-active .MagicZoomPlusHint{visibility: visible !important;}
.x-e img{max-width: none;}
.x-g{width: 100%;cursor: pointer;   background-color: #f4f4f4;}
.x-g1{display: inline-block;}
.x-g1{width: 100% !important;height: 100% !important;}
.x-g1 img{width: 100%; display:block;}
.x-h{width: 85%; margin:0 auto;position: relative;}
.x-i{width:calc(100% - .4rem) ;}
.x-k{width: 25%; padding: 0 2%; }
.x-k1{cursor: pointer; width: 100%;  } 
.x-k img{display: inline-block;max-width:98%; border:1px solid #ccc}
.x-k.active .x-k1 img { border:1px solid #333333}
.product2 .x-l{left:-25px;opacity: 1; top: 54%; width:40px;height:40px;background-image:none}
.product2 .x-l::before{    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    display: block;
    content: "\e660";
    font-family: "iconfont2" !important;
    color: #000;
    font-size: 20px;}
.product2 .x-l:hover::before{     color: #124ba3; }
.product2 .x-m{right: -25px;opacity: 1; top: 54%;  width:40px;height:40px;background-image:none}
.product2 .x-m::before{    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    display: block;
    content: "\e660";
    font-family: "iconfont2" !important;
    color: #000;
    font-size: 20px;    transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);}
.product2 .x-m:hover::before{     color: #124ba3; }

 

.x-n{display: inline-block;vertical-align: top;text-align: left; width: 6.48rem; padding-top: .25rem;padding-left: .5rem;}
.x-o{color: #333333;font-size: calc(12px - 0.12rem + 0.3rem);margin-bottom: .5rem;}
.x-p{color: #666666;font-size: calc(12px - 0.12rem + 0.18rem);line-height: 1.5; margin-bottom: .5rem;}
.x-q{color: #666666;font-size: calc(12px - 0.12rem + 0.18rem);line-height: 1.8;}
.x-r{width: 100%;margin-top: 0.45rem;margin-bottom: 0.4rem;}
.x-s{display: inline-block;cursor: pointer;width: 9em;height: 2.5em;text-align: center;margin-right: .35rem; line-height: 2.5em; color: #ffffff;font-size: calc(12px - 0.12rem + 0.16rem);background-color: #004cab;border-radius: .2rem;}
.x-s1{display: inline-block;vertical-align: middle; width: 1.375em;height: 1.375em;margin-right: .08rem;}
.x-s img{max-width: 100%;max-height: 100%;}
.x-s2{display: inline-block;vertical-align: middle;}
.x-s:hover{background-color: #f7ba00;}
.x-t{color: #666666;font-size: calc(12px - 0.12rem + 0.16rem);}
.x-t1{display: inline-block;vertical-align: middle;margin-right: .1rem;}
.x-t2{display: inline-block;vertical-align: middle;width: 1.6em;height: 1.25em;line-height: 1.25em;margin: 0 .1rem;cursor: pointer;}
.x-t2 img{max-width: 100%;max-height: 100%;}
@media(max-width:1500px){
 
	.x-g1 img { height:auto;}
	.x-g { height:auto;  line-height:auto;}
	.x-l{ width:.28rem;height: 0.52rem; }
	.x-m{ width:.28rem;height: 0.52rem; }
}





@media(max-width:900px){
    .x-b{width: 100%;} 
	.x-l {  width: 1.5rem;  height: 1.9rem;}
	.x-m {  width: 1.5rem;  height: 1.9rem;}
	
	
	
}
@media(max-width:500px){
    .x-b{width: 100%;} 
    .x-s{margin-right: .1rem;}
}

@media(max-width:370px){
    .x-c{width: 100%;}
    .x-d{width: 100%;}
    .x-h{width:100%;}
}
 