@charset "utf-8";

/* section1 */
#section1{position: relative; padding-top: 56px; overflow: hidden;}
#section1 .slick-slide{position: relative;}
#section1 .main_tit{top: 34%; padding: 0 20px;}
#section1 .main_tit .text{overflow: hidden;}
#section1 .main_tit .text span{display: block; font-size: 13px; color: #fff; animation-delay: .2s; font-weight: 300;}
#section1 .count_wrap{display: flex; gap: 0 15px; position: absolute; left:20px; bottom: 66px;  line-height: 1;}
#section1 .count_wrap span{font-size: 13px; color: #fff;}
#section1 .count_wrap .count{font-size: 13px; color: #fff; transition-delay: .3s; font-weight: 300;}
#section1 .count_wrap .count em{position: relative; margin-right: 15px; font-weight: 400;}
#section1 .count_wrap .count em::after{content: ''; position: absolute; top: 6px; right:-10px; width: 1px; height: 8px; background-color: #fff; opacity: .5; }

/* section2 */
#section2{position: relative; overflow: hidden;} 
#section2 .com_tit h3 em{margin-bottom: 24px;}
#section2 .section2{position: relative; padding: 65px 0 0;  height: 740px;}
#section2 .com_link{position: absolute; top: 583px; left:50px; }
.com_tit{margin-bottom: 26px;}
.com_tit h3 em{position: relative; display: block; font-size: 19px; color: #131313; font-family: 'Constantia'; font-weight: 400;}
.com_tit h3 em::after{content: ''; position: absolute; left:0; bottom: 0; width: 105px; height: 1px; background-color: #000;}
.com_tit h3 span{display: block; margin-bottom: 12px; font-size: 27px; color: #131313; font-weight: 500; font-family: 'Noto Serif KR', serif; font-weight: 300;}
.com_tit p{color: #494949; line-height: 1.8; letter-spacing: -1px;}
#section2 .img{position: absolute; background-repeat: no-repeat; background-size: auto 100%;}
#section2 .img1{padding:76px 52px 0 0; top: 143px; right: 0; background-image: url(../n_images/main/main1/section2_img1.png);}
#section2 .img2{padding: 165px 165px 0 0; bottom: 214px; left: -60px; background-image: url(../n_images/main/main1/section2_img2.png); }
#section2 .slick_wrap{width: 100%; position: absolute; bottom: -24px; z-index: 9;}
#section2 .slick_wrap .slick a{display: block; width: 267px;}
#section2 .slick_wrap .slick a img{display: block;}
#section2 .slick-list{overflow: visible;}

@media (max-width: 360px){

    .com_tit p br{display: none;}

}

/* section3 */
#section3{position: relative; padding: 86px 0 120px; background: url(../n_images/main/main1/section3_bg.png)no-repeat; background-size: cover!important;} 
#section3 .com_tit{margin-bottom: 40px;}
#section3 .com_tit h3 em{display: inline-block; margin-bottom: 23px; height: 30px; color: #fff;}
#section3 .com_tit h3 em::after{width: 100%; height: 2px; background-color: #fff;}
#section3 .com_tit h3 span{color: #fff;}
#section3 .com_tit p{color: #fff; font-weight: 300;}
#section3 .com_tit p br{display: none;}
#section3 .tit_wrap{text-align: right;}
#section3 .tit{display: inline-block; text-align: left;}
#section3 .tit h3{margin-bottom: 30px;}
#section3 .tit h3 span{font-size: 55px; color: #fff; font-family: 'Noto Serif KR', serif; font-weight: 500; letter-spacing: -4px;}
#section3 .tit h3 em{display: block; font-size: 94px; color: #ecedf1; font-family: 'Constantia'; font-weight: 400; opacity: 35%;}
#section3 .tit p{font-size: 20px; color: #fff; line-height: 1.8; font-weight: 300;}
#section3 .com_style_list li{width: 315px;}
#section3 .com_style_list li a{position: relative; display: block; border-radius: 10px; overflow: hidden; box-shadow: 28px 96px 92px rgba(0,0,0,10%); background: #fff;}
#section3 .com_style_list li a img{display: block; width: 100%;}
#section3 .com_style_list li a.op_effect{transition-delay: .25s;}
#section3 .com_style_list li a .box{display: flex; gap: 0 10px; align-items: center; position: absolute; left:76px; top:49px; line-height: 1;}
#section3 .com_style_list li a .box em{font-family: 'Constantia'; font-weight: 500; font-size: 22px; color: #fff;}
#section3 .com_style_list li a .box span{padding-top: 4px; font-size: 17px; color: #fff;}
#section3 .com_style_list li a .box.st em{color: #131313;}
#section3 .com_style_list li a .box.st span{color: #131313;}
#section3 .com_style_list li a .text h4{margin-bottom: 34px; font-family: 'Noto Serif KR', serif; font-weight: 500; color: #131313; font-size: 40px;}
#section3 .com_style_list li a .text p{font-size: 17px; color: #131313; line-height: 1.6;}
#section3 .com_style_list li a .view{position: absolute; padding: 44px 44px 0 0; background: url(../n_images/main/main1/view.png)no-repeat;}
#section3 .com_style_list li a .view.st{background: url(../n_images/main/main1/view2.png)no-repeat;}
#section3 .slick-list{overflow: visible;}
#section3 .swiper-scrollbar{position: static; width: 100%; height: 3px; margin-top: 60px; background-color: #cdd0d8; border-radius: 0;}
#section3 .swiper-scrollbar-drag{background-color: #121212;}
#section3 .swiper-container{margin-bottom: 60px;}
#section3 .swiper-container:nth-last-of-type(1){margin-bottom: 0;}
#section3 .tit_wrap:nth-of-type(2){padding-left: 137px; text-align: left;}
#section3 .tit_wrap:nth-of-type(2) h3{margin-bottom: 58px;}
#section3 .com_style_list.st2{margin-top: 0; padding: 0;}
#section3 .com_style_list.st2 li:nth-child(1){/*margin:146px 303px 0 0;*/margin:17px 303px 0 0;}
#section3 .com_style_list.st2 li:nth-child(1) a{padding-top: 144px; width: 541px; height: 637px; background: url(../n_images/main/main1/section3_img5.png)no-repeat;}
#section3 .com_style_list.st2 li:nth-child(1) a .box{top: 66px;}
#section3 .com_style_list.st2 li:nth-child(1) a .box span{padding-top: 0; font-size: 22px; font-family: 'Constantia'; color: #fff;}
#section3 .com_style_list.st2 li a .text h4{margin-bottom: 38px; letter-spacing: -4px;}
#section3 .com_style_list.st2 li:nth-child(1) a .text h4,
#section3 .com_style_list.st2 li:nth-child(1) a .text p{color: #fff;}
#section3 .com_style_list.st2 li:nth-child(1) a .view{top:153px; right:60px;}
#section3 .com_style_list.st2 li:nth-child(2){margin: -195px 0 0;}
#section3 .com_style_list.st2 li:nth-child(2) a{padding-top: 134px; width: 573px; height: 814px; background: url(../n_images/main/main1/section3_img6.png)no-repeat; overflow: visible; z-index: 8;} 
#section3 .com_style_list.st2 li:nth-child(2) a::after{content: ''; position: absolute; bottom: 164px; left:-40px; background: url(../n_images/main/main1/img01.png)no-repeat; width: 96px; height: 93px;}
#section3 .com_style_list.st2 li:nth-child(2) a .view{top:143px; right:74px;}
#section3 .text_img{display: flex; align-items: center; gap: 0 35px; position: absolute; bottom: 70px; animation: text_effect 8s linear infinite;}
#section3 .text_img img{display: block;}

@keyframes text_effect {
    
    0%{transform: translateX(0);}
    100%{transform: translateX(-50%);}

}

/* section4 */
#section4{padding: 25px 0 0;}
.com_tit.st h3 span{font-size: 35px; font-family: 'Constantia'; color: #131313; font-weight: 500;}
#section4 .swiper-container{padding: 0 20px;}
#section4 .section4{position: relative;}
#section4 .section4 .com_link{position: absolute; top:68px; left: 484px}
#section4 .story_list{display: flex; }
#section4 .story_list li{width: 316px;}
#section4 .story_list li a{position: relative; display: block;}
#section4 .story_list li a .img{border-radius: 7px; overflow: hidden;}
#section4 .story_list li a .img img{display: block;  transition: all .5s;}
#section4 .story_list li a .text{position: absolute; top:385px; left:56px;}
#section4 .story_list li a .text h4{margin-bottom: 22px; line-height: 1; color: #fff; font-weight: 500; font-size: 40px; letter-spacing: -3px; font-family: 'Noto Serif KR', serif;}
#section4 .story_list li a .text p{font-size: 19px; color: #fff; line-height: 30px;}
#section4 .swiper-scrollbar{position: static; width: 100%; height: 3px; margin-top: 39px; background-color: #cdd0d8; border-radius: 0;}
#section4 .swiper-scrollbar-drag{background-color: #121212;}

/* section5 */
#section5{padding: 48px 0 63px; margin-top: 86px; border-top: 1px solid #c2c5cf;}
#section5 .is-inview{animation: op_effect 1s both;}
#section5 .section5 .com_link{position: absolute; top:22px; right:0; font-size: 10px; font-weight: 700; color:#131313; }
#section5 .section5 .com_link::after{content: ''; position: absolute; left:0; right:0; bottom: -5px; height: 1px; background-color: #9b9b9b;}
#section5 .section5{position: relative;}
#section5 .news_list li a{display: block; padding: 19px 0; height: 57px; font-size: 14px; color: #131313; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; border-bottom: 1px solid #e1e3ea;}
#section5 .news_list li:last-child a{border-bottom: 0;}

/* 외과센터 */
#wrap.st1 #section3{padding: 86px 0 136px; position: relative; background: url(../n_images/main/main2/section3_bg.png)no-repeat; background-size: cover ;}
#wrap.st1 #section3 .com_tit + img{display: block; width: 100%; margin: 0 auto 65px;}
#wrap.st1 #section3 .text_img + .img_wrap{box-shadow: 6px 23px 26px rgba(0,0,0,10%); border-radius: 50%; overflow: hidden;}
#wrap.st1 #section3 .text_img + .img_wrap img{display: block; width: 100%;}

@media (max-width: 360px) {

    #wrap.st1 #section3{margin-bottom: -35px;}

}

/* 척추관절센터 */
#wrap.st2 #section3{background: url(../n_images/main/main3/section3_bg.png)no-repeat;}
#wrap.st2 #section1 .main_tit{top: 34%;}
#wrap.st2 #section3 .com_tit + img{display: block; width: 100%; margin: 0 auto 65px;}
#wrap.st2 #section3 .text_img + .img_wrap img{display: block; width: 100%;}

@media (max-width: 360px) {

    #wrap.st1 #section3{margin-bottom: -35px;}

}

/* 내과센터 */
#wrap.st3 #section3{background: url(../n_images/main/main4/section3_bg.png)no-repeat;}
#wrap.st3 #section1 .main_tit{top: 32%;}
#wrap.st3 #section3 .com_tit + img{display: block; width: 100%; margin: 0 auto 65px;}
#wrap.st3 #section3 .text_img + .img_wrap img{display: block; width: 100%;}

/* 피부성형센터 */
#wrap.st4 #section1 .main_tit{top: 42%;}
#wrap.st4 #section3 .com_tit + img{display: block; width: 100%; margin: 0 auto 65px;}
#wrap.st4 #section3 .text_img + .img_wrap img{display: block; width: 100%;}
#wrap.st4 #section3{background: url(../n_images/main/main5/section3_bg.png)no-repeat;}
#wrap.st4 #section3 .com_tit p br{display: block;}
#wrap.st4 #section3 .link{margin-top: 26px; display: flex; flex-wrap: wrap; gap: 0 6px;}
#wrap.st4 #section3 .link li{margin-bottom: 7px;}
#wrap.st4 #section3 .link li a{display: block; width: 125px; height: 31px; line-height: 29px; font-size: 12px; font-weight: 500; color: #131313; background-color: #fff; border-radius: 50px; border: 1px solid #d2d4db; text-align: center;}

#popup {
    position: absolute;
    width: 70vw;
    top: 2%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99999;
}

#popup img {
    display: block;
    width: 100%;
}

#popup a {
    position: absolute;
    display: block;
}

#popup .view {
    bottom: 15vw;
    left: 50%;
    transform: translateX(-50%);
    width: 25vw;
    height: 5.5vw;
    opacity: .5;
}

#popup #check {
    position: absolute;
    bottom: 3.5vw;
    left: 37px
}

#popup #chkday:checked+.chkday::before {
    content: '\2714';
    text-align: center;
    line-height: 2.4vw;
}

#popup .chkday {
    padding-left: 3.6vw;
    position: relative;
    cursor: pointer;
    color: #696969;
    font-weight: 500;
    font-size: 2vw;
}

#popup .chkday::before {
    content: '';
    position: absolute;
    top: 0.3vw;
    left: 0;
    width: 2.5vw;
    height: 2.5vw;
    border-radius: 2vw;
    border: 0.2vw solid #5e5c5c;
}

#popup .box {
    padding: 0 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0px;
    height: 10vw;
}

#popup #close {
    position: absolute;
    bottom: 3.5vw;
    right: 20px;
    width: 53px;
    height: 21px;
    font-size: 15px;
    color: #696969;
    font-weight: 500;
    cursor: pointer;
    text-align: center;
}

@media (max-width: 576px) {

    #popup .view {
        bottom: 17vw;
    }

    #popup .box {
        height: 11vw;
    }

    #popup #close {
        font-size: 14px;
    }

    #popup {
        width: 77vw;
    }

    #popup .chkday {
        padding-left: 4.6vw;
        font-size: 2.5vw;
    }

    #popup .chkday::before {
        top: 0.4vw;
        width: 3vw;
        height: 3vw;
    }

    #popup #chkday:checked+.chkday::before {
        line-height: 3.3vw;
    }
}

@media (max-width: 480px) {
    #popup .view {
        width: 28vw;
        height: 7.5vw;
        bottom: 18vw;
    }

    #popup .box {
        height: 13vw;
    }

    #popup {
        width: 85vw;
    }

    #popup .chkday {
        padding-left: 5vw;
        font-size: 3vw;
    }

    #popup .chkday::before {
        top: 0.5vw;
        width: 3.5vw;
        height: 3.5vw;
    }

    #popup #check {
        bottom: 3.9vw;
        left: 6vw;
    }

    #popup #close {
        bottom: 4vw;
        right: 3vw;
    }

}

@media (max-width: 414px) {
    #popup .view {
        width: 32vw;
        height: 8.5vw;
        bottom: 19.2vw;
    }

    #popup #chkday:checked+.chkday::before {
        line-height: 3.8vw;
    }

    #popup .chkday {
        padding-left: 5.5vw;
        font-size: 3.3vw;
    }

    #popup .chkday::before {
        top: 0.6vw;
        width: 3.7vw;
        height: 3.7vw;
    }

    #popup {
        width: 92vw;
    }

    #popup #check {
        left: 6vw;
    }

    #popup #close {
        right: 3vw;
    }

}