@charset "utf-8";

html,
body {
    font-family: "Noto Sans KR", sans-serif;
    color: #111;
}

select {
    color: #111;
}

html {
   /* font-size: 10px; */
}

.cal1 td > a {
    font-size: 16px;
    font-weight: 500;
}
.cal1 td a:nth-child(n + 20) {
    color: #111;
}
.tabMenu-m {
    padding: 48px 32px;
}
.tabMenu-m ul {
    display: flex;
    position: relative;
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 20px;
}
.tabMenu-m li.on a {
    position: relative;
    color: #111111;
}
.tabMenu-m li.on a::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 3px;
    background: #111;
    bottom: 0;
    left: 0;
}
.tabMenu-m ul li:not(.reserve_ok_result) {
    width: fit-content;
    height: 33px;
    position: relative;
}
.tabMenu-m ul li:not(:last-child) {
    margin-right: 40px;
}
.tabMenu ul {
    display: flex;
    position: relative;
}
.tabMenu ul li:not(.reserve_ok_result) {
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
}
.tabMenu ul li.on {
    position: relative;
    border: 1px solid #111;
}
.tabMenu ul li.on::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: -5px;
    background: #fff;
}
.tabMenu ul li:not(.reserve_ok_result) {
    width: 200px;
    height: 60px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tabMenu-m li a {
    color: #cccccc;
}
.tabMenu ul li:not(.reserve_ok_result) a,
.tabMenu-m ul li:not(.reserve_ok_result) a {
    font-size: 15px;
    font-weight: 500;
    white-space: nowrap;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #cccccc;
    z-index: 1;
    font-family: "AktivGrotesk", "Sans-Serif";
}
.tabMenu ul li:first-child a {
    color: #111;
}
.btnbx {
    position: absolute;
    width: 300px;
    height: 48px;
    display: flex;
    right: 0;
    bottom: 45px;
}
.btnbx button {
    border-radius: 50px;
    border: 1px solid #111;
    width: 140px;
    height: 48px;
}
.btnbx button:not(:last-child) {
    margin-right: 20px;
}
.btnbx button a {
    font-size: 16px;
    font-weight: 500;
}
.btnbx .reserve_btn {
    background: #111;
}
.btnbx .reserve_btn a {
    color: #fff;
}
.listBx {
    display: flex;
    position: relative;
    padding: 45px 0;
}
.reservation .person_check {
    border-top: 1px solid #e6e6e6;
}
.roomBx {
    display: flex;
    position: relative;
}
.roomBx:not(:last-child) {
    margin-bottom: 20px;
}
.listBx:not(:last-child) {
    border-bottom: 1px solid #dddddd;
}
.listBx .imgbx {
    width: 480px;
    height: 320px;
}
.listBx .txtbx {
    position: relative;
    margin-left: 71px;
}
.top_txt .desc {
    margin-bottom: 23px;
}
.desc .txt_line {
    width: 1px;
    height: 12px;
    background: #cccccc;
    display: inline-block;
    margin: 0 8px;
}
.desc span {
    display: inline-block;
}
.bot_txt {
    position: absolute;
    bottom: 0;
}
.bot_txt h6 {
    font-size: 12px;
    font-weight: 400;
    color: #999999;
}
.bot_txt p {
    font-size: 32px;
    font-weight: 500;
    font-family: "AktivGrotesk", "Sans-Serif";
}
.listBx .txtbx h2 {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
}
.listBx .txtbx p {
    line-height: 1.5;
    display: inline-block;
}

li {
    cursor: pointer;
}

.blind {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
}

.month-move .icowrap {
    width: 15px;
    height: 15px;
}
.button_wrap .month-move .clk {
    display: none;
}
.search_rooms {
    border-radius: 50px;
    background: #111111;
    color: #fff;
    padding: 19px 56px;
    font-size: 16px;
    font-weight: 700;
    white-space: nowrap;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 212px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lst_divide {
    display: flex;
    align-items: center;
    gap: 70px;
    position: relative;
}
.lst_divide::after {
    content: "";
    position: absolute;
    width: 1px;
    height: 12px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #dddddd;
}
.lst_divide li {
    display: flex;
    align-items: center;
}
.divide_wrap {
    display: flex;
    align-items: center;
}
.divide_wrap a {
    font-size: calc(100vw * (14 / 375));
    font-weight: 500;
    color: #444;
    display: flex;
    align-items: center;
    position: relative;
}
.divide_wrap a + a::before {
    content: "";
    width: calc(100vw * (1 / 375));
    height: calc(100vw * (8 / 375));
    background-color: #bbb;
    position: absolute;
    left: calc(100vw * (-12 / 375));
}

.rooms_bx .icowrap {
    width: 18px;
    height: 18px;
}
.rooms_bx button {
    display: flex;
    width: 350px;
    justify-content: space-between;
}
.options h3 {
    font-size: 18px;
    font-weight: 700;
}
.options {
    display: flex;
    margin-top: 49px;
}
.options li {
    width: 350px;
}
.options .numchkbx {
    display: block;
    padding: 0;
}
.options .numchkbx ul li:not(:last-child) {
    margin-right: 0;
}
.options .person_bx {
    position: absolute;
    bottom: 0;
}
.options .numchkbx ul li {
    width: 350px;
}
.options .numchkbx ul {
    flex-direction: column;
}

/* 객실예약 모달창 */
.modal_bg {
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.56);
    display: none;
    width: 100%;
    height: 100%;
    z-index: 9;
}
.modal_bg .reservation_info {
    background: #fff;
    width: 500px;
    height: 274px;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.modal_bg .close_btn {
    width: 40px;
    height: 40px;
    display: block;
    position: absolute;
    right: 0;
    padding: 10px 10px 0 0;
}
.modal_bg .content:not(.reservation_rt .content):not(.reservation_rt .content) {
    padding: 36px 40px 40px 40px;
    height: 100%;
}
.modal_bg .content:not(.reservation_rt .content) .title {
    font-size: 20px;
    font-weight: 500;
    border-bottom: 1px solid #111;
    width: 420px;
    padding-bottom: 16px;
    margin-bottom: 32px;
}
.modal_bg .content:not(.reservation_rt .content) .txt {
    width: 420px;
    display: flex;
    justify-content: space-between;
}
.modal_bg .content:not(.reservation_rt .content) .txt p {
    font-size: 15px;
    font-weight: 400;
}
.modal_bg .content:not(.reservation_rt .content) .txt:not(:last-child) {
    margin-bottom: 20px;
}

/* 최종결제 모달창 */
.modal_bg .modal_bx {
    width: 1200px;
    height: 747px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
}
.modal_bg.on {
    display: block;
}
.reservation_dt {
    display: flex;
    justify-content: space-between;
    height: 100%;
}
.reservation_lft {
    padding: 52px 32px 40px 40px;
    overflow-y: scroll;
}
/* 스크롤바 커스텀 */
.reservation_lft::-webkit-scrollbar {
    width: 3px;
}
.reservation_lft::-webkit-scrollbar-track {
    background-color: #d9d9d9;
}
.reservation_lft::-webkit-scrollbar-thumb {
    background-color: #343434;
}
.reservation_lft .mtit {
    font-size: 40px;
    font-weight: 500;
}
.reservation_lft .title {
    font-size: 18px;
    font-weight: 700;
    padding-bottom: 13px;
    border-bottom: 1px solid #111111;
    margin-bottom: 24px;
}
.reservation_lft .container {
    margin-top: 49px;
}
.reservation_lft .container .contents {
    display: flex;
    gap: 35px;
}
.reservation_lft .container .contents:not(:last-child) {
    margin-bottom: 40px;
}
.reservation_lft .top-cont .ico {
    width: 18px;
    height: 18px;
}
.reservation_lft .bx1 .subtit {
    display: flex;
    justify-content: space-between;
    width: 350px;
    height: 35px;
    margin-top: 40px;
    padding-bottom: 13px;
    border-bottom: 1px solid #cccccc;
}
.reservation_lft .bx1 .subtit p {
    font-size: 15px;
    font-weight: 400;
}
.reservation_lft .bx1 .info_msg {
    margin-top: 12px;
}
.reservation_lft .bx1 .info_msg p {
    font-size: 12px;
    font-weight: 400;
    color: #888888;
    line-height: 1.5;
}
/* 캘린더 */
.reservation_lft .bx2 .calbx {
    width: 350px;
    height: 200px;
    text-align: center;
    margin-top: 24px;
}
.reservation_lft .bx2 .calbx .date-year {
    margin-bottom: 10px;
    line-height: 1.5;
    font-size: 16px;
    font-weight: 500;
    position: relative;
}
.reservation_lft .bx2 th {
    width: 34px;
    height: 17px;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 6px;
}
.reservation_lft .bx2 td {
    width: 50px;
    height: 29px;
}

.reservation_lft .bx2 td a {
    font-size: 13px;
    font-weight: 500;
}

/* 드롭박스 */
.numchkbx .minus,
.numchkbx .plus {
    width: 24px;
    height: 24px;
}
.numchkbx a {
    font-size: 16px;
    font-weight: 400;
}
.numchkbx .minus {
    margin-right: 16px;
}
.numchkbx .plus {
    margin-left: 16px;
}
.num_crt {
    display: flex;
    align-items: center;
}
.num_crt span {
    font-size: 16px;
    font-weight: 400;
    font-family: "AktivGrotesk", "Sans-Serif";
}
.clk_ico {
    display: none;
}
.plus.on .clk_ico,
.minus.on .clk_ico {
    display: block;
}
.plus.on .clk-prev_ico,
.minus.on .clk-prev_ico {
    display: none;
}
.reserve_option .icobx {
    width: 8px;
    height: 9px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(270deg);
}
.reserve_option li {
    display: flex;
    align-items: center;
}
.reserve_option .opt {
    border: 1px solid #888888;
    padding: 20px;
    width: 350px;
    height: 64px;
}
.reserve_option .opt a {
    font-size: 15px;
    font-weight: 400;
    width: 233px;
    margin-left: 12px;
}
.reserve_option .opt span {
    font-size: 16px;
    font-weight: 400;
}

/* 옵션 아이콘 공통스타일 */
.reserve_option .icowrap {
    width: 24px;
    height: 24px;
    background: #e6e6e6;
    position: relative;
    border-radius: 5px;
}
.numchkbx ul li {
    background: #fff;
    border: 1px solid #888888;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 19px 25px 20px 20px;
    width: 400px;
    height: 64px;
}

.numchkbx .chkbx {
    width: 350px;
    height: 64px;
}
.numchkbx .chkbx:not(:last-child),
.reserve_option .opt:not(:last-child) {
    margin-bottom: 12px;
}
.reservation_rt {
    background: #333333;
    width: 390px;
    height: 747px;
    padding: 53px 0 0 0;
}
.reservation_rt .title {
    width: 335px;
    margin: 0 auto 17px;
}
.reservation_rt .title h5 {
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 5px;
    line-height: 1.5;
}
.reservation_rt .title p {
    font-size: 12px;
    font-weight: 400;
    color: #999999;
}
.reservation_rt .content {
    width: 335px;
    margin: 0 auto;
}
.reservation_rt .content .bx1 {
    display: flex;
    justify-content: space-between;
    text-align: center;
    border-bottom: 1px solid #333333;
    border-radius: 8px 8px 0 0;
}
.reservation_rt .content .bx1 .checkin {
    border-right: 1px solid #333333;
}
.reservation_rt .bx1 .checkin,
.reservation_rt .bx1 .checkout {
    width: 167px;
    height: 75px;
    padding: 21px 31px 17px 30px;
}
.reservation_rt .bx1 .checkin h5,
.reservation_rt .bx1 .checkout h5 {
    font-size: 12px;
    font-weight: 400;
    color: #888888;
    margin-bottom: 5px;
}
.reservation_rt .bx1 .checkin b,
.reservation_rt .bx1 .checkout b {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
}
.reservation_rt .bx2 {
    height: 217px;
    padding: 18px 12px 11px 12px;
    border-radius: 0 0 8px 8px;
}
.reservation_rt .bx2 .subtit {
    display: flex;
    justify-content: space-between;
    color: #cccccc;
    width: 100%;
    height: 24px;
    margin-bottom: 16px;
    align-items: center;
}
.reservation_rt .bx2 .depth1 p:first-child {
    font-size: 16px;
    font-weight: 400;
}
.reservation_rt .bx2 .depth1 p:last-child {
    font-size: 18px;
    font-weight: 500;
}
.reservation_rt .bx2 .depth2 p {
    font-size: 12px;
    color: #cccccc;
}
.reservation_rt .bx2 .detail {
    background: #333333;
    width: 311px;
    height: 148px;
    padding: 10px 10px 11px 11px;
    margin: 0 auto;
    border-radius: 8px;
}
.reservation_rt .bx2 .content .txt {
    display: flex;
    justify-content: space-between;
}
.reservation_rt .bx2 .content .txt p {
    color: #888888;
    font-size: 12px;
    font-weight: 400;
}
.reservation_rt .bx1,
.reservation_rt .bx2 {
    background: #222222;
}
.reservation_rt .bx2 .content {
    margin-top: 13px;
    width: 100%;
    background: #333333;
}
.reservation_rt .bx2 .content .txt p:not(:last-child) {
    margin-bottom: 12px;
}
.reservation_rt .bx3 .txt {
    display: flex;
    justify-content: space-between;
    padding: 20px 0;
}
.reservation_rt .total_cost {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 22px;
}
.reservation_rt .total_cost a {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
}
.reservation_rt .total_cost span {
    font-size: 18px;
    font-weight: 500;
    color: #fff;
}
.reservation_rt .bx3 .txt:first-child {
    border-bottom: 1px solid #fff;
}
.reservation_rt .bx3 .txt p {
    color: #fff;
    font-size: 16px;
    font-weight: 400;
}
.reservation_rt .pay_btn {
    margin: 0 auto;
    border-radius: 30px;
    border: 1px solid #fff;
    height: 60px;
    width: 212px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 124px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
}
.reservation_rt .pay_btn button {
    font-weight: 500;
    font-size: 16px;
    color: #fff;
}

@media screen and (max-width: 1600px) {
    /* 드롭박스 공통 */
    .numchkbx .minus,
    .numchkbx .plus {
        width: calc(100vw * (24 / 1600));
        height: calc(100vw * (24 / 1600));
    }
    .numchkbx a {
        font-size: calc(100vw * (16 / 1600));
        font-weight: 400;
    }
    .numchkbx .minus {
        margin-right: calc(100vw * (16 / 1600));
    }
    .numchkbx .plus {
        margin-left: calc(100vw * (16 / 1600));
    }
    .reserve_option .icobx {
        width: calc(100vw * (8 / 1600));
        height: calc(100vw * (9 / 1600));
    }
    .reservation_rt .total_cost a {
        font-size: calc(100vw * (16 / 1600));
        font-weight: 400;
        color: #fff;
    }
    .tabMenu-m {
        padding: calc(100vw * (48 / 1600)) calc(100vw * (32 / 1600));
    }
    .tabMenu-m ul {
        border-bottom: calc(100vw * (1 / 1600)) solid #e6e6e6;
        margin-bottom: calc(100vw * (20 / 1600));
    }
    .tabMenu-m li a {
        padding-bottom: calc(100vw * (8 / 1600));
    }
    .tabMenu-m li.on a::after {
        height: calc(100vw * (3 / 1600));
    }
    .tabMenu-m ul li:not(.reserve_ok_result) {
        height: calc(100vw * (33 / 1600));
    }
    .tabMenu-m ul li:not(:last-child) {
        margin-right: calc(100vw * (40 / 1600));
    }
    .tabMenu ul li:not(.reserve_ok_result) {
        border-top: calc(100vw * (1 / 1600)) solid #aaa;
        border-left: calc(100vw * (1 / 1600)) solid #aaa;
        border-right: calc(100vw * (1 / 1600)) solid #aaa;
    }
    .tabMenu ul li.on {
        border-bottom: transparent !important;
        border-top: calc(100vw * (1 / 1600)) solid #111 !important;
        border-right: calc(100vw * (1 / 1600)) solid #111 !important;
        border-left: calc(100vw * (1 / 1600)) solid #111 !important;
    }
    .tabMenu ul li:not(.reserve_ok_result) {
        width: calc(100vw * (200 / 1600));
        height: calc(100vw * (60 / 1600));
    }
    .tabMenu ul li:not(.reserve_ok_result) a,
    .tabMenu-m ul li:not(.reserve_ok_result) a {
        font-size: calc(100vw * (15 / 1600));
    }
    .btnbx {
        width: calc(100vw * (300 / 1600));
        height: calc(100vw * (48 / 1600));
        bottom: calc(100vw * (45 / 1600));
    }
    .btnbx button {
        border-radius: calc(100vw * (50 / 1600));
        border: calc(100vw * (1 / 1600)) solid #111;
        width: calc(100vw * (140 / 1600));
        height: calc(100vw * (48 / 1600));
    }
    .btnbx button:not(:last-child) {
        margin-right: calc(100vw * (20 / 1600));
    }
    .btnbx button a {
        font-size: calc(100vw * (16 / 1600));
    }
    .listBx {
        padding: calc(100vw * (45 / 1600)) 0;
    }
    .reservation .person_check {
        border-top: calc(100vw * (1 / 1600)) solid #e6e6e6;
    }

    .roomBx:not(:last-child) {
        margin-bottom: calc(100vw * (20 / 1600));
    }
    .listBx:not(:last-child) {
        border-bottom: calc(100vw * (1 / 1600)) solid #dddddd;
    }
    .listBx .imgbx {
        width: calc(100vw * (480 / 1600));
        height: calc(100vw * (320 / 1600));
    }
    .listBx .txtbx {
        margin-left: calc(100vw * (71 / 1600));
    }
    .top_txt .desc {
        margin-bottom: calc(100vw * (23 / 1600));
    }
    .desc .txt_line {
        width: calc(100vw * (1 / 1600));
        height: calc(100vw * (12 / 1600));
        margin: 0 calc(100vw * (8 / 1600));
    }
    .bot_txt h6 {
        font-size: calc(100vw * (12 / 1600));
    }
    .bot_txt p {
        font-size: calc(100vw * (32 / 1600));
    }
    .listBx .txtbx h2 {
        font-size: calc(100vw * (24 / 1600));
    }

    .blind {
        width: calc(100vw * (1 / 1600));
        height: calc(100vw * (1 / 1600));
        margin: calc(100vw * (-1 / 1600));
    }

    .month-move .icowrap {
        width: calc(100vw * (8 / 1600));
        height: calc(100vw * (8 / 1600));
        right: calc(100vw * (146 / 1600));
    }
    .search_rooms {
        border-radius: calc(100vw * (50 / 1600));
        padding: calc(100vw * (19 / 1600)) calc(100vw * (56 / 1600));
        font-size: calc(100vw * (16 / 1600));
        width: calc(100vw * (212 / 1600));
        height: calc(100vw * (60 / 1600));
    }

    .lst_divide {
        gap: calc(100vw * (70 / 1600));
    }
    .lst_divide::after {
        width: calc(100vw * (1 / 1600));
        height: calc(100vw * (12 / 1600));
    }

    /* 최종결제 모달창 */
    .modal_bg .modal_bx {
        width: calc(100vw * (1200 / 1600));
        height: calc(100vw * (747 / 1600));
    }
    .reservation_lft {
        padding: calc(100vw * (52 / 1600)) calc(100vw * (32 / 1600)) calc(100vw * (40 / 1600)) calc(100vw * (40 / 1600));
    }
    /* 스크롤바 커스텀 */
    .reservation_lft::-webkit-scrollbar {
        width: calc(100vw * (3 / 1600));
    }
    .reservation_lft .mtit {
        font-size: calc(100vw * (40 / 1600));
    }
    .reservation_lft .title {
        font-size: calc(100vw * (18 / 1600));
        padding-bottom: calc(100vw * (13 / 1600));
        border-bottom: calc(100vw * (1 / 1600)) solid #111111;
        margin-bottom: calc(100vw * (24 / 1600));
    }
    .reservation_lft .container {
        margin-top: calc(100vw * (49 / 1600));
    }
    .reservation_lft .container .contents {
        gap: calc(100vw * (35 / 1600));
    }
    .reservation_lft .container .contents:not(:last-child) {
        margin-bottom: calc(100vw * (40 / 1600));
    }
    .reservation_lft .top-cont .ico {
        width: calc(100vw * (18 / 1600));
        height: calc(100vw * (18 / 1600));
    }
    .reservation_lft .bx1 .subtit {
        width: calc(100vw * (350 / 1600));
        height: calc(100vw * (35 / 1600));
        margin-top: calc(100vw * (40 / 1600));
        padding-bottom: calc(100vw * (13 / 1600));
        border-bottom: calc(100vw * (1 / 1600)) solid #cccccc;
    }
    .reservation_lft .bx1 .subtit p {
        font-size: calc(100vw * (15 / 1600));
    }
    .reservation_lft .bx1 .info_msg {
        margin-top: calc(100vw * (12 / 1600));
    }
    .reservation_lft .bx1 .info_msg p {
        font-size: calc(100vw * (12 / 1600));
    }
    /* 캘린더 */
    .reservation_lft .bx2 .calbx {
        width: calc(100vw * (350 / 1600));
        height: calc(100vw * (200 / 1600));
        margin-top: calc(100vw * (24 / 1600));
    }
    .reservation_lft .bx2 .calbx .date-year {
        margin-bottom: calc(100vw * (10 / 1600));
        font-size: calc(100vw * (16 / 1600));
    }
    .reservation_lft .bx2 th {
        width: calc(100vw * (34 / 1600));
        height: calc(100vw * (17 / 1600));
        font-size: calc(100vw * (12 / 1600));
        margin-bottom: calc(100vw * (6 / 1600));
    }
    .reservation_lft .bx2 td {
        width: calc(100vw * (50 / 1600));
        height: calc(100vw * (29 / 1600));
    }

    .reservation_lft .bx2 td a {
        font-size: calc(100vw * (13 / 1600));
    }

    .reserve_option .opt {
        border: calc(100vw * (1 / 1600)) solid #888888;
        padding: calc(100vw * (20 / 1600));
        width: calc(100vw * (350 / 1600));
        height: calc(100vw * (64 / 1600));
    }
    .reserve_option .opt a {
        font-size: calc(100vw * (15 / 1600));
        width: calc(100vw * (233 / 1600));
        margin-left: calc(100vw * (12 / 1600));
    }
    .reserve_option .opt span {
        font-size: calc(100vw * (16 / 1600));
    }

    /* 옵션 아이콘 공통스타일 */
    .reserve_option .icowrap {
        width: calc(100vw * (24 / 1600));
        height: calc(100vw * (24 / 1600));
        border-radius: calc(100vw * (5 / 1600));
    }

    .numchkbx ul li {
        border: calc(100vw * (1 / 1600)) solid #888888;
        padding: calc(100vw * (19 / 1600)) calc(100vw * (25 / 1600)) calc(100vw * (20 / 1600)) calc(100vw * (20 / 1600));
        width: calc(100vw * (400 / 1600));
        height: calc(100vw * (64 / 1600));
    }

    .numchkbx .chkbx {
        width: calc(100vw * (350 / 1600));
        height: calc(100vw * (64 / 1600));
    }
    .numchkbx .chkbx:not(:last-child),
    .reserve_option .opt:not(:last-child) {
        margin-bottom: calc(100vw * (12 / 1600));
    }

    .reservation_rt {
        width: calc(100vw * (390 / 1600));
        height: calc(100vw * (747 / 1600));
        padding: calc(100vw * (53 / 1600)) 0 0 0;
    }
    .reservation_rt .title {
        width: calc(100vw * (335 / 1600));
        margin: 0 auto calc(100vw * (17 / 1600));
    }
    .reservation_rt .title h5 {
        font-size: calc(100vw * (22 / 1600));
        margin-bottom: calc(100vw * (5 / 1600));
    }
    .reservation_rt .title p {
        font-size: calc(100vw * (12 / 1600));
    }
    .reservation_rt .content {
        width: calc(100vw * (335 / 1600));
        margin-top: calc(100vw * (13 / 1600));
    }
    .reservation_rt .content .bx1 {
        border-radius: calc(100vw * (8 / 1600)) calc(100vw * (8 / 1600)) 0 0;
        border-bottom: calc(100vw * (1 / 1600)) solid #333333;
    }
    .reservation_rt .content .bx1 .checkin {
        border-right: calc(100vw * (1 / 1600)) solid #333333;
    }
    .reservation_rt .bx1 .checkin,
    .reservation_rt .bx1 .checkout {
        width: calc(100vw * (167 / 1600));
        height: calc(100vw * (75 / 1600));
        padding: calc(100vw * (21 / 1600)) calc(100vw * (31 / 1600)) calc(100vw * (17 / 1600)) calc(100vw * (30 / 1600));
    }
    .reservation_rt .bx1 .checkin h5,
    .reservation_rt .bx1 .checkout h5 {
        font-size: calc(100vw * (12 / 1600));
        margin-bottom: calc(100vw * (5 / 1600));
    }
    .reservation_rt .bx1 .checkin b,
    .reservation_rt .bx1 .checkout b {
        font-size: calc(100vw * (16 / 1600));
    }
    .reservation_rt .bx2 {
        height: calc(100vw * (217 / 1600));
        padding: calc(100vw * (18 / 1600)) calc(100vw * (12 / 1600)) calc(100vw * (11 / 1600)) calc(100vw * (12 / 1600));
        border-radius: 0 0 calc(100vw * (8 / 1600)) calc(100vw * (8 / 1600));
    }
    .reservation_rt .bx2 .subtit {
        height: calc(100vw * (24 / 1600));
        margin-bottom: calc(100vw * (16 / 1600));
    }
    .reservation_rt .bx2 .depth1 p:first-child {
        font-size: calc(100vw * (16 / 1600));
    }
    .reservation_rt .bx2 .depth1 p:last-child {
        font-size: calc(100vw * (18 / 1600));
    }
    .reservation_rt .bx2 .depth2 p {
        font-size: calc(100vw * (12 / 1600));
    }
    .reservation_rt .bx2 .detail {
        width: calc(100vw * (311 / 1600));
        height: calc(100vw * (148 / 1600));
        padding: calc(100vw * (10 / 1600)) calc(100vw * (10 / 1600)) calc(100vw * (11 / 1600)) calc(100vw * (11 / 1600));
        margin: 0 auto;
        border-radius: calc(100vw * (8 / 1600));
    }
    .reservation_rt .bx2 .content .txt p {
        font-size: calc(100vw * (12 / 1600));
        font-weight: 400;
    }
    .reservation_rt .bx2 .content .txt p:not(:last-child) {
        margin-bottom: calc(100vw * (12 / 1600));
    }
    .reservation_rt .bx3 .txt {
        padding: calc(100vw * (20 / 1600)) 0;
    }
    .reservation_rt .bx3 .txt:first-child {
        border-bottom: calc(100vw * (1 / 1600)) solid #fff;
    }
    .reservation_rt .bx3 .txt p {
        font-size: calc(100vw * (16 / 1600));
    }
    .reservation_rt .pay_btn {
        border-radius: calc(100vw * (30 / 1600));
        border: calc(100vw * (1 / 1600)) solid #fff;
        height: calc(100vw * (60 / 1600));
        width: calc(100vw * (212 / 1600));
        font-size: calc(100vw * (16 / 1600));
        margin-top: calc(100vw * (124 / 1600));
    }
    .reservation_rt .pay_btn button {
        font-size: calc(100vw * (16 / 1600));
    }

    /* 객실예약 모달창 */
    .modal_bg .reservation_info {
        width: calc(100vw * (500 / 1600));
        height: calc(100vw * (274 / 1600));
    }
    .modal_bg .close_btn {
        width: calc(100vw * (40 / 1600));
        height: calc(100vw * (40 / 1600));
        padding: calc(100vw * (10 / 1600)) calc(100vw * (10 / 1600)) 0 0;
    }
    .modal_bg .content:not(.reservation_rt .content) {
        padding: calc(100vw * (36 / 1600)) calc(100vw * (40 / 1600)) calc(100vw * (40 / 1600)) calc(100vw * (40 / 1600));
    }
    .modal_bg .content:not(.reservation_rt .content) .title {
        font-size: calc(100vw * (20 / 1600));
        border-bottom: calc(100vw * (1 / 1600)) solid #111;
        width: calc(100vw * (420 / 1600));
        padding-bottom: calc(100vw * (16 / 1600));
        margin-bottom: calc(100vw * (32 / 1600));
    }
    .modal_bg .content:not(.reservation_rt .content) .txt {
        width: 100%;
    }
    .modal_bg .content:not(.reservation_rt .content) .txt p {
        font-size: calc(100vw * (15 / 1600));
    }
    .modal_bg .content:not(.reservation_rt .content) .txt:not(:last-child) {
        margin-bottom: calc(100vw * (20 / 1600));
    }
}

@media screen and (min-width: 900px) {
    .dropbx {
        display: none;
    }
}

@media screen and (max-width: 900px) {
    /* 드롭박스 공통 */
    .dropbx.on .icowrap {
        transform: rotate(180deg);
    }
    .dropbx .icowrap {
        width: calc(100vw * (24 / 375));
        height: calc(100vw * (24 / 375));
        margin: 0 auto;
        transform: rotate(0deg);
        cursor: pointer;
    }
    .num_crt span {
        font-size: calc(100vw * (16 / 375));
    }
    .numchkbx .minus,
    .numchkbx .plus {
        width: calc(100vw * (24 / 375));
        height: calc(100vw * (24 / 375));
    }
    .numchkbx a {
        font-size: calc(100vw * (16 / 375));
        font-weight: 400;
    }
    .numchkbx .minus {
        margin-right: calc(100vw * (16 / 375));
    }
    .numchkbx .plus {
        margin-left: calc(100vw * (16 / 375));
    }
    .numchkbx ul li {
        width: calc(100vw * (335 / 375));
        height: calc(100vw * (64 / 375));
        background: #fff;
        border: calc(100vw * (1 / 375)) solid #888888;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: calc(100vw * (19 / 375)) calc(100vw * (25 / 375)) calc(100vw * (20 / 375)) calc(100vw * (20 / 375));
    }
    .numchkbx ul li:not(:last-child) {
        margin-right: 0;
        margin-bottom: calc(100vw * (12 / 375));
    }
    .reserve_option .icobx {
        width: calc(100vw * (8 / 375));
        height: calc(100vw * (9 / 375));
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) rotate(270deg);
    }
    .options_container .reserve_option .icowrap {
        width: calc(100vw * (24 / 375));
        height: calc(100vw * (24 / 375));
        margin: 0;
        border-radius: calc(100vw * (5 / 375));
    }
    .options_container .reserve_option {
        width: calc(100vw * (335 / 375));
        margin: 0 auto;
    }
    .options_container .reserve_option li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: calc(100vw * (64 / 375));
        border: calc(100vw * (1 / 375)) solid #888888;
        padding: 0 calc(100vw * (20 / 375));
    }
    .options_container .reserve_option li:not(:last-child) {
        margin-bottom: calc(100vw * (12 / 375));
    }
    .options_container .reserve_option li.on .icowrap {
        background: #111111;
    }
    .options_container .reserve_option li a {
        font-size: calc(100vw * (15 / 375));
        font-weight: 400;
        width: calc(100vw * (211 / 375));
        margin-left: calc(100vw * (12 / 375));
    }
    .options_container .reserve_option li span {
        font-size: calc(100vw * (16 / 375));
        font-weight: 400;
        font-family: "AktivGrotesk", "Sans-Serif";
    }
    .tabMenu-m {
        padding: calc(100vw * (48 / 375)) calc(100vw * (32 / 375));
    }
    .tabMenu-m ul {
        border-bottom: calc(100vw * (1 / 375)) solid #e6e6e6;
        margin-bottom: calc(100vw * (20 / 375));
    }
    .tabMenu-m li a {
        position: relative;
        color: #111111;
        padding-bottom: calc(100vw * (8 / 375));
    }
    .tabMenu-m li.on a::after {
        content: "";
        position: absolute;
        width: 100%;
        height: calc(100vw * (3 / 375));
        background: #111;
        bottom: 0;
        left: 0;
    }
    .tabMenu-m ul li:not(.reserve_ok_result) {
        height: calc(100vw * (33 / 375));
    }
    .tabMenu-m ul li:not(:last-child) {
        margin-right: calc(100vw * (40 / 375));
    }
    .tabMenu ul {
        border-bottom: calc(100vw * (1 / 375)) solid #111111;
    }
    .tabMenu ul li:not(.reserve_ok_result) {
        border-top: calc(100vw * (1 / 375)) solid #aaa;
        border-left: calc(100vw * (1 / 375)) solid #aaa;
        border-right: calc(100vw * (1 / 375)) solid #aaa;
    }
    .tabMenu ul li.on {
        border-bottom: transparent !important;
        border-top: calc(100vw * (1 / 375)) solid #111 !important;
        border-right: calc(100vw * (1 / 375)) solid #111 !important;
        border-left: calc(100vw * (1 / 375)) solid #111 !important;
    }

    /* 최종결제 모달창 */
    .modal_bg .modal_bx {
        display: none;
    }

    /* 객실예약 모달창 */
    .modal_bg .reservation_info {
        background: #fff;
        width: calc(100vw * (315 / 375));
        height: calc(100vw * (261 / 375));
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .modal_bg .close_btn {
        width: calc(100vw * (40 / 375));
        height: calc(100vw * (40 / 375));
        display: block;
        position: absolute;
        right: 0;
        padding: calc(100vw * (10 / 375)) calc(100vw * (10 / 375)) 0 0;
    }
    .modal_bg .content:not(.reservation_rt .content) {
        padding: calc(100vw * (36 / 375)) calc(100vw * (20 / 375)) calc(100vw * (36 / 375)) calc(100vw * (20 / 375));
    }
    .modal_bg .content:not(.reservation_rt .content) .title {
        font-size: calc(100vw * (18 / 375));
        font-weight: 500;
        border-bottom: calc(100vw * (1 / 375)) solid #111;
        width: 100%;
        padding-bottom: calc(100vw * (17 / 375));
        margin-bottom: calc(100vw * (20 / 375));
    }
    .content .txt {
        width: 100%;
        display: flex;
        justify-content: space-between;
    }
    .modal_bg .content:not(.reservation_rt .content) .txt p {
        font-size: calc(100vw * (15 / 375));
        font-weight: 400;
        line-height: 1.5;
    }
    .modal_bg .content:not(.reservation_rt .content) .txt:not(:last-child) {
        margin-bottom: calc(100vw * (15 / 375));
        width: 100%;
    }
    .btnbx {
        position: initial;
        width: calc(100vw * (335 / 375));
        height: calc(100vw * (40 / 375));
        display: flex;
    }
    .btnbx button {
        border-radius: calc(100vw * (24 / 375));
        border: calc(100vw * (1 / 375)) solid #111;
        width: calc(100vw * (164 / 375));
        height: calc(100vw * (40 / 375));
    }
    .btnbx button:not(:last-child) {
        margin-right: calc(100vw * (8 / 375));
    }
    .btnbx button a {
        font-size: calc(100vw * (16 / 375));
        font-weight: 500;
    }
    .btnbx .reserve_btn {
        background: #111;
    }
    .btnbx .reserve_btn a {
        color: #fff;
    }
    .listBx {
        display: flex;
        position: relative;
        flex-direction: column;
        padding: 0;
    }
    .reservation .person_check {
        border-top: calc(100vw * (1 / 375)) solid #e6e6e6;
    }

    .roomBx {
        display: flex;
        position: relative;
    }
    .roomBx:not(:last-child) {
        margin-bottom: calc(100vw * (20 / 375));
    }
    .listBx:not(:last-child) {
        border-bottom: transparent;
        padding: 0;
        margin-bottom: calc(100vw * (60 / 375));
    }
    .listBx .imgbx {
        width: calc(100vw * (335 / 375));
        height: calc(100vw * (223 / 375));
    }
    .listBx .txtbx {
        position: initial;
        margin-left: 0;
        margin: calc(100vw * (19 / 375)) 0 calc(100vw * (20 / 375));
    }
    .top_txt {
        position: relative;
    }
    .top_txt .desc {
        margin-bottom: calc(100vw * (16 / 375));
        border-bottom: calc(100vw * (1 / 375)) solid #e6e6e6;
        padding-bottom: calc(100vw * (16 / 375));
    }
    .desc .txt_line {
        width: calc(100vw * (1 / 375));
        height: calc(100vw * (12 / 375));
        background: #cccccc;
        display: inline-block;
        margin: 0 calc(100vw * (8 / 375));
    }
    .desc span {
        display: inline-block;
    }
    .bot_txt {
        position: initial;
        bottom: 0;
    }
    .bot_txt h6 {
        font-size: calc(100vw * (12 / 375));
        font-weight: 400;
    }
    .bot_txt p {
        font-size: calc(100vw * (24 / 375));
        font-weight: 500;
    }
    .listBx .txtbx h2 {
        font-size: calc(100vw * (20 / 375));
        font-weight: 700;
        line-height: 1.5;
    }
    .listBx .top_txt .txtbx p {
        font-weight: 400;
        margin-top: 0;
        line-height: 1.5;
        display: inline-block;
    }

    li {
        cursor: pointer;
    }

    .blind {
        overflow: hidden;
        position: absolute;
        width: calc(100vw * (1 / 375));
        height: calc(100vw * (1 / 375));
        margin: calc(100vw * (-1 / 375));
        padding: 0;
        border: 0;
        white-space: nowrap;
        clip: rect(0, 0, 0, 0);
    }

    .button_wrap .month-move {
        border-radius: 50px;
        width: calc(100vw * (40 / 375));
        height: calc(100vw * (40 / 375));
        border: calc(100vw * (1 / 375)) solid #dddddd;
        position: relative;
    }
    .month-move .icowrap {
        width: calc(100vw * (8 / 375));
        height: calc(100vw * (8 / 375));
    }
    #month-prev .clk-prev {
        transform: translate(-50%, -50%) rotate(180deg);
    }
    #month-next .icowrap {
        transform: translate(-50%, -50%) rotate(0deg);
        position: absolute;
        left: 50%;
        top: 50%;
    }
    .dates_container .cal2 .subtit {
        justify-content: flex-end;
    }
    .button_wrap .month-move .clk {
        display: none;
    }
    .search_rooms {
        border-radius: calc(100vw * (50 / 375));
        background: #111111;
        color: #fff;
        padding: calc(100vw * (19 / 375)) calc(100vw * (56 / 375));
        font-size: calc(100vw * (16 / 375));
        font-weight: 700;
        width: calc(100vw * (160 / 375));
        height: calc(100vw * (48 / 375));
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .lst_divide {
        display: flex;
        align-items: center;
    }
    .lst_divide li {
        display: flex;
        align-items: center;
    }
    .divide_wrap {
        display: flex;
        align-items: center;
        gap: calc(100vw * (25 / 375));

        a {
            &:first-child {
                font-family: "AktivGrotesk", "Sans-Serif";
            }
        }
    }

    /* 공통 캘린더박스 */
    .dates_container {
        height: calc(100vw * (692 / 375));
        overflow-y: scroll;
        overflow-x: hidden;
    }
    .dates_container::-webkit-scrollbar {
        width: calc(100vw * (3 / 375));
        height: calc(100vw * (695 / 375));
    }
    .dates_container::-webkit-scrollbar-track {
        background: #D9D9D9;
    }
    .dates_container::-webkit-scrollbar-thumb {
        background: #343434;
    }
    .dates_container .contbx {
        width: calc(100vw * (335 / 375));
        margin: 0 auto;
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: calc(100vw * (40 / 375));
    }
    .mo_choice-reserv #tab3 {
        width: calc(100vw * (335 / 375));
        margin: 0 auto;
    }
    .mo_choice-reserv #tab3 .descbx {
        margin-top: calc(100vw * (12 / 375));
    }
    .mo_choice-reserv #tab3 .descbx p {
        font-size: calc(100vw * (12 / 375));
        font-weight: 400;
        color: #888888;
        line-height: 1.5;
    }
    .dates_container .date-month {
        margin: 0 auto;
    }
    .dates_container .subtit {
        margin-bottom: calc(100vw * (20 / 375));
        display: flex;
        align-items: center;
        width: calc(100vw * (335 / 375));
    }
    .dates_container .subtit p {
        font-size: calc(100vw * (18 / 375));
        font-weight: 500;
        font-family: "AktivGrotesk", "Sans-Serif";
    }
    .dates_container th {
        width: calc(100vw * (41 / 375));
        height: calc(100vw * (40 / 375));
        font-size: calc(100vw * (14 / 375));
        font-weight: 500;
        font-family: "AktivGrotesk", "Sans-Serif";
    }
    .dates_container td {
        width: calc(100vw * (49 / 375));
        height: calc(100vw * (46 / 375));
        vertical-align: middle;
    }
    .dates_container td.on div {
        background: #111;
    }
    .dates_container td.on div a {
        color: #fff;
    }
    .dates_container #month-next .clk,
    .dates_container #month-prev .clk {
        display: none;
    }
    .dates_container #month-next .clk-next {
        transform: rotate(180deg);
        top: 50%;
        transform: translate(-50%, -50%) rotate(180deg);
        left: 50%;
    }
    .month-move.on .clk-next {
        display: block;
    }
    .dates_container .cal a {
        font-size: calc(100vw * (15 / 375));
        font-weight: 500;
        font-family: "AktivGrotesk", "Sans-Serif";
    }
    .dates_container .month-move {
        border-radius: calc(100vw * (50 / 375));
        border: calc(100vw * (1 / 375)) solid #dddddd;
        width: calc(100vw * (24 / 375));
        height: calc(100vw * (24 / 375));
        position: relative;
    }
    .dates_container .month-move.on {
        border: calc(100vw * (1 / 375)) solid #111;
    }
    .dates_container #month-next.on .icowrap {
        transform: translate(-50%, -50%) rotate(180deg);
    }
    .dates_container #month-prev.on .icowrap {
        transform: translate(-50%, -50%) rotate(180deg);
    }
    .dates_container #month-prev {
        transform: rotate(0deg);
        margin-right: calc(100vw * (113 / 375));
        cursor: pointer;
    }
    .dates_container #month-next {
        margin-left: calc(100vw * (112 / 375));
        cursor: pointer;
        transform: rotate(180deg);
    }
    .dates_container #month-prev .clk-prev {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) rotate(0deg);
    }
    .dates_container td.on div {
        background: #111;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .dates_container td.on a {
        color: #fff;
    }
}