
:root{
    --Primary-color:#115fad;
    --Secondary-color:#e52c17;

    --color-black:#333333;
    --color-gray:#666666;
    --color-white:#ffffff;
    --color-grayWhite:rgba(255,255,255,0.8);
    
    --Footer-color:#223560;

    --color-text-primary:var(--color-black);
    --color-text-secondary:var(--color-gray);
    --color-text-inverse-primary:var(--color-white);
    --color-text-inverse-secondary:var(--color-grayWhite);

    --lineHeight:1;
    --inputHeight:90px;

}
/* 
<a href="##" class="primary_btn">
    <div class="btn_container">
        <div class="button_text" text="探索全部">探索全部</div>
    </div>
</a>
*/

a{color:var(--color-gray);}
.black a{color: #fff;}
a:hover{color:var(--Secondary-color);}
.primary_btn {
    display: flex;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    overflow: visible;
    width:200px;height:50px;
    align-items: center;justify-content: center;
    border:1px solid #aaa;border-radius: 6px;
    margin-left:auto;margin-right:auto;
}
.primary_btn:hover{background-color: #fff;}
.primary_btn .btn_container {
    z-index: 5;
    position: relative;
    overflow: hidden;
}
.primary_btn .button_text {
    text-align: center;
    letter-spacing: 0;
    font-size: 16px;
    font-weight: 500;
    position: relative;
    transition:all 0.3s ease-in-out;
}
.primary_btn .button_text:after{
    content: attr(text);
    position: absolute;
    transform: translateY(100%);
    left:0px;top:0px;color:var(--Secondary-color);
}
.primary_btn:hover .button_text{transform:translateY(-100%);}

.whiteBtn .primary_btn{background-color: #e52c17;border-color: transparent;color:#fff;}
.whiteBtn .primary_btn:hover{background-color: #e52c17;color:#fff;}
.whiteBtn .primary_btn .button_text:after{color:#fff;}
.whiteBtn .primary_btn:hover .button_text:after{color:#fff;}

@media screen and (max-width: 1600px) {
    .primary_btn {width:170px;height: 44px;}
    .primary_btn .button_text {
        font-size: 14px;
    }
}
@media screen and (max-width: 768px) {
    .primary_btn {width:140px;height: 44px;}
    .primary_btn .button_text{font-size: 14px;}
}
/* 
<li class="HoverImg">
    <h3 class="fnt24">乘用车玻璃</h3>
    <a href="##"><img src="img/qimg1.jpg" alt=""></a>
</li>
*/
img{display: inline-block;}
.HoverImg{overflow: hidden;}
.HoverImg img{width:100%;height:100%;object-fit: cover;transition: all 0.3s ease-in-out;}
.HoverImg:hover img{transform: scale(1.05);}


/* 
<div class="sw_btn_all mt50">
    <div class="swiper_button swiper-button-prev"></div>
    <div class="swiper_button swiper-button-next"></div>
</div>
*/
.swiper-slide{height:auto;}
.sw_btn_all{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
.sw_btn_all .swiper_button{bottom:0px;top:auto;position:static;margin:0 10px;} 

.swiper_button{width:50px;height: 50px;transition:all 0.3s ease-in-out;position: relative;border:1px solid #fff;border-radius: 100%;}
.swiper_button:after{font-size: 18px;color:#fff;}
.swiper_button:hover{background: #fff;}
.swiper_button:hover:after{color:var(--Secondary-color);}

@media screen and (max-width: 1600px) {
    .swiper_button{width:40px;height:40px;}
    .swiper_button svg{width:18px;}
}
@media screen and (max-width: 1300px) {
    .swiper_button::before{font-size: 40px;line-height: 1;}
}

/* 
			<div class="publicTitle">
				<h3 class="fnt34">中国大陆-福建福耀汽车玻璃 销售有限公司</h3>
			</div>

			<div class="publicTitle titleCenter">
				<h3 class="fnt34">中国大陆-福建福耀汽车玻璃 销售有限公司</h3>
				<div class="p fnt16">中国大陆-福建福耀汽车玻璃中国大陆-福建福耀汽车玻璃中国大陆-福建福耀汽车玻璃中国大陆-福建福耀汽车玻璃中国大陆-福建福耀汽车玻璃中国大陆-福建福耀汽车玻璃
				</div>
			</div>

			<div class="publicTab">
				<ul>
					<li class="fnt24 active"><a href="##">全球布局</a></li>
					<li class="fnt24"><a href="##">中国布局</a></li>
				</ul>
			</div>
*/
.publicTitle h3{position: relative;color:#333;font-weight: 700;padding-bottom: 22px;}
.publicTitle h3:after{content: "";display: block;position:absolute;left:0px;bottom:0px;width:50px;height:5px;background: var(--Secondary-color);}
.publicTitle .p{color: #666;margin-top: 22px;}

.publicTitle.titleCenter{text-align: center;}
.publicTitle.titleCenter h3:after{left:50%;transform:translateX(-50%);}

@media screen and (max-width: 1600px) {
    .publicTitle h3{padding-bottom: 1.2vw;}
    .publicTitle h3:after{width:40px;height: 4px;}
    .publicTitle .p{margin-top: 1.2vw;}
}
@media screen and (max-width: 1200px) {
    .publicTitle h3{padding-bottom: 18px;}
    .publicTitle h3:after{width:34px;height: 3px;}
    .publicTitle .p{margin-top: 18px;}
}
.publicTab{display: flex;justify-content: center;}
.publicTab ul{display: flex;flex-wrap: wrap;width:100%;justify-content: center;}
.publicTab li{flex:1;max-width:360px;text-align: center;border-bottom: 2px solid #eee;position: relative;}
.publicTab li:after{content: "";display: block;position:absolute;left:50%;bottom:-2px;width:0%;height:2px;background: var(--Secondary-color);transform:translateX(-50%);transition:all 0.3s ease-in-out;}
.publicTab li a{display:block;padding:22px 10px 17px;line-height: 1.5;}
.publicTab li:hover:after{width:100%;}
.publicTab li.active a{color:var(--Secondary-color);}
.publicTab li.active:after{width:100%;}
@media screen and (max-width: 1600px) {
    .publicTab li a{padding:1.2vw 10px;}
}
@media screen and (max-width: 1200px) {
    .publicTab li a{padding:20px 10px 16px;}
}
@media screen and (max-width: 700px) {
    .publicTab ul{justify-content: left;}
    .publicTab li{flex:0 0 50%;}
}


.pubLink{
    position:fixed;top:50%;right:20px;transform:translateY(-50%);z-index: 9999999;
}
.pubLink li{
    cursor:pointer;display: flex;
    border-radius: 8px;background-color: #414346;width:50px;height:50px;margin-bottom: 10px;position: relative;
    display: flex;align-items: center;justify-content: center;transition: all 0.3s ease-in-out;
}
.pubLink li a{display:flex;}
.pubLink li .p{
    opacity: 0;visibility: hidden;transition:all 0.3s ease-in-out;
    position: absolute;right:0px;top:0px;width:200px;background: #e52c17;color:#fff;height: 100%;border-radius: 8px;
    display: flex;align-items: center;justify-content: center;padding:10px;font-weight: 700;
}
.pubLink li .p svg{width:26px;height:26px;margin-right: 6px;}
.pubLink li .p svg path{fill:#fff;}
.pubLink li:hover{background-color: #e52c17;}
.pubLink li:hover path{fill:#fff;}
.pubLink li:hover .p{opacity: 1;visibility: visible;}
@media screen and (max-width: 700px) {
    .pubLink{right:0px;}
    .pubLink li{width:40px;height:40px;}
    .pubLink li svg{width:20px;height:20px;}
    .pubLink li .p svg{width:20px;height:20px;}
}

.pub_detail .top {
  border-bottom: 1px solid #eee;
          justify-content: center;
}
.pub_detail .top h1 {
  letter-spacing: 3.5px;
}
.pub_detail .bottom {
  max-width: 1100px;
  width: 80%;
}
.pub_detail .bottom p {
  margin-bottom: 20px;
  line-height: 1.6;
  color: #666;
}


.p_page{
    text-align: center;
    margin-top: 40px;
    font-size: 16px;
}
.laypage_main a, .laypage_main span{
    margin: 0 10px 6px;
}
.laypage_main a, .laypage_main input, .laypage_main span{
    font-size: 14px!important;
}
.laypage_main button, .laypage_main input, .laypageskin_default a{
    border: 1px solid #ccc
}
.laypage_main a.laypage_next,.laypage_main a.laypage_prev{
   
    color:#A5A5A5;
    width: auto!important;
}
.laypageskin_default .laypage_curr{
    background: #e52c17!important;
    color: #fff!important;
}
.layui-form-select dl dd.layui-this{
    background: #e52c17!important;
    color: #fff!important;
}



@media only screen and (max-width: 1100px) {
  .pub_detail .top {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: end;
  }

  .pub_detail .bottom {
    width: 100%;
  }

}

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


