@media all and (max-width: 500px){
    .about .sub-visual .imgbox img{object-position: left;}
}
/* HISTORY */
.about .sec01{}
.about .sec01 .sub-title{margin-bottom: 20rem;}
.about .sec01 .sub-title h2{font-family: 'Kumbh Sans'; font-size: 6rem; font-weight: 800; margin-bottom: 3rem;}
.about .sec01 .sub-title p{line-height: 1.5; font-size: 1.8rem;}
@media all and (max-width: 768px){
    .about .sec01 .sub-title{margin-bottom: 56px;}
    .about .sec01 .sub-title h2{margin-bottom: 14px; font-size: 32px;}
}
.about .sec01 ul{position: relative; margin-bottom: 23rem;}
.about .sec01 ul::before{content:''; position:absolute; top:25px; left:50%; width:3px; height:100%; background:rgba(204, 204, 204, 0.3); }
.about .sec01 ul li{display: flex; margin-bottom: 25rem;}
.about .sec01 ul li:last-child{margin-bottom: 0;}
.about .sec01 ul li .imgbox{width: 50%; font-size: 0; padding-right: 14rem;}
.about .sec01 ul li .imgbox img{width: 100%;}
.about .sec01 ul li .txtbox{width: 50%; position: relative; align-items: flex-start;}
.about .sec01 ul li .txtbox .cont{display: flex; gap: 3rem;  align-items: flex-start;}
.about .sec01 ul li .txtbox .cont:not(:last-child){margin-bottom: 14rem;}
.about .sec01 ul li .txtbox .cont span{font-size: 4.8rem; font-weight: 700; position: relative; color: #62AAAA; padding-left: 4rem;} 
.about .sec01 ul li .txtbox .cont span::before{content: ""; width: 3.6rem; height: 3.6rem; position: absolute; background: url(../img/about-circle.svg) no-repeat center / cover; top: 50%; transform: translateY(-50%); left: -1.6rem;}
.about .sec01 ul li .txtbox .cont p{position: relative;  line-height: 1.6; color: #174A52; font-size: 18px; padding: 15px 20px 15px 0}
.about .sec01 ul li .txtbox p:not(:last-child){margin-bottom: 10px;}
.about .sec01 ul li:nth-child(2n){flex-direction: row-reverse; text-align: right;}
.about .sec01 ul li:nth-child(2n) .imgbox{padding-right: 0; padding-left: 14rem;}
.about .sec01 ul li:nth-child(2n) .txtbox{}
.about .sec01 ul li:nth-child(2n) .txtbox .cont{flex-direction: row-reverse; align-items: flex-start;}
.about .sec01 ul li:nth-child(2n) .txtbox .cont p{padding: 15px 0 15px 20px}
.about .sec01 ul li:nth-child(2n) .txtbox .cont span{padding-left: 0; padding-right: 4rem;}
.about .sec01 ul li:nth-child(2n) .txtbox .cont span::before{left: auto; right: -1.9rem;}
@media all and (max-width: 1024px){
    .about .sec01 ul{margin-bottom: 100px;}
    .about .sec01 ul::before{display: none;}
    .about .sec01 ul li:nth-child(2n),
    .about .sec01 ul li{flex-direction: column; gap: 40px; text-align: left; margin-bottom: 60px;}
    .about .sec01 ul li .imgbox,
    .about .sec01 ul li .txtbox{width: 100%;}
    .about .sec01 ul li .imgbox{padding-right: 60px;}
    .about .sec01 ul li .txtbox .cont{gap: 10px; flex-direction: column; align-items: flex-start;}
    .about .sec01 ul li .txtbox .cont span{font-size: 24px; padding-left: 40px;}
    .about .sec01 ul li .txtbox .cont span::before{left: 0; width: 22px; height: 22px;}
    .about .sec01 ul li .txtbox .cont p{font-size: 16px; padding-left: 40px;padding-top: 0}
    .about .sec01 ul li:nth-child(2n) .imgbox{padding-left: 60px;}
    .about .sec01 ul li .txtbox{padding-left: 45px;}
    .about .sec01 ul li .txtbox .cont:not(:last-child){margin-bottom: 40px;}
    .about .sec01 ul li:nth-child(2n) .txtbox .cont{flex-direction: column; }
    .about .sec01 ul li:nth-child(2n) .txtbox .cont span{padding-left: 40px; padding-right: 0;}
    .about .sec01 ul li:nth-child(2n) .txtbox .cont span::before{right: auto; left: 0;}
}