@charset "utf-8";

@keyframes switchOn {
  from {
    background-color: #b2b2b2;
    left: 2px;
  }

  to {
    background-color: var(--global-primary-color);
    left: 18px;
  }
}

@keyframes switchOff {
  from {
    background-color: var(--global-primary-color);
    left: 18px;
  }

  to {
    background-color: #b2b2b2;
    left: 2px;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes spin {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }

  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

/*
 * 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;
}

html {
  /* 드래그 방지 */
  /* -ms-user-select: none;
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  user-select: none; */
}

body {
  margin: 0rem;
  background-color: #f7f7f7;
  min-height: 100%;
  line-height: 1;
  min-width: 144.4rem;
}

img {
  border: 0rem;
}

form {
  margin: 0rem;
}

.select_color_btn {
  width: 2.5rem;
}

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: 20.7rem;
  padding: 0rem 0rem 0rem 1.3rem;
}

#content {
  margin-left: 20.7rem;
  background-color: #ffffff;
  border: 0.7rem solid #0081e6;
  padding: 2rem;
}

#copyright {
  margin: 2rem 0;
  color: #302f2e;
  font-size: 1.1rem;
  text-align: center;
  font-style: normal;
}

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

#countdown_dashboard {
  height: 3.3rem;
  padding: 1.6rem 0rem 0rem 1rem;
}

.dash {
  width: 2.7rem;
  float: left;
  position: relative;
}

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

/* 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;
  box-sizing: border-box;
  outline: none !important;
  box-shadow: none;
}

.form-control {
  box-shadow: none !important;
  height: 4.2rem;
  line-height: 4.2rem;
  border-radius: 1rem;
  font-size: 1.5rem;
  border: 0.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 1rem !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: 0.4rem;
}

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

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

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

.hidden {
  display: none !important;
}

header nav>ul {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 20rem;
}

header nav>ul>li {
  font-size: 1.5rem;
  /* margin-left: 20px; */
  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);
}

header nav>ul>li>a {
  color: #222;
  padding: 1.4rem 1rem;
  display: block;
  line-height: 1;
}

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: 12rem;
  width: auto;
  display: none;
}

header nav .sub-menu::after {
  content: "";
  position: absolute;
  left: 0;
  top: -0.5rem;
  width: 100%;
  height: 0.5rem;
  background: url(/skin/img/sub_arrow.png) center no-repeat;
}

header nav .sub-menu a {
  display: block;
  padding: 0rem 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.left {
  margin-left: 0;
  margin-right: auto;
}

header nav.my-menu>ul>li>a {
  font-size: 1.5rem;
}

/* header {
  width: 100%;
  min-width: 128rem;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000;
  height: 8rem;
  background-color: #fff;
  border-bottom: 0.1rem solid #efefef;
  box-sizing: border-box;
  display: flex;
  align-items: center;
} */

header {
  background-color: #fff;
  position: fixed;
  /* top: -6rem; */
  left: 50%;
  width: 100%;
  transform: translateX(-50%);
  height: 9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9800;
  overflow: visible;
  /* padding: 0 2.5rem; */
}

header * {
  box-sizing: border-box;
}

header .inner {
  height: 100%;
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0 auto;
  padding-right: 2.5rem;
  min-width: 120rem;
}

header .logo-wrap {
  width: 20rem;
}

@media (max-width: 1800px) {
  header .inner {
    width: 100%;
    min-width: 100%;
    padding-right: 2.5rem;
    /* padding: 0 2rem; */
  }
}

@media (max-width: 1600px) {
  header .inner {
    width: 180rem;
  }
}

/* header .app-logo {
  height: 100%;
  width: 200px;
  display: block;
  line-height: 70px;
  text-align: center;
  font-size: 22px;
  font-weight: 500;
} */

header .app-logo {
  height: 4rem;
  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 .logo-wrap span {
  font-size: 1.3rem;
  color: #222;
  font-weight: 500;
  letter-spacing: -0.05rem;
  line-height: 1;
  margin-bottom: 0.4rem;
  display: inline-block;
}

header nav {
  margin-left: 2.5rem;
  width: auto;
}

/* header .app-logo a {
  display: block;
  width: 100%;
  height: 100%;
} */
header>ul {
  display: flex;
  align-items: center;
  flex: 1;
  font-size: 1.7rem;
  /* max-width: 65%; */
  height: 100%;
}

header>ul li {
  flex: none;
  height: 100%;
  color: #b2b2b2;
}

header>ul li a,
header>ul li a:visited {
  color: #b2b2b2;
  display: inline-flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  padding: 0 2.5rem;
  position: relative;
}

header>ul li a.on {
  color: #222;
}

header>ul li a.on::after {
  display: block;
  content: "";
  width: 100%;
  height: 0.2rem;
  background-color: #222;
  position: absolute;
  left: 0;
  bottom: 0;
}

header .header-btn-wrap {
  margin-left: auto;
  text-align: right;
  padding-right: 1.5rem;
}

header .header-btn-wrap span {
  margin-right: 1.5rem;
}

nav#nav {
  padding-top: 9rem;
  width: 20rem;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  height: 100vh;
  background-color: #fff;
  padding-bottom: 4rem;
}

nav#nav .nav-inner {
  height: 100%;
  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: #f7f7f7;
}

nav#nav .nav-menu-title {
  padding: 2rem 3.3rem 2rem 2rem;
  position: relative;
  color: #222;
  cursor: pointer;
  letter-spacing: -0.05rem;
  font-size: 1.5rem;
}

nav#nav .nav-menu-title::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-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: 0.5rem;
  height: 0.2rem;
  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;
}

section {
  padding: 9.5rem 2.5rem 2.5rem 22.5rem;
}

section .content-wrap {
  padding: 2.5rem;
}

footer {
  text-align: center;
  font-size: 1.3rem;
  color: #999999;
  /* padding: 2rem 0 3rem 20rem; */
  padding: 2rem 0 3rem 2rem;
}

footer .footer-logo {
  height: 1.5rem;
}

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

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: 1rem;
  background-position: center;
}

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

input[type="checkbox"] {
  background: url(/skin/img/round_checkbox_off.svg) no-repeat 0 0;
  background-size: 1.5rem;
  background-position: center;
}

input[type="checkbox"]:disabled {
  background: url(/skin/img/round_checkbox_off.svg) no-repeat 0 0;
  background-size: 1.5rem;
  background-position: center;
}

input[type="checkbox"]:checked {
  background: url(/skin/img/round_checkbox_on.svg) no-repeat 0 0;
  background-size: 1.5rem;
  background-position: center;
}

input[type="checkbox"]:checked:disabled {
  background: url(/skin/img/round_checkbox_on.svg) no-repeat 0 0;
  background-size: 1.5rem;
  background-position: center;
}

input[type="text"],
input[type="password"],
input[type="tel"] {
  border: 0.1rem solid #ddd;
  color: #222;
  padding: 0 1.5rem;
  width: 100%;
  height: 4.2rem;
  line-height: 4.2rem;
  border-radius: 1rem;
  font-size: 1.5rem;
  /* height: 3.5rem;
  border-radius: 0.5rem;
  font-size: 1.5rem; */
}

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

/* 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: 0.1rem solid #ddd !important;
  color: #222;
  padding: 1.5rem;
  resize: none;
  border-radius: 1rem;
  font-size: 1.5rem;
  line-height: 2rem;
}

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: 0.8rem;
  outline: none !important;
  border: 0.1rem solid #ddd;
  line-height: 1;
  color: #222;
  box-sizing: border-box;
  font-size: 1.4rem;
  min-width: 7rem;
  height: 3rem;
  padding: 0 0.8rem;
   */
  cursor: pointer;
  box-sizing: border-box;
  box-shadow: none;
  border: none;
}

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: 0.8rem;
}

input[type="submit"].btn-mini,
input[type="button"].btn-mini,
button.btn-mini,
a.btn-mini {
  font-size: 1.3rem;
  min-width: 5rem;
  height: 2.2rem;
  line-height: 2.2rem;
  border-radius: 0.5rem;
  cursor: pointer;
  padding: 0.8rem 0.8rem;
}

input[type="submit"].btn-small,
input[type="button"].btn-small,
button.btn-small,
a.btn-small {
  font-size: 1.4rem;
  min-width: 7rem;
  height: 3rem;
  padding: 0 0.8rem;
  line-height: 1.5rem;
  border-radius: 0.8rem;
  cursor: pointer;
}

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

input[type="button"].btn-medium,
button.btn-medium,
a.btn-medium {
  font-size: 1.5rem;
  min-width: 10rem;
  height: 4.2rem;
  line-height: 4.2rem;
  padding: 0 1.5rem;
  border-radius: 0.8rem;
  cursor: pointer;
}

input[type="submit"].btn-medium{
  font-size: 1.5rem;
  min-width: 18rem;
  height: 4.2rem;
  line-height: 4.2rem;
  padding: 0 1.5rem;
  border-radius: 0.8rem;
  cursor: pointer;
}

/* input[type="submit"].btn-large,
input[type="button"].btn-large,
button.btn-large,
a.btn-large */
*.btn-large {
  font-size: 1.8rem;
  min-width: 6rem;
  height: 6rem;
  line-height: 6rem;
  padding: 0 2rem;
  border-radius: 1.5rem;
  cursor: pointer;
}

input[type="submit"].primary,
input[type="button"].primary,
button.primary,
a.primary {
  background-color: var(--global-primary-color);
  border-color: var(--global-primary-color);
  color: #fff;
  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: #dcf4f5 !important;
  color: var(--global-point-color) !important;
  border: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

input[type="submit"].gray,
input[type="button"].gray,
button.gray,
a.gray {
  background-color: #efefef;
  border-color: #efefef;
  color: #444;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

input[type="submit"].green,
input[type="button"].green,
button.green,
a.green {
  background-color: #35B62C !important;
  border-color: #35B62C !important;
  color: #fff !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

input[type="submit"].mediumorchid,
input[type="button"].mediumorchid,
button.mediumorchid,
a.mediumorchid {
  background-color: #ba55d3 !important;
  border-color: #ba55d3 !important;
  color: #fff !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

input[type="submit"].black,
input[type="button"].black,
button.black,
a.black {
  background-color: #222;
  border-color: #222;
  color: #fff;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

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

input[type="submit"].outline.black,
input[type="button"].outline.black,
button.outline.black,
a.outline.black {
  background-color: #fff;
  border-color: #222;
  color: #222;
  border: 0.1rem solid;
  box-shadow: none !important;
  text-shadow: none !important;
  background-image: none;
}

input[type="submit"].outline.gray,
input[type="button"].outline.gray,
button.outline.gray,
a.outline.gray {
  background-color: #fff;
  border-color: #ddd;
  color: #222;
  border: 0.1rem 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: 10rem;
}

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;
  margin-left: 0.8rem;
}

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

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

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

.btn-wrap.has-bottom-margin {
  margin-bottom: 1.5rem;
}

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

.btn-wrap .notice_gray,
.btn-wrap .notice_red {
  font-size: 1.4rem !important;
  letter-spacing: -0.1rem;
  margin-left: 1rem;
  line-height: 1.8rem;
}

.star-wrap {
  display: block;
  width: 10.4rem;
  background-image: url(/skin/img/ic-star-off.png);
  background-size: 10.4rem;
  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: 10.4rem;
  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.5rem;
}

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

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

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

.tabs-menu {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  border-bottom: 0.1rem solid #f2f2f2;
  background-color: #fff;
  border-radius: 0.5rem;
  margin-bottom: 1rem;
}

.tabs-menu li {
  flex: 1;
  cursor: pointer;
}

.tabs-menu li .inner {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 1.8rem;
  color: #b2b2b2;
  padding: 1.5rem 0;
}

.tabs-menu li.active .inner {
  color: #222;
  position: relative;
}

.tabs-menu li.active .inner::after {
  content: "";
  display: block;
  width: 100%;
  height: 0.2rem;
  background-color: #222;
  position: absolute;
  bottom: -0.1rem;
  left: 0;
}

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

.tabs-menu.has-count li p+p {
  margin-top: 0.8rem;
  font-size: 1.5rem;
}

.item-form-container,
.data-form-container {
  padding: 2rem;
  background-color: #fff;
  border-radius: 1rem;
  margin-bottom: 2.5rem;
  position: relative;
  font-size: 1.6rem;
}

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

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

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

.data-container:not(.search-wrap) {
  min-height: 40rem;
}

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

.data-container:not(.search-wrap):not(.no-btn-wrap) .btn-wrap {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 5rem;
  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: 3.2rem;
  line-height: 3.2rem;
  background-color: #fff !important;
  color: #222 !important;
  font-size: 1.3rem;
  border-color: #222;
  border-radius: 0.3rem;
  padding: 0 1rem;
}

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

.list-data-container {
  padding: 1rem 2rem;
  background-color: #fff;
  border-radius: 0.5rem;
  position: relative;
}

.list-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 1.4rem;
  font-weight: 500;
  color: #222;
  letter-spacing: -0.1rem;
  padding: 0 0 1.5rem 0;
  height: 9.2rem;
}

.list-title.has-select-wrap {
  padding: 0.5rem 0 1rem 0;
}

.list-title li {
  flex: 1;
  text-align: center;
  padding: 0.5rem 1rem;
}

.list-data-container .list-item-wrap {
  min-height: 30rem;
}

.list-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 7rem;
  width: 100%;
  padding: 1rem 0;
  background-color: #f7f7f7;
  border-radius: 0.5rem;
  margin-bottom: 1.2rem;
  position: relative;
}

.list-item>div {
  flex: 1;
  text-align: center;
  font-size: 1.5rem;
  padding: 0.5rem 1rem;
}

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

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

.order-detail-label {
  font-weight: 500;
  font-size: 1.5rem;
  width: 15rem;
  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: 70rem;
}

.item-form-container .form-title {
  font-size: 1.8rem;
  font-weight: 500;
  margin-bottom: 2rem;
  width: 70rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.item-form-container .form-label {
  font-weight: 500;
  margin: 1rem 0;
  font-size: 1.5rem;
}

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

.item-form-container .category-wrap {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 120rem;
}

.item-form-container .category-wrap li {
  flex: 1;
  max-width: 12rem;
}

.item-form-container .category-wrap li label {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  cursor: pointer;
  position: relative;
}

.item-form-container .category-wrap li label input[type="checkbox"],
.item-form-container .category-wrap li label input[type="radio"] {
  position: absolute;
  z-index: 10;
  right: 1rem;
  top: 0;
  background: transparent;
  background-size: 1.8rem;
  width: 1.8rem;
  height: 1.8rem;
}

.item-form-container select {
  height: 4.2rem;
  line-height: 4.2rem;
}

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

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

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

.item-form-table .radio-inline input+span {
  margin-left: 0.5rem;
  font-size: 1.6rem;
}

.item-form-table label+label {
  margin-left: 1rem !important;
}

.item-form-table label {
  min-width: 10rem;
}

.item-form-table>tbody>tr>th,
.item-form-table>tbody>tr>td {
  vertical-align: middle;
  padding: 0.3rem 0;
}

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

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

.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: 1rem;
}

.item-form-table .flex-wrap+.flex-wrap {
  margin-top: 1rem;
}

.selected-category {
  margin-top: 4rem;
  max-width: 45rem;
}

.selected-category>h3 {
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
}

.selected-category li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 4.2rem;
  line-height: 4.2rem;
}

/* .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.png);
}
.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.png);
}
.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,
.item-form-container .category-wrap li label input[type="radio"]:checked {
  background-image: url(/skin/img/ic-round-check.png);
  background-size: 1.8rem;
  width: 1.8rem;
  height: 1.8rem;
}

.item-form-container .category-wrap li label img {
  width: 6rem;
}

.item-form-container .category-wrap li label p {
  text-align: center;
  margin-top: 0.5rem;
  letter-spacing: -0.1rem;
}

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

.item-form-container .radio-wrap label {
  height: 4.2rem;
  line-height: 4.2rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 38rem;
}

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

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

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

.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: 38rem;
}

.item-form-container .flex-wrap>p {
  min-width: 10rem;
}

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

.item-form-container .admin-file-wrap {
  margin: 0 1rem 0 0;
  border-radius: 0.5rem;
  /* overflow: hidden; */
  flex: none;
  width: 7rem;
  height: 7rem;
  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: 0.5rem;
  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: -0.5rem;
  top: -0.5rem;
  width: 2rem;
  height: 2rem;
  border-radius: 1rem;
  padding: 0 !important;
  background-color: var(--global-primary-color);
  border: 0.1rem 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-range-picker {
  flex: none;
  width: 23rem;
}

.item-option-table {
  margin: 2rem 0 1rem 0;
  width: 90rem;
}

.item-option-table th {
  height: 3rem;
  font-weight: 500;
  font-size: 1.4rem;
  text-align: center;
  letter-spacing: -0.05rem;
}

.item-option-table td {
  padding: 0.5rem;
}

.item-option-table td .input-prefix input[type="text"] {
  text-align: right;
}

.item-option-table input[type="text"] {
  height: 4.2rem !important;
}

.item-form-container .add-option-btn {
  border: none;
  font-size: 1.6rem !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
}

.item-form-container .add-option-btn img {
  width: 1.8rem;
  margin-right: 0.8rem;
  margin-left: 0.8rem;
  line-height: 1;
}

.item-form-container .add-option-btn span {
  line-height: 1;
  padding-top: 0.1rem;
}

/* item_form.php Style End */

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

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

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

.list-title li.thumb,
.list-item>div.thumb {
  width: 8rem;
  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: 10rem;
}

.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: 12rem;
}

.list-item>div.order-id .pay-date {
  font-size: 1.4rem;
  letter-spacing: -0.1rem;
  color: #666;
}

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

.list-title.no-check,
.list-item.no-check {
  padding-left: 1rem;
}

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

.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: 11rem;
}

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

.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: 15rem;
}

.list-title li select,
.list-item>div select {
  font-size: 1.3rem !important;
  width: 100%;
  border-radius: 0.4rem;
  height: 3.2rem !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: 1.3rem !important;
  width: 100%;
  margin: 0;
  height: 3.2rem !important;
  margin-top: 0.5rem;
}

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

.list-title .memo,
.list-item .memo {
  flex: none;
  width: 16rem;
}

.list-item>div {
  line-height: 1.3;
  letter-spacing: -0.05rem;
}

div.thumb a {
  display: block;
  width: 100%;
  border-radius: 0.5rem;
  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: 2.5rem !important;
  width: 100%;
}

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

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

.config-title:not(:first-child) {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px dashed #ddd;
}

.config-title span {
  margin-left: 1rem;
  color: #666;
  font-size: 1.4rem;
}

.config-title button span,
.config-title a span {
  color: inherit;
  font-size: inherit;
  margin-left: 0;
}

.config-title .back-btn {
  display: inline-block;
  width: 3rem;
  height: 3rem;
  background: url(/skin/img/ic-arrow-left-b.svg) top 50% left 0 / 53% no-repeat;
  vertical-align: middle;
  margin-top: -0.4rem;
}

.tool-tip {
  padding: 2rem;
  background-color: #fff;
  border-radius: 0.5rem;
  margin-bottom: 2.5rem;
  position: relative;
}

.tool-tip span {
  display: block;
  color: #666 !important;
}

.tool-tip .title {
  font-size: 1.5rem;
  letter-spacing: -0.1rem;
  color: var(--global-primary-color);
  font-weight: 500;
  margin-bottom: 1rem;
  position: relative;
  padding-left: 2.4rem;
  height: 2rem;
  line-height: 2rem;
}

.tool-tip .title::before {
  content: "";
  display: block;
  width: 1.8rem;
  height: 1.8rem;
  background: url(/skin/img/ic-exclamation-mark.svg) center / contain no-repeat;
  position: absolute;
  left: 0;
  top: 0;
}

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

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

.admin-file-wrap a {
  margin-left: 1rem;
  display: block;
  width: 3.4rem;
  height: 3.4rem;
  border-radius: 0.3rem;
  overflow: hidden;
}

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

/* COMMON END */

.period_wrap {
  display: flex;
  vertical-align: middle;
  height: 3.2rem;
  margin-top: 1rem;
}

.period_wrap label {
  border-radius: 0.8rem;
  overflow: hidden;
  border: none;
  background-color: #f2f2f2;
  padding: 0 1rem;
  color: #666;
  font-size: 1.3rem;
  cursor: pointer;
  display: block;
  height: 100%;
  line-height: 3.2rem;
}

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

.period_wrap label+label {
  margin-left: 0.8rem;
}

.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;
  background-color: #fff;
  border-radius: 1rem;
  padding: 2rem;
  height: 8rem;
  font-size: 1.6rem;
  text-align: center;
  flex: none;
  min-width: 25rem;
  margin-right: 2rem;
}

.count-wrap .total-count p:first-child {
  margin-right: 1.5rem;
}

.count-wrap .total-count.flex-1 {
  flex: 1;
  min-width: 0;
  margin-right: 1rem;
}

.count-wrap .total-count.active {
  border-radius: 0 0.5rem 0.5rem 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.3rem;
  background-color: var(--global-primary-color);
}

.count-wrap button.add-btn {
  padding: 0;
  height: 8rem;
  font-size: 1.8rem;
  width: 15rem;
  margin-right: 2rem;
  background-color: var(--global-primary-color);
  color: #fff;
  border: none;
  border-radius: 1rem;
  background-image: url(/skin/img/ic-write-w.png);
  background-position: top 50% left 2.6rem;
  background-repeat: no-repeat;
  letter-spacing: -0.05rem;
  background-size: 2rem;
  /* padding-left: 3rem; */
}

.count-wrap button.add-btn a {
  padding: 2rem 2rem 2rem 5.2rem;
}

.count-wrap .detail-count {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #fff;
  border-radius: 1rem;
  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;
  display: none;
}

.count-wrap .total-count span:not(.text) {
  font-size: 2.5rem;
  margin-right: 0.3rem;
  font-weight: normal;
  color: var(--global-primary-color);
}

.count-wrap .total-count span:not(.text).cancel {
  color: #f03141;
}

.count-wrap:not(.col) .total-count>p+p {
  margin-top: -0.6rem;
}

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

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

.count-wrap .detail-count li::after,
.count-wrap .detail-count a::after {
  content: "";
  display: block;
  width: 0.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.5rem;
  margin-bottom: 1rem;
}

.count-wrap .detail-count li .number,
.count-wrap .detail-count a .number {
  font-size: 1.6rem;
  /* font-weight: 500; */
}
.count-wrap .detail-count a .number span {
  font-size: 2rem;
}

.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;
  min-width: 0;
  font-size: 1.5rem;
}

.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;
  margin-right: 0;
}

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

.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);
}

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

.search-flex-wrap>select+select {
  margin-left: 1rem;
}

.search-input-button input[type="text"],
.search-select-input select {
  width: 10rem;
  flex: none;
  height: 4.2rem;
  line-height: 4.2rem;
  border-radius: 1rem 0 0 1rem;
  border-color: #ddd;
  border-right: none;
}

.search-input-button input[type="file"],
.search-input-button input[type="password"] {
  flex: none;
  max-width: 35rem;
  height: 4.2rem;
  line-height: 4.2rem;
  border-radius: 1rem 0 0 1rem;
  border-color: #ddd;
  border-right: none;
  padding: 0 1.5rem;
}

.search-select-input input {
  height: 4.2rem;
  line-height: 4.2rem;
  border-radius: 0 1rem 1rem 0;
  border-color: #ddd;
}

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

.search-input-select select {
  width: 10rem;
  flex: none;
  height: 4.2rem;
  line-height: 4.2rem;
  border-radius: 0 1rem 1rem 0;
  border-color: #ddd;
}

.search-input-select input {
  height: 4.2rem;
  line-height: 4.2rem;
  border-radius: 1rem 0 0 1rem;
  border-color: #ddd;
  border-right: none;
}

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

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

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

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

.search-range-picker {
  border-radius: 1rem;
  border: 0.1rem solid #ddd;
  overflow: hidden;
}

.search-range-picker input {
  height: 4.2rem;
  border: none !important;
  border-radius: 0;
  flex: 1;
  text-align: center;
}

.search-range-picker select {
  width: 14rem;
  flex: none;
  border: none;
  border-right: 0.1rem solid #ddd;
  height: 4.2rem;
  line-height: 4.2rem;
  border-radius: 1rem 0 0 1rem;
}

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

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

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

.range-input-wrap input {
  height: 4.2rem;
  line-height: 4.2rem;
  padding-right: 3.3rem;
}

.range-input-wrap .separator {
  padding: 0 1rem;
}

.input-suffix,
.input-prefix {
  position: relative;
}

.input-suffix input[type="text"],
.input-suffix input[type="password"] {
  padding-right: 2.8rem;
  width: 100%;
}

.input-prefix input[type="text"],
.input-prefix input[type="password"] {
  padding-left: 2.8rem;
  width: 100%;
}

.suffix {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.5rem;
  color: #222;
}

.prefix {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.5rem;
  color: #222;
}

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

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

.search-checkbox-wrap label span {
  padding-left: 1rem;
}

.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: 1rem;
}

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

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

.btn-wrap #calculateExceldown+#exceldown {
  margin-left: 1rem;
}

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

.btn-wrap .input-button {
  height: 4.2rem !important;
  margin-right: 0.8rem;
}

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

.btn-wrap .input-button input[type="button"] {
  border: none;
  height: 4.2rem !important;
}

.nfor_maxlength_wrap {
  display: flex;
  align-items: center;
  max-width: 40rem;
}

.nfor_maxlength_wrap span {
  margin-left: 1rem;
}

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

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

.line_gray {
  border-top: solid 0.1rem #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;
}

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

.martop60 {
  margin-top: 6rem !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;
}

.marleft0 {
  margin-left: 0 !important;
}

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

.marleft8 {
  margin-left: 0.8rem !important;
}

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

.marleft12 {
  margin-left: 1.2rem !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;
}

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

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

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

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

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

.margin0 {
  margin: 0rem !important;
}

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

.mar10 {
  margin: 1rem !important;
}

/*패딩*/
.padding5p {
  padding: 0.5rem 0rem 0rem 0rem;
}

/* 넓이 */
.width100p,
.width-100per {
  width: 100% !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-92p {
  width: 9.2rem !important;
  flex: none !important;
}

.width-95p {
  width: 9.5rem !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: 10.3rem !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-380p {
  width: 38rem !important;
  flex: none !important;
}

.width-400p {
  width: 40rem !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: 0.5rem;
  text-align: left !important;
}

/***********************************************
 ** 버튼
 ***********************************************/
.btn {
  border-radius: 0;
  padding: 0.5rem 1.2rem 0.4rem;
  user-select: none;
  -webkit-user-select: none;
}

.btn-th {
  border-radius: 0;
  padding: 0rem 0.5rem 0.5rem !important;
  width: 3.7rem;
  font-size: 1.1rem !important;
  height: 2.7rem !important;
  line-height: 2.5rem !important;
}

.btn-lg {
  padding: 0.9rem 1.6rem 0.8rem 1.6rem !important;
  font-size: 1.3rem;
  line-height: 1.3333333;
  border-radius: 0;
}

.btn-sm {
  padding: 0.2rem 0.5rem 0.3rrem;
  font-size: 1.1rem;
  line-height: 1.5;
  border-radius: 0;
}

.btn-sml {
  padding: 0.5rem 0.5rem 0.6rem;
  font-size: 1.1rem;
  line-height: 1.5;
  border-radius: 0;
}

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

.btn-gray:hover,
.btn-gray:focus {
  background-color: #999999;
  background-position: 0 -1.5rem;
  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: 3.6rem !important;
  padding: 1.2rem 1.2rem;
  border: 0.1rem solid #666666 !important;
  font-weight: bold !important;
}

.btn-snone {
  border-radius: 0;
  height: 2rem !important;
  color: #fa2828 !important;
  border: 0.1rem solid #fa2828 !important;
  font-size: 1.1rem !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 -1.5rem;
  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/download.png) no-repeat 0.5rem 50%;
  padding-left: 3.2rem;
  background-size: 2.5rem;
}

/* .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: 2.5rem;
  height: 2.5rem;
  border: solid 0.1rem #dcdcdc;
  margin-left: -0.1rem;
  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: 1rem;
}

.martop20 {
  margin-top: 2rem;
}

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

.pagination>li {
  display: inline;
}

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

.pagination>li>a,
.pagination>li>span {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  padding: 0;
  line-height: 3rem;
  border-radius: 0.3rem;
  border: 0.1rem solid #ddd !important;
  text-align: center;
  color: #222;
  font-size: 1.4rem;
  letter-spacing: -0.1rem;
  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: 0.5rem;
}

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

.checkbox-inline label {
  cursor: pointer;
  margin-right: 1.5rem;
}

.checkbox-inline label span {
  padding-left: 1.5rem !important;
  font-size: 1.6rem;
}

/***********************************************
 ** 테이블
 ***********************************************/
.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: 0.1rem solid #eee;
}

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

.list-table tr>td,
.row_tbl tr>td {
  padding: 1.5rem 0.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: 0.5rem;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.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: 128rem; */
  width: 100%;
}

.table tr>th,
.table tr>td,
.cols_tbl tr>th,
.cols_tbl tr>td,
.column-table tr>th,
.column-table tr>td {
  padding: 0.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.2rem;
  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 0.5rem 0 0;
}

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


/* 넓이 */
.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: 3rem !important;
}

.width-3xs {
  width: 6rem !important;
}

.width-2xs {
  width: 7rem !important;
}

.width-xs {
  width: 10rem !important;
}

.width-sm {
  width: 13rem !important;
}

.width-md {
  width: 15rem !important;
}

.width-lg {
  width: 20rem !important;
}

.width-xl {
  width: 25rem !important;
}

.width-2xl {
  width: 40rem !important;
}

.width-3xl {
  width: 60rem !important;
}

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

.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 1rem;
  color: #333;
  font-size: 1.5rem;
  font-weight: bold;
}

.ofw {
  overflow: hidden;
  margin-bottom: 1rem;
}

.flol {
  float: left;
}

.flor {
  float: right;
}

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

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

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

.bootstrap-dialog .modal-content {
  padding: 2.5rem;
  border-radius: 0;
}

.bootstrap-dialog .modal-body {
  padding: 1.5rem 0 0;
}

.bootstrap-dialog .modal-footer {
  text-align: center;
  margin-top: 1.5rem;
}

.bootstrap-dialog .modal-header {
  border-radius: 0;
  padding: 0 0 1.4rem;
  border-bottom: 0.1rem solid #222;
}

.bootstrap-dialog .modal-header.no-line {
  border-bottom: 0;
}

.bootstrap-dialog .modal-header .close {
  background: url(/skin/img/closeicon.gif) no-repeat 50% 50%;
  text-indent: -900rem;
  width: 2.2rem;
  height: 2.2rem;
  opacity: 1;
}

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

.bootstrap-dialog .bootstrap-dialog-message {
  font-size: 1.2rem;
}

.bootstrap-dialog .bootstrap-dialog-button-icon {
  margin-right: 0.3rem;
}

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

.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: 2.4rem;
}

.bootstrap-dialog.size-large .bootstrap-dialog-close-button {
  font-size: 3rem;
}

.bootstrap-dialog.size-large .bootstrap-dialog-message {
  font-size: 1.8rem;
}

.line50 {
  display: block;
  line-height: 1.8rem;
  margin: 1rem 0rem;
  font-weight: normal;
  color: #666;
  font-size: 1.4rem !important;
}

.notice_red {
  color: var(--global-primary-color) !important;
  letter-spacing: -0.1rem !important;
  padding: 0.5rem !important;
  font-size: 1.4rem !important;
}

.notice_gray {
  color: #666 !important;
  letter-spacing: -0.1rem !important;
  font-weight: normal !important;
  padding: 0.5rem !important;
}

.mar5 {
  margin: 0.5rem;
}

.marb5 {
  margin-bottom: 0.5rem;
}

.mar-left150 {
  margin-left: 15rem;
}

.switch-wrap {
  flex: none;
  /* position: absolute;
  right: 0;
  top: 0; */
  text-align: center;
  width: 48px;
}

.switch-state {
  font-size: 1.3rem;
  color: #b2b2b2;
  text-align: center;
  margin-top: 0.5rem;
  letter-spacing: -0.1rem;
}

.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::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.off::before {
  animation-name: switchOff;
}

.switch.active::before {
  background-color: var(--global-primary-color);
  left: 18px;
}

.switch.setting::before {
  width: 1.7rem;
  height: 1.7rem;
  background-color: #fff !important;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  box-shadow: 0rem 0.2rem 0.7rem 0 rgba(180, 180, 180, 0.6);
}

.switch.setting.active::before {
  box-shadow: 0.2rem 0.25rem 0.7rem 0 rgba(255, 72, 130, 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;
}

.toast-message {
  background-color: rgba(0, 0, 0, 0.7);
  color: #fff;
  border-radius: 10.4rem;
  position: fixed;
  top: 5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10000;
  padding: 1.8rem 5.6rem;
  font-size: 1.8rem;
  letter-spacing: -0.1rem;
  min-width: 30rem;
  text-align: center;
  opacity: 0;
  animation: fadeIn 0.2s;
  -moz-animation: fadeIn 0.2s;
  /* Firefox */
  -webkit-animation: fadeIn 0.2s;
  /* Safari and Chrome */
  -o-animation: fadeIn 0.2s;
  /* Opera */
  animation-timing-function: ease-in;
  animation-fill-mode: both;
}

.toast-message.off {
  animation: fadeOut 0.2s;
  -moz-animation: fadeOut 0.2s;
  /* Firefox */
  -webkit-animation: fadeOut 0.2s;
  /* Safari and Chrome */
  -o-animation: fadeOut 0.2s;
  /* Opera */
}

/* login.php Style */
.join-wrap,
.login-wrap {
  height: 100%;
  display: flex;
  align-items: center;
}

.join-form,
.login-form {
  width: 35%;
  position: relative;
  flex: none;
  height: 100%;
  padding: 5.2rem;
}

.login-form form {
  width: 55%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.login-form .move-to-wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 1.5rem;
  color: #222 !important;
}

.login-label {
  font-size: 1.5rem;
  color: #666;
  margin: 1rem 0;
}

.login-input-wrap {
  width: 100%;
  position: relative;
}

.login-input-wrap::before {
  display: block;
  content: "";
  width: 1.8rem;
  height: 1.8rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 2rem;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.login-input-wrap.id::before {
  background-image: url(/skin/img/ic-mail.png);
}

.login-input-wrap.pwd::before {
  background-image: url(/skin/img/ic-lock.png);
}

.login-input-wrap input {
  font-size: 1.5rem;
  color: #222;
  height: 6rem !important;
  width: 100%;
  background-color: #fff;
  border-radius: 0.5rem;
  padding: 0 1.5rem 0 6rem !important;
  border: 0.1rem solid rgb(217, 217, 217);
}

.login-input-wrap input::placeholder {
  font-size: 1.5rem;
  color: #b2b2b2;
}

.join-wrap .app-logo,
.login-wrap .app-logo {
  width: 20rem;
  /* margin: 52px 0 0 52px; */
}

.login-wrap .logo-wrap {
  display: block;
  text-align: center;
}

.join-wrap .member_login_btn,
.login-wrap .member_login_btn {
  width: 100%;
  height: 5rem !important;
  border-radius: 1.4rem;
}

.join-wrap .checkbox-wrap,
.login-wrap .checkbox-wrap {
  padding: 2rem 0;
  font-size: 1.4rem;
  line-height: 1.5;
  color: #666;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.join-wrap .checkbox-wrap label span,
.login-wrap .checkbox-wrap label span {
  padding-left: 0.5rem;
  cursor: pointer;
}

.welcome-wrap {
  flex: 1;
  background-color: #222;
  height: 100%;
  background-image: url(/skin/img/login-bg.png);
  background-position: 50% 0rem;
  background-size: auto 100%;
  background-repeat: no-repeat;
  position: relative;
}

.welcome-wrap.pro {
  background-image: url(/skin/img/login-bg.png);
}

.welcome-txt {
  position: absolute;
  top: 35%;
  left: 7.8rem;
}

.welcome-txt .welcome-title {
  font-size: 4.8rem;
  color: #fff;
  line-height: 1;
  font-weight: 300;
  letter-spacing: -0.1rem;
}

.welcome-txt .welcome-title span {
  color: var(--global-primary-color);
}

.welcome-txt .welcome-descript {
  font-size: 1.8rem;
  color: rgba(255, 255, 255, 0.5);
  margin-top: 0.8rem;
  line-height: 1;
  font-weight: 100;
}

.social-login-wrap {
  padding: 2rem 0;
}

.social-login-wrap li {
  width: 100%;
}

.social-login-wrap li:not(:last-child) {
  margin-bottom: 1.2rem;
}

.social-login-wrap li a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 5rem;
  color: inherit;
  text-align: center;
  position: relative;
  border-radius: 1.4rem;
}

.social-login-wrap li a::before {
  content: "";
  display: block;
  position: absolute;
  left: 2rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5rem;
  height: 2.5rem;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
}

.social-login-wrap a.naver {
  background-color: #1ec800;
  color: #fff;
}

.social-login-wrap a.naver::before {
  background-image: url(/skin/img/ic-naver-login.png);
}

.social-login-wrap a.kakao {
  background-color: #fee500;
}

.social-login-wrap a.kakao::before {
  background-image: url(/skin/img/ic-kakao-login.png);
}

.social-login-wrap a.facebook {
  background-color: #4e71a8;
  color: #fff;
}

.social-login-wrap a.facebook::before {
  background-image: url(/skin/img/ic-facebook-login.png);
}

.social-login-wrap a.google {
  background-color: #fff;
  box-shadow: -0.16rem 0.25rem 0.99rem 0.01rem rgba(0, 0, 0, 0.09);
}

.social-login-wrap a.google::before {
  background-image: url(/skin/img/ic-google-login.png);
}

.social-login-wrap a.apple {
  background-color: #000;
  color: #fff;
}

.social-login-wrap a.apple::before {
  background-image: url(/skin/img/ic-apple-login.png);
}

/* login.php Style End */

/* join.php Style */
.join-title {
  font-size: 2.2rem;
  font-weight: 500;
  color: #222;
  margin-top: 1.5rem;
}

.join-title span {
  color: var(--global-primary-color);
}

.join-form form {
  max-width: 40rem;
  margin: 0 auto;
}

.join-form ul.form-list {
  padding-top: 7rem;
  width: 100%;
}

.join-form ul.form-list li {
  display: flex;
  align-items: center;
  width: 100%;
}

.join-form ul.form-list li:not(:last-child) {
  margin-bottom: 1.5rem;
}

.join-form ul.form-list li h3 {
  font-size: 1.5rem;
  letter-spacing: -0.1rem;
  font-weight: normal;
  color: #222;
  display: inline-block;
  width: 11rem;
  flex: none;
  margin-right: 0.5rem;
}

.mb_join_row>input,
.mb_join_row .has-btn-input>input,
.mb_join_row #mb_zipcode,
.mb_join_row #mb_cp_zipcode {
  height: 4.5rem;
  font-size: 1.5rem;
  color: #222;
  flex: 1;
  box-sizing: border-box;
  padding: 0;
}

.join-form ul.form-list li input[type="text"],
.join-form ul.form-list li input[type="password"] {
  height: 4.5rem;
  font-size: 1.5rem;
  color: #222;
  flex: 1;
  box-sizing: border-box;
}

.join-form ul.form-list li input::placeholder,
.mb_join_row input::placeholder {
  font-size: 1.5rem;
  color: #b2b2b2;
}

.join-chk-wrap label {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.join-chk-wrap label>input[type="checkbox"] {
  margin-right: 1rem !important;
}

.join-form ul.form-list li .inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.join-form ul.form-list li .inner button {
  background-color: #b2b2b2;
  color: #fff;
  font-size: 1.3rem;
  letter-spacing: -0.05rem;
  cursor: default;
}

.join-form ul.form-list li .inner button.active {
  background-color: var(--global-primary-color);
  border-color: var(--global-primary-color);
  cursor: pointer;
}

.join-form ul.form-list li.asign-send-wrap.confirmed button {
  display: none;
}

.join-form ul.form-list li.asign-send-wrap.confirmed input {
  border-radius: 0.5rem !important;
  border-right: 0.1rem solid #ddd;
}

.join-form ul.form-list li.asign-send-wrap.confirmed+.asign-confirm-wrap {
  display: none;
}

.join-form .join-btn-wrap {
  margin-top: 4rem;
  margin-bottom: 1.5rem;
}

.join-form .join-btn-wrap button {
  display: block;
  margin: 0 auto;
  width: 100%;
  height: 6rem;
  font-size: 1.7rem;
}

.join-form .move-to-wrap {
  text-align: right;
}

/* join.php Style End */

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

.report-wrap:not(:first-child) {
  margin-top: 2rem;
}

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

.report-wrap .report-container {
  border-radius: 0.5rem;
  flex: 1;
  padding: 1.5rem;
  background-color: #fff;
}

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

.report-wrap .report-container+.report-container {
  margin-left: 2rem;
}

.report-wrap .report-container>.title {
  font-size: 1.8rem;
  font-weight: 500;
  color: #222;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  letter-spacing: -0.05rem;
  margin-bottom: 3rem;
}

.report-wrap .report-container>.title span {
  margin-right: 3rem;
}

.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: 10rem;
  margin: 0 auto 2rem 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: 2.4rem;
}

.report-wrap .member-summary li p,
.report-wrap .order-summary li p {
  text-align: center;
  font-size: 1.7rem;
  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: 4.5rem;
}

.index-wrap .product-count li .title {
  font-size: 1.5rem;
  letter-spacing: -0.05rem;
  margin-bottom: 2rem;
}

.index-wrap .product-count li .count {
  font-size: 2.5rem;
  cursor: pointer;
}

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

.index-wrap .order-list table th {
  font-weight: normal;
  padding: 0.8rem 0.5rem;
  text-align: left;
}

.index-wrap .order-list table td {
  padding: 1rem 0.5rem;
}

.index-wrap .notice-list {
  min-height: 15rem;
}

.index-wrap .qna-list li,
.index-wrap .notice-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 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;
}

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

.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: 1.4rem;
  letter-spacing: -0.1rem;
  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: 1.4premx;
  letter-spacing: -0.1rem;
}

.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: 2rem;
}

.qna-form-list.flex-column {
  align-items: flex-start;
}

.qna-form-wrap .qna-form-list h4 {
  font-size: 1.5rem;
  letter-spacing: -0.1rem;
  flex: none;
  min-width: 15rem;
}

.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: 1.5rem;
}

.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: 8rem;
  border-radius: 0.5rem;
  margin-right: 1rem;
}

.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: 2rem;
  padding-left: 15rem;
}

/* 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: 1.5rem;
  color: #222;
  flex: none;
  width: 50%;
  min-height: 4.5rem;
  padding: 1rem 0;
}

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

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

.setting-wrap li .zipcode-wrap {
  margin-bottom: 0.5rem;
}

.setting-wrap li .qna-btn {
  margin-left: 1rem;
}

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

.setting-wrap li .setting-flex input+input {
  margin-left: 1rem;
}

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

.p_msg {
  font-size: 1.4rem;
  letter-spacing: -0.1rem;
  line-height: 1.45;
}

.p_msg.p_msg_success {
  color: #006bbd !important;
  padding-left: 1.5rem;
  padding-top: 0.5rem;
  display: block;
}

.p_msg,
.p_msg_error {
  color: var(--global-primary-color) !important;
  display: block !important;
  font-size: 1.3rem !important;
  margin: 0 !important;
  padding: 0.5rem 1.5rem !important;
}

/* setting.php Style End */

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

.form-control[disabled]:not(.datepicker-here),
.form-control[readonly]:not(.datepicker-here) {
  cursor: not-allowed;
}

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

/* .data-list-wrap.has-btn {
  padding-bottom: 11.2rem;
}

.data-list-wrap.has-btn .btn-wrap {
  margin-top: 0 !important;
  position: absolute;
  left: 50%;
  bottom: 6.5rem;
  transform: translateX(-50%);
  width: 100%;
} */

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

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

.data-list-table {
  width: 100%;
  color: #222;
  /* table-layout: fixed; */
}

.data-list-table>thead th {
  font-weight: normal;
  padding: 0 0.5rem;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: -0.1rem;
  text-align: center;
  height: 5rem;
  vertical-align: middle;
}


.data-list-table>tbody td {
  position: relative;
  vertical-align: middle;
  padding: 0rem 0rem 1rem !important;
}

.data-list-table>tbody td:first-child::before,
.data-list-table>tbody td:first-child::after,
.data-list-table>tbody td:last-child::before,
.data-list-table>tbody td:last-child::after {
  display: block;
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  position: absolute;
  background-size: 100%;
  z-index: 10;
}

.data-list-table>tbody td:first-child::before {
  left: 0;
  top: 0;
  background-image: url(/skin/img/first-before.svg);
}

.data-list-table>tbody td:first-child::after {
  left: 0;
  bottom: 1rem;
  background-image: url(/skin/img/first-after.svg);
}

.data-list-table>tbody td:last-child::before {
  right: 0;
  top: 0;
  background-image: url(/skin/img/last-before.svg);
}

.data-list-table>tbody td:last-child::after {
  right: 0;
  bottom: 1rem;
  background-image: url(/skin/img/last-after.svg);
}

.data-list-table>tbody td>.inner {
  width: 100%;
  padding: 1rem 0.5rem;
  min-height: 7rem;
  position: relative;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  color: rgb(34, 34, 34);
  font-size: 1.3rem;
  font-weight: normal;
  letter-spacing: -0.05rem;
}

.data-list-table>thead th.title {
  text-align: left;
}

.data-list-table>tbody td .order-item-info {
  font-size: 1.5rem;
  color: #222;
  width: 100%;
}

.data-list-table>tbody td .order-item-info h2 {
  font-weight: normal;
  line-height: 1.5;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.data-list-table>tbody td .order-item-info h2 span {
  font-size: 1.4rem;
  color: #888;
  display: block;
  margin-bottom: 0.5rem;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.data-list-table>tbody td .order-item-info p {
  padding-left: 1.5rem;
  position: relative;
  font-size: 1.4rem;
  line-height: 1.35;
  margin-top: 0.5rem;
  color: #666;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.data-list-table>tbody td .order-item-info p span {
  display: inline-block;
  margin-right: 1rem;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.data-list-table>tbody td .order-item-info p::before {
  content: "";
  display: block;
  width: 4px;
  height: 1px;
  background-color: #888;
  position: absolute;
  left: 0;
  top: 9px;
}

.data-list-table>tbody td>.inner.col {
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.data-list-table>tbody td.title>.inner,
.data-list-table>tbody td>.inner.title {
  /* justify-content: flex-start; */
  overflow: hidden;
  text-overflow: ellipsis;
  /* white-space: break-spaces; */
  flex-wrap: wrap;
  text-align: left;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.5;
}

.data-list-table>tbody td>.inner.title .description {
  color: #666;
  font-size: 1.4rem;
  margin-top: 1rem;
}

.data-list-table>thead th.price {
  text-align: right;
  padding-right: 1.5rem;
}

.data-list-table>tbody td>.inner.price {
  justify-content: flex-end;
  text-align: right;
  padding-right: 1.5rem;
}

.data-list-table>tbody td>.inner.option-btn {
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.data-list-table>tbody td>.inner.option-btn>button {
  width: 90%;
  height: 2.5rem;
  margin-left: 0 !important;
  flex: none;
  font-size: 1.3rem;
}

.data-list-table>tbody td>.inner.thumb {
  max-width: 9rem;
  margin: 0 auto;
}

.data-list-table>tbody td>.inner>.state {
display: block;
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    background-color: #b2b2b2;
    color: #fff;
    line-height: 1.1rem;
    text-align: center;
    letter-spacing: -0.07rem;
    font-size: 1.1rem;
    font-weight: 500;
    padding-top: 20px;
}

.data-list-table>tbody td>.inner>.state.asign {
  background-color: var(--global-primary-color);
}

.data-list-table>tbody td>.inner>.state.cancel {
  background-color: #ff5252;
}

.data-list-table>tbody td>.inner>.state.reservation1 {
  background-color: rgb(214, 255, 255);
  color: #333;
}

.data-list-table>tbody td>.inner>.state.reservation2 {
  background-color: rgb(174, 228, 255);
  color: #333;
}

.data-list-table>tbody td>.inner>.state.reservation3 {
  background-color: rgb(253, 250, 135);
  color: #333;
}

.data-list-table>tbody td>.inner>.state.reservation4 {
  background-color: rgb(190, 233, 180);
  color: #333;
}

.data-list-table>tbody td>.inner>.state.reservation5 {
  background-color: rgb(255, 175, 176);
  color: #333;
}

.data-list-table>tbody td>.inner>.state.reservation6 {
  background-color: #616161;
}

.data-list-table>tbody td>.inner>.state.reservation9 {
  background-color: #37474f;
}

.data-list-table .gray-txt {
  color: #888;
  font-size: 1.4rem;
}

.data-list-table .red-txt {
  color: #d50000;
  font-size: 1.4rem;
}

.data-list-table input {
  font-size: 1.4rem;
  height: 3.7rem;
  line-height: 3.7rem;
  margin: 0 auto;
}

.data-list-table select {
  font-size: 1.3rem !important;
  width: 90%;
  border-radius: 0.5rem;
  height: 3.7rem !important;
  line-height: 3.7rem;
  margin: 0 auto;
}

.data-list-table .select-wrap {
  display: flex;
  align-items: center;
  width: 100%;
}

.data-list-table .select-wrap+.select-wrap {
  margin-top: 0.5rem;
}

.data-list-table .select-wrap>select {
  flex: 1;
}

.data-list-table .select-wrap>p {
  width: 5.5rem;
  padding-right: 0.5rem;
  text-align: right;
}

.data-list-table .select-wrap select {
  width: auto;
}

.data-list-table>thead th.select button {
  font-size: 1.3rem !important;
  width: 90%;
  margin: .5rem 0 .8rem 0;
  height: 3.2rem !important;
  border-radius: 0.5rem;
}

.data-list-table>thead th.select input[type="button"] {
  font-size: 1.3rem !important;
  width: 90%;
  border-radius: 0.5rem;
  margin: 0.5rem 0 0.8rem 0;
  height: 3.2rem !important;
  line-height: 3.2rem;
}

.data-list-table>tbody td>.inner.select {
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.data-list-table>thead th.select input[type="text"] {
  font-size: 1.3rem !important;
  width: 90%;
  margin: 0 auto;
  height: 3.2rem !important;
  border-radius: 0.5rem;
}

.data-list-table>thead th.select input[type="text"]::placeholder {
  font-size: 1.3rem;
}

.data-list-table>tbody td>.inner.select input[type="text"] {
  font-size: 1.3rem !important;
  width: 90%;
  margin: 0;
  height: 3.2rem !important;
  margin-top: 0.5rem;
  border-radius: 0.5rem;
}

.data-list-table>tbody td>.inner.select button {
  margin-top: 0.5rem;
  width: 90%;
  height: 2.8rem;
  border-radius: 0.5rem;
}

.copy-btn,
.edit-btn,
.print-btn,
.del-btn,
.sms-btn,
.caption-btn,
.download-btn,
.item-btn {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.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.svg);
  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.png);
  background-size: 60%;
}

.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%;
}

.download-btn {
  background-color: #fff;
  background-image: url(/skin/img/download.png);
  background-size: 80%;
  border: #333 solid 1px;
}

.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;
}

/* List Table Style (New) End */

/* Form Style */
.form-wrap {
  padding: 2rem;
  background-color: #fff;
  border-radius: 0.5rem;
}

.form-wrap+.form-wrap {
  margin-top: 2.5rem;
}

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

.form-wrap .form-table th {
  font-size: 1.5rem;
  font-weight: 500;
  color: #222;
  letter-spacing: -0.05rem;
  vertical-align: middle;
}

.form-wrap .form-table td {
  padding: 1rem 0.5rem;
  vertical-align: middle;
}

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

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

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

@media (min-width: 760px) {

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

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

  .join-form ul.form-list li .inner button {
    height: 4.5rem !important;
    flex: none !important;
    display: block;
    border-radius: 0 0.5rem 0.5rem 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;
}


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

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

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

.tabs li.active::after,
.tabs>a.active::after {
  display: block;
  content: "";
  width: 100%;
  height: 0.2rem;
  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.05rem solid #444;
}

/* postcode_dialog.php */
.postcode-dimmed * {
  box-sizing: border-box;
}

.postcode-dimmed {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 9999;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.55);
}

.postcode-wrap {
  display: block;
  width: 50rem;
  height: 80%;
  box-sizing: border-box;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.postcode-wrap .inner {
  height: calc(100% - 5.5rem);
}

.postcode-wrap .title {
  width: 100%;
  height: 5.4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.postcode-wrap .title span {
  font-weight: bold;
  font-size: 1.8rem;
  color: #222;
}

.postcode-wrap .zipcode-search-wrap {
  display: flex;
  align-items: center;
  border-bottom: 0.1rem solid #222;
  padding: 0.5rem 0;
}

.postcode-wrap .zipcode-search-wrap input {
  flex: 1;
  border: none;
  padding: 0 1rem;
}

.postcode-wrap .zipcode-search-wrap button {
  flex: none;
  display: block;
  width: 6rem;
  height: 4.5rem;
  border: none;
  background-color: #fff;
  background: url(/skin/img/m/ic-search-black.png) center no-repeat;
  background-size: 50%;
}

.postcode-wrap .address-list {
  padding: 1rem 0;
}

.postcode-wrap .address-list li {
  padding: 1rem 2rem;
}

.postcode-wrap .address-list li.empty {
  padding-top: 50%;
  text-align: center;
  color: #b2b2b2;
  background: url(/skin/img/m/bg_no_result03.png) no-repeat;
  background-position: center 62%;
  background-size: 19%;
}

.dialog-close-btn {
  width: 4rem;
  height: 4rem;
  border: none;
  background-color: transparent;
  position: relative;
  margin-left: auto;
  position: absolute;
  top: 0;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
}

.dialog-close-btn::before,
.dialog-close-btn::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  /* transform: translate(-50%, -50%); */
  background-color: #222;
  width: 0.2rem;
  height: 50%;
  border-radius: 0.5rem;
}

.dialog-close-btn::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.dialog-close-btn::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* postcode_dialog.php */

.layout_frame {
  padding: 11.5rem 1rem 0rem 0rem;
}



/* =====================================  */
.scroll {
  overflow-y: scroll;
}

.scroll::-webkit-scrollbar {
  width: 0.5rem;
}

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

.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: 0rem !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;
}

.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: 4.2rem !important;
  border-radius: 1rem 0 0 1rem !important;
  border-color: #ddd;
  border-right: none;
}

.select-button select,
.select-input select {
  width: 10rem;
}

.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: 4.2rem !important;
  border-radius: 0 1rem 1rem 0 !important;
}

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

.multi-select select {
  flex: none;
  height: 3.4rem !important;
  border-radius: 0.4rem;
  border: 0.1rem solid #ddd;
}

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

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

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

.input-input input+input {
  border-radius: 0 0.4rem 0.4rem 0;
  border-right: 0.1rem solid #ddd;
}

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

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

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

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

.range-picker {
  border-radius: 0.4rem;
  border: 0.1rem solid #ddd;
  overflow: hidden;
  border-radius: 1rem;
}

.range-picker input {
  height: 4.2rem;
  border: none !important;
  border-radius: 0;
  flex: 1;
  text-align: center;
}

.range-picker select {
  width: 10rem;
  flex: none;
  border: none;
  border-right: 0.1rem solid #ddd;
  height: 4.2rem;
  border-radius: 0;
}

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

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

span+.input-suffix {
  margin-left: 0.5rem;
}

.input-suffix+span {
  margin-left: 0.5rem;
}

.form-inline>select+select,
.form-inline>select+input,
.form-inline>input+input,
.form-inline>input+select {
  margin-left: 1rem;
}

/* List Table Style (New) */
.data-list-table {
  width: 100%;
  color: #222;
  /* table-layout: fixed; */
}

.data-list-table>thead th {
  font-weight: normal;
  padding: 0 0.5rem;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: -0.1rem;
  text-align: center;
  height: 5rem;
  vertical-align: middle;
}

.data-list-table>thead th.title {
  text-align: left;
}

.data-list-table>tbody tr:not(.empty) {
  background-image: url(../img/list-bg.png);
  background-repeat: no-repeat;
  background-size: 100% calc(100% - 1.5rem);
}

.data-list-table>tbody td {
  position: relative;
  vertical-align: middle;
  padding: 0rem 0rem 1.5rem !important;
}

.data-list-table>tbody td:first-child::before,
.data-list-table>tbody td:first-child::after,
.data-list-table>tbody td:last-child::before,
.data-list-table>tbody td:last-child::after {
  display: block;
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  position: absolute;
  background-size: 100%;
  z-index: 10;
}

.data-list-table>tbody td:first-child::before {
  left: 0;
  top: 0;
  background-image: url(../img/first-before.svg);
}

.data-list-table>tbody td:first-child::after {
  left: 0;
  bottom: 1.5rem;
  background-image: url(../img/first-after.svg);
}

.data-list-table>tbody td:last-child::before {
  right: 0;
  top: 0;
  background-image: url(../img/last-before.svg);
}

.data-list-table>tbody td:last-child::after {
  right: 0;
  bottom: 1.5rem;
  background-image: url(../img/last-after.svg);
}

.data-list-table>tbody td>.inner {
  width: 100%;
  padding: 1rem 0.5rem;
  min-height: 7rem;
  position: relative;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  color: rgb(34, 34, 34);
  font-size: 1.4rem;
  font-weight: normal;
  letter-spacing: -0.05rem;
}

.data-list-table>tbody td>.inner.col {
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.data-list-table>tbody td.title>.inner.col {
  align-items: flex-start;
  justify-content: center;
}

.data-list-table>tbody td.title>.inner {
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  text-align: left;
  /* justify-content: flex-start; */
  flex-wrap: wrap;
}

.data-list-table>tbody td.title>.inner.content {
  line-height: 1.5;
}

.data-list-table>thead th.price {
  text-align: right;
  padding-right: 1.5rem;
}

.data-list-table>tbody td.price>.inner {
  justify-content: flex-end;
  text-align: right;
  padding-right: 1.5rem;
}

.data-list-table>tbody td.option-btn>.inner {
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.data-list-table>tbody td.option-btn>.inner>button {
  width: 90%;
  height: 2.5rem;
  margin-left: 0 !important;
  flex: none;
  font-size: 1.3rem;
}

.data-list-table>tbody td>.inner.col>button+button {
  margin-left: 0;
  margin-top: 0.5rem;
}

.data-list-table>tbody td.thumb>.inner {
  max-width: 8.5rem;
  margin: 0 auto;
}

.data-list-table>tbody td.thumb a {
  display: block;
  width: 100%;
  border-radius: 0.5rem;
}

.data-list-table>tbody td.thumb a::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

.data-list-table .txt-overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.data-list-table>tbody td>.inner.video {
  /* max-width: 150px; */
  margin: 0 auto;
}

.data-list-table>tbody td>.inner.video a {
  width: 15rem;
  height: 8rem;
  border-radius: 0.5rem;
}

.data-list-table .gray-txt {
  color: #888;
  font-size: 1.4rem;
}

.data-list-table .point {
  color: var(--global-primary-color);
}

.data-list-table .select-wrap {
  display: flex;
  align-items: center;
  width: 100%;
}

.data-list-table .select-wrap+.select-wrap {
  margin-top: 0.5rem;
}

.data-list-table .select-wrap>select {
  flex: 1;
}

.data-list-table .select-wrap>p {
  width: 5.5rem;
  padding-right: 0.5rem;
  text-align: right;
}

.data-list-table .select-wrap select {
  width: auto;
}

.data-list-table>thead th.select input[type="button"] {
  font-size: 1.3rem !important;
  width: 90%;
  margin: 0.5rem 0 0.8rem 0;
  height: 3.2rem !important;
}

.data-list-table>tbody td.select>.inner {
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.data-list-table>thead th.select input[type="text"] {
  font-size: 1.3rem !important;
  width: 90%;
  margin: 0 auto;
  height: 3.2rem !important;
}

.data-list-table>tbody td.select>.inner input[type="text"] {
  font-size: 1.3rem !important;
  width: 90%;
  margin: 0;
  height: 3.2rem !important;
  margin-top: 0.5rem;
}

.data-list-table>tbody td.select>.inner button {
  margin-top: 0.5rem;
  width: 90%;
  height: 2.5rem;
}

.data-list-table .btn-mini {
  line-height: 1.1;
  height: auto;
  min-width: 7.2rem !important;

}

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

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

/* List Table Style (New) */

/* media Style */
.media-wrap {
  display: flex;
  align-items: center;
  padding: 0.5rem 0;
}

.media-wrap span,
.media-wrap a {
  flex: none;
  font-size: 1.2rem;
  letter-spacing: -0.05rem;
  color: #fff;
  border-radius: 0.3rem;
  padding: 0.5rem 0.8rem;
  text-align: center;
  line-height: 1;
}

.media-wrap span+span,
.media-wrap a+a {
  margin-left: 0.8rem;
}

.media-wrap .cafe,
.media-wrap .blog {
  background-color: #03c75aad;
}

.media-wrap .instagram {
  background-color: #524627ad;
}

.media-wrap .twitter {
  background-color: #3163d6ad;
}

.media-wrap .youtube {
  background-color: #f41515ad;
}

.media-wrap .black {
  background-color: #222222ad;
}

.media-wrap .gray {
  background-color: #b2b2b2ad;
}

/* 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: 90rem;
}

.clothes-size-table th,
.clothes-size-table td {
  padding: 1rem 1rem 1rem 2rem;
  text-align: left;
  border: 0.1rem 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: 11rem;
  min-height: 0;
}

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

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

.keyword-wrap a {
  flex: none;
  font-size: 1.3rem;
  padding: 0.3rem;
  background-color: #ffeff4;
  color: #18b7bf;
  border-radius: 0.3rem;
  margin-top: 0.4rem;
  margin-right: 0.4rem;
  cursor: pointer;
}

.keyword-wrap a.more-keyword {
  color: #fff;
  font-size: 1.2rem;
  background-color: #18b7bf;
}

/* 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: 0.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: 62px; */
  overflow-y: scroll;
  /* position: relative; */
}

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

.video-form-wrap #appendWrap::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  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.5rem;
  color: #b2b2b2;
  letter-spacing: -0.1rem;
  width: 33.333333%;
  text-align: center;
  padding: 0.5rem 0 2rem 0;
  cursor: pointer;
  border-bottom: 0.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: 0.2rem;
  background-color: #222;
}

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

.table-scroll-wrap::-webkit-scrollbar,
.video-form-wrap .vd-description::-webkit-scrollbar,
.video-form-wrap .inner.yt-wrap::-webkit-scrollbar {
  width: 0.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: darkgrey;
  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: 0.6rem solid #fff;
  border-top: 0.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: 0.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: 0.5rem 0 0 0.5rem;
  border-right: none;
  flex: none;
}

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

.video-title-config li button,
.video-lang-config button {
  border-radius: 0 0.5rem 0.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: 26px; */
  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: 0.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: 0.5rem 1rem;
  vertical-align: middle;
}

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

.yt-upload-table .del-btn {
  height: 3.5rem;
  border-radius: 0.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: 0.5rem 0.5rem 2rem 0.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: 0.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: 0.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: 0.5rem;
}

.channel-form-wrap .profile-wrap p.description::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  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: 0.5rem;
}

.scroll-style::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  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: 0.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: 0.5rem;
}

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

.channel-video-wrap li:not(.empty-video) p {
  margin: 0.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: 49rem;
  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 input {
  /* padding-left: 134px; */
  border-radius: 0.5rem 0 0 0.5rem;
  border-right: none;
  height: 3.7rem !important;
}

.yt-url-wrap button {
  height: 3.7rem !important;
  border-radius: 0 0.5rem 0.5rem 0;
}

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

.yt-thumb {
  flex: none;
  width: 41.6rem;
  height: 20.8rem;
  background-color: #f7f7f7;
  border-radius: 0.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/user-noimg.png);
  background-size: 70%;
}

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

.yt-channel-title.empty {
  background-color: #f7f7f7;
  border-radius: 0.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: 0.3rem;
}

.yt-channel-desc::-webkit-scrollbar {
  width: 0.5rem;
}

.yt-channel-desc::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  opacity: 0.7;
  border-radius: 5rem;
}

.title-wrap input+textarea {
  margin: 1rem 0;
  height: 15rem;
}

.yt-info-form textarea {
  height: 25rem;
}

/* .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;
}

/* Loading Style */
.loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9998;
  display: none;
}

.loading.light {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: 9998;
  display: none;
}

.loading.on {
  display: block;
}

.loading.on::after {
  display: block;
  content: "";
  border: 0.6rem solid #f2f2f2;
  border-top: 0.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%);
  line-height: 4rem;
  font-size: 1.3rem;
  color: #fff;
  text-align: center;
  letter-spacing: -0.1rem;
  font-weight: 500;
}

.loading.on span.percentage {
  font-size: 1.3rem;
  color: #fff;
  position: absolute;
  /* left: 51%;
  top: 52%; */
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  line-height: 1;
  text-align: center;
  letter-spacing: -0.1rem;
  font-weight: 500;
}

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

.item-form-container .form-title .tip {
  margin-right: auto;
  margin-left: 1rem;
  font-size: 1.4rem;
  letter-spacing: -0.05rem;
  color: var(--global-primary-color);
  margin-top: 0.3rem;
}

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

.img-list-wrap li {
  flex: none;
  width: 7rem;
  height: 9rem;
  margin: 0 1.2rem 1.2rem 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: 40%;
  cursor: pointer;
  background-color: #f2f2f2;
  border-radius: 0.5rem;
}

.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: 0.1rem;
  height: 0.1rem;
  padding: 0;
  margin: -0.1rem;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.img-list-wrap li .thumb {
  width: 100%;
  border-radius: 0.5rem;
  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: -0.5rem;
  top: -0.5rem;
  width: 2rem !important;
  height: 2rem !important;
  border-radius: 1.5rem;
  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: 0.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.png);
  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/m/ic-stick-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.active {
  background-color: var(--global-primary-color) !important;
  border-color: var(--global-primary-color) !important;
}

.form-dialog {
  width: 100%;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  min-height: 5rem;
  z-index: 9999;
  padding-bottom: 4rem;
  padding-top: 9rem;
}

.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: 8rem;
}

.form-dialog-header .app-logo {
  display: block;
  content: "";  
  height: 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: 2rem;
}

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

.form-dialog .inbody-list a {
  font-size: 1.9rem;
  display: block;
  width: 100%;
  padding: 2rem 1.5rem;
  position: relative;
}

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


.form-dialog .medical-list {
  margin-top: 2rem;
}

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

.form-dialog .medical-list a {
  font-size: 1.9rem;
  display: block;
  width: 100%;
  padding: 2rem 1.5rem;
  padding-left: 0;
  position: relative;
}

.form-dialog .medical-list li:hover {
  background-color: #eee;
  cursor: pointer;
}

.form-dialog .medical-list li .title {
  font-size: 1.9rem;
  display: block;
  width: 100%;
  padding: 2rem 1.5rem;
  padding-left: 0;
  position: relative;
}

.form-dialog .medical-list li .icon-btn {
  width: 3.4rem;
  height: 3.4rem;
  flex: none;
  border-radius: 0.5rem;
  margin-left: 1.5rem;
  background-size: 50%;
}

.form-dialog .medical-list li:not(.no-data)::after {
  display: none;
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  position: absolute;
  top: 50%;
  right: 1.5rem;
  transform: translateY(-50%) rotate(45deg);
  border: 0.2rem 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: 3rem;
  letter-spacing: -0.05rem;
  color: #222;
  height: 5rem;
  line-height: 5rem;
}

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

.form-dialog .btn-wrap>* {
  text-align: center;
  margin: 0;
  height: 5rem;
  border: none;
  color: #222;
  border-radius: 0;
  font-size: 1.5rem;
  flex: 1;
  line-height: 5rem;
  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: 22.6rem;
  height: 20.1rem;
  padding: 5.4rem 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: 0.3rem;
  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: 1.5rem;
  font-size: 1.5rem;
}

.form-dialog .dialog-label {
  font-size: 1.5rem;
  color: #222;
  font-weight: 500;
  letter-spacing: -0.05rem;
}

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

.form-dialog select {
  height: 3.5rem;
  border-radius: 0.5rem;
  border: 0.1rem solid #ddd;
  width: 100%;
}

.form-dialog textarea {
  border-radius: 0.5rem;
  border: 0.1rem solid #ddd;
  width: 100%;
}

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

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

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

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

.form-dialog .flex-wrap .flex1+.flex1 {
  margin-left: 1rem;
}

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

  25% {
    top: 0;
  }

  75% {
    top: 98%;
  }
}

.form-dialog .btn-wrap button+button {
  color: var(--global-primary-color);
  border-left: 0.1rem 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;
}

.money-dialog .money-list-wrap {
  width: 38.5rem;
  margin-right: 2.5rem;
  height: 70rem;
  overflow: hidden;
}

.money-dialog .money-list-wrap .form-label {
  font-size: 1.5rem;
  font-weight: 500;
  margin: 4rem 0 1rem 0;
}

.money-dialog .money-list-wrap ul {
  height: calc(100% - 6.5rem);
  padding-right: 1rem;
}

.money-dialog .money-list-wrap li {
  display: flex;
  align-items: center;
  padding: 1.5rem 0;
  font-size: 1.5rem;
  letter-spacing: -0.05rem;
}

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

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

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

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

.new-form-wrap.request-payment-wrap {
  width: 85rem;
  max-width: 85rem;
  padding-top: 7.5rem;
}

.request-payment-wrap li {
  flex: 1;
  background-color: #e0f7fa;
  border: 0.1rem solid #e0f7fa;
  height: 24rem;
  border-radius: 3rem;
  text-align: center;
  padding: 2rem 1.5rem;
  color: #222;
  box-shadow: rgb(149 157 165 / 20%) 0rem 0.4rem 1.2rem;
  cursor: pointer;
}

.request-payment-wrap li+li {
  margin-left: 3rem;
}

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

.request-payment-wrap li h3 {
  font-size: 2.2rem;
  letter-spacing: -0.1rem;
  font-weight: 500;
  margin: 1rem 0 2rem 0;
}

.request-payment-wrap li p {
  font-size: 1.5rem;
  line-height: 1.35;
  letter-spacing: -0.1rem;
}

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

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

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

.sub-title {
  font-size: 2rem;
  letter-spacing: -1px;
  color: #222;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
}

.form-title .back-btn,
.sub-title .back-btn {
  display: inline-block;
  width: 4rem;
  height: 4rem;
  background: url(/skin/img/ic-arrow-left-b.svg) top 50% left 0 / 50% no-repeat;
}

.form-label {
  margin: 4rem 0 1.5rem 0;
  font-size: 1.8rem;
}

.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: 0;
  /* line-height: 1; */
}

.new-form-wrap .tip-txt {
  font-size: 1.4rem;
  letter-spacing: -0.1rem;
  margin-bottom: 1rem;
}

.new-form-wrap .tip-txt.color {
  color: var(--global-primary-color);
}

.new-form-wrap .tip-txt span {
  color: var(--global-primary-color);
  padding-right: 0.7rem;
  font-size: 1.5rem;
  letter-spacing: -0.1rem;
}

.new-form-wrap .input-wrap+.input-wrap {
  margin-top: 1.5rem;
}

.inline-input {
  display: flex;
  align-items: center;
  border: 0.1rem solid #ddd;
  overflow: hidden;
  border-radius: 1rem;
  height: 6rem;
  padding: 0;
  width: 100%;
}

.inline-input input.form-input,
.inline-input .form-input {
  border: none;
  border-radius: 0;
  height: 100% !important;
}

.inline-input .separator {
  flex: none;
  width: 1rem;
  height: 0.1rem;
  background-color: #222;
  margin: 0 1.5rem;
}

.new-form-wrap input.form-input,
.new-form-wrap .form-input,
input.form-input,
*.form-input {
  border: 0.1rem solid #ddd;
  padding: 0 1.5rem;
  border-radius: 1.4rem;
  height: 6rem;
  line-height: 6rem;
  width: 100%;
  font-size: 1.7rem;
}

.new-form-wrap input.form-input::placeholder,
input.form-input::placeholder {
  font-size: 1.7rem;
}

.new-form-wrap .form-select,
select.form-select {
  border-radius: 1.4rem;
  border: 0.1rem solid #ddd;
  height: 6rem;
  line-height: 6rem;
  padding: 0 5rem 0 1.5rem;
  width: 100%;
  font-size: 1.7rem;
  color: #222 !important;
  background: transparent;
  -webkit-appearance: none;
  background: url("/skin/img/m/ic-arrow-down-gray.png") no-repeat right 1.5rem center;
  background-size: 2rem;
}

textarea.form-input {
  border: 1px solid #ddd !important;
  line-height: 1.55 !important;
  min-height: 11rem !important;
  width: 100% !important;
  padding: 1.5rem !important;
  border-radius: 1.4rem;
  font-size: 1.6rem;
}

textarea.form-input::placeholder {
  font-size: 1.6rem;
}

.test-btn,
.new-form-wrap input[type="submit"],
.new-form-wrap button.form-btn,
.new-form-wrap button.submit-btn {
  border-radius: 1.3rem;
  margin-top: 4rem !important;
  background-color: var(--global-primary-color);
  color: #fff;
  font-size: 1.8rem !important;
  height: 6rem !important;
  line-height: 6rem !important;
  font-weight: 500 !important;
  padding: 0;
  width: 100%;
  border: 0;
  margin-left: 0;
}

.new-form-wrap button.form-btn.primary {
  color: #fff;
}

.new-form-wrap button.form-btn.black {
  background-color: #222;
  color: #fff;
  margin-right: 1rem;
}


.new-form-wrap textarea {
  border: 0.1rem solid #ddd !important;
  line-height: 1.55 !important;
  height: 18rem !important;
  width: 100% !important;
  padding: 1.5rem !important;
  border-radius: 1.4rem;
  font-size: 1.7rem;
}

.new-form-wrap textarea::placeholder {
  font-size: 1.7rem;
}

.new-form-wrap button a {
  color: inherit;
  display: block;
  width: 100%;
  height: 100%;
}

.new-form-wrap .btn-wrap {
  margin-top: 4rem;
  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: 1.3rem;
}

.new-form-wrap .btn-wrap.flex>button:nth-child(1) {
  background-color: #cef3f5;
  color: var(--global-primary-color);
}

.new-form-wrap .btn-wrap.flex>button+button {
  /* border-radius: 0 5px 5px 0; */
  margin-left: 1.2rem;
}

.new-form-wrap .input-prefix,
.new-form-wrap .input-suffix {
  display: flex;
  align-items: flex-end;
  border: 0.1rem solid #ddd;
  border-radius: 1.4rem;
  overflow: hidden;
}

.new-form-wrap .prefix,
.new-form-wrap .suffix {
  flex: none;
  display: block;
  height: 6rem;
  line-height: 6rem;
  /* font-size: 14px; */
  letter-spacing: -0.1rem;
  padding: 0 1.5rem;
}


.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: 1.5rem;
}

.new-form-wrap .checkbox-wrap.column,
.new-form-wrap .radio-wrap.column {
  flex-direction: column;
}

.form-label.social {
  display: flex;
  align-items: center;
}

.form-label.social img {
  width: 2.5rem;
  display: block;
  margin-right: 1rem;
}

.new-form-wrap .social-link-wrap {
  display: flex;
  align-items: center;
  border: 0.1rem solid #ddd;
  border-radius: 1.4rem;
  height: 6rem;
  line-height: 6rem;
  padding: 0 1.5rem;
  font-size: 1.5rem;
  flex: 1;
  color: #222;
}

.new-form-wrap .social-link-wrap p {
  flex: none;
  font-size: 1.5rem;
  color: #222;
  letter-spacing: -0.05rem;
}

.new-form-wrap .social-link-wrap input {
  border: none;
  padding: 0;
  height: 100%;
  color: #222;
  font-size: 1.5rem;
  flex: 1;
}

.new-form-wrap .social-link-wrap input::placeholder {
  font-size: 1.5rem;
}

.new-form-wrap .checkbox-wrap label {
  display: flex;
  width: 50%;
  height: 3.7rem;
  align-items: center;
  line-height: 1;
}

.new-form-wrap .radio-wrap label {
  display: flex;
  width: 50%;
  height: 6rem;
  align-items: center;
  line-height: 1;
}

.new-form-wrap .radio-wrap.count3 label {
  width: 30%;
  cursor: pointer;
}

.new-form-wrap .radio-wrap input[type="radio"] {
  margin-right: 1rem;
  width: 2rem;
  height: 2rem;
  display: block;
  -webkit-appearance: none;
  background: url(/skin/img/ic-radio-off.png) center / contain no-repeat;
}

.new-form-wrap .radio-wrap input[type="radio"]:checked {
  background: url(/skin/img/ic-radio-on.png) center / contain no-repeat;
}

.new-form-wrap .checkbox-wrap span,
.new-form-wrap .radio-wrap span {
  letter-spacing: -0.05rem;
  color: #222;
  font-size: 1.7rem;
  line-height: 1.5;
  margin-left: 1rem;
}

.new-form-wrap .checkbox-wrap span {
  font-size: 1.5rem;
}

.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: 1.5rem;
}

.new-form-wrap .radio-button-wrap label {
  flex: 1;
  text-align: center;
  min-height: 5rem;
  border-radius: 1.2rem;
  /* background-color: #ffeff4;
  color: var(--global-primary-color); */
  background-color: #f2f2f2;
  color: #333;
  font-size: 1.7rem;
  letter-spacing: -0.1rem;
  margin-right: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 1rem 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: 1.8rem;
  padding: 1.6rem 0;
  height: 6rem;
}

.new-form-wrap .radio-button-wrap label .small-label {
  display: block;
  font-size: 1.5rem;
  margin-top: 1rem;
}

.new-form-wrap .radio-button-wrap input[type="radio"]:checked+label {
  background-color: var(--global-primary-color);
  color: #fff;
}

.new-form-wrap .radio-button-wrap input[type="radio"] {
  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[type="radio"]:first-child+label {
  border-radius: 0.5rem 0.5rem 0 0;
}

.new-form-wrap .radio-button-wrap.column label:last-child {
  border-radius: 0 0 0.5rem 0.5rem;
}

.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: 1.2rem;
  height: 2.8rem;
  flex: 1;
  border-bottom: 0.1rem solid #ddd;
  padding: 0;
}

.new-form-wrap .contact-wrap,
.new-form-wrap .zipcode-wrap,
.zipcode-wrap {
  position: relative;
  display: flex;
  align-items: center;
  width: 50%;
}

.new-form-wrap .contact-wrap {
  width: 100%;
}

.new-form-wrap .contact-wrap button,
.new-form-wrap .zipcode-wrap button,
.zipcode-wrap button {
  display: block;
  font-size: 1.5rem !important;
  background-color: var(--global-primary-color);
  color: #fff;
  line-height: 1 !important;
  padding: 1rem 1.6rem;
  border-radius: 1.4rem !important;
  height: 6rem !important;
  flex: none;
  width: auto !important;
  margin-left: 1rem;
  letter-spacing: -0.1rem;
}

.data-form-container .zipcode-wrap button {
  height: 4.2rem !important;
  border-radius: 1rem !important;
}

.new-form-wrap .contact-wrap input[type="text"],
.new-form-wrap .zipcode-wrap input[type="text"] {
  flex: 1;
  width: 100%;
  border-radius: 1.4rem !important;
}

.new-form-wrap .addr-wrap,
.addr-wrap {
  display: flex;
  align-items: center;
  margin-top: 1.5rem;
}

.new-form-wrap .addr-wrap input:first-child,
.addr-wrap input:first-child {
  flex: 1;
}

.new-form-wrap .addr-wrap input+input,
.addr-wrap input+input {
  margin-left: 1.5rem;
  flex: none;
  width: 30%;
}

.new-form-wrap .agree-wrap {
  margin-top: 1.5rem;
}

.new-form-wrap .agree-wrap label {
  color: #222;
}

.fc .fc-toolbar-title {
  font-size: 1.4em;
  font-weight: 500;
  color: #222;
}

.fc .fc-col-header-cell-cushion {
  font-weight: normal;
  font-size: 1.1em;
  color: #222;
}

.fc .fc-button {
  /* padding:  */
}

.fc .fc-daygrid-day-frame {
  min-height: 12.7rem !important;
}

/* .fc .fc-daygrid-day-top {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
} */

.fc .fc-daygrid-day-number {
  font-size: 1.4rem;
}

.fc .fc-button-primary,
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active,
.fc .fc-button-primary:focus,
.fc .fc-button-primary:not(:disabled).fc-button-active:focus,
.fc .fc-button-primary:not(:disabled):active:focus,
.fc .fc-button-primary:hover {
  background-color: var(--global-primary-color);
  border-color: var(--global-primary-color);
}

.fc .fc-day.disabled .fc-daygrid-day-top {
  opacity: .3;
}

.fc .fc-day.disabled .fc-daygrid-day-number {
  color: #b2b2b2 !important;
}

.fc .fc-daygrid-day.fc-day-today {
  background-color: rgba(44, 201, 209, 0.15);
}

.radio-button-wrap {
  display: flex;
  align-items: center;
  margin-top: 1.5rem;
}

.radio-button-wrap label {
  flex: 1;
  text-align: center;
  border-radius: 1rem;
  background-color: #eceff1;
  /* color: var(--global-primary-color); */
  color: #666;
  font-size: 1.5rem;
  letter-spacing: -0.1rem;
  margin-right: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 4.2rem;
  line-height: 1.5rem;
  padding: 1rem 0;
  cursor: pointer;
  min-width: 4rem;
}

.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.5rem;
  padding: 1.6rem 0;
  height: 4.5rem;
  line-height: 4.5rem;
  width: 9rem;
}

.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);
  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: 0.5rem 0.5rem 0 0;
}

.radio-button-wrap.column label:last-child {
  border-radius: 0 0 0.5rem 0.5rem;
}

.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: 1.2rem;
  height: 2.8rem;
  flex: 1;
  border-bottom: 0.1rem solid #ddd;
  padding: 0;
}

.new-form-wrap .input-btn-wrap,
.new-form-wrap .zipcode-wrap {
  display: flex;
}

.new-form-wrap .input-btn-wrap button,
.new-form-wrap .zipcode-wrap button {
  display: block;
  margin-left: 1rem;
  background-color: var(--global-primary-color);
  color: #fff;
  line-height: 1;
  padding: 1rem 1.6rem;
  border-radius: 1rem;
  font-size: 1.5rem;
  height: auto;
  border: none;
}

.new-form-wrap .input-btn-wrap input[type="text"] {
  padding-right: 12rem;
}

.new-form-wrap .zipcode-wrap input[type="text"] {
  min-width: 15rem;
}

.new-form-wrap .agree-wrap {
  margin-top: 1.5rem;
}

.new-form-wrap .agree-wrap label {
  color: #222;
}

.new-form-wrap .search-wrap {
  position: relative;
  height: 6rem;
  overflow: visible;
}

.new-form-wrap .search-result-wrap {
  position: absolute;
  top: 5.9rem;
  left: 0;
  background-color: #fff;
  width: 100%;
  box-shadow: rgba(149, 157, 165, 0.2) 0rem 0.8rem 2.4rem;
  max-height: 28rem;
  display: none;
  z-index: 99999;
}

.new-form-wrap .search-result-wrap li {
  display: flex;
  align-items: center;
  height: 6rem;
  padding: 0 2rem;
  cursor: pointer;
  font-size: 1.5rem;
  letter-spacing: -0.05rem;
}

.new-form-wrap .search-result-wrap li+li {
  border-top: 0.1rem 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: 2rem 0;
  flex-wrap: wrap;
}

.count-list li p {
  text-align: center;
  font-size: 1.7rem;
  color: #333;
}

.count-list li {
  flex: none;
  width: 25%;
}

.count-list li .count {
  display: block;
  margin: 0 auto;
  font-size: 2.4rem;
  font-weight: 500;
  letter-spacing: -0.1rem;
  text-align: center;
  width: 100%;
  height: 8rem;
  line-height: 8rem;
}

.count-list.circle li {
  flex: 1;
  max-width: 20rem;
}

.count-list.circle li .count {
  width: 10rem;
  height: 10rem;
  line-height: 10rem;
  border-radius: 5rem;
  background-color: #f2f2f2;
  margin: 0 auto 2rem auto;
}

/* tail.php */
.footer {
  background-color: #fff;
  padding: 0rem 0rem 0rem 0rem;
}

.footer .inner {
  width: 120rem;
  margin: 0 auto;
}

.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: 100%;
}

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

.footer .agree-wrap a {
  line-height: 3.7rem;
  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: 0.1rem;
  height: 1.2rem;
  margin-top: 0.3rem;
  background: #DCDCDC;
  margin: 0 1rem;
}

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

.footer .company-wrap .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.footer .footer-logo {
  margin-right: 0;
  margin-bottom: 1.2rem;
}

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

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

/* tail.php End */



/* Full Calendar Style */
.registration-form .calendar-wrap .fc .fc-toolbar-title {
  font-size: 1.8rem;
  font-weight: 500;
  color: #222;
  margin: 0 1rem;
  line-height: 2.6rem;
}

.registration-form .calendar-wrap .fc .fc-col-header-cell-cushion {
  font-size: 1.4rem;
  padding: 0.5rem;
}

.registration-form .calendar-wrap .fc .fc-toolbar.fc-header-toolbar {
  margin-bottom: 1rem;
}

.registration-form .calendar-wrap .fc .fc-button,
.registration-form .calendar-wrap .fc .fc-button-primary {
  padding: 0;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.registration-form .calendar-wrap .fc .fc-toolbar {
  justify-content: center;
}

.registration-form .calendar-wrap .fc-icon-chevron-left:before,
.registration-form .calendar-wrap .fc-icon-chevron-right:before {
  color: #222;
}

.registration-form .calendar-wrap .fc .fc-daygrid-day-top {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -76%);
}

.registration-form .calendar-wrap .fc-theme-standard td,
.registration-form .calendar-wrap .fc-theme-standard th,
.registration-form .calendar-wrap .fc-theme-standard .fc-scrollgrid {
  border: none;
}

.registration-form .calendar-wrap .fc-theme-standard td.fc-day-sat {
  color: #287ec7;
}

.registration-form .calendar-wrap .fc-theme-standard td.fc-day-sun {
  color: #f03141;
}

.registration-form .calendar-wrap .fc .fc-day.disabled .fc-daygrid-day-top,
.registration-form .calendar-wrap .fc .fc-day-other .fc-daygrid-day-top {
  color: #b2b2b2;
  opacity: 0.6;
}

.registration-form .calendar-wrap .fc-theme-standard td.fc-selected .fc-daygrid-day-frame {
  background-color: var(--global-primary-color);
  color: #fff;
}

.registration-form .calendar-wrap .fc .fc-daygrid-day.fc-day-today {
  background-color: transparent;
  color: var(--global-primary-color);
}

.registration-form .calendar-wrap .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number {
  position: relative;
}

.registration-form .calendar-wrap .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number::after {
  content: "오늘";
  display: block;
  font-size: 1.3rem;
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  width: 2.5rem;
  text-align: center;
}

.registration-form .calendar-wrap .fc .fc-daygrid-day-frame {
  cursor: pointer;
}

.registration-form .calendar-date-wrap {
  width: 100%;
  font-size: 1.8rem;
  /* font-weight: 500; */
  letter-spacing: -0.05rem;
  padding: 2.2rem 0;
  cursor: pointer;
  position: relative;
}

.registration-form .calendar-date-wrap::after {
  content: "";
  display: block;
  width: 1.8rem;
  height: 1.8rem;
  background: url(/skin/img/ic-arrow-down.png) top 50% right 0 / contain no-repeat;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.registration-form .calendar-date-wrap.on::after {
  transform: translateY(-50%) rotate(180deg);
}

.registration-form .fc .fc-daygrid-day-frame {
  min-height: 100% !important;
}

.registration-form .fc .fc-selected .fc-daygrid-day-number {
  color: #fff;
}

.registration-form .fc .fc-button .fc-icon {
  font-size: 2.5rem;
}


/* 유저 검색 */
.search-select-wrap {
  position: relative;
}

.search-select-wrap .search-input-wrap {
  display: flex;
  align-items: center;
}

.search-select-wrap .search-input-wrap .input-wrap {
  flex: 1;
  position: relative;
}

.search-select-wrap .search-input-wrap .input-wrap .clear-btn {
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 50%;
  background-color: #b2b2b2;
  position: absolute;
  right: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  display: none;
}

.search-select-wrap .search-input-wrap .input-wrap .clear-btn::before,
.search-select-wrap .search-input-wrap .input-wrap .clear-btn::after {
  content: "";
  display: block;
  width: 60%;
  height: 1px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

.search-select-wrap .search-input-wrap .input-wrap .clear-btn::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.search-select-wrap .search-input-wrap .input-wrap input {
  padding-right: 4.7rem;
  border-radius: 1.4rem;
  height: 6rem;
}

.search-select-wrap .search-input-wrap button {
  height: 6rem;
  flex: none;
  width: 9rem;
  border-radius: 1.4rem;
  margin-left: 1.5rem;
  font-size: 1.6rem;
}

.search-select-wrap .search-select-result {
  position: absolute;
  width: 100%;
  left: 0;
  top: calc(100% + 1rem);
  z-index: 30;
  background-color: #fff;
  color: #222;
  letter-spacing: -0.05rem;
  font-size: 1.6rem;
  max-height: 30rem;
  overflow-y: scroll;
  padding: 1rem 1.5rem;
  box-shadow: rgb(49 92 94 / 9%) 0 0.1rem 1rem;
  display: none;
}

.search-select-wrap .search-select-list li {
  display: flex;
  align-items: center;
  padding: 1rem;
  border-bottom: 1px dashed #f2f2f2;
  cursor: pointer;
}

.search-select-wrap .search-select-list li:hover {
  background-color: #f7f7f7;
}

.search-select-wrap .search-select-list li .profile {
  flex: none;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: #f2f2f2 url(/skin/img/ic-user.svg) center / 50% no-repeat;
}

.search-select-wrap .search-select-list li p {
  width: 30%;
  margin-left: 1.5rem;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-select-wrap .search-select-list li p.cp-name {
  flex: none;
}

.search-select-wrap .search-select-list .no-result {
  height: auto;
  min-height: 0;
}

.search-select-wrap .search-place-list li {
  border-bottom: 1px solid #eee;
  padding: 1.5rem 1.5rem 1.5rem 9rem;
  cursor: pointer;
  display: block;
  position: relative;
  font-size: 1.6rem;
}

.search-select-wrap .search-place-list li:last-child {
  border-bottom: none;
}

.search-select-wrap .search-place-list li.active {
  background-color: #f7f7f7;
}


.search-select-wrap .search-place-list li.active .icon {
  background-color: var(--global-sub-color);
}

.search-select-wrap .search-place-list li .icon {
  display: block;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  border: 1px solid #ddd;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background: #fff url(/skin/img/ic-link-place-color.svg) center / 78% no-repeat;
  left: 2rem;
}

.search-select-wrap .search-place-list li .category {
  color: #666;
  font-size: 1.5rem;
  line-height: 1.5;
  margin-bottom: 0.8rem;
}

.search-select-wrap .search-place-list li .addr {
  margin-top: 0.8rem;
  font-size: 1.5rem;
}

.search-select-wrap .search-place-list li .del-result-btn {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background-color: var(--global-primary-color);
  color: #fff;
  height: 6rem;
  flex: none;
  width: 9rem;
  border-radius: 1.4rem;
  margin-left: 1.5rem;
  font-size: 1.6rem;
}

.search-select-wrap .search-place-list.result-item li {
  padding-right: 11rem;
  padding-left: 7rem;
}

.search-select-wrap .search-place-list.result-item li .icon {
  left: 0;
}

.no-result {
  box-sizing: border-box;
  background: #fff;
  border-radius: 1.4rem;
  padding: 2rem;
  min-height: 20rem;
  box-shadow: rgb(49 92 94 / 11%) 0px 2px 1.1rem;
  width: calc(100% - 3rem);
  margin: 4rem auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #b2b2b2;
  font-size: 1.7rem;
  letter-spacing: -0.5px;
}

.no-result.no-bg {
  box-shadow: none;
}

.no-result img {
  width: 6.5rem !important;
  margin-bottom: 1rem;
}


/* notice */
.collapse {
  display: block;
  font-size: 1.6rem;
  letter-spacing: -0.05rem;
  color: #222;
  overflow: hidden;
}

.collapse li {
  padding: 1.5rem 0;
  /* border-bottom: 1px solid #eee; */
}

.collapse li .date {
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
  color: #666;
  display: block;
}

.collapse li .title {
  font-size: 1.8rem;
  font-weight: normal;
  line-height: 1.35;
  width: 100%;
  position: relative;
  overflow: hidden;
  padding: 0 5%;
}

.collapse li .title::after {
  content: "";
  display: block;
  width: 2rem;
  height: 2rem;
  background: url(/skin/img/ic-arrow-right.png) center / 1rem no-repeat;
  position: absolute;
  right: 5%;
  top: 50%;
  transform: translateY(-50%);
}

.collapse li.on .title::after {
  transform: translateY(-50%) rotate(90deg);
}

.collapse li .title p {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.collapse li .content {
  padding: 2rem 5%;
  background-color: #f7f7f7;
  margin-top: 1rem;
  line-height: 1.65;
  font-size: 1.6rem !important;
  display: none;
}

.collapse li.on .content {
  display: block;
}

.collapse li .content * {
  font-size: inherit !important;
}

.form-btn-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2.5rem;
}

.form-btn-wrap>* {
  flex: none;
  height: 7rem !important;
  width: 14rem !important;
  border-radius: 1.4rem !important;
  font-size: 1.7rem !important;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.form-btn-wrap>*+* {
  margin-left: 2rem;
}

.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;
}

.preview-container {
  align-items: flex-start;
}

.preview-container .wrapper {
  flex: 1;
  width: auto;
  min-height: 75rem;
}

.preview-container .inner {
  flex: none;
  width: 40%;
}

.preview-container .phone {
  width: 66%;
  max-width: 37rem;
  position: relative;
  background: linear-gradient(245deg, #f0efef 0%, #f7f7f7 100%);
  border-radius: 4.5rem;
  box-shadow: rgba(44, 10, 54, 0.2) 0 0.8rem 2.4rem;
  margin: 0 auto;
}

.preview-container .phone::after {
  display: block;
  content: "";
  padding-bottom: 204%;
}

.preview-container .phone .screen {
  width: calc(100% - 2rem);
  height: calc(100% - 2rem);
  background-color: #fff;
  border-radius: 3.6rem;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}


.preview-container .website-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 0 auto;
  font-size: 1.7rem;
  margin-bottom: 2.5rem;
  height: 6rem;
}

.preview-container .website-wrap .my-url {
  color: #222;
  font-weight: 500;
  font-size: inherit;
  letter-spacing: -0.02rem;
  border: 0.1rem solid #eee;
  border-radius: 1rem;
  padding: 1rem 2rem;
  flex: 1;
  display: block;
  height: 100%;
  line-height: 4rem;
}

.preview-container .website-wrap .my-link-btn {
  width: auto;
  padding: 1rem 2rem;
  font-size: inherit;
  border-radius: 1rem;
  margin-left: 1.5rem;
  height: 100%;
  line-height: 4rem;
  cursor: pointer;
  text-align: center;
  letter-spacing: -0.1rem;
}

.preview-container .website-wrap .social-link-wrap {
  height: 100%;
  border: 0.1rem solid #eee;
  border-radius: 1rem;
  padding: 1rem 2rem;
  letter-spacing: -0.02rem;
}

.preview-container .website-wrap .social-link-wrap>* {
  letter-spacing: -0.02rem;
  color: #222;
  font-weight: 500;
  font-size: 1.7rem;
}

.preview-container .sub-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.preview-container label.add-file-btn {
  display: block;
  height: auto;
  min-width: 0;
  min-height: 0;
  max-height: 100%;
  width: 10.4rem;
  background-color: #f2f2f2;
  border-radius: 1rem;
  padding: 0;
  position: relative;
  background: #f2f2f2 url(/skin/img/ic-plus-gray.svg) center / 70% no-repeat;
  cursor: pointer;
}

.preview-container label.add-file-btn::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

.preview-container label.add-file-btn input[type='file'] {
  display: none;
}

.preview-container label.add-file-btn .del-btn {
  display: block;
  position: absolute;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  min-width: 0;
  right: -0.5rem;
  top: -0.5rem;
  background-color: #f03141;
  z-index: 10;
}

.preview-container .image-input-wrap {
  display: flex;
  margin-top: 4rem;
}

.preview-container .image-input-wrap li {
  flex: 1;
}

.preview-container .image-input-wrap li .form-label {
  margin-top: 0;
}

.preview-container .image-input-wrap li .size {
  font-size: 1.4rem;
  letter-spacing: -0.05rem;
  margin-top: 1rem;
  display: block;
}

.preview-container .gallery-list {
  display: flex;
  flex-wrap: wrap;
}

.preview-container .gallery-list>* {
  width: 10.4rem;
  border-radius: 1rem;
  background: #f2f2f2 url(/skin/img/thumb_background.png) center / 80% no-repeat;
  position: relative;
  margin: 0 1.5rem 1.5rem 0;
  cursor: pointer;
}

.preview-container .gallery-list>*::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

.preview-container .gallery-list>* .del-btn {
  display: block;
  position: absolute;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  min-width: 0;
  right: -0.5rem;
  top: -0.5rem;
  background-color: #f03141;
  z-index: 10;
}

.preview-container .inner.floating {
  position: relative;
}

.preview-container .inner.floating .phone {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.preview-container .inner:not(.floating) .phone {
  top: 0;
}

/* timepicker */
.timepicker-wrap {
  /* flex: 1; */
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6rem;
  border-radius: 1.4rem;
  border: 1px solid #ddd;
  color: #222;
  font-size: 1.6rem;
  padding: 0 2.5rem;
}

.timepicker-wrap .separator {
  padding: 0 1rem;
}

.timepicker-wrap .timepicker {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.timepicker-wrap .timepicker select {
  background: none !important;
  padding: 0 0.5rem !important;
  height: 100%;
  border: none !important;
  padding-left: 3rem !important;
  text-align: center;
}

.timepicker-wrap .timepicker .separator {
  padding: 0;
}

.timepicker-wrap .timepicker .separator+select {
  padding-left: 0.5rem !important;
  padding-right: 3rem !important;
}

.radio-list-wrap {
  font-size: 1.6rem;
  color: #222;
  width: 100%;
}

.radio-list-wrap li input {
  display: none;
}

.radio-list-wrap li {
  border-bottom: 1px solid #f2f2f2;
}

.radio-list-wrap li label {
  width: 100%;
  padding: 0 5%;
  height: 6rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  background: url(/skin/img/ic-radio-off.png) top 50% left 5% / 2.5rem no-repeat;
  cursor: pointer;
}

.radio-list-wrap li input:checked+label {
  background-image: url(/skin/img/ic-radio-on.png);
}

.default-table {
  width: 100%;
  font-size: 1.6rem;
}

.default-table th,
.default-table td {
  font-weight: normal;
  padding: 2rem 1rem;
  vertical-align: middle;
  line-height: 1.35;
  font-size: 1.7rem;
}

.default-table th {
  text-align: left;
}

.default-table tr:last-child th,
.default-table tr:last-child td {
  border-bottom: none;
}

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

.tip-txt.color {
  color: var(--global-primary-color);
}



/* 검색영역 */
.new-search-wrap {
  padding: 3rem 2.5rem;
  background-color: #fff;
  border-radius: 1.4rem;
  width: 100%;
  font-size: 1.6rem;
  margin-bottom: 2.5rem;
}

.new-search-wrap .search-table {
  width: 100%;
}

.new-search-wrap .search-table th,
.new-search-wrap .search-table td {
  padding: 1rem 2rem 1rem 0;
}

.new-search-wrap .search-table th {
  font-weight: 500;
  color: #222;
  font-size: 1.5rem;
  letter-spacing: -0.05rem;
}

.new-search-wrap select {
  height: 4.5rem;
  border: 1px solid #ddd;
  border-radius: 0.8rem;
  overflow: hidden;
  width: 45rem;
  font-size: 1.6rem;
  color: #222;
}

.new-search-wrap .search-keyword {
  display: flex;
  align-items: center;
  height: 4.5rem;
  border: 1px solid #ddd;
  border-radius: 0.8rem;
  overflow: hidden;
  width: 45rem;
}

.new-search-wrap .search-keyword>* {
  border-radius: 0;
  border: none;
  height: 100%;
  font-size: 1.6rem;
  color: #222;
}

.new-search-wrap .search-keyword select {
  width: 15rem;
  border: none;
  border-right: 1px solid #ddd;
}

.new-search-wrap .search-date-picker {
  display: flex;
  align-items: center;
  height: 4.5rem;
  border: 1px solid #ddd;
  border-radius: 0.8rem;
  overflow: hidden;
  width: 45rem;
}


.new-search-wrap .search-date-picker>* {
  border-radius: 0;
  border: none;
  height: 100%;
  font-size: 1.6rem;
  color: #222;
}

.new-search-wrap .search-date-picker select {
  width: 15rem;
  border-right: 1px solid #ddd;
}

.new-search-wrap .search-date-picker input {
  flex: 1;
}

.new-search-wrap .search-date-picker .separator {
  line-height: 4.2rem;
}

.new-search-wrap .checkbox-wrap {
  display: flex;
  align-items: center;
  height: 4.5rem;
}

.new-search-wrap .checkbox-wrap>*+* {
  margin-left: 1.5rem;
}

.new-search-wrap .checkbox-wrap label {
  display: flex;
  align-items: center;
}

.new-search-wrap .radio-wrap {
  display: flex;
  align-items: center;
  height: 4.5rem;
}

.new-search-wrap .radio-wrap .radio-inline {
  display: flex;
  align-items: center;
  height: 100%;
}

.new-search-wrap .radio-wrap .radio-inline+.radio-inline {
  margin-left: 1.5rem;
}

.new-search-wrap .search-input {
  height: 4.5rem;
  border: 1px solid #ddd;
  border-radius: 0.8rem;
  font-size: 1.6rem;
  color: #222;
}

.new-search-wrap .period-wrap {
  display: flex;
  align-items: center;
  margin-top: 1.5rem;
}


.new-search-wrap .period-wrap label {
  border-radius: .5rem;
  overflow: hidden;
  border: none;
  background-color: #f2f2f2;
  padding: 0 1rem;
  color: #666;
  font-size: 1.3rem;
  cursor: pointer;
  display: block;
  height: 100%;
  line-height: 3.2rem;
}

.new-search-wrap .period-wrap label.checked {
  color: var(--global-primary-color);
  background-color: var(--global-sub-color);
  font-weight: 500;
}

.new-search-wrap .period-wrap label+label {
  margin-left: .8rem;
}

.new-search-wrap .period-wrap input {
  display: none;
}

.new-search-wrap .search-range-input {
  display: flex;
  align-items: center;
  height: 4.5rem;
  border: 1px solid #ddd;
  border-radius: 0.8rem;
  overflow: hidden;
  width: 45rem;
}

.new-search-wrap .search-range-input>* {
  height: 100%;
  border-radius: 0 !important;
  border: none !important;
  flex: 1;
}

.new-search-wrap .search-range-input input {
  height: 100% !important;
  border-radius: 0 !important;
  border: none !important;
}

.new-search-wrap .search-range-input .separator {
  flex: none;
  line-height: 4.2rem;
}

.new-search-wrap .input-suffix {
  height: 4.5rem;
  border-radius: 0.8rem;
  overflow: hidden;
}

.new-search-wrap .input-suffix input {
  height: 100% !important;
}

.search-btn-wrap {
  display: flex;
  align-items: center;
  margin-top: 1.5rem;
}

.search-btn-wrap>* {
  padding: 0 3rem;
}

.search-btn-wrap>*+* {
  margin-left: 1.5rem;
}

.search-btn-wrap .exceldown {
  margin-left: auto !important;
}

.search-btn-wrap .exceldown-wrap {
  margin-left: auto;
  display: flex;
  align-items: center;
}

.search-btn-wrap .exceldown-wrap select {
  height: 5rem;
  line-height: 5rem;
  border-radius: 1.1rem;
}

.search-btn-wrap .exceldown-wrap .exceldown {
  margin-left: 1.5rem;
}

.data-search-info {
  padding: 3rem 2.5rem;
  background-color: #fff;
  border-radius: 1.4rem;
  width: 100%;
  font-size: 1.8rem;
  margin-bottom: 2.5rem;
  font-weight: 500;
  letter-spacing: -0.05rem;
  color: #222;
}


/* jquery datepicker */
.datepicker-panel>ul>li {
  font-size: 1.7rem;
}

.iframe100 {
  display: block;
  border: none;
  height: 100vh;
  width: 100%;
  /* width: 100vw; */
}