@charset "utf-8";

@import url('base.css');

/* --------------------------------------------
 * layout
/* ------------------------------------------ */
.mbg{ display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,.7); z-index:10;}
body.ovf_hdn, .ovf_hdn{ overflow:hidden; height:100%; -ms-touch-action: none; touch-action: none; -webkit-overflow-scrolling: none; overflow: hidden; -ms-scroll-chaining: none; overscroll-behavior: none;}

body{ background-color: #f8f8f8;}
body.sub06,
body.sub07,
body.sub08{ background-color: #f8f8f8;}

#wrap{ position: relative; width:100%; margin:0;}

#header{ position: absolute; top: 0; left: 0; width: 100%; height: 0; z-index:3; transition:all 0.2s ease-in-out;}
#header .inner{ position: relative; height: 0; display: flex; justify-content: space-between; padding: 40px; transition:all 0.2s ease-in-out;}
#header h1.logo{ position: absolute; top: 40px; left: 50%; transform: translateX(-50%); width: 421px; display: none; transition:all 0.2s ease-in-out;}
#header h1.logo a{ display: block; height: 64px; width: 100%; background: url(../images/logo.png); background-repeat: no-repeat; background-size: 100% auto;}
#header .utill{ display: flex; flex-direction: column; margin-left: auto; font-size: 20px;}
#header .utill a{ color: #101110; line-height: 1.2; }
#header .utill a + a{ margin-top: 10px;}
#header .utill a:hover{ color: #02F200;}
#header .bt-mn{ display: none;}

.sub11 #header .utill a:nth-child(1),
.sub12 #header .utill a:nth-child(2),
.sub13 #header .utill a:nth-child(3){ color: #02F200;}

#siteFunctions{ width: 100%; position: fixed; left: -110%; height: 100vh; overflow: hidden; background-color: #fff; transition:all 0.2s ease-in-out; z-index: 3; display: none;}
#siteFunctions.open{ left: 0;}
#siteFunctions .hd{ position: relative; height: 6rem; display: flex; align-items: center; justify-content: center;}
#siteFunctions .hd .logo{ width: 15rem; top: 2rem;}
/* #siteFunctions .hd .logo a{ display: block; width: 100%; background: url(../images/logo_b.png); background-size: 100% auto; height: 2.3rem;} */
#siteFunctions .hd .logo a{ 
    display: block; width: 100%; background: url(../images/logo_b.png); background-size: 100% auto; height: 2.3rem;
    background-repeat: no-repeat;
}
#siteFunctions .bt-close{ position: absolute; top: 50%; right: 1rem; width: 4rem; height: 4rem; margin-top: -2rem; display: block;}
#siteFunctions .bt-close i{ width: 2rem; height: .2rem; background-color: #222; display: block; position: absolute; top: 50%; left: 50%; margin: -.1rem 0 0 -1rem; transform: rotate(45deg);}
#siteFunctions .bt-close i:nth-child(2){ transform: rotate(-45deg);}
#siteFunctions .utill{ display: flex; justify-content: center; height: 4rem; }
#siteFunctions .utill a{ color: #222;}
#siteFunctions .utill a + a{ margin-left: 2rem;}
#siteFunctions .inner{ height: calc(100vh - 10rem); overflow-y: auto;}
#siteFunctions .mobMenu li + li{ border-top:#f1f1f1 1px solid;}
#siteFunctions .mobMenu li a{ display: block; text-align: center; line-height: 4rem; font-size: 1.6rem; }

.main #siteFunctions .mobMenu li:nth-child(1) a,
.sub01 #siteFunctions .mobMenu li:nth-child(2) a,
.sub02 #siteFunctions .mobMenu li:nth-child(3) a,
.sub03 #siteFunctions .mobMenu li:nth-child(4) a,
.sub04 #siteFunctions .mobMenu li:nth-child(5) a,
.sub05 #siteFunctions .mobMenu li:nth-child(6) a{ background-color: #f8f8f8;}

#gnbwrap{ font-size: 20px;}
#gnb > li + li{ margin-top: 5px;}
#gnb > li > a{ color: #101110; line-height: 1.2;}
#gnb > li.active > a,
#gnb > li > a:hover{ color: #02F200;}

body.main{ background-color: #e5e9ef;}
.main #header{ position: sticky; z-index: 2;}
.main #header h1.logo{ display: block;}
.main #gnb > li > a{ color: #fff;}
.main #gnb > li > a:hover,
.main #gnb > li:nth-child(1) a{ color: #02F200;}

.sub01 #gnb > li:nth-child(2) a{ color: #02F200;}

.fixed #header{ position: fixed; top: -200px; background-color: rgba(255,255,255,.95); height: auto; border-bottom: #ddd 1px solid; z-index: 3;}
.fixed.nav-up #header{ top: 0; }
.fixed.nav-down #header{ top: 0; }
.fixed #header .inner{ padding: 50px 20px 20px 20px; height: auto; align-items: center;}
.fixed #header h1.logo{ display: block; width: 140px; top: 20px; }
.fixed.nav-up #header h1.logo{ top: -200px;}
.fixed.nav-up #header .inner{ padding: 20px;}
.fixed #header h1.logo a{ height: 21px; background-image: url(../images/logo_b.png);}
.fixed #gnbwrap{ font-size: 18px;}
.fixed #gnb{ display: flex; align-items: center;}
.fixed #gnb > li + li{ margin-top: 0; margin-left: 24px;}
.fixed #gnb > li > a{ color: #101110;}
.fixed #gnb > li.active > a,
.fixed #gnb > li > a:hover{ color:#02F200;}
.fixed #header .utill{ flex-direction: row; font-size: 18px;}
.fixed #header .utill a + a{ margin-top: 0; margin-left: 24px;}

#indexWrap{ background-color: #F7F8F7; position: relative; z-index: 2;}
#container{ position: relative; z-index: 1; width: 100%; margin:0 auto; padding:0 0 100px 0; z-index: 1;}

footer{ position: relative; z-index: 3; background-color: #111; padding: 40px 40px 40px 90px; color: #fff; display: flex; justify-content: space-between;}
footer .bt-top{ position: fixed; width: 36px; height: 35px; display: block; bottom: 45px; left: 40px; border: #C6C6C6 1px solid; border-radius: 50%; background: #111 url(../images/ic_arr.png) no-repeat 50% 50% / auto 17px; transition:all 0.2s ease-in-out;}
footer .addr{ flex: 1; display: flex; }
footer .addr li{ line-height: 1.5; font-size: 0.9rem;}
footer .addr li + li{ margin-left: 70px;}
footer .addr li a{ text-decoration: underline; color: #fff;}
footer .f-right{ text-align: right;}
footer .f-right .copy{ margin-top: 7px;font-size: 0.9rem;}
footer .bt-instargram{ width: 40px; height: 40px; display: inline-block; background: url(../images/Instagram.png) no-repeat 50% 50% / 40px; margin-bottom: 5px;}

.sub-tit{ font-size: 60px; display: flex; flex-direction: column; align-items: center; padding: 60px; line-height: 1.4; font-weight: 400;}
.sub-tit b{ font-size: 66px;}

.h3-tit{ font-size: 60px; display: flex; flex-direction: column; align-items: center; padding: 60px; line-height: 1.4; font-weight: 400; margin: 100px 0 20px;}
.h3-tit b{ font-size: 66px;}
.h3-tit.notice{ border-top: #101110 1px solid; max-width: 1360px; margin: 60px auto 20px;}

/* common */
.opacity{ opacity: 0;}

br.pc{ display: inline;}
br.mobi{ display: none;}
img.pc{ display: inline;}
img.mobi{ display: none;}

@media screen and (max-width:1200px){
    
    footer{ flex-direction: column;}
    footer .f-right{ text-align: left; margin-top: 20px;}
        
    @media screen and (max-width:1024px){  
            
        #header .inner{ padding: 2rem;}
        #header h1.logo{ width: 15rem; top: 2rem;}
        #header h1.logo a{ height: 2.3rem;}
        #header .utill{ display: none;}
        #header .bt-mn{ display: block; position: absolute; top: 1.5rem; left: 1.5rem; width: 3.2rem; height: 3.2rem; background-color: #fff; border-radius: 50%;}
        #header .bt-mn i{ position: absolute; top: 50%; left: 50%; margin: -.06rem 0 0 -1rem; display: block; background-color: #111; width: 2rem; height: .12rem;}
        #header .bt-mn i:nth-child(1){ margin-top: -.46rem; }
        #header .bt-mn i:nth-child(3){ margin-top: .4rem; }

        #gnbwrap{ display: none;}
        
        #siteFunctions{ display: block;}
        
        #container{ padding: 0 0 5rem 0;}
        
        .fixed #header .inner{ height: 6rem; padding: 0 2rem;}
        .fixed #header .bt-mn{ top: 50%; left: 2rem; margin-top: -1.6rem;}
        .fixed #header h1.logo,
        .fixed.nav-up #header h1.logo{ top: 50%; left: 50%; margin-top: -23px; width: 300px; margin-left: auto;}
        .fixed #header h1.logo a{ height: 46px;}
        
        @media screen and (max-width:768px){  
            
            footer{ padding: 7rem 2rem 4rem; font-size: 1.2rem; }
            footer .bt-top{ bottom: 2rem; left: 2rem;}
            footer .addr{ color: #929292; flex-direction: column;}
            footer .addr li a{ color: #929292;}
            footer .addr li + li{ margin: 1rem 0 0 0;}
            footer .f-right{ text-align: right; margin-right: 1.4rem;}
            footer .bt-instargram{ position: absolute; top: 5rem; right: 2rem;}
            footer .f-right .logo{ position: absolute; top: 9rem; right: 2rem;font-size: 0.9rem;}
            footer .f-right .copy{ position: absolute; top: 12rem; right: 2rem;font-size: 0.9rem;}
            
            .sub-tit{ font-size: 3rem; padding: 3rem;}
            .sub-tit b{ font-size: 4rem;}
            
            .h3-tit{ font-size: 2.6rem; padding: 0; margin: 6rem 0 3rem;}
            .h3-tit b{ font-size: 3.6rem;}
            
            .fixed #header h1.logo,
            .fixed.nav-up #header h1.logo{ top: 50%; left: 50%; margin-top: -1rem; width: 14rem; margin-left: auto;}
            .fixed #header h1.logo a{ height: 2.1rem;}
        
            @media screen and (max-width:640px){   

                br.pc{ display: none;}
                br.mobi{ display: inline;}   
                img.pc{ display: none;}
                img.mobi{ display: inline;}                
                
                .h3-tit.notice{ padding-top: 3rem; margin-top: 0;}
            }
            
        }
    }    
}


.main-vis{ position: sticky; top: 0; left: 0; width: 100%; height: 950px; overflow: hidden; background-color: #371309; z-index:1;}
.main-vis .bg{ position: absolute; top: 0; left: 0; width: 100%; height: 950px; background: url() no-repeat 50% 50% / cover; 
    opacity: 0;
	transform: scale(1.15, 1.15);
	-ms-transform: scale(1.15, 1.15);
	-webkit-transform: scale(1.15, 1.15);
	-moz-transform: scale(1.15, 1.15);
	-webkit-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	-ms-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	-moz-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
}
.main-vis.active .bg{    
	opacity: 1;
	transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
	-moz-transform: scale(1, 1);
}

.corp-time{ position: relative; width: 100%; z-index: 2; background-color: #fff; height: 60px; font-size: 18px; display: flex; align-items: center; justify-content: center;}
.corp-time p{ display: flex; align-items: center;}
.corp-time p::before{ content: ''; width: 22px; height: 22px; background-position: 50% 50%; background-repeat: no-repeat; margin-right: 10px;}
.corp-time p.time::before{ background-image: url(../images/ic_time.png);}
.corp-time p.addr::before{ background-image: url(../images/ic_loc.png);}
.corp-time p b{ margin-right: 10px;}
.corp-time p + p{ margin-left: 200px;}
.corp-time .bt-instargram{ position: absolute; top: 50%; right: 40px; width: 40px; height: 40px; margin-top: -20px; background: url(../images/btn_instar.png) no-repeat 50% 50% / 20px; }

.main-tit{ display: flex; flex-direction: column; align-items: center; font-size: 60px; font-weight: 400; line-height: 1.4; margin: 0 0 40px 0;}
.main-tit b{ font-size: 66px; font-weight: 600;}

.cVisual{ text-align: center;}

.img-tit{ height: 950px; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;}

.main-sct01{ position: relative; background-color: #F7F8F7; z-index: 2; padding: 100px 0 150px;}
.main-sct01.black{background-color: #111; color:white; padding: 20px 0 30px; transition:all 0.4s ease-in-out;}
.main-sct01.black.active{ margin-top:-450px; }
.main-sct01.black img{width : 2vw; margin:30px auto; }
.main-sct01.black .cVisual{ cursor: pointer;}
.main-sct01 .desc{ width: 890px; display: flex; justify-content: space-between; margin: 0 auto; }
.main-sct01 .desc div{ width: 46%; }
.main-sct01 .desc-bx{ display:none;}
.sct01-list{ max-width: 1200px; margin: 20px auto 0; display: flex; flex-wrap: wrap;}
.sct01-list .itm{ width: 370px; margin: 40px 0 0 40px; display: flex; flex-direction: column; align-items: center;}
.sct01-list:not(.notice) .itm:nth-child(3n+1){ margin-left:0;}
.sct01-list.notice .itm:nth-child(2n+1){ margin-left:0;}
.sct01-list .itm .txt{ display: flex; flex-direction: column; align-items: center; margin: 10px 0 0 0;}
.sct01-list .itm .txt b{ font-weight: 400; font-size: 18px;}
.sct01-list .itm .txt em{ font-size: 16px;}

.sct01-list .itm .thumb:not(.class){ position: relative; width:100%; height:250px;   overflow: hidden;}
.sct01-list .itm .thumb img:not(.class){ height:250px; width:100%; object-fit: cover; object-position: center; }
.sct01-list .itm .thumb.class{ position: relative; width:100%; height:250px;   overflow: hidden;}
.sct01-list .itm .thumb img.class{ height:250px; width:100%; object-fit: cover; object-position: center; }

.sct01-list .itm .thumb img:hover{ filter: contrast(200%); }
.sct01-list .itm .thumb em{ position: absolute; top:0; left:0; width:100%; bottom:0; display:flex; align-items: center; justify-content: center; color:#fff; opacity:0; background-color:rgba(0,0,0,.3); transition:all 0.2s ease-in-out;}
.sct01-list .itm .thumb em span{text-align:left; margin: 0px 9px 0px 9px; }
.sct01-list .itm:hover .thumb em{ opacity:1;}
.sct01-list .itm .blt{ position: absolute; top: -24px; left: 0; color: #006CCF; font-size: 13px;}

.sct01-list-class{ max-width: 1200px; margin: 20px auto 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
.sct01-list-class .itm{ width: 370px; margin: 60px 0 0 0; display: flex; flex-direction: column; align-items: center;}
.sct01-list-class .itm .txt{ display: flex; flex-direction: column; align-items: center; margin: 10px 0 0 0;}
.sct01-list-class .itm .txt b{ font-weight: 400; font-size: 18px;}
.sct01-list-class .itm .txt em{ font-size: 16px;}
.sct01-list-class .itm .thumb{ position: relative; width:100%; height:250px;   overflow: hidden;}
.sct01-list-class .itm .thumb img{ height:250px; width:100%; object-fit: cover; object-position: center; }
.sct01-list-class .itm .thumb img:hover{ filter: contrast(200%); }
.sct01-list-class .itm .thumb em{ position: absolute; top:0; left:0; width:100%; bottom:0; display:flex; align-items: center; justify-content: center; color:#fff; opacity:0; background-color:rgba(0,0,0,.3); transition:all 0.2s ease-in-out;}
.sct01-list-class .itm:hover .thumb em{ opacity:1;}
.sct01-list-class .itm .blt{ position: absolute; top: -24px; left: 0; color: #006CCF; font-size: 13px;}


.sub03 .sct01-list{ width: 920px;}
.sub03 .sct01-list .itm{ width: 280px;}
.sub03 .sct01-list .itm .thumb,
.sub03 .sct01-list .itm .thumb img{ height:180px;}
.sct01-list.report{ max-width: 1000px;}
.sct01-list.report .itm{ width: 480px;}

.main-sct03{ position: relative; display: flex; background-color: #f8f9fa; max-width:1920px; margin:0 auto;}
.main-sct03 .map{ width: 50%; bottom: 0; z-index:2;}
.main-sct03 .loc-bx{ position: relative; width: 60vw; left: 50%; transform: translateX(-50%);  z-index: 2; font-size: 18px; padding: 100px 0; padding-right: 30%; }
.main-sct03 .loc-bx dt{ font-weight: 600;}
.main-sct03 .loc-bx dd + dd{ margin-top: 10px;}
.main-sct03 .loc-bt{ margin-top: 40px; display: flex; justify-content: center;}
.main-sct03 .loc-bt a{ display: flex; align-items: center;}
.main-sct03 .loc-bt a + a{ margin-left: 40px;}
.main-sct03 .loc-bt a::before{ content: ''; margin-right: 5px; width: 30px; height: 30px; background-position: 50% 50%; background-repeat: no-repeat;}
.main-sct03 .loc-bt a.naver::before{ background-image: url(../images/ic_naver.png); }
.main-sct03 .loc-bt a.kakao::before{ background-image: url(../images/ic_kakao.png); }
.main-sct03 .btn-box .btn{ width: 300px;}

.main-sct04{ background-color: #fff;}
.main-sct04 .team-desc{ margin: 0 auto; max-width: 1200px; padding: 100px 0; display: flex;}
.main-sct04 .team-desc .tlogo{ width: 45%;}
.main-sct04 .team-desc .desc-tx{ flex: 1; }
.main-sct04 .team-desc .main-tit{ align-items: flex-start;}

.visit-space{ max-width:1000px; margin:0 auto 18px auto; position: relative; text-align: center;}
.visit-space a{ position: absolute; display:block; width:4%; height:6%; text-indent:-9999px;}
.visit-space a.bt01{ top:77.9%; left:67.1%;}
.visit-space a.bt02{ top:67.7%; left:73.9%;}
.visit-space a.bt03{ top:60.4%; left:61.8%;}
.visit-space a.bt04{ top:55.5%; left:41.6%;}
.visit-space a.bt05{ top:49.4%; left:50.1%;}
.visit-space a.bt06{ top:36.5%; left:26.7%;}

.visit-list{ max-width: 1420px; margin: 60px auto 0; }
.visit-list .itm{ display: flex; overflow: hidden;}
.visit-list .itm .desc{ flex: 1; width:calc(100% - 700px); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 80px; border-bottom: #101110 1px solid;}
.visit-list .itm .desc dt{ font-size: 50px; font-weight: 400; line-height: 1.2; display: flex; flex-direction: column; align-items: center; }
.visit-list .itm .desc dt b{ font-size: 52px;}
.visit-list .itm .desc dd{ margin: 70px 0 0 0;}
.visit-list .itm .desc dd .time{ margin: 0 0 30px 0; }
.visit-list .itm .desc dd ul{ margin: 0 0 20px 0;}
.visit-list .itm .desc dd ul li + li{ margin-top: 10px;}
.visit-list .itm .desc dd ul.sm li + li{ margin-top: 0;}
.visit-list .itm .thumb{ width: 700px;}
.visit-list .itm .tag{ margin-bottom: 10px;  display: flex; flex-wrap: wrap;}
.visit-list .itm .tag span{ font-size: 1.125em; margin-right: 10px; color: #006CCF; }
.visit-list.prog .itm{ flex-direction: row-reverse;}

.qa-bx{ max-width: 1360px; margin: 0 auto;}
.qa-bx + .qa-bx{ margin-top: 50px;}
.qa-bx .tit{ font-size: 16px; font-weight: 600; margin-bottom: 20px;}
.qa-bx .cls{ width: 90px; flex: none;}
.qa-bx .name{ min-width: 190px; flex: none;}
.qa-bx .date{ width: 100px; flex: none;}
.qa-bx .blt{ background-color: #fff; border: #101110 1px solid; display: inline-block; line-height: 40px; height: 40px; padding: 0 15px; border-radius: 20px;}
.faq-bx{ border-top: #101110 2px solid;}
.faq-bx dt{position: relative; border-bottom: #E5E5E5 1px solid;}
.faq-bx dt a{ display: flex; align-items: center; padding: 15px 20px; }
.faq-bx dt .arr{ position: absolute; top: 50%; right: 20px; width: 20px; height: 20px; display: block; margin-top: -10px;}
.faq-bx.rent dt a{ padding-left: 60px;}
.faq-bx.rent dt .arr{ right: auto; left: 20px; }
.faq-bx dt .arr::before{ content: ''; position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; background-color: #222; display: block; margin: -1px 0 0 -8px;}
.faq-bx dt .arr::after{ content: ''; position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; background-color: #222; display: block; margin: -1px 0 0 -8px; transform: rotate(90deg); transition:all 0.2s ease-in-out;}
.faq-bx dt.active .arr::after{ transform: rotate(0);}
.faq-bx dd{ background-color: #fff; padding: 20px; display: flex; border-bottom: #E5E5E5 1px solid;}
.faq-bx dt i,
.faq-bx dd i{ width: 20px;}
.faq-bx dt span,
.faq-bx dd div{ flex: 1;}
.faq-bx.class dd{ padding: 0;}
.faq-bx.notice dt a{ padding: 5px 20px; min-height: 50px;}
.faq-bx.notice dd{ padding-left: 120px; display: block; text-align: left; }
.faq-bx.rent dd{ padding-left: 60px;}
.faq-bx .cls-ct{ display: flex; align-items: baseline;}
.faq-bx .cls-ct .txt{ flex: 1; padding: 30px 20px; line-height:1.8;}
.faq-bx .cls-ct .thimb{ width:300px;}
.faq-bx .bt-dw{ display: inline-flex; align-items: center; background-color: #111; color: #fff; width: auto; padding: 0 15px; border-radius: 30px; line-height: 40px; height: 40px;}
.faq-bx .bt-dw::after{ content: ''; width: 22px; height: 22px; background: url(../images/ic_down.png) 50% 50% / 100%; margin-left: 10px;}
.faq-bx .bt-dw:hover{ background-color: #006CCF; }

.books-img{ width: 100%; height: 950px;}
.books-img img{ position: relative; width: 1920px; height: 950px; left: 50%; transform: translateX(-50%);}

.books-wr{ background-color: #f8f8f8; margin-bottom: -100px; padding-bottom: 100px;}
.sub-tit-tx{ max-width: 890px; margin: 0 auto; display: flex; }
.sub-tit-tx > li{ flex: 1;}
.sub-tit-tx > li + li{ margin-left: 50px;}
.sub-tit-tx .tag{ margin: 5px 0 0 0; display: flex; flex-wrap: wrap;}
.sub-tit-tx .tag span{ font-size: 1.125em; margin-right: 10px; color: #006CCF; }
.sub02 .sub-tit-tx{ height: 800px;}

.books-desc{ max-width: 890px; margin: 0 auto; display: flex;}
.books-desc > li{ flex: 1;}
.books-desc > li + li{ margin-left: 50px;}
.books-desc > li .books-lnk{ display: flex;}
.books-desc > li .books-lnk i{ margin-right: 5px; display: flex; align-items: center;}
.books-desc > li .books-lnk a{ display: flex; align-items: center;}
.books-desc > li .books-lnk a + a{ margin-left: 20px;}
.books-desc > li .books-lnk a:hover{ text-decoration: underline;}

.books-slide{ position: relative; margin: 120px 0 0 0; padding:0 0 100px 0; overflow: hidden;}
.books-slide .swiper-slide{ width: 300px;}
.books-slide .prev{ width: 50px; height: 50px; border-radius: 50%; display: block; left: 40px; top: 50%; margin-top: -25px; position: absolute; z-index: 2; background-color: rgba(16,17,16,.7);}
.books-slide .next{ width: 50px; height: 50px; border-radius: 50%; display: block; right: 40px; top: 50%; margin-top: -25px; position: absolute; z-index: 2; background-color: rgba(16,17,16,.7);}
.books-slide .prev::after,
.books-slide .next::after{ content: ''; position: absolute; width: 14px; height: 14px; top: 50%; left: 50%; display: block; border-top: #fff 2px solid; border-right: #fff 2px solid; margin: -7px 0 0 -4px; transform: rotate(-135deg);}
.books-slide .next::after{ margin: -7px 0 0 -9px; transform: rotate(45deg);}
.books-slide .swiper-button-disabled{ opacity: 0;}

div.paging{ padding:0; margin:20px 0 0 0; position:relative; clear:both;}
div.paging a,
div.paging strong{ display:inline-block; width:38px; height:38px; line-height:38px; color:#101110; text-align:center; margin:0; vertical-align:middle; overflow: hidden; margin-left: -5px; font-weight:600; border-radius: 50%; }
div.paging a:hover{ color: #05FF03;}
div.paging .on,
div.paging .on:hover{ color:#23439b; background-color: #05FF03; }
div.paging .direction{ position:relative; }
div.paging .direction > span{ position:absolute; top:-9999px; left:-9999px;}
div.paging .direction.first:before{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 0px; width:10px; height:10px; display:block;  border:2px solid #101110; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.first:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:10px; height:10px; display:block;  border:2px solid #101110; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.prev:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:10px; height:10px; display:block;  border:2px solid #101110; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.next:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:10px; height:10px; display:block;  border:2px solid #101110; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }
div.paging .direction.last:before{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -8px; width:10px; height:10px; display:block;  border:2px solid #101110; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }
div.paging .direction.last:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:10px; height:10px; display:block;  border:2px solid #101110; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }
div.paging .direction::before,
div.paging .direction::after{ transition:all 0.2s ease-in-out;}
div.paging .direction:hover::before,
div.paging .direction:hover::after{ border-color:#05FF03;}

.thumb-list{ max-width: 1360px; margin:  100px auto 0;}
.thumb-list .itm{ display: flex;}
.thumb-list .itm + .itm{ margin-top: 40px;}
.thumb-list .itm .thumb{ width: 400px; }
.thumb-list .itm .desc{ flex: 1; padding: 10px 25px; display: flex; flex-direction: column;}
.thumb-list .itm .desc .t-tx{ font-size: 1.125em; margin-bottom: 10px;}
.thumb-list .itm .desc .c-tx{ margin-bottom: 10px;}
.thumb-list .itm .desc .btn{ margin-top: auto; max-width: 300px;}

.div-tab{ margin: 170px auto 60px; display: flex; justify-content: center;}
.div-tab .itm{ height: 56px; width: 220px; display: flex; align-items: center; justify-content: center; font-size: 20px; background-color: #fff; border-radius: 30px; border: #111 1px solid;}
.div-tab .itm + .itm{ margin-left: 10px;}
.div-tab .itm.active,
.div-tab .itm:hover{ background-color: #02FE00;}

.local-list{ max-width: 1360px; margin: 0 auto; border-top: #101110 2px solid;}
.local-list .itm{ display: flex; border-bottom: #E5E5E5 1px solid;}
.local-list .itm .thumb{ width: 360px; display: flex; align-items: center;}
.local-list .itm .thumb a{ width:100%;}
.local-list .itm .thumb img{ height:270px; width:100%; object-fit: cover; object-position:center;}
.local-list .itm .desc{ flex: 1; display: flex; }
.local-list .itm .desc .desc-hd{ flex: 1; padding: 40px 0 40px 50px;}
.local-list .itm .desc .desc-bd{ flex: 1; padding: 40px 0 40px 50px; border-left: #E5E5E5 1px solid;}
.local-list .itm .desc .t-tx{ display: flex; align-items: center; font-size: 20px; font-weight: 600;}
.local-list .itm .desc .t-tx a{ width: 22px; height: 22px; margin-left: 10px;}
.local-list .itm .desc .t-tx img{ width: 22px;}
.local-list .itm .desc .addr{ margin-bottom: 25px;}

.booking-bx{ max-width: 1360px; margin: 80px auto 0;}
.booking-bx .booking-hd{ display: flex; justify-content: space-between; align-items: center; font-size: 36px;}
.booking-bx .booking-hd .prev,
.booking-bx .booking-hd .next{ width: 36px; height: 36px; border: #101110 1px solid; border-radius: 50%; background-image: url(../images/ic_aw.png); background-repeat: no-repeat; background-position: 50% 50%; background-size: 18px auto; overflow: hidden; transition:all 0.2s ease-in-out;}
.booking-bx .booking-hd .next{ transform: rotate(180deg);}
.booking-bx .booking-hd .prev.dis{ opacity: 0.1;}
.booking-bx .booking-hd .next.dis{ opacity: 0.1;}
.booking-bx .booking-hd .prev:hover,
.booking-bx .booking-hd .next:hover{ border-color:#05FF03; background-color: #05FF03;}
.booking-bx .booking-bd{ margin: 60px 0 0 0;}
.booking-bx .booking-bd table{ table-layout: fixed;}
.booking-bx .booking-bd table thead{  border-bottom: #101110 2px solid;}
.booking-bx .booking-bd table thead td{ font-size: 14px; padding: 15px; text-align: right;}
.booking-bx .booking-bd table tbody td{ border-bottom: #ECECEC 1px solid; border-left: #ECECEC 1px solid; padding: 15px 10px; height: 200px; vertical-align: top; }
.booking-bx .booking-bd table tbody td:nth-child(1){ border-left: none;}
.booking-bx .booking-bd table tbody td em{ display: block; text-align: right;}
.booking-bx .booking-bd table tbody td.dis em{ opacity: .5;}
.booking-bx .booking-bd table tbody td:nth-child(1) em,
.booking-bx .booking-bd table tbody td:nth-child(7) em{ color: #FF4D00;}
.booking-bx .booking-bd td.dis .reser-bx{ opacity: .5;}
.booking-bx .booking-bd .reser-bx{ display: flex; flex-direction: column;}
.booking-bx .booking-bd .reser-bx .itm{ display: block; overflow: hidden; font-size: 14px; padding: 0 10px; background-color: #05FF03; text-overflow: ellipsis; white-space: nowrap; }
.booking-bx .booking-bd .reser-bx .itm span{ font-size: 0.6rem; }
.booking-bx .booking-bd .reser-bx .itm + .itm{ margin-top: 3px;}
.booking-bx .btn-box{ width: 100%; max-width: 100%;}
/* .booking-bx .btn-box .btn{ flex: 1;} */

.sub-tit-tx2 .img{ display: flex; justify-content: center;}
.sub-tit-tx2 .img img + img{ margin-left: 50px;}
.sub-tit-tx2 .txt{ margin: 40px 0 0 0; text-align: center;}

.aplication-bx{ margin: 150px 0 0 0; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.aplication-bx .hd-tx{ font-size: 35px; text-align: center;}
.aplication-bx .date-tx{ margin: 60px 0 0 0;}
.aplication-bx .date-tx li + li{ margin-top: 20px;}
.aplication-bx .date-tx li{ display: flex; align-items: center; font-size: 20px;}
.aplication-bx .date-tx li b{ border: #101110 1px solid; border-radius: 30px; margin-right: 15px; height: 38px; width: 95px; font-size: 18px; display: flex; justify-content: center; align-items: center;}
.aplication-bx .date-tx li b::before{ content: ''; width: 5px; height: 5px; background-color: #101110; border-radius: 50%; margin-right: 8px;}
.aplication-bd-bx{ max-width: 812px; margin: 170px auto 0; display: flex; justify-content: space-between; flex-wrap: wrap;}
.aplication-bd-bx .itm{ margin-bottom: 80px; display: flex; align-items: center; flex-direction: column;}
.aplication-bd-bx .itm .thumb{ text-align: center;}
.aplication-bd-bx .itm .txt{ margin: 25px 0 0 0; font-size: 20px; display: flex; align-items: center;}
.aplication-bd-bx .itm .txt b{ color: #02FE00; font-weight: 400; margin-right: 10px;}

.anchor_map{ margin-top: -70px; padding-top: 70px;}

.withStay{ max-width: 1200px; margin: 20px auto 0; display: flex; flex-wrap: wrap;}
.withStay .itm{ width: 372px; margin: 60px 0 0 40px; display: flex; flex-direction: column; align-items: center;}
.withStay .itm:nth-child(3n+1){ margin-left:0;}
.withStay .itm .thumb{ width:100%;}
.withStay .itm .thumb img{ width:100%; height:230px; object-fit: cover; object-position: center;}
.withStay .itm .desc{ width:100%; margin:20px 0 0 0;}
.withStay .itm .desc .btn{ margin:10px 0 0 0;}

@media screen and (max-width:1200px){
    
    .main-sct01{ padding: 100px 20px 150px;}
    
    .sub03 .sct01-list,
    .sct01-list.report{ width: 100%; padding: 0 2rem;}
    .sct01-list .itm,
    .sub03 .sct01-list .itm{ width: 32%; margin-left: 2%;}
    .sct01-list .itm:nth-child(3n+1),
    .sub03 .sct01-list .itm:nth-child(3n+1){ margin-left: 0;}
    .sct01-list.report{ margin-top: 0;}
    .sct01-list.report .itm{ width: 48%; margin-left: 2%; margin-top: 2rem;}
    .sct01-list.report .itm:nth-child(2n+1){ margin-left: 0; }
    
    .main-sct03 .loc-bx{ width: 90vw; padding-right: 20%;}    
    
    .main-sct04 .team-desc{ padding: 100px 20px;}
    
    .thumb-list{ padding: 0 2rem;}
    
    .local-list .itm .desc .desc-bd{ padding-right: 20px;}

	.withStay .itm{ width:32%; margin-left:2%;}
        
    @media screen and (max-width:1024px){    
        
        .main-sct01 .desc{ width: 100%;}
        
        .visit-list .itm{ border-bottom: #101110 1px solid; padding-right: 2rem;}
        .visit-list .itm .desc{ padding: 2rem; border-bottom: none; width:54%;}
        .visit-list .itm .desc dt{ font-size: 2rem;}
        .visit-list .itm .desc dt b{ font-size: 2.6rem;}
        .visit-list .itm .desc dd{ margin: 2rem 0 0 0;}
        .visit-list .itm .thumb{ width: 46%; display: flex; align-items: center;}      
        
        .qa-bx .tit{ padding: 0 2rem; margin-bottom: 1rem;}
        .faq-bx dt a{ padding: 1.4rem 2rem;}
        .faq-bx dd{ padding: 2rem;}
            
        .sub-tit-tx{ padding: 0 2rem 4rem; height: auto;}
        
        .books-desc{ padding: 0 2rem 4rem; height: auto;}
            
        div.paging{ padding: 0 2rem;}
        
        .booking-hd{ padding: 0 2rem;}
        .booking-bx .btn-box{ padding: 0 2rem;}
        
        .aplication-bx{ padding: 0 2rem;}
        .aplication-bd-bx{ max-width: 90%;}
         
        @media screen and (max-width:820px){          
            .corp-time{ padding: 0 2rem; font-size: 1.3rem; height: 5.8rem; flex-direction: column; align-items: flex-start;}
            .corp-time p + p{ margin: .2rem 0 0 0;}
            .corp-time p::before{ width: 2rem; height: 2rem; background-size: 2rem; margin-right: .4rem;}
            .corp-time .bt-instargram{ display: none;}
        }        
        
        @media screen and (max-width:768px){ 
            
            .main-tit{ font-size: 3.8rem;}
            .main-tit b{ font-size: 4.4rem;}
            
            .main-sct01{ padding: 5rem 2rem;}
            .main-sct01.black{background-color: black; color:white; padding: 1rem 2rem;}
            .main-sct01.black img{width : 10vw; }
            .main-sct01 .desc{ width: 100%; flex-direction: column;}
            .main-sct01 .desc div{ width: 100%;}
            .main-sct01 .desc div + div{ margin-top: 2rem;}			
			
			.visit-space a.bt01{ top:74%; left:61%;}
			.visit-space a.bt02{ top:63.8%; left:69%;}
			.visit-space a.bt03{ top:63.8%; left:60%;}
			.visit-space a.bt04{ top:49%; left:36%;}
			.visit-space a.bt05{ top:39.8%; left:42.6%;}
			.visit-space a.bt06{ top:24.8%; left:22%;}

			.visit-list .itm .desc{ width:100%;}
            
            .visit-space{ padding: 0 0rem;}
            .visit-list{ margin: 3rem 0 0 0;}
            
            .thumb-list .itm .thumb{ width: 30%;}
            
            @media screen and (max-width:640px){ 
                
                .main-vis{ height: calc(100vh - 5.8rem);}
                .main-vis .bg{ background-image: url(../images/img_mobi.jpg); height: calc(100vh - 5.8rem);}
                
                .sct01-list,
                .sub03 .sct01-list{ position: relative; width: 100%; padding: 0 2rem;}
				.sct01-list{ margin:4rem 0 0 0;}
                .sct01-list .itm,
                .sub03 .sct01-list .itm{ width: 100%; margin: 0;}
                .sct01-list .itm + .itm,
                .sub03 .sct01-list .itm + .itm{ margin: 3rem 0 0 0;}
                .sub03 .sct01-list .itm .thumb,
                .sub03 .sct01-list .itm .thumb img{ width: 100%;}
                .sct01-list.report .itm{ width: 48%; margin-left: 2%; margin-top: 2rem;}
                .sct01-list.report .itm:nth-child(2n+1){ margin-left: 0; }
				
				.sct01-list .itm .thumb,
				.sct01-list .itm .thumb img,
				.sub03 .sct01-list .itm .thumb, 
				.sub03 .sct01-list .itm .thumb img{ height:60vw;}
				
                .main-sct02.cVisual img{ height: 46rem; object-fit: cover;}
                
                .main-sct03 .loc-bx{ width: 100vw; padding: 5rem 2rem; font-size: 1.3rem; left: 0; transform: translateX(0);}
                .main-sct03 .main-loc{ margin-top: 49rem;}
                .main-sct03 .map{ position: absolute !important; width: 100vw; height: 40rem; top: 21rem; left: 0;}
                .main-sct03 .loc-bt{ margin-top: 2rem;}
                
                .main-sct04 .cVisual img{ height: 46rem; object-fit: cover;}
                .main-sct04 .team-desc{ padding: 5rem 2rem 8rem; flex-direction: column;}
                .main-sct04 .team-desc .tlogo{ width: 11.6rem;}
                .main-sct04 .team-desc .desc-tx{ margin: 3rem 0 0 0;}
                .main-sct04 .team-desc .main-tit{ flex-direction: row; align-items: center; margin-bottom: 2rem;}
                .main-sct04 .team-desc .main-tit b{ margin-right: 1rem;}                
                
                .visit-list .itm,
                .visit-list.prog  .itm{ flex-direction: column; padding-right: 0;}
                .visit-list .itm + .itm{ margin-top: 3rem;}
                .visit-list .itm .thumb{ width: 100%;}
                
                .sub02 .img-tit,
                .sub02 .sub-tit-tx{ height: auto;}
                
                .sub-tit-tx{ flex-direction: column; }
                .sub-tit-tx > li + li{ margin: 2rem 0 0 0;}
                
                .books-desc{ flex-direction: column; }
                .books-desc > li + li{ margin: 2rem 0 0 0;}
                .books-desc > li .books-lnk i{ width: 1.4rem; height: 1.4rem; }
                
                .books-slide{ margin-top: 5rem;}
                .books-slide .swiper-slide{ width: 20rem;}
                .books-slide .prev{ left: 1rem; width: 3rem; height: 3rem; margin-top: -1.5rem;}
                .books-slide .next{ right: 1rem; width: 3rem; height: 3rem; margin-top: -1.5rem;}
                .books-slide .prev::after,
                .books-slide .next::after{ width: 1rem; height: 1rem; margin-top: -.5rem;}
				
				.booking-bx .booking-bd table tbody td{ padding:1rem .5rem;}
				.booking-bx .booking-bd .reser-bx .itm{ font-size:.85rem; padding:.4rem; white-space: normal; line-height:1.2;}
                 
                .faq-bx.class dt a,
                .faq-bx.notice dt a{ flex-direction: column; align-items: flex-start;}
                .faq-bx.notice dt a{ padding: 1.5rem 2rem; }
                .faq-bx .name{ width: 100%; margin-top:1rem;}
                .faq-bx .cls-ct{ flex-direction: column;}
                .qa-bx .blt{ height: 3rem; line-height: 3rem;}
                .faq-bx.notice dd{ padding: 2rem;}
				.faq-bx .cls-ct .thimb,
				.faq-bx .cls-ct .thimb img{ width:100%;}
                
                .thumb-list{ margin: 4rem 0 0 0; padding: 0 2rem;}
                .thumb-list .itm{ flex-direction: column;}
                .thumb-list .itm .thumb{ width: 100%;}
                .thumb-list .itm .desc{ padding: 2rem 0;}
                .thumb-list .itm .desc .btn{ width: 100%; max-width:100%;}
                .thumb-list .itm + .itm{ margin-top: 3rem;} 
                
                .div-tab{ margin: 3rem 2rem 2rem;}
                .div-tab .itm{ font-size: 1.4rem; padding: 0 1rem; height: 4rem;}
                
                .local-list .itm{ flex-direction: column;}
                .local-list .itm + .itm{ margin-top: 3rem;}
				.local-list .itm .thumb,
				.local-list .itm .thumb img{ width:100%;}
                .local-list .itm .desc{ flex-direction: column;}
                .local-list .itm .desc .desc-hd{ padding: 2rem;}
                .local-list .itm .desc .desc-bd{ padding: 2rem; border-top: #E5E5E5 1px solid; border-left: none; }
                
                .booking-bx{ margin: 4rem 0 0 0;}
                .booking-bx .booking-bd{ margin: 2rem 0 0 0;}
                .booking-bx .booking-hd{ font-size: 2rem;}
                .booking-bx .booking-bd table thead td{ font-size: 1.2rem; padding: .5rem;}
                .booking-bx .booking-bd table tbody td{ height: 10rem;}
                
                .sub-tit-tx2{ padding: 0 2rem;}
                .sub-tit-tx2 .img img{flex: 1; width: 50%;}
                .sub-tit-tx2 .img img + img{ margin-left: 1rem;}
                .sub-tit-tx2 .txt{ margin: 2rem 0 0 0;}
                .aplication-bx{ margin: 4rem 0 0 0;}
                .aplication-bx .hd-tx{ font-size: 1.8rem;}
                .aplication-bx .date-tx{ margin: 3rem 0 0 0;}
                .aplication-bx .date-tx li{ font-size: 1.3rem;}
                .aplication-bx .date-tx li b{ font-size: 1.2rem; height: 3rem; width: 8rem; padding: 0 .5rem;}
                .aplication-bx .date-tx li + li{ margin-top: .5rem;}
                .aplication-bx .date-tx li span{ flex: 1;}
                .aplication-bd-bx{ margin: 5rem auto 0;}
                .aplication-bd-bx .itm{ width: 100%; margin-bottom: 4rem; padding: 0 2rem;}
                .aplication-bd-bx .itm .txt{ margin: 1rem 0 0 0; font-size: 1.3rem;}
                .aplication-bd-bx .itm .thumb{ width: 20rem;}
				
				.withStay{ padding:0 2rem;}
				.withStay .itm{ width:100%; margin-left:0;}
				.withStay .itm + .itm{ margin-top:4rem;}
            }
        }
    }    
}

a.btn.rad{
    border-radius: 30px;
}
.hide{
    display:none;
}
.mb20{ margin-bottom:20px;}