
.visual{background-image: url(../img/sub06/visual.png);}

.sec01{padding: 10rem 0 14rem;}
.sec01 .inner{display: flex; align-items: center; gap: 30px; justify-content: space-between; max-width: 1180px;}
.sec01 .txtbox{}
.sec01 .txtbox h2{padding-bottom: 4rem;}
.sec01 .txtbox h3{}
.sec01 .imgbox{width: 35%;}
.sec01 .imgbox img{}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .sec01{padding: 80px 0;}
    .sec01 .txtbox h2{padding-bottom: 30px;}
}
@media all and (max-width:768px){
    .sec01 .inner{flex-wrap: wrap;}
    .sec01 .imgbox{width: 100%; max-width: 400px;}
    .sec01 .txtbox h2{padding-bottom: 10px;}
}
.sec02{padding: 23rem 0; text-align: center; background: url(../img/sub06/sec02-bg.png) no-repeat center / cover;}
.sec02 .inner{max-width: 1400px;}
.sec02 .txtbox{color: #fff; padding-bottom: 8rem;}
.sec02 .txtbox h2{color: #fff; padding-bottom: 3rem;}
.sec02 .txtbox h2 b{color: #fff;}
.sec02 .txtbox h3{}
.sec02 ul{display: flex; gap: 7rem; flex-wrap: wrap;}
.sec02 ul li{width: calc((100% - 7rem) / 2); border-radius: 4rem; overflow: hidden;}
.sec02 ul li h4{font-size: 4.6rem; font-weight: 700; height: 18rem; display: flex; align-items: center; justify-content: center; background: #fff; padding: 10px;}
.sec02 ul li p{font-size: 3.3rem; height: 20rem; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.7); padding: 10px;}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .sec02{padding: 80px 0;}
    .sec02 .txtbox{padding-bottom: 30px;}
    .sec02 ul{gap: 30px;}
    .sec02 ul li{width: calc((100% - 30px) / 2);}
    .sec02 ul li h4{font-size: 24px; height: 100px;}
    .sec02 ul li p{font-size: 20px; height: 100px;}
}
@media all and (max-width:768px){
    .sec02 ul{gap: 20px;}
    .sec02 ul li{width: 100%;}
    .sec02 ul li h4{font-size: 20px; height: 70px;}
    .sec02 ul li p{font-size: 16px; height: 70px;}
}
.sec03{padding-top: 24rem;}
.sec03 .inner{}
.sec03 h2{text-align: center; padding-bottom: 7rem; }
.sec03 ul{display: flex; flex-direction: column; gap: 2rem; width: 100%; max-width: 71rem; margin: 0 auto;}
.sec03 ul li{background: #f5f0ed; display: flex; padding: 4rem 7rem; gap: 2rem; align-items: center; border-radius: 20rem;}
.sec03 ul li span{color: #cb9d89; font-size: 4rem; font-weight: 700;}
.sec03 ul li p{font-size: 2.7rem;}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .sec03{padding-top: 80px;}
    .sec03 h2{padding-bottom: 30px;}
    .sec03 ul li{padding: 25px 40px;}
    .sec03 ul li span{font-size: 28px;}
    .sec03 ul li p{font-size: 20px;}
}
@media all and (max-width:768px){
    .sec03 ul li{align-items: flex-start; padding: 20px 30px;}
    .sec03 ul li span{font-size: 20px;}
    .sec03 ul li p{font-size: 16px;}
}
.sec04{padding-top: 24rem;}
.sec04 .inner{max-width: 1750px;}
.sec04 .cont{display: flex; gap: 8rem; align-items: center; padding-left: 14vw; background: #f3f3f3; border-radius: 1000px; height: 26vw;}
.sec04 .cont .txtbox{position: relative; z-index: 1;}
.sec04 .cont .txtbox h2{padding-bottom: 4rem; width: max-content;}
.sec04 .cont .txtbox h3{}
.sec04 .cont .imgbox{font-size: 0; position: absolute; right: 14vw; bottom: 0; width: 25%;}
@media all and (max-width:1300px){
    .sec04 .cont{padding-left: 100px;}
    .sec04 .cont .imgbox{right: 150px;}
}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .sec04{padding-top: 80px;}
    .sec04 .cont .txtbox h2{padding-bottom: 30px;}
    .sec04 .cont{height: auto; padding: 30px 20px; padding-bottom: 0; flex-direction: column;  border-radius: 50px; gap: 30px; text-align: center;}
    .sec04 .cont .txtbox h2{width: auto;}
    .sec04 .cont .imgbox{position: relative; right: auto; background-attachment: fixed;  width: 100%; max-width: 200px;}
    
}
@media all and (max-width:768px){
    
}
