@charset "UTF-8";

/* 제목(h2/h3)은 common.css 의 h1~h6 전역 규칙(S-CoreDream)이 상속을 이기므로 직접 지정한다 */
/* ============================================================
   빠른예약 - PC/모바일 플로팅 버튼, 하단 고정바, 예약 패널
   디자인 기준: Figma 인플란트구미_홈페이지 (node 414-2007)
   ============================================================ */

:root {
  --rs_deep: #07252A;
  --rs_deep_2: #0A363D;
  --rs_teal: #0A7C79;
  --rs_mint: #5FD6CF;
  --rs_gold: #FFCC4A;
  --rs_gold_d: #ECAC06;
  --rs_line: #1C525C;
}

/* ------------------------------------------------------------
   1. 플로팅 버튼 (PC 5종 / 모바일 2종)
   ------------------------------------------------------------ */
.quick_fx {font-family: 'MICEGothic', 'Noto Sans KR', sans-serif;position: fixed;right: 20px;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);z-index: 120;}
.quick_fx ul > li {margin-bottom: 21px;}
.quick_fx ul > li:last-child {margin-bottom: 0;}
.quick_fx ul > li > a {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;width: 80px;height: 80px;border-radius: 12px;cursor: pointer;text-align: center;-webkit-box-shadow: 0 4px 14px rgba(0,0,0,.18);box-shadow: 0 4px 14px rgba(0,0,0,.18);-webkit-transition: all .25s;transition: all .25s;}
.quick_fx ul > li > a:hover {-webkit-transform: translateY(-2px);transform: translateY(-2px);-webkit-box-shadow: 0 8px 20px rgba(0,0,0,.25);box-shadow: 0 8px 20px rgba(0,0,0,.25);}
.quick_fx ul > li > a img {display: block;height: 32px;width: auto;vertical-align: middle;margin-bottom: 7px;}
/* 시안(Figma) 기준 : 14px / Bold / 자간 +0.28px / 행간 14px */
.quick_fx ul > li > a span {display: block;font-size: 14px;font-weight: 700;letter-spacing: 0.02em;line-height: 14px;white-space: nowrap;}

.quick_fx .qf_reserve > a {background: -webkit-linear-gradient(315deg, #FFD565 0%, #F3B720 50%, #ECAC06 100%);background: linear-gradient(135deg, #FFD565 0%, #F3B720 50%, #ECAC06 100%);color: #07252A;}
.quick_fx .qf_counsel > a {background: #0A7C79;color: #fff;}
.quick_fx .qf_kakao > a {background: #FEE601;color: #3E2A2E;}
.quick_fx .qf_naver > a {background: #00C735;color: #fff;}
.quick_fx .qf_map > a {background: #07252A;color: #fff;}

/* ------------------------------------------------------------
   2. 모바일 하단 고정바 (빠른예약 / 오시는 길)
   ------------------------------------------------------------ */
.quick_bar {display: none;font-family: 'MICEGothic', 'Noto Sans KR', sans-serif;}

/* ------------------------------------------------------------
   3. 빠른예약 패널
   ------------------------------------------------------------ */
/* z-index : 사이트 팝업(#pop 310)·모바일 메뉴(1001) 보다 위, 수가표 팝업(.fee_pop 9999) 보다 아래 */
.rs_dim {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.5);z-index: 1190;cursor: pointer;}
.rs_panel {font-family: 'MICEGothic', 'Noto Sans KR', sans-serif;position: fixed;top: 0;right: 0;width: 515px;max-width: 100%;height: 100%;background: var(--rs_deep);z-index: 1200;overflow-y: auto;-webkit-overflow-scrolling: touch;padding: 28px 32px 56px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-transform: translateX(100%);transform: translateX(100%);-webkit-transition: -webkit-transform .35s ease;transition: transform .35s ease;visibility: hidden;}
.rs_panel.open {-webkit-transform: translateX(0);transform: translateX(0);visibility: visible;}
.rs_panel * {-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}

.rs_close {position: absolute;top: 24px;left: 31px;width: 34px;height: 34px;border: 0;background: none;cursor: pointer;padding: 0;}
.rs_close:before, .rs_close:after {content: "";position: absolute;left: 4px;top: 16px;width: 26px;height: 2px;background: #fff;}
.rs_close:before {-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.rs_close:after {-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}

.rs_title {font-family: 'MICEGothic', 'Noto Sans KR', sans-serif;font-size: 42px;font-weight: 800;text-align: center;color: #fff;letter-spacing: -0.05em;line-height: 1.2;margin: 10px 0 28px;}
.rs_title em {font-style: normal;color: var(--rs_gold);}

.rs_panel .rs_label {display: block;font-size: 17px;font-weight: 700;color: var(--rs_mint);letter-spacing: -0.04em;margin: 0 0 11px;line-height: 1.3;}
.rs_panel .rs_label i {font-style: normal;color: #FF4D4F;margin-left: 3px;}
.rs_row {margin-bottom: 26px;}

/* 선택 시술 : 커스텀 드롭다운 (시안 기준)
   닫힘 16.7px 흰색 / 목록 rgba(7,34,38,.9) + #225C66 테두리, 항목 19px, 선택항목 민트 Bold */
.rs_sel {position: relative;}
.rs_sel_native {display: none;}
.rs_sel_btn {display: block;position: relative;width: 100%;height: 60px;background: var(--rs_deep_2);border: 1px solid var(--rs_mint);border-radius: 8px;color: #fff;font-size: 17px;font-family: inherit;font-weight: 400;text-align: left;letter-spacing: -0.02em;padding: 0 46px 0 18px;cursor: pointer;}
.rs_sel_btn:after {content: "";position: absolute;right: 18px;top: 50%;width: 14px;height: 9px;margin-top: -4px;background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23FFFFFF' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center;-webkit-transition: -webkit-transform .2s;transition: transform .2s;}
.rs_sel.open .rs_sel_btn:after {-webkit-transform: rotate(180deg);transform: rotate(180deg);}
.rs_sel_list {display: none;position: absolute;left: 0;top: 60px;width: 100%;background: #072226;border: 1px solid #225C66;border-radius: 5px;-webkit-box-shadow: 0 0 4px rgba(0,0,0,.18);box-shadow: 0 0 4px rgba(0,0,0,.18);padding: 11px 0;margin: 0;z-index: 5;list-style: none;}
.rs_sel.open .rs_sel_list {display: block;}
.rs_sel_list li {list-style: none;height: 47px;line-height: 47px;padding: 0 19px;font-size: 19px;color: #AAAAAA;letter-spacing: -0.02em;cursor: pointer;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.rs_sel_list li:hover {color: var(--rs_mint);background: rgba(0,0,0,.25);}
.rs_sel_list li.on {color: var(--rs_mint);font-weight: 700;background: rgba(0,0,0,.25);}

/* 희망 예약일 - 달력 */
.rs_cal {background: #fff;border-radius: 8px;padding: 8px 6px;min-height: 384px;}
.rs_cal .flatpickr-calendar.inline {width: 100%;max-width: 100%;-webkit-box-shadow: none;box-shadow: none;margin: 0;background: transparent;}
.rs_cal .flatpickr-months {padding: 2px 0 6px;}
.rs_cal .flatpickr-current-month {font-size: 17px;font-weight: 700;}
.rs_cal .flatpickr-innerContainer, .rs_cal .flatpickr-rContainer, .rs_cal .flatpickr-days {width: 100%;max-width: 100%;}
.rs_cal .dayContainer {width: 100%;min-width: 0;max-width: none;}
.rs_cal .flatpickr-day {max-width: none;height: 42px;line-height: 42px;font-size: 15px;color: #333;border-radius: 6px;}
.rs_cal .flatpickr-weekday {font-size: 13px;color: #888;font-weight: 600;}
.rs_cal .flatpickr-day.today {border-color: var(--rs_teal);}
.rs_cal .flatpickr-day.selected, .rs_cal .flatpickr-day.selected:hover {background: var(--rs_gold_d);border-color: var(--rs_gold_d);color: #07252A;font-weight: 700;}
.rs_cal .flatpickr-day.flatpickr-disabled, .rs_cal .flatpickr-day.prevMonthDay, .rs_cal .flatpickr-day.nextMonthDay {color: #D5D5D5;}
.rs_cal .flatpickr-day.rs_sun {color: #E05B5B;}
.rs_cal .flatpickr-day.rs_sun.prevMonthDay, .rs_cal .flatpickr-day.rs_sun.nextMonthDay {color: #F0B9B9;}
.rs_cal .flatpickr-day.rs_holiday {color: #E05B5B;text-decoration: line-through;}
.rs_cal_help {margin-top: 9px;font-size: 13px;color: #8FA3A6;letter-spacing: -0.04em;line-height: 1.5;}

/* 희망 시간 */
.rs_times {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin: 0 -4px -15px;}
.rs_times:after {content: "";display: block;clear: both;}
.rs_times button {width: calc(25% - 8px);height: 49px;margin: 0 4px 15px;border: 1px solid transparent;border-radius: 8px;background: #F9F9F9;color: #BDBDBD;font-size: 15px;font-weight: 600;font-family: inherit;cursor: pointer;padding: 0;letter-spacing: -0.02em;}
.rs_times button:hover {color: #6E8084;}
.rs_times button.on {background: #EFFFF8;border-color: var(--rs_mint);color: var(--rs_deep);font-weight: 700;}
.rs_times button[disabled] {opacity: .35;cursor: default;}
.rs_times_empty {font-size: 15px;color: #8FA3A6;letter-spacing: -0.04em;padding: 8px 0 2px;line-height: 1.5;}

/* 동의 */
.rs_agree {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;margin: 0 0 22px;}
.rs_panel .rs_agree input[type=checkbox] {display: none;}
.rs_panel .rs_agree input[type=checkbox] + label {padding-left: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;font-size: 15px;color: #C1C8C9;letter-spacing: -0.045em;text-align: left;-webkit-box-flex: 1;-ms-flex: 1;flex: 1;line-height: 1.4;}
.rs_panel .rs_agree input[type=checkbox] + label:before {content: none;display: none;}
.rs_agree .rs_check {-webkit-box-flex: 0;-ms-flex: 0 0 24px;flex: 0 0 24px;width: 24px;height: 24px;margin-right: 10px;background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 12.5l6 6L21 5' stroke='%23455B5E' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: center;}
.rs_panel .rs_agree input[type=checkbox]:checked + label .rs_check {background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 12.5l6 6L21 5' stroke='%235FD6CF' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");}
.rs_agree label i {font-style: normal;color: #FF4D4F;margin-left: 2px;}
.rs_agree .rs_agree_view {-webkit-box-flex: 0;-ms-flex: 0 0 auto;flex: 0 0 auto;margin-left: 12px;font-size: 14px;color: #C1C8C9;text-decoration: underline;cursor: pointer;}

/* 성함 / 연락처 */
.rs_field {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 74px;background: var(--rs_deep_2);border: 1px solid var(--rs_line);border-radius: 8px;padding: 0 22px;margin-bottom: 14px;}
.rs_panel .rs_field > label {-webkit-box-flex: 0;-ms-flex: 0 0 92px;flex: 0 0 92px;padding-left: 0;color: #fff;font-size: 16px;font-weight: 700;letter-spacing: 0.08em;text-align: left;}
.rs_panel .rs_field > label i {font-style: normal;color: #FF4D4F;margin-left: 2px;letter-spacing: 0;}
.rs_panel .rs_field > input[type="text"], .rs_panel .rs_field > input[type="tel"] {-webkit-box-flex: 1;-ms-flex: 1;flex: 1;width: 100%;max-width: none;min-width: 0;height: 40px;background: none;border: 0;padding: 0;color: #fff;font-size: 15px;font-family: inherit;letter-spacing: -0.03em;}
.rs_panel .rs_field > input::-webkit-input-placeholder {color: #6E8084;}
.rs_panel .rs_field > input::-moz-placeholder {color: #6E8084;}
.rs_panel .rs_field > input:-ms-input-placeholder {color: #6E8084;}
.rs_panel .rs_field > input::placeholder {color: #6E8084;}

/* 예약신청 버튼 */
.rs_submit {display: block;width: 264px;max-width: 100%;height: 67px;margin: 34px auto 0;border: 0;border-radius: 8px;background: -webkit-linear-gradient(315deg, #FFD565 0%, #F3B720 55%, #ECAC06 100%);background: linear-gradient(135deg, #FFD565 0%, #F3B720 55%, #ECAC06 100%);color: #07252A;font-size: 24px;font-weight: 800;font-family: inherit;letter-spacing: -0.05em;cursor: pointer;-webkit-transition: -webkit-filter .2s;transition: filter .2s;}
.rs_submit:hover {-webkit-filter: brightness(1.06);filter: brightness(1.06);}
.rs_submit[disabled] {opacity: .6;cursor: default;}

/* ------------------------------------------------------------
   4. 예약완료 알림
   ------------------------------------------------------------ */
.rs_done {font-family: 'MICEGothic', 'Noto Sans KR', sans-serif;display: none;position: fixed;top: 0;right: 0;width: 515px;max-width: 100%;height: 100%;background: rgba(7,37,42,.55);z-index: 1210;}
.rs_done.on {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
.rs_done_box {width: 86%;max-width: 420px;background: var(--rs_deep);border: 2px solid var(--rs_gold);border-radius: 10px;padding: 26px 24px 22px;text-align: center;}
.rs_done_ico {display: block;width: 54px;height: 54px;margin: 0 auto 14px;background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='54' height='54' viewBox='0 0 24 24'%3E%3Cpath d='M3 12.5l6 6L21 5' stroke='%2302878C' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: center;background-size: contain;}
.rs_done_box .rs_done_t {font-size: 19px;font-weight: 700;color: #fff;letter-spacing: -0.05em;margin-bottom: 8px;line-height: 1.4;}
.rs_done_box .rs_done_t b {color: var(--rs_gold);font-weight: 700;}
.rs_done_box .rs_done_d {font-size: 14px;font-weight: 400;color: #A9B6B8;letter-spacing: -0.05em;line-height: 1.5;margin-bottom: 18px;}
.rs_done_box .rs_done_d b {color: #fff;font-weight: 600;}
.rs_done_btn {display: block;width: 100%;height: 46px;border: 0;border-radius: 7px;background: var(--rs_gold);color: var(--rs_deep);font-size: 17px;font-weight: 800;font-family: inherit;letter-spacing: -0.04em;cursor: pointer;}

/* ------------------------------------------------------------
   5. 개인정보 수집이용 동의 레이어
   ------------------------------------------------------------ */
/* 시안 기준 : 흰 박스 356x580, 왼쪽 바깥에 7px 세로바(위 절반 골드 / 아래 절반 딥)
   위치는 화면 중앙이 아니라 예약 패널 바로 왼쪽(패널 515px + 간격 19px) */
.rs_terms {font-family: 'MICEGothic', 'Noto Sans KR', sans-serif;display: none;position: fixed;top: 50%;right: 534px;width: 356px;overflow: visible;-webkit-transform: translateY(-50%);transform: translateY(-50%);background: #fff;z-index: 1220;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
.rs_terms.on {display: block;}
.rs_terms_body {padding: 18px;max-height: 86vh;overflow-y: auto;}
.rs_terms_bar {position: absolute;left: -7px;top: 0;width: 7px;height: 100%;background: -webkit-linear-gradient(top, #FFCC4A 50%, #07252A 50%);background: linear-gradient(180deg, #FFCC4A 50%, #07252A 50%);}
.rs_terms h2 {font-family: 'MICEGothic', 'Noto Sans KR', sans-serif;font-size: 27px;font-weight: 700;color: var(--rs_deep);text-align: center;letter-spacing: -0.02em;margin: 16px 0 12px;line-height: 1.2;}
.rs_terms h3 {font-family: 'MICEGothic', 'Noto Sans KR', sans-serif;font-size: 15px;font-weight: 700;color: #225C66;text-align: center;letter-spacing: -0.03em;margin: 15px 0 8px;line-height: 1.3;}
.rs_terms p {font-size: 11px;color: #474747;line-height: 1.55;letter-spacing: -0.02em;font-weight: 400;}
.rs_terms .rs_terms_sub {text-align: center;color: #225C66;font-size: 15px;font-weight: 700;letter-spacing: -0.03em;margin-bottom: 11px;}
.rs_terms .rs_terms_c {text-align: center;}
.rs_terms ul {list-style: disc;padding-left: 17px;margin: 4px 0 0;}
.rs_terms li {font-size: 11px;color: #474747;line-height: 1.55;letter-spacing: -0.03em;list-style: disc;}
.rs_terms hr {border: 0;border-top: 1px solid #DCDCDC;margin: 15px 0 0;height: 0;}
.rs_terms_close {position: absolute;top: 15px;right: 16px;width: 22px;height: 22px;border: 0;background: none;cursor: pointer;padding: 0;}
.rs_terms_close:before, .rs_terms_close:after {content: "";position: absolute;left: 0;top: 10px;width: 22px;height: 2px;background: #07252A;}
.rs_terms_close:before {-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.rs_terms_close:after {-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}

/* ------------------------------------------------------------
   6. 모바일
   ------------------------------------------------------------ */
@media (max-width: 767px) {
  .quick_fx {right: 13px;top: auto;bottom: 77px;-webkit-transform: none;transform: none;}
  .quick_fx ul > li {margin-bottom: 13px;}
  .quick_fx ul > li.qf_pconly {display: none;}
  .quick_fx ul > li > a {width: 64px;height: 64px;border-radius: 10px;}
  .quick_fx ul > li > a img {height: 26px;margin-bottom: 5px;}
  .quick_fx ul > li > a span {font-size: 12px;letter-spacing: 0.02em;}

  .quick_bar {display: -webkit-box;display: -ms-flexbox;display: flex;position: fixed;left: 0;right: 0;bottom: 0;height: 62px;z-index: 120;padding-bottom: constant(safe-area-inset-bottom);padding-bottom: env(safe-area-inset-bottom);}
  .quick_bar > a {-webkit-box-flex: 1;-ms-flex: 1;flex: 1;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;font-size: 16px;font-weight: 700;letter-spacing: -0.05em;cursor: pointer;}
  .quick_bar > a img {height: 21px;width: auto;vertical-align: middle;margin-right: 8px;}
  .quick_bar .qb_reserve {background: -webkit-linear-gradient(315deg, #FFD565 0%, #F3B720 50%, #ECAC06 100%);background: linear-gradient(135deg, #FFD565 0%, #F3B720 50%, #ECAC06 100%);color: #07252A;}
  .quick_bar .qb_map {background: #07252A;color: #fff;}

  /* 하단 고정바에 가려지는 영역 확보.
     #wrap 에 주면 메인 비주얼이 62px 밀려 내려가 네이버 캐러셀 블록(.Item-list)이 헤더 아래로 드러난다. */
  body {padding-bottom: 62px;}

  .rs_panel {width: 100%;padding: 22px 22px 40px;}
  .rs_done {width: 100%;}
  .rs_close {top: 18px;left: 18px;width: 28px;height: 28px;}
  .rs_close:before, .rs_close:after {left: 2px;top: 13px;width: 24px;}
  .rs_title {font-size: 30px;margin: 6px 0 20px;}
  .rs_panel .rs_label {font-size: 15px;margin-bottom: 8px;}
  .rs_row {margin-bottom: 18px;}
  .rs_sel_btn {height: 48px;font-size: 15px;}
  .rs_sel_list {top: 48px;padding: 8px 0;}
  .rs_sel_list li {height: 40px;line-height: 40px;font-size: 15px;padding: 0 16px;}
  .rs_cal {min-height: 0;padding: 6px 4px;}
  .rs_cal .flatpickr-day {height: 36px;line-height: 36px;font-size: 14px;}
  .rs_times {margin: 0 -3.5px -10px;}
  .rs_times button {width: calc(25% - 7px);height: 40px;margin: 0 3.5px 10px;font-size: 14px;}
  .rs_agree {margin-bottom: 16px;}
  .rs_panel .rs_agree input[type=checkbox] + label {font-size: 13px;}
  .rs_agree .rs_check {-ms-flex: 0 0 20px;flex: 0 0 20px;width: 20px;height: 20px;margin-right: 7px;}
  .rs_agree .rs_agree_view {font-size: 13px;margin-left: 8px;}
  .rs_field {height: 56px;padding: 0 16px;margin-bottom: 11px;}
  .rs_panel .rs_field > label {-ms-flex: 0 0 74px;flex: 0 0 74px;font-size: 14px;}
  .rs_panel .rs_field > input[type="text"], .rs_panel .rs_field > input[type="tel"] {font-size: 14px;}
  .rs_submit {width: 100%;height: 54px;font-size: 20px;margin-top: 24px;}

  /* 모바일 : 시안 275x439, 화면 중앙 */
  /* 모바일 시안 : 박스 275x439(거의 전체폭), 세로바 대신 하단 5px 골드바 */
  .rs_terms {right: auto;left: 50%;width: calc(100% - 44px);max-width: 400px;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);}
  .rs_terms_bar {left: 0;top: auto;bottom: 0;width: 100%;height: 5px;background: #FFCC4A;}
  .rs_terms_body {padding: 16px;max-height: 80vh;}
  .rs_terms h2 {font-size: 22px;margin: 12px 0 10px;}
  .rs_terms h3 {font-size: 14px;margin: 13px 0 7px;}
  .rs_terms .rs_terms_sub {font-size: 13px;margin-bottom: 9px;}
}