@charset "utf-8";

/** 추천결과지 (예약후) **/
.reservation_tit_box .label_wrap { display: flex; justify-content: flex-start; align-items: center; }
.reservation_tit_box .label { display: inline-block; height: 22px; padding: 0 8px; font-size: 13px; font-weight: 500; color: var(--color-black-40); line-height: 22px; background: #eff0f6; border-radius: 4px; margin-right: 8px; }
.reservation_tit_box .cont_title { font-size: var(--font-large-xl); font-weight: 700; line-height: 34px; margin-top: 8px; }
.reservation_tit_box .cont_desc { font-size: var(--font-regular); font-weight: 400; color: var(--color-black-70); line-height: 20px; margin-top: 8px; }
.reservation_view_box { position: relative; width: 100%; padding: 18px 20px; background: #ffffff; border-left: 8px solid #0d99ff; border-radius: var(--border-radius-s); -webkit-box-shadow: 0 0 24px 0 rgba(0,0,0,0.1); box-shadow: 0 0 24px 0 rgba(0,0,0,0.1); margin-top: 24px; }
.reservation_view_box .tag { display: inline-block; font-size: var(--font-small); font-weight: 700; color: var(--color-white); line-height: 20px; padding: 0 8px; background: #0d99ff; border-radius: 10px; }
.reservation_view_box .date { font-size: var(--font-medium); font-weight: 700; line-height: 22px; margin-top: 8px; }
.reservation_view_box .btn_link { position: absolute; top: 18px; right: 20px; font-size: var(--font-small); font-weight: 400; color: var(--color-black-40); line-height: 16px; border-bottom: 1px solid var(--color-black-40); z-index: 5; }

.survey_list li { margin-bottom: 36px; }
.survey_list li:last-of-type { margin-bottom: 0; }
.survey_list .survey_title h3 { font-size: var(--font-medium); font-weight: 700; line-height: 26px; }
.survey_list .survey_title h3 em { display: inline-block; font-size: 13px; font-weight: 500; color: var(--color-main); vertical-align: 2px; margin-left: 4px; }
.survey_list .survey_title p { font-size: var(--font-regular); font-weight: 400; color: var(--color-black-70); line-height: 20px; word-break: keep-all; margin-top: 8px; }
.survey_list .input_box, .survey_list .textarea_box { width: 100%; margin-top: 16px; }
.survey_list .input_box input[type=text] { width: 100%; height: 56px; font-size: 15px; font-weight: 400; line-height: 22px; padding: 0 20px; border: var(--border); border-radius: var(--border-radius); transition: all 0.1s ease-in-out; }
.survey_list .textarea_box label { position: relative; display: block; width: 100%; height: 140px; padding: 16px 20px 40px; border: var(--border); border-radius: var(--border-radius); transition: all 0.1s ease-in-out; }
.survey_list .textarea_box textarea { width: 100%; height: 100%; font-size: 15px; font-weight: 400; line-height: 22px; border: none; resize: none; outline: none; overflow-x: hidden; }
.survey_list .textarea_box textarea::-webkit-scrollbar { width: 2px; -webkit-appearance: none; }
.survey_list .textarea_box textarea::-webkit-scrollbar-track { width: 2px; background: transparent; }
.survey_list .textarea_box textarea::-webkit-scrollbar-thumb { width: 2px; background: var(--color-black-40); border-radius: 2px; }
.survey_list .textarea_box .count { position: absolute; right: 20px; bottom: 10px; font-size: 15px; font-weight: 400; color: #6e7191; line-height: 22px; }
.survey_list .input_box input[type=text]::placeholder,
.survey_list .textarea_box textarea::placeholder { color: rgba(110, 113, 145, 0.47); }
.survey_list .input_box.focus input[type=text],
.survey_list .textarea_box.focus label { border: var(--border-main); }
.survey_list .survey_upload { display: grid; gap: 12px; grid-template-columns: repeat(3, 96px); margin-top: 16px; }
.upload_item { position: relative; width: 100%; height: 96px; border-radius: var(--border-radius); overflow: hidden; }
.upload_item input[type="file"] { display: none; }
.upload_item input[type="file"] + label { position: relative; display: block; width: 100%; height: 100%; background: #eff0f6; }
.upload_item input[type="file"] + label::before { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 30px; height: 30px; background: url(../../image/icon/icon_pay_plus.svg) no-repeat center center,#ffffff; border-radius: 50%; content: ''; display: block; }
.upload_item .preview_wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #ffffff; border-radius: var(--border-radius); overflow: hidden; z-index: 1; }
.upload_item .preview_wrap img { width: 96px; height: 96px; object-fit: cover; z-index: 1; }
.upload_item .btn_delete { position: absolute; right: 6px; top: 6px; width: 24px; height: 24px; background: url(../../image/btn/btn_close_white.svg) no-repeat center center, rgba(0,0,0,0.7); background-size: 14px; border-radius: 50%; text-indent: -9999px; display: block; z-index: 5; }