@charset "utf-8";
.mobile {display:none}

header {border-bottom: 1px solid #000;position: fixed;top: 0;left: 0;width: 100%;z-index: 999;background: #fff;}
#header {padding: 1.5rem 100px; display:flex; justify-content: space-between; align-items: center;} 
#header .gnb {display:flex; gap:40px; font-weight: 700; }
#header .gnb a {color:#000;vertical-align: sub;}
#header .top_btn_area {display: flex; align-items: center; column-gap:2.5rem}
#header .btn {display: flex;  column-gap: .75rem;}
#header .btn button { color:#fff; font-weight: 600; padding: 12px 24px; background: #000; border-radius: 5px;}
#mb_header {display:none}

main {margin-top: 90px;letter-spacing: -0.05rem;}
.inner {width:100%;max-width: 1440px;margin: 0 auto;}

section {color:#1e293b; padding-top:60px; padding-bottom:100px}
section .set_title { font-size:40px; font-weight:600; margin-bottom:2.5rem; color:#000}
section .set_con {display: flex;}

#section01 {padding: 0;}
.main_visual {width:100%; margin: 0 auto;  overflow: hidden;}
.main_visual img {width:100%; object-fit: cover; max-height: 480px;}
#section01 .text_area { }
#section01 .text_area p {text-align: center;padding: 120px 100px;font-size: 1.125rem;line-height: 1.75rem;}

#section02 {background: #f8fafc; padding:0;}
#section02 .inner { padding-top:60px; padding-bottom:100px}
#section02 .set_title { }
#section02 .set_con {display:flex;  gap: 60px}
#section02 .set_con .img {border:1px solid #e5e7eb }
#section02 .set_con .img { }
#section02 .set_con .text {font-size:1.125rem }
#section02 .set_con .text p {margin-bottom:30px }

#section02 .about_txt {background: #000;color: #fff;text-align: center;padding: 1.5rem;}
#section02 .about_txt p {margin: 0.5rem;}
#section02 .about_txt p:nth-child(2) {font-size:1.125rem}
#section02 .about_txt p:nth-child(3) {color:#94a3b8}
#section02 .about_txt p > i { margin-right:5px; vertical-align:middle}

#section03 {border-bottom: 1px solid #ddd;} 
#section03 .inner { }
#section03 .set_con {flex-wrap: wrap;justify-content: space-between; gap: 80px 0;}
#section03 .set_con .room_type_wrap > .swiper-wrapper {flex-wrap: wrap;justify-content: space-between;gap: 80px 0;}
#section03 .room_type {width: calc(50% - 20px);position: relative;height: auto;} 
#section03 .room_type .swiper { } 
#section03 .room_type .sample { position: absolute; width: 100%; bottom: 0; z-index: 100; background: rgb(0 0 0/.1); color: #fff; text-align: center; font-size: 0.75rem; font-weight: 400; line-height: 3; letter-spacing: 0; }
#section03 .room_type .type_info {margin-top: 1.5rem;}
#section03 .room_type .type_info  h2 {font-size: 24px;font-weight: 700;}
#section03 .room_type .type_info > ul  {margin-top: 1.25rem;font-size: 1.125rem;border-bottom: 1px solid #e2e8f0;padding-bottom: 1.5rem;margin-bottom: 1.5rem;}

#section03 .room_type .type_info > ul > li {margin-bottom: 0.625rem;}
#section03 .room_type .type_info > ul > li > span {font-size: 14px; font-weight: 600; letter-spacing: normal; padding: 2px 5px;}
#section03 .room_type .type_info > ul > li > span.point {color: #2563eb; background:#3b82f620;}
#section03 .room_type .type_info .option {font-size: 1.125rem;line-height: 2rem;margin-bottom: 1.5rem;}
#section03 .room_type .type_info .option p.add {font-weight:500;line-height: 1.75rem;}
#section03 .room_type .type_info .option p.add> span {font-size: 0.875rem;font-weight: 500;margin-right: 10px;background: #1e293b;color: #fff;padding: 0 5px;}
#section03 .room_type .type_info .option p.add> span.base {color:#475569; background: none; padding: 0;}
#section03 .room_type .type_info .option > p {display: flex;}
#section03 .room_type .type_info .Price {background: #f8fafc;text-align: center;padding: 16px;margin-bottom: 1.5rem;font-size: 24px;font-weight: 700;}
#section03 .room_type .type_info .Price > span {display: block;font-size: 1rem;font-weight: 400;text-decoration-line: line-through;text-decoration-color: #e11d48;}
#section03 .room_type .type_info .slate { }
#section03 .room_type .type_info .slate > p {font-size: 0.75rem; color: #64748b;}
#section03 .Reser {width: 50%;display: flex;justify-content: center;align-items: center;flex-wrap: wrap;flex-direction: column;}
#section03 .Reser > p > strong {font-weight: 600; }
#section03 .Reser > p {font-size: 1.125rem;margin: 5px 0;}
#section03 .Reser > button {padding: 1.25rem;border-radius: 3px;border: 1px solid #000;font-size: 1.125rem;font-weight: 700;margin-top: 3rem;}

#en #section03 .room_type .type_info .Price > span { text-decoration-line: none;text-decoration-color: #e11d48;}
#en #section03 .room_type .type_info .Price > span>em{text-decoration-line: line-through;text-decoration-color: #e11d48;}


#section04 {border-bottom: 1px solid #ddd;}
#section04 .Service { }
#section04 .info {margin-top:2.5rem;font-size: 16px;color: #1e293b;}
#section04 .info > ul {display: grid;flex-wrap: wrap;gap: 20px;justify-content: flex-start;grid-template-columns: repeat(auto-fit, minmax(232px, 1fr));}
#section04 .info > ul > li {width: calc(20% - 20px);padding: 30px;background: #f8fafc;width: 100%;}
#section04 .info > ul > li > h3{font-weight: 500;font-size: 16px;margin-bottom: 10px;}
#section04 .info > ul > li > p{font-weight: 400;letter-spacing: -1px;}

#section05 {}
#section05 .inner { }
#section05 .set_title { }
#section05 .set_con { display: block;}
#section05 .set_con p {font-size:18px}
#section05 .set_con p > strong {font-weight:500}
#section05 .set_con .cost_wrap {display: flex;margin-top: 2.5rem;}
#section05 .set_con .cost_wrap .cost1 {width: 100%;max-width: 200px;font-size: 14px;margin-left: 2.5rem;margin-right: 2.5rem;}
#section05 .set_con .cost_wrap .cost1 > ul { }
#section05 .set_con .cost_wrap .cost1 > ul > li{padding: 18px 0;text-align: center;}
#section05 .set_con .cost_wrap .cost2 {background: #f1f5f9;border-radius: 15px;margin: 0 20px;width:100%;max-width:500px;text-align: center;}
#section05 .set_con .cost_wrap .cost2 > ul {width: 100%;}
#section05 .set_con .cost_wrap .cost2 > ul > li{padding: 16px 0;}
#section05 .set_con .cost_wrap .cost2 > ul > li:first-child {font-size:14px;font-weight: 600;}
#section05 .set_con .cost_wrap .cost2 > ul > li:last-child { font-size:20px; }
#section05 .set_con .cost_wrap .cost3 {background: #000;color: #fff;border-radius: 15px;width:100%;max-width:500px;display: flex;flex-direction: column;}
#section05 .set_con .cost_wrap .cost3 > div.tt {width: 100%;display: flex;justify-content: center;align-items: center;padding: 16px 0;}
#section05 .set_con .cost_wrap .cost3 > div.td {height:100%;display: flex;justify-content: center;align-items: center;font-size:4.5rem;font-weight: 800;}


#section06 {background: #f8fafc;}
#section06 h1 { }
#section06 h1 + p {font-size: 18px; }
#section06 .mov {display: flex;margin-top: 2.5rem;column-gap: 1.25rem;justify-content: space-between;}
#section06 .mov > div {width: 100%;height: 100%;aspect-ratio: 1.7 / 1;}
#section06 .mov iframe {width: 100%; height: 100%;}


#section07 {border-bottom: 1px solid #ddd;}
#section07 .inner { }
#section07 .set_title { }
#section07 .Location {display: grid;flex-wrap: wrap;gap: 20px;justify-content: flex-start;grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 60px;}
#section07 .Location .map {height: 100%;min-height: 400px;}
#section07 .Location .text {font-size:18px;display: flex;flex-direction: column;justify-content: flex-start;}
#section07 .Location .text > p {margin-bottom: 30px;}
#section07 .Location .text .address{margin-top: auto;border-left: 2px solid #cbd5e1;padding-left: 1.25rem;padding-right: 1.25rem;}
#section07 .Location .text .address > p {margin-bottom: 10px;}
#section07 .Location .text .address > p > span {font-size:14px;width: 80px;display:inline-block} 
#section07 .root_daum_roughmap .cont {display: none;}
#section07 .root_daum_roughmap .wrap_map {height: calc(100% - 32px);}


#section08 { }
#section08 .inner { }
#section08 .inner .set_title { }
#section08 .faq_warp { }
#section08 .faq_warp ul { }
#section08 .faq_warp ul > li {border-bottom: 1px solid #e5e7eb;padding-top: 30px;padding-bottom: 30px;}
#section08 .faq_warp ul > li > button {font-size: 1.25rem;font-weight: 600;line-height: 1.75rem;display: flex;width: 100%;justify-content: space-between;}
#section08 .faq_warp ul > li > button > span { }
#section08 .faq_warp ul > li > div {display: none;margin-top: 30px;}

footer {background: #000;color: #fff;padding: 4rem;}
footer .inner{ }
footer .footer-top {display: flex;padding-bottom: 3.5rem;border-bottom: 1px solid lab(100 0 0 / 0.21);}
footer .footer-top .ft_logo { }
footer .footer-top .about {margin-left: auto;}
footer .footer-top .about ul {display: flex;column-gap: 3rem;letter-spacing: 0;}
footer .footer-top .about ul > li { }
footer .footer-top .about ul > li > h4 {font-size: 14px;margin-bottom: .75rem;}
footer .footer-top .about ul > li > p {color: #a6aebb;font-size: 13px;margin-left: 20px;margin-bottom: 10px;}
footer .footer-top .about ul > li > p > span {margin-right: 10px;margin-left: -20px;}
footer .footer-top .about ul > li > p a {color: #a6aebb;}

footer .footer-btm {color: #a6aebb;font-size: 14px;padding-top: 3.5rem;}
footer .footer-btm .company-info {}
footer .footer-btm .company-info > p {margin-bottom: 9px;}
footer .footer-btm .company-info > .util-menu{display: flex;justify-content: space-between;gap: 1rem;}
footer .footer-btm .company-info > .util-menu > a {color: #a6aebb;}
footer .footer-btm .company-info > .util-menu > a > strong {font-weight:800}
footer .footer-btm .company-info > .util-menu > span {margin-left: auto;}

.tel_btn {position: fixed;right: 1.25rem;bottom: 1.25rem;background: #000;border-radius: 1.5rem;z-index: 100;padding: 0.75rem; cursor: pointer;}
.modal_popup {display: none; background: rgb(0 0 0 / 0.3);position: fixed;width: 100%;height: 100vh;top: 0;z-index: 99999;}

.modal_box {display:none; background: #fff;border: 2px solid #000;position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.modal_box button{background: #000;position: absolute;right: 0;}
.modal_box .cs_area {padding: 2rem;display: flex;flex-direction: column;line-height: 1.5;}
.modal_box .cs_area .tel{font-size: 1.25rem;font-weight: 600;}
.modal_box .cs_area .cs{color: #64748b;}

.whattimeDiv {display:none; width: 54%;height: 41rem;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.whattimeDiv button{position: absolute;right: 0;top: -32px;background: #000;line-height: 0;}


/* 탭메뉴 */
.tab {margin: 0px auto;display: flex;width: 100%;height: 80px;column-gap: 1.5rem;}
.tab li { }
.tab li a {display: inline;color: black;text-align: center;text-decoration: none;padding: 10px;font-size: 18px;}
.tabcont {display: none; color:black;}
.tab li.on{ }
.tab li.on a { }
.tabcont.on {display: block;}

.type_tab { margin-bottom: 20px !important}
.type_tab > li {font-size: 1.25rem;margin-top: 2.5rem;cursor: pointer;}
.type_tab > li.on {color:#000;font-weight: 700;}


 .swiper-horizontal .swiper-button-prev , 
 .swiper-horizontal .swiper-button-next {width: 60px;height: 110px; background: lab(0 0 0 / 0.27);}
 .swiper-horizontal .swiper-button-prev { border-top-right-radius: 9999px; border-bottom-right-radius: 9999px;}
 .swiper-horizontal .swiper-button-next {border-top-left-radius: 9999px;border-bottom-left-radius: 9999px;}

 .swiper-button-next {left: auto; right: 0 !important }
 .swiper-button-prev {right: auto; left: 0 !important }


 .swiper-horizontal .swiper-button-prev svg {color:#fff;width: 8px;margin-right: 10px;}
 .swiper-horizontal .swiper-button-next svg {color:#fff;width: 8px;margin-left: 10px;}

 
 #section03 .swiper-horizontal .swiper-button-prev , 
 #section03 .swiper-horizontal .swiper-button-next {width: 30px;height: 60px;}



@media screen and (max-width: 1060px) {
    .pc {display: none !important;}
    .mobile {display:block}

    #mb_header {height:80px;display: flex;justify-content: space-between;padding: 1rem;align-items: center;}
    #mb_header nav {display: none;width: 100%;position: absolute;top: 81px;left: 0;background: #fff;}
    #mb_header nav.on {display: block;}
    #mb_header nav ul { }
    #mb_header nav ul li {text-align: center;margin: 1.5rem;}
    #mb_header nav ul li a {color:#000; display: block;}
    #mb_header .all_btn {}
    #mb_header .all_btn button {display:flex;width: 24px;/* height: 30px; */flex-direction: column;gap: 4px;justify-content: space-between;}
    #mb_header .all_btn span{background: #000;width: 100%;height: 2px;display: inline-block;}

    .fix_btn {position: fixed; bottom: 0; width:100%; background: #000;}
    .fix_btn .btn {display: flex;align-items: center;justify-content: center;padding: 1rem;gap: 0.75rem;}
    .fix_btn .btn a {font-size: 1.125rem;color: #fff;border: 1px solid #fff;width: 50%;text-align: center;padding: 1rem;}
    .fix_btn .btn button {font-size: 1.125rem;color: #fff;border: 1px solid #fff;width: 50%;text-align: center;padding: 1rem;}

    main {margin-top:80px}
    .inner {padding: 0 1rem;}
    .main_visual {height:60vw}
    .main_visual .swiper {height:100%}
    .main_visual img {height:100%}

    section {padding-bottom: 75px;}
    section .set_title {font-size: 1.875rem;margin-bottom: 1rem;}
    #section01 .text_area p {font-size:1rem;padding: 74px 2rem;}
    #section02 .set_con {flex-direction: column;gap: 30px;}
    #section02 .inner {padding:1rem}

    #section03 .room_type .sample {text-align: left;padding: 0.5rem;font-size: 12px;font-weight: 300;line-height: 1.2;letter-spacing: -0.03rem;}
    #section03 .room_type { width: 100%}
    #section03 .room_type .type_info h2 {font-size:1.25rem;}
    #section03 .room_type .type_info > ul > li {font-size:1rem}
    #section03 .room_type .type_info .option > p {font-size:1rem;color: #000;line-height: 1.5; flex-wrap: wrap;}
    #section03 .set_title {margin-bottom:3rem }
    #section03 .set_con .room_type_wrap > .swiper-wrapper {  flex-wrap: inherit;}
    #section03 .set_con .swiper-pagination {position: relative;margin-bottom: 30px;height: 2px;}
    #section03 .set_con .swiper-pagination-progressbar-fill {background:#000}
    .Reser {display: none;}
    

    #section04 .info > ul {grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));}
    #section04 .info > ul > li {padding:1rem}
    #section04 .info > ul > li > p {display:none}

    #section05 .set_con p {font-size: 1rem;}
    #section05 .set_con .cost_wrap .cost1{margin: 0;}
    #section05 .set_con .cost_wrap .cost3 > div.td {font-size:2rem}


    #section06 .mov {flex-direction: column;gap: 1rem;}
    #section06 .mov > div { width:100%; flex-direction: column;}

    #section07 .Location {grid-template-columns: repeat(1, minmax(0, 1fr));}
    #section07 .Location .text {font-size: 1rem;}
    #section07 .Location .text > p {margin-bottom: 1rem;}
    #section07 .Location .text .address > p > span {display:block}


    footer {padding: 4rem 0;}
    footer .footer-top {flex-direction: column;}
    footer .footer-top .ft_logo {margin-bottom: 3rem;}
    footer .footer-top .about {margin: 0;}
    footer .footer-top .about ul {flex-direction: column;column-gap: 0;row-gap: 3rem;}

    footer .footer-btm {padding-bottom: 3rem;}
    footer .footer-btm .company-info > .util-menu {margin-top: 2rem;justify-content: flex-start;}
    footer .footer-btm .company-info > .util-menu > span {display: none;}

    .whattimeDiv { width:98%}

 }