@charset "utf-8";
/* 인디케이터 */
#aside {position:fixed; top:0; right:80px; z-index:5000}
#aside .indicator {position:relative; width:1px; height:100vh; background:#fff; z-index:6500}
#aside .indicator ul {position:absolute; top:50%; left:-25px; margin-top:-40px}
#aside .indicator ul:after {clear:both; content:''; display:block}
#aside .indicator ul li {padding-top:15px}
#aside .indicator ul li:first-child {padding-top:0}
#aside .indicator ul li a {display:block; width:100%; height:100%; cursor:pointer}
#aside .indicator ul li a span.bar {display:block; width:25px; height:4px; background:#fff; transition:all 0.3s ease}
#aside .indicator ul li a span.bar:hover {width:50px; background:#f57401}
#aside .indicator ul li.on a span.bar {width:50px; background:#f57401}
/* 메인비주얼비디오 */
#mainVisual {}
#mainVisual .video {position:relative; width:100%; height:95vh; overflow:hidden; z-index:950}
#mainVisual .video:before {content:''; display:block; width:100%; height:100%; position:absolute; top:0; left:0; background:#000; opacity:0.15}
#mainVisual .video .mobileCover {display:none}
#mainVisual .video .inner {}
#mainVisual .videoTitle {position:absolute; z-index:1000; top:50%; margin-top:-101px; left:14%}
#mainVisual .videoTitle h3 {font-size:70px; font-weight:100; color:#fff; line-height:1}
#mainVisual .videoTitle p {font-size:16px; font-weight:500; color:#fff; line-height:1.55; padding-top:10px; letter-spacing:2px}
#mainVisual .videoTitle p span {font-size:28px; font-weight:700; letter-spacing:0}
#mainVisual .video .inner .mainPopup {position:absolute; top:0; left:-1000px; width:50%; height:100vh; z-index:1050; background:rgba(250,250,250,0.95); transition:all 0.4s ease}
#mainVisual .video .inner .mainPopup .popInner {padding:40px 50px; height:100%; overflow-y:auto}
#mainVisual .video .inner .mainPopup .popInner .topSection {}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox {padding-bottom:30px}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .title {padding-bottom:20px; font-family:'NanumSquare'}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .title span {font-size:23px; font-weight:700; color:#333; vertical-align:middle}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .title i {font-size:23px; vertical-align:middle; color:#f57401}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox:after {clear:both; content:''; display:block}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left {float:left; width:50%; height:260px; overflow:hidden; background:#fff; padding:50px 45px; box-shadow:0px 1px 10px rgba(0,0,0,0.22)}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left h4 {font-size:23px; font-weight:500; color:#333; line-height:1.25; padding-bottom:20px}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left h4 span {font-weight:700}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left p {font-size:15px; font-weight:500; color:#333; line-height:1.55; word-break:keep-all}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .right {float:right; width:50%; height:260px; overflow:hidden}
#mainVisual .video .inner .mainPopup .popInner .topSection .topBox .right img {display:block; width:100%; box-shadow:0px 1px 10px rgba(0,0,0,0.22)}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox {}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox:after {clear:both; content:''; display:block}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left {float:left; width:48.5%}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title {font-family:'NanumSquare'}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title span {font-size:23px; font-weight:700; color:#333; vertical-align:middle}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title i {font-size:23px; vertical-align:middle; color:#f57401}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul {padding-top:20px}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul:after {clear:both; content:''; display:block}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul > li {}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul > li .imgBox {width:100%; overflow:hidden}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul > li .imgBox img {display:block; width:100%}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul > li .descBox {background:#fff; text-align:center; padding:25px 50px}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul > li .descBox > p {font-size:14px; font-weight:500; color:#333; line-height:1.55; padding-bottom:25px}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right {float:right; width:48.5%}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .title {font-family:'NanumSquare'}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .title span {font-size:23px; font-weight:700; color:#333; vertical-align:middle}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .title i {font-size:23px; vertical-align:middle; color:#f57401}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox {padding-top:20px}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox > ul {background:#343534; padding:50px 60px}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox > ul:after {clear:both; content:''; display:block}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox > ul > li {padding-top:20px; font-size:14px; font-weight:500; color:#fff; vertical-align:middle}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox > ul > li:first-child {padding-top:0}
#mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox > ul > li i {font-size:24px; color:#f56e01; vertical-align:middle; padding-right:5px}
#mainVisual .video .inner .mainPopup .closePopup {position:absolute; top:50%; right:-27px; margin-top:-75px} 
#mainVisual .video .inner .mainPopup .closePopup > a {display:block; width:55px; height:55px; line-height:60px; background:#f57401; font-size:40px; font-weight:700; color:#fff; border-radius:50%; text-align:center; transition:all 0.3s ease}
#mainVisual .video .inner .mainPopup .closePopup > a:hover {background:#21bbb1}
#mainVisual .openPopup {position:absolute; top:50%; left:50px; margin-top:-80px; z-index:2100; opacity:1; transition:all 0.3s ease}
#mainVisual .openPopup.open {opacity:0}
#mainVisual .openPopup > a {display:block; width:55px; height:55px; line-height:58px; background:#f57401; font-size:28px; color:#fff; border-radius:50%; text-align:center; transition:all 0.3s ease} 
#mainVisual .openPopup > a:hover {background:#21bbb1} 
#mainVisual .video .down_wrap {position:absolute; bottom:50px; left:50%; margin-left:-20px; z-index:20}
#mainVisual .video .down_wrap .mouse {position:relative; width:30px; height:45px; margin:auto; border:2px solid rgba(255,255,255,0.85); border-radius:50px}
#mainVisual .video .down_wrap .mouse .wheel {
    position:absolute;
 top:15px;
 left:50%;
 width:2px;
 height:6px;
 margin-left:-1px;
 background:#fff;
 -webkit-animation-name:wheel-scroll;
 animation-name:wheel-scroll;
 -webkit-animation-iteration-count:infinite;
 -webkit-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-timing-function:ease-in-out;
 animation-timing-function:ease-in-out;
}
@keyframes wheel-scroll {
 0% {
  top:10px;
  opacity:0.4
 }
 100% {
  top:25px;
  opacity:1
 }
}
#mainVisual .video .down_wrap > span {display:inline-block; padding-top:5px; font-size:14px; font-weight:700; color:#fff}
/* 메인 롤링 이미지 */
#mainSlider {position:relative; overflow:hidden}
#mainSlider .sliderArea {position:relative; overflow:hidden}
#mainSlider .sliderArea:after {clear:both; content:''; display:block}
#mainSlider .sliderArea .slider {float:left; width:100%; height:100vh; background-size:cover !important}
#mainSlider .sliderArea .slider.slider1 {background:url(../img/main_slide01.jpg) center top no-repeat}
#mainSlider .sliderArea .slider.slider2 {background:url(../img/main_slide02.jpg) center top no-repeat}
#mainSlider .sliderArea .slider.slider3 {background:url(../img/main_slide03.jpg) center top no-repeat}
#mainSlider .sliderArea .slider .slideTxt {position:relative; top:25%; left:14%; max-width:1400px; margin:auto; z-index:10; margin-left:-5px; }
#mainSlider .sliderArea .slider .slideTxt h4 {font-size:35px; font-weight:700; color:#f57401; padding-bottom:10px}
#mainSlider .sliderArea .slider.slider2 .slideTxt h4 {color:#2b8483}
#mainSlider .sliderArea .slider .slideTxt p {font-size:18px; font-weight:500; color:#302f2d; letter-spacing:2px}
#mainSlider .sliderArea ul.slick-dots {position:absolute; top:38%; left:14%; margin:0 -5px}
#mainSlider .sliderArea ul.slick-dots:after {clear:both; content:''; display:block}
#mainSlider .sliderArea ul.slick-dots > li {float:left; padding:0 5px}
#mainSlider .sliderArea ul.slick-dots > li button {display:block; font-size:0; width:2px; height:15px; background:#888888; border:none; padding:0; transform:rotate(30deg); cursor:pointer; transition:all 0.3s ease}
#mainSlider .sliderArea ul.slick-dots > li.slick-active button {background:#f57401}
/*메인 섹션1*/
.section1 {background:#f3f3f3; padding:200px 0}
.section1 .inner {position:relative; background:#fff}
.section1 .inner:after {clear:both; content:''; display:block}
.section1 .inner .slideWrapper {position:relative}
.section1 .inner .slideWrapper button.slick-arrow {position:absolute; border:none; background:none; padding:0; margin:0; font-size:45px; font-weight:500; color:#333; cursor:pointer; z-index:750; top:50%; margin-top:-39px; transition:all 0.3s ease; opacity:0.66}
.section1 .inner .slideWrapper button.slick-arrow:hover {opacity:1}
.section1 .inner .slideWrapper button.slick-prev {left:-100px}
.section1 .inner .slideWrapper button.slick-next {right:-100px}
.section1 .inner .slideWrapper > ul.slick-dots {position:absolute; bottom:20%; left:21.5%; margin:0 -3px}
.section1 .inner .slideWrapper > ul.slick-dots:after {clear:both; content:''; display:block}
.section1 .inner .slideWrapper > ul.slick-dots > li {float:left; padding:0 3px}
.section1 .inner .slideWrapper > ul.slick-dots > li button {margin:0; padding:0; font-size:0; width:25px; height:1px; background:#e2e2e2; border:none; transition:all 0.3s ease}
.section1 .inner .slideWrapper > ul.slick-dots > li.slick-active button {background:#000}
.section1 .inner .slideWrapper:after {clear:both; content:''; display:block}
.section1 .inner .slideWrapper .slideItem {float:left}
.section1 .inner .imgWrapper {float:right; width:50%}
.section1 .inner .imgWrapper:after {clear:both; content:''; display:block}
.section1 .inner .imgWrapper .photoBox {position:relative; overflow:hidden}
.section1 .inner .imgWrapper .photoBox:after {clear:both; content:''; display:block}
.section1 .inner .imgWrapper .photoBox .roomPhoto {float:left}
.section1 .inner .imgWrapper .photoBox .roomPhoto img {display:block; width:100%}
.section1 .inner .txtWrapper {float:left; width:50%}
.section1 .inner .txtWrapper .roomInfoBox {position:relative; overflow:hidden; padding:195px 80px}
.section1 .inner .txtWrapper .roomInfoBox:after {clear:both; content:''; display:block}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo {float:left; text-align:center}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTitle h4 {font-size:35px; font-weight:700; color:#000}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTitle span {font-size:20px; font-weight:500; color:#333; letter-spacing:-1px;}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTxt {padding-top:25px}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTxt p {font-size:17px; font-weight:500; color:#555; line-height:1.55; word-break:keep-all; padding-bottom:25px}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon {width:90%; margin:0 auto; background:#f3f3f3; padding:20px 30px}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul {margin:0 -5px; overflow:hidden}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul:after {clear:both; content:''; display:block}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li {float:left; width:20%; padding:0 5px; text-align:center}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li .iconBox {}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li .iconBox i {font-size:26px; font-weight:500; color:#b1b1b1; padding-bottom:5px}
.section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li span {font-size:17px; font-weight:500; color:#727272; letter-spacing:-1px; font-family:'NanumSquare'}
/* .section1 .inner .roomBox .right {float:right; width:50%; overflow:hidden}
.section1 .inner .roomBox .right .photoBox {position:relative}
.section1 .inner .roomBox .right .photoBox:after {clear:both; content:''; display:block}
.section1 .inner .roomBox .right .photoBox .roomPhoto {float:left}
.section1 .inner:after {clear:both; content:''; display:block} */
/*메인 섹션2*/
.section2 {}
.section2 {position:relative; overflow:hidden}
.section2 .sliderArea2 {position:relative; overflow:hidden}
.section2 .sliderArea2:after {clear:both; content:''; display:block}
.section2 .sliderArea2 .slider {float:left; width:100%; height:100vh; background-size:cover !important}
.section2 .sliderArea2 .slider.slider1 {background:url(../img/section2_slide01.jpg) center top no-repeat}
.section2 .sliderArea2 .slider.slider2 {background:url(../img/section2_slide02.jpg) center top no-repeat}
.section2 .sliderArea2 .slider .slideTxt {position:relative; top:25%; left:14%; max-width:1400px; margin:auto; z-index:10; margin-left:-5px; }
.section2 .sliderArea2 .slider .slideTxt h4 {font-size:35px; font-weight:700; color:#f57401; padding-bottom:10px}
.section2 .sliderArea2 .slider .slideTxt p {font-size:18px; font-weight:500; color:#000; letter-spacing:2px}
.section2 .sliderArea2 .slider2 .slideTxt p {color:#fff}
.section2 .sliderArea2 ul.slick-dots {position:absolute; top:38%; left:14%; margin:0 -5px}
.section2 .sliderArea2 ul.slick-dots:after {clear:both; content:''; display:block}
.section2 .sliderArea2 ul.slick-dots > li {float:left; padding:0 5px}
.section2 .sliderArea2 ul.slick-dots > li button {display:block; font-size:0; width:2px; height:15px; background:#888888; border:none; padding:0; transform:rotate(30deg); cursor:pointer; transition:all 0.3s ease}
.section2 .sliderArea2 ul.slick-dots > li.slick-active button {background:#f57401}
/* section3 최근 공지사항 추출 */
.section3 {background:#f5f5f5; padding-bottom:100px}
.section3 .inner {text-align:center}
.section3 .inner h2 {padding-top:150px}
.section3 .inner h2 a {font-size:50px; border-bottom:2px solid #000; letter-spacing:10px}
.section3 .inner h3 {font-size:17px; font-weight:500; color:#555555; padding:20px 0 50px}
.section3 {background:#f0f0f0}
.section3 .postList {width:101.53%; margin:50px 0 50px -0.7575%}
.section3 .postList > li {position:relative; float:left; width:48.48%; margin:0 0.7575% 20px 0.7575%; background:#fff; box-shadow:0 2px 2px rgba(0, 0, 0, .04); transition:all .5s ease; text-align:left}
.section3 .postList > li:before {position:absolute; top:0; left:0; bottom:0; right:0; content:''; border:2px solid transparent; z-index:10; transition:all .5s ease}
.section3 .postList > li:hover {box-shadow:0 18px 20px rgba(0, 0, 0, .1)}
.section3 .postList > li:hover:before {border-color:#92bd92; z-index:980}
.section3 .postList > li a {position:relative; display:table; table-layout:fixed; width:100%; height:180px; z-index:20}
.section3 .postList > li a > div {display:table-cell; vertical-align:top}
.section3 .postList > li a .imgArea {width:30%; background-size:cover !important}
.section3 .postList > li a .imgArea img {display:block; width:100%}
.section3 .postList > li a .textArea {padding:30px}
.section3 .postList > li a .textArea h3 {font-size:24px; font-weight:normal; color:#333; margin-bottom:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.section3 .postList > li a .textArea span {display:block; font-size:14px; color:#bbb; margin-bottom:15px}
.section3 .postList > li a .textArea p {display:-webkit-box; font-size:14px; line-height:1.75; max-height:50px; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:80%; display:block; font-weight:500}
/*section4*/
.section4 {background:#fff url(../img/section4_bg.png) center top no-repeat; min-height:845px; background-size:cover}
.section4 .inner {}
#video_wrap {padding:230px 0 80px}
#video_wrap:after {clear:both; content:''; display:block}
#video_wrap .left {float:left; width:50%}
#video_wrap .left a {display:block; overflow:hidden}
#video_wrap .left a img {display:block; width:100%; transition:all 0.3s ease}
#video_wrap .left a img:hover {transform:scale(1.05)}
#video_wrap .right {float:right; width:50%; text-align:center}
#video_wrap .right h4 {font-size:40px; line-height:1; letter-spacing:5px; color:#000}
#video_wrap .right h4:after {content:''; display:block; margin:10px auto; width:30%; border:1px solid #000}
#video_wrap .right span.middle {font-size:20px; font-weight:700; letter-spacing:-1px; color:#555555}
#video_wrap .right p {font-size:17px; font-weight:700; letter-spacing:-1px; line-height:1.45; padding:15px 0 20px; color:#555555}
#video_wrap .right .tel_box {border:4px solid #e0e1e2; padding:10px 0; width:65%; margin:0 auto}
#video_wrap .right .tel_box span {font-size:25px; font-weight:700; letter-spacing:-1px; color:#484848; margin:0 20px; vertical-align:middle}
#video_wrap .right .tel_box span.ns {font-size:17px; font-weight:700; letter-spacing:-1px; color:#555555; vertical-align:-3px}
/* 비디오 */
#mask {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.8; z-index:1000; transition:all 0.3s ease}
#videolayer {display:none; position:fixed; top:50%; left:50%; width:60%; margin-left:-30%; margin-top:-200px; z-index:1010}
#videolayer.modal {}
/*섹션 공통*/
.section {}
.inner {width:100%; max-width:1400px; margin:0 auto}
.section .btn-more {text-align:center;clear:both;}
.section .btn-more a {display:inline-block; font-size:16px; color:#000; padding:10px 20px; background:#fff; transition:all 0.3s ease; box-shadow:1px 1px 10px rgba(0,0,0,0.1); margin-top:20px}
.section .btn-more a i {vertical-align:-1px}
.section .btn-more a:hover {color:#fff; background:#000}
.section .btn-more.light a {color:#fff !important; border:2px solid #fff !important}
.section .btn-more.light a:hover {color:#000 !important; background:#fff}
/*bxslider css*/
.bx-wrapper {border:0; background:none}
.bx-wrapper .bx-controls-direction a {margin-top:-25px; text-indent:0; font:inherit; font-size:0; width:45px; height:45px; background:rgba(0,0,0,0.25); line-height:45px; z-index:10; transition:all 0.3s ease; opacity:0}
.bx-wrapper:hover .bx-controls-direction a {opacity:1}
.bx-wrapper .bx-controls-direction a:hover {background:rgba(0,0,0,0.55)}
.bx-wrapper .bx-prev {left:0}
.bx-wrapper .bx-prev:before {content:'\f104'; font-family:'fontAwesome'; color:#fff; font-size:20px; text-align:center; display:block}
.bx-wrapper .bx-next {right:0}
.bx-wrapper .bx-next:before {content:'\f105'; font-family:'fontAwesome'; color:#fff; font-size:20px; text-align:center; display:block}
.bx-wrapper .bx-pager {bottom:50px}
.bx-wrapper .bx-pager.bx-default-pager a {width:20px; height:2px; background:#fff; transition:all 0.3s ease}
.bx-wrapper .bx-pager.bx-default-pager a.active {width:30px; background:#21bbb1}
/*미디어 쿼리*/
@media screen and (max-height:980px) {
    #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left {padding:20px 45px}
}
@media screen and (max-width:1440px) {
    #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left {padding:0 20px; height:220px; overflow:hidden}
    #mainVisual .video .inner .mainPopup .popInner .topSection .topBox {padding-bottom:50px}
    #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left h4 {font-size:18px; padding-top:30px}
    #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left p {font-size:13px}
    #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .right {height:220px; overflow:hidden}
    #mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox {}
    #mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox > ul {height:314px; overflow:hidden; padding:20px 25px}
    #mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul > li .descBox {padding:35px 10px}
    #mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul {height:334px; overflow:hidden}
    .section1 .inner .slideWrapper button.slick-prev {left:30px}
    .section1 .inner .slideWrapper button.slick-next {right:30px}
}
@media screen and (max-width:1366px) and (min-width:650px) {
 .bx-viewport {height:100% !important}
}
@media screen and (max-width:1366px) {
 #video_wrap .right .tel_box {width:100%}
 /* 메인비디오커버 */
 #mainVisual .video .inner .mainPopup {width:80%; left:-1240px}
 #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left {padding:45px 25px; height:261px; max-height:261px}
 #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left h4 {font-size:17px}
 #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .left p {font-size:11px}
 #mainVisual .video .inner .mainPopup .popInner .topSection .topBox .right {max-height:261px; height:261px}
 #mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox > ul {padding:32px 60px}
 #mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul > li .descBox > p {font-size:11px}
 #mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .right .descBox > ul > li {font-size:11px}
 #mainVisual .video .inner .mainPopup .popInner .topSection .bottomBox .left .title > ul > li .imgBox {max-height:164px}
 /*header*/
 #header .inner {padding:0 50px}
 /*main slide*/
 .bx-wrapper {box-shadow:none}
 /*section1*/
 .section1 {padding:80px 120px}
 .section1 .inner .txtWrapper .roomInfoBox {padding:125px 60px}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTitle h4 {font-size:25px}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTitle span {font-size:17px}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTxt p {font-size:14px}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon {width:100%}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li span {font-size:14px}
 .section1 .inner .slideWrapper button.slick-next {right:-50px}
 .section1 .inner .slideWrapper button.slick-prev {left:-50px}
 
 /*section2*/
 .section2 .postSlider .innerWrap .txtWrap {float:none; width:80%; margin:0 auto; padding:20px 0 40px}
 .section2 .postSlider .innerWrap .txtWrap ul li h2.tit.left a {font-size:20px}
 .section2 .postSlider .innerWrap .txtWrap ul li h3 {font-size:16px; padding:10px 0 20px}
 .section2 .postSlider .innerWrap .txtWrap ul li p {font-size:12px; padding:0 0 10px}
 .section2 .postSlider .innerWrap .txtWrap .box_info ul li {width:80px; height:80px; line-height:80px; margin: 5px}
 .section2 .postSlider .innerWrap .imgWrap {float:none; margin:0 auto; padding:20px 0 0}
 .section2 .postSlider .innerWrap .imgWrap ul li {padding:60px}
 .section2 .postSlider .innerWrap .imgWrap ul li a {display:inline-block; width:100%; margin:0 auto}
 /*section3*/
 .section3 .inner h2 {padding-top:100px}
 .section3 .inner h2 a {font-size:20px}
 .section3 .postList {width:100%; margin:25px auto}
 .section3 .postList > li {display:inline-block; float:none; width:48%; margin:10px 5px 0}
 .section3 .postList > li a .textArea h3 {font-size:20px; padding:10px 0 30px}
 .section3 .postList > li a .textArea span {font-size:12px; margin-bottom:10px}
 .section3 .postList > li a .textArea p {font-size:12px}
 /*video wrap*/
 #video_wrap {padding:80px 0 40px}
 #video_wrap .left {float:none; margin:0 auto}
 #video_wrap .right {float:none; margin:40px auto 0}
 #video_wrap .right h4 {font-size:20px}
 #video_wrap .right span.middle {font-size:17px}
 #video_wrap .right p {font-size:17px; padding:10px 0 15px}
 #video_wrap .right .tel_box span {font-size:20px}
 #video_wrap .right .tel_box span.ns {font-size:15px}
 /*footer*/
 #footer .inner ul {padding:30px 50px}
}
@media screen and (max-width:1280px) {
 /*header*/
 #header {}
 #mainVisual .openPopup {display:none}
 #mainVisual .video .inner .mainPopup {display:none}
 .section1 .inner .txtWrapper {padding:0 40px}
 .section1 .inner .txtWrapper .roomInfoBox {padding:0; padding-top:70px}
 .section1 .inner .slideWrapper > ul.slick-dots {bottom:8%; left:20%}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon {padding:20px 20px}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li span {font-size:12px}
}
@media screen and (max-width:1024px) {
 /* 인디케이터 */
 #aside {display:none}
 #mainVisual .video .down_wrap {display:none}
 /*header*/
 #header {background:transparent; border-bottom:0}
 #header.scroll {background:#fff; border-bottom:0}
 #header .inner .login {float:none; width:auto; display:block; padding-top:50px}
 #header .inner .login > ul {padding:0}
 #header #gnb {float:none}
 #header #gnb li {float:none; display:block}
 #header .inner {position:fixed; top:0; right:-260px; width:260px; height:100%; background:#fff; padding:0 30px; z-index:1000; transition:all 0.3s ease}
 #header .inner.open {right:0}
 #header #gnbOpen {display:none; position:absolute; top:25px; right:50px; width:40px; height:40px; border:none; background:transparent; cursor:pointer; outline:none; transition:all 0.3s ease; z-index:1010}
 #header #gnbOpen span {position:absolute; display:block; width:24px; height:2px; background:#21bbb1; left:50%; margin-left:-12px; transition:all 0.3s ease}
 #header #gnbOpen span.bar1 {top:12px}
 #header #gnbOpen span.bar2 {top:18px}
 #header #gnbOpen span.bar3 {top:24px}
 #header #gnbClose {display:block; position:fixed; top:0; right:0; width:60px; height:60px; border:none; background:#000; cursor:pointer; outline:none; transition:all 0.3s ease; z-index:1000}
 #header #gnbClose span {position:absolute; display:block; width:24px; height:2px; background:#fff; left:50%; margin-left:-12px; transition:all 0.3s ease}
 #header #gnbClose span.bar1 {top:17px; transform:rotate(0)}
 #header #gnbClose span.bar2 {top:27px; transform:rotate(0)}
 #header #gnbClose span.bar3 {top:37px; transform:rotate(0)}
 #header #gnbClose.open span.bar1 {transform:rotate(45deg); top:30px}
 #header #gnbClose.open span.bar2 {left:-10px; opacity:0}
 #header #gnbClose.open span.bar3 {transform:rotate(-45deg); top:30px}
 #header #nav_mask.open {position:fixed; top:0; left:0; z-index:990; width:100%; height:100%; background:rgba(0,0,0,0.55)}
 #mainVisual .videoTitle {width:100%; left:0; text-align:center}
 #mainVisual .video video.onlyPc {display:none}
 #mainVisual .video .mobileCover {display:block; width:100%; height:100%; background:url(../img/videoCover.jpg) center top no-repeat; background-size:cover}
 /* section1 */
 .section1 {padding:80px 55px}
 .section1 .inner .slideWrapper > ul.slick-dots {bottom:15%; left:20%}
 .section1 .inner .txtWrapper .roomInfoBox {padding:60px 30px}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTxt p {padding-bottom:15px}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li span {font-size:11px}
 #mainSlider .sliderArea .slider {height:70vh}
 #mainSlider .sliderArea ul.slick-dots {top:50%; margin-top:-10px}
 .section2 .sliderArea2 .slider {height:70vh}
 .section2 .sliderArea2 ul.slick-dots {top:50%; margin-top:-10px}
}
@media screen and (max-width:980px) {
 
 /*section1*/
 .section1 {padding-top:80px}
 .section1 .inner .imgWrapper {float:none; width:100%}
 .section1 .inner .txtWrapper {float:none; width:100%}
 .section1 .inner .imgWrapper .photoBox .roomPhoto {float:none}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo {float:none}
 .section2 .postSlider .innerWrap .imgWrap ul li {padding:0}
 .bx-wrapper {height:auto !important}
 /*section3*/
 .section3 .postList > li {float:none; width:90%; margin:10px auto 0}
}
@media screen and (max-width:812px) {
#mainSlider .sliderArea ul.slick-dots {top:60%}    
.section2 .sliderArea2 ul.slick-dots {top:60%}
}
@media screen and (max-width:768px) {
.slick-dots {display:none !important}
 #mainSlider .sliderArea ul.slick-dots {top:38%}    
 .section2 .sliderArea2 ul.slick-dots {top:38%}
 #mainVisual .video {height:60vh}
 #mainVisual .videoTitle h3 {font-size:40px}
 #mainVisual .videoTitle p span {font-size:20px}
 .section1 {padding-top:80px}
 .section1 .inner .slideWrapper button {width:40px; height:40px; line-height:42px; text-align:center; color:#fff !important; font-size:22px !important; background:#333 !important}
 .section1 .inner .slideWrapper button.slick-prev {left:0}
 .section1 .inner .slideWrapper button.slick-next {right:0}
 .section1 .inner .imgWrapper {float:none; width:100%}
 .section1 .inner .txtWrapper {float:none; width:100%}
 .section1 .inner .imgWrapper .photoBox .roomPhoto {float:none}
 .section1 .inner .txtWrapper .roomInfoBox .roomInfo {float:none}
 .section2 .postSlider .innerWrap .imgWrap ul li {padding:0}
}
@media screen and (max-width:640px) {
 
 .section1 .inner .box {width:76%; margin-bottom:30px}
 .section1 .inner .box a .img_area {max-height:300px}
 .section1 .inner .box a .desc h4 {padding:10px 0 0}
 .section1 .inner .box a .desc h5 {padding:20px 0}
 .section2 .postSlider .innerWrap .imgWrap {width:80%; position:relative}
 .section2 .postSlider .innerWrap .txtWrap {width:80%}
 .section2 .postSlider .innerWrap .imgWrap a.control {width:50px; height:50px; line-height:50px}
 .section2 .postSlider .innerWrap .txtWrap .box_info ul li {width:100px; height:100px; line-height:100px; margin:3px 1px}
 .section2 .postSlider .innerWrap .imgWrap a.control i {font-size:25px; line-height:50px}
 /*하단 동영상*/
 #video_wrap .right {width:100%}
 #video_wrap .right span.middle {font-size:11px}
 #video_wrap .right p {font-size:11px}
 #video_wrap .right .tel_box {width:85%}
}
/* 저해상도 및 모바일 사이즈 */
@media screen and (max-width:580px) {
    #mainVisual .video {height:100vh}
    #mainSlider .sliderArea .slider {height:35vh}
    #mainSlider .sliderArea ul.slick-dots {top:60%}
    #mainSlider .sliderArea .slider .slideTxt h4 {font-size:20px}
    #mainSlider .sliderArea .slider .slideTxt p {font-size:15px; line-height:1.55}
    .section1 {padding:50px 20px}
    .section1 .inner .txtWrapper {padding:0}
    .section1 .inner .txtWrapper .roomInfoBox {padding:40px 25px}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTitle h4 {font-size:20px; padding-bottom:10px}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTitle span {font-size:14px}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTxt p {font-size:13px; word-break:keep-all; line-height:1.55}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoTxt p > br {display:none}
    
    .section2 .sliderArea2 .slider {height:35vh}
    .section2 .sliderArea2 ul.slick-dots {top:60%}
    .section2 .sliderArea2 .slider .slideTxt h4 {font-size:20px}
    .section2 .sliderArea2 .slider .slideTxt p {font-size:15px; line-height:1.55}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul:after {clear:both; content:''; display:block}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li {float:none; width:100%; padding-top:10px}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li:after {clear:both; content:''; display:block}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li .iconBox {float:left; width:50%}
    .section1 .inner .txtWrapper .roomInfoBox .roomInfo .infoIcon > ul > li:first-child {padding-top:0}
}