@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
/* ===============================================================
    * Reset
=============================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;overflow-x: auto;}ol, ul {list-style: none;}blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}a {text-decoration: none; color: inherit;}
img {vertical-align: top;}input[type="date"] {border: none;}
input[type="text"],input[type="tel"],input[type="email"],input[type="password"],input[type="search"],input[type="date"],
textarea,button {font-family: Arial, Helvetica, sans-serif; appearance: none;-webkit-appearance: none;outline:none;background: none;}button {cursor: pointer; border:none; border-radius: 0; padding: 0; margin: 0;}
select {appearance: none;-webkit-appearance: none;outline:none;}select::-ms-expand {display: none;}* {box-sizing: border-box;}
textarea {font-size: 12px; line-height: 18px;}
::placeholder {font-family: 'Noto Sans CJK KR', sans-serif;}
/* ===============================================================
    * Color
=============================================================== */
/* specific bg, color */
.admin-login.bg-on {background: #a68051 !important;}
.login-btn.bg-on {background: #a68051 !important;}
.all.bg-on {background: #a68051 !important;}
header.bg-on {background: #a68051 !important;}
.header-fix.bg-on {background: #a68051 !important;}
.mobile-btn.bg-on {background: #a68051 !important;}
.cm-content.bg-on {background: #a68051 !important;}
/* basic bg, color -> 계정별 color-xxx.css 파일에서 수정필요 */
.color-on {color: #518aa6 !important;}
.color-off {color: #999 !important;}
.bg-on {background: #518aa6 !important; color: #fff !important;}
.bg-off {background: #aaa !important; color: #fff !important;}
/* 버튼만 호버효과 */
.btn-basic.bg-on:hover {background: #1a4559 !important;}
.info-tabs li:hover {background: #1a4559 !important; color: #fff;}
.btn-sm {display: inline-block; background: #518aa6; height: 22px; line-height: 22px; padding: 0 10px; border-radius: 22px; color: #fff; font-size: 12px; text-align: center; transition: .3s; cursor: pointer;}
.btn-sm:hover {background: #1a4559;}
.btn-sm-edit {background: #999;}
.btn-sm-edit:hover {background: #666;}
.btn-sm-del {background: #D9998B;}
.btn-sm-del:hover {background: #B07F74;}
.btn-hover {background: #518aa6; transition: .3s; color: #fff;}
.btn-hover:hover {background: #1a4559;}
.btn-table {display: inline-block; padding: 4px 6px; border: 1px solid #e0e0e0; margin-right: 5px; color: #999; font-size: 12px; box-shadow: 0px 0px 3px 0px rgb(94 85 67 / 20%);}
.btn-table:hover {color: #fff; border-color: #1a4559; background: #1a4559;}
/* ===============================================================
    * Layout & Font & Width
=============================================================== */
html {min-width: 1200px;}
body {font-family: 'Noto Sans CJK KR', sans-serif; font-size: 12px; line-height: 1; font-weight: 400; color: #999;}
.clb:after {content:''; display: block; clear:both;}
.clear:after {content:''; display: block; clear:both;}
.fl {float:left;} .fr {float:right;}
.ttu {text-transform: uppercase;}.tal {text-align: left;}.tac {text-align: center;}.tar {text-align: right;}
.none-pc {display: none;}
::-webkit-scrollbar-track {border-radius: 10px; background-color: #d0d0d0;}
::-webkit-scrollbar {height: 6px; width: 6px; background-color: #F5F5F5;}
::-webkit-scrollbar-thumb {border-radius: 10px; background-color: #888;}
/* ===============================================================
    * loading
=============================================================== */
#loading {z-index: 999999; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: rgba(34,34,34,.8);}
.loading {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);text-align: center;}
.loading p {font-size: 40px; color: #fff; margin-bottom: 20px;}
.loading span {display: inline-block;background: #a68051;box-shadow: 1px 2px 3px #999;height: 10px;width: 10px;  border-radius: 50%;animation: wave 2s ease  infinite;transition: all 500ms ease;}
.loading span:nth-child(1) {animation-delay: 0;}
.loading span:nth-child(2) {animation-delay: 100ms;}
.loading span:nth-child(3) {animation-delay: 200ms;}
.loading span:nth-child(4) {animation-delay: 300ms;}
.loading span:nth-child(5) {animation-delay: 400ms;}
.loading span:nth-child(6) {animation-delay: 500ms;}
@keyframes wave{
    0%, 40%, 100% {transform: translate(0, 0);background-color: #a68051;}
    10% { transform: translate(0, -15px); background-color: #eee;}
}
@media (max-width: 820px){
    .loading p {font-size: 20px;}
}
/* ===============================================================
    * Content Common Style
=============================================================== */
.info-list {margin-top: 20px; padding: 10px 0 20px;}
.info-item {margin-bottom: 10px;}
.form-tit {display: inline-block; width: 100px; font-size: 13px; color: #666; vertical-align: middle;}
.info-desc {display: inline-block; margin-left: 10px; vertical-align: middle;}
.form-tit.vat {vertical-align: top; margin-top: 10px;}
.label-vat {display: inline-block; vertical-align: top; margin-top: 10px;}
.valign-t {vertical-align: top;}
.dib {display: inline-block; width: 40%;}
.dib-half {display: inline-block; width: 49%;}
.display_ib {display: inline-block;}
.dpb {display: block;}
.mauto {display: block; margin: 0 auto;}
/* ===============================================================
    * Form Style
=============================================================== */
/* 기본 */
::placeholder {font-size: 12px; color: #999;}
.ip-basic {width: 300px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px; font-size: 12px; color: #999; padding: 0 10px;}
.ip-basic_2 {width: 563px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px; font-size: 12px; color: #999; padding: 0 10px;}
.ip-short {width: 160px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px; font-size: 12px; color: #999; padding: 0 10px;}
.ip-sm {width: 80px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px; font-size: 12px; color: #999; padding: 0 10px;}
input.ip-date {width: 160px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px; font-size: 12px; color: #999; padding: 0 10px; margin-bottom: 4px;}
.search-name {position: relative;}
.search-name button {position: absolute; left: 5px; top: 7px; font-size: 12px; color: #999;}
.ip-search__name {width: 240px; height: 28px; line-height: 26px; border: 1px solid #e0e0e0; border-radius: 4px; color: #999; padding-left: 25px; }
/* 셀렉트 */
.sel-basic {position: relative; width: 100px; height: 32px; padding: 0 5px; border: 1px solid #e0e0e0; border-radius: 4px; background: url(/img/select-arrow.png) no-repeat right 5px top 50% / 8px 5px; font-size: 12px; color: #999;}
.sel-short {position: relative; width: 60px; height: 28px; padding: 0 5px; border: 1px solid #e0e0e0; border-radius: 4px; background: url(/img/select-arrow.png) no-repeat right 5px top 50% / 8px 5px; font-size: 12px; color: #999;}
.sel-long {position: relative; width: 230px; height: 32px; padding: 0 5px; border: 1px solid #e0e0e0; border-radius: 4px; background: url(/img/select-arrow.png) no-repeat right 5px top 50% / 8px 5px; font-size: 12px; color: #999;}
.sel-auto {position: relative; width: auto; height: 32px; padding: 0 30px 0 5px; border: 1px solid #e0e0e0; border-radius: 4px; background: url(/img/select-arrow.png) no-repeat right 5px top 50% / 8px 5px; font-size: 12px; color: #999;}
select option {font-size: 12px; color: #999;}
/* 버튼 */
.btn-basic {width: 70px; height: 32px; text-align: center; font-size: 12px; border-radius: 4px; vertical-align: top; transition: .3s;}
.btn-inner {display: inline-block; width: 50px; height: 24px; line-height: 24px; text-align: center; font-size: 12px; border-radius: 4px; vertical-align: top;}
.plus-btn {position: relative; display: inline-block; margin-left: 5px; width: 14px; height: 14px; border-radius: 50%; vertical-align: top;}
.btn-center {display: block; margin: 0 auto;}
.btn-text {display: inline-block; padding: 0px 6px; border: 1px solid #222; margin-right: 5px; color: #fff; box-shadow: 0px 0px 3px 0px rgb(94 85 67 / 20%); background: #222; vertical-align: middle;}

/* 시작일 date, 종료일 date */
.info-date__st,
.info-date__en {position: relative; display: inline-block; width: 210px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px; font-size: 12px; color: #999; padding: 4px 0 0 60px;}
.info-date__st:after {content: '시작일'; position: absolute; left: 10px; top: 8px; font-size: 12px;color: #999;}
.info-date__en:after {content: '종료일'; position: absolute; left: 10px; top: 8px; font-size: 12px;color: #999;}
/* 기본, 최대 명 */
.info-item__man p {position: relative; display: inline-block; width: 160px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px;}
.info-item__man p input[type="text"] {width: 70px; height: 20px; border: none; border-bottom: 1px solid #e0e0e0; margin-left: 60px; margin-top: 5px; color: #999; text-align: center;}
.info-item__man p.ip-man__base:before {content: '기본'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__man p.ip-man__max:before {content: '최대'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__man p.ip-man__card:before {content: '카드'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__man p.ip-man__card:after {content: '%'; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__man p.ip-man__reserve:before {content: '예약대행'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__man p.ip-man__reserve:after {content: '%'; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__man p.ip-man__child:before {content: '유아/아동'; position: absolute; left: 5px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__man p.ip-man__baby:before {content: '동반유아'; position: absolute; left: 5px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__man p.ip-man__base:after,
.info-item__man p.ip-man__max:after,
.info-item__man p.ip-man__baby:after {content: '명'; position: absolute; right: 5px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
/* 가격, 원 */
.info-item__price p {position: relative; display: inline-block; width: 160px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px;}
.info-item__price p input[type="text"] {width: 70px; height: 20px; border: none; border-bottom: 1px solid #e0e0e0; margin-left: 60px; margin-top: 5px; color: #999; text-align: center;}
.info-item__price p.ip-price__adult:before {content: '성인'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__price p.ip-price__child:before {content: '아동'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__price p.ip-price__baby:before {content: '유아'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__price p.ip-price__adult:after,
.info-item__price p.ip-price__child:after,
.info-item__price p.ip-price__baby:after {content: '원'; position: absolute; right: 5px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
/* 기타,  */
.info-item__etc p {position: relative; display: inline-block; width: 160px; height: 32px; border: 1px solid #e0e0e0; border-radius: 4px;}
.info-item__etc p input[type="text"] {width: 90px; height: 20px; border: none; border-bottom: 1px solid #e0e0e0; margin-left: 60px; margin-top: 5px; color: #999; text-align: center;}
.info-item__etc p.ip-etc__adult:before {content: '성인'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__etc p.ip-etc__child:before {content: '아동'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
.info-item__etc p.ip-etc__baby:before {content: '유아'; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #999;}
/* 체크박스 */
.chk-basic {opacity: 0; visibility: hidden; position: absolute; left: 0; top: 0;}
.chk-basic__label {position: relative; display: inline-block; vertical-align: middle; cursor: pointer; padding-left: 20px; margin: 4px;}
.chk-basic + .chk-basic__label:before {content: ''; position: absolute; left: 0; top: 0; background: #fff; border: 1px solid #ddd; display: inline-block; vertical-align: middle; width: 12px; height: 12px;}
.chk-basic + .chk-basic__label:after {content: "\f00c";position: absolute;left: 2px; top: 2px;font-family: 'Font Awesome 5 Pro';color: #fff;opacity: 0; font-size: 10px;}
.chk-basic:checked + .chk-basic__label:after {opacity: 1;}
/* cke */
.cke {display: inline-block }
/* ===============================================================
    * Toggle Switch
=============================================================== */
.radio-switch {position: relative; display: inline-block; width: 80px; height: 30px; margin-left: 3px; margin-top: 4px; vertical-align: middle;}
.radio-switch label {position: absolute; width: 70px; height: 30px; line-height: 28px; padding: 0 10px; color: #fff; z-index: 2;}
.radio-switch input {opacity: 0; position: absolute;}
.radio-switch label:first-of-type:before,
.radio-switch label:first-of-type:after {content: '';position: absolute;height: 30px;overflow: hidden;pointer-events: none;vertical-align: middle;}
.radio-switch label:first-of-type:before {position: absolute;width: 21px;height: 21px;background: #fff;border-radius: 50%;left: 5px;top: 4.5px; z-index: 2;transition: transform .2s ease-in-out;}
.radio-switch label:first-of-type:after {left: 0; top: 50%;width: 70px;transform: translateY(-50%);background: #aaa;border-radius: 15px;transition: background .2s ease-in-out;}
.radio-switch input:first-of-type:checked ~ label:last-of-type {opacity: 0;}
.radio-switch input:first-of-type:checked ~ label:first-of-type:before {transform: translateX(39px);}
.radio-switch input:last-of-type:checked ~ label:last-of-type {z-index: 1;opacity: 1;}
.label-off__txt {display: inline-block; position: absolute; left: 30px; top: 8px; color: #fff; z-index: 999; opacity: 0; cursor: default; pointer-events: none;}
.radio-switch input:last-of-type:checked ~ .label-off__txt {opacity: 1;}
/* ===============================================================
    * Image Uploader (Full Width)
=============================================================== */
.content-box__photo {padding: 20px 0; border: 1px solid #e0e0e0; border-left: none; border-right: none;}
.box-tit__photo {display: inline-block; width: 100px; vertical-align: top;}
.info-imgs__box {position: relative; display: inline-block; width: 740px; height: 160px; border: 1px dashed #e0e0e0;}
.info-imgs__box label {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); text-align: center;}
.info-imgs__box label span {display: block; font-size: 12px; font-weight: 200; margin-top: 10px;}
.info-imgs__box label i {font-size: 16px;}
.input-images {position: relative; width: 740px; height: 160px; display: inline-block; overflow-y: scroll;}
.uploaded-image {overflow: hidden;}
/* ===============================================================
    * Pagination
=============================================================== */
.page {display: flex; justify-content: center; align-items: center; height: 70px;}
.page ul {display: flex; justify-content: center; align-items: center;}
.page a {display: inline-block; margin: 0 2px; width: 26px; height: 26px; line-height: 24px; border-radius: 50%; text-align: center; border: 1px solid #e0e0e0;}
/* ===============================================================
    * info-tabs
=============================================================== */
.info-tabs {display: flex; justify-content: flex-start; align-items: center; margin-right: 10px;}
.info-tabs li {padding: 7px 10px; text-align: center; border: 1px solid #e0e0e0; border-right: none; transition: .3s;}
.info-tabs li:last-of-type {border-right: 1px solid #e0e0e0;}
/* ===============================================================
    * calendar style
=============================================================== */
.calendar {width: 100%; table-layout: fixed;}
.calendar td {padding: 14px 0; text-align: center; }
.calendar tbody tr:first-of-type {font-size: 20px; color: #222; height: 100px;}
.calendar tbody tr:first-of-type td:first-of-type {text-align: right;}
.calendar tbody tr:first-of-type td:last-of-type {text-align: left;}
.cal-tr {border: 1px solid #e0e0e0; color: #222;}
.cal-tr td {text-align: left; padding-left: 10px; padding-right: 10px; border: 1px solid #e0e0e0;}
.cal-tr td.days > span.date {display: block; margin-bottom: 12px;}
.cal-tr td.weekend span.date {color: red;}
.cal-tr td.sunday span.date {color: red;}
.cal-tr td.saturday span.date {color: blue;}
/* ===============================================================
    * sel-search select2 style reset
=============================================================== */
.select2 .select2-container .select2-container--default .select2-container--below {width: 90%;}
.select2-container--default .select2-selection--single {border: 1px solid #e0e0e0;}
.select2-container .select2-selection--single {height: 24px;}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {background: none;}
.select2-container--default .select2-selection--single .select2-selection__arrow b {margin-top: -4px;}
.select2-selection .select2-selection--single {width: 90%;}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {color: #222;}
.select2-container--default .select2-selection--single .select2-selection__rendered {line-height: 24px; color: inherit;}