@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;700&family=Ubuntu:wght@400;700&display=swap');
/*
    font-family: 'Noto Sans KR', sans-serif;
    font-family: 'Ubuntu', sans-serif;
*/



/* font */
.enb{
    font-family: 'Ubuntu', sans-serif;
    font-weight: 700;
}

.enr{
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
}

.kob{
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 700;
}

.kor{ 
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 400;
}


.t-shadow{ text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);}

.upp{ text-transform: uppercase;}

/* color */
.color01{ color: #D17028;}
.color02{ color: #FFE8D9;}
.color03{ color: #FFF8F3;}
.color04{ color: #F4C540;}
.cb4{color: #B4B4B4}
.c2{color: #222}
.cf{ color: #fff;}


.fos100{ font-size: 100px;}
.fos40{ font-size: 40px;}
.fos24{ font-size: 24px;}
.fos16{ font-size: 16px;}
.fos14{ font-size: 14px;}
.fos12{ font-size: 12px;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    .m-fos50{ font-size: 50px;}
    .m-fos20{ font-size: 20px;}
    .m-fos16{ font-size: 16px;}
    .m-fos14{ font-size: 14px;}
    .m-fos12{ font-size: 12px;}
}






/* ========== reset ============== */

/* http://meyerweb.com/eric/tools/css/reset/ 
    v2.0 | 20110126
    License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
    text-decoration: none;
    box-sizing: border-box;
    font-family: 'Noto Sans KR', sans-serif;
    -webkit-text-size-adjust: none;
    
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

img{border: none;} 

address{font-style: normal;}
fieldset{border: none;} 
legend{position: absolute;left: -999em;} 
input[type=button],
input[type=submit],
input[type=reset],
input[type=image],
button, a, select{cursor: pointer; outline: none;} 
input{ outline: none;}

label.away{position: absolute;left: -999em;} 


/* 공통 */
body{ font-family: 'Noto Sans KR', sans-serif; font-weight: normal; font-size: 15px; color: #888; overflow-x: hidden; transition: .5s; background-color: #fff;}
body > section{ width: 100%; height: auto; position: relative; overflow: hidden; }
.wrap1600{ width: 1600px; position: relative; margin: 0 auto; box-sizing: border-box; }
.wrap1640{ width: 1640px; position: relative; margin: 0 auto; box-sizing: border-box; }



/* button */
.button01{display:inline-block; width: 180px; height: 40px; border-radius: 50px; font-size: 14px; margin-left: 10px; margin-bottom: 10px; color: #D17028; line-height: 38px; text-align: center; border: 1px solid #D17028; position: relative; transition: .3s;}
.button01:after{ content: ''; position: absolute; width: 100%; height: 100%; border-radius: 50px; border: 1px solid #F4C540; right: 10px; top: 10px; z-index: -1; transition: .3s;}
.button01:hover{ color: #fff; background-color: #D17028; transition: .3s;}
.button01:hover:after{  background-color: #F4C540;}

.button02{display:inline-block; width: 180px; height: 40px; border-radius: 50px; font-size: 14px; margin-left: 10px;  margin-bottom: 10px; color: #fff; line-height: 38px; text-align: center; border: 1px solid #fff; position: relative; transition: .3s;}
.button02:after{ content: ''; position: absolute; width: 100%; height: 100%; border-radius: 50px; border: 1px solid #fff; right: 10px; top: 10px; z-index: -1; transition: .3s;}
.button02:hover{ color: #D17028; background-color: #fff; transition: .3s;}


/* 스크롤바 */
body::-webkit-scrollbar { width: 10px; }
body::-webkit-scrollbar-thumb{ height: 17%; background-color: #6F6F6F; border-radius: 2px; }
body::-webkit-scrollbar-track{ background-color: #fff; }

.fl{ float: left;}
.fr{float: right;}
.clb{ clear: both;}

.col-2{ width: 50%;}
.col-3{ width: 33.33%;}
.col-4{ width: 25%;}
.col-5{ width: 20%;}

.pb10{padding-bottom: 10px;}
.pb20{padding-bottom: 20px;}
.pb30{padding-bottom: 30px;}
.pb40{padding-bottom: 40px;}
.pb60{padding-bottom: 60px;}

.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 20px;}
.mb40{margin-bottom: 40px;}

.img{ width: 100%; height: 100%; top: 0; left: 0; background-size: cover; background-position: center; background-repeat: no-repeat;  position: absolute;}

.none-mo{ display: block!important;}
.none-pc{ display: none!important;}


/* tab */
#tab{ display: flex; justify-content: center;}
#tab a{ display: block; padding: 0 40px; height: 40px; line-height: 38px; border-radius: 50px; border: 1px solid #D17028; margin: 0 10px; transition: .3s; }
#tab a.active{ background-color: #D17028; color: #fff; font-weight: 700; }
#tab a:hover{ background-color: #D17028; color: #fff; font-weight: 700; }

/* swiper */
.swiper-button-next i, .swiper-button-prev i{ transition: .3s;}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{ opacity: .7;}
.swiper-button-next:after, .swiper-button-prev:after{ position: absolute; top: -999em; }
.swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    top: unset;
    bottom: 0;
}
.swiper-pagination-progressbar{ background: #FFE8D9;}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background:#D17028;}


/* service-swiper */
.service-swiper .swiper-slide{ display: block; height: auto; }
.service-swiper .swiper-slide .img-wrap{ position: relative; width: 100%; height: 360px; border-radius: 10px; overflow: hidden; background-color: #222; }
.service-swiper .swiper-slide .img-wrap .img{ opacity: .3; transition: .3s;}
.service-swiper .swiper-slide .img-wrap i{ position: absolute; bottom: 63px; width: 50px; left: 0; right: 0; margin: 0 auto; text-align: center;  transition: .3s;}
.service-swiper .swiper-slide .text{ width: 250px; height: 78px; border-radius: 10px; display: table; position: relative; top: -39px; background-color: #fff; left: 0; right: 0; margin: 0 auto; text-align: center;}
.service-swiper .swiper-slide .text h3{ line-height: 18px;}
.service-swiper .swiper-slide .text p{ line-height: 26px;}
/* service-swiper hover */
.service-swiper .swiper-slide:hover .img-wrap .img{ opacity: 1;}
.service-swiper .swiper-slide:hover .img-wrap i{ opacity: 0; }



/* full-swiper */
.full-swiper{ height: 100vh; position: relative;}
.full-swiper .img-wrap{ width: 100%; height: 100%; position: relative; }
.full-swiper .swiper-button-next, .full-swiper .swiper-button-prev{ width: 80px; height: 80px; text-align: center; transition: .3s; border-radius: 50%; background-color: #fff;}
.full-swiper .swiper-button-next:hover, .full-swiper .swiper-button-prev:hover{ background-color: #D17028;}
.full-swiper .swiper-button-next:hover i, .full-swiper .swiper-button-prev:hover i{ color: #fff;}
.full-swiper .full-prev{ left: 160px;}
.full-swiper .full-next{ right: 160px;}
.full-swiper .pag-wrap{ width: 350px; height: 27px; font-size: 0; position: absolute; bottom: 100px; left: 0; right: 0; margin: 0 auto; z-index: 10; text-align: center;}
.full-swiper .pag-wrap > div{ display: inline-block; position: relative; }
.full-swiper .pag-wrap > div.enb{ width: 27px;}
.full-swiper .full-pag{ width: 250px; margin: 0 20px 5px;}
.full-swiper .swiper-pagination-progressbar{ background: #fff;}


/* room-tab */
#room-tab{ display: block; text-align: left; font-size: 0;}
#room-tab li{ display: inline-block;}
#room-tab li a{ display: block; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; border: 1px solid #D17028; color: #D17028; font-family: 'Ubuntu', sans-serif; font-weight: 400; transition: .3s; margin-right: 20px; text-align: center;}
#room-tab li a:hover{ border: 1px solid #D17028; background-color: #D17028; color: #fff; font-weight: 700; }
#room-tab li.active a{ border: 1px solid #D17028; background-color: #D17028; color: #fff; font-weight: 700; }
#dong-wrap > ul{ display: none;}
#dong-wrap > ul.active{ display: block;}
#dong-wrap a{ transition: .3s;}
#dong-wrap a:hover{ color: #D17028; font-weight: 700;}
#dong-wrap a.active{ color: #D17028; font-weight: 700;}
#dong-wrap a .pointer{ float: right;}
#dong-wrap a .pointer .circle{ display: inline-block; width: 20px; height: 20px; border-radius: 50%; background-color: #D17028; opacity: 0; transition: .3s;}
#dong-wrap a .pointer .line{ display: inline-block; width: 250px; height: 1px; background-color: #D17028; position: relative; top: -9px; transition: .3s; transform: scaleX(0); transform-origin: left;}
#dong-wrap a.active .pointer .circle{ opacity: 1; }
#dong-wrap a.active .pointer .line{ transform: scaleX(1);}

/* room-swiper */
.room-swiper{ width: 1179px; height: auto; overflow: hidden; padding-right: 20px; padding-bottom: 20px;}
.room-swiper .swiper-slide{ position: relative;}
.room-swiper .swiper-slide .img-wrap{ width: 1060px; height: 560px; border-radius: 10px; position: relative; overflow: hidden; margin-bottom: 100px;}
.room-swiper .swiper-slide .text{ position: absolute; padding: 30px 40px; width: 520px; height: 205px; border-radius: 10px; background-color: #fff; bottom: 0; right: 0; box-shadow: 10px 10px 15px #00000029;}
.room-swiper .swiper-slide .text h3{ line-height: 35px;}
.room-swiper .swiper-slide .text span, .room-swiper .swiper-slide .text p{ display: inline-block; line-height: 26px;}
.room-swiper .swiper-slide .text p{ padding-left: 20px;}


/* fac */
.fac-swiper{ position: relative; width: 100%; overflow: hidden; padding-bottom: 100px; text-align: left; }
.fac-swiper .swiper-slide .img-box{ width: 100%; height: 360px; border-radius: 10px; position: relative; overflow: hidden;}
.fac-swiper .swiper-slide .text h3{ line-height: 18px; }
.fac-swiper .swiper-slide .text p{ line-height: 26px; }
.fac-swiper .control-wrap{ width: 845px; height: 62px; position: absolute; bottom: 0;}
.fac-swiper .control-wrap .fac-prev{ position: absolute; top: 15px; left: unset; right: 50px;}
.fac-swiper .control-wrap .fac-next{ position: absolute; top: 15px; left: unset; right: 0;}
.fac-swiper .control-wrap .fac-prev:hover i, .fac-swiper .control-wrap .fac-next:hover i{ color: #D17028;}


/* fac-sub */
.fac-sub-swiper{ width: 100%; height: 100%; overflow: hidden;}

/* travel */
.travel-swiper{ width: 100%; height: 560px; overflow: hidden;}


/* sub */
.sub-swiper{ position: relative; width: 100%; padding-bottom: 100px; text-align: left; }
.sub-swiper .swiper-slide .img-box{ width: 100%; height: 360px; border-radius: 10px; position: relative; overflow: hidden;}
.sub-swiper .swiper-slide .text h3{ line-height: 18px; }
.sub-swiper .swiper-slide .text p{ line-height: 26px; }
.sub-swiper .control-wrap{ width: 100%; height: 62px; position: absolute; bottom: 0;}
.sub-swiper .control-wrap .sub-prev{ position: absolute; top: 15px; left: unset; right: 50px;}
.sub-swiper .control-wrap .sub-next{ position: absolute; top: 15px; left: unset; right: 0;}
.sub-swiper .control-wrap .sub-prev:hover i, .sub-swiper .control-wrap .sub-next:hover i{ color: #D17028;}


/* sub-travel */
.sub-travel-swiper{ position: relative; width: 100%; padding-bottom: 100px; text-align: left; }
.sub-travel-swiper .swiper-slide .img-box{ width: 100%; height: 360px; border-radius: 10px; position: relative; overflow: hidden;}
.sub-travel-swiper .swiper-slide .text h3{ line-height: 18px; }
.sub-travel-swiper .swiper-slide .text p{ line-height: 26px; }
.sub-travel-swiper .control-wrap{ width: 100%; height: 62px; position: absolute; bottom: 0;}
.sub-travel-swiper .control-wrap .sub-travel-prev{ position: absolute; top: 15px; left: unset; right: 50px;}
.sub-travel-swiper .control-wrap .sub-travel-next{ position: absolute; top: 15px; left: unset; right: 0;}
.sub-travel-swiper .control-wrap .sub-travel-prev:hover i, .sub-travel-swiper .control-wrap .sub-travel-next:hover i{ color: #D17028;}



/* sub-top */
#sub-top{ width: 100%; height: 600px; position: relative; }
#sub-top .img{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-size: cover; background-repeat: no-repeat; background-position: center;}
#sub-top h3{ position: absolute; top: 49%; width: 100%; text-align: center; z-index: 10;}


.v-middle{ display: table-cell; height: 100%; vertical-align: middle;}



/* =================== 1024px =================== */
@media (max-width: 1024px) {
    body{font-family: 'Noto Sans KR', sans-serif; font-weight: normal; font-size: 12px; font-weight: 400;  color: #555; overflow-x: hidden; position: relative; }
    body > section{ width: 100%; height: auto; position: relative; overflow: hidden; box-sizing: border-box;}
    .none-mo{ display: none!important;}
    .none-pc{ display: block!important;}
    .wrap1600{ width: 100%; padding: 0 20px; position: relative; margin: 0 auto; box-sizing: border-box; }
    .wrap1640{ width: 100%; padding: 0 20px; position: relative; margin: 0 auto; box-sizing: border-box;}

    

    body::-webkit-scrollbar {display: none; }

    .m-col-1{ width: 100%;}
    .m-col-2{ width: 50%;}
    .m-col-3{ width: 33.33%;}

    .mpb10{padding-bottom: 10px;}
    .mpb20{padding-bottom: 20px;}
    .mpb40{padding-bottom: 40px;}

    .mmb10{margin-bottom: 10px;}
    .mmb20{margin-bottom: 20px;}
    .mmb30{margin-bottom: 30px;}
    .mmb40{margin-bottom: 40px;}


    /* tab */
    #tab a{ display: block; padding: 0 20px; margin: 0 5px;  }


    /* button */
    .button01{display:inline-block; width: 160px; height: 40px; border-radius: 50px; font-size: 14px; color: #fff; line-height: 38px; text-align: center; border: 1px solid #D17028; background-color: #D17028; position: relative; transition: .3s;}
    .button01:after{ content: ''; position: absolute; width: 100%; height: 100%; border-radius: 50px; background-color: #F4C540; border: 1px solid #F4C540; right: 10px; top: 10px; z-index: -1; transition: .3s;}
    .button01:hover{ color: #fff; background-color: #D17028; transition: .3s;}
    .button01:hover:after{  background-color: #F4C540;}

    .button02{display:inline-block; width: 160px; height: 40px; border-radius: 50px; font-size: 14px; color: #D17028; background-color: #fff; line-height: 38px; text-align: center; border: 1px solid #fff; position: relative; transition: .3s;}
    .button02:after{ content: ''; position: absolute; width: 100%; height: 100%; border-radius: 50px; border: 1px solid #fff; right: 10px; top: 10px; z-index: -1; transition: .3s;}
    .button02:hover{ color: #D17028; background-color: #fff; transition: .3s;}


    /* sub-top */
    #sub-top{ margin-top: 60px; width: 100%; height: 51.28vw; position: relative; }


    
    /* service-swiper */
    .service-swiper .swiper-slide .img-wrap{ height: 51.28vw; border-radius: 10px; overflow: hidden; background-color: #222; }
    .service-swiper .swiper-slide .img-wrap .img{ opacity: .3;}
    .service-swiper .swiper-slide .img-wrap i{ position: absolute; bottom: 63px; width: 50px; left: 0; right: 0; margin: 0 auto; text-align: center; }
    .service-swiper .swiper-slide .text{ width: 170px; height: 54px; border-radius: 50px; top: -27px;}
    .service-swiper .swiper-slide .text h3{ line-height: 16px;}
    /* service-swiper.swiper-slide-active */
    .service-swiper .swiper-slide.swiper-slide-active .img-wrap .img{ opacity: 1;}
    .service-swiper .swiper-slide.swiper-slide-active .img-wrap i{ opacity: 0; }


    /* full-swiper */
    .full-swiper{ height: auto;}
    .full-swiper .img-wrap{ width: 100%; height: 0; padding-top: 56.25%; position: relative; }
    .full-swiper .swiper-button-next, .full-swiper .swiper-button-prev{ width: 40px; height: 40px; text-align: center; transition: .3s; border-radius: 50%; background-color: #fff;}
    .full-swiper .full-prev{ left: 20px;}
    .full-swiper .full-next{ right: 20px;}
    .full-swiper .pag-wrap{ width: 222px; height: 16px; font-size: 0; bottom: 20px; }
    .full-swiper .pag-wrap > div{ display: inline-block; position: relative; }
    .full-swiper .pag-wrap > div.enb{ width: 16px;}
    .full-swiper .full-pag{ width: 170px; margin: 0 10px 3px;}

    /* room-tab */
    #room-tab li a{ width: 20px; height: 20px; line-height: 20px; margin-right: 10px; }
    #dong-wrap a .pointer{ display: none;}
    /* room-swiper */
    .room-swiper{ width: 100%; height: auto; overflow: hidden; padding-right: unset; padding-left: 20px;}
    .room-swiper .swiper-slide{ position: relative;}
    .room-swiper .swiper-slide .img-wrap{ width: calc(100% - 20px); height: 61.54vw; overflow: hidden; margin-bottom: 44px;}
    .room-swiper .swiper-slide .text{ position: absolute; padding: 20px; width: 190px; height: 88px; }
    .room-swiper .swiper-slide .text h3{ line-height: 20px;}
    .room-swiper .swiper-slide .text p{ padding-left: 10px;}
    

    /* fac */
    .fac-swiper{ position: relative; width: 100%; overflow: hidden; padding-bottom: 55px; text-align: left; }
    .fac-swiper .swiper-slide .img-box{ height: 46.15vw;}
    .fac-swiper .swiper-slide .text h3{ line-height: 16px; }
    .fac-swiper .control-wrap{ width: calc(100% - 20px); height: 33px; }
    .fac-swiper .control-wrap .fac-prev{ position: absolute; top: 15px; left: unset; right: 30px;}
    .fac-swiper .control-wrap .fac-next{ position: absolute; top: 15px; left: unset; right: 0;}



    /* travel */
    .travel-swiper{ width: 100%; height: 61.54vw;; overflow: hidden;}


    /* sub */
    .sub-swiper{ position: relative; width: 100%; overflow: hidden; padding-bottom: 55px; text-align: left; padding-left: 20px; padding-right: 80px; }
    .sub-swiper .swiper-slide .img-box{ height: 46.15vw;}
    .sub-swiper .swiper-slide .text h3{ line-height: 16px; }
    .sub-swiper .control-wrap{ width: calc(100% - 40px); height: 33px;  }
    .sub-swiper .control-wrap .sub-prev{ position: absolute; top: 15px; left: unset; right: 30px;}
    .sub-swiper .control-wrap .sub-next{ position: absolute; top: 15px; left: unset; right: 0;}



    /* sub-travel */
    .sub-travel-swiper{ position: relative; width: 100%; overflow: hidden; padding-bottom: 55px; text-align: left; padding-left: 20px; padding-right: 80px; }
    .sub-travel-swiper .swiper-slide .img-box{ height: 46.15vw;}
    .sub-travel-swiper .swiper-slide .text h3{ line-height: 16px; }
    .sub-travel-swiper .control-wrap{ width: calc(100% - 40px); height: 33px;  }
    .sub-travel-swiper .control-wrap .sub-travel-prev{ position: absolute; top: 15px; left: unset; right: 30px;}
    .sub-travel-swiper .control-wrap .sub-travel-next{ position: absolute; top: 15px; left: unset; right: 0;}
    
}