@import url(../css/root.css);

/* stit */
@media (min-width:1200px){
    .stit .h1dft.huge {
        font-size: 100px;
    }
}
/* subPage */
#subPage .sec1 {
    background: url(../img/aboutUs_bg.jpg) center center no-repeat;
    background-size: cover;
    overflow: hidden;
}
/* aboutUs */
#subPage .topSec {
    position: relative;
    overflow: hidden;
}
#subPage .topSec .aboutLeaf_rt {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0;

    transform-origin: right top;
    animation: aboutLeaf_rt 7s cubic-bezier(.45,.05,.55,.95) infinite;
}

@keyframes aboutLeaf_rt {
    0% {
        transform: translate(50px, 0) rotate(0deg);
    }

    15% {
        transform: translate(54px, -6px) rotate(2deg);
    }

    30% {
        transform: translate(60px, -14px) rotate(5deg);
    }

    45% {
        transform: translate(65px, -20px) rotate(7deg);
    }

    60% {
        transform: translate(62px, -16px) rotate(4deg);
    }

    75% {
        transform: translate(58px, -10px) rotate(1deg);
    }

    88% {
        transform: translate(53px, -4px) rotate(-1deg);
    }

    100% {
        transform: translate(50px, 0) rotate(0deg);
    }
}
#subPage .topSec .aboutLeaf_lft {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 0;

    transform-origin: left bottom;
    animation: aboutLeaf_lft 6.5s ease-in-out infinite;
}

@keyframes aboutLeaf_lft {
    0% {
        transform: translate(0, 15px) rotate(0deg);
    }

    20% {
        transform: translate(-2px, 17px) rotate(0.8deg);
    }

    40% {
        transform: translate(-5px, 19px) rotate(2deg);
    }

    60% {
        transform: translate(-3px, 18px) rotate(1.2deg);
    }

    80% {
        transform: translate(-1px, 16px) rotate(0.4deg);
    }

    100% {
        transform: translate(0, 15px) rotate(0deg);
    }
}
#subPage .topSec .aboutLeaf_lft img {
    opacity: .6;
}
/* subPage */
#subPage {
    position: relative;
    overflow: hidden;
}
#subPage .sec1 {
    position: relative;
    z-index: 5;
}
#subPage .sec1 .bt {
    background-color: #efece4;
}
#subPage .sec1 .bt .doctorBoxWrp {
    background-color: #efece4;
}
#subPage .sec1 .bt .doctorBoxWrp:after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 50px;
    background: linear-gradient(to right, transparent, #efece4);
}

/* subPage */
#subPage {
    background-color: rgba(233, 229, 218, 0.5);
}
/* sec2 */
#aboutUs .sec2 {
    background-color: rgba(255, 255, 255, 0.3);
}

/* sec3 */
#aboutUs .sec3 .mapboxWrp {
    position: relative;
}
#aboutUs .sec3 .mapboxWrp .clInfo {
    position: absolute;
    left: 20px;
    top: 20px;
    height: calc(100% - 40px);
    display: flex;
    align-items: center;
    z-index: 5;
    background-color: rgba(220, 90, 42, 0.8);
    background-color: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    padding: 20px 40px;
}
#aboutUs .sec3 .mapboxWrp .clInfo .timeTable .timeCon .dd .word {
    width: 115px;
}
#aboutUs .sec3 .mapboxWrp .clInfo .timeTable .timeCon .tt .word {
    width: 135px;
}
#aboutUs .sec3 .mapboxWrp .clInfo .infoCon .hd {
    width: 90px;
}
#aboutUs .sec3 .mapboxWrp .clInfo .infoCon .cc {
    width: calc(100% - 90px);
}
#aboutUs .sec3 .mapbox .root_daum_roughmap .wrap_map,
#aboutUs .sec3 .mapbox iframe {
    height: 600px !important;
}
@media (max-width:768px) {
    #aboutUs .sec3 .mapboxWrp .clInfo {
        position: relative;
        top: 0;
        left: 0;
        background-color: transparent;
        padding: 30px 0;;
    }
    #aboutUs .sec3 .mapboxWrp .clInfo .timeTable .timeCon .dd .word {
        width: 95px;
    }
    #aboutUs .sec3 .mapboxWrp .clInfo .timeTable .timeCon .tt .word {
        width: 115px;
    }
    #aboutUs .sec3 .mapbox .root_daum_roughmap .wrap_map,
    #aboutUs .sec3 .mapbox iframe {
        height: 300px !important;
    }
}
@media (max-width:500px) {
    #aboutUs .sec3 .mapboxWrp .clInfo .infoCon .hd {
        width: 70px;
    }
    #aboutUs .sec3 .mapboxWrp .clInfo .infoCon .cc {
        width: calc(100% - 70px);
    }
}
/* sbEn */
.sbEn .word {
    display: flex;
    gap: 10px;
    justify-content: center;
}

/* interiorSlick */
.interiorSlick {
    margin: 0 -10px;
}
.interiorSlick .slick-slide {
    padding: 0 10px;
}

/* costItem */
.costItem {
    padding: 20px 35px;
    background-color: rgba(255, 255, 255, 0.5);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.costItem.costBorder {
    border-top: 1px dashed rgba(48, 48, 48, 0.2);
}
.costItem .cost {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
}
.costItem .cost .per {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 40px;
    background-color: rgba(220, 90, 42, 0.1);
    border-radius: 3px;
}
.costItem .cost .won {
    display: inline-flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 4px;
    width: 90px;
}
.costItem .cost .won .tx {
    font-size: .6em;
    color: #333;
}

/* cost */
#cost .row {
    margin: 0 -40px;
}
#cost .row > div {
    padding: 0 40px;
}