#sub_topline {width:100%; height:6px; background: url('../images/sub/topline.jpg') center top repeat-x;} #sub_contbox {width:100%; margin-bottom:3%; z-index:1; position:relative;} .sub_tit {text-align:center; overflow:hidden; *height:140px; overflow:hidden; padding-top:40px; box-sizing:border-box;} .sub_tit dt {color:#666; letter-spacing:0px; font-size:20px; font-weight:400; margin-top:8px; font-family: 'Nanum Myeongjo', sans-serif;} .sub_tit dd {color:#000; font-weight:700;font-size:30px; font-weight:500; letter-spacing:-1px;font-family:'Noto Sans KR',sans-serif;} .sub_tit .type{color:#000; font-family:'Noto Sans KR',sans-serif; font-weight:500; letter-spacing:-2px; font-size:40px; margin-bottom:0px; } @media screen and (max-width: 1024px) { .sub_tit {text-align:center; overflow:hidden; *height:100px; overflow:hidden; padding-top:20px; box-sizing:border-box;} .sub_tit dt {color:#666; font-size:16px;} .sub_tit dd {color:#000; font-weight:700; letter-spacing:0px; font-size:20px; margin-top:5px; font-family: 'Nanum Gothic', sans-serif;} } .sub_tit2 {text-align:center; overflow:hidden; overflow:hidden; padding-top:20px; box-sizing:border-box;} .sub_tit2 dt {color:#000; letter-spacing:0px; font-size:40px; font-weight:700; margin-top:8px; font-family: 'Nanum Myeongjo', sans-serif;} .sub_tit2 dd {color:#666; font-weight:400; letter-spacing:0px; font-size:15px; font-family: 'Nanum Gothic', sans-serif;} @media screen and (max-width: 1024px) { .sub_tit2 {text-align:center; overflow:hidden; overflow:hidden; padding-top:20px; box-sizing:border-box;} .sub_tit2 dt {color:#000; letter-spacing:0px; font-size:20px; font-weight:800; margin-top:8px; font-family: 'Nanum Myeongjo', sans-serif;} .sub_tit2 dd {color:#666; font-weight:400; letter-spacing:0px; font-size:14px; font-family: 'Nanum Gothic', sans-serif;} .sub_tit .type{color:#000; letter-spacing:-2px; font-size:30px; margin-bottom:10px; } } #lnb{width:1100px; border-bottom:0px solid #e6e7e7;margin:20px auto 0px; text-align:center;} #lnb ul{} #lnb li{ margin:0 auto; width:180px; text-align:center; display:inline-block; } #lnb li a{display:block; margin:0 1px 2px 0;padding-bottom:5px; line-height:33px;color:#555;font-size:16px;background:#f1efef;border:1px solid #d8d6d6;} #lnb li a:hover{color:#fff;background-color:#04263c;padding-bottom:5px; text-decoration:none;border:1px solid #04263c;} #lnb li a.selected{color:#fff;background-color:#04263c;padding-bottom:5px; font-weight:bold;border:1px solid #04263c;} #lnb_room{width:1100px; border-bottom:0px solid #e6e7e7;margin:20px auto 0px; text-align:center;} #lnb_room ul{} #lnb_room li{ margin:0 auto; width:180px; text-align:center; display:inline-block; } #lnb_room li a{display:block; margin:0 1px 2px 0;padding-bottom:5px; line-height:33px;color:#555;font-size:16px;background:#f1efef;border:1px solid #d8d6d6;} #lnb_room li a:hover{color:#fff;background-color:#04263c;padding-bottom:5px; text-decoration:none;border:1px solid #04263c;} #lnb_room li a.selected{color:#fff;background-color:#04263c;padding-bottom:5px; font-weight:bold;border:1px solid #04263c;} .sub_wrap {position:relative; display:block; width:100%;} .sub_bg {height:400px; background-repeat:no-repeat;} .sub_bg.bg01 { background-image:url(/images/sub/sub_bg1.jpg); background-size:cover; background-position:center center;} .sub_bg.bg02 { background-image:url(/images/sub/sub_bg1.jpg); background-size:cover; background-position:center center;} .sub_bg.bg03 { background-image:url(/images/sub/sub_bg1.jpg); background-size:cover; background-position:center center;} .sub_bg.bg04 { background-image:url(/images/sub/sub_bg1.jpg); background-size:cover; background-position:center center;} .sub_bg.bg05 { background-image:url(/images/sub/sub_bg1.jpg); background-size:cover; background-position:center center;} .sub_bg.bg06 { background-image:url(/images/sub/sub_bg1.jpg); background-size:cover; background-position:center center;} .visual-copy { position: relative; float:left; width:100%; margin:200px 0 0;text-align:center; } .visual-copy dt {font-size:20pt;color:#fff;line-height:1.3;font-weight:400;letter-spacing:-1px; font-family:'Noto Sans KR',sans-serif;} .visual-copy dd {font-size:20pt;color:#fff;padding-top:10px;padding-left:0;font-weight:400; letter-spacing:-1px; font-family: 'PT Serif', serif} @media all and (max-width:1024px){ .sub_wrap {display:none; width:100%;} .sub_bg {height:260px;} .visual-copy {margin:120px 0 0;} .visual-copy dt {font-size:22px;} .visual-copy dd {font-size:10pt;} #lnb{width:90%; margin:20px auto 20px; padding-bottom:3%; text-align:center;} #lnb ul{} #lnb li{ margin:0 auto; width:32%; text-align:center; display:inline-block; } #lnb li a{font-size:18px; margin:0 1px 2px 0; line-height:30px; padding-top:3px} #lnb_room{display:none;} } /* 서브 :: 비주얼 */ #subVisual{position:relative; width:100%; max-width:1460px; height:800px; overflow:hidden; margin:0 auto; padding:0; z-index:1} #subVisual .visual-item{position:relative; width:100%; overflow:hidden; background-size:cover; vertical-align: middle; } #subVisual .visual-item { width:100%; min-height:800px; vertical-align: middle; -ms-transform: scale(1,1); /* IE 9 */ -o-transform: scale(1,1); /* IE 9 */ -moz-transform: scale(1,1); /* IE 9 */ -webkit-transform: scale(1,1); /* Chrome, Safari, Opera */ transform: scale(1,1); -webkit-transition:transform 5000ms ease-in-out ; /* Safari */ -moz-transition:transform 5000ms ease-in-out ; /* Safari */ -o-transition:transform 5000ms ease-in-out ; /* Safari */ -ms-transition:transform 5000ms ease-in-out ; /* Safari */ transition:transform 5000ms ease-in-out ; } #subVisual .visual-item:focus{outline:none;} #subVisual .visual-txt{position:absolute; top:40%; left:0; width:100%} #subVisual .visual-inner-txt{color:#fff; margin:0 auto; padding:0; width:100%; max-width:1200px; text-align:center} #subVisual .visual-inner-txt h2, #subVisual .visual-inner-txt h3, #subVisual .visual-inner-txt .txt,#subVisual .visual-inner-txt span,#subVisual .visual-inner-txt p, #subVisual .visual-inner-txt a{ display:block; opacity:0;filter:Alpha(opacity=0); -moz-transform:translateY(80%); -ms-transform:translateY(80%); transform:translateY(80%); -moz-transition:all 0.5s; -ms-transition:all 0.5s; transition:all 0.5s; } #subVisual .visual-inner-txt h2{font-size:58px; font-weight:200; margin:0; padding:0; line-height:100%; text-transform:uppercase; transition-delay:0.2s;} #subVisual .visual-inner-txt h2 > strong{font-weight:600; display:inline-block} #subVisual .visual-inner-txt h3{padding:15px 0 40px 0; font-size:45px; font-weight:600; transition-delay:0.4s; line-height:48px; letter-spacing:-3px;} /*#subVisual .visual-inner-txt h3 span{ color:#80ce0f;display:inline-block}*/ #subVisual .visual-inner-txt p{padding-top:15px; line-height:24px; transition-delay:0.6s} #subVisual .visual-inner-txt a{width:150px; height:150px; overflow:hidden; font-size:17px; line-height:150px; padding:0; -webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%; border:3px solid #fff; display:inline-block; transition-delay:0.8s} #subVisual .visual-inner-txt a:hover{ background-color:#da2128; border:3px solid #da2128} #subVisual .visual-txt a{color:#fff; opacity:0;filter:Alpha(opacity=0); transition:all 0.5s 0.5s; } #subVisual .visual-inner-txt h3 span{background-color:#0571b5; opacity:0.8; } #subVisual .visual-inner-txt h3 em{ font-size:35px; padding:10px} /* active */ #subVisual .visual-item.active > img{ -ms-transform: scale(1,1); /* IE 9 */ -o-transform: scale(1,1); /* IE 9 */ -moz-transform: scale(1,1); /* IE 9 */ -webkit-transform: scale(1,1); /* Chrome, Safari, Opera */ transform: scale(1,1); } #subVisual .active .visual-inner-txt h2, #subVisual .active .visual-inner-txt h3, #subVisual .active .visual-inner-txt strong, #subVisual .active .visual-inner-txt span, #subVisual .active .visual-inner-txt p, #subVisual .visual-inner-txt a{ -moz-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); } #subVisual .active .visual-inner-txt h2, #subVisual .active .visual-inner-txt h3, #subVisual .active .visual-inner-txt strong, #subVisual .active .visual-txt a{ opacity:1.0;filter:Alpha(opacity=100); } #subVisual .active .visual-inner-txt span{ opacity:0.73;filter:Alpha(opacity=73); } #subVisual .active .visual-inner-txt p{ opacity:0.54;filter:Alpha(opacity=54); } #subVisual .slick-arrow{ position:absolute; top:45%; *left:0%; margin:0; background:none; border:0; cursor:pointer; z-index:99; font-size:0; -webkit-transition:all 300ms;-moz-transition:all 300ms;-o-transition:all 300ms;-ms-transition:all 300ms;transition:all 300ms } #subVisual .slick-arrow.slick-prev{background:url(../images/main/mv-prev2.png) no-repeat; width:50px; height:50px; left:5%; opacity:1;filter:Alpha(opacity=100); z-index:99999; background-size:100% 100%; -moz-background-size:100% 100%; -webkit-background-size:100% 100%;} #subVisual .slick-arrow.slick-next{background:url(../images/main/mv-next2.png) no-repeat; width:50px; height:50px; right:5%; opacity:18;filter:Alpha(opacity=100); z-index:99999; background-size:100% 100%; -moz-background-size:100% 100%; -webkit-background-size:100% 100%;} #subVisual .slick-arrow.slick-prev:hover{opacity:1;filter:Alpha(opacity=100); margin-left:0px;} #subVisual .slick-arrow.slick-next:hover{opacity:1;filter:Alpha(opacity=100); margin-right:0px;} #subVisual .scroll-icon{position:absolute; bottom:32px; left:50%; width:72px; margin-left:-36px; text-align:center;} #subVisual .scroll-icon span{display:block; color:#fff; font-weight:300; font-size:10px; opacity:0.75;filter:Alpha(opacity=75); margin-bottom:15px;} @media all and (max-width:1099px){ #subVisual{height:602px;} #subVisual .visual-item {min-height:602px;} #subVisual .visual-txt{bottom:37%;} #subVisual .visual-inner-txt h2{font-size:50px; font-weight:200; margin:0; padding:0; line-height:100%; text-transform:uppercase; transition-delay:0.2s;} #subVisual .visual-inner-txt h3{padding:15px 0 30px 0; font-size:33px; font-weight:200; transition-delay:0.4s; line-height:38px} #subVisual .visual-inner-txt h3 em{ font-size:27px; padding:10px} #subVisual .visual-inner-txt a{width:130px; height:130px; overflow:hidden; font-size:17px; line-height:120px; } #subVisual .scroll-icon{*display:none;} } @media all and (max-width:867px){ #subVisual{height:475px;} #subVisual .visual-item{min-height:475px;} #subVisual .visual-txt{*bottom:40%;} #subVisual .visual-inner-txt h2{font-size:48px; font-weight:200; margin:0; padding:0; line-height:100%; text-transform:uppercase; transition-delay:0.2s;} #subVisual .visual-inner-txt h3{padding:15px 0 25px 0; font-size:30px; font-weight:200; transition-delay:0.4s; line-height:38px} #subVisual .visual-inner-txt h3 em{ font-size:20px; padding:10px} #subVisual .visual-inner-txt a{width:130px; height:130px; overflow:hidden; font-size:17px; line-height:120px; } #subVisual .slick-arrow.slick-prev{left:3%;} #subVisual .slick-arrow.slick-next{right:3%;} } @media all and (max-width:767px){ #subVisual{height:420px;} #subVisual .visual-item {min-height:420px;} #subVisual .visual-txt{bottom:25%;} #subVisual .visual-inner-txt h2{font-size:43px; font-weight:200; margin:0; padding:0; line-height:100%; text-transform:uppercase; transition-delay:0.2s;} #subVisual .visual-inner-txt h3{padding:15px 7% 25px 7%; font-size:26px; font-weight:200; transition-delay:0.4s; line-height:38px} #subVisual .visual-inner-txt h3 em{ font-size:18px; padding:7px} #subVisual .visual-inner-txt a{width:180px; height:50px; overflow:hidden; font-size:16px; line-height:42px; -webkit-border-radius:0;-moz-border-radius:0;border-radius:0;} #subVisual .slick-arrow.slick-prev{left:3%;} #subVisual .slick-arrow.slick-next{right:3%;} } @media all and (max-width:540px){ #subVisual{height:350px; overflow:hidden} #subVisual .visual-item {min-height:350px; background-size:cover; background-position:center center; vertical-align: middle;} #subVisual .visual-txt{bottom:0%;} #subVisual .visual-inner-txt h2{font-size:28px; font-weight:200; margin:0; padding:0; line-height:100%; text-transform:uppercase; transition-delay:0.2s;} #subVisual .visual-inner-txt h3{padding:10px 10% 10px 10%; font-size:19px; font-weight:600; letter-spacing:0; transition-delay:0.4s; line-height:20px} #subVisual .visual-inner-txt a{width:160px; height:40px; overflow:hidden; font-size:14px; line-height:32px; -webkit-border-radius:0;-moz-border-radius:0;border-radius:0;} #subVisual .visual-inner-txt h3 em{ font-size:15px; padding:5px} #subVisual .slick-arrow{ position:absolute; top:50%; *left:0%; margin:0; background:none; border:0; cursor:pointer; z-index:99; font-size:0; -webkit-transition:all 300ms;-moz-transition:all 300ms;-o-transition:all 300ms;-ms-transition:all 300ms;transition:all 300ms } #subVisual .slick-arrow.slick-prev{width:30px; height:30px; left:2%;} #subVisual .slick-arrow.slick-next{width:30px; height:30px; right:2%;} } /*오시는길*/ .location { max-width:1280px; margin:4% auto 0; padding:0 10px; overflow:hidden; } .location .wrap_controllers{display:none !important} .location .map_border{display:none !important;} .map_add_wrap{width:100%; overflow:hidden; padding:30px 0 0 0; font-size:17px; } .map_add_wrap li{ padding:20px 0 20px 20px; border-bottom:1px solid #7b736b; overflow:hidden; } .map_add_wrap li dt{color:#222; float:left; width:15%; font-size:17px; font-weight:600; text-align:center} .map_add_wrap li dd{color:#444; float:left; width:85%; font-size:16px; padding-left:3%; line-height:1.7} .map_add_wrap li dd p{margin-bottom:20px} .map_add_wrap li dd p strong{font-weight:600; color:#fff;} @media all and (max-width:1280px) { .location .root_daum_roughmap .wrap_map{height:400px !important} } @media all and (max-width:1200px) { .location .root_daum_roughmap_landing{width:100% !important;} .map_add_wrap li dd{font-size:14px; } } @media all and (max-width:650px) { .map_add_wrap li dt{ float:left; width:15%; font-size:14px; font-weight:600; text-align:center} .map_add_wrap li dd{ float:left; width:85%; font-size:12px; padding-left:3%; line-height:1.7} .location .root_daum_roughmap .wrap_map{height:350px !important} } @media all and (max-width:450px) { .location .root_daum_roughmap .wrap_map{height:300px !important} } /* 객실보기 */ #room_view {position: relative; overflow:hidden; margin-bottom:2%;} #room_view .info_wrap { max-width:1400px; width:100%; overflow:hidden; margin:4% auto 3%;} #room_view .info_wrap .img {float:left; width:60%;} #room_view .info_wrap .info {float:right; top: 2.1%; width: 37.2%; padding: 3% 5% 4% 2.5%;} #room_view .info_wrap .info h3 {font-size: 50px; margin-bottom: 8%; color:#222; font-weight:600; letter-spacing:-0.05em} #room_view .info_wrap .info p {font-size: 16px;color: #444; opacity:0.9;line-height: 1.6; letter-spacing:0} #room_view .img_room {text-align:center} #room_view .img_detail .img_group1 {} #room_view .img_detail h3 {text-align: center;margin: 2% 0 2%; font-family: 'Libre Baskerville', serif; font-size:55px; font-weight:400; color:#fff; opacity:0.9} #room_view .img_detail .img_group2 {max-width:1400px; margin:0% auto 0; font-size: 0; text-align:center; overflow:hidden} #room_view .img_detail .img_group2 p{margin: 3% 0 0;} #room_view .img_detail .img_group2 span{display:block; font-size:10px; letter-spacing:15px; color:#fff; margin: 2% 0;} #room_view .img_detail .img_group2 img {text-align:center} #room_view .img_detail .img_group2 .Rtxt{} #room_view .img_detail .img_group2 div {float: left; margin-right: 2.6%;width: 31.55%;} #room_view .img_detail .img_group2 div .img {width: 100%;} #room_view .img_detail .img_group2 div:nth-child(1) {margin-top: 128px;} #room_view .img_detail .img_group2 div:nth-child(3) {margin-top: 77px;} #room_view .img_detail .img_group2 div:nth-child(3) h3 {margin-bottom: 43px;} #room_view .img_detail .img_group2 .last {display: inline-block;margin-right: 0;} @media all and (max-width: 1400px) { #room_view .info_wrap .info {float:right; top: 2.1%; padding: 3% 2% 3% 2%;} } @media all and (max-width:1024px) { #room_view .info_wrap .img {display:none} #room_view .info_wrap .info {position: relative; margin: 4% auto 0; width: 100%; padding: 0% 5% 4% 5%; top: 0; right:0;} #room_view .info_wrap .info h3 {font-size: 30px; margin-bottom: 2%; } #room_view .info_wrap .info p {font-size: 15px; opacity:0.9;line-height: 1.6;} #room_view .img_detail h3 {font-size:20px;} #room_view .img_detail .img_group2 img {width:95%} #room_view .img_detail .img_group2 p{font-size:6px; letter-spacing:5px; margin-bottom: 2%;} } @media all and (max-width: 540px) { #room_view .img_detail h3 {font-size:30px;} #room_view .img_detail .img_group2 div:nth-child(1) {margin-top: 40px;} #room_view .img_detail .img_group2 div:nth-child(3) {margin-top: 10px;} #room_view .img_detail .img_group2 div:nth-child(3) h3 {margin-bottom: 10px;} } /* map */ .map_02 { position:relative; margin:4% auto 0; } .map_02 dl:first-child {margin-bottom:2em;} .reser_dl {width:95%; padding-left:2%} .reser_dl dt {font-family: 'Nanum Myeongjo', serif; font-size:2em; line-height:1.5em; letter-spacing:-0.05em; color:#525252;margin-bottom:1.5em; } .reser_dl dd { padding-left:2.5em; font-size:15px;} @media (max-width: 1024px){ .reser_dl dt { font-size:1.6em; margin-bottom:0.5em; } .reser_dl dd { padding-left:1em; margin-bottom:3em;} } @media (max-width: 768px){ .map_02 { margin:3% auto 5%; } .reser_dl dd { padding-left:2.5em; font-size:12px;} } .location2{} .location_map {width:1200px; margin:0 auto; } @media screen and (max-width: 1200px) { .location2 .location_map {width:90%; margin:0 auto;} } @media screen and (max-width: 480px) { .location2 .location_map {width:320px; margin:0 auto;} } /*주변관광*/ #Tour {width:100%; max-width:1300px; margin:0 auto; padding:3% 0px 0; overflow:hidden;} #Tour .img_list_wrap { } #Tour .img_list_wrap > li {margin:0px 0 7%;} #Tour .img_list_wrap > li:last-child {margin:0px 0 0%; padding:0% 0px 2%;} /*#Tour .img_list_wrap > li:after { content:''; position:absolute; left:50%; bottom:-44px; height:66px; width:1px; background:#dadada; }*/ #Tour .img_list_wrap > li > div { clear:both; max-width:100%; margin:20px auto 0; overflow:hidden; } #Tour .img_list {position:relative; float:left; width:55%; z-index:1px;} #Tour .img_list img{width:100%; max-width:780px;} #Tour .txt {position:relative; float:left; width:45%; margin:10px 0 0 -50px; max-width:585px; z-index:5px; padding:40px 40px 40px 90px; font-size:14px; border:0px solid #be9a5e;} #Tour .txt em {font-size:15px; margin-bottom:10px; color:#666; letter-spacing:0.5em; font-weight:100; display:block; padding-left:2px; font-style:normal } #Tour .txt strong { font-size:35px; color:#222; line-height:1.2; letter-spacing:-0.07em; display:block; font-family: 'LotteMartDreamNS'; } #Tour .txt span {padding:40px 0 20px 0; color:#c08a27; font-size:16px; text-decoration:underline;display:block; } #Tour .txt p{ display:block; color:#555; font-size:18px; font-weight:400; letter-spacing:-0.01em; line-height:1.6; margin-top:20px;} #Tour .img_list_wrap > li:nth-child(even) .img_list { float:right; } #Tour .img_list_wrap > li:nth-child(even) .txt { float:left; } #Tour .img_list .slide { } #Tour .img_list_wrap .bt4 {margin:0px 0 4%;} @media all and (max-width: 1280px) { #Tour .img_list_wrap > li { position:relative; margin:0px 0 5%; } #Tour .img_list_wrap .bt4 {margin:0px 0 0;} } @media all and (max-width: 1024px) { #Tour { padding:0 10px; } #Tour .img_list_wrap { margin-top:0px; } #Tour .img_list_wrap > li { padding:20px 0; } #Tour .img_list { float:none !important; width:auto; } #Tour .img_list img{width:100% } #Tour .txt, #Tour .txt2 {position:relative; float:none !important; width:auto; padding:10px; font-size:12px; margin:10px 0 0 0; border:0} #Tour .slick-dots { margin-top:10px; } #Tour .txt strong, #Tour .txt2 strong { font-size:30px; } #Tour .txt em, #Tour .txt2 em {font-size:12px; } #Tour .txt span, #Tour .txt2 span {padding:10px 0 5px 0; } } .bodgroup{width:1200px; margin:0 auto; position:relative; z-index:100000} @media screen and (max-width: 1024px) { .bodgroup{width:95%; margin:0 auto;} } .sub-roombox {position: relative;width: 1200px; height:720px; margin:0 auto; overflow: hidden;} @media screen and (max-width: 1024px) { .sub-roombox {position: relative;width: 1024px; height:614px; margin:0 auto; overflow: hidden;} } @media screen and (max-width: 768px) { .sub-roombox {position: relative;width: 768px; height:461px; margin:0 auto; overflow: hidden;} } @media screen and (max-width: 510px) { .sub-roombox {position: relative;width: 510px; height:306px; margin:0 auto; overflow: hidden;} } @media screen and (max-width: 480px) { .sub-roombox {position: relative;width: 100%; height:290px !important; margin:0 auto; overflow: hidden;} } /*미리보기*/ .Preview{width:100%; max-width:1300px; margin:2% auto 0;} .Preview img{width:100%;} /*특별함*/ .spview{ width:100%; padding-top: 50px; text-align:center} .imggroup{width:1200px; margin:2% auto 0;} .imgview{text-align:center; font-size:16px;} .imgview span{text-align:center; font-size:18px; padding:5px; margin-bottom:10px; display:block} .txview{width:850px; margin:20px auto 0;} .txview li{text-align:left !important; font-size:16px; line-height:1.8; color:#666;} .txview li span{margin-right:5px} .txview ul{margin-bottom:10px} .txtview{text-align:center; font-size:16px; line-height:1.6; color:#666; } .txtview1{text-align:center; font-size:50px; color:#999} .txtview2{text-align:center; font-size:50px; color:#999; margin-top:20px} .tourview {width:100%; border-bottom:1px solid #ccc; padding:4% 0% 1%} .tourfirst{width:100%; border-bottom:1px solid #ccc; padding:2% 0% 1%} .tourlast{width:100%; border-bottom:0px solid #ccc; padding:4% 0% 1%} .marginBottom30{margin-bottom:30px;} .marginBottom20{margin-bottom:20px;} .imgview dl{width:100%; padding:10px 4% 0;} .imgview dt{color:#000; font-size:26px; text-align:left; line-height:2} .imgview dt span{color:#7b7c7c;} .imgview dd{font-size:16px; text-align:left; font-weight:200; color:#555} @media screen and (max-width: 1024px) { .imggroup{width:100%; margin:0px auto 0;} .imgview{width:95%; padding:0 1% 0 4%;text-align:center} .imgview100{width:100%;} .imgview span{text-align:center; font-size:15px; padding:5px; margin-bottom:10px} .txview{width:80%; margin:20px auto 0;} .txview li{font-size:14px; line-height:1.5; } .txview li span{margin-right:5px} .txview ul{margin-bottom:10px} } @media screen and (max-width: 768px) { .tourview {width:100%; border-bottom:1px solid #ccc; padding:4% 0% 0%; margin-bottom:4%} .tourlast{width:100%; border-bottom:0px solid #ccc; padding:4% 0% 1%} .tourfirst{width:100%; border-bottom:1px solid #ccc; padding:0 0% 1%} .spview{ width:100%; padding-top: 20px; text-align:center} .imgview dl{width:100%; padding:1%} .imgview span{text-align:center; font-size:13px; padding:2px; margin-bottom:10px} .imgview dt{color:#000; font-size:18px; text-align:left; line-height:2} .imgview dt span{color:#7b7c7c;} .imgview dd{font-size:13px; text-align:left; font-weight:200; color:#555} .txtview{text-align:center; font-size:15px; color:#666; font-family: 'Nanum Myeongjo', sans-serif;} .txtview1{text-align:center; font-size:20px; color:#999} .txtview2{text-align:center; font-size:20px; color:#999; margin-top:10px} } .img {overflow:hidden;} .img img {float:left;} /*주변관광*/ .special {background-color:#fff; margin-top:30px; padding:0 0 0 0 !important;} .special-title-en {font-size:15px; font-weight:200; } .special-title-kr {font-size:30px;font-weight:700} .special-desc{font-size:15px; line-height:1.6; color:#555555; word-break:keep-all;padding-top:4%;} .group:after { content:"."; display:block; height:0; clear:both; visibility:hidden; margin-bottom:50px} .special-conts1-pic {float:left;width:70%;} .special-conts1-text {float:left;width:30%;padding:4% 2% 4% 2%;} .special-conts2-pic {float:right;width:70%;} .special-conts2-text {float:right;width:30%;padding:4% 2% 4% 2%;} @media screen and (max-width: 768px) { .special {margin-bottom:0;} .special-conts1-pic {width:100%;} .special-conts1-text {width:100%;} .special-conts2-pic {width:100%;} .special-conts2-text {width:100%;} } @media screen and (max-width: 510px) { .special-title-en {font-size:10pt;} .special-title-kr {font-size:18pt;} } /*인사말*/ .welcome {width:48%; text-align:left; margin-top:5%; color:#555; font-weight:400; letter-spacing:-1px; font-size:18px; line-height:1.6;} .welcomebox{width:1079px; height:921px; background:url(../images/sub/welcome.jpg) no-repeat; background-size:100%; margin:0px auto 0; padding:520px 0 0 20px;} @media screen and (max-width: 1000px) { .welcomebox{width:95%; height:100%; background:url(../images/sub/welcome.jpg) no-repeat; background-size:100%; margin:0px auto 0; padding:45% 0 0 20px;} .welcome {width:50%; font-size:14px;}} @media screen and (max-width: 768px) { .welcomebox{width:90%; height:100%; background:url(../images/sub/welcome_m.jpg) no-repeat; background-size:100%; margin:4% auto; padding:86% 0 3% 5px;} .welcome {width:96%; margin:1% auto 3%; font-size:18px; text-align:left} } /*특별함*/ .sub_ctbox{overflow: hidden; width:100%; max-width:1400px; margin:4% auto 2%; } .cont1 {width:98%; overflow: hidden;} .cont1 .CImg {float:left; width:70%;} .cont1 .Cimg img{width:100%;} .cont1 .Ctxt {float:left; width:28%; margin:3% 0 0 0px; padding:0px 0px 0px 3%; font-size:14px; border:0px solid #be9a5e;} .cont1 .Ctxt em {font-size:15px; margin-bottom:10px; color:#666; letter-spacing:0.5em; font-weight:100; display:block; padding-left:2px; font-style:normal } .cont1 .Ctxt strong { font-size:40px; color:#222; line-height:1.2; letter-spacing:-0.07em; display:block; font-family: 'LotteMartDreamNS'; } .cont1 .Ctxt span {padding:40px 0 20px 0; color:#c08a27; font-size:16px; text-decoration:underline;display:block; } .cont1 .Ctxt p{ display:block; color:#555; font-size:18px; font-weight:400; letter-spacing:-0.01em; line-height:1.6; margin-top:20px;} .cont2 {overflow: hidden; width:98%; max-width:1200px; margin:6% auto 2%; } .cont2 ul{display:inline-block;} .cont2 ul li {float: left; width: 48%; margin:0 1% 2%1%; overflow:hidden; position:relative;} .cont2 ul li img{width:100%; vertical-align:bottom !important;} .cont2 .baseImg{ position:relative; z-index:1} .cont2 .baseImg:after {content: "";position: absolute; top: 0;right: 0;bottom: 0;left: 0;margin: auto; background: rgba(61, 57, 53, 0);transition: background 0.2s;} .cont2 .baseImg:after{ background: none;} .cont2 .baseTxtWrap{position:absolute; bottom:0; left:0; background: rgba(0, 0, 0, 0.2); padding:10px 20px; width:100%; *left: 50%; *transform:translate(-50%, -50%); z-index:2} .cont2 .baseTxt{width:100%; text-align:center;} .cont2 .baseTxt p{ font-size: 18px; color:#fff; letter-spacing:0px; font-weight: 400; } .cont3 {overflow: hidden; width:98%; max-width:1300px; margin:0% auto 2%; } .cont3 ul{display:inline-block;} .cont3 ul li {float: left; width: 48%; margin:0 1% 2%1%; overflow:hidden; position:relative;} .cont3 ul li img{width:100%; vertical-align:bottom !important;} @media all and (max-width: 1024px) { .cont1 .CImg {float:left; width:100%;} .cont1 .Ctxt {float:left; width:90%; margin: 5% 5%} .cont1 .Ctxt strong { font-size:33px; color:#222; line-height:1.2; letter-spacing:-0.07em; display:block; font-family: 'LotteMartDreamNS'; } .cont1 .Ctxt span {padding:40px 0 20px 0; color:#c08a27; font-size:16px; text-decoration:underline;display:block; } .cont2 {overflow: hidden; width:100%; max-width:1200px; margin:6% auto 2%; } .cont2 ul{display:inline-block;} .cont2 ul li {float: none; width: 90%; margin:0 auto; overflow:hidden; margin-bottom:1%} .cont3 ul li {float: none; width: 94%; margin:1% auto 1%;} } @media all and (max-width: 540px) { } /*이용요금표*/ .RTit{font-size:22px; text-align:left; color:#000; padding:0px 0 4px 0; margin:20px 0 20px ;word-break:keep-all; border-bottom:2px solid #444;} .red{color:#d82222} .tableSt_03{width:96%; border:1px solid #ccc; border-bottom:1px solid #ccc; margin:3% auto 6%;} .tableSt_03 th{padding:10px; background:#eae9e9; color:#444; border-right:1px solid #ccc;border-bottom:1px solid #ccc; vertical-align:middle; text-align:center; font-size:15px;} .tableSt_03 td{padding:10px; font-size:14px; color:#555; border-right:1px solid #ccc; border-bottom:1px solid #ccc; text-align:center} .table.tableSt_03 tr:nth-child(even) th{background:#f7f7f7;} .table.tableSt_03 tr:nth-child(even) td{background:#eae9e9;} .tableSt_03 td:last-child, .tableSt_02 th:last-child{border-right:0;} .tableSt_03 .tdleft{text-align:left;} .tableSt_03 .td16{ font-size:16px;} /*이용안내*/ .marginBottom{padding-bottom:3%;} .marginBottom50{margin-bottom:0%;} .sub_row2{width:92%; margin:2% 4% 0; } .sub_row2 dd, .sub_row dd, .sub_left dd, .sub_right dd{position:relative; padding:2px 0 2px 10px; font-size:15px; line-height:1.5} .sub_row2 dd:before, .sub_row dd:before, .sub_left dd:before, .sub_right dd:before{content:""; display:block; position:absolute; top:14px; left:0; width:2px; height:2px; background:#222; } .sub_left dd span, .sub_right dd span{color:#ccc;} @media screen and (max-width: 1024px) { /*이용요금표*/ .RTit{font-size:18px; font-weight:600; margin-left: 2%; margin-right: 2%} .tableSt_03{width:96%; border:1px solid #ccc; border-bottom:1px solid #ccc; margin:20px auto 0;} .tableSt_03 th{padding:6px; background:#eae9e9; color:#444; border-right:1px solid #ccc;border-bottom:1px solid #ccc; vertical-align:middle; text-align:center; font-size:13px;} .tableSt_03 td{padding:6px; font-size:12px; color:#555; border-right:1px solid #ccc; border-bottom:1px solid #ccc; text-align:center} .table.tableSt_03 tr:nth-child(even) th{background:#f7f7f7;} .table.tableSt_03 tr:nth-child(even) td{background:#eae9e9;} .tableSt_03 td:last-child, .tableSt_02 th:last-child{border-right:0;} /*이용안내*/ .sub_row2{width:96%; margin:0 2%; } .sub_row2 dd, .sub_row dd, .sub_left dd, .sub_right dd{position:relative; padding:2px 0 2px 10px; font-size:15px; line-height:1.5} .sub_row2 dd:before, .sub_row dd:before, .sub_left dd:before, .sub_right dd:before{content:""; display:block; position:absolute; top:14px; left:0; width:2px; height:2px; background:#222; } .sub_left dd span, .sub_right dd span{color:#ccc;} } /*객실미리보기*/ .preview {width:100%; margin:0 auto; text-align:center} .preview_title {color:#555; font-weight:600; font-size:25px; width:200px; padding:5px; border-top:1px solid #bbb; border-bottom:1px solid #bbb; margin-bottom:30px} .preview .line {width:30px; height:2px; background-color:#333; padding:0; margin:0 auto 0px;} .preview h3 {color:#555; font-weight:600; font-size:25px; width:200px; padding:5px; margin:10px auto 20px; text-align:center} .preview h2 {color:#222; font-weight:200; font-size:15px; padding:5px; margin:40px auto 10px; text-align:center} .preview img {position:relative; width:19.9%; margin-right:-3px; max-width:100%;} .preview .pv {position:relative; width:13.9%; margin-right:-3px; margin-bottom:1px;max-width:100%;} .mBottom50{margin-bottom:80px;} .mBottom20{margin-bottom:40px;} @media screen and (max-width: 1024px) { .preview {width:98%; margin:0 auto; text-align:center} .preview img {position:relative; width:33%; margin-right:-5px; max-width:100%;} .preview .pv {position:relative; width:24%; margin-right:0px; margin-bottom:1px;max-width:100%;} } /* Preview */ .room-list-wrap { position:relative; width:1200px; margin:30px auto 0; *padding-bottom:340px; } .room-list-wrap .preview_title {color:#555; font-weight:600; font-size:25px; text-align:center; width:200px; padding:5px; border-top:1px solid #bbb; border-bottom:1px solid #bbb; margin-bottom:30px} .room-list-wrap .line {width:30px; height:2px; background-color:#333; padding:0; margin:0 auto 0px;} .room-list-wrap h3 {color:#555; font-weight:600; font-size:18px; width:200px; padding:5px; margin:10px auto 20px; text-align:center} .room-list-wrap:before { content:''; position:absolute; *top:50px; left:0; right:0; bottom:0; display:block; } .room-list { text-align:center; overflow:hidden; } .room-list li {display:inline-block; width:19.5%; margin:0 0px 10px 0px; } .room-list li img { display:block; margin:0 auto; max-width:100%; } .room-list li h1 { position:relative; top:15px; font-size:14px; } .room-list li a { position:relative; display:block; overflow:hidden; color:#fff; } .room-list li a span { position:relative; display:block; overflow:hidden; } .room-list li a span:after { content:'+'; position:absolute; top:30px; left:30px; bottom:30px; right:30px; display:block; box-sizing:border-box; padding-top:30%; font-size:30px; text-align:center; color:#000f; background:rgba(245,245,245,0.7); -webkit-transform:scale(0); -ms-transform:scale(0); transform:scale(0); -webkit-transition:0.6s; -ms-transition:0.6s; transition:0.6s; } .room-list li a:hover span:after { transform:scale(1); } @media screen and (max-width: 1024px) { .room-list-wrap { position:relative; width:95%; margin:30px auto 0;} .room-list li h1 { position:relative; top:15px; font-size:12px; } } /*부대시설 */ .service-wrap { position:relative; z-index:5; padding:0px 10px;} .service-wrap .img_list_wrap { margin-top:0px;} .service-wrap .img_list_wrap > li { position:relative; padding:40px 0 40px; border-bottom:1px solid #eee; } .service-wrap .img_list_wrap > li:last-child{border-bottom:0px solid #62584c; } .service-wrap .img_list_wrap > li:first-child{padding-top:0; } .service-wrap .img_list_wrap > li > div { clear:both; max-width:1200px; width:100%; margin:0 auto; overflow:hidden; } .service-wrap .img_list { float:left; width:55%; } .service-wrap .img_list .slide { } .service-wrap .txt { float:right; width:38%; padding:60px 0px 0 0px; font-size:14px; } .service-wrap .txt em {font-size:15px; color:#444; letter-spacing:0.5em; font-weight:100; display:block; padding-left:2px } .service-wrap .txt strong { font-size:30px; color:#444; line-height:1.2; letter-spacing:-0.09em; display:block;} .service-wrap .txt span {padding:40px 0 20px 0; color:#997751; text-decoration:underline;display:block; } .service-wrap .txt p{ display:block; color:#444; font-size:16px; font-weight:400; letter-spacing:-0.01em; line-height:1.6; margin-top:20px;} .desk{background:#fc3984; color:#fff; font-size:20px; padding:6px 20px; font-weight:600} .desk a:hover{text-decoration:underline} .desk a{color:#fff; } .service-wrap .img_list_wrap > li:nth-child(even) .img_list { float:right; } .service-wrap .img_list_wrap > li:nth-child(even) .txt { float:left; } .service-wrap .slick-dots { position:static; margin-top:10px; } .service-wrap .slick-dots li button { background-image:url('/img/common/circle_off.png'); } .service-wrap .slick-dots li.slick-active button { background-image:url('/img/common/circle_on.png'); } @media all and (max-width: 1440px) { .service-wrap .txt { float:right; width:35%; padding:60px 0px 0 0px; font-size:14px; } } @media all and (max-width: 1024px) { .service-wrap .img_list_wrap > li { padding:50px 0; } .service-wrap .img_list { float:left; width:60%; } .service-wrap .txt { padding:0 20px 0 0px; width:28%; font-size:12px; } .service-wrap .txt em { font-family:'Kokila'; font-size:13px; } .service-wrap .txt strong { font-size:30px; } .service-wrap .txt span { margin:20px 0 10px 0; } } @media all and (max-width: 700px) { .service-wrap { padding:0 10px; } .service-wrap .img_list_wrap { margin-top:40px; } .service-wrap .img_list_wrap > li { padding:40px 0; } .service-wrap .img_list > img{width:100% } .service-wrap .img_list { float:none !important; width:auto; } .service-wrap .txt { float:none !important; width:auto; padding:10px 7%; font-size:12px; } .service-wrap .txt p{margin-top:20px;} .service-wrap .slick-dots { margin-top:10px; } .desk{font-size:16px; padding:4px 10px;} }