
:root{
    --Primary-color:#d6000f;
    --Secondary-color:#d6000f;

    --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;

}

.textColor{color: #d6000f;}
.textColorGray{color: #666666;}
.textCenter{text-align: center;}

.flex{display:-ms-flexbox;display:flex;}
.flexWrap{-ms-flex-wrap: wrap;flex-wrap: wrap;}
.alignCenter{-ms-flex-align:center;align-items:center;}
.justifyCenter{-ms-flex-pack:center;justify-content:center;}

img{display: inline-block;}
a:hover{color:#d6000f;}

.noDate{display:block;width:100%;}
/*
按钮结构 
<a href="##" class="primary_btn">
    <div class="btn_container">
        <div class="button_text" data-text="探索全部">探索全部</div>
    </div>
</a>
*/

a{color:#666666;}
.black a{color: #fff;}
a:hover{color:#d6000f;}

.primary_btn {
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    text-decoration: none;
    overflow: visible;
    width:150px;height:46px;
    -ms-flex-align: center;
    align-items: center;-ms-flex-pack: center;justify-content: center;
    border:1px solid #eee;color:#999;
    margin-left:auto;margin-right:auto;
}
.primary_btn:hover{background-color: var(--Primary-color);border-color: var(--Primary-color);color:var(--color-white);}
.primary_btn .btn_container {
    z-index: 5;
    position: relative;
    overflow: hidden;
}
.primary_btn .button_text {
    text-align: center;
    letter-spacing: 0;
    font-size: 16px;
    position: relative;
    transition:all 0.3s ease-in-out;
}
.primary_btn .button_text:after{
    content: attr(data-text);
    position: absolute;
    transform: translateY(100%);
    left:0px;top:0px;color:#fff;
}
.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:120px;height: 34px;font-size: 14px;}
    .primary_btn .button_text{font-size: 14px;}
}
@media screen and (max-width: 768px) {
    .primary_btn {width:120px;height: 34px;}
    .primary_btn .button_text{font-size: 14px;}
}


/* 
图片结构,放大效果
<div class="HoverImg img">
    <a href="##"><img src="img/qimg1.jpg" alt=""></a>
</div>
*/
img{display: inline-block;}
.HoverImg{overflow: hidden;}
.HoverImg img{width:100%;height:100%;font-family:"object-fit: cover";object-fit: cover;transition: all 0.3s ease-in-out;}
.HoverImg:hover img{transform: scale(1.05);}


/* 
轮播图左右切换按钮结构

<div class="sw_btn_all mt40">
    <div class="swiper_button swiper-button-prev">
        <svg class="icon-control icon-control-chevronleft" xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 36 36">
            <path
                d="m20 25c-.3838 0-.7676-.1465-1.0605-.4395l-5.5-5.5c-.5859-.5854-.5859-1.5356 0-2.1211l5.5-5.5c.5859-.5859 1.5352-.5859 2.1211 0 .5859.5854.5859 1.5356 0 2.1211l-4.4395 4.4395 4.4395 4.4395c.5859.5854.5859 1.5356 0 2.1211-.293.293-.6768.4395-1.0605.4395z">
            </path>
        </svg>
    </div>
    <div class="swiper_button swiper-button-next">
        <svg class="icon-control icon-control-chevronright" xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 36 36">
            <path
                d="m22.5597 16.9375-5.5076-5.5c-.5854-.5854-1.5323-.5825-2.1157.0039-.5835.5869-.5815 1.5366.0039 2.1211l4.4438 4.4375-4.4438 4.4375c-.5854.5845-.5874 1.5342-.0039 2.1211.2922.2944.676.4414 1.0598.4414.3818 0 .7637-.1455 1.0559-.4375l5.5076-5.5c.2815-.2812.4403-.6636.4403-1.0625s-.1588-.7812-.4403-1.0625z">
            </path>
        </svg>
    </div>
</div>
*/
.swiper-slide{height:auto;}
.sw_btn_all{display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-ms-flex-pack: center;justify-content: center;-ms-flex-align: center;align-items: center;}
.sw_btn_all .swiper_button{
    bottom:0px;top:auto;position:static;margin:0 15px;width:50px;height:50px;
    padding:0;border:0;border-radius:0;background:url(../img/about/btn_bg.png) no-repeat center;background-size:cover;cursor:pointer;
}
.sw_btn_all .swiper_button:after{color:var(--Primary-color);}
.sw_btn_all .swiper_button:hover,
.sw_btn_all .swiper_button:focus-visible{background-image:url(../img/about/btn_bgH.png);outline:none;background-size:cover;}
.sw_btn_all .swiper_button:hover:after,
.sw_btn_all .swiper_button:focus-visible:after{color:var(--color-white);}

.swiper_button{
    width:50px;height: 50px;transition:all 0.3s ease-in-out;position: relative;border:1px solid #fff;border-radius: 100%;
    margin-top: 0px;
}
.swiper_button:after{font-size: 18px;color:#fff;}
/* .swiper_button:hover{background: #fff;} */
.swiper_button:hover:after{color:#d6000f;}

.swiper_button path{fill:rgba(0, 0, 0, 0.56);}
.swiper_button:hover path{fill:rgba(0, 0, 0, 0.64);}

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

/* 
全站公共标题结构 - 公共tab切换结构
			<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: #d6000f;}
.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: -ms-flexbox;display: flex;-ms-flex-pack: center;justify-content: center;}
.publicTab ul{display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;width:100%;-ms-flex-pack: center;justify-content: center;}
.publicTab li{-ms-flex:1;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: #d6000f;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:#d6000f;}
.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{-ms-flex-pack: start;justify-content: left;}
    .publicTab li{-ms-flex:0 0 50%;flex:0 0 50%;}
}


/* 

全站 右侧浮窗结构

<div class="pubLink">
		<ul>
			<li>
				<svg t="1773739277151" class="icon" viewBox="0 0 1024 1024" version="1.1"
					xmlns="http://www.w3.org/2000/svg" p-id="2568" width="26" height="26">
					<path
						d="M950.595176 860.45418l-42.041512 41.905412c-17.171078 17.132192-38.510082 30.80561-63.568804 40.721447-27.544333 10.965749-58.489112 16.220427-91.556229 16.220427-126.97081 0.058328-327.609433-118.322849-460.567607-250.898307C125.240399 541.256324 24.808012 311.264163 77.885881 178.231287c7.756661-19.479657 18.524912-36.791951 31.339776-52.000328l-0.034792-0.068562 2.724041-4.397147c1.212618-1.987261 2.62785-3.784186 4.224208-5.377474l44.115754-43.953048c11.180644-11.241019 29.348422-11.241019 40.525995 0l19.863397 19.793812 173.040055 172.582637c11.178597 11.106965 11.178597 29.200042-0.034792 40.370453l-46.264697 46.196135-31.461549 31.379685c0 0-16.463973 105.217367 100.734262 222.068701 117.194142 116.799146 222.2355 100.882642 222.2355 100.882642l78.205153-78.004585c11.178597-11.17041 29.370935-11.17041 40.516786 0L950.560384 820.019259C961.759447 831.199902 961.759447 849.281723 950.595176 860.45418L950.595176 860.45418zM950.595176 860.45418"
						fill="#e3e3e6" p-id="2569"></path>
				</svg>
				<div class="p">
					<svg t="1773739277151" class="icon" viewBox="0 0 1024 1024" version="1.1"
						xmlns="http://www.w3.org/2000/svg" p-id="2568" width="46" height="46">
						<path
							d="M950.595176 860.45418l-42.041512 41.905412c-17.171078 17.132192-38.510082 30.80561-63.568804 40.721447-27.544333 10.965749-58.489112 16.220427-91.556229 16.220427-126.97081 0.058328-327.609433-118.322849-460.567607-250.898307C125.240399 541.256324 24.808012 311.264163 77.885881 178.231287c7.756661-19.479657 18.524912-36.791951 31.339776-52.000328l-0.034792-0.068562 2.724041-4.397147c1.212618-1.987261 2.62785-3.784186 4.224208-5.377474l44.115754-43.953048c11.180644-11.241019 29.348422-11.241019 40.525995 0l19.863397 19.793812 173.040055 172.582637c11.178597 11.106965 11.178597 29.200042-0.034792 40.370453l-46.264697 46.196135-31.461549 31.379685c0 0-16.463973 105.217367 100.734262 222.068701 117.194142 116.799146 222.2355 100.882642 222.2355 100.882642l78.205153-78.004585c11.178597-11.17041 29.370935-11.17041 40.516786 0L950.560384 820.019259C961.759447 831.199902 961.759447 849.281723 950.595176 860.45418L950.595176 860.45418zM950.595176 860.45418"
							fill="#e3e3e6" p-id="2569"></path>
					</svg>
					<span>(0591) 8538-3777</span>
				</div>
			</li>
			<li>
				<a href="/category/contact.html" one-link-mark="yes">
					<svg t="1774537537478" class="icon" viewBox="0 0 1024 1024" version="1.1"
						xmlns="http://www.w3.org/2000/svg" p-id="6880" width="28" height="28">
						<path
							d="M512 61.44c178.14528 0 358.4 145.24416 358.4 324.4032C870.4 565.00224 591.79008 962.56 512 962.56c-79.79008 0-358.4-397.55776-358.4-576.7168C153.6 206.68416 333.85472 61.44 512 61.44z m0 215.04c-73.5232 0-133.12 59.5968-133.12 133.12s59.5968 133.12 133.12 133.12 133.12-59.5968 133.12-133.12-59.5968-133.12-133.12-133.12z"
							fill="#e3e3e6" p-id="6881"></path>
					</svg>
					<p>联系我们</p>
				</a>
			</li>
			<li class="ToTop">
				<svg t="1773892244660" class="icon" viewBox="0 0 1024 1024" version="1.1"
					xmlns="http://www.w3.org/2000/svg" p-id="16863" width="28" height="28">
					<path
						d="M173.568 732.416c-13.056 0-26.24-4.992-36.224-14.976-19.968-19.968-19.968-52.352 0-72.448l338.432-338.432c19.968-19.968 52.352-19.968 72.448 0s19.968 52.352 0 72.448L209.792 717.44c-9.984 9.984-23.168 14.976-36.224 14.976z"
						p-id="16864" fill="#e3e3e6"></path>
					<path
						d="M850.432 732.416c-13.056 0-26.24-4.992-36.224-14.976L475.776 379.008c-19.968-19.968-19.968-52.352 0-72.448 19.968-19.968 52.352-19.968 72.448 0l338.432 338.432c19.968 19.968 19.968 52.352 0 72.448-9.984 9.984-23.168 14.976-36.224 14.976z"
						p-id="16865" fill="#e3e3e6"></path>
				</svg>
			</li>
		</ul>
	</div>
*/
.pubLink{
    position:fixed;top:50%;right:20px;transform:translateY(-50%);z-index: 9999999;
}
.pubLink li{
    cursor:pointer;overflow: hidden;
    border-radius: 8px;background-color: #414346;width:50px;height:50px;margin-bottom: 10px;position: relative;
    display: -ms-flexbox;
    display: flex;-ms-flex-align: center;align-items: center;-ms-flex-pack: center;justify-content: center;transition: all 0.3s ease-in-out;
}
.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: -ms-flexbox;
    display: flex;-ms-flex-align: center;align-items: center;-ms-flex-pack: 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;}


.pubLink li p{
    opacity: 0;
    position: absolute;right:0px;top:0px;background: #e52c17;color:#fff;
    display: -ms-flexbox;
    display: flex;padding:8px 6px 5px;-ms-flex-align: center;align-items: center;-ms-flex-pack: center;justify-content: center;font-size: 16px;line-height: 1.1;
    text-align: center;height: 100%;transition: all 0.3s ease-in-out;
}
.pubLink li:hover p{opacity: 1;}

@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;}
}


/* 
弹窗效果
html:
<a class="js_popUpsBtn" href="javascript:;">
    <span>立即申请</span>
</a>


<div class="pop-upsCon">
    <div class="vid_dom">
        <div class="close"></div>
        <div class="top pb40 pt50 textColorGray">

        </div>
        <div class="bottom pt40 pb60 textColorGray">

        </div>
    </div>
</div>

js:
$(document).on('click', '.js_popUpsBtn', function () {
    $('.pop-upsCon').show();
})
$(document).on('click', '.pop-upsCon .close', function () {
    $('.pop-upsCon').hide();
})
*/
.pop-upsCon {
    position: fixed;top: 0px;left: 0px;right: 0px;bottom: 0px;overflow: hidden;background: rgba(0, 0, 0, 0.8);display: none;z-index: 999999;
    .vid_dom {width:90%;border-radius: 10px;max-width: 850px;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);background-color: #fff;}

    .close {position: absolute;top: 10px;right: 10px;width: 40px;height: 40px;cursor: pointer;background: #fff;border-radius: 100%;cursor: pointer;z-index: 2;}
    .close:after {content: '';display: block;position: absolute;left: 50%;top: 50%;width: 20px;height: 1px;background: #595959;transform: translateX(-50%) rotate(45deg);}
    .close:before {content: '';display: block;position: absolute;left: 50%;top: 50%;width: 20px;height: 1px;background: #595959;transform: translateX(-50%) rotate(135deg);}
}

@media screen and (max-width: 768px) {
  .pop-upsCon .vid_dom{width:90%;}
  .pop-upsCon .close{width:24px;height:24px;}
  .pop-upsCon .close:before{width:15px;}
  .pop-upsCon .close:after{width:15px;}
}

/* 
cms项目 分页
<div class="p_page wrap1600 justifyCenter flex flex-wrap mt50" id="page">
    <div name="laypage1.3" class="laypage_main laypageskin_default" id="laypage_0">
        <span class="laypage_curr">1</span>
        <a href="javascript:;" data-page="2" one-link-mark="yes">2</a>
        <a href="javascript:;" data-page="3" one-link-mark="yes">3</a>
        <a href="javascript:;" data-page="4" one-link-mark="yes">4</a>
        <span>…</span>
        <a href="javascript:;" data-page="5" one-link-mark="yes">5</a>
        <a href="javascript:;" class="laypage_next" data-page="2" one-link-mark="yes">></a>
    </div>
</div>
*/


.p_page {
  text-align: center;
  padding: 2% 0 2%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
}
.p_page div{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.p_page .laypage_prev,.p_page .laypage_next{width:42px!important;}
.p_page .laypage_prev svg{vertical-align: middle;}
.p_page .laypage_next svg{vertical-align: middle;}
.p_page .laypage_prev:hover svg path{fill:#fff;}
.p_page .laypage_next:hover svg path{fill:#fff;}
.p_page .laypage_curr{background:#d6000f!important;color:#fff!important;border-color:#d6000f!important;}

.p_page a,.p_page span {
  display: -ms-flexbox;
  display: flex;
  border: 1px solid #ebebeb !important;
  box-sizing: border-box;
  width: 42px !important;
  height: 42px !important;
  text-align: center;
  line-height: 42px !important;
  color: #808080 !important;
  font-size: 16px;
  margin: 0 4px !important;
  border-radius: 6px;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.p_page .laypage_total{width:auto!important;border:0px!important;}
.p_page .laypage_total input{border: 1px solid #ebebeb ;}
.p_page .laypage_main button{background:#d6000f;border:0;color:#fff;border-radius:6px;height:42px;font-size:14px;}
.p_page a:hover {background:#d6000f!important;border-color:#d6000f!important;color:#fff!important;}
.p_page .page_prev {color: #818286;}
.p_page .page_next {color: #818286;}
.laypageskin_default .laypage_curr{color:#fff;}
.laypage_main *{font-size:16px;}
.laypage_main input{height:42px;width:42px;border-radius:6px;}

@media screen and (max-width: 768px) {
  .p_page {margin-bottom: 8vw;}
  .p_page div{-ms-flex-wrap:wrap;flex-wrap:wrap;}
  .p_page a,.p_page span {
      width: 30px !important;
      height: 30px !important;
      font-size: 12px;
      margin: 0 3px !important;
      line-height: 30px!important;
      border-radius: 4px;
  }
  .p_page .laypage_prev,.p_page .laypage_next{width:30px!important;}
  .laypage_main a, .laypage_main span{padding:0 3px!important;}
  .p_page .laypage_total{display: block;width:160px!important;margin-top:5vw!important;}
  .laypage_main button{height:22px!important;line-height: 22px!important;margin-top:2px;margin-left:15px;}
  .laypage_main input{width:30px;height:30px;}
}


/* 弹窗 */
/* 
<div class="tan_con tan_conCss">
    <div class="vid_dom">
        <div class="close"></div>
        <div class="top pb40 pt50 textColorGray">
            <h3 class="fnt40">在线留言</h3>
        </div>
        <div class="bottom pt40 pb60 textColorGray">
            <div class="formCon">
                <ul class="flex flexWrap">
                    <li>
                        <h3 class="fnt18">*姓名：</h3>
                        <input type="text" placeholder="请输入姓名" />
                    </li>
                    <li>
                        <h3 class="fnt18">*电话：</h3>
                        <input type="text" placeholder="请输入手机号" />
                    </li>
                    <li>
                        <h3 class="fnt18">*公司名称：</h3>
                        <input type="text" placeholder="请输入公司名称" />
                    </li>
                    <li>
                        <h3 class="fnt18">*邮箱：</h3>
                        <input type="text" placeholder="请输入邮箱" />
                    </li>
                </ul>
                <dl class="flex flexWrap">
                    <dt>
                        <h3 class="fnt18">留言：</h3>
                        <textarea id="" cols="30" rows="10" placeholder="请输入留言内容" name="note1"
                            lay-verify="required"></textarea>
                    </dt>
                </dl>
            </div>
            <div class="formBtn mt40">
                <a href="javascript:;" class="primary_btn">
                    <div class="btn_container">
                        <div class="button_text" data-text="立即提交">立即提交</div>
                    </div>
                </a>
            </div>
        </div>
    </div>
</div>
*/

.tan_con {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  z-index: 999999;
}
.tan_con .vid_dom {
  width: 90%;
  border-radius: 5px;
  max-width: 850px;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: #fff;
}
.tan_con .close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  cursor: pointer;
  background: #fff;
  border-radius: 100%;
  cursor: pointer;
  z-index: 2;
}
.tan_con .close:after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 20px;
  height: 1px;
  background: #595959;
  -webkit-transform: translateX(-50%) rotate(45deg);
      -ms-transform: translateX(-50%) rotate(45deg);
          transform: translateX(-50%) rotate(45deg);
}
.tan_con .close:before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 20px;
  height: 1px;
  background: #595959;
  -webkit-transform: translateX(-50%) rotate(135deg);
      -ms-transform: translateX(-50%) rotate(135deg);
          transform: translateX(-50%) rotate(135deg);
}

@media screen and (max-width: 768px) {
  .tan_con .vid_dom {
    width: 90%;
  }
  .tan_con .close {
    width: 24px;
    height: 24px;
  }
  .tan_con .close:before {
    width: 15px;
  }
  .tan_con .close:after {
    width: 15px;
  }
}

.tan_conCss .top {
  border-bottom: 1px solid #eee;
  text-align: center;
}
.tan_conCss .top h3 {
  font-weight: 700;
  margin-bottom: 10px;
}

.tan_conCss .bottom {
  padding-left: 50px;
  padding-right: 50px;
}
.tan_conCss .bottom h3 {
  margin-bottom: 10px;
}
.tan_conCss .bottom input {
  border-radius: 8px;
  border: 1px solid #eee;
  width: 100%;
  height: 45px;
  display: block;
  padding-left: 20px;
  color: #929292;
}
.tan_conCss .bottom input::-webkit-input-placeholder {
  opacity: 0.5;
  color: #929292;
}
.tan_conCss .bottom input::-moz-placeholder {
  opacity: 0.5;
  color: #929292;
}
.tan_conCss .bottom input:-ms-input-placeholder {
  opacity: 0.5;
  color: #929292;
}
.tan_conCss .bottom input::-ms-input-placeholder {
  opacity: 0.5;
  color: #929292;
}
.tan_conCss .bottom input::placeholder {
  opacity: 0.5;
  color: #929292;
}
.tan_conCss .bottom textarea {
  border-radius: 10px;
  border: 1px solid #eee;
  width: 100%;
  height: 115px;
  display: block;
  padding: 10px;
}
.tan_conCss .bottom .formCon {
  max-height: 50vh;
}
.tan_conCss .bottom li {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 46%;
          flex: 0 0 46%;
  margin-right: 8%;
  margin-bottom: 4%;
}
.tan_conCss .bottom li:nth-of-type(2n) {
  margin-right: 0px;
}
.tan_conCss .bottom dl {
  gap: 10px;
}
.tan_conCss .bottom dt {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.tan_conCss .bottom dd {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 115px;
          flex: 0 0 115px;
  position: relative;
}

.tan_conCss .formBtn {
  text-align: center;
}
.tan_conCss .nicescroll-rails {
  background-color: #eee;
  -webkit-transform: translateX(10px);
      -ms-transform: translateX(10px);
          transform: translateX(10px);
}
.tan_conCss .layui-form-select dl dd.layui-this {
  background: var(--main-color);
}

@media screen and (max-width: 768px) {
  .tan_conCss .bottom .formCon {
    height: auto;
  }
  .tan_conCss .bottom {
    padding: 5vw;
    padding-bottom: 10vw;
  }
  .tan_conCss .bottom li {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    margin-right: 0px;
  }
}