﻿#about{padding:80px 0px;padding-bottom:0}
#about .l-wrap{display:flex}
#about .about-img,#about .about-con{width:50%}
.tab{display:flex;flex-wrap:wrap;justify-content:center;align-items:center}
.tab .tab-item.is-current:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%,-5px);display:block;width:0px;height:0px;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #FFF}
.tab .tab-item{padding:15px 50px;margin:0px 15px 15px 0px;background:#F4F4F4;color:var(--fontcolor);font-weight:var(--fontbold6)}
.tab .tab-item.is-current{background-color:var(--color);position:relative;color:#FFFFFF}
#about .about-con{padding-left:100px}
#about .about-con .title{color:var(--color);font-weight:var(--fontbold6);margin-bottom:22px}
#about .about-con h3,#about .about-con h1{font-size:var(--fontsize32);text-transform:uppercase;margin-bottom:20px}
#about .about-con h3>span,#about .about-con h1>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}
#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}
.about-adv{display:flex;margin:80px 0px 60px}
.about-adv>li{width:25%}
.about-adv .icon-item{display:flex;justify-content:center}
.about-adv .icon-item>div{margin-left:20px}
.about-adv .icon-item>.icon-img{margin-left:0px}
.about-adv .num{font-size:var(--fontsize32);color:var(--fontcolor);line-height:1;font-weight:var(--fontbold6)}
.about-adv .text{color:var(--introcolor)}
.about-part{margin-bottom:60px}
.about-part .part-item{display:flex}
.about-part .part-item>div{width:50%}
.about-part .part-item:nth-last-child(1) .part-img{justify-content:flex-start}
.about-part .part-con{background:#F6F6F7;padding:70px;box-sizing:border-box}
.about-part .part-img{display:flex;flex-direction:column;justify-content:flex-end}
.about-part .part-img img{width:100%;height:auto}
.about-part .title{position:relative;text-align:center;color:var(--fontcolor);padding-bottom:10px;margin-bottom:20px;font-size:var(--fontsize32)}
.about-part .title:after{content:"";position:absolute;width:80px;height:2px;left:50%;top:100%;transform:translateX(-50%);background:var(--color)}
.about-part .con{line-height:1.8em;color:var(--introcolor)}
@media screen and (max-width:1680px){.about-part .part-con{padding:60px 40px}
}@media screen and (max-width:1470px){.about-part .part-con{padding:30px 20px}
.about-part .title{margin-bottom:20px}
}@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-part .part-item{flex-direction:column}
.about-part .part-item:nth-of-type(2n){flex-direction:column-reverse}
.about-part .part-item>div{width:100%}
.about-part .part-con{padding:5.3333333333vw}
.about-part .title{font-weight:var(--fontbold6);font-size:var(--fontsize18);padding-bottom:6px}
.about-part{margin-bottom:12vw}
#about .about-con{padding-left:0px}
#about .about-con h3,#about .about-con .title{text-align:center}
#about .about-con h3,#about .about-con h1{font-size:var(--fontsize20)}
#about .about-con .title{margin-bottom:16px}
#about .about-con ul{margin:30px 0px 40px;padding-left:60px}
.about-adv{-ms-flex-wrap:wrap;flex-wrap:wrap;margin:12vw 0px}
.about-adv>li{width:50%;margin-bottom:4vw}
.about-adv .num{font-size:var(--fontsize14);margin:2vw 0px}
.about-adv .icon-item{display:block;text-align:center}
.about-adv .icon-item>div{margin-left:0px}
.about-adv .text{font-size:var(--fontsize12)}
}