@charset "utf-8";
main b {font-weight: 700;}
main .box-tit {font-family: 'HSSaemaul-Regular';}
main .box-tit h3 {font-size: 6.5rem; letter-spacing: -0.03em;}
main .box-tit p {font-size: 4.5rem;}
main .box-txt {display: flex; flex-flow: column wrap; align-items: flex-start; margin-top: -10.5rem;}
main .box-txt h4 {font-size: 3rem; font-family: 'HSSaemaul-Regular'; display: inline-block; padding: 1rem 2.5rem; border: 1px solid #000; border-bottom:0; border-radius: 1.5rem 1.5rem 0 0;}
main .box-txt > div {padding: 2rem 3rem; background: #fff;border: 1px solid #000; width: 100%; border-radius: 0 1.5rem 1.5rem 1.5rem}
main .box-txt p {font-size: 2.3rem;}
main .box-txt p:not(:last-child) {margin-bottom: 1rem;}
main .box-txt .arr {justify-content: flex-end; align-items: center; margin-top: 1rem;}
main .box-txt .arr h5 {font-size: 1.8rem; font-weight: 500; margin-right: 1.4rem; padding-block: .5rem; position: relative;}
main .box-txt .arr h5::before {content:""; position: absolute; bottom:0; left:0; width: 0; height: .5px; background: #000; transition: all .3s;}
main .box-txt .arr div {width: 4rem; height: 4rem; border-radius: 50%; background: #000; align-items: center; justify-content: center; padding: .8rem; position: relative;}
main .box-txt .arr div::before {content:""; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); width: 0; height: 0; background: #fff; border-radius: 50%; transition: all .3s; border: 1px solid #000;}
main .box-txt .arr img {position: relative; z-index: 1;}
main .box a:hover .arr div::before {width: 101%; height: 101%;}
main .box a:hover .arr img {filter: brightness(0);}
main .box a:hover .arr h5::before {width: 100%;}
@media (max-width:800px) {
    main .box-txt {margin-top: -4rem;}
    main .box-txt p {padding-left: 1rem; text-indent: -1rem;}
}

.main01 {padding-block: 16rem 9rem; text-align: center; background: #e0f6ff;}
.main01 #m1-title {width: min(700px,90%); margin: 0 auto;}
.main01 p {font-size: 2.6rem; font-weight: 500; line-height: 1.6; letter-spacing: -0.03em; margin-block:0 5rem;}
@media (max-width:1080px) {
    .main01 p {font-size: 2.4rem;}
}
@media (max-width:800px) {
    .main01 p {max-width: 590px; margin-inline: auto;}
    .main01 p br {display: none;}
}

.main02 {padding-block: 9rem 13rem;background: #e0f6ff;}
.main02 .box-wrap {display: grid; grid-template-columns: repeat(2,1fr); gap: 9rem;}
.main02 .box-tit {margin-bottom: 4.5rem;}
.main02 .box-tit p {color: #4ab7f0;}
.main02 .box-img {margin-left: 7rem;}
.main02 .box-txt {margin-right: 4rem; position: relative;;}
.main02 .box-txt h4 { background: #a5dff7}
.main02 .box2 {margin-top: 10rem;}
.main02 .box2 .box-txt h4 {background: #c6eb6d; padding-left: 1rem;}
.main02 .box2 .box-txt h4 span {font-family: '굴림';}
@media (max-width:1200px) {
    .main02 .box-wrap {gap: 7rem;}
}
@media (max-width:1080px) {
    .main02 .box-wrap {gap: 6rem;}
}
@media (max-width:800px) {
    .main02 .box-wrap {grid-template-columns: repeat(1,1fr);gap: 8rem;}
    .main02 .box2 {margin-top: 0;}
    .main02 .box-img {text-align: right;}
    .main02 .box-img img {width: 100%;}
    .main02 .box-tit {margin-bottom: 3.5rem;}
}

.main03 {padding-block: 16rem 9rem;background: url(../images/main/main_bg_1.jpg) #fff7e0 no-repeat center top / 100%;}
.main03 .box-content {width: min(1100px,100%); margin-inline: auto;}
.main03 .box-tit {margin-bottom: 7rem;}
.main03 .box-tit h3 {font-size: 7rem;}
.main03 .box-tit p {color: #ff936d;}
.main03 .box-txt {width: 50%; margin-inline: auto 0; align-items: flex-end;}
.main03 .box-txt h4 { background: #ff936d}
.main03 .box-txt > div {border-radius: 1.5rem 0 1.5rem 1.5rem ;}
.main03 .box-img {margin-right: 4rem;}
@media (max-width:1200px) {
    .main03 .box-txt {width: max-content;}
}
@media (max-width:800px) {
    .main03 .box-txt {width: 96%;}
}

.main04 {background: #fff7e0; padding-bottom: 15rem;}

.main04 .inner {overflow: hidden; text-align: center; }
.main04 h3 {max-width:930px; padding: 1rem 0; background: #ff936d; border: 1px solid #000; border-radius: 5rem; font-size: 4.3rem; margin: 0 auto;}
.main04 h4 {font-size: 3.8rem; margin-block: 4rem 4.5rem;}
.main04 .main04-slide { padding-inline: 15vw; position: relative; overflow: hidden; padding-bottom: 5px;} 
.main04 .main04-slide .swiper-slide {border-radius: 2rem; overflow: hidden; border: 1px solid #000; display: flex; }
.main04 .main04-slide .swiper-slide img {width: 100%; height: 100%;}
.main04 .main04-slide .swiper-slide {opacity: 0.5;}
.main04 .main04-slide .swiper-slide-active,
.main04 .main04-slide .swiper-slide-next,
.main04 .main04-slide .swiper-slide-next + .swiper-slide {opacity: 1;}
.main04 .swiper-button-prev, 
.main04 .swiper-button-next {background-image: none; top:50%; width: 5rem; height: 5rem; border-radius: 50%; background: #000; display: flex; flex-flow: row wrap; justify-content: center; align-items: center;}
.main04 .swiper-button-prev {left: 13.5vw;}
.main04 .swiper-button-next {right: 13.5vw; left: auto;}
.main04 .swiper-button-prev img, 
.main04 .swiper-button-next img {width: 45%; position: relative; z-index: 1;}
.main04 .swiper-button-prev img {transform: scale(-1,1);}
.main04 .swiper-button-prev::before,
.main04 .swiper-button-next::before {content:""; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); width: 0; height: 0; background: #fff; border-radius: 50%; transition: all .3s; border: 1px solid #000;}
.main04 .swiper-button-prev:hover::before,
.main04 .swiper-button-next:hover::before {width: 101%; height: 101%;}
.main04 .swiper-button-prev:hover img, 
.main04 .swiper-button-next:hover img {filter: brightness(0);}
@media (max-width:1200px) {
    .main04 .inner {width: 100%; margin: 0; padding: 0 4%;}
    .main04 .main04-slide { padding-inline: 12%; }
    .main04 .swiper-button-prev, 
    /* .main04 .swiper-button-next {width: 4.5rem; height: 4.5rem;} */
    .main04 .swiper-button-prev {left: 9.5vw;}
    .main04 .swiper-button-next {right: 9.5vw; }
}

.main05 {padding-block: 16rem 12rem;background: url(../images/main/main_bg_2.jpg) #e9f9d8 no-repeat center top / 100%; }
.main05 h3 { margin-block:4rem 8rem;}
.main05 .box-wrap {display: flex; flex-flow: row wrap; justify-content: space-between; padding-inline: 15vw; }
.main05 .box {width: 20vw; height: 20vw; position: relative; transition: all 0.5s ease-in-out;}
.main05 .box div {width: 100%; height: 100%; border:1px solid #000; position: relative; z-index: 2;}
.main05 .box::before {content: ""; position: absolute; top:1rem; right:-1rem; width: 100%; height: 100%; z-index: 1;border:1px solid #000;}
.main05 .box h4 {font-size: min(33px,1.7vw);font-weight: 600;text-align: center;line-height: 1.4;padding: 5.5rem 1rem;}
.main05 .box1 div {background: url(../images/main/main5_1.png) #ddf6a2 no-repeat bottom center / 72%; border-radius: 50%;}
.main05 .box1::before {background: #9ecb32;border-radius: 50%;}
.main05 .box2 div {background: url(../images/main/main5_2.png) #d1f2ff no-repeat bottom center / 72%; border-radius: 10rem;}
.main05 .box2::before {background: #a5dff7; border-radius: 10rem;}
.main05 .box3 div {background: url(../images/main/main5_3.png) #ffd4c5 no-repeat center 90% / 72%; border-radius: 2rem 10rem;}
.main05 .box3::before {background: #ff936d;border-radius: 2rem 10rem;}
.main05 .box:hover {transform: translateY(-2rem);}

.main05 .box-wrap[data-aos^=fade][data-aos^=fade] {opacity: 1;}
.main05 .box-wrap .box {opacity: 0;}
.main05 .box-wrap .box2{ transform: translateX(-100%) rotate(-45deg);}
.main05 .box-wrap .box3{ transform: translateX(-200%);}
.main05 .box-wrap.aos-animate .box {opacity: 1;}
.main05 .box-wrap.aos-animate .box2 {transform: translateX(0) rotate(0);}
.main05 .box-wrap.aos-animate .box3 {transform: translateX(0);}
.main05 .box-wrap.aos-animate .box2:hover {transform: translateX(0) rotate(0) translateY(-2rem);}
.main05 .box-wrap.aos-animate .box3:hover {transform: translateX(0) translateY(-2rem);}

@media (max-width:1720px) {
    .main05 .box-wrap {padding-inline: 0; max-width: 1200px; margin-inline: auto;}
    .main05 .box {width: 35rem; height: 35rem;}
    .main05 .box h4 {font-size: 3rem;}
}
@media (max-width:1200px) {
    .main05 h3 {font-size: 7rem;}
    .main05 .box-wrap {padding-inline: 4%;}
    .main05 .box {width: 27vw; height: 27vw;}
    .main05 .box div {background-size: 70%;}
}
@media (max-width:1080px) {
    .main05 .box h4 {font-size: 2.6rem; line-height: 1.4; padding: 4.8rem 1rem;}
}
@media (max-width:800px) {
    .main05 .box-wrap {justify-content: center; gap: 6rem;}
    .main05 .box {width: min(500px,80vw); height: min(500px,80vw);}
    .main05 .box h4 {font-size: min(28px,6.5vw); line-height: 1.5; padding: 12vw 1rem;}
    .main05 .box-wrap .box2,
    .main05 .box-wrap .box3{ transform: none;}
}



@media (max-width:1400px) {
    
}
@media (max-width:1200px) {
    
}
@media (max-width:1080px) {
    
}
@media (max-width:800px) {
    
}