﻿@charset "utf-8"; 
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
#about{padding:80px 0px}
#about .more-btn {display: inline-block;padding: 10px 40px;border: 1px solid var(--color);background: var(--color);color: #FFFFFF;text-transform: lowercase;transition: color ease .3s, background ease .3s;}
#about .more-btn:hover{background: #FFFFFF;color: var(--color);}
#about .l-wrap{display:flex;width: 100%;max-width: 1600px;padding: 0px 70px;margin: 0px auto;}
#about .about-img,#about .about-con{width:50%}
#about .about-con{padding-left:100px}
#about .about-con .title{color:var(--color);font-weight:var(--fontbold6);margin-bottom:22px}
#about .about-con h3{font-size:32px;text-transform:uppercase;margin-bottom:20px}
#about .about-con h3>span{color:var(--color)}
#about .about-con .con{color:var(--introcolor);line-height:1.5em}
#about .about-con ul{margin:40px 0px 50px;padding-left:70px;position:relative;color:var(--fontcolor)}
#about .about-con ul li{line-height:1.5em;margin-bottom:10px;position:relative}
#about .about-con ul li:after{content:"";width:10px;height:10px;background:var(--color);position:absolute;top:8px;left:-20px}
#about .about-con ul:before,#about .about-con ul:after{content:"";height:100%;width:1px;background:var(--color);position:absolute;left:0px}
#about .about-con ul:after{left:14px;top:-22px}
#about .about-con ul:before{top:10px}
#about .about-img{padding-top:60px}
#about .about-img img{display:block;right:0px;width:90%;height:auto}
#about .about-img .img-wrap{position:relative;display:flex;justify-content:flex-end;z-index: 9;}
#about .about-img .dot,#about .about-img .box{position:absolute}
#about .about-img .dot{z-index:-2;background-image:radial-gradient(#D8D8D8 1.2px, rgba(0, 0, 0, 0) 1px);background-size:16px 16px}
#about .about-img .box{background:#F1F4F9;z-index:-1}
@media screen and (max-width:1470px){
#about .about-con{padding-left:50px}}
@media screen and (max-width:768px){
#about{padding:3vw}
#about .l-wrap{display:block;margin:0px}
#about .about-img,#about .about-con{width:100%}
#about .about-img{margin-bottom:40px}
#about .about-img img{width:100%}
#about .about-con{padding-left:0px}
#about .about-con h3,#about .about-con .title{text-align:center}
#about .about-con h3{font-size:var(--fontsize20)}
#about .about-con .title{margin-bottom:16px}
#about .about-con ul{margin:30px 0px 40px;padding-left:60px}}
main.index section.about-us .mb,main.index section.about-us>img,main.index section.about-us .block-box .pic{display: none;}
main.index section.about-us .block-box{height: auto;width: 100%;max-width: 100%;}
main.index section.about-us{width: 100%;height: auto;}
main.index section.about-us .block-box .content{width: 100%;padding: 0;}
main.index section.number ul{height:auto;margin-bottom:20px}
main.index section.number h3{text-align:center;margin:5px 0;font-size: 32px;}
main.index section.number ul.imgbox{justify-content: space-between;padding: 15px;}
main.index section.number ul.imgbox li{width:23%;margin-bottom:10px}
@media (max-width:768px){main.index section.number ul.imgbox{flex-wrap:wrap}
main.index section.number ul.imgbox li{width:48%}}
@media (min-width:1025px){header .top-box{width: 100%;max-width: 1920px;background: #fff;padding: 0 40px;}
header .top-box .info{padding: 5px 40px;}
header .top-box .info .left span,header .top-box .info .left span a, header .top-box .info .left span a:visited,header .top-box .info .right ul.sj li a{color: #000;}
header .top-box .nav-box{width: 100%;max-width: 100%;padding: 0 40px;background: #fff;}
header .top-box .nav-box.top-0{padding: 0 40px;}
header .top-box .nav-box .left{padding-left: 0;}
header .top-box .nav-box .right ul.nav1>li a,header .top-box .nav-box{color: #000;}
header .top-box .nav-box .right ul.nav1>li .inmenu_1,header .top-box .nav-box .right ul.nav1>li:hover>a,header .top-box .nav-box .right ul.nav1>li ul li:hover>a{color: #fff;}
header .top-box .nav-box .right ul.nav1>li .submenu{background: #fff;}
main.page-template-1 {padding-top: 100px;}
.swiper-box.index-swiper{padding-top: 100px;}
main.index {padding-top: 190px}}
@media (min-width: 1930px) {header .top-box .nav-box.top-0 {padding: 0 9vw;}}
#about .about-con h3{font-family: 'roboto', serif;}
 @media (min-width:1025px){header .top-box .info .left span,header .top-box .info .left span a,header .top-box .info .left span a:visited,header .top-box .info .right ul.sj li a, header .top-box .nav-box .right ul.nav1>li>a{color:#fff}
header .top-box,header .top-box .nav-box{background:#000}
}
@media (max-width:768px){.parent{padding-top:50px}
main.page-template-1 .max-width-box article .item ul li .box .left img{max-width:100%;object-fit:contain}}
aside .last-products li img{object-fit:contain}
@media (max-width:1475px){.productsDetails-article .details .right .btn-groups{justify-content:left}}
@media (max-width: 1200px) {main.page-template-1 .max-width-box article .productsDetails ul {display: flex;}
main.page-template-1 .max-width-box article .productsDetails ul li {width: 25%;}
.random-pro-list ul li a .pro-name {font-size: var(--fontsize14);}}