/*기본 설정 시작*/
:link{ text-decoration: none; color: inherit; }
:visited,p,a,div,span,ul,li,strong,em, h1, h2 ,h3, h4, h5, h6,dl,dt,dd{ color: inherit; box-sizing: border-box; font-family: inherit; }
body,html{ width:100%; height:100%; overflow-x: hidden; -webkit-overflow-scrolling: touch; font-size: 1em; word-break: break-all; font-family: 'Noto Sans', sans-serif; position: relative}
/*기본 설정 끝*/

/*바로가기메뉴 시작*/
.skipmenu li a{  width:1px; height:1px; font-size:0px; line-height:0px; position:absolute; left:0px; top:0px; z-index:100; }
.skipmenu li a:focus{  width:100%; height:25px; background:black; font:normal 12px "고딕"; color:white; line-height:25px; text-align:center; text-decoration:none; }
/*바로가기메뉴끝*/

/*웹폰트 시작*/
@font-face{ font-family:"novar"; src:url("../fonts/Novar.eot"), url("../fonts/Novar.ttf"), url("../fonts/Novar.woff"); }
/*웹폰트 끝*/

/*헤더시작*/
.header_wrap{ width: 100%; height: 150px; float: left; line-height: 150px; color: #fff; font-size: 1.125em; font-weight: bold; position: fixed; left: 0; top: 0; z-index: 200; }
.header_wrap.scroll{ background: #574944}
.header_wrap .logo{ width: 170px; height: 150px; line-height: inherit; background: #574944; text-align: center; float: left}
.header_wrap .logo a{ width: 100%; height: 100%; display: block; float: left;}
.header_wrap .logo img{ width: 70px; vertical-align: middle;}
header{ float: left; width: 100%; height: auto}
nav{ width: auto; height: 100px; float: right; }
nav > ul{ width: 750px; height: 100%; float: right}
nav > ul > li{ float: left; min-width: 160px; text-align: center; margin: 0 10px;}
nav > ul > li > a{position: relative;}
nav > ul > li:hover{ color: #cfc5ac}
/*nav > ul > li > a::after{content: ""; position: absolute; bottom: -10px; left: 0; width: 100%; border-bottom: solid 2px #7fb7c8; transition: 0.3s; transform: scale(0,1) }*/
/*nav > ul > li > a:hover::after{transform: scale(1,1)}*/
.header_wrap .sub_list{ color: #574944; min-width: 160px; text-align: center; background: rgba(207,197,172,0.95); font-size: 0.875em; margin-top: -50px; height: 0;  overflow: hidden}
.header_wrap .sub_list li{ line-height: 40px; margin: 0 10px;}
.header_wrap .sub_list li a:hover{ border-bottom: solid 2px #574944;}
.header_wrap .sub_list li:first-child{ margin-top: 20px;}
.header_wrap .sub_list li:last-child{ margin-bottom: 20px;}
.header_right{ width: 260px; height: 150px; float: right; margin-right: 15px}
.header_right .weather{ width: 50%; height: 100%; float: left; }
.header_right .inputDesign{ width: 50%; height: 100%; line-height: 150px; float: left; background: transparent; border: none; color: white; font-size: 1em;}
.header_icon{ width: 25px; height: 100%; float: left; display: block; margin: 0 10px}
.header_icon img{ width: 100%; vertical-align: middle}
    /*모바일 헤더*/
    .mobile_header{ width: 100%; height:60px; float: left; position: fixed; z-index: 200; display: none; background: #574944}
    .mobile_header .logo{ width: 40px; position: absolute; left: 20px; top: 10px; z-index: 10}
    .mobile_header .logo img{ width: 100%;}
    .mobile_icon{ width: 65px; height: 100%; float: right; padding: 15px 20px; background: #c0a789 url(../images/menu_btn.png) no-repeat center; background-size: 35px 35px;}
    .mobile_nav{ width: calc(100% - 75px); height: 100vh; background: #c0a789; font-size: 1.125em;  color: white; float: right; text-align: left; padding: 120px 30px 0; position: absolute; right: -100%; top:0; overflow-y: scroll; z-index: 9}
    .mobile_nav > div{ width: 100%; height: 40px; line-height: 40px; overflow: hidden}
    .mobile_nav > div > a{font-size: 1.250em}
    .mobile_nav > .close_icon{width: 35px; height: 35px; position: absolute; right: 20px; top:15px; display: block}
    .mobile_nav > .close_icon img{width:100%}
    .mobile_nav > div.select{ height: auto; line-height: 30px; overflow: hidden}
    .mobile_nav > div.select > a{ width: 100%; border-bottom: solid 1px white; display: block}
    .mobile_nav > div.select > a::after{ content: '+' ; float: right}
    .mobile_nav .sub_list{ margin: 5px 10px}
    .mobile_nav .language{ width: 100%; height: 60px; float: left; margin-top: 50px}
    .mobile_nav .language span{ width: 50%; height: 30px; float: left; display: block; border: solid 1px white; text-align: center; line-height: 30px}
    .mobile_nav .language span:nth-child(n + 3){border-top: none}
    .mobile_nav .language span:nth-child(2n){border-left: none}
    .mobile_nav .language span.select{ background: white; color: #c0a789}
/*헤더끝*/

/*메인 비주얼 시작*/
.visual_wrap{ width: 100%; height: 100%; float: left; position: relative;}
.visual_text{ width: 100%; height: 200px; text-align: center; position: absolute; left: 50%; color: white; font-size: 1.250em; top: 50%; transform: translate(-50% , -40%); line-height: 36px;}
.visual_text strong{ font: bold 3em "novar"; width: 100%; float: left}
/*메인 비주얼 끝*/

/*메인 about 시작*/
.about{ width: 100%; height: auto; float: left; padding: 135px; padding-top: 0; color: #444}
.about .txt{ width: 100%; height: auto; float: left; padding: 135px 135px 270px; box-shadow: 1px 1px 30px rgba(0,0,0,0.4); margin-top: -135px; position: relative; z-index: 199; background: white; text-align: center; word-break: keep-all}
h2{ font: normal 3em "novar"; color: #444}
.about .txt h2::after{ content: ""; width: 50px; height: 3px; display: block; background: #444; margin: 50px auto}
.about .txt p{ font-size: 1em; line-height: 26px;}
.about .txt .view{ width: 450px; height: 120px; display: block; position: absolute; left: 50%; margin-left: -225px; bottom: 0; background: #c0a789; color: white; line-height: 120px; cursor: pointer; font-size: 1.5em}
/*메인 about 끝*/

/*메인 accommodation 시작*/
.accommodation{ width: 100%; height: auto; float: left; padding: 130px 130px 260px; background: #f4f1e3 url("../images/main_acco_bg.jpg") no-repeat left top; background-size: contain; position: relative}
.img_wrap{ width: 51%; height: auto; padding: 25px; background: #fff; position: relative; box-shadow: 1px 1px 30px rgba(125,111,100,0.3); z-index: 2}
.img_wrap img{ width: 100%; }
.plus{ width: 150px; height: 150px; display: block; position: absolute; right: 0; top: 50%; margin-top: -75px; background: url("../images/plus_btn.jpg") no-repeat center; background-size: cover; cursor: pointer}
.info_wrap{ width: 51%; height: auto; padding: 100px 100px 100px 12%; background: #fff; position: absolute; right: 130px; top: 260px; z-index: 1; color: #444}
.info_wrap h2::before{ content: "Welcomes you"; color: #c0a789; font-size: 0.5em; display: block; width: 100%; font-family: 'Noto Sans', sans-serif}
.info_wrap .txt{ font-size: 1em; line-height: 26px; margin: 50px 0;}
.info_wrap dd{ line-height: 30px;}
.info_wrap dd strong{ margin-right: 25px;}
/*메인 accommodation 끝*/

/*메인 location 시작*/
.location_wrap{ width: 100%; height: auto; float: left;}
.location_info{ width: 100%; height: auto; padding: 110px; background: #574944; color: white; text-align: center}
.location_info h2{ color: white; margin-bottom: 50px;}
.location_info span{ padding: 0 30px; font-size: 1em; }
.address{ background: url("../images/loca.png") no-repeat left top; background-size: 25px}
.tel{ background: url("../images/tel.png") no-repeat left top; background-size: 25px}
.mail{ background: url("../images/mail.png") no-repeat left top; background-size: 25px}
#location{ width: 100%; height: 650px; float: left;}
/*메인 location 끝*/

/*푸터 시작*/
footer{ width: 100%; height: 150px; float: left; background: #574944; color: #b3adab; font-size: 0.750em; padding: 50px 100px; box-sizing: border-box}
footer .inner{ width:1200px; margin:0 auto;}
footer .logo{ width: 50px; height: 100%; float: left; line-height: 50px; display: block; margin-left: 10px;}
footer .logo img{ vertical-align: middle; width: 100%;}
footer .left{ float: left; margin-left: 20px;}
footer .left p{ float: left; clear: both; text-indent: 10px; margin: 10px 0}
footer .left p span{ margin-right: 10px}
footer .right{ float: right; text-align: right;}
footer .right p{ float: right; clear: both; margin: 10px 0}
/*푸터 끝*/

.jqTransformSelectWrapper{ float: left; position: relative; width: 100%; height: 100%; text-align: center}
.jqTransformSelectWrapper div span{ position: absolute; left: 0; top: 0; white-space: nowrap; height: 150px; line-height: 150px; width: 100% !important; overflow: hidden; cursor: pointer}
.jqTransformSelectWrapper ul{ width: 100% !important; height: auto !important; position: absolute; top: 150px; left: 0; background: rgba(255,255,255,0.3); overflow: hidden; z-index: 10}
.header_wrap.scroll .jqTransformSelectWrapper ul{ background: #574944}
.jqTransformSelectWrapper ul li:first-child{ border: none}
.jqTransformSelectWrapper ul li{ width: 100%; height: 100px; border-top: solid 1px #eee; line-height: 100px}
.jqTransformSelectWrapper ul a{ display: block; text-align: center}
.jqTransformSelectWrapper ul a:hover{ background: rgba(255,255,255,0.3); color: #fff}
.jqTransformHidden{ display: none !important;}