@charset "utf-8";

/* 
 * content CSS Document
 * KOWEB
 */

#content {position: relative; padding: 150rem 0; }

/* button */
.button {background:#41464e;border-color: #25282d;}
.button:before,
.button:hover:before,
.button:focus:before {background:#fff;}
.button span {color: #fff;}
.button:hover span,
.button:focus span {color: #222 !important;}
.bbsView .button {font-size: 0.85em;}

.button.white:hover,
.button.white:focus{color:#222 !important;}
.button.white:before{display:none;}

.area_subVisual {height: 500rem; background: url(/images/content/sub_visual.jpg) no-repeat center / cover;}
.area_subVisual .wrapper {display: flex; height:100%; flex-wrap: wrap; align-items: flex-end;}
.area_subVisual .sv_text {color: #fff; padding-bottom: 120rem;}
.area_subVisual .sv_text h2 {font-family: 'Jalnan', NanumSquareNeo, '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif; font-size: 60rem; text-transform: uppercase;}
.area_subVisual .sv_text p {font-size: 19rem; font-weight: 700; margin-top: 10rem;}
.area_lnb {position:absolute; right:-150rem; bottom:0; display: flex; flex-wrap: wrap; align-content: flex-end; width: 50%; height: 100%; padding: 0 150rem; text-align: center; background: url(/images/content/lnb_bg.png) no-repeat bottom center / contain;}
.area_lnb::before {position:absolute; right:60rem; bottom: 30%; content:''; width: 85rem; height:100rem; background: url(/images/content/lnb_star.png) no-repeat center / contain; animation: upDown 2s linear 0s infinite alternate;}
.area_lnb::after {position:absolute; right: 35%; bottom: 21%; content:''; width: 66rem; height:67rem; background: url(/images/main/deco_flower.png) no-repeat center / contain;}
.area_lnb .wrapper {align-content: flex-end;}
.area_lnb h3 {flex-basis: 100%; margin-bottom: 15rem; text-transform: uppercase; font-family: 'Jalnan', NanumSquareNeo, '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif; font-size: 26rem; color: #ddd;}
.area_lnb ul {display: flex; justify-content: center; width: 100%;}
.area_lnb ul li {display: inline-block; position: relative;}
.area_lnb ul li a {position: relative; display: inline-block; padding: 8rem 20rem 6rem; font-size: 18rem; font-weight: 600; color: #444;}
.area_lnb ul li.active a {font-size: 17rem; color: #fff;} 
.area_lnb ul li.active::before {position:absolute; left:0; top:0; content:''; width: 100%; height:100%; border-radius: 50rem; background-color: #f24c60;}

/* ready */
.ready section {padding: 60rem 0; text-align: center;}
.ready i {display: flex; justify-content: center; align-items: center; margin: 0 auto 40rem; width: 100rem; height: 100rem; background: #f9e2e4; border-radius: 100%;}
.ready i img {width: 70rem;}
.ready h3 {margin-bottom: 17rem; font-size: 42rem; color: #111;}
.ready p {line-height: 1.8;}

/* 공통 */
.sub_tit,
.sub_tit2 {margin-bottom: 30rem; font-size: 42rem; font-family: 'Jalnan', NanumSquareNeo, '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif; color: #111;}
.txt_point {color: #f24c60;}
.sub_section {position: relative;}
.button {font-size: 15rem;}
.button.pink {min-width: 180rem; height: 60rem; font-weight: 600; line-height: 60rem; border: none; border-radius: 60rem; background: #f24c60; transition: .3s;}
.button.pink span {color: #fff;}
.button.pink:before {opacity: 0; visibility: hidden; width: 100%; height: 100%; border-radius: 60rem; border: 1px solid #f24c60; background: none; transform: none; box-sizing: border-box; transition: .3s;}
.button.pink:hover,
.button.pink:focus {box-shadow: none; background-color: #fff;}
.button.pink:hover span,
.button.pink:focus span {color: #f24c60 !important; }
.button.pink:hover::before,
.button.pink:focus::before {opacity: 1; visibility: visible;}

/* about01 */
.about01 #content {text-align: center; background: #f0f9fa;}
.about01 #content::before {position:absolute; left:0; bottom:0; content:''; width:500rem; height: 210rem; background: url(/images/content/about01_obj.png) no-repeat center / contain;}
.about01 #content::after {position:absolute; right:0; bottom:0; content:''; width:345rem; height: 370rem; background: url(/images/content/about01_obj2.svg) no-repeat center / contain;}
.about01 .ss01::before {position:absolute; left:-50rem; top:-50rem; content:''; width:375rem; height: 136rem; background: url(/images/content/about01_cloud.svg) no-repeat center / contain; animation: upDown 2s linear 0s infinite alternate;}
.about01 .ss01::after {position:absolute; right:60rem; top: 75rem; content:''; width:216rem; height: 90rem; background: url(/images/content/about01_cloud2.svg) no-repeat center / contain; animation: upDown 2s linear 0s infinite alternate;}
.about01 .aboutSlider {position: relative; margin: 82rem 0; overflow: inherit;}
.about01 .slick-list {margin: 0 -10rem;}
.about01 .slider {height: 300rem; margin: 0 10rem; border-radius: 40rem; background-repeat: no-repeat; background-size: cover;}
.about01 .slick-arrow {position: absolute; top:50%; display: block; width: 50rem; height: 50rem; font-size: 0; border-radius: 100%; background: #fff; border: 1px  solid #eee; box-shadow: 3rem 0 10rem rgba(0, 0, 0, .05); transform: translate(0, -50%); z-index: 5;}
.about01 .slick-arrow::after {position:absolute; left:50%; top:50%; content:''; width: 14rem; height: 14rem; background: url(/images/main/slider_arrow.svg) no-repeat center / contain; transform: translate(-50%, -50%); opacity: .3;}
.about01 .slick-prev {left:0; margin-left: -25rem;}
.about01 .slick-prev::after {transform:translate(-50%, -50%) scaleX(-1);}
.about01 .slick-next {right:0; margin-right: -25rem;}
.about01 p {line-height: 2;}
.about01 p + p {margin-top: 25rem;}
.about01 p strong {font-weight: 800;}

/* about02 */
.about02 ul {counter-reset:list-number; margin-top: 40rem;}
.about02 ul li {position: relative; padding: 25rem 0 25rem 35rem; counter-increment:list-number; border-bottom: 1px solid #eee;}
.about02 ul li::before {position:absolute; left:0; top: 25rem; content:counter(list-number); width: 22rem; height: 22rem; text-align: center; line-height: 22rem; font-size: 10rem; font-weight:800; color: #fff; border-radius: 100%; background-color: #999;}
.about02 ul li:first-child {padding-top: 0;}
.about02 ul li:first-child::before {top: 0;}
.about02 ul li:last-child {border-bottom: none;}
.about02 ul li span {display: block; margin-top: 7rem; font-size: 15rem; color: #888; font-weight: 400;}
.about02 .notice {position: relative; margin-top: 10rem; font-size: 15rem; font-weight: 600; color: #f24c60;}

/* area_room */
.area_room {text-align: center;}
.area_room .sub_tit {margin-bottom: 20rem;}
.area_room #content > p {line-height: 1.8;}
.area_room .roomSlider {position: relative; margin: 80rem 0;}
.area_room .slick-arrow-wrap {position: absolute; left: 50%; top: 0; height: 100%; transform:translate(-50%, 0);}

.area_room .slick-arrow {position: absolute; top: 50%; width:110rem; height: 110rem; font-size: 0; line-height: 0; border-radius: 150rem; background: #fff;}
.area_room .slick-arrow::after {position:absolute; left: 50%; top: 50%; content: ''; width: 12rem; height: 22rem; transform: translate(-50%, -50%); background: url(/images/main/slider_arrow.svg) no-repeat center / contain; opacity: .3;}
.area_room .slick-prev {left: -20rem; transform: translate(-50%, -50%);}
.area_room .slick-prev::after {transform: translate(-50%, -50%) scaleX(-1);}
.area_room .slick-next {left: auto; right: -20rem; transform: translate(50%, -50%);}

/* .area_room .slick-arrow {position: absolute; top: 50%; width: 55rem; height: 115rem; font-size: 0; line-height: 0;  background: #fff; transform: translate(0, -50%);}
.area_room .slick-arrow::after {position:absolute; top: 50%; content: ''; width: 12rem; height: 22rem; transform: translate(0, -50%); background: url(/images/main/slider_arrow.svg) no-repeat center / contain; opacity: .3;}
.area_room .slick-prev {left: 0; border-radius: 0 130rem 130rem 0;}
.area_room .slick-prev::after {left:10rem; transform: translate(0, -50%) scaleX(-1);}
.area_room .slick-next {right: 0; border-radius: 130rem 0 0 130rem;}
.area_room .slick-next::after {right:10rem;} */

.area_room .roomSlider .slider-track {display: flex; justify-content: center;}
.area_room .roomSlider .slick-slide {margin: 0 20rem; border-radius: 60rem; overflow: hidden; opacity: .25; transition: 1.7s;}
.area_room .roomSlider .slick-slide.slick-active {opacity: 1;}
.area_room .roomSlider .slick-slide img {max-width: 100%;}
.area_room .roomSlider .slick-dots {position: absolute; left: 50%; bottom:30rem; display: flex; justify-content: center; transform: translate(-50%, 0); z-index: 5;}
.area_room .roomSlider .slick-dots li {margin: 0 5rem;}
.area_room .roomSlider .slick-dots li button {display: block; width: 10rem; height:10rem; font-size: 0; border-radius: 100%; background: #fff;}
.area_room .roomSlider .slick-dots .slick-active button {background: #000;}
.area_room .room_info > div {display: grid; grid-template-columns: 440rem auto; padding: 55rem 0; border-bottom: 1px solid #e1e1e1;}
.area_room .room_info > div:first-child {padding-top: 0;}
.area_room .room_info > div h4 {padding: 25rem 70rem; text-align: left; font-size: 26rem; color: #111; box-sizing: border-box;}
.area_room .room_info > div ul {display: flex; flex-wrap: wrap; color: #666;}
.area_room .room_info > div ul li {margin: 25rem 70rem; margin-left: 0 !important;}
.area_room .room_info > div ul li:last-child {margin-right: 0 !important;}
.area_room .room_info > div ul li i {display: block; width: 65rem; height: 46rem; margin: 0 auto 15rem;}
.area_room .room_info > div ul li i img {display: inline-block; max-height: 100%;}
.area_room .room_info > div ul li span {display: block; font-size: 15rem;}
.area_room .room_info > div ul li strong {display: block; margin-bottom: 3rem; font-weight: 800; color: #444;}
.area_room .button {margin-top: 60rem;}

/*location */
.location .sub_tit.mobile {display: none;}
.location #content > section {display: grid; grid-template-columns: repeat(2, 1fr);}
.location .map_info .box h4 {display: flex; align-items: center; margin-bottom: 10rem; font-size: 19rem; font-weight: 800; color: #111;}
.location .map_info .box h4 i {display: block; width: 20rem; height: 20rem;margin-top: -2rem; margin-right: 10rem; text-align: center;}
.location .map_info .box h4 i img {max-height: 100%;}
.location .map_info .address {padding: 30rem 35rem; border-radius: 20rem; box-sizing: border-box; background: #f5f5f5;}
.location .map_info .parking {margin-top: 50rem;}
.location .map_info .parking h4 {padding: 0 35rem;}
.location .map_info .parking h4 i {border-radius: 100%; padding: 5rem 0; background: #f24c60; box-sizing: border-box;}
.location .map_info .parking h4 i img {margin-left: 2rem;}
.location .map_info .parking li {padding: 30rem 35rem; border-bottom: 1px solid #ddd;}
.location .map_info .parking li:first-child {padding-top: 20rem;}
.location .map_info .parking li:last-child {border-bottom: none;}
.location .map_info .parking li p {position:relative; padding-left: 32rem;}
.location .map_info .parking li p em {position: absolute; left:0; top: 5rem; padding-bottom: 4rem; font-size: 12rem; font-weight: 1000; color: #111; line-height: 1;}
.location .map_info .parking li p em::after {position: absolute; left:0; bottom:0; content:''; width:100%; height:2rem; background: #111;}
.location .map_info .parking li strong {display: block; margin-bottom: 5rem;}
.location #map {padding-left: 100rem; box-sizing: border-box;}
.location #map > div {width: 100%; height: 100%; border-radius: 60rem; overflow: hidden;}
.location .root_daum_roughmap_landing {width: 100%; height:100%;}
.location .root_daum_roughmap .wrap_map {height: 100%;}
.location .hide,
.location .map_border {display: none;}

/* 개인정보처리방침 */
.area_privacy .sub_tit {text-align: center;}
.inr_policy {padding: 50rem 0; font-size: 15rem; border-bottom: 1px solid #ddd;}
.inr_policy:last-child {border-bottom: none;}
.inr_policy h3 {margin-bottom:18rem; font-weight: 800; font-size:17rem; color:#111;}
.inr_policy p{margin-bottom:8rem;}
.inr_policy ul li{margin-bottom:8rem;}
.inr_policy ul li:last-child{margin:0;}
.inr_policy ul li ul{margin-top:5rem; margin-bottom:20rem;}
.inr_policy ul li ul li{margin-bottom:2rem;}
.inr_policy .inr_policy{padding:40rem 0; border-bottom:1px solid #ddd;}
.inr_policy .inr_policy:last-child{border:none;}
.area_privacy.email {text-align: center;}
.area_privacy.email .inr_policy {border-bottom: none; padding-top: 20rem;}
.area_privacy.email i {display: block; font-size: 15rem;}
.area_privacy.email strong {display: block; line-height: 1.8; font-size: 19rem; margin-top: 20rem; color: #111;}

/* resrvation */
.area_roomReserved {padding: 0;}
.area_roomReserved > form {position:sticky; top: 0; background-color: #fff; z-index: 1;}
.area_roomCheckIN button[type="button"] {font-size: 14rem; font-family: NanumSquareNeo, '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif;}
.area_roomCheckIN ul {flex-wrap: wrap;}
.area_roomCheckIN ul li {margin-right: 20rem;}
.area_roomCheckIN ul li + li {margin-left: 0;}
.area_roomCheckIN ul li label {font-size: 15rem;}
.area_roomCheckIN ul li input {width: 225rem;}
.area_roomCheckIN ul li input#room {padding-left: 10px;}
.area_calendar .control {margin-top: 15px;}
.area_calendar .calendar table td > a,
.area_calendar.type02 .calendar table td > div {padding: 35px 10px 5px;}
a.for_wating.apply_btn {font-size: 12rem;}
.box_color span.reser_standby {display: none;}
.area_calendar .calendar table td em {font-size: 14rem; font-weight: 600;}

/* rerservation02 */
.rerservation02 .sub_tit {margin-bottom: 20rem;}
.rerservation02 .sub_tit + p {line-height: 1.8;}
.rerservation02 .icon_list {display: flex; margin-top: 30rem;}
.rerservation02 .icon_list li {display: inline-block; margin-right: 10rem;}
.rerservation02 .icon_list li a {display: flex; justify-content: center; align-items: center; width: 95rem; height: 95rem; padding: 20rem; border-radius: 100%; background-color: #f5f5f5; box-sizing: border-box; transition: .3s;}
.rerservation02 .icon_list li a:hover {background: #f0f0f0; box-shadow: 3rem 3rem 10rem rgba(0, 0, 0, 0.06) inset;}
.rerservation02 .icon_list li a img {max-width: 100%;}
.rerservation02 .icon_list li a.rers_home img {width: 25rem; opacity: .5;}
.rerservation02 .ss01 {margin: 80rem 0 0;}
.rerservation02 .ss01 h4 {margin-bottom: 20rem; font-size: 26rem; color: #000;}
.rerservation02 .ss01 .process {display: grid; gap: 0 100rem; grid-template-columns: repeat(4, 1fr);}
.rerservation02 .ss01 .process .box {position: relative; min-width: 180rem; padding: 50rem 30rem 40rem; text-align: center; color: #000; border-radius: 20rem; border: 1px solid #ddd;}
.rerservation02 .ss01 .process .box i {display: block; width: 50rem; height: 50rem; margin: 0 auto 20rem;}
.rerservation02 .ss01 .process .box span {display: block; margin-top: 5rem; font-size: 15rem; color: #666;}
.rerservation02 .ss01 .process ul {display: flex;}
.rerservation02 .ss01 .process ul li {margin: 0 10rem;}
.rerservation02 .ss01 .process .box:after {position:absolute; right:0; top:50%; content:''; width:100rem; height:50rem; background: url(/images/content/notice_arrow.svg) no-repeat center; background-size: 40rem; opacity: .1; transform: translate(100%, -50%);}
.rerservation02 .ss01 .process .box:last-child::After {display: none;}

/* board_event */
.board_event .photoList > li .img {border-radius: 20rem; background-repeat: no-repeat !important; background-size: cover !important; background-position: center !important;}
.board_event .photoList .state em {display: inline-block; width: auto; height: auto; padding: 12rem 20rem; margin: 15rem; font-size: 14rem; border-radius: 100rem;}
.board_event .photoList .state em[data-state="ing"] {background-color: #f24c60;}
.board_event .photoList .state em[data-state="after"] {color: #c1c1c1; background-color: #111;}
.board_event .photoList .state em[data-state="standby"] {background-color: #0bb0b5;}
.board_event .photoList .date {display: block; padding: 10rem 20rem; border-radius: 50rem; background: #f5f5f5 !important;}
.board_event .photoList .date span {position: relative; display: inline-block; padding-left: 23rem; font-size: 14rem; font-family: 'Jalnan', NanumSquareNeo, '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif; line-height: 1; background: url(/images/common/icon_time.svg) no-repeat left center / 15rem !important;}
.board_event .photoList > li a > em {padding: 27rem 20rem 20rem;}

/* bbsList */
.bbsSearch form {border-radius: 20rem;}
ul.bbsList li .date i {font-weight: 1000;}
.bbsControls {font-size: 16rem;}
.bbsNew_container.v2 .bbsTitle {font-family: 'Jalnan', NanumSquareNeo, Sans-serif;}
ul.bbsList li {padding: 25rem 10rem;}

@media all and (max-width:1440px){
   .area_room .roomSlider {width:1400rem; max-width: 92%; margin: 80rem auto; overflow: hidden;}
   .area_room .roomSlider .slick-list {border-radius: 60rem;}
   .area_room .roomSlider .slick-slide {margin: 0; border-radius: 0; opacity: 1; transition: none;}
   .area_room .slick-arrow-wrap {width: 100%; left: 0; max-width: none; transform: none;}

   .area_room .slick-arrow {width: 55rem; height: 115rem; transform: translate(0, -50%);}
   .area_room .slick-arrow::after {transform: translate(0, -50%);}
   .area_room .slick-prev {left: 0; border-radius: 0 130rem 130rem 0;}
   .area_room .slick-prev::after {left:10rem; transform: translate(0, -50%) scaleX(-1);}
   .area_room .slick-next {right: 0; border-radius: 130rem 0 0 130rem;}
   .area_room .slick-next::after {left: auto; right:10rem;}
   }

 @media all and (max-width:1024px){
   .area_subVisual {height: auto;}
   .area_subVisual .wrapper {max-width: 100%;}
   .area_subVisual .sv_text {max-width: 92%; margin: 220rem auto 0; flex-basis: 100%; padding-bottom: 65rem;}
   .area_subVisual .sv_text h2 {font-size: 52rem;}
   .area_lnb {position: relative; right: auto; bottom: auto; width: 100%; height: auto; padding: 0; background: #fff !important; border-bottom: 1px solid #efefef;}
   .area_lnb .wrapper {max-width: 92%; align-items: center;}
   .area_lnb h3 { flex-basis: auto; font-size: 21rem; padding: 20rem 40rem 20rem 0; margin-bottom: 0; line-height: 2; border-right: 1px solid #efefef;}
   .area_lnb ul {width: auto; padding-left: 30rem;}
   .area_lnb ul li a {padding: 8rem 25rem 6rem;}
   .area_lnb::before {right: 5%; top: -160%; bottom: auto; width: 50rem; height: 60rem;}
   .area_lnb::after {right: 10%; bottom: 82rem; width: 130rem; height: 112rem; background: url(/images/content/lnb_character.png) no-repeat center / contain;}
   #content {padding: 100rem 0;}
   .sub_tit,
   .sub_tit2 {font-size: 35rem;}

   /* ready */
   .ready section {padding: 30rem 0 50rem;}
   .ready i {width: 85rem; height: 85rem; margin-bottom: 30rem;}
   .ready i img {width: 60rem; max-width: 100%;}
   .ready h3 {margin-bottom: 12rem; font-size: 32rem;}

    /* about01 */
   .about01 .sub_tit {z-index: 3;}
   .about01 p {position: relative; z-index: 1;}
   .about01 #content::before {width: 380rem; height: 160rem;}
   .about01 #content::after {width: 260rem; height: 295rem; opacity: .2;}
   .about01 .ss01::before {width: 250rem; height: 125rem; top: -13rem;}
   .about01 .ss01::after {right: 0; top: 100rem; width: 150rem; height: 70rem;}

   /* about02 */
   .about02 ul li {padding-left: 32rem;}
   .about02 ul li::before {top: 26rem; width: 20rem; height: 20rem; line-height: 22rem;}

   /* area_room */
   .area_room .roomSlider {margin: 50rem auto;}
   .area_room .roomSlider .slick-list {border-radius: 40rem;}
   .area_room .slick-arrow {width: 50rem; height: 95rem;}
   .area_room .slick-arrow::after {width: 10rem; height: 20rem;}
   .area_room .slick-next::before {left: 5rem;}
   .area_room .slick-next::after {right: 5rem;}
   .area_room .room_info > div {grid-template-columns: 1fr;}
   .area_room .room_info > div:first-child {padding-top: 15rem;}
   .area_room .room_info > div h4 {padding: 0; margin-bottom: 10rem; font-size: 22rem;}

   /*location */
   .location .sub_tit.mobile {display: block;}
   .location #content > section {display: flex; flex-wrap: wrap; flex-direction:column-reverse;}
   .location #map {padding-left: 0; margin: 20rem 0 30rem;}
   .location #map > div {height: 500rem; border-radius: 40rem;}
   .location .map_info .sub_tit {display: none;}
   .location .map_info .address {border-radius: 40rem;}
   .location .map_info .parking {margin-top: 40rem;}

   /* reservation */
  .area_roomCheckIN {align-items: stretch;}
   .area_roomCheckIN ul li {margin:5rem 40rem 5rem 0;}
   .area_roomCheckIN ul li label {min-width: 60rem;}
   .area_roomCheckIN ul li input {width: 250rem;}
   .area_roomCheckIN button[type="button"] {width: 150rem; height: auto;}

   /* reservation02 */
   .rerservation02 .ss01 .process {display: grid; gap: 0 80rem; grid-template-columns: repeat(4, 1fr);}
   .rerservation02 .ss01 .process .box {min-width: auto; padding: 40rem 20rem; box-sizing: border-box;}
   .rerservation02 .ss01 .process .box.mobile {display: block;}
   .rerservation02 .ss01 .process ul {display: none;}
   .rerservation02 .ss01 .process .box:after {position:absolute; right:0; top: 50%; content:''; width: 80rem; height: 100%; margin:0 !important; background: url(/images/content/notice_arrow.svg) no-repeat center; background-size: 40rem; transform: translate(100%, -50%); opacity:.1}
   .rerservation02 .ss01 .process .box.bx_last:after {display: none;}

   /* area_privacy */
   .area_privacy .sub_tit + .inr_policy {padding-top: 20rem;}
   .inr_policy {line-height: 1.8;}
   .inr_policy ul li {margin-bottom: 12rem;}

   /* board_event */
   .board_event .photoList .state em {font-size: 12rem; padding: 10rem 15rem; margin: 12rem;}
}

@media all and (max-width:860px){
   .area_subVisual .sv_text {margin: 190rem auto 0;}
   .area_subVisual .sv_text h2 {font-size: 45rem;}
   .area_subVisual .sv_text p {font-size: 17rem;}
   .area_lnb {padding: 13rem;}
   .area_lnb {overflow-x: scroll;}
   .area_lnb::-webkit-scrollbar {height: 3rem; border-radius: 3rem;}
   .area_lnb::-webkit-scrollbar-thumb {background: #a9a9a9;} 
   .area_lnb::before,
   .area_lnb::after {display: none;}
   .area_lnb .wrapper {display: block; max-width: 100%; text-align:left;}
   .area_lnb h3 {display: none;}
   .area_lnb ul {justify-content: flex-start; padding: 0;}
   .sub_tit,
   .sub_tit2 {font-size: 32rem;}

   /* about01 */
   .about01 .slider {height: 370rem; border-radius: 30rem;}
   .about01 .aboutSlider {margin: 50rem 0;}
   .about01 .slick-dots {position:absolute; bottom: 20rem; display: flex; justify-content: center; width: 100%;}
   .about01 .slick-dots li {margin: 0 5rem;}
   .about01 .slick-dots button {display: block; font-size: 0; width: 8rem; height: 8rem; border-radius: 100%; background-color: #fff;}
   .about01 .slick-dots .slick-active button {background-color: #000;}
   .about01 #content::after {width: 182rem; height: 200rem;}
   .about01 #content::before {width: 275rem; height: 120rem;}
   .about01 .ss01::before {width: 200rem; height: 65rem; top: -145rem;}
   .about01 .ss01::after {top: -13rem; width: 115rem; height: 65rem;}

   /* about02 */
   .about02 ul li::before {line-height: 20rem;}

   /* area_room */
   .area_room .roomSlider .slick-list {border-radius: 30rem;}
   .area_room .slick-arrow {width: 40rem; height: 80rem;}
   .area_room .room_info > div h4 {margin-bottom: 15rem;}
   .area_room .room_info > div ul li {margin: 15rem 50rem;}
   .area_room .roomSlider .slick-dots li button {width: 8rem; height: 8rem;}

   /*location */
   .location #map {margin: 0 0 20rem;}
   .location #map > div {height: 400rem; border-radius: 20rem;}
   .location .map_info .address {padding: 30rem; border-radius: 20rem;}
   .location .map_info .parking {margin-top: 40rem;}
   .location .map_info .parking h4 {padding:0 30rem;}
   .location .map_info .parking li {padding: 30rem;}

   /* reservation */
  .area_roomCheckIN {flex-wrap: wrap;}
   .area_roomCheckIN ul {flex-basis: 100%; display: grid; gap: 10rem 30rem; grid-template-columns: repeat(2, 1fr);}
   .area_roomCheckIN ul li {margin: 0;}
   .area_roomCheckIN ul li label {min-width: auto; flex-basis: 22%;}
   .area_roomCheckIN ul li .inputBox {flex-basis: 78%;}
   .area_roomCheckIN ul li input {width: 100%;}
   .area_roomCheckIN button[type="button"] {width: 100%; height: 45rem;}
   .area_calendar .calendar table td em {font-size: 13px;}

   /* rerservation02 */
   .rerservation02 .ss01 {margin: 50rem 0;}
   .rerservation02 .ss01 .process {grid-template-columns: repeat(2, 1fr); gap: 40rem 80rem;}

   /* board_event */
   .board_event .photoList > li a > em {padding: 20rem 15rem 15rem;}
   .board_event .photoList .date {padding: 6rem 15rem;}
   .board_event .photoList .date span {padding-left: 20rem; font-size: 12rem; background-size: contain !important;}

   /* area_privacy */
   .inr_policy {font-size: 14rem; padding: 40rem 0;}
   .inr_policy h3 {margin-bottom: 15rem;}
   .inr_policy ul li {margin-bottom: 12rem;}
}


@media all and (max-width:540px){
   .area_subVisual .sv_text {margin: 120rem auto 0; padding-bottom: 35rem;}
   .area_subVisual .sv_text h2 {font-size: 27rem;}
   .area_subVisual .sv_text p {font-size: 14rem; margin-top: 5rem;}
   .area_lnb ul li a {font-size: 14rem; padding: 5rem 12rem 4rem;}
   .area_lnb ul li.active a {font-size: 13rem;}
   #content {padding: 55rem 0;}
   .sub_tit,
   .sub_tit2 {font-size: 20rem; margin-bottom: 15rem;}
   .button {font-size: 12rem;}
   .button.pink {min-width: 130rem; height: 50rem; line-height: 50rem;}
   .ready section {padding: 20rem 0 40rem;}
   .ready i {width: 50rem; height: 50rem; margin-bottom: 20rem;}
   .ready i img {width: 35rem;}
   .ready h3 {font-size: 18rem; margin-bottom: 10rem;}
   .ready p {font-size: 13rem;}

   /* about01 */
   .about01 #content::after {width: 43%; height: 42vw; opacity: .1;}
   .about01 #content::before,
   .about01 .ss01::before,
   .about01 .ss01::after {display: none;}
   .about01 .aboutSlider {margin: 30rem 0;}
   .about01 .slider {height: 220rem; border-radius: 20rem;}
   .about01 .slick-dots li {margin: 0 3rem;}
   .about01 .slick-dots button {width: 6rem; height: 6rem;}
   .about01 p {line-height: 1.7;}
   .about01 p + p {margin-top: 15rem;}

   /* about02 */
   .about02 ul {margin-top: 25rem;}
   .about02 ul li {padding: 20rem 0 20rem 25rem;}
   .about02 ul li::before {top: 22rem; width: 16rem; height: 16rem; font-size: 7rem; line-height: 17rem;}
   .about02 ul li:first-child::before {top: 2rem;}
   .about02 ul li span {font-size: 13rem;}
   .about02 .notice {font-size: 13rem; font-weight: 400;}

   /*area_room */
   .area_room .sub_tit {margin-bottom: 15rem;}
   .area_room #content > p {line-height: 1.8;}
   .area_room .roomSlider {margin: 30rem auto; cursor: pointer;}
   .area_room .roomSlider .slick-list {border-radius: 20rem;}
   .area_room .slick-arrow-wrap {display: none;}
   .area_room .roomSlider .slick-slide {height: auto !important;}
   .area_room .roomSlider .slick-dots {bottom:15rem;}
   .area_room .roomSlider .slick-dots li {margin: 0 3rem;}
   .area_room .roomSlider .slick-dots li button {width: 6rem; height: 6rem;}
   .area_room .room_info > div {padding: 35rem 0;}
   .area_room .room_info > div h4 {font-size: 16rem; margin-bottom: 10rem;}
   .area_room .room_info > div ul li {margin: 12rem 25rem; font-size: 13rem;}
   .area_room .room_info > div ul li:last-child {margin-right: 10rem;}
   .area_room .room_info > div ul li i {width: 50rem; height: 35rem; margin: 0 auto 10rem;}
   .area_room .room_info > div ul li span {font-size: 12rem;}
   .area_room .button {margin-top: 30rem;}

   /*location */
   .location #map {margin: 5rem 0 20rem;}
   .location #map > div {height: 270rem;}
   .location .map_info .box h4 {font-size: 15rem; margin-bottom: 6rem;}
   .location .map_info .box h4 i {width: 16rem; height: 16rem; margin-right: 8rem;}
   .location .map_info .address {padding: 20rem; }
   .location .map_info .parking {margin-top: 30rem;}
   .location .map_info .parking h4 {padding: 0 10rem;}
   .location .map_info .parking h4 i {padding: 4rem 0;}
   .location .map_info .parking li {padding: 20rem 10rem; font-weight: 300;}
   .location .map_info .parking li:first-child {padding-top: 10rem;}
   .location .map_info .parking li p {padding-left: 25rem;}
   .location .map_info .parking li p em {top: 4rem; font-size: 9rem; padding-bottom: 3rem;}
   .location .map_info .parking li p em::after {height: 2px;}

   /* reservation */
   .area_roomCheckIN ul {grid-template-columns: 1fr;}
   .area_roomCheckIN ul li label {font-size: 13rem;}
   .area_roomCheckIN button[type="button"] {font-size: 12rem; height: 35rem;}
   a.for_wating.apply_btn {font-size: 0; background: #f5f5f5 url(/images/common/icon_bell.svg) no-repeat center / 11rem;}
   .box_color span.reser_standby {display: flex;}
   .box_color span.reser_standby::before {margin-right: 6px; width: 15px; height: 15px; border-radius: 0; background: url(/images/common/icon_bell.svg) no-repeat center / contain;}
   .area_calendar .control > div > p,
   .area_calendar .list p {font-size: 16rem;}

   /* rerservation02 */
   .rerservation02 .sub_tit + p br {display: none;}
   .rerservation02 .icon_list {margin-top: 25rem;}
   .rerservation02 .icon_list li a {width: 60rem; height: 60rem; padding: 12rem;}
   .rerservation02 .icon_list li a.rers_home img {width: 17rem;}
   .rerservation02 .icon_list li a:hover {box-shadow: 3rem 3rem 5rem rgba(0, 0, 0, .04) inset;}
   .rerservation02 .ss01 {margin: 30rem 0;}
   .rerservation02 .ss01 h4 {font-size: 16rem; margin-bottom: 15rem;}
   .rerservation02 .ss01 .process {grid-template-columns: 1fr;}
   .rerservation02 .ss01 .process .box {padding:25rem 20rem 20rem; border-radius: 10rem;}
   .rerservation02 .ss01 .process .box i {width: 30rem; height: 30rem; margin-bottom: 12rem;}
   .rerservation02 .ss01 .process .box span {font-size: 13rem;}
   .rerservation02 .ss01 .process .box:after {left: 50%; right: auto; top:auto; bottom: 0; width:40rem; height: 40rem; transform: translate(-50%, 100%) rotate(90deg); background-size: 20rem;}

   /*area_privacy */
   .inr_policy {padding: 30rem 0; font-size: 13rem; line-height: 1.7;}
   .inr_policy h3 {font-size: 14rem; margin-bottom: 12rem;}
   .area_privacy.email i {font-size: 13rem;}
   .area_privacy.email strong {font-size: 15rem; margin-top: 10rem;}
   .area_privacy.email .inr_policy {padding: 15rem 0;}

   /* board_event */
   .board_event .photoList > li .img {border-radius: 10rem;}
   .board_event .photoList .state em {padding: 7rem 10rem; font-size: 10rem; margin: 5rem;}
   .board_event .photoList > li a > em {padding: 15rem 10rem 12rem;}
   .board_event .photoList .date {padding: 3rem 12rem 5rem;}
   .board_event .photoList .date span {font-weight: 600; font-size: 12px; padding-left: 15rem; font-family:NanumSquareNeo, '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif}
   .bbsSearch form {border-radius: 10rem;}
}

@media all and (max-width:480px){
   .about01 p {font-weight: 300;}
   .about01 p strong br {display: none;}
   .about01 p strong {font-weight: 600;}
   .about02 ul li::before {top: 21rem; font-size: 8rem; line-height: 18rem;}
   .about02 ul li span {margin-top: 5rem; font-size: 12.5rem;}
   .about02 .notice {font-size: 12rem;}

   /* area_room */
   .area_room .room_info > div h4 {margin-bottom: 8rem;}
   .area_room .room_info > div ul li {font-weight: 300;}
   .area_room .room_info > div ul li strong {font-weight: 600;}
   .area_room .button {margin-top: 20rem;}

   /*reservation*/
   .area_calendar .calendar table td em {font-size: 12rem;}
   .area_calendar .calendar .today > *:after {top:0; right: 0; border-radius: 0;}
   .area_calendar .control > div > p,
   .area_calendar .list p {font-size: 15rem;}

   /* rerservation02 */
   .rerservation02 .icon_list {margin-top: 20rem;}
   .rerservation02 .ss01 {margin: 40rem 0;}

   /* board_event */
   .board_event .photoList > li {width: 100%;}
   .board_event .photoList > li a > em {padding: 18rem 10rem 15rem;}
   .board_event .photoList .state em {font-size: 12rem; margin: 15rem;}
   .board_event .photoList .date {padding: 5rem 12rem;}
   .board_event .photoList .date span {padding-left: 18rem; color: #888;}
   
}

@media all and (max-width:360px){}