@font-face {
  font-family: 'LINESeedKR-Rg';
  src: url('https://cdn.jsdelivr.net/gh/wizfile/font/LINESeedKR-Rg.eot');
  src:url('https://cdn.jsdelivr.net/gh/wizfile/font/LINESeedKR-Rg.woff') format('woff');
  font-style: normal;
}
/* @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');				 */

/* ========================================================= */
/*                          layout                           */
/* ========================================================= */
html { height:100%; scroll-behavior: smooth; }
body { font-family: 'Open Sans', 'Noto Sans KR', sans-serif; letter-spacing:-0.03em; color: #1a1a1a; }
body.swal2-height-auto { height: 100% !important; }
body>div.contents { max-width: 500px; margin: 0 auto; }
section { margin:0 0 50px 0; position: relative; }
.subpage { padding-bottom: 10px; }
.subpage section { margin:0 0 30px 0; }

div.ibox { padding:20px; background-color: #fff; }
div.ex-guide { padding:5px; font-size:12px; background:#f0f0f0 }
.container { width:100%; min-width:320px; max-width: 500px !important; padding:0 15px; margin:0 auto; }
.wow { visibility: hidden; }
.flex { display: flex; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
#inicisModalDiv.inipay_modal { opacity: 1; }




/* ====================================================================== */
/* -------------------------- header / footer --------------------------- */
/* ====================================================================== */
/* 헤더 */
header { position: sticky; height: 92px; z-index: 111; transition: all ease 0.25s; border-bottom: 1px solid transparent; background: #330607; transition: all ease 0.35s; }
header.loaded { transform: translateY(0); }
header.sub, 
header.scroll { top:0; border-bottom: 1px solid #262626; }
header.scroll .navi>ul.nav>li>a:hover { color:#f57faf; }
header>div.container { display: flex; align-items: center; justify-content: space-between; height: 52px; }
header .logo { width: 100%; height: 100%; background: url('/images/logo.png') no-repeat; background-size: 30px; background-position: 0 center; padding-left: 35px; }
header .logo a { display: block; height: 100%; width: 120px; position: relative; }
header .logo a>span { position: absolute; left: 0; top:0; bottom: 0; margin: auto; height: fit-content; letter-spacing: 0.5px; color:#fff; text-transform: lowercase; }
header .logo a>span.tx-en { font-family: 'LINESeedKR-Rg'; font-weight: 800; font-size: 24px; }
header .logo a>span.tx-kr { font-weight: 600; font-size: 21px; }
header.scroll .logo a>img.logo-01,
header.sub .logo a>img.logo-01 { visibility: hidden; }
header.scroll .logo a>img.logo-02,
header.sub .logo a>img.logo-02 { visibility: visible; }
header .navi>ul.nav>li { position: relative; padding: 25px 20px; }
header .navi>ul.nav>li>a { position: relative; padding: 5px; font-size: 15px; font-weight: 600; color: #fff; text-shadow: 0px 0px 5px #000; transition: all ease 0.35s; }
header .navi>ul.nav>li>a::before { content:''; width: 0px; height: 8px; display: block; position: absolute; top: 15px; left: 0; z-index: -1; opacity: 0; transition: all ease 0.50s; }
header .navi>ul.nav>li>a:hover,
header .navi>ul.nav>li.hover-on>a { color: #f57faf; color:#f57faf; text-shadow: 1px 1px 2px #000; }
header .navi>ul.nav>li>a:hover::before,
header .navi>ul.nav>li.hover-on>a::before { opacity: 1; width: 100%; background: rgb(0 0 0 / 30%); }
header .navi>ul.nav>li>.sub-menu { display: none; min-width: 230px; position: absolute; top: calc(100% - 20px); left: 0; padding: 30px 15px 30px 25px;
  background-color: rgba(17, 17, 17, 0.81); }
header .navi>ul.nav>li>.sub-menu>ul>li { overflow: hidden;  margin-bottom: 15px; }
header .navi>ul.nav>li>.sub-menu>ul>li:last-child { margin-bottom: 0; }
header .navi>ul.nav>li>.sub-menu>ul>li>a { display: block; font-size: 15px; font-weight: 500; color:#bababa; position: relative; padding: 5px 5px 5px 20px;
  margin-left: -18px; transition: all ease 0.25s; }
header .navi>ul.nav>li>.sub-menu>ul>li>a:hover { margin-left: 2px; color:#fff; }
header .navi>ul.nav>li>.sub-menu>ul>li>a::before { content:''; background: url('/images/temp/right-arrow.png') no-repeat center; background-size: contain; position: absolute; top: 0;
  left: 0; width: 16px; height: 16px; bottom: 0; margin: auto; }
header .func { display: flex; gap: 15px; align-items: center; }
header .func button { border: none; background: none; color: #fff; font-size: 15px; }
header .func button:hover { text-decoration: underline; }
header .func .search-wrap {
  display: flex;
  align-items: center;
  gap:20px;
}
header .func button.bt-search {
  width: 22px;
  height: 22px;
  padding: 0;
}
header .func button.bt-search.color {
  width: 20px; 
  height: 20px;
}
header .func button.bt-search>img {
  vertical-align: top;
  transition: all 0.3s ease-in-out;
}
header .func button.bt-search.color:hover>img {
  animation: rotate_ani 0.4s ease-in-out;
}
@keyframes rotate_ani {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
header .func .mo-btn { display: flex; align-items: center; }
header .func .mo-btn button.bt-snb { width: 22px; height: 16px; border-top: 2px solid #fff; border-bottom: 2px solid #fff; position: relative; }
header .func .mo-btn button.bt-snb:after { content: ''; width: 100%; height: 2px; background-color: #fff; position: absolute; top: 0; bottom: 0; left: 0; margin: auto; }
header .func button.bt-admin { background: #333; border-radius: 3px; height: auto; padding: 2px 4px; font-weight: 600;font-size: 12px; }
header .sub-cate { display: flex; align-items: center; gap: 5px; height: 40px; background: #fff; border-bottom: 1px solid #330607; }
header .sub-cate button { border:none; padding: 5px 10px; font-weight: 500; font-size: 14px; color:#333; flex:1; }


/* 풋터 */
footer { padding: 30px 0 70px; background-color: #330607; color:#fff; }
footer .infs p.title { font-size: 15px; font-weight: 600; margin-bottom: 5px; }
footer .infs ul>li { color:#eee; }
footer .logo>img { max-width: 220px; margin: 30px 0; }
footer .terms ul { display: flex; align-items: center; justify-content: space-between; gap:5px; border-top: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2; padding: 0 10px; }
footer .terms ul>li>a { color:#f2f2f2; padding: 8px 5px; display: block; }
footer .copyright { text-align: center; padding: 10px 10px 0; color: #888; }
footer .foot-menu { position: fixed; bottom: 0; width: 100%; max-width: 500px; background: #fff; display: flex; align-items: center; gap:5px; z-index: 111;
  border-top-left-radius: 18px; border-top-right-radius: 18px; overflow: hidden; padding: 5px 8px; box-shadow: 0px 1px 10px rgb(0 0 0 / 35%); }
footer .foot-menu>button { flex: 20%; background: none; border:none; padding: 5px 5px; }
footer .foot-menu>button>i { font-size: 18px; color:#999; margin-bottom: 5px; }
footer .foot-menu>button>p { font-size: 12px; color:#444; line-height: 1; }




/* ========================================================= */
/*                           etc...                          */
/* ========================================================= */
/* empty, no item */
.no-item { padding: 40px; background: #fbf7f7; color: #919191; text-align: center; font-size: 14px; flex:1; }

/* swiper */
.swiper .swiper-pagination-bullet-active { background-color: #fff; }

/* flex box */
.flex-left { justify-content: left; align-items: center; }
.flex-right { justify-content: right; align-items: center; }
.flex-g1 { display: flex; gap:1px; flex-wrap: wrap; }
.flex-g2 { display: flex; gap:2px; flex-wrap: wrap; }
.flex-g3 { display: flex; gap:3px; flex-wrap: wrap; }
.flex-g4 { display: flex; gap:4px; flex-wrap: wrap; }
.flex-g5 { display: flex; gap:5px; flex-wrap: wrap; }
.flex-g10 { display: flex; gap:10px; flex-wrap: wrap; }
.flex-g15 { display: flex; gap:15px; flex-wrap: wrap; }
.flex-g20 { display: flex; gap:20px; flex-wrap: wrap; }

/* title */
.tit { border-bottom: 2px solid #ddd; padding-bottom: 2px; font-weight: 600; }
.tit>small { color:#919cad; margin-left: 5px; }
.tit+.tbox { background-color: #f7f7f7; padding: 10px 10px 10px; }

/* search box */
.search .btn, .search select, .search .input-group-text, .search input { border-radius: 0; }

/* tab navi */
.tab-btns+.tab-content { padding: 30px 0px; }
.tab-s1.tab-btns { border-bottom: 1px solid #cfd8dc; }
.tab-s1.tab-btns>ul>li { float: left; margin-bottom: -1px; text-align: center; }
.tab-s1.tab-btns>ul>li>button { position: relative; display: block; border-top: 1px solid #cfd8dc; border-right: none; border-bottom: 1px solid #cfd8dc; border-left: 1px solid #cfd8dc; border-radius: 0 !important; background-color: #F1F3F5; color: #4b90b3; font-weight: 500; width: 100%; }
.tab-s1.tab-btns>ul>li:last-child>button { border-right: 1px solid #cfd8dc; }
.tab-s1.tab-btns>ul>li>button:after { content: ''; height: 0px; display: block; position: absolute; top: -1px; left: -1px; right: -1px; background-color: transparent; z-index: 1; transition: all ease 0.30s; -webkit-transition: all ease 0.30s; -moz-transition: all ease 0.30s; -ms-transition: all ease 0.30s; -o-transition: all ease 0.30s; }
.tab-s1.tab-btns>ul>li>button.active { background-color: #fff; border-bottom: 1px solid #fff; margin-bottom: -1px; color: #263238; font-weight: 600; }
.tab-s1.tab-btns>ul>li>button.active:after { background-color: #9F4BC1; height: 3px; }
.tab-s2.tab-btns { border-bottom: 1px solid #e2e2e2; }
.tab-s2.tab-btns>ul>li { float: left; margin-bottom: -1px; }
.tab-s2.tab-btns>ul>li>button { position: relative; display: block; border-top: 1px solid #e2e2e2; border-right: none; border-bottom: 1px solid #e2e2e2; border-left: 1px solid #e2e2e2; border-radius: 0 !important; background-color: #fff9f4; color: #b3968c; width: 100%; }
.tab-s2.tab-btns>ul>li:last-child button { border-right: 1px solid #e2e2e2; }
.tab-s2.tab-btns>ul>li button:after { content: ''; height: 0px; display: block; position: absolute; top: -1px; left: -1px; right: -1px; background-color: transparent; z-index: 1; transition: all ease 0.30s; -webkit-transition: all ease 0.30s; -moz-transition: all ease 0.30s; -ms-transition: all ease 0.30s; -o-transition: all ease 0.30s; }
.tab-s2.tab-btns>ul>li button.active { background-color: #fff; border-bottom: 1px solid #fff; color: #4a1421; font-weight: 600; }
.tab-s2.tab-btns>ul>li button.active:after { background-color: #f96e8e; height: 3px; }

/* sweet alert custrom */
.swal2-container .swal2-styled.swal2-confirm:focus { box-shadow: none !important; }
.swal2-container .swal2-popup { width: auto; min-width: 400px; padding: 35px 35px 30px; }
.swal2-container .swal2-title { padding : 0; margin-bottom: 10px; font-size: 15px; text-align: left; font-weight: 500; }
.swal2-container .swal2-html-container { padding: 0; margin: 0; text-align: left; font-size: 16px; font-weight: 600; margin-bottom: 20px; }
.swal2-container .swal2-actions { width: 100%; margin-top: 5px; justify-content: right; }
.swal2-container .swal2-actions>button { padding: 5px 15px; margin: 0 0 0 5px; font-size: 14px; }
.swal2-container .swal2-icon { display: none !important; }
.swal2-container .swal2-styled.swal2-confirm { background-color: #0077fe; }
.swal2-container .tx-st2 { font-size: 14px; padding: 15px 0; }

/* toast custom */
.jq-toast-wrap .jq-toast-single { margin: 0 0 15px; padding: 12px 20px 8px 12px; border: 1px solid rgb(0 0 0 / 25%); border-radius: 2px; border-top-left-radius: 0; 
  border-top-right-radius: 0; word-break: keep-all; background-color: rgb(33 33 33 / 80%); }
.jq-toast-wrap .jq-toast-single.jq-has-icon { padding: 12px 20px 12px 50px; }
.jq-toast-wrap .jq-toast-single a { padding-bottom: 1px; }
.jq-toast-wrap .jq-toast-single a:hover { color:inherit; }
.jq-toast-wrap .jq-toast-single .jq-toast-heading { background: rgb(0 0 0 / 11%); padding: 4px 5px 3px; font-weight: 600; color:#fff; }
.jq-toast-wrap .jq-toast-loader { top: 0px; height: 4px; border-radius: 0px; background-color: rgba(255, 255, 255, 0.33) !important; color: #fff; }
.jq-toast-wrap .close-jq-toast-single { top:11px; }
.jq-toast-wrap .jq-icon-info { background-color: #62bfc7; color: #2d595d; }
.jq-toast-wrap .jq-icon-error { background-color: #b35755; }
.jq-toast-wrap .jq-icon-warning { background-color: #bda259; color: #554929; }
.jq-toast-wrap .jq-icon-success { background-color: #61af52; color: #32552b; }

/* datepicker custom */
.datepicker.dropdown-menu { padding:0; border-color:#24a57a; min-width: 265px; }
.datepicker.dropdown-menu.datepicker-orient-top:before { border-top: 7px solid #24a57a; }
.datepicker.dropdown-menu table { width: 100%; }
.datepicker.dropdown-menu table>thead>tr>th { border-radius: 0; background-color: #10b981; color:#fff; text-align: center;}
.datepicker.dropdown-menu th.prev>span,
.datepicker.dropdown-menu th.next>span { width: 24px; }
.datepicker.dropdown-menu th.datepicker-switch { height: 60px; font-size: 16px; font-weight: 500; letter-spacing: 1px; }
.datepicker.dropdown-menu th.prev:hover,
.datepicker.dropdown-menu th.next:hover,
.datepicker.dropdown-menu th.datepicker-switch:hover { background-color: #0faf7a; }
.datepicker.dropdown-menu table>thead>tr>th.cw,
.datepicker.dropdown-menu table>thead>tr>th.dow { background-color: #24a57a; }
.datepicker.dropdown-menu table>thead>tr>th.dow { font-size: 14px; border-bottom: 1px solid #ffffff; }
.datepicker.dropdown-menu table>tbody>tr>td { width: 36px; height: 36px; font-size: 15px; transition: all ease 0.25s; }
.datepicker.dropdown-menu table>tbody>tr>td:not(.new):not(.old):nth-child(6) { color: #0d6efd; }
.datepicker.dropdown-menu table>tbody>tr>td:not(.new):not(.old):nth-child(7) { color: #b81c1c; }
.datepicker.dropdown-menu table>tbody>tr>td.today { text-decoration: underline; background-image: linear-gradient(to bottom, #fff, #fff); }
.datepicker.dropdown-menu table>tbody>tr>td.today:hover { background-image: linear-gradient(to bottom, #eee, #eee); }
.datepicker.dropdown-menu table>tbody>tr>td.day.active:hover,
.datepicker.dropdown-menu table>tbody>tr>td.active,
.datepicker table tr td span.active, .datepicker table tr td span.active:hover, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled:hover { background-image: linear-gradient(to bottom, #10b981, #219971); color:#fff !important; }
.datepicker.dropdown-menu table>tfoot>tr>th.today { background-color: #10aa77; color:#fff; border-bottom: 3px solid #fff; }
.datepicker.dropdown-menu table>tfoot>tr>th.today:hover { background-color: #0faf7a; }
.datepicker.dropdown-menu table>tfoot>tr>th.clear { background-color: #b8b8b8; color:#fff; }
.datepicker.dropdown-menu table>tfoot>tr>th.clear:hover { background-color: #b1b1b1; }

/* list form layout */
.list td:has(button) { padding:2px !important }
.list td:has(input[type="checkbox"]) { padding:2px !important }
.list td button.btn { height:25px; font-size:12px; --bs-btn-padding-y: 2px; }
.list .form-check-input:checked { background-color: #666; border-color: #666; }

span.currency::after { content: " 원"; font-size: 12px; color: #666; }
input.currency { text-align:right }
input.decimal { text-align:right }
input.date { text-align:center }

/* hands on table */
.sheets { border: 2px solid #666; }
.sheets .handsontable .htDimmed { color: #000; }
.sheets .wordWrapClass { text-overflow: ellipsis; white-space: nowrap !important; }
.sheets .handsontable .htCheckboxRendererInput { margin: 0; }
.sheets .handsontable td { padding: 0 4px; height: 20px; line-height: 20px; background-color: #fff; vertical-align: middle; overflow: hidden; }
.sheets .ht_clone_master textarea { background:#ccffcc; text-align:right }

/* edit form layout */
.edit-form { margin-bottom:20px; }
.edit-form label.form-label small { margin-left:8px; font-weight:400; color:#555; }
.edit-form .col-form-label { padding:10px 10px 10px 0 !important; }
.edit-form .form-title { border-bottom: 1px solid #d9dee1 !important; }
.edit-form .form-title h5 { font-size:18px; font-weight:500; }
.edit-form .form-title h5 > small { font-size:12px; }
.edit-form .form-group { padding:10px 0; border-bottom: 1px dashed #d9dee1; }
.edit-form .form-control-text { padding:7px 0;}
.edit-form .bootstrap-select button.btn { --bs-btn-padding-y: 8px; height: 38px; border-radius: 3px; }
.edit-form .form-text-value { font-size:14px; padding:10px; }
.edit-form table { font-size:12px; }

/*  */
.navimap { padding:10px 20px; background:#fff; }
.navimap > ol.breadcrumb { margin-bottom:0; }
.navimap > ol.breadcrumb > li { color:#444; font-size:12px; font-weight:400; }
.navimap > ol.breadcrumb > li.active { color:#222; font-size:12px; font-weight:500; }
.navimap > ol.breadcrumb > li + li::before { padding: 0 5px; color: #ccc; content: "\003E"; }

/* drop-item */
.swiz .dropdown-menu { --bs-dropdown-padding-y: 5px; }
.swiz .dropdown-item { font-size: 13px; cursor: pointer; }

/* radius setting */
div.radius-0x .form-control, 
div.radius-0x .form-select,
div.radius-0x button.btn,
div.radius-0x .input-group-text { border-radius: 0px; }
div.radius-3x .form-control, 
div.radius-3x .form-select,
div.radius-3x button.btn,
div.radius-3x .input-group-text { border-radius: 3px; }
div.radius-5x .form-control, 
div.radius-5x .form-select,
div.radius-5x button.btn,
div.radius-5x .input-group-text { border-radius: 5px; }

/* favorite button */
button.bt-favo { border:none; background: transparent; }
button.bt-favo::before { content:'\f004'; height: fit-content; font: var(--fa-font-regular); font-size: 22px; color:#666; }
button.bt-favo.added::before { font: var(--fa-font-solid); font-size: 22px; color: #f57faf; animation: beat 0.5s; }

/* img-zoom */
#img-zoom-overlay { position: fixed; z-index: 9999; inset: 0; background: rgba(0, 0, 0, 0.75); display: flex; justify-content: center; align-items: center; overflow: hidden;
  max-width: 500px; left: 0; right: 0; margin: auto; }
#img-zoom-container { position: relative; }
#img-zoom-container>p { position: absolute; left:0; right:0; bottom: 0px; font-size: 12px; color: #eee; text-align: center; text-shadow: 0px 1px 2px #000; }
#img-zoom-overlay img { max-width: 100%; max-height: 100%; object-fit: contain; touch-action: none; }
#img-zoom-close { position: absolute; top: 20px; right: 20px; color: white; font-size: 28px; z-index: 10000; cursor: pointer; }

/* etc... */
span.sub-label { position:relative; display:inline-block; padding:6px 10px; background:#e7e7e7; height:32px; }




/* ========================================================= */
/*                      custom component                     */
/* ========================================================= */
.input-group.email-group>input { width: 65%; }
.input-group.email-group>select { width: 35%; font-size: 14px; }

dl.grider { display: grid; grid-template-columns: auto 1fr; gap: 10px 10px; align-items: center; }
dl.grider>dt { padding-right: 15px; }

.tit-line { position: relative; text-align: center; margin-bottom: 20px; }
.tit-line>span { position: relative; padding: 0 10px; background-color: #fff;  font-size: 18px; font-weight: 500; }
.tit-line::before { content: ''; position: absolute; left: 0; top: calc(50% - 1px); width: 100%; height: 1px; background: #e9e9e9; }

.breadcrumb { margin-bottom: 0px; padding: 5px 5px; }
.breadcrumb>ul { display: flex; align-items: center; gap:3px; }
.breadcrumb>ul>li { line-height: 18px; }
.breadcrumb>ul>li::after { content:'\f105'; font: var(--fa-font-solid); color:#b6b6b6; margin-left: 3px; }
.breadcrumb>ul>li:last-child::after { content:''; margin:0; }
.breadcrumb>ul>li:last-child { font-weight: 500; }
.breadcrumb>ul>li>a { color: #888; }

.info-text { margin-top: 10px; }
.info-text ul.list-st1>li:before { top: 8px; }

button.bt-proceed { width: 100%; padding: 18px 10px; background-color: #222; color:#fff; font-size: 20px; }
button.bt-proceed:hover { background-color: #333; }

.swiper .swiper-button-next, 
.swiper .swiper-button-prev { color:#fff; margin: 0; top: calc(50% - 14px); }
.swiper .swiper-button-next::after, 
.swiper .swiper-button-prev::after { font-size: 30px; }

ul.pagination .active>.page-link { background-color: #a5a5a5; border-color: #999; }
ul.pagination .active>.page-link:hover { color:#fff; } 
ul.pagination .page-link:hover { color:#222; }

.lazy-box { position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; overflow: hidden; transition: all ease 0.35s; }
.lazy-box .spinner { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; border: 8px solid rgba(0,0,0,0.1); border-left: 8px solid #42ccdc; border-radius: 50%; 
  width: 50px; height: 50px; animation: spinnner_circle 1s linear infinite; /* transform: translate(-50%, -50%); */ }
.lazy-box.is-loaded .spinner { display: none; }

.fs-modal .modal-body .input-form { margin-bottom: 20px; }
.fs-modal .modal-body .head-tx>p { font-size: 20px; font-weight: 600; }
.fs-modal .modal-body .head-tx>p:last-child { font-size: 18px; font-weight: 500; }
.fs-modal .modal-body .body-tx { padding: 10px 10px; background: #eee; }
.fs-modal .modal-body .body-tx ul li { word-break: keep-all; }

.item-wrap .item>.img-box { margin-bottom: 5px; }
.item-wrap .item>.txt-box>p.tit { font-weight: 600; font-size: 16px; border:none; }
.item-wrap .item>.txt-box>p.sub { color:#555; }
.item-wrap .item>.txt-box>p.prc { font-size: 15px; font-weight: 600; }
.item-wrap .item>button.bt-pick { width: 100%; padding: 4px 0; background-color: #fff; border:1px solid #e1e1e1; margin-bottom: 5px; }
.item-wrap .item>button.bt-pick::after { content: '찜 담아놓기'; font-size: 12px; }
/*.item-wrap .item>button.bt-pick.done { pointer-events: none; }*/
.item-wrap .item>button.bt-pick.done::after { content: '담기 완료'; color:#aaa; }
.item-wrap .item .color-set { display: grid; grid-template-columns: repeat(10, 1fr); gap: 3px; width: 100%; margin-top: 5px; }
.item-wrap .item .color-set>span.c-label { display: flex; align-items: center; justify-content: center; width: 100%; height: 4px; border:1px solid rgb(0 0 0 / 10%); 
  border-color: #fff; }

.item-wrap .item a.i-img { display: block; margin-bottom: 10px; background: #eee; text-align: center; overflow: hidden; }
.item-wrap .item a.i-img>img { transition: all ease 0.55s; }
.item-wrap .item:hover a.i-img>img { transform: scale(1.05); }
.item-wrap .item p.i-tit { font-size: 16px; font-weight: 600; }
.item-wrap .item p.i-prc>span { font-size: 14px; }
.item-wrap .item p.i-prc>span:first-child { color:#666; }
.item-wrap .item p.i-prc>span:last-child { color: #eb6262; text-decoration: line-through; }
.item-wrap.box-style .item { position: relative; }
.item-wrap.box-style .item .i-img { margin-bottom: 0; }
.item-wrap.box-style .item span.i-label { display: none; position: absolute; top: 25px; right: 25px; padding: 12px 30px; border-radius: 3px; background-color: #fff;
  color: #000; font-size: 14px; font-weight: 700; letter-spacing: 3px; cursor: pointer; transition: all ease 0.35s; }
.item-wrap.box-style .item:hover span.i-label { background-color: #111; color:#fff; }
.item-wrap.box-style .item .i-box { padding: 25px 25px; border: 1px solid #ebebeb; text-align: center; }
.item.empty { display: flex; justify-content: center; align-items: center; height: 100px; background: #fbf7f7; color: #919191; text-align: center; font-size: 14px;
  border: 1px solid #e4e4e4; }

.article-wrap .item a.i-img { display: block; margin-bottom: 10px; background: #eee; text-align: center; overflow: hidden; }
.article-wrap .item a.i-img>img { transition: all ease 0.55s; }
.article-wrap .item:hover a.i-img>img { transform: scale(1.05); }
.article-wrap .item .i-cate { font-size: 12px; font-weight: 500; letter-spacing: 2px; margin-bottom: 5px; }
.article-wrap .item .i-tit { font-size: 20px; font-weight: 600; line-height: 28px; }

.lnb-wrap { position: fixed; bottom: 5%; right: 50px; width: 90px; height: fit-content; padding:0 !important; z-index: 111; }
.lnb-wrap ul>li { margin-bottom: 8px; }
.lnb-wrap ul>li>button.bt-scrNav { border: none; background: none; display: flex; align-items: center; gap: 5px; justify-content: right; width: 100%; }
.lnb-wrap ul>li>button.bt-scrNav::after { content:""; display: block; width: 14px; height: 14px; background: #fff; border:2px solid #644831; border-radius: 100%; 
  transition: all ease 0.25s; }
.lnb-wrap ul>li>button.bt-scrNav.on::after,
.lnb-wrap ul>li>button.bt-scrNav:hover::after { background-color: #f57faf; }
.lnb-wrap ul>li>button.bt-scrNav>span { font-size: 14px; font-weight: 700; color: #644831;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.8), -1px 1px 0 rgba(255, 255, 255, 0.8), 1px -1px 0 rgba(255, 255, 255, 0.8), -1px -1px 0 rgba(255, 255, 255, 0.8),
  1px 0 0 rgba(255, 255, 255, 0.8), -1px 0 0 rgba(255, 255, 255, 0.8), 0 1px 0 rgba(255, 255, 255, 0.8), 0 -1px 0 rgba(255, 255, 255, 0.8); }

.progress-wrap { padding: 15px 5px 20px; min-height: 65px; }
.progress-wrap .bar-container { position: relative; padding: 0 20px; }
.progress-wrap .bar { position: absolute; top: 50%; left: 50%; background: #E8DFD8; width: calc(100% - 40px); height: 3px; border-radius: 10px; transform: translate(-50%, -50%);
  overflow: hidden; }
.progress-wrap .bar .bar-fill { display: block; background: #ceab6a; height: 100%; }
.progress-wrap .gradations { position: relative; display: flex; flex-direction: row; justify-content: space-between; width: 100%; }
.progress-wrap .gradations .point { position: relative; }
.progress-wrap .gradations .point::before { content:''; display: block; position: relative; background: #c6b89d; width: 8px; height: 8px; border-radius: 100%;
  transition: 0.3s ease; z-index: 1; }
.progress-wrap .gradations .point.active::before { background: #FFFFFF; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2), 0 0 0 6px #ceab6a; }
.progress-wrap .gradations .point.current::before { background: #FFFFFF; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2), 0 0 0 10px #ceab6a; }
.progress-wrap .gradations .point .p-label { position: absolute; top: 100%; left: 50%; margin: 15px 0 0 0; transform: translate(-50%, 0); width: 48px; font-weight: 500;
  text-align: center; word-break: keep-all; line-height: 1.1; }

.desc-wrap { position: relative; text-align: center; }
.desc-wrap img { width: 80%; }
.desc-wrap p { font-size: 13px; }
.desc-wrap p.tit { font-weight: 700; font-size: 14px; margin-bottom: 10px; }
.desc-wrap .desc-box { position: absolute; width: 220px; }
.desc-wrap .desc-box.i-01 { top:30%; right: 9%; }
.desc-wrap .desc-box.i-02 { top:1%; left:22%; }
.desc-wrap .desc-box.i-03 { bottom:0; right:42%; }
.desc-wrap .desc-box .indicator { position: relative; width: 45px; height: 45px; border-radius: 100%; background-color: #f57faf; margin: 175px auto 0; }
.desc-wrap .desc-box .indicator::before { content:''; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; width: 1px; height: 200px; background-color: #f57faf; }
.desc-wrap .desc-box .indicator.reverse { transform: rotate(180deg); margin: 0 auto 175px; }
.desc-wrap .desc-box .indicator span.bar { position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 15px; height: 2px; background-color: #fff; }
.desc-wrap .desc-box .indicator span.bar.vert { transform: rotate(90deg); }

ul.reviews>li.item { border: 1px solid #e4e4e4; border-radius: 10px; padding: 15px 15px; margin-bottom: 20px; }
ul.reviews>li.item:last-child { margin-bottom: 0; }
ul.reviews>li.item .r-head { display: flex; justify-content: space-between; border-bottom: 1px solid #c3c3c3; padding: 0px 2px 8px; margin-bottom: 15px; }
ul.reviews>li.item .r-head>span { font-size: 15px; }
ul.reviews>li.item .r-head>.num { flex: 0 0 130px; }
ul.reviews>li.item .r-head>.tits { flex: 0 0 calc(100% - 230px); font-weight: 500; }
ul.reviews>li.item .r-head>.dates { flex: 0 0 100px; text-align: right; }
ul.reviews>li.item .r-body { position: relative; display: flex; }
ul.reviews>li.item .r-body .img-box { flex: 0 0 120px; width: 120px; height: 120px; overflow: hidden; position: relative; margin-right: 15px; }
ul.reviews>li.item .r-body .content { flex: 0 0 calc(100% - 250px); }
ul.reviews>li.item .r-body .content .goods { margin-bottom: 5px; }
ul.reviews>li.item .r-body .content .goods>span { font-size: 18px; font-weight: 600; cursor: pointer; }
ul.reviews>li.item .r-body .content .desc { font-size: 14px; }
ul.reviews>li.item .r-body .content .rating { display: flex; gap: 1px; position: absolute; bottom: 5px; right: 5px; background: #fff; }
ul.reviews>li.item .r-body .content .rating>i.fa-star { font-size: 16px; color:#d2d2d2; }
ul.reviews>li.item .r-body .content .rating>i.fa-star.fa-solid { color: #ffcc00; }

.inquiry-wrap .func { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.inquiry-wrap .list-box { border-top: 2px solid #4d4d4d; margin-bottom: 30px; }
.inquiry-wrap .list-box>ul>li { border-bottom: 1px solid #ddd; cursor: pointer; background-color: #fff; }
.inquiry-wrap .list-box>ul>li .artc-head { display: flex; flex-wrap: wrap; padding: 1px 0 3px; }
.inquiry-wrap .list-box>ul>li .artc-head>div { flex: 0 0 100px; padding: 5px 10px; text-align: center; font-size: 14px; }
.inquiry-wrap .list-box>ul>li.a-wait .artc-head .i-sts { color:#9d7e7e; }
.inquiry-wrap .list-box>ul>li .artc-head .i-sts { flex: 0 0 75px; border-bottom: 1px solid #eee; text-align: left; }
.inquiry-wrap .list-box>ul>li .artc-head .i-cat { flex: 0 0 calc(100% - 75px); text-align: right; border-bottom: 1px solid #eee; }
.inquiry-wrap .list-box>ul>li .artc-head .i-tit { flex: 0 0 100%; font-weight: 500; text-align: left; }
.inquiry-wrap .list-box>ul>li .artc-head .i-tit.secret { color:#b0b0b0; }
.inquiry-wrap .list-box>ul>li .artc-head .i-tit.secret i { color:#d2d2d2; }
.inquiry-wrap .list-box>ul>li .artc-head .i-dat { flex: 0 0 100%; text-align: right; color: #8d8d8d; }
.inquiry-wrap .list-box>ul>li .artc-body { padding: 5px 5px 10px 5px; cursor: default; }
.inquiry-wrap .list-box>ul>li .artc-body>div { display: flex; align-items: center; flex-wrap: wrap; border: 1px solid #eee; border-radius: 5px; padding: 10px;
  background: #f8f8f8; font-size: 14px; }
.inquiry-wrap .list-box>ul>li .artc-body>div::before { margin-right: 8px; font-size: 17px; font-weight: 700; color: #9f9f9f; }
.inquiry-wrap .list-box>ul>li .artc-body>div.box-inq { margin-bottom: 10px; }
.inquiry-wrap .list-box>ul>li .artc-body>div.box-inq::before { content:'Q'; }
.inquiry-wrap .list-box>ul>li.a-wait .artc-body>div.box-ans { background: #fbf7f7; color: #919191; text-align: center; font-size: 14px; }
.inquiry-wrap .list-box>ul>li .artc-body>div.box-ans::before { content:'A'; }
.inquiry-wrap .list-box>ul>li .artc-body>div.box-ans .a-date { color: #909090; }



/* ========================================================= */
/*                          sub page                         */
/* ========================================================= */
.subpage { background-color: #f2f2f2; }
.subpage h4 { border-bottom: 2px solid #e7e7e7; padding-bottom: 5px; margin-bottom: 15px; font-size: 18px; font-weight: 500; }
.subpage section.sec-head { display: flex; align-items: center; padding: 5px 10px; margin:0; border-bottom: 1px solid #dbdbdb; background: #ededed; }
.subpage section.sec-head>a { display: inline-block; padding: 8px 15px 8px 8px; line-height: 1; }
.subpage section.sec-head>a>i { color:#aaa; font-size: 15px; }
.subpage section.sec-head>span { font-size: 16px; font-weight: 600; line-height: 1; }

.subpage section.sec-body .category-box { padding: 20px 5px 10px 15px; }
.subpage section.sec-body .category-box>.inner { display: flex; gap: 5px; flex-wrap: wrap; }
.subpage section.sec-body .category-box>.inner>button { border: none; background: #fff; padding: 4px 8px; font-weight: 500; color:#555; border: 1px solid #ddd; }
.subpage section.sec-body .category-box>.inner>button.current { background-color: #b70c0c; border: 1px solid rgb(255 255 255 / 25%); color:#fff !important; }

.subpage section.sec-body .sorting-box { padding: 10px 0; text-align: right; }
.subpage section.sec-body .sorting-box>div { display: flex; align-items: center; justify-content: right; gap:8px; }
.subpage section.sec-body .sorting-box button.bt-sort { background-color: transparent; border:none; }
.subpage section.sec-body .sorting-box button.bt-sort.active { text-decoration: underline; font-weight: 600; }




/* ========================================================= */
/*                        page-item                          */
/* ========================================================= */
/* common */
.page-item table.table tr>th,
.page-item table.table tr>td { padding: 10px 10px; background-color: #fff; }
.page-item table.table tr>th { width: 20%; word-break: keep-all; background-color: #ededed !important; }

/* list - fabric */
.page-item.list.item-fabric .category-box { margin: 0; }
.page-item.list.item-fabric .sub-category { border-bottom: 1px solid #eee; background-color: #fff; padding: 5px 0; margin-bottom: 10px; }
.page-item.list.item-fabric .sub-category button.bt-scate { border:none; background: transparent; font-size: 15px; font-weight: 500; color:#666; margin-right: 5px; }
.page-item.list.item-fabric .sub-category button.bt-scate.active { font-weight: 700; color:#333; }

/* list - best */
.page-item.list.item-best .main-items { counter-reset: item-counter; }
.page-item.list.item-best .main-items .item { position: relative; }
.page-item.list.item-best .main-items .item::before {
  content: counter(item-counter);
  counter-increment: item-counter;
  position: absolute;
  top: 0px;
  left: 0px;
  background: rgba(0, 0, 0, 0.525);
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page-item.list.item-best .main-items .item .txt-box {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 10px 6px;
  background-color: rgb(0 0 0 / 20%);
}
.page-item.list.item-best .main-items .item .txt-box p.tit {
  color:#fff;
  border:none;
  padding:0;
  text-shadow: 1px 1px 6px #000;
  line-height: 1.25;
}

/* list - matching */
.page-item.list.item-matching .category-wrap {
  padding: 10px 5px 10px 15px;
  overflow: auto hidden;
  white-space: nowrap;
  background-color: #fff;
  margin-bottom: 10px;
}
.page-item.list.item-matching .category-wrap .inner {
  display: flex;
  gap:5px;
  min-width: 650px;
  flex-wrap: wrap;
}
.page-item.list.item-matching .category-wrap button {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap:5px;
  padding:4px 10px;
  border:2px solid #eee;
  border-radius: 20px;
  background-color: #fff;
}
.page-item.list.item-matching .category-wrap button>img {
  width: 26px;
  height: 26px;
}
.page-item.list.item-matching .category-wrap button>span {
  line-height: 1;
  padding-right: 5px;
}


/* ================================================================== */
/*                        page-item (detail)                          */
/* ================================================================== */
.page-item.detail .sec-head { margin-bottom: 20px; }
.page-item.detail .sec-head>span:last-child::before { content:'-'; padding: 0 6px; color:#888; }
.page-item.detail .slider-wrap { position: relative; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px;
  margin-bottom: 10px; }
.page-item.detail .slider-wrap .swiper.main-slider { width: 100%; }
.page-item.detail .slider-wrap .swiper.thumbnail-slider { width: 100%; }
.page-item.detail .slider-wrap .swiper.thumbnail-slider .swiper-slide { position: relative; width: calc(20% - 4px); height: 70px; margin: 0 !important; cursor: pointer; }
.page-item.detail .slider-wrap .swiper-slide { background-size: cover; background-position: center; }
.page-item.detail .slider-wrap .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
.page-item.detail .slider-wrap .thumbnail-slider .swiper-slide { border: 2px solid #fff; }
.page-item.detail .slider-wrap .thumbnail-slider .swiper-slide.swiper-slide-thumb-active { border: 2px solid #f57faf; }
.page-item.detail .slider-wrap .thumbnail-slider .swiper-slide-thumb-active { opacity: 1; }

.page-item.detail .info-wrap { border-top: 2px solid #aaa; border-bottom: 2px solid #aaa; padding: 10px 5px; margin-bottom: 50px; }
.page-item.detail .info-wrap .item-box { margin-bottom: 20px; }
.page-item.detail .info-wrap .item-box>div { padding: 10px 5px; border-bottom: 1px solid #eee; }
.page-item.detail .info-wrap .item-box>div:last-child { border:none; }
.page-item.detail .info-wrap .item-box dl>dt { padding:0; }
.page-item.detail .info-wrap .item-box .name { font-size: 26px; font-weight: 700; line-height: 1; }
.page-item.detail .info-wrap .item-box .subs { font-size: 15px; color:#777; }
.page-item.detail .info-wrap .item-box .tags { display: flex; flex-wrap: wrap; gap:5px; margin-bottom: 10px; }
.page-item.detail .info-wrap .item-box .tags>a { padding:2px 12px; background-color: #eff8fd; border-radius: 25px; border:1px solid rgba(0 0 0 / 12%); font-size: 13px; 
  font-weight: 500; }
.page-item.detail .info-wrap .item-box .tags>a::before { content: '# '; color:#999; }
.page-item.detail .info-wrap .item-box .tags>a:hover { background-color: #c0e9ff; color: #478baf; }
.page-item.detail .info-wrap .item-box .prc-ori { font-size: 16px; font-weight: 500; color: #999; text-align: right; }
.page-item.detail .info-wrap .item-box .prc-cur { font-size: 22px; font-weight: 700; color: #222; text-align: right; }
.page-item.detail .info-wrap .item-box .prc-cur .dis-pct { font-size: 90%; color:#f57faf; margin-right: 10px; }

.page-item.detail .info-wrap .bt-box { display: flex; gap:8px; }
.page-item.detail .info-wrap .bt-box button { display: flex; gap:5px; align-items: center; justify-content: center; padding: 12px 10px; font-weight: 600; font-size:16px; flex-grow: 1; }
.page-item.detail .info-wrap .bt-box button.bt-favo {background-color: #fff; border:1px solid #eaeaea; }
.page-item.detail .info-wrap .bt-box button.bt-favo.added { border-color: #f57faf; }
.page-item.detail .info-wrap .bt-box button.bt-favo::after { content:'관심상품 저장'; }
.page-item.detail .info-wrap .bt-box button.bt-favo.added::after { content:'관심상품 삭제'; color:#8f8f8f; }
.page-item.detail .info-wrap .bt-box button.bt-buy { background-color: #f57faf; color:#fff; }
.page-item.detail .info-wrap .bt-box button.bt-buy:hover { background-color: #f57faf; }

.page-item.detail .content-wrap>div { margin-bottom: 30px; }
.page-item.detail .content-wrap .fabric-list .item-wrap { display: flex; flex-wrap: wrap; gap:20px; }
.page-item.detail .content-wrap .fabric-list .item-wrap .item { flex: 0 0 calc(50% - 10px); position: relative; overflow: hidden; margin-bottom: 0; }
.page-item.detail .content-wrap .fabric-list .item-wrap .item::after { content: ''; display: block; padding-bottom: 230px; }
.page-item.detail .content-wrap .fabric-list .item-wrap .item>img { border: 1px solid #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.page-item.detail .content-wrap .fabric-list .item-wrap .item>p { position: absolute; bottom: 0; width: 100%; padding:3px; border: 1px solid #fff; 
  background: #fff; text-align: center; font-size: 16px; font-weight: 500; }
.page-item.detail .content-wrap .fabric-ori .img-box { width: 180px; margin: 0 auto; }
.page-item.detail .content-wrap .item-box { background: #fdfcec; padding: 5px 0; border-top: 1px solid #efe5cb; border-bottom: 1px solid #efe5cb; }
.page-item.detail .content-wrap .dt-cont-box img { height: auto !important; }

.page-item.detail .item-deal p.title { font-size: 18px; font-weight: 500; }
.page-item.detail .item-deal .deal-slider { padding-top: 25px; }
.page-item.detail .item-deal .deal-slider>.swiper-pagination-progressbar { height: 2px; }
.page-item.detail .item-deal .deal-slider>.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background-color: #666; }
.page-item.detail .item-deal .deal-slider .swiper-slide { background-color: #27262b; cursor: pointer; position: relative; }
.page-item.detail .item-deal .deal-slider .swiper-slide::after { content: ""; display: block; padding-bottom: 125%; }
.page-item.detail .item-deal .deal-slider .swiper-slide>img { position: absolute; top:0; left:0; }
.page-item.detail .item-deal .deal-slider .swiper-slide ul.i-inf { width: 100%; position: absolute; bottom: -60px; background-color: rgba(0 0 0 / 25%); padding: 10px 15px; 
  transition: all ease-out 0.25s; }
.page-item.detail .item-deal .deal-slider .swiper-slide:hover ul.i-inf { bottom: 0; background-color: rgba(0 0 0 / 55%); }
.page-item.detail .item-deal .deal-slider .swiper-slide ul.i-inf>li { color:#fff; }
.page-item.detail .item-deal .deal-slider .swiper-slide ul.i-inf>li.name { font-size: 16px; font-weight: 500; margin-bottom: 10px; }
.page-item.detail .item-deal .deal-slider .swiper-slide ul.i-inf>li.sub { color:#e0e0e0; }
.page-item.detail .item-deal .deal-slider .swiper-slide ul.i-inf>li.prc { font-size: 15px; font-weight: 500; text-align: right; margin-top: 10px; }

/* 담당자 정보 팝업 */
.modal .item-contact button.bt-connect {
  margin-top: 50px;
  border-radius: 8px;
  background-color: #fff;
  border:2px solid #666;
  padding: 8px 40px;
}


/* ============================================================================== */
/*                          쇼핑몰 아이템 (goods / detail)                        */
/* ============================================================================== */
.page-goods.detail { background-color: #fff; }
.page-goods.detail section { margin-bottom: 80px; }
.page-goods.detail .item-idx { display: block; }
.page-items.detail .slider-wrap, .page-items.detail .order-wrap { width: 100%; }
.page-goods.detail .slider-wrap { position: relative; display: flex; justify-content: center; flex-direction: column; align-items: flex-start; gap: 8px; padding: 0; }
.page-goods.detail .slider-wrap .swiper-slide { background-size: cover; background-position: center; }
.page-goods.detail .slider-wrap .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
.page-goods.detail .slider-wrap .main-slider { width: 100%; height: 350px; }
.page-goods.detail .slider-wrap .main-slider .swiper-slide img { cursor: zoom-in; }
.page-goods.detail .slider-wrap .thumbnail-slider { width: 100%; height: auto; }
.page-goods.detail .slider-wrap .thumbnail-slider .swiper-wrapper { flex-direction: row; flex-wrap: wrap; gap: 5px; }
.page-goods.detail .slider-wrap .thumbnail-slider .swiper-slide { position: relative; width: calc(20% - 4px); height: 70px; margin: 0 !important; border: 2px solid #fff; }
.page-goods.detail .slider-wrap .thumbnail-slider .swiper-slide img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.page-goods.detail .slider-wrap .thumbnail-slider .swiper-slide.swiper-slide-thumb-active { border: 2px solid #e58c43; opacity: 1; }
.page-goods.detail .order-wrap { width: 100%; margin-top: 15px; position: relative; }
.page-goods.detail .order-wrap .zoom-container { display: none; position: absolute; top: 0; left: -195px; width: 517px; height: 665px; border: 2px solid #e58c43; 
  background-color: #eee; overflow: hidden; box-shadow: 1px 1px 8px rgb(0 0 0 / 55%); z-index: 110; }
.page-goods.detail .order-wrap .zoom-container img { position: absolute; max-width: none; max-height: none; }
.page-goods.detail .item-box { border-top: 2px solid #aaa; border-bottom: 2px solid #aaa; margin-bottom: 45px; font-size: 14px; }
.page-goods.detail .item-box>div { padding: 10px 5px; border-bottom: 1px solid #eee; }
.page-goods.detail .item-box>div:last-child { border:none; }
.page-goods.detail .item-box dl>dt { min-width: 100px; }
.page-goods.detail .item-box .is-01 .name { font-size: 26px; font-weight: 700; }
.page-goods.detail .item-box .is-01 .subs { font-size: 15px; color:#777; margin-bottom: 10px; }
.page-goods.detail .item-box .is-01 .tags { display: flex; flex-wrap: wrap; gap:5px; margin-bottom: 20px; }
.page-goods.detail .item-box .is-01 .tags>a { padding:2px 12px; background-color: #eff8fd; border-radius: 25px; border:1px solid rgba(0 0 0 / 12%);
  font-size: 13px; font-weight: 500; }
.page-goods.detail .item-box .is-01 .tags>a::before { content: '# '; color:#999; }
.page-goods.detail .item-box .is-01 .tags>a:hover { background-color: #c0e9ff; color: #478baf; }
.page-goods.detail .item-box .is-01 .prc-ori { font-size: 16px; font-weight: 500; color: #999; text-align: right; }
.page-goods.detail .item-box .is-01 .prc-cur { font-size: 22px; font-weight: 700; color: #222; text-align: right; }
.page-goods.detail .item-box .is-01 .prc-cur .dis-pct { font-size: 90%; color:#f57faf; margin-right: 10px; }
.page-goods.detail .item-box .is-03 .option-container { display: block; }
.page-goods.detail .item-box .is-03 .option-container>dd.opt-list { display: flex; flex-wrap: wrap; gap: 5px; max-height: 200px; overflow: auto; border: 1px solid #e8e8e8;
  padding: 5px 5px; border-radius: 5px; background: #fbfbfb; }
.page-goods.detail .item-box .is-03 .option-container button { position: relative; width: 68px; height: 70px; overflow: hidden; border-width: 2px; padding:0; }
.page-goods.detail .item-box .is-03 .option-container button.selected { border-color: #f57faf; background-color: #444; color:#fff; font-weight: 600; }
.page-goods.detail .item-box .is-03 .option-container button>p { width: 100%; position: absolute; bottom: 0; background-color: rgb(0 0 0 / 35%); color:#fff; }
.page-goods.detail .item-box .is-03 .option-container button.selected>p { background-color: rgb(0 0 0 / 65%); color:#f57faf; font-weight:700; }
.page-goods.detail .item-box .is-04 .added-item { background: #f6f9f9; padding: 10px 15px; position: relative; border: 1px solid rgb(0 0 0 / 5%); border-radius: 3px;
  margin-bottom: 5px; }
.page-goods.detail .item-box .is-04 .added-item:last-child { margin-bottom: 0; }
.page-goods.detail .item-box .is-04 .added-item .i-tit { margin-bottom: 10px; font-size: 13px; }
.page-goods.detail .item-box .is-04 .added-item .i-tit>span.option-name { font-size: 15px; font-weight: 600; }
.page-goods.detail .item-box .is-04 .added-item button.bt-del { position: absolute; top: 5px; right: 5px; font-size: 14px; color: #8b8b8b; border:none; }
.page-goods.detail .item-box .is-04 .added-item button.bt-del:hover { color:#bb6161; }
.page-goods.detail .item-box .is-04 .added-item .fn-box { display: flex; justify-content: space-between; align-items: flex-end; }
.page-goods.detail .item-box .is-04 .added-item .fn-box .ai-price>span { font-size: 20px; font-weight: 600;}
.page-goods.detail .item-box .is-04 p.empty { color:#aaa; }

.page-goods.detail .item-box .modi-num { width: 135px; }
.page-goods.detail .item-box .modi-num>button { background-color: #f7f7f7; }
.page-goods.detail .item-box .modi-num>input { text-align: center; padding: 0;}
.page-goods.detail .item-box .fin-price>span { font-size: 25px; font-weight: 700; }
.page-goods.detail .item-box .fin-price>small { font-size: 15px; margin-left: 2px; }
.page-goods.detail .item-box .fin-opt>span { font-weight: 500; color:#555; }
.page-goods.detail .item-box .fin-opt>span::before { content:'선택옵션 : '; font-weight: 400; color:#999; }

.page-goods.detail .bt-box { display: flex; gap: 8px; position: fixed; bottom: 0; left: 0; width: 100%; background: #fff; padding: 5px 5px; border-top: 1px solid #ddd; 
  z-index: 111; }
.page-goods.detail .bt-box button { padding: 15px 10px; font-weight: 600; font-size: 16px; }
.page-goods.detail .bt-box button.bt-favo { flex: 0 0 80px; position: relative; background-color: #fff; border:1px solid #eaeaea; }
.page-goods.detail .bt-box button.bt-favo.added { border-color: #f57faf; }
.page-goods.detail .bt-box button:not(.bt-favo) { flex-grow: 1; }
.page-goods.detail .bt-box button.bt-buy { background-color: #f57faf; color:#fff; }
.page-goods.detail .bt-box button.bt-buy:hover { background-color: #e46e9d; }

.page-goods.detail .tab-btns .nav button { width: 100%; padding: 10px 4px; font-size: 15px; background-color: #fff; }
.page-goods.detail .tab-btns .nav button.active { background-color: #222; color:#fff; }
.page-goods.detail .content-box:not(:last-child) { margin-bottom: 60px; }
.page-goods.detail .content-box table.table tr>th,
.page-goods.detail .content-box table.table tr>td { padding: 10px 10px; }
.page-goods.detail .content-box ul[class*="list-st"]>li { font-size: 15px; }


/* 상세탭1 - 상세정보 */
.page-goods.detail .fabric-infobox .fabric-list { margin-bottom: 50px; }
.page-goods.detail .fabric-infobox .fabric-list .item-wrap { display: flex; flex-wrap: wrap; gap:20px; }
.page-goods.detail .fabric-infobox .fabric-list .item { flex:0 0 calc(50% - 10px); position: relative; overflow: hidden; margin-bottom: 0; }
.page-goods.detail .fabric-infobox .fabric-list .item::after { content: ''; display: block; padding-bottom: 230px; }
.page-goods.detail .fabric-infobox .fabric-list .item>img { border: 1px solid #777; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.page-goods.detail .fabric-infobox .fabric-list .item>p { position: absolute; bottom: 0; width: 100%; padding:3px; border: 1px solid #777; border-top: none; background: #f9f9f9;
  text-align: center; font-size: 16px; font-weight: 500; }
.page-goods.detail .fabric-infobox .fabric-ori { flex: 0 0 180px; }
.page-goods.detail .i-box { margin-bottom: 25px; }
.page-goods.detail .i-box table.table tr>th { width: 20%; word-break: keep-all; }
.page-goods.detail .i-box>h4.ihead { margin-bottom: 0; }
.page-goods.detail .i-box>h4.ihead>span { color:#c3a060; }
.page-goods.detail .i-box>div.ibody { background: #faf7ef; padding: 8px 0 12px; border-bottom: 1px solid #f4eedf; }

/* 상세탭2 - 후기 */
.page-goods.detail .review-wrap .func {
  display: flex;
  align-items: center;
  justify-content: right;
  gap: 5px;
  margin-bottom: 10px;
}
.page-goods.detail .review-wrap .func button {
  position: relative;
  margin-left: 10px;
  background: none;
  border:none;
  padding: 2px 2px;
  color:#555;
  font-size: 14px;
}
.page-goods.detail .review-wrap .func button:not(:last-child)::after {
  content:'';
  width: 2px;
  height: 12px;
  background-color: #eee;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: -8px;
}
.page-goods.detail .review-wrap .func button.selected,
.page-goods.detail .review-wrap .func button:hover {
  font-weight: 600;
  color:#000;
}
.page-goods.detail .review-wrap ul.reviews>li.item:not(.empty) { 
  min-height: 160px;
}
.page-goods.detail .review-wrap ul.reviews>li.item .r-head>.tits {
  flex: 0 0 calc(100% - 300px);
}
.page-goods.detail .review-wrap ul.reviews>li.item .r-head>.dates {
  flex: 0 0 250px;
}
.page-goods.detail .review-wrap ul.reviews>li.item .r-head>.dates>em {
  color:#555;
  margin-right: 15px;
}
.page-goods.detail .review-wrap ul.reviews>li.item .r-body .img-box:not(.no-slider) {
  cursor: pointer;
}
.page-goods.detail .review-wrap .list-box .pagination {
  margin-top: 30px;
}

.review-slider.swiper .swiper-slide { display: flex; align-items: center; justify-content: center; height: auto; }
.review-slider.swiper .swiper-pagination-bullet { border: 1px solid #777; background-color: #fff; }
.review-slider.swiper .swiper-button-next, .review-slider.swiper .swiper-button-prev { color:#333; 
  text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.25), 1px -1px 0 rgba(255, 255, 255, 0.25), -1px 1px 0 rgba(255, 255, 255, 0.25), 1px 1px 0 rgba(255, 255, 255, 0.25); }
.review-slider.swiper .swiper-button-next { right:0;}
.review-slider.swiper .swiper-button-prev { left:0; }


/* 상세탭4 - 반품/교환 */
.page-goods.detail .returns { margin-top: 15px; }
.page-goods.detail .returns>div:not(:last-child) { margin-bottom: 15px; }
.page-goods.detail .returns h5 { margin-bottom: 10px; }
.page-goods.detail .returns h5>span { font-size: 16px; font-weight: 500; border-bottom: 1px solid #555; }

.page-goods.detail .item-deal p.title { font-size: 20px; font-weight: 500; }
.page-goods.detail .item-deal .deal-slider { padding-top: 25px; }
.page-goods.detail .item-deal .deal-slider>.swiper-pagination-progressbar { height: 2px; }
.page-goods.detail .item-deal .deal-slider>.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background-color: #666; }
.page-goods.detail .item-deal .deal-slider .swiper-slide { background-color: #27262b; cursor: pointer; position: relative; }
.page-goods.detail .item-deal .deal-slider .swiper-slide::after { content: ""; display: block; padding-bottom: 125%; }
.page-goods.detail .item-deal .deal-slider .swiper-slide>img { position: absolute; top:0; left:0; }
.page-goods.detail .item-deal .deal-slider .swiper-slide ul.i-inf { width: 100%; position: absolute; bottom: -60px; background-color: rgba(0 0 0 / 25%); padding: 10px 15px; 
  transition: all ease-out 0.25s; }
.page-goods.detail .item-deal .deal-slider .swiper-slide:hover ul.i-inf { bottom: 0; background-color: rgba(0 0 0 / 55%); }
.page-goods.detail .item-deal .deal-slider .swiper-slide ul.i-inf>li { color:#fff; }
.page-goods.detail .item-deal .deal-slider .swiper-slide ul.i-inf>li.name { font-size: 16px; font-weight: 500; margin-bottom: 10px; }
.page-goods.detail .item-deal .deal-slider .swiper-slide ul.i-inf>li.sub { color:#e0e0e0; }
.page-goods.detail .item-deal .deal-slider .swiper-slide ul.i-inf>li.prc { font-size: 15px; font-weight: 500; text-align: right; margin-top: 10px; }


/* ========================================================= */
/*                         community                         */
/* ========================================================= */
.community.subpage { background-color: #fff; }
.community.list .sec-head { margin-bottom: 15px; }
.community.list .tab-btns { margin-bottom: 10px; }
.community.list .tab-btns ul.nav>li>button {
  background: #eee;
  border:none;
  border-radius: 20px;
  padding: 6px 25px;
  margin-right: 15px;
}
.community.list .tab-btns ul.nav>li>button.active {
  background-color: #000;
  color:#fff;
}

.community.list .article-wrap>.item { 
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #eee;
}
.community.list .article-wrap>.item>a:hover {
  text-decoration: underline;
}
.community.list .article-wrap>.item .a-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.community.list .article-wrap>.item .a-head ul>li.i-tit {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 3px;
}
.community.list .article-wrap>.item .a-head>img {
  flex: 0 0 80px;
  height: 80px;
  object-fit: cover;
  overflow: hidden;
  border-radius: 4px;
}
.community.list .article-wrap>.item .a-btm i {
  color:#aaa;
}
.community.list .article-wrap>.item .a-btm span {
  font-weight: 500;
  font-size: 12px;
  color:#666;
  padding: 0 3px;
}
.community.list .btn-box { margin-top: 20px; }

.community.view .sec-body {
  padding-bottom: 80px;
}
.community.view .sec-body .a-title {
  padding: 10px 0; 
  margin-bottom: 20px;
}
.community.view .sec-body .a-title p.tit {
  font-size: 16px;
  margin-bottom: 5px;
}
.community.view .sec-body .a-title .sub {
  display: flex;
  justify-content: space-between;
  color:#858585;
}
.community.view .sec-body .a-content {
  margin-bottom: 40px;
}
.community.view .sec-body .a-comm {
  border-bottom: 1px solid #ddd;
}
.community.view .sec-body .a-comm>p {
  padding: 5px;
  background: #f2f2f2;
}
.community.view .sec-body .a-comm .comment-wrap>.item.no-comm>p {
  padding:30px 30px;
  text-align: center;
  color: #999;
  background: #f5f1f1;
}
.community.view .sec-body .a-comm .comment-wrap>.item {
  padding: 15px 8px 15px;
  border-bottom: 1px solid #ddd;
}
.community.view .sec-body .a-comm .comment-wrap>.item .i-func {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.community.view .sec-body .a-comm .comment-wrap>.item .i-func>span {
  color:#888;
}
.community.view .sec-body .a-comm .comment-wrap>.item .i-func button.bt-del-this {
  background-color: #fff;
  padding: 5px 10px;
  line-height: 1;
}
.community.view .sec-body .a-comm .comment-wrap>.item .i-text>p {
  font-size: 14px;
}
.community.view .sec-body .a-btns {
  padding: 15px 0;
}
.community.view .reply-box {
  position: fixed;
  bottom: 0;
  width: 100%;
  background: #f2f2f2;
  border-top:1px solid #ddd;
  padding: 10px 10px;
  display: flex;
  gap: 10px;
}
.community.view .reply-box>button {
  padding: 0 20px;
  background-color: #330607;
  color:#fff;
  border-radius: 3px;
}

.community.write .btn-box {
  position: fixed;
  bottom: 0;
  width: 100%;
  background: #f2f2f2;
  border-top: 1px solid #ddd;
  padding: 10px 10px;
  display: flex;
  gap: 10px;
}
.community.write .btn-box button {
  flex: 1;
  background-color: #fff;
  height: 38px;
  font-size: 15px;
}
.community.write .btn-box button.bt-save {
  flex:0 0 65%;
  background-color: #330607;
  color:#fff;
}




/* ========================================================= */
/*                         page-cart                         */
/* ========================================================= */
.page-cart .c-list .func-panel { margin-bottom: 20px; }
.page-cart .c-list, 
.page-cart .c-order {
  padding: 0;
  margin-bottom: 40px;
}
.page-cart .c-list .item-wrap {
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.page-cart .c-list .item-wrap:last-child { 
  padding-bottom: 0; 
  margin-bottom: 0; 
  border:none; 
}
.page-cart .c-list .item-wrap ul {
  background: #fcfcfc;
  padding: 0px 5px;
  border-top: 1px solid #f1f1f1;
}
.page-cart .c-list .item-wrap ul>li.item {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
  padding: 10px 5px;
  border-bottom: 2px solid #fff;
}
.page-cart .c-list .item-wrap ul>li.item:last-child {
  border:none;
}
.page-cart .c-list .item-wrap ul>li.item>.i-chk {
  flex: 0 0 30px;  
}
.page-cart .c-list .item-wrap ul>li.item>.i-img {
  flex: 0 0 50px;
  background: #f5f5f5;
}
.page-cart .c-list .item-wrap ul>li.item>.i-inf {
  min-width: 30%;
  padding: 0 10px;
}
.page-cart .c-list .item-wrap ul>li.item>.i-inf p.item-nm {
  font-size: 15px;
  font-weight: 500;
}
.page-cart .c-list .item-wrap ul>li.item>.i-inf p.item-op {
  font-size: 14px;
}
.page-cart .c-list .item-wrap ul>li.item>.i-opt {
  flex: 0 0 100%;
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #eee;
  margin-top: 10px;
  padding-top: 5px;
}
.page-cart .c-list .item-wrap ul>li.item>.i-opt .mod-box {
  display: flex;
  flex-direction: row;
  gap:5px;
  width: 100%;
  margin-top: 5px;
  margin-bottom: 5px;
  padding-left: 30px;
}
.page-cart .c-list .item-wrap ul>li.item>.i-opt button.bt-num {
  width: 32px;
  padding: 0;
  background: #f7f7f7;
}
.page-cart .c-list .item-wrap ul>li.item>.i-opt .mod-box>button {
  width: auto;
}
.page-cart .c-list .item-wrap ul>li.item>.i-opt input {
  text-align: center;
  max-width: 60px;
}
.page-cart .c-list .item-wrap ul>li.item>.i-opt .item-price { width: 100%; }
.page-cart .c-list .item-wrap ul>li.item>.i-opt .item-price p {
  font-size: 22px;
  font-weight: 500;
  text-align: right;
}
.page-cart .c-list .item-wrap ul>li.item>.i-opt .item-price p::before {
  color:#888;
}
.page-cart .c-list .item-wrap .d-price {
  display: flex;
  justify-content: space-between;
  background: #f2f9fd;
  text-align: right;
  padding: 5px 10px 5px;
  border-bottom: 1px solid #deeaf1;
  font-size: 14px;
}
.page-cart .c-list .item-wrap .d-price span.dprc::before {
  content:'배송비 \20A9';
}
.page-cart .c-list .empty-cart-msg {
  background: #fbf1f1;
  padding: 60px;
  border: 1px solid rgb(0 0 0 / 5%);
  border-radius: 4px;
  font-size: 14px;
  color: #885b5b;
  text-align: center;
}
.page-cart .c-order dl { 
  padding-bottom: 15px;
  margin-bottom: 30px; 
  border-bottom: 1px solid #aaa;
}
.page-cart .c-order dl>dt,
.page-cart .c-order dl>dd { padding: 10px 0; }
.page-cart .c-order dl>dt { font-size: 15px; font-weight: 500; color: #666; }
.page-cart .c-order dl>dd { position: relative; }
.page-cart .c-order dl>dd input { width: 100%; border:none; padding-right: 25px; text-align: right; font-size: 24px; font-weight: 600; }
.page-cart .c-order dl>dd span { position: absolute; bottom:15px; right:5px; font-size: 16px; }



/* ========================================================= */
/*                        page-payment                       */
/* ========================================================= */
.page-payment>div.container { padding-bottom: 80px; }
.page-payment .box-detail>div { margin-bottom: 50px; }
.page-payment .list-container .item-wrap {
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.page-payment .list-container .item-wrap:last-child { 
  padding-bottom: 0; 
  margin-bottom: 0; 
  border:none; 
}
.page-payment .list-container .item-wrap ul {
  background: #fcfcfc;
  padding: 10px;
  border-top: 1px solid #f1f1f1;
}
.page-payment .list-container .item-wrap ul>li.item {
  display: flex;
  align-items: center;
  padding: 5px 2px;
  border-bottom: 2px solid #fff;
}
.page-payment .list-container .item-wrap ul>li.item:last-child {
  border:none;
}
.page-payment .list-container .item-wrap ul>li.item>div {
  flex-grow: 1;
}
.page-payment .list-container .item-wrap ul>li.item>.i-img {
  flex: 0 0 60px;
  background: #f5f5f5;
}
.page-payment .list-container .item-wrap ul>li.item>.i-inf {
  min-width: 40%;
  padding: 0 20px;
}
.page-payment .list-container .item-wrap ul>li.item>.i-inf p.item-nm {
  font-size: 15px;
  font-weight: 500;
}
.page-payment .list-container .item-wrap ul>li.item>.i-inf p.item-op {
  font-size: 14px;
}
.page-payment .list-container .item-wrap ul>li.item>.i-opt {
  flex: 0 0 200px;
}
.page-payment .list-container .item-wrap ul>li.item>.i-opt .mod-box {
  display: flex;
  margin-bottom: 5px;
}
.page-payment .list-container .item-wrap ul>li.item>.i-opt button.bt-num {
  background: #f7f7f7;
}
.page-payment .list-container .item-wrap ul>li.item>.i-opt input {
  text-align: center;
  max-width: 60px;
}
.page-payment .list-container .item-wrap ul>li.item>.i-opt .item-price p {
  font-size: 22px;
  font-weight: 500;
  text-align: right;
}
.page-payment .list-container .item-wrap ul>li.item>.i-opt .item-price p::before {
  color:#888;
}
.page-payment .list-container .item-wrap .d-price {
  display: flex;
  justify-content: space-between;
  background: #f2f9fd;
  text-align: right;
  padding: 5px 10px 5px;
  border-bottom: 1px solid #deeaf1;
  font-size: 14px;
}
.page-payment .list-container .item-wrap .d-price span.dprc::before { content:'배송비 \20A9'; }
.page-payment .box-detail dl>dt { width: 100px; font-size: 14px; font-weight: 500; }
.page-payment .p-shipping { position: relative; }
.page-payment .p-shipping button.bt-myAddr { position: absolute; top:-5px; right:0; }
.page-payment .p-shipping .bt-exePost { background-color: #efefef; }

.page-payment .agree-box { margin-bottom: 30px; }
.page-payment .agreement { border-top: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; padding: 20px 25px;background: #fcfcfc; }
.page-payment .agreement p { font-size: 14px; font-weight: 500; color:#888; margin-bottom: 3px; }
.page-payment .agreement>div { margin-bottom: 15px; }
.page-payment .agreement>div:last-child { margin-bottom: 0; }
.page-payment .agreement label>span { font-size: 14px; font-weight: 500; letter-spacing: -1px; }
.page-payment .payment-box .select-pay { margin-bottom: 20px; }
.page-payment .payment-box .select-pay>ul>li { padding: 2px 5px; margin-bottom: 10px; }
.page-payment .payment-box .select-pay>ul>li:hover { background: #e2f1fa; }
.page-payment .payment-box .select-pay>ul>li label { display: block; }
.page-payment .payment-box .select-pay>ul>li label>span.ip { font-size: 15px; font-weight: 500; color:#5b5b5b; }
.page-payment .payment-box .select-pay>ul>li:hover label>span.ip { color:#3d657e; }
.page-payment .payment-box .select-pay>ul>li label>input:checked+span.ip { color:#3d657e; font-weight: 600; }
.page-payment .payment-box .select-pay>p { font-size: 12px; padding: 5px 5px 0; border-top: 1px solid #eee; }

.page-payment .purchase {
  position: fixed;
  bottom: 0;
  left: 0;
  right:0;
  margin: 0 auto;
  max-width: 500px;
  width: 100%;
  z-index: 111;
  background: #f4fbff;
  padding: 10px 10px;
  border-top: 1px solid #333;
  display: block;
}
.page-payment .purchase .f-price {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 50px;
  margin: 0;
  padding: 5px 5px;
}
.page-payment .purchase .f-price>span:first-child {
  font-size: 13px;
  font-weight: 500;
  color: #3d657e;
}
.page-payment .purchase .f-price>span.kwon {
  font-size: 22px;
  font-weight: 700;
  color: #3d657e;
}
.page-payment .purchase .f-price>span.kwon::after {
  font-size: 50%;
  font-weight: 400;
}
.page-payment .purchase button.bt-proceed { height: 50px; margin-top: 5px; padding:0; }

.page-payment .order-info>ul { margin-bottom: 50px; }
.page-payment .order-info>ul>li { text-align: center; }
.page-payment .order-info>ul>li:first-child { font-size: 28px; }
.page-payment .order-info>ul>li:nth-child(2) { font-size: 15px; margin-bottom: 20px; }
.page-payment .order-info>ul>li:nth-child(2)>span { font-weight: 500; background: #eee; }

.page-payment .order-info>div {
  max-width: 500px;
  margin: 0 auto 30px;
}
.page-payment .order-info .inf-pay { 
  padding: 25px 25px;
  background-color: #f6f6f6;
  border-radius: 3px;
}
.page-payment .order-info .inf-pay>p { 
  font-size: 16px; font-weight: 600; margin-bottom: 20px; 
  background: #fff;
  border-bottom: 1px solid #e2e2e2;
  padding: 5px 10px;
}
.page-payment .order-info .inf-pay dl dt,
.page-payment .order-info .inf-pay dl dd { font-size: 15px; }
.page-payment .order-info .inf-pay dl dt { color:#888; }

/* 배송지 선택 팝업 */
.modal .mod-mydel ul>li:not(:last-child) {
  margin-bottom: 20px;
}
.modal .mod-mydel ul>li>label {
  position: relative;
  width: 100%;
  display: block;
  padding: 10px 15px;
  border: 2px solid #e9e9e9;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  transition: all ease 0.25s;
}
.modal .mod-mydel ul>li>label:hover {
  background: #e9f9ff;
}
.modal .mod-mydel ul>li.selected>label {
  border: 2px solid #0077fe;
  background-color: #eff9fd;
  padding: 10px 50px;
}
.modal .mod-mydel ul>li>label::before {
  content: '';
  border-right: 3px solid transparent;
  border-top: 3px solid transparent;
  display: block;
  position: absolute;
  top: 33px;
  left: 12px;
  width: 14px;
  height: 25px;
  transform: scaleX(-1) rotate(135deg);
  transform-origin: left top;
}
.modal .mod-mydel ul>li.selected>label::before {
  animation: check_ani .5s;
  border-color: #0077fe;
}
.modal .mod-mydel ul>li>label .title {
  font-size: 16px;
  font-weight: 500;
  color: #666;
}
.modal .mod-mydel ul>li>label .addrs {
  display: flex;
  align-items: center;
  gap:10px;
}
.modal .mod-mydel ul>li>label .addrs>em {
  width: 2px;
  height: 14px;
  background-color: #d3d3d3;
}
.modal .mod-mydel ul>li.empty {
  padding: 40px;
  background: #fbf7f7;
  color: #919191;
  text-align: center;
  font-size: 14px;
}


/* ========================================================= */
/*                         page-auth                         */
/* ========================================================= */
.page-auth { min-height: 100vh; display: flex; padding: 80px 0 50px; }
.page-auth>div.container { max-width: 480px; }
.page-auth .hd-tit { margin-bottom: 80px; }
.page-auth .hd-tit img { max-width: 65%; }
.page-auth .ck-box { display: flex; align-items: center; justify-content: space-between; }
.page-auth button.btn { font-weight: 500; }

.page-auth div.agreement { margin: 20px 0; }
.page-auth div.agreement .agr-all {
  padding: 4px 8px;
  background: #eee;
  margin-bottom: 5px;
}
.page-auth div.agreement .agr-terms {
    padding: 0 8px;
}
.page-auth div.agreement .agr-terms>ul>li {
  margin-bottom: 5px;
}
.page-auth div.agreement .agr-terms>ul>li>button {
  display: inline-block;
  vertical-align: text-top;
  margin-left: 10px;
}
.page-auth div.agreement .checkBox>span.ip {
  font-size: 13px;
}
.page-auth div.agreement .checkBox.chk-all {
  width: 100%;
}
.page-auth div.agreement .checkBox.chk-all>span.ip {
  font-size: 15px;
  line-height: 26px;
}
.page-auth div.agreement .sub-chker {
  padding-left: 25px;
}
.page-auth div.agreement .sub-chker label {
  margin-right: 50px;
}


/* ================================================================== */
/* ---------------------------- My Page ----------------------------- */
/* ================================================================== */
/* common */
.subpage.mypage section.sec-head { margin-bottom: 20px; }
.subpage.mypage h4 { border-bottom: 2px solid #bbb; padding-bottom: 3px; margin-bottom: 10px; font-size: 15px; }
.subpage.mypage ul.pagination { margin-top: 20px; }
.subpage.mypage table.table { border-top: 1px solid #dee4e9; }
/* .subpage.mypage table.table>thead>tr>th, 
.subpage.mypage table.table>tbody>tr>td { border-top: none; border-bottom: 1px solid #dee4e9; padding: 18px 14px; font-size: 15px; }
.subpage.mypage table.table>thead>tr>th { border-bottom: 1px solid #eaeaea; }
.subpage.mypage table.table>tbody>tr>th { color: #6f6f6f; background: #f7f7f7; font-size: 14px; padding: 5px 10px; } */
.subpage.mypage .search-box { display: flex; flex-wrap: wrap;  justify-content: space-between; align-items: center; gap:5px; margin-bottom: 10px; }
.subpage.mypage .search-box>div { flex:0 0 100%; }
.subpage.mypage .search-box>div.period { display: flex; gap:5px; }
.subpage.mypage .mp-wrap>div { background: #fff; padding: 10px 10px; margin-bottom: 20px; }
.subpage.mypage .mp-wrap .search-box>div.period button { flex: 1; background-color: #fff; }

/* 마이페이지 메인 */
.mypage.main .sec-body>.container>div { margin-bottom: 30px; }
.mypage.main p.mem-grade { margin-bottom: 15px; }
.mypage.main p.mem-grade .a-grey { color:#666; }
.mypage.main .subs-grade { display: flex; justify-content: space-between; align-items: center; position: relative; }
.mypage.main .subs-grade::before {
  content: '';
  width: 90%;
  height: 2px;
  position: absolute;
  top:0;
  bottom: 0;
  left:0;
  right:0;
  margin: auto;
  background-color: #bbbbbb;
}
.mypage.main .subs-grade>.item {
  position: relative;
  width: calc(30% - 10px);
  aspect-ratio: 1/1;
  background-color: #e7e7e7;
  border: 3px solid #bbbbbb;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.mypage.main .subs-grade>.item.myGrade {
  border-color: #f57faf;
  background: #fff;
}
.mypage.main .subs-grade>.item>span {
  text-align: center;
  font-weight: 600;
  color:#888;
  font-size: 14px;
}
.mypage.main .subs-grade>.item.myGrade>span {
  color: #f57faf;
  font-size: 15px;
  font-weight: 800;
}
.mypage.main .bt-groups {
  position: relative;
  background: #fff;
  border: 2px solid #cfcfcf;
  border-radius: 8px;
  display: flex;
}
.mypage.main .bt-groups::before {
  content: '';
  width: 1px;
  height: 50%;
  position: absolute;
  top:0;
  bottom: 0;
  left:0;
  right:0;
  margin: auto;
  background-color: #ddd;
}
.mypage.main .bt-groups>a {
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  padding: 20px 20px;
}
.mypage.main .bt-groups>a>i { font-size: 22px; color:#777; }
.mypage.main .bt-groups>a>span { font-size: 16px; font-weight: 500; margin-left: 10px; }

.mypage.main .menu-list {
  background: #fff;
  border: 2px solid #cfcfcf;
  border-radius: 8px;
}
.mypage.main .menu-list>ul {
  display: flex;
  flex-wrap: wrap;
}
.mypage.main .menu-list>ul>li {
  flex: 0 0 50%;
  border-bottom: 1px solid #eee;
  border-right: 1px solid #eee;
}
.mypage.main .menu-list>ul>li:nth-child(2n) { border-right: none; }
.mypage.main .menu-list>ul>li:nth-last-child(-n+2) { border-bottom: none; }
.mypage.main .menu-list>ul>li>a { display: block; padding: 15px 10px; font-size: 15px; font-weight: 500; text-align: center; }



/* .subpage.mypage .my-acct { margin-bottom: 10px; }
.subpage.mypage .my-acct p { color: #fff; font-size: 16px; }
.subpage.mypage .my-state { width: 90%; background: rgb(0 0 0 / 28%); border-radius: 5px; margin: 0 auto; display: flex; align-items: center; gap: 10px; justify-content: space-around; }
.subpage.mypage .my-state>.sitem { position: relative; width: 25%; padding: 5px 1px; }
.subpage.mypage .my-state>.sitem:not(:last-of-type)::after { content:''; width: 1px; height: 55%; background-color: rgb(255 255 255 / 28%); margin: auto; position: absolute;
  top:0; right:0; bottom: 0; }
.subpage.mypage .my-state>.sitem>a { color:#fff; font-size: 20px; font-weight: 700; }
.subpage.mypage .my-state>.sitem>p { color:#ddd; font-size: 13px; font-weight: 500; letter-spacing: -1px; }

.subpage.mypage .ip-box>* { flex:1; vertical-align: middle; }
.subpage.mypage .mp-navi { border-bottom: 1px solid #e3e8eb; }
.subpage.mypage .mp-wrap { padding-left: 0px; }
.subpage.mypage .nav-cont::before,
.subpage.mypage .nav-cont::after { content:''; height: 49px; position: absolute; top:0; z-index: 2; }
.subpage.mypage .nav-cont::before { width: 30px; left:0; background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); }
.subpage.mypage .nav-cont::after { width: 40px; right:0; background: linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.15) 100%); }
.subpage.mypage .mp-navi>ul:not(:last-of-type) { padding-bottom: 25px; margin-bottom: 25px; border-bottom: 1px solid #e3e8eb; }
.subpage.mypage .mp-navi>ul>li:not(:last-of-type) { margin-bottom: 10px; }
.subpage.mypage .mp-navi>ul>li>a { display: block; }
.subpage.mypage .mp-navi>ul>li>a:hover { font-weight: 500; color: #f57faf; text-decoration: underline; }
.subpage.mypage .mp-navi>ul>li.current>a { font-weight: 600; color: #f57faf; }
.subpage.mypage .mp-navi { position: absolute; top:0; left:0; width: 100%; display: flex; flex-wrap: nowrap; overflow-x: auto; margin-bottom: 30px; padding: 10px 20px; 
  border-top: none; background-color: #fdfdfd; z-index: 1; cursor: grab; user-select: none; }
.subpage.mypage .mp-navi::-webkit-scrollbar { display: none; }
.subpage.mypage .mp-navi>ul.navi-list { display: flex; border:none; padding-bottom: 0; margin-bottom: 0; }
.subpage.mypage .mp-navi>ul.navi-list>li { margin-right: 15px; margin-bottom: 0; white-space: nowrap; }
.subpage.mypage .mp-navi>ul.navi-list>li>a { padding: 4px 4px; font-size: 14px; }
.subpage.mypage .mp-wrap .search-box { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.subpage.mypage .mp-wrap .search-box button.btn { font-weight: 400; }
.subpage.mypage .mp-wrap .list-box { margin-bottom: 40px; position: relative; }
.subpage.mypage .mp-wrap .list-box h4+a.v-all { position: absolute; top:5px; right:0; padding: 3px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details { border: 1px solid #eaeaea; border-radius: 10px; padding: 15px 20px 20px; margin-bottom: 20px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details:last-child { margin-bottom: 0; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-head { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 3px; margin-bottom: 20px;
  border-bottom: 1px solid #eee; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-head .o-sts { display: flex; align-items: center; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-head .o-sts>.deli { background: #555; color: #eee; padding: 1px 5px; margin-right: 5px; font-size: 13px;
  font-weight: 400; border:1px solid #555; border-radius: 3px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-head .o-sts>.deli.done { background-color: #fff; color:#555; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-head .o-sts .dat { font-size: 18px; font-weight: 700; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-body { display: flex; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-body .imgs { width: 90px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-body .order-inf { flex-grow: 1; position: relative; min-height: 100px; padding-left: 20px; font-size: 14px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-body .order-inf>*:not(:last-child) { margin-bottom: 10px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-body .order-inf .name { font-size: 22px; font-weight: 700; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-body .order-inf .price { font-size: 22px; font-weight: 600; text-align: right;}
.subpage.mypage .mp-wrap .list-box ul.lists>li.details .a-body .order-inf .bt-wrap { position: absolute; bottom: 0; right:0; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.empty { padding: 40px; background: #fbf7f7; color: #919191; text-align: center; font-size: 14px; }
.subpage.mypage .mp-wrap .list-box ul.lists.orders { display: flex; gap: 20px; flex-wrap: wrap; }
.subpage.mypage .mp-wrap .list-box ul.lists.orders>li.details { flex: 0 0 100%; margin-bottom: 0; padding: 10px 15px 12px; }
.subpage.mypage .mp-wrap .list-box ul.lists.item-wrap { display: flex; gap:20px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.item { position: relative; overflow: hidden; width: 20%; background-color: #27262b; cursor: pointer; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.item ul.i-inf { width: 100%; position: absolute; bottom: -50px; background-color: rgba(0 0 0 / 25%); padding: 10px 15px; 
  transition: all ease-out 0.25s; opacity: 0; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.item:hover ul.i-inf { opacity: 1; bottom: 0; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.item ul.i-inf>li { color:#fff; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.item ul.i-inf>li.name { font-size: 16px; font-weight: 500; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.item ul.i-inf>li.sub { color:#e0e0e0; margin-bottom: 5px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.item ul.i-inf>li.prc { font-size: 15px; font-weight: 500; text-align: right; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.article { border-bottom: 1px dotted #f2f2f2; margin-bottom: 5px; padding-bottom: 5px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.article>a { display: flex; align-items: center; font-size: 15px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.article>a::before { font-size: 12px; border-radius: 3px; padding: 1px 2px; position: relative; top: 1px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.article>a.a-wait::before { content:'답변대기'; border: 1px solid #eee; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.article>a.a-done::before { content:'답변완료'; border: 1px solid #444; background: #555; color: #fff; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.article>a>span:nth-child(1) { width: 70%; padding-left: 5px; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.article>a>span:nth-child(2) { flex-grow: 1; text-align: right; color:#888; }
.subpage.mypage .mp-wrap .list-box ul.lists>li.article>a:hover>span:nth-child(1) { text-decoration: underline; }
.subpage.mypage .mp-wrap .list-box .bt-wrap { margin-top: 10px; }
.subpage.mypage .mp-wrap .list-box .switch-rect { vertical-align: middle; }
.subpage.mypage .mp-wrap ul.pagination { margin-top: 30px; } */


/* ============= 마이페이지 : 내 찜리스트 ============= */
.mypage.my-favo .func-box { border: 2px solid #ddd; border-radius: 5px; background-color: #fff; padding: 10px 10px; margin-bottom: 20px; }
.mypage.my-favo .func-box>p.tx-01 { margin-bottom: 10px; font-size: 14px; }
.mypage.my-favo .func-box>p.tx-02 { margin-top: 5px; font-size: 12px; letter-spacing: -0.5px; color:#555; } 
.mypage.my-favo .func-box>p>span { color:#f57faf; }
.mypage.my-favo .func-box .bt-wrap { display: flex; gap: 5px; }
.mypage.my-favo .item-wrap .i-group p.group-date { display: flex; align-items: center; gap:5px; margin-bottom: 5px; font-size: 18px; font-weight: 700; font-style: italic; color:#888; }
.mypage.my-favo .item-wrap .i-group p.group-date::after { content:''; flex:1; height: 1px; background-color: #c3c3c3; }
.mypage.my-favo .item-wrap .i-group>div { margin-bottom: 0; }
.mypage.my-favo .item-wrap .item>.img-box { position: relative; margin: 0; }
.mypage.my-favo .item-wrap .item>.chk-box { display: flex; align-items: center; }
.mypage.my-favo .item-wrap .item>.chk-box>label { flex: 0 0 65%; border: 1px solid #ddd; border-right: none; background: #fff; }
.mypage.my-favo .item-wrap .item>.chk-box>label>span.ip { padding-left: 30px; font-size: 12px; }
.mypage.my-favo .item-wrap .item>.chk-box>label>span.ip::before { left:5px; border:none; }
.mypage.my-favo .item-wrap .item>.chk-box>label>span.ip::after { left:9px; border-right: 2px solid #eee; border-top: 2px solid #eee; }
.mypage.my-favo .item-wrap .item>.chk-box>button.bt-del-this { flex: 0 0 35%; height: 30px; border: 1px solid #ddd; border-radius: 0; padding:0; color:#ed7979; }
.mypage.my-favo .item-wrap .item>.txt-box>p.sub { line-height: 1; padding: 3px 0; }
.mypage.my-favo .item-wrap .bt-box { text-align: center; margin-bottom: 20px; }
.mypage.my-favo .item-wrap .bt-box>button { min-width: 35%; }

.mypage.my-favo.request .list-box ul.list-wrap>li { display: flex; align-items: center; justify-content: left; gap:5px; margin-bottom: 5px; border-bottom: 1px solid #efefef; 
  padding-bottom: 5px; }
.mypage.my-favo.request .list-box ul.list-wrap>li>img { width: 24px; height: 24px; }
.mypage.my-favo.request .list-box ul.list-wrap>li>span { font-size: 14px; line-height: 1; }
.mypage.my-favo.request .list-box button.bt-myAddr { margin-bottom: 20px; }
.mypage.my-favo.request .list-box dl.tb-addr>dd:not(:last-child) { margin-bottom: 10px; }
.mypage.my-favo.request .list-box dl.tb-addr>dd:last-child>div:not(:last-child) { margin-bottom: 5px; }
.mypage.my-favo.request .list-box .alert ul>li { font-size: 14px; }


/* ============= 마이페이지 : 내 주문내역 ============= */
.subpage.mypage.orders .mp-wrap .list-box ul.lists>li.details .a-head .o-num { font-size: 14px; }
.subpage.mypage.orders .mp-wrap .list-box ul.lists>li.details .a-body .order-inf .price { text-align: left; margin-bottom: 0; }

/* 마이페이지 팝업 : 내 주문내역 - 후기 작성 */
.mod-review>form>div { margin-bottom: 20px; }
.mod-review .item-infos { display: flex; padding: 10px; background: #f4f4f4; margin-bottom: 20px; }
.mod-review .item-infos .imgs { width: 100px; height: 100px; overflow: hidden; position: relative; }
.mod-review .item-infos .imgs>img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; margin: auto; }
.mod-review .item-infos .order-inf { flex-grow: 1; position: relative; padding-left: 20px; font-size: 14px; }
.mod-review .item-infos .order-inf .sell { border-bottom: 1px solid #c9c9c9; color: #858585; margin-bottom: 8px; }
.mod-review .item-infos .order-inf .name { font-size: 22px; line-height: 22px; font-weight: 700; }
.mod-review .item-infos .order-inf .subs { margin-bottom: 5px; }
.mod-review .rev-rate { padding: 20px 10px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; }
.mod-review .rev-rate p { font-weight: 600; margin-bottom: 5px; }
.mod-review .rating-container { display: flex; align-items: center; justify-content: center; }
.mod-review .rating-container button.bt-rate { background: none; border: none; color: #ccc; height: auto;  padding: 5px 5px; }
.mod-review .rating-container button.bt-rate.hover,
.mod-review .rating-container button.bt-rate.select { color: #ffcc00; }
.mod-review .rating-container button.bt-rate>i { font-size: 35px; }
.mod-review p.tit { margin-bottom: 10px; }
.mod-review .image-preview-container { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.mod-review .image-preview { width: calc(20% - 8px); height: 100px; border: 1px solid #e0e0e0; display: flex; justify-content: center; align-items: center; position: relative; }
.mod-review .image-preview img { max-width: 100%; max-height: 100%; object-fit: cover; }
.mod-review button.remove-image { position: absolute; top: 0;  right: 0;  width: 25px; height: 25px; background: none; border: none; padding: 2px; color: #d56e6e; }
.mod-review button.remove-image:hover { color: #d44444; }
.mod-review button#upload-button { width: 100%; font-weight: 500; }
.mod-review #file-input { display: none; }

/* 마이페이지 팝업 : 내 주문내역 - 상세 팝업 */
dl.order-detail>dt, dl.order-detail>dd { display: flex; align-items: center; flex-wrap: wrap; height: 100%; padding: 6px 10px; border-bottom: 1px solid #dfdfdf;
  background: #fafafa; }
dl.order-detail>dt { background: #f2f2f2; padding: 6px 20px; justify-content: center; }
dl.order-detail .o-item { display: flex; justify-content: space-between; padding: 5px 5px 10px; border-bottom: 1px solid #dadada; margin-bottom: 5px; }
dl.order-detail .o-item:last-child { border:none; margin-bottom: 0; }
dl.order-detail .o-item .i-img { flex: 0 0 100px; height: 100px; overflow: hidden; }
dl.order-detail .o-item>ul { flex: 0 0 calc(100% - 120px); }

/* 마이페이지 팝업 : 내 주문내역 - 주문취소 팝업 */
.modal .order-cancel>div:not(:last-child) { margin-bottom: 20px; }
.modal .order-cancel .tit { margin-bottom: 10px; }
.modal .order-cancel .my-olists>ul { position: relative; padding-left: 80px; padding-bottom: 10px; border-bottom: 1px dashed #eee; margin-bottom: 10px; }
.modal .order-cancel .my-olists>ul:last-child { padding-bottom: 0; margin-bottom: 0; border:none; }
.modal .order-cancel .my-olists>ul>li.thumb { position: absolute; top:0; left:0; width: 70px; height: 90px; overflow: hidden; }


/* ============= 마이페이지 : 내 문의내역 ============= */
.subpage.mypage.inquiry .inquiry-wrap .list-box>ul>li .artc-head .i-tit span.secret { margin-left: 15px; font-size: 90%; color: #9c9c9c; }
.subpage.mypage.inquiry .inquiry-wrap .artc-body a.current-item { padding: 8px 10px; display: block; background: #ffffff; margin-bottom: 10px; border: 1px solid #aaa; }
.subpage.mypage.inquiry .inquiry-wrap .artc-body a.current-item:hover { background: #f5f5f5; border: 1px solid #333; }
.subpage.mypage.inquiry .inquiry-wrap .artc-body a.current-item>span { font-weight: 500; font-size: 15px; }


/* ============= 마이페이지 : 최근본상품 ============= */
.subpage.mypage.recent .mp-wrap .list-box ul.lists { display: flex; gap: 20px; flex-wrap: wrap; }
.subpage.mypage.recent .mp-wrap .list-box ul.lists>li.details { flex: 0 0 calc(50% - 10px); margin-bottom: 0; cursor: pointer; transition: all ease 0.25s; }
.subpage.mypage.recent .mp-wrap .list-box ul.lists>li.details:hover { border-color: #888; }
.subpage.mypage.recent .mp-wrap .list-box ul.lists>li.details .a-body .order-inf .price { position: absolute; bottom: 0; right: 0; }


/* ============= 마이페이지 : 관심상품 ============= */
.subpage.mypage.favorite .mp-wrap .list-box ul.lists { display: flex; gap: 20px; flex-wrap: wrap; }
.subpage.mypage.favorite .mp-wrap .list-box ul.lists>li.details { position: relative; flex: 0 0 100%; margin-bottom: 0; cursor: pointer; transition: all ease 0.25s; }
.subpage.mypage.favorite .mp-wrap .list-box ul.lists>li.details:hover { border-color: #888; }
.subpage.mypage.favorite .mp-wrap .list-box ul.lists>li.details .a-body .order-inf .price { position: absolute; bottom: 0; right: 0; }
.subpage.mypage.favorite .mp-wrap .list-box ul.lists>li.details .a-body button.bt-favo { position: absolute; top: 25px; right: 30px; }


/* ============= 마이페이지 : 개인정보설정 ============= */
.subpage.mypage.profile .bt-wrap { margin-top: 10px; border-top: 1px solid #eee; padding-top: 10px; }
.subpage.mypage.profile .bt-wrap .bt-box { display: flex; gap: 5px; justify-content: space-between; }
.subpage.mypage.profile .list-box ul.form-wrap>li { margin-bottom: 15px; }
.subpage.mypage.profile .list-box ul.form-wrap>li p.tit { border:none; font-size: 13px; font-weight: 500; color: #636363; }
.subpage.mypage.profile .list-box ul.form-wrap>li>div input { width: 100%; }
.subpage.mypage.profile .list-box ul.form-wrap>li>div.ip-box { display: flex; gap:3px; }
.subpage.mypage.profile .list-box ul.form-wrap>li>div.ac-info { display: flex; align-items: center; gap: 15px; }
.subpage.mypage.profile .list-box ul.switch-func { display: flex; gap: 50px; }
.subpage.mypage.profile .list-box ul.switch-func>li { display: flex; align-items: center; gap:8px; }
.subpage.mypage.profile .list-box ul.switch-func>li>p { font-size: 14px; }
.subpage.mypage.profile ul.shipping>li { display: flex; align-items: center; justify-content: space-between; border: 1px solid #ebebeb; background: #fcfcfc;
  border-radius: 5px; padding: 10px 10px; margin-bottom: 10px; }
.subpage.mypage.profile ul.shipping>li:last-child { margin-bottom: 0; }
.subpage.mypage.profile ul.shipping>li.empty { justify-content: center; color:#777; padding: 20px; }
.subpage.mypage.profile ul.shipping>li p.s-tit { font-size: 15px; font-weight: 600; }
.subpage.mypage.profile ul.shipping>li p.s-inf,
.subpage.mypage.profile ul.shipping>li p.s-adr { font-size: 14px; }

.subpage.mypage.profile .ip-box input.email-adr { max-width: 300px; }
.subpage.mypage.profile .ip-box select.email-dom { max-width: 160px; }
.subpage.mypage.profile .leave-site { display: flex; justify-content: space-between; align-items: center; }
.subpage.mypage.profile .leave-site>p { flex: 1; color:#666; }

.modal .mod-shipping form>div:not(:last-child) { margin-bottom: 20px; }
.modal .mod-shipping .tit { margin-bottom: 10px; }
.modal .mod-shipping .input-group:not(:last-child) { margin-bottom: 5px; }
.modal #wrap.addr-box .popup_post_type2 { border: 1px solid #aaa; }



/* ================================================================= */
/* -------------------------- etc_layout --------------------------- */
/* ================================================================= */
/* 모바일 사이드 레이어 */
body.no-scroll { overflow: hidden; }
#mo_side_layer {
  position: fixed;
  top: 0;
  right: -100%;
  width: 300px;
  height: 100%;
  background-color: white;
  box-shadow: -2px 0 5px rgba(0,0,0,0.1);
  transition: right 0.3s ease-in-out;
  z-index: 1000;
}
#mo_side_layer.open {
  right: 0;
}
#mo_side_layer>div {
  position: relative;
  padding: 25px 20px 50px;
}
#mo_side_layer>div.func-wrap {
  padding: 10px 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: #ececec;
  border-bottom: 1px solid #d4d4d4;
}
#mo_side_layer>div.func-wrap button {
  flex: 1;
}
#mo_side_layer>div.func-wrap button.btn-close {
  flex: 0 0 30px;
  background-color: transparent;
}
#mo_side_layer>div.menu-wrap {
  overflow-y: auto;
  max-height: calc(100% - 100px);
}
#mo_side_layer>div.menu-wrap>ul>li {
  margin-bottom: 30px;
}
#mo_side_layer>div.menu-wrap>ul>li>a.cate-tit {
  position: relative;
  display: block;
  padding-left: 10px;
  margin-bottom: 5px;
  font-size: 20px;
  font-weight: 600;
  color: #636363;
  line-height: 1;
}
#mo_side_layer>div.menu-wrap>ul>li>a.cate-tit::before {
  content: '';
  width: 4px;
  height: 100%;
  background-color: #777;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
#mo_side_layer>div.menu-wrap>ul>li>.sub-menu>a {
  display: block;
  padding: 5px 10px;
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: 500;
  text-transform: uppercase;
}
#mo_side_layer>div.btm-wrap {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  padding: 10px 10px;
  background: #f7f7f7;
  border-top: 1px solid #e7e7e7;
}
#mo_side_layer>div.btm-wrap .fabric-upload { display: flex; gap:5px; }
#mo_side_layer>div.btm-wrap .fabric-upload>button { flex:1; }

#back-layer {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.5);
  z-index: 999;
}

/* 모바일 사이드 메뉴 레이어 */
#sideMenuModal.modal .modal-dialog {
  max-width: 90%;
  height: 100%;
  margin: 0;
  position: fixed;
  right: 0;
  top: 0;
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
}
#sideMenuModal.modal .modal-content {
  height: 100%;
  border: none;
  border-radius: 0;
}
#sideMenuModal.modal.show .modal-dialog {
  transform: translateX(0);
}
#sideMenuModal.modal.hide .modal-dialog {
  transform: translateX(100%);
}

/* 검색 팝업레이어 */
.search-layer.modal .modal-content {
  margin-top: 200px;
  padding: 30px;
  box-shadow: 0px 0px 5px rgb(0 0 0 / 45%);
  border: 2px solid #f57faf; 
  background: rgb(0 0 0 / 75%);
}
.search-layer.modal .modal-content p.tit {
  font-size: 22px;
  font-weight: 800;
  color: #fff;
  text-shadow: 1px 1px 3px #000;
  margin-bottom: 20px;
}
.search-layer.modal .modal-content p.desc {
  font-size: 15px;
  color: #fff;
  text-shadow: 1px 1px 1px #000;
  margin-bottom: 20px;
}
.search-layer.modal .modal-content input.form-control {
  background-color: #fff2f6;
  height: 45px;
}
.search-layer.modal .modal-content input.form-control:focus {
  border-color: rgb(245 127 175);
  box-shadow: 0 0 0 0.25rem rgba(245 127 175 / 0.25);
}
.search-layer.modal .modal-content button.bt-search {
  width: 65px;
  height: 45px;
  background-color: rgb(245 127 175);
  background-image: url('/images/icons/icon_find.png');
  background-repeat: no-repeat;
  background-size: 35px;
  background-position: center;
  color: #fff;
}
.search-layer.modal .modal-content .result-wrap {
  margin-top: 20px;
  border-radius: 8px;
  border: 1px solid #fff;
  background: rgb(255 255 255 / 10%);
}
.search-layer.modal .modal-content .result-wrap .inner { 
  position: relative; 
  padding: 30px 25px; 
}
.search-layer.modal .modal-content .result-wrap p.ip-empty {
  color:#fff;
  font-size: 15px;
  text-align: center;
  width: calc(100% - 40px);
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  height: fit-content;
}
.search-layer.modal .modal-content .result-wrap ul.r-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap:10px;
}
.search-layer.modal .modal-content .result-wrap ul.r-list>li.item {
  min-width: 45px;
  transform: scale(0);
  background-color: rgb(255 255 255 / 18%);
  border: 1px solid #777;
  border-bottom: 3px solid #777;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  transition: all 0.5s ease;
}
.search-layer.modal .modal-content .result-wrap ul.r-list>li.item.show {
  transform: scale(1);
}
.search-layer.modal .modal-content .result-wrap ul.r-list>li.item:hover {
  border-color: rgb(239, 48, 117);
  border-color: #f57faf;
  background: #222;
}
.search-layer.modal .modal-content .result-wrap ul.r-list>li.item>a {
  color:#fff;
  font-size: 15px;
  padding: 5px 15px;
  display: block;
}

/* 컬러피커 팝업 레이어 */
.color-line-wrap>ul.c-line {
  display: flex;
  position: relative;
  margin-bottom: 25px;
}
.color-line-wrap>ul.c-line:last-child {
  margin-bottom: 10px;
}
.color-line-wrap>ul.c-line::before {
  content:'';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  border: 1px solid rgb(0 0 0 / 10%);
  border-left: none;
  border-right: none;
}
.color-line-wrap>ul.c-line>li {
  flex:1;
  position: relative;
}
.color-line-wrap>ul.c-line>li>a.c-text {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  line-height: 1.2;
  padding: 55px 0 0;
}
.color-line-wrap>ul.c-line>li:first-child>a.c-text {
  padding-left: 0;
}
.color-line-wrap>ul.c-line>li:last-child>a.c-text {
  padding-right: 0;
}
.color-line-wrap>ul.c-line>li>a.c-text>span.num {
  font-weight: 600;
  font-size: 17px;
  color:#fff;
}
.color-line-wrap>ul.c-line>li>a.c-text>p.code {
  display: none;
}
.color-line-wrap>ul.c-line>li>a.c-text>p.code>span {
  display: block;
  text-transform: uppercase;
  text-align: right;
  font-size: 11px;
}
.color-line-wrap>ul.c-line>li>a.c-text>p.code>span:nth-child(2) {
  color: #939393;
}
.color-line-wrap>ul.c-line.c-group-01::before {
  background: linear-gradient(90deg, #ffffff 0%, #f7f6f1 14.3%, #f4efe9 28.6%, #f8f0e2 42.9%, #eef0e7 57.2%, #e1f0ed 71.5%, #e5edf5 85.8%, #e8e7f0 100%);
}
.color-line-wrap>ul.c-line.c-group-02::before {
  background: linear-gradient(90deg, #f8dfdb 0%, #f8c7bd 12.5%, #f69ba0 25%, #e84646 37.5%, #af1c11 50%, #a55c5c 62.5%, #9d0138 75%, #aa1256 87.5%, #642020 100%);
}
.color-line-wrap>ul.c-line.c-group-03::before {
  background: linear-gradient(90deg, #ffd6a9 0%, #ffa759 14.3%, #f86300 28.6%, #ca7d4a 42.9%, #a44d18 57.2%, #a9431e 71.5%, #844d37 85.8%, #683207 100%);
}
.color-line-wrap>ul.c-line.c-group-04::before {
  background: linear-gradient(90deg, #f4e9bb 0%, #c0ad8a 14.3%, #ad7c59 28.6%, #c4995c 42.9%, #9c7936 57.2%, #f9e267 71.5%, #f2a900 85.8%, #604a1a 100%);
}
.color-line-wrap>ul.c-line.c-group-05::before {
  background: linear-gradient(90deg, #dee4b5 0%, #babd7b 12.5%, #a3aa83 25%, #9a8f66 37.5%, #ac9f3c 50%, #807a3d 62.5%, #525144 75%, #2e380d 87.5%, #747136 100%);
}
.color-line-wrap>ul.c-line.c-group-06::before {
  background: linear-gradient(90deg, #daf8db 0%, #bdd4c4 12.5%, #a0d096 25%, #80b09c 37.5%, #179952 50%, #7dab95 62.5%, #5c7c68 75%, #274447 87.5%, #074937 100%);
}
.color-line-wrap>ul.c-line.c-group-07::before {
  background: linear-gradient(90deg, #d1e6f3 0%, #a1c1d3 14.3%, #b9d4fd 28.6%, #46a3e5 42.9%, #035f8d 57.2%, #143d85 71.5%, #24325b 85.8%, #151622 100%);
}
.color-line-wrap>ul.c-line.c-group-08::before {
  background: linear-gradient(90deg, #c7bfe1 0%, #a191be 11.11%, #be9fc2 22.22%, #82528e 33.333%, #7d087c 44.44%, #905384 55.55%, #60275d 66.66%, #5c3a56 77.77%, #5c1f47 88.88%, #39233f 100%);
}
.color-line-wrap>ul.c-line.c-group-09::before {
  background: linear-gradient(90deg, #f8e0e8 0%, #f0c9e1 14.3%, #f1a6cc 28.6%, #f18aad 42.9%, #ef82ab 57.2%, #d3507a 71.5%, #c62368 85.8%, #a22452 100%);
}
.color-line-wrap>ul.c-line.c-group-10::before {
  background: linear-gradient(90deg, #d5d5d8 0%, #babbbf 16.66%, #8d8e92 33.32%, #837f7f 49.98%, #5e6064 66.64%, #3f434b 83.3%, #000000 100%);
}





/* ====================================================================== */
/* ------------------------------ main page ----------------------------- */
/* ====================================================================== */
div.body>div.main-page { padding-top: 0; padding-bottom: 10px; }
.main-page section { margin: 0 0 40px; }
.main-page section:last-child { padding-bottom: 0; }
.main-page section h3 { font-size: 22px; font-weight: 700; line-height: 1; margin-bottom: 15px; }
.main-page section>h3 { margin-left: 15px; }

.main-page section.sec-01 .top-swiper .img-box {
  display: flex;
  overflow: hidden;
}
.main-page section.sec-01 .top-swiper .img-box>img {
  transition: all ease-out 5.5s;
  object-fit: cover;
}
.main-page section.sec-01 .top-swiper .txt-box {
  width: calc(100% - 60px);
  position: absolute;
  bottom: 45px;
  left:30px;
}
.main-page section.sec-01 .top-swiper .txt-box p.tit {
  font-size: 30px;
  font-weight: 800;
  color:#fff;
  text-shadow: 1px 1px 4px rgb(0 0 0 / 65%);
  line-height: 1.2;
  border-bottom: 2px solid rgb(255 255 255 / 70%);
  padding-bottom: 10px;
  margin-bottom: 15px;
}
.main-page section.sec-01 .top-swiper .txt-box p.sub {
  font-size: 22px;
  font-weight: 600;
  color:#fff;
  text-shadow: 1px 1px 3px rgba(0 0 0 / 40%);
  line-height: 1.1;
}

.main-page section.sec-02 .category-wrap {
  padding: 0px 0px 0px 15px;
  overflow: auto hidden;
  white-space: nowrap;
  cursor: grab;
}
.main-page section.sec-02 .category-wrap .inner {
  display: flex;
  gap:5px;
  flex-wrap: wrap;
  min-width: 850px;
  padding-right: 10px;
}
.main-page section.sec-02 .category-wrap button {
  display: flex;
  align-items: center;
  flex: 0 0 calc(20% - 5px);
  gap:5px;
  padding:5px 10px;
  border:2px solid #F2F2F2;
  border-radius: 20px;
  background-color: #fff;
}
.main-page section.sec-02 .category-wrap button>img {
  /* width: 50px; */
  height: 50px;
}
.main-page section.sec-02 .category-wrap button>span {
  width: 100%;
  line-height: 1.1;
  word-break: keep-all;
  white-space: normal;
  text-align: right;
  color:#333;
}

.main-page section.sec-03 ul {
  position: absolute;
  bottom: 30px;
  padding:0 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: calc(100% - 60px);
}
.main-page section.sec-03 ul>li>p {
  padding-top: 10px;
  color: #fff;
  font-size: 22px;
  font-weight: 500;
  text-shadow: 1px 1px 1px #000;
  line-height: 1.25;
}
.main-page section.sec-03 ul>li>a {
  display: inline-block;
  background: #fff;
  border: 1px solid #eee;
  padding: 5px 15px;
  color: #3f3f3f;
  font-size: 20px;
  font-weight: 600;
}

.main-page section.sec-04 {
  background: #D6DCE5;
  padding: 40px 0 10px;
}
.main-page section.sec-04 .swiper {
  padding-bottom: 30px;
}
.main-page section.sec-04 .swiper-pagination {
  bottom: 0px;
}
.main-page section.sec-04 .img-box {
  margin-bottom: 5px;
}
.main-page section.sec-04 .txt-box .tit {
  font-size: 16px;
}
.main-page section.sec-04 .txt-box .sub {
  color:#555;
}
.main-page section.sec-04 .txt-box .prc {
  font-size: 15px;
  font-weight: 600;
}

.main-page section.sec-05 h3 {
  margin-bottom: 10px;
}
.main-page section.sec-05 .swiper {
  padding: 0 10px 15px;
}
.main-page section.sec-05 .swiper-slide {
  padding: 8px;
}
.main-page section.sec-05 .swiper-slide .items {
  position: relative;
  padding: 10px 10px;
  box-shadow: 1px 2px 8px rgb(0 0 0 / 25%);
}
.main-page section.sec-05 .swiper-slide .items .img-box {
  position: relative;
}
.main-page section.sec-05 .swiper-slide .items .img-box .c-color {
  position: absolute;
  left: 20px;
  bottom: -15px;
  width: 80px;
  height: 100px;
  border: 5px solid #fff;
  background: #d5d2d9;
  /* box-shadow: 1px 1px 5px rgb(0 0 0 / 19%); */
}
.main-page section.sec-05 .swiper-slide .items .txt-box {
  padding: 20px 0 0;
  text-align: center;
}
.main-page section.sec-05 .swiper-slide .items .txt-box .tit {
  border: none;
  font-size: 22px;
}
.main-page section.sec-05 .swiper-pagination { bottom: 0; }
.main-page section.sec-05 .swiper .swiper-pagination-bullet-active { background-color: #444; }

.main-page section.sec-06 {
  background-color: #FDF0E7;
  padding: 40px 0;
}
.main-page section.sec-06 .swiper {
  padding: 0 15px;
}
.main-page section.sec-06 img {
  width: 100%;
}

.main-page section.sec-07 {
  background-color: #3D311F;
  padding: 40px 0;
}
.main-page section.sec-07 h3 {
  color:#fff;
  font-weight: 600;
  line-height: 1.25;
}
.main-page section.sec-07 .swiper {
  padding: 0 15px;
}
.main-page section.sec-07 .swiper_s07_main {
  margin-bottom: 20px;
}
.main-page section.sec-07 .swiper_s07_main .video-cont {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}
.main-page section.sec-07 .swiper_s07_main .video-cont iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.main-page section.sec-07 .swiper_s07_thumb .swiper-slide>img {
  overflow: hidden;
  border-radius: 10px;
  border: 2px solid #fff;
}
.main-page section.sec-07 .swiper_s07_thumb .swiper-slide.swiper-slide-thumb-active>img {
  border: 2px solid #ff0000;
}
.main-page section.sec-07 a.bt-link {
  display: inline-block;
  background: #fff;
  border-radius: 20px;
  margin-top: 20px;
  padding: 6px 30px;
  font-weight: 500;
  font-size: 15px;
}

.main-page section .item-tit { 
  margin-bottom: 50px;
}
.main-page section .item-tit h3 {
  font-size: 38px;
  font-weight: 800;
  text-align: center;
  line-height: 1;
  margin-bottom: 15px;
}
.main-page section .item-tit h3+p {
  font-size: 17px;
  font-weight: 400;
  text-align: center;
  width: 60%;
  margin: 0 auto;
}




/* ====================================================================== */
/* ----------------------------- page - trend --------------------------- */
/* ====================================================================== */
.page-trend section { margin-bottom: 0; }
.page-trend .list-wrap .item {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 150%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 1px 2px 5px rgb(0 0 0 / 15%);
}
.page-trend .list-wrap .item .tbox {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 5px 10px;
  background: #fff;
  z-index: 1;
  transition: all 0.5s ease;
}
.page-trend .list-wrap .item .tbox>p.i-tit {
  font-size: 15px;
  font-weight: 499;
  color:#333;
}

.page-trend.detail { padding-bottom: 0; }
.page-trend.detail .article-wrap>div { border-bottom: 1px solid #c0c0c0; padding: 20px 20px; }
.page-trend.detail .article-wrap>div:last-child { border:none; }
.page-trend.detail .article-wrap .a-head h3 { margin-bottom: 15px; font-weight: 600; }
.page-trend.detail .article-wrap .a-head .subs { display: flex; justify-content: space-between; font-size: 14px; }
.page-trend.detail .article-wrap .a-body { background-color: #fff; }
.page-trend.detail .article-wrap .a-body p { text-align: justify !important; word-break: break-all; }
.page-trend.detail .article-wrap .a-foot { background-color: #fff; }
.page-trend.detail .article-wrap .a-foot button { min-width: 80px; }

.page-trend.detail.blinded .article-wrap .a-body {
  height: 800px;
  overflow: hidden;
  border:none;
}
.page-trend.detail .blind-wrap { padding: 0 !important; border:none; background-color: #fff; }
.page-trend.detail .blind-wrap .blind-layer {
  margin-top: -400px;
  height: 450px;
  position: relative;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .95) 60%);
  z-index: 11;
}
.page-trend.detail .blind-wrap .blind-notice {
  padding: 60px 20px;
  text-align: center;
}
.page-trend.detail .blind-wrap .blind-notice p.tx1 {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
}
.page-trend.detail .blind-wrap .blind-notice p.tx2 {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 50px;
}
.page-trend.detail .blind-wrap .blind-notice a {
  width: 200px;
  display: block;
  margin: 0 auto 10px;
  padding: 5px 5px;
  font-size: 16px;
  font-weight: 500;
  color:#333;
  text-decoration: underline;
}
.page-trend.detail .blind-wrap .blind-notice a.bt-pass {
  padding: 10px 10px;
  background-color: #f57faf;
  font-size: 20px;
  font-weight: 600;
  color:#fff;
  text-decoration:none;
}





/* ====================================================================== */
/* --------------------------- page - silkmeta -------------------------- */
/* ====================================================================== */
.page-meta { background-color: #1a1a1a; }
.page-meta section { margin-bottom: 0; }
.page-meta .category-menu ul>li>a { color:#fff; }

.page-meta .list-wrap .item .img-wrap {
  width: 100%;
  height: 0;
  padding-bottom: 100%; 
  background-color: rgb(127 127 127 / 25%);
  border-radius: 15px;
  margin-bottom: 15px;
  transition: all ease 0.25s;
  cursor: pointer;
}
.page-meta .list-wrap .item .img-wrap:hover {
  background-color: rgb(127 127 127 / 15%);
}
.page-meta .list-wrap .item .lazy-box img { 
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity ease 0.25s;
}
.page-meta .list-wrap .item .lazy-box.is-loaded img {
  opacity: 1;
}
.page-meta .list-wrap .item .inf-box {
  padding: 2px 2px 15px;
}
.page-meta .list-wrap .item .inf-box .i-name {
  position: relative;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  padding-right: 35px;
}
.page-meta .list-wrap .item:hover .inf-box .i-name {
  color: #71bfe1;
}
.page-meta .list-wrap .item .inf-box .i-name .label {
  position: absolute;
  top:2px;
  right:0;
  width: 30px;
  background-color: #eee;
  border-radius: 3px;
  color: #666;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
}
.page-meta .list-wrap .item .inf-box .i-subs {
  color: #ccc;
  font-size: 14px;
  font-weight: 500;
}
.page-meta .list-wrap .item .inf-box .i-color {
  display: flex;
  flex-wrap: wrap;
  gap:5px;
  margin-top: 10px;
}
.page-meta .list-wrap .item .inf-box .i-color>a {
  border: 1px solid rgb(255 255 255 / 30%);
  border-radius: 25px;
  flex: 0 0 calc(12.5% - 4.5px);
  overflow: hidden;
  position: relative;
}
.page-meta .list-wrap .item .inf-box .i-color>a::before {
  content: '';
  padding-bottom: 100%;
  display: block;
}
.page-meta .list-wrap .item .inf-box .i-color>a:hover {
  border: 1px solid rgb(255 255 255 / 60%);
}
.page-meta.style .list-wrap .item .img-wrap { 
  padding-bottom: 180%;
}



.modal.modal-meta .modal-content {
  background-color: #3c3636;
}
.modal.modal-meta .modal-content .modal-body {
  padding: 10px;
}
.modal.modal-meta .inner {
  position: relative;
  /* background-color: #eee; */
  background: linear-gradient(180deg, rgba(137,138,143,1) 0%, rgba(238,238,238,1) 100%);
}
.modal.modal-meta .inner .spinner {
  width: 100px;
  height: 100px;
  position: absolute;
  top:0;
  right:0;
  bottom: 0;
  left:0;
  margin: auto;
  border-radius: 100%;
  background: #42ccdc;
  z-index: 1;
}
.modal.modal-meta .inner .spinner-txt {
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  padding: 20px;
  line-height: 16px;
  color: #fff;
  font-size: 13px;
  text-align: center;
  word-break: keep-all;
  position: absolute;
  top:0;
  right:0;
  bottom: 0;
  left:0;
  margin: auto;
  z-index: 2;
}
.modal.modal-meta .inner embed { 
  width: 100%;
  height: 550px;
  border: none;
  position: relative;
  z-index: 3;
}
.modal.modal-meta .modal-body span.itxt {
  color:#bababa;
  font-size: 13px;
}
.modal.modal-meta .modal-footer {
  display: block;
  border-top: none;
  padding: 0px 10px 10px;
}
.modal.modal-meta .modal-footer button { margin:0; }


/* ========================================================================= */
/* ----------------------------- page - service ---------------------------- */
/* ========================================================================= */
.page-service .tab-menu {
  margin:10px 0 10px;
}
.page-service .tab-menu a {
  padding: 5px 5px;
  margin-right: 10px;
  display: inline-block;
  color:#666;
  font-size: 15px;
  font-weight: 500;
}
.page-service .tab-menu a.current {
  color:#111;
  font-weight: 600;
}

.page-service .inq-wrap>div {
  padding: 10px 10px;
  border: 1px solid #ccc;
  background: #fff;
  border-radius: 3px;
  margin-bottom: 15px;
}
.page-service .inq-wrap>div>label {
  margin-bottom: 5px;
}
.page-service .inq-wrap>div>input {
  border-radius: 0;
  border:none;
  border-bottom: 1px solid #555;
  padding: 5px 5px;
}
.page-service .inq-wrap>div>input:focus {
  background-color: #f5f5f5;
}

.page-service .i-wrap label.form-label {
  margin-bottom: 10px;
}
.page-service .i-wrap .img-attach {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.page-service .i-wrap .img-attach label.bt-img-upload {
  width: calc(25% - 8px);
  aspect-ratio: 1 / 1;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  border: 1px solid #ccc;
  background: #f8f8f8;
  border-radius: 5px;
  box-shadow: 1px 1px 5px rgb(0 0 0 / 20%);
}
.page-service .i-wrap .img-attach label.bt-img-upload i {
  font-size: 25px;
  color:#aaa;
}
.page-service .i-wrap .img-attach label.bt-img-upload .img-counter {
  font-size: 14px;
  font-weight: 500;
  color:#888;
  line-height: 1;
}
.page-service .i-wrap .preview-imgs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}
.page-service .i-wrap .preview-imgs .thumbnail {
  flex: 0 0 calc(25% - 8px);
  position: relative;
  height: 80px;
  overflow: hidden;
  border: 1px solid #ccc;
  margin-bottom: 10px;
}
.page-service .i-wrap .preview-imgs .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-service .i-wrap .preview-imgs .thumbnail .delete-btn {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: transparent;
  border: none;
  cursor: pointer;
}

.page-service .i-wrap ul>li {
  font-size: 14px;
}
.page-service .bt-inq-done {
  width: 100%;
  height: auto;
  padding: 15px 10px;
  font-size: 16px;
  font-weight: 600;
}



/* ======================================================================== */
/* ---------------------------- page - we are ----------------------------- */
/* ======================================================================== */
.page-we { padding-top: 120px; } 
.page-we .tab-btns>ul.nav {
  justify-content: center;
  gap:40px;
  margin-bottom: 40px;
}
.page-we .tab-btns>ul.nav>li {
  width: 25%;
}
.page-we .tab-btns>ul.nav button {
  width: 100%;
  background: none;
  padding: 8px 20px;
  border-radius: 30px;
  border: 2px solid #505050;
  color:#505050;
  font-size: 18px;
  font-weight: 700;
}
.page-we .tab-btns>ul.nav button.active,
.page-we .tab-btns>ul.nav button:hover {
  background-color: #333;
  color:#fff;
}
.page-we .tab-content {
  max-width: 1000px;
  margin: 0 auto;
}
.page-we .tab-content .tab-pane>div {
  margin-bottom: 50px;
}
.page-we.about .video-wrap::after {
  content:'';
  display: block;
  width: 30%;
  margin: 35px auto;
  background-color: #e8e8e8;
  border-radius: 40px;
  height: 10px;
}
.page-we.about .content-wrap>div {
  background: #f5f5f5;
  padding: 40px 40px;
  margin-bottom: 50px;
}
.page-we.about .content-wrap .txt-wrap p {
  font-size: 25px;
  font-weight: 300;
  margin-bottom: 20px;
}
.page-we.about .content-wrap .img-wrap {
  padding-left: 120px;
}
.page-we.about .content-wrap .img-wrap>img:not(:last-child) {
  margin-bottom: 20px;
}

.page-we.about .content-wrap .artc-box {
  display: flex;
  gap:30px;
  background-color: #fff;
  padding: 30px 15px;
  margin: 0;
  /* border-bottom: 2px solid #fe682c; */
  border-bottom: 2px solid #f57faf;
}
.page-we.about .content-wrap .artc-box:first-child {
  /* border-top: 2px solid #fe682c; */
  border-top: 2px solid #f57faf;
}
.page-we.about .content-wrap .artc-box .a-img {
  flex: 0 0 auto;
  max-width: 40%;
}
.page-we.about .content-wrap .artc-box .a-img img {
  width: 100%;
  height: auto;
  object-fit: cover;
}
.page-we.about .content-wrap .artc-box .a-con {
  flex: 1;
  cursor: pointer;
}
.page-we.about .content-wrap .artc-box .a-con .tits {
  margin-bottom: 25px;
  font-size: 25px;
  font-weight: 600;
  line-height: 28px;
}
.page-we.about .content-wrap .artc-box .a-con .desc {
  padding: 20px 20px;
  margin: 0 15px;
  /* border-top: 1px solid #fe682c;
  border-bottom: 1px solid #fe682c; */
  border-top: 1px solid #f57faf;
  border-bottom: 1px solid #f57faf;
  font-size: 18px;
  color: #4d4d4d;
  text-align: center;
}
.page-we.about .content-wrap .txt-wrap {
  padding: 0 30px; 
}

.page-we.product {
  padding-bottom: 0 !important;
}
.page-we.product>section.sec-body {
  margin-bottom: 0;
}
.page-we.product .content-wrap {
  padding-top: 25px;
  margin-bottom: 80px;
}
.page-we.product .content-wrap .item {
  width: 100%;
  padding-top: 150%;
  position: relative;
  overflow: hidden;
}
.page-we.product .content-wrap .item>a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: #eee;
}
.page-we.product .content-wrap .item>a .img-box {
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.page-we.product .content-wrap .item>a .img-box>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.page-we.product .content-wrap .item>a>ul {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 15px 10px;
  background-color: rgba(0 0 0 / 30%);
}
.page-we.product .content-wrap .item>a>ul>li {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 10px;
  text-align: center;
  color:#fff;
}
.page-we.product .content-wrap .item>a>ul>li:nth-child(2) {
  letter-spacing: 20px;
}
.page-we.product .video-wrap {
  background: #1a1a1a;
  padding: 80px 80px;
}
.page-we.product .video-wrap .title {
  margin-bottom: 40px;
  text-align: center;
  font-size: 45px;
  font-weight: 800;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 2px;
}
.page-we.product .video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  border-radius: 30px;
  overflow: hidden;
  margin-bottom: 80px;
}
.page-we.product .video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* we are - product popup */
.modal.we-img-slider .modal-content {
  position: relative;
  flex-direction: row;
  width: 100vw;
  height: 100vh;
  background-color: #111;
  border-radius: 0;
}
.modal.we-img-slider .page-box {
  flex: 0 0 55%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.modal.we-img-slider .page-box .brands {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 40px;
}
.modal.we-img-slider .page-box .brands>img {
  max-width: 200px;
  margin-bottom: 20px;
}
.modal.we-img-slider .page-box .brands>p.t-eng {
  font-size: 28px;
  font-weight: 700;
  color:#fff;
}
.modal.we-img-slider .page-box .brands>p.t-kor {
  font-size: 17px;
  font-weight: 300;
  color:#ccc;
}
.modal.we-img-slider .page-box .func {
  display: flex;
  align-items: center;
  gap: 10px;
}
.modal.we-img-slider .page-box .func .swiper-button-next, 
.modal.we-img-slider .page-box .func .swiper-button-prev {
  position: static;
  width: 30px;
  height: 30px;
  margin: 0;
  color: #fff;
}
.modal.we-img-slider .page-box .func .swiper-button-next::after, 
.modal.we-img-slider .page-box .func .swiper-button-prev::after {
  font-size: 16px;
}
.modal.we-img-slider .page-box .func .swiper-counter {
  display: flex;
  align-items: center;
  gap: 10px;
}
.modal.we-img-slider .page-box .func .swiper-counter>span {
  width: 25px;
  font-size: 20px;
  font-weight: 500;
  color:#fff;
  text-align: center;
}
.modal.we-img-slider .page-box .func .swiper-counter>em {
  color:#aaa;
  font-style: normal;
  font-size: 14px;
}
.modal.we-img-slider .page-box button.popup-close {
  background-color: transparent;
  border: none;
  padding: 10px;
  margin-top: 30px;
}
.modal.we-img-slider .page-box button.popup-close>i {
  display: block;
  font-size: 28px;
  color: #eee;
  transition: all ease 0.25s;
}
.modal.we-img-slider .page-box button.popup-close:hover>i {
  transform: rotate(90deg);
}
.modal.we-img-slider .page-box button.popup-close>span {
  opacity: 0;
  transition: all ease 0.25s;
  color: #f1f1f1;
  font-size: 16px;
}
.modal.we-img-slider .page-box button.popup-close:hover>span {
  opacity: 1;
}
.modal.we-img-slider .slide-box {
  position: relative;
  flex: 0 0 45%;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}
.modal.we-img-slider .slide-box .swiper {
  height: 100vh;
}
.modal.we-img-slider .slide-box .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}
.modal.we-img-slider .slide-box .swiper-slide img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
}
.modal.we-img-slider .slide-box .swiper-button-next:after,
.modal.we-img-slider .slide-box .swiper-button-prev:after {
  color:#fff;
}
.modal.we-img-slider .slide-box button.popup-close {
  position: absolute;
  top: 0;
  right: 10px;
  width: 40px;
  height: auto;
  background: none;
  color: #fff;
  font-size: 30px;
  z-index: 2;
}




/* ====================================================================== */
/* ------------------------------ 검색결과 ------------------------------ */
/* ====================================================================== */
.search-result p.i-count {
  padding: 8px 0px;
  background: #fff;
  margin-top: 15px;
  text-align: center;
  font-weight: 500;
}

/* ========================================================================== */
/* ------------------------------ 멤버쉽(패스) ------------------------------ */
/* ========================================================================== */
.subpage.membership { background-color: #fff; }
.subpage.membership h3 {
  text-align: center;
  padding:30px 0 10px;
  margin-bottom: 20px;
}
.subpage.membership h3>span {
  border-bottom: 1px solid #333;
}
/* .membership .tab-btns { width: 80%; margin: 20px auto 0; }
.membership .tab-btns>p { margin-bottom: 5px; text-align: center; font-size: 14px; color:#555; }
.membership .tab-btns ul { padding: 3px 15px; background-color: #eee; border-radius: 3px; gap:5px; }
.membership .tab-btns ul>li { flex: 1; }
.membership .tab-btns ul>li>button { width: 100%; border:none; border-radius: 5px; color:#555; font-size: 17px; font-weight: 600; letter-spacing: 2px; }
.membership .tab-btns ul>li>button.active { background-color: #333; color:#fff; } */

.membership .item {
  border: 1px solid #939496;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 40px;
}
.membership .item .i-price {
  padding: 35px 35px;
  background-color: #f3f3f3;
}
.membership .item .i-price span.label {
  padding: 3px 15px;
  background-color: #fff;
  border-radius: 5px;
  margin-bottom: 10px;
}
.membership .item .i-price p.tits {
  margin-bottom: 10px;
  font-size: 22px;
  font-weight: 600;
}
.membership .item .i-price p.tits>span {
  font-size: 32px;
  font-weight: 800;
  color:#d73e7c;
}
.membership .item .i-price p.prc {
  line-height: 1;
  font-size: 38px;
  font-weight: 700;
  color:#6784ab;
}
.membership .item .i-price p.prc::before {
  content:'\20A9';
  font-size: 34px;
  margin-right: 5px;
}
.membership .item .i-price p.subs {
  color:#555;
  margin-bottom: 20px;
}
.membership .item .i-price button.bt-process {
  width: 100%;
  padding: 10px 10px;
  margin-bottom: 20px;
  background-color: transparent;
  border:1px solid #f57faf;
  border-radius: 10px;
  color:#f57faf;
  font-size: 18px;
  font-weight: 600;
}
.membership .item .i-price button.bt-process:active {
  background-color: rgb(245 127 175 / 10%);
}
.membership .item .i-price button.bt-process.fill {
  background-color: #f57faf;
  color:#fff;
}
.membership .item .i-price button.bt-process.fill:active {
  background-color: #e96299;
}
.membership .item .i-price .bt-box {
  display: flex;
  gap:15px;
}
.membership .item .i-price .bt-box>button p.prc {
  margin-bottom: 5px;
  font-size: 35px;
  color:#fff;
  text-shadow: 1px 1px 2px rgb(133 10 61 / 70%);
}
.membership .item .i-price .bt-box>button p.prc::before {
  font-size: 20px;
}
.membership .item .i-price .bt-box>button p.subs {
  margin: 0;
  color: #850a3d;
  font-size: 14px;
}
.membership .item .i-price p.desc {
  font-size: 17px;
  font-weight: 500;
  text-align: center;
  color:#3d4362;
  line-height: 28px;
}

.membership .item .i-info .accordion-item .accordion-header>button {
  position: relative;
  border:none;
  padding: 15px 25px;
  font-size: 18px;
  font-weight: 500;
}
.membership .item .i-info .accordion-item .accordion-header>button:active {
  background-color: rgb(245 127 175 / 10%);
}
.membership .item .i-info .accordion-item .accordion-header>button>i {
  position: absolute;
  right: 20px;
  transition: all ease 0.25s;
}
.membership .item .i-info .accordion-item .accordion-header>button[aria-expanded="true"]>i {
  transform: rotate(180deg);
  color: #f57faf;
}
.membership .item .i-info .accordion-item .accordion-body {
  padding: 10px 25px 20px;
}
.membership .item .i-info .accordion-item .accordion-body>ul>li {
  position: relative;
  margin-bottom: 10px;
  padding-left: 18px;
}
.membership .item .i-info .accordion-item .accordion-body>ul>li:last-child {
  margin-bottom: 0;
}
.membership .item .i-info .accordion-item .accordion-body>ul>li::before {
  content:'\2714';
  position: absolute;
  top:0;
  left:0;
  color: #f57faf;
  font-size: 15px;
}
.membership .item .i-info .accordion-item .accordion-body>ul>li>p {
  font-size: 16px;
  font-weight: 500;
  color:#3d4362;
  word-break: keep-all;
}
.membership .item .i-info .accordion-item .accordion-body>ul>li>ul.sub-list>li {
  position: relative;
  margin-bottom: 3px;
  padding-left: 12px;
  font-size: 15px;
  color:#444;
  word-break: keep-all;
}
.membership .item .i-info .accordion-item .accordion-body>ul>li>ul.sub-list>li:last-child {
  margin-bottom: 0;
}
.membership .item .i-info .accordion-item .accordion-body>ul>li>ul.sub-list>li::before {
  content:'+';
  position: absolute;
  top:0;
  left:0;
  color: #f57faf;
  font-weight: 600;
}


/* ========================================================================= */
/* ------------------------- 원단 촬영 및 등록 ----------------------------- */
/* ========================================================================= */
.fabric-register { padding-bottom: 100px; }
.fabric-register .sec-body>.container>div:not(.bt-wrap) { margin-bottom: 50px; }
.fabric-register .alert ul>li { font-size: 14px; }
.fabric-register .photo-wrap input.ifile-input { height: auto; margin-bottom: 10px; }
.fabric-register .photo-wrap .ruler-box {
  position: relative;
  max-width: 100%;
  height: 350px;
  margin-bottom: 5px;
}
.fabric-register .photo-wrap .ruler-box .ruler {
  display: none;
  position: absolute;
  top: 0;
  width: 15px;
  height: 350px;
  z-index: 11;
}
.fabric-register .photo-wrap .ruler-box .ruler.left { left:0; }
.fabric-register .photo-wrap .ruler-box .ruler.right { right:0; }
.fabric-register .photo-wrap .image-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background-color: #ebebeb;
  position: relative;
  overflow: hidden;
}
.fabric-register .photo-wrap .image-container .placeholder-txt {
  color: #777;
  font-size: 17px;
  font-weight: 500;
  text-align: center;
}
.fabric-register .photo-wrap .image-container .placeholder-txt>i {
  font-size: 5em;
  color:#bdbdbd;
  margin-bottom: 10px;
}
.fabric-register .photo-wrap .image-container .preview-img {
  display: none;
  max-width: none;
  max-height: none;
  width: auto;
  height: auto;
}
.fabric-register .bt-wrap {
  display: flex;
  gap:5px;
  position: fixed;
  bottom: 0;
  left:0;
  width: 100%;
  padding:10px;
  background-color: #fff;
  border-top: 1px solid #dbdbdb;
  z-index: 900;
}
.fabric-register .bt-wrap>button { flex:1; }



/* ====================================================================== */
/* ------------------------------ page - cs ----------------------------- */
/* ====================================================================== */
.page-cs { background-color: #fff; }
.page-cs .sec-body { margin-top: 15px; }
.page-cs .cs-top { margin-bottom: 50px; }
.page-cs .a-box {
  position: relative;
  height: 100%;
  border: 1px solid #eeeeee;
  border-radius: 10px;
  padding: 20px 20px;
  margin-bottom: 20px;
  text-align: center;
  background-color: #fff;
}
.page-cs .a-box>span.imgs {
  width: 50px;
  height: 50px;
  padding: 10px;
  margin-bottom: 10px;
  background-color: #fafafa;
  border-radius: 100%;
  border:2px solid rgb(0 0 0 / 5%);
  display: inline-block;
}
.page-cs .a-box>p.tit {
  border: none;
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
}
.page-cs .a-box>ul { margin-bottom: 20px; }
.page-cs .a-box>ul>li { font-size: 15px; font-weight: 500; color:#777777; word-break: keep-all; }
.page-cs .a-box>.btm-box p { font-size: 17px; font-weight: 600; }

.page-cs .cs-btm { position: relative; }
.page-cs .cs-btm h4+a.v-all { position: absolute; top: 0px; right: 0; padding: 3px; }
.page-cs .cs-btm ul.lists>li.article { border-bottom: 1px dotted #f2f2f2; margin-bottom: 5px; padding-bottom: 5px; }
.page-cs .cs-btm ul.lists>li.article>a { display: flex; align-items: center; font-size: 15px; padding: 5px 0; }
.page-cs .cs-btm ul.lists>li.article>a::before { font-size: 12px; border-radius: 3px; padding: 1px 2px; position: relative; top: 1px; }
.page-cs .cs-btm ul.lists>li.article>a>span:nth-child(1) { width: 70%; padding-left: 5px; }
.page-cs .cs-btm ul.lists>li.article>a>span:nth-child(2) { flex-grow: 1; text-align: right; color:#888; }
.page-cs .cs-btm ul.lists>li.article>a:hover>span:nth-child(1) { text-decoration: underline; }

.page-cs.faq .artc-wrap ul.accordion {
  border-top: 2px solid #b5babb;
}
.page-cs.faq .artc-wrap ul.accordion>li.item {
  border-bottom: 1px solid #b5babb;
}
.page-cs.faq .artc-wrap ul.accordion>li.item .artc-head {
  position: relative;
  padding: 25px 10px;
  cursor: pointer;
}
.page-cs.faq .artc-wrap ul.accordion>li.item .artc-head>p.title {
  font-size: 18px;
  font-weight: 500;
}
.page-cs.faq .artc-wrap ul.accordion>li.item .artc-head[aria-expanded="true"]>p.title {
  color: #f57faf;
}
.page-cs.faq .artc-wrap ul.accordion>li.item .artc-head>i {
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 0;
  margin: auto;
  font-size: 25px;
  width: 25px;
  height: 25px;
  text-align: center;
  transition: all ease 0.25s;
}
.page-cs.faq .artc-wrap ul.accordion>li.item .artc-head[aria-expanded="true"]>i {
  transform: rotate(180deg);
  color: #f57faf;
}


.page-cs.faq .artc-wrap ul.accordion>li.item .artc-body .inner {
  border-top: 1px dotted #e1e1e1;
  padding: 30px 25px 30px 5px;
}
.page-cs.faq .artc-wrap ul.accordion>li.item .artc-body .inner>p {
  border-left: 3px solid #f57faf;
  padding-left: 10px;
  font-size: 15px;
  line-height: 25px;
}

.page-cs.notice table.table.board>thead>tr>th,
.page-cs.notice table.table.board>tbody>tr>td { 
  padding: 8px 5px;
  font-size: 14px;
}
.page-cs.notice table.table.board>tbody>tr>td>a {
  display: block;
  padding: 8px 0;
}
.page-cs.notice table.table.board>tbody>tr>td>a:hover {
  text-decoration: underline;
  font-weight: 500;
}

.page-cs.notice .artc-view {
  border-top: 2px solid #bbb;
}
.page-cs.notice .artc-view>div {
  padding: 20px 5px;
  border-bottom: 1px solid #bbb;
}
.page-cs.notice .artc-view>div:last-child {
  border-bottom: none;
}
.page-cs.notice .artc-view .a-head>p {
  font-size: 18px;
  font-weight: 600;
}
.page-cs.notice .artc-view .content-wrap * {
  max-width: 100%;
}
.page-cs.notice .artc-view .attached-file {
  padding: 20px 20px;
  margin-top: 50px;
  background: #f9f9f9;
}
.page-cs.notice .artc-view .attached-file p.sub-tit {
  font-size: 14px;
  font-weight: 500;
  color: #888;
  border-bottom: 1px solid #ddd;
  margin-bottom: 8px;
}

.page-cs.notice .list-box table.table tr>th:nth-child(1) { width: 45px !important; }
.page-cs.notice .list-box table.table tr>th:nth-child(3),
.page-cs.notice .list-box table.table tr>td:nth-child(3) { display: none; }
.page-cs.notice .list-box table.table tr>th:nth-child(4) { width: 90px !important; }

.cs-inquiry .radio-list>div { background-color: #eee; margin-bottom: 5px; padding-left: 10px; border-radius: 4px; }
.cs-inquiry .radio-list>div>label { width: 100%; height: 38px; display: flex; align-items: center; }
.cs-inquiry .radio-list .radioBtn>span.ip:before { top:10px; }
.cs-inquiry .radio-list .radioBtn>span.ip:after { top:20px; }



/* ===================================================================== */
/* ---------------------------- main popup ----------------------------- */
/* ===================================================================== */
.main-popup-layer {
  position: fixed;
  top: 5%;
  left: 0;
  right: 0;
  margin: auto;
  padding:0;
  z-index: 9999;
}
.main-popup-layer .popup-box {
  background: #fff;
  max-width: 480px;
  padding: 3px;
  margin: auto;
  border-radius: 5px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.3);
  position: relative;
  animation: fadeInUp 0.4s ease-out;
}
.main-popup-layer .popup-box .popup-body {
  overflow: hidden; 
  border-radius: 5px;
}
.main-popup-layer .popup-footer {
  margin-top: 3px;
  padding: 0 3px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.main-popup-layer .popup-footer button.popup-close {
  padding: 2px 5px;
  height: auto;
}
.main-popup-layer .popup-footer label {
  cursor: pointer;
  font-size: 14px;
  color: #555;
}



/* ===================================================================== */
/* ---------------------------- app download---------------------------- */
/* ===================================================================== */
.intro-app .bg-box {
  background-color: #330607;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
}
.intro-app .bg-box p {
  color:#fff;
}
.intro-app .bg-box p.tx-1 {
  font-family: 'LINESeedKR-Rg';
  font-size: 32px;
  font-weight: 600;
}
.intro-app .bg-box p.tx-2 {
  font-size: 20px;
  font-weight: 500;
}
.intro-app button.btn {
  padding: 0;
  margin:0 auto 40px;
  border:none;
  height: auto;
  display: block;
}
.intro-app button.bt-goWeb {
  font-size: 15px;
  font-weight: 500;
  color:#555;
  border-bottom: 1px solid #555;
  border-radius: 0;
  padding:2px 5px;
  
}





/* ====================================================================== */
/* ------------------------------ animation ----------------------------- */
/* ====================================================================== */
/* check circle */
.cmark-wrapper { height:100px; display:flex; justify-content:center; align-items:center; }
.cmark-wrapper svg.checkmark { width: 56px; height: 56px; border-radius: 50%; display: block; stroke-width: 2; stroke: #fff; stroke-miterlimit: 10; margin: 0 auto;
  box-shadow: inset 0px 0px 0px #74c9e2; animation: cm_fill .4s ease-in-out .4s forwards, cm_scale .3s ease-in-out .9s both; }
.cmark-wrapper svg.checkmark .checkmark-circle { stroke-dasharray: 166; stroke-dashoffset: 166; stroke-width: 1; stroke-miterlimit: 10; stroke: rgba(0, 0, 0, 0.11);
  fill: none; animation: cm_stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards; }
.cmark-wrapper svg.checkmark .checkmark-check { transform-origin: 50% 50%; stroke-dasharray: 48; stroke-dashoffset: 48;
  animation: cm_stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards; }
.cmark-wrapper svg.checkmark.cross { box-shadow: inset 0px 0px 0px #c53a3a; animation: cr_fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both; }
.cmark-wrapper svg.checkmark.cross .checkmark_cross { transform-origin: 50% 50%; stroke-dasharray: 29; stroke-dashoffset: 29;
  animation: cr_stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards; }

/* animate.css custom override */
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 25%, 0);
    transform: translate3d(0, 25%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

/* custom animation */
@keyframes beat { 0%, 100% {transform: scale(1); }  50% {transform: scale(1.35); } }
@keyframes sk-stretchdelay { 0%, 40%, 100% { transform: scaleY(0.4); -webkit-transform: scaleY(0.4); }  20% { transform: scaleY(1.0);-webkit-transform: scaleY(1.0); } }
@keyframes cm_scale { 0%, 100%{ transform: none; } 50%{ transform: scale3d(1.1, 1.1, 1); } }
@keyframes cm_fill { 100%{ box-shadow: inset 0px 0px 0px 30px #5bc0de; } }
@keyframes cm_stroke { 100%{ stroke-dashoffset: 0; } }
@keyframes cr_fill { 100%{ box-shadow: inset 0px 0px 0px 30px #e97f7f; } }
@keyframes cr_stroke { 100%{ stroke-dashoffset: 0; } }
@keyframes spinnner_circle { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }


/* animista style */
.tracking-in-expand { animation: tracking-in-expand 1.55s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; }
.tracking-in-contract { animation: tracking-in-contract 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; }
.tracking-in-contract-bck { animation: tracking-in-contract-bck 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; }
.tracking-in-contract-bck-top {	animation: tracking-in-contract-bck-top 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; }
.slide-in-bottom {animation: slide-in-bottom 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; }
.text-focus-in {animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both; }
.jello-horizontal {	animation: jello-horizontal 0.9s both; }
.fade-in-bck {animation: fade-in-bck 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; }
.puff-in-hor {animation: puff-in-hor 1.05s cubic-bezier(0.470, 0.000, 0.745, 0.715) both; }
.heartbeat {animation: heartbeat 1.5s ease-in-out infinite both; }

@keyframes tracking-in-contract {
  0% {
    letter-spacing: 1em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: normal;
    opacity: 1;
  }
}

@keyframes tracking-in-contract-bck-top {
  0% {
    letter-spacing: 1em;
    transform: translateZ(400px) translateY(-300px);
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    transform: translateZ(0) translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes tracking-in-expand {
  0% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}
@keyframes tracking-in-expand {
  0% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}

@keyframes tracking-in-contract-bck {
  0% {
    letter-spacing: 1em;
    transform: translateZ(400px);
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    transform: translateZ(0);
    opacity: 1;
  }
}
@keyframes slide-in-bottom {
  0% {
    transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes text-focus-in {
  0% {
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes jello-horizontal {
  0% {
    transform: scale3d(1, 1, 1);
  }
  30% {
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    transform: scale3d(1, 1, 1);
  }
}
@keyframes fade-in-bck {
  0% {
    transform: translateZ(80px);
    opacity: 0;
  }
  100% {
    transform: translateZ(0);
    opacity: 1;
  }
}
@keyframes puff-in-hor {
  0% {
    transform: scaleX(2);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    transform: scaleX(1);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes heartbeat {
  from {
    transform: scale(1);
    transform-origin: center center;
    animation-timing-function: ease-out;
  }
  10% {
    transform: scale(0.91);
    animation-timing-function: ease-in;
  }
  17% {
    transform: scale(0.98);
    animation-timing-function: ease-out;
  }
  33% {
    transform: scale(0.87);
    animation-timing-function: ease-in;
  }
  45% {
    transform: scale(1);
    animation-timing-function: ease-out;
  }
}