@charset "UTF-8";
@import url("/css/global/common_set.css");
/*
	로그인 레이어 팝업
	- soop_webplayer/pop_layer.scss
 */
* {
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  outline: none;
  cursor: pointer;
}

button {
  border: none;
  background-color: transparent;
  outline: none;
  cursor: pointer;
}

input {
  outline: none;
}

._login_layer {
  position: relative;
  background: #fff;
}
html[dark=true] ._login_layer {
  background: #1C1E22;
}
._login_layer {
  overflow: hidden auto;
  min-width: 400px;
  max-width: 400px;
  max-height: 100%;
  margin: 0 auto;
  padding: 44px 32px 36px;
  border-radius: 12px;
  border: 1px solid #D5D7DC;
}
html[dark=true] ._login_layer {
  border: 1px solid #2B2E33;
}
._login_layer {
  border-radius: 12px;
  box-sizing: border-box;
  z-index: 15;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.15), 0px 4px 12px 0px rgba(0, 0, 0, 0.15);
  overscroll-behavior: none;
  scrollbar-width: none !important;
}
._login_layer::-webkit-scrollbar {
  display: none !important;
}
._login_layer .close_layer {
  position: absolute;
  top: 32px;
  right: 32px;
  background-image: url("data:image/svg+xml,%3csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m4.75 4.754 14.5 14.5M19.25 4.754l-14.5 14.5' stroke='%23525661' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");
}
html[dark=true] ._login_layer .close_layer {
  background-image: url("data:image/svg+xml,%3csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m4.75 4.754 14.5 14.5M19.25 4.754l-14.5 14.5' stroke='%23D5D7DC' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");
}
._login_layer .close_layer {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 24px;
  height: 24px;
  font: 0/0 a;
}
._login_layer .header > h2 {
  display: block;
  background-image: url("/images/svg/soop_logo.svg");
}
html[dark=true] ._login_layer .header > h2 {
  background-image: url("/images/svg/soop_logo_dark.svg");
}
._login_layer .header > h2 {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 124px;
  height: 70px;
  margin: 0 auto;
  font: 0/0 a;
}
._login_layer .header > h2 a {
  display: block;
  height: 100%;
  cursor: pointer;
}
._login_layer .contents_area {
  margin-top: 20px;
}
._login_layer .contents_area .info_message {
  display: block;
  padding: 0 0 18px;
  color: #525661;
}
html[dark=true] ._login_layer .contents_area .info_message {
  color: #D5D7DC;
}
._login_layer .contents_area .info_message {
  font-size: 15px;
  text-align: center;
  line-height: 25.2px;
}
._login_layer .contents_area .info_message .fcr_blue {
  color: #0182FF;
}
._login_layer .contents_area .adult {
  position: relative;
  box-sizing: border-box;
  max-width: 354px;
  padding: 0 0 0 88px;
  margin: 0 auto 30px;
  color: #525661;
}
html[dark=true] ._login_layer .contents_area .adult {
  color: #D5D7DC;
}
._login_layer .contents_area .adult {
  font-size: 18px;
  line-height: 25.2px;
}
._login_layer .contents_area .adult strong {
  color: #EF565F;
  font-weight: 500;
}
._login_layer .contents_area .adult:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  display: block;
  width: 64px;
  height: 64px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='64' height='65' fill='none'%3e%3crect width='61.5' height='61.5' x='1.25' y='1.75' stroke='%23EF565F' stroke-width='2.5' rx='30.75'/%3e%3cpath fill='%23EF565F' d='M39.962 23.968c-2.106 0-3.871 1.487-3.871 4.305 0 2.88 1.734 4.18 3.964 4.18 1.517 0 3.468-1.548 3.53-3.747-.031-2.694-1.456-4.738-3.623-4.738Zm-.65 16.785c2.724 0 4.552-2.88 4.459-7.432-.775 1.331-2.602 2.477-4.738 2.477-3.902 0-6.906-2.787-6.906-7.215 0-4.553 2.663-8.052 7.68-8.052 5.574 0 8.02 4.119 8.02 11.551.031 8.423-3.654 12.325-8.485 12.325-3.004 0-5.14-1.115-6.193-2.57-1.115-1.549 1.053-3.902 2.756-2.323.774.743 2.075 1.239 3.406 1.239ZM23.74 20.5c1.58 0 2.262.96 2.262 2.416v19.85c0 1.177-.991 1.734-2.044 1.734-1.084 0-2.106-.557-2.106-1.734V25.3l-3.035 1.703c-2.075 1.239-3.685-2.106-1.827-3.19l3.964-2.322c.898-.557 1.858-.991 2.787-.991Z'/%3e%3c/svg%3e");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
._login_layer .contents_area .main_login .adult strong {
  color: #ff1818;
}
._login_layer .contents_area dl {
  margin-top: 10px;
}
._login_layer .contents_area dl > dt {
  display: none;
}
._login_layer .contents_area dl > dd {
  position: relative;
}
._login_layer .contents_area dl > dd .input_box {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-right: 28px;
  height: 42px;
  border: 1px solid #D5D7DC;
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box {
  border: 1px solid #464A53;
}
._login_layer .contents_area dl > dd .input_box {
  border-radius: 8px;
  box-sizing: border-box;
  transition: all 0.2s ease-in-out;
}
._login_layer .contents_area dl > dd .input_box input {
  flex: 0 1 auto;
  background: transparent;
  width: 100%;
  height: 100%;
  padding: 0 12px 0 12px;
  border: 0;
  color: #17191C;
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box input {
  color: #E2E4E9;
}
._login_layer .contents_area dl > dd .input_box input {
  font-size: 14px;
}
._login_layer .contents_area dl > dd .input_box input:focus + .reset {
  opacity: 1;
}
._login_layer .contents_area dl > dd .input_box input:not(:-moz-placeholder) + .reset {
  display: inline;
}
._login_layer .contents_area dl > dd .input_box input:not(:placeholder-shown) + .reset {
  display: inline;
}
._login_layer .contents_area dl > dd .input_box input::-moz-placeholder {
  color: #ACB0B9;
}
._login_layer .contents_area dl > dd .input_box input::placeholder {
  color: #ACB0B9;
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box input::-moz-placeholder {
  color: #757B8A;
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box input::placeholder {
  color: #757B8A;
}
._login_layer .contents_area dl > dd .input_box input:-webkit-autofill, ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:hover, ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:focus, ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:active {
  -webkit-text-fill-color: #17191C;
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill, html[dark=true] ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:hover, html[dark=true] ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:focus, html[dark=true] ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:active {
  -webkit-text-fill-color: #E2E4E9;
}
._login_layer .contents_area dl > dd .input_box input:-webkit-autofill, ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:hover, ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:focus, ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #fff inset;
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill, html[dark=true] ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:hover, html[dark=true] ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:focus, html[dark=true] ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #1C1E22 inset;
}
._login_layer .contents_area dl > dd .input_box input::-webkit-caps-lock-indicator {
  display: none;
  visibility: hidden;
}
._login_layer .contents_area dl > dd .input_box input::-webkit-contacts-auto-fill-button {
  border-radius: 7px;
  background-color: #525661;
}
._login_layer .contents_area dl > dd .input_box input::-webkit-credentials-auto-fill-button {
  border-radius: 7px;
  background-color: #525661;
}
._login_layer .contents_area dl > dd .input_box.invalid {
  border: 1px solid rgba(255, 47, 0, 0.5019607843);
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box.invalid {
  border: 1px solid rgba(255, 47, 0, 0.5019607843);
}
._login_layer .contents_area dl > dd .input_box.invalid {
  background: rgba(255, 47, 0, 0.1019607843);
}
._login_layer .contents_area dl > dd .input_box:has(input:focus) {
  border-color: #ACB0B9;
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box:has(input:focus) {
  border-color: #9196A1;
}
._login_layer .contents_area dl > dd .input_box .reset {
  display: none;
  position: absolute;
  top: 50%;
  right: 11px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  text-indent: -9999px;
  opacity: 0;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3e%3ccircle cx='10' cy='10' r='10' fill='%23E2E4E9'/%3e%3cpath fill='%23525661' fill-rule='evenodd' d='M13.925 6.854a.5.5 0 1 0-.708-.708l-3.146 3.147-3.146-3.147a.5.5 0 1 0-.707.708L9.364 10l-3.218 3.217a.5.5 0 1 0 .708.708l3.217-3.218 3.218 3.218a.5.5 0 1 0 .707-.708L10.778 10l3.147-3.146Z' clip-rule='evenodd'/%3e%3c/svg%3e");
}
html[dark=true] ._login_layer .contents_area dl > dd .input_box .reset {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3e%3ccircle cx='10' cy='10' r='10' fill='%23464A53'/%3e%3cpath fill='%23D5D7DC' fill-rule='evenodd' d='M13.925 6.854a.5.5 0 1 0-.708-.708l-3.146 3.147-3.146-3.147a.5.5 0 1 0-.707.708L9.364 10l-3.218 3.217a.5.5 0 1 0 .708.708l3.217-3.218 3.218 3.218a.5.5 0 1 0 .707-.708L10.778 10l3.147-3.146Z' clip-rule='evenodd'/%3e%3c/svg%3e");
}
._login_layer .contents_area dl > dd .input_box .reset {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
._login_layer .contents_area dl > dd .input_box .reset:focus {
  opacity: 1;
}
._login_layer .contents_area dl > dd .error_msg {
  display: block;
  margin-top: 10px;
  color: #EF565F;
  font-size: 12px;
}
._login_layer .contents_area dl > dd .error_msg > strong {
  font-weight: 600;
}
._login_layer .contents_area .bubble_tooltip {
  position: absolute;
  top: 53px;
  left: 0;
  background: #525661;
}
html[dark=true] ._login_layer .contents_area .bubble_tooltip {
  background: #525661;
}
._login_layer .contents_area .bubble_tooltip {
  padding: 7px 10px;
  border-radius: 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  z-index: 1;
}
._login_layer .contents_area .bubble_tooltip:before {
  content: "";
  position: absolute;
  top: -4px;
  left: 8px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' fill='none'%3e%3cpath fill='%23525661' d='m4 0 4 5H0l4-5Z'/%3e%3c/svg%3e");
}
html[dark=true] ._login_layer .contents_area .bubble_tooltip:before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' fill='none'%3e%3cpath fill='%23525661' d='m4 0 4 5H0l4-5Z'/%3e%3c/svg%3e");
}
._login_layer .contents_area .bubble_tooltip:before {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 8px;
  height: 5px;
}
._login_layer .contents_area .bubble_tooltip > p {
  color: #FCFCFD;
  font-size: 13px;
}
._login_layer .contents_area .bubble_tooltip > p strong {
  font-weight: 400;
}
._login_layer .contents_area .login_keep {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
}
._login_layer .contents_area .login_keep .check_box {
  position: relative;
  height: 20px;
  margin-left: 18px;
  text-align: left;
}
._login_layer .contents_area .login_keep .check_box:first-of-type {
  margin-left: 0;
}
._login_layer .contents_area .login_keep .check_box input {
  position: absolute;
  top: 0;
  left: -9999em;
  opacity: 0;
}
._login_layer .contents_area .login_keep .check_box label {
  display: inline-flex;
  align-items: center;
  color: #757B8A;
}
html[dark=true] ._login_layer .contents_area .login_keep .check_box label {
  color: #9196A1;
}
._login_layer .contents_area .login_keep .check_box label {
  font-size: 14px;
}
._login_layer .contents_area .login_keep .check_box label:before {
  content: "";
  display: block;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3e%3crect width='15' height='15' x='2.5' y='2.5' stroke='%23D5D7DC' rx='2.5'/%3e%3c/svg%3e");
}
html[dark=true] ._login_layer .contents_area .login_keep .check_box label:before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3e%3crect width='15' height='15' x='2.5' y='2.5' stroke='%23464A53' rx='2.5'/%3e%3c/svg%3e");
}
._login_layer .contents_area .login_keep .check_box label:before {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 20px;
  height: 20px;
  margin-right: 6px;
}
._login_layer .contents_area .login_keep .check_box input:checked + label:before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3e%3crect width='15' height='15' x='2.5' y='2.5' fill='%230182FF' stroke='%230182FF' rx='2.5'/%3e%3cpath fill='%23fff' fill-rule='evenodd' d='M14.713 6.222c.36.315.385.85.056 1.196L8.502 14l-3.167-2.672a.824.824 0 0 1-.144-1.19A.908.908 0 0 1 6.43 10l1.878 1.692 5.157-5.416a.909.909 0 0 1 1.247-.054Z' clip-rule='evenodd'/%3e%3c/svg%3e");
}
html[dark=true] ._login_layer .contents_area .login_keep .check_box input:checked + label:before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3e%3crect width='15' height='15' x='2.5' y='2.5' fill='%230182FF' stroke='%230182FF' rx='2.5'/%3e%3cpath fill='%23fff' fill-rule='evenodd' d='M14.713 6.222c.36.315.385.85.056 1.196L8.502 14l-3.167-2.672a.824.824 0 0 1-.144-1.19A.908.908 0 0 1 6.43 10l1.878 1.692 5.157-5.416a.909.909 0 0 1 1.247-.054Z' clip-rule='evenodd'/%3e%3c/svg%3e");
}
._login_layer .contents_area .other_login {
  margin-top: 32px;
}
._login_layer .contents_area .other_login .dividing_line {
  display: flex;
  align-items: center;
}
._login_layer .contents_area .other_login .dividing_line:before, ._login_layer .contents_area .other_login .dividing_line:after {
  content: "";
  display: block;
  background-color: rgba(117, 123, 138, 0.2);
}
html[dark=true] ._login_layer .contents_area .other_login .dividing_line:before, html[dark=true] ._login_layer .contents_area .other_login .dividing_line:after {
  background-color: rgba(117, 123, 138, 0.3);
}
._login_layer .contents_area .other_login .dividing_line:before, ._login_layer .contents_area .other_login .dividing_line:after {
  width: 100%;
  height: 1px;
}
._login_layer .contents_area .other_login .dividing_line > span {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  height: 32px;
  margin: 0 16px;
  color: #757B8A;
}
html[dark=true] ._login_layer .contents_area .other_login .dividing_line > span {
  color: #9196A1;
}
._login_layer .contents_area .other_login .dividing_line > span {
  font-size: 14px;
}
._login_layer .contents_area .other_login .other_option {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  height: 36px;
  margin: 14px auto 0;
  padding: 0 3px;
  border-radius: 4px;
  color: #525661;
}
html[dark=true] ._login_layer .contents_area .other_login .other_option {
  color: #525661;
}
._login_layer .contents_area .other_login .other_option {
  font-size: 14px;
  text-decoration: underline;
  text-underline-position: under;
  transition: all 0.2s;
}
._login_layer .contents_area .other_login .other_option:hover {
  background-color: rgba(145, 150, 161, 0.1);
}
html[dark=true] ._login_layer .contents_area .other_login .other_option:hover {
  background-color: rgba(246, 246, 249, 0.1);
}
._login_layer .contents_area .other_login .other_option:active {
  background-color: rgba(23, 25, 28, 0.3);
}
html[dark=true] ._login_layer .contents_area .other_login .other_option:active {
  background-color: rgba(246, 246, 249, 0.3);
}
._login_layer .contents_area .other_login .other_option:disabled {
  background: transparent;
  color: rgba(23, 25, 28, 0.3);
  cursor: default;
}
._login_layer .contents_area .list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px 20px;
  margin: 24px auto 0;
}
._login_layer .contents_area .list > a {
  display: block;
  width: 48px;
  height: 48px;
}
._login_layer .contents_area .list > a img {
  width: 48px;
  height: 48px;
}
._login_layer .contents_area .list + .list {
  margin-top: 14px;
}
._login_layer .contents_area .account_area {
  margin-top: 14px;
}
._login_layer .contents_area .account_area ul {
  display: flex;
  align-items: center;
  justify-content: center;
}
._login_layer .contents_area .account_area ul li {
  display: flex;
  align-items: center;
}
._login_layer .contents_area .account_area ul li:before {
  content: "";
  display: block;
  background: #D5D7DC;
}
html[dark=true] ._login_layer .contents_area .account_area ul li:before {
  background: #464A53;
}
._login_layer .contents_area .account_area ul li:before {
  width: 1px;
  height: 10px;
  margin: 0 12px;
}
._login_layer .contents_area .account_area ul li:first-of-type:before {
  display: none;
}
._login_layer .contents_area .account_area ul li a {
  background: transparent;
  padding: 10px 3px;
  border-radius: 4px;
  color: #525661;
}
html[dark=true] ._login_layer .contents_area .account_area ul li a {
  color: #D5D7DC;
}
._login_layer .contents_area .account_area ul li a {
  font-size: 14px;
  transition: all 0.2s ease-in-out;
  border: none;
}
._login_layer .contents_area .account_area ul li a:hover {
  background-color: rgba(145, 150, 161, 0.1);
}
html[dark=true] ._login_layer .contents_area .account_area ul li a:hover {
  background-color: rgba(246, 246, 249, 0.1);
}
._login_layer .contents_area .account_area ul li a:active {
  background-color: rgba(23, 25, 28, 0.3);
}
html[dark=true] ._login_layer .contents_area .account_area ul li a:active {
  background-color: rgba(246, 246, 249, 0.3);
}
._login_layer .contents_area .account_area ul li a:disabled {
  background: transparent;
  color: rgba(23, 25, 28, 0.3);
  cursor: default;
}
._login_layer .btn_area {
  margin-top: 24px;
}
._login_layer .btn_area .btn_login {
  background: #0182FF;
  width: 100%;
  height: 44px;
  border-radius: 10px;
  color: #FCFCFD;
  font-size: 16px;
  transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
._login_layer .btn_area .btn_login:hover {
  background: #0377e9;
}
._login_layer .btn_area .btn_login:active {
  background: #066dd2;
}
._login_layer .btn_area .btn_login:disabled {
  background-color: #E2E4E9;
}
html[dark=true] ._login_layer .btn_area .btn_login:disabled {
  background-color: #3B3D45;
}
._login_layer .btn_area .btn_login:disabled {
  color: rgba(23, 25, 28, 0.3);
}
html[dark=true] ._login_layer .btn_area .btn_login:disabled {
  color: rgba(246, 246, 249, 0.3);
}
._login_layer .btn_area .btn_login:disabled {
  cursor: default;
}

ul, ol, li {
  list-style: none;
}

.mo-login ._login_layer, .pc-login ._login_layer {
  min-width: 320px;
  max-width: 444px;
  border: none !important;
  box-shadow: none;
  border-radius: 0;
  background: none !important;
}
.mo-login ._login_layer .header > h2, .pc-login ._login_layer .header > h2 {
  width: 150px;
  height: 85px;
}
.mo-login ._login_layer .contents_area, .pc-login ._login_layer .contents_area {
  margin-top: 16px;
}
.mo-login ._login_layer .contents_area .info_message, .pc-login ._login_layer .contents_area .info_message {
  font-size: 18px;
}
.mo-login ._login_layer .contents_area .bubble_tooltip, .pc-login ._login_layer .contents_area .bubble_tooltip {
  top: 59px;
}
.mo-login ._login_layer .contents_area dl > dd .input_box, .pc-login ._login_layer .contents_area dl > dd .input_box {
  height: 50px;
}
.mo-login ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill, .pc-login ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill {
  -webkit-text-fill-color: #17191C;
}
html[dark=true] .mo-login ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill, html[dark=true] .pc-login ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill {
  -webkit-text-fill-color: #E2E4E9;
}
.mo-login ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill, .pc-login ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #fff inset;
}
html[dark=true] .mo-login ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill, html[dark=true] .pc-login ._login_layer .contents_area dl > dd .input_box input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #0C0D0E inset;
}
.mo-login ._login_layer .contents_area .btn_area button, .pc-login ._login_layer .contents_area .btn_area button {
  height: 52px;
  border-radius: 12px;
}

.pc-login ._login_layer {
  margin-top: 56px;
}
.pc-login .close_layer {
  display: none;
}
.pc-login ._login_layer.popup_type {
  margin-top: 48px;
  padding-top: 0;
}
.pc-login ._login_layer.popup_type .header > h2 {
  height: 70px;
}
.pc-login ._login_layer.popup_type .contents_area {
  margin-top: 20px;
}
.pc-login ._login_layer.popup_type .contents_area .info_message {
  font-size: 15px;
}
.pc-login ._login_layer.popup_type .contents_area dl:first-of-type {
  margin-top: 0;
}
.pc-login ._login_layer.popup_type .contents_area dl > dd .input_box {
  height: 42px;
}
.pc-login ._login_layer.popup_type .contents_area .btn_area {
  margin-top: 24px;
}
.pc-login ._login_layer.popup_type .contents_area .btn_area > button {
  height: 44px;
}

.mo-login ._Modal_UI_Wrap .flex_box .modal-container {
  background: rgba(23, 25, 28, 0.2);
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap {
  background: #FCFCFD;
}
html[dark=true] .mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap {
  background: #2F3137;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap {
  width: 310px;
  border-radius: 20px;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .contents {
  padding: 28px;
  text-align: center;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .contents .subtitle {
  color: #17191C;
}
html[dark=true] .mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .contents .subtitle {
  color: #FCFCFD;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .contents .subtitle {
  font-size: 18px;
  font-weight: 600;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .contents p {
  margin-top: 16px;
  color: #525661;
}
html[dark=true] .mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .contents p {
  color: #D5D7DC;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .contents p {
  font-size: 16px;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area {
  display: flex;
  border-top: 1px solid transparent;
  border-color: rgba(117, 123, 138, 0.1);
}
html[dark=true] .mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area {
  border-color: rgba(117, 123, 138, 0.2);
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area button {
  width: 100%;
  height: 60px;
  border-left: 1px solid transparent;
  border-color: rgba(117, 123, 138, 0.1);
}
html[dark=true] .mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area button {
  border-color: rgba(117, 123, 138, 0.2);
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area button {
  color: #17191C;
}
html[dark=true] .mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area button {
  color: #FCFCFD;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area button {
  font-size: 16px;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area button.cancel {
  color: #757B8A;
}
html[dark=true] .mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area button.cancel {
  color: #9196A1;
}
.mo-login ._Modal_UI_Wrap .flex_box .modal-container .contents_wrap .btn_area button:first-of-type {
  border-left: 0;
}

@media screen and (max-width: 443px) {
  .mo-login ._login_layer .contents_area .info_message {
    font-size: 16px;
  }
}
.pop-login ._login_layer {
  border: none !important;
  box-shadow: none;
  border-radius: 0;
  min-width: 380px;
  max-width: 480px;
  padding: 44px 60px 36px;
}
.pop-login ._login_layer .close_layer {
  display: none;
}
.pop-login ._login_layer .contents_area dl:first-of-type {
  margin-top: 0;
}

.studio-login {
  background: #fff;
}
.studio-login ._login_layer {
  border: none !important;
  box-shadow: none;
  border-radius: 0;
  min-width: 380px;
  max-width: 100%;
}

.cs_area {
  display: flex;
  justify-content: space-between;
  width: 654px;
  margin: 48px auto 0;
}
.cs_area .cs_info li {
  position: relative;
  padding-left: 12px;
  font-size: 14px;
  margin-bottom: 4px;
  line-height: 19.6px;
  color: #757B8A;
}
html[dark=true] .cs_area .cs_info li {
  color: #9196A1;
}
.cs_area .cs_info li:before {
  content: "";
  display: block;
  position: absolute;
  top: 7px;
  left: 0;
  width: 3px;
  height: 3px;
  background-color: #757B8A;
}
html[dark=true] .cs_area .cs_info li:before {
  background-color: #9196A1;
}
.cs_area .cs_info li a {
  color: #0182FF;
}
html[dark=true] .cs_area .cs_info li a {
  color: #44A3FF;
}
.cs_area .cs_btn li {
  padding-bottom: 10px;
}
.cs_area .cs_btn li a {
  display: block;
  width: 121px;
  height: 36px;
  text-align: center;
  line-height: 36px;
  font-size: 14px;
  border-radius: 8px;
}
.cs_area .cs_btn li a:hover {
  background-color: rgba(145, 150, 161, 0.1);
}
html[dark=true] .cs_area .cs_btn li a:hover {
  background-color: rgba(246, 246, 249, 0.1);
}
.cs_area .cs_btn li a:active {
  background-color: rgba(23, 25, 28, 0.3);
}
html[dark=true] .cs_area .cs_btn li a:active {
  background-color: rgba(246, 246, 249, 0.3);
}
.cs_area .cs_btn li a.btn01 {
  color: #0182FF;
  border: 1px solid #0182FF;
}
.cs_area .cs_btn li a.btn02 {
  color: #17191C;
}
html[dark=true] .cs_area .cs_btn li a.btn02 {
  color: #E2E4E9;
}
.cs_area .cs_btn li a.btn02 {
  border: 1px solid #D5D7DC;
}
html[dark=true] .cs_area .cs_btn li a.btn02 {
  border: 1px solid #464A53;
}

._login_layer:has(.oauth_area) {
  overflow: visible;
  max-width: 464px;
}
._login_layer:has(.account_connect), ._login_layer:has(.connect_fail) {
  position: fixed;
  inset: 0;
}
._login_layer.popup_type:has(.oauth_area) {
  max-width: unset;
}
._login_layer.popup_type .oauth_area {
  height: calc(100vh - 360px);
}
._login_layer .oauth_area {
  display: flex;
  flex-direction: column;
  max-height: -moz-fit-content;
  max-height: fit-content;
  margin-top: 13px;
  padding: 20px;
  border: 1px solid rgba(117, 123, 138, 0.2);
  border-radius: 12px;
}
._login_layer .oauth_area * {
  line-height: 140%;
}
._login_layer .oauth_area .service_title {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}
._login_layer .oauth_area .service_title .logo {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  margin-right: 8px;
  border: 1px solid #D5D7DC;
  border-radius: 100%;
}
._login_layer .oauth_area .service_title .logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
._login_layer .oauth_area .service_title .logo_default {
  flex: 0 0 auto;
  display: block;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 33 32'%3e%3crect width='32' height='32' x='0.5' fill='%23E8EBED' rx='16'/%3e%3cpath fill='%23525661' fill-rule='evenodd' d='M6.8 16a4.7 4.7 0 0 1 4.7-4.7h2a.7.7 0 1 1 0 1.4h-2a3.3 3.3 0 0 0 0 6.6h2a.7.7 0 1 1 0 1.4h-2A4.7 4.7 0 0 1 6.8 16Zm12-4a.7.7 0 0 1 .7-.7h2a4.7 4.7 0 1 1 0 9.4h-2a.7.7 0 1 1 0-1.4h2a3.3 3.3 0 1 0 0-6.6h-2a.7.7 0 0 1-.7-.7Zm-7 4a.7.7 0 0 1 .7-.7h8a.7.7 0 1 1 0 1.4h-8a.7.7 0 0 1-.7-.7Z' clip-rule='evenodd'/%3e%3c/svg%3e");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 34px;
  height: 34px;
  margin-right: 8px;
  border-radius: 100%;
}
._login_layer .oauth_area .service_title strong {
  color: #17191C;
}
html[dark=true] ._login_layer .oauth_area .service_title strong {
  color: #FCFCFD;
}
._login_layer .oauth_area .service_title strong {
  font-size: 18px;
  font-weight: 600;
}
._login_layer .oauth_area .check_all {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  position: relative;
  background: #F6F6F9;
}
html[dark=true] ._login_layer .oauth_area .check_all {
  background: #2F3137;
}
._login_layer .oauth_area .check_all {
  width: 100%;
  margin-top: 19px;
  padding: 11px 14px;
  border-radius: 12px;
  box-sizing: border-box;
}
._login_layer .oauth_area .check_all input {
  position: absolute;
  left: -9999em;
}
._login_layer .oauth_area .check_all input:checked + label:before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 26 26'%3e%3crect width='20.0417' height='20.0417' x='2.97913' y='2.97852' fill='%230182FF' rx='10.0208'/%3e%3crect width='20.0417' height='20.0417' x='2.97913' y='2.97852' stroke='%230182FF' stroke-width='1.625' rx='10.0208'/%3e%3cpath fill='%23FCFCFD' fill-rule='evenodd' d='M17.333 13A4.335 4.335 0 0 1 13 17.332a4.335 4.335 0 0 1-4.333-4.334A4.335 4.335 0 0 1 13 8.666a4.335 4.335 0 0 1 4.333 4.333Z' clip-rule='evenodd'/%3e%3c/svg%3e");
}
._login_layer .oauth_area .check_all label {
  display: flex;
  align-items: center;
  cursor: pointer;
  color: #17191C;
}
html[dark=true] ._login_layer .oauth_area .check_all label {
  color: #FCFCFD;
}
._login_layer .oauth_area .check_all label::before {
  content: "";
  flex: 0 0 auto;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 26 26'%3e%3crect width='20.0417' height='20.0417' x='2.97925' y='2.97852' stroke='%23E2E4E9' stroke-width='1.625' rx='10.0208'/%3e%3c/svg%3e");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 26px;
  height: 26px;
  margin-right: 8px;
}
._login_layer .oauth_area .check_list_wrap {
  flex: 0 1 auto;
  overflow: auto;
}
._login_layer .oauth_area .check_list_wrap dl {
  margin: 0;
  padding: 14px;
}
._login_layer .oauth_area .check_list_wrap dl dt {
  display: block;
  margin-bottom: 8px;
  color: #ACB0B9;
}
html[dark=true] ._login_layer .oauth_area .check_list_wrap dl dt {
  color: #ACB0B9;
}
._login_layer .oauth_area .check_list_wrap dl dt {
  font-size: 13px;
  font-weight: 500;
}
._login_layer .oauth_area .check_list_wrap dl dd {
  margin-top: 2px;
}
._login_layer .oauth_area .check_list_wrap dl dd:first-child {
  margin-top: 0;
}
._login_layer .oauth_area .check_list_wrap dl .check_box {
  display: flex;
  align-items: center;
  position: relative;
}
._login_layer .oauth_area .check_list_wrap dl .check_box input {
  position: absolute;
  left: -9999em;
}
._login_layer .oauth_area .check_list_wrap dl .check_box input:checked + label:before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 26'%3e%3cpath stroke='%230182FF' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6.994 14.026 3.063 2.957 7.768-8.317'/%3e%3c/svg%3e");
}
._login_layer .oauth_area .check_list_wrap dl .check_box label {
  display: flex;
  color: #525661;
}
html[dark=true] ._login_layer .oauth_area .check_list_wrap dl .check_box label {
  color: #D5D7DC;
}
._login_layer .oauth_area .check_list_wrap dl .check_box label {
  font-size: 13px;
  cursor: pointer;
}
._login_layer .oauth_area .check_list_wrap dl .check_box label::before {
  content: "";
  flex: 0 0 auto;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 26'%3e%3cpath stroke='%23E2E4E9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6.993 14.026 3.064 2.957 7.768-8.317'/%3e%3c/svg%3e");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 24px;
  height: 26px;
  margin-right: 8px;
}
._login_layer .oauth_area .check_list_wrap dl .check_box .option {
  flex: 0 0 auto;
  margin-right: 3px;
}
._login_layer .oauth_area .noti_list {
  flex: 0 0 auto;
  padding: 12px 0 0 0;
  border-top: 1px solid rgba(117, 123, 138, 0.2);
}
._login_layer .oauth_area .noti_list li {
  position: relative;
  margin-top: 4px;
  padding-left: 18px;
  color: #525661;
}
html[dark=true] ._login_layer .oauth_area .noti_list li {
  color: #D5D7DC;
}
._login_layer .oauth_area .noti_list li {
  font-size: 12px;
}
._login_layer .oauth_area .noti_list li::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 7px;
  background: #525661;
  width: 3px;
  height: 3px;
  border-radius: 100%;
}
._login_layer .oauth_area .noti_list li:first-child {
  margin-top: 0;
}
._login_layer .fixed_area {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}
._login_layer .fixed_area button {
  background: #0182FF;
  width: 100%;
  height: 60px;
  color: #FCFCFD;
  font-size: 18px;
  font-weight: 500;
}
._login_layer:has(.fixed_area) {
  margin-bottom: 60px;
  padding-bottom: 40px;
}

.mo-login ._login_layer:has(.oauth_area) {
  padding: 40px 0 0 0;
}
.mo-login ._login_layer:has(.oauth_area) .contents_area .oauth_area {
  padding: 0 16px 84px 16px;
}
.mo-login ._login_layer:has(.oauth_area) .btn_area {
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  background: #FCFCFD;
}
html[dark=true] .mo-login ._login_layer:has(.oauth_area) .btn_area {
  background: #17191C;
}
.mo-login ._login_layer:has(.oauth_area) .btn_area {
  margin-top: 0;
  padding: 16px;
  box-shadow: 4px 0px 24px 0px rgba(0, 0, 0, 0.2);
  z-index: 50;
}
.mo-login ._login_layer .oauth_area {
  overflow: auto;
  padding: 21px 0 0 0;
  border: 0;
}
.mo-login ._login_layer .oauth_area .service_title {
  flex: 1;
  padding-top: 20px;
  border-top: 1px solid rgba(117, 123, 138, 0.2);
}
.mo-login ._login_layer .oauth_area .check_list_wrap {
  overflow: visible;
}

.nexon_connect {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  inset: 0;
  background: url("/images/account/nexon_connect_bg.png") 0 0/cover no-repeat;
}
.nexon_connect .conts {
  position: relative;
  background: url("/images/account/nexon_connect_conts.png") 50% 50%/100% 100% no-repeat;
  width: 480px;
  height: 590px;
  font-size: 0;
}
.nexon_connect .conts button {
  position: absolute;
  bottom: 24px;
  left: 50%;
  width: 440px;
  height: 52px;
  transform: translateX(-50%);
  font-size: 0;
}

html[dark=true] .nexon_connect {
  background-image: url("/images/account/nexon_connect_dark_bg.png");
}
html[dark=true] .nexon_connect .conts {
  background-image: url("/images/account/nexon_connect_dark_conts.png");
}

.account_connect {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.account_connect h2 {
  color: #17191C;
}
html[dark=true] .account_connect h2 {
  color: #E2E4E9;
}
.account_connect h2 {
  font-size: 24px;
  line-height: 140%;
  text-align: center;
}
.account_connect .account_connected {
  display: flex;
  justify-content: center;
  gap: 0 50px;
  position: relative;
  margin-top: 20px;
  padding: 28px 0;
  line-height: 1.4;
}
.account_connect .account_connected:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='50' height='51' fill='none'%3e%3cpath stroke='%23525661' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M11.905 25.5A8.19 8.19 0 0 1 10 20.25c0-4.53 3.705-8.25 8.25-8.25h7.5c4.53 0 8.25 3.72 8.25 8.25 0 4.53-3.705 8.25-8.25 8.25H22'/%3e%3cpath stroke='%23525661' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M38.095 25.5A8.19 8.19 0 0 1 40 30.75c0 4.53-3.705 8.25-8.25 8.25h-7.5C19.72 39 16 35.28 16 30.75c0-4.53 3.705-8.25 8.25-8.25H28'/%3e%3c/svg%3e");
}
html[dark=true] .account_connect .account_connected:before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='50' height='51' fill='none'%3e%3cpath stroke='%23D5D7DC' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M11.905 25.5A8.19 8.19 0 0 1 10 20.25c0-4.53 3.705-8.25 8.25-8.25h7.5c4.53 0 8.25 3.72 8.25 8.25 0 4.53-3.705 8.25-8.25 8.25H22'/%3e%3cpath stroke='%23D5D7DC' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M38.095 25.5A8.19 8.19 0 0 1 40 30.75c0 4.53-3.705 8.25-8.25 8.25h-7.5C19.72 39 16 35.28 16 30.75c0-4.53 3.705-8.25 8.25-8.25H28'/%3e%3c/svg%3e");
}
.account_connect .account_connected:before {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 50px;
  height: 50px;
  transform: translate(-50%, -50%);
}
.account_connect .account_connected .info_box {
  width: 140px;
}
.account_connect .account_connected .info_box .symbol {
  display: block;
  width: 90px;
  height: 90px;
  margin: 0 auto;
  border-width: 1px;
  border-style: solid;
  border-color: #D5D7DC;
}
html[dark=true] .account_connect .account_connected .info_box .symbol {
  border-color: #464A53;
}
.account_connect .account_connected .info_box .symbol {
  border-radius: 20px;
  font-size: 0;
}
.account_connect .account_connected .info_box .symbol.soopkr {
  background-image: url(/images/svg/symbol_kr.svg);
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 66px 38px;
  background-color: #17191C;
}
.account_connect .account_connected .info_box .symbol.nexon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 54 54'%3e%3cpath fill='%2300a1df' d='M0 28.938V46.92l23.88-12.703z'/%3e%3cpath fill='%23002b49' d='M23.88 0 0 12.694v16.244l23.88 5.28z'/%3e%3cpath fill='%23c4d600' d='M23.88 34.219 0 46.922l29.617 6.562 23.875-12.69z'/%3e%3c/svg%3e");
}
html[dark=true] .account_connect .account_connected .info_box .symbol.nexon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 54 54'%3e%3cpath fill='%2300a1df' d='M0 28.938V46.92l23.88-12.703z'/%3e%3cpath fill='%23002b49' d='M23.88 0 0 12.694v16.244l23.88 5.28z'/%3e%3cpath fill='%23c4d600' d='M23.88 34.219 0 46.922l29.617 6.562 23.875-12.69z'/%3e%3c/svg%3e");
}
.account_connect .account_connected .info_box .symbol.nexon {
  background-position: calc(50% + 4px) 50%;
  background-repeat: no-repeat;
  background-size: 54px 54px;
  background-color: #F1F2F4;
}
html[dark=true] .account_connect .account_connected .info_box .symbol.nexon {
  background-color: #17191C;
}
.account_connect .account_connected .info_box .account {
  margin-top: 10px;
  padding: 0 8px;
  text-align: center;
}
.account_connect .account_connected .info_box .account > strong {
  display: block;
  color: #17191C;
}
html[dark=true] .account_connect .account_connected .info_box .account > strong {
  color: #E2E4E9;
}
.account_connect .account_connected .info_box .account > strong {
  font-size: 18px;
  font-weight: 500 !important;
  word-break: break-all;
}
.account_connect .account_connected .info_box .account > span {
  color: #ACB0B9;
}
html[dark=true] .account_connect .account_connected .info_box .account > span {
  color: #757B8A;
}
.account_connect .account_connected .info_box .account > span {
  font-size: 14px;
  word-break: break-all;
}
.account_connect .account_connected .info_box.global .symbol {
  background-image: url(/images/svg/symbol_global.svg);
}
.account_connect .account_notice {
  margin-top: auto;
  padding: 16px 20px 24px;
  border-top: 1px solid transparent;
  border-color: rgba(117, 123, 138, 0.1);
}
html[dark=true] .account_connect .account_notice {
  border-color: rgba(117, 123, 138, 0.1);
}
.account_connect .account_notice {
  color: #525661;
}
html[dark=true] .account_connect .account_notice {
  color: #D5D7DC;
}
.account_connect .account_notice {
  font-size: 14px;
  line-height: 140%;
}
.account_connect .account_notice li {
  margin-top: 8px;
}
.account_connect .account_notice li:first-of-type {
  margin-top: 0;
}
.account_connect .connect_fail {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  text-align: center;
}
.account_connect .connect_fail::before {
  content: "";
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 64 64'%3e%3crect width='61' height='61' x='1.5' y='1.5' stroke='%23e2e4e9' stroke-width='3' rx='30.5'/%3e%3cpath stroke='%23e2e4e9' stroke-linecap='round' stroke-linejoin='round' stroke-width='4.26667' d='M32 33.233V21.334m0 21.248v.085'/%3e%3c/svg%3e");
}
html[dark=true] .account_connect .connect_fail::before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 64 64'%3e%3crect width='61' height='61' x='1.5' y='1.5' stroke='%23464A53' stroke-width='3' rx='30.5'/%3e%3cpath stroke='%23464A53' stroke-linecap='round' stroke-linejoin='round' stroke-width='4.26667' d='M32 33.233V21.334m0 21.248v.085'/%3e%3c/svg%3e");
}
.account_connect .connect_fail::before {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 64px;
  height: 64px;
  margin-bottom: 20px;
}
.account_connect .connect_fail strong {
  color: #17191C;
}
html[dark=true] .account_connect .connect_fail strong {
  color: #E2E4E9;
}
.account_connect .connect_fail strong {
  font-size: 24px;
  font-weight: 600;
}
.account_connect .connect_fail span {
  display: block;
  margin-top: 8px;
  color: #757B8A;
}
html[dark=true] .account_connect .connect_fail span {
  color: #9196A1;
}
.account_connect .connect_fail span {
  font-size: 15px;
  line-height: 140%;
}
.account_connect .connect_fail + .btn_area {
  margin-top: auto;
}
.account_connect .btn_area button {
  width: 100%;
  height: 52px;
  border-radius: 12px;
  font-size: 16px;
}
.account_connect .btn_area button._btn_primary {
  background: #0182FF;
  color: #FCFCFD;
}
.account_connect .btn_area button.tertiary {
  background: #E2E4E9;
}
html[dark=true] .account_connect .btn_area button.tertiary {
  background: #3B3D45;
}
.account_connect .btn_area button.tertiary {
  color: #17191C;
}
html[dark=true] .account_connect .btn_area button.tertiary {
  color: #E2E4E9;
}
.account_connect .loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 37 37'%3e%3cpath stroke='%230182ff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M33.053 28.223A17.447 17.447 0 0 0 36 18.5C36 8.835 28.165 1 18.5 1S1 8.835 1 18.5 8.835 36 18.5 36'/%3e%3c/svg%3e") 50% 50% no-repeat;
  background-size: 100% 100%;
  width: 37px;
  height: 37px;
  margin: -18.5px 0 0 -19px;
  animation: rotating 1s linear infinite;
}
@keyframes rotating {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.mo-login ._login_layer .nexon_connect {
  background-image: url("/images/account/nexon_connect_bg_m.png");
}
.mo-login ._login_layer .nexon_connect .conts {
  position: relative;
  background: url("/images/account/nexon_connect_conts_m.png") 50% 100%/contain no-repeat;
  width: 100%;
  height: 100%;
  max-width: 393px;
  max-height: 790px;
  font-size: 0;
}
.mo-login ._login_layer .nexon_connect .conts button {
  position: absolute;
  bottom: 14px;
  width: 100%;
  height: 40px;
  font-size: 0;
}
.mo-login .account_connect .btn_area {
  margin-top: 16px;
}
.mo-login .account_connect .btn_area button {
  background: #17191C;
  height: 44px;
  color: #FFF;
  font-size: 15px;
}/*# sourceMappingURL=soop-login.css.map */