body {
    font-family: 'Nanum Gothic', serif;
}

/* ===
    :::::::: Common :::::::
=== */
.height_full {height:100%;}

.font_EB {
    font-family:"EB Garamond";
}
.color_white {
    color:white;
}

/* ===
    :::::::: Display None :::::::
=== */


#full_main_mb {
    margin-top:60px;
    display:none;
}


/* ===
    :::::::: Loading :::::::
=== */

.loading_pg {
    position:fixed; z-index:300;
    top:0; left:0;
    width:100vw; height:100vh;
    background-image: linear-gradient(-90deg, #ffecd2 , #fcb69f);
    transition: opacity 1000ms, visibility 500ms linear 1500ms;
    opacity:1;
}
.loading_pg.off {
    opacity:0; visibility:hidden;
}
.load_txt {
    display:flex; flex-direction:column;
    justify-content:center; align-items:center;
    width:500px; height:100%;
    margin:-100px auto; text-align:center;
    color:white;
    transition: transform 1000ms
}
    .loding_tit {
        position:relative;
        font-size:45px;
        font-family:"Acme";
        text-transform:uppercase;
    }
    .loding_tit::before {
        content:'';
        position:absolute;
        top:-10px; left:-20px;
        width:120%;
        height:2px;
        background:white;
    }
    .loding_tit::after {
        content:'';
        position:absolute;
        bottom:-5px; left:-20px;
        width:120%;
        height:2px;
        background:white;
    }

    .loading_pg.off .load_txt {
        transform:scale(0.7);
    }

    .load_txt h3 {
        margin:50px 0;
    }
.wrap_scroll.loading {
    position:relative;
}

.wrap_loader {
    height:10px;
}

.loader,
.loader:before,
.loader:after {
    background: #ffffff;
    -webkit-animation: load1 1.1s infinite ease-in-out;
    animation: load1 1.1s infinite ease-in-out;
    width: 0.8em;
    height: 3em;
}
.loader {
    color: #ffffff;
    text-indent: -9999em;
    margin: 10px auto;
    position: relative;
    font-size: 11px;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}
.loader:before,
.loader:after {
    position: absolute;
    top: 0;
    content: '';
}
.loader:before {
    left: -1.5em;
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}
.loader:after {
    left: 1.5em;
}
@-webkit-keyframes load1 {
    0%,
    80%,
    100% {
        box-shadow: 0 0;
        height: 3.5em;
    }
    40% {
        box-shadow: 0 -2em;
        height: 4em;
    }
}
@keyframes load1 {
    0%,
    80%,
    100% {
        box-shadow: 0 0;
        height: 3.5em;
    }
    40% {
        box-shadow: 0 -2em;
        height: 4em;
    }
}



.load_txt span {
    font-size:25px;
    animation-name: blink;
    animation-duration: 1.4s;
    animation-iteration-count: infinite;
    animation-fill-mode: both;
}

.load_txt span:nth-child(2) {
    animation-delay: .2s;
}

.load_txt span:nth-child(3) {
    animation-delay: .4s;
}


@keyframes blink {
    0% {
    opacity: .2;
    }
    20% {
    opacity: 1;
    }
    100% {
    opacity: .2;
    }
}


@media only screen and (max-width:450px){
    .load_txt {
       width:100%;
    }
}

/* ===
    :::::::: popup pc :::::::
=== */
body{
	position:relative;
}
.popup{
	width: 400px;
    max-width: 50%;
    height: auto;
    position: absolute;
    top: 150px;
    left: 5%;
    z-index: 99;
    /*transform: translateX(-50%);*/
}
.popup2{
	width: 400px;
    max-width: 50%;
    height: auto;
    position: absolute;
    top: 150px;
    left: 28%;
    z-index: 99;
    /*transform: translateX(-50%);*/
}
.popup .img img,.popup2 .img img{
	width:100%;
	height:100%;
}
.popup .img .pClose,.popup2 .img .pClose2{
    width: 90px;
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 100;
	cursor:pointer;
}
.popup .img .pClose img,.popup2 .img .pClose2 img{
   width: 100%;
   height: auto;
}
.off{display: none;}
.popup .img a,.popup2 .img a{
	width:100%;
	height:30%;
	position:absolute;
	bottom:35px;
	left:0;
}



@media only screen and (max-width: 950px){
	.popup{
		top: 80px;
	}

}

@media only screen and (max-width: 450px){
	.popup{
		top: 20px;
	}
  .popup2{ top: 330px; left: 5%;}
}






/* ===
    :::::::: 1st Mobile :::::::
=== */

    .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 2.4s linear infinite;
    }
    @keyframes scroll_img {
        0% {transform:rotate(0);}
        100%{transform:rotate(180deg);}
    }
    .scroll_txt {
        margin-top:5px;
        font-size:14px; line-height:17px;
        color:white;
    }

    /* Iframe */
        .wrap_iframe {
            position:relative;
            width:100%; height:100%;
            overflow:hidden;
        }
            .wrap_iframe.mb {
                width:100%;
                height:300px;
            }

        .wrap_iframe iframe {
            width:100%;
            height:100%;
            transform:scale(1.4);
        }

            .wrap_iframe.mb iframe {
                transform:scale(1);
            }

        .if_bg {
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0);
            position: absolute;
            top: 0;
            left: 0;
            z-index: 100;
        }

     /* Watch full Video Arrow. */
        .img_view {
            position:absolute;
            right:50px; top:40%;
            z-index:100;
        }
        .wrap_m_arrow {
            position:absolute;
            height:100px;
            right:10px;
            top:40%;
            z-index:100;
        }
        .wrap_m_arrow img {width:100%;}
        a.button {
            position: relative;
            display: inline-block;
            width: 25.6em;
            height: 6.3em;
            overflow: hidden;
            vertical-align: middle;
            text-align: left;
            text-decoration: none;
            line-height: 3em;
            font-size: 12px;
            color: #fff;
            cursor: pointer;
            transform: translateZ(0);
            transition: transform 0.5s;
        }

        a.button svg {
            z-index: 1;
            position: absolute;
            top: 0;
            left: 0;
        }

        a.button svg g line,
        a.button svg g polyline,
        a.button svg g circle {
            fill: none;
            stroke: #fff;
        }

        a.button svg g line,
        a.button svg g polyline {
            stroke-miterlimit: 10;
        }

        a.button svg g circle {
            display: block;
            stroke-linecap: round;
            stroke-linejoin: round;
            stroke-width: 0.096em;
            stroke-dasharray: 200;
            stroke-dashoffset: 0;
            transition: stroke-dashoffset ease-out 0.5s;
        }

        a.button span {
            z-index: 2;
            position: relative;
            display: inline-block;
            text-transform: uppercase;
            font-family: 'Acme', serif;
            font-size: 1.5em;
        }

        a.button:hover {
            transform: translateZ(0) translateX(0.5em);
        }

        a.button:hover svg g circle {
            stroke-dashoffset: 200;
        }


/* ===
    :::::::: 1st Section Responsive :::::::
=== */
        @media only screen and (max-width:450px){
            #main_player {
                transform:scale(1);
            }
        }

        @media only screen and (max-width:750px){
            #main_player {
                transform:scale(1);
            }
        }

        @media only screen and (max-width:950px){
            .wrap_m_arrow {display:none;}
        }

        .pweb_logo {
            position: absolute;
            bottom:50px;
            left: 50%;
            transform: translateX(-50%);
        }

        .pweb_logo img {
            width:50%;
        }

/* ===
    :::::::: 2nd Section :::::::
=== */

    /* 2nd Section 이미지 세팅 */
    .slide_main {
        width:100%;
        height:100%;
    }
    .slide_m {
        width:100%;
        height:100%;
        background-size:cover;
    }
    .slide_m1 {
        background:url('/img/slide_m1.jpg')no-repeat 50% 50%;
        background-size:cover;
    }
    .slide_m2 {
        background:url('/img/slide_m2.jpg')no-repeat 50% 50%;
        background-size:cover;
    }
    .slide_m3 {
        background:url('/img/slide_m3.jpg')no-repeat 50% 50%;
        background-size:cover;
    }
    .slide_m4 {
        background:url('/img/slide_m4.jpg')no-repeat 50% 50%;
        background-size:cover;
    }

    .slide_m5 {
        background:url('/img/slide_m5.jpg')no-repeat 50% 50%;
        background-size:cover;
    }
    .slide_m6 {
        background:url('/img/slide_m6.jpg')no-repeat 50% 50%;
        background-size:cover;
    }
    .slide_m7 {
        background:url('/img/slide_m7.jpg')no-repeat 50% 50%;
        background-size:cover;
    }
    .slide_m8 {
        background:url('/img/slide_m8.jpg')no-repeat 50% 50%;
        background-size:cover;
    }
    .slide_m9 {
        background:url('/img/slide_m9.jpg')no-repeat 50% 50%;
        background-size:cover;
    }



    /* === 2nd Section Slide === */
    .slide_main .slick-list {
        height:100% !important;
    }
    .slide_main .slick-track {
        width:100%;
        height:100%;
    }

    .slide_main .slick-dots {
        position:absolute;
        right:50px; bottom:50px;
        z-index:100;
    }

    .slide_main .slick-dots li {
        display:inline-block;
        margin-left:25px;
        color:white;
    }

    .slide_main .slick-dots button {
        position:absolute;
        display: block;
        width: 13px;
        height: 13px;
        padding: 0;
        border: none;
        border-radius: 100%;
        background-color: white;
        text-indent: -9999px;
        z-index:999;
        transition:width 200ms, height 200ms;
        cursor:pointer;
    }

    .slide_main .slick-dots li.slick-active button {
        background-color:#fcb69f ;
    }


/* ===
    :::::::: 2nd Mobile :::::::
=== */

        .mb_wrap_intro {display:none;}


/* ===
    :::::::: 2nd Section Responsive :::::::
=== */

        @media only screen and (max-width:450px){
            .mb_wrap_intro {
                display:block;
                height:100%;
            }
                .mb_intro_head {
                    height:45%;
                    padding-top:30px 0 10px 0;
                    text-align:center; text-transform: uppercase;
                }
                    .mb_intro_txt1 {font-size:11px; line-height:15px;}
                    .mb_intro_txt2 {
                        padding:0;
                        letter-spacing:3px;
                        font-size:25px; font-family: 'Abril Fatface', cursive;
                    }
                    p.mb_intro_txt3 {
                        margin:5px 0 15px 0;
                        word-spacing:3px;
                        letter-spacing:6px;
                        font-size:11px; font-family: 'EB Garamond', cursive;
                    }
                    h4.mb_intro_txt4 {
                        font-size:10px;
                    }

            .wrap_mb_intro_img1 {
                width:100%; height:300px;
                margin-top:30px;
            }
            .wrap_mb_intro_img2 {
                width:100%; /*height:500px; */
                margin-top:10px;
            }
            .wrap_mb_intro_img3 {
                width:100%; height:500px;
                margin-top:10px;
            }


            .mb_intro {
                width:100%;
                height:100%;
            }
            .mb_intro.intro_img1 {
                background:url('/img/mb/mb_intro_img1.jpg')no-repeat 50% 50%;
                background-size:cover;
            }
            /*.mb_intro.intro_img2 {
                background:url('/img/mb/mb_intro_img2.jpg')no-repeat 50% 50%;
                background-size:cover;
            }
			.mb_intro.intro_img2-2 {
                background:url('/img/mb/mb_intro_img2-2.jpg')no-repeat 50% 50%;
                background-size:cover;
            }
			.mb_intro.intro_img2-3 {
                background:url('/img/mb/mb_intro_img2-3.jpg')no-repeat 50% 50%;
                background-size:cover;
            }
			.mb_intro.intro_img2-4 {
                background:url('/img/mb/mb_intro_img2-4.jpg')no-repeat 50% 50%;
                background-size:cover;
            }*/
            .mb_intro.intro_img3 {
                background:url('/img/mb/mb_intro_img3.jpg')no-repeat 58% 50%;
                background-size:cover;
            }

			.wrap_mb_intro_img2 img {
				width: 100%;
			}

            .mb_wrap_bottom {
                position:relative;
                padding:30px 0 50px 0;
                font-weight:bold; text-align:center;
                background-color:white;
            }
            .mb_wrap_bottom::before {
                content:'';
                position:absolute;
                top:0; left:0;
                width:100%; height:100%;
                background:url('/img/mb/mb_intro_img3.jpg')no-repeat 50% 50%;
                background-size:cover;
                opacity:0.1;
            }

            .mb_wrap_bottom h2 {
                font-family: 'Great Vibes', cursive;
            }
            .mb_wrap_bottom p {
                font-size:11px;
                line-height:17px;
            }
            .mb_desc_en {
                font-size:12px;
                font-family: 'Great Vibes', cursive;
            }


        }


/* ===
    :::::::: 3rd Section :::::::
=== */

#section2 {background-color:black !important;}

.wrap_facil {
    position:relative;
    display:flex;
    width:100%; height:100%;
    color:white; font-size:20px;
}
    .wrap_facil .slick-dots {
        display:none !important;
    }
    .block_facil {
        display:flex; justify-content:center; align-items:center;
        position:relative; z-index:1;
        width:50%; height:100vh;
        transition:width 300ms, height 300ms;
    }
    .block_facil:before {
        content: "";
        position: absolute;
        z-index: -1;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        opacity: .7;
        transition:background 500ms, opacity 500ms;
    }
    .block_facil:hover {width:49%;}
    .block_facil:hover:before {opacity:1;}


    .bg_facil_1:before {
        background:url('/img/m_facility1.jpg')no-repeat 50% 50%;
        background-size:cover;
    }


    .bg_facil_2:before {
        background:url('/img/m_facility2.jpg')no-repeat 50% 50%;
        background-size:cover;
    }


    .bg_facil_3:before {
        background:url('/img/m_facility3.jpg')no-repeat 50% 50%;
        background-size:cover;
    }

    .block_facil.slick-slide {
        display:flex;
    }

    .facil_txt {
        text-transform:uppercase; text-align:center;
    }
        .v_bar {
            margin:0 auto;
            width:2px; height:40px;
            background:white;
        }
        .facil_intro {
            margin:15px 0;
            font-family:"Acme";
            color:white;
        }
            .facil_txt_hover {overflow:hidden; height:35px;}
                .facil_txt_hover h2 {
                    font-weight:normal;
                    letter-spacing:2px;
                    transition:transform 400ms;
                }
                h2.facil_txt_hid {transform: translate(0,30px); text-shadow: 1px 1px 2px #000000;}
                    span.pre_arrow {font-weight:bold; font-family:sans-serif;}
            .facil_intro p {font-size:15px; letter-spacing:2px;}
            .block_facil:hover h2 {transform: translate(0,-35px);}




/* ===
    :::::::: 3rd Section Responsive :::::::
=== */

        @media only screen and (max-width:450px){

            #full_main_mb {
                display:block;
            }

            #full_main{
                display:none;
            }

            .main_mb_hide {
                display:none;
            }

            .mb_facil {
                display:flex;
                position:relative;
                width:100%; height:200px;
            }
            .mb_facil::before {
                content:'';
                position:absolute; z-index:-1;
                top:0; left:0;
                width:100%; height:100%;
                background:url('/img/mb/mb_intro_img4.jpg')no-repeat 50% 50%;
                background-size:cover;
                opacity:0.1;

            }
                .mb_facil_img {
                    width:55%; height:100%;
                }
                    .mb_facil1 {
                        background:url('/img/mb/mb_facil_1.jpg')no-repeat 50% 50%;
                        background-size:cover;
                    }
                    .mb_facil2 {
                        background:url('/img/mb/mb_facil_2.jpg')no-repeat 50% 50%;
                        background-size:cover;
                    }

                .mb_facil.second {
                    margin-top:10px;
                }
                .mb_facil.second h5 {
                    text-align:right;
                }

                .mb_facil_txt {
                    width:45%; height:100%;
                    padding: 20px 0 20px 10px;
                }
                .mb_facil.second .mb_facil_txt {
                    padding: 20px 10px 20px 0px;
                    text-align:right;
                }

                .mb_facil_txt h5 {
                    font-size:10px;
                    line-height:15px;
                    font-family: 'Great Vibes', cursive;
                }
                .mb_facil_name {
                    margin:5px 0 15px 0;
                    padding:10px;
                    width:100%;
                    font-size:19px; color:white;
                    font-family: "EB Garamond";
                    text-transform:uppercase;
                    background: #6593C5;

                }
                .mb_facil_txt p {
                    padding: 0 10px;
                    font-size:7px;
                    font-weight:bold;
                    line-height:13px;
                }

            .mb_facil_2 {
                position:relative;
                width:100%; height:400px;
                background:url('/img/mb/mb_facil_2.jpg')no-repeat 50% 50%;
                background-size:cover;
            }
            .mb_facil_3 {
                position:relative;
                width:100%; height:300px;
                background:url('/img/mb/mb_facil_3.jpg')no-repeat 50% 50%;
                background-size:cover;
            }

            #full_main_mb {
                display:block !important; overflow:scroll !important;
            }


        }

        @media only screen and (max-width:750px){
            .tb_hide {display:none;}
            .wrap_facil {
                flex-direction:column;
            }
            .block_facil {
                width:100%;
                height:33.3%;
            }
            .block_facil:hover {width:100%; height:36%;}

        }



/* ===
    :::::::: Responsive Common :::::::
=== */


    @media only screen and (max-width:450px){
        .mb_hide {display:none;}
    }


    @media only screen and (max-width:750px){
        .tb_hide {display:none;}
    }



/* ======
    ::::::: Main Popup :::::::
======== */

.model_info {
    position:absolute;
    top:15px; right:20px;
    font-size:15px;
    font-weight:bold;
    color:white;
}

.bg_main {
    display:none;
    position:relative;
    width:100%;
    height:100vh;
    background:url('/img/main/bg_main.jpg')no-repeat 50% 50%;
    background-size:cover;
}


.wrap_m_name {
    position:absolute;
    bottom:250px; left:0;
    padding:0 5px;
    width:100%;
    color:white;
    letter-spacing:2px;
    font-size:55px; font-weight:bold;
    text-align:center;
    font-family: 'Righteous', serif;
}
    .wrap_m_name .m_sub_tit {
        padding-top:20px;
        font-size:0.4em;
    }


@media only screen and (max-width:500px){
    .bg_main {display:block;}
}
