@import url('https://fonts.googleapis.com/css?family=Anton|Acme|Lato|Nanum+Gothic|Abril+Fatface|EB+Garamond|Great+Vibes|Lobster|Kaushan+Script|Lora|Righteous');
ul {margin:0; padding:0; list-style:none;}

/* ===
    ::::::::: Default :::::::::
=== */

    
/* Text Selection Color */

    ::-moz-selection {
        background-color: #232476;
        color: #fff;
    }
    ::selection {
        background-color: #232476;
        color: #fff;
    }



/* Slick List 부모 Element Height 100% Setting */
    .slick-list {
        height:100% !important;
    }
    .slick-track {
        width:100%;
        height:100%;
    }


.room_kr_f a {
    font-family: 'Nanum Gothic', sans-serif;
}



    
/* ===
    :::::::: Scroll Image animation :::::::::
=== */

.wrap_scroll {
    position:absolute;
    bottom:20px;
    width:100%;
    margin:0 auto;
    text-align:center;
    z-index:10;
}
img.scroll_img {
    width:50px;
    animation: scroll_img 4s linear infinite;
    transform:rotate(-60deg);
}
@keyframes scroll_img {
    0% {transform:rotate(-60deg);}
    50%{transform:rotate(60deg);}
    100%{transform:rotate(-60deg);}
}
.scroll_txt {
    margin-top:5px;
    font-size:14px; line-height:17px;
    color:white;
}



/* === 
   ::::::::::: Slide Arrows :::::::::::
=== */

.wrap_arrow {
    position:absolute;
    top:40%; transform:translate(0,-50%);
    width:100%;
    z-index:100;
}

    .arrow {
        position:absolute;
        cursor: pointer;
        width: 75px; height: 120px;
        transition: transform .1s;
        cursor:pointer;
    }

    .arrow.m_next {
        top:0; right:30px;
    }

    .arrow.m_prev {
        top:0px; left:30px;
        -moz-transform: scaleX(-1);
        -o-transform: scaleX(-1);
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
        filter: FlipH;
        -ms-filter: "FlipH";
    }


.arrow-top, .arrow-bottom {
    background-color: #666;
    height: 4px;
    left: -5px;
    position: absolute;
    top: 50%;
    width: 100%;
}

    .arrow-top:after, .arrow-bottom:after {
        background-color: #fff;
        content: '';
        height: 100%;
        position: absolute;
        top: 0;
        transition: all 0.15s;
    }

.arrow-top {
    transform: rotate(45deg);
    transform-origin: bottom right;
}

    .arrow-top:after {
        left: 0%; /* 100% for Efect */
        right: 0;
        transition-delay: 0s;
    }

.arrow-bottom {
    transform: rotate(-45deg);
    transform-origin: top right;
}

    .arrow-bottom:after {
        left: 0;
        right: 0%; /* 100% for Efect */
        transition-delay: 0.15s;
    }

/* .arrow:hover .arrow-top:after {
    left: 0;
    transition-delay: 0.15s;
}

.arrow:hover .arrow-bottom:after {
    right: 0;
    transition-delay: 0s;
} */


/* === 
   ::::::::::: Menu Start :::::::::::
=== */

#header {position:fixed; top:0; left:0; width:100%; z-index:200; }

    .m_li_out .fa-instagram {font-size:25px; transition:color 300ms;}
    .m_li_out .fa-instagram:hover {color:black;}
    
    nav.nav1 {
        margin-top:80px;
        transition:all 500ms;
    }

    .nav ul.m_ul_out {
        display:flex; justify-content:center;
        width:1200px;
        margin:0 auto;
        padding:0;
        zoom: 1;
        list-style: none;
        height:50px;    
    }
        .nav ul.m_ul_out:before,
        .nav ul.m_ul_out:after {
        content: "";
        display: table;
        }
        .nav ul.m_ul_out:after {
        clear: both;
        }
        .nav ul.m_ul_out > li.m_li_out {
        float: left;
        position:relative; 
        height:100%;
        border-top:1px solid white;
        border-bottom:1px solid white;
        }

        .nav ul.m_ul_out > li.m_li_out.m_li_logo {
          border:none;
        }
            li.m_li_out a {color:white;}

           


            li.m_li_out > a.a_title {
                position:relative;
                display:inline-block; 
                height:100%; padding:15px 25px;
                font-size:20px; font-family: 'Acme', serif;
                letter-spacing:1px;
            }
            li.m_li_out > a.a_title.a_social {
                padding:12px 25px;
            }

            a.a_title.mb_icon i.fab {
                display:block;
                font-size:25px; 
                line-height:40px;
            }

 
            li.m_li_logo {
                position:relative;
                width:200px; height:100%; 
                text-align:center;
            }


            .me_eng {
                transition:opacity 500ms;
            }

            .me_kor {
                position:absolute;
                top:17px;
                font-size:17px;
                font-weight:bold;
                font-family:"Nanum Gothic_800";
                display:none;
                opacity:0;
                transition:opacity 500ms;
            }
            .me_kor.kor_cen {
                left:50%;
                transform:translate(-50%,0);
            }

            .m_li_out.on .me_kor {
                display:block;
                animation: me_txt 1s ;
                animation-fill-mode: forwards;
            }

            .m_li_out.on .me_eng {
                opacity:0;
            }

            @-webkit-keyframes me_txt {
                from {opacity:0}
                to {opacity:1}
            }
            @keyframes me_txt {
                from {opacity:0}
                to {opacity:1}
            }




            a.a_logo img {position:absolute; top:50%; left:50%; transform:translate(-50%, -15%); }
            img.m_logo {width:90%; visibility:visible; }
            img.m_logo_change {width:90%; visibility:hidden;}

            li.m_li_out > a.a_logo {
                position:absolute; 
                top:-20px;
                left:0; 
                width:100%; padding:5px 10px 10px;
            }
                .logo_txt {
                    font-size:30px;
                }
                .logo_txt.main {
                    margin-top:-20px;
                }

                #header.onleave .logo_txt {
                    font-size:30px;
                    color:#232476;
                    font-family:"EB Garamond";
                }

                #header.onleave .logo_txt.main {
                    color:black;
                    font-family: 'Great Vibes', serif !important;
                    line-height:15px;
                }
                
                #header.onleave .logo_txt.main .txt_smaller {
                    font-size:0.8em;
                }

                #header.onleave .logo_txt.main::before {
                    content:'';
                    position:absolute;
                    top:-5px; left:45px;
                    width:40%;
                    height:1px;
                    background:black;
                }
                #header.onleave .logo_txt.main::after {
                    content:'';
                    position:absolute;
                    bottom:5px; left:45px;
                    width:40%;
                    height:1px;
                    background:black;
                }

               
    /* Inner Menu  */
        .nav li ul.m_ul_in {
            visibility:hidden;
            width:100%;
            min-width:160px;
            text-transform: uppercase;
            font-weight:bold;
        }
            .nav li ul.m_ul_in li {
                text-align:center;
                font-family: 'Acme', serif;
            }
            .nav li ul.m_ul_in.font_kr li {
                font-family: 'Nanum Gothic', sans-serif;
            }

            .nav li ul.m_ul_in a {
                display: block;
                padding:15px 20px;
                line-height: 1.2em;
                color:rgba(0, 0, 0, 0.8);
                transition:background 500ms, color 500ms;
                background: rgba(255, 255, 255, 0.5);
            }
        
    /* Inner Menu rooms */
        .nav li ul.m_ul_in.m_room {width:1200px; left:-115px;}
        .nav li ul.m_ul_in.m_room li {float:left; width:16.666%; padding-right:5px;}
        .nav li ul.m_ul_in.m_room li.last {padding-right:0px;}
        .nav li ul.m_ul_in.m_room a {padding:0px; width:100%; height:100%; overflow:hidden;}
        .nav li ul.m_ul_in.m_room a img {width:100%; max-height:130px;}
        .nav li ul.m_ul_in.m_room a span {display:block; margin-top:5px;}
        .room_mt {margin-top:5px;}

        .nav li ul.m_ul_in.m_room li a div {
            overflow:hidden;
        }
        .nav li ul.m_ul_in.m_room li a img {
            transition:transform 300ms;
        }
        .nav li ul.m_ul_in.m_room li:hover > a img {
            transform: scale(1.05);
        }

       
        .nav li ul.m_ul_in.m_left1 {left:-20px;}
        .nav li ul.m_ul_in.m_left2 {left:-10px;}

    /* ======= Menu Hover ======= */

        .nav1 ul > li:hover ul.m_ul_in {
            border-bottom:2px solid blue;
            visibility:visible;
            background: rgba(255, 255, 255, 0.5);
        }

        .nav1 ul > li:hover ul.m_ul_in li {
            opacity:1;
            height: 50px;
        }

        .nav1 ul > li:hover ul.m_ul_in.m_room li {
            opacity:1;
            height: 165px;
        }

        .nav li ul.m_ul_in li:hover > a {
            color:blue;
            background: white;
        }
        
        .nav1 li ul {
            position: absolute;
            left: 0;
            top: 100%;
            z-index: 1;
        }
        .nav1 li ul li {
            overflow: hidden;
            height: 0;
            -webkit-transition: height 200ms ease-in;
            -moz-transition: height 200ms ease-in;
            -o-transition: height 200ms ease-in;
            transition: height 400ms ease-in-out;
        }

/* === 
   ::::::::::: Menu End :::::::::::
=== */


/* === 
   ::::::::::: Menu OnLeave :::::::::::
=== */

    #header:before {
        position:absolute;
        content:'';
        top:0; left:0; right:0; bottom:0;
        background: rgba(255, 255, 255, 0.5);
        opacity:0;
        transition:opacity 1000ms;
    }

    #header.onleave:before {
        opacity:1;
    }


    #header.onleave nav.nav1 {
        margin-top:20px;
    }
    #header.onleave .nav ul.m_ul_out {
        height:70px;    
    }

    #header.onleave .nav ul.m_ul_out > li.m_li_out {
        float: left;
        position:relative; 
        height:100%;
        border-top:none;
        border-bottom:none;
        }

    .nav ul.m_ul_out.onleave > li.m_li_out a {
            color:black;
        }

    #header.onleave li.m_li_logo {
        position:relative;
        width:150px; height:100%; 
        text-align:center;
        }

    #header.onleave li.m_li_out > a.a_logo {
            position:absolute; 
            top:-5px;
            text-align:center;
            width:100%; padding:10px;
        }

  

    #header.onleave img.m_logo {visibility:hidden;}
    #header.onleave img.m_logo_change {
        top:0px; 
        visibility:visible;
        -webkit-animation: img_shrink 700ms;
        animation: img_shrink 700ms;
        animation-fill-mode: forwards;  
    }

    @-webkit-keyframes img_shrink {
        from {width:90%}
        to {width:60%}
    }
    
    @keyframes img_shrink {
        from {width:90%}
        to {width:60%}
    }

    #header.again img.m_logo {
        -webkit-animation: img_magnify 700ms;
        animation: img_magnify 700ms;
    }

    @-webkit-keyframes img_magnify {
        from {width:60%}
        to {width:90%}
    }

    @keyframes img_magnify {
        from {width:60%}
        to {width:90%}
    }


    
    @media only screen and (max-width: 1100px) {
        #header.again img.m_logo {
            -webkit-animation: none;
            animation: none;
        }

    }



/* ====== Mobile Menu ======= */

.wrap_mb {display:none;}

  @media only screen and (max-width:950px){
        .wrap_mb {display:block;}

        .mb_logo {
            display:flex; justify-content:center; align-items:center;
            position:fixed; top:0; left:0; z-index:99;
            width:100%; height:60px;
            background:#262626;
            padding:0;
        }
        .mb_logo a {
            text-align:center;
        }
        .mb_logo a img {
            width:70%;
        }
           

        .mb_body_fil {
            display:none;
            position:fixed; top:0; left:0; z-index:100;
            width:100%; height:100%;
            background:rgba(0, 0, 0, 0.5);
        }

            .mb_body_fil.on {
                display:block;
            }

        #menu_nav_wrap {
                position: fixed; z-index:100;
                font-family: "Acme", sans-serif;
                line-height: 1.6;
                width:250px; height: 100%;
                top: 0; left: 0;
                background: white; color: rgba(255, 255, 255, 0.25);
                visibility: hidden;
                overflow-y: auto;
                -webkit-transform: translateZ(0);
                -webkit-backface-visibility: hidden;
                -webkit-transform: translateX(-100%);
                -ms-transform: translateX(-100%);
                transform: translateX(-100%);
                -moz-transition: all 0.4s ease-in-out;
                -o-transition: all 0.4s ease-in-out;
                -webkit-transition: all 0.4s ease-in-out;
                -ms-transition: all 0.4s ease-in-out;
                transition: all 0.4s ease-in-out;
        }

        #menu_nav_wrap ul.nav-list {
            margin: 12px 0; padding:0 10px;
            line-height: 50px; list-style: none;
        }

        #menu_nav_wrap .nav-list li {
            text-align:center;
            text-transform:uppercase;
            cursor:pointer;
            border-bottom:1px solid #bebebe;
        }

        #menu_nav_wrap .nav-list li a {
            font-size:18px; font-weight:bold;
            text-align:center;
            color:#262626;
        }
        

    /* Optional */

        #menu_nav_wrap .nav-list li.onColor {
            background:white;
        }

        
    /* Funtional  */

        /* Open the menu */
        .menu-is-open #menu_nav_wrap {
            -webkit-transform: translateX(0);
            -ms-transform: translateX(0);
            transform: translateX(0);
            visibility: visible;
            -webkit-overflow-scrolling: touch;
            z-index:100;
        }


    /*  ========= Sub Menu Style ========= */
        .sub_menu_con {
            background:white;
            border-top:1px solid #bebebe;
        }
            #menu_nav_wrap .nav-list li .sub_menu_con a {
                display:block; 
                font-size:15px; font-weight:normal;
                line-height:40px;
            }
            #menu_nav_wrap .nav-list li .sub_menu_con.menu_kor a {
                font-family:"Nanum gothic"; font-weight:bold;}

                #menu_nav_wrap .nav-list li .sub_menu_con a:hover {
                    font-size:16px;
                }

        

    /* ========= Mobile Menu Btn Style ========= */
        .mb_calender {
            display:block;
            position:absolute; z-index:110;
            top:12px; right:25px;
            cursor:pointer;
        }
        .menu_toggle {
                display: block;
                position:absolute; z-index:110;
                top:30px; left:20px;
                width: 35px; height: 100%;
                outline: 0;
                -moz-transition: transform 0.4s ease-in-out;
                -o-transition: transform 0.4s ease-in-out;
                -webkit-transition: transform 0.4s ease-in-out;
                -ms-transition: transform 0.4s ease-in-out;
                transition: transform 0.4s ease-in-out;
                -webkit-transform: translateZ(0);
                -webkit-backface-visibility: hidden;
        }

        .menu_toggle span {
                display: block;
                position: absolute;
                width: 28px; height: 3px;
                background-color: white;
                margin-top: -1.5px;
                top: 50%; left: auto; bottom: auto; right: 9px;
                text-shadow: none;
                color: transparent;
                -moz-transition: background 0.2s ease-in-out;
                -o-transition: background 0.2s ease-in-out;
                -webkit-transition: background 0.2s ease-in-out;
                -ms-transition: background 0.2s ease-in-out;
                transition: background 0.2s ease-in-out;
        }

                .menu_toggle span::before,
                .menu_toggle span::after {
                        content: '';
                        width: 100%;
                        height: 100%;
                        background-color: inherit;
                        position: absolute; z-index:110;
                        left: 0;
                        -moz-transition: all 0.2s ease-in-out;
                        -o-transition: all 0.2s ease-in-out;
                        -webkit-transition: all 0.2s ease-in-out;
                        -ms-transition: all 0.2s ease-in-out;
                        transition: all 0.2s ease-in-out;
                }

                .menu_toggle span::before {
                        top: -8px;
                }

                .menu_toggle span::after {
                        bottom: -8px;
                }

            /* menu is open */
                .menu-is-open .menu_toggle {
                        -webkit-transform: translateX(190px);
                        -ms-transform: translateX(190px);
                        transform: translateX(190px);
                }

            /* is clicked */
                .menu_toggle.is-clicked span {
                        background-color: rgba(255, 255, 255, 0);
                        width:25px;
                }

                .menu_toggle.is-clicked span::before,
                .menu_toggle.is-clicked span::after {
                        background-color: white;
                }

                .menu_toggle.is-clicked span::before {
                        top: 0;
                        -webkit-transform: rotate(45deg);
                        -ms-transform: rotate(45deg);
                        transform: rotate(45deg);
                        background-color: black;
                }

                .menu_toggle.is-clicked span::after {
                        bottom: 0;
                        -webkit-transform: rotate(-45deg);
                        -ms-transform: rotate(-45deg);
                        transform: rotate(-45deg);
                        background-color: black;
                }
        }

        





/* === 
   ::::::::::: Menu Responsive :::::::::::
=== */


@media only screen and (max-width: 1100px) {
    .nav ul.m_ul_out {
        width:100%;
    }
        li.m_li_out > a.a_title {
            font-size:1.5vw;
        }

        #header.onleave .logo_txt {
            font-size:2vw;
        }

        a.a_logo img {transform:translate(-50%, 15%);}
            img.m_logo {width:90px;}

        #header.onleave img.m_logo {
            width:50px;
            -webkit-animation: none;
            animation: none;}
        #header.onleave img.m_logo_change {
            animation:none;
            width:90px;
            top:-25px;
        }
}

@media only screen and (max-width: 950px) {
    nav.nav1 {display:none}

    #header.onleave .logo_txt {
        font-size:30px;
        color:white;
    }

}


@media only screen and (max-width: 801px) {
    nav.nav1 {display:none}
    .arrow {width:50px;}

    .logo_h_menu {
        font-size:25px;
        color:black;
    }
}


@media only screen and (max-width: 450px) {
    nav.nav1 {display:none}
    .mb_logo img {width:50%;}
    .mb_calender img {width:6vw;}

    .arrow .arrow-top:after {
        left: 0;
        transition-delay: 0.15s;
    }
    
    .arrow .arrow-bottom:after {
        right: 0;
        transition-delay: 0s;
    }

}





/* === 
   ::::::::::: Menu Responsive End :::::::::::
=== */

.footer {
    width:100%;
    padding:30px 20px;
    text-align:right;
    font-size:13px; font-family:"Nanum gothic";
    line-height:20px;
    background:#212121; color:white;
}
    .footer span.madeby {color:#FFC809;}
    .footer a.a_login {color:rgb(141, 203, 228);}
    .footer a.a_login:hover {color:rgb(86, 187, 226);}
    img.img_f_logo {vertical-align:-5px;}

.footer.mb {
    display:none;
}

.display_none {display:none;}
.mt {margin-top:10px;}
#menu_nav_wrap .nav-list li.boder_none {border:none}


@media only screen and (max-width: 650px) {
    .footer {
        font-size:13px; text-align:center;
    }

    .footer.no_full {
        display:none;
    }

    .footer.mb {
        display:none;
    }
    .span_block {display:block;}
    .f_mb_none {display:none;}
    
}

@media only screen and (max-width: 750px) {
    .footer {
        font-size:11px;
    }

}


/* 













