
.visual{background-image: url(../img/sub06/visual.png); }
@media all and (max-width:1200px){}
@media all and (max-width:1024px){}
@media all and (max-width:768px){}

.sec01{}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    
}
@media all and (max-width:768px){
    
}

.sec01{padding: 12vw 0 14vw;}
.sec01 .top{display: flex; justify-content: space-between; align-items: flex-start; gap: 6vw;}
.sec01 .txtbox{padding-top: 4rem;}
.sec01 .txtbox h2{width: max-content; padding-bottom: 3.3vw;}
.sec01 .txtbox h3{}
.sec01 .imgbox{}
.sec01 .imgbox img{}
.sec01 .btm{margin-top: 5vw; font-size: 3.8rem;}
.sec01 .btm ul{display: flex; text-align: center; color: #fff; border-radius: 7rem; padding: 7rem 0; font-weight: 700;}
.sec01 .btm ul li{flex: 1; border-right: 1px solid #fff;}
.sec01 .btm ul li:last-child{border: none;}
.sec01 .btm ul li p{}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .sec01{padding: 80px 0;}
    .sec01 .top{gap: 30px;}
    .sec01 .txtbox h2{font-size: 35px;}
    .sec01 .btm{font-size: 28px;}
    .sec01 .btm ul{flex-wrap: wrap; gap: 50px 0;}
    .sec01 .btm ul li{flex: auto; width: 50%;}
    .sec01 .btm ul li:nth-child(2){border: none;}
}
@media all and (max-width:768px){
    .sec01 .top{flex-direction: column;}
    .sec01 .txtbox{padding-top: 0;}
    .sec01 .txtbox h2{font-size: 30px;}
    .sec01 .txtbox h3{width: auto;}
    .sec01 .imgbox{width: 100%;}
    .sec01 .imgbox img{width: 100%;}
    .sec01 .btm{font-size: 20px; margin-top: 20px;}
    .sec01 .btm ul{border-radius: 30px; padding: 30px 0;}
}


.sec02{padding: 11vw 0 12vw; background: #fdf2e3;}
.sec02 h2{padding-bottom: 2.5vw;}
.sec02 h3{font-size: 2.5rem; padding-bottom: 7.5vw;}
.sec02 ul{display: flex; gap: 3rem;}
.sec02 ul li{flex: 1;}
.sec02 ul li .imgbox{margin-bottom: 5rem; text-align: center;}
.sec02 ul li .imgbox img{}
.sec02 ul li p{text-align: center; background: #424242; color: #fff; font-size: 3rem; font-weight: 500; border-radius: 100px; padding: 1.5rem 2rem 2rem;}

@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .sec02{padding: 80px 0;}
    .sec02 h3{font-size: 18px;}
    .sec02 ul li p{font-size: 20px;}
}
@media all and (max-width:768px){
    .sec02 h3{padding-bottom: 0; font-size: 16px;}
    .sec02 ul{flex-direction: column; gap: 30px;}
    .sec02 ul li p{font-size: 18px;}
}

.sec03{padding: 15vw 0 14vw;}
.sec003-1{}
.sec003-2{background: #f0f0f0;}
.sec003-3{}
.sec03 .title{text-align: center; padding-bottom: 7vw;}
.sec03 .title h3{font-size: 3.8rem;}
.sec03 .title h2{}
.sec03 .cont01{display: flex; justify-content: space-between; margin-bottom: 5vw; gap: 20px; align-items: center;}
.sec03 .cont01 .imgbox{flex: 1;}
.sec03 .cont01 .imgbox img{max-width: 90%;}
.sec03 .cont01 .txtbox{width: 60rem;}
.sec03 .cont01 .txtbox h3{font-size: 3.5rem; border-bottom: 1px solid #33373f;  padding-bottom: 10px; margin-bottom: 3rem;}
.sec03 .cont01 .txtbox p{font-size: 2.9rem; line-height: 1.6;}
.sec03 .cont01 .txtbox p b{color: #ff8316;}
.sec03 .cont02{display: flex; justify-content: space-between; gap: 20px;}
.sec03 .cont02 .item{background: linear-gradient(90deg, #ff8316 0%, #ff9335 100%); color: #fff; flex: 1; height: 25rem; border-radius: 4rem; padding: 0 30px; display: flex; align-items: center; font-size: 3.6rem; font-weight: 600; max-width: 420px; justify-content: center;}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .sec03{padding: 80px 0;}
    .sec03 .title{padding-bottom: 50px;}
    .sec03 .title h3{font-size: 28px;}
    .sec03 .cont01 .txtbox{width: 420px;}
    .sec03 .cont01 .txtbox h3{font-size: 24px;}
    .sec03 .cont01 .txtbox p{font-size: 20px;}
    .sec03 .cont02 .item{font-size: 24px; padding: 0 30px;}
}
@media all and (max-width:768px){
    .sec03 .title h3{font-size: 20px;}
    .sec03 .cont01{flex-direction: column;}
    .sec03 .cont01 .imgbox{text-align: center;}
    .sec03 .cont01 .txtbox{width: 100%;}
    .sec03 .cont01 .txtbox h3{font-size: 20px;}
    .sec03 .cont01 .txtbox p{font-size: 18px;}
    .sec03 .cont02{flex-direction: column;}
    .sec03 .cont02 .item{font-size: 20px; height: 100px; max-width: none; flex: none;}
    .sec03 .cont02 .item p br{display: none;}
}
@media all and (max-width:500px){
    .sec03 .cont02 .item{height: 80px; border-radius: 20px;}
}

