/*
 * reservation-link
 */
.pageOutWrap.realTimeReservation {width:100vw;min-height:100vh;padding:100px 0;background-color:#f2e9f5;line-height:1.1;letter-spacing:-0.05em;box-sizing:border-box;}
.realTimeReservation .flexWrap {display:flex;justify-content:center;gap:170px;}
.realTimeReservation .pageTitle {font-size:48px;font-family:"pretendardEB";color:#212121;margin-bottom:10px;text-align:center;}
.realTimeReservation .pageSubTitle {font-size:33px;font-family:"pretendardM";color:#8c8c8c;margin-bottom:30px;text-align:center;}
.realTimeReservation .itemListWrap {margin-bottom:20px;}
.realTimeReservation .itemListWrap:last-child {margin-bottom:0;}
.realTimeReservation .listTitle {font-size:22px;font-family:"pretendardB";color:#212121;margin-bottom:12px;text-align:center;}
.realTimeReservation .itemList {display:grid;grid-template-columns:repeat(6,120px);justify-content:center;gap:13px 12px;margin-bottom:24px; max-width:100%;}
.realTimeReservation .itemList.only {grid-template-columns:repeat(1,120px);}
.realTimeReservation .itemList .item {font-family:"pretendardB";display:flex;justify-content:center; align-items:center;width:120px;height:38px;font-size:14px;color:#fff;border-radius:20px;background-color:#c692e1; box-sizing:border-box;}
/* background:#c692e1 url("/app/layout/web/images/icon_kakao_w.png") no-repeat;background-position:13px center; */

@media (max-width:1100px) {
    .realTimeReservation .itemList {grid-template-columns:repeat(5,130px);}
    .realTimeReservation .itemList.only {grid-template-columns:auto;}
}
@media (max-width:768px) {
    .pageOutWrap.realTimeReservation {padding: 0;}
    .realTimeReservation .flexWrap {gap:4px;}
    .realTimeReservation .contentsWrap {max-width:768px;}
    .realTimeReservation .pageTitle {font-size:26px;}
    .realTimeReservation .pageSubTitle {font-size:15px;}
    .realTimeReservation .listTitle {font-size:16px;}
    .realTimeReservation .itemListWrap {max-width:500px;margin:0 auto 20px;}
    .realTimeReservation .itemList {grid-template-columns:repeat(auto-fill,80px); gap:5px 3px;margin-bottom:15px;}
    .realTimeReservation .itemList.only {grid-template-columns:auto;}
    .realTimeReservation .itemList .item {width:80px;height:20px;font-size:11px;}
}

/*
 * kakaotalk
 */
.kakaoPageOutWrap {background-color: #f8f7ec; padding: 0;}
.kakaoWrap {gap: 50px;width: 100%;max-width: 1230px;margin: 0 auto;padding: 100px 15px; box-sizing: border-box; color: #212121;font-family: "pretendardM";}
.kakaoWrap .kakao {display: flex;gap: 50px;}
.kakaoWrap .kakao .inner {width: 320px;flex-shrink: 0;}
.kakaoWrap .kakao .inner img  {width: 100%;display: block;}
.kakaoWrap .kakao .kakaoTitle {margin-bottom: 40px;}
.kakaoWrap .kakao .kakaoTitle .mainText {display: flex;align-items: center;gap: 10px; margin-bottom: 8px;}
.kakaoWrap .kakao .kakaoTitle .mainText .title {font-size: 48px;font-family: "pretendardEB";}
.kakaoWrap .kakao .kakaoTitle .subText {font-size: 33px;color: #8c8c8c;}
.kakaoWrap .kakaoWrapPc {flex: 1;}
.kakaoWrap .kakaoListWrap .title {font-family: "pretendardB";font-size: 22px;margin-bottom: 15px;}
.kakaoWrap .kakaoListWrap .gridWrapper { margin-bottom: 20px; width: 100%}
.kakaoWrap .kakaoListWrap .grid {display: flex;flex-wrap: wrap; gap: 10px;}
.kakaoWrap .kakaoListWrap .grid .gridCell {display: flex;align-items: center; gap: 8px; min-width: 128px;padding:9px 14px; box-sizing: border-box; color: #361413; font-size: 14px;font-family: "pretendardB"; border: 1px solid #dfcb00; border-radius: 50px; background-color:#fbe400; }



@media (max-width:1330px) {
    .kakaoWrap .kakao .kakaoTitle .mainText .title {font-size: 40px;}
    .kakaoWrap .kakao .kakaoTitle .subText {font-size: 28px;}
}

@media (max-width:1024px) {
    .kakaoWrap .kakao {gap: 30px;padding: 0 25px;}
    .kakaoWrap .kakao .inner {width: 230px;}
    .kakaoWrap .kakao .kakaoTitle {margin-bottom: 20px;}
    .kakaoWrap .kakao .kakaoTitle .mainText .title {font-size: 28px;}
    .kakaoWrap .kakao .kakaoTitle .mainText .logo{width: 34px;}
    .kakaoWrap .kakao .kakaoTitle .subText {font-size: 20px;}
    .kakaoWrap .kakaoListWrap .title {font-size: 18px;}
    .kakaoWrap .kakaoListWrap .grid {gap: 5px;}
    .kakaoWrap .kakaoListWrap .grid .gridCell {font-size: 12px; min-width: 122px; gap: 5px; text-decoration:none;}
}
@media (max-width:768px) {
    .kakaoWrap {padding: 20px 0;}
    .kakaoWrap .kakao {display: flex;flex-direction: column; padding: 0 12px; gap: 20px;}
    .kakaoWrap .kakao .inner {width: 120px;}
    .kakaoWrap .kakao .kakaoTitle {margin-bottom: 0;}
    .kakaoWrap .kakao .kakaoTitle .mainText {margin: 8px 0; gap: 5px;}
    .kakaoWrap .kakao .kakaoTitle .mainText .title {font-size: 22px;}
    .kakaoWrap .kakao .kakaoTitle .mainText .logo {width: 27px;}
    .kakaoWrap .kakao .kakaoTitle .subText {font-size: 14px;}
    .kakaoWrap .kakaoWrapMobile {display: flex;gap: 8px;justify-content: center; padding-inline: 18px; box-sizing: border-box;}
    .kakaoWrap .kakaoListWrap .title {font-size: 16px;margin-bottom: 10px;}
    .kakaoWrap .kakaoListWrap .gridWrapper {margin-bottom: 15px;}
    .kakaoWrap .kakaoListWrap .grid {gap: 5px 3px;}
    .kakaoWrap .kakaoListWrap .grid .gridCell {width: calc(100% / 5 - 3px); min-width: auto; font-size: 9px; padding: 4px 4px; gap: 2px;}
    .kakaoWrap .kakaoListWrap .grid .gridCell .icon {width: 10px;}
}


@media (max-width:400px) {
    .kakaoWrap .kakaoListWrap .grid .gridCell {width: calc(100% / 4 - 3px); }
}

/*
 * noinsuPrice
 */
 .noinsuCostTable {width:100%; max-width:1800px; padding:15px; box-sizing:border-box; margin:0 auto; overflow-x:scroll;}
.noinsuCostTable table {width:100%; border-collapse:collapse;}
.noinsuCostTable table th {font-size:16px; background-color:#f2f2f2; padding:10px; border:1px solid #cccccc;}
.noinsuCostTable table th.center.aligned {text-align:center;}
.noinsuCostTable table td {font-size:14px; background-color:#ffffff; padding:7px; border:1px solid #cccccc;}
.noinsuCostTable table td.center.aligned {text-align:center;}

@media (max-width:768px){
    .noinsuCostTable table {min-width:1600px;}
    .noinsuCostTable table th {font-size:14px; padding:5px;}
    .noinsuCostTable table th.center.aligned {text-align:center;}
    .noinsuCostTable table td {font-size:12px; padding:3px;}
    .noinsuCostTable table td.center.aligned {text-align:center;}
}