@charset "UTF-8";

/* Base */
@import url('reset.css');

/* Fonts */
@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Noto+Sans+KR:wght@300;500;700&display=swap');

:root{
    
    /* color */
    --clr-b:#000;
}

/* common */
html, body {
    font-size: 62.5%;
    font-weight: 400;
    font-style: normal;

    -webkit-text-size-adjust: none;
    -ms-text-size-adjust : none;  
    -moz-text-size-adjust : none;  
    -o-text-size-adjust : none;  
    text-size-adjust: none
}

body {
    position:relative
}

body > * {
    font-family: 'nanumsquare','Noto Sans KR', sans-serif, serif;
    font-size:1.6rem
}

body.preload > * {
    transition:none!important;
}

@media screen and (max-width:768px) {
    html, body {
        font-size: 50%
    }
    body > * {
        font-size: 1.750rem
    }
}


/* video */
.sm-video {
    position:relative;
    overflow:hidden
}

.sm-video::before {
    position:absolute;
    width:100%;
    height:100%;
    content:"";
    display:block;
    z-index:1
}

.sm-video .iframe {
    width:calc(100vh * 16 / 9);
    height:calc(100vw * 16 / 9);
    min-width:100%;
    min-height:100%;
    display:block;
    overflow:hidden;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate3d(-50%, -50%, 0);
    object-fit:cover
}

.sm-video .video {
    width:100%;
    height:100%;
    display:block
}

.bg-cov {
    width:100%;
    height:100%;
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-size:cover
}

#container {
    width:100%;
    overflow:hidden;
}

/* hide */
.hide {
    display:none;
    opacity:0
}

/* popup */
.popup {
    position:absolute;
    min-width:300px;
    top:0;
    left:0;
    z-index:999
}
.popup .frame {
    position:relative
}
.popup .swiper-slide {
    flex-wrap:wrap
}
.popup .swiper-slide a {
    width:100%;
    height:100%;
    display:block
}
.popup .swiper-slide a img {
    display:block
}
.popup .swiper-pagination {
    bottom:5.4rem;
}
.popup .control {
    position:relative;
    display:flex;
    flex-wrap:wrap;
    margin-top:1px
} 
.popup .control > div {
    display:inline-block;
    padding:10px 0;
    background-color:#fff
}
.popup .control > div img {
    display:block;
    text-align:center;
    margin:0 auto;
    height:32px
}
.popup .control .swiperArrows {
    position:relative;
    top:0;
    transform:translate3d(0, 0, 0);
    text-align:center;
    margin:0;
    left:unset;
    right:unset;
    height:auto

}
.popup .control .swiperArrows {
    width:calc(50% - 56px)
}
.popup .control .swiperArrows:nth-of-type(1) {
    width:calc(50% - 57px);
    margin-right:1px
}
.popup .control .sideBtns {
    width:55px;
    margin-left:1px;
    cursor:pointer
}
.popup .onedays {
    width:100%;
    display:flex;
    flex-wrap:wrap;
    background-color:#302c2c;
    align-items:center
}
.popup .onedays span {
    display:inline-block;
    width:50%;
    margin:12.5px 0;
    text-align:center;
    color:#e9e9e9;
    font-size:11px;
    cursor:pointer
}
.popup .onedays span.close {
    width:calc(50% - 1px);
    border-left:1px solid #787878
}


/* Tablet or Mobile */
@media screen and (max-width:768px) {

    /* popup */
    .popup {
        position:absolute;
        width:350px;
        left:50%!important;
        transform:translateX(-50%)!important;
    }
}

/* popup-open */
.popup-open {
    position:absolute;
    min-width:300px;
    top:0;
    left:0;
    z-index:9999;
}
.popup-open a,.popup-open a img {
    display:block;
}
.popup-open .onedays {
    width:100%;
    display:flex;
    flex-wrap:wrap;
    background-color:#302c2c;
    align-items:center
}
.popup-open .onedays span {
    display:inline-block;
    width:50%;
    margin:12.5px 0;
    text-align:center;
    color:#e9e9e9;
    font-size:11px;
    cursor:pointer
}
.popup-open .onedays span.close {
    width:calc(50% - 1px);
    border-left:1px solid #787878
}


/* Tablet or Mobile */
@media screen and (max-width:768px) {

    /* popup */
    .popup-open {
        position:absolute;
        width:350px;
        left:50%!important;
        transform:translateX(-50%)!important;
    }
}