@charset "utf-8";



@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@-moz-keyframes fadeIn {

  /* Firefox */
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@-webkit-keyframes fadeIn {

  /* Safari and Chrome */
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@-o-keyframes fadeIn {

  /* Opera */
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    visibility: hidden;
    opacity: 0;
  }
}

@-moz-keyframes fadeout {

  /* Firefox */
  from {
    opacity: 1;
  }

  to {
    visibility: hidden;
    opacity: 0;
  }
}

@-webkit-keyframes fadeout {

  /* Safari and Chrome */
  from {
    opacity: 1;
  }

  to {
    visibility: hidden;
    opacity: 0;
  }
}

@-o-keyframes fadeout {

  /* Opera */
  from {
    opacity: 1;
  }

  to {
    visibility: hidden;
    opacity: 0;
  }
}

/* [0] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.0.woff2) format('woff2');
  unicode-range: U+1f1e6-1f1ff;
}

/* [1] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.1.woff2) format('woff2');
  unicode-range: U+200d, U+2620, U+26a7, U+fe0f, U+1f308, U+1f38c, U+1f3c1, U+1f3f3-1f3f4, U+1f6a9, U+e0062-e0063, U+e0065, U+e0067, U+e006c, U+e006e, U+e0073-e0074, U+e0077, U+e007f;
}

/* [2] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.2.woff2) format('woff2');
  unicode-range: U+23, U+2a, U+30-39, U+a9, U+ae, U+200d, U+203c, U+2049, U+20e3, U+2122, U+2139, U+2194-2199, U+21a9-21aa, U+23cf, U+23e9-23ef, U+23f8-23fa, U+24c2, U+25aa-25ab, U+25b6, U+25c0, U+25fb-25fe, U+2611, U+2622-2623, U+2626, U+262a, U+262e-262f, U+2638, U+2640, U+2642, U+2648-2653, U+2660, U+2663, U+2665-2666, U+2668, U+267b, U+267e-267f, U+2695, U+269b-269c, U+26a0, U+26a7, U+26aa-26ab, U+26ce, U+26d4, U+2705, U+2714, U+2716, U+271d, U+2721, U+2733-2734, U+2747, U+274c, U+274e, U+2753-2755, U+2757, U+2764, U+2795-2797, U+27a1, U+27b0, U+27bf, U+2934-2935, U+2b05-2b07, U+2b1b-2b1c, U+2b55, U+3030, U+303d, U+3297, U+3299, U+fe0f, U+1f170-1f171, U+1f17e-1f17f, U+1f18e, U+1f191-1f19a, U+1f201-1f202, U+1f21a, U+1f22f, U+1f232-1f23a, U+1f250-1f251, U+1f310, U+1f3a6, U+1f3b5-1f3b6, U+1f3bc, U+1f3e7, U+1f441, U+1f499-1f49c, U+1f49f-1f4a0, U+1f4a2, U+1f4ac-1f4ad, U+1f4b1-1f4b2, U+1f4b9, U+1f4db, U+1f4f2-1f4f6, U+1f500-1f50a, U+1f515, U+1f518-1f524, U+1f52f-1f53d, U+1f549, U+1f54e, U+1f5a4, U+1f5e8, U+1f5ef, U+1f6ab, U+1f6ad-1f6b1, U+1f6b3, U+1f6b7-1f6bc, U+1f6be, U+1f6c2-1f6c5, U+1f6d0-1f6d1, U+1f6d7, U+1f6dc, U+1f7e0-1f7eb, U+1f7f0, U+1f90d-1f90e, U+1f9e1, U+1fa75-1fa77, U+1faaf;
}

/* [3] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.3.woff2) format('woff2');
  unicode-range: U+231a-231b, U+2328, U+23f0-23f3, U+2602, U+260e, U+2692, U+2694, U+2696-2697, U+2699, U+26b0-26b1, U+26cf, U+26d1, U+26d3, U+2702, U+2709, U+270f, U+2712, U+fe0f, U+1f302, U+1f321, U+1f392-1f393, U+1f3a9, U+1f3bd, U+1f3ee, U+1f3f7, U+1f3fa, U+1f451-1f462, U+1f484, U+1f489-1f48a, U+1f48c-1f48e, U+1f4a1, U+1f4a3, U+1f4b0, U+1f4b3-1f4b8, U+1f4bb-1f4da, U+1f4dc-1f4f1, U+1f4ff, U+1f50b-1f514, U+1f516-1f517, U+1f526-1f529, U+1f52c-1f52e, U+1f550-1f567, U+1f56f-1f570, U+1f576, U+1f587, U+1f58a-1f58d, U+1f5a5, U+1f5a8, U+1f5b1-1f5b2, U+1f5c2-1f5c4, U+1f5d1-1f5d3, U+1f5dc-1f5de, U+1f5e1, U+1f5f3, U+1f6aa, U+1f6ac, U+1f6bd, U+1f6bf, U+1f6c1, U+1f6cb, U+1f6cd-1f6cf, U+1f6d2, U+1f6e0-1f6e1, U+1f6f0, U+1f97b-1f97f, U+1f9af, U+1f9ba, U+1f9e2-1f9e6, U+1f9ea-1f9ec, U+1f9ee-1f9f4, U+1f9f7-1f9ff, U+1fa71-1fa74, U+1fa79-1fa7b, U+1fa86, U+1fa91-1fa93, U+1fa96, U+1fa99-1faa0, U+1faa2-1faa7, U+1faaa-1faae;
}

/* [4] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.4.woff2) format('woff2');
  unicode-range: U+265f, U+26bd-26be, U+26f3, U+26f8, U+fe0f, U+1f004, U+1f0cf, U+1f380-1f384, U+1f386-1f38b, U+1f38d-1f391, U+1f396-1f397, U+1f399-1f39b, U+1f39e-1f39f, U+1f3a3-1f3a5, U+1f3a7-1f3a9, U+1f3ab-1f3b4, U+1f3b7-1f3bb, U+1f3bd-1f3c0, U+1f3c5-1f3c6, U+1f3c8-1f3c9, U+1f3cf-1f3d3, U+1f3f8-1f3f9, U+1f47e, U+1f4e2, U+1f4f7-1f4fd, U+1f52b, U+1f579, U+1f58c-1f58d, U+1f5bc, U+1f6f7, U+1f6f9, U+1f6fc, U+1f93f, U+1f941, U+1f945, U+1f947-1f94f, U+1f9e7-1f9e9, U+1f9f5-1f9f6, U+1fa70-1fa71, U+1fa80-1fa81, U+1fa83-1fa85, U+1fa87-1fa88, U+1fa94-1fa95, U+1fa97-1fa98, U+1faa1, U+1faa9;
}

/* [5] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.5.woff2) format('woff2');
  unicode-range: U+2693, U+26e9-26ea, U+26f1-26f2, U+26f4-26f5, U+26fa, U+26fd, U+2708, U+fe0f, U+1f301, U+1f303, U+1f306-1f307, U+1f309, U+1f310, U+1f3a0-1f3a2, U+1f3aa, U+1f3cd-1f3ce, U+1f3d5, U+1f3d7-1f3db, U+1f3df-1f3e6, U+1f3e8-1f3ed, U+1f3ef-1f3f0, U+1f488, U+1f492, U+1f4ba, U+1f54b-1f54d, U+1f5fa-1f5ff, U+1f680-1f6a2, U+1f6a4-1f6a8, U+1f6b2, U+1f6d1, U+1f6d5-1f6d6, U+1f6dd-1f6df, U+1f6e2-1f6e5, U+1f6e9, U+1f6eb-1f6ec, U+1f6f3-1f6f6, U+1f6f8, U+1f6fa-1f6fb, U+1f9bc-1f9bd, U+1f9ed, U+1f9f3, U+1fa7c;
}

/* [6] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.6.woff2) format('woff2');
  unicode-range: U+2615, U+fe0f, U+1f32d-1f330, U+1f336, U+1f33d, U+1f345-1f37f, U+1f382, U+1f52a, U+1f942-1f944, U+1f950-1f96f, U+1f99e, U+1f9aa, U+1f9c0-1f9cb, U+1fad0-1fadb;
}

/* [7] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.7.woff2) format('woff2');
  unicode-range: U+200d, U+2600-2601, U+2603-2604, U+2614, U+2618, U+26a1, U+26c4-26c5, U+26c8, U+26f0, U+2728, U+2744, U+2b1b, U+2b50, U+fe0f, U+1f300, U+1f304-1f305, U+1f308, U+1f30a-1f30f, U+1f311-1f321, U+1f324-1f32c, U+1f331-1f335, U+1f337-1f33c, U+1f33e-1f344, U+1f3d4, U+1f3d6, U+1f3dc-1f3de, U+1f3f5, U+1f400-1f43f, U+1f490, U+1f4a7, U+1f4ab, U+1f4ae, U+1f525, U+1f54a, U+1f573, U+1f577-1f578, U+1f648-1f64a, U+1f940, U+1f980-1f9ae, U+1f9ba, U+1fa90, U+1faa8, U+1fab0-1fabd, U+1fabf, U+1face-1facf, U+1fae7;
}

/* [8] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.8.woff2) format('woff2');
  unicode-range: U+200d, U+2640, U+2642, U+2695-2696, U+26f7, U+26f9, U+2708, U+2764, U+fe0f, U+1f33e, U+1f373, U+1f37c, U+1f384-1f385, U+1f393, U+1f3a4, U+1f3a8, U+1f3c2-1f3c4, U+1f3c7, U+1f3ca-1f3cc, U+1f3eb, U+1f3ed, U+1f3fb-1f3ff, U+1f466-1f478, U+1f47c, U+1f481-1f483, U+1f486-1f487, U+1f48b, U+1f48f, U+1f491, U+1f4bb-1f4bc, U+1f527, U+1f52c, U+1f574-1f575, U+1f57a, U+1f645-1f647, U+1f64b, U+1f64d-1f64e, U+1f680, U+1f692, U+1f6a3, U+1f6b4-1f6b6, U+1f6c0, U+1f6cc, U+1f91d, U+1f926, U+1f930-1f931, U+1f934-1f93a, U+1f93c-1f93e, U+1f977, U+1f9af-1f9b3, U+1f9b8-1f9b9, U+1f9bc-1f9bd, U+1f9cc-1f9cf, U+1f9d1-1f9df, U+1fa82, U+1fac3-1fac5;
}

/* [9] */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3ZgkLeX24wVHV-h9Ei.9.woff2) format('woff2');
  unicode-range: U+200d, U+261d, U+2620, U+2639-263a, U+2665, U+270a-270d, U+2728, U+2763-2764, U+2b50, U+fe0f, U+1f31a-1f31f, U+1f32b, U+1f383, U+1f389, U+1f3fb-1f3ff, U+1f440-1f450, U+1f463-1f465, U+1f479-1f47b, U+1f47d-1f480, U+1f485, U+1f48b-1f48c, U+1f493-1f49f, U+1f4a4-1f4a6, U+1f4a8-1f4ab, U+1f4af, U+1f525, U+1f573, U+1f590, U+1f595-1f596, U+1f5a4, U+1f5e3, U+1f600-1f644, U+1f648-1f64a, U+1f64c, U+1f64f, U+1f90c-1f925, U+1f927-1f92f, U+1f932-1f933, U+1f970-1f976, U+1f978-1f97a, U+1f9a0, U+1f9b4-1f9b7, U+1f9bb, U+1f9be-1f9bf, U+1f9d0, U+1f9e0-1f9e1, U+1fa75-1fa79, U+1fac0-1fac2, U+1fae0-1fae6, U+1fae8, U+1faf0-1faf8;
}

/* fallback */
@font-face {
  font-family: 'Noto Colr Emoji Glyf';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notocolremojiglyf/v15/O4ZNFHTymAx3XTz4kzAD12B9_Qi8jS_unlDHJr3Zgg.woff2) format('woff2');
}

/*
 * admin default style
 */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  font-style: normal;
}

body {
  margin: 0px;
  background-color: #f7f7f7;
  /* background-color: #f8f0fc; */
  min-height: 100%;
  line-height: 1;
  /* min-width: 1444px; */
  --global-point-color: #f03141;
  --global-primary-color: #f03141;
  --global-sub-color: #ffeded;
  --global-gradient-color: linear-gradient(220deg,
      rgba(164, 0, 255, 1) 0%,
      rgba(180, 32, 255, 1) 36%,
      rgba(246, 39, 208, 1) 68%,
      rgba(255, 67, 101, 1) 100%);
}

:root {  
  --fc-button-bg-color: #f03141;
  --fc-button-border-color: #f03141;
  --fc-today-bg-color: #fff5f5;
}

img {
  border: 0px;
}

form {
  margin: 0px;
}

.select_color_btn {
  width: 25px;
}

ul {
  padding: 0;
  margin: 0;
}

li {
  list-style: none;
}

/* UI Object */
#wrap {
  width: 100%;
}

#header {
  width: 100%;
}

#container {
  _display: inline-block;
  width: 100%;
}

#container:after {
  display: block;
  clear: both;
  content: "";
}

.snb {
  float: left;
  width: 207px;
  padding: 0px 0px 0px 13px;
}

#content {
  margin-left: 207px;
  background-color: #ffffff;
  border: 7px solid #0081e6;
  padding: 20px;
}

#copyright {
  margin: 20px 0;
  color: #302f2e;
  font-size: 11px;
  text-align: center;
  font-style: normal;
}

#copyright a {
  color: #b2b2b2;
  font-weight: bold;
  text-decoration: none;
}

#countdown_dashboard {
  height: 33px;
  padding: 16px 0px 0px 10px;
}

/* calendar */
.fc {
  font-size: .9em !important;
}

.fc .fc-button:hover {
  background: var(--fc-button-bg-color) !important;
  border-color: var(--fc-button-bg-color) !important;
}

.fc .fc-day .fc-col-header-cell-cushion {
  font-weight: 500;
}

.fc .fc-day.fc-day-sat .fc-col-header-cell-cushion,
.fc .fc-day.fc-day-sat .fc-daygrid-day-number {
  color: #006bbd;
}

.fc .fc-day.fc-day-sun .fc-col-header-cell-cushion,
.fc .fc-day.fc-day-sun .fc-daygrid-day-number {
  color: #f03141;
}

/* calendar */

.dash {
  width: 27px;
  float: left;
  position: relative;
}

.dash .digit {
  font-weight: bold;
  float: left;
  width: 10pt;
  text-align: center;
  font-size: 24px;
  color: #ffffff;
  position: relative;
  padding: 0px;
}

/* COMMON STYLE */
*,
ol,
ul {
  margin: 0;
  padding: 0;
}

a {
  color: #333;
  text-decoration: none !important;
}

a:hover {
  color: inherit;
}

em {
  font-style: normal;
}

html {
  height: 100%;
  -ms-overflow-style: scrollbar;
}

* {
  font-family: "Roboto", "Noto Sans JP", "Noto Sans KR", sans-serif, "Noto Colr Emoji Glyf";
  /* font-family: "Roboto", "Noto Sans KR", "Segoe UI Emoji", "Segoe UI Symbol" !important; */
  box-sizing: border-box;
  outline: none !important;
  box-shadow: none;
}

input::placeholder {
  color: #b2b2b2;
}

.form-control {
  box-shadow: none !important;
  height: 3.5rem;
  border-radius: .5rem;
  font-size: 1.5rem;
  border: .1rem solid #ddd;
}

.form-control:focus {
  border-color: #ddd;
}

input[type="text"],
input[type="password"],
select {
  border-color: #ddd !important;
  -webkit-appearance: none;
}

select {
  min-height: 3.2rem;
  padding: 0 3rem 0 1.5rem !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(/skin/img/ic-arrow-down.png) !important;
  background-repeat: no-repeat;
  background-position: top 50% right 1.1rem;
  background-size: 1.1rem;
  outline: none !important;
  cursor: pointer;
  background-color: #fff !important;
  border-radius: .4rem;
}

select.form-select {
  font-size: 1.5rem;
  color: #222;
  width: auto;
  /* min-width: 12rem; */
  height: 3.5rem;
  border-radius: .5rem;
}

select.multi-select {
  background-image: none !important;
}

label,
b,
strong {
  font-weight: normal;
}

.hidden {
  display: none !important;
}



section {
  padding: 115px 25px 25px 225px;
}

section .content-wrap {
  padding: 25px;
}

/* footer {
  text-align: center;
  font-size: 13px;
  color: #999999;
  padding: 10px 0 30px 200px;
} */

.form-control[readonly] {
  background-color: #fff !important;
}

input[type="radio"],
input[type="checkbox"] {
  display: inline-block;
  width: 1.7rem;
  height: 1.7rem;
  vertical-align: middle;
  -webkit-appearance: none;
  border-radius: 0;
  border: 0;
  margin: 0rem 0rem 0rem !important;
  padding: 0rem 0rem 0rem;
  cursor: pointer;
}

input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: 0;
}

input[type="radio"]:disabled,
input[type="checkbox"]:disabled {
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  /* Firefox 10+, Firefox on Android */
  filter: gray;
  /* IE6-9 */
  -webkit-filter: grayscale(100%);
  /* Chrome 19+, Safari 6+, Safari 6+ iOS*/
}

input[type="radio"] {
  background: url(/skin/img/radio_off.svg) no-repeat;
  background-size: 10px;
  background-position: center;
}

input[type="radio"]:checked {
  background: url(/skin/img/radio_on.svg) no-repeat;
  background-size: 10px;
  background-position: center;
}

input[type="checkbox"] {
  background: url(/skin/img/checkbox_off.svg) center / contain no-repeat;
}

input[type="checkbox"]:disabled {
  background: url(/skin/img/checkbox_disabled_off.svg) center / contain no-repeat;
}

input[type="checkbox"]:checked {
  background: url(/skin/img/checkbox_on.svg) center / contain no-repeat;
}

input[type="checkbox"]:checked:disabled {
  background: url(/skin/img/checkbox_disabled_on.png) center / contain no-repeat;
}

input[type="text"],
input[type="password"],
input[type="tel"] {
  border-radius: .5rem;
  border: 1px solid #ddd;
  color: #222;
  font-size: 1.5rem;
  padding: 0 1.5rem;
  height: 3.5rem;
  width: 100%;
}

input[type="text"]::placeholder,
input[type="password"]::placeholder,
input[type="tel"]::placeholder,
textarea::placeholder {
  color: #b2b2b2;
  font-size: 15px;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="tel"] {
  -moz-appearance: textfield;
}

textarea,
textarea.form-control {
  border-radius: 1.4rem;
  border: 1px solid #ddd !important;
  color: #222;
  font-size: 1.6rem;
  padding: 1.5rem;
  resize: none;
}

a:active,
a:visited,
a:focus {
  color: #222;
}

/* input[type="submit"],
input[type="button"],
button {
  background-color: #fff;
  width: auto;
  flex: none;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 3px;
  outline: none !important;
  border: 1px solid #ddd;
  line-height: 1;
  color: #222;
  box-sizing: border-box;
  font-size: 14px;
  min-width: 70px;
  height: 30px;
  padding: 0 8px;
  cursor: pointer;
} */

button a,
button a:active,
button a:visited,
button a:focus {
  color: inherit;
  font-size: inherit;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-weight: normal;
}

/* input[type="submit"]+input[type="submit"],
input[type="button"]+input[type="button"],
input[type="submit"]+input[type="button"],
input[type="button"]+input[type="submit"],
button+input[type="submit"],
button+input[type="button"],
input[type="submit"]+button,
input[type="button"]+button,
button+button {
  margin-left: 8px;
} */

input[type="submit"],
input[type="button"],
button {
  border: none;
  box-shadow: none;
}

/* input[type="submit"].btn-mini,
input[type="button"].btn-mini,
button.btn-mini, */
*.btn-mini {
  font-size: 1.3rem;
  min-width: 5rem;
  height: 2.8rem;
  padding: 0.2rem 0.5rem;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* input[type="submit"].btn-small,
input[type="button"].btn-small,
button.btn-small, */
*.btn-small {
  font-size: 1.4rem;
  min-width: 7rem;
  height: 3.5rem;
  padding: 0 0.8rem;
  border-radius: 0.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

input[type="submit"].btn-small.table-btn,
input[type="button"].btn-small.table-btn,
button.btn-small.table-btn {
  height: 3.5rem;
}

/* input[type="submit"].btn-medium,
input[type="button"].btn-medium,
button.btn-medium, */
*.btn-medium {
  text-align: center;
  font-size: 1.5rem;
  flex: none;
  height: 4.5rem;
  line-height: 4.5rem;
  border-radius: 0.8rem;
  cursor: pointer;
  color: #222;
  background-color: #b2b2b2;
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1 2rem;
  min-width: 12rem;
}

/* input[type="submit"].btn-large,
input[type="button"].btn-large,
button.btn-large, */
*.btn-large {
  text-align: center;
  border-radius: 1.4rem;
  font-size: 1.8rem;
  flex: 1;
  height: 6rem;
  line-height: 1;
  cursor: pointer;
  color: #222;
  background-color: #b2b2b2;
  color: #fff;
  width: 100%;
  padding: 0 1.5rem;
  /* min-width: 100px; */
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
}

/* input[type="submit"].primary,
input[type="button"].primary,
button.primary, */
*.primary {
  background-color: var(--global-primary-color) !important;
  border-color: var(--global-primary-color) !important;
  color: #fff !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

/* input[type="submit"].sub,
input[type="button"].sub,
button.sub,
a */
*.sub {
  background-color: var(--global-sub-color) !important;
  color: var(--global-primary-color) !important;
  border: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

*.gray {
  background-color: #efefef;
  border-color: #efefef;
  color: #444;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

*.dark-gray {
  background-color: #b2b2b2 !important;
  border-color: #b2b2b2 !important;
  color: #fff;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

*.black {
  background-color: #222 !important;
  border-color: #222 !important;
  color: #fff !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

*.gradient {
  background: linear-gradient(220deg,
      rgba(164, 0, 255, 1) 0%,
      rgba(180, 32, 255, 1) 36%,
      rgba(246, 39, 208, 1) 68%,
      rgba(255, 67, 101, 1) 100%);
  color: #fff;
  box-shadow: none !important;
  text-shadow: none !important;
}

*.outline {
  background-color: #fff !important;
  border-color: var(--global-primary-color) !important;
  border: 1px solid !important;
  color: var(--global-primary-color) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

*.outline.black,
*.black.outline {
  background-color: #fff !important;
  border-color: #222 !important;
  color: #222 !important;
  border: 1px solid !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none !important;
}

*.outline.gray {
  background-color: #fff;
  border-color: #ddd;
  color: #222;
  border: 1px solid;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

input[type="submit"].round,
input[type="button"].round,
button.round,
a.round {
  border-radius: 100px;
}

/* a.btn-mini,
a.btn-small,
a.btn-medium,
a.btn-large {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
} */

.btn-wrap a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0 1rem;
}

.btn-wrap button a {
  margin: 0;
}

.btn-wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 30px;
}

.btn-wrap>* {
  flex: 1;
}

.btn-wrap>*+* {
  margin-left: 10px;
}

.btn-wrap.center {
  justify-content: center;
}

.btn-wrap.has-bottom-margin {
  margin-bottom: 15px;
}


.btn-wrap .notice_gray,
.btn-wrap .notice_red {
  font-size: 14px !important;
  letter-spacing: -1px;
  margin-left: 10px;
  line-height: 18px;
  flex: 1 !important;
}

.star-wrap {
  display: block;
  width: 104px;
  background-image: url(/skin/img/ic-star-off.png);
  background-size: 104px;
  position: relative;
  background-repeat: no-repeat;
}

.star-wrap::after {
  display: block;
  content: "";
  padding-bottom: 16.66666%;
}

.star-wrap .star-on {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url(/skin/img/ic-star-on.png);
  background-size: 104px;
  background-repeat: no-repeat;
}

.bg-cover {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.bg-contain {
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.bg-custom {
  background-position: center;
  background-repeat: no-repeat;
}

.no-data {
  display: block;
  position: relative;
  padding-top: 7.5rem;
  text-align: center;
  font-size: 1.5rem;
  color: #b2b2b2;
  width: 100%;
  padding-bottom: 1rem;
}

.no-data.has-height {
  min-height: 30rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  padding-top: 9rem;
  font-size: 1.6rem;
}

.no-data::before {
  display: block;
  content: "";
  width: 6rem;
  height: 6rem;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background-image: url(/skin/img/no-data.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.no-data.has-height::before {
  top: 36%;
}

.no-data.notice::before {
  background-image: url(/skin/img/notice-no-data.png);
  background-size: 80%;
}

.guide-wrap {
  background-color: #f7f7f7;
  border: 1px solid #ddd;
  line-height: 1.5;
  font-size: 1.4rem;
  letter-spacing: -0.05rem;
  color: #666;
  border-radius: 1.4rem;
  padding: 2rem;
}

.tabs {
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 0.5px solid #f2f2f2;
}

.tabs li,
.tabs>a {
  flex: 1;
  width: 50%;
  padding: 1.5rem 0;
  font-size: 1.7rem;
  text-align: center;
  color: #b2b2b2;
  display: block;
  cursor: pointer;
}

.tabs li.active,
.tabs>a.active {
  color: #222;
  position: relative;
}

.tabs li.active::after,
.tabs>a.active::after {
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  background-color: #222;
  position: absolute;
  bottom: 0;
  left: 0;
}

.tabs.dark li.active {
  color: #f2f2f2;
}

.tabs.dark li.active::after {
  background-color: #f2f2f2;
}

.tabs.dark {
  border-bottom: 0.5px solid #444;
}

.tabs.has-count li a {
  padding: 1rem 0;
}

.tabs.has-count li p+p {
  margin-top: 8px;
  font-size: 1.6rem;
}

.item-form-container,
.data-form-container {
  padding: 20px;
  background-color: #fff;
  border-radius: 5px;
  margin-bottom: 25px;
  position: relative;
}

.data-container {
  padding: 2.5rem;
  background-color: #fff;
  border-radius: 1.4rem;
  margin-bottom: 2.5rem;
  position: relative;
}

.data-container.search-wrap {
  padding: 2rem;
}

.data-container.search-wrap .btn-wrap>* {
  width: 12rem;
  flex: none;
}

.data-container.form-wrap {
  padding: 20px;
}

.data-container:not(.search-wrap) {
  min-height: 400px;
}

.data-container:not(.search-wrap):not(.no-btn-wrap) {
  padding-bottom: 125px;
}

.data-container:not(.search-wrap):not(.no-btn-wrap) .btn-wrap {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 50px;
  width: 100%;
}

.data-container:not(.search-wrap):not(.no-btn-wrap) .table_btn {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 100%;
}

.data-container .btn-white {
  height: 32px;
  line-height: 32px;
  background-color: #fff !important;
  color: #222 !important;
  font-size: 13px;
  border-color: #222;
  border-radius: 3px;
  padding: 0 10px;
}

.data-container a.btn-white::hover {
  border-color: #222 !important;
}

.list-data-container {
  padding: 10px 20px;
  background-color: #fff;
  border-radius: 5px;
  position: relative;
}

.list-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
  color: #222;
  letter-spacing: -1px;
  padding: 0 0 15px 0;
  height: 92px;
}

.list-title.has-select-wrap {
  padding: 5px 0 10px 0;
}

.list-title li {
  flex: 1;
  text-align: center;
  padding: 5px 10px;
}

.list-data-container .list-item-wrap {
  min-height: 300px;
}

/* .list-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 70px;
  width: 100%;
  padding: 10px 0;
  background-color: #f7f7f7;
  border-radius: 5px;
  margin-bottom: 12px;
  position: relative;
}

.list-item>div {
  flex: 1;
  text-align: center;
  font-size: 15px;
  padding: 5px 10px;
} */

/* order_form.php Style */
.order-detail-info {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.order-detail-info li {
  flex: none;
  width: 50%;
  letter-spacing: -1px;
  display: flex;
  align-items: center;
  padding: 10px 0;
}

.order-detail-label {
  font-weight: 500;
  font-size: 15px;
  width: 150px;
  flex: none;
}

.order-detail-txt {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* order_form.php Style End */

/* item_form.php Style */
.item-form-container .inner {
  width: 700px;
}

.item-form-container .form-title {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 20px;
  width: 700px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.item-form-container .form-label {
  font-weight: 500;
  margin: 10px 0;
  font-size: 15px;
}

.item-form-container .form-label:not(:nth-child(1)) {
  margin-top: 30px;
}



.item-form-container select {
  height: 35px;
}

.item-form-table {
  width: 100%;
}

.item-form-table .radio-inline-wrap {
  display: flex;
  align-items: center;
  height: 37px;
}

.item-form-table .radio-inline {
  display: flex;
  align-items: center;
}

.item-form-table .radio-inline input+span {
  margin-left: 5px;
}

.item-form-table label+label {
  margin-left: 10px !important;
}

.item-form-table label {
  min-width: 100px;
}

/* .item-form-table>tbody>tr>th,
.item-form-table>tbody>tr>td {
  vertical-align: middle;
  padding: 3px 0;
} */

.item-form-table .flex-wrap {
  width: auto;
}

.item-form-table .flex-wrap>span {
  display: block;
  flex: none;
  min-width: 100px;
}

.item-form-table .flex-wrap>span+.input-suffix,
.item-form-table .flex-wrap .input-suffix+span,
.item-form-table .flex-wrap>span+.input-prefix,
.item-form-table .flex-wrap .input-prefix+span {
  margin-left: 10px;
}

.item-form-table .flex-wrap+.flex-wrap {
  margin-top: 10px;
}

.selected-category {
  margin-top: 40px;
  max-width: 450px;
}

.selected-category>h3 {
  font-size: 16px;
  margin-bottom: 15px;
}

.selected-category li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 42px;
}

/* .second-category-wrap {
  margin-top: 40px;
  display: none;
}
.second-category-wrap ul {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 10px;
}
.second-category-wrap ul li {
  width: 50%;
  flex: none;
}
.second-category-wrap ul li label {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 40px;
}
.second-category-wrap ul li label input[type="radio"] {
  width: 20px;
  height: 20px;
  background-size: 20px;
  background-image: url(/skin/img/ic-radio-off.svg);
}
.second-category-wrap ul li label input[type="radio"]:checked {
  width: 20px;
  height: 20px;
  background-size: 20px;
  background-image: url(/skin/img/ic-radio-on.svg);
}
.second-category-wrap ul li label span {
  padding: 0 10px;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
} */
.category-wrap li label input[type="checkbox"]:checked {
  background-image: url(/skin/img/ic-round-check.png);
  background-size: 18px;
  width: 18px;
  height: 18px;
}



.item-form-container .radio-wrap {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}

.item-form-container .radio-wrap label {
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 380px;
}

.item-form-container .radio-wrap label>span {
  min-width: 100px;
  /* margin-right: 15px; */
}

.item-form-container .radio-wrap label input[type="radio"] {
  width: 20px;
  height: 20px;
  background-size: 20px;
  background-image: url(/skin/img/ic-radio-off.svg);
  margin-left: auto !important;
}

.item-form-container .radio-wrap label input[type="radio"]:checked {
  width: 20px;
  height: 20px;
  background-size: 20px;
  background-image: url(/skin/img/ic-radio-on.svg);
}

.item-form-container .checkbox-inline+.checkbox-inline,
.item-form-container .radio-inline+.radio-inline {
  margin-left: 0;
}

.item-form-container.radio-inline>span,
.item-form-container .checkbox-inline>span {
  padding: 0;
}

.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"],
.radio input[type="radio"],
.item-form-container .radio-inline input[type="radio"] {
  position: relative;
}

.item-form-container .input-suffix,
.item-form-container .input-prefix {
  flex: none;
}

.item-form-container .flex-wrap {
  display: flex;
  align-items: center;
  width: 380px;
}

.item-form-container .flex-wrap>p {
  min-width: 100px;
}

.item-form-container .flex-wrap.file {
  width: 100%;
  flex-wrap: wrap;
}

.item-form-container .admin-file-wrap {
  margin: 0 10px 0 0;
  border-radius: 5px;
  /* overflow: hidden; */
  flex: none;
  width: 70px;
  height: 70px;
  display: block;
  position: relative;
}

.item-form-container .admin-file-thumb {
  background-image: url(/skin/img/thumb_background.png);
  background-size: cover;
  background-position: center;
  cursor: pointer;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 5px;
  overflow: hidden;
}

.item-form-container .admin-file-wrap input[type="file"] {
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 100% !important;
  padding: 0;
  margin-right: 0;
}

.item-form-container .admin-file-wrap .del-file {
  position: absolute;
  right: -5px;
  top: -5px;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  padding: 0 !important;
  background-color: var(--global-primary-color);
  border: 1px solid #fff;
  cursor: pointer;
  background: url(/skin/img/ic-round-x.png) no-repeat center / 100%;
}

.admin-file-wrap input[type="checkbox"],
.item-form-container .admin-file-wrap a {
  display: none;
}

.item-form-container .search-date-picker {
  flex: none;
  width: 230px;
}


/* item_form.php Style End */

/* 공통으로 쓰이는 데이터만 세팅 */
/* 나머지는 각 파일에 */
/* .list-title li.check-wrap,
.list-item>div.check-wrap {
  width: 50px;
  flex: none;
  vertical-align: middle;
}

.list-title li.list-btn,
.list-item>div.list-btn {
  flex: none;
  width: 60px;
}

.list-title li.date-wrap,
.list-item>div.date-wrap {
  width: 10%;
  flex: none;
}

.list-title li.thumb,
.list-item>div.thumb {
  width: 80px;
  flex: none;
  padding-left: 0;
  padding-right: 0;
}

.list-title li.title,
.list-item>div.title {
  flex: none;
  width: 20%;
  text-align: left;
}

.list-title li.description,
.list-item>div.description {
  text-align: left !important;
  overflow: hidden;
}

.list-title li.price,
.list-item>div.price {
  flex: none;
  text-align: right;
  width: 100px;
}

.list-title li.member-info,
.list-item>div.member-info {
  flex: none;
  width: 7%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.list-title li.order-id,
.list-item>div.order-id {
  flex: none;
  width: 120px;
}

.list-item>div.order-id .pay-date {
  font-size: 14px;
  letter-spacing: -1px;
  color: #666;
}

.list-item>div.order-id br {
  display: none;
}

.list-title.no-check,
.list-item.no-check {
  padding-left: 10px;
}

.list-title li.count,
.list-item>div.count {
  flex: none;
  width: 80px;
}

.list-title li.pay-opt-btn,
.list-item>div.pay-opt-btn,
.list-title li.pay-type,
.list-item>div.pay-type {
  flex: none;
  width: 110px;
}

.list-title li.bank,
.list-item>div.bank {
  flex: none;
  width: 150px;
}

.list-title li.addr,
.list-item>div.addr {
  flex: none;
  width: 18%;
}

.list-title li.select-wrap,
.list-item>div.select-wrap {
  flex: none;
  width: 150px;
}

.list-title li select,
.list-item>div select {
  font-size: 13px !important;
  width: 100%;
  border-radius: 4px;
  height: 32px !important;
}

.list-title li input:not([type="checkbox"]),
.list-item>div input:not([type="checkbox"]),
.list-title li button,
.list-item>div button {
  font-size: 13px !important;
  width: 100%;
  margin: 0;
  height: 32px !important;
  margin-top: 5px;
}

.list-title li>input::placeholder,
.list-item>div>input::placeholder {
  font-size: 13px !important;
  color: #b2b2b2;
  font-weight: normal;
}

.list-title .memo,
.list-item .memo {
  flex: none;
  width: 160px;
}

.list-item>div {
  line-height: 1.3;
  letter-spacing: -0.5px;
}

div.thumb a {
  display: block;
  width: 100%;
  border-radius: 5px;
  position: relative;
  overflow: hidden;
}

div.thumb a::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

div.thumb a img {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
} */

div.thumb a.normal-review,
.qna-list-wrap li .thumb.normal {
  background: var(--global-primary-color) url(/skin/img/ic-review-w.svg) center / 50% no-repeat;
}

/* .list-item>div .btn-mini {
  height: 25px !important;
  width: 100%;
} */

.text-overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.config-title {
  color: #222;
  font-size: 17px;
  font-weight: 500;
  margin-bottom: 20px;
  letter-spacing: -1px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.config-title:not(:first-child) {
  margin-top: 20px;
}

.config-title span {
  margin-left: 10px;
  color: #666;
  font-size: 14px;
}



.admin-file-wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.admin-file-wrap input[type="file"] {
  line-height: 4.5rem;
  border-radius: .8rem !important;
  height: 4.5rem !important;
  padding-top: 0;
  padding-bottom: 0;
  margin-right: 1rem;
}

.admin-file-wrap a {
  margin-left: 10px;
  display: block;
  width: 34px;
  height: 34px;
  border-radius: 3px;
  overflow: hidden;
}

.admin-file-wrap a img {
  width: 100%;
  height: 100%;
}

/* COMMON END */
/*
.period_wrap {
  display: flex;
  vertical-align: middle;
  height: 32px;
}

 .period_wrap label {
  border-radius: 5px;
  overflow: hidden;
  border: none;
  background-color: #f2f2f2;
  padding: 0 10px;
  color: #666;
  font-size: 13px;
  cursor: pointer;
  display: block;
  height: 100%;
  line-height: 32px;
}

.period_wrap label.checked {
  color: var(--global-primary-color);
  background-color: var(--global-sub-color);
  font-weight: 500;
}

.period_wrap label+label {
  margin-left: 8px;
}

.period_wrap input {
  display: none;
} */

.count-wrap {
  margin-bottom: 2rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}


.count-wrap .total-count,
.count-wrap .detail-count {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* align-items: baseline; */
  background-color: #fff;
  border-radius: 1.4rem;
  padding: 2rem;
  padding-top: 2.3rem;
  height: 8rem;
  font-size: 1.6rem;
  text-align: center;
  flex: none;
  width: 25rem;
  /* margin-right: 2rem; */
}

.count-wrap .total-count+.total-count {
  margin-left: 2rem;
}

.count-wrap .total-count.active {
  border-radius: 0 1.4rem 1.4rem 0;
  /* border-left: 3px solid var(--global-primary-color); */
  position: relative;
}

.count-wrap .total-count.active::before {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 0.5rem;
  background-color: var(--global-primary-color);
}

.count-wrap .detail-count {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #fff;
  border-radius: 1.4rem;
  padding: 2rem;
  height: 8rem;
  font-size: 1.8rem;
  text-align: center;
  flex: none;
  width: 25rem;
  margin-right: 2rem;
  justify-content: flex-start;
  flex: 1;
  width: auto;
  margin-right: 0;
  padding: 0;
}

.count-wrap .total-count span:not(.text) {
  font-size: 2.2rem;
  /* margin-right: .3rem; */
  /* font-weight: 500; */
  color: var(--global-primary-color);
}

.count-wrap .detail-count a {
  cursor: pointer;
}

.count-wrap .detail-count li,
.count-wrap .detail-count a {
  max-width: 15rem;
  display: block;
  padding: 2rem 0;
  position: relative;
  flex: 1;
}

.count-wrap .detail-count li::after,
.count-wrap .detail-count a::after {
  content: "";
  display: block;
  width: .1rem;
  height: 4rem;
  background-color: #f2f2f2;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.count-wrap .detail-count li .title,
.count-wrap .detail-count a .title {
  font-size: 1.4rem;
  margin-bottom: 1rem;
}

.count-wrap .detail-count li .number,
.count-wrap .detail-count a .number {
  font-size: 1.6rem;
  font-weight: 500;
  min-height: 1.6rem;
}

.count-wrap .detail-count li.on .number,
.count-wrap .detail-count a.on .number {
  color: var(--global-primary-color);
}

.count-wrap.col {
  background-color: #fff;
  border-radius: 1.4rem;
}

.count-wrap.col .total-count {
  flex-direction: column;
  background-color: transparent;
  border-radius: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin-left: 0;
  flex: none;
  width: 16rem;
  position: relative;
}

.count-wrap.col .total-count+.total-count::after {
  content: "";
  display: block;
  width: 1px;
  height: 50%;
  background-color: #eee;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.count-wrap.col .total-count p:first-child {
  margin-bottom: 1rem;
}

.count-wrap.col .total-count span:not(.text) {
  font-size: 2rem;
  color: inherit;
}

.count-wrap.col .total-count.active::before {
  height: 3px;
  width: 100%;
  top: auto;
  bottom: 0;
  display: none;
}

.count-wrap.col .total-count p+p {
  color: #222;
}

.count-wrap.col .total-count.active p+p {
  color: var(--global-primary-color);
}

/* 리스트 검색 영역 */

.search-input-button input[type="text"],
.search-select-input select {
  width: 100px;
  flex: none;
  height: 4.5rem;
  border-radius: 4px 0 0 4px;
  border-color: #ddd;
  border-right: none;
}

.search-input-button input[type="file"],
.search-input-button input[type="password"] {
  flex: none;
  max-width: 350px;
  height: 4.5rem;
  line-height: 4.5rem;
  border-radius: 4px 0 0 4px;
  border-color: #ddd;
  border-right: none;
  padding: 0 15px;
}

.search-select-input input {
  height: 34px;
  border-radius: 0 4px 4px 0;
  border-color: #ddd;
}

.search-input-button button,
.search-input-button input[type="button"],
.search-input-button input[type="submit"] {
  border-radius: 0 4px 4px 0;
  height: 4.5rem;
}

.search-input-select select {
  width: 100px;
  flex: none;
  height: 34px;
  border-radius: 0 4px 4px 0;
  border-color: #ddd;
}

.search-input-select input {
  height: 34px;
  border-radius: 4px 0 0 4px;
  border-color: #ddd;
  border-right: none;
}

.select-input-button>* {
  height: 35px !important;
  border-color: #ddd !important;
}

.select-input-button select {
  border-right: none !important;
  border-radius: 5px 0 0 5px;
}

.select-input-button input[type="text"] {
  border-radius: 0 !important;
}

.select-input-button button,
.select-input-button input[type="button"] {
  border-radius: 0 5px 5px 0 !important;
  border-left: none !important;
}

.search-date-picker {
  border-radius: 5px;
  border: 1px solid #ddd;
  overflow: hidden;
}

.search-date-picker input {
  height: 32px;
  border: none !important;
  border-radius: 0;
  flex: 1;
}

.search-date-picker select {
  width: 100px;
  flex: none;
  border: none;
  border-right: 1px solid #ddd;
  height: 32px;
  border-radius: 0;
}

.category-wrap {
  display: flex;
  align-items: center;
  /* padding-right: 150px; */
  padding-right: 22%;
}

.category-wrap select:not(:last-child) {
  margin-right: 10px;
}


.input-suffix {
  display: flex;
  align-items: center;
  border-radius: 1.4rem;
  border: 1px solid #ddd;
  padding: 0 1.5rem;
}

.input-suffix.small {
  border-radius: 0.8rem;
}

.input-suffix input {
  flex: 1;
  border-radius: 0 !important;
  padding: 0 !important;
  border: none !important;
  height: 5.8rem !important;
  width: auto;
  min-width: 0;
  background: inherit;
}

.input-suffix.small input {
  height: 3.5rem !important;
}

.input-suffix .suffix {
  font-size: 1.6rem;
  color: #222;
  letter-spacing: -0.05rem;
  flex: none;
  padding-left: 1.5rem;
  line-height: 1;
}

.input-suffix .prefix {
  font-size: 1.6rem;
  color: #222;
  letter-spacing: -0.05rem;
  flex: none;
  padding-right: 1.5rem;
  line-height: 1;
}

.search-checkbox-wrap,
.search-radio-wrap {
  display: flex;
  align-items: center;
  height: 32px;
}

.search-checkbox-wrap label:not(:first-child),
.search-radio-wrap label:not(:first-child) {
  margin-left: 10px;
}

.search-checkbox-wrap label span {
  padding-left: 10px;
}

.search_tr_detail {
  display: none;
}

/* .search_tr_detail {
  display: none;
}
.search_tr_detail.on {
  display: table-row;
} */
.category-wrap.search_tr_detail.on {
  display: flex;
}

.sort-wrap {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 10px;
}

.sort-wrap select {
  border: none;
  background-color: transparent !important;
  height: 3rem;
  width: auto;
  box-sizing: border-box;
  padding-right: 3rem !important;
  font-size: 1.4rem;
}

.btn-wrap #exceldown,
.btn-wrap #calculateExceldown {
  margin-left: auto;
}

.btn-wrap #calculateExceldown+#exceldown {
  margin-left: 10px;
}

.btn-wrap #calculateExceldown {
  background-color: #206f44;
  border-color: #206f44;
}

.btn-wrap .input-button {
  height: 37px !important;
  margin-right: 8px;
}

.btn-wrap .input-button input[type="text"] {
  height: 37px !important;
}

.btn-wrap .input-button input[type="button"] {
  border: none;
  height: 37px !important;
  line-height: 1;
}

.nfor_maxlength_wrap {
  display: flex;
  align-items: center;
  max-width: 400px;
}

.nfor_maxlength_wrap span {
  margin-left: 10px;
}

/***********************************************
 ** 글로벌 선언
 ***********************************************/
/* 부트스트랩 기본 값 상쇄 */

/*색상*/
.txt_red {
  color: var(--global-primary-color);
  font-weight: bold;
}

.line_gray {
  border-top: solid 1px #dcdcdc;
}

/*마진*/
.martop0 {
  margin-top: 0 !important;
}

.martop5 {
  margin-top: 0.5rem !important;
}

.martop10 {
  margin-top: 1rem !important;
}

.martop15 {
  margin-top: 1.5rem !important;
}

.martop20 {
  margin-top: 2rem !important;
}

.martop25 {
  margin-top: 2.5rem !important;
}

.martop30 {
  margin-top: 3rem !important;
}

.martop40 {
  margin-top: 4rem !important;
}

.martop45 {
  margin-top: 4.5rem !important;
}

.martop50 {
  margin-top: 5rem !important;
}

.marbottom0 {
  margin-bottom: 0 !important;
}

.marbottom5 {
  margin-bottom: 0.5rem !important;
}

.marbottom10 {
  margin-bottom: 1rem !important;
}

.marbottom15 {
  margin-bottom: 1.5rem !important;
}

.marbottom20 {
  margin-bottom: 2rem !important;
}

.marbottom25 {
  margin-bottom: 2.5rem !important;
}

.marbottom30 {
  margin-bottom: 3rem !important;
}

.marbottom40 {
  margin-bottom: 4rem !important;
}

.marbottom45 {
  margin-bottom: 4.5rem !important;
}

.marbottom50 {
  margin-bottom: 5rem !important;
}

.marleft5 {
  margin-left: 0.5rem !important;
}

.marleft10 {
  margin-left: 1rem !important;
}

.marleft15 {
  margin-left: 1.5rem !important;
}

.marleft20 {
  margin-left: 2rem !important;
}

.marleft25 {
  margin-left: 2.5rem !important;
}

.marleft30 {
  margin-left: 3rem !important;
}

.marleft40 {
  margin-left: 4rem !important;
}

.marleft50 {
  margin-left: 5rem !important;
}

.marleft60 {
  margin-left: 6rem !important;
}

.marleft70 {
  margin-left: 7rem !important;
}

.marleft80 {
  margin-left: 8rem !important;
}

.marleftauto {
  margin-left: auto !important;
}

.marright0 {
  margin-right: 0rem !important;
}

.marright5 {
  margin-right: 0.5rem !important;
}

.marright10 {
  margin-right: 1rem !important;
}

.marright15 {
  margin-right: 1.5rem !important;
}

.marright20 {
  margin-right: 2rem !important;
}

.marrightauto {
  margin-right: auto !important;
}

.margin-right-10 {
  margin-right: 1rem !important;
}

.margin0 {
  margin: 0px !important;
}

.martop20 {
  margin-top: 2rem !important;
}

.mar10 {
  margin: 1rem !important;
}

.marauto {
  margin-left: auto;
  margin-right: auto;
}

/*패딩*/
.padding5p {
  padding: 5px 0px 0px 0px;
}

/* 넓이 */
.width100p,
.width-100per {
  width: 100% !important;
}

.width-auto {
  width: auto !important;
}

.width-50p {
  width: 5rem !important;
  flex: none !important;
}

.width-60p {
  width: 6rem !important;
  flex: none !important;
}

.width-70p {
  width: 7rem !important;
  flex: none !important;
}

.width-80p {
  width: 8rem !important;
  flex: none !important;
}

.width-90p {
  width: 9rem !important;
  flex: none !important;
}

.width-100p {
  width: 10rem !important;
  flex: none !important;
}

.width-110p {
  width: 11rem !important;
  flex: none !important;
}

.width-120p {
  width: 12rem !important;
  flex: none !important;
}

.width-130p {
  width: 13rem !important;
  flex: none !important;
}

.width-140p {
  width: 14rem !important;
  flex: none !important;
}

.width-150p {
  width: 15rem !important;
  flex: none !important;
}

.width-160p {
  width: 16rem !important;
  flex: none !important;
}

.width-170p {
  width: 17rem !important;
  flex: none !important;
}

.width-180p {
  width: 18rem !important;
  flex: none !important;
}

.width-190p {
  width: 19rem !important;
  flex: none !important;
}

.width-103p {
  width: 10rem !important;
  flex: none !important;
}

.width-80p {
  width: 8rem !important;
  flex: none !important;
}

.width-200p {
  width: 20rem !important;
  flex: none !important;
}

.width-250p {
  width: 25rem !important;
  flex: none !important;
}

.width-300p {
  width: 30rem !important;
  flex: none !important;
}

.width-350p {
  width: 35rem !important;
  flex: none !important;
}

.width-380p {
  width: 38rem !important;
  flex: none !important;
}

.width-400p {
  width: 40rem !important;
  flex: none !important;
}

.width-450p {
  width: 45rem !important;
  flex: none !important;
}
.width-480p {
  width: 48rem !important;
  flex: none !important;
}

.width-500p {
  width: 50rem !important;
  flex: none !important;
}

.width-550p {
  width: 55rem !important;
  flex: none !important;
}

.width-600p {
  width: 60rem !important;
  flex: none !important;
}

.width-650p {
  width: 65rem !important;
  flex: none !important;
}

.width-700p {
  width: 70rem !important;
  flex: none !important;
}

.width-800p {
  width: 80rem !important;
  flex: none !important;
}

.width-900p {
  width: 90rem !important;
  flex: none !important;
}

.textleft {
  text-align: left !important;
}

.graph_left {
  padding-right: 5px;
  text-align: left !important;
}

/***********************************************
 ** 버튼
 ***********************************************/
/* .btn {
  border-radius: 0;
  padding: 5px 12px 4px;
  user-select: none;
  -webkit-user-select: none;
}

.btn-th {
  border-radius: 0;
  padding: 0px 5px 5px !important;
  width: 37px;
  font-size: 11px !important;
  height: 27px !important;
  line-height: 25px !important;
}

.btn-lg {
  padding: 9px 16px 8px 16px !important;
  font-size: 13px;
  line-height: 1.3333333;
  border-radius: 0;
}

.btn-sm {
  padding: 2px 5px 3px;
  font-size: 11px;
  line-height: 1.5;
  border-radius: 0;
}

.btn-sml {
  padding: 5px 5px 6px;
  font-size: 11px;
  line-height: 1.5;
  border-radius: 0;
} */

/*회색버튼*/
.btn-gray {
  background-color: #666;
  color: #ffffff;
  border: 1px solid #666 !important;
}

.btn-gray:hover,
.btn-gray:focus {
  background-color: #999999;
  background-position: 0 -15px;
  border-color: #888888;
  color: #ffffff;
}

.btn-gray:active,
.btn-gray.active {
  background-color: #999999;
  border-color: #888888;
  color: #ffffff;
}

/* 하얀색 버튼 */
.btn-white {
  background-image: none;
  background-color: #ffffff !important;
  text-shadow: none;
  color: #444444;
  border-color: #cccccc;
}

.btn-none {
  border-radius: 0;
  height: 36px !important;
  padding: 12px 12px;
  border: 1px solid #666666 !important;
  font-weight: bold !important;
}

.btn-snone {
  border-radius: 0;
  height: 20px !important;
  color: #fa2828 !important;
  border: 1px solid #fa2828 !important;
  font-size: 11px !important;
}

/* 검정색 버튼 */
.btn-black {
  background-image: none;
  background-color: #222;
  text-shadow: none;
  color: #ffffff;
  border-color: #222;
}

.btn-black:hover,
.btn-black:focus {
  background-color: #222;
  border-color: #222;
  color: #ffffff;
}

.btn-black:active,
.btn-black.active {
  background-color: #222;
  border-color: #222;
  color: #ffffff;
}

/* 검정색 버튼 */

/* 빨간색 버튼 */
.btn-red {
  background-image: none;
  background-color: var(--global-primary-color);
  text-shadow: none;
  color: #ffffff;
  border-color: var(--global-primary-color);
}

.btn-red:hover,
.btn-red:focus {
  background-color: var(--global-primary-color);
  background-position: 0 -15px;
  border-color: var(--global-primary-color);
  color: #ffffff;
}

.btn-red:active,
.btn-red.active {
  background-color: var(--global-primary-color);
  border-color: var(--global-primary-color);
  color: #ffffff;
}

.btn-icon {
  background-image: none;
  background-color: #ffffff !important;
  text-shadow: none;
  color: #444444;
  border-color: #cccccc;
  -webkit-transition: border-color 0.2s ease;
  -moz-transition: border-color 0.2s ease;
  -o-transition: border-color 0.2s ease;
  -ms-transition: border-color 0.2s ease;
  transition: border-color 0.2s ease;
}

.btn-icon:hover,
.btn-icon:focus {
  background-color: #ffffff;
  border-color: #666666;
  color: #444444;
}

.btn-icon:active,
.btn-icon.active {
  background-color: #ffffff;
  border-color: #666666;
  color: #444444;
  font-weight: bold;
}

.btn-icon-excel {
  background: #fff url(/skin/img/excelicon.gif) no-repeat 5px 50%;
  padding-left: 32px;
}

/* .btn-icon-excel:focus,
.btn-icon-excel:hover {
  background: url(/skin/img/excelicon_on.gif) no-repeat 10px 50%;
  font-weight: normal;
} */

.cal_ico {
  display: inline-block;
  width: 25px;
  height: 25px;
  border: solid 1px #dcdcdc;
  margin-left: -1px;
  background-color: #dcdcdc;
  background-position: 0 0;
  background: url(img/cal_ico2.png) no-repeat;
  vertical-align: middle;
}

.index_layout {
  width: 100%;
}

.index_top {
  width: 100%;
}

.index_top ul {
  width: 100%;
  overflow: hidden;
}

.index_top ul li {
  float: left;
  width: 25%;
  padding-right: 10px;
}

.martop20 {
  margin-top: 20px;
}

/***********************************************
 ** 페이지 네비게이션
 ***********************************************/
.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 0;
  margin: 0 0 10px;
  border-radius: 0;
}

.pagination>li {
  display: inline;
}

.pagination>li:not(:last-child) {
  margin-right: 10px;
}

.pagination>li>a,
.pagination>li>span {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  line-height: 30px;
  border-radius: 3px;
  border: 1px solid #ddd !important;
  text-align: center;
  color: #222;
  font-size: 14px;
  letter-spacing: -1px;
  background-color: #fff !important;
}

.pagination>li.active a {
  background-color: var(--global-primary-color) !important;
  color: #fff;
}

.pagination>li img {
  height: 70%;
  flex: none;
}

/* 라디오버튼, 체크박스 */
.checkbox-inline,
.radio-inline {
  padding-left: 0;
  cursor: default;
}

.radio-inline span,
.checkbox-inline span {
  padding-left: 5px;
}

.item-form-container .radio-inline span,
.item-form-container .checkbox-inline span {
  padding-left: 0;
}

.checkbox-inline label {
  cursor: pointer;
}

.checkbox-inline label span {
  padding-left: 15px !important;
}

.checkbox-inline label+label {
  margin-left: 15px;
}

/***********************************************
 ** 테이블
 ***********************************************/
.table,
.cols_tbl,
.column-table,
.list-table,
.row_tbl {
  width: 100%;
  margin: 0;
}

.list-table tr>td,
.list-table tr>th,
.row_tbl tr>td,
.row_tbl tr>th {
  font-size: 1.4rem;
  font-weight: normal;
  color: #333;
  letter-spacing: -0.05rem;
  vertical-align: middle;
  border-bottom: .1rem solid #eee;
}

.list-table tr>th,
.row_tbl tr>th {
  padding: 2rem .8rem;
  font-weight: 500;
}

.list-table tr>td,
.row_tbl tr>td {
  padding: 1.5rem .8rem;
  line-height: 1.4;
}

.list-table tr>th.center,
.list-table tr>td.center,
.row_tbl tr>th.center,
.row_tbl tr>td.center {
  text-align: center;
}

.list-table tr>th.right,
.list-table tr>td.right,
.row_tbl tr>th.right,
.row_tbl tr>td.right {
  text-align: right;
}

.list-table .thumb,
.row_tbl .thumb {
  display: block;
  width: 7rem;
  height: 7rem;
  border-radius: .5rem;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin: 0 auto;
}

.list-table .thumb img,
.row_tbl .thumb img {
  width: 100%;
  height: 100%;
}

.list-table .no-data::before {
  width: 5.5rem;
  height: 5.5rem;
}

.list-table .no-data {
  color: #b2b2b2;
  padding-bottom: 2rem;
}

.table,
.cols_tbl,
.column-table {
  font-size: 1.5rem;
}

.column-table.search-table {
  width: 110rem;
}

.table tr>th,
.table tr>td,
.cols_tbl tr>th,
.cols_tbl tr>td,
.column-table tr>th,
.column-table tr>td {
  padding: .8rem 0;
  vertical-align: middle;
}

.table tr>th:not(:nth-child(1)),
.cols_tbl tr>th:not(:nth-child(1)),
.column-table.search-table tr>th:not(:nth-child(1)) {
  padding-left: 2rem;
}

.table tr>th:nth-child(1),
.cols_tbl tr>th:nth-child(1),
.column-table.form-table tr>th:nth-child(1) {
  padding-left: 2rem;
}

.table tbody>tr>th,
.cols_tbl tbody>tr>th,
.column-table tbody>tr>th {
  font-size: 1.5rem;
  letter-spacing: -0.1rem;
  font-weight: 500;
}

.column-table tr>td+th {
  padding-left: 2rem;
}

.column-table.search-table .select-input input {
  flex: 1;
}

.cols_tbl>tbody>tr>td label {
  margin-top: 0rem;
  vertical-align: middle;
  padding-left: 0rem;
  padding-right: 1rem;
  line-height: 2.5rem;
}

.cols_tbl>tbody>tr>th.th,
.cols_tbl>tbody>tr>td.th {
  padding: 0;
}

.cols_tbl>thead>tr>th.text-left {
  text-align: left;
}

.cols_tbl>tbody>tr>th {
  /* background-color: #f6f6f6; */
  color: #666;
  line-height: 2.5rem;
  letter-spacing: -0.1rem;
  height: 4.3rem;
  vertical-align: middle;
}

.cols_tbl>tbody>tr>td label {
  margin: 0;
  vertical-align: middle;
}

.cols_tbl input[type="checkbox"],
.cols_tbl input[type="radio"] {
  position: static;
  margin: 0 .5rem 0 0;
}

.cols_tbl>thead>tr>td,
.cols_tbl>tbody>tr>td {
  padding: .8rem 1.5rem;
  font-size: 1.2rem;
  height: 4.3rem;
}


/* 넓이 */
.width102p {
  width: 102% !important;
}

.width100p {
  width: 100% !important;
}

.width98p {
  width: 98% !important;
}

.width90p {
  width: 90% !important;
}

.width80p {
  width: 80% !important;
}

.width75p {
  width: 75% !important;
}

.width70p {
  width: 70% !important;
}

.width62p {
  width: 62% !important;
}

.width60p {
  width: 60% !important;
}

.width50p {
  width: 50% !important;
}

.width49p {
  width: 49% !important;
}

.width40p {
  width: 40% !important;
}

.width30p {
  width: 30% !important;
}

.width20p {
  width: 20% !important;
}

.width15p {
  width: 15% !important;
}

.width12p {
  width: 12% !important;
}

.width10p {
  width: 10% !important;
}

.width8p {
  width: 8% !important;
}

.width7p {
  width: 7% !important;
}

.width6p {
  width: 6% !important;
}

.width5p {
  width: 5% !important;
}

.width3p {
  width: 3% !important;
}

.width2p {
  width: 2% !important;
}

.width-4xs {
  width: 30px !important;
}

.width-3xs {
  width: 60px !important;
}

.width-2xs {
  width: 70px !important;
}

.width-xs {
  width: 100px !important;
}

.width-sm {
  width: 130px !important;
}

.width-md {
  width: 150px !important;
}

.width-lg {
  width: 200px !important;
}

.width-xl {
  width: 250px !important;
}

.width-2xl {
  width: 400px !important;
}

.width-3xl {
  width: 600px !important;
}

/***********************************************
 ** 폼 컨트롤
 ***********************************************/
.form-inline {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.form-inline.between {
  justify-content: space-between;
}

.form-inline.center {
  justify-content: center;
}

.form-inline .input-suffix {
  flex: none;
}

/* 

.form-control {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  height: 25px;
  padding: 4px 5px;
  border: 1px solid #d5d5d5;
  font-weight: normal;
  font-size: 12px;
}

input.form-control {
  height: 25px;
  padding-top: 0;
  padding-bottom: 1px;
  font-size: 12px;
}

.form-inline .form-control {
  display: inline-block;
  width: auto;
  vertical-align: middle;
} */


.title_tbl {
  margin: 0 0 10px;
  color: #333;
  font-size: 16px;
  font-weight: bold;
}

.ofw {
  overflow: hidden;
  margin-bottom: 10px;
}

.flol {
  float: left;
}

.flor {
  float: right;
}

.table_btn {
  /* margin-bottom: 30px; */
  text-align: center;
}

.bottom_btn {
  /* background-color: #fafafa; */
  padding: 10px;
  /* border-bottom: solid 2px #dcdcdc; */
  margin-bottom: 15px;
  text-align: center;
}

.bor5 {
  /* border: solid 5px #dcdcdc; */
  padding: 20px;
}



.bootstrap-dialog .bootstrap-dialog-title {
  color: #222;
  display: inline-block;
  font-size: 19px;
  font-weight: 500;
}

.bootstrap-dialog .bootstrap-dialog-message {
  font-size: 12px;
}

.bootstrap-dialog .bootstrap-dialog-button-icon {
  margin-right: 3px;
}

.bootstrap-dialog .bootstrap-dialog-close-button {
  font-size: 20px;
  float: right;
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  opacity: 0.9;
  margin-top: 3px;
}

.bootstrap-dialog .bootstrap-dialog-close-button:hover {
  cursor: pointer;
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.bootstrap-dialog.type-default .modal-header {
  background-color: #fff;
}

.bootstrap-dialog.type-default .bootstrap-dialog-title {
  color: #333;
}

.bootstrap-dialog.type-info .modal-header {
  background-color: #fff;
  /*background-color: #5bc0de;*/
}

.bootstrap-dialog.type-primary .modal-header {
  background-color: #fff;
  /*background-color: #428bca;*/
}

.bootstrap-dialog.type-success .modal-header {
  background-color: #fff;
  /*background-color: #5cb85c;*/
}

.bootstrap-dialog.type-warning .modal-header {
  background-color: #fff;
  /*background-color: #f0ad4e;*/
}

.bootstrap-dialog.type-danger .modal-header {
  background-color: #fff;
  /*background-color: #d9534f;*/
}

.bootstrap-dialog.size-large .bootstrap-dialog-title {
  font-size: 24px;
}

.bootstrap-dialog.size-large .bootstrap-dialog-close-button {
  font-size: 30px;
}

.bootstrap-dialog.size-large .bootstrap-dialog-message {
  font-size: 18px;
}

.line50 {
  display: block;
  line-height: 18px;
  margin: 10px 0px;
  font-weight: normal;
  color: #666;
  font-size: 14px !important;
}

.notice_red {
  color: var(--global-primary-color);
  letter-spacing: -0.1rem;
  padding: .5rem;
  font-size: 1.4rem;
  line-height: 1.5;
}

.notice_gray {
  color: #666;
  letter-spacing: -1px;
  font-weight: normal;
  padding: 5px;
}

.mar5 {
  margin: 5px;
}

.marb5 {
  margin-bottom: 5px;
}

.mar-left150 {
  margin-left: 150px;
}




/* index.php Style */
.report-wrap {
  display: flex;
}

.report-wrap:not(:first-child) {
  margin-top: 20px;
}

.report-wrap:not(:first-child) .report-container {
  min-height: 300px;
}

.report-wrap .report-container {
  border-radius: 5px;
  flex: 1;
  padding: 15px;
  background-color: #fff;
}

.report-wrap.has-three-container .report-container {
  width: 33.33333%;
}

.report-wrap .report-container+.report-container {
  margin-left: 20px;
}

.report-wrap .report-container>.title {
  font-size: 18px;
  font-weight: 500;
  color: #222;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  letter-spacing: -0.5px;
  margin-bottom: 30px;
}

.report-wrap .report-container>.title span {
  margin-right: 30px;
}

.report-wrap .order-summary,
.report-wrap .member-summary {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.report-wrap .member-summary li {
  width: 20%;
}

.report-wrap .order-summary li {
  width: 10%;
  cursor: pointer;
}

.report-wrap .member-summary .order-count,
.report-wrap .order-summary .order-count {
  position: relative;
  width: 70%;
  background-color: #f2f2f2;
  border-radius: 100px;
  margin: 0 auto 20px auto;
  /* cursor: pointer; */
}

.report-wrap .member-summary .order-count {
  background-color: #fff;
}

.report-wrap .member-summary .order-count::after,
.report-wrap .order-summary .order-count::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

.report-wrap .member-summary .order-count span,
.report-wrap .order-summary .order-count span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 24px;
}

.report-wrap .member-summary li p,
.report-wrap .order-summary li p {
  text-align: center;
  font-size: 17px;
  color: #333;
}

.index-wrap .product-count {
  display: flex;
  flex-wrap: wrap;
}

.index-wrap .product-count li {
  width: 33.33333%;
  flex: none;
  text-align: center;
}

.index-wrap .product-count li:nth-child(n + 4) {
  margin-top: 45px;
}

.index-wrap .product-count li .title {
  font-size: 16px;
  letter-spacing: -0.5px;
  margin-bottom: 20px;
}

.index-wrap .product-count li .count {
  font-size: 25px;
  cursor: pointer;
}

.index-wrap .order-list table {
  width: 100%;
  text-align: left;
}

.index-wrap .order-list table th {
  font-weight: normal;
  padding: 8px 5px;
  text-align: left;
}

.index-wrap .order-list table td {
  padding: 10px 5px;
}

.index-wrap .notice-list {
  min-height: 150px;
}

.index-wrap .qna-list li,
.index-wrap .notice-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  overflow: hidden;
  width: 100%;
}

.index-wrap .qna-list li a,
.index-wrap .notice-list li a {
  display: block;
  max-width: 70%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.index-wrap .qna-list li a .date {
  flex: none;
  margin-left: auto;
}

.index-wrap .more-btn {
  margin-left: auto;
}

/* index.php Style End */

/* item_qna_form.php / item_star_form.php Style */
.qna-list-wrap li {
  display: flex;
  align-items: flex-start;
}

.qna-list-wrap li .thumb {
  display: block;
  width: 7rem;
  flex: none;
  margin-right: 1rem;
  border-radius: 1rem;
}

.qna-list-wrap li .thumb::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.qna-list-wrap li .qna-info {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.qna-list-wrap li .qna-info h3 {
  font-weight: normal;
}

.qna-list-wrap li .qna-info .date {
  font-size: 14px;
  letter-spacing: -1px;
  color: #666;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.qna-list-wrap li .qna-info .answer-state {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  letter-spacing: -1px;
}

.qna-list-wrap li .qna-info .answer-state>span.ready {
  color: var(--global-primary-color);
}

.qna-form-wrap .qna-form-list {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.qna-form-list.flex-column {
  display: block;
  /* align-items: flex-start; */
}

.qna-form-list.flex-column .content {
  margin-top: 1.5rem;
  min-height: 10rem;
}

.qna-form-wrap .qna-form-list h4 {
  font-size: 15px;
  letter-spacing: -1px;
  flex: none;
  min-width: 150px;
}

.qna-form-wrap .qna-form-list .content {
  flex: 1;
  line-height: 1.4;
}

.qna-form-wrap .qna-form-list .content.member-info a {
  display: flex;
}

.qna-form-wrap .qna-form-list .content.member-info a span {
  padding-right: 15px;
}

.qna-form-wrap .qna-form-list .content.member-info a br {
  display: none;
}

.review-img-wrap {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.review-img-wrap a {
  display: block;
  width: 80px;
  border-radius: 5px;
  margin-right: 10px;
}

.review-img-wrap a:last-child {
  margin-right: 0;
}

.review-img-wrap a::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

.review-img-wrap {
  margin-bottom: 20px;
  padding-left: 150px;
}

/* item_qna_form.php / item_star_form.php Style End */

/* setting.php Style */
.setting-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.setting-wrap li {
  display: flex;
  align-items: center;
  font-size: 15px;
  color: #222;
  flex: none;
  width: 50%;
  min-height: 45px;
  padding: 10px 0;
}

.setting-wrap li .setting-label {
  font-weight: 500;
  flex: none;
  width: 120px;
  margin-right: 10px;
  letter-spacing: -1px;
  /* font-size: 16px; */
}

.setting-wrap li .inner {
  flex: 1;
  max-width: 60%;
}

.setting-wrap li .qna-btn {
  margin-left: 10px;
}

.setting-wrap li .setting-flex {
  display: flex;
  align-items: center;
}

.setting-wrap li .setting-flex input+input {
  margin-left: 10px;
}

.setting-wrap li .setting-flex input:first-child {
  flex: none;
  width: 75%;
}

.p_msg {
  font-size: 14px;
  letter-spacing: -1px;
  line-height: 1.45;
}

.p_msg.p_msg_success {
  color: #006bbd !important;
  padding-left: 15px;
  padding-top: 5px;
  display: block;
}

.p_msg,
.p_msg_error {
  color: var(--global-primary-color) !important;
  display: block !important;
  font-size: 13px !important;
  margin: 0 !important;
  padding: 5px 15px !important;
}

/* setting.php Style End */

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  background-color: #fff;
}


/* List Table Style (New) */
.data-list-wrap {
  padding: 2rem;
  background-color: #fff;
  border-radius: .5rem;
  position: relative;
  min-height: 45rem;
  /* padding-bottom: 6rem; */
}


.data-list-wrap.has-btn .btn-wrap>* {
  max-width: 30rem;
  flex: none;
}

.data-list-wrap .table_btn {
  margin-top: 1rem;
  /* position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%); */
}

.data-list-wrap .pagination {
  margin: 0 !important;
}


.copy-btn,
.edit-btn,
.print-btn,
.del-btn,
.sms-btn,
.caption-btn,
.item-btn {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: .3rem;
  background-color: #222;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: center;
}

.copy-btn {
  background-image: url(/skin/img/ic-copy.png);
  background-size: 60%;
}

.edit-btn {
  background-image: url(/skin/img/ic-edit.png);
  background-size: 50%;
}

.print-btn {
  background-image: url(/skin/img/ic-print.svg);
  background-size: 60%;
}

.del-btn {
  background-color: var(--global-primary-color);
  background-image: url(/skin/img/ic-delete-white.svg);
  background-size: 60%;
}

.del-btn.white {
  background-color: #fff;
  background-image: url(/skin/img/ic-delete-color.svg);
  background-size: 80%;
}

.sms-btn {
  background-color: var(--global-primary-color);
  background-image: url(/skin/img/ic-chat-w.svg);
  background-size: 60%;
}

.caption-btn {
  background-image: url(/skin/img/ic-trans.svg);
  background-size: 50%;
}

.item-btn {
  background-image: url(/skin/img/m/ic-stick-w.svg);
  background-size: 65%;
}

.edit-btn.has-caption,
.caption-btn.has-caption {
  background-color: var(--global-primary-color);
}

.sms-btn.active,
.item-btn.active {
  background-color: var(--global-primary-color) !important;
}


.add-list-btn {
  display: block;
  width: 4rem;
  height: 4rem;
  border-radius: .8rem;
  background: var(--global-primary-color) url(/skin/img/ic-plus-w.svg) center / 45% no-repeat;
}




/* List Table Style (New) End */

/* Form Style */


.form-wrap {
  padding: 2rem;
  background-color: #fff;
  border-radius: .5rem;
}

.form-wrap+.form-wrap {
  margin-top: 25px;
}

.form-wrap .form-table {
  width: 100%;
}

.form-wrap .form-table th {
  font-size: 15px;
  font-weight: 500;
  color: #222;
  letter-spacing: -0.5px;
  vertical-align: middle;
}

.form-wrap .form-table td {
  padding: 10px 5px;
  vertical-align: middle;
}

.form-wrap .form-table .checkbox-inline label,
.form-wrap .form-table .radio-inline {
  /* min-width: 100px; */
  padding-right: 15px;
  height: 35px;
}

@media (max-width: 1444px) {
  .column-table.search-table {
    width: 100%;
  }

  .list-title li.thumb,
  .list-item>div.thumb,
  div.thumb a {
    width: 70px;
    flex: none;
    padding-left: 0;
    padding-right: 0;
  }
}

@media (min-width: 761px) {

  /* PC */
  .mobile {
    display: none !important;
  }

  .join-form ul.form-list li .inner input {
    border-radius: 5px 0 0 5px;
    border-right: none;
  }

  .join-form ul.form-list li .inner button {
    height: 45px !important;
    flex: none !important;
    display: block;
    border-radius: 0 5px 5px 0;
  }

  /* .fas::before {
    display: none !important;
  } */
}

/* @media (min-width: 1600px) {
  section {
    padding-right: 200px;
  }
} */

.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"],
.radio input[type="radio"],
.radio-inline input[type="radio"] {
  position: relative;
}


/* tail.php */
footer {
  /* admin footer */
  padding: 2.5rem 1.5rem 2.5rem 22.5rem;
}

footer>img {
  height: 2rem;
  display: block;
  margin: 0 auto;
}

.footer {
  background-color: #fff;
  padding: 0px 0px 0px 20rem;
}

.footer .inner {
  margin: 0 auto;
  width: 100%;
}

.footer .footer-logo {
  color: #b2b2b2;
  font-size: 3rem;
  font-weight: 500;
  flex: none;
  line-height: 1.1;
  margin-right: 4rem;
  width: 15rem;
}

.footer .footer-logo img {
  width: auto;
  height: 2.5rem;
}

.footer .agree-wrap {
  position: relative;
  margin-bottom: 2.5rem;
  border-bottom: .1rem solid #e5e5e5;
  border-top: .1rem solid #e5e5e5;
  z-index: 10;
}

.footer .agree-wrap .inner {
  display: flex;
  align-items: center;
  height: 4.7rem;
}

.footer .agree-wrap a {
  line-height: 1;
  display: inline-block;
  position: relative;
  font-size: 1.4rem;
  color: #7d7e80;
  cursor: pointer;
  font-weight: normal;
  letter-spacing: -0.1rem;
}

.footer .agree-wrap .line {
  display: inline-block;
  width: .1rem;
  height: 1.2rem;
  margin-top: .3rem;
  background: #DCDCDC;
  margin: 0 1rem;
}

.footer .company-wrap {
  padding: 3rem 0rem;
}

.footer .company-wrap .inner {
  display: flex;
}

.footer .company-info {
  display: block;
  line-height: 1.8rem;
  font-size: 1.3rem;
  color: #7d7e80
}

.footer .company-info a {
  color: #7d7e80;
  text-decoration: underline;
}

.footer .copyright {
  line-height: 2.4rem;
  font-size: 1.2rem;
  color: #7d7e80;
}

.scroll {
  overflow-y: scroll;
}

textarea::-webkit-scrollbar {
  width: .5rem;
}

textarea::-webkit-scrollbar-thumb {
  background-color: #ddd;
  opacity: 0.7;
  border-radius: 5rem;
}

/* 
.scroll::-webkit-scrollbar {
  width: 5px;
}

.scroll::-webkit-scrollbar-thumb {
  background-color: #ddd;
  opacity: 0.7;
  border-radius: 50px;
}

.scroll-hide {
  overflow-y: scroll;
}

.scroll-hide::-webkit-scrollbar {
  display: none;
} */

input[type="text"].disable-auto-fill,
input[type="password"].disable-auto-fill {
  border: none !important;
  width: 0px !important;
  opacity: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  flex: none !important;
  max-width: 0 !important;
  min-width: 0 !important;
  max-height: 0 !important;
  min-height: 0 !important;
  line-height: 1 !important;
}

/* 리스트 검색 영역 */
.select-button,
.select-input-button,
.select-input,
.input-input,
.input-button,
.input-select,
.flex-wrap,
.range-picker {
  display: flex;
  align-items: center;
}

.flex-wrap.between {
  justify-content: space-between;
}

.flex-wrap.center {
  justify-content: center;
}

.flex-wrap .flex1 {
  flex: 1;
}

.select-button select,
.select-input-button select,
.select-input select,
.input-input input[type="text"],
.input-button input[type="text"],
.input-select input[type="text"] {
  flex: none;
  height: 34px !important;
  border-radius: 4px 0 0 4px !important;
  border-color: #ddd;
  border-right: none;
}

.select-button select,
.select-input select {
  width: 100px;
}

.input-select select,
.select-input input,
.select-button button,
.select-button input[type="button"],
.select-button input[type="submit"],
.select-button a,
.select-input-button button,
.select-input-button input[type="button"],
.select-input-button input[type="submit"],
.select-input-button a,
.input-button button,
.input-button input[type="button"],
.input-button input[type="submit"],
.input-button a {
  flex: none;
  height: 34px !important;
  border-radius: 0 4px 4px 0 !important;
}

.multi-select {
  display: flex;
  align-items: center;
}

.multi-select select {
  flex: none;
  height: 34px !important;
  border-radius: 4px;
  border: 1px solid #ddd;
}

.multi-select select:first-child:not(:last-child) {
  border-radius: 4px 0 0 4px;
}

.multi-select select+select {
  border-left: none;
}

.multi-select select:last-child:not(:first-child) {
  border-radius: 0 4px 4px 0;
}

.input-input input+input {
  border-radius: 0 4px 4px 0;
  border-right: 1px solid #ddd;
}

.select-input-button>* {
  height: 35px !important;
  border-color: #ddd !important;
}

.select-input-button select {
  border-right: none !important;
  border-radius: 5px 0 0 5px;
}

.select-input-button input[type="text"] {
  border-radius: 0 !important;
}

.select-input-button button,
.select-input-button input[type="button"] {
  border-radius: 0 5px 5px 0 !important;
  border-left: none !important;
}

.checkbox-inline,
.checkbox-inline label,
.radio-inline,
.radio-inline label {
  display: flex;
  align-items: center;
  min-height: 34px;
  cursor: pointer;
}

.checkbox-inline input[type="checkbox"],
.radio-inline input[type="radio"] {
  position: relative;
  margin-right: 4px !important;
}

span+.input-suffix {
  margin-left: 5px;
}

.input-suffix+span {
  margin-left: 5px;
}

.form-inline>select+select,
.form-inline>select+input,
.form-inline>input+input,
.form-inline>input+select {
  margin-left: 10px;
}

.checkbox-wrap,
.checkbox-wrap label {
  display: flex;
  align-items: center;
  height: 3.4rem;
  font-size: 1.5rem;
  /* line-height: 1; */
}

.checkbox-wrap input[type="checkbox"] {
  margin-right: 6px !important;
}

/* List Table Style (New) */



/* media Style */

/* 이미지 사이즈표 */
/* skin/css에도 적용 */
.clothes-size-wrap {
  width: 100%;
  height: auto;
  position: relative;
  font-size: 0.85em;
  flex: none;
  overflow: hidden;
  -ms-user-select: none;
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

.clothes-size-wrap img {
  width: 100%;
  -webkit-user-drag: none;
}

.clothes-size-wrap span {
  position: absolute;
  z-index: 50;
  left: -10%;
  top: -10%;
}

.clothes-size-table {
  width: 900px;
}

.clothes-size-table th,
.clothes-size-table td {
  padding: 10px 10px 10px 20px;
  text-align: left;
  border: 1px solid #f2f2f2;
  color: #333;
  font-weight: normal;
}

.clothes-size-table tr:not(:last-child) th,
.clothes-size-table tr:not(:last-child) td {
  border-bottom: none;
}

.clothes-size-table th {
  background-color: #f9f9f9;
  border-right: none;
}

.clothes-size-table .radio-inline label {
  min-width: 110px;
  min-height: 0;
}

/* skin/css에도 적용 */
/* 이미지 사이즈표 */

/* yt Style */
.keyword-wrap {
  width: 90%;
  margin-top: 10px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  /* overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; */
}

.keyword-wrap a {
  flex: none;
  font-size: 13px;
  padding: 3px;
  background-color: var(--global-sub-color);
  color: var(--global-primary-color);
  border-radius: 3px;
  margin-top: 4px;
  margin-right: 4px;
  cursor: pointer;
}

.keyword-wrap a.more-keyword {
  color: #fff;
  font-size: 12px;
  background-color: var(--global-primary-color);
}

/* caption_form.php Style */
.video-form-wrap {
  width: 100%;
  height: 100%;
  display: flex;
}

.video-form-wrap .inner {
  flex: 1;
  min-height: 30rem;
  background-color: #fff;
  border-radius: .5rem;
  padding: 1.5rem;
  height: 100%;
  margin-left: 2.5rem;
  width: calc(100% - 57.5rem);
}

.video-form-wrap .caption-wrap {
  padding-bottom: 6.2rem;
  position: relative;
}

.video-form-wrap .caption-wrap .btn-wrap {
  margin-top: 0;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 1.6rem;
}

.video-form-wrap #appendWrap {
  height: calc(100% - 9.8rem);
  /* padding-top: 6.2rem; */
  overflow-y: scroll;
  /* position: relative; */
}

.video-form-wrap #appendWrap::-webkit-scrollbar {
  width: .5rem;
}

.video-form-wrap #appendWrap::-webkit-scrollbar-thumb {
  background-color: #ddd;
  opacity: 0.7;
  border-radius: 5rem;
}

.video-form-wrap .caption-lang-tab {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  /* position: absolute;
  left: 0;
  top: 0; */
  background-color: #fff;
  width: 100%;
}

.video-form-wrap .caption-lang-tab li {
  font-size: 1.6rem;
  color: #b2b2b2;
  letter-spacing: -0.1rem;
  width: 33.333333%;
  text-align: center;
  padding: .5rem 0 2rem 0;
  cursor: pointer;
  border-bottom: .1rem solid #f2f2f2;
}

.video-form-wrap .caption-lang-tab li.active {
  color: #222;
  position: relative;
  font-weight: 500;
}

.video-form-wrap .caption-lang-tab li.active::after {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  width: 100%;
  height: .2rem;
  background-color: #222;
}

.video-form-wrap .inner.yt-wrap {
  width: 55rem;
  flex: none;
  margin-left: 0;
  position: relative;
  overflow-y: scroll;
  /* padding-bottom: 6.7rem; */
}

/* .table-scroll-wrap::-webkit-scrollbar,
.video-form-wrap .vd-description::-webkit-scrollbar,
.video-form-wrap .inner.yt-wrap::-webkit-scrollbar {
  width: .5rem;
}

.table-scroll-wrap::-webkit-scrollbar-thumb,
.video-form-wrap .vd-description::-webkit-scrollbar-thumb,
.video-form-wrap .inner.yt-wrap::-webkit-scrollbar-thumb {
  background-color: #ddd;
  opacity: 0.7;
  border-radius: 5rem;
} */

.video-form-wrap .vd-description {
  height: calc(100% - 37rem);
  overflow-y: scroll;
  margin-top: 1rem;
  line-height: 1.35;
  letter-spacing: -0.05rem;
}

.video-form-wrap .vd-description>div {
  text-align: right;
  margin-bottom: 1rem;
  padding: 0 1rem;
}

.yt-wrap .player-wrap {
  width: 100%;
  position: relative;
  min-height: 36rem;
}

.yt-wrap .player-wrap iframe {
  width: 100%;
}

.yt-wrap .player-wrap.ready::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-color: rgba(255, 255, 255, 0.7);
}

.yt-wrap .player-wrap.ready::after {
  display: block;
  content: "";
  border: .6rem solid #fff;
  border-top: .6rem solid var(--global-primary-color);
  border-radius: 50%;
  width: 5rem;
  height: 5rem;
  animation: spin 1s linear infinite;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 15;
}

.yt-wrap .video-form {
  margin-left: 1.5rem;
  flex: 1;
}

.yt-wrap .flex-wrap {
  display: flex;
  align-items: center;
}

.video-title-config li,
.video-lang-config {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 3.5rem;
}

.video-title-config li:first-child {
  line-height: 1.4;
  height: auto;
}

.video-title-config li+li {
  margin-top: 1rem;
}

.video-title-config li .lang {
  line-height: 3.5rem;
  border: .1rem solid #ddd;
  padding: 0 1rem;
  width: 7.6rem !important;
}

.video-title-config li .lang,
.video-lang-config select {
  height: 100%;
  width: 10rem;
  border-radius: .5rem 0 0 .5rem;
  border-right: none;
  flex: none;
}

.video-title-config li input {
  border-radius: 0 .5rem .5rem 0;
  height: 100%;
  flex: 1;
}

.video-title-config li button,
.video-lang-config button {
  border-radius: 0 .5rem .5rem 0;
  height: 100%;
  border-color: #222;
  background-color: #222;
  border-left: none;
  min-width: 6rem;
  flex: none;
  color: #fff;
}

.video-lang-config {
  display: flex;
}

.yt-wrap .config-title .tip {
  font-size: 1.3rem;
  margin-right: auto;
  margin-left: 1rem;
  font-weight: normal;
  letter-spacing: -0.05rem;
  color: var(--global-primary-color);
}

.caption-config-wrap+.caption-config-wrap {
  margin-top: 1.5rem;
}

.add-line {
  display: flex;
  justify-content: space-between;
  /* justify-content: flex-end; */
  align-items: center;
  padding-bottom: 1rem;
}

.add-line>span {
  font-size: 1.4rem;
  letter-spacing: -0.05rem;
  color: var(--global-primary-color);
}

.add-line #captionSubmitBtn {
  height: 3.4rem !important;
  font-size: 1.4rem !important;
}

.add-line .search-input-button {
  margin-right: 1.5rem;
  /* margin-left: 2.6rem; */
  font-weight: normal;
}

.video-caption-table {
  width: 100%;
}

/* yt_video_upload.php style */
.yt-upload-wrap {
  padding: 2rem;
  padding-bottom: 7.7rem;
  background-color: #fff;
  border-radius: .5rem;
  position: relative;
  width: 100%;
  min-height: calc(100% - 18rem);
  position: relative;
}

.yt-upload-wrap .add-line {
  padding: 0 1rem 1rem 1rem;
  width: 50%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.yt-upload-table {
  width: 50%;
}

.yt-upload-table th {
  font-size: 1.5rem;
  font-weight: 500;
  color: #222;
  text-align: center;
}

.yt-upload-table th,
.yt-upload-table td {
  padding: .5rem 1rem;
  vertical-align: middle;
}

.yt-upload-table input:read-only {
  cursor: not-allowed;
}

.yt-upload-table .del-btn {
  height: 3.5rem;
  border-radius: .5rem;
  width: 100%;
}

.yt-upload-wrap .btn-wrap {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  margin: 0;
  transform: translateX(-50%);
}

/* yt_video_upload.php style End */

@keyframes tableFadeOut {
  from {
    display: table;
    opacity: 1;
  }

  to {
    display: none;
    opacity: 0;
  }
}

@keyframes tableFadeIn {
  from {
    display: none;
    opacity: 0;
  }

  to {
    display: table;
    opacity: 1;
  }
}

.video-caption-table th {
  font-weight: 500;
  color: #222;
  font-size: 1.4rem;
  padding: 1rem;
  letter-spacing: -0.05rem;
  text-align: center;
}

.video-caption-table td {
  padding: .5rem .5rem 2rem .5rem;
  vertical-align: bottom;
}

.video-caption-table .del-btn {
  min-width: 2.5rem;
  background-repeat: no-repeat;
  background-color: var(--global-primary-color);
  background-position: center;
  border-color: var(--global-primary-color);
  background-size: 70%;
  margin-bottom: 3.2rem;
}

.video-caption-table .ko-caption {
  font-size: 1.4rem;
  color: #222;
  letter-spacing: -0.05rem;
  margin-bottom: .5rem;
}

/* caption_form.php Style End */

/* yt_channel_form.php Style */
.channel-form-wrap {
  width: 100%;
}

.channel-form-wrap .profile-wrap {
  width: 100%;
  height: 25rem;
  background-color: #f2f2f2;
  background-position: center;
  background-size: 100%;
  position: relative;
  border-radius: .5rem;
  margin-bottom: 2.5rem;
  overflow: hidden;
}

.channel-form-wrap .profile-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}

.channel-form-wrap .profile-wrap::after {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 0;
}

.channel-form-wrap .profile-wrap p {
  font-weight: 500;
  color: #fff;
  text-align: center;
  letter-spacing: -0.05rem;
}

.channel-form-wrap .profile-wrap p.description {
  overflow-y: scroll;
  /* text-overflow: ellipsis;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  line-height: 1.4em;
  height: 4.2em;
   */
  line-height: 1.4;
  font-size: 1.4rem;
  max-height: 6rem;
}

/* .channel-form-wrap .profile-wrap p.description::-webkit-scrollbar {
  width: .5rem;
}

.channel-form-wrap .profile-wrap p.description::-webkit-scrollbar-thumb {
  background-color: #ddd;
  opacity: 0.7;
  border-radius: 5rem;
} */

.channel-form-wrap .profile {
  width: 7rem;
  height: 7rem;
  border-radius: 3.5rem;
  flex: none;
}

.channel-form-wrap .profile+p {
  margin: 1.5rem 0;
}

.channel-info-wrap {
  display: flex;
}

.channel-form-wrap .channel-info {
  width: 33.3333%;
  min-height: 30rem;
  flex: 1;
}

.channel-form-wrap .channel-info+.channel-info {
  margin-left: 2.5rem;
}

.channel-form-wrap .channel-info textarea {
  margin-top: 2.5rem;
  height: 30rem;
}

/* yt_channel_form.php Style End */
.scroll-style::-webkit-scrollbar {
  width: .5rem;
}

.scroll-style::-webkit-scrollbar-thumb {
  background-color: #ddd;
  opacity: 0.7;
  border-radius: 5rem;
}

.channel-dialog-wrap {
  padding: 2rem;
  width: 70rem;
  height: 80%;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 1rem;
  overflow: hidden;
}

.channel-dialog-title {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.7rem;
  font-weight: 500;
  position: relative;
  height: 3rem;
  margin-bottom: 1rem;
}

.channel-dialog-title button {
  position: absolute;
  right: 0;
  top: 0;
  padding: 0;
  margin: 0;
  min-width: 3rem;
  border: none;
  background-image: url(/skin/img/ic-cancel.png);
  background-size: 65%;
  background-repeat: no-repeat;
  background-position: center;
}

.channel-dialog-wrap .channel-profile-wrap {
  position: relative;
  width: 100%;
  height: 10rem;
  background-color: #f2f2f2;
  background-size: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  z-index: 1;
}

.channel-dialog-wrap .channel-profile-wrap::after {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 2;
}

.channel-dialog-wrap .channel-profile {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 6.5rem;
  height: 6.5rem;
  border-radius: 4rem;
  background-color: #fff;
  background-size: cover;
  z-index: 3;
}

.channel-video-wrap {
  height: calc(100% - 15rem);
  margin-top: 1rem;
  overflow-y: scroll;
  display: flex;
  flex-wrap: wrap;
}

.channel-video-wrap li:not(.empty-video) {
  flex: none;
  width: 33.3333%;
  padding: .8rem;
  height: auto;
  max-height: 19.4rem;
}

.channel-video-wrap .video-thumb {
  width: 100%;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: .5rem;
}

.channel-video-wrap .video-thumb::after {
  content: "";
  display: block;
  padding-bottom: 59%;
}

.channel-video-wrap li:not(.empty-video) p {
  margin: .8rem 0;
  color: #222;
  font-size: 1.5rem;
  letter-spacing: -0.05rem;
  font-weight: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 1.4em;
  height: 2.8em;
}

.channel-video-wrap li.empty-video {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.channel-video-wrap li.empty-video img {
  width: 7rem;
  margin-bottom: 2rem;
}

.channel-video-wrap li.empty-video p {
  font-size: 1.5rem;
  letter-spacing: -0.05rem;
  color: #666;
}

/* video form style */
.yt-url-wrap {
  position: relative;
  width: 60rem;
  display: flex;
  align-items: center;
  margin-bottom: 2.5rem;
}

.yt-url-wrap span {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 1.5rem;
}

.yt-url-wrap button {
  height: 4.5rem;
  border-radius: 0.8rem;
  margin-left: 1.5rem;
}

/* .yt-url-wrap input {
  border-radius: .5rem 0 0 .5rem;
  border-right: none;
  height: 3.7rem !important;
}

 */

.yt-thumb-wrap {
  display: flex;
  align-items: flex-start;
}

.yt-thumb {
  flex: none;
  width: 41.6rem;
  height: 20.8rem;
  background-color: #f7f7f7;
  border-radius: .5rem;
  color: #222;
  background-image: url(/skin/img/youtube.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 7.5rem;
  cursor: pointer;
}

.yt-channel-wrap {
  text-align: center;
  letter-spacing: -0.05rem;
  display: flex;
  margin-top: 1rem;
  align-items: center;
}

.yt-channel-wrap .yt-channel-profile {
  flex: none;
  min-width: 12rem;
  margin-right: 2rem;
}

.yt-channel-thumb-img {
  width: 6rem;
  height: 6rem;
  border-radius: 4rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  margin: 0 auto;
  background-color: #f2f2f2;
  background-image: url(/skin/img/ic-user.svg);
  background-size: 50%;
}

.yt-channel-title {
  min-height: 3rem;
  font-weight: 500;
  margin: 1rem 0;
  text-align: center;
}

.yt-channel-title.empty {
  background-color: #f7f7f7;
  border-radius: .3rem;
}

.yt-channel-desc {
  line-height: 1.4;
  text-align: left;
  font-size: 1.4rem;
  display: block;
  width: 100%;
  height: 9.8rem;
  overflow-y: scroll;
  overflow-x: hidden;
  white-space: pre;
}

.yt-channel-desc.empty {
  background-color: #f7f7f7;
  border-radius: .3rem;
}

/* .yt-channel-desc::-webkit-scrollbar {
  width: 5px;
}

.yt-channel-desc::-webkit-scrollbar-thumb {
  background-color: #ddd;
  opacity: 0.7;
  border-radius: 50px;
} */

.title-wrap input+textarea {
  margin: 10px 0;
  height: 150px;
}

.yt-info-form textarea {
  height: 250px;
}

/* .yt-info-form > div {
  width: 50%;
}
.yt-info-form > div + div {
  margin-left: 25px;
} */

.video-info-wrap {
  display: flex;
}

.video-info-wrap .channel-wrap {
  flex: none;
  width: 40rem;
}

.video-info-wrap .video-wrap {
  margin-right: 2.5rem;
}



/* 상품 이미지 등록 Style */
.item-form-container .form-title .tip {
  margin-right: auto;
  margin-left: 10px;
}

.item-form-container .form-title .tip {
  margin-right: auto;
  margin-left: 10px;
  font-size: 14px;
  letter-spacing: -0.5px;
  color: var(--global-primary-color);
  margin-top: 3px;
}

.img-list-wrap {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.img-list-wrap li {
  flex: none;
  width: 70px;
  height: 90px;
  margin: 0 12px 12px 0;
  position: relative;
  cursor: pointer;
  padding: 0;
  text-align: center;
}

.img-list-wrap li.select-img-btn label {
  display: block;
  width: 100%;
  background-image: url(/skin/img/ic-plus-gray.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 35%;
  cursor: pointer;
  background-color: #f2f2f2;
  border-radius: 5px;
}

.img-list-wrap li.select-img-btn label::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

.img-list-wrap li input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.img-list-wrap li .thumb {
  width: 100%;
  border-radius: 5px;
  cursor: pointer;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.img-list-wrap li .thumb::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

.img-list-wrap li .del-btn {
  right: -5px;
  top: -5px;
  width: 20px !important;
  height: 20px !important;
  border-radius: 15px;
  position: absolute;
  background: url(/skin/img/ic-round-x.png) no-repeat center / 100%;
}

/* 상품 이미지 등록 Style */


.form-inline .form-control {
  /* width: 100%; */
}



/* 리스트 아이콘 버튼 스타일 */
.icon-btn {
  display: block;
  min-width: 0;
  min-height: 0;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: .3rem;
  background-color: #222;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
}

.icon-btn span {
  display: none;
}

.icon-btn.copy {
  background-image: url(/skin/img/ic-copy.png);
  background-size: 60%;
}

.icon-btn.edit {
  background-image: url(/skin/img/ic-edit.png);
  background-size: 50%;
}

.icon-btn.print {
  background-image: url(/skin/img/ic-print.svg);
  background-size: 60%;
}

.icon-btn.del {
  background-color: var(--global-primary-color);
  border-color: var(--global-primary-color);
  background-image: url(/skin/img/ic-delete-white.svg);
  background-size: 60%;
}

.icon-btn.del.white {
  background-color: #fff;
  border-color: #fff;
  background-image: url(/skin/img/ic-delete-color.svg);
  background-size: 60%;
}

.icon-btn.sms {
  background-color: var(--global-primary-color);
  border-color: var(--global-primary-color);
  background-image: url(/skin/img/ic-chat-w.svg);
  background-size: 60%;
}

.icon-btn.payment {
  background-image: url(/skin/img/ic-coin.svg);
  background-size: 70%;
}

.icon-btn.memo {
  background-image: url(/skin/img/ic-chat-w.svg);
  background-size: 60%;
}

.icon-btn.mail {
  background-color: var(--global-primary-color);
  border-color: var(--global-primary-color);
  background-image: url(/skin/img/ic-mail-w.png);
  background-size: 60%;
}

.icon-btn.challenge {
  background-image: url(/skin/img/ic-challenge.svg);
  background-size: 60%;
}

.icon-btn.inbody {
  background-image: url(/skin/img/ic-inbody-w.svg);
  background-size: 70%;
}

.icon-btn.view {
  background-image: url(/skin/img/ic-eye.png);
  background-size: 70%;
}

.icon-btn.caption {
  background-image: url(/skin/img/ic-trans.svg);
  background-size: 50%;
}

.icon-btn.item {
  background-image: url(/skin/img/ic-link-tag-w.svg);
  background-size: 65%;
}

.icon-btn.change {
  background-image: url(/skin/img/m/ic-change.png);
  background-size: 65%;
}

.icon-btn.link {
  background-image: url(/skin/img/m/ic-link.svg);
  background-size: 55%;
}

.icon-btn.form {
  background-image: url(/skin/img/ic-link-form-w.svg);
  background-image: url(/skin/img/ic-print.svg);
  background-size: 60%;
}

.icon-btn.share {
  background-image: url(/skin/img/ic-share-w.svg);
  background-size: 55%;
}

.icon-btn.active {
  background-color: var(--global-primary-color) !important;
  border-color: var(--global-primary-color) !important;
}

.icon-btn.zzim {
  background: transparent url('/skin/img/zzim-off-dark.svg') center / 80% no-repeat !important;
  border: none;
}
.icon-btn.zzim.on {
  background: transparent url('/skin/img/zzim-on.svg') center / 80% no-repeat !important;
}

.icon-btn.best {
  background: transparent url('/skin/img/ic-best-off.svg') center / 80% no-repeat !important;
  border: none;
}
.icon-btn.best.on {
  background: transparent url('/skin/img/ic-best-on.svg') center / 80% no-repeat !important;
}

.form-dialog {
  width: 100%;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  min-height: 50px;
  z-index: 9999;
  padding-top: 90px;
  padding-bottom: 40px;
}

.form-dialog-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4rem;
  position: fixed;
  width: 100%;
  z-index: 99999;
  left: 0;
  top: 0;
  background-color: #fff;
  height: 80px;
}

.form-dialog-header .app-logo {
  display: block;
}

.form-dialog-header .app-logo img {
  height: 2.2rem;
}

.form-dialog-header .text-logo {
  height: 8rem;
  line-height: 8rem;
  font-size: 2.8rem;
  font-weight: 500;
  letter-spacing: -0.1rem;
  color: #222;
}

.form-dialog-header .close-btn {
  display: block;
  width: 6rem;
  height: 6rem;
  padding: 0;
  min-width: 0;
  border: none;
  background: url(/skin/img/ic-cancel.png) center / 40% no-repeat;
}

.form-dialog .title-img {
  display: block;
  margin: 0 auto;
}

.form-dialog .inbody-list {
  margin-top: 20px;
}

.form-dialog .inbody-list li {
  border-bottom: 1px solid #f2f2f2;
}

.form-dialog .inbody-list a {
  font-size: 19px;
  display: block;
  width: 100%;
  padding: 20px 15px;
  position: relative;
}

.form-dialog .inbody-list a::after {
  display: block;
  content: "";
  width: 12px;
  height: 12px;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%) rotate(45deg);
  border: 2px solid #b2b2b2;
  border-bottom: none;
  border-left: none;
}


.form-dialog .medical-list {
  margin-top: 20px;
}

.form-dialog .medical-list li:not(.no-data) {
  border-bottom: 1px solid #f2f2f2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

.form-dialog .medical-list a {
  font-size: 19px;
  display: block;
  width: 100%;
  padding: 20px 15px;
  padding-left: 0;
  position: relative;
}

.form-dialog .medical-list li .icon-btn {
  width: 34px;
  height: 34px;
  flex: none;
  border-radius: 5px;
  margin-left: 15px;
  background-size: 50%;
}

.form-dialog .medical-list li:not(.no-data)::after {
  display: none;
  content: "";
  width: 12px;
  height: 12px;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%) rotate(45deg);
  border: 2px solid #b2b2b2;
  border-bottom: none;
  border-left: none;
}

.form-dialog .form-btn label {
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.form-dialog .dialog-title {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 30px;
  letter-spacing: -0.5px;
  color: #222;
  height: 50px;
  line-height: 50px;
}

.form-dialog .btn-wrap {
  width: 100%;
}

.form-dialog .btn-wrap>* {
  text-align: center;
  margin: 0;
  height: 50px;
  border: none;
  color: #222;
  border-radius: 0;
  font-size: 16px;
  flex: 1;
  line-height: 50px;
  cursor: pointer;
}

.form-dialog.load::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 9999;
}

/* barcode container */
.form-dialog .scanner-box {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 226px;
  height: 201px;
  padding: 54px 0;
  transition: transform .5s ease-out;
  background: url(/skin/img/ic-document-dark.svg) center / 25% no-repeat;
  z-index: 9999;
  display: none;
}

/* animated laser beam */
.form-dialog .scanner {
  width: 50%;
  margin: 0 auto;
  height: 3px;
  background-color: var(--global-primary-color);
  opacity: 0.9;
  position: relative;
  top: 50%;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-play-state: running;
}

.form-dialog.load .scanner-box {
  display: block;
}

.form-dialog.load .scanner {
  animation-name: scan;
}

.inbody-dialog .no-data::before {
  background-size: 80%;
}

.form-dialog .no-data {
  border: none !important;
}

.form-dialog .dialog-content {
  width: 100%;
  padding: 15px;
  font-size: 15px;
}

.form-dialog .dialog-label {
  font-size: 15px;
  color: #222;
  font-weight: 500;
  letter-spacing: -0.5px;
}

.form-dialog .dialog-text {
  min-height: 35px;
  display: flex;
  align-items: center;
}

.form-dialog select {
  height: 35px;
  border-radius: 5px;
  border: 1px solid #ddd;
  width: 100%;
}

.form-dialog textarea {
  border-radius: 5px;
  border: 1px solid #ddd;
  width: 100%;
}

.form-dialog table {
  width: 100%;
}

.form-dialog table th,
.form-dialog table td {
  vertical-align: middle;
  padding: 5px 0;
}

@keyframes scan {
  0% {
    top: 50%;
  }

  25% {
    top: 0;
  }

  75% {
    top: 98%;
  }
}

.form-dialog .btn-wrap button+button {
  color: var(--global-primary-color);
  border-left: 1px solid #f2f2f2;
}

.money-dialog .money-dialog-wrap {
  display: flex;
  justify-content: center;
  width: 100%;
}

.money-dialog .new-form-wrap {
  margin: 0;
  width: 50rem;
  flex: none;
  padding-bottom: 0;
  padding-top: 0;
}

.money-dialog .money-list-wrap {
  width: 385px;
  margin-right: 25px;
  height: 700px;
  overflow: hidden;
}

.money-dialog .money-list-wrap ul {
  height: calc(100% - 65px);
  padding-right: 10px;
}

.money-dialog .money-list-wrap li {
  display: flex;
  align-items: center;
  padding: 15px 0;
  font-size: 15px;
  letter-spacing: -0.5px;
}

.money-dialog .money-list-wrap li+li {
  border-top: 1px dashed #eee;
}

.money-dialog .money-list-wrap li .memo {
  flex: 1;
}

.money-dialog .money-list-wrap li .money {
  text-align: right;
  margin: 0 25px;
}

.money-dialog .money-list-wrap li .date {
  flex: none;
  /* width: 120px; */
}

.new-form-wrap.request-payment-wrap {
  width: 850px;
  max-width: 850px;
  padding-top: 75px;
}

.request-payment-wrap li {
  flex: 1;
  background-color: var(--global-sub-color);
  border: 1px solid var(--global-sub-color);
  height: 240px;
  border-radius: 30px;
  text-align: center;
  padding: 20px 15px;
  color: #222;
  box-shadow: rgb(149 157 165 / 20%) 0px 4px 12px;
  cursor: pointer;
}

.request-payment-wrap li+li {
  margin-left: 30px;
}

.request-payment-wrap li img {
  width: 25%;
}

.request-payment-wrap li h3 {
  font-size: 22px;
  letter-spacing: -1px;
  font-weight: 500;
  margin: 10px 0 20px 0;
}

.request-payment-wrap li p {
  font-size: 16px;
  line-height: 1.35;
  letter-spacing: -1px;
}



.new-form-wrap {
  padding: 80px 0 40px 0;
  box-sizing: border-box;
  /* min-height: calc(100vh - 114px); */
  max-width: 700px;
  margin: 0 auto;
}

.new-form-wrap * {
  box-sizing: border-box;
}

.form-title {
  font-size: 2.5rem;
  font-weight: 500;
  line-height: 1.55;
  margin-bottom: 4.5rem;
  color: #222;
}

.sub-title {
  font-size: 2rem;
  letter-spacing: -0.03rem;
  color: #222;
  margin-bottom: 1rem;
  font-weight: 500;
}

.tip-txt {
  font-size: 1.5rem;
  letter-spacing: -1px;
  color: #666;
  font-weight: normal;
}

.tip-txt.color {
  color: var(--global-primary-color);
}

.tip-txt span {
  color: var(--global-primary-color);
  padding-right: 0.7rem;
  font-size: 1.6rem;
  letter-spacing: -1px;
}

.new-form-wrap .input-wrap+.input-wrap {
  margin-top: 15px;
}

.new-form-wrap .inline-input {
  display: flex;
  align-items: center;
  border: 1px solid #ddd;
  overflow: hidden;
  border-radius: 10px;
  height: 60px;
  padding: 0;
  width: 100%;
}

.new-form-wrap .inline-input input.form-input,
.new-form-wrap .inline-input .form-input {
  border: none;
  border-radius: 0;
  height: 100% !important;
}

.new-form-wrap .inline-input .separator {
  flex: none;
  width: 10px;
  height: 1px;
  background-color: #222;
  margin: 0 15px;
}

.new-form-wrap input.form-input,
.new-form-wrap .form-input,
input.form-input,
*.form-input {
  border: 1px solid #ddd;
  padding: 0 1.5rem;
  border-radius: 1rem;
  height: 5rem;
  line-height: 5rem;
  width: 100%;
  font-size: 1.6rem;
}

.new-form-wrap input.form-input::placeholder,
input.form-input::placeholder {
  font-size: 1.6rem;
}

.new-form-wrap .form-select,
select.form-select {
  border-radius: 1rem;
  border: 1px solid #ddd;
  height: 5rem;
  line-height: 5rem;
  padding: 0 5rem 0 1.5rem;
  width: 100%;
  font-size: 1.6rem;
  color: #222 !important;
  background: transparent;
  -webkit-appearance: none;
  background: url(/skin/img/ic-arrow-down.png) top 50% right 1.5rem / 1.5rem no-repeat !important;
  padding-right: 4.5rem !important;
}

.test-btn,
.new-form-wrap input[type="submit"],
.new-form-wrap button.form-btn,
.new-form-wrap button.submit-btn {
  border-radius: 1rem;
  margin-top: 4rem !important;
  background-color: var(--global-primary-color);
  color: #fff;
  font-size: 1.6rem !important;
  height: 5rem !important;
  line-height: 5rem !important;
  font-weight: 500 !important;
  padding: 0;
  width: 100%;
  flex: 1;
}

textarea.form-input,
.new-form-wrap textarea {
  border: 1px solid #ddd !important;
  line-height: 1.55 !important;
  min-height: 8rem !important;
  width: 100% !important;
  padding: 1.5rem !important;
  border-radius: 1rem;
  font-size: 1.6rem;
}

textarea.form-input::placeholder,
.new-form-wrap textarea::placeholder {
  font-size: 1.6rem;
}

textarea.form-input:focus::placeholder {
  color: transparent;
}

.new-form-wrap button a {
  color: inherit;
  display: block;
  width: 100%;
  height: 100%;
}

.new-form-wrap .btn-wrap {
  margin-top: 40px;
  display: flex;
  align-items: center;
}

.new-form-wrap .btn-wrap.flex {
  display: flex;
  align-items: center;
}

.new-form-wrap .btn-wrap.flex>button.form-btn {
  margin-top: 0 !important;
  width: auto;
  flex: 1;
  border-radius: 13px;
}

.new-form-wrap .btn-wrap.flex>button:nth-child(1) {
  /* border-radius: 5px 0 0 5px; */
  /* background-color: #cef3f5; */
  background-color: var(--global-sub-color);
  color: var(--global-primary-color);
}

.new-form-wrap .btn-wrap.flex>button+button {
  /* border-radius: 0 5px 5px 0; */
  margin-left: 12px;
}

.new-form-wrap .input-prefix,
.new-form-wrap .input-suffix {
  display: flex;
  align-items: flex-end;
  border: 1px solid #ddd;
  border-radius: 14px;
  overflow: hidden;
}

.new-form-wrap .prefix,
.new-form-wrap .suffix {
  flex: none;
  display: block;
  height: 60px;
  line-height: 60px;
  /* font-size: 14px; */
  letter-spacing: -1px;
  padding: 0 15px;
}


.new-form-wrap .input-prefix .form-input,
.new-form-wrap .input-suffix .form-input {
  width: auto;
  flex: 1;
  margin: 0;
  border-radius: 0;
  border: none;
  min-width: 0;
}

.new-form-wrap .checkbox-wrap,
.new-form-wrap .radio-wrap {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 15px;
}

.new-form-wrap .checkbox-wrap.column,
.new-form-wrap .radio-wrap.column {
  flex-direction: column;
}



.new-form-wrap .checkbox-wrap label {
  display: flex;
  width: 50%;
  height: 37px;
  align-items: center;
  line-height: 1;
}

.new-form-wrap .radio-wrap label {
  display: flex;
  width: 50%;
  height: 60px;
  align-items: center;
  line-height: 1;
}

.new-form-wrap .radio-wrap.count3 label {
  width: calc(33.3333% - 1rem);
  cursor: pointer;
}

.new-form-wrap .radio-wrap input[type="radio"] {
  margin-right: 10px;
  width: 20px;
  height: 20px;
  display: block;
  -webkit-appearance: none;
  background: url(/skin/img/ic-radio-off.svg) center / contain no-repeat;
}

.new-form-wrap .radio-wrap input[type="radio"]:checked {
  background: url(/skin/img/ic-radio-on.svg) center / contain no-repeat;
}

.new-form-wrap .checkbox-wrap span,
.new-form-wrap .radio-wrap span {
  letter-spacing: -0.5px;
  font-size: 17px;
  color: #222;
  line-height: 1.5;
  margin-left: 10px;
}

.new-form-wrap .checkbox-wrap span {
  font-size: 16px;
}

.new-form-wrap .checkbox-wrap.column label,
.new-form-wrap .radio-wrap.column label {
  width: 100%;
}

.new-form-wrap .radio-button-wrap {
  display: flex;
  align-items: center;
  margin-top: 15px;
}

.new-form-wrap .radio-button-wrap label {
  flex: 1;
  text-align: center;
  min-height: 50px;
  border-radius: 12px;
  /* background-color: var(--global-sub-color);
  color: var(--global-primary-color); */
  background-color: #f2f2f2;
  color: #333;
  font-size: 17px;
  letter-spacing: -1px;
  margin-right: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 10px 0;
  cursor: pointer;
}

.new-form-wrap .radio-button-wrap label:last-child {
  margin-right: 0;
}

.new-form-wrap .radio-button-wrap.large label {
  font-size: 18px;
  padding: 16px 0;
  height: 60px;
}

.new-form-wrap .radio-button-wrap label .small-label {
  display: block;
  font-size: 15px;
  margin-top: 10px;
}

.new-form-wrap .radio-button-wrap input:checked+label {
  background-color: var(--global-primary-color);
  color: #fff;
}

.new-form-wrap .radio-button-wrap input {
  display: none;
}

.new-form-wrap .radio-button-wrap.column {
  flex-direction: column;
}

.new-form-wrap .radio-button-wrap.column label {
  width: 100%;
}

.new-form-wrap .radio-button-wrap.column input:first-child+label {
  border-radius: 5px 5px 0 0;
}

.new-form-wrap .radio-button-wrap.column label:last-child {
  border-radius: 0 0 5px 5px;
}

.new-form-wrap .radio-wrap input[type="text"],
.new-form-wrap .checkbox-wrap input[type="text"] {
  width: auto;
  border: none;
  border-radius: 0;
  margin-left: 12px;
  height: 28px;
  flex: 1;
  border-bottom: 1px solid #ddd;
  padding: 0;
}

.new-form-wrap .agree-wrap {
  margin-top: 15px;
}

.new-form-wrap .agree-wrap label {
  color: #222;
}

/* .radio-button-wrap {
  display: flex;
  align-items: center;
  margin-top: 15px;
} */

.radio-button-wrap {
  display: flex;
  align-items: center;
}

.radio-button-wrap input {
  display: none;
}

.radio-button-wrap label {
  display: block;
  flex: 1;
  /* background-color: var(--global-sub-color);
  color: var(--global-primary-color); */
  background-color: #f2f2f2;
  color: #333;
  height: 5rem;
  line-height: 5rem;
  font-size: 1.6rem;
  letter-spacing: -0.05rem;
  text-align: center;
  cursor: pointer;
  border-radius: 1.4rem;
}

.radio-button-wrap input:checked+label {
  background-color: var(--global-primary-color);
  color: #fff;
}

.radio-button-wrap label:not(:nth-of-type(1)) {
  margin-left: 1.5rem;
}

/* .radio-button-wrap label {
  flex: 1;
  text-align: center;
  border-radius: 8px;
  background-color: #f2f2f2;
  color: #666;
  font-size: 15px;
  letter-spacing: -1px;
  margin-right: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 10px 0;
  cursor: pointer;
}

.radio-button-wrap label:last-child {
  margin-right: 0;
}

.radio-button-wrap.large label {
  font-size: 1.7rem;
  padding: 1.6rem 0;
  height: 5.6rem;
  line-height: 5.6rem;
  border-radius: 1.3rem;
}

.radio-button-wrap.medium label {
  font-size: 1.6rem;
  padding: 1.6rem 0;
  height: 4.5rem;
  line-height: 4.5rem;
}

.radio-button-wrap label .small-label {
  display: block;
  font-size: 1.5rem;
  margin-top: 1rem;
}

.radio-button-wrap input[type="radio"]:checked+label {
  background-color: var(--global-primary-color) !important;
  color: #fff;
}

.radio-button-wrap input[type="radio"] {
  display: none;
}

.radio-button-wrap.column {
  flex-direction: column;
}

.radio-button-wrap.column label {
  width: 100%;
}

.radio-button-wrap.column input[type="radio"]:first-child+label {
  border-radius: 5px 5px 0 0;
}

.radio-button-wrap.column label:last-child {
  border-radius: 0 0 5px 5px;
} */

.new-form-wrap .radio-wrap input[type="text"],
.new-form-wrap .checkbox-wrap input[type="text"] {
  width: auto;
  border: none;
  border-radius: 0;
  margin-left: 12px;
  height: 28px;
  flex: 1;
  border-bottom: 1px solid #ddd;
  padding: 0;
}

.new-form-wrap .input-btn-wrap {
  display: flex;
}

.new-form-wrap .input-btn-wrap button {
  display: block;
  margin-left: 1rem;
  background-color: var(--global-primary-color);
  color: #fff;
  line-height: 1;
  padding: 1rem 1.6rem;
  border-radius: 1.4rem;
  font-size: 1.6rem;
  height: auto;
  border: none;
}

.new-form-wrap .agree-wrap {
  margin-top: 15px;
}

.new-form-wrap .agree-wrap label {
  color: #222;
}


.new-form-wrap .search-result-wrap {
  position: absolute;
  top: 59px;
  left: 0;
  background-color: #fff;
  width: 100%;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  max-height: 280px;
  display: none;
  z-index: 99999;
}

.new-form-wrap .search-result-wrap li {
  display: flex;
  align-items: center;
  height: 60px;
  padding: 0 20px;
  cursor: pointer;
  font-size: 15px;
  letter-spacing: -0.5px;
}

.new-form-wrap .search-result-wrap li+li {
  border-top: 1px solid #f7f7f7;
}

.new-form-wrap .search-result-wrap li.no-data {
  justify-content: center;
  color: #b2b2b2;
  font-weight: 500;
}

.new-form-wrap .search-result-wrap li.no-data::before {
  display: none;
}

.count-list {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 0;
  flex-wrap: wrap;
}

.count-list li p {
  text-align: center;
  font-size: 17px;
  color: #333;
}

.count-list li {
  flex: none;
  width: 25%;
}

.count-list li .count {
  display: block;
  margin: 0 auto;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -1px;
  text-align: center;
  width: 100%;
  height: 80px;
  line-height: 80px;
}

.count-list.circle li {
  flex: 1;
  max-width: 200px;
}

.count-list.circle li .count {
  width: 100px;
  height: 100px;
  line-height: 100px;
  border-radius: 50px;
  background-color: #f2f2f2;
  margin: 0 auto 20px auto;
}

.textoverflow {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* editor style */
.cheditor-popupModalBackground {
  z-index: 9998 !important;
  background-color: #000 !important;
}

.cheditor-popup-window {
  z-index: 9999 !important;
  box-shadow: 0 0 1rem rgba(0, 0, 0, 0.6) !important;
}

.default-table {
  width: 100%;
  font-size: 1.6rem;
  border-top: 1px solid #4f525c;
  border-bottom: 1px solid #d8d8d8;
}

.default-table th,
.default-table td {
  font-weight: normal;
  padding: 2rem 3rem;
  vertical-align: middle;
}

.default-table th {
  background-color: #f7f7f7;
  border-right: 1px solid #f2f2f2;
  border-bottom: 1px solid #f2f2f2;
}

.default-table td {
  border-bottom: 1px solid #f2f2f2;
}

.default-table tr:last-child th,
.default-table tr:last-child td {
  border-bottom: none;
}

.loading_wait {
  display: none;
  text-align: center;
  font-size: 12px;
}

.loading_wait img {
  display: block;
  margin-bottom: 1rem;
  margin: 2rem auto 1rem auto;
  width: 9rem;
}

.loading_wait span {
  font-size: 1.8rem;
}

.loading_wait p {
  font-size: 1.5rem;
  margin: 1rem;
}










/* new_style.css */
@keyframes switchOn {
  from {
    background-color: #b2b2b2;
    left: 1px;
  }

  to {
    background-color: var(--global-primary-color);
    left: 17px;
  }
}

@keyframes switchOff {
  from {
    background-color: var(--global-primary-color);
    left: 17px;
  }

  to {
    background-color: #b2b2b2;
    left: 2px;
  }
}


/* new_style.css */
@keyframes whiteSwitchOn {
  from {
    background-color: #b2b2b2;
    left: 1px;
  }

  to {
    background-color: #fff;
    left: 17px;
  }
}

@keyframes whiteSwitchOff {
  from {
    background-color: #fff;
    left: 17px;
  }

  to {
    background-color: #b2b2b2;
    left: 2px;
  }
}


:root {
  font-size: 10px;
  --swiper-theme-color: #f03141;
  --swiper-navigation-size: 30px;
}

input:focus::placeholder {
  color: transparent;
}

header {
  width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000;
  height: 9rem;
  background-color: #fff;
  box-sizing: border-box;
  border-bottom: 0.1rem solid #efefef;
}

header * {
  box-sizing: border-box;
}

header nav>ul {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

header nav>ul>li {
  font-size: 1.6rem;
  cursor: pointer;
  height: auto;
  position: relative;
}

header nav>ul>li+li {
  margin-left: 2rem;
}

header nav>ul>li:hover>a,
header nav>ul>li.active>a {
  color: var(--global-primary-color) !important;
}

header nav>ul>li>a {
  color: #222;
  padding: 1.4rem 1rem;
  display: block;
  line-height: 1;
}

header .search_icon {
  position: absolute;
  right: 2rem;
  top: 50%;
  margin-top: -1.2rem;
  z-index: 1;
  width: 3rem;
  height: 3rem;
  display: block;
  background: url(/skin/demo/img/search_btn.png) center no-repeat;
  font-size: 0;
  border: 0;
}

header nav>ul {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

/* header nav ul:not(.sub-menu) > li:hover, */
header nav ul:not(.sub-menu)>li:hover>a,
header nav .sub-menu li:hover>a {
  color: var(--global-primary-color);
}

header nav ul:not(.sub-menu)>li:hover .sub-menu {
  display: block;
}

header nav .sub-menu {
  position: absolute;
  z-index: 999;
  left: 50%;
  top: 4.5rem;
  transform: translateX(-50%);
  padding: 1rem;
  border: solid 0.1rem #efefef;
  border-radius: 0.5rem;
  background-color: #fff;
  z-index: 1000;
  min-width: 14rem;
  width: auto;
  display: none;
}

header nav .sub-menu::after {
  content: "";
  position: absolute;
  left: 0;
  top: -0.5rem;
  width: 100%;
  height: 0.313;
  background: url(/skin/img/sub_arrow.png) center no-repeat;
}

header nav .sub-menu a {
  display: block;
  padding: 0 1.5rem !important;
  line-height: 2.8rem !important;
  font-size: 1.4rem !important;
}

header nav .sub-menu li.active a {
  color: var(--global-primary-color);
}

header nav.my-menu {
  margin-left: auto;
}

header nav.my-menu>ul>li>a {
  font-size: 1.4rem;
}

header nav.my-menu .user-profile {
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 3rem;
  border: 0.1rem solid #eee;
  background: #f2f2f2 url(/skin/img/ic-user.svg) center / 50% no-repeat;
  position: relative;
  z-index: 2;
  padding: 0;
  overflow: hidden;
}

header nav.my-menu .user-profile img {
  width: 100%;
  height: auto;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

header nav.my-menu .user-profile.official::before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(100% + 0.8rem);
  height: calc(100% + 0.8rem);
  z-index: 1;
  background: url(/skin/img/profile-border.svg) center / 100% no-repeat;
}

header .inner {
  height: 100%;
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0 auto;
}

header .logo-wrap {
  width: 20rem;
}

header .app-logo {
  height: 2.6rem;
  display: flex;
  align-items: center;
  font-size: 2.4rem;
  letter-spacing: -0.05rem;
  font-weight: 500;
  color: #222;
  line-height: 1;
  margin: 0 auto;
}

header nav {
  width: auto;
}

header .cart-btn {
  display: block;
  width: 3.6rem;
  height: 3.6rem;
  background: url(/skin/img/cart.svg) top 50% right 0 / 65% no-repeat;
  position: relative;
}

header nav>ul>li.active .cart-btn {
  background-image: url(/skin/img/cart-color.svg);
}

header .search-btn {
  display: block;
  width: 3.6rem;
  height: 3.6rem;
  background: url(/skin/img/ic-search.svg) top 50% right 0 / 60% no-repeat;
  position: relative;
}

header .setting-btn {
  display: block;
  width: 3.6rem;
  height: 3.6rem;
  background: url(/skin/img/ic-setting.svg) top 50% right 0 / 60% no-repeat;
  position: relative;
}

header nav>ul>li.active .search-btn {
  background-image: url(/skin/img/ic-search-color.svg);
}

header .cart-count {
  display: inline-block;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 50%;
  background-color: var(--global-primary-color);
  color: #fff;
  font-size: 1rem;
  letter-spacing: -0.05rem;
  font-weight: 500;
  margin-left: 0.3rem;
  text-align: center;
  line-height: 1.8rem;
  margin-top: -0.05rem;
}

header .cart-btn .cart-count {
  position: absolute;
  top: 0;
  right: -1rem;
}

nav#nav {
  padding-top: 9rem;
  width: 20rem;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  height: 100%;
  background-color: #fff;
  padding-bottom: 4rem;
  border-right: 1rem solid #f7f7f7;
}

nav#nav .nav-inner {
  height: 95%;
  overflow-y: scroll;
}

nav#nav .nav-inner::-webkit-scrollbar {
  display: none;
}

nav#nav .nav-inner>li {
  border-bottom: 0.1rem solid #efefef;
}

nav#nav .nav-inner>li.on {
  /* background-color: #f2f2f2; */
}

nav#nav .nav-inner * {
  -webkit-user-select: none;
  /* Safari */
  -ms-user-select: none;
  /* IE 10 and IE 11 */
  user-select: none;
  /* Standard syntax */
}

nav#nav .nav-menu-title {
  padding: 2rem 3.3rem 2rem 2rem;
  position: relative;
  color: #222;
  cursor: pointer;
  letter-spacing: -0.05rem;
  font-size: 1.4rem;
  display: block;
}

nav#nav .nav-menu-title:not(.my-point)::after {
  width: 1.8rem;
  height: 1.8rem;
  cursor: pointer;
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 1rem;
  margin-left: auto;
  background-image: url(/skin/img/ic-arrow-down.png);
  background-size: 75%;
  background-position: center;
  background-repeat: no-repeat;
}

nav#nav .nav-menu-title.my-point {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 1rem;
}

nav#nav .nav-inner>li.depth1 .nav-menu-title::after {
  display: none;
}

nav#nav .nav-inner>li.depth1.on .nav-menu-title {
  color: var(--global-primary-color);
}

nav#nav .nav-sub-menu {
  display: none;
  margin-top: -1rem;
  padding-bottom: 1rem;
  letter-spacing: -0.05rem;
}

nav#nav .nav-sub-menu li a {
  color: #333;
  display: block;
  font-size: 1.4rem;
  position: relative;
  padding: 1rem 1rem 1rem 3.5rem;
}

nav#nav .nav-sub-menu li a::before {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 2.2rem;
  width: 5px;
  height: 1px;
  background-color: #222;
}

nav#nav .nav-sub-menu li.active a {
  color: var(--global-primary-color);
}

nav#nav .nav-sub-menu li.active a::before {
  background-color: var(--global-primary-color);
}

nav#nav .nav-menu-title.on::after {
  transform: translateY(-50%) rotate(180deg);
}

nav#nav .nav-menu-title.on+.nav-sub-menu {
  display: block;
}

nav#nav .memo-wrap {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 26rem;
}

nav#nav .memo-wrap .memo-title {
  padding: 1rem 3.3rem 1rem 2rem;
  color: #222;
  letter-spacing: -0.05rem;
  margin-bottom: 1rem;
}

nav#nav .memo-wrap textarea {
  width: 90%;
  margin: 0 auto;
  border-radius: 0.3rem;
  font-size: 1.4rem;
  color: #222;
  height: 11.5rem;
}

nav#nav .memo-wrap #memo_submit_btn {
  width: 90%;
  display: block;
  margin: 1rem auto;
}


nav#nav .memo-wrap .mb_date_wrap {
  color: #666;
  font-weight: normal !important;
  font-size: 1.3rem;
  letter-spacing: -0.05rem;
  text-align: center;
}

nav#nav .nav-add-btn {
  width: 90%;
  margin: 0 auto;
}

nav#nav .nav-add-btn i {
  display: block;
  width: 1.4rem;
  height: 1.4rem;
  margin-right: 1rem;
  position: relative;
  margin-top: -0.05rem;
}

nav#nav .nav-add-btn i::after,
nav#nav .nav-add-btn i::before {
  content: "";
  display: block;
  width: 1.5px;
  height: 100%;
  background-color: #ffff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

nav#nav .nav-add-btn i::before {
  transform: translate(-50%, -50%) rotate(90deg);
}

label {
  cursor: pointer;
}

/* 
*::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

*::-webkit-scrollbar-thumb {
  background-color: #ddd;
  opacity: 0.7;
  border-radius: 50px;
} */

.swiper .swiper-pagination-bullet {
  background: var(--global-primary-color) !important;
}

.swiper .swiper-btn {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5) url(/skin/img/ic-arrow-left-b.svg) center / 48% no-repeat;
}

.swiper .swiper-btn.swiper-button-next {
  transform: rotate(180deg);
}

.swiper .swiper-btn::after {
  display: none;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
  display: none;
}


.swiper-button-next {
  right: 14rem;
}

.swiper-button-prev {
  left: 14rem;
}


/* new-form-wrap */
.form-label {
  font-size: 1.6rem;
  text-align: left;
  margin: 4rem 0 1.5rem 0;
}

.form-label.require {
  padding-left: 1.1rem;
  position: relative;
}

.form-label.require::before {
  content: "*";
  display: block;
  position: absolute;
  left: 0;
  top: 0.9rem;
  color: var(--global-primary-color);
  font-size: 1.4rem;
  line-height: 1;
}

.form-label.social {
  display: flex;
  align-items: center;
}

.form-label.social img {
  width: 2.5rem;
  display: block;
  margin-right: 1rem;
}

.add-file-btn {
  width: 10.4rem;
  height: 10.4rem;
  border-radius: 1rem;
  background: #f2f2f2 url(/skin/img/ic-plus-gray.svg) center / 35% no-repeat;
  cursor: pointer;
  position: relative;
}

.add-file-btn input[type='file'] {
  width: 0;
  height: 0;
  opacity: 0;
}

.add-file-btn .del-file-btn {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  top: -0.7rem;
  right: -0.7rem;
  background: #f03141 url(/skin/img/ic-delete.png) center / 55% no-repeat;
  position: absolute;
  border-radius: 50%;
  display: none;
}

.range-picker {
  border-radius: 1rem;
  border: 1px solid #ddd;
  /* overflow: hidden; */
}

.range-picker .date-picker {
  flex: 1;
}

.range-picker input {
  height: 3.5rem;
  border: none !important;
  border-radius: 0.9rem;
  flex: 1;
}

.range-picker select {
  width: 10rem;
  flex: none;
  border: none;
  border-right: 1px solid #ddd;
  height: 3.5rem;
  border-radius: 0;
}

.range-picker .separator {
  padding: 0 1rem;
  font-size: 1.6rem;
}

.range-picker.large {
  border-radius: 1.4rem;
}

.range-picker.large input {
  height: 6rem;
  text-align: center;
}

.range-input-wrap {
  display: flex;
  align-items: center;
  overflow: hidden;
  border-radius: 0.8rem;
  border: 1px solid #ddd;
  overflow: hidden;
}

.range-input-wrap input {
  height: 3.2rem !important;
  padding-right: 3.3rem;
  font-size: 1.6rem;
  text-align: center;
  border: none;
  border-radius: 0;
}

.range-input-wrap .separator {
  padding: 0 1rem;
}

.range-input-wrap .input-suffix {
  border: none;
}

.range-input-wrap.large {
  height: 5.6rem;
  border-radius: 1.4rem;
  border: 1px solid #ddd;
}

.range-input-wrap.large input {
  height: 100%;
  border: none;
  font-size: 1.6rem;
  padding: 0;
}

.range-input-wrap.large input::placeholder {
  font-size: 1.6rem;
}

.range-input-wrap.timepicker input {
  text-align: right;
}

.range-input-wrap.timepicker input+input {
  text-align: left;
  padding-left: 0.2rem;
}


.switch-wrap {
  flex: none;
  text-align: center;
  width: 4.8rem;
}

.switch-state {
  font-size: 1.3rem;
  color: #b2b2b2;
  text-align: center;
  margin-top: 0.5rem;
  letter-spacing: -0.1rem;
}

.switch.active+.switch-state,
.switch-state.active {
  color: var(--global-primary-color);
}

.switch-wrap .switch {
  margin: 0 auto;
}

.switch {
  display: block;
  width: 37px;
  height: 21px;
  flex: none;
  border-radius: 25px;
  border: 2px solid #b2b2b2;
  position: relative;
  cursor: pointer;
}

.switch.pc {
  margin-left: 1.5rem;
}

.switch.active {
  border-color: var(--global-primary-color);
}

.switch-wrap.white .switch.active {
  border-color: #fff;
}

.switch::before {
  content: "";
  display: block;
  position: absolute;
  width: 13px;
  height: 13px;
  border-radius: 9px;
  background-color: #b2b2b2;
  left: 2px;
  top: 2px;
  animation-duration: 0.2s;
  animation-fill-mode: both;
}

.switch.on::before {
  animation-name: switchOn;
}

.switch-wrap.white .switch.on::before {
  animation-name: whiteSwitchOn;
}

.switch.off::before {
  animation-name: switchOff;
}

.switch-wrap.white .switch.off::before {
  animation-name: whiteSwitchOff;
}

.switch.active::before {
  background-color: var(--global-primary-color);
  left: 17px;
}

.switch-wrap.white .switch.active::before {
  background-color: #fff;
  left: 17px;
}

.switch.setting::before {
  width: 17px;
  height: 17px;
  background-color: #fff !important;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  box-shadow: 0px 2px 7px 0 rgba(180, 180, 180, 0.6);
}

.switch.setting.active::before {
  box-shadow: 2px 2.5px 7px 0 rgba(240, 49, 65, 0.6);
}

.switch.setting {
  height: 1.4rem;
  background-color: #b2b2b2;
  border: none;
}

.switch.setting.active {
  background-color: var(--global-primary-color);
  border: none;
}

.switch.setting.on::before {
  animation-name: settingSwitchOn;
}

.switch.setting.off::before {
  animation-name: settingSwitchOff;
}



/* 이미지 라디오 버튼 */
.radio-button-wrap.image {
  margin: 0;
}

.radio-button-wrap.image label {
  height: 6.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding: 0.8rem 0;
}

.radio-button-wrap.image label p {
  font-size: 1.3rem;
  letter-spacing: -0.05rem;
  height: auto;
  line-height: 1;
}

.radio-button-wrap.image input[type="radio"]:checked+label {
  background-color: var(--global-sub-color) !important;
  color: var(--global-primary-color);
}

/* 텍스트 정렬 라디오 버튼 */
.radio-button-wrap.image.align .left {
  background: #f2f2f2 url(/skin/img/ic-text-align-left.svg) center / 3rem no-repeat;
}

.radio-button-wrap.image.align .center {
  background: #f2f2f2 url(/skin/img/ic-text-align-center.svg) center / 3rem no-repeat;
}

.radio-button-wrap.image.align .right {
  background: #f2f2f2 url(/skin/img/ic-text-align-right.svg) center / 3rem no-repeat;
}

.radio-button-wrap.image.align input[type="radio"]:checked+.left {
  background: #f2f2f2 url(/skin/img/ic-text-align-left-color.svg) center / 3rem no-repeat;
}

.radio-button-wrap.image.align input[type="radio"]:checked+.center {
  background: #f2f2f2 url(/skin/img/ic-text-align-center-color.svg) center / 3rem no-repeat;
}

.radio-button-wrap.image.align input[type="radio"]:checked+.right {
  background: #f2f2f2 url(/skin/img/ic-text-align-right-color.svg) center / 3rem no-repeat;
}

/* 사진 표시 방식 라디오 버튼 */
.radio-button-wrap.image.picture .swiper {
  background: #f2f2f2 url(/skin/img/ic-view-swiper.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.picture .thumb {
  background: #f2f2f2 url(/skin/img/ic-view-thumb.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.picture .feed {
  background: #f2f2f2 url(/skin/img/ic-view-feed.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.picture input[type="radio"]:checked+.swiper {
  background: #f2f2f2 url(/skin/img/ic-view-swiper-color.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.picture input[type="radio"]:checked+.thumb {
  background: #f2f2f2 url(/skin/img/ic-view-thumb-color.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.picture input[type="radio"]:checked+.feed {
  background: #f2f2f2 url(/skin/img/ic-view-feed-color.svg) 50% 28% / 3rem no-repeat;
}

/* 썸네일 표시 방식 라디오 버튼 */
.radio-button-wrap.image.thumb input[type="radio"]+.thumb {
  background: #f2f2f2 url(/skin/img/ic-view-list.svg) 50% 28% / 3.7rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]:checked+.thumb {
  background: #f2f2f2 url(/skin/img/ic-view-list-color.svg) 50% 28% / 3.7rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]+.card {
  background: #f2f2f2 url(/skin/img/ic-view-feed.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]:checked+.card {
  background: #f2f2f2 url(/skin/img/ic-view-feed-color.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]+.grid {
  background: #f2f2f2 url(/skin/img/ic-view-grid.svg) 50% 28% / 4rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]:checked+.grid {
  background: #f2f2f2 url(/skin/img/ic-view-grid-color.svg) 50% 28% / 4rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]+.button {
  background: #f2f2f2 url(/skin/img/ic-view-button.svg) 50% 28% / 4rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]:checked+.button {
  background: #f2f2f2 url(/skin/img/ic-view-button-active.svg) 50% 28% / 4rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]+.background {
  background: #f2f2f2 url(/skin/img/ic-view-background.svg) 50% 28% / 4rem no-repeat;
}

.radio-button-wrap.image.thumb input[type="radio"]:checked+.background {
  background: #f2f2f2 url(/skin/img/ic-view-background-active.svg) 50% 28% / 4rem no-repeat;
}


/* 비율 라디오 버튼 */
.radio-button-wrap.image.ratio input[type="radio"]+.ratio1_1 {
  background: #f2f2f2 url(/skin/img/ic-ratio-1_1.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]:checked+.ratio1_1 {
  background: #f2f2f2 url(/skin/img/ic-ratio-1_1-color.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]+.ratio4_3 {
  background: #f2f2f2 url(/skin/img/ic-ratio-4_3.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]:checked+.ratio4_3 {
  background: #f2f2f2 url(/skin/img/ic-ratio-4_3-color.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]+.ratio16_9 {
  background: #f2f2f2 url(/skin/img/ic-ratio-16_9.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]:checked+.ratio16_9 {
  background: #f2f2f2 url(/skin/img/ic-ratio-16_9-color.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]+.ratio2_3 {
  background: #f2f2f2 url(/skin/img/ic-ratio-2_3.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]:checked+.ratio2_3 {
  background: #f2f2f2 url(/skin/img/ic-ratio-2_3-color.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]+.ratiofree {
  background: #f2f2f2 url(/skin/img/ic-ratio-free.svg) 50% 28% / 3rem no-repeat;
}

.radio-button-wrap.image.ratio input[type="radio"]:checked+.ratiofree {
  background: #f2f2f2 url(/skin/img/ic-ratio-free-color.svg) 50% 28% / 3rem no-repeat;
}

/* 공유하기 팝업 */
#sns_popup {
  display: none;
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 19999;
}

#sns_popup .sns_wrap {
  position: absolute;
  left: 50%;
  top: 37%;
  transform: translate(-50%, -50%);
  width: 400px;
  background-color: #fff;
  border-radius: 5px;
  padding-bottom: 20px;
}

#sns_popup .sns_title {
  position: relative;
  padding: 20px 0;
  color: #222;
  font-size: 16px;
  text-align: center;
  line-height: 1;
  font-weight: 500;
  box-sizing: border-box;
}

#sns_popup .sns_close_btn {
  cursor: pointer;
  position: absolute;
  width: 14px;
  height: 14px;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  background: url("/skin/img/m/layout.png") no-repeat;
  background-position: -100px -700px;
  background-size: 320px auto;
}

#sns_popup .sns_list {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
}

#sns_popup .sns_list li {
  /* float: left; */
  width: 25%;
  flex: none;
  margin-bottom: 10px;
  text-align: center;
  font-size: 12px;
  color: #111;
}

#sns_popup .sns_list li span {
  line-height: 1;
  letter-spacing: -0.5px;
}

#sns_popup i {
  display: block;
  background-size: 100%;
  background-repeat: no-repeat;
  width: 46px;
  height: 46px;
  margin: 0 auto;
  margin-bottom: 6px;
  border-radius: 5px;
}

#sns_popup .btn_kakaotalk {
  background-image: url(/skin/img/sns/ic-kakao.png);
}

#sns_popup .btn_kakaostory {
  background-image: url(/skin/img/sns/ic-kakaostory.png);
}

#sns_popup .btn_twitter {
  background-image: url(/skin/img/sns/ic-twitter.png);
}

#sns_popup .btn_facebook {
  background-image: url(/skin/img/sns/ic-facebook.png);
}

#sns_popup .btn_cafe {
  background-image: url(/skin/img/sns/ic-cafe.png);
}

#sns_popup .btn_sms {
  background-image: url(/skin/img/sns/ic-sms.png);
}

#sns_popup .btn_blog {
  background-image: url(/skin/img/sns/ic-blog.png);
}

#sns_popup .btn_line {
  background-image: url(/skin/img/sns/ic-line.png);
}

#sns_popup .btn_naver {
  background-image: url(/skin/img/sns/ic-naver.png);
}

#sns_popup .btn_copy {
  background: linear-gradient(220deg,
      rgba(164, 0, 255, 1) 0%,
      rgba(180, 32, 255, 1) 36%,
      rgba(246, 39, 208, 1) 68%,
      rgba(255, 67, 101, 1) 100%);
  position: relative;
}

#sns_popup .btn_copy::after {
  display: block;
  content: "";
  position: absolute;
  width: 50%;
  height: 50%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: url("/skin/img/m/ic-link.svg") no-repeat 0 0;
}

/* 찜하기 팝업 */
#zzim_popup,
#video_zzim_popup {
  display: none;
  z-index: 9999;
}

#zzim_popup .zzim_msg,
#video_zzim_popup .zzim_msg {
  position: fixed;
  left: 50%;
  top: 50%;
  width: 15rem;
  height: 15rem;
  margin-top: -9.5rem;
  margin-left: -7.5rem;
  z-index: 9999;
}

#zzim_popup .zzim_msg.on p,
#video_zzim_popup .zzim_msg.on p {
  background: url("/skin/img/zzim_on.png") no-repeat 50% 50%;
  background-size: 15rem auto;
  width: 15rem;
  height: 15rem;
  position: relative;
  overflow: hidden;
  text-indent: -99.9rem;
  animation-name: zzim-animate;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

#zzim_popup .zzim_msg.off p,
#video_zzim_popup .zzim_msg.off p {
  background: url("/skin/img/zzim_off.png") no-repeat 50% 50%;
  background-size: 15rem auto;
  width: 15rem;
  height: 15rem;
  position: relative;
  overflow: hidden;
  text-indent: -99.9rem;
  animation-name: zzim-animate;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

/* new_style.css */

@media (max-width: 760px) {
  .qna-list-wrap {
    margin-bottom: 2.5rem;
  }

  .qna-list-wrap li .thumb {
    width: 23%;
  }

  .qna-list-wrap li .qna-info h3 {
    font-size: 1.7rem;
  }

}




@media (max-width: 1750px) {

  /* pc */
  :root {
    /* font-size: 15px; */
    font-size: 9px !important;
  }

  /* layout */
}

@media (max-width: 1400px) {

  /* pc */
  :root {
    /* font-size: 16px; */
    font-size: 8px !important;
  }

  /* layout */
}

@media (max-width: 1200px) {

  /* pc */
  :root {
    /* font-size: 16px; */
    font-size: 7.5px !important;
  }

  /* layout */
}


@media (max-width: 760px) {
  :root {
    font-size: 9px !important;
  }
}