@charset "UTF-8";
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, a, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, button, time, mark, audio, video {
  font-size: inherit;
  word-break: keep-all;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  height: 100vh; /* 혹시나 Custom Property 지원 안하는 브라우저를 위한 복귀점(Fallback) */
}

body {
  position: relative;
  padding-top: 80em;
  min-height: 1280em;
  font-size: 0.125vw;
  background-color: #fff;
}
@media (min-width: 800px) and (orientation: landscape) {
  body {
    min-height: 800em;
    font-size: 0.078125vw;
  }
}
@media (max-width: 799px) {
  body {
    padding-top: 73em;
    min-height: 640em;
    font-size: 0.2778vw;
  }
}
@media (max-width: 799px) and (orientation: landscape) {
  body {
    font-size: 1px;
    padding-top: 50em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  body {
    min-height: 1920em;
    font-size: 0.0925926vw;
  }
}

.font-en {
  font-family: SamsungSharpSans;
}

/*header*/
.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 50;
  width: 100%;
  height: 80em;
  background: #fff;
  border-bottom: solid 1px #eee;
}
@media (max-width: 799px) {
  .header {
    height: 73em;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding-top: 38em;
  }
}
@media (max-width: 799px) and (orientation: landscape) {
  .header {
    height: 50em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-top: 0;
  }
}
.header__title {
  margin: 0 auto;
  font-size: 28em;
  font-weight: bold;
  color: #000;
}
@media (max-width: 799px) {
  .header__title {
    font-size: 18em;
  }
}
.header__button {
  position: absolute;
  top: 22em;
  width: 36em;
  height: 36em;
  text-indent: -9999px;
}
@media (max-width: 799px) {
  .header__button {
    top: 34em;
    width: 26em;
    height: 26em;
  }
}
@media (max-width: 799px) and (orientation: landscape) {
  .header__button {
    top: 12em;
  }
}
.header__button--back {
  left: 24em;
  background: url(../images/icon_header_back.png) no-repeat center/cover;
}
@media (max-width: 799px) {
  .header__button--back {
    left: 15em;
  }
}
.header__button--close {
  right: 24em;
  background: url(../images/icon_header_close.png) no-repeat center/cover;
}
@media (max-width: 799px) {
  .header__button--close {
    right: 15em;
  }
}
.header__button--reset {
  left: 24em;
  background: url(../images/icon_header_setting.png) no-repeat center/cover;
}
@media (max-width: 799px) {
  .header__button--reset {
    left: 15em;
  }
}

/*footer*/
#footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  background: #fff;
  height: 60em;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}
#footer .footer__btn-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
}
#footer .footer__btn-area > li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-item-align: center;
      align-self: center;
}
#footer .footer__btn-area > li:nth-child(1) i {
  background: url("../images/ico-footer_my.png") no-repeat 0 0/100%;
}
#footer .footer__btn-area > li:nth-child(1).active i {
  background: url("../images/ico-footer_my-active.png") no-repeat 0 0/100%;
}
#footer .footer__btn-area > li:nth-child(2) i {
  background: url("../images/ico-footer_request.png") no-repeat 0 0/100%;
}
#footer .footer__btn-area > li:nth-child(2).active i {
  background: url("../images/ico-footer_request-active.png") no-repeat 0 0/100%;
}
#footer .footer__btn-area > li:nth-child(3) i {
  background: url("../images/ico-footer_dash.png") no-repeat 0 0/100%;
}
#footer .footer__btn-area > li:nth-child(3).active i {
  background: url("../images/ico-footer_dash-active.png") no-repeat 0 0/100%;
}
#footer .footer__btn-area > li .btn-footer__category i {
  display: inline-block;
  width: 30em;
  height: 30em;
  margin-bottom: 2em;
}
#footer .footer__btn-area > li .btn-footer__category p {
  color: #999;
  font-size: 11em;
}
#footer .footer__btn-area > li.active p {
  color: #5814c3;
}

.txt-hidden {
  text-indent: -99999px;
}

.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
}
.modal--open {
  display: block;
}
.modal__dim {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
}
.modal__contents {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 560em;
  min-height: 276em;
  padding: 28em;
  border-radius: 27.8em;
  background-color: #fff;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media (max-width: 799px) {
  .modal__contents {
    padding: 16em;
    width: 320em;
    min-height: 160em;
    border-radius: 20em;
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .modal__contents {
    padding: 32em;
    width: 640em;
    min-height: 310em;
  }
}
.modal__contents__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 1.1429em 0.4286em 1.4286em;
  text-align: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 28em;
  line-height: 1.5;
  min-height: 5.5714em;
}
@media (max-width: 799px) {
  .modal__contents__title {
    padding: 0.875em 0.5em 1.5em;
    font-size: 16em;
    line-height: 1.38;
    min-height: 5.125em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .modal__contents__title {
    padding: 1.1875em 0.5625em 1.5625em;
    font-size: 32em;
    line-height: 1.36;
    min-height: 5.5em;
  }
}
.modal__contents__button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.modal__contents__button .c-btn {
  height: 64em;
}
@media (max-width: 799px) {
  .modal__contents__button .c-btn {
    height: 46em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .modal__contents__button .c-btn {
    height: 70em;
    border-radius: 13.9em;
  }
}
.modal__contents__button .c-btn + .c-btn {
  margin-left: 12em;
}
@media (max-width: 799px) {
  .modal__contents__button .c-btn + .c-btn {
    margin-left: 8em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .modal__contents__button .c-btn__txt {
    font-size: 26em;
    line-height: normal;
  }
}

.bottom-sheet {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
}
.bottom-sheet--open {
  visibility: visible;
}
.bottom-sheet--open .bottom-sheet__contents {
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}
.bottom-sheet__dim {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
}
.bottom-sheet__contents {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  padding: 24em 20em 20em;
  border-top-left-radius: 20em;
  border-top-right-radius: 20em;
  -webkit-transform: translate(0, 100%);
          transform: translate(0, 100%);
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}
.bottom-sheet__contents__title {
  padding-bottom: 1.2em;
  font-size: 20em;
  font-weight: bold;
}
.bottom-sheet__contents__desc {
  font-size: 17em;
  line-height: 1.35;
}
.bottom-sheet__contents__close-box {
  position: absolute;
  top: 20em;
  right: 20em;
  width: 28em;
  height: 28em;
  background: url("../images/ico-com-pop-close.png") no-repeat center/cover;
  text-indent: -9999px;
}
.bottom-sheet__contents .join {
  margin-top: 0;
  padding: 20em 0 30em;
}
.bottom-sheet__contents .join__unit--hidden {
  display: none;
}
.bottom-sheet__contents .join__unit + .join__unit {
  margin-top: 26em;
}
.bottom-sheet__contents .join__unit label {
  display: block;
}
.bottom-sheet__contents .join__unit label span {
  font-size: 14em;
}
.bottom-sheet__contents .join__unit label strong {
  font-size: 16em;
}
.bottom-sheet__contents .filter-type-button {
  display: block;
  margin-top: -8em;
}
.bottom-sheet__contents .filter-type-button ul {
  max-height: 240em;
  overflow-y: scroll;
}
.bottom-sheet__contents .filter-type-button ul > li:first-child button {
  padding-top: 0.75em;
}
.bottom-sheet__contents .filter-type-button ul > li + li {
  border-top: 1px solid #eee;
}
.bottom-sheet__contents .filter-type-button ul > li.active button {
  font-weight: bold;
}
.bottom-sheet__contents .filter-type-button ul > li button {
  display: block;
  width: 100%;
  padding: 1em 0;
  font-size: 16em;
  line-height: 1.25;
}
.bottom-sheet--passwordChange .bottom-sheet__contents__title {
  padding-bottom: 0.6em;
}
.bottom-sheet--passwordChange .bottom-sheet__contents__desc {
  line-height: 1.5;
  font-size: 14em;
}
.bottom-sheet--accessAllow .access-allow {
  margin-top: 40em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.bottom-sheet--accessAllow .access-allow .c-btn--plat {
  margin-right: auto;
}
.bottom-sheet--accessAllow .access-allow .c-btn--round + .c-btn--round {
  margin-left: 8em;
}
.bottom-sheet--messageSend .join {
  height: 204em;
  padding-top: 16em;
}
.bottom-sheet--messageSend .join__unit .input-box input[type=text]:focus::-webkit-input-placeholder {
  color: #ecf1fb;
}
.bottom-sheet--messageSend .join__unit .input-box input[type=text]:focus::-moz-placeholder {
  color: #ecf1fb;
}
.bottom-sheet--messageSend .join__unit .input-box input[type=text]:focus:-ms-input-placeholder {
  color: #ecf1fb;
}
.bottom-sheet--messageSend .join__unit .input-box input[type=text]:focus::-ms-input-placeholder {
  color: #ecf1fb;
}
.bottom-sheet--messageSend .join__unit .input-box input[type=text]:focus::placeholder {
  color: #ecf1fb;
}
.bottom-sheet--messageSend .message-send .c-tab--toggle {
  height: 54em;
}
.bottom-sheet--messageSend .message-send .c-tab--toggle .tab__list__text span {
  font-size: 0.75em;
  display: block;
}
.bottom-sheet--messageSend .message-send .c-tab--toggle .tab-slides {
  height: 46em;
}
.bottom-sheet--messageSend .message-send__desc {
  padding-top: 1.428em;
  font-size: 14em;
  text-align: center;
  line-height: 1.43;
}

.toast-popup {
  position: fixed;
  top: 0;
  left: 10em;
  z-index: 10;
  width: calc(100% - 20em);
  padding: 16em 20em 13em;
  border-radius: 18em;
  background-color: #fff;
  -webkit-box-shadow: 0 2em 10em 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 2em 10em 0 rgba(0, 0, 0, 0.2);
}
.toast-popup__text__title {
  font-size: 15em;
  line-height: 1;
  font-weight: normal;
}
.toast-popup__text__details {
  width: 242em;
  margin-top: 2em;
}
.toast-popup__text__details > li {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #2a2a2a;
  font-size: 13em;
  line-height: 1.38;
  font-weight: normal;
}
.toast-popup__text__details > li strong {
  display: inline-block;
  font-weight: normal;
}
.toast-popup__button {
  position: absolute;
  top: 50%;
  right: 23em;
  width: 36em;
  padding: 7em 6em 5em;
  border-radius: 6em;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  background-color: #5814c3;
}
.toast-popup__button--forced {
  background: #f20940;
}
.toast-popup__button--designated {
  background-color: #00c644;
}
.toast-popup__button span {
  font-size: 13em;
  line-height: 1.46;
  color: #fff;
}

.c-btn {
  width: 100%;
  height: 74em;
  border-radius: 13.9em;
  overflow: hidden;
}
@media (max-width: 799px) {
  .c-btn {
    height: 54em;
    border-radius: 10em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-btn {
    height: 86em;
    border-radius: 16em;
  }
}
.c-btn button, .c-btn a {
  width: 100%;
  height: 100%;
  background: #5814c3;
}
.c-btn button:disabled, .c-btn a:disabled {
  background: #ded0f3;
}
.c-btn button:disabled .c-btn__txt, .c-btn a:disabled .c-btn__txt {
  color: #fff;
}
.c-btn a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.c-btn a.disabled {
  background: #ded0f3;
  pointer-events: none;
}
.c-btn__txt {
  color: #fff;
  font-size: 24em;
  font-weight: 700;
  line-height: 1.17;
  white-space: nowrap;
}
@media (max-width: 799px) {
  .c-btn__txt {
    font-size: 17em;
    line-height: 1.18;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-btn__txt {
    font-size: 28em;
    line-height: 1.21;
  }
}
.c-btn--gray button, .c-btn--gray a {
  background: #f3f3f3;
}
.c-btn--gray button:disabled, .c-btn--gray a:disabled {
  background: #f3f3f3;
}
.c-btn--gray button:disabled .c-btn__txt, .c-btn--gray a:disabled .c-btn__txt {
  color: #dddddd;
}
.c-btn--gray button .c-btn__txt, .c-btn--gray a .c-btn__txt {
  color: #999;
}
.c-btn--white {
  border: solid 1px #000;
}
.c-btn--white button, .c-btn--white a {
  background: #fff;
}
.c-btn--white button:disabled, .c-btn--white a:disabled {
  background: #f3f3f3;
}
.c-btn--white button:disabled .c-btn__txt, .c-btn--white a:disabled .c-btn__txt {
  color: #dddddd;
}
.c-btn--white button .c-btn__txt, .c-btn--white a .c-btn__txt {
  color: #000;
}
.c-btn--function {
  border: 1px solid #ddd;
  border-radius: 8em;
  width: 134em;
  height: 32em;
}
.c-btn--function button {
  background: #fff;
}
.c-btn--function button .c-btn__txt {
  font-size: 13em;
  line-height: 1.46;
  font-weight: normal;
  color: #000;
}
.c-btn--function-flex {
  display: inline-block;
  width: auto;
  height: 32em;
  border: 1px solid #ddd;
  border-radius: 8em;
}
.c-btn--function-flex button {
  width: auto;
  background: #fff;
}
.c-btn--function-flex button .c-btn__txt {
  padding: 0.6em 1.2em;
  font-size: 13em;
  line-height: 1.46;
  font-weight: normal;
  color: #000;
}
.c-btn--round {
  min-width: 74em;
  height: 40em;
  padding: 9.5em 20em;
  border-radius: 32em;
  border: 1px solid transparent;
  background: #5814c3;
  color: #fff;
  -webkit-box-shadow: 0 4em 6em 0 rgba(0, 98, 255, 0.16);
          box-shadow: 0 4em 6em 0 rgba(0, 98, 255, 0.16);
}
.c-btn--round .c-btn__txt {
  font-size: 15em;
}
.c-btn--plat .c-btn__txt {
  font-size: 15em;
  line-height: 1.27;
  color: #5814c3;
}
.c-btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.c-btn-box--floating {
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  padding: 0 206em 20em;
  background: #fff;
  z-index: 50;
}
@media (min-width: 800px) and (orientation: landscape) {
  .c-btn-box--floating {
    padding: 0 446em 20em;
  }
}
@media (max-width: 799px) {
  .c-btn-box--floating {
    padding: 0 16em 20em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-btn-box--floating {
    padding: 0 346em 20em;
  }
}
.c-btn-box--floating:before {
  content: "";
  position: absolute;
  top: -56em;
  left: 0;
  width: 100%;
  height: 56em;
  pointer-events: none;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(26%, rgba(255, 255, 255, 0.26)), to(#fff));
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.26) 26%, #fff);
}
@media (max-width: 799px) {
  .c-btn-box--floating:before {
    top: -40em;
    height: 40em;
  }
}
.c-btn-box .c-btn {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.c-btn-box .c-btn + .c-btn {
  margin-left: 8em;
}
.c-btn--filter {
  width: 30em;
  height: 30em;
  background-color: none;
  background: url("../images/ico-sub_filter.png") no-repeat 0 0/100%;
}
.c-btn--filter button, .c-btn--filter a {
  color: transparent;
  text-indent: -99999px;
  background-color: transparent;
}
.c-btn-text {
  width: 100%;
  padding: 19em 0 16em;
  text-align: center;
}
.c-btn-text input[type=checkbox] {
  width: 0;
  height: 0;
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
}
.c-btn-text input[type=checkbox] + label {
  position: relative;
  padding-left: 0.8em;
  font-size: 14em;
  line-height: 1.5;
  color: #999;
}
.c-btn-text input[type=checkbox] + label:before {
  content: "";
  position: absolute;
  top: 0;
  left: -1em;
  width: 1.3em;
  height: 1.3em;
  border-radius: 50%;
  background: #ddd url("../images/ico_com_checkbox.png") no-repeat center/0.8em;
}
.c-btn-text input[type=checkbox]:checked + label:before {
  background-color: #5814c3;
}
.c-btn-text button {
  position: relative;
  display: block;
  margin-left: 2em;
  padding-right: 1em;
  font-size: 14em;
  line-height: 1.5;
  color: #999;
  text-decoration: underline;
  background: url("../images/ico-com-btn-arrow.png") no-repeat 100% center/1em;
}
.c-btn-wrap {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.c-checkbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 12em;
}
@media (max-width: 799px) {
  .c-checkbox {
    gap: 8em;
  }
}
.c-checkbox .check-unit {
  position: relative;
  width: calc(50% - 6em);
  height: 60em;
  border-radius: 12em;
}
@media (min-width: 800px) and (orientation: landscape) {
  .c-checkbox .check-unit {
    width: 166em;
  }
}
@media (max-width: 799px) {
  .c-checkbox .check-unit {
    width: calc(50% - 4em);
    height: 46em;
    border-radius: 8em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-checkbox .check-unit {
    width: 200em;
    height: 70em;
  }
}
.c-checkbox .check-unit input[type=radio],
.c-checkbox .check-unit input[type=checkbox] {
  width: 100%;
  height: 100%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  margin: 0;
  font-size: 1em;
  border-radius: 12em;
  border: 1px solid #ddd;
}
@media (max-width: 799px) {
  .c-checkbox .check-unit input[type=radio],
  .c-checkbox .check-unit input[type=checkbox] {
    border-radius: 8em;
  }
}
.c-checkbox .check-unit input[type=radio]:checked,
.c-checkbox .check-unit input[type=checkbox]:checked {
  border-color: #5814c3;
}
.c-checkbox .check-unit input[type=radio]:checked + label,
.c-checkbox .check-unit input[type=checkbox]:checked + label {
  color: #5814c3;
  font-weight: bold;
}
.c-checkbox .check-unit input[type=radio]:disabled + label,
.c-checkbox .check-unit input[type=checkbox]:disabled + label {
  color: #ccc;
}
.c-checkbox .check-unit input[type=radio]:checked:disabled,
.c-checkbox .check-unit input[type=checkbox]:checked:disabled {
  border-color: #ded0f3;
}
.c-checkbox .check-unit input[type=radio]:checked:disabled + label,
.c-checkbox .check-unit input[type=checkbox]:checked:disabled + label {
  color: #ded0f3;
}
.c-checkbox .check-unit label {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 22em;
  color: #777;
}
@media (max-width: 799px) {
  .c-checkbox .check-unit label {
    font-size: 16em;
    line-height: 1.38;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-checkbox .check-unit label {
    font-size: 26em;
    line-height: 1.15;
  }
}

.c-switch .check-unit {
  position: relative;
  display: block;
  text-indent: -9999px;
}
.c-switch .check-unit input {
  display: none;
}
.c-switch .check-unit input:checked + label {
  background-color: #5814c3;
}
.c-switch .check-unit input:checked + label::after {
  left: 23em;
}
@media (max-width: 799px) {
  .c-switch .check-unit input:checked + label::after {
    left: 17em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-switch .check-unit input:checked + label::after {
    left: 27em;
  }
}
.c-switch .check-unit label {
  display: block;
  width: 50em;
  height: 30em;
  background-color: #ccc;
  border-radius: 15em;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}
@media (max-width: 799px) {
  .c-switch .check-unit label {
    width: 36em;
    height: 21em;
    border-radius: 11em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-switch .check-unit label {
    width: 59em;
    height: 36em;
    border-radius: 18em;
  }
}
.c-switch .check-unit label::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 3em;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 24em;
  height: 24em;
  border-radius: 50%;
  background-color: #fff;
  -webkit-transition: left 0.3s ease;
  transition: left 0.3s ease;
}
@media (max-width: 799px) {
  .c-switch .check-unit label::after {
    left: 2em;
    width: 17em;
    height: 17em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-switch .check-unit label::after {
    left: 4em;
    width: 28em;
    height: 28em;
  }
}

.input-box {
  position: relative;
  height: 60em;
}
@media (max-width: 799px) {
  .input-box {
    height: 46em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .input-box {
    height: 70em;
  }
}
.input-box input[type=text],
.input-box input[type=search],
.input-box input[type=password],
.input-box input[type=button],
.input-box textarea {
  width: 100%;
  height: 100%;
  border: none;
  background: #f8f8fa;
  padding: 0 2.6364em 0 1em;
  font-size: 22em;
  border-radius: 0.5455em;
  resize: none;
  text-overflow: ellipsis;
  -webkit-appearance: none;
}
.input-box input[type=text]::-ms-clear, .input-box input[type=text]::-ms-reveal,
.input-box input[type=search]::-ms-clear,
.input-box input[type=search]::-ms-reveal,
.input-box input[type=password]::-ms-clear,
.input-box input[type=password]::-ms-reveal,
.input-box input[type=button]::-ms-clear,
.input-box input[type=button]::-ms-reveal,
.input-box textarea::-ms-clear,
.input-box textarea::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}
.input-box input[type=text]::-webkit-search-decoration, .input-box input[type=text]::-webkit-search-cancel-button, .input-box input[type=text]::-webkit-search-results-button, .input-box input[type=text]::-webkit-search-results-decoration,
.input-box input[type=search]::-webkit-search-decoration,
.input-box input[type=search]::-webkit-search-cancel-button,
.input-box input[type=search]::-webkit-search-results-button,
.input-box input[type=search]::-webkit-search-results-decoration,
.input-box input[type=password]::-webkit-search-decoration,
.input-box input[type=password]::-webkit-search-cancel-button,
.input-box input[type=password]::-webkit-search-results-button,
.input-box input[type=password]::-webkit-search-results-decoration,
.input-box input[type=button]::-webkit-search-decoration,
.input-box input[type=button]::-webkit-search-cancel-button,
.input-box input[type=button]::-webkit-search-results-button,
.input-box input[type=button]::-webkit-search-results-decoration,
.input-box textarea::-webkit-search-decoration,
.input-box textarea::-webkit-search-cancel-button,
.input-box textarea::-webkit-search-results-button,
.input-box textarea::-webkit-search-results-decoration {
  display: none;
}
@media (max-width: 799px) {
  .input-box input[type=text],
  .input-box input[type=search],
  .input-box input[type=password],
  .input-box input[type=button],
  .input-box textarea {
    padding: 0 2.375em 0 1em;
    font-size: 16em;
    line-height: 1.375;
    border-radius: 0.5em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .input-box input[type=text],
  .input-box input[type=search],
  .input-box input[type=password],
  .input-box input[type=button],
  .input-box textarea {
    padding: 0 2.5385em 0 0.8462em;
    font-size: 26em;
    line-height: 1.31;
    border-radius: 0.4615em;
  }
}
.input-box input[type=text]:disabled,
.input-box input[type=search]:disabled,
.input-box input[type=password]:disabled,
.input-box input[type=button]:disabled,
.input-box textarea:disabled {
  color: #ccc;
}
.input-box input[type=text]:focus,
.input-box input[type=search]:focus,
.input-box input[type=password]:focus,
.input-box input[type=button]:focus,
.input-box textarea:focus {
  background: #f1effc;
}
.input-box input[type=text]:focus + .input-box__clear--visible,
.input-box input[type=search]:focus + .input-box__clear--visible,
.input-box input[type=password]:focus + .input-box__clear--visible,
.input-box input[type=button]:focus + .input-box__clear--visible,
.input-box textarea:focus + .input-box__clear--visible {
  opacity: 1;
  z-index: 10;
}
.input-box input[type=text]::-webkit-input-placeholder, .input-box input[type=search]::-webkit-input-placeholder, .input-box input[type=password]::-webkit-input-placeholder, .input-box input[type=button]::-webkit-input-placeholder, .input-box textarea::-webkit-input-placeholder {
  color: #999;
}
.input-box input[type=text]::-moz-placeholder, .input-box input[type=search]::-moz-placeholder, .input-box input[type=password]::-moz-placeholder, .input-box input[type=button]::-moz-placeholder, .input-box textarea::-moz-placeholder {
  color: #999;
}
.input-box input[type=text]:-ms-input-placeholder, .input-box input[type=search]:-ms-input-placeholder, .input-box input[type=password]:-ms-input-placeholder, .input-box input[type=button]:-ms-input-placeholder, .input-box textarea:-ms-input-placeholder {
  color: #999;
}
.input-box input[type=text]::-ms-input-placeholder, .input-box input[type=search]::-ms-input-placeholder, .input-box input[type=password]::-ms-input-placeholder, .input-box input[type=button]::-ms-input-placeholder, .input-box textarea::-ms-input-placeholder {
  color: #999;
}
.input-box input[type=text]::placeholder,
.input-box input[type=search]::placeholder,
.input-box input[type=password]::placeholder,
.input-box input[type=button]::placeholder,
.input-box textarea::placeholder {
  color: #999;
}
.input-box input[type=text]:-moz-read-only, .input-box input[type=search]:-moz-read-only, .input-box input[type=password]:-moz-read-only, .input-box input[type=button]:-moz-read-only, .input-box textarea:-moz-read-only {
  color: #ccc;
}
.input-box input[type=text]:read-only,
.input-box input[type=search]:read-only,
.input-box input[type=password]:read-only,
.input-box input[type=button]:read-only,
.input-box textarea:read-only {
  color: #ccc;
}
.input-box input[type=text]:-moz-read-only.assign-person, .input-box input[type=search]:-moz-read-only.assign-person, .input-box input[type=password]:-moz-read-only.assign-person, .input-box input[type=button]:-moz-read-only.assign-person, .input-box textarea:-moz-read-only.assign-person {
  color: #000;
}
.input-box input[type=text]:read-only.assign-person,
.input-box input[type=search]:read-only.assign-person,
.input-box input[type=password]:read-only.assign-person,
.input-box input[type=button]:read-only.assign-person,
.input-box textarea:read-only.assign-person {
  color: #000;
}
.input-box input[type=text]:-moz-read-only.cal-input, .input-box input[type=search]:-moz-read-only.cal-input, .input-box input[type=password]:-moz-read-only.cal-input, .input-box input[type=button]:-moz-read-only.cal-input, .input-box textarea:-moz-read-only.cal-input {
  color: #000;
}
.input-box input[type=text]:read-only.cal-input,
.input-box input[type=search]:read-only.cal-input,
.input-box input[type=password]:read-only.cal-input,
.input-box input[type=button]:read-only.cal-input,
.input-box textarea:read-only.cal-input {
  color: #000;
}
.input-box input[type=text]:-moz-read-only.time-con-start, .input-box input[type=text]:-moz-read-only.time-con-end, .input-box input[type=search]:-moz-read-only.time-con-start, .input-box input[type=search]:-moz-read-only.time-con-end, .input-box input[type=password]:-moz-read-only.time-con-start, .input-box input[type=password]:-moz-read-only.time-con-end, .input-box input[type=button]:-moz-read-only.time-con-start, .input-box input[type=button]:-moz-read-only.time-con-end, .input-box textarea:-moz-read-only.time-con-start, .input-box textarea:-moz-read-only.time-con-end {
  color: #999;
}
.input-box input[type=text]:read-only.time-con-start, .input-box input[type=text]:read-only.time-con-end,
.input-box input[type=search]:read-only.time-con-start,
.input-box input[type=search]:read-only.time-con-end,
.input-box input[type=password]:read-only.time-con-start,
.input-box input[type=password]:read-only.time-con-end,
.input-box input[type=button]:read-only.time-con-start,
.input-box input[type=button]:read-only.time-con-end,
.input-box textarea:read-only.time-con-start,
.input-box textarea:read-only.time-con-end {
  color: #999;
}
.input-box--white input[type=text],
.input-box--white input[type=search],
.input-box--white input[type=password],
.input-box--white input[type=button] {
  background: #fff;
}
.input-box--file input[type=file] {
  opacity: 0;
  width: 100%;
  height: 100%;
}
.input-box--txt-area {
  height: 68em;
}
.input-box--txt-area.input-box--txt-area-long {
  height: 92em;
}
.input-box--txt-area textarea {
  padding: 0.75em 1em 0;
}
.input-box--time-select {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.input-box--time-select > span {
  position: relative;
  margin: 0 0.33em;
  font-size: 18em;
}
.input-box--time-select > span:before {
  content: "";
  position: absolute;
  top: 0;
  left: -2em;
  width: 0.88em;
  height: 0.88em;
  background: url("../images/ico-select_open.png") no-repeat center/cover;
}
.input-box--time-select input[type=button],
.input-box--time-select input[type=text] {
  border: 1px solid #ddd;
  text-align: left;
}
.input-box--time-select input[type=button].selected.time-con-start, .input-box--time-select input[type=button].selected.time-con-end,
.input-box--time-select input[type=text].selected.time-con-start,
.input-box--time-select input[type=text].selected.time-con-end {
  color: #000;
}
.input-box--search input[type=search] {
  padding-right: 5em;
}
@media (max-width: 799px) {
  .input-box--search input[type=search] {
    padding-right: 4.8em;
  }
}
.input-box--search .input-box__clear {
  right: 72em;
}
@media (max-width: 799px) {
  .input-box--search .input-box__clear {
    right: 51em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .input-box--search .input-box__clear {
    right: 84em;
  }
}
.input-box--search .input-box__search {
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  width: 36em;
  height: 36em;
  right: 22em;
  background: url("../images/icon_search.png") no-repeat 0 0/100%;
}
@media (max-width: 799px) {
  .input-box--search .input-box__search {
    width: 26em;
    height: 26em;
    right: 17em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .input-box--search .input-box__search {
    width: 42em;
    height: 42em;
    right: 26em;
  }
}
.input-box--search .input-box__search button {
  display: block;
  width: 100%;
  height: 100%;
  text-indent: -9999px;
}
.input-box input[type=password] {
  padding: 0 1.6111em 0 0.6111em;
  font-size: 36em;
  letter-spacing: 0.1em;
  border-radius: 0.3333em;
}
@media (max-width: 799px) {
  .input-box input[type=password] {
    padding: 0 1.5833em 0 0.6666em;
    font-size: 24em;
    letter-spacing: 0.0833em;
    border-radius: 0.3333em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .input-box input[type=password] {
    padding: 0 1.5em 0 0.5em;
    font-size: 44em;
    letter-spacing: 0.1364em;
    border-radius: 0.2727em;
  }
}
.input-box input[type=password]::-webkit-input-placeholder {
  font-size: 0.6111em;
  letter-spacing: 0;
  -webkit-transform: translateY(-0.1944em);
          transform: translateY(-0.1944em);
}
.input-box input[type=password]::-moz-placeholder {
  font-size: 0.6111em;
  letter-spacing: 0;
  transform: translateY(-0.1944em);
}
.input-box input[type=password]:-ms-input-placeholder {
  font-size: 0.6111em;
  letter-spacing: 0;
  transform: translateY(-0.1944em);
}
.input-box input[type=password]::-ms-input-placeholder {
  font-size: 0.6111em;
  letter-spacing: 0;
  transform: translateY(-0.1944em);
}
.input-box input[type=password]::placeholder {
  font-size: 0.6111em;
  letter-spacing: 0;
  -webkit-transform: translateY(-0.1944em);
          transform: translateY(-0.1944em);
}
@media (max-width: 799px) {
  .input-box input[type=password]::-webkit-input-placeholder {
    font-size: 0.6667em;
    letter-spacing: 0;
    -webkit-transform: translateY(-0.1667em);
            transform: translateY(-0.1667em);
  }
  .input-box input[type=password]::-moz-placeholder {
    font-size: 0.6667em;
    letter-spacing: 0;
    transform: translateY(-0.1667em);
  }
  .input-box input[type=password]:-ms-input-placeholder {
    font-size: 0.6667em;
    letter-spacing: 0;
    transform: translateY(-0.1667em);
  }
  .input-box input[type=password]::-ms-input-placeholder {
    font-size: 0.6667em;
    letter-spacing: 0;
    transform: translateY(-0.1667em);
  }
  .input-box input[type=password]::placeholder {
    font-size: 0.6667em;
    letter-spacing: 0;
    -webkit-transform: translateY(-0.1667em);
            transform: translateY(-0.1667em);
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .input-box input[type=password]::-webkit-input-placeholder {
    font-size: 0.5909em;
    letter-spacing: 0;
    -webkit-transform: translateY(-0.2045em);
            transform: translateY(-0.2045em);
  }
  .input-box input[type=password]::-moz-placeholder {
    font-size: 0.5909em;
    letter-spacing: 0;
    transform: translateY(-0.2045em);
  }
  .input-box input[type=password]:-ms-input-placeholder {
    font-size: 0.5909em;
    letter-spacing: 0;
    transform: translateY(-0.2045em);
  }
  .input-box input[type=password]::-ms-input-placeholder {
    font-size: 0.5909em;
    letter-spacing: 0;
    transform: translateY(-0.2045em);
  }
  .input-box input[type=password]::placeholder {
    font-size: 0.5909em;
    letter-spacing: 0;
    -webkit-transform: translateY(-0.2045em);
            transform: translateY(-0.2045em);
  }
}
.input-box__clear {
  position: absolute;
  top: 50%;
  right: 20em;
  width: 22em;
  height: 22em;
  border-radius: 50%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  text-indent: -9999px;
  background: url("../images/icon_input_delete.png") no-repeat 0 0/100%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
@media (max-width: 799px) {
  .input-box__clear {
    right: 12em;
    width: 18em;
    height: 18em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .input-box__clear {
    right: 22em;
    width: 26em;
    height: 26em;
  }
}
.input-box__clear--visible {
  visibility: visible;
  opacity: 0;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  z-index: -1;
}
.input-box--search .input-box__clear--visible {
  opacity: 1;
  z-index: 0;
}

.select-box {
  height: 60em;
  position: relative;
}
@media (max-width: 799px) {
  .select-box {
    height: 46em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .select-box {
    height: 70em;
  }
}
.error .select-box select {
  color: #f9220e;
}

select {
  display: block;
  position: relative;
  width: 100%;
  padding: 0 2.7273em 0 1em;
  height: 100%;
  border-radius: 0.5455em;
  border: 1px solid #ddd;
  font-size: 22em;
  color: #000;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: url("../images/icon_select-box_arrow.png") no-repeat right 1em center/1em;
}
@media (max-width: 799px) {
  select {
    padding: 0 2.75em 0 1em;
    font-size: 16em;
    line-height: 1.25;
    border-radius: 0.5em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  select {
    padding: 0 2.5385em 0 0.8462em;
    font-size: 26em;
    background: url("../images/icon_select-box_arrow.png") no-repeat right 0.8462em center/1em;
  }
}
select:disabled {
  background: #f8f8fa;
  color: #ccc;
}
select:required:invalid {
  color: #999;
}
select:focus {
  border: 1px solid #000;
}
.selected select {
  color: #000;
}

select option {
  color: #000;
}

.c-tab {
  position: relative;
}
.c-tab .tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.c-tab .tab__list {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-align: center;
}
.c-tab .tab__list button {
  width: 100%;
  height: 100%;
}
.c-tab .tab__list__text {
  display: block;
  padding: 0.76em 0;
  font-size: 17em;
  line-height: 1.24;
  color: #757575;
}
.c-tab .tab-slides {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 50%;
  height: 2px;
  background-color: #000;
  will-change: transform;
  -webkit-transition: -webkit-transform 0.2s ease;
  transition: -webkit-transform 0.2s ease;
  transition: transform 0.2s ease;
  transition: transform 0.2s ease, -webkit-transform 0.2s ease;
}
.c-tab--normal {
  border-bottom: 1px solid #eee;
  margin: 0 -16em;
}
.c-tab--normal .tab__list.active .tab__list__text {
  font-weight: bold;
  color: #000;
}
.c-tab--normal .tab__list__button {
  padding: 0.76em 0;
}
.c-tab--normal.c-tab--content-2 .tab-slides {
  width: 50%;
}
.c-tab--normal.c-tab--content-3 .tab-slides {
  width: 33.33%;
}
.c-tab--toggle {
  background-color: #f8f8fA;
  border-radius: 10em;
  height: 46em;
}
.c-tab--toggle:before {
  content: "";
  position: absolute;
  top: 7em;
  left: 50%;
  width: 1px;
  height: calc(100% - 14em);
  background-color: #f0f0f0;
  z-index: 0;
}
.c-tab--toggle .tab {
  position: relative;
  z-index: 2;
}
.c-tab--toggle .tab__list.active .tab__list__text {
  color: #5814c3;
}
.c-tab--toggle .tab__list__text {
  font-weight: bold;
  font-size: 16em;
  color: #999;
}
.c-tab--toggle.c-tab--content-2 .tab-slides {
  width: calc(50% - 4em);
}
.c-tab--toggle.c-tab--content-3::before {
  left: calc(33.33% - 2em);
}
.c-tab--toggle.c-tab--content-3::after {
  content: "";
  position: absolute;
  top: 7em;
  left: calc(66.66% - 1em);
  width: 1px;
  height: calc(100% - 14em);
  background-color: #f0f0f0;
  z-index: 0;
}
.c-tab--toggle.c-tab--content-3 .tab__list:first-child {
  text-indent: 4em;
}
.c-tab--toggle.c-tab--content-3 .tab__list:last-child {
  text-indent: -4em;
}
.c-tab--toggle.c-tab--content-3 .tab-slides {
  width: calc(33.33% - 3em);
}
.c-tab--toggle .tab-slides {
  z-index: 1;
  bottom: 4em;
  left: 4em;
  height: 38em;
  background-color: #fff;
  border-radius: 8em;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);
}
.c-tab--swipe {
  margin: 0 -39em;
}
.c-tab--swipe .tab {
  display: block;
  white-space: nowrap;
  overflow-x: scroll;
  padding: 0 39em;
}
.c-tab--swipe .tab::-webkit-scrollbar {
  display: none;
}
.c-tab--swipe .tab__list {
  display: inline-block;
  -webkit-box-flex: initial;
      -ms-flex: initial;
          flex: initial;
  height: 50em;
  border-radius: 12em;
  background-color: #f8f8fa;
}
.c-tab--swipe .tab__list + .tab__list {
  margin-left: 12em;
}
@media (max-width: 799px) {
  .c-tab--swipe .tab__list + .tab__list {
    margin-left: 6em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-tab--swipe .tab__list + .tab__list {
    margin-left: 14em;
  }
}
.c-tab--swipe .tab__list.active {
  background-color: #5814c3;
}
.c-tab--swipe .tab__list.active .tab__list__text {
  color: #fff;
}
@media (max-width: 799px) {
  .c-tab--swipe .tab__list {
    height: 36em;
    border-radius: 8em;
  }
}
@media (max-width: 799px) and (orientation: landscape) {
  .c-tab--swipe .tab__list {
    height: 36em;
  }
}
@media (min-width: 1080px) and (min-height: 1920px) {
  .c-tab--swipe .tab__list {
    border-radius: 14em;
    height: 60em;
  }
}
.c-tab--swipe .tab__list button {
  min-width: 68em;
}
.c-tab--swipe .tab__list__text {
  padding: 0.47em 0.82em;
  color: #999;
  white-space: nowrap;
  font-size: 15em;
  font-weight: bold;
}
.c-tab--swipe .tab-slides {
  display: none;
}

.btn-switch {
  position: relative;
  display: inline-block;
  width: 26em;
  height: 14em;
  border-radius: 7em;
  background-color: #ccc;
  margin-top: -5px;
  text-indent: -9999px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  vertical-align: top;
}
.btn-switch::after {
  display: block;
  content: "";
  clear: both;
  position: absolute;
  top: 1.3em;
  left: 1em;
  width: 11em;
  height: 11em;
  border-radius: 50%;
  background-color: #fff;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.btn-switch.active {
  background-color: #5814c3;
}
.btn-switch.active::after {
  left: 12em;
}

.filter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 13em 20em;
  margin: 0 -16em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  background: #fff;
  border-top: 1px solid #eee;
}
.filter .filter__txt {
  width: calc(100% - 46em);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.filter .num {
  color: #5814c3;
}
.filter__selected {
  font-size: 14em;
  color: #777;
}
.filter__selected .selected-value {
  position: relative;
  color: #000;
  margin: 0 0.57em;
}
.filter__selected .selected-value:first-child {
  margin-left: 0;
}
.filter__selected .selected-value:first-child::after {
  display: none;
}
.filter__selected .selected-value::after {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  left: -0.64em;
  width: 0.28em;
  height: 0.28em;
  border-radius: 50%;
  background: #e7e7e7;
  content: "";
}

.type-filter__tit {
  width: 100%;
}
.type-filter__tit strong {
  font-weight: normal;
  font-size: 14em;
  line-height: 1.5;
}
.type-filter__btn {
  padding: 7em 12em;
  border-radius: 6em;
  border: 1px solid #ddd;
  margin: 4em 4em;
  min-width: 60em;
}
.type-filter__btn.en {
  font-family: "SamsungSharpSans";
}
.type-filter__btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 -4em;
}
.type-filter__btn span {
  font-size: 14em;
  line-height: 1.43;
  color: #ddd;
  pointer-events: none;
}
.type-filter__btn-wrap.active button {
  border: 1px solid #5814c3;
  font-weight: bold;
}
.type-filter__btn-wrap.active span {
  color: #5814c3;
  font-weight: bold;
}
.type-filter__btn-wrap.non-active button {
  pointer-events: none;
}
.type-filter__list {
  margin: 8em 0 15em;
}
.type-filter__list-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: -2.5em;
  width: 100%;
}
.type-filter__list-wrap + .type-filter__list-wrap {
  margin-top: 16em;
}
.type-filter__list-wrap.active .type-filter__list-btn {
  border: 1px solid #5814c3;
}
.type-filter__list-wrap.active span {
  color: #5814c3;
}

@media (max-width: 799px) {
  .only-tablet {
    display: none;
  }
}

@media (min-width: 800px) {
  .only-mobile {
    display: none;
  }
}

/* npc */
.c-npc-wrap {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.8);
}
.c-npc-wrap__inner {
  overflow: hidden;
  overflow-y: auto;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 450px;
  background-color: #ffffff;
}
.c-npc-wrap .header {
  position: fixed;
  right: 0;
  left: auto;
  width: 450px;
}
.c-npc-wrap .c-btn-box {
  position: fixed;
  right: 0;
  left: auto;
  width: 450px;
}
/*# sourceMappingURL=common.css.map */