/*lszp style.css */
.pc{display: block;}
.m{display: none;}

input:focus, textarea:focus{border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.colbf1{color: #bf1733}

.header-box{width: 100%;height: 80px;z-index:99;position: fixed; top: 0; left: 0}

.header-box.header-v2{background-color: #FFF;box-shadow: 0 4px 8px rgba(0,0,0,0.08);}

.header-wrap{display: flex; justify-content: space-between; align-items: center;}
.header-wrap .logo{width: 30px}

.header-wrap .menu{position: relative;z-index: 2;margin:0px 0 0 60px; display: flex; justify-content: space-between; width: 52%}
.header-wrap .menu li.menuli{font-size:14px;line-height: 80px;position: relative;z-index: 2;width:100px;text-align: center;}
.header-wrap .menu li.menuli:last-child{margin-right: 0px;}
.header-wrap .menu li.menuli .top-a{color: #2c2c2c}
.header-box:hover .menu li.menuli .top-a{color: #2c2c2c}
.header-wrap .menu li.menuli:hover .top-a,.header-wrap .menu li.active .top-a{color: #df002b !important;}

.header-wrap .menu.zmenu li.menuli .top-a{color: #FFF}

.menu-nav{position: absolute;background:#fff;overflow: hidden;top:90px;left:-50%;width:190%;text-align: center;z-index: 999;display: none;transition:all .6s;}
.menu-nav a{font-size: 14px;line-height: 40px;border-top: 1px solid #eee;display: block;color: #333333;}
.menu-nav a:hover{background-color: rgba(9, 155, 5, .7);color: #fff !important;}
.menu-nav a.active{background-color: rgba(9, 155, 5, .7);color: #fff !important;}
.header-wrap .menu li.menuli:hover .menu-nav{display: block;}

.hlink{display: flex; align-items: center;margin-left:45px;position: relative;}
.hlink a{width: 100%;position: relative;line-height: 42px;height: 42px;text-align: center;color: #333;font-size: 16px;display: inline-block;}
.hlink a svg{display: inline-block; position: absolute;transition: all 0.5s; top: -4px; right: -26px; width: 30px} 
.hlink a:hover{color: #df002b}
.hlink a:hover svg{transform: rotate(180deg);}

.header-box.header-v2 .header-wrap .menu.zmenu li.menuli .top-a{color: #2c2c2c}

.i-banner{}
.i-banner .banner{width: 100%; position: relative; overflow: hidden;}
.i-banner .banner .banner-box{width: 100%; font-size: 0}
.i-banner .banner .banner-box img{width: 100%}
.i-banner .banner .titbox{position: absolute; left:  5rem; top: 45%}
.i-banner .banner .titbox .tit{font-size: 24px;color: #2c2c2c}
.i-banner .banner .titbox .subtit{font-size: 13px; font-family: 'Msn'}

.i-banner .banner .titbox.ztitbox{color: #FFF}
.i-banner .banner .titbox.ztitbox .tit{color: #FFF}

.i-banner .banner .titbox.zplace{top: 30%; width: 40%}
.i-banner .banner .titbox.zplace .tit{padding-bottom: 20px}

.i-banner .banner .titbox.fran{color: #FFF; left:  5rem; top: 12%}
.i-banner .banner .titbox.fran .tit{color: #FFF; text-shadow: 0 0 2px rgba(255,255,255,0.75), 0 0 4px rgba(255,255,255,0.4), 2px 2px 5px rgba(0,0,0,0.7);}
.i-banner .banner .titbox.fran .hotline{padding-top: 3rem; }
.i-banner .banner .titbox.fran .ct-line{display:flex;align-items:center;gap:6px; font-size: 12px;text-shadow: 0 0 2px rgba(255,255,255,0.75), 0 0 4px rgba(255,255,255,0.4), 2px 2px 5px rgba(0,0,0,0.7); font-family: 'Msn'}
.i-banner .banner .titbox.fran .ct-line svg{width: 18px}
.i-banner .banner .titbox.fran .mailway{padding-top: 2rem; }
.i-banner .banner .titbox.fran .hottxt{ font-size:28px; text-shadow: 0 0 2px rgba(255,255,255,0.75), 0 0 4px rgba(255,255,255,0.4), 2px 2px 5px rgba(0,0,0,0.7);}
.i-banner .banner .titbox.fran .farcode{padding-top: 3rem}

.i-about{width: 100%}
.i-ab-box{display: flex; justify-content: space-between;}
.i-ab-box .iab-left{width: 50%; font-size: 0}
.i-ab-box .iab-left img{width: 100%; flex: 1;}
.i-ab-box .iab-right{background-color: #fdeee0; width: 40%;display: flex;flex-direction: column; justify-content: center; padding: 2rem; box-sizing: border-box;flex:1;}
.i-ab-box .iab-right .ibj-con{padding: 0 4em}
.i-ab-box .iab-right h3{font-size: 24px; padding-bottom: 2rem; font-weight: 500}
.i-ab-box .iab-right .desc{font-size: 14px; font-family: 'Msn'}


.i-product{width: 100%; font-size: 0; position: relative;}
.i-product img{width: 100%}
.i-product .i-product-box{width: 50%; height: 100%; position: absolute; left: 0; top: 0; padding-left: 5rem}
.i-product .i-product-box .i-abwrap{padding-top: 5rem}
.i-product .i-product-box .i-abwrap h3{font-size: 24px; padding-bottom: 2rem; color: #333;font-weight: 500}


.i-layout{width: 100%; font-size: 0; position: relative;}
.i-layout img{width: 100%}
.i-layout .i-layout-box{width: 50%; height: 100%; position: absolute; left: 0; top: 0; padding-left: 5rem}
.i-layout .i-layout-box .i-bwrap{display: flex; align-items: center; justify-content: space-between;width: 100%; height: 100%}
.i-layout-box .i-bwrap .ib-con{width: 100%}
.i-layout-box .i-bwrap .ibj-con{color: #333; width: 100%;}
.i-layout-box .i-bwrap .ibj-con h3{font-size: 24px; padding-bottom: 2rem;font-weight: 500}
.i-layout-box .i-bwrap .ibj-con .desc{font-size: 14px}


.i-join{width: 100%; font-size: 0; position: relative;}
.i-join img{width: 100%}
.i-join .i-join-box{width: 50%; height: 100%; position: absolute; right: 0; top: 0}
.i-join .i-join-box .i-bwrap{display: flex; align-items: center; justify-content: space-between;width: 100%; height: 100%}
.i-join-box .i-bwrap .ib-con{width: 100%}
.i-join-box .i-bwrap .ibj-con{color: #FFF; width: 50%; padding-left: 50%}
.i-join-box .i-bwrap .ibj-con h3{font-size: 24px; padding-bottom: 2rem;font-weight: 500}
.i-join-box .i-bwrap .ibj-con .desc{font-size: 14px}
.i-more .links{border: 1px solid #FFF; display: inline-block; font-size: 14px; margin-top: 2rem; padding: 4px 10px 4px 25px; color: #FFF; -webkit-transition: all .5s;transition: all .5s;}
.i-more .links:hover{background-color: rgba(222, 0, 43, .2); border-color: #de002b}
.i-more .links span{display: flex; align-items: center;}
.i-more .links span svg{margin-left: 5px;-webkit-transition: all .5s;transition: all .5s;}
.i-more .links span:hover svg{margin-left: 20px}

.z-zabout{width: 100%; font-size: 0; position: relative;}
.z-zabout img{width: 100%}
.z-zabout .z-zabout-box{width: 40%; height: 100%; position: absolute; left: 0; top: 0; padding-left: 5rem}
.z-zabout .z-zabout-box .i-bwrap{display: flex; align-items: center; justify-content: space-between;width: 100%; height: 100%}
.z-zabout-box .i-bwrap .ib-con{width: 100%}
.z-zabout-box .i-bwrap .ibj-con{color: #333; width: 100%;}
.z-zabout-box .i-bwrap .ibj-con h3{font-size: 24px; padding-bottom: 2rem;font-weight: 500}
.z-zabout-box .i-bwrap .ibj-con .desc{font-size: 14px}

.z-repeat{width: 100%; background-color: #fff6ee; padding: 4rem 0}
.z-repeat .z-repeat-box{}
.z-repeat .z-repeat-box h3{font-weight: 500}
.z-repeat .z-repeat-box .subtit{font-size: 13px; color: #666; padding: 5px 0 20px 0}
.z-repeat .z-repeat-box .logo-grid{display: grid;grid-template-columns: repeat(4, 1fr);gap: 14px;}
.z-repeat .z-repeat-box .logo-card{border: 1px solid #e6dcd1;display: grid;place-items: center;transition: transform .3s, box-shadow .3s, border-color .3s;}
.z-repeat .z-repeat-box .logo-card img{width: 100%}
.z-repeat .z-repeat-box .logo-card:hover{transform:translateY(-5px);box-shadow:0 14px 34px #4a2d1712;border-color:#cbb798}

.z-symbol{width: 100%; font-size: 0; position: relative;}
.z-symbol img{width: 100%}
.z-symbol .z-symbol-box{width: 45%; height: 100%; position: absolute; right: 0; top: 0;}
.z-symbol .z-symbol-box .i-bwrap{display: flex; align-items: center; justify-content: space-between;width: 100%; height: 100%}
.z-symbol-box .i-bwrap .ib-con{padding-right: 5rem}
.z-symbol-box .i-bwrap .ibj-con{color: #333; width: 100%;}
.z-symbol-box .i-bwrap .ibj-con h3{font-size: 24px; padding-bottom: 2rem;font-weight: 500}
.z-symbol-box .i-bwrap .ibj-con .desc{font-size: 14px}

.z-layout{width: 100%; font-size: 0; position: relative;}
.z-layout img{width: 100%}
.z-layout .z-layout-box{width: 40%; height: 100%; position: absolute; left: 0; top: 0; padding-left: 5rem}
.z-layout .z-layout-box .i-bwrap{display: flex; align-items: center; justify-content: space-between;width: 100%; height: 100%}
.z-layout-box .i-bwrap .ib-con{width: 100%}
.z-layout-box .i-bwrap .ibj-con{color: #FFF; width: 100%;}
.z-layout-box .i-bwrap .ibj-con h3{font-size: 24px; padding-bottom: 2rem;font-weight: 500}
.z-layout-box .i-bwrap .ibj-con .desc{font-size: 14px}

.z-course{width: 100%; background-color: #fdeee0; padding: 4rem 0}
.z-course .z-course-box{}
.z-course .z-course-box h3{font-weight: 500}
.timeline-track{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;position:relative;margin-top:50px}
.timeline-track:before{content:'';height:1px;background:#c9ad91;position:absolute;left:5px;right:5px;top:8px}

.milestone{position:relative;padding-top:25px}
.milestone:before{content:'';width:8px;height:8px;background:#956134;box-shadow:0 0 0 1px #b99470;border-radius:50%;position:absolute;top:4px;left:0}
.milestone strong{font-size:16px;font-weight:500; color: #956134}
.milestone p{font-size:12px;line-height:1.8;margin:9px 0; font-family: 'Msn'; color: #2c2c2c}
.milestone img{width:100%;object-fit:cover;margin-top:4px;filter:saturate(.75);transition:.3s}
.milestone:hover img{filter:saturate(1);transform:translateY(-3px)}

.timeline-wrap {display: grid;grid-template-columns:repeat(7,1fr);gap: 30px 32px; padding: 3rem 0}
.timeline-wrap .timeline-item {min-width: 120px;}
.timeline-wrap .date-text {font-size: 16px;color: #956134; margin-bottom: 2px;}
.timeline-wrap .city-text {font-size: 14px;color: #2c2c2c; font-family: 'Msl'}


.zpro-box{background-color: #fff6ee; padding: 5rem 0}
.zpro-box .top{padding:0 2rem}
.zpro-box .top .tit{text-align: center; font-size: 24px; padding-bottom: 20px; border-bottom: 2px dotted #956134; color: #956134}
.zpro-box .secondtit{padding: 3rem 0; color: #2c2c2c}
.zpro-box .secondtit h3{font-weight: 500}
.zpro-box .secondtit .subtit{font-size: 13px}

.prolist{display: grid;grid-template-columns: repeat(4, 1fr);gap: 14px 30px; padding-bottom: 3rem}
.prolist .pro-p-list{display: grid;place-items: center;transition: transform .3s, box-shadow .3s, border-color .3s; padding: 20px 0}
.prolist .pro-p-list .img{text-align: center;}
.prolist .pro-p-list .con{text-align: center; width: 100%}
.prolist .pro-p-list .con .name{font-size: 14px}
.prolist .pro-p-list .con .desc{font-size: 12px}
.prolist .pro-p-list img{width: 100%}

.dirplist{display: flex;gap: 60px;align-items: center; padding: 3rem 0}
.dirplist .col-left {flex: 1;}
.dirplist .col-right {width: 30%;display: flex; flex-direction: column;align-items: center;}
.dirplist .divider {width: 1px;background-color: #c9c9c9;min-height: 340px;margin-top: 20px;}
.dirplist .img-wrap {text-align: center;}
.dirplist .img-wrap img {height: 200px; filter: drop-shadow(4px 6px 10px rgba(0,0,0,0.12));}
.dirplist .list-row {display: flex;gap: 32px;margin-bottom: 24px;}
.dirplist .list-row:last-child{margin-bottom: 0;}
.dirplist .item {flex: 1; position: relative;}
.dirplist .item p.cn {font-size: 14px; padding-left: 20px}
.dirplist .item p.en {font-size: 14px;color: #444;padding-left: 20px; font-family: 'Msn'}
.dirplist .dot::before {content: "●"; color: #333; position: absolute;top:-2px;left: 0;}
.dirplist .right-text {text-align: center;}
.dirplist .right-text .cn{font-size: 14px;}
.dirplist .right-text .en{font-size:14px;color:#444;}
.dirplist .ldivider {width: 1px;background-color: #c9c9c9;min-height: 230px;margin-top: 20px;}

.zplace-box{background-color: #fff6ee; padding: 5rem 0}
.zplace-wrap{display: grid;grid-template-columns: repeat(2, 1fr);gap: 10px 40px; padding-bottom: 3rem}
.zplace-wrap .zplace-list{place-items: center;transition: transform .3s, box-shadow .3s, border-color .3s; padding: 20px 0}
.zplace-wrap .zplace-list .img{position: relative; font-size: 0; overflow: hidden; border-top-left-radius: 10px;border-top-right-radius: 10px;}
.zplace-wrap .zplace-list .img img{width: 100%;-webkit-transition: all .5s;transition: all .5s;}
.zplace-wrap .zplace-list .img:hover img{width: 100%;-webkit-transform: scale(1.05, 1.05);-moz-transform: scale(1.05, 1.05);-o-transform: scale(1.05, 1.05);transform: scale(1.05, 1.05)}
.zplace-wrap .zplace-list .img .titile{position: absolute;text-shadow: 1px 1px 4px rgba(0,0,0,0.7); bottom: 30px; left: 30px; color: #FFF; font-size: 22px}
.zplace-wrap .zplace-list .con{padding: 2.5rem 2rem; height: 70px; background-color: #efdbc9; font-size: 14px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; font-family: 'Msn'}

.tsshop-box{width: 100%; font-size: 0; position: relative;}
.tsshop-box img{width: 100%}
.tsshop-box .txt-box{position: absolute; top: 0; left: 0; width: 100%; height: 100%}
.tsshop-box .txt{display: flex; align-items: center; justify-content: space-between; color: #FFF; width: 100%; height: 100%}
.tsshop-box .txt .txt-wrap{width: 100%; text-align: center;}
.tsshop-box .txt h3{font-size: 28px; font-weight: 500}
.tsshop-box .txt p{font-size: 14px; padding-top: 2rem}

.zshop-box{background-color: #fdeee0; padding: 5rem 0}
.zshop-wrap{display: grid;grid-template-columns: repeat(3, 1fr);gap: 10px 30px; padding-bottom: 3rem}
.zshop-wrap .zshop-list{display: grid;place-items: center;transition: transform .3s, box-shadow .3s, border-color .3s; padding: 20px 0}
.zshop-wrap .zshop-list .img{position: relative; font-size: 0; overflow: hidden;}
.zshop-wrap .zshop-list .img img{width: 100%;-webkit-transition: all .5s;transition: all .5s;}
.zshop-wrap .zshop-list .img:hover img{width: 100%;-webkit-transform: scale(1.05, 1.05);-moz-transform: scale(1.05, 1.05);-o-transform: scale(1.05, 1.05);transform: scale(1.05, 1.05)}
.zshop-wrap .zshop-list .con{padding:15px 0 0 0; text-align: center; color: #2c2c2c}
.zshop-wrap .zshop-list .con .titile{font-size: 14px}
.zshop-wrap .zshop-list .con .subtit{font-size: 14px; font-family: 'Msn'}

.z-process{background-color: #fdeee0; padding: 5rem 0}
.z-process-box{padding-left: 5rem}
.z-process-box h3{font-size: 20px; color: #2c2c2c; font-weight: 500}
.zp-box{width: 100%;display: grid;grid-template-columns: repeat(6, 1fr);gap: 0; padding: 2rem 0 0 0}
.zp-box .zp-box-list{display: grid;height: 300px; position: relative; align-items: center;transition: transform .3s, box-shadow .3s, border-color .3s;}
.zp-box .zp-box-list .line{width: 100%; border-top: 1px solid #d21235;}
.zp-box .zp-box-list .xline{width: 100%; border-top: 1px dashed #d21235;}
.zp-box .zp-box-list .zpbtop{height: 150px;position: absolute; top:0; left: 0;}
.zpbtop .zpbtop-wrap{position: relative; height: 100%}
.zpbtop .zpbtop-wrap .ico{position: absolute; width: 30px; left: -15px; top: 5px}
.zpbtop .zpbtop-wrap .round{position: absolute; left: -9px; background-color: #fdeee0; bottom: -9px; content: ""; width: 18px; height: 18px; border: 1px dashed #d21235; border-radius: 50%}
.zpbtop .zpbtop-wrap .hline{position: absolute; left: 0; bottom: 0; content: ""; border: 1px dashed #d21235; height: 70%; }
.zpbtop .zpbtop-wrap .yround{position: absolute; left: -5px; background-color: #d21235; bottom: -6px; content: ""; width: 12px; height: 12px; border-radius: 50%}
.zpbtop .zpbtop-wrap .one{padding:0 0 0 30px;}
.zpbtop .zpbtop-wrap .one .no{color: #d21235; font-size: 14px}
.zpbtop .zpbtop-wrap .one .title{color: #d21235; font-size: 14px}
.zpbtop .zpbtop-wrap .one .desc{color: #3e3a39; padding-top: 20px; font-family: "Msl"; font-size: 12px}

.zp-box .zp-box-list .zpbbottom{height: 150px;position: absolute; top:150px; left: 0;}
.zpbbottom .zpbtop-wrap{position: relative; height: 100%}
.zpbbottom .zpbtop-wrap .ico{position: absolute; width: 30px; left: -15px; top: 35px}
.zpbbottom .zpbtop-wrap .round{position: absolute; left: -9px; background-color: #fdeee0; bottom: -9px; content: ""; width: 18px; height: 18px; border: 1px dashed #d21235; border-radius: 50%}
.zpbbottom .zpbtop-wrap .hline{position: absolute; left: 0; top: 0; content: ""; border: 1px dashed #d21235; height: 20%; }
.zpbbottom .zpbtop-wrap .yround{position: absolute; left: -5px; background-color: #d21235; top: -6px; content: ""; width: 12px; height: 12px; border-radius: 50%}
.zpbbottom .zpbtop-wrap .one{padding:30px 0 0 30px;}
.zpbbottom .zpbtop-wrap .one .no{color: #d21235; font-size: 14px}
.zpbbottom .zpbtop-wrap .one .title{color: #d21235; font-size: 14px}
.zpbbottom .zpbtop-wrap .one .desc{color: #3e3a39; padding-top: 20px; font-family: "Msl"; font-size: 12px}



.z-require{background-color: #fce3cb; padding: 5rem 0}
.z-require-box h3{font-size: 20px; color: #2c2c2c; font-weight: 500}
.z-require-box .zr-box{display: flex; justify-content: space-between; align-items: flex-start;}
.z-require-box .zr-box .zr-bleft{width: 68%;display: grid;grid-template-columns: repeat(3, 1fr);gap: 10px 60px; padding: 4rem 0 0 0}
.z-require-box .zr-box .zr-bleft .zrb-list{transition: transform .3s, box-shadow .3s, border-color .3s; padding-bottom: 5rem;}
.zrb-list .zrb-ltop{display: flex; justify-content: space-between; width: 100%; color: #d21235; align-items: flex-end;}
.zrb-list .zrb-ltop img{width: 40px}
.zrb-list .con{font-size: 13px; font-family: 'Msl'; padding-top: 1.5rem; width: 100%}

.z-require-box .zr-box .zr-bright{width: 25%}
.z-require-box .zr-box .zr-bright img{width: 100%; margin-top: -30px}


.z-support{background-color: #fdeee0; padding: 5rem 0}
.z-support-box h3{font-size: 20px; color: #2c2c2c; font-weight: 500}
.zsupport-wrap{display: grid;grid-template-columns: repeat(6, 1fr);gap: 10px 20px; padding: 2rem 0}
.zsupport-wrap .zsupport-list{place-items: center;transition: transform .3s, box-shadow .3s, border-color .3s; padding: 20px 0}
.zsupport-wrap .zsupport-list .img{position: relative; font-size: 0; overflow: hidden;}
.zsupport-wrap .zsupport-list .img img{width: 40px;-webkit-transition: all .5s;transition: all .5s;}
.zsupport-wrap .zsupport-list .con{padding:15px 0 0 0; text-align: center; color: #2c2c2c}
.zsupport-wrap .zsupport-list .con .titile{font-size: 16px; padding: 15px 0}
.zsupport-wrap .zsupport-list .con .desc{font-size: 12px; font-family:'Msn'; color: #727171; padding-bottom: 3px}


.z-frpartner{width: 100%; font-size: 0; position: relative;}
.z-frpartner img{width: 100%}
.z-frpartner .z-frpartner-box{width: 50%; height: 100%; position: absolute; left: 0; top: 0; padding-left: 5rem}
.z-frpartner .z-frpartner-box .i-bwrap{display: flex; align-items: center; justify-content: space-between;width: 100%; height: 100%}
.z-frpartner .i-bwrap .ib-con{width: 100%}
.z-frpartner .i-bwrap .ibj-con{color: #333; width: 50%;}
.z-frpartner .i-bwrap .ibj-con .footer-title{font-size: 24px;font-weight: 500;position: relative;color: #FFF;letter-spacing: 3px;}
.z-frpartner .i-bwrap .ibj-con .form-desc{font-size:14px;margin:6px 0 24px;line-height:1.6; color: #FFF;font-family: 'Msl'}
.z-frpartner .i-bwrap .ibj-con .form-input{width:90%;height:36px;border-radius:99px;border:none;padding:0 5%;font-size:12px;margin-bottom:10px;}
.z-frpartner .i-bwrap .ibj-con .check-line{margin:8px 0 15px;font-size:12px;justify-content:center; color: #FFF; display: flex; align-items: center;}
.z-frpartner .i-bwrap .ibj-con .check-line a{color: #FFF}
.z-frpartner .i-bwrap .ibj-con .submit-btn{width:100%;height:36px;border-radius:99px;border:none;background:#c49c64;color:#fff;font-size:14px;cursor:pointer; margin-top: 20px}



.footer{width: 100%; height: auto;background-color: #442c14;}
.footer-wrap{display: flex; justify-content: space-between; padding: 4rem 0 5rem 0}
.foot-left{width: 22%}
.foot-left img{width: 120px}
.foot-left .copyright{margin-top: 13rem}
.foot-left .copyright .icp{position: relative; padding-left: 13px}
.foot-left .copyright .icp:before{position: absolute; left: 0; top: 11px; width: 6px; height: 6px; content: ""; border-radius: 50%; background-color: #FFF}
.foot-left .copyright .icp a{font-size: 12px; color: #FFF}
.foot-left .copyright .addr{font-size: 12px; color: #FFF; display: flex; align-items: center; font-family: 'Msr'}
.foot-left .copyright .addr svg{width: 20px; margin-left:-6px;}
.foot-left .copyright .addr-br{font-size: 12px; color: #FFF; padding-left: 10px; line-height: 10px;font-family: 'Msr'}

.foot-middle{width:29%;}
.foot-middle1{width:28%;}
.fm-box .footer-title{font-size: 16px;font-weight: 500; color: #FFF;margin-bottom: 12px;position: relative;}
.fm-box .footer-title::after{content: "";display: block;width: 80%;height: 1px;background-color: #95887a;margin-top:12px;}
.fm-box .nav-grid{display: grid;grid-template-columns: 1fr 1fr;gap:0 8px;margin-top:15px;}
.fm-box .nav-item{font-size:14px;display:flex;align-items:center;gap:6px;cursor:pointer;font-family: 'Msr'}
.fm-box .nav-item::after{content:"+"; font-size:16px;opacity:0.7; color: #FFF}
.fm-box .nav-item a{color: #FFF}

.fm-box .social-block{margin-top:8rem;}
.fm-box .social-icons{display:flex;gap:12px;margin-top:15px;}
.fm-box .social-icon{width:32px;height:32px;border-radius:4px;display:grid;place-items:center;color:#59381c;font-weight:bold;}
.fm-box .social-icon svg{width: 26px}

.contact-info{margin-top:15px;display:flex;flex-direction:column;gap:2px; font-size:14px; color: #FFF;font-family: 'Msr'}
.contact-line{display:flex;align-items:center;gap:6px;}
.contact-line svg{width: 18px}
.qrcode-row{display:flex;justify-content:space-around;margin-top:9rem;text-align:center;gap:5px;width:90%}
.qrcode-item{flex:1; }
.qrcode-img{width:100%; text-align: center;}
.qrcode-img img{width:76px;height:76px;border-radius:6px;}
.qrcode-desc{font-size:12px; color: #FFF; text-align:center; padding-top: 5px;font-family: 'Msl'}


.foot-right{width:21%;}
.foot-right .footer-title{font-size: 22px;font-weight: 500;position: relative;color: #FFF;letter-spacing: 3px}
.foot-right .form-desc{font-size:16px;margin:0 0 24px;line-height:1.6; color: #FFF;font-family: 'Msl'}
.foot-right .form-input{width:90%;height:32px;border-radius:99px;border:none;padding:0 5%;font-size:12px;margin-bottom:10px;}
.foot-right .check-line{margin:8px 0 15px;font-size:12px;justify-content:center; color: #FFF; display: flex; align-items: center;}
.foot-right .check-line a{color: #FFF}
.foot-right .submit-btn{width:100%;height:36px;border-radius:99px;border:none;background:#c49c64;color:#fff;font-size:14px;cursor:pointer;}

.foot-bottom{width:100%; padding: 20px 0;box-sizing: border-box; background-color: #FFF;}
.foot-bott-box{display: flex;}
.foot-bottom .fb-b01{display: flex; align-items: center; font-size: 14px; color: #2c2c2c; width: 33%; font-family: 'Msr'}
.foot-bottom .fb-b01 svg{width: 20px; margin-right: 10px;}
.foot-bottom .fb-b02{text-align: center;width: 33%}
.foot-bottom .fb-b02 img{width: 25px}
.foot-bottom .fb-b01.b03{justify-content: right;}
.foot-bottom .fb-b01.b03 svg{margin-right: 6px; width:22px}

@media (min-width:1680px) {
}

@media (min-width:1440px) {
    .header-wrap .menu li.menuli{font-size: 16px}
    .i-banner .banner .titbox.fran .farcode{padding-top: 6rem}
    .i-banner .banner .titbox.fran .hotline{padding-top: 6rem}
    .i-banner .banner .titbox.fran .mailway{padding-top: 5rem}
    .qrcode-img img{width: 120px;height: 120px}
    .z-require-box .zr-box{align-items: center;}
    .z-require-box .zr-box .zr-bleft .zrb-list{margin-bottom: 6rem}
    .z-frpartner .i-bwrap .ibj-con .form-input{height: 45px; margin-bottom: 15px}
    .z-frpartner .i-bwrap .ibj-con .submit-btn{height: 45px}
}

@media (min-width:1200px) {

}



@media (max-width:1025px) {
  .pc{display: none;}
  .m{display: block;}
  .container{padding: 0 12px}
  
  .mtd-header{position: fixed; z-index: 99; top: 0; width: 100%; background-color: #FFF; box-shadow: 0 0 8px 0 rgb(0 0 0 / 10%);}
  .mtd-header .mlogo{padding: 10px 12px 5px 15px; float: left;}
  .mtd-header .mlogo img{width: 30px;}
  .mtd-header-info {position: relative;z-index: 10;height: 70px;}
  .mtd-header-info .nav_btn{float: right;margin: 20px 20px 0 0;cursor:pointer;height: 32px;width: 25px;position: relative;}
  .mtd-header-info .nav_btn span{display: inline-block;width: 25px;height: 2px;background-color: #333;position: absolute;top: 16px;left: 0px;transition:background-color 0.3s ease-out 0.1s}
  .mtd-header-info .nav_btn span:after{content:'';display: inline-block;width: 25px;height: 2px;background-color: #333;position: absolute;top: 8px;left:0px;transition:transform 0.3s ease-out,top 0.5s ease 0.4s;transform: rotate(0deg)}
  .mtd-header-info .nav_btn span:before{content:'';display: inline-block;width: 25px;height: 2px;background-color: #333;position: absolute;top: -8px;left:0px;transition:transform 0.3s ease-out,top 0.5s ease 0.4s;transform: rotate(0deg)}
  .mtd-header-info.btn_click .nav_btn span{background-color: transparent;}
  .mtd-header-info.btn_click .nav_btn span:after{transition: top 0.5s ease, transform 0.3s ease-out 0.4s;transform: rotate(-45deg);top: 0px }
  .mtd-header-info.btn_click .nav_btn span:before{transition: top 0.5s ease, transform 0.3s ease-out 0.4s;transform: rotate(45deg);top: 0px}
  .mtd-header-info .nav {position: fixed;top: 65px;left: 0px;right: 0px;bottom: 0px;background: #fff;visibility: hidden;filter: alpha(opacity=0);-moz-opacity: 0;opacity: 0;transition: all 0.5s;overflow: auto;}
  .mtd-header-info.btn_click .nav{visibility: visible;filter:alpha(opacity=100);-moz-opacity:1;opacity:1;top:70px;transition: all 0.5s;}
  .mtd-header-info .nav>ul {overflow-y: auto}
  .mtd-header-info .nav>ul>li{border-top: 1px solid #dcdcdc}
  .mtd-header-info .nav>ul>li:last-child{border-bottom: 1px solid #dcdcdc}
  .mtd-header-info .nav li a{color: #333;display:block;text-align: center;height: 100%}
  .mtd-header-info .nav li>a{padding:15px 25px }
  .mtd-header-info .nav>ul>li>a{font-size: 16px; text-align: left;}
  .mtd-header-info .nav>ul>li>a em{font-size: 14px;padding-left: 5px;color: #333}

  .navPhone-li{display: none;transition: all 0.5s;}
  .navPhone-li ul li a{text-align: left !important;position: relative;font-size: 14px !important;padding-left: 43px !important;}
  .nav>ul li a i{display: inline-block;width: 9px;height: 6px;background: url(../../images/xm/icon-2.png) no-repeat;margin-left: 5px;-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;-ms-transition: all .3s;transition: all .3s}
  .nav.nav-phone>ul li.active a i{ background: url(../../images/xm/icon-2.png) no-repeat;transform:rotate(180deg);-ms-transform:rotate(180deg); -moz-transform:rotate(180deg); -webkit-transform:rotate(180deg); -o-transform:rotate(180deg); }
    
  .mtd-header-info .nav>ul>li.lan{text-align: center; border-bottom: 0; padding: 15px 0;}
  .mtd-header-info .nav>ul>li.lan .cn{display: inline-block; margin-right: 15px; color: #999; padding: 5px 12px; background-color: #f1f7ff;}
  .mtd-header-info .nav>ul>li.lan .cn.active{color: #FFF;background-color: #0a9905;}

    .i-banner{margin-top: 70px}
    .zbanner{margin-top: 70px}

    .i-product{padding: 2rem 0 55px 0;}
    .i-product .i-p-list{padding: 0.3rem 0px;}
    .i-product .i-p-list{width: 94%; margin: 0 auto;}
    .i-product .i-p-list li {width: 48%;margin-bottom: 1rem;border-radius: 0.15rem;padding: 1rem 0px; margin-left: 4%}
    .i-product .i-p-list li:nth-child(3n+1){margin-left: 2%}
    .i-product .i-p-list li:nth-child(2n+1){margin-left: 0}
    .i-product .i-p-list li .pro-img{width:100%; height: auto;}
    .i-product .i-p-list li .pro-img img{width: 100%; height: auto;}
    .i-product .i-p-more{ width:180px; height:40px; font-size:18px; line-height:40px }

    .i-about{padding: 30px 0}
    .i-ab-box{display: block; width: 94%; margin: 0 auto;}
    .i-ab-box .left{width: 100%; margin-bottom: 20px}
    .i-ab-box .right{width: 100%}

    .z-ab-box{display: block; width: 94%; margin: 0 auto;}
    .z-ab-box .ab-img{width: 100%}
    .z-ab-box .ab-info{width: 100%; margin-left: 0; padding-top: 2rem}

    .zdevice ul{flex-wrap: wrap;}
    .zdevice ul li{width: 48%; margin-bottom: 25px}

    .cer-box{display: block; width: 94%; margin: 0 auto;}
    .cer-box .cer-list{width: 100%; margin-bottom: 25px}

    .z-message .z-mess{width: 94%; margin: 0 auto;}

    .z-hd-box{width: 94%; margin: 0 auto;}
    .z-activity .i-nav span{padding: 8px 10px}
    .z-hd-box .z-h-list{display: block;}
    .z-hd-box .z-h-list .left{width: 100%}
    .z-hd-box .z-h-list .right{width: 100%; padding-top: 2rem}
    .z-h-list .right .link .date:after{width: 0}

    .i-partner .i-p-list li{width: 32%; margin-right: 1.25%;height: 80px;}
    .i-partner .i-p-list li:nth-child(5n){margin-right: 1.25%}
    .i-partner .i-p-list li:nth-child(3n){margin-right: 0}

    .zdevice{width: 94%; margin: 0 auto;}
    .zdevice img{width: 100%}
    .zdevice .tit p{font-size: 14px}

    .znews{padding: 2rem 0}
    .news-list{width: 94%; margin: 0 auto;}
    .news-list li{border-radius: 4px;margin-bottom: 15px;padding:10px;}
    .news-list li .list-img{width: 40%;height: 90px;margin-right: 5%;}
    .news-list li .news-text{height:auto;width:55%;}
    .news-list li .news-text h3{font-size:14px;line-height:16px;}
    .news-list li .news-text p.desc{font-size:12px;line-height:16px; margin: 5px auto;}
    .news-list li .news-text a{font-size: 14px;line-height: 14px;}

    .zjob{padding: 3rem 0;}
    .zjob .job-box{ width: 94%; margin: 0 auto;}
    .zjob .job-text{padding: 30px 20px}
    .zjob .job-text .job-title h3{font-size: 18px}
    .zjob .job-text .job-title .job-desc{font-size: 14px}

    .z-pro-txt{width: 94%; margin: 0 auto;}
    .z-product .z-pro-box .zp-right{width: 100%}

    .z-product .i-p-list li{width: 50%}

    .intro-con{width: 92%; margin: 0 auto;}
    .nav-wrapper{font-size: 14px}
    .nav-box .nav-item{padding: 0 20px}
    .intro-body h2{font-size: 20px}
    .intro-body .desc{font-size: 14px}
    .leader-list-item{width: 100%}
    .z-addr .addr-box{display: block;}
    .z-addr .addr-box .item{width: 100%}

    .goods-detail{width: 94%; margin: 0 auto;}
    .goods-dcontent{display: block;}
    .goods-dcontent .gd-img{width: 100%}
    .goods-dcontent .gd-con{width: 100%}

    .footer{padding-top: 30px}
    .footer-wrap{width: 94%; margin: 0 auto; flex-wrap: wrap;}
    .foot-middle{width: 48%}
    .foot-middle li{width: 75px}
    .foot-right{width: 48%;}

    .foot-left{width: 48%; margin-bottom: 40px}
    .foot-left h2{font-size: 14px; margin-bottom: 10px}
    .foot-left p{margin-bottom: 10px; font-size: 12px}
    .foot-left img{width: 160px}
    .foot-bottom .but-info{padding: 0 14px}

    .z-apply-box{padding: 0 12px}

    .z-about{padding: 3rem 12px}

    .zab-controller{padding-top: 2rem;}
    .zab-controller-box{padding: 0 1rem;}
    .zab-controller-box h3{font-size: 20px;}
    .zab-controller-list{display: block; padding: 1rem 0;}
    .zab-controller-list li{width: 100%; margin-left: 0;}

    .zinn-test-list{display: flex; padding: 3rem 0 0 0; flex-wrap: wrap; flex: 2;}
    .zinn-test-list li{width: calc(100% / 2 - 20px); margin-left: 20px; }
    .zinn-test-list li:nth-child(2n+1){margin-left: 0;}
    .zinn-test-list li:nth-child(3){background-color: rgba(2, 71, 143, .1);}
    .zinn-test-list li:nth-child(4){background-color: #FFF;}
    .zinn-test-list li:nth-child(5){background-color: #FFF;}
    .zinn-test{padding: 3rem 0 2rem 0}

    .zab-controller .zab-list{width: 100%}
    .hdesc{width: 100%}
    .honors-list .hl-list{width: 100%; margin-bottom: 20px}

    .zlinks{padding: 4rem 12px}
    .zl-wrapper .zl-w-box{width: 100%;margin-left: 0}

    .zinn-test-list.cart li{width: calc(100% / 2 - 20px); margin-left: 20px; margin-bottom: 20px;}
    .zinn-test-list.cart li:nth-child(2n+1){margin-left: 0;}
    
    .wn-box{padding: 5rem 12px}
    .wn-box ul{display: block;}
    .wn-box ul li{margin-bottom: 2rem}
    .wn-box .ycbg{padding: 3rem 12px}
    .wn-box .wn-pwrap{flex-wrap: wrap;}
    .wn-box .wn-pwrap .img{width: 100%}
    .wn-box .wn-pwrap .wpro-con{width: 100%; margin:20px 0 0 0}
    .wn-box .list-box{flex-wrap: wrap;}
    .wn-box .list-box .lb-boxs{width: 100%}

    .fiber-structure-visual{display: block; padding: 20px}
    .structure-figure{padding-top: 10px}
    .series-grid{display: block;}
    .series-card{margin-bottom: 20px}
    .existing-grid{display: block;}
    .existing-item{padding-bottom: 20px}

    .hero-card{display: block; padding: 20px}
    .bundle-visual{padding-top: 10px}
    .tech-card{display: block; padding: 20px}
    .tech-points{padding-top: 20px}
    .showcase-grid{display: block;}
    .product-showcase{ padding: 20px}
    .content-grid{display: block;}
    .info-card{margin-bottom: 20px}

    .z-join{padding: 2rem 12px}
    .z-join .job-list .job-l-box{width: 88%; margin-left: 0; margin-bottom: 20px}
    .contact-mail{padding: 40px 20px}
    .contact-mail .mail-box{display: block;}
    .contact-mail .mail-box .mail-con{width: 88%; margin-bottom: 20px}
    .contact-mail .mail-box .mail-txt{width: 88%}

    .i-banner .banner .titbox{left: 12px; top: 23%}

}

@media (max-width:767px) {
	.pc{display: none;}
    .m{display: block;}
    .container{padding: 0 12px}

    .mtd-header{position: fixed; z-index: 99; top: 0; width: 100%; background-color: #FFF; box-shadow: 0 0 8px 0 rgb(0 0 0 / 10%);}
    .mtd-header .mlogo{padding: 10px 12px 5px 15px; float: left;}
    .mtd-header .mlogo img{width: 30px;}
    .mtd-header-info {position: relative;z-index: 10;height: 70px;}
    .mtd-header-info .nav_btn{float: right;margin: 20px 20px 0 0;cursor:pointer;height: 32px;width: 25px;position: relative;}
    .mtd-header-info .nav_btn span{display: inline-block;width: 25px;height: 2px;background-color: #333;position: absolute;top: 16px;left: 0px;transition:background-color 0.3s ease-out 0.1s}
    .mtd-header-info .nav_btn span:after{content:'';display: inline-block;width: 25px;height: 2px;background-color: #333;position: absolute;top: 8px;left:0px;transition:transform 0.3s ease-out,top 0.5s ease 0.4s;transform: rotate(0deg)}
    .mtd-header-info .nav_btn span:before{content:'';display: inline-block;width: 25px;height: 2px;background-color: #333;position: absolute;top: -8px;left:0px;transition:transform 0.3s ease-out,top 0.5s ease 0.4s;transform: rotate(0deg)}
    .mtd-header-info.btn_click .nav_btn span{background-color: transparent;}
    .mtd-header-info.btn_click .nav_btn span:after{transition: top 0.5s ease, transform 0.3s ease-out 0.4s;transform: rotate(-45deg);top: 0px }
    .mtd-header-info.btn_click .nav_btn span:before{transition: top 0.5s ease, transform 0.3s ease-out 0.4s;transform: rotate(45deg);top: 0px}
    .mtd-header-info .nav {position: fixed;top: 65px;left: 0px;right: 0px;bottom: 0px;background: #fff;visibility: hidden;filter: alpha(opacity=0);-moz-opacity: 0;opacity: 0;transition: all 0.5s;overflow: auto;}
    .mtd-header-info.btn_click .nav{visibility: visible;filter:alpha(opacity=100);-moz-opacity:1;opacity:1;top:70px;transition: all 0.5s;}
    .mtd-header-info .nav>ul {overflow-y: auto}
    .mtd-header-info .nav>ul>li{border-top: 1px solid #dcdcdc}
    .mtd-header-info .nav>ul>li:last-child{border-bottom: 1px solid #dcdcdc}
    .mtd-header-info .nav li a{color: #333;display:block;text-align: center;height: 100%}
    .mtd-header-info .nav li>a{padding:15px 25px }
    .mtd-header-info .nav>ul>li>a{font-size: 16px; text-align: left;}
    .mtd-header-info .nav>ul>li>a em{font-size: 14px;padding-left: 5px;color: #333}

    .navPhone-li{display: none;transition: all 0.5s;}
    .navPhone-li ul li a{text-align: left !important;position: relative;font-size: 14px !important;padding-left: 43px !important;}
    .nav>ul li a i{display: inline-block;width: 9px;height: 6px;background: url(../../images/xm/icon-2.png) no-repeat;margin-left: 5px;-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;-ms-transition: all .3s;transition: all .3s}
    .nav.nav-phone>ul li.active a i{ background: url(../../images/xm/icon-2.png) no-repeat;transform:rotate(180deg);-ms-transform:rotate(180deg); -moz-transform:rotate(180deg); -webkit-transform:rotate(180deg); -o-transform:rotate(180deg); }
    
  .mtd-header-info .nav>ul>li.lan{text-align: center; border-bottom: 0; padding: 15px 0;}
  .mtd-header-info .nav>ul>li.lan .cn{display: inline-block; margin-right: 15px; color: #999; padding: 5px 12px; background-color: #f1f7ff;}
  .mtd-header-info .nav>ul>li.lan .cn.active{color: #FFF;background-color: #0a9905;}

    .i-banner{margin-top: 70px}
	.zbanner{margin-top: 70px}

    .i-product .i-p-list{padding: 0.3rem 0px;}
    .i-product .i-p-list{width: 94%; margin: 0 auto;}
    .i-product .i-p-list li {width: 48%;margin-bottom: 1rem;border-radius: 0.15rem;padding: 1rem 0px; margin-left: 4%}
    .i-product .i-p-list li:nth-child(3n+1){margin-left: 2%}
    .i-product .i-p-list li:nth-child(2n+1){margin-left: 0}
    .i-product .i-p-list li .pro-img{width:100%; height: auto;}
    .i-product .i-p-list li .pro-img img{width: 100%; height: auto;}
    .i-product .i-p-more{ width:180px; height:40px; font-size:18px; line-height:40px }

    .i-about{padding-top: 30px}
    .i-ab-box .left{width: 100%; margin-bottom: 20px}
    .i-ab-box .right{width: 100%}

    .z-ab-box{display: block; width: 94%; margin: 0 auto;}
    .z-ab-box .ab-img{width: 100%}
    .z-ab-box .ab-info{width: 100%; margin-left: 0; padding-top: 2rem}

    .zdevice ul{flex-wrap: wrap;}
    .zdevice ul li{width: 48%; margin-bottom: 25px}

    .cer-box{display: block; width: 94%; margin: 0 auto;}
    .cer-box .cer-list{width: 100%; margin-bottom: 25px}

    .z-message .z-mess{width: 94%; margin: 0 auto;}

    .z-hd-box{width: 94%; margin: 0 auto;}
    .z-activity .i-nav span{padding: 8px 10px}
    .z-hd-box .z-h-list{display: block;}
    .z-hd-box .z-h-list .left{width: 100%}
    .z-hd-box .z-h-list .right{width: 100%; padding-top: 2rem}
    .z-h-list .right .link .date:after{width: 0}

    .i-partner .i-p-list li{width: 32%; margin-right: 1.25%;height: 80px;}
    .i-partner .i-p-list li:nth-child(5n){margin-right: 1.25%}
    .i-partner .i-p-list li:nth-child(3n){margin-right: 0}

    .zdevice{width: 94%; margin: 0 auto;}
    .zdevice img{width: 100%}
    .zdevice .tit p{font-size: 14px}

    .znews{padding: 2rem 0}
    .news-list{width: 94%; margin: 0 auto;}
	.news-list li{border-radius: 4px;margin-bottom: 15px;padding:10px;}
	.news-list li .list-img{width: 40%;height: 90px;margin-right: 5%;}
	.news-list li .news-text{height:auto;width:55%;}
	.news-list li .news-text h3{font-size:14px;line-height:16px;}
	.news-list li .news-text p.desc{font-size:12px;line-height:16px; margin: 5px auto;}
	.news-list li .news-text a{font-size: 14px;line-height: 14px;}

	.zjob{padding: 3rem 0;}
	.zjob .job-box{ width: 94%; margin: 0 auto;}
	.zjob .job-text{padding: 30px 20px}
	.zjob .job-text .job-title h3{font-size: 18px}
	.zjob .job-text .job-title .job-desc{font-size: 14px}

    .z-pro-txt{width: 94%; margin: 0 auto;}
    .z-product .z-pro-box .zp-right{width: 100%}

    .z-product .i-p-list li{width: 50%}

	.intro-con{width: 92%; margin: 0 auto;}
    .nav-wrapper{font-size: 14px}
    .nav-box .nav-item{padding: 0 20px}
    .intro-body h2{font-size: 20px}
    .intro-body .desc{font-size: 14px}
    .leader-list-item{width: 100%}
    .z-addr .addr-box{display: block;}
    .z-addr .addr-box .item{width: 100%}

    .goods-detail{width: 94%; margin: 0 auto;}
    .goods-dcontent{display: block;}
    .goods-dcontent .gd-img{width: 100%}
    .goods-dcontent .gd-con{width: 100%}



    .z-apply-box{padding: 0 12px}

    .z-about{padding: 3rem 12px}

    .zab-controller{padding-top: 2rem;}
    .zab-controller-box{padding: 0 1rem;}
    .zab-controller-box h3{font-size: 20px;}
    .zab-controller-list{display: block; padding: 1rem 0;}
    .zab-controller-list li{width: 100%; margin-left: 0;}

    .zinn-test-list{display: flex; padding: 3rem 0 0 0; flex-wrap: wrap; flex: 2;}
    .zinn-test-list li{width: calc(100% / 2 - 20px); margin-left: 20px; }
    .zinn-test-list li:nth-child(2n+1){margin-left: 0;}
    .zinn-test-list li:nth-child(3){background-color: rgba(2, 71, 143, .1);}
    .zinn-test-list li:nth-child(4){background-color: #FFF;}
    .zinn-test-list li:nth-child(5){background-color: #FFF;}
    .zinn-test{padding: 3rem 0 2rem 0}

    .zab-controller .zab-list{width: 100%}
    .hdesc{width: 100%}
    .honors-list .hl-list{width: 100%; margin-bottom: 20px}

    .zlinks{padding: 4rem 12px}
    .zl-wrapper .zl-w-box{width: 100%;margin-left: 0}

    .zinn-test-list.cart li{width: calc(100% / 2 - 20px); margin-left: 20px; margin-bottom: 20px;}
    .zinn-test-list.cart li:nth-child(2n+1){margin-left: 0;}
    
    .wn-box{padding: 5rem 12px}
    .wn-box ul{display: block;}
    .wn-box ul li{margin-bottom: 2rem}
    .wn-box .ycbg{padding: 3rem 12px}
    .wn-box .wn-pwrap{flex-wrap: wrap;}
    .wn-box .wn-pwrap .img{width: 100%}
    .wn-box .wn-pwrap .wpro-con{width: 100%; margin:20px 0 0 0}
    .wn-box .list-box{flex-wrap: wrap;}
    .wn-box .list-box .lb-boxs{width: 100%}

    .fiber-structure-visual{display: block; padding: 20px}
    .structure-figure{padding-top: 10px}
    .series-grid{display: block;}
    .series-card{margin-bottom: 20px}
    .existing-grid{display: block;}
    .existing-item{padding-bottom: 20px}

    .hero-card{display: block; padding: 20px}
    .bundle-visual{padding-top: 10px}
    .tech-card{display: block; padding: 20px}
    .tech-points{padding-top: 20px}
    .showcase-grid{display: block;}
    .product-showcase{ padding: 20px}
    .content-grid{display: block;}
    .info-card{margin-bottom: 20px}

    .z-join{padding: 2rem 12px}
    .z-join .job-list .job-l-box{width: 88%; margin-left: 0; margin-bottom: 20px}
    .contact-mail{padding: 40px 20px}
    .contact-mail .mail-box{display: block;}
    .contact-mail .mail-box .mail-con{width: 88%; margin-bottom: 20px}
    .contact-mail .mail-box .mail-txt{width: 88%}



    .i-banner .banner .titbox{left: 12px; top: 23%}
    .i-banner .banner .titbox .tit{font-size: 18px}
    .i-ab-box{ width: 100%; margin: 0 auto;}
    .i-ab-box .iab-left{width: 100%}
    .i-ab-box .iab-right{width: 100%; padding: 2rem 0}
    .i-ab-box .iab-right .ibj-con{padding: 0 12px}

    .i-product{padding: 0 0 20px 0;}
    .i-product .i-product-box{width: 94%; padding-left: 12px}
    .i-product .i-product-box .i-abwrap{padding-top:1rem}
    .i-product .i-product-box .i-abwrap h3{font-size: 18px}
    .i-layout-box .i-bwrap .ibj-con h3{font-size: 18px}
    .i-layout .i-layout-box{width: 94%; padding-left: 12px}
    .i-layout-box .i-bwrap .ibj-con .desc{font-size: 12px}
    .i-join-box .i-bwrap .ibj-con{padding-left: 30%; width: 70%}
    .i-join-box .i-bwrap .ibj-con h3{font-size: 18px; padding-bottom: 15px}
    .i-join-box .i-bwrap .ibj-con .desc{font-size: 12px;}
    .i-more .links{margin-top: 10px}

    .z-zabout .z-zabout-box{width: 94%; padding-left: 12px}

    .footer{padding-top: 30px}
    .foot-left{width:100%; margin-bottom: 40px}
    .footer-wrap{width: 100%; margin: 0 auto; flex-wrap: wrap; padding: 2rem 0 0 0}
    .foot-left .copyright{margin-top: 2rem}
    .foot-middle1{width: 100%; padding-bottom: 2rem}
    .qrcode-row{margin-top: 2rem}
    .foot-right{width: 94%; padding: 2rem 0}

    .z-zabout-box .i-bwrap .ibj-con h3{padding-bottom: 1rem}
    .z-symbol .z-symbol-box{width: 94%}
    .z-symbol-box .i-bwrap .ibj-con h3{padding-bottom: 1rem}
    .timeline-track{grid-template-columns:repeat(3,1fr)}
    .timeline-wrap{grid-template-columns:repeat(3,1fr)}
    .z-layout .z-layout-box{width: 94%; padding-left: 12px}
    .z-layout-box .i-bwrap .ibj-con h3{padding-bottom: 1rem}

    .zpro-box{padding: 3rem 0}
    .zpro-box .top{padding: 0 12px}
    .prolist{grid-template-columns:repeat(2,1fr)}
    .dirplist{flex-wrap: wrap; padding: 1.5rem 0}
    .dirplist .col-right{width: 100%}
    .dirplist .ldivider{display: none;}
    .dirplist .divider{display: none;}

    .zshop-box{padding: 3rem 0}
    .tsshop-box .txt h3{font-size: 18px}
    .tsshop-box .txt p{padding-top: 1rem}
    .zshop-wrap{grid-template-columns:repeat(2,1fr); gap:10px 15px}
    .i-banner .banner .titbox.zplace{top: 17%; width: 100%}
    .zplace-box{padding: 3rem 0}
    .zplace-wrap{grid-template-columns:repeat(1,1fr);}
    .zplace-wrap .zplace-list{padding-bottom: 0}
    .zplace-wrap .zplace-list .con{padding: 1rem;height:90px }
    .i-banner .banner .titbox.fran{left: 1rem; top: 5%}
    .i-banner .banner .titbox.fran .hotline{padding-top: 1rem}
    .i-banner .banner .titbox.fran .hottxt{font-size: 18px}
    .i-banner .banner .titbox.fran .mailway{padding-top: 1rem}
    .z-process{padding: 3rem 0}
    .z-process-box{padding-left: 16px;}
    .zpbtop .zpbtop-wrap .one .no{ font-size: 2vw;}
    .zpbtop .zpbtop-wrap .one .title{font-size: 2vw;}
    .zpbtop .zpbtop-wrap .one .desc{font-size: 2vw;}
    .zpbtop .zpbtop-wrap .one{padding-left: 20px}
    .zpbbottom .zpbtop-wrap .one{padding-left: 20px}
    .zpbbottom .zpbtop-wrap .one .no{font-size: 2vw;}
    .zpbbottom .zpbtop-wrap .one .title{font-size: 2vw;}
    .zpbbottom .zpbtop-wrap .one .desc{font-size: 2vw;}
    .z-require{padding: 3rem 0}
    .z-require-box .zr-box .zr-bleft{gap:7px 15px; width: 100%}
    .z-require-box .zr-box .zr-bleft .zrb-list{padding-bottom: 3rem}
    .zrb-list .zrb-ltop img{width: 30px}
    .zsupport-wrap{grid-template-columns:repeat(3,1fr)}
    .z-support{padding: 3rem 0}
    .z-frpartner{padding: 2rem 0; background-color: #fce3cb}
    .z-frpartner .z-frpartner-box{padding-left: 20px; width: 90%; position: initial;}
    .z-frpartner .i-bwrap .ibj-con{width: 100%}
    .z-frpartner .i-bwrap .ibj-con .footer-title{color: #2c2c2c;}
    .z-frpartner .i-bwrap .ibj-con .form-desc{color: #2c2c2c;}
    .z-frpartner .i-bwrap .ibj-con .check-line{color: #2c2c2c;}
}