@charset "UTF-8";
/*html {
	font-size: 18px;
}
@media screen and (min-width: 360px) {
		html{font-size: 14px;}
}
@media screen and (min-width: 400px) {
		html{font-size: 16px;}
}
@media screen and (min-width: 430px) {
		html{font-size: 16px;}
}
@media screen and (min-width: 768px) {
		html{font-size: 16px;}
}
@media screen and (min-width: 1200px) {
		html{font-size: 16px;}
}
@media screen and (min-width: 1920px) { 
		html{font-size: 16px;}
}*/
/* 폰트 */
/* 컬러 */
/* 드롭다운,멀티포함 */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-thumb {
  background: #cccccc;
  border-radius: 0;
}

::-webkit-scrollbar-thumb:hover {
  background: #888888;
}

::-webkit-scrollbar-track {
  background: #eeeeee;
  border-radius: 0;
}

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: inherit;
  font-size: 16px;
  font-family: "Pretendard", Malgun Gothic, 돋움, DotumChe, Dotum, sans-serif;
  vertical-align: baseline;
  -webkit-text-size-adjust: none;
  box-sizing: border-box;
  letter-spacing: -0.02em;
  word-break: keep-all;
  line-height: 1.5;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
div {
  position: relative;
  display: block;
}

body {
  line-height: 1;
  color: black;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  color: inherit;
  font: inherit;
  text-decoration: none;
}

strong {
  font: inherit;
}

label,
button,
input[type=submit],
input[type=checkbox],
input[type=radio],
input[type=button] {
  padding: 0px;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  cursor: pointer;
}

input[type=text],
input[type=password],
input[type=number] {
  padding: 0px;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

input,
button,
textarea,
select {
  border: none;
  font-family: "Pretendard", Malgun Gothic, 돋움, DotumChe, Dotum, sans-serif;
  box-sizing: border-box;
}

input[type=submit],
button[type=submit] {
  font-family: "Pretendard", Malgun Gothic, 돋움, DotumChe, Dotum, sans-serif;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

button:focus,
textarea:focus,
input:focus {
  outline: none;
}

button,
textarea,
input,
select,
a,
label {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}

img {
  vertical-align: middle;
}

button {
  background: transparent;
  color: inherit;
}

input,
textarea {
  border: 1px solid transparent;
  transition: border 0.3s ease-in-out;
}

::-moz-placeholder {
  color: #ccc;
  font-family: "Pretendard", Malgun Gothic, 돋움, DotumChe, Dotum, sans-serif;
}

::placeholder {
  color: #ccc;
  font-family: "Pretendard", Malgun Gothic, 돋움, DotumChe, Dotum, sans-serif;
}

.no-scroll {
  overflow: hidden !important;
}
.no-scroll .scroll-frame {
  overflow: hidden !important;
}

hr {
  height: 1px;
  background-color: #E6E2E0;
  border: none;
}
@media (min-width: 640px) and (max-width: 1199px) {
  hr {
    height: 0.0625rem;
  }
}
@media (max-width: 639px) {
  hr {
    height: 0.2625vw;
  }
}

br.mo {
  display: block;
}
@media screen and (min-width: 1200px) {
  br.mo {
    display: none;
  }
}
br.pc {
  display: none;
}
@media screen and (min-width: 1200px) {
  br.pc {
    display: block;
  }
}

.w100 {
  width: 100%;
}

.scroll {
  width: 100%;
  padding: 0 0 0 0;
  overflow-y: overlay;
  text-align: center;
}

.point-font {
  font-family: "Gowun Batang", serif;
  letter-spacing: -0.02em;
  font-weight: 400;
}

.point-font-bold {
  font-family: "Gowun Batang", serif;
  letter-spacing: -0.02em;
  font-weight: 700;
}

h2 {
  font-weight: 700;
  font-size: 29px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  h2 {
    font-size: 1.8333rem;
  }
}
@media (max-width: 639px) {
  h2 {
    font-size: 7.7vw;
  }
}

h3 {
  font-weight: 600;
  font-size: 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  h3 {
    font-size: 1.6667rem;
  }
}
@media (max-width: 639px) {
  h3 {
    font-size: 7vw;
  }
}

h4 {
  font-weight: 500;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  h4 {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  h4 {
    font-size: 5.6vw;
  }
}

.fz-base {
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .fz-base {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .fz-base {
    font-size: 4.2vw;
  }
}

.fz-xxs {
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .fz-xxs {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .fz-xxs {
    font-size: 3.5vw;
  }
}

.fz-xs {
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .fz-xs {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .fz-xs {
    font-size: 3.85vw;
  }
}

.fz-sm {
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .fz-sm {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .fz-sm {
    font-size: 4.2vw;
  }
}

.fz-md {
  font-size: 17px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .fz-md {
    font-size: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .fz-md {
    font-size: 4.55vw;
  }
}

.fz-lg {
  font-size: 19px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .fz-lg {
    font-size: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .fz-lg {
    font-size: 4.9vw;
  }
}

.fw1 {
  font-weight: 100;
}

.fw2 {
  font-weight: 200;
}

.fw3 {
  font-weight: 300;
}

.fw4 {
  font-weight: 400;
}

.fw5 {
  font-weight: 500;
}

.fw6 {
  font-weight: 600;
}

.fw8 {
  font-weight: 800;
}

.fw9 {
  font-weight: 900;
}

.icon-svg {
  display: flex;
  justify-content: center;
  align-items: center;
}
.icon-svg svg {
  width: 100%;
}

section > .inner {
  position: relative;
  width: 100%;
  padding: 93px 0px;
}
section > .inner.center {
  text-align: center;
}
@media (min-width: 640px) and (max-width: 1199px) {
  section > .inner {
    padding: 5.8333rem 0rem;
  }
}
@media (max-width: 639px) {
  section > .inner {
    padding: 24.5vw 0vw;
  }
}
@media screen and (min-width: 1200px) {
  section > .inner {
    padding: 160px 0;
  }
}

.section-title {
  position: relative;
  text-align: center;
  letter-spacing: -1.76px;
  color: #222222;
  padding-top: 17px;
  font-size: 29px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .section-title {
    padding-top: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .section-title {
    padding-top: 4.55vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .section-title {
    font-size: 1.8333rem;
  }
}
@media (max-width: 639px) {
  .section-title {
    font-size: 7.7vw;
  }
}
.section-title.left {
  text-align: left;
}
.section-title.left:before {
  left: 0;
  margin-left: 0;
}
.section-title strong {
  color: #4BC8C4;
}
.section-title.section-title-main {
  letter-spacing: -2px;
  font-size: 33px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .section-title.section-title-main {
    font-size: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .section-title.section-title-main {
    font-size: 8.75vw;
  }
}
@media screen and (min-width: 1200px) {
  .section-title {
    font-size: 44px;
    letter-spacing: -0.88px;
  }
  .section-title.section-title-main {
    font-size: 60px;
    letter-spacing: -1.2px;
  }
}

.txt-row {
  position: relative;
  text-align: center;
  color: #888888;
  font-weight: 500;
  letter-spacing: -0.56px;
  font-size: 19px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .txt-row {
    font-size: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .txt-row {
    font-size: 4.9vw;
  }
}
@media screen and (min-width: 1200px) {
  .txt-row {
    font-size: 20px;
  }
}

/* 모달팝업 */
.modal {
  position: fixed;
  bottom: -9999px;
  left: -9999px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-direction: column;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  z-index: 999;
}
@media screen and (min-width: 1200px) {
  .modal {
    justify-content: center;
  }
}
.modal.open {
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  opacity: 1;
}
.modal.open-out {
  opacity: 0;
}
.modal .modal-scroll {
  width: 100%;
  height: auto;
  padding: 0;
  overflow-y: overlay;
  text-align: center;
  padding: 0px 17px 0px 17px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-scroll {
    padding: 0rem 1.0417rem 0rem 1.0417rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-scroll {
    padding: 0vw 4.375vw 0vw 4.375vw;
  }
}
.modal .modal-scroll::-webkit-scrollbar {
  width: 10px;
  height: 20px;
}
.modal .modal-scroll::-webkit-scrollbar-thumb {
  background: #d9d9d9;
  border-radius: 5px;
}
.modal .modal-scroll::-webkit-scrollbar-thumb:hover {
  background: #878787;
}
.modal .modal-scroll::-webkit-scrollbar-track {
  background: #eee;
  border-radius: 5px;
}
.modal .modal-scroll .content-area {
  padding: 0px 17px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-scroll .content-area {
    padding: 0rem 1.0417rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-scroll .content-area {
    padding: 0vw 4.375vw;
  }
}
.modal .modal-container {
  width: 100%;
  display: inline-block;
  background: #fff;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08);
  text-align: left;
  overflow: hidden;
  border-top-left-radius: 27px;
  border-top-right-radius: 27px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-container {
    border-top-left-radius: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-container {
    border-top-left-radius: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-container {
    border-top-right-radius: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-container {
    border-top-right-radius: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-container {
    border-bottom-right-radius: 0rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-container {
    border-bottom-right-radius: 0vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-container {
    border-bottom-left-radius: 0rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-container {
    border-bottom-left-radius: 0vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal .modal-container {
    width: 100%;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
  }
}
.modal .modal-title-box {
  border-bottom: 1px solid #BBBBBB;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 13px 16px 10px 33px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-title-box {
    padding: 0.8333rem 1rem 0.625rem 2.0833rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-title-box {
    padding: 3.5vw 4.2vw 2.625vw 8.75vw;
  }
}
.modal .modal-title-box .close-btn {
  width: 47px;
  height: 47px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-title-box .close-btn {
    width: 2.9167rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-title-box .close-btn {
    width: 12.25vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-title-box .close-btn {
    height: 2.9167rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-title-box .close-btn {
    height: 12.25vw;
  }
}
.modal .modal-title-box .close-btn .icon-svg {
  color: #000;
  padding-right: 1px;
  width: 15px;
  height: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-title-box .close-btn .icon-svg {
    width: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-title-box .close-btn .icon-svg {
    width: 4.025vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-title-box .close-btn .icon-svg {
    height: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-title-box .close-btn .icon-svg {
    height: 4.025vw;
  }
}
.modal .modal-title-box.center {
  justify-content: center;
}
.modal .modal-title-box.center .close-btn {
  position: absolute;
}
.modal .modal-title-box.left {
  justify-content: flex-start;
}
.modal .modal-title-box.between {
  justify-content: space-between;
}
.modal .modal-title-box h3 {
  color: #222222;
  font-weight: 700;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-title-box h3 {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-title-box h3 {
    font-size: 5.6vw;
  }
}
.modal .modal-title-box h3 span {
  color: #222222;
  font-weight: 700;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal .modal-title-box h3 span {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal .modal-title-box h3 span {
    font-size: 5.6vw;
  }
}
.modal .modal-title-box.none .close-btn {
  filter: brightness(1) invert(1);
}

/* 페이징 */
.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 43px auto 0px auto;
  gap: 30px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination {
    margin: 2.6667rem auto 0rem auto;
  }
}
@media (max-width: 639px) {
  .pagination {
    margin: 11.2vw auto 0vw auto;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination {
    gap: 1.875rem;
  }
}
@media (max-width: 639px) {
  .pagination {
    gap: 7.875vw;
  }
}
.pagination .page {
  cursor: pointer;
  background: #fff;
  border-style: solid;
  border-color: #888888;
  min-width: 48px;
  border-width: 1px;
  width: 48px;
  height: 48px;
  border-radius: 48px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page {
    min-width: 3rem;
  }
}
@media (max-width: 639px) {
  .pagination .page {
    min-width: 12.6vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page {
    border-width: 0.0625rem;
  }
}
@media (max-width: 639px) {
  .pagination .page {
    border-width: 0.2625vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page {
    width: 3rem;
  }
}
@media (max-width: 639px) {
  .pagination .page {
    width: 12.6vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page {
    height: 3rem;
  }
}
@media (max-width: 639px) {
  .pagination .page {
    height: 12.6vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page {
    border-radius: 3rem;
  }
}
@media (max-width: 639px) {
  .pagination .page {
    border-radius: 12.6vw;
  }
}
.pagination .page.prev[disabled], .pagination .page.next[disabled] {
  opacity: 0.4;
  cursor: default;
}
.pagination .page i {
  display: flex;
  justify-content: center;
  align-items: center;
}
.pagination .page i .icon-arrow {
  stroke: #aaa;
  stroke-width: 12;
  width: 7px;
  height: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page i .icon-arrow {
    width: 0.4375rem;
  }
}
@media (max-width: 639px) {
  .pagination .page i .icon-arrow {
    width: 1.8375vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page i .icon-arrow {
    height: 0.8125rem;
  }
}
@media (max-width: 639px) {
  .pagination .page i .icon-arrow {
    height: 3.4125vw;
  }
}
.pagination .page.next i .icon-arrow {
  transform: rotate(180deg);
}
.pagination .page-list {
  display: flex;
  list-style: none;
  padding: 0;
  gap: 3px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page-list {
    gap: 0.2083rem;
  }
}
@media (max-width: 639px) {
  .pagination .page-list {
    gap: 0.875vw;
  }
}
@media screen and (min-width: 1200px) {
  .pagination .page-list {
    gap: 4px;
  }
}
.pagination .page-list .page-item button {
  background: none;
  border: none;
  color: #666;
  font-weight: 400;
  font-size: 16px;
  width: 34px;
  cursor: pointer;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page-list .page-item button {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .pagination .page-list .page-item button {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .pagination .page-list .page-item button {
    width: 2.125rem;
  }
}
@media (max-width: 639px) {
  .pagination .page-list .page-item button {
    width: 8.925vw;
  }
}
.pagination .page-list .page-item.active button {
  font-weight: 700;
  color: #806D65;
}

.btn {
  position: relative;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s, border 0.2s;
  border: none;
  outline: none;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  border-radius: 24px;
  font-size: 16px;
  height: 53px;
  padding: 0 55px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn {
    border-radius: 1.5rem;
  }
}
@media (max-width: 639px) {
  .btn {
    border-radius: 6.3vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .btn {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn {
    height: 3.3333rem;
  }
}
@media (max-width: 639px) {
  .btn {
    height: 14vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn {
    padding: 0 3.4375rem;
  }
}
@media (max-width: 639px) {
  .btn {
    padding: 0 14.4375vw;
  }
}
.btn span {
  font-weight: 600;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn span {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .btn span {
    font-size: 4.2vw;
  }
}
.btn.shape-square {
  border-radius: 6px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn.shape-square {
    border-radius: 0.375rem;
  }
}
@media (max-width: 639px) {
  .btn.shape-square {
    border-radius: 1.575vw;
  }
}
.btn-radius {
  border-radius: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn-radius {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .btn-radius {
    border-radius: 1.4vw;
  }
}
.btn.txt {
  height: auto;
  padding: 0;
  letter-spacing: -0.8px;
  text-decoration-line: underline;
  text-decoration-style: solid;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
  color: #AAAAAA;
  font-weight: 600;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn.txt {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .btn.txt {
    font-size: 3.5vw;
  }
}
.btn.txt.txt-black {
  color: #000;
}
.btn.txt.txt-black:before {
  background: #000;
}
.btn.txt.txt-gray {
  color: #AAAAAA;
}
.btn.txt.txt-gray:before {
  background: #AAAAAA;
}
.btn.txt.txt-white {
  color: #fff;
}
.btn.txt.txt-white:before {
  background: #fff;
}
.btn-mint {
  background: #4BC8C4;
  color: #fff;
}
.btn-primary-mint {
  background: #4BC8C4;
  color: #fff;
  box-shadow: 0px 8px 30px 0px rgba(75, 200, 196, 0.4);
}
.btn-primary-mint:hover {
  background-color: #0AA49F;
  box-shadow: 0px 8px 30px 0px rgba(75, 200, 196, 0);
}
.btn-primary-light-mint {
  background: #E6F7F6;
  color: #4BC8C4;
  box-shadow: 0px 2.1vw 7vw 0px rgba(0, 166, 159, 0.4);
}
@media screen and (min-width: 1200px) {
  .btn-primary-light-mint {
    box-shadow: 0px 8px 30px 0px rgba(75, 200, 196, 0.4);
  }
}
.btn-primary-light-mint:hover {
  background: #0AA49F;
  color: #fff;
}
.btn-black {
  background: #4BC8C4;
  color: #fff;
}
.btn-gray {
  background: #EEEEEE;
  color: #AAAAAA;
}
.btn-gray:hover {
  background: #AAAAAA;
  color: #fff;
}
.btn-orange {
  background: #ED1C24;
  color: #fff;
}
.btn-outline {
  background: transparent;
  color: #4BC8C4;
  border-style: solid;
  border-color: transparent;
  transition: all 0.15s ease-in;
  border-width: 2px;
}
.btn-outline:hover {
  color: #fff !important;
}
.btn-outline-gray {
  border-color: #ddd;
}
.btn-outline-mint {
  border-color: #4BC8C4;
}
.btn-outline-mint:hover {
  background: #4BC8C4;
}
.btn-outline-mint-dark1 {
  border-color: #0AA49F;
}
.btn-outline-mint-dark1:hover {
  background: #0AA49F;
}
.btn-outline-mint-dark2 {
  border-color: #3DB2AE;
}
.btn-outline-mint-dark2:hover {
  background: #3DB2AE;
}
.btn-outline-mint-dark3 {
  border-color: #E6F7F6;
}
.btn-outline-mint-dark3:hover {
  background: #E6F7F6;
}
.btn-outline-mint-dark4 {
  border-color: #F7FCFC;
}
.btn-outline-mint-dark4:hover {
  background: #F7FCFC;
}
.btn-icon {
  gap: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn-icon {
    gap: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .btn-icon {
    gap: 5.6vw;
  }
}
.btn-icon i {
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn-icon-plus i {
  width: 12px;
  height: 12px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn-icon-plus i {
    width: 0.75rem;
  }
}
@media (max-width: 639px) {
  .btn-icon-plus i {
    width: 3.15vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .btn-icon-plus i {
    height: 0.75rem;
  }
}
@media (max-width: 639px) {
  .btn-icon-plus i {
    height: 3.15vw;
  }
}
.btn-icon-plus i .icon-plus {
  fill: white;
}

.icon-download i {
  width: 18px;
  height: 18px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .icon-download i {
    width: 1.125rem;
  }
}
@media (max-width: 639px) {
  .icon-download i {
    width: 4.725vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .icon-download i {
    height: 1.125rem;
  }
}
@media (max-width: 639px) {
  .icon-download i {
    height: 4.725vw;
  }
}

.dropdown-box, .multi-dropdown-box {
  display: inline-block;
  width: 100%;
  overflow: hidden;
}
.dropdown-box > button, .multi-dropdown-box > button {
  width: 100%;
  background: #fff;
  border: 1px solid #BBBBBB;
  text-align: left;
  font-weight: 400;
  color: #222222;
  line-height: 1;
  overflow: hidden;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 19px 7px 19px 16px;
  border-radius: 5px;
  font-size: 16px;
  height: 53px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    padding: 1.1667rem 0.4167rem 1.1667rem 1rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    padding: 4.9vw 1.75vw 4.9vw 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    border-radius: 1.4vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    height: 3.3333rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    height: 14vw;
  }
}
@media screen and (min-width: 640px) {
  .dropdown-box > button, .multi-dropdown-box > button {
    padding: 19px 12px 19px 24px;
    border-radius: 8px;
    font-size: 18px;
    height: 56px;
  }
}
.dropdown-box > button:after, .multi-dropdown-box > button:after {
  content: "";
  position: absolute;
  width: 47px;
  height: 47px;
  transform: translateY(-50%) rotate(0deg);
  top: 50%;
  bottom: 0px;
  right: 10px;
  z-index: 1;
  background: url("../images/components/icon_dropdown_arrow.svg") no-repeat center center;
  background-size: cover;
  transition: transform 0.15s ease-in-out;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box > button:after, .multi-dropdown-box > button:after {
    width: 2.9167rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box > button:after, .multi-dropdown-box > button:after {
    width: 12.25vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box > button:after, .multi-dropdown-box > button:after {
    height: 2.9167rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box > button:after, .multi-dropdown-box > button:after {
    height: 12.25vw;
  }
}
@media screen and (min-width: 640px) {
  .dropdown-box > button:after, .multi-dropdown-box > button:after {
    width: 56px;
    height: 56px;
  }
}
.dropdown-box > button:before, .multi-dropdown-box > button:before {
  position: absolute;
  top: 8px;
  right: 48px;
  z-index: 2;
  width: 1px;
  height: 32px;
  background: #eee;
  content: "";
  display: none;
}
.dropdown-box > button:disabled, .multi-dropdown-box > button:disabled {
  border-color: #ccc;
  background: #eee;
  color: #666;
}
.dropdown-box .dropdown-list, .multi-dropdown-box .dropdown-list {
  position: absolute;
  left: 0px;
  z-index: 9;
  min-width: 100%;
  overflow: hidden;
  overflow-y: auto;
  scrollbar-gutter: stable;
  border: 1px solid #BBBBBB;
  background: #fff;
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);
  opacity: 0;
  transition: opacity 0.15s ease;
  border-radius: 5px;
  max-height: 267px;
  top: 61px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box .dropdown-list, .multi-dropdown-box .dropdown-list {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box .dropdown-list, .multi-dropdown-box .dropdown-list {
    border-radius: 1.4vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box .dropdown-list, .multi-dropdown-box .dropdown-list {
    max-height: 16.6667rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box .dropdown-list, .multi-dropdown-box .dropdown-list {
    max-height: 70vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box .dropdown-list, .multi-dropdown-box .dropdown-list {
    top: 3.8333rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box .dropdown-list, .multi-dropdown-box .dropdown-list {
    top: 16.1vw;
  }
}
@media screen and (min-width: 640px) {
  .dropdown-box .dropdown-list, .multi-dropdown-box .dropdown-list {
    border-radius: 8px;
    max-height: 310px;
    top: 64px;
  }
}
.dropdown-box .dropdown-list ul, .multi-dropdown-box .dropdown-list ul {
  height: 0;
  transition: all 0.15s ease;
}
.dropdown-box .dropdown-list ul li button, .multi-dropdown-box .dropdown-list ul li button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background: #fff;
  text-align: left;
  white-space: nowrap;
  font-weight: 500;
  color: #222222;
  padding: 0px 7px 0px 16px;
  font-size: 16px;
  height: 53px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box .dropdown-list ul li button, .multi-dropdown-box .dropdown-list ul li button {
    padding: 0rem 0.4167rem 0rem 1rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box .dropdown-list ul li button, .multi-dropdown-box .dropdown-list ul li button {
    padding: 0vw 1.75vw 0vw 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box .dropdown-list ul li button, .multi-dropdown-box .dropdown-list ul li button {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box .dropdown-list ul li button, .multi-dropdown-box .dropdown-list ul li button {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box .dropdown-list ul li button, .multi-dropdown-box .dropdown-list ul li button {
    height: 3.3333rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box .dropdown-list ul li button, .multi-dropdown-box .dropdown-list ul li button {
    height: 14vw;
  }
}
@media screen and (min-width: 640px) {
  .dropdown-box .dropdown-list ul li button, .multi-dropdown-box .dropdown-list ul li button {
    padding: 0 12px 0 24px;
    height: 56px;
    max-width: 100%;
    font-size: 16px;
  }
}
.dropdown-box .dropdown-list ul li button:hover, .multi-dropdown-box .dropdown-list ul li button:hover {
  color: #4BC8C4;
  background: #F7FCFC;
}
.dropdown-box .dropdown-list ul li button.selected, .multi-dropdown-box .dropdown-list ul li button.selected {
  background: #4BC8C4;
  color: #fff;
}
.dropdown-box .dropdown-list ul li button.selected:after, .multi-dropdown-box .dropdown-list ul li button.selected:after {
  display: none;
  width: 13px;
  height: 10px;
  background: url("../images/components/icon_dropdown_check.svg") no-repeat center center;
  content: "";
}
.dropdown-box.placeholder > button, .multi-dropdown-box.placeholder > button {
  color: #888888;
  font-weight: normal;
}
.dropdown-box[direction=top] .dropdown-list, .multi-dropdown-box[direction=top] .dropdown-list {
  top: unset;
  bottom: 49px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box[direction=top] .dropdown-list, .multi-dropdown-box[direction=top] .dropdown-list {
    bottom: 3.0417rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box[direction=top] .dropdown-list, .multi-dropdown-box[direction=top] .dropdown-list {
    bottom: 12.775vw;
  }
}
.dropdown-box.open, .multi-dropdown-box.open {
  overflow: visible;
  margin-bottom: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .dropdown-box.open, .multi-dropdown-box.open {
    margin-bottom: 0.2917rem;
  }
}
@media (max-width: 639px) {
  .dropdown-box.open, .multi-dropdown-box.open {
    margin-bottom: 1.225vw;
  }
}
@media screen and (min-width: 1200px) {
  .dropdown-box.open, .multi-dropdown-box.open {
    margin-bottom: 7px;
  }
}
.dropdown-box.open > button, .multi-dropdown-box.open > button {
  border: 1px solid #4BC8C4;
}
.dropdown-box.open > button:after, .multi-dropdown-box.open > button:after {
  transform: translateY(-50%) rotate(-180deg);
}
.dropdown-box.open .dropdown-list, .multi-dropdown-box.open .dropdown-list {
  opacity: 1;
}
.dropdown-box.open .dropdown-list ul, .multi-dropdown-box.open .dropdown-list ul {
  height: 100%;
  max-height: 280px;
}

/* 멀티셀렉트박스 */
.multi-dropdown-box {
  position: relative;
  width: 100%;
}
.multi-dropdown-box .dropdown-list .list-search {
  position: sticky;
  right: 0;
  top: 0px;
  left: 0px;
  z-index: 1;
  background: #fff;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.multi-dropdown-box .dropdown-list .list-search input {
  width: 96%;
  background: #fff;
  border: 1px solid #BBBBBB;
  margin: 11px;
  padding-left: 16px;
  height: 53px;
  border-radius: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list .list-search input {
    margin: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list .list-search input {
    margin: 2.8vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list .list-search input {
    padding-left: 1rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list .list-search input {
    padding-left: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list .list-search input {
    height: 3.3333rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list .list-search input {
    height: 14vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list .list-search input {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list .list-search input {
    border-radius: 1.4vw;
  }
}
.multi-dropdown-box .dropdown-list .list-search .icon-svg {
  position: absolute;
  color: #4BC8C4;
  right: 20px;
  width: 27px;
  height: 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list .list-search .icon-svg {
    right: 1.25rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list .list-search .icon-svg {
    right: 5.25vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list .list-search .icon-svg {
    width: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list .list-search .icon-svg {
    width: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list .list-search .icon-svg {
    height: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list .list-search .icon-svg {
    height: 7vw;
  }
}
.multi-dropdown-box .dropdown-list ul {
  background: #fff;
  padding: 0px 0px 16px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list ul {
    padding: 0rem 0rem 1rem 0rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list ul {
    padding: 0vw 0vw 4.2vw 0vw;
  }
}
.multi-dropdown-box .dropdown-list ul li {
  margin-top: 5px;
}
.multi-dropdown-box .dropdown-list ul li:first-child {
  margin-top: 0px;
}
.multi-dropdown-box .dropdown-list ul li.empty {
  margin-top: 0px;
  color: #ccc;
  font-size: 16px;
  line-height: 60px;
  font-weight: 400;
  text-align: center;
}
.multi-dropdown-box .dropdown-list ul li label input {
  display: none;
}
.multi-dropdown-box .dropdown-list ul li label input + p {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 16px;
  height: 53px;
  background: #fff;
  color: #222222;
  font-weight: 500;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list ul li label input + p {
    padding-left: 1rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list ul li label input + p {
    padding-left: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list ul li label input + p {
    height: 3.3333rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list ul li label input + p {
    height: 14vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list ul li label input + p {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list ul li label input + p {
    font-size: 4.2vw;
  }
}
.multi-dropdown-box .dropdown-list ul li label input + p span {
  font: inherit;
  color: #fff;
  background: #4BC8C4;
}
.multi-dropdown-box .dropdown-list ul li label input:checked + p {
  color: #fff;
  background: #4BC8C4;
}
.multi-dropdown-box .dropdown-list ul li p {
  color: #222222;
  font-weight: 500;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .multi-dropdown-box .dropdown-list ul li p {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .multi-dropdown-box .dropdown-list ul li p {
    font-size: 4.2vw;
  }
}
.multi-dropdown-box .dropdown-list ul li p:hover {
  color: #4BC8C4;
  background: #F7FCFC;
}
.multi-dropdown-box[direction=top] .list-search {
  top: unset;
  bottom: 0px;
}
.multi-dropdown-box[direction=top] .list-search input {
  border-top: 1px solid #ddd;
  border-bottom: none;
}
.multi-dropdown-box[direction=top] .dropdown-list {
  top: unset;
  bottom: 53px;
  box-shadow: 0px -4px 10px rgba(0, 0, 0, 0.1);
}

/* 체크박스 */
.check-box {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.check-box > label input {
  display: block;
  margin: 0px;
  width: 17px;
  height: 17px;
  background: url("../images/components/icon_checkbox_off.svg") no-repeat center center;
  background-size: cover;
  border: none;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .check-box > label input {
    width: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .check-box > label input {
    width: 4.55vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .check-box > label input {
    height: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .check-box > label input {
    height: 4.55vw;
  }
}
.check-box > label input:checked {
  background: url("../images/components/icon_checkbox_on.svg") no-repeat center center;
  background-size: cover;
}
.check-box > label input:checked + label {
  color: #222222;
}
.check-box > label input:disabled:checked {
  background: url("../images/components/icon_checkbox_disabled.svg") no-repeat center center;
  background-size: cover;
}
.check-box > input {
  display: none;
}
.check-box > input + label {
  font-weight: 500;
  color: #999;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 17px;
  padding-left: 23px;
  font-size: 16px;
  background: url("../images/components/icon_checkbox_off.svg") no-repeat left center;
  background-size: contain;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .check-box > input + label {
    height: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .check-box > input + label {
    height: 4.55vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .check-box > input + label {
    padding-left: 1.4167rem;
  }
}
@media (max-width: 639px) {
  .check-box > input + label {
    padding-left: 5.95vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .check-box > input + label {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .check-box > input + label {
    font-size: 4.2vw;
  }
}
.check-box > input:checked + label {
  background: url("../images/components/icon_checkbox_on.svg") no-repeat left center;
  background-size: contain;
}
.check-box > input:checked + label {
  color: #222222;
}
.check-box > input:disabled:checked + label {
  background: url("../images/components/icon_checkbox_disabled.svg") no-repeat left center;
  background-size: contain;
}

.radio-group {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 40px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .radio-group {
    gap: 2.5rem;
  }
}
@media (max-width: 639px) {
  .radio-group {
    gap: 10.5vw;
  }
}

.radio-box {
  display: inline-block;
}
.radio-box label {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.radio-box label input {
  display: block;
  margin: 0px;
  width: 17px;
  height: 17px;
  margin-right: 5px;
  background: url("../images/components/icon_radio_off.svg") no-repeat center center;
  background-size: cover;
  border: none;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .radio-box label input {
    width: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .radio-box label input {
    width: 4.55vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .radio-box label input {
    height: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .radio-box label input {
    height: 4.55vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .radio-box label input {
    margin-right: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .radio-box label input {
    margin-right: 1.4vw;
  }
}
.radio-box label input:checked {
  background: url("../images/components/icon_radio_on.svg") no-repeat center center;
  background-size: cover;
}
.radio-box label input:checked + span {
  color: #222222;
}
.radio-box label input:disabled {
  opacity: 0.5;
}
.radio-box label input:disabled + span {
  opacity: 0.5;
}
.radio-box label span {
  color: #999;
  font-weight: 500;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .radio-box label span {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .radio-box label span {
    font-size: 4.2vw;
  }
}

/* 인풋박스 */
.form-row {
  margin-bottom: 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row {
    margin-bottom: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .form-row {
    margin-bottom: 7vw;
  }
}
.form-row > label,
.form-row > .label {
  display: block;
  cursor: default;
  font-weight: 600;
  color: #666666;
  margin-bottom: 9px;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row > label,
  .form-row > .label {
    margin-bottom: 0.5833rem;
  }
}
@media (max-width: 639px) {
  .form-row > label,
  .form-row > .label {
    margin-bottom: 2.45vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row > label,
  .form-row > .label {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .form-row > label,
  .form-row > .label {
    font-size: 4.2vw;
  }
}
.form-row > label span,
.form-row > .label span {
  font: inherit;
  color: #ccc;
}
.form-row > label span.required,
.form-row > .label span.required {
  color: #4BC8C4;
}
.form-row input[type=text],
.form-row input[type=number],
.form-row input[type=tel],
.form-row input[type=email],
.form-row input[type=password] {
  display: inline-block;
  width: 100%;
  background: #fff;
  border-style: solid;
  border-color: #BBBBBB;
  color: #888888;
  transition: border-color 0.3s ease-in-out;
  font-size: 16px;
  border-radius: 6px;
  border-width: 1px;
  padding: 20px 16px;
  height: 56px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    border-radius: 0.375rem;
  }
}
@media (max-width: 639px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    border-radius: 1.575vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    border-width: 0.0625rem;
  }
}
@media (max-width: 639px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    border-width: 0.2625vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    padding: 1.25rem 1rem;
  }
}
@media (max-width: 639px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    padding: 5.25vw 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    height: 3.5rem;
  }
}
@media (max-width: 639px) {
  .form-row input[type=text],
  .form-row input[type=number],
  .form-row input[type=tel],
  .form-row input[type=email],
  .form-row input[type=password] {
    height: 14.7vw;
  }
}
.form-row input[type=text]::-moz-placeholder, .form-row input[type=number]::-moz-placeholder, .form-row input[type=tel]::-moz-placeholder, .form-row input[type=email]::-moz-placeholder, .form-row input[type=password]::-moz-placeholder {
  font-weight: 500;
  color: #ccc;
  font-size: 16px;
}
.form-row input[type=text]::placeholder,
.form-row input[type=number]::placeholder,
.form-row input[type=tel]::placeholder,
.form-row input[type=email]::placeholder,
.form-row input[type=password]::placeholder {
  font-weight: 500;
  color: #ccc;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row input[type=text]::-moz-placeholder, .form-row input[type=number]::-moz-placeholder, .form-row input[type=tel]::-moz-placeholder, .form-row input[type=email]::-moz-placeholder, .form-row input[type=password]::-moz-placeholder {
    font-size: 1rem;
  }
  .form-row input[type=text]::placeholder,
  .form-row input[type=number]::placeholder,
  .form-row input[type=tel]::placeholder,
  .form-row input[type=email]::placeholder,
  .form-row input[type=password]::placeholder {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .form-row input[type=text]::-moz-placeholder, .form-row input[type=number]::-moz-placeholder, .form-row input[type=tel]::-moz-placeholder, .form-row input[type=email]::-moz-placeholder, .form-row input[type=password]::-moz-placeholder {
    font-size: 4.2vw;
  }
  .form-row input[type=text]::placeholder,
  .form-row input[type=number]::placeholder,
  .form-row input[type=tel]::placeholder,
  .form-row input[type=email]::placeholder,
  .form-row input[type=password]::placeholder {
    font-size: 4.2vw;
  }
}
.form-row input[type=text]:focus,
.form-row input[type=number]:focus,
.form-row input[type=tel]:focus,
.form-row input[type=email]:focus,
.form-row input[type=password]:focus {
  border-color: #4BC8C4;
}
.form-row input[type=text]:-moz-read-only, .form-row input[type=number]:-moz-read-only, .form-row input[type=tel]:-moz-read-only, .form-row input[type=email]:-moz-read-only, .form-row input[type=password]:-moz-read-only {
  border-color: #BBBBBB;
  background: #EEEEEE;
  color: #888888;
}
.form-row input[type=text]:disabled, .form-row input[type=text]:read-only,
.form-row input[type=number]:disabled,
.form-row input[type=number]:read-only,
.form-row input[type=tel]:disabled,
.form-row input[type=tel]:read-only,
.form-row input[type=email]:disabled,
.form-row input[type=email]:read-only,
.form-row input[type=password]:disabled,
.form-row input[type=password]:read-only {
  border-color: #BBBBBB;
  background: #EEEEEE;
  color: #888888;
}
.form-row input[type=text]:disabled::-moz-placeholder, .form-row input[type=text]:read-only::-moz-placeholder, .form-row input[type=number]:disabled::-moz-placeholder, .form-row input[type=number]:read-only::-moz-placeholder, .form-row input[type=tel]:disabled::-moz-placeholder, .form-row input[type=tel]:read-only::-moz-placeholder, .form-row input[type=email]:disabled::-moz-placeholder, .form-row input[type=email]:read-only::-moz-placeholder, .form-row input[type=password]:disabled::-moz-placeholder, .form-row input[type=password]:read-only::-moz-placeholder {
  color: #888888;
}
.form-row input[type=text]:-moz-read-only::placeholder, .form-row input[type=number]:-moz-read-only::placeholder, .form-row input[type=tel]:-moz-read-only::placeholder, .form-row input[type=email]:-moz-read-only::placeholder, .form-row input[type=password]:-moz-read-only::placeholder {
  color: #888888;
}
.form-row input[type=text]:disabled::placeholder, .form-row input[type=text]:read-only::placeholder,
.form-row input[type=number]:disabled::placeholder,
.form-row input[type=number]:read-only::placeholder,
.form-row input[type=tel]:disabled::placeholder,
.form-row input[type=tel]:read-only::placeholder,
.form-row input[type=email]:disabled::placeholder,
.form-row input[type=email]:read-only::placeholder,
.form-row input[type=password]:disabled::placeholder,
.form-row input[type=password]:read-only::placeholder {
  color: #888888;
}
.form-row textarea {
  resize: none;
  display: inline-block;
  width: 100%;
  background: #fff;
  border-style: solid;
  border-color: #DDDDDD;
  color: #888;
  transition: border-color 0.3s ease-in-out;
  font-size: 16px;
  border-radius: 6px;
  border-width: 1px;
  padding: 20px 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row textarea {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .form-row textarea {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row textarea {
    border-radius: 0.375rem;
  }
}
@media (max-width: 639px) {
  .form-row textarea {
    border-radius: 1.575vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row textarea {
    border-width: 0.0625rem;
  }
}
@media (max-width: 639px) {
  .form-row textarea {
    border-width: 0.2625vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row textarea {
    padding: 1.25rem 1rem;
  }
}
@media (max-width: 639px) {
  .form-row textarea {
    padding: 5.25vw 4.2vw;
  }
}
.form-row textarea:disabled {
  border-color: #ccc;
  background: #eee;
  color: #666;
}
.form-row.error-row input[type=text],
.form-row.error-row input[type=number],
.form-row.error-row input[type=tel],
.form-row.error-row input[type=email],
.form-row.error-row input[type=password],
.form-row.error-row textarea {
  border-color: #f82417;
}
.form-row.error-row input[type=text]:focus + .error,
.form-row.error-row input[type=number]:focus + .error,
.form-row.error-row input[type=tel]:focus + .error,
.form-row.error-row input[type=email]:focus + .error,
.form-row.error-row input[type=password]:focus + .error,
.form-row.error-row textarea:focus + .error {
  display: block !important;
}
.form-row.error-row input[type=text]:empty,
.form-row.error-row input[type=number]:empty,
.form-row.error-row input[type=tel]:empty,
.form-row.error-row input[type=email]:empty,
.form-row.error-row input[type=password]:empty,
.form-row.error-row textarea:empty {
  display: none !important;
}
.form-row.valid-row .error {
  display: none !important;
}
.form-row div.error {
  position: relative;
  color: #f82417;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 15px;
  padding: 8px 0px 8px 4px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row div.error {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .form-row div.error {
    font-size: 3.85vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row div.error {
    padding: 0.5rem 0rem 0.5rem 0.25rem;
  }
}
@media (max-width: 639px) {
  .form-row div.error {
    padding: 2.1vw 0vw 2.1vw 1.05vw;
  }
}
.form-row div.error:before {
  content: "*";
  color: #f82417;
  margin-right: 4px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row div.error:before {
    margin-right: 0.25rem;
  }
}
@media (max-width: 639px) {
  .form-row div.error:before {
    margin-right: 1.05vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .form-row div.error:before {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .form-row div.error:before {
    font-size: 3.85vw;
  }
}
.form-row.required > label {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.form-row.required > label:after {
  content: "*";
  position: relative;
  display: flex;
  color: #f82417;
}

/* 파일박스 */
.file-box {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0px 10px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .file-box {
    gap: 0rem 0.625rem;
  }
}
@media (max-width: 639px) {
  .file-box {
    gap: 0vw 2.625vw;
  }
}
.file-box .input-file {
  flex-shrink: 0;
}
.file-box .input-file label {
  display: inline-block;
  background: #4BC8C4;
  font-weight: 600;
  color: #fff;
  padding: 0px 7px;
  border-radius: 6px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .file-box .input-file label {
    padding: 0rem 0.4167rem;
  }
}
@media (max-width: 639px) {
  .file-box .input-file label {
    padding: 0vw 1.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .file-box .input-file label {
    border-radius: 0.375rem;
  }
}
@media (max-width: 639px) {
  .file-box .input-file label {
    border-radius: 1.575vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .file-box .input-file label {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .file-box .input-file label {
    font-size: 3.85vw;
  }
}
.file-box .input-file label input {
  display: none;
}
.file-box ul {
  flex: 1;
  overflow: hidden;
}
.file-box ul li {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0px 10px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .file-box ul li {
    gap: 0rem 0.625rem;
  }
}
@media (max-width: 639px) {
  .file-box ul li {
    gap: 0vw 2.625vw;
  }
}
.file-box ul li:first-child {
  margin-top: 0px;
}
.file-box ul li p {
  max-width: calc(100% - 3.675vw);
  font-weight: 500;
  color: #666;
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .file-box ul li p {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .file-box ul li p {
    font-size: 3.85vw;
  }
}
.file-box ul li button {
  display: flex;
  justify-content: center;
  align-items: center;
}
.file-box ul li button i .icon-close2 {
  width: 12px;
  height: 11px;
  stroke: black;
  stroke-width: 6;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .file-box ul li button i .icon-close2 {
    width: 0.75rem;
  }
}
@media (max-width: 639px) {
  .file-box ul li button i .icon-close2 {
    width: 3.15vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .file-box ul li button i .icon-close2 {
    height: 0.7083rem;
  }
}
@media (max-width: 639px) {
  .file-box ul li button i .icon-close2 {
    height: 2.975vw;
  }
}

/* 전체메뉴 */
#toggle-menu {
  display: inline-block;
  position: absolute;
  z-index: 98;
  cursor: pointer;
  top: 0;
  background: transparent;
  transition: all 0.1s ease-in;
  right: 6px;
  width: 67px;
  height: 67px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu {
    right: 0.375rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu {
    right: 1.575vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu {
    width: 4.1667rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu {
    width: 17.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu {
    height: 4.1667rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu {
    height: 17.5vw;
  }
}
#toggle-menu div {
  position: relative;
  width: 20px;
  height: 15px;
  margin: 26px auto auto 24px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu div {
    width: 1.25rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu div {
    width: 5.25vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu div {
    height: 0.9583rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu div {
    height: 4.025vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu div {
    margin: 1.6042rem auto auto 1.4792rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu div {
    margin: 6.7375vw auto auto 6.2125vw;
  }
}
#toggle-menu div span {
  display: block;
  background-color: #000;
  position: absolute;
  transition: transform 0.2s ease-in-out, top 0.1s ease-in-out 0.2s, opacity 0.1s ease-in-out 0.2s;
  -webkit-transition: -webkit-transform 0.2s ease-in-out, top 0.1s ease-in-out 0.2s, opacity 0.1s ease-in-out 0.2s;
  -moz-transition: -moz-transform 0.2s ease-in-out, top 0.1s ease-in-out 0.2s, opacity 0.1s ease-in-out 0.2s;
  transform-origin: center;
  border-radius: 0;
  overflow: hidden;
  width: 20px;
  height: 2px;
  border-radius: 2px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu div span {
    width: 1.25rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu div span {
    width: 5.25vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu div span {
    height: 0.125rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu div span {
    height: 0.525vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu div span {
    border-radius: 0.125rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu div span {
    border-radius: 0.525vw;
  }
}
#toggle-menu div span.top {
  top: 0;
}
#toggle-menu div span.middle {
  top: 7px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu div span.middle {
    top: 0.4167rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu div span.middle {
    top: 1.75vw;
  }
}
#toggle-menu div span.bottom {
  top: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu div span.bottom {
    top: 0.8333rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu div span.bottom {
    top: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  #toggle-menu {
    width: 100px;
    height: 100px;
    right: 0;
  }
  #toggle-menu div {
    width: 20px;
    height: 18 px;
    margin: 41px auto auto 38px;
  }
  #toggle-menu div span {
    width: 20px;
    height: 2px;
    border-radius: 2px;
  }
  #toggle-menu div span.middle {
    top: 8px;
  }
  #toggle-menu div span.bottom {
    top: 16px;
  }
}
@media screen and (min-width: 1600px) {
  #toggle-menu {
    right: 42px;
  }
}

#toggle-menu.menu-is-active {
  position: absolute;
  background: transparent;
}
#toggle-menu.menu-is-active:before {
  position: absolute;
  content: " ";
  display: inline-block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
#toggle-menu.menu-is-active span {
  background-color: #000;
  transition: transform 0.2s ease-in-out 0.1s, top 0.1s ease-in-out, opacity 0.1s ease-in-out;
  -webkit-transition: -webkit-transform 0.2s ease-in-out 0.2s, top 0.1s ease-in-out, opacity 0.1s ease-in-out;
  -moz-transition: -moz-transform 0.2s ease-in-out 0.1s, top 0.1s ease-in-out, opacity 0.1s ease-in-out;
  box-shadow: 0px 0px 0px 0px #93deff;
}
#toggle-menu.menu-is-active span.top {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  top: 7px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu.menu-is-active span.top {
    top: 0.4167rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu.menu-is-active span.top {
    top: 1.75vw;
  }
}
#toggle-menu.menu-is-active span.middle {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  opacity: 0;
  top: 7px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu.menu-is-active span.middle {
    top: 0.4167rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu.menu-is-active span.middle {
    top: 1.75vw;
  }
}
#toggle-menu.menu-is-active span.bottom {
  transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  top: 7px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #toggle-menu.menu-is-active span.bottom {
    top: 0.4167rem;
  }
}
@media (max-width: 639px) {
  #toggle-menu.menu-is-active span.bottom {
    top: 1.75vw;
  }
}

.gnb {
  position: fixed;
  width: 78.125%;
  height: 100vh;
  top: 0;
  left: 100%;
  transition: all 0.2s ease-in;
  opacity: 0;
  overflow: hidden;
  background: #141414;
  z-index: 102;
  padding-top: 88px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb {
    padding-top: 5.5208rem;
  }
}
@media (max-width: 639px) {
  .gnb {
    padding-top: 23.1875vw;
  }
}
@media screen and (min-width: 1200px) {
  .gnb {
    top: -100%;
    left: 0;
    width: 100%;
  }
}
.gnb .gnb-list {
  width: 100%;
  padding: 0px 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list {
    padding: 0rem 1.3333rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list {
    padding: 0vw 5.6vw;
  }
}
.gnb .gnb-list .gnb-item {
  width: 100%;
  flex-flow: wrap;
  border-bottom: 1px solid #666666;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 16px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list .gnb-item {
    padding: 1rem 0rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list .gnb-item {
    padding: 4.2vw 0vw;
  }
}
.gnb .gnb-list .gnb-item > a {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list .gnb-item > a {
    padding: 0rem 1.3333rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list .gnb-item > a {
    padding: 0vw 5.6vw;
  }
}
.gnb .gnb-list .gnb-item > a span {
  color: #4BC8C4;
  font-weight: 500;
  font-size: 17px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list .gnb-item > a span {
    font-size: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list .gnb-item > a span {
    font-size: 4.55vw;
  }
}
@media screen and (min-width: 1200px) {
  .gnb .gnb-list .gnb-item > a span {
    font-size: 22px;
  }
}
.gnb .gnb-list .gnb-item > a .icon-svg {
  width: 24px;
  height: 24px;
  color: #4BC8C4;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list .gnb-item > a .icon-svg {
    width: 1.5rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list .gnb-item > a .icon-svg {
    width: 6.3vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list .gnb-item > a .icon-svg {
    height: 1.5rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list .gnb-item > a .icon-svg {
    height: 6.3vw;
  }
}
.gnb .gnb-list .gnb-item > a .icon-svg svg {
  width: 100%;
  transition: all 0.15s ease-in-out;
}
.gnb .gnb-list .gnb-item .depth2 {
  display: none;
  width: 100%;
  padding: 17px 0px 17px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list .gnb-item .depth2 {
    padding: 1.0833rem 0rem 1.0833rem 0rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list .gnb-item .depth2 {
    padding: 4.55vw 0vw 4.55vw 0vw;
  }
}
.gnb .gnb-list .gnb-item .depth2 li {
  width: 100%;
  text-align: left;
  padding: 9px 0px 9px 22px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list .gnb-item .depth2 li {
    padding: 0.5833rem 0rem 0.5833rem 1.3958rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list .gnb-item .depth2 li {
    padding: 2.45vw 0vw 2.45vw 5.8625vw;
  }
}
.gnb .gnb-list .gnb-item .depth2 li a {
  color: #BBBBBB;
  font-weight: 500;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .gnb .gnb-list .gnb-item .depth2 li a {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .gnb .gnb-list .gnb-item .depth2 li a {
    font-size: 4.2vw;
  }
}
@media screen and (min-width: 1200px) {
  .gnb .gnb-list .gnb-item .depth2 li a {
    font-size: 18px;
  }
}
.gnb .gnb-list .gnb-item .depth2 li a:hover {
  color: #fff;
}
.gnb .gnb-list .gnb-item.active > a .icon-svg svg {
  transform: rotate(180deg);
}
.gnb .app_download {
  display: none;
}
.gnb.gnb-pc {
  position: relative;
  margin: auto auto auto calc(50% - 360px);
  max-width: 590px;
  top: 0;
  opacity: 1;
  transition: none;
  height: 80px;
}
.gnb.gnb-pc .gnb-list {
  opacity: 1;
  transition: none;
  transition-delay: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.gnb.gnb-pc .gnb-list .gnb-item {
  border: none;
  padding: 33px 0px;
  position: relative;
}
.gnb.gnb-pc .gnb-list .gnb-item > a span {
  font-weight: 600;
  font-size: 16px;
}
.gnb.gnb-pc .gnb-list .gnb-item > a i {
  display: none;
}
.gnb.gnb-pc .gnb-list .gnb-item:nth-child(6) {
  position: relative;
}
.gnb.gnb-pc .gnb-list .gnb-item:nth-child(6) .shop-badge {
  position: absolute;
  left: 20px;
  top: 4px;
  width: 46px;
  height: 22px;
  border-radius: 22px;
  font-size: 10px;
}
.gnb.gnb-pc .gnb-list .gnb-item .depth2 {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border: 1px solid #E6E2E0;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  min-width: 200px;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: all 0.2s ease;
  padding: 16px 0;
  display: block;
}
.gnb.gnb-pc .gnb-list .gnb-item .depth2 li {
  padding: 0;
  border: none;
  height: auto;
}
.gnb.gnb-pc .gnb-list .gnb-item .depth2 li a {
  display: block;
  padding: 12px 24px;
  color: #3E3A36;
  font-weight: 500;
  font-size: 14px;
  text-decoration: none;
  transition: all 0.2s ease;
  text-align: center;
}
.gnb.gnb-pc .gnb-list .gnb-item .depth2 li a:hover {
  background: #f8f8f8;
  color: #ED1C24;
}
.gnb.gnb-pc .gnb-list .gnb-item:hover .depth2 {
  opacity: 1;
  visibility: visible;
}
.gnb.gnb-pc .mobile_sns {
  display: none;
}

.pc-gnb {
  display: none;
}
@media screen and (min-width: 1200px) {
  .pc-gnb {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 100%;
    max-width: 470px;
    margin-left: 30px;
  }
  .pc-gnb .gnb-list {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .pc-gnb .gnb-list .gnb-item {
    position: relative;
    height: 100%;
    padding: 0 6px;
  }
  .pc-gnb .gnb-list .gnb-item a {
    color: #666666;
    font-weight: 600;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  .pc-gnb .gnb-list .gnb-item ul {
    position: absolute;
    width: auto;
    height: auto;
    top: 80px;
    left: 10px;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 18px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
    border: 2px solid #EEE;
    padding: 28px 24px;
    display: none;
  }
  .pc-gnb .gnb-list .gnb-item ul.is-active {
    display: grid;
  }
  .pc-gnb .gnb-list .gnb-item ul li a {
    white-space: nowrap;
    color: #AAAAAA;
    font-size: 16px;
    font-weight: 500;
    text-align: left;
  }
  .pc-gnb .gnb-list .gnb-item ul li a:hover {
    color: #4BC8C4;
  }
  .pc-gnb .gnb-list .gnb-item.is-active ul {
    display: grid;
  }
}
@media screen and (min-width: 1600px) {
  .pc-gnb {
    max-width: 570px;
    margin-left: 84px;
  }
  .pc-gnb .gnb-list .gnb-item {
    padding: 0 15px;
  }
}

header {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 100;
  background: #fff;
  border-bottom: 1px solid #F5F5F5;
  height: 67px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header {
    height: 4.1667rem;
  }
}
@media (max-width: 639px) {
  header {
    height: 17.5vw;
  }
}
@media screen and (min-width: 1200px) {
  header {
    border-bottom: 1px solid #E6E2E0;
    height: 100px;
  }
  header .gnb {
    padding-top: 250px;
  }
  header .gnb .gnb-list {
    max-width: 1000px;
    margin: auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
  header .gnb .gnb-list .gnb-item {
    width: auto;
    border: none;
    padding: 0;
  }
  header .gnb .gnb-list .gnb-item > a {
    justify-content: center;
  }
  header .gnb .gnb-list .gnb-item > a .icon-svg {
    display: none;
  }
  header .gnb .gnb-list .gnb-item .depth2 {
    display: block;
    padding-bottom: 0;
  }
  header .gnb .gnb-list .gnb-item .depth2 li {
    text-align: center;
    padding-left: 0;
  }
  header .gnb .app_download {
    display: block;
    width: 100%;
    border-top: 1px solid #222222;
    padding-top: 40px;
    margin-top: 180px;
  }
  header .gnb .app_download ul {
    position: relative;
    width: 1000px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
  }
  header .gnb .app_download ul li {
    width: 317px;
    height: 90px;
  }
  header .gnb .app_download ul li a {
    background: #000000;
    border-radius: 12px;
    padding: 0 32px;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.15s ease-in;
  }
  header .gnb .app_download ul li a .icon-svg {
    width: 24px;
    height: 24px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  header .gnb .app_download ul li a .icon-svg svg {
    width: 100%;
    --icon-stroke-width:6px;
    transform: rotate(-90deg);
  }
  header .gnb .app_download ul li:first-child {
    width: 342px;
    height: 90px;
  }
  header .gnb .app_download ul li:first-child strong {
    color: #4BC8C4;
    font-size: 18px;
    font-weight: 700;
  }
  header .gnb .app_download ul li:first-child p {
    color: #AAAAAA;
    font-size: 16px;
    font-weight: 500;
    margin-top: 16px;
  }
  header .gnb .app_download ul li:nth-child(2) {
    margin-right: 24px;
  }
  header .gnb .app_download ul li:nth-child(2) a:hover, header .gnb .app_download ul li:nth-child(3) a:hover {
    background: #4BC8C4;
  }
}
header .header-inner {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
header .header-inner .logo {
  position: absolute;
  display: block;
  z-index: 3;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 18px;
  left: 16px;
  width: 131px;
  height: 30px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .logo {
    top: 1.1458rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .logo {
    top: 4.8125vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .logo {
    left: 1rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .logo {
    left: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .logo {
    width: 8.2083rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .logo {
    width: 34.475vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .logo {
    height: 1.875rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .logo {
    height: 7.875vw;
  }
}
header .header-inner .logo a {
  width: 123px;
  height: 21px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .logo a {
    width: 7.6667rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .logo a {
    width: 32.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .logo a {
    height: 1.3333rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .logo a {
    height: 5.6vw;
  }
}
header .header-inner .logo a img {
  width: 100%;
}
@media screen and (min-width: 1200px) {
  header .header-inner .logo {
    position: absolute;
    width: 157px;
    height: 50px;
    left: 50%;
    top: 25px;
    transform: translateX(-50%);
  }
  header .header-inner .logo a {
    width: 135px;
    height: 23px;
  }
}
header .header-inner .header-util {
  position: relative;
  width: 179px;
  height: 29px;
  transition: all 0.15s ease-in-out;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .header-util {
    width: 11.1875rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .header-util {
    width: 46.9875vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .header-util {
    height: 1.8333rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .header-util {
    height: 7.7vw;
  }
}
header .header-inner .header-util .lang-selector {
  display: none;
}
header .header-inner .header-util .btn-mypage, header .header-inner .header-util .btn-logout, header .header-inner .header-util .btn-membership {
  color: #4BC8C4;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  height: 29px;
  border-radius: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .header-util .btn-mypage, header .header-inner .header-util .btn-logout, header .header-inner .header-util .btn-membership {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .header-util .btn-mypage, header .header-inner .header-util .btn-logout, header .header-inner .header-util .btn-membership {
    font-size: 3.85vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .header-util .btn-mypage, header .header-inner .header-util .btn-logout, header .header-inner .header-util .btn-membership {
    height: 1.8333rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .header-util .btn-mypage, header .header-inner .header-util .btn-logout, header .header-inner .header-util .btn-membership {
    height: 7.7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .header-util .btn-mypage, header .header-inner .header-util .btn-logout, header .header-inner .header-util .btn-membership {
    border-radius: 0.9167rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .header-util .btn-mypage, header .header-inner .header-util .btn-logout, header .header-inner .header-util .btn-membership {
    border-radius: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  header .header-inner .header-util .btn-mypage, header .header-inner .header-util .btn-logout, header .header-inner .header-util .btn-membership {
    height: 34px;
    border-radius: 17px;
    font-size: 16px;
  }
}
header .header-inner .header-util .btn-logout {
  display: none;
}
@media screen and (min-width: 1200px) {
  header .header-inner .header-util .btn-logout {
    display: flex;
    width: 103px;
    margin-right: 16px;
  }
}
header .header-inner .header-util .btn-mypage {
  display: none;
}
@media screen and (min-width: 1200px) {
  header .header-inner .header-util .btn-mypage {
    display: flex;
    width: 117px;
    color: #0AA49F;
    margin-right: 16px;
  }
}
header .header-inner .header-util .btn-membership {
  width: 108px;
  margin-right: 65px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .header-util .btn-membership {
    width: 6.7708rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .header-util .btn-membership {
    width: 28.4375vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .header-util .btn-membership {
    margin-right: 4.0625rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .header-util .btn-membership {
    margin-right: 17.0625vw;
  }
}
@media screen and (min-width: 1200px) {
  header .header-inner .header-util .btn-membership {
    width: 131px;
    margin-right: 16px;
  }
}
@media screen and (min-width: 1200px) {
  header .header-inner .header-util {
    width: 480px;
    margin-right: 100px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  header .header-inner .header-util .lang-selector {
    width: 88px;
    height: 34px;
    display: block;
  }
  header .header-inner .header-util .lang-selector .lang-selector-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-style: solid;
    border-color: #777777;
    border-width: 2px;
    width: 88px;
    height: 34px;
    border-radius: 17px;
    padding: 0 16px;
    transition: background-color 0.2s ease-in-out;
  }
  header .header-inner .header-util .lang-selector .lang-selector-button span {
    color: #777777;
    font-weight: 600;
    font-size: 16px;
  }
  header .header-inner .header-util .lang-selector .lang-selector-button .icon-svg {
    width: 16px;
    height: 16px;
    color: #777777;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  header .header-inner .header-util .lang-selector .lang-selector-button .icon-svg svg {
    transition: transform 0.4s ease;
    --icon-stroke-width:12px;
  }
  header .header-inner .header-util .lang-selector .lang-selector-list {
    opacity: 0;
    position: absolute;
    width: 88px;
    top: 100%;
    left: 0;
    max-height: 0;
    overflow: hidden;
    list-style: none;
    padding: 10px 0 0px 20px;
    margin: 5px 0 0 0;
    border: 2px solid #EEEEEE;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.1);
    font-size: 16px;
    font-weight: 500;
    color: #888;
    transition: max-height 0.3s ease-out, opacity 0.2s ease-in;
  }
  header .header-inner .header-util .lang-selector .lang-selector-list li {
    padding: 2px 0;
  }
  header .header-inner .header-util .lang-selector .lang-selector-list li a:hover {
    color: #4BC8C4;
  }
  header .header-inner .header-util .lang-selector:hover .lang-selector-button {
    background: #777777;
  }
  header .header-inner .header-util .lang-selector:hover .lang-selector-button span {
    color: #fff;
  }
  header .header-inner .header-util .lang-selector:hover .lang-selector-button .icon-svg {
    color: #fff;
  }
  header .header-inner .header-util .lang-selector.active .lang-selector-button {
    background: #777777;
  }
  header .header-inner .header-util .lang-selector.active .lang-selector-button span {
    color: #fff;
  }
  header .header-inner .header-util .lang-selector.active .lang-selector-button .icon-svg {
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  header .header-inner .header-util .lang-selector.active .lang-selector-button .icon-svg svg {
    transform: rotate(180deg);
  }
  header .header-inner .header-util .lang-selector.active .lang-selector-list {
    opacity: 1;
    max-height: 140px;
    padding-bottom: 16px;
  }
}
@media screen and (min-width: 1600px) {
  header .header-inner .header-util {
    margin-right: 142px;
  }
}
header .header-inner .page-back-button {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: #fff;
  z-index: 9;
  height: 67px;
  border-bottom: 1px solid #EEEEEE;
  display: none;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .page-back-button {
    height: 4.1667rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .page-back-button {
    height: 17.5vw;
  }
}
header .header-inner .page-back-button a {
  width: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
header .header-inner .page-back-button a .icon-svg {
  width: 67px;
  height: 67px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .page-back-button a .icon-svg {
    width: 4.1667rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .page-back-button a .icon-svg {
    width: 17.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .page-back-button a .icon-svg {
    height: 4.1667rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .page-back-button a .icon-svg {
    height: 17.5vw;
  }
}
header .header-inner .page-back-button a .icon-svg svg {
  width: 27px;
  height: 27px;
  transform: rotate(90deg);
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .page-back-button a .icon-svg svg {
    width: 1.6667rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .page-back-button a .icon-svg svg {
    width: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .page-back-button a .icon-svg svg {
    height: 1.6667rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .page-back-button a .icon-svg svg {
    height: 7vw;
  }
}
header .header-inner .page-back-button a strong {
  color: #222222;
  font-weight: 600;
  font-size: 17px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header .header-inner .page-back-button a strong {
    font-size: 1.0833rem;
  }
}
@media (max-width: 639px) {
  header .header-inner .page-back-button a strong {
    font-size: 4.55vw;
  }
}
header .header-inner .page-back-button.active {
  display: flex;
}
@media screen and (min-width: 1200px) {
  header .header-inner .page-back-button.active {
    display: none;
  }
}
@media screen and (min-width: 1200px) {
  header .header-inner .page-back-button {
    display: none;
  }
}
@media screen and (min-width: 1200px) {
  header .header-inner {
    justify-content: space-between;
  }
}
header.pc-menu-open .gnb {
  top: 0;
  opacity: 1;
}
header.pc-menu-open .logo {
  z-index: 102;
  left: 130px;
}
header.pc-menu-open .logo a {
  background: url("../../../assets/images/common/logo_white.svg") no-repeat 50% 50%;
  background-size: cover;
}
header.pc-menu-open .logo a img {
  opacity: 0;
}
header.pc-menu-open .header-util {
  z-index: 110;
}
header.pc-menu-open .header-util .btn-mypage, header.pc-menu-open .header-util .btn-logout, header.pc-menu-open .header-util .btn-membership {
  border-color: #fff;
  color: #fff;
}
header.pc-menu-open .header-util .btn-mypage:hover, header.pc-menu-open .header-util .btn-logout:hover, header.pc-menu-open .header-util .btn-membership:hover {
  border-color: #4BC8C4;
}
header.pc-menu-open #toggle-menu {
  z-index: 111;
}
header.pc-menu-open #toggle-menu div span {
  background: #fff;
}
header.mobile-menu-open .header-util {
  z-index: 110;
  width: calc(78.125% - 5.6vw);
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
@media screen and (min-width: 640px) {
  header.mobile-menu-open .header-util {
    width: calc(85.125% - 4.1667rem);
  }
}
@media screen and (min-width: 768px) {
  header.mobile-menu-open .header-util {
    width: calc(82.125% - 4.1667rem);
  }
}
header.mobile-menu-open .header-util .btn-mypage, header.mobile-menu-open .header-util .btn-logout, header.mobile-menu-open .header-util .btn-membership {
  border-color: #fff;
  color: #fff;
}
header.mobile-menu-open .header-util .btn-membership {
  margin-right: auto;
  margin-left: 0;
}
header.mobile-menu-open .header-util .btn-mypage {
  display: flex;
  padding: 0px 16px;
  margin-right: 11px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header.mobile-menu-open .header-util .btn-mypage {
    padding: 0rem 1rem;
  }
}
@media (max-width: 639px) {
  header.mobile-menu-open .header-util .btn-mypage {
    padding: 0vw 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  header.mobile-menu-open .header-util .btn-mypage {
    margin-right: 0.6667rem;
  }
}
@media (max-width: 639px) {
  header.mobile-menu-open .header-util .btn-mypage {
    margin-right: 2.8vw;
  }
}
header.mobile-menu-open .header-util .btn-logout {
  display: flex;
  padding: 0px 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  header.mobile-menu-open .header-util .btn-logout {
    padding: 0rem 1rem;
  }
}
@media (max-width: 639px) {
  header.mobile-menu-open .header-util .btn-logout {
    padding: 0vw 4.2vw;
  }
}
header.mobile-menu-open #toggle-menu {
  z-index: 111;
}
header.mobile-menu-open #toggle-menu div span {
  background: #fff;
}
header.mobile-menu-open .gnb {
  left: 21.875%;
  opacity: 1;
}

body {
  position: relative;
  /*&:before {
      content: "";
      position: fixed;
      width: 100%;
      height: 100%;
      background:rgba(255,255,255,0.9);
      top: 0;
      left: 100%; 
      z-index: 101;
      transition: all .3s ease-in;
  }*/
}
body.overflow {
  overflow: hidden;
  /*&:before {
      left: 0; 
  }*/
}
body.overflow header .gnb {
  overflow: overlay;
}

html {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  min-height: 707px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  body {
    min-height: 44.1667rem;
  }
}
@media (max-width: 639px) {
  body {
    min-height: 185.5vw;
  }
}
.pb0 {
  padding-bottom: 0 !important;
}

.container {
  position: relative;
  width: 100%;
  padding: 67px 0 67px 0;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container {
    padding: 4.1667rem 0 4.1667rem 0;
  }
}
@media (max-width: 639px) {
  .container {
    padding: 17.5vw 0 17.5vw 0;
  }
}
.container:has(.exchange-login) {
  padding-bottom: 107px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container:has(.exchange-login) {
    padding-bottom: 6.6667rem;
  }
}
@media (max-width: 639px) {
  .container:has(.exchange-login) {
    padding-bottom: 28vw;
  }
}
@media screen and (min-width: 1200px) {
  .container {
    padding-top: 100px;
  }
  .container:has(.exchange-login) {
    padding-bottom: 160px;
  }
}
.container-inner {
  width: 100%;
  max-width: 1000px;
  margin: auto;
  padding: 40px 27px 0px 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner {
    padding: 2.5rem 1.6667rem 0rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner {
    padding: 10.5vw 7vw 0vw 7vw;
  }
}
@media screen and (min-width: 1200px) {
  .container-inner {
    padding: 100px 0 20px 0;
  }
}
.container-inner-form {
  width: 100%;
}
@media screen and (min-width: 640px) {
  .container-inner-form {
    margin: auto;
    max-width: 480px;
  }
}
.container-inner-form.container-inner-return.pt0 {
  padding-top: 0;
}
@media screen and (min-width: 640px) {
  .container-inner-form.container-inner-return {
    max-width: 100%;
  }
}
@media screen and (min-width: 1200px) {
  .container-inner-form.container-inner-return {
    max-width: 1000px;
  }
}

/*콘텐츠 타이틀*/
.title-row-content {
  padding: 33px 0px 20px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content {
    padding: 2.0833rem 0rem 1.25rem 0rem;
  }
}
@media (max-width: 639px) {
  .title-row-content {
    padding: 8.75vw 0vw 5.25vw 0vw;
  }
}
@media screen and (min-width: 1200px) {
  .title-row-content {
    padding: 60px 0px 40px 0px;
  }
}
.title-row-content.first {
  padding-top: 0;
}
.title-row-content.center h4 {
  text-align: center;
}
.title-row-content h4 {
  font-size: 24px;
  font-weight: 700;
  color: #222222;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content h4 {
    font-size: 1.5rem;
  }
}
@media (max-width: 639px) {
  .title-row-content h4 {
    font-size: 6.3vw;
  }
}
@media screen and (min-width: 1200px) {
  .title-row-content h4 {
    font-size: 28px;
  }
}
.title-row-content h4 strong {
  color: #4BC8C4;
}
.title-row-content p {
  color: #777777;
  font-weight: 400;
  margin-top: 7px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content p {
    margin-top: 0.4167rem;
  }
}
@media (max-width: 639px) {
  .title-row-content p {
    margin-top: 1.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content p {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .title-row-content p {
    font-size: 3.85vw;
  }
}
.title-row-content p.left {
  text-align: left;
}
.title-row-content.small {
  padding: 21px 0px 4px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content.small {
    padding: 1.3333rem 0rem 0.25rem 0rem;
  }
}
@media (max-width: 639px) {
  .title-row-content.small {
    padding: 5.6vw 0vw 1.05vw 0vw;
  }
}
.title-row-content.small h4 {
  font-size: 16px;
  font-weight: 700;
  color: #222222;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content.small h4 {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .title-row-content.small h4 {
    font-size: 4.2vw;
  }
}
@media screen and (min-width: 1200px) {
  .title-row-content.small h4 {
    font-size: 18px;
  }
}
.title-row-content.icon {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (min-width: 1200px) {
  .title-row-content.icon {
    padding-bottom: 12px;
  }
}
.title-row-content.icon h4 {
  font-weight: 600;
  color: #222222;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content.icon h4 {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .title-row-content.icon h4 {
    font-size: 4.2vw;
  }
}
@media screen and (min-width: 640px) {
  .title-row-content.icon h4 {
    font-size: 18px;
  }
}
.title-row-content.icon a {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.title-row-content.icon a .icon-svg {
  --pen-check-path1-fill-color:#4BC8C4;
  --pen-check-path2-stroke-color:#4BC8C4;
  width: 19px;
  height: 19px;
  margin-right: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content.icon a .icon-svg {
    width: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .title-row-content.icon a .icon-svg {
    width: 4.9vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content.icon a .icon-svg {
    height: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .title-row-content.icon a .icon-svg {
    height: 4.9vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content.icon a .icon-svg {
    margin-right: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .title-row-content.icon a .icon-svg {
    margin-right: 1.4vw;
  }
}
.title-row-content.icon a span {
  font-weight: 500;
  color: #777777;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .title-row-content.icon a span {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .title-row-content.icon a span {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 640px) {
  .title-row-content.icon a span {
    font-size: 14px;
  }
}

/*페이지 타이틀 기본*/
.page-title {
  padding: 67px 27px 40px 27px;
  /*서브카피가 들어가 있는 경우*/
}
@media (min-width: 640px) and (max-width: 1199px) {
  .page-title {
    padding: 4.1667rem 1.6667rem 2.5rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .page-title {
    padding: 17.5vw 7vw 10.5vw 7vw;
  }
}
@media screen and (min-width: 1200px) {
  .page-title {
    padding: 100px 0;
  }
}
.page-title h2 {
  text-align: center;
  color: #222222;
  font-weight: 700;
  font-size: 29px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .page-title h2 {
    font-size: 1.8333rem;
  }
}
@media (max-width: 639px) {
  .page-title h2 {
    font-size: 7.7vw;
  }
}
.page-title .txt-row {
  max-width: 100%;
  text-align: center;
  color: #AAAAAA;
  font-weight: 500;
  margin: auto;
  word-break: keep-all;
  font-size: 17px;
  margin-top: 11px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .page-title .txt-row {
    font-size: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .page-title .txt-row {
    font-size: 4.55vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .page-title .txt-row {
    margin-top: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .page-title .txt-row {
    margin-top: 2.8vw;
  }
}
.page-title .txt-row.point {
  font-weight: 600;
  color: #4BC8C4;
}
@media screen and (min-width: 1200px) {
  .page-title .txt-row.point {
    margin-top: 30px;
  }
}
.page-title.bg-gray {
  width: 100%;
  background: #F9F9F9;
  padding-bottom: 67px;
  box-shadow: 0px -30px 30px -25px rgba(0, 0, 0, 0.1) inset;
  -webkit-box-shadow: 0px -30px 30px -25px rgba(0, 0, 0, 0.1) inset;
  -moz-box-shadow: 0px -30px 30px -25px rgba(0, 0, 0, 0.1) inset;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .page-title.bg-gray {
    padding-bottom: 4.1667rem;
  }
}
@media (max-width: 639px) {
  .page-title.bg-gray {
    padding-bottom: 17.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .page-title.bg-gray {
    padding-bottom: 100px;
    min-height: 294px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-flow: wrap;
  }
  .page-title.bg-gray h2, .page-title.bg-gray .txt-row, .page-title.bg-gray h3 {
    width: 100%;
  }
}
.page-title.bg-darkgray {
  background: #888888;
}
.page-title.bg-mint {
  width: 100%;
  background: #4BC8C4;
  padding-top: 60px;
  padding-bottom: 40px;
  box-shadow: 0px -30px 30px -25px rgba(0, 0, 0, 0.1) inset;
  -webkit-box-shadow: 0px -30px 30px -25px rgba(0, 0, 0, 0.1) inset;
  -moz-box-shadow: 0px -30px 30px -25px rgba(0, 0, 0, 0.1) inset;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .page-title.bg-mint {
    padding-top: 3.75rem;
  }
}
@media (max-width: 639px) {
  .page-title.bg-mint {
    padding-top: 15.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .page-title.bg-mint {
    padding-bottom: 2.5rem;
  }
}
@media (max-width: 639px) {
  .page-title.bg-mint {
    padding-bottom: 10.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .page-title.bg-mint {
    padding-bottom: 100px;
    min-height: 294px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-flow: wrap;
  }
  .page-title.bg-mint h2, .page-title.bg-mint .txt-row, .page-title.bg-mint h3 {
    width: 100%;
  }
}
.page-title.small {
  min-height: 163px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .page-title.small {
    min-height: 10.1667rem;
  }
}
@media (max-width: 639px) {
  .page-title.small {
    min-height: 42.7vw;
  }
}
@media screen and (min-width: 1200px) {
  .page-title.small {
    min-height: 244px;
  }
}

/*테이블*/
.table-row .table {
  width: 100%;
  table-layout: auto;
  border-top: 1px solid #4BC8C4;
  border-bottom: 1px solid #AAAAAA;
}
.table-row .table.col2 col:first-child {
  width: 133px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.col2 col:first-child {
    width: 8.3333rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.col2 col:first-child {
    width: 35vw;
  }
}
@media screen and (min-width: 640px) {
  .table-row .table.col2 col:first-child {
    width: 200px;
  }
}
.table-row .table.col3 col:first-child {
  min-width: 133px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.col3 col:first-child {
    min-width: 8.3333rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.col3 col:first-child {
    min-width: 35vw;
  }
}
.table-row .table.col4 col:nth-child(1), .table-row .table.col4 col:nth-child(3) {
  min-width: 67px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.col4 col:nth-child(1), .table-row .table.col4 col:nth-child(3) {
    min-width: 4.1667rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.col4 col:nth-child(1), .table-row .table.col4 col:nth-child(3) {
    min-width: 17.5vw;
  }
}
.table-row .table.col5 col {
  width: 20%;
}
.table-row .table.responsive.col4 col:nth-child(1) {
  width: 35.7142857143%;
}
.table-row .table.responsive.col4 col:nth-child(2) {
  width: 64.2857142857%;
}
@media screen and (min-width: 1200px) {
  .table-row .table.responsive.col4 col:nth-child(1), .table-row .table.responsive.col4 col:nth-child(3) {
    width: 16.6666666667%;
  }
  .table-row .table.responsive.col4 col:nth-child(2), .table-row .table.responsive.col4 col:nth-child(4) {
    width: 33.3333333333%;
  }
}
.table-row .table.responsive.col4 th {
  font-weight: 500;
  color: #4BC8C4;
  background: #F7FCFC;
  vertical-align: middle;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.responsive.col4 th {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.responsive.col4 th {
    font-size: 3.85vw;
  }
}
.table-row .table.responsive.col4 td {
  vertical-align: middle;
}
.table-row .table.responsive.col4 td:nth-child(1) {
  text-align: center;
  font-weight: 500;
  color: #4BC8C4;
  background: #F7FCFC;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.responsive.col4 td:nth-child(1) {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.responsive.col4 td:nth-child(1) {
    font-size: 3.85vw;
  }
}
.table-row .table.responsive.col4 td:nth-child(2) {
  text-align: left;
  font-weight: 400;
  color: #666666;
  padding-left: 13px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.responsive.col4 td:nth-child(2) {
    padding-left: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.responsive.col4 td:nth-child(2) {
    padding-left: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.responsive.col4 td:nth-child(2) {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.responsive.col4 td:nth-child(2) {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .table-row .table.responsive.col4 td:nth-child(1), .table-row .table.responsive.col4 td:nth-child(3) {
    text-align: center;
    font-weight: 500;
    color: #4BC8C4;
    background: #F7FCFC;
    font-size: 15px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.responsive.col4 td:nth-child(1), .table-row .table.responsive.col4 td:nth-child(3) {
    font-size: 0.9167rem;
  }
}
@media screen and (min-width: 1200px) and (max-width: 639px) {
  .table-row .table.responsive.col4 td:nth-child(1), .table-row .table.responsive.col4 td:nth-child(3) {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .table-row .table.responsive.col4 td:nth-child(2), .table-row .table.responsive.col4 td:nth-child(4) {
    text-align: left;
    font-weight: 400;
    color: #666666;
    padding-left: 13px;
    font-size: 15px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.responsive.col4 td:nth-child(2), .table-row .table.responsive.col4 td:nth-child(4) {
    padding-left: 0.8333rem;
  }
}
@media screen and (min-width: 1200px) and (max-width: 639px) {
  .table-row .table.responsive.col4 td:nth-child(2), .table-row .table.responsive.col4 td:nth-child(4) {
    padding-left: 3.5vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.responsive.col4 td:nth-child(2), .table-row .table.responsive.col4 td:nth-child(4) {
    font-size: 0.9167rem;
  }
}
@media screen and (min-width: 1200px) and (max-width: 639px) {
  .table-row .table.responsive.col4 td:nth-child(2), .table-row .table.responsive.col4 td:nth-child(4) {
    font-size: 3.85vw;
  }
}
.table-row .table caption {
  color: #222222;
  text-align: left;
  font-weight: 600;
  font-size: 16px;
  padding: 40px 0px 8px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table caption {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .table-row .table caption {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table caption {
    padding: 2.5rem 0rem 0.5rem 0rem;
  }
}
@media (max-width: 639px) {
  .table-row .table caption {
    padding: 10.5vw 0vw 2.1vw 0vw;
  }
}
@media screen and (min-width: 1200px) {
  .table-row .table caption {
    font-size: 18px;
    padding: 64px 0px 12px 0px;
  }
}
.table-row .table caption.caption-hide {
  font-size: 0;
  overflow: hidden;
  text-indent: -9999px;
  padding: 21px 0px 0px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table caption.caption-hide {
    padding: 1.3333rem 0rem 0rem 0rem;
  }
}
@media (max-width: 639px) {
  .table-row .table caption.caption-hide {
    padding: 5.6vw 0vw 0vw 0vw;
  }
}
@media screen and (min-width: 1200px) {
  .table-row .table caption.caption-hide {
    padding-top: 24px;
  }
}
.table-row .table th, .table-row .table td {
  vertical-align: middle;
  padding: 21px 0px;
  border-bottom: 1px solid #AAAAAA;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table th, .table-row .table td {
    padding: 1.3333rem 0rem;
  }
}
@media (max-width: 639px) {
  .table-row .table th, .table-row .table td {
    padding: 5.6vw 0vw;
  }
}
@media screen and (min-width: 640px) {
  .table-row .table th, .table-row .table td {
    font-size: 14px;
    padding: 24px 0px;
  }
}
.table-row .table th.center, .table-row .table td.center {
  text-align: center !important;
}
.table-row .table.horizontal-type th {
  vertical-align: middle;
  font-weight: 500;
  color: #4BC8C4;
  background: #F7FCFC;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.horizontal-type th {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.horizontal-type th {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .table-row .table.horizontal-type th {
    font-size: 14px;
  }
}
.table-row .table.horizontal-type td {
  vertical-align: middle;
  text-align: left;
  font-weight: 400;
  color: #666666;
  padding-left: 13px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.horizontal-type td {
    padding-left: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.horizontal-type td {
    padding-left: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.horizontal-type td {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.horizontal-type td {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .table-row .table.horizontal-type td {
    font-size: 14px;
  }
}
.table-row .table.vertical-type th {
  vertical-align: middle;
  font-weight: 500;
  color: #4BC8C4;
  background: #F7FCFC;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.vertical-type th {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.vertical-type th {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .table-row .table.vertical-type th {
    font-size: 14px;
  }
}
.table-row .table.vertical-type td {
  vertical-align: middle;
  text-align: left;
  font-weight: 400;
  color: #666666;
  padding-left: 13px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.vertical-type td {
    padding-left: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.vertical-type td {
    padding-left: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.vertical-type td {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.vertical-type td {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .table-row .table.vertical-type td {
    font-size: 14px;
  }
}
.table-row .table.mixed-type th {
  font-weight: 500;
  color: #4BC8C4;
  background: #F7FCFC;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.mixed-type th {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.mixed-type th {
    font-size: 3.85vw;
  }
}
.table-row .table.mixed-type td {
  text-align: left;
  font-weight: 400;
  color: #666666;
  padding-left: 13px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.mixed-type td {
    padding-left: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.mixed-type td {
    padding-left: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .table-row .table.mixed-type td {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .table-row .table.mixed-type td {
    font-size: 3.85vw;
  }
}
.table-row.scroll {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.table-row.scroll table {
  width: 1024px;
}
@media screen and (min-width: 1200px) {
  .table-row.scroll table {
    width: 100%;
  }
}

/*박스*/
.box-row {
  border: 1px solid #BBBBBB;
  border-radius: 11px;
  padding: 33px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .box-row {
    border-radius: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .box-row {
    border-radius: 2.8vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .box-row {
    padding: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .box-row {
    padding: 8.75vw;
  }
}

/* 상품 */
.product.list.item .item-date, .product.view.item .item-date {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.product.list.item .item-date .icon-svg, .product.view.item .item-date .icon-svg {
  color: #4BC8C4;
  width: 16px;
  height: 16px;
  margin-right: 4px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-date .icon-svg, .product.view.item .item-date .icon-svg {
    width: 1rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-date .icon-svg, .product.view.item .item-date .icon-svg {
    width: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-date .icon-svg, .product.view.item .item-date .icon-svg {
    height: 1rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-date .icon-svg, .product.view.item .item-date .icon-svg {
    height: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-date .icon-svg, .product.view.item .item-date .icon-svg {
    margin-right: 0.25rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-date .icon-svg, .product.view.item .item-date .icon-svg {
    margin-right: 1.05vw;
  }
}
.product.list.item .item-date span, .product.view.item .item-date span {
  font-weight: 600;
  color: #4BC8C4;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-date span, .product.view.item .item-date span {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-date span, .product.view.item .item-date span {
    font-size: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .product.list.item .item-date, .product.view.item .item-date {
    font-size: 14px;
  }
  .product.list.item .item-date .icon-svg, .product.view.item .item-date .icon-svg {
    width: 18px;
    height: 18px;
  }
}
.product.list.item .item-label, .product.view.item .item-label {
  font-weight: 600;
  border: 2px solid transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
  border-radius: 28px;
  padding: 4px 16px;
  font-size: 13px;
  margin-right: 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-label, .product.view.item .item-label {
    border-radius: 1.75rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-label, .product.view.item .item-label {
    border-radius: 7.35vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-label, .product.view.item .item-label {
    padding: 0.25rem 1rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-label, .product.view.item .item-label {
    padding: 1.05vw 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-label, .product.view.item .item-label {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-label, .product.view.item .item-label {
    font-size: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-label, .product.view.item .item-label {
    margin-right: 0.5rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-label, .product.view.item .item-label {
    margin-right: 2.1vw;
  }
}
@media screen and (min-width: 1200px) {
  .product.list.item .item-label, .product.view.item .item-label {
    padding: 4px 24px;
    font-size: 16px;
  }
}
.product.list.item .item-label.submitted, .product.view.item .item-label.submitted {
  background: #4BC8C4;
  color: #fff;
  border-color: #4BC8C4;
}
.product.list.item .item-label.pending, .product.view.item .item-label.pending {
  background: #fff;
  border-color: #4BC8C4;
  color: #4BC8C4;
}
.product.list.item .item-label.processing, .product.view.item .item-label.processing {
  background: #4BC8C4;
  color: #fff;
  border-color: #4BC8C4;
}
.product.list.item .item-label.completed, .product.view.item .item-label.completed {
  background: #EEEEEE;
  color: #AAAAAA;
  border-color: #EEEEEE;
}
.product.list.item .item-name, .product.view.item .item-name {
  color: #222222;
  font-weight: 600;
  font-size: 21px;
  margin: 7px 0px 13px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-name, .product.view.item .item-name {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-name, .product.view.item .item-name {
    font-size: 5.6vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-name, .product.view.item .item-name {
    margin: 0.4167rem 0rem 0.8333rem 0rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-name, .product.view.item .item-name {
    margin: 1.75vw 0vw 3.5vw 0vw;
  }
}
@media screen and (min-width: 1200px) {
  .product.list.item .item-name, .product.view.item .item-name {
    font-size: 24px;
  }
}
.product.list.item .item-info, .product.view.item .item-info {
  display: grid;
  grid-template-columns: auto 1fr;
  color: #777777;
  margin-bottom: 4px;
  gap: 4px 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-info, .product.view.item .item-info {
    margin-bottom: 0.25rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-info, .product.view.item .item-info {
    margin-bottom: 1.05vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-info, .product.view.item .item-info {
    gap: 0.25rem 0.5rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-info, .product.view.item .item-info {
    gap: 1.05vw 2.1vw;
  }
}
.product.list.item .item-info dt, .product.view.item .item-info dt {
  text-align: left;
  font-weight: 400;
  font-size: 15px;
  white-space: nowrap;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-info dt, .product.view.item .item-info dt {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-info dt, .product.view.item .item-info dt {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .product.list.item .item-info dt, .product.view.item .item-info dt {
    font-size: 14px;
  }
}
.product.list.item .item-info dd, .product.view.item .item-info dd {
  text-align: left;
  font-weight: 600;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-info dd, .product.view.item .item-info dd {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-info dd, .product.view.item .item-info dd {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .product.list.item .item-info dd, .product.view.item .item-info dd {
    font-size: 14px;
  }
}
.product.list.item .item-more, .product.view.item .item-more {
  width: 100%;
  box-shadow: none;
  margin-top: 33px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-more, .product.view.item .item-more {
    margin-top: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-more, .product.view.item .item-more {
    margin-top: 8.75vw;
  }
}
.product.list.item .item-box, .product.view.item .item-box {
  background: #F9F9F9;
  padding: 16px;
  border-radius: 11px;
  margin-top: 20px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box, .product.view.item .item-box {
    padding: 1rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box, .product.view.item .item-box {
    padding: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box, .product.view.item .item-box {
    border-radius: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box, .product.view.item .item-box {
    border-radius: 2.8vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box, .product.view.item .item-box {
    margin-top: 1.25rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box, .product.view.item .item-box {
    margin-top: 5.25vw;
  }
}
.product.list.item .item-box dl, .product.view.item .item-box dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box dl, .product.view.item .item-box dl {
    gap: 0.25rem 0.5rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box dl, .product.view.item .item-box dl {
    gap: 1.05vw 2.1vw;
  }
}
.product.list.item .item-box dl dt, .product.view.item .item-box dl dt {
  text-align: left;
  font-weight: 600;
  color: #666666;
  margin-right: 8px;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box dl dt, .product.view.item .item-box dl dt {
    margin-right: 0.5rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box dl dt, .product.view.item .item-box dl dt {
    margin-right: 2.1vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box dl dt, .product.view.item .item-box dl dt {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box dl dt, .product.view.item .item-box dl dt {
    font-size: 3.5vw;
  }
}
.product.list.item .item-box dl dt.w100, .product.view.item .item-box dl dt.w100 {
  margin-right: 0;
  text-align: left;
}
@media screen and (min-width: 1200px) {
  .product.list.item .item-box dl dt, .product.view.item .item-box dl dt {
    font-size: 14px;
  }
}
.product.list.item .item-box dl dd, .product.view.item .item-box dl dd {
  text-align: left;
  font-weight: 400;
  color: #777777;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box dl dd, .product.view.item .item-box dl dd {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box dl dd, .product.view.item .item-box dl dd {
    font-size: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .product.list.item .item-box dl dd, .product.view.item .item-box dl dd {
    font-size: 14px;
  }
}
.product.list.item .item-box dl dd strong, .product.view.item .item-box dl dd strong {
  font-weight: 600;
}
.product.list.item .item-box dl dd strong span, .product.view.item .item-box dl dd strong span {
  font-weight: 600;
  color: #4BC8C4;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box dl dd strong span, .product.view.item .item-box dl dd strong span {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box dl dd strong span, .product.view.item .item-box dl dd strong span {
    font-size: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .product.list.item .item-box dl dd strong span, .product.view.item .item-box dl dd strong span {
    font-size: 14px;
  }
}
.product.list.item .item-box dl dd.w100, .product.view.item .item-box dl dd.w100 {
  margin-right: 0;
  text-align: left;
  grid-column: 1/-1;
}
.product.list.item .item-box hr, .product.view.item .item-box hr {
  margin: 16px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item .item-box hr, .product.view.item .item-box hr {
    margin: 1rem 0rem;
  }
}
@media (max-width: 639px) {
  .product.list.item .item-box hr, .product.view.item .item-box hr {
    margin: 4.2vw 0vw;
  }
}
.product.list.item.no-data, .product.view.item.no-data {
  text-align: center;
}
.product.list.item.no-data p, .product.view.item.no-data p {
  text-align: center;
  margin-top: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item.no-data p, .product.view.item.no-data p {
    margin-top: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .product.list.item.no-data p, .product.view.item.no-data p {
    margin-top: 3.85vw;
  }
}
.product.list.item.no-data .icon-svg, .product.view.item.no-data .icon-svg {
  --path1-fill-color:#E6E6E6;
  --path2-fill-color:#fff;
  margin: auto;
  width: 31px;
  height: 31px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item.no-data .icon-svg, .product.view.item.no-data .icon-svg {
    width: 1.9375rem;
  }
}
@media (max-width: 639px) {
  .product.list.item.no-data .icon-svg, .product.view.item.no-data .icon-svg {
    width: 8.1375vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.list.item.no-data .icon-svg, .product.view.item.no-data .icon-svg {
    height: 1.9375rem;
  }
}
@media (max-width: 639px) {
  .product.list.item.no-data .icon-svg, .product.view.item.no-data .icon-svg {
    height: 8.1375vw;
  }
}
.product.view.item {
  border: none;
  padding: 33px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.view.item {
    padding: 2.0833rem 0rem;
  }
}
@media (max-width: 639px) {
  .product.view.item {
    padding: 8.75vw 0vw;
  }
}
.product.view.item .item-name {
  margin: 0;
  margin-bottom: 16px;
  text-align: left;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.view.item .item-name {
    margin-bottom: 1rem;
  }
}
@media (max-width: 639px) {
  .product.view.item .item-name {
    margin-bottom: 4.2vw;
  }
}
.product.view.item .item-info {
  color: #222222;
  margin-bottom: 3px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .product.view.item .item-info {
    margin-bottom: 0.2083rem;
  }
}
@media (max-width: 639px) {
  .product.view.item .item-info {
    margin-bottom: 0.875vw;
  }
}

/*li 하이픈 리스트*/
.hyphen-list {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-flow: wrap;
}
.hyphen-list li {
  width: 100%;
  position: relative;
  font-weight: 400;
  color: #666666;
  font-size: 14px;
  padding-left: 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .hyphen-list li {
    font-size: 0.875rem;
  }
}
@media (max-width: 639px) {
  .hyphen-list li {
    font-size: 3.675vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .hyphen-list li {
    padding-left: 0.5rem;
  }
}
@media (max-width: 639px) {
  .hyphen-list li {
    padding-left: 2.1vw;
  }
}
.hyphen-list li:before {
  content: "-";
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 400;
  color: #666666;
  font-size: 14px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .hyphen-list li:before {
    font-size: 0.875rem;
  }
}
@media (max-width: 639px) {
  .hyphen-list li:before {
    font-size: 3.675vw;
  }
}
.hyphen-list li.list-none {
  padding-left: 0;
}
.hyphen-list li.list-none:before {
  display: none;
}
.hyphen-list.dot li:before {
  content: "·";
}
.hyphen-list.list-none li {
  padding-left: 0;
}
.hyphen-list.list-none li:before {
  display: none;
}

/* 리스트 스타일 */
.list_style_custom li {
  position: relative;
  font-weight: 400;
  color: #777777;
  margin-bottom: 4px;
  margin-left: 16px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom li {
    margin-bottom: 0.25rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom li {
    margin-bottom: 1.05vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom li {
    margin-left: 1rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom li {
    margin-left: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom li {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom li {
    font-size: 4.025vw;
  }
}
@media screen and (min-width: 640px) {
  .list_style_custom li {
    font-size: 16px;
  }
}
.list_style_custom li.list-none {
  padding-left: 0;
}
.list_style_custom li.list-none:before {
  display: none;
}
.list_style_custom li.point-black, .list_style_custom li .point-black {
  font-size: 15px;
  color: #222222;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom li.point-black, .list_style_custom li .point-black {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom li.point-black, .list_style_custom li .point-black {
    font-size: 4.025vw;
  }
}
@media screen and (min-width: 640px) {
  .list_style_custom li.point-black, .list_style_custom li .point-black {
    font-size: 16px;
  }
}
.list_style_custom li.point-black:before, .list_style_custom li .point-black:before {
  color: #222222 !important;
}
.list_style_custom li.point-red, .list_style_custom li .point-red {
  font-size: 15px;
  color: #ED1C24;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom li.point-red, .list_style_custom li .point-red {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom li.point-red, .list_style_custom li .point-red {
    font-size: 4.025vw;
  }
}
@media screen and (min-width: 640px) {
  .list_style_custom li.point-red, .list_style_custom li .point-red {
    font-size: 16px;
  }
}
.list_style_custom li.point-red:before, .list_style_custom li .point-red:before {
  color: #ED1C24 !important;
}
.list_style_custom li.hyphen {
  position: relative;
}
.list_style_custom li.hyphen:before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
  font-weight: 400;
  color: #777777;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom li.hyphen:before {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom li.hyphen:before {
    font-size: 4.025vw;
  }
}
@media screen and (min-width: 640px) {
  .list_style_custom li.hyphen:before {
    font-size: 16px;
  }
}
.list_style_custom.number {
  list-style-type: decimal;
}
.list_style_custom.number li.list-none {
  list-style-type: none;
  margin-left: 0;
}
.list_style_custom.dot li:before {
  content: "·";
}
.list_style_custom.dot li.hyphen {
  position: relative;
}
.list_style_custom.dot li.hyphen:before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
  font-weight: 400;
  color: #777777;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom.dot li.hyphen:before {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom.dot li.hyphen:before {
    font-size: 4.025vw;
  }
}
@media screen and (min-width: 640px) {
  .list_style_custom.dot li.hyphen:before {
    font-size: 16px;
  }
}
.list_style_custom.asterisk {
  list-style-type: none;
}
.list_style_custom.asterisk li {
  margin-left: 0;
  padding-left: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom.asterisk li {
    padding-left: 1rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom.asterisk li {
    padding-left: 4.2vw;
  }
}
.list_style_custom.asterisk li:before {
  content: "*";
  position: absolute;
  top: 0;
  left: 0;
  font-weight: 400;
  color: #777777;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .list_style_custom.asterisk li:before {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .list_style_custom.asterisk li:before {
    font-size: 4.025vw;
  }
}
@media screen and (min-width: 640px) {
  .list_style_custom.asterisk li:before {
    font-size: 16px;
  }
}
.list_style_custom.asterisk li.hyphen:before {
  content: "-";
}

/* 둥근원안에 숫자 */
.circled_numbers {
  margin-top: 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .circled_numbers {
    margin-top: 0.5rem;
  }
}
@media (max-width: 639px) {
  .circled_numbers {
    margin-top: 2.1vw;
  }
}
.circled_numbers > li {
  position: relative;
  color: #777777;
  font-weight: 400;
  list-style: none;
  padding-left: 0;
  margin-left: 16px;
  margin-bottom: 8px;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .circled_numbers > li {
    margin-left: 1rem;
  }
}
@media (max-width: 639px) {
  .circled_numbers > li {
    margin-left: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .circled_numbers > li {
    margin-bottom: 0.5rem;
  }
}
@media (max-width: 639px) {
  .circled_numbers > li {
    margin-bottom: 2.1vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .circled_numbers > li {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .circled_numbers > li {
    font-size: 3.5vw;
  }
}
.circled_numbers > li:before {
  content: "①";
  font-weight: 400;
  position: absolute;
  color: #777777;
  font-size: 13px;
  left: -16px;
  margin-right: 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .circled_numbers > li:before {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .circled_numbers > li:before {
    font-size: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .circled_numbers > li:before {
    left: -1rem;
  }
}
@media (max-width: 639px) {
  .circled_numbers > li:before {
    left: -4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .circled_numbers > li:before {
    margin-right: 0.5rem;
  }
}
@media (max-width: 639px) {
  .circled_numbers > li:before {
    margin-right: 2.1vw;
  }
}
.circled_numbers > li:nth-child(1):before {
  content: "①";
}
.circled_numbers > li:nth-child(2):before {
  content: "②";
}
.circled_numbers > li:nth-child(3):before {
  content: "③";
}
.circled_numbers > li:nth-child(4):before {
  content: "④";
}
.circled_numbers > li:nth-child(5):before {
  content: "⑤";
}
.circled_numbers > li:nth-child(6):before {
  content: "⑥";
}
.circled_numbers > li:nth-child(7):before {
  content: "⑦";
}
.circled_numbers > li:nth-child(8):before {
  content: "⑧";
}
.circled_numbers > li:nth-child(9):before {
  content: "⑨";
}
.circled_numbers > li:nth-child(10):before {
  content: "⑩";
}
.circled_numbers > li:nth-child(11):before {
  content: "⑪";
}
.circled_numbers > li:nth-child(12):before {
  content: "⑫";
}
.circled_numbers > li:nth-child(13):before {
  content: "⑬";
}
.circled_numbers > li:nth-child(14):before {
  content: "⑭";
}
.circled_numbers > li:nth-child(15):before {
  content: "⑮";
}
.circled_numbers > li:nth-child(16):before {
  content: "⑯";
}
.circled_numbers > li:nth-child(17):before {
  content: "⑰";
}
.circled_numbers > li:nth-child(18):before {
  content: "⑱";
}
.circled_numbers > li:nth-child(19):before {
  content: "⑲";
}
.circled_numbers > li:nth-child(20):before {
  content: "⑳";
}

.note-row {
  background: #F9F9F9;
  border-radius: 11px;
  padding: 21px 27px;
  margin-top: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row {
    border-radius: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .note-row {
    border-radius: 2.8vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row {
    padding: 1.3333rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .note-row {
    padding: 5.6vw 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row {
    margin-top: 1rem;
  }
}
@media (max-width: 639px) {
  .note-row {
    margin-top: 4.2vw;
  }
}
.note-row .note strong {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 11px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note strong {
    margin-bottom: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .note-row .note strong {
    margin-bottom: 2.8vw;
  }
}
.note-row .note strong .icon-svg {
  --path1-stroke-color:#4BC8C4;
  --path2-fill-color:#4BC8C4;
  margin-right: 4px;
  width: 16px;
  height: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note strong .icon-svg {
    margin-right: 0.25rem;
  }
}
@media (max-width: 639px) {
  .note-row .note strong .icon-svg {
    margin-right: 1.05vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note strong .icon-svg {
    width: 1rem;
  }
}
@media (max-width: 639px) {
  .note-row .note strong .icon-svg {
    width: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note strong .icon-svg {
    height: 1rem;
  }
}
@media (max-width: 639px) {
  .note-row .note strong .icon-svg {
    height: 4.2vw;
  }
}
.note-row .note strong span {
  color: #666666;
  font-weight: 600;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note strong span {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .note-row .note strong span {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .note-row .note strong span {
    font-size: 14px;
  }
}
.note-row .note ul {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-flow: wrap;
}
.note-row .note ul li {
  width: 100%;
  position: relative;
  color: #777777;
  font-weight: 400;
  font-size: 13px;
  padding-left: 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note ul li {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .note-row .note ul li {
    font-size: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note ul li {
    padding-left: 0.5rem;
  }
}
@media (max-width: 639px) {
  .note-row .note ul li {
    padding-left: 2.1vw;
  }
}
.note-row .note ul li span.small {
  font-weight: 400;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note ul li span.small {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .note-row .note ul li span.small {
    font-size: 3.5vw;
  }
}
.note-row .note ul li:before {
  content: "·";
  position: absolute;
  left: 0;
  top: 0;
  color: #777777;
  font-weight: 400;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note ul li:before {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .note-row .note ul li:before {
    font-size: 3.5vw;
  }
}
.note-row .note ul li.asterisk:before {
  content: "*";
}
@media screen and (min-width: 1200px) {
  .note-row .note ul li {
    font-size: 14px;
  }
}
.note-row .note ul.reference_mark {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.note-row .note ul.reference_mark li {
  text-align: left;
  padding-left: 12px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .note-row .note ul.reference_mark li {
    padding-left: 0.75rem;
  }
}
@media (max-width: 639px) {
  .note-row .note ul.reference_mark li {
    padding-left: 3.15vw;
  }
}
.note-row .note ul.reference_mark li:before {
  content: "※";
}
.note-row .note ul.list-none li {
  font-weight: 600;
  padding-left: 0;
}
.note-row .note ul.list-none li:before {
  display: none;
}
.note-row .note ul.hyphen-list li:before {
  content: "-";
}
.note-row.no-title {
  background: #fff;
  padding: 0;
}

.step-row {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 47px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row {
    margin-top: 2.9167rem;
  }
}
@media (max-width: 639px) {
  .step-row {
    margin-top: 12.25vw;
  }
}
@media screen and (min-width: 1200px) {
  .step-row {
    margin-top: 36px;
  }
}
.step-row .step-bar {
  display: grid;
  width: 320px;
  height: 5px;
  grid-template-columns: repeat(5, 1fr);
  gap: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar {
    width: 20rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar {
    width: 84vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar {
    height: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar {
    height: 1.4vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar {
    gap: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar {
    gap: 1.4vw;
  }
}
.step-row .step-bar li {
  position: relative;
  height: 100%;
  background: #E6E6E6;
  overflow: hidden;
  width: 60px;
  border-radius: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar li {
    width: 3.7292rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar li {
    width: 15.6625vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar li {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar li {
    border-radius: 1.4vw;
  }
}
.step-row .step-bar li:before {
  content: "";
  position: absolute;
  width: 0;
  height: 100%;
  left: 0;
  top: 0;
  background: #4BC8C4;
  transform: translateZ(0px);
  transition: width 0.25s linear;
  will-change: width;
}
.step-row .step-bar li.active:before {
  width: 100%;
}
.step-row .step-bar.number5 {
  grid-template-columns: repeat(5, 1fr);
  gap: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number5 {
    gap: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number5 {
    gap: 1.4vw;
  }
}
.step-row .step-bar.number5 li {
  width: 60px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number5 li {
    width: 3.7292rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number5 li {
    width: 15.6625vw;
  }
}
.step-row .step-bar.number6 {
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number6 {
    gap: 0.25rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number6 {
    gap: 1.05vw;
  }
}
.step-row .step-bar.number6 li {
  width: 50px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number6 li {
    width: 3.125rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number6 li {
    width: 13.125vw;
  }
}
.step-row .step-bar.number7 {
  grid-template-columns: repeat(7, 1fr);
  gap: 3px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number7 {
    gap: 0.2083rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number7 {
    gap: 0.875vw;
  }
}
.step-row .step-bar.number7 li {
  width: 43px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number7 li {
    width: 2.6667rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number7 li {
    width: 11.2vw;
  }
}
.step-row .step-bar.number8 {
  grid-template-columns: repeat(8, 1fr);
  gap: 3px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number8 {
    gap: 0.1875rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number8 {
    gap: 0.7875vw;
  }
}
.step-row .step-bar.number8 li {
  width: 37px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number8 li {
    width: 2.3333rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number8 li {
    width: 9.8vw;
  }
}
.step-row .step-bar.number9 {
  grid-template-columns: repeat(9, 1fr);
  gap: 3px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number9 {
    gap: 0.1771rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number9 {
    gap: 0.7438vw;
  }
}
.step-row .step-bar.number9 li {
  width: 33px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number9 li {
    width: 2.0625rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number9 li {
    width: 8.6625vw;
  }
}
.step-row .step-bar.number10 {
  grid-template-columns: repeat(10, 1fr);
  gap: 3px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number10 {
    gap: 0.1875rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number10 {
    gap: 0.7875vw;
  }
}
.step-row .step-bar.number10 li {
  width: 29px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .step-row .step-bar.number10 li {
    width: 1.8333rem;
  }
}
@media (max-width: 639px) {
  .step-row .step-bar.number10 li {
    width: 7.7vw;
  }
}

.tab {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (min-width: 640px) {
  .tab {
    width: 500px;
    margin: 100px auto 0 auto;
  }
}
.tab li {
  width: 50%;
  height: 60px;
  background: #E6F7F6;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .tab li {
    height: 3.75rem;
  }
}
@media (max-width: 639px) {
  .tab li {
    height: 15.75vw;
  }
}
.tab li a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  color: #4BC8C4;
  font-weight: 600;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .tab li a {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .tab li a {
    font-size: 4.2vw;
  }
}
.tab li.active, .tab li:hover {
  background: #4BC8C4;
}
.tab li.active a, .tab li:hover a {
  color: #fff;
}

.container-inner-form.exchange-login {
  padding: 107px 27px 0px 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form.exchange-login {
    padding: 6.6667rem 1.6667rem 0rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form.exchange-login {
    padding: 28vw 7vw 0vw 7vw;
  }
}
.container-inner-form.exchange-login .page-title {
  padding: 0px 27px 40px 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form.exchange-login .page-title {
    padding: 0rem 1.6667rem 2.5rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form.exchange-login .page-title {
    padding: 0vw 7vw 10.5vw 7vw;
  }
}
@media screen and (min-width: 640px) {
  .container-inner-form.exchange-login .page-title {
    padding: 160px 0 80px 0;
  }
}
@media screen and (min-width: 1200px) {
  .container-inner-form.exchange-login .page-title {
    padding: 160px 0 80px 0;
  }
}
.container-inner-form.exchange-login .submit-row {
  margin-bottom: 0;
}
.container-inner-form .visit-content, .container-inner-form .delivery-content {
  display: none;
}
.container-inner-form .visit-content.hide, .container-inner-form .delivery-content.hide {
  display: none;
}
.container-inner-form .visit-content.show, .container-inner-form .delivery-content.show {
  display: block;
}
.container-inner-form .txt-box.visit, .container-inner-form .txt-box.delivery {
  background: #F9F9F9;
  border-radius: 11px;
  padding: 21px 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .txt-box.visit, .container-inner-form .txt-box.delivery {
    border-radius: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .txt-box.visit, .container-inner-form .txt-box.delivery {
    border-radius: 2.8vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .txt-box.visit, .container-inner-form .txt-box.delivery {
    padding: 1.3333rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .txt-box.visit, .container-inner-form .txt-box.delivery {
    padding: 5.6vw 7vw;
  }
}
.container-inner-form .txt-box.visit .title-row, .container-inner-form .txt-box.delivery .title-row {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 4px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .txt-box.visit .title-row, .container-inner-form .txt-box.delivery .title-row {
    margin-bottom: 0.25rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .txt-box.visit .title-row, .container-inner-form .txt-box.delivery .title-row {
    margin-bottom: 1.05vw;
  }
}
.container-inner-form .txt-box.visit .title-row .icon-svg, .container-inner-form .txt-box.delivery .title-row .icon-svg {
  --path1-stroke-color:#4BC8C4;
  --path2-fill-color:#4BC8C4;
  width: 16px;
  height: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .txt-box.visit .title-row .icon-svg, .container-inner-form .txt-box.delivery .title-row .icon-svg {
    width: 1rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .txt-box.visit .title-row .icon-svg, .container-inner-form .txt-box.delivery .title-row .icon-svg {
    width: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .txt-box.visit .title-row .icon-svg, .container-inner-form .txt-box.delivery .title-row .icon-svg {
    height: 1rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .txt-box.visit .title-row .icon-svg, .container-inner-form .txt-box.delivery .title-row .icon-svg {
    height: 4.2vw;
  }
}
.container-inner-form .txt-box.visit .title-row strong, .container-inner-form .txt-box.delivery .title-row strong {
  font-weight: 600;
  color: #4BC8C4;
  margin-left: 4px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .txt-box.visit .title-row strong, .container-inner-form .txt-box.delivery .title-row strong {
    margin-left: 0.25rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .txt-box.visit .title-row strong, .container-inner-form .txt-box.delivery .title-row strong {
    margin-left: 1.05vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .txt-box.visit .title-row strong, .container-inner-form .txt-box.delivery .title-row strong {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .txt-box.visit .title-row strong, .container-inner-form .txt-box.delivery .title-row strong {
    font-size: 3.85vw;
  }
}
.container-inner-form .txt-box.visit p, .container-inner-form .txt-box.delivery p {
  font-weight: 600;
  color: #777777;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .txt-box.visit p, .container-inner-form .txt-box.delivery p {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .txt-box.visit p, .container-inner-form .txt-box.delivery p {
    font-size: 3.5vw;
  }
}
.container-inner-form .caution {
  color: #FE2E36;
  font-weight: 500;
  line-height: 1.3;
  padding: 5px 0px 0px 9px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution {
    padding: 0.3333rem 0rem 0rem 0.5833rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution {
    padding: 1.4vw 0vw 0vw 2.45vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution {
    font-size: 4.025vw;
  }
}
.container-inner-form .caution-row {
  position: relative;
  background: #F9F9F9;
  border-radius: 5px;
  padding: 27px;
  height: 285px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution-row {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution-row {
    border-radius: 1.4vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution-row {
    padding: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution-row {
    padding: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution-row {
    height: 17.7917rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution-row {
    height: 74.725vw;
  }
}
.container-inner-form .caution-row .agree-row {
  margin-bottom: 18px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution-row .agree-row {
    margin-bottom: 1.125rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution-row .agree-row {
    margin-bottom: 4.725vw;
  }
}
.container-inner-form .caution-row .caution-txt-box {
  position: relative;
  overflow: hidden;
  margin-top: 16px;
  height: 160px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution-row .caution-txt-box {
    margin-top: 0.9792rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution-row .caution-txt-box {
    margin-top: 4.1125vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution-row .caution-txt-box {
    height: 10rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution-row .caution-txt-box {
    height: 42vw;
  }
}
.container-inner-form .caution-row .caution-txt-box:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(249, 249, 249, 0) 0%, #F9F9F9 100%);
}
.container-inner-form .caution-row .caution-txt-box + a {
  position: absolute;
  left: 50%;
  bottom: 27px;
  transform: translateX(-50%);
  z-index: 2;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .caution-row .caution-txt-box + a {
    bottom: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .caution-row .caution-txt-box + a {
    bottom: 7vw;
  }
}
.container-inner-form .btn-row {
  width: 100%;
  text-align: center;
  padding-top: 33px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .btn-row {
    padding-top: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .btn-row {
    padding-top: 8.75vw;
  }
}
.container-inner-form .btn-row .btn {
  width: 213px;
  margin: 0px 4px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .btn-row .btn {
    width: 13.3333rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .btn-row .btn {
    width: 56vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .btn-row .btn {
    margin: 0rem 0.25rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .btn-row .btn {
    margin: 0vw 1.05vw;
  }
}
@media screen and (min-width: 1200px) {
  .container-inner-form .btn-row .btn {
    width: 240px;
  }
}
.container-inner-form .btn-row.btn-col2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (min-width: 1200px) {
  .container-inner-form .btn-row.btn-col2 {
    justify-content: center;
  }
}
.container-inner-form .btn-row.btn-col2 .btn {
  width: 49%;
}
@media screen and (min-width: 1200px) {
  .container-inner-form .btn-row.btn-col2 .btn {
    width: 240px;
  }
}
.container-inner-form .select_date .icon-svg {
  position: absolute;
  color: #4BC8C4;
  right: 16px;
  top: 48px;
  width: 27px;
  height: 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .select_date .icon-svg {
    right: 1rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .select_date .icon-svg {
    right: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .select_date .icon-svg {
    top: 3.0208rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .select_date .icon-svg {
    top: 12.6875vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .select_date .icon-svg {
    width: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .select_date .icon-svg {
    width: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .container-inner-form .select_date .icon-svg {
    height: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .container-inner-form .select_date .icon-svg {
    height: 7vw;
  }
}

.caution-txt-box ol {
  list-style: decimal;
  margin-left: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .caution-txt-box ol {
    margin-left: 1rem;
  }
}
@media (max-width: 639px) {
  .caution-txt-box ol {
    margin-left: 4.2vw;
  }
}
.caution-txt-box ol > li {
  font-weight: 400;
  color: #777777;
  margin-bottom: 16px;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .caution-txt-box ol > li {
    margin-bottom: 1rem;
  }
}
@media (max-width: 639px) {
  .caution-txt-box ol > li {
    margin-bottom: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .caution-txt-box ol > li {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .caution-txt-box ol > li {
    font-size: 3.5vw;
  }
}

.total-row {
  background: #F9F9F9;
  padding: 27px 21px;
  margin-bottom: 33px;
  border-radius: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row {
    padding: 1.6667rem 1.3333rem;
  }
}
@media (max-width: 639px) {
  .total-row {
    padding: 7vw 5.6vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row {
    margin-bottom: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .total-row {
    margin-bottom: 8.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .total-row {
    border-radius: 1.4vw;
  }
}
@media screen and (min-width: 640px) {
  .total-row {
    border-radius: 8px;
    margin-bottom: 32px;
    padding: 30px 22px;
  }
}
.total-row ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.total-row ul li:first-child {
  color: #777777;
  font-weight: 400;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row ul li:first-child {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .total-row ul li:first-child {
    font-size: 3.85vw;
  }
}
.total-row ul li:last-child strong {
  color: #222222;
  font-weight: 600;
  font-size: 17px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row ul li:last-child strong {
    font-size: 1.0833rem;
  }
}
@media (max-width: 639px) {
  .total-row ul li:last-child strong {
    font-size: 4.55vw;
  }
}
.total-row ul li:last-child span {
  color: #222222;
  font-weight: 400;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row ul li:last-child span {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .total-row ul li:last-child span {
    font-size: 3.85vw;
  }
}
.total-row ul:last-child li:first-child {
  color: #222222;
  font-weight: 600;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row ul:last-child li:first-child {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .total-row ul:last-child li:first-child {
    font-size: 3.85vw;
  }
}
.total-row ul:last-child li:last-child strong {
  color: #4BC8C4;
  font-weight: 700;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row ul:last-child li:last-child strong {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .total-row ul:last-child li:last-child strong {
    font-size: 5.6vw;
  }
}
.total-row ul:last-child li:last-child span {
  color: #4BC8C4;
  font-weight: 400;
  font-size: 19px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .total-row ul:last-child li:last-child span {
    font-size: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .total-row ul:last-child li:last-child span {
    font-size: 4.9vw;
  }
}
@media screen and (min-width: 640px) {
  .total-row ul li:first-child {
    font-size: 14px;
    padding-left: 16px;
  }
  .total-row ul li:last-child {
    padding-right: 16px;
  }
  .total-row ul li:last-child strong {
    font-size: 18px;
  }
  .total-row ul li:last-child span {
    font-size: 14px;
  }
  .total-row ul:last-child li:first-child {
    font-size: 14px;
  }
  .total-row ul:last-child li:last-child strong {
    font-size: 24px;
  }
  .total-row ul:last-child li:last-child span {
    font-size: 20px;
  }
}

.address-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-flow: wrap;
}
.address-row > label {
  width: 100%;
}
.address-row #postcode, .address-row #diff_postcode {
  width: calc(100% - 31.5vw);
}
.address-row .btn-search {
  width: 93px;
  height: 56px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .address-row .btn-search {
    width: 5.8333rem;
  }
}
@media (max-width: 639px) {
  .address-row .btn-search {
    width: 24.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .address-row .btn-search {
    height: 3.5rem;
  }
}
@media (max-width: 639px) {
  .address-row .btn-search {
    height: 14.7vw;
  }
}
.address-row #address, .address-row #diff_address {
  margin: 8px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .address-row #address, .address-row #diff_address {
    margin: 0.5rem 0rem;
  }
}
@media (max-width: 639px) {
  .address-row #address, .address-row #diff_address {
    margin: 2.1vw 0vw;
  }
}
@media screen and (min-width: 640px) {
  .address-row #postcode, .address-row #diff_postcode {
    width: calc(100% - 120px);
  }
}

/*모션*/
.motion-fade {
  opacity: 0;
  transition: opacity 1s;
}
.motion-fade.active {
  opacity: 1;
}

.motion-up {
  opacity: 0;
  left: 50%;
  transform: translate(-50%, 40px);
  transition: opacity 0.7s, transform 0.7s;
}
.motion-up.active {
  opacity: 1;
  transform: translate(-50%, 0);
}

.motion-left {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity 0.7s, transform 0.7s;
}
.motion-left.active {
  opacity: 1;
  transform: none;
}

@keyframes floatAnimation {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes floatCenterAnimation {
  0% {
    transform: translateX(-50%) translateY(0);
  }
  50% {
    transform: translateX(-50%) translateY(-15px);
  }
  100% {
    transform: translateX(-50%) translateY(0);
  }
}
@keyframes floatY2 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-18px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes floatY {
  0% {
    transform: translate(-50%, 0);
  }
  50% {
    transform: translate(-50%, -18px);
  }
  100% {
    transform: translate(-50%, 0);
  }
}
@keyframes scaleX {
  0% {
    transform: translateX(-50%) scale(0.9);
  }
  50% {
    transform: translateX(-50%) scale(1);
  }
  100% {
    transform: translateX(-50%) scale(0.9);
  }
}
@keyframes scaleX2 {
  0% {
    transform: translateX(-50%) scale(1);
  }
  50% {
    transform: translateX(-50%) scale(0.9);
  }
  100% {
    transform: translateX(-50%) scale(1);
  }
}
.float-animate2 {
  animation: scaleX 2.2s ease-in-out infinite;
}

.float-animate {
  animation: floatY 2.2s ease-in-out infinite;
}

.float-animate3 {
  animation: floatY2 2.2s ease-in-out infinite;
}

.float-animate.delay1 {
  animation-delay: 0s;
}

.float-animate.delay2 {
  animation-delay: 0.7s;
}

.float-animate.delay3 {
  animation-delay: 1.1s;
}

.float-animate2.delay3 {
  animation-delay: 1.1s;
}

.float-animate3.delay1 {
  animation-delay: 0s;
}

.float-animate3.delay2 {
  animation-delay: 0.7s;
}

.float-animate3.delay3 {
  animation-delay: 1.1s;
}

.float-animate3.delay4 {
  animation-delay: 0.9s;
}

.footer {
  position: relative;
  width: 100%;
  background: #141414;
}
.footer .footer-top {
  padding: 40px 27px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top {
    padding: 2.5rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top {
    padding: 10.5vw 7vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top {
    width: 100%;
    max-width: 1440px;
    margin: auto;
    padding: 144px 0 64px 0;
  }
}
.footer .footer-top .left {
  color: #fff;
  font-weight: 700;
  font-family: "Gowun Batang";
  letter-spacing: -1.28px;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .left {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .left {
    font-size: 5.6vw;
  }
}
.footer .footer-top .left strong {
  color: #4BC8C4;
  font-weight: 700;
  font-family: "Gowun Batang";
  letter-spacing: -1.28px;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .left strong {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .left strong {
    font-size: 5.6vw;
  }
}
.footer .footer-top .left .hours-row {
  display: none;
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .left .hours-row {
    margin-top: 20px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  .footer .footer-top .left .hours-row .icon-svg {
    color: #888888;
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }
  .footer .footer-top .left .hours-row span {
    color: #888888;
    font-size: 16px;
    font-weight: 500;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .left {
    font-size: 32px;
    width: 34.9305555556%;
    max-width: 503px;
  }
  .footer .footer-top .left strong {
    font-size: 32px;
  }
}
.footer .footer-top .right .cs {
  border: 2px solid #4BC8C4;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 27px;
  height: 53px;
  border-radius: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right .cs {
    padding: 0rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right .cs {
    padding: 0vw 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right .cs {
    height: 3.3333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right .cs {
    height: 14vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right .cs {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right .cs {
    border-radius: 1.4vw;
  }
}
.footer .footer-top .right .cs .icon-svg {
  color: #4BC8C4;
  margin-right: 7px;
  width: 19px;
  height: 19px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right .cs .icon-svg {
    margin-right: 0.4167rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right .cs .icon-svg {
    margin-right: 1.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right .cs .icon-svg {
    width: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right .cs .icon-svg {
    width: 4.9vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right .cs .icon-svg {
    height: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right .cs .icon-svg {
    height: 4.9vw;
  }
}
.footer .footer-top .right .cs strong {
  color: #4BC8C4;
  font-weight: 600;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right .cs strong {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right .cs strong {
    font-size: 4.2vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right .cs {
    display: none;
  }
}
.footer .footer-top .right ol {
  position: absolute;
  right: 0;
  z-index: 2;
  background: #fff;
  overflow: hidden;
  height: 0px;
  transition: height 0.15s ease-in;
  border-radius: 11px;
  width: 320px;
  top: 47px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol {
    border-radius: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol {
    border-radius: 2.8vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol {
    width: 20rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol {
    width: 84vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol {
    top: 2.9167rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol {
    top: 12.25vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol {
    position: relative;
    right: unset;
    top: unset;
    height: unset;
    display: block;
    background: none;
    width: 100%;
    border-radius: 0;
  }
}
.footer .footer-top .right ol > li.head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 20px 27px;
  border-bottom: 1px solid #BBBBBB;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.head {
    padding: 1.25rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.head {
    padding: 5.25vw 7vw;
  }
}
.footer .footer-top .right ol > li.head p {
  color: #777777;
  font-weight: 500;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.head p {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.head p {
    font-size: 3.5vw;
  }
}
.footer .footer-top .right ol > li.head p strong {
  display: block;
  color: #222222;
  font-weight: 700;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.head p strong {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.head p strong {
    font-size: 5.6vw;
  }
}
.footer .footer-top .right ol > li.head .icon-svg {
  color: #222222;
  width: 15px;
  height: 15px;
  margin-top: 7px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.head .icon-svg {
    width: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.head .icon-svg {
    width: 4.025vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.head .icon-svg {
    height: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.head .icon-svg {
    height: 4.025vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.head .icon-svg {
    margin-top: 0.4167rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.head .icon-svg {
    margin-top: 1.75vw;
  }
}
.footer .footer-top .right ol > li.head .icon-svg svg {
  --icon-stroke-width:8px;
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.head {
    display: none;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.cs-list {
    width: 100%;
  }
}
.footer .footer-top .right ol > li.cs-list ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px 0px;
  padding: 27px 0px 13px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul {
    gap: 1.25rem 0rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul {
    gap: 5.25vw 0vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul {
    padding: 1.6667rem 0rem 0.8333rem 0rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul {
    padding: 7vw 0vw 3.5vw 0vw;
  }
}
.footer .footer-top .right ol > li.cs-list ul li {
  width: 100%;
  text-align: center;
}
.footer .footer-top .right ol > li.cs-list ul li strong {
  background: #EEEEEE;
  font-weight: 600;
  color: #222222;
  border-radius: 5px;
  padding: 7px 16px;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li strong {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li strong {
    border-radius: 1.4vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li strong {
    padding: 0.4583rem 1rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li strong {
    padding: 1.925vw 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li strong {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li strong {
    font-size: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.cs-list ul li strong {
    font-size: 14px;
    background: none;
    border: 1px solid #4BC8C4;
    color: #4BC8C4;
  }
}
.footer .footer-top .right ol > li.cs-list ul li p {
  margin: 7px auto 10px auto;
  color: #4BC8C4;
  font-weight: 700;
  font-size: 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li p {
    margin: 0.4167rem auto 0.625rem auto;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li p {
    margin: 1.75vw auto 2.625vw auto;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li p {
    font-size: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li p {
    font-size: 7vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.cs-list ul li p {
    margin: 10px auto 16px auto;
    color: #fff;
    font-size: 28px;
  }
}
.footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) {
  display: flex;
  justify-content: center;
  align-items: center;
}
.footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg {
  width: 16px;
  height: 16px;
  margin-right: 6px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg {
    width: 1rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg {
    width: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg {
    height: 1rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg {
    height: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg {
    margin-right: 0.375rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg {
    margin-right: 1.575vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg {
    width: 16px;
    height: 16px;
  }
}
.footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg svg {
  --path1-stroke-color:#BBBBBB;
  --path2-fill-color:#BBBBBB;
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) .icon-svg svg {
    --path1-stroke-color:#4BC8C4;
    --path2-fill-color:#4BC8C4;
  }
}
.footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) span {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  color: #777777;
  font-weight: 500;
  font-size: 13px;
}
.footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) span b {
  display: none;
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) span b {
    display: block;
    color: #4BC8C4;
    font-size: 16px;
    padding-right: 8px;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) span {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) span {
    font-size: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.cs-list ul li p:nth-child(3) span {
    color: #fff;
    font-size: 16px;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.cs-list ul {
    /*20260127 모준호 수정*/
    /*grid-template-columns: repeat(4, 1fr);*/
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    padding: 0;
  }
  .footer .footer-top .right ol > li.cs-list ul li {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: wrap;
  }
}
.footer .footer-top .right ol > li.foot {
  background: #F5F5F5;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 17px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.foot {
    padding: 1.0417rem 0rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.foot {
    padding: 4.375vw 0vw;
  }
}
.footer .footer-top .right ol > li.foot .icon-svg {
  color: #BBBBBB;
  width: 16px;
  height: 16px;
  margin-right: 6px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.foot .icon-svg {
    width: 1rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.foot .icon-svg {
    width: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.foot .icon-svg {
    height: 1rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.foot .icon-svg {
    height: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.foot .icon-svg {
    margin-right: 0.375rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.foot .icon-svg {
    margin-right: 1.575vw;
  }
}
.footer .footer-top .right ol > li.foot p {
  color: #777777;
  font-weight: 500;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol > li.foot p {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol > li.foot p {
    font-size: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right ol > li.foot {
    display: none;
  }
}
.footer .footer-top .right ol.is-open {
  height: 413px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-top .right ol.is-open {
    height: 25.8333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-top .right ol.is-open {
    height: 108.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-top .right {
    /*20260127 모준호 수정*/
    /*width: 65.0694444444%;*/
    width: 52%;
    max-width: 937px;
  }
}
.footer hr {
  height: 1px;
  background-color: #555;
  border: none;
}
.footer .footer-bottom {
  flex-flow: wrap;
  padding: 40px 27px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom {
    padding: 2.5rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom {
    padding: 10.5vw 7vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-bottom {
    width: 100%;
    max-width: 1440px;
    margin: auto;
    padding: 40px 0;
  }
}
.footer .footer-bottom .foot-logo {
  width: 100%;
  margin-bottom: 26px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .foot-logo {
    margin-bottom: 1.625rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .foot-logo {
    margin-bottom: 6.825vw;
  }
}
.footer .footer-bottom .foot-logo img {
  width: 136px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .foot-logo img {
    width: 8.5208rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .foot-logo img {
    width: 35.7875vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-bottom .foot-logo {
    position: absolute;
    top: -310px;
    left: 0;
  }
}
.footer .footer-bottom .company-info {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-flow: wrap;
}
@media screen and (min-width: 1200px) {
  .footer .footer-bottom .company-info {
    align-items: flex-start;
  }
}
.footer .footer-bottom .company-info .left {
  width: 100%;
}
.footer .footer-bottom .company-info .left ul {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-flow: wrap;
}
.footer .footer-bottom .company-info .left ul li {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 7px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .left ul li {
    margin-bottom: 0.4167rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .left ul li {
    margin-bottom: 1.75vw;
  }
}
.footer .footer-bottom .company-info .left ul li.name {
  color: #CCCCCC;
  font-weight: 700;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .left ul li.name {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .left ul li.name {
    font-size: 4.2vw;
  }
}
.footer .footer-bottom .company-info .left ul li span {
  color: #CCCCCC;
  font-weight: 500;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .left ul li span {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .left ul li span {
    font-size: 4.025vw;
  }
}
.footer .footer-bottom .company-info .left ul li strong {
  display: block;
  color: #AAAAAA;
  font-weight: 600;
  margin-left: 3px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .left ul li strong {
    margin-left: 0.2083rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .left ul li strong {
    margin-left: 0.875vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .left ul li strong {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .left ul li strong {
    font-size: 4.025vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-bottom .company-info .left {
    width: 570px;
  }
  .footer .footer-bottom .company-info .left ul li {
    width: auto;
    margin-right: 5px;
  }
  .footer .footer-bottom .company-info .left ul li.name {
    width: 100%;
    margin-right: 0;
    margin-bottom: 16px;
    font-size: 18px;
  }
  .footer .footer-bottom .company-info .left ul li span, .footer .footer-bottom .company-info .left ul li strong {
    font-size: 16px;
    letter-spacing: -0.16px;
  }
}
.footer .footer-bottom .company-info .right {
  width: 100%;
  margin-top: 40px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .right {
    margin-top: 2.5rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .right {
    margin-top: 10.5vw;
  }
}
.footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
  display: inline-block;
  background: rgba(136, 136, 136, 0.2);
  font-weight: 600;
  color: #AAAAAA;
  border-radius: 5px;
  font-size: 15px;
  padding: 8px 16px;
  margin-bottom: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    border-radius: 1.4vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    font-size: 3.85vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    padding: 0.5rem 1rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    padding: 2.1vw 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    margin-bottom: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    margin-bottom: 3.5vw;
  }
}
.footer .footer-bottom .company-info .right button:first-child, .footer .footer-bottom .company-info .right a:first-child {
  color: #fff;
  background: rgba(255, 255, 255, 0.3);
}
.footer .footer-bottom .company-info .right p {
  color: #AAAAAA;
  font-weight: 500;
  margin-top: 27px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .right p {
    margin-top: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .right p {
    margin-top: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .footer .footer-bottom .company-info .right p {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .footer .footer-bottom .company-info .right p {
    font-size: 3.85vw;
  }
}
@media screen and (min-width: 1200px) {
  .footer .footer-bottom .company-info .right {
    width: calc(100% - 570px);
    margin-top: 0;
    text-align: right;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-flow: wrap;
  }
  .footer .footer-bottom .company-info .right button, .footer .footer-bottom .company-info .right a {
    padding: 8px 16px;
    font-size: 14px;
    margin-left: 10px;
  }
  .footer .footer-bottom .company-info .right p {
    width: 100%;
    margin-top: 0;
  }
}

#quick-menu {
  position: fixed;
  z-index: 98;
  width: 73px;
  bottom: 43px;
  right: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu {
    width: 4.5833rem;
  }
}
@media (max-width: 639px) {
  #quick-menu {
    width: 19.25vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu {
    bottom: 2.6667rem;
  }
}
@media (max-width: 639px) {
  #quick-menu {
    bottom: 11.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu {
    right: 0.8333rem;
  }
}
@media (max-width: 639px) {
  #quick-menu {
    right: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  #quick-menu {
    width: 116px;
    right: 40px;
  }
}
#quick-menu ul {
  width: 100%;
}
#quick-menu ul li a {
  position: relative;
  width: 100%;
  overflow: hidden;
  flex-flow: wrap;
  align-content: center;
  transition: all 0.3s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 73px;
  border-radius: 73px;
  box-shadow: 0px 24px 108px 0px rgba(0, 0, 0, 0.12);
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li a {
    height: 4.5833rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li a {
    height: 19.25vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li a {
    border-radius: 4.5833rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li a {
    border-radius: 19.25vw;
  }
}
@media screen and (min-width: 1200px) {
  #quick-menu ul li a {
    height: 116px;
    border-radius: 116px;
  }
}
#quick-menu ul li:nth-child(1) {
  margin-bottom: 11px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(1) {
    margin-bottom: 0.6667rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(1) {
    margin-bottom: 2.8vw;
  }
}
#quick-menu ul li:nth-child(1) a {
  border: 2px solid #4BC8C4;
  background: #4BC8C4;
  color: #fff;
}
#quick-menu ul li:nth-child(1) a strong {
  display: block;
  width: 100%;
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  font-size: 13px;
  margin: 1px auto;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(1) a strong {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(1) a strong {
    font-size: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(1) a strong {
    margin: 0.0625rem auto;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(1) a strong {
    margin: 0.2625vw auto;
  }
}
@media screen and (min-width: 1200px) {
  #quick-menu ul li:nth-child(1) a strong {
    font-size: 16px;
  }
}
#quick-menu ul li:nth-child(1) a .icon-svg {
  color: #fff;
  display: none;
}
@media screen and (min-width: 1200px) {
  #quick-menu ul li:nth-child(1) a .icon-svg {
    display: flex;
    width: 24px;
    height: 24px;
  }
}
#quick-menu ul li:nth-child(1) a:hover {
  border: 2px solid #0AA49F;
  background: #0AA49F;
  box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0);
}
#quick-menu ul li:nth-child(2) a {
  border: 2px solid #E6E6E6;
  background: #fff;
}
#quick-menu ul li:nth-child(2) a strong {
  display: block;
  width: 100%;
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  font-size: 13px;
  margin: 1px auto;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(2) a strong {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(2) a strong {
    font-size: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(2) a strong {
    margin: 0.0625rem auto;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(2) a strong {
    margin: 0.2625vw auto;
  }
}
#quick-menu ul li:nth-child(2) a strong:nth-child(2) {
  padding-left: 17px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(2) a strong:nth-child(2) {
    padding-left: 1.0417rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(2) a strong:nth-child(2) {
    padding-left: 4.375vw;
  }
}
@media screen and (min-width: 1200px) {
  #quick-menu ul li:nth-child(2) a strong {
    font-size: 16px;
  }
  #quick-menu ul li:nth-child(2) a strong:nth-child(2) {
    padding-left: 0;
  }
}
#quick-menu ul li:nth-child(2) a .icon-svg {
  position: absolute;
  left: 10px;
  top: 21px;
  width: 13px;
  height: 11px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    left: 0.625rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    left: 2.625vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    top: 1.3333rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    top: 5.6vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    width: 0.8333rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    width: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    height: 0.6875rem;
  }
}
@media (max-width: 639px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    height: 2.8875vw;
  }
}
@media screen and (min-width: 1200px) {
  #quick-menu ul li:nth-child(2) a .icon-svg {
    position: relative;
    left: unset;
    top: unset;
    width: 18px;
    height: 15px;
    margin-bottom: 6px;
  }
}
#quick-menu ul li:nth-child(2) a .icon-svg svg {
  --path1-color: #ED1C24;
  --path2-color: #222222;
}
#quick-menu ul li:nth-child(2) a:hover {
  border: 2px solid #EEEEEE;
  background: #EEEEEE;
  box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0);
}

.modal {
  /*IMEI*/
}
.modal.open {
  background: rgba(0, 0, 0, 0.5);
}
.modal#ProductViewModal .modal-container, .modal#RepairPaymentModal .modal-container, .modal#PolicyModal1 .modal-container, .modal#PolicyModal2 .modal-container, .modal#PolicyModal .modal-container {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#ProductViewModal .modal-container, .modal#RepairPaymentModal .modal-container, .modal#PolicyModal1 .modal-container, .modal#PolicyModal2 .modal-container, .modal#PolicyModal .modal-container {
    max-width: 500px;
  }
}
.modal#ProductViewModal .modal-container .modal-footer, .modal#RepairPaymentModal .modal-container .modal-footer, .modal#PolicyModal1 .modal-container .modal-footer, .modal#PolicyModal2 .modal-container .modal-footer, .modal#PolicyModal .modal-container .modal-footer {
  width: 100%;
}
.modal#ProductViewModal .modal-container .modal-footer .btn, .modal#RepairPaymentModal .modal-container .modal-footer .btn, .modal#PolicyModal1 .modal-container .modal-footer .btn, .modal#PolicyModal2 .modal-container .modal-footer .btn, .modal#PolicyModal .modal-container .modal-footer .btn {
  width: 100%;
}
.modal#PolicyModal1 .modal-title-box h3, .modal#PolicyModal2 .modal-title-box h3, .modal#PolicyModal .modal-title-box h3 {
  font-size: 20px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .modal-title-box h3, .modal#PolicyModal2 .modal-title-box h3, .modal#PolicyModal .modal-title-box h3 {
    font-size: 1.25rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .modal-title-box h3, .modal#PolicyModal2 .modal-title-box h3, .modal#PolicyModal .modal-title-box h3 {
    font-size: 5.25vw;
  }
}
.modal#PolicyModal1 .content-area, .modal#PolicyModal2 .content-area, .modal#PolicyModal .content-area {
  text-align: left;
  padding: 53px 27px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area, .modal#PolicyModal2 .content-area, .modal#PolicyModal .content-area {
    padding: 3.3333rem 1.6667rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area, .modal#PolicyModal2 .content-area, .modal#PolicyModal .content-area {
    padding: 14vw 7vw;
  }
}
.modal#PolicyModal1 .content-area p, .modal#PolicyModal2 .content-area p, .modal#PolicyModal .content-area p {
  margin-bottom: 16px;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area p, .modal#PolicyModal2 .content-area p, .modal#PolicyModal .content-area p {
    margin-bottom: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area p, .modal#PolicyModal2 .content-area p, .modal#PolicyModal .content-area p {
    margin-bottom: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area p, .modal#PolicyModal2 .content-area p, .modal#PolicyModal .content-area p {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area p, .modal#PolicyModal2 .content-area p, .modal#PolicyModal .content-area p {
    font-size: 4.2vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal1 .content-area p, .modal#PolicyModal2 .content-area p, .modal#PolicyModal .content-area p {
    font-size: 16px;
  }
}
.modal#PolicyModal1 .content-area ol, .modal#PolicyModal2 .content-area ol, .modal#PolicyModal .content-area ol {
  list-style: decimal;
}
.modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
  font-size: 16px;
  margin-left: 27px;
  margin-bottom: 8px;
  padding-bottom: 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    margin-left: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    margin-left: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    margin-bottom: 0.5rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    margin-bottom: 2.1vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    padding-bottom: 0.5rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    padding-bottom: 2.1vw;
  }
}
.modal#PolicyModal1 .content-area ol > li p, .modal#PolicyModal2 .content-area ol > li p, .modal#PolicyModal .content-area ol > li p {
  margin-bottom: 16px;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li p, .modal#PolicyModal2 .content-area ol > li p, .modal#PolicyModal .content-area ol > li p {
    margin-bottom: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li p, .modal#PolicyModal2 .content-area ol > li p, .modal#PolicyModal .content-area ol > li p {
    margin-bottom: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li p, .modal#PolicyModal2 .content-area ol > li p, .modal#PolicyModal .content-area ol > li p {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li p, .modal#PolicyModal2 .content-area ol > li p, .modal#PolicyModal .content-area ol > li p {
    font-size: 4.2vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal1 .content-area ol > li p, .modal#PolicyModal2 .content-area ol > li p, .modal#PolicyModal .content-area ol > li p {
    font-size: 16px;
  }
}
.modal#PolicyModal1 .content-area ol > li > ul > li, .modal#PolicyModal2 .content-area ol > li > ul > li, .modal#PolicyModal .content-area ol > li > ul > li {
  position: relative;
  padding-left: 16px;
  margin-bottom: 8px;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li, .modal#PolicyModal2 .content-area ol > li > ul > li, .modal#PolicyModal .content-area ol > li > ul > li {
    padding-left: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li, .modal#PolicyModal2 .content-area ol > li > ul > li, .modal#PolicyModal .content-area ol > li > ul > li {
    padding-left: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li, .modal#PolicyModal2 .content-area ol > li > ul > li, .modal#PolicyModal .content-area ol > li > ul > li {
    margin-bottom: 0.5rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li, .modal#PolicyModal2 .content-area ol > li > ul > li, .modal#PolicyModal .content-area ol > li > ul > li {
    margin-bottom: 2.1vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li, .modal#PolicyModal2 .content-area ol > li > ul > li, .modal#PolicyModal .content-area ol > li > ul > li {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li, .modal#PolicyModal2 .content-area ol > li > ul > li, .modal#PolicyModal .content-area ol > li > ul > li {
    font-size: 4.2vw;
  }
}
.modal#PolicyModal1 .content-area ol > li > ul > li:before, .modal#PolicyModal2 .content-area ol > li > ul > li:before, .modal#PolicyModal .content-area ol > li > ul > li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li:before, .modal#PolicyModal2 .content-area ol > li > ul > li:before, .modal#PolicyModal .content-area ol > li > ul > li:before {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li:before, .modal#PolicyModal2 .content-area ol > li > ul > li:before, .modal#PolicyModal .content-area ol > li > ul > li:before {
    font-size: 4.2vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li:before, .modal#PolicyModal2 .content-area ol > li > ul > li:before, .modal#PolicyModal .content-area ol > li > ul > li:before {
    font-size: 16px;
  }
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(1):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(1):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(1):before {
  content: "1)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(2):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(2):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(2):before {
  content: "2)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(3):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(3):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(3):before {
  content: "3)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(4):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(4):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(4):before {
  content: "4)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(5):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(5):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(5):before {
  content: "5)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(6):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(6):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(6):before {
  content: "6)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(7):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(7):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(7):before {
  content: "7)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(8):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(8):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(8):before {
  content: "8)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(9):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(9):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(9):before {
  content: "9)";
}
.modal#PolicyModal1 .content-area ol > li > ul > li:nth-child(10):before, .modal#PolicyModal2 .content-area ol > li > ul > li:nth-child(10):before, .modal#PolicyModal .content-area ol > li > ul > li:nth-child(10):before {
  content: "10)";
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li, .modal#PolicyModal2 .content-area ol > li > ul > li, .modal#PolicyModal .content-area ol > li > ul > li {
    font-size: 16px;
  }
}
.modal#PolicyModal1 .content-area ol > li > ul > li ul li, .modal#PolicyModal2 .content-area ol > li > ul > li ul li, .modal#PolicyModal .content-area ol > li > ul > li ul li {
  position: relative;
  font-size: 16px;
  padding-left: 16px;
  margin-bottom: 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li, .modal#PolicyModal2 .content-area ol > li > ul > li ul li, .modal#PolicyModal .content-area ol > li > ul > li ul li {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li, .modal#PolicyModal2 .content-area ol > li > ul > li ul li, .modal#PolicyModal .content-area ol > li > ul > li ul li {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li, .modal#PolicyModal2 .content-area ol > li > ul > li ul li, .modal#PolicyModal .content-area ol > li > ul > li ul li {
    padding-left: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li, .modal#PolicyModal2 .content-area ol > li > ul > li ul li, .modal#PolicyModal .content-area ol > li > ul > li ul li {
    padding-left: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li, .modal#PolicyModal2 .content-area ol > li > ul > li ul li, .modal#PolicyModal .content-area ol > li > ul > li ul li {
    margin-bottom: 0.5rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li, .modal#PolicyModal2 .content-area ol > li > ul > li ul li, .modal#PolicyModal .content-area ol > li > ul > li ul li {
    margin-bottom: 2.1vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li, .modal#PolicyModal2 .content-area ol > li > ul > li ul li, .modal#PolicyModal .content-area ol > li > ul > li ul li {
    font-size: 16px;
  }
}
.modal#PolicyModal1 .content-area ol > li > ul > li ul li:before, .modal#PolicyModal2 .content-area ol > li > ul > li ul li:before, .modal#PolicyModal .content-area ol > li > ul > li ul li:before {
  content: "-";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 16px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li:before, .modal#PolicyModal2 .content-area ol > li > ul > li ul li:before, .modal#PolicyModal .content-area ol > li > ul > li ul li:before {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li:before, .modal#PolicyModal2 .content-area ol > li > ul > li ul li:before, .modal#PolicyModal .content-area ol > li > ul > li ul li:before {
    font-size: 4.2vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal1 .content-area ol > li > ul > li ul li:before, .modal#PolicyModal2 .content-area ol > li > ul > li ul li:before, .modal#PolicyModal .content-area ol > li > ul > li ul li:before {
    font-size: 16px;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal1 .content-area ol > li, .modal#PolicyModal2 .content-area ol > li, .modal#PolicyModal .content-area ol > li {
    font-size: 16px;
  }
}
.modal#PolicyModal .modal-container {
  max-height: 500px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal .modal-container {
    max-height: 31.25rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal .modal-container {
    max-height: 131.25vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal .modal-container {
    max-height: 680px !important;
  }
}
.modal#PolicyModal .modal-scroll {
  max-height: 333px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PolicyModal .modal-scroll {
    max-height: 20.8333rem;
  }
}
@media (max-width: 639px) {
  .modal#PolicyModal .modal-scroll {
    max-height: 87.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PolicyModal .modal-scroll {
    max-height: 550px !important;
  }
}
.modal#RepairPaymentModal caption {
  padding: 32px 0px 12px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal caption {
    padding: 2rem 0rem 0.75rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal caption {
    padding: 8.4vw 0vw 3.15vw 0vw;
  }
}
.modal#RepairPaymentModal .form-row > label {
  color: #222222;
  text-align: left;
  font-weight: 600;
  font-size: 16px;
  padding: 21px 0px 13px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal .form-row > label {
    font-size: 1rem;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal .form-row > label {
    font-size: 4.2vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal .form-row > label {
    padding: 1.3333rem 0rem 0.8333rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal .form-row > label {
    padding: 5.6vw 0vw 3.5vw 0vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#RepairPaymentModal .form-row > label {
    font-size: 18px;
  }
}
.modal#RepairPaymentModal .total-row {
  background: #F9F9F9;
  border-radius: 5px;
  margin: 21px auto 33px auto;
  padding: 27px 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal .total-row {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal .total-row {
    border-radius: 1.4vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal .total-row {
    margin: 1.3333rem auto 2.0833rem auto;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal .total-row {
    margin: 5.6vw auto 8.75vw auto;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal .total-row {
    padding: 1.6667rem 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal .total-row {
    padding: 7vw 5.6vw;
  }
}
.modal#RepairPaymentModal .total-row ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal#RepairPaymentModal .total-row ul li {
  color: #222222;
  font-weight: 600;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal .total-row ul li {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal .total-row ul li {
    font-size: 3.85vw;
  }
}
.modal#RepairPaymentModal .total-row ul li:last-child {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.modal#RepairPaymentModal .total-row ul li:last-child strong {
  display: block;
  color: #4BC8C4;
  font-weight: 700;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal .total-row ul li:last-child strong {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal .total-row ul li:last-child strong {
    font-size: 5.6vw;
  }
}
.modal#RepairPaymentModal .total-row ul li:last-child span {
  color: #4BC8C4;
  font-weight: 500;
  font-size: 19px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#RepairPaymentModal .total-row ul li:last-child span {
    font-size: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .modal#RepairPaymentModal .total-row ul li:last-child span {
    font-size: 4.9vw;
  }
}
.modal#InspectionResultModal .modal-container {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#InspectionResultModal .modal-container {
    max-width: 500px;
  }
}
.modal#InspectionResultModal .resualt {
  font-weight: 400;
  color: #777777;
  font-size: 15px;
  margin: 33px auto 13px auto;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#InspectionResultModal .resualt {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .modal#InspectionResultModal .resualt {
    font-size: 3.85vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#InspectionResultModal .resualt {
    margin: 2.0833rem auto 0.8333rem auto;
  }
}
@media (max-width: 639px) {
  .modal#InspectionResultModal .resualt {
    margin: 8.75vw auto 3.5vw auto;
  }
}
.modal#InspectionResultModal .resualt strong {
  font-weight: 500;
  color: #4BC8C4;
}
.modal#InspectionResultModal .resualt strong span {
  font-weight: 500;
  color: #4BC8C4;
}
.modal#InspectionResultModal .box-row {
  background: #F9F9F9;
  border: none;
  margin-bottom: 33px;
  padding: 19px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#InspectionResultModal .box-row {
    margin-bottom: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .modal#InspectionResultModal .box-row {
    margin-bottom: 8.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#InspectionResultModal .box-row {
    padding: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .modal#InspectionResultModal .box-row {
    padding: 4.9vw;
  }
}
.modal#InspectionResultModal .box-row p {
  text-align: left;
  font-weight: 400;
  color: #777777;
  margin-bottom: 4px;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#InspectionResultModal .box-row p {
    margin-bottom: 0.25rem;
  }
}
@media (max-width: 639px) {
  .modal#InspectionResultModal .box-row p {
    margin-bottom: 1.05vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#InspectionResultModal .box-row p {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .modal#InspectionResultModal .box-row p {
    font-size: 3.85vw;
  }
}
.modal#InspectionResultModal .box-row strong {
  display: block;
  text-align: left;
  font-weight: 600;
  color: #222222;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#InspectionResultModal .box-row strong {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .modal#InspectionResultModal .box-row strong {
    font-size: 3.85vw;
  }
}
.modal#InspectionResultModal .modal-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal#InspectionResultModal .modal-footer button {
  width: 50%;
  border-radius: 0;
}
@media screen and (min-width: 1200px) {
  .modal#ImeiViewModal .modal-container {
    max-width: 984px;
    max-height: 520px !important;
  }
}
.modal#ImeiViewModal .modal-scroll {
  padding: 0;
}
.modal#ImeiViewModal .content-area {
  padding: 0;
}
@media screen and (min-width: 640px) {
  .modal#ImeiViewModal .content-area .tab-row .tab {
    margin-top: 40px;
  }
}
.modal#ImeiViewModal .modal-scroll {
  height: 333px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .modal-scroll {
    height: 20.8333rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .modal-scroll {
    height: 87.5vw;
  }
}
.modal#ImeiViewModal .tab-row {
  margin-top: 33px;
  margin-bottom: 27px;
  padding: 0px 33px 0px 33px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .tab-row {
    margin-top: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .tab-row {
    margin-top: 8.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .tab-row {
    margin-bottom: 1.6667rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .tab-row {
    margin-bottom: 7vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .tab-row {
    padding: 0rem 2.0833rem 0rem 2.0833rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .tab-row {
    padding: 0vw 8.75vw 0vw 8.75vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#ImeiViewModal .tab-row {
    margin-bottom: 32px;
  }
}
.modal#ImeiViewModal .tab-panel {
  display: none;
}
@media screen and (min-width: 1200px) {
  .modal#ImeiViewModal .tab-panel {
    width: 888px;
    margin: auto;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
  }
}
.modal#ImeiViewModal .tab-panel.active {
  display: grid;
}
@media screen and (min-width: 640px) {
  .modal#ImeiViewModal .guide {
    width: 640px;
    margin: auto;
  }
}
@media screen and (min-width: 1200px) {
  .modal#ImeiViewModal .guide {
    width: 100%;
    display: flex;
    flex-direction: column-reverse;
  }
}
.modal#ImeiViewModal .guide-header {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 33px;
  margin-bottom: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-header {
    padding-left: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-header {
    padding-left: 8.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-header {
    margin-bottom: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-header {
    margin-bottom: 5.6vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#ImeiViewModal .guide-header {
    margin-bottom: 60px;
    justify-content: center;
    padding-left: 0;
  }
}
.modal#ImeiViewModal .guide-header .icon-svg {
  margin-right: 8px;
  width: 19px;
  height: 19px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-header .icon-svg {
    margin-right: 0.5rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-header .icon-svg {
    margin-right: 2.1vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-header .icon-svg {
    width: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-header .icon-svg {
    width: 4.9vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-header .icon-svg {
    height: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-header .icon-svg {
    height: 4.9vw;
  }
}
.modal#ImeiViewModal .guide-header strong {
  font-weight: 600;
  color: #4BC8C4;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-header strong {
    font-size: 0.9583rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-header strong {
    font-size: 4.025vw;
  }
}
.modal#ImeiViewModal .guide-header span {
  font-weight: 600;
  color: #222222;
  font-size: 19px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-header span {
    font-size: 1.1667rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-header span {
    font-size: 4.9vw;
  }
}
.modal#ImeiViewModal .guide-content {
  padding: 0px 27px 0px 33px;
  margin-bottom: 53px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-content {
    padding: 0rem 1.6667rem 0rem 2.0833rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-content {
    padding: 0vw 7vw 0vw 8.75vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .guide-content {
    margin-bottom: 3.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .guide-content {
    margin-bottom: 14vw;
  }
}
.modal#ImeiViewModal .guide-content img {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#ImeiViewModal .guide-content {
    margin-bottom: 24px;
    padding: 0;
  }
}
.modal#ImeiViewModal .note {
  width: 100%;
  margin: auto;
  background: #F9F9F9;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 21px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .note {
    padding: 1.3333rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .note {
    padding: 5.6vw 0vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#ImeiViewModal .note {
    align-items: center;
  }
}
.modal#ImeiViewModal .note .icon-svg {
  overflow: hidden;
  --path2-fill-color:#4BC8C4;
  --path1-stroke-color:#4BC8C4;
  width: 21px;
  height: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .note .icon-svg {
    width: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .note .icon-svg {
    width: 5.6vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .note .icon-svg {
    height: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .note .icon-svg {
    height: 5.6vw;
  }
}
.modal#ImeiViewModal .note li:first-child {
  width: 20px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .note li:first-child {
    width: 1.25rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .note li:first-child {
    width: 5.25vw;
  }
}
.modal#ImeiViewModal .note li:last-child {
  color: #666666;
  font-weight: 400;
  width: 267px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ImeiViewModal .note li:last-child {
    width: 16.6667rem;
  }
}
@media (max-width: 639px) {
  .modal#ImeiViewModal .note li:last-child {
    width: 70vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#ImeiViewModal .note li:last-child {
    width: 525px;
  }
}
.modal#ImeiViewModal .note li:last-child strong {
  font-weight: 600;
}
.modal#PhoneSelectModal .modal-container, .modal#PhoneSelectTypeBModal .modal-container {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#PhoneSelectModal .modal-container, .modal#PhoneSelectTypeBModal .modal-container {
    max-width: 500px;
  }
}
.modal#PhoneSelectModal .phone-info-row, .modal#PhoneSelectTypeBModal .phone-info-row {
  padding: 33px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PhoneSelectModal .phone-info-row, .modal#PhoneSelectTypeBModal .phone-info-row {
    padding: 2.0833rem;
  }
}
@media (max-width: 639px) {
  .modal#PhoneSelectModal .phone-info-row, .modal#PhoneSelectTypeBModal .phone-info-row {
    padding: 8.75vw;
  }
}
.modal#PhoneSelectModal .phone-info-row strong, .modal#PhoneSelectTypeBModal .phone-info-row strong {
  color: #4BC8C4;
  font-weight: 600;
  font-size: 21px;
  margin-bottom: 8px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PhoneSelectModal .phone-info-row strong, .modal#PhoneSelectTypeBModal .phone-info-row strong {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#PhoneSelectModal .phone-info-row strong, .modal#PhoneSelectTypeBModal .phone-info-row strong {
    font-size: 5.6vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PhoneSelectModal .phone-info-row strong, .modal#PhoneSelectTypeBModal .phone-info-row strong {
    margin-bottom: 0.5rem;
  }
}
@media (max-width: 639px) {
  .modal#PhoneSelectModal .phone-info-row strong, .modal#PhoneSelectTypeBModal .phone-info-row strong {
    margin-bottom: 2.1vw;
  }
}
.modal#PhoneSelectModal .phone-info-row p, .modal#PhoneSelectTypeBModal .phone-info-row p {
  font-weight: 400;
  color: #AAAAAA;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PhoneSelectModal .phone-info-row p, .modal#PhoneSelectTypeBModal .phone-info-row p {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .modal#PhoneSelectModal .phone-info-row p, .modal#PhoneSelectTypeBModal .phone-info-row p {
    font-size: 3.85vw;
  }
}
.modal#PhoneSelectModal .phone-info-row .selected-price, .modal#PhoneSelectTypeBModal .phone-info-row .selected-price {
  color: #4BC8C4;
  font-weight: 600;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PhoneSelectModal .phone-info-row .selected-price, .modal#PhoneSelectTypeBModal .phone-info-row .selected-price {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#PhoneSelectModal .phone-info-row .selected-price, .modal#PhoneSelectTypeBModal .phone-info-row .selected-price {
    font-size: 5.6vw;
  }
}
.modal#PhoneSelectModal .phone-info-row .selected-info, .modal#PhoneSelectTypeBModal .phone-info-row .selected-info {
  color: #222222;
  font-weight: 600;
  font-size: 15px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PhoneSelectModal .phone-info-row .selected-info, .modal#PhoneSelectTypeBModal .phone-info-row .selected-info {
    font-size: 0.9167rem;
  }
}
@media (max-width: 639px) {
  .modal#PhoneSelectModal .phone-info-row .selected-info, .modal#PhoneSelectTypeBModal .phone-info-row .selected-info {
    font-size: 3.85vw;
  }
}
.modal#PhoneSelectModal .modal-footer, .modal#PhoneSelectTypeBModal .modal-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal#PhoneSelectModal .modal-footer button, .modal#PhoneSelectTypeBModal .modal-footer button {
  width: 50%;
  border-radius: 0;
}
.modal#ReplacementPhoneModal {
  /*.total-row{
      background: $Gray1;
      @include responsive(padding, 80px,64px);
      @include responsive(margin-bottom, 100px);
      @include responsive(border-radius, 16px);
      @media screen and (min-width: 640px) {
          border-radius:8px;
          margin-bottom: 32px;
          padding: 30px 22px;
      }
      ul{
          @include flex(space-between,center);
          li{
              &:first-child{
                  color: $Gray9;
                  font-weight: 400;
                  @include responsive(font-size, 44px);
              }
              &:last-child{
                  strong{
                      color: $Gray11;
                      font-weight: 600;
                      @include responsive(font-size, 52px);
                  }
                  span{
                      color: $Gray11;
                      font-weight: 400;
                      @include responsive(font-size, 44px);
                  }
              }
          }
          &:last-child{
              li{
                  &:first-child{
                      color: $Gray11;
                      font-weight: 600;
                      @include responsive(font-size, 44px);
                  }
                  &:last-child{
                      strong{
                          color: $Primary-mint;
                          font-weight: 700;
                          @include responsive(font-size, 64px);
                      }
                      span{
                          color: $Primary-mint;
                          font-weight: 400;
                          @include responsive(font-size, 56px);
                      }
                  }
              }
          }
          @media screen and (min-width: 640px) {
              li{
                  &:first-child{
                      font-size: 14px;
                      padding-left: 16px;
                  }
                  &:last-child{
                      padding-right: 16px;
                      strong{
                          font-size: 18px;
                      }
                      span{
                          font-size: 14px;
                      }
                  }
              }
              &:last-child{
                  li{
                      &:first-child{
                          font-size: 14px;
                      }
                      &:last-child{
                          strong{
                              font-size: 24px;
                          }
                          span{
                              font-size: 20px;
                          }
                      }
                  }
              }
          }
      }
  }*/
}
@media screen and (min-width: 768px) {
  .modal#ReplacementPhoneModal .modal-container {
    max-width: 500px;
  }
}
.modal#ReplacementPhoneModal .modal-scroll {
  height: 480px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .modal-scroll {
    height: 30rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .modal-scroll {
    height: 126vw;
  }
}
.modal#ReplacementPhoneModal .renewed-row {
  padding: 24px 0px 13px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .renewed-row {
    padding: 1.5rem 0rem 0.8333rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .renewed-row {
    padding: 6.3vw 0vw 3.5vw 0vw;
  }
}
@media screen and (min-width: 640px) {
  .modal#ReplacementPhoneModal .renewed-row {
    padding: 24px 0px 16px 0px;
  }
}
.modal#ReplacementPhoneModal .renewed-row .popup-box {
  top: 53px;
  z-index: 3;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .renewed-row .popup-box {
    top: 3.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .renewed-row .popup-box {
    top: 14vw;
  }
}
.modal#ReplacementPhoneModal .phone-img {
  position: relative;
  background: #F9F9F9;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 53px 0px;
  border-radius: 5px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .phone-img {
    padding: 3.3333rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .phone-img {
    padding: 14vw 0vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .phone-img {
    border-radius: 0.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .phone-img {
    border-radius: 1.4vw;
  }
}
@media screen and (min-width: 640px) {
  .modal#ReplacementPhoneModal .phone-img {
    padding: 56px 0px;
    border-radius: 8px;
  }
}
.modal#ReplacementPhoneModal .phone-img .badge-row {
  left: 11px;
  top: 11px;
  z-index: 2;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .phone-img .badge-row {
    left: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .phone-img .badge-row {
    left: 2.8vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .phone-img .badge-row {
    top: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .phone-img .badge-row {
    top: 2.8vw;
  }
}
@media screen and (min-width: 640px) {
  .modal#ReplacementPhoneModal .phone-img .badge-row {
    left: 16px;
    top: 16px;
  }
}
.modal#ReplacementPhoneModal .phone-img .img-row {
  width: 147px;
  height: 147px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .phone-img .img-row {
    width: 9.1667rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .phone-img .img-row {
    width: 38.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .phone-img .img-row {
    height: 9.1667rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .phone-img .img-row {
    height: 38.5vw;
  }
}
.modal#ReplacementPhoneModal .phone-img .img-row img {
  width: 100%;
}
@media screen and (min-width: 640px) {
  .modal#ReplacementPhoneModal .phone-img .img-row {
    width: 178px;
    height: auto;
  }
}
.modal#ReplacementPhoneModal .product-name {
  text-align: left;
  padding: 17px 0px 33px 0px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .product-name {
    padding: 1.0417rem 0rem 2.0833rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .product-name {
    padding: 4.375vw 0vw 8.75vw 0vw;
  }
}
.modal#ReplacementPhoneModal .product-name strong {
  font-weight: 600;
  color: #222222;
  font-size: 21px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .product-name strong {
    font-size: 1.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .product-name strong {
    font-size: 5.6vw;
  }
}
.modal#ReplacementPhoneModal .product-name span {
  font-weight: 400;
  color: #777777;
  margin-left: 13px;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .product-name span {
    margin-left: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .product-name span {
    margin-left: 3.5vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#ReplacementPhoneModal .product-name span {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .modal#ReplacementPhoneModal .product-name span {
    font-size: 3.5vw;
  }
}
@media screen and (min-width: 640px) {
  .modal#ReplacementPhoneModal .product-name {
    padding: 24px 0 40px 0;
  }
  .modal#ReplacementPhoneModal .product-name strong {
    font-size: 24px;
  }
  .modal#ReplacementPhoneModal .product-name span {
    margin-left: 16px;
    font-size: 14px;
  }
}
.modal#ReplacementPhoneModal .form-row label {
  text-align: left;
}
.modal#ReplacementPhoneModal .modal-footer button {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .modal#CautionDeliveryModal .modal-container, .modal#CautionVisitModal .modal-container {
    max-width: 500px;
  }
}
.modal#CautionDeliveryModal .modal-scroll, .modal#CautionVisitModal .modal-scroll {
  height: 480px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#CautionDeliveryModal .modal-scroll, .modal#CautionVisitModal .modal-scroll {
    height: 30rem;
  }
}
@media (max-width: 639px) {
  .modal#CautionDeliveryModal .modal-scroll, .modal#CautionVisitModal .modal-scroll {
    height: 126vw;
  }
}
.modal#CautionDeliveryModal .caution-txt-box, .modal#CautionVisitModal .caution-txt-box {
  padding: 33px 0px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#CautionDeliveryModal .caution-txt-box, .modal#CautionVisitModal .caution-txt-box {
    padding: 2.0833rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#CautionDeliveryModal .caution-txt-box, .modal#CautionVisitModal .caution-txt-box {
    padding: 8.75vw 0vw;
  }
}
.modal#CautionDeliveryModal .caution-txt-box ol li, .modal#CautionVisitModal .caution-txt-box ol li {
  text-align: left;
}
.modal#CautionDeliveryModal .modal-footer button, .modal#CautionVisitModal .modal-footer button {
  width: 100%;
}
.modal#SuretyChecktModal .modal-container {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#SuretyChecktModal .modal-container {
    max-width: 500px;
  }
}
.modal#SuretyChecktModal .modal-container .modal-footer {
  width: 100%;
}
.modal#SuretyChecktModal .modal-container .modal-footer .btn {
  width: 100%;
}
.modal#SuretyChecktModal .modal-container #surety_check .form-row {
  margin: 33px 0px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-flow: wrap;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#SuretyChecktModal .modal-container #surety_check .form-row {
    margin: 2.0833rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#SuretyChecktModal .modal-container #surety_check .form-row {
    margin: 8.75vw 0vw;
  }
}
.modal#SuretyChecktModal .modal-container #surety_check .form-row > label {
  width: 100%;
}
.modal#SuretyChecktModal .modal-container #surety_check .form-row input {
  width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#SuretyChecktModal .modal-container #surety_check .form-row > label {
    width: 100px;
  }
  .modal#SuretyChecktModal .modal-container #surety_check .form-row input {
    width: calc(100% - 100px);
  }
  .modal#SuretyChecktModal .modal-container #surety_check .form-row > div.error {
    padding-left: 100px;
  }
}
.modal#PwPatternModal .modal-container, .modal#PwPatternTextModal .modal-container {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container, .modal#PwPatternTextModal .modal-container {
    max-width: 500px;
  }
}
.modal#PwPatternModal .modal-container .modal-footer, .modal#PwPatternTextModal .modal-container .modal-footer {
  width: 100%;
}
.modal#PwPatternModal .modal-container .modal-footer .btn, .modal#PwPatternTextModal .modal-container .modal-footer .btn {
  width: 100%;
}
.modal#PwPatternModal .modal-container .pattern-lock-container, .modal#PwPatternTextModal .modal-container .pattern-lock-container {
  width: 100%;
  background: #F9F9F9;
  padding: 33px 0px 21px 0px;
  margin: 33px auto 13px auto;
  border-radius: 11px;
  /* 패턴 영역 (캔버스 + 버튼 그리드) */
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container, .modal#PwPatternTextModal .modal-container .pattern-lock-container {
    padding: 2.0833rem 0rem 1.3333rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container, .modal#PwPatternTextModal .modal-container .pattern-lock-container {
    padding: 8.75vw 0vw 5.6vw 0vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container, .modal#PwPatternTextModal .modal-container .pattern-lock-container {
    margin: 2.0833rem auto 0.8333rem auto;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container, .modal#PwPatternTextModal .modal-container .pattern-lock-container {
    margin: 8.75vw auto 3.5vw auto;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container, .modal#PwPatternTextModal .modal-container .pattern-lock-container {
    border-radius: 0.6667rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container, .modal#PwPatternTextModal .modal-container .pattern-lock-container {
    border-radius: 2.8vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container, .modal#PwPatternTextModal .modal-container .pattern-lock-container {
    padding: 48px 0px 32px 0px;
    margin: 32px auto 16px auto;
    border-radius: 12px;
  }
}
.modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area {
  position: relative;
  width: 100%;
  max-width: 213px;
  margin: 0px auto 33px auto;
  aspect-ratio: 1/1;
  /* 라인을 그릴 캔버스 */
  /* 숫자 버튼 그리드 */
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area {
    max-width: 13.3333rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area {
    max-width: 56vw;
  }
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area {
    margin: 0rem auto 2.0833rem auto;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area {
    margin: 0vw auto 8.75vw auto;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area {
    max-width: 288px;
    margin: 0 auto 48px auto;
  }
}
.modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area #pattern-canvas, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area #pattern-canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  --line-color: rgba(75, 200, 196, 0.1);
  --main-line-width: 38;
  --arrow-color: #4BC8C4;
  --arrow-size: 6;
  --arrow-line-width: 2;
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area #pattern-canvas, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area #pattern-canvas {
    --main-line-width: 55;
    --arrow-size: 8;
    --arrow-line-width: 3;
  }
}
.modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid {
  position: relative;
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr); /* 0을 위해 4행으로 구성 */
  z-index: 2;
  pointer-events: none; /* 이 코드를 추가하세요! */
  gap: 44px;
  /* 숫자 버튼 기본 스타일 */
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid {
    gap: 2.7708rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid {
    gap: 11.6375vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid {
    gap: 60px;
  }
}
.modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  color: #fff;
  background-color: #CCCCCC;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
  aspect-ratio: 1/1;
  pointer-events: auto;
  font-size: 18px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot {
    font-size: 1.125rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot {
    font-size: 4.725vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot {
    font-size: 24px;
  }
}
.modal#PwPatternModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot.active, .modal#PwPatternTextModal .modal-container .pattern-lock-container .pattern-area .pattern-grid .pattern-dot.active {
  background-color: #4BC8C4; /* 메인 색상 */
}
.modal#PwPatternModal .modal-container .pattern-lock-container hr, .modal#PwPatternTextModal .modal-container .pattern-lock-container hr {
  width: 90%;
}
.modal#PwPatternModal .modal-container .pattern-lock-container .txt-row, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row {
  padding-top: 17px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .txt-row, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row {
    padding-top: 1.0417rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .txt-row, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row {
    padding-top: 4.375vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .txt-row, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row {
    padding-top: 20px;
  }
}
.modal#PwPatternModal .modal-container .pattern-lock-container .txt-row p, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row p {
  font-weight: 600;
  color: #222222;
  font-size: 13px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .txt-row p, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row p {
    font-size: 0.8333rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .txt-row p, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row p {
    font-size: 3.5vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .pattern-lock-container .txt-row p, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row p {
    font-size: 16px;
  }
}
.modal#PwPatternModal .modal-container .pattern-lock-container .txt-row p:first-child strong, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row p:first-child strong {
  color: #4BC8C4;
}
.modal#PwPatternModal .modal-container .pattern-lock-container .txt-row p:last-child, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row p:last-child {
  font-weight: 400;
}
.modal#PwPatternModal .modal-container .pattern-lock-container .txt-row p:last-child strong, .modal#PwPatternTextModal .modal-container .pattern-lock-container .txt-row p:last-child strong {
  font-weight: 600;
  color: #777777;
}
.modal#PwPatternModal .modal-container .form-row, .modal#PwPatternTextModal .modal-container .form-row {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-flow: wrap;
}
.modal#PwPatternModal .modal-container .form-row label, .modal#PwPatternTextModal .modal-container .form-row label {
  margin-bottom: 0;
  width: 100px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .form-row label, .modal#PwPatternTextModal .modal-container .form-row label {
    width: 6.25rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .form-row label, .modal#PwPatternTextModal .modal-container .form-row label {
    width: 26.25vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .form-row label, .modal#PwPatternTextModal .modal-container .form-row label {
    width: 100px;
  }
}
.modal#PwPatternModal .modal-container .form-row input, .modal#PwPatternTextModal .modal-container .form-row input {
  width: calc(100% - 26.25vw);
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .form-row input, .modal#PwPatternTextModal .modal-container .form-row input {
    width: calc(100% - 100px);
  }
}
.modal#PwPatternModal .modal-container .form-row .error, .modal#PwPatternTextModal .modal-container .form-row .error {
  padding-left: 100px;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwPatternModal .modal-container .form-row .error, .modal#PwPatternTextModal .modal-container .form-row .error {
    padding-left: 6.25rem;
  }
}
@media (max-width: 639px) {
  .modal#PwPatternModal .modal-container .form-row .error, .modal#PwPatternTextModal .modal-container .form-row .error {
    padding-left: 26.25vw;
  }
}
@media screen and (min-width: 1200px) {
  .modal#PwPatternModal .modal-container .form-row .error, .modal#PwPatternTextModal .modal-container .form-row .error {
    padding-left: 100px;
  }
}
.modal#PwTextModal .modal-container {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#PwTextModal .modal-container {
    max-width: 500px;
  }
}
.modal#PwTextModal .modal-container .modal-footer {
  width: 100%;
}
.modal#PwTextModal .modal-container .modal-footer .btn {
  width: 100%;
}
.modal#PwTextModal .modal-container #pw_check .form-row {
  margin: 33px 0px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-flow: wrap;
}
@media (min-width: 640px) and (max-width: 1199px) {
  .modal#PwTextModal .modal-container #pw_check .form-row {
    margin: 2.0833rem 0rem;
  }
}
@media (max-width: 639px) {
  .modal#PwTextModal .modal-container #pw_check .form-row {
    margin: 8.75vw 0vw;
  }
}
.modal#PwTextModal .modal-container #pw_check .form-row > label {
  width: 100%;
}
.modal#PwTextModal .modal-container #pw_check .form-row input {
  width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#PwTextModal .modal-container #pw_check .form-row > label {
    width: 100px;
  }
  .modal#PwTextModal .modal-container #pw_check .form-row input {
    width: calc(100% - 100px);
  }
  .modal#PwTextModal .modal-container #pw_check .form-row > div.error {
    padding-left: 100px;
  }
}
.modal#PhotoPreviewModal .modal-container {
  max-width: 100%;
}
@media screen and (min-width: 1200px) {
  .modal#PhotoPreviewModal .modal-container {
    max-width: 500px;
  }
}
.modal#PhotoPreviewModal .modal-container .content-area img {
  max-width: 100%;
}
.modal#PhotoPreviewModal .modal-container .modal-scroll {
  max-height: 400px;
}
.modal#PhotoPreviewModal .modal-footer .btn {
  width: 100%;
}
.modal .modal-footer .btn {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
@media screen and (min-width: 1200px) {
  .modal .modal-footer .btn {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
  }
}/*# sourceMappingURL=style.css.map */