@charset "UTF-8";
/* Copyright (c) NHN Entertainment. All rights reserved.
AUTHORS NHN SOFT : UI Team */
/* //////////////////////////////////
Font Face
////////////////////////////////// */
@font-face {
    font-family: "notoSansKr";
    src: url("../fonts/noto-sans-kr-light.eot");
    src: url("../fonts/noto-sans-kr-light.eot?#iefix") format("embedded-opentype"), url("../fonts/noto-sans-kr-light.woff") format("woff"), url("../fonts/noto-sans-kr-light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "notoSansKr";
    src: url("../fonts/noto-sans-kr-regular.eot");
    src: url("../fonts/noto-sans-kr-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/noto-sans-kr-regular.woff") format("woff"), url("../fonts/noto-sans-kr-regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "notoSansKr";
    src: url("../fonts/noto-sans-kr-bold.eot");
    src: url("../fonts/noto-sans-kr-bold.eot?#iefix") format("embedded-opentype"), url("../fonts/noto-sans-kr-bold.woff") format("woff"), url("../fonts/noto-sans-kr-bold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
}

* {
    margin: 0;
    padding: 0;
}

html,
body {
    height: 100%;
}

body {
    min-width:280px;
    min-height: 100%;
    font-family: "notoSansKr", "-apple-system", "Apple SD Gothic Neo", "Roboto", "Helvetica Neue", "Malgun Gothic", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.88);
    letter-spacing: -.025em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, textarea, p, blockquote, th, td, input, select, textarea, button {
    margin: 0;
    padding: 0;
    letter-spacing: -.025em;
    word-break: keep-all;
}

article,
aside,
dialog,
header,
section,
footer,
nav,
figure,
main {
    display: block;
}

dl, ul, ol, li, dt, dd, menu {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after {
    content: '';
    content: none;
}

q:before, q:after {
    content: '';
    content: none;
}

fieldset, img {
    border: 0 none;
    vertical-align: top;
}

address, caption, cite, code, dfn, em, var {
    font-style: normal;
    font-weight: normal;
}

table {
    border: 0;
    border-collapse: collapse;
    border-spacing: 0;
    vertical-align: top;
}

th, td, input, select, textarea, button {
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0;
    color: #333;
}

a {
    font-size: 14px;
    font-weight: 400;
    color: #333;
    line-height: 1.5;
    text-decoration: none;
}

a:focus, a:hover, a:active {
    text-decoration: none;
}

button {
    cursor: pointer;
    overflow: visible;
    margin: 0;
    padding: 0;
    border: 0 none;
    background: none;
    vertical-align: top;
}

button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

button:disabled {
    cursor: default;
}

input,
button,
select,
textarea {
    border-radius: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    vertical-align: middle;
}

select:-ms-expand {
    display: none;
}

input {
    /* input type number 에서 화살표 제거 */
}

input[type='text'], input[type='password'], input[type='email'], input[type='tel'], input[type='number'] {
    outline: 0;
    display: block;
    font-size: 16px;
    font-weight: 600;
    font-family: "notoSansKr", "-apple-system", "Apple SD Gothic Neo", "Roboto", "Helvetica Neue", "Malgun Gothic", sans-serif;
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

input[type='checkbox'] {
    -webkit-appearance: checkbox;
}

input[type='number'] {
    -moz-appearance: textfield;
}

input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

input[type='password']:-ms-reveal, input[type='password']:-ms-clear {
    display: none;
}

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
    -webkit-box-shadow: inset 0 0 0 0px red;
    box-shadow: inset 0 0 0 0px #fff;
    border: 1px solid transparent;
    -webkit-appearance: none;
    /* safari */
    -moz-appearance: none;
    appearance: none;
    -webkit-text-fill-color: #333;
    -webkit-transition: background-color 5000s ease-in-out 0s;
    transition: background-color 5000s ease-in-out 0s;
}

::-ms-clear {
    display: none;
}

::-ms-reveal {
    display: none;
}

label {
    cursor: pointer;
}

::-webkit-input-placeholder,
:-moz-placeholder,
::-moz-placeholder,
:-ms-input-placeholder {
    font-weight: 400;
    color: rgba(0, 0, 0, 0.32);
}

iframe {
    background: transparent;
}

caption,
legend,
.blind,
.inp_file input[type="file"] {
    clip: rect(0, 0, 0, 0);
    overflow: hidden;
    position: absolute;
    margin: -1px;
    width: 1px;
    height: 1px;
    font-size: 1px;
    white-space: nowrap;
    line-height: 0;
}

.skipnav {
    height: 0;
}

.skipnav a {
    display: block;
    position: absolute;
    left: 0;
    top: -100px;
    width: 100%;
    height: 25px;
    text-align: center;
}

.skipnav a:focus,
.skipnav a:active {
    position: absolute;
    top: 0;
    z-index: 100;
    padding: 10px 0;
    font-weight: bold;
    color: #fff;
    font-size: 20px;
    text-decoration: none;
    background: black;
}

.mask {
    display: none;
    z-index: 100;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=64)";
    /*IE8*/
    filter: alpha(opacity=64);
    /*IE7*/
    opacity: .64;
    /*all*/
}

.mask.type2 {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=12)";
  /*IE8*/
  filter: alpha(opacity=12);
  /*IE7*/
  opacity: .12;
  /*all*/
}

.mask.type3{
    z-index:110;
}

.text_align_left {
    text-align: left;
}

.text_align_right {
    text-align: right;
}

.text_align_center {
    text-align: center;
}

.text_weight_light {
    font-weight: 300;
}

.text_weight_dlight {
    font-weight: 400;
}

.text_weight_meidum {
    font-weight: 500;
}

.text_weight_bold {
    font-weight: 600;
}

/* @ 해당 SCSS 파일 설명
  한게임 - 회원 공통 ui.css 파일로
  한게임 회원은 모바일 디자인을 기준으로 pc, 런처(한스타터2)의 로그인 영역을 다 사용합니다.
  접속 기기별에 따른 클래스는 wrap 클래스를 추가합니다.
  (접속 기기별에 따른 재정의는 맨 하단을 기준으로 작성)
*/
[class^="btn_type"] {
    display: inline-block;
    position: relative;
    margin: 0;
    padding: 8px 0;
    min-height: 36px;
    text-align: center;
    line-height: 0;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

[class^="btn_type"] .btn_text {
    display: block;
    position: relative;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.32);
    line-height: 1.43;
    vertical-align: baseline;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    [class^="btn_type"] .btn_text {
        color: #adadad;
    }
}

[class^="btn_"] {
    white-space: nowrap;
}

[class^="btn_"] .btn_text {
    word-break: keep-all;
}

[class^="btn_"].disabled{
    background: rgba(0, 0, 0, 0.12);
}

@media \0screen\,screen\9 {
    [class^="btn_"].disabled {
        background: #e4e4e4;
    }
}

[class^="btn_"].disabled .btn_text {
    color: #fff;
}

.btn_wrap {
    margin-top: 24px;
}

.btn_wrap.col_full [class^="btn_"] {
    width: 100%;
}

.btn_wrap.col_full + .btn_wrap.align_right{
    margin-top:24px;
}

.btn_wrap.col_type2 .btn_type2 {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 14px;
    width: 156px;
    vertical-align: middle;
}

.btn_wrap.col_type2 .btn_type2:first-child {
    margin-left: 0;
}

.btn_wrap.col_type2 .btn_type2 .btn_text {
    text-align: center;
}

.btn_wrap.align_right {
    text-align: right;
}

.btn_type2 {
    padding: 16px 0;
    height: 56px;
}

.btn_type2 .btn_text {
    padding: 0 16px;
    font-size: 16px;
    line-height: 1.28;
}

.btn_type2.btn_style_2 {
    padding-top: 18px;
}

.btn_type2.btn_style_2 .btn_text {
    font-size: 14px;
}

.btn_type3 .btn_text {
    padding-left: 28px;
}

.btn_type3 .btn_text:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    background: url("../img/common/ico_btn_arrow.svg") no-repeat 0 0;
}

@media \0screen\,screen\9 {
    .btn_type3 .btn_text {
        background: url("../img/common/ico_btn_arrow.png") no-repeat left 0;
    }
}

.btn_type3.btn_style_3 .btn_text:before {
    background: url("../img/common/ico_btn_arrow2.svg") no-repeat 0 0;
}

@media \0screen\,screen\9 {
    .btn_type3.btn_style_3 .btn_text {
        background: url("../img/common/ico_btn_arrow2.png") no-repeat 0 0;
    }
}

.btn_type4 {
    padding-top: 10px !important;
    height: 40px;
}

.btn_type4 .btn_text {
    font-size: 14px;
    font-weight: 600;
}

.btn_type5 {
    padding: 10px 0;
}

.btn_type5 .btn_text {
    padding: 0 24px;
    line-height: 20px;
}

.btn_type6 {
    min-height: 0;
    padding: 4px 0 6px;
}

.btn_type6 .btn_text {
    padding: 0 12px;
    line-height: 20px;
}

.btn_type_inner {
    display: block;
    position: absolute;
    top: 10px;
    right: 10px;
    font-family: 'notoSansKr';
    border-radius: 4px;
    color: #121212;
    background: #FF6F00;
    z-index: 99;
}

.btn_type_inner .btn_text {
    padding: 0 12px;
    color: #fff;
    font-size: 14px;
    line-height: 20px;
}

.btn_type_inner:hover {
    background: #FF7B14;
}

.btn_type_inner:active {
    background: #FF8629;
}

@media \0screen\,screen\9 {
    .btn_type_inner .btn_text {
        color: #fff;
    }
}

.btn_type_inner.disabled, .btn_type_inner:disabled {
    background: #e0e0e0;
}

.btn_lock {
    padding: 8px 0 8px 11px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.12);
}

.btn_lock:hover {
    background: rgba(0, 0, 0, 0.04);
}

.btn_lock:active {
    background: rgba(0, 0, 0, 0.08);
}

@media \0screen\,screen\9 {
    .btn_lock {
        border: 1px solid #e4e4e4;
    }

    .btn_lock:hover {
        background: #f5f5f5;
    }

    .btn_lock:active {
        background: #ebebeb;
    }
}

.btn_lock .btn_text {
    position: relative;
    display: inline-block;
    padding-left: 28px;
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.72);
    background: url("../img/common/ico_lock_open.svg") no-repeat left top;
    background-size: 20px auto;
}

@media \0screen\,screen\9 {
    .btn_lock .btn_text {
        color: #4a4a4a;
        background: url("../img/common/ico_lock_open.png") no-repeat left top;
    }
}

.btn_style_1 {
    position: relative;
    background: #fff;
}

.btn_style_1:hover {
    background: rgba(0, 0, 0, 0.04);
}

.btn_style_1:hover {
    background: rgba(0, 0, 0, 0.08);
}

.btn_style_1.disabled {
    background: #fff;
}

.btn_style_1.disabled:before {
    border: 1px solid rgba(0, 0, 0, 0.12);
}

.btn_style_1.disabled .btn_text {
    color: #ebebeb;
}

.btn_style_1:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid #adadad;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.btn_style_1 .btn_text {
    color: rgba(0, 0, 0, 0.72);
}

@media \0screen\,screen\9 {
    .btn_style_1:hover {
        background: #f5f5f5;
    }

    .btn_style_1:hover {
        background: #ebebeb;
    }

    .btn_style_1 .btn_text {
        color: #4a4a4a;
    }
}

.btn_style_2 {
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.72);
    background-color: #fff;
}

.btn_style_2:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

.btn_style_2:active {
    background-color: rgba(0, 0, 0, 0.08);
}

.btn_style_2.disabled {
    border: 1px solid rgba(0, 0, 0, 0.12);
    background-color: #fff;
}

.btn_style_2.disabled .btn_text {
    color: rgba(0, 0, 0, 0.12)
}

@media \0screen\,screen\9 {
    .btn_style_2 {
        border: 1px solid #4a4a4a;
    }

    .btn_style_2:hover {
        background-color: #f5f5f5;
    }

    .btn_style_2:active {
        background-color: #ebebeb;
    }
}

.btn_style_2 .btn_text {
    color: #121212;
}

@media \0screen\,screen\9 {
    .btn_style_2 .btn_text {
        color: #121212;
    }
}

.btn_style_3 {
    border-radius: 4px;
    color: #121212;
    background: #FF6F00;
}

.btn_style_3:hover {
    background: #FF7B14;
}

.btn_style_3:active {
    background: #FF8629;
}

.btn_style_3 .btn_text {
    color: #fff;
    line-height: 1.5;
}

@media \0screen\,screen\9 {
    .btn_style_3 .btn_text {
        color: #fff;
    }
}

.btn_style_3.disabled, .btn_style_3:disabled {
    background: #e0e0e0;
}

.btn_style_4 {
    border-radius: 4px;
    background: #FF3B30;
}

.btn_style_4 .btn_text {
    color: #fff;
}

@media \0screen\,screen\9 {
    .btn_style_4 .btn_text {
        color: #fff;
    }
}

.btn_style_5 {
    border-radius: 4px;
    background: #ffbd00;
}

.btn_style_5 .btn_text {
    color: #fff;
}

@media \0screen\,screen\9 {
    .btn_style_5 .btn_text {
        color: #fff;
    }
}

.btn_style_6 .btn_text {
    color: #FF6F00 !important;
}

.btn_style_7 {
    border: 1px solid rgba(0, 0, 0, 0.32);
    border-radius: 4px;
    background-color: #fff;
}

.btn_style_7:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

.btn_style_7:active {
    background-color: rgba(0, 0, 0, 0.04);
}

@media \0screen\,screen\9 {
    .btn_style_7 {
        border: 1px solid #adadad;
    }

    .btn_style_7:hover {
        background-color: #f5f5f5;
    }

    .btn_style_7:active {
        background-color: #ebebeb;
    }
}

.btn_style_7 .btn_text {
    font-weight: 400;
    color: rgba(0, 0, 0, 0.72);
}

@media \0screen\,screen\9 {
    .btn_style_7 .btn_text {
        color: #4a4a4a;
    }
}

.btn_style_8 {
    position: relative;
    color: #fff !important;
}

.btn_style_8:hover {
    background: rgba(0, 0, 0, 0.04);
}

.btn_style_8:active {
    background: rgba(0, 0, 0, 0.08);
}

.btn_style_8.disabled {
    background: #fff;
}

.btn_style_8.disabled:before {
    border: 1px solid rgba(0, 0, 0, 0.12);
}

.btn_style_8.disabled .btn_text {
    color: rgba(0, 0, 0, 0.12);
}

@media \0screen\,screen\9 {
    .btn_style_8:hover {
        background: #f5f5f5;
    }

    .btn_style_8:active {
        background: #ebebeb;
    }
}

.btn_style_8:before {
    content: '';
    z-index: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid #9e9e9e;
    border: 1px solid #9e9e9e;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.btn_style_8 .btn_text {
    color: #9e9e9e;
    color: #9e9e9e \0/IE89;
}

.btn_style_9 {
    position: relative;
    color: #fff !important;
}

.btn_style_9[class^="btn_type"] {
    min-height: 40px;
    padding: 10px 0;
}

.btn_style_9:hover {
    background: rgba(0, 0, 0, 0.04);
}

.btn_style_9:active {
    background: rgba(0, 0, 0, 0.08);
}

.btn_style_9.disabled {
    background: #fff;
}

.btn_style_9.disabled:before {
    border: 1px solid rgba(0, 0, 0, 0.12);
}

.btn_style_9.disabled .btn_text {
    color: rgba(0, 0, 0, 0.12);
}

@media \0screen\,screen\9 {
    .btn_style_9:hover {
        background: #f5f5f5;
    }

    .btn_style_9:active {
        background: #ebebeb;
    }
}

.btn_style_9:before {
    content: '';
    z-index: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.38);
    border: 1px solid #9e9e9e;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.btn_style_9 .btn_text {
    font-family: 'notoSansKr', sans-serif;
    color: rgba(0, 0, 0, 0.38);
    color: #9e9e9e \0/IE89;

}

.btn_type7 {
  padding: 10px 0;
}

.btn_type7 .btn_text {
  padding: 0 16px;
  line-height: 20px;
}

.btn_type7.btn_style_8 .btn_text{
  color: #9e9e9e
}

.btn_style_check {
    border-radius: 4px;
    background: #FF6F00;
}

.btn_style_check .btn_text {
    display: inline-block;
    position: relative;
    padding-left: 36px;
    color: #fff !important;
}

.btn_style_check .btn_text:before {
    content: '';
    position: absolute;
    top: 0;
    left: 12px;
    width: 20px;
    height: 20px;
    background: url("../img/common/ico_check_xs.svg") no-repeat left top/100% auto;
    background: url("../img/common/ico_check_xs.png") no-repeat left top \0/IE89;
}

.btn_login {
    display: table;
    *display: block;
    padding: 0 16px;
    width: 100%;
    height: 56px;
    border-radius: 4px;
    color: #fff;
    text-align: center;
    background: #FF6F00;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.btn_login:hover {
    background: #FF7B14;
}

.btn_login:active {
    background: #FF8629;
}

.btn_login.disabled {
    background: #ebebeb;
}

.btn_login.login_ing {
    position: relative;
}

.btn_login.login_ing .icon_unit_wrap {
    position: absolute;
    display: inline-block;
    top: 26px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 63px;
    height: 6px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.btn_login.login_ing .icon_unit_wrap i {
    display: block;
    position: absolute;
    left: 0;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #fff;
}

.btn_login.login_ing .icon_unit_wrap i.icon_unit1 {
    left: 0;
    -webkit-animation: 1.25s linear 0s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0s infinite normal none aniFnLoding_dot;
}

.btn_login.login_ing .icon_unit_wrap i.icon_unit2 {
    left: 19px;
    -webkit-animation: 1.25s linear 0.125s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0.125s infinite normal none aniFnLoding_dot;
}

.btn_login.login_ing .icon_unit_wrap i.icon_unit3 {
    left: 38px;
    -webkit-animation: 1.25s linear 0.25s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0.25s infinite normal none aniFnLoding_dot;
}

.btn_login.login_ing .icon_unit_wrap i.icon_unit4 {
    left: 57px;
    -webkit-animation: 1.25s linear 0.375s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0.375s infinite normal none aniFnLoding_dot;
}

@-webkit-keyframes aniFnLoding_dot {
    0% {
        background: rgba(255, 255, 255, 0.2);
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: cubic-bezier(1, 0, 0.7, 1);
        animation-timing-function: cubic-bezier(1, 0, 0.7, 1);
    }
    40% {
        background: white;
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
        -webkit-animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
        animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
    }
    72.5% {
        background: rgba(255, 255, 255, 0.4);
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
    }
    100% {
        background: rgba(255, 255, 255, 0.2);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes aniFnLoding_dot {
    0% {
        background: rgba(255, 255, 255, 0.2);
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: cubic-bezier(1, 0, 0.7, 1);
        animation-timing-function: cubic-bezier(1, 0, 0.7, 1);
    }
    40% {
        background: white;
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
        -webkit-animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
        animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
    }
    72.5% {
        background: rgba(255, 255, 255, 0.4);
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
    }
    100% {
        background: rgba(255, 255, 255, 0.2);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.btn_login .btn_text {
    display: table-cell;
    width: 100%;
    height: 100%;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    vertical-align: middle;
}

.btn_login .btn_text:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    padding-left: 20px;
    background-color: red;
}

.btn_oauth {
    display: inline-block;
    width: 100%;
    height: 48px;
    border: 1px solid rgba(0, 0, 0, 0.32);
    border-radius: 4px;
    text-align: center;
    background: #fff;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    .btn_oauth {
        border: 1px solid #adadad;
    }
}

.btn_oauth.payco {
    background: url("../img/logo/logo_payco_v3.svg") no-repeat center center;
    background-size: 32px auto;
}

@media \0screen\,screen\9 {
    .btn_oauth.payco {
        background: url("../img/logo/logo_payco_v3.png") no-repeat center center;
    }
}

.btn_oauth.naver {
    background: url("../img/logo/logo_naver.svg") no-repeat center center;
    background-size: 32px auto;
}

@media \0screen\,screen\9 {
    .btn_oauth.naver {
        background: url("../img/logo/logo_naver.png") no-repeat center center;
    }
}

.btn_oauth.google {
    background: url("../img/logo/logo_google.png") no-repeat center center;
    background-size: 32px auto;
}

@media \0screen\,screen\9 {
    .btn_oauth.google {
        background: url("../img/logo/logo_google.png") no-repeat center center;
    }
}

.btn_oauth.facebook {
    background: url("../img/logo/logo_facebook.svg") no-repeat center center;
    background-size: 32px auto;
}

@media \0screen\,screen\9 {
    .btn_oauth.facebook {
        background: url("../img/logo/logo_facebook.png") no-repeat center center;
    }
}

.btn_oauth.appleid {
    background: url("../img/logo/logo_apple_v2.svg") no-repeat center center;
    background-size: 32px auto;
}

@media \0screen\,screen\9 {
    .btn_oauth.appleid {
        background: url("../img/logo/logo_apple_v2.png") no-repeat center center;
    }
}

.btn_ip_toggle {
    display: inline-block;
    margin-left: 4px;
    width: 36px;
    height: 20px;
    background: url("../img/common/bg_login_ip_off.svg") no-repeat 0 0;
    background-size: 36px auto;
}

@media \0screen\,screen\9 {
    .btn_ip_toggle {
        background: url("../img/common/bg_login_ip_off.png") no-repeat 0 0;
    }
}

.btn_ip_toggle.is-active {
    background: url("../img/common/bg_login_ip_on.svg") no-repeat 0 0;
    background-size: 36px auto;
}

@media \0screen\,screen\9 {
    .btn_ip_toggle.is-active {
        background: url("../img/common/bg_login_ip_on.png") no-repeat 0 0;
    }
}

.btn_link {
    display: inline-block;
    position: relative;
    padding: 4px 0 4px 27px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.32);
    background: url("../img/common/ico_link_arrow.svg") no-repeat left center;
    background-size: 20px auto;
}

@media \0screen\,screen\9 {
    .btn_link {
        color: #adadad;
        background: url("../img/common/ico_link_arrow.png") no-repeat left center;
    }
}

.btn_link2 {
    display: inline-block;
    position: relative;
    padding: 4px 8px 4px 27px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.32);
    background: url("../img/common/ico_btn_arrow.svg") no-repeat left center/20px;
}

@media \0screen\,screen\9 {
    .btn_link2 {
        color: #adadad;
        background: url("../img/common/ico_btn_arrow.png") no-repeat left center;
    }
}

.btn_more {
    display: inline-block;
    width: 48px;
    height: 48px;
    background: url("../img/common/ico_content_more.svg") no-repeat center;
}

@media \0screen\,screen\9 {
    .btn_more {
        background: url("../img/common/ico_content_more.png") no-repeat center;
    }
}

.btn_confirm {
    padding-left: 9px;
    border-radius: 4px;
    background: #FF6F00;
}

.btn_confirm:hover {
    background: #FF7B14;
}

.btn_confirm:active {
    background: #FF8629;
}

.btn_confirm.disabled {
    background: rgba(0, 0, 0, 0.12);
}

.btn_confirm .btn_text {
    padding-left: 29px;
    color: #fff !important;
    background: url("../img/common/ico_complete2.svg") no-repeat left center/24px;
    background: url("../img/common/ico_complete2.png") no-repeat left center\0/IE8;
}

.btn_download {
    display: inline-block;
    position: relative;
    padding: 4px 0 4px 27px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.32);
}

@media \0screen\,screen\9 {
    .btn_download {
        color: #adadad;
    }
}

.btn_download:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -11px;
    width: 20px;
    height: 20px;
    background: url("../img/common/ico_download2.svg") no-repeat left center;
    background-size: 20px auto;
    background: url("../img/common/ico_download2.png") no-repeat left center\0/IE8;
}

.btn_refresh {
    display: inline-block;
    position: relative;
    padding: 4px 0 4px 27px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.32);
}

@media \0screen\,screen\9 {
    .btn_refresh {
        color: #adadad;
    }
}

.btn_refresh:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -9px;
    width: 20px;
    height: 20px;
    background: url("../img/common/ico_reset2.svg") no-repeat left center;
    background-size: 20px auto;
}

@media \0screen\,screen\9 {
    .btn_refresh:before {
        background: url("../img/common/ico_reset2.png") no-repeat left center;
    }
}

.inp_wrap {
    position: relative;
}

.inp_wrap + .inp_wrap {
    margin-top: 16px;
}

.inp_wrap .btn_inp_edit {
    z-index: 3;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    display: block;
    position: absolute;
    top: 15px;
    right: 12px;
    width: 24px;
    height: 24px;
}

@media \0screen\,screen\9 {
    .inp_wrap .btn_inp_edit {
        display: none;
    }
}

.inp_wrap .btn_inp_edit.type_open {
    background: url("../img/common/ico_input_open.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .inp_wrap .btn_inp_edit.type_open {
        background: url("../img/common/ico_input_open.png") no-repeat 0 0;
    }
}

.inp_wrap .btn_inp_edit.type_close {
    background: url("../img/common/ico_input_close.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .inp_wrap .btn_inp_edit.type_close {
        background: url("../img/common/ico_input_close.png") no-repeat 0 0;
    }
}

.inp_wrap .btn_inp_edit.type_clear {
    background: url("../img/common/ico_input_delete.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .inp_wrap .btn_inp_edit.type_clear {
        background: url("../img/common/ico_input_delete.png") no-repeat 0 0;
    }
}

.inp_wrap .btn_inp_edit.type_ok {
    background: url("../img/common/ico_input_ok.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .inp_wrap .btn_inp_edit.type_ok {
        background: url("../img/common/ico_input_ok.png") no-repeat 0 0;
    }
}

.inp_wrap .btn_inp_edit.is-active {
    opacity: 1;
}

.inp_wrap.type_numcode {
    position: relative;
}

.inp_wrap.type_numcode .inp_box {
    padding-right: 75px;
}

.inp_wrap.type_numcode .inp_box input {
    font-weight: 600;
}

.inp_wrap.type_numcode .btn_type {
    position: absolute;
    top: 10px;
    right: 10px;
}

.inp_label {
    z-index: 1;
    display: table;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0 16px;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 328px) {
    .inp_label {
        font-size: 13px;
    }
}

.inp_label:before {
    content: '';
    display: block;
    z-index: -1;
    opacity: 0;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 8px;
}

.inp_label .lable_text {
    display: table-cell;
    color: rgba(0, 0, 0, 0.32);
    text-align: left;
    white-space: nowrap;
    vertical-align: middle;
}

.inp_label .lable_text.text_style2 {
    color: rgba(0, 0, 0, 0.38);
}

@media \0screen\,screen\9 {
    .inp_label .lable_text {
        height: 56px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .inp_label .lable_text {
        height: 56px;
    }
}

@media \0screen\,screen\9 {
    .inp_label .lable_text {
        color: #adadad;
    }
}

.inp_timer {
    position: absolute;
    top: 18px;
    right: 10px;
    font-size: 0;
}
.inp_timer:before {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../img/common/ico_timer.svg") no-repeat 0 0;
    background-size: 20px auto;
    vertical-align: middle;
    content: '';
}

@media \0screen\,screen\9 {
    .inp_timer:before {
        background: url("../img/common/ico_timer.png") no-repeat 0 0;
    }
}

.inp_timer em {
    display: inline-block;
    margin-left: 5px;
    font-size: 14px;
    vertical-align: middle;
    text-align: right;
    line-height: 20px;
    color: #FF3B30;
}

.inp_box {
    z-index: 2;
    position: relative;
    display: block;
    margin-top: 8px;
    padding: 1px 40px 1px 16px;
    width: 100%;
    height: 56px;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1;
    background: #fff;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media all and (min-width: 0\0) and (min-resolution: 0.001dpcm) {
    .inp_box {
        padding-right: 16px;
    }
}

@media \0screen\,screen\9 {
    .inp_box {
        padding: 19px 16px 19px;
        height: auto;
    }
}

.inp_box .inp_element {
    opacity: 0;
}

.inp_box + .inp_validation {
    color: rgba(0, 0, 0, 0.32);
}

@media \0screen\,screen\9 {
    .inp_box + .inp_validation {
        color: #adadad;
    }
}

.inp_box input:-webkit-autofill, .inp_box input:-webkit-autofill:hover, .inp_box input:-webkit-autofill:focus, .inp_box input:-webkit-autofill:active {
    -webkit-box-shadow: inset 0 0 0 0px red;
    box-shadow: inset 0 0 0 0px #fff;
    border: 1px solid transparent;
    -webkit-appearance: none;
    /* safari */
    -moz-appearance: none;
    appearance: none;
    -webkit-text-fill-color: #333;
    -webkit-transition: background-color 5000s ease-in-out 0s;
    transition: background-color 5000s ease-in-out 0s;
}

.inp_box:before {
    content: '';
    z-index: -1;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid #adadad;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.inp_box.is-active:before, .inp_box:hover:before {
    border: 2px solid #121212;
}

.inp_box.type_error:before, .inp_box.type_error:hover:before {
    border: 2px solid #FF3B30;
}

.inp_box.is-active .inp_label {
    display: block;
    top: -8px;
    left: 11px;
    padding: 0 5px;
    width: auto;
    height: 16px;
    line-height: 1;
    background-color: transparent;
}

.inp_box.is-active .inp_label:before {
    opacity: 1;
    background: #fff;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.inp_box.is-active .inp_label .lable_text {
    height: 16px\0/IE8;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.72);
}

@media \0screen\,screen\9 {
    .inp_box.is-active .inp_label .lable_text {
        color: #4a4a4a;
    }
}

.inp_box.is-active + .inp_validation {
    color: rgba(0, 0, 0, 0.72);
}

@media \0screen\,screen\9 {
    .inp_box.is-active + .inp_validation {
        color: #4a4a4a;
    }
}

.inp_box.is-active .inp_element {
    opacity: 1;
}

.inp_box.is-complete:before {
    border: 1px solid #121212;
}

.inp_box.is-complete .inp_label {
    display: block;
    top: -8px;
    left: 11px;
    padding: 0 5px;
    width: auto;
    height: 16px;
    font-size: 12px;
    line-height: 1;
    background-color: transparent;
}

.inp_box.is-complete .inp_label:before {
    opacity: 1;
    background: #fff;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.inp_box.is-complete .inp_label .lable_text {
    height: 16px\0/IE8;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.72);
}

@media \0screen\,screen\9 {
    .inp_box.is-complete .inp_label .lable_text {
        color: #4a4a4a;
    }
}

.inp_box.is-complete + .inp_validation {
    color: rgba(0, 0, 0, 0.72);
}

@media \0screen\,screen\9 {
    .inp_box.is-complete + .inp_validation {
        color: #4a4a4a;
    }
}

.inp_box.is-complete .inp_element {
    opacity: 1;
}

.inp_box.type_error:before {
    border-color: #FF3B30;
}

.inp_box.type_error .inp_label .lable_text,
.inp_box.type_error + .inp_validation {
    color: #FF3B30 !important;
}

.inp_box.type_disabled {
    background: #f5f5f5;
}

.inp_box.type_disabled:before {
    border-color: rgba(0, 0, 0, 0.12);
}

@media \0screen\,screen\9 {
    .inp_box.type_disabled:before {
        border-color: #e4e4e4;
    }
}

.inp_box.type_disabled .inp_label {
    display: none !important;
}

.inp_box.type_disabled .inp_text {
    color: rgba(0, 0, 0, 0.32);
}

@media \0screen\,screen\9 {
    .inp_box.type_disabled .inp_text {
        border-color: #adadad;
    }
}

.inp_box.type_disabled input {
    opacity: 1;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.38) !important;
}

.inp_box.type_disabled input.inp_style2 {
    color: rgba(0, 0, 0, 0.12) !important;
}

@media \0screen\,screen\9 {
    .inp_box.type_disabled input {
        color: #adadad !important;
    }
}

.inp_box.type_disabled + .inp_validation {
    color: rgba(0, 0, 0, 0.32);
}

@media \0screen\,screen\9 {
    .inp_box.type_disabled + .inp_validation {
        color: #adadad;
    }
}

.inp_box.type_disabled .btn_inp_edit {
    display: none !important;
}

.inp_box.inp_certification{
    display: none;
}

.inp_validation {
    margin-top: 4px;
    padding: 0 16px;
    font-size: 12px;
    line-height: 1.33;
    vertical-align: baseline;
}

.inp_file {
    z-index: 0;
    display: block;
    position: relative;
    padding: 0 70px 0 16px;
    width: 100%;
    height: 56px;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1;
    background: #fff;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.inp_file:before {
    content: '';
    z-index: -1;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.72);
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    .inp_file:before {
        border: 1px solid #4a4a4a;
    }
}

@media \0screen\,screen\9 {
    .inp_file_name {
        padding-top: 16px;
        height: 40px;
    }
}

.inp_file .label_file {
    z-index: 5;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 56px;
    height: 56px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.72);
    background: url("../img/common/ico_arrow_dropdown.svg") no-repeat center;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    .inp_file .label_file {
        border: 1px solid #4a4a4a;
        background: url("../img/common/ico_arrow_dropdown.png") no-repeat center;
    }
}

div.inp_check {
    position: relative;
}

div.inp_check input[type="checkbox"] {
    z-index: 1;
    opacity: 0;
    clip: rect(0, 0, 0, 0);
    margin: -1px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
}

div.inp_check label {
    display: inline-block;
    position: relative;
    padding: 2px 0 0 28px;
    min-height: 24px;
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.72);
    line-height: 1.4;
    background: url("../img/common/bg_checkbox.svg") no-repeat 0 0/24px auto;
}

@media \0screen\,screen\9 {
    div.inp_check label {
        color: #4a4a4a;
        background: url("../img/common/bg_checkbox.png") no-repeat 0 0;
    }
}

div.inp_check label .inp_subtxt {
    display: inline-block;
    margin-left: 4px;
    font-size: inherit;
    color: inherit;
}

div.inp_check.is-checked label {
    color: rgba(0, 0, 0, 0.72);
    background: url("../img/common/bg_checkbox_on.svg") no-repeat 0 0/24px auto;
}

@media \0screen\,screen\9 {
    div.inp_check.is-checked label {
        color: #4a4a4a;
        background: url("../img/common/bg_checkbox_on.png") no-repeat 0 0;
    }
}

.inp_check2 input[type="checkbox"]:checked + label {
    background: url("../img/common/bg_checkbox2_on.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .inp_check2 input[type="checkbox"]:checked + label {
        background: url("../img/common/bg_checkbox2_on.png") no-repeat 0 0;
    }
}

.inp_check.type_2{
    margin-top: 16px;
}

div.inp_check.type_2 label {
    padding: 0 0 0 32px;
}

div.inp_check.type_2 .inp_text {
    display: inline-block;
    line-height: 20px;
    word-break: break-all;
}
div.inp_check.type_2 .inp_text em {
    font-weight: 700;
}

div.inp_check.radio label {
    display: inline-block;
    position: relative;
    padding: 0 0 0 22px;
    min-height: 22px;
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.72);
    line-height: 1.4;
    background: url("../img/common/bg_checkbox_rounded.svg") no-repeat 0 0/22px auto;
}

@media \0screen\,screen\9 {
    div.inp_check.radio label {
        color: #4a4a4a;
        background: url("../img/common/bg_checkbox_rounded.png") no-repeat 0 0;
    }
}

div.inp_check.radio.is-checked label {
    color: rgba(0, 0, 0, 0.72);
    background: url("../img/common/bg_checkbox_rounded_on.svg") no-repeat 0 0/22px auto;
}

@media \0screen\,screen\9 {
    div.inp_check.radio.is-checked label {
        color: #4a4a4a;
        background: url("../img/common/bg_checkbox_rounded_on.png") no-repeat 0 0;
    }
}

.title_guide {
    position: relative;
    padding-left: 32px;
    font-size: 14px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.32);
    line-height: 1.43;
    vertical-align: baseline;
}

@media \0screen\,screen\9 {
    .title_guide {
        color: #adadad;
    }
}

.title_guide:before {
    content: '';
    display: block;
    position: absolute;
    top: -1px;
    left: 0;
    width: 24px;
    height: 24px;
    background: url("../img/common/ico_question.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .title_guide:before {
        background: url("../img/common/ico_question.png") no-repeat center;
    }
}

/* //////////////////////////////////
login
////////////////////////////////// */
.login_wrap {
    position: relative;
    margin: 0 auto;
    max-width: 328px;
    width: 100%;
}

@media screen and (min-width: 994px) {
    .login_wrap.finish {
        float: none;
        margin: 0 auto;
    }
}

.login_logo {
    display: block;
    width: 140px;
    height: 20px;
    background: url("../img/logo/logo_login_hangame.svg") no-repeat 0 0;
    background-size: 140px auto;
}

@media \0screen\,screen\9 {
    .login_logo {
        background: url("../img/logo/logo_login_hangame.png") no-repeat 0 0;
    }
}

.login_container {
    margin-top: 34px;
}

.login_state {
    margin-top: 34px;
    margin-bottom: 16px;
}

.login_state + .login_form {
    margin-top: 24px;
}

.login_state + .login_form.captcha_main {
    margin-top: 16px;
}

.login_state + .login_result_wrap {
    margin-top: 24px;
}

.login_state + .login_bottom_menu {
    position: relative;
    margin-top: 24px;
    padding-top: 24px;
}

.login_state + .login_bottom_menu:before {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    width: 100%;
    height: 1px;
    background: rgba(0, 0, 0, 0.12);
}

.login_bottom_menu.type_no_line {
    padding: 0;
}
.login_bottom_menu.type_no_line:before {
    display: none;
}

@media \0screen\,screen\9 {
    .login_state + .login_bottom_menu:before {
        border-color: #e4e4e4;
    }
}

.login_state .state_alert {
    position: relative;
    padding: 15px 16px 15px 48px;
    width: 100%;
    border-radius: 4px;
    font-size: 14px;
    color: #242424;
    line-height: 1.43;
    text-align: left;
    border: 1px solid transparent;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.login_state .state_alert:before {
    content: '';
    display: block;
    position: absolute;
    top: 14px;
    left: 16px;
    width: 24px;
    height: 24px;
}

.login_state .state_alert .state_text_type_2 {
    color: #FA2828;
}

.login_state .state_alert .state_text_type_2 button {
    display: inline-block;
    position: relative;
    color: inherit;
    vertical-align: top;
    font-weight: 900;
}

.login_state .state_alert .state_text_type_2 button::before {
    display: inline-block;
    position: absolute;
    bottom: 2px;
    width: 100%;
    border-bottom: 1px solid #FA2828;
    content: '';
}

.login_state .state_alert.attention {
    border-color: #ffbd00;
    background-color: rgba(255, 189, 0, 0.2);
}

@media \0screen\,screen\9 {
    .login_state .state_alert.attention {
        background-color: #fff2d5;
    }
}

.login_state .state_alert.attention:before {
    background: url("../img/common/ico_attention.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .state_alert.attention:before {
        background: url("../img/common/ico_attention.png") no-repeat 0 0;
    }
}

.login_state .state_alert.error {
    border-color: rgba(255, 53, 41, 0.6);
    background: rgba(255, 53, 41, 0.08);
}

@media \0screen\,screen\9 {
    .login_state .state_alert.error {
        border-color: #ff9391;
        background-color: #ffefee;
    }
}

.login_state .state_alert.error:before {
    background: url("../img/common/ico_error.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .state_alert.error:before {
        background: url("../img/common/ico_error.png") no-repeat 0 0;
    }
}

.login_state .state_alert.fail {
    border-color: rgba(255, 53, 41, 0.6);
    background: rgba(255, 53, 41, 0.08);
}

@media \0screen\,screen\9 {
    .login_state .state_alert.fail {
        border-color: #ff9391;
        background-color: #ffefee;
    }
}

.login_state .state_alert.fail:before {
    background: url("../img/common/ico_fail.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .state_alert.fail:before {
        background: url("../img/common/ico_fail.png") no-repeat 0 0;
    }
}

.login_state .state_alert.sucess {
    border-color: #30d158;
    background-color: rgba(52, 199, 89, 0.16);
}

@media \0screen\,screen\9 {
    .login_state .state_alert.sucess {
        background-color: #def6e5;
    }
}

.login_state .state_alert.sucess:before {
    background: url("../img/common/ico_sucess.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .state_alert.sucess:before {
        background: url("../img/common/ico_sucess.png") no-repeat 0 0;
    }
}

.login_state .state_alert.info {
    border-color: #0a84ff;
    background-color: rgba(0, 122, 255, 0.08);
}

@media \0screen\,screen\9 {
    .login_state .state_alert.info {
        background-color: #ecf5ff;
    }
}

.login_state .state_alert.info:before {
    background: url("../img/common/ico_info.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .state_alert.info:before {
        background: url("../img/common/ico_info.png") no-repeat 0 0;
    }
}

.login_state .state_emphasis {
    position: relative;
    padding: 0 16px;
}

.login_state .state_emphasis + * {
    margin-top: 24px;
}

.login_state .state_emphasis .btn_wrap {
    margin: 24px -16px 0;
}

.login_state .state_emphasis .btn_wrap .btn_text {
    font-size: 14px;
    line-height: 1.71;
}

.login_state .emphasis_type {
    z-index: 0;
    display: block;
    overflow: hidden;
    position: relative;
    margin: 0 -13px;
}

.login_state .emphasis_type:before {
    content: '';
    display: block;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #474747 no-repeat center;
}

.login_state .emphasis_type:after {
    content: '';
    z-index: -1;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -2px;
    right: 0;
    width: 100%;
    height: 4px;
    background: rgba(0, 0, 0, 0.72);
}

@media \0screen\,screen\9 {
    .login_state .emphasis_type:after {
        background: #4a4a4a;
    }
}

.login_state .emphasis_type.attention:before {
    background-image: url("../img/common/ico_attention.svg");
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .emphasis_type.attention:before {
        background-image: url("../img/common/ico_attention.png");
    }
}

.login_state .emphasis_type.error:before {
    background-image: url("../img/common/ico_error.svg");
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .emphasis_type.error:before {
        background-image: url("../img/common/ico_error.png");
    }
}

.login_state .emphasis_type.fail:before {
    background-image: url("../img/common/ico_fail.svg");
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .emphasis_type.fail:before {
        background-image: url("../img/common/ico_fail.png");
    }
}

.login_state .emphasis_type.sucess:before {
    background-image: url("../img/common/ico_sucess.svg");
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .emphasis_type.sucess:before {
        background-image: url("../img/common/ico_sucess.png");
    }
}

.login_state .emphasis_type.info:before {
    background-image: url("../img/common/ico_info.svg");
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_state .emphasis_type.info:before {
        background-image: url("../img/common/ico_info.png");
    }
}

.login_state .emphasis_type.ellipsis {
    position: relative;
}

.login_state .emphasis_type.ellipsis:before {
    z-index: 0;
    background-color: #FF6F00;
    background-image: url("../img/common/ico_ellipsis.svg");
    background-size: auto auto;
}

@media \0screen\,screen\9 {
    .login_state .emphasis_type.ellipsis:before {
        background-image: url("../img/common/ico_ellipsis.png");
    }
}

.login_state .emphasis_type.ellipsis:after {
    display: none;
}

.login_state .emphasis_type.checking {
    position: relative;
}

.login_state .emphasis_type.checking:before {
    z-index: 0;
    background: #FF6F00;
}

.login_state .emphasis_type.checking:after {
    display: none;
}

.login_state .emphasis_type.checking + .emphasis_desc {
    margin-top: 16px;
    margin-bottom: 12px;
    font-size: 14px !important;
}

.login_state .emphasis_type.checking .icon_unit_wrap {
    position: absolute;
    display: inline-block;
    top: 21px;
    margin: 0 9px;
    width: 30px;
    height: 6px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.login_state .emphasis_type.checking .icon_unit_wrap i {
    display: block;
    position: absolute;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
}

.login_state .emphasis_type.checking .icon_unit_wrap i.icon_unit1 {
    -webkit-animation: 1.25s linear 0s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0s infinite normal none aniFnLoding_dot;
}

.login_state .emphasis_type.checking .icon_unit_wrap i.icon_unit2 {
    left: 12px;
    -webkit-animation: 1.25s linear 0.125s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0.125s infinite normal none aniFnLoding_dot;
}

.login_state .emphasis_type.checking .icon_unit_wrap i.icon_unit3 {
    left: 24px;
    -webkit-animation: 1.25s linear 0.25s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0.25s infinite normal none aniFnLoding_dot;
}

@keyframes aniFnLoding_dot {
    0% {
        background: rgba(255, 255, 255, 0.2);
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: cubic-bezier(1, 0, 0.7, 1);
        animation-timing-function: cubic-bezier(1, 0, 0.7, 1);
    }
    40% {
        background: white;
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
        -webkit-animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
        animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
    }
    72.5% {
        background: rgba(255, 255, 255, 0.4);
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
    }
    100% {
        background: rgba(255, 255, 255, 0.2);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.login_state .emphasis_desc {
    margin-top: 9px;
    font-size: 14px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.88);
    line-height: 1.43;
}

@media \0screen\,screen\9 {
    .login_state .emphasis_desc {
        color: #1f1f1f;
    }
}

@media screen and (max-width: 328px) {
    .login_state .emphasis_desc br {
        display: inline;
    }
}

.login_state .emphasis_desc.type2 {
    font-size: 16px !important;
}

@media screen and (min-width: 280px) and (max-width: 319px) {
    .login_state .emphasis_desc.type2 {
        font-size: 5.4vw !important;
    }
}

.login_state .emphasis_detail {
    margin-top: 9px;
    line-height: 1.43;
}

@media screen and (max-width: 360px) {
    .login_state .emphasis_paragraph .split_word {
        display: none;
    }
}

@media screen and (min-width: 361px) {
    .login_state .emphasis_paragraph .split_word {
        display: block;
    }
}

.login_state .btn_wrap .btn_type2 {
    display: block;
}

.contents_header{
    margin-bottom:24px;
}

.certi_cont{
    background:rgba(0, 0, 0, 0.04);
}


.certi_cont .certi_guide{
    position:relative;
    padding:20px 24px 20px 118px;
    text-align: left;
}

.certi_cont .certi_guide:before{
    content:'';
    position:absolute;
    top:25px;
    left:32px;
    width:50px;
    height:50px;
    background:url(../img/logo/logo_passapp.svg) no-repeat;
}

.certi_cont .certi_guide .certi_desc{
    line-height:20px;
}

.certi_cont dl{
    padding:16px;
    line-height:20px;
}
.certi_cont dl dt,dd{
    display:inline-block;
}

.qr_wrap{
    margin-top:24px;
}
.qr_wrap .qr_guide{
    position:relative;
    padding:0 0 0 87px;
    height:72px;
    text-align: left;
}
.qr_wrap .qr_guide .qr_desc{
    padding-top:16px;
    line-height:20px;
}
.qr_wrap .qr_barcode{
    position:absolute;
    top: 50%;
    lefT:0;
    margin-top:-36px;
    width:75px;
    height: 72px;
}

.login_security {
    position: absolute;
    top: 0;
    right: 0;
}

.login_security * {
    vertical-align: top;
}

.login_security .security_title {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    color: #FF6F00;
}

.login_form .inp_box input {
    color: #121212;
}

.login_form.login_main .inp_text {
    font-weight: 600;
}

.login_button {
    margin-top: 16px;
}

.login_helper {
    margin-top: 26px;
}

.login_helper .btn_wrap .btn_type2 {
    display: block;
}

.login_helper .helper_utill {
    text-align: center;
}

.login_helper .helper_list {
    overflow: hidden;
}

.login_helper .helper_list li {
    position: relative;
    display: inline-block;
    margin-left: 25px;
    line-height: 1;
    text-align: center;
}

@media screen and (max-width: 328px) {
    .login_helper .helper_list li {
        margin-left: 6.94vw;
    }
}

.login_helper .helper_list li:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: -17px;
    margin-top: -6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.12);
}

@media \0screen\,screen\9 {
    .login_helper .helper_list li:before {
        background: #e4e4e4;
    }
}

@media screen and (max-width: 328px) {
    .login_helper .helper_list li:before {
        left: -4.722222222222222vw;
    }
}

.login_helper .helper_list li:first-child {
    margin-left: 0;
}

.login_helper .helper_list li:first-child:before {
    display: none;
}

.login_helper .helper_menu {
    display: inline-block;
    padding: 8px;
    height: 36px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.32);
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    letter-spacing: 0;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    .login_helper .helper_menu {
        color: #adadad;
    }
}

@media screen and (min-width: 280px) and (max-width: 360px) {
    .login_helper .helper_menu {
        padding: 8px 4px;
        font-size: 13px;
    }
}

.login_oauth {
    margin-top: 18px;
    padding-bottom: 32px;
}

.login_oauth .oauth_top,
.login_helper .oauth_top {
    z-index: 0;
    position: relative;
    text-align: center;
}

.login_oauth .oauth_top:before, .login_oauth .oauth_top:after,
.login_helper .oauth_top:before, .login_helper .oauth_top:after {
    content: '';
    z-index: -1;
    display: block;
    position: absolute;
    top: 50%;
    overflow: hidden;
    width: 38.88vw;
    max-width: 140px;
    height: 1px;
    background: rgba(0, 0, 0, 0.12);
}

@media \0screen\,screen\9 {
    .login_oauth .oauth_top:before, .login_oauth .oauth_top:after,
    .login_helper .oauth_top:before, .login_helper .oauth_top:after {
        width: 38.88%;
        background: #e4e4e4;
    }
}

.login_oauth .oauth_top:before,
.login_helper .oauth_top:before {
    left: 0;
}

.login_oauth .oauth_top:after,
.login_helper .oauth_top:after {
    right: 0;
}

.login_oauth .oauth_text,
.login_helper .oauth_text {
    display: inline-block;
    padding: 0 14px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.32);
    line-height: 1;
    vertical-align: baseline;
}

@media \0screen\,screen\9 {
    .login_oauth .oauth_text {
        color: #adadad;
    }
}

.login_oauth .oauth_menu {
    overflow: hidden;
    margin: 7px auto 0;
    text-align: center;
}

.login_oauth .oauth_list {
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%;
    font-size: 0;
    text-align: left;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.login_oauth .oauth_list li {
    display: inline-block;
}

.login_oauth .oauth_list li + li {
    margin-left: 17px;
    height: 52px;
}

@media screen and (max-width: 359px) {
    .login_oauth .oauth_list li + li {
        margin-left: 2vw;
    }
}

@media screen and (max-width: 327px) {
    .login_oauth .oauth_list li + li {
        margin-left: 5.5vw;
    }
}

.login_oauth .oauth_list li:first-child {
    margin-left: 0;
}

.login_oauth .oauth_list li .btn_oauth {
    width: 52px;
    height: 52px;
    background-color: #fff;
}

@media screen and (max-width: 327px) {
    .login_oauth .oauth_list li .btn_oauth {
        width: 13.33vw;
    }
}

@media screen and (min-width: 280px) and (max-width: 319px) {
    .login_oauth .oauth_list li .btn_oauth {
        width: 14.33vw;
    }
}

.login_option {
    position: relative;
    margin-top: 16px;
}

.login_option .inp_check input + label .inp_text {
    color: rgba(0, 0, 0, 0.32);
    color: #adadad\0/IE8;
}

.login_option .inp_check input + label .inp_text .inp_subtxt {
    font-weight: 400;
    color: rgba(0, 0, 0, 0.32);
    color: #adadad\0/IE8;
}

.login_option .inp_check input:checked + label .inp_text {
    color: #FF6F00;
}

.login_option .inp_check input:checked + label .inp_text .inp_subtxt {
    color: rgba(0, 0, 0, 0.32);
    color: #adadad\0/IE8;
}

.login_option .tooltip_wrap {
    z-index: 10;
    display: none;
    position: absolute;
    bottom: 34px;
    left: 0;
}

.login_option:hover .tooltip_wrap {
    display: block;
}

.login_result_wrap .log_list_wrap {
    overflow: hidden;
    border-top: 2px solid rgba(0, 0, 0, 0.72);
    border-top: 2px solid #4a4a4a \0/IE8;
}

.login_result_wrap .log_list_line {
    overflow: hidden;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-top: 1px solid #e4e4e4 \0/IE8;
    line-height: 0;
}

.login_result_wrap .log_list_head {
    display: table;
    width: 100%;
    min-height: 54px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.login_result_wrap .log_list_title, .login_result_wrap .log_list_desc {
    display: table-cell;
    font-weight: 400;
    vertical-align: middle;
    line-height: 1.4;
    word-break: keep-all;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.login_result_wrap .log_list_title {
    padding-left: 16px;
    width: 41%;
}

.login_result_wrap .log_list_title > strong {
    font-weight: inherit;
}

@media screen and (max-width: 328px) {
    .login_result_wrap .log_list_title {
        padding-left: 6px;
    }
    .login_result_wrap .log_list_title > strong {
        letter-spacing: -0.05em;
    }
}

.login_result_wrap .log_list_desc {
    position: relative;
    padding-right: 16px;
    width: 59%;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 328px) {
    .login_result_wrap .log_list_desc {
        padding-right: 8px;
    }
}

.login_result_wrap .log_list_desc .txt_desc {
    display: block;
    text-align: right;
    font-size: 14px;
    font-weight: 600;
    color: #FF6F00;
}

.login_result_wrap .log_list_desc .btn_more {
    position: absolute;
    top: 4px;
    right: 0;
}

.login_result_wrap .log_list_detail {
    overflow: hidden;
    position: relative;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.login_result_wrap .log_list_detail:before {
    content: '';
    display: block;
    position: absolute;
    bottom: 1px;
    left: 0;
    width: 100%;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid #e4e4e4 \0/IE8;
}

.login_result_wrap .log_list_detail .limit_description {
    padding: 16px;
    font-size: 14px;
    line-height: 1.43;
    color: rgba(0, 0, 0, 0.72);
    color: #4a4a4a\0/IE8;
}

.login_result_wrap .log_list_detail .log_detail_wrap {
    display: none;
    height: 0;
}

.login_result_wrap .log_list_detail .log_detail_wrap.is-active {
    display: block;
    height: auto;
}

.login_result_wrap .log_detail_box {
    display: table;
    padding: 0 16px;
    width: 100%;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 328px) {
    .login_result_wrap .log_detail_box {
        padding: 0 8px;
    }
}

.login_result_wrap .log_detail_box:first-child {
    border-top: 0;
}

.login_result_wrap .log_detail_box:nth-child(odd) {
    background: rgba(0, 0, 0, 0.04);
}

.login_result_wrap .log_detail_left, .login_result_wrap .log_detail_right {
    display: table-cell;
    padding: 14px 0;
    min-height: 48px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.72);
    vertical-align: top;
    line-height: 1.43;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    .login_result_wrap .log_detail_left, .login_result_wrap .log_detail_right {
        color: #4a4a4a;
    }
}

.login_result_wrap .log_detail_left {
    text-align: left;
}

.login_result_wrap .log_detail_right {
    text-align: right;
}

.login_result_wrap .login_designation {
    margin-top: 32px;
    padding: 0 16px;
}

@media screen and (min-width: 280px) and (max-width: 319px) {
    .login_result_wrap .login_designation {
        padding: 0;
    }
}

.login_result_wrap .login_designation .designation_desc + .btn_wrap {
    margin-top: 8px;
}

.login_bottom_menu {
    margin-top: 24px;
}

.login_bottom_menu .login_quick_nav li {
    text-align: right;
}

.login_bottom_menu .login_quick_nav li + li {
    margin-top: 10px;
}

.api_captcha_wrap .captcha_wrap {
    overflow: hidden;
    position: relative;
    margin: 0 0 16px;
    padding-right: 48px;
    width: 100%;
    height: 96px;
    border: 1px solid rgba(0, 0, 0, 0.72);
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    .api_captcha_wrap .captcha_wrap {
        border: 1px solid #4a4a4a;
    }
}

.api_captcha_wrap .captcha_body {
    position: relative;
    height: 100%;
    background: rgba(0, 0, 0, 0.04);
}

@media \0screen\,screen\9 {
    .api_captcha_wrap .captcha_body {
        background: #f5f5f5;
    }
}

.api_captcha_wrap .captcha_msg {
    display: table;
    overflow: hidden;
    position: relative;
    padding: 12px 90px 10px 16px;
    width: 100%;
    height: 100%;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.api_captcha_wrap .captcha_msg .msg_text {
    display: table-cell;
    position: relative;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.72);
    line-height: 1.43;
    text-align: left;
    vertical-align: middle;
    word-break: keep-all;
}

@media \0screen\,screen\9 {
    .api_captcha_wrap .captcha_msg .msg_text {
        color: #4a4a4a;
    }
}

.api_captcha_wrap .captcha_msg .img_captcha {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.api_captcha_wrap .captcha_msg .img_captcha > img {
    display: block;
    width: 100%;
    height: 100%;
}

.api_captcha_wrap .captcha_msg .captcha_icon {
    z-index: 5;
    display: block;
    position: absolute;
    top: 24px;
    right: 24px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
}

.api_captcha_wrap .captcha_msg .captcha_icon .sound_bg1, .api_captcha_wrap .captcha_msg .captcha_icon .sound_bg2 {
    opacity: 0;
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    -webkit-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: rgba(255, 111, 0, 0.12);
    background: transparent\9;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .api_captcha_wrap .captcha_msg .captcha_icon .sound_bg1, .api_captcha_wrap .captcha_msg .captcha_icon .sound_bg2 {
        background: rgba(255, 111, 0, 0.12);
    }
}

.api_captcha_wrap .captcha_msg .captcha_icon .sound_ico {
    z-index: 5;
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #FF6F00 url("../img/common/ico_captcha_mic.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .api_captcha_wrap .captcha_msg .captcha_icon .sound_ico {
        background: #FF6F00 url("../img/common/ico_captcha_mic.png") no-repeat center;
    }
}

.api_captcha_wrap .captcha_msg .captcha_icon .sound_bg2 {
    width: 64px;
    height: 64px;
    -webkit-animation: v-bounceStretchDelay 2s 1s infinite ease-in-out;
    animation: v-bounceStretchDelay 2s 1s infinite ease-in-out;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.api_captcha_wrap .captcha_msg .captcha_icon .sound_bg1 {
    width: 80px;
    height: 80px;
    -webkit-animation: v-bounceStretchDelay 2s 0s infinite ease-in-out;
    animation: v-bounceStretchDelay 2s 0s infinite ease-in-out;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes v-bounceStretchDelay {
    0%,
    100% {
        -webkit-transform: translate(-50%, -50%) scale(0);
        transform: translate(-50%, -50%) scale(0);
    }
    40% {
        opacity: 1;
        -webkit-transform: translate(-50%, -50%) scale(1);
        transform: translate(-50%, -50%) scale(1);
    }
}

@keyframes v-bounceStretchDelay {
    0%,
    100% {
        -webkit-transform: translate(-50%, -50%) scale(0);
        transform: translate(-50%, -50%) scale(0);
    }
    40% {
        opacity: 1;
        -webkit-transform: translate(-50%, -50%) scale(1);
        transform: translate(-50%, -50%) scale(1);
    }
}

.api_captcha_wrap .captcha_msg .btn_captcha_view {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #ff6f00;
}

.api_captcha_wrap .captcha_msg .btn_captcha_view:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../img/common/ico_captcha_play.png") no-repeat center;
}

.api_captcha_wrap .captcha_controller {
    display: table;
    position: absolute;
    top: 0;
    right: 0;
    width: 48px;
    height: 100%;
    border-left: 1px solid rgba(0, 0, 0, 0.72);
    vertical-align: middle;
    background: #adadad;
}

@media \0screen\,screen\9 {
    .api_captcha_wrap .captcha_controller {
        border-left: 1px solid #4a4a4a;
    }
}

.api_captcha_wrap .captcha_controller .btn_captcha {
    display: inline-block;
    position: relative;
    width: 48px;
    min-height: 47px;
}

.api_captcha_wrap .captcha_controller .btn_captcha.sound {
    background: #fff url("../img/common/ico_captcha_sound.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .api_captcha_wrap .captcha_controller .btn_captcha.sound {
        background: #fff url("../img/common/ico_captcha_sound.png") no-repeat center;
    }
}

.api_captcha_wrap .captcha_controller .btn_captcha.refresh {
    height: 100%;
    background: #fff url("../img/common/ico_captcha_reset.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .api_captcha_wrap .captcha_controller .btn_captcha.refresh {
        background: #fff url("../img/common/ico_captcha_reset.png") no-repeat center;
    }
}

.api_captcha_wrap .captcha_controller .btn_captcha.picture {
    background: #fff url("../img/common/ico_captcha_picture.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .api_captcha_wrap .captcha_controller .btn_captcha.picture {
        background: #fff url("../img/common/ico_captcha_picture.png") no-repeat center;
    }
}

.api_captcha_wrap .captcha_controller .btn_captcha.picture + .size_full {
    height: 47px;
}

.api_captcha_wrap .captcha_controller .btn_captcha:first-child {
    margin-bottom: 1px;
}

.api_captcha_wrap .captcha_controller .btn_captcha.size_full {
    height: 100%;
    height: 96px\0/IE8;
}

.api_captcha_wrap + .login_button {
    margin-top: 12px;
}

.captcha_main .login_button {
    margin-top: 24px;
}

.virtual_keypad {
    margin-top: 8px;
}

.captcha_main .virtual_keypad {
    padding-bottom: 4px;
}

.virtual_keypad .keypad_inner {
    padding: 0 0 0 2px;
}

.virtual_keypad .keypad_entry_number {
    z-index: 1;
    position: relative;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    vertical-align: baseline;
}

.virtual_keypad .keypad_entry_number .keypad_background {
    overflow: hidden;
    z-index: -1;
    position: absolute;
    top: 1px;
    left: 4px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 359px) {
    .virtual_keypad .keypad_entry_number .keypad_background {
        top: 1px;
        left: 0;
    }
}

.virtual_keypad .keypad_entry_number .keypad_background img {
    width: calc(100% - 3px);
    width: 319px\0/IE8;
}

@media screen and (max-width: 359px) {
    .virtual_keypad .keypad_entry_number .keypad_background img {
        width: 98.6%;
    }
}

.virtual_keypad .keypad_entry_number .keypad_number {
    overflow: hidden;
    z-index: 20;
    cursor: pointer;
    position: relative;
    display: inline-block;
    margin-top: 4px;
    margin-left: 4px;
    padding: 0;
    width: 60px;
    height: 48px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border: 1px solid #e4e4e4 \0/IE8;
    line-height: 0;
    text-align: center;
    background: url("../img/common/bg_trick_ie.gif") repeat;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 359px) {
    .virtual_keypad .keypad_entry_number .keypad_number {
        margin-top: 1.111111111111111vw;
        margin-left: 1vw;
        width: 16.5vw;
        height: 13.333vw;
    }
    .virtual_keypad .keypad_entry_number .keypad_number:first-of-type, .virtual_keypad .keypad_entry_number .keypad_number:nth-child(7) {
        margin-left: 0;
    }
}

.virtual_keypad .keypad_entry_number .keypad_number:hover {
    border: 1px solid rgba(0, 0, 0, 0.72);
    border: 1px solid #4a4a4a \0/IE8;
}

.virtual_keypad .keypad_entry_number .keypad_number:focus {
    border: 1px solid rgba(0, 0, 0, 0.72);
    border: 1px solid #4a4a4a \0/IE8;
    background: rgba(0, 0, 0, 0.04);
}

.virtual_keypad .keypad_entry_number .keypad_number.no_action {
    background: url("../img/common/ico_keypad_logo_gray.svg") no-repeat center;
    background-size: 16px auto;
}

@media \0screen\,screen\9 {
    .virtual_keypad .keypad_entry_number .keypad_number.no_action {
        background: url("../img/common/ico_keypad_logo_gray.png") no-repeat center;
    }
}

.virtual_keypad .keypad_entry_number .keypad_number img {
    width: 100%;
}

.virtual_keypad .keypad_entry_number .keynum {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    line-height: 0;
}

.virtual_keypad .keypad_entry_controller {
    padding-left: 4px;
    font-size: 0;
    line-height: 0;
    vertical-align: baseline;
}

@media screen and (max-width: 359px) {
    .virtual_keypad .keypad_entry_controller {
        padding-left: 0;
    }
}

.virtual_keypad .keypad_entry_controller .keypad_controller {
    position: relative;
    display: inline-block;
    margin-top: 4px;
    width: calc(100% / 5);
    height: 48px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border: 1px solid #e4e4e4 \0/IE8;
    text-align: center;
    line-height: 0;
    background: #fff;
}

@media screen and (max-width: 359px) {
    .virtual_keypad .keypad_entry_controller .keypad_controller {
        margin-top: 1.111111111111111vw;
        height: 13.333vw;
    }
}

.virtual_keypad .keypad_entry_controller .keypad_controller:hover {
    border: 1px solid rgba(0, 0, 0, 0.72) !important;
    border: 1px solid #4a4a4a \0/IE8;
}

.virtual_keypad .keypad_entry_controller .keypad_controller:focus {
    border: 1px solid rgba(0, 0, 0, 0.72) !important;
    border: 1px solid #4a4a4a \0/IE8;
    background: rgba(0, 0, 0, 0.04);
    background: #f5f5f5\0/IE8;
}

.virtual_keypad .keypad_entry_controller .keypad_controller.cancle, .virtual_keypad .keypad_entry_controller .keypad_controller.enter {
    width: 124px;
}

@media screen and (max-width: 359px) {
    .virtual_keypad .keypad_entry_controller .keypad_controller.cancle, .virtual_keypad .keypad_entry_controller .keypad_controller.enter {
        width: 34vw;
    }
}

.virtual_keypad .keypad_entry_controller .keypad_controller.cancle .btn_text, .virtual_keypad .keypad_entry_controller .keypad_controller.enter .btn_text {
    font-weight: 600;
}

.virtual_keypad .keypad_entry_controller .keypad_controller.cancle .btn_text {
    color: rgba(0, 0, 0, 0.72);
    color: #4a4a4a\0/IE8;
}

.virtual_keypad .keypad_entry_controller .keypad_controller.enter {
    border-color: #FF6F00;
}

.virtual_keypad .keypad_entry_controller .keypad_controller.enter .btn_text {
    color: #FF6F00;
}

.virtual_keypad .keypad_entry_controller .keypad_controller.backspace {
    margin-left: 4px;
    margin-right: 4px;
    width: 60px;
    background: url("../img/common/ico_keypad_backspace.svg") no-repeat center;
    background-size: 24px auto;
    background: url("../img/common/ico_keypad_backspace.png") no-repeat center\0/IE8;
}

@media screen and (max-width: 359px) {
    .virtual_keypad .keypad_entry_controller .keypad_controller.backspace {
        margin-left: 1vw;
        margin-right: 1vw;
        width: 16.5vw;
    }
}

.section_login {
    position: relative;
    margin: 0 auto;
    padding: 34px 0;
    width: 100%;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 768px) {
    .section_login {
        padding: 34px 16px;
        min-height: 100vh;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -o-box-sizing: border-box;
        box-sizing: border-box;
    }
}

.section_login:after {
    content: '';
    display: block;
    clear: both;
}

.login_service_msg {
    margin-top: 32px;
    padding-top: 32px;
    border-top: 4px solid rgba(0, 0, 0, 0.72);
}

.login_service_msg .inp_wrap {
    margin-top: 16px;
}

.qrcode_inwrap .login_state {
    margin-top: 40px;
    margin-bottom: 6px;
}

.qrcode_inwrap .login_qr .qr_barcode {
    padding-top: 20px;
    margin-bottom: 30px;
    text-align: center;
}

.qrcode_inwrap .login_qr .qr_barcode .info_time {
    margin-top: 18px;
}

.qrcode_inwrap .login_qr .qr_barcode .info_time dt,
.qrcode_inwrap .login_qr .qr_barcode .info_time dd {
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    line-height: 20px;
    color: #242424;
}

.qrcode_inwrap .login_qr .qr_barcode .info_time dd {
    color: #ff6f00;
    font-weight: 600;
}

.qrcode_inwrap .login_qr .qr_barcode .thumb_barcode {
    display: inline-block;
    vertical-align: top;
}

.qrcode_inwrap .login_qr .qr_notice {
    padding: 0 22px 9px 18px;
}

.qrcode_inwrap .login_qr .qr_notice .notice_box {
    margin-bottom: 30px;
}

.qrcode_inwrap .login_qr .qr_notice .notice_text {
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.38);
    font-size: 16px;
    font-weight: 600;
    color: #242424;
    text-align: center;
}

.qrcode_inwrap .login_qr .qr_notice .notice_text .emph_o  {
    font-weight: 600;
    color: #ff6f00;
}

.qrcode_inwrap .login_qr .qr_notice .lst_number_notice li {
    position: relative;
    padding-left: 28px;
    margin-top: 7px;
}

.qrcode_inwrap .login_qr .qr_notice .lst_number_notice li:first-child {
    margin-top: 0;
}

.qrcode_inwrap .login_qr .qr_notice .lst_number_notice li p {
    display: inline-block;
    vertical-align: top;
}

.qrcode_inwrap .login_qr .qr_notice .lst_number_notice li .notice_num {
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.72);
    background-color: #474747 \0/IE8;
    color: #fff;
    font-size: 11px;
    line-height: 20px;
    font-weight: 600;
    vertical-align: top;
    text-align: center;
}

.qrcode_inwrap .login_qr .qr_barcode_retry {
    width: 100%;
    height: 116px;
    padding-top: 21px;
    margin-top: 16px;
    margin-bottom: 17px;
    background-color: rgba(0, 0, 0, 0.04);
    background-color: #f5f5f5 \0/IE8;
    text-align: center;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.qrcode_inwrap .login_qr .qr_barcode_retry .qr_barcode_title {
    display: block;
    font-size: 14px;
    line-height: 20px;
    color: #242424;
}

.app_choice_info {
    padding: 0 16px;
}

.app_choice_info .dsc_app_choice {
    margin-bottom: 15px;
    font-size: 16px;
    line-height: 20px;
    color: #242424;
    font-weight: 600;
}

.app_choice_info .emph_choice_lst {
    display: block;
    font-size: 14px;
    line-height: 20px;
    color: #ff6f00;
    font-weight: 600;
}

.app_choice_lst {
    padding-top: 15px;
}

.app_choice_lst .sub_lst_choice {
    margin-top: 16px;
    margin-bottom: 42px;
    padding: 0 16px;
    font-size: 14px;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.72);
    color: #424242\0/IE8;
}

.app_choice_lst .lst_choice_anchor li {
    position: relative;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid #e4e4e4 \0/IE8;
}

.app_choice_lst .lst_choice_anchor .link_icon {
    position: absolute;
    top: 16px;
    left: 16px;
    width: 27px;
    height: 27px;
    object-fit: cover;
}

.app_choice_lst .lst_choice_anchor .link_choice {
    display: table;
    position: relative;
    height: 55px;
    width: 100%;
    padding: 0 44px 0 50px;
    text-align: left;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.app_choice_lst .lst_choice_anchor .link_choice:before {
    content: '';
    display: block;
    position: absolute;
    top: 18px;
    right: 16px;
    width: 20px;
    height: 20px;
    background: url("../img/common/ico_link_arrow3.svg") no-repeat center;
    background-size: 20px auto;
    background-image: url("../img/common/ico_link_arrow3.png") \9;
}

.app_choice_lst .lst_choice_anchor .link_choice .txt_choice {
    display: table-cell;
    vertical-align: middle;
    font-size: 14px;
    line-height: 20px;
    color: #242424;
}

.accordion_wrap {
    overflow: hidden;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    background: #fff;
}

@media \0screen\,screen\9 {
    .accordion_wrap {
        border-top: 1px solid #e4e4e4;
        border-bottom: 1px solid #e4e4e4;
    }
}

.accordion_box {
    border-top: 1px solid rgba(0, 0, 0, 0.12);
}

@media \0screen\,screen\9 {
    .accordion_box {
        border-top: 1px solid #e4e4e4;
    }
}

.accordion_box:nth-child(1) {
    border-top: 0;
}

.accordion_box.is-active {
    background: rgba(0, 0, 0, 0.04);
}

@media \0screen\,screen\9 {
    .accordion_box.is-active {
        background: #f5f5f5;
    }
}

.accordion_box.is-active .accordion_body {
    display: block;
    height: auto;
}

.accordion_button {
    display: table;
    position: relative;
    padding: 0 44px 0 16px;
    width: 100%;
    height: 55px;
    text-align: left;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.accordion_button:before {
    content: '';
    display: block;
    position: absolute;
    top: 18px;
    right: 16px;
    width: 20px;
    height: 20px;
    background: url("../img/common/ico_content_more.svg") no-repeat center;
    background-size: 20px auto;
}

@media \0screen\,screen\9 {
    .accordion_button:before {
        background: url("../img/common/ico_content_more.png") no-repeat center;
    }
}

.accordion_title {
    display: table-cell;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.43;
    color: #121212;
    vertical-align: middle;
}

.accordion_body {
    overflow: hidden;
    display: none;
    height: 0;
}

.accordion_content {
    padding: 0 16px 24px;
    width: 100%;
    font-size: 14px;
    color: #121212;
    line-height: 1.43;
    vertical-align: baseline;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.accordion_content .btn_wrap {
    margin-top: 16px;
}

.login_service_wrap.otp .login_service_title:before, .login_service_wrap.security .login_service_title:before {
    background-image: url("../img/common/ico_otp_lock.svg");
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_service_wrap.otp .login_service_title:before, .login_service_wrap.security .login_service_title:before {
        background-image: url("../img/common/ico_otp_lock.png");
    }
}

.login_service_wrap.foreign .login_service_title:before {
    background-image: url("../img/common/ico_globe.svg");
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_service_wrap.foreign .login_service_title:before {
        background-image: url("../img/common/ico_globe.png");
    }
}

.login_service_wrap.otp {
    padding-top: 8px;
}

.login_service_wrap.otp .login_state {
    margin-top: 16px;
}

.login_service_wrap.foreign {
    padding-top: 8px;
}

.login_service_wrap.foreign .login_state {
    margin-top: 16px;
}

.login_service_wrap.security {
    padding-top: 8px;
}

.login_service_wrap.security .login_service_title {
    padding-left: 56px;
}

.login_service_wrap.security .login_state {
    margin-top: 16px;
}

.login_service_head {
    padding: 0 16px;
}

.login_service_head .btn_wrap {
    margin: 32px -16px;
}

.login_service_title {
    position: relative;
    margin: 0 -16px;
    margin-bottom: 17px;
    padding-left: 54px;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.33;
    text-align: left;
    vertical-align: baseline;
}

.login_service_title:before {
    content: '';
    display: block;
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -24px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-size: 24px;
    background: #FF6F00 no-repeat center;
}

@media screen and (min-width: 280px) and (max-width: 319px) {
    .login_service_title {
        font-size: 7.5vw;
    }
}

.login_service_desc {
    font-size: 14px;
    color: #121212;
    line-height: 1.43;
}

.login_service_ipchk {
    margin-top: 7px;
    font-size: 14px;
    font-weight: 600;
    color: #FF6F00;
    line-height: 1.43;
}

.login_otp_help {
    margin-top: 14px;
}

.login_otp_help .title_wrap {
    padding: 16px;
}

.login_otp_help .accordion_content .inp_wrap {
    margin-top: 16px;
}

.login_security_help {
    margin-top: 16px;
    padding: 0 16px;
}

.login_security_help .ip_security + .ip_security {
    margin-top: 36px;
}

.login_security_help .ip_security_head {
    position: relative;
}

.login_security_help .ip_security_head:before {
    content: '';
    display: block;
    position: absolute;
    top: 12px;
    right: 0;
    width: 100%;
    height: 1px;
    background: #FF6F00;
}

.login_security_help .ip_security_title {
    display: inline-block;
    position: relative;
    padding-right: 40px;
    font-size: 16px;
    font-weight: 600;
    color: #FF6F00;
    vertical-align: baseline;
    background: #fff;
}

.login_security_help .ip_security_title [class^="ip_security_"] {
    display: inline-block;
    position: absolute;
    top: 2px;
    right: 0;
    width: 36px;
    height: 20px;
}

.login_security_help .ip_security_title .ip_security_off {
    background: url("../img/common/bg_login_ip_off.svg") no-repeat 0 0;
    background-size: 36px auto;
}

@media \0screen\,screen\9 {
    .login_security_help .ip_security_title .ip_security_off {
        background: url("../img/common/bg_login_ip_off.png") no-repeat 0 0;
    }
}

.login_security_help .ip_security_title .ip_security_on {
    background: url("../img/common/bg_login_ip_on.svg") no-repeat 0 0;
    background-size: 36px auto;
}

@media \0screen\,screen\9 {
    .login_security_help .ip_security_title .ip_security_on {
        background: url("../img/common/bg_login_ip_on.png") no-repeat 0 0;
    }
}

.login_security_help .ip_security_body {
    margin-top: 16px;
}

.login_security_help .ip_security_body .txt_list li {
    position: relative;
    padding-left: 32px;
    font-size: 14px;
    color: #121212;
    line-height: 1.43;
}

.login_security_help .ip_security_body .txt_list li:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 24px;
    height: 24px;
    background: url("../img/common/ico_lock_on.svg") no-repeat 0 0;
    background-size: 24px;
}

@media \0screen\,screen\9 {
    .login_security_help .ip_security_body .txt_list li:before {
        background: url("../img/common/ico_lock_on.png") no-repeat 0 0;
    }
}

.login_security_help .ip_security_body .txt_list li + li {
    margin-top: 16px;
}

.login_security_help .ip_security.off .ip_security_head:before {
    background: rgba(0, 0, 0, 0.32);
}

@media \0screen\,screen\9 {
    .login_security_help .ip_security.off .ip_security_head:before {
        background: #adadad;
    }
}

.login_security_help .ip_security.off .ip_security_title {
    color: rgba(0, 0, 0, 0.32);
}

@media \0screen\,screen\9 {
    .login_security_help .ip_security.off .ip_security_title {
        color: #adadad;
    }
}

.login_security_help .ip_security.off .txt_list li:before {
    background: url("../img/common/ico_lock_off.svg") no-repeat 0 0/24px;
}

@media \0screen\,screen\9 {
    .login_security_help .ip_security.off .txt_list li:before {
        background: url("../img/common/ico_lock_off.png") no-repeat 0 0;
    }
}

.login_security_help .btn_wrap {
    margin-top: 32px;
}

.login_security_help .btn_wrap .btn_type4 + .btn_type4 {
    margin-left: 16px;
}

.install_wrap {
    margin-top: 54px;
    padding: 0 0 40px;
    background: #f9f9f9;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.install_wrap .btn_wrap {
    margin-top: 24px;
}

.install_icon {
    overflow: hidden;
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    line-height: 1;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.install_body {
    margin-top: 12px;
}

.install_title {
    font-size: 32px;
    font-weight: 400;
    color: #121212;
    line-height: 1.25;
}

.install_desc {
    margin-top: 16px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.32);
    line-height: 1.43;
}

@media \0screen\,screen\9 {
    .install_desc {
        color: #adadad;
    }
}

.install_step1 .install_icon {
    position: relative;
    background: #FF6F00;
    width: 48px;
    height: 48px;
}

.install_step1 .icon_unit_wrap {
    position: absolute;
    display: inline-block;
    top: 21px;
    margin: 0 9px;
    width: 30px;
    height: 6px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.install_step1 .icon_unit_wrap i {
    display: block;
    position: absolute;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
}

.install_step1 .icon_unit_wrap i.icon_unit1 {
    -webkit-animation: 1.25s linear 0s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0s infinite normal none aniFnLoding_dot;
}

.install_step1 .icon_unit_wrap i.icon_unit2 {
    left: 12px;
    -webkit-animation: 1.25s linear 0.125s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0.125s infinite normal none aniFnLoding_dot;
}

.install_step1 .icon_unit_wrap i.icon_unit3 {
    left: 24px;
    -webkit-animation: 1.25s linear 0.25s infinite normal none aniFnLoding_dot;
    animation: 1.25s linear 0.25s infinite normal none aniFnLoding_dot;
}

@keyframes aniFnLoding_dot {
    0% {
        background: rgba(255, 255, 255, 0.2);
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: cubic-bezier(1, 0, 0.7, 1);
        animation-timing-function: cubic-bezier(1, 0, 0.7, 1);
    }
    40% {
        background: white;
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
        -webkit-animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
        animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
    }
    72.5% {
        background: rgba(255, 255, 255, 0.4);
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
    }
    100% {
        background: rgba(255, 255, 255, 0.2);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.install_step2 .install_icon {
    background: #FF6F00 url("../img/luncher/ico/ico_install_power.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .install_step2 .install_icon {
        background: #FF6F00 url("../img/luncher/ico/ico_install_power.png") no-repeat center;
    }
}

.install_step2 .install_set {
    margin-top: 24px;
}

.install_step2 .btn_wrap .btn_type2 {
    width: 100%;
}

.install_step3 .install_icon {
    position: relative;
    background: #FF6F00;
    padding: 12px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.install_step3 .install_icon .icon_unit_wrap {
    margin: 2px;
    position: relative;
    width: 20px;
    height: 20px;
    font-size: 0;
    text-align: center;
    background: url("../img/luncher/ico/ico_luncher_loading.png") no-repeat center;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .install_step3 .install_icon .icon_unit_wrap {
        background: none;
    }
}

.install_step3 .install_icon .icon_unit_wrap i {
    display: inline-block;
    overflow: hidden;
    position: absolute;
    width: 2px;
    height: 4px;
    background: #fff;
}

@media \0screen\,screen\9 {
    .install_step3 .install_icon .icon_unit_wrap i {
        display: none;
    }
}

.install_step3 .install_icon .icon_unit_wrap i.icon_unit1 {
    opacity: 0.05;
    top: 0;
    left: 8px;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-animation: 0.96s linear 0s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0s infinite normal none animationLoadingBar2;
}

.install_step3 .install_icon .icon_unit_wrap i.icon_unit2 {
    opacity: 0.05;
    top: 2px;
    left: 14px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-animation: 0.96s linear 0.06s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.06s infinite normal none animationLoadingBar2;
}

.install_step3 .install_icon .icon_unit_wrap i.icon_unit3 {
    opacity: 0.05;
    top: 8px;
    left: 16px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-animation: 0.96s linear 0.12s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.12s infinite normal none animationLoadingBar2;
}

.install_step3 .install_icon .icon_unit_wrap i.icon_unit4 {
    opacity: 0.05;
    top: 14px;
    left: 14px;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    -webkit-animation: 0.96s linear 0.18s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.18s infinite normal none animationLoadingBar2;
}

.install_step3 .install_icon .icon_unit_wrap i.icon_unit5 {
    opacity: 0.05;
    top: 16px;
    left: 8px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-animation: 0.96s linear 0.24s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.24s infinite normal none animationLoadingBar2;
}

.install_step3 .install_icon .icon_unit_wrap i.icon_unit6 {
    opacity: 0.05;
    top: 14px;
    left: 2px;
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg);
    -webkit-animation: 0.96s linear 0.3s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.3s infinite normal none animationLoadingBar2;
}

.install_step3 .install_icon .icon_unit_wrap i.icon_unit7 {
    opacity: 0.05;
    top: 8px;
    left: 0;
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
    -webkit-animation: 0.96s linear 0.36s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.36s infinite normal none animationLoadingBar2;
}

.install_step3 .install_icon .icon_unit_wrap i.icon_unit8 {
    opacity: 0.05;
    top: 2px;
    left: 2px;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
    -webkit-animation: 0.96s linear 0.42s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.42s infinite normal none animationLoadingBar2;
}

@-webkit-keyframes animationLoadingBar2 {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes animationLoadingBar2 {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.install_step3 .progress_wrap {
    overflow: hidden;
    position: relative;
    margin-top: 24px;
    border-radius: 4px;
    height: 8px;
    background: rgba(0, 0, 0, 0.12);
}

@media \0screen\,screen\9 {
    .install_step3 .progress_wrap {
        background: #e4e4e4;
    }
}

.install_step3 .progress_bar {
    overflow: hidden;
    height: 8px;
    border-radius: 4px;
    background: #FF6F00;
}

.install_step3 .progress_percent {
    display: block;
    margin-top: 8px;
    font-size: 32px;
    color: #121212;
    line-height: 1.25;
}

.install_step4 .install_icon {
    background: #0A84FF url("../img/common/ico_sucess2.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .install_step4 .install_icon {
        background: #0A84FF url("../img/common/ico_sucess2.png") no-repeat center;
    }
}

.install_step_error .install_icon {
    background: #FF3B30 url("../img/common/ico_error_x.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .install_step_error .install_icon {
        background: #FF3B30 url("../img/common/ico_error_x.png") no-repeat center;
    }
}

.install_step_warning .install_icon {
    background: #ffbd00 url("../img/common/ico_warning.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .install_step_warning .install_icon {
        background: #ffbd00 url("../img/common/ico_warning.png") no-repeat center;
    }
}

.tooltip_wrap {
    margin-bottom: 8px;
    width: 328px;
    height: 88px;
    border-radius: 4px;
    box-shadow: 0px 7px 22px -10px rgba(0, 0, 0, 0.72);
    -webkit-box-shadow: 0px 7px 22px -10px rgba(0, 0, 0, 0.72);
    -moz-box-shadow: 0px 7px 22px -10px rgba(0, 0, 0, 0.72);
    background: rgba(0, 0, 0, 0.72);
    background: #424242\0/IE8;
}

.tooltip_wrap:before {
    content: '';
    display: inline-block;
    position: absolute;
    bottom: -6px;
    left: 16px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    border: 6px solid rgba(0, 0, 0, 0.72);
    border-top: 6px solid transparent;
    border-right: 6px solid transparent;
    border-radius: 2px;
}

@media \0screen\,screen\9 {
    .tooltip_wrap:before {
        bottom: -9px;
        border: 0;
        width: 19px;
        height: 9px;
        background: url("../img/common/bg_tooltip_top.gif") no-repeat left top;
    }
}

.tooltip_body {
    padding: 14px 16px 12px;
    font-size: 14px;
    color: #fff;
    line-height: 1.43;
    text-align: left;
    vertical-align: baseline;
}

/* PC에서 CapsLock 버튼 활성화 시 INPUT 아래에 보여지는 툴팁 메세지 */
.inp_wrap .tooltip_wrap {
    z-index: 5;
    display: inline-block;
    position: absolute;
    top: 68px;
    left: 0;
    margin: 0;
    width: auto;
    height: 40px;
    border-radius: 4px;
    box-shadow: 0px 7px 22px -10px rgba(0, 0, 0, 0.72);
    -webkit-box-shadow: 0px 7px 22px -10px rgba(0, 0, 0, 0.72);
    -moz-box-shadow: 0px 7px 22px -10px rgba(0, 0, 0, 0.72);
    background: rgba(0, 0, 0, 0.72);
    background: #424242\0/IE8;
}

.inp_wrap .tooltip_wrap:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: -4px;
    bottom: auto;
    left: 16px;
    border: 5px solid rgba(0, 0, 0, 0.72);
    border-top: 5px solid transparent;
    border-right: 5px solid transparent;
    border-radius: 2px;
    -webkit-transform: rotate(-227deg);
    transform: rotate(-227deg);
}

@media \0screen\,screen\9 {
    .inp_wrap .tooltip_wrap:before {
        top: -8px;
        border: 0;
        width: 19px;
        height: 9px;
        background: url("../img/common/bg_tooltip_top2.gif") no-repeat left top;
    }
}

.inp_wrap .tooltip_body {
    padding: 10px 16px;
    font-size: 14px;
    color: #fff;
    line-height: 1.43;
    text-align: left;
    vertical-align: baseline;
}

.pop_dialog_wrap {
    display: none;
    z-index: 105;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    vertical-align: middle;
}

.pop_dialog_wrap.is-active {
    display: block;
}

.pop_dialog_wrap .progress_wrap {
    overflow: hidden;
    position: relative;
    margin-top: 24px;
    border-radius: 4px;
    height: 8px;
    background: rgba(0, 0, 0, 0.12);
    background: #e4e4e4\0/IE8;
}

.pop_dialog_wrap .progress_bar {
    overflow: hidden;
    height: 8px;
    border-radius: 4px;
    background: #FF6F00;
}

.pop_dialog_wrap .progress_percent {
    display: block;
    margin-top: 8px;
    font-size: 32px;
    color: #121212;
    line-height: 1.25;
}

.pop_dialog_wrap.type2 .pop_dialog_inner {
    z-index: 0;
    display: inline-block;
    position: absolute;
    top: 50%;
    margin: 0 auto;
    left: 0;
    right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 24px 24px 24px 31px;
    width: 360px;
    background-color: #fff;
    -webkit-box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14);
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14);
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.pop_dialog_wrap.type2 .pop_dialog_inner .btn_dialog_close {
    z-index: 10;
    display: block;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 24px;
    height: 24px;
    background: url(../img/common/bg_dialog_close.svg) no-repeat center;
    background-size: 24px auto;
    background: url(../img/common/bg_dialog_close.png) no-repeat center\0/IE89;
}

.pop_dialog_wrap.type2 .pop_dialog_body * {
    font-size: 16px;
    color: #242424;
    text-align: left;
}

.pop_dialog_wrap.type2 .pop_dialog_desc {
    margin-top: 8px;
    color: rgba(0, 0, 0, 0.32);
    color: #adadad \0/IE89;
}

.pop_dialog_wrap.type2 .pop_dialog_button {
    overflow: hidden;
    float: right;
    margin-top: 24px;
}

.pop_dialog_wrap.type2 .pop_dialog_button [class^="btn_type"] .btn_text {
    font-weight: 600;
}

.pop_dialog_wrap.type2 .pop_dialog_button [class^="btn_type"] + [class^="btn_type"] {
    margin-left: 4px;
}

.pop_dialog_inner {
    z-index: 0;
    display: inline-block;
    position: absolute;
    top: 50%;
    margin: 0 auto;
    left: 0;
    right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 24px 24px 24px 32px;
    width: 428px;
    background-color: #fff;
    -webkit-box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14);
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14);
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.pop_dialog_inner .btn_dialog_close {
    z-index: 10;
    display: block;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 24px;
    height: 24px;
    background: url("../img/common/bg_dialog_close.svg") no-repeat center;
    background-size: 24px auto;
}

.pop_dialog_wrap .pop_terms_contents div.inp_check label {
    padding: 0 0 0 32px;
    line-height: 24px;
}

@media \0screen\,screen\9 {
    .pop_dialog_inner .btn_dialog_close {
        background: url("../img/common/bg_dialog_close.png") no-repeat center;
    }
}

.pop_dialog_body {
    text-align: left;
}

.pop_dialog_icon {
    display: block;
    overflow: hidden;
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 50%;
}

.pop_dialog_icon:before {
    content: '';
    display: block;
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.04);
    background-color: #f5f5f5\0/IE8;
}

.pop_dialog_icon.dialog_info {
    background: url("../img/common/ico_dialog_info.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .pop_dialog_icon.dialog_info {
        background: url("../img/common/ico_dialog_info.png") no-repeat center;
    }
}

.pop_dialog_icon.dialog_update {
    background: #FF6F00;
}

.pop_dialog_icon.dialog_update .install_icon {
    position: relative;
    background: #FF6F00;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap {
    margin: 14px;
    position: relative;
    width: 20px;
    height: 20px;
    font-size: 0;
    text-align: center;
    background: url("../img/luncher/ico/ico_insatll.png") no-repeat center\0/IE8;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i {
    display: inline-block;
    display: none\0/IE8;
    overflow: hidden;
    position: absolute;
    width: 2px;
    height: 4px;
    background: #fff;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i.icon_unit1 {
    opacity: 0.05;
    top: 0;
    left: 8px;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-animation: 0.96s linear 0s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0s infinite normal none animationLoadingBar2;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i.icon_unit2 {
    opacity: 0.05;
    top: 2px;
    left: 14px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-animation: 0.96s linear 0.06s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.06s infinite normal none animationLoadingBar2;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i.icon_unit3 {
    opacity: 0.05;
    top: 8px;
    left: 16px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-animation: 0.96s linear 0.12s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.12s infinite normal none animationLoadingBar2;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i.icon_unit4 {
    opacity: 0.05;
    top: 14px;
    left: 14px;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    -webkit-animation: 0.96s linear 0.18s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.18s infinite normal none animationLoadingBar2;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i.icon_unit5 {
    opacity: 0.05;
    top: 16px;
    left: 8px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-animation: 0.96s linear 0.24s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.24s infinite normal none animationLoadingBar2;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i.icon_unit6 {
    opacity: 0.05;
    top: 14px;
    left: 2px;
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg);
    -webkit-animation: 0.96s linear 0.3s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.3s infinite normal none animationLoadingBar2;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i.icon_unit7 {
    opacity: 0.05;
    top: 8px;
    left: 0;
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
    -webkit-animation: 0.96s linear 0.36s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.36s infinite normal none animationLoadingBar2;
}

.pop_dialog_icon.dialog_update .icon_unit_wrap i.icon_unit8 {
    opacity: 0.05;
    top: 2px;
    left: 2px;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
    -webkit-animation: 0.96s linear 0.42s infinite normal none animationLoadingBar2;
    animation: 0.96s linear 0.42s infinite normal none animationLoadingBar2;
}

@keyframes animationLoadingBar2 {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.pop_dialog_icon.dialog_run1 {
    background: #FF6F00 url("../img/common/ico_dialog_logoG_white.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .pop_dialog_icon.dialog_run1 {
        background: #FF6F00 url("../img/common/ico_dialog_logoG_white.png") no-repeat center;
    }
}

.pop_dialog_icon.dialog_run2 {
    background: url("../img/common/ico_dialog_logoG.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .pop_dialog_icon.dialog_run2 {
        background: url("../img/common/ico_dialog_logoG.png") no-repeat center;
    }
}

.pop_dialog_icon.dialog_close {
    background: #FF6F00 url("../img/common/ico_dialog_power_white.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .pop_dialog_icon.dialog_close {
        background: #FF6F00 url("../img/common/ico_dialog_power_white.png") no-repeat center;
    }
}

.pop_dialog_icon.dialog_complete {
    background: #FF6F00 url("../img/common/ico_dialog_complete.svg") no-repeat center;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .pop_dialog_icon.dialog_complete {
        background: #FF6F00 url("../img/common/ico_dialog_complete.png") no-repeat center;
    }
}

.pop_dialog_title {
    margin-top: 8px;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.33;
    color: #121212;
    vertical-align: baseline;
}

.pop_dialog_title * {
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    line-height: inherit;
}

.pop_dialog_desc {
    margin-top: 8px;
    color: rgba(0, 0, 0, 0.32);
}

@media \0screen\,screen\9 {
    .pop_dialog_desc {
        color: #adadad;
    }
}

.pop_dialog_button {
    overflow: hidden;
    float: right;
    margin-top: 24px;
}

.pop_dialog_button [class^="btn_type"] .btn_text {
    font-weight: 600;
}

.pop_dialog_button [class^="btn_type"] + [class^="btn_type"] {
    margin-left: 4px;
}

.pop_dialog_button .login_quick_nav {
    padding-top: 12px;
}

.pop_dialog_wrap .error_notice_wrap {
    overflow: hidden;
}

.pop_dialog_wrap .error_notice_title {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #ff3b30 !important;
    line-height: 1.25;
}

.pop_dialog_wrap .error_notice_content {
    margin-top: 16px;
    vertical-align: middle;
}

.pop_dialog_wrap .error_notice_content p {
    margin-top: 8px;
    font-size: 14px !important;
    font-weight: 400;
    color: #242424;
    line-height: 1.43;
}

.pop_dialog_wrap .error_notice_content p:first-child {
    margin-top: 0;
}

.pop_dialog_wrap .error_notice_content .btn_wrap {
    margin-top: 16px;
}

.pop_dialog_wrap .error_notice_content .btn_wrap .btn_style_7 {
    padding-top: 6px;
}

.pop_dialog_wrap .error_notice_content .btn_wrap .btn_style_7 .btn_text {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.72);
}

@media \0screen\,screen\9 {
    .pop_dialog_wrap .error_notice_content .btn_wrap .btn_style_7 .btn_text {
        color: #4a4a4a;
    }
}

.txt_point {
    color: #ff3b30 !important;
}

/*
  .login_banner
  = 로그인 > (좌측) 프로모션 배너
  944px 이상 (pc)부터 프로모션이 보이도록 처리
*/
.login_banner {
    display: none;
    margin-right: 90px;
    padding-top: 54px;
    text-align: center;
}

.banner_wrap {
    position: relative;
    overflow: hidden;
    width: 460px;
    height: 356px;
}

.banner_wrap .banner_iframe {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: -178px auto 0;
    width:100%;
    height:100%;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .banner_wrap .banner_iframe {
        width: 460px;
    }
}

@media screen and (min-width: 944px) {
    .section_login {
        padding: 40px 0 0;
        width: 944px;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -o-box-sizing: border-box;
        box-sizing: border-box;
    }
    .section_login.view_pc {
        padding-top: 74px;
    }
    .login_banner {
        display: block;
        float: left;
    }
    .login_banner + .login_wrap {
        float: left;
    }
    .login_state .emphasis_type {
        margin: 0 -13px;
    }
}

.viewLuncher {
    /* luncher */
}

.viewLuncher .section_login {
    padding: 0;
    background: #f9f9f9;
}

.viewLuncher .login_iframe {
    z-index: 5;
    overflow: hidden;
    padding: 100px 0 0;
    width: 416px;
    height: 720px;
    *height: 620px;
    background: #f9f9f9;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.viewLuncher .login_inner {
    overflow-y: auto;
    padding: 0 44px 40px;
    width: 100%;
    height: 586px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.viewLuncher .login_inwrap {
    width: 328px;
}

.viewLuncher .luncher_wrap {
    position: relative;
    overflow: hidden;
    width: 1280px;
    height: 752px;
}

.viewLuncher .luncher_body {
    overflow: hidden;
    position: absolute;
    top: 32px;
    right: 0;
    width: 416px;
    background: #f9f9f9;
    max-height: 720px;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.viewLuncher .luncher_back {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.viewLuncher .luncher_header {
    overflow: hidden;
    position: relative;
    height: 32px;
    font-size: 0;
    background: #fff;
    -webkit-transition: background .5s ease-in;
    transition: background .5s ease-in;
}

.viewLuncher .luncher_header.game_start {
    background: transparent;
}

.viewLuncher .luncher_header .win_menu {
    position: absolute;
    top: 0;
    right: 0;
}

.viewLuncher .luncher_header .btn_win {
    display: inline-block;
    position: relative;
    width: 46px;
    height: 32px;
}

.viewLuncher .luncher_header .btn_win i {
    display: inline-block;
    position: relative;
    font-size: 0;
    line-height: 1;
    vertical-align: baseline;
}

.viewLuncher .luncher_header .btn_win.type_min i {
    width: 12px;
    height: 12px;
}

.viewLuncher .luncher_header .btn_win.type_min i:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 12px;
    height: 1px;
    background: #121212;
}

@media \0screen\,screen\9 {
    .viewLuncher .luncher_header .btn_win.type_min i {
        width: 46px;
        height: 32px;
        background: url("../img/luncher/ico/ico_luncher_min.png") no-repeat 0 0;
    }
}

.viewLuncher .luncher_header .btn_win.type_close i {
    display: block;
    width: 100%;
    height: 100%;
    background: url("../img/luncher/ico/ico_win_close.svg") no-repeat 0 0;
    background-size: 46px 32px;
}

@media \0screen\,screen\9 {
    .viewLuncher .luncher_header .btn_win.type_close i {
        background: url("../img/luncher/ico/ico_win_close.png") no-repeat 0 0;
    }
}

.viewLuncher .luncher_logo {
    display: inline-block;
    margin: 9px 12px;
}

.viewLuncher .luncher_logo a {
    display: inline-block;
    width: 98px;
    height: 14px;
    background: url("../img/luncher/logo/logo_hangame.svg") no-repeat 0 0;
    background-size: 98px 14px;
}

@media \0screen\,screen\9 {
    .viewLuncher .luncher_logo a {
        background: url("../img/luncher/logo/logo_hangame.png") no-repeat 0 0;
    }
}

.viewLuncher .luncher_aside {
    position: absolute;
    bottom: 48px;
    left: 32px;
    width: 801px;
    font-size: 0;
    white-space: nowrap;
    vertical-align: baseline;
}

.viewLuncher .luncher_aside:after {
    content: '';
    display: block;
    clear: both;
}

.viewLuncher .luncher_promotion {
    float: left;
    width: 280px;
    height: 158px;
    border-radius: 8px;
    text-align: center;
    background: rgba(50, 50, 50, 0.8);
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .viewLuncher .luncher_promotion {
        background: transparent;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
}

@media \0screen\,screen\9 {
    .viewLuncher .luncher_promotion {
        background: #5b5b5b;
    }
}

.viewLuncher .luncher_promotion .promotion_banner {
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;
}

.viewLuncher .luncher_promotion .promotion_banner img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: auto;
    max-width: 100%;
}

.viewLuncher .luncher_notice {
    overflow: hidden;
    position: relative;
    float: left;
    margin-top: 94px;
    margin-left: 32px;
    padding: 20px 20px 20px 28px;
    width: 489px;
    *width: 441px;
    height: 64px;
    *height: 24px;
    border-radius: 8px;
    background: rgba(50, 50, 50, 0.8);
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .viewLuncher .luncher_notice {
        background: transparent;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
}

@media \0screen\,screen\9 {
    .viewLuncher .luncher_notice {
        background: #5b5b5b;
    }
}

.viewLuncher .luncher_notice .notice_wrap {
    position: relative;
    padding-left: 31px;
    min-height: 24px;
}

.viewLuncher .luncher_notice .notice_wrap:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 24px;
    height: 24px;
    background: url("../img/luncher/ico/ico_luncher_notice.svg") no-repeat 0 0/24px auto;
}

@media \0screen\,screen\9 {
    .viewLuncher .luncher_notice .notice_wrap {
        background: url("../img/luncher/ico/ico_luncher_notice.png") no-repeat left top;
    }
}

.viewLuncher .luncher_notice .notice_item a {
    display: block;
    position: relative;
    padding-right: 31px;
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.64);
    text-align: left;
}

@media \0screen\,screen\9 {
    .viewLuncher .luncher_notice .notice_item a {
        color: #cbcbcc;
    }
}

.viewLuncher .luncher_notice .notice_item a:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 24px;
    height: 24px;
    background: url("../img/luncher/ico/ico_luncher_right.svg") no-repeat 0 0;
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .viewLuncher .luncher_notice .notice_item a {
        background: url("../img/luncher/ico/ico_luncher_right.png") no-repeat right center;
    }
}

/* sdk version 노출 시 모바일 뷰와 동일하게 최하단 위치 요청 적용 */
.section_login.section_type_sdk {
    min-height: 100vh;
}

.sdk_version_wrap {
    position: relative;
    margin-top: -40px;
    width: 100%;
    line-height: 1;
    text-align: center;
    vertical-align: middle;
}

.sdk_version_wrap .sdk_version {
    display: block;
    font-family: "notoSansKr";
    font-size: 10px;
    color: rgba(0, 0, 0, 0.32);
    line-height: 1.6;
    letter-spacing: 1.5px;
}

.password_chnage_wrap .password_chnage_title{
    font-size: 20px;
    line-height: 28px;
}

.password_chnage_wrap .txt_desc{
    margin-top: 16px;
    line-height: 20px;
    color:#242424;
}

.password_chnage_wrap .login_state{
    margin-top: 24px
}

.password_chnage_desc {
    margin-top: 16px;
    color: #242424;
    line-height: 20px;
}

.password_chnage_form {
    margin-top: 24px;
}

.password_chnage_guide {
    margin-top: 16px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.38);
    line-height: 22px;
}

.password_chnage_logout {
    margin-top: 24px;
}

.password_chnage_logout .inp_check.is-checked label {
    font-weight: 600;
}

.password_chnage_logout .inp_check.inp_style2 label{
    padding: 0 0 0 28px;
}

.password_chnage_logout .inp_check.inp_style2 .inp_text{
    display: inline-block;
    padding-top: 2px;
    vertical-align: middle;
}

/* select */
.select_group {
    z-index: 10;
    position: relative;
    margin-top: 16px;
}

.select_group.type2 .box_dropdown {
    position: relative;
    padding-right: 48px;
}

.select_group.type2 .box_dropdown .inp_box {
    margin: 0;
    border: 0;
    width: 100%;
}

.select_group.type2 .box_dropdown .inp_box:before {
    display: none;
}

.select_group.type2 .box_dropdown .inp_box input {
    font-size: 16px;
    font-weight: 700;
    color: #242424;
    line-height: 24px;
    vertical-align: top;
}

.select_group.type2 .box_dropdown .inp_box input::placeholder{
    font-size:14px;
    font-weight: 400;
    line-height:20px;
    color:rgba(0,0,0,0.38)
}

.select_group.type2 .box_dropdown .inp_box input::-webkit-input-placeholder{
    font-size:14px;
    font-weight: 400;
    line-height:20px;
    color:rgba(0,0,0,0.38)
}

.select_group.type2 .box_dropdown .inp_box input:-ms-input-placeholder{
    font-size:14px;
    font-weight: 400;
    line-height:20px;
    color:rgba(0,0,0,0.38)
}

.select_group.type2 .box_dropdown .btn_dropdown {
    position: absolute;
    top: 0;
    right: 0;
    width: 48px;
    height: 55px;
}

.select_group.is_opened .btn_dropdown:after {
    background-image: url("data:image/svg+xml, %3Csvg width='20' height='20' xmlns='http://www.w3.org/2000/svg' fill=''%3E%3Cpath d='M10.59 5.244l5.833 5.833-1.179 1.179L10 7.012l-5.244 5.244-1.179-1.179 5.834-5.833z' fill-rule='evenodd' fill-opacity='.72'/%3E%3C/svg%3E");
    background-position: center;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background: url("../img/common/ico_arrow_chevron_up.png") no-repeat left center \0/IE89;
}

.select_group.on .btn_dropdown {
    font-weight: 700;
    color: #242424;
}

.box_dropdown {
    width: 100%;
    border-radius: 4px;
    border: 1px solid #242424;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.box_dropdown .btn_dropdown {
    z-index: 12;
    position: relative;
    padding: 17px 37px 17px 16px;
    width: 100%;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.38);
    color: #9e9e9e \0/IE89;
    border-radius: 4px;
    text-align: left;
    background-color: #fff;
}

.box_dropdown .btn_dropdown:after {
    display: inline-block;
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    top: 15px;
    left: auto;
    right: 10px;
    background-image: url("data:image/svg+xml, %3Csvg width='20' height='20' xmlns='http://www.w3.org/2000/svg' fill=''%3E%3Cpath d='M15.244 6.91l1.179 1.18-5.834 5.833H9.411L3.577 8.089l1.179-1.178L10 12.154z' fill-rule='evenodd' fill-opacity='.72'/%3E%3C/svg%3E");
    background-position: center;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background: url("../img/common/ico_arrow_chevron_down.png") no-repeat left center \0/IE8;
}

.cont_dropdown {
    display: none;
    z-index: 13;
    position: absolute;
    top: 0;
    left: 0;
    top: 53px;
    width: 100%;
    border-radius: 0 0 4px 4px;
    border: 1px solid #242424;
    border-top-color: #e0e0e0;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.cont_dropdown .option_item {
    width: 100%;
    padding: 12px 15px;
    text-align: left;
    color: rgba(0, 0, 0, 0.72);
}

.cont_dropdown .option_item:hover,
.cont_dropdown .option_item .on {
    background-color: rgba(0, 0, 0, 0.04);
}

.cont_dropdown .lst_option li {
    margin: 0;
}

.withdrawl_wrap .emph_r {
    color: #ff3b30;
}

.withdrawl_wrap .emph_b {
    font-weight: 600;
}

.withdrawl_wrap .icon_withdrawl {
    display: block;
    width: 130px;
    height: 130px;
    margin: 0 auto;
    background-image: url(../img/common/ico_withdrawl.svg);
    background-size: 130px auto;
}

.withdrawl_wrap .tit_done {
    margin: 8px 0;
    font-size: 20px;
    line-height: 28px;
}

.withdrawl_wrap .btn_wrap {
    margin-top: 32px;
}

.withdrawl_wrap .btn_wrap.type2 {
    margin-top: 16px;
}

.withdrawl_wrap .login_state {
    margin-top: 32px;
}

.withdrawl_cont {
    padding-top: 8px;
}

.withdrawl_cont .withdrawl_title {
    display: block;
    margin-top: 24px;
    font-size: 16px;
    font-weight: 600;
    color: #242424;
    line-height: 24px;
}

.withdrawl_cont .withdrawl_desc {
    margin-top: 8px;
    padding: 16px;
    color: rgba(0, 0, 0, 0.72);
    line-height: 20px;
    background: rgba(0, 0, 0, 0.04);
}

.withdrawl_cont .withdrawl_list .item {
    position: relative;
    margin-left: 11px;
    line-height: 20px;
    font-weight: 400
}

.withdrawl_cont .withdrawl_list .item::after {
    display: inline-block;
    position: absolute;
    top: 9px;
    left: -11px;
    width: 3px;
    height: 3px;
    background: #9e9e9e;
    content: '';
}

.withdrawl_dl_cont .withdrawl_dl {
    padding: 16px;
    color: #242424;
    line-height: 20px;
    background: rgba(0, 0, 0, 0.04);
}
.withdrawl_dl_cont .withdrawl_dl .withdrawl_dl_box {
    display: flex;
    height: 20px;
    width: 100%;
    font-size: 0;
}
.withdrawl_dl_cont .withdrawl_dl .withdrawl_dl_box + .withdrawl_dl_box {
    margin-top: 8px;
}
.withdrawl_dl_cont .withdrawl_dl .withdrawl_dl_box dt {
    display: inline-block;
    margin-right: 20px;
    width: 97px;
    font-size: 14px;
    vertical-align: top;
}
.withdrawl_dl_cont .withdrawl_dl .withdrawl_dl_box dd {
    display: flex;
    align-items: center;
    width: auto;
    font-size: 14px;
    color: #FA6E00;
    font-weight: 700;
    vertical-align: top;
}
.withdrawl_dl_cont .withdrawl_dl_box dd .ico_login{
    display: block;
    width: 24px;
    height: 24px;
    margin-right: 4px;
}
.withdrawl_dl_cont .withdrawl_dl_box .withdrawl_dd .login_id_box{
    height: 20px;
}
.withdrawl_agree {
    margin-top: 33px;
}

.withdrawl_agree div.inp_check label {
    font-weight: 600;
}

.withdrawl_simple_agree {
    margin-top: 32px;
}

.withdrawl_simple_agree .withdrawl_desc {
    font-weight: 600;
    line-height: 20px;
}

.login_service_wrap.person_confirm_form .login_service_head {
    padding-top: 8px;
    padding-bottom: 26px;
}

.login_service_wrap.person_confirm_form .login_service_title {
    position: relative;
    margin: 0 -16px;
    padding-left: 56px;
}

.login_service_wrap.person_confirm_form .login_service_title:before {
    background-image: url("../img/common/ico_otp_lock.svg");
    background-size: 24px auto;
}

@media \0screen\,screen\9 {
    .login_service_wrap.person_confirm_form .login_service_title:before {
        background-image: url("../img/common/ico_otp_lock.png");
    }
}

.login_service_wrap.person_confirm_form .login_service_desc {
    margin-top: 17px;
    white-space: nowrap;
}

.login_service_wrap.person_confirm_form .login_state {
    margin: -13px 0 16px;
}

.login_service_wrap.person_confirm_form .password_confirm_form .inp_wrap:first-child .inp_box {
    margin-top: 0;
}

.login_service_wrap.person_confirm_form .password_confirm_form .btn_wrap {
    margin-top: 16px;
}

.login_service_wrap.person_confirm_form .person_confirm_form .btn_wrap {
    margin-top: 16px;
}

.section_sub {
    position: relative;
    margin: 0 auto;
    padding: 34px 0;
    width: 100%;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 768px) {
    .section_sub {
        padding: 34px 16px;
        min-height: 100vh;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -o-box-sizing: border-box;
        box-sizing: border-box;
    }
}

.section_sub:after {
    content: '';
    display: block;
    clear: both;
}

.section_sub .sub_container {
    margin-top: 34px;
}

.myinfo_wrap {
    position: relative;
    margin: 0 auto;
    max-width: 328px;
    width: 100%;
}

.myinfo_wrap .txt_title{font-size:20px;letter-spacing:-0.6px;line-height:1.4}

.myinfo_info_wrap{margin-top:17px}

.myinfo_wrap .myinfo_title {
    margin-bottom: 32px;
}

.myinfo_wrap .myinfo_info_item {
    display: table;
    table-layout: fixed;
    width: 100%;
    padding: 18px 0px;
    border-bottom: 1px solid rgba(0,0,0,0.12)
}

.myinfo_wrap .myinfo_info_item:first-child {
    margin-top: 0;
}

.myinfo_wrap .myinfo_info_item.type_tel .myinfo_info_val {
    padding-right: 70px;
}

.myinfo_wrap .myinfo_info_item.myinfo_address {
    padding-right: 0;
    padding-bottom: 49px;
}

.myinfo_wrap .myinfo_info_item.myinfo_address .myinfo_info_title,
.myinfo_wrap .myinfo_info_item.myinfo_address .myinfo_info_content {
    vertical-align: top;
}

.myinfo_wrap .myinfo_info_item.myinfo_address .btn_wrap {
    margin: 0;
    top: auto;
    bottom: -49px;
}

.myinfo_wrap .myinfo_info_item.myinfo_address .myinfo_info_address {
    display: table-cell;
    min-height: 36px;
    font-size: 14px;
    font-weight: 600;
    text-align: left;
    vertical-align: middle;
}

.myinfo_wrap .myinfo_info_item.myinfo_address .myinfo_info_address * {
    display: block;
    font-size: 14px;
    font-weight: 600;
    word-break: break-all;
}

.myinfo_wrap .myinfo_info_item.myinfo_address .myinfo_info_address .post_num {
    display: block;
}

.myinfo_wrap .myinfo_info_item.myinfo_address.no-data {
    padding-bottom: 0;
}

.myinfo_wrap .myinfo_info_item.myinfo_address.no-data .myinfo_info_title,
.myinfo_wrap .myinfo_info_item.myinfo_address.no-data .myinfo_info_content {
    vertical-align: middle;
}

.myinfo_wrap .myinfo_info_item.myinfo_address.no-data .btn_wrap {
    margin: -18px 0 0;
    top: 50%;
    bottom: auto;
}

.myinfo_wrap .myinfo_info_title, .myinfo_wrap .myinfo_info_content {
    display: table-cell;
    color: #242424;
    line-height: 20px;
    text-align: left;
    vertical-align: middle;
}

@media \0screen\,screen\9 {
    .myinfo_wrap .myinfo_info_title, .myinfo_wrap .myinfo_info_content {
        color: #4a4a4a;
    }
}

.myinfo_wrap .myinfo_info_title {
    width: 77px;
    font-weight: 400;
}

.myinfo_wrap .myinfo_info_content {
    position: relative;
    padding-right: 55px;
}

.myinfo_wrap .myinfo_info_content .btn_wrap {
    position: absolute;
    top: 50%;
    right: 0;
    margin: -15px 0 0;
    line-height: 0;
    font-size: 0;
    white-space: nowrap;
    vertical-align: top;
}

.myinfo_wrap .myinfo_info_content .btn_type {
    min-height: 30px;
    margin-left: 10px;
}

.myinfo_wrap .myinfo_info_content .btn_type:first-child {
    margin-left: 0;
}

.myinfo_wrap .myinfo_info_content .btn_type .btn_text {
    padding: 0 12px;
    line-height: 1;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val {
    display: table-cell;
    min-height: 36px;
    vertical-align: middle;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id {
    position: relative;
    padding-left: 28px;
    font-size: 14px;
    line-height:20px;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id:before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 24px;
    height: 24px;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_default {
    padding-left: 0;
}

@media \0screen\,screen\9 {
    .myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_default {
        color: #4a4a4a;
    }
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_naver:before {
    background: url("../img/common/ico_id_sns_naver@2x.png") no-repeat 0 0;
    background-size: 24px auto;
    background: url("../img/common/ico_id_sns_naver.png") no-repeat 0 0 \0/IE8;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_payco:before {
    background: url("../img/common/ico_id_sns_payco@2x.png") no-repeat 0 0;
    background-size: 24px auto;
    background: url("../img/common/ico_id_sns_payco.png") no-repeat 0 0 \0/IE8;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_facebook:before {
    background: url("../img/common/ico_id_sns_facebook@2x.png") no-repeat 0 0;
    background-size: 24px auto;
    background: url("../img/common/ico_id_sns_facebook.png") no-repeat 0 0 \0/IE8;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_google:before {
    background: url("../img/common/ico_id_sns_google@2x.png") no-repeat 0 0;
    background-size: 24px auto;
    background: url("../img/common/ico_id_sns_google.png") no-repeat 0 0 \0/IE8;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_sayclub:before {
    background: url("../img/common/ico_id_sns_sayclub@2x.png") no-repeat 0 0;
    background-size: 24px auto;
    background: url("../img/common/ico_id_sns_sayclub.png") no-repeat 0 0 \0/IE8;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_gamecenter:before {
    background: url("../img/common/ico_gamecenter.svg") no-repeat 0 0;
    background-size: 24px auto;
    background: url("../img/common/ico_gamecenter.png") no-repeat 0 0 \0/IE8;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_apple:before {
    background: url("../img/common/ico_apple_v2.svg") no-repeat 0 0;
    background-size: 24px auto;
    background: url("../img/common/ico_apple_v2.png") no-repeat 0 0 \0/IE8;
}

.myinfo_wrap .myinfo_info_content .myinfo_info_val .multi_id.multi_navergame:before {
    background: url("../img/common/ico_navergame@2x.png") no-repeat 0 0;
    background: url("../img/common/ico_navergame.svg") no-repeat 0 0;
    background-size: 24px auto;
    background: url("../img/common/ico_navergame.png") no-repeat 0 0 \0/IE8;
}

.myinfo_wrap .myinfo_caution {
    margin: 20px 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    .myinfo_wrap .myinfo_caution {
        background-color: #f5f5f5;
    }
}

.myinfo_wrap .btn_wrap {
    margin-top: 24px;
}

.myinfo_wrap .btn_wrap a:only-child{
    width: 100%;
}

.txt_list li {
    position: relative;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.72);
    line-height: 20px;
}

.txt_list li:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

@media \0screen\,screen\9 {
    .txt_list li {
        color: #4a4a4a;
    }
}

.txt_list_box .txt_list.bult{margin-top: 20px}
.txt_list_box .txt_list.bult li{position: relative;margin-left: 11px;font-weight: 400}
.txt_list_box .txt_list.bult li::after{display: inline-block;position: absolute;top: 8px;left: -11px;width: 3px;height: 3px;background: #9e9e9e;content: '';}
.txt_list_box .txt_list.bult li + li{margin-top:8px}

/* 한게임 레거시 개편 2차 마이페이지 개편에 따른 신규 디자인 스타일 추가 */
.myinfo_pop_wrap {
    width: 560px;
    background-color: #fff;
}
.myinfo_pop_tit {
    padding: 16px 24px;
    background-color: rgba(0,0,0,0.72);
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    line-height: 24px;
}
.myinfo_pop_content {
    padding: 24px 24px 28px;
}
.myinfo_pop_body {
    margin-bottom: 24px;
}
.myinfo_pop_table {
    border: 1px solid rgba(0,0,0,0.38);
    border-width: 1px 0;
}
.myinfo_pop_table table {
    width: 100%;
    table-layout: fixed;
}
.myinfo_pop_table th, .myinfo_pop_table td {
    padding: 18px 20px;
    border-top: 1px solid #d9d9d9;
    font-weight: 400;
    text-align: left;
    color: #242424;
}
.myinfo_pop_table tr:first-child th, .myinfo_pop_table tr:first-child td{
    border-top: 0;
}
.myinfo_pop_table th {
    background-color: #f9f9f9;
}
.myinfo_pop_table .info_wrap {
    font-size: 0;
    white-space: nowrap;
}
.myinfo_pop_table .info_val {
    display: inline-block;
    width: 254px;
    font-size: 14px;
    line-height: 22px;
    vertical-align: middle;
    white-space: normal;
    word-break: break-all;
}
.myinfo_pop_table .post_num {
    display: block;
}
.myinfo_pop_table .id_wrap {
    font-size: 0;
}
.myinfo_pop_table .id_wrap .id_ico {
    display: inline-block;
    overflow: hidden;
    width: 24px;
    height: 24px;
    margin: -1px 4px -1px 0;
    font-size: 1px;
    line-height: 99px;
    background-size: 24px auto;
    background-repeat: no-repeat;
    vertical-align: middle;
}
.myinfo_pop_table .id_appleid {
    background-image: url('../img/common/ico_id_sns_apple@2x.png');
}
.myinfo_pop_table .id_facebook {
    background-image: url('../img/common/ico_id_sns_facebook@2x.png');
}
.myinfo_pop_table .id_iosgamecenter {
    background-image: url('../img/common/ico_id_sns_gamecenter@2x.png');
}
.myinfo_pop_table .id_google {
    background-image: url('../img/common/ico_id_sns_google@2x.png');
}
.myinfo_pop_table .id_naver {
    background-image: url('../img/common/ico_id_sns_naver@2x.png');
}
.myinfo_pop_table .id_payco {
    background-image: url('../img/common/ico_id_sns_payco@2x.png');
}
.myinfo_pop_table .id_sayclub {
    background-image: url('../img/common/ico_id_sns_sayclub@2x.png');
}
.myinfo_pop_table .id_navergame {
    background-image: url('../img/common/ico_id_sns_navergame@2x.png');
}
.myinfo_pop_table .id_wrap .id_text {
    display: inline-block;
    font-size: 14px;
    vertical-align: middle;
}
.myinfo_pop_table .info_btn_area {
    display: inline-block;
    width: 128px;
    margin: -4px -20px -4px 0;
    text-align: right;
    vertical-align: middle;
}
.myinfo_pop_table .info_btn_area .btn_type6 + .btn_type6 {
    margin-left: 8px;
}
.myinfo_pop_notice {
    margin-top: 20px;
}
.myinfo_pop_notice li {
    font-size: 14px;
    line-height: 24px;
    color: #242424;
}
.myinfo_pop_notice li:before {
    display: inline-block;
    width: 2px;
    height: 2px;
    margin-right: 4px;
    background-color: rgba(0,0,0,.72);
    vertical-align: middle;
    content: '';
}
.myinfo_pop_btn_area {
    font-size: 0;
    text-align: right;
}
.myinfo_pop_btn_area .btn_type5 + .btn_type5 {
    margin-left: 12px;
}


/* 23.06.22 간편로그인 SDK 개선 */

.btn_login.simple {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 56px;
    padding: 0 18px;
    border: 1px solid rgba(0, 0, 0, 0.72);
    border-radius: 4px;
    background: #fff;
    text-align: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.btn_login.simple .btn_text {
    display: block;
    height: 100%;
    line-height: 52px;
    color: #242424;
    font-size: 14px;
    font-weight: 700;
}
.btn_login.simple .btn_dialog_close {
    z-index: 10;
    display: block;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 24px;
    height: 24px;
    background: url("../img/common/ico_input_delete.svg") no-repeat center;
    background-size: 24px auto;
}
.btn_login.simple_add {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 56px;
    padding: 0 18px;
    border: 1px solid rgba(0, 0, 0, 0.72);
    border-radius: 4px;
    background: #fff;
    text-align: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.btn_login.simple_add .btn_text {
    display: block;
    height: 100%;
    line-height: 52px;
    color: rgba(0, 0, 0, 0.38);
    font-size: 14px;
    font-weight: 700;
}
.btn_login.simple_add .btn_dialog_plus {
    z-index: 10;
    display: block;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 24px;
    height: 24px;
    background: url("../img/common/ico_plus.svg") no-repeat center;
    background-size: 24px auto;
}

.pop_dialog_wrap.type3 .pop_dialog_inner {
    width: 328px;
    padding: 24px 24px 24px 24px;
}

.pop_dialog_wrap.type3 .pop_select_title {
    font-size:16px;
    line-height:24px;
}

.pop_dialog_wrap.type3 .pop_select_area {
    padding-top:22px;
    font-size:0;
}

.pop_select_area .pop_select_list .pop_select_item{
    display:inline-block;
    width:134px;
    height:56px;
    box-sizing: border-box;
}

.pop_select_area .pop_select_list .pop_select_item:nth-child(even){
    margin:12px 0 0 12px;
}

.pop_select_area .pop_select_list .pop_select_item:nth-child(2){
    margin-top:0;
}

.pop_select_area .pop_select_list .pop_select_item .btn_type2{
    width:100%;
    font-family:'notoSansKr', sans-serif;
}

.pop_select_area .pop_select_list .pop_select_item .btn_type2:hover,
.pop_select_area .pop_select_list .pop_select_item.is_active .btn_type2{
  padding: 17px 0;
  background-color: transparent;
  border: 2px solid #FA6E00;
}

.pop_select_area .pop_select_list .pop_select_item .btn_type2:hover .btn_text,
.pop_select_area .pop_select_list .pop_select_item.is_active .btn_type2 .btn_text{
  color: #FA6E00;
}

.pop_select_area .pop_select_list .pop_select_item .btn_type2 .btn_text{
    font-size:14px;
    line-height:20px;
}

.login_easy_wrap {
    padding-top: 16px;
}
.login_easy_wrap .btn_wrap.col_full {
    margin-top: 14px;
}
.login_easy_title {
    font-size: 16px;
}
.login_easy_desc {
    margin-top: 20px;
    color: rgba(0, 0, 0, 0.72);
    line-height: 1.4;
}
.login_easy_form {
    margin-top: 20px;
}
.login_easy_form .btn_wrap {
    margin-top: 12px;
}
.login_easy_guide {
    margin-top: 3px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.38);
    line-height: 1.3;
}
.login_easy_logout {
    margin-top: 23px;
}
.login_easy_logout .inp_check.is-checked label {
    font-weight: 600;
    color: #ff6f00;
}
@media \0screen\,screen\9 {
    .btn_login.simple .btn_dialog_close {
        background: url('../img/common/ico_input_delete.png') no-repeat center;
    }
    .btn_login.simple_add .btn_dialog_plus {
        background: url('../img/common/ico_plus.png') no-repeat center;
    }
}

/* 비밀번호 찾기 팝업 */
.find_pw_wrap .title{
    font-size:20px;
    line-height:28px;
    color:#242424
}

.find_pw_wrap .login_service_desc{
    margin-top:16px;
    font-size:14px;
    line-height:20px;
    color:#242424
}

.find_pw_wrap .login_state{
    margin-top:24px
}

.find_pw_wrap .password_chnage_logout{
    margin-top:24px
}

.find_pw_wrap .inp_check .inp_text{
    font-weight:700;
    color:rgba(0,0,0,0.72)
}

.inp_wrap.type_birth{
    font-size:0;
}

.inp_wrap.type_birth .inp_box{
    display:inline-block;
    width:205px;
    margin-top:0;
    vertical-align: middle;
}
.inp_wrap.type_register .inp_box{
    margin-top:0;
}
.inp_wrap.type_register .type_birth{
    display:inline-block;
    width:213px;
}
.inp_wrap.type_register .type_gender{
    display:inline-block;
    padding:0 16px;
    width:46px;
    margin-right:4px;
}
.inp_wrap.type_register .type_gender label{
    opacity: 0;
    transition: none;
}
.inp_wrap.type_register .persnal_number{
    display:inline-block;
    font-size:14px;
    color: #474747;
}
.inp_wrap.type_register .dash{
    display:inline-block;
    margin:0 8px;
    font-size: 14px;
    font-weight: 700;
}
.inp_box.type_certi{
    display:inline-block;
    margin-top:0;
    vertical-align: middle;
    padding-right: 100px;
}
.inp_wrap.certi_wrap .type_certi+.type_certi{
    margin-top: 16px;
}
.certi_wrap .select_box{
    position: relative;
    display:none;
    width:100px;
    height:56px;
    border-radius: 4px;
    box-sizing: border-box;
    vertical-align: middle;
}
.certi_wrap.is-show .select_box{
    display:inline-block;
}
.certi_wrap .select_box:before{
    content: '';
    z-index: -1;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid #474747;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
.certi_wrap .select_box:after{
    content: '';
    position: absolute;
    top: 50%;
    right: 12px;
    width: 24px;
    height: 24px;
    margin-top:-12px;
    background:url(../img/common/ico_arrow_chevron_down.png) no-repeat;

}
.certi_wrap .select_btn{
    width:100%;
    padding: 17px 32px 17px 17px;
    overflow:hidden;
    white-space: nowrap;
    word-break: break-all;
    text-overflow: ellipsis;
    font-family: 'notoSansKr';
    font-size: 14px;
}

.certi_wrap.is-show .inp_box{
    width:220px;
    margin-left:8px;
    margin-top: 0;
    display:inline-block;
    vertical-align: middle;
}

.certi_wrap.is-show .type_certi.inp_certification{
    width: 100%;
    margin-left: 0;
}

input[type=radio]{
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border: 0;
    font-size: 0;
    color: transparent;
    text-indent: -9999px;
}

.radio_box{
    display:inline-block;
    position:relative;
    vertical-align: middle;
}

.radio_box .label_radio{
    display: block;
    height: 24px;
    padding: 0 0 0 28px;
    border: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: rgba(0,0,0,0.72);
    cursor: pointer;
}

.radio_box .label_radio:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 24px;
    height: 24px;
    background: url(../img/common/bg_radio.png) no-repeat;
    background-size: 100% auto;
    content: '';
}

.radio_box .inp_radio:checked + .label_radio:before{
    background-image: url(../img/common/bg_radio_on.png)
}

.radio_box .label_radio .inp_text{
    font-size:14px;
    line-height:20px;
    color:#242424
}

.type_birth .inp_box + .radio_box{
    margin-left:21px
}

.type_birth .radio_box + .radio_box{
    margin-left:16px
}

.block_join_wrap .txt_title {
    display: block;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    margin-top: 24px;
}

.block_join_wrap .txt_desc {
    margin-top: 16px;
    padding: 16px;
    font-size: 14px;
    line-height: 20px;
    background: rgba(0, 0, 0, 0.04);
}

.block_join_wrap .txt_desc li, .block_join_wrap .txt_desc p {
    position: relative;
    margin-top: 8px;
    color: rgba(0, 0, 0, 0.72);
}

.block_join_wrap .txt_desc .emph_b {
    font-size: 17px;
    font-weight: 600;
    line-height: 22px;
}

.block_join_wrap .txt_desc li:first-child {
    margin-top: 0;
}

.block_join_wrap .txt_desc li.emph_r {
    color: #ff3b30;
}

.block_join_wrap .txt_desc .list_bullet li {
    padding-left: 11px;
}

.block_join_wrap .txt_desc .list_bullet li:first-child {
    margin-top: 0;
}

.block_join_wrap .txt_desc .list_bullet li:before {
    display: block;
    position: absolute;
    left: 0;
    top: 10px;
    content: '';
    width: 3px;
    height: 3px;
    background: rgba(0, 0, 0, 0.38);
}

.block_join_wrap .text_area_box {
    margin-top: 16px;
}
.block_join_wrap .text_area_box .text_area {
    font-size:0;
    line-height:0;
}
.block_join_wrap .text_area_box .text_area iframe {
    width: 100%;
}
.block_join_wrap .text_area_box .text_area .terms_cont {
    height: 370px;
    overflow: auto;
    background: #f8f8f8;
    font-family: Apple-Gothic,"Malgun Gothic",Dotum,"돋움",Gulim,"굴림",Helvetica,NanumGothic,"나눔고딕";
}
.block_join_wrap .text_area_box .text_area .terms_cont.type_2 {
    height: 300px;
}
.block_join_wrap .text_area_box .text_area .terms_cont * {
    word-break: break-all;
}
/*  기존소스 가져옴 :: 이용약관 _ PC약관을 Mobile룩과 비슷하게 작업*/
.terms_cont .m01t:first-child{padding-top:17px}
.terms_cont .m01t,
.terms_cont .d2,
.terms_cont .align_box{padding:5px 10px 15px;color:#666;line-height:17px;font-size:12px}
.terms_cont .d2 > li + li {margin-top: 15px;}
.terms_cont .title_h2{display:block;padding:15px 10px;color:#000;font-size:16px}
.terms_cont .title_h3{display:block;color:#000;font-size:13px}
.terms_cont .m0{padding-top:5px}
.terms_cont .m0 a{color:#666;text-decoration:underline}
.terms_cont .outer_bx{display:none;padding-top:10px}
.terms_cont .border_bx{margin:10px 0px 10px;padding:10px;border:1px solid #dbdbdb}
.terms_cont .privacy_data{border-collapse:collapse;width:100%;border:0;margin-bottom:10px;color:#666;line-height:17px;font-size:12px}
.terms_cont .privacy_data th,
.terms_cont .privacy_data td{padding:10px 5px;border:1px solid #000;font-size:11px;font-weight:normal;text-align:center;letter-spacing:-1px}
.terms_cont .privacy_data th{background-color:#eee;font-weight:bold}
.terms_cont .cbox05_m{margin:5px 0 10px;padding:10px;border:1px solid #d4d4d4;background:#fff}
.terms_cont .cbox05_m{margin:0 0 0;font-size:12px;color:#333}
.terms_cont .cbox05_m{margin:5px 0 10px; font-size:12px;color:#777}
.terms_cont .align_box{margin-top:15px;line-height:normal}
.terms_cont .align_box .cnt{display:inline-block;padding:0;line-height:20px;vertical-align:middle}
.terms_cont .align_box .sel {display:inline-block;margin-left:10px;border:1px solid #ddd;font-size:12px;vertical-align:middle}


.block_join_wrap .text_area_box .text_area iframe.type_1 {
    height: 370px;
}
.block_join_wrap .text_area_box .text_area iframe.type_2 {
    height: 300px;
}

.login_wrap .state_emphasis.type2 {
    padding: 0 0 0 16px;
}

.login_wrap .state_emphasis.type2 .emphasis_type {
    width: 328px;
}

.login_wrap .state_emphasis.type2 .emphasis_desc {
    margin-top: 12px;
    font-size: 20px!important;
    letter-spacing: -0.6px;
    color: #242424;
}

.login_wrap .state_emphasis.type2 .emphasis_detail {
    margin-top: 16px;
    color: #242424;
}
.login_wrap .state_emphasis.type_certi {
    padding: 0;
}

.login_wrap .state_emphasis.type_certi .emphasis_desc{
    font-size: 20px;
    margin-bottom: 24px;
}

.login_wrap .login_my_id_wrap .txt_title {
    font-size: 20px;
    letter-spacing: -0.6px;
    line-height: 1.4;
}

.login_wrap .login_my_id_wrap .txt_title.title_style2 {
    margin-bottom:24px;
}

.login_wrap .login_my_id_wrap .txt_desc {
    margin-top:16px;
    margin-bottom:24px;
    line-height:20px;
}

.login_wrap .login_inwrap .txt_title + .login_form{
    margin-top: 24px;
}

.login_id_list {
    margin-top: 24px;
}

.login_id_list.list_style2 {
    margin-top: 0;
}

.login_id_list li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 56px;
    padding: 0 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    word-break: break-all;
    box-sizing: border-box;
    font-size: 0;
}

.login_id_list .it_can_check {
    padding: 0 54px 0 16px;
}

.login_id_list span {
    flex: 1;
    color: #242424;
    line-height: 20px;
    font-size: 14px;
}

.login_id_list .ico_login + span {
    margin-left: 4px;
}

.login_id_list .it_can_check em {
    color: #ff6f00;
    font-weight: 700;
}

.login_id_list em {
    color: rgba(0, 0, 0, 0.38);
}

.login_id_list .inp_wrap {
    position: absolute;
    right: 16px;
}

.login_id_list .inp_check {
    font-size: 0;
}

.login_id_list .ico_login,
.withdrawl_dl_box .ico_login {
    display: block;
    width: 24px;
    height: 24px;
}
.login_id_list .ico_login.payco,
.withdrawl_dl_box .ico_login.payco {
    background: url("../img/common/ico_payco_v2.svg") no-repeat center;
}

@media \0screen\,screen\9 {
    .login_id_list .ico_login.payco,
    .withdrawl_dl_box .ico_login.payco {
        background: url("../img/common/ico_payco_v2.png") no-repeat center;
    }
}

.login_id_list .ico_login.google,
.withdrawl_dl_box .ico_login.google {
    background: url("../img/common/ico_google.svg") no-repeat center;
}


@media \0screen\,screen\9 {
    .login_id_list .ico_login.google,
    .withdrawl_dl_box .ico_login.google {
        background: url("../img/common/ico_google.png") no-repeat center;
    }
}

.login_id_list .ico_login.naver,
.withdrawl_dl_box .ico_login.naver {
    background: url("../img/common/ico_naver.svg") no-repeat center;
}

@media \0screen\,screen\9 {
    .login_id_list .ico_login.naver,
    .withdrawl_dl_box .ico_login.naver {
        background: url("../img/common/ico_naver.png") no-repeat center;
    }
}

.login_id_list .ico_login.appleid,
.withdrawl_dl_box .ico_login.appleid {
    background: url("../img/common/ico_apple_v2.svg") no-repeat center;
}

@media \0screen\,screen\9 {
    .login_id_list .ico_login.appleid,
    .withdrawl_dl_box .ico_login.appleid {
        background: url("../img/common/ico_apple_v2.png") no-repeat center;
    }
}

.login_id_list .ico_login.facebook,
.withdrawl_dl_box .ico_login.facebook {
    background: url("../img/common/ico_facebook.svg") no-repeat center;
}

@media \0screen\,screen\9 {
    .login_id_list .ico_login.facebook,
    .withdrawl_dl_box .ico_login.facebook {
        background: url("../img/common/ico_facebook.png") no-repeat center;
    }
}

.login_id_list .ico_login.iosgamecenter,
.withdrawl_dl_box .ico_login.iosgamecenter {
    background: url("../img/common/ico_gamecenter.svg") no-repeat 0 0;
}

@media \0screen\,screen\9 {
    .login_id_list .ico_login.iosgamecenter,
    .withdrawl_dl_box .ico_login.iosgamecenter {
        background: url("../img/common/ico_gamecenter.png") no-repeat 0 0;
    }
}

.login_id_list .ico_login.sayclub,
.withdrawl_dl_box .ico_login.sayclub {
    background: url("../img/common/ico_sayclub.svg") no-repeat 0 0;
}

@media \0screen\,screen\9 {
    .login_id_list .ico_login.sayclub,
    .withdrawl_dl_box .ico_login.sayclub {
        background: url("../img/common/ico_sayclub.png") no-repeat 0 0;
    }
}

.login_id_list .ico_login.navergame,
.withdrawl_dl_box .ico_login.navergame {
    background: url("../img/common/Ico_navergame@2x.png") no-repeat 0 0;
    background: url("../img/common/ico_navergame.svg") no-repeat 0 0;
}

@media \0screen\,screen\9 {
    .login_id_list .ico_login.navergame,
    .withdrawl_dl_box .ico_login.navergame {
        background: url("../img/common/ico_navergame.png") no-repeat 0 0;
    }
}

.login_id_list + .txt {
    margin-top: 16px;
}

.login_wrap .login_my_id_wrap .txt {
    color: #242424;
    font-size: 14px;
    line-height: 20px;
}

.login_wrap .login_my_id_wrap .btn_wrap.col_full + .txt {
    margin-top: 24px;
}

.login_wrap .login_my_id_wrap .btn_type.btn_lock {
    margin-top: 16px;
    padding: 9px 0 9px 12px;
    border-color: rgba(0, 0, 0, 0.38);
}

.login_wrap .login_my_id_wrap .btn_type.btn_lock:hover {
    background: rgba(0, 0, 0, 0.04);
}

.login_wrap .login_my_id_wrap .btn_type.btn_lock:active {
    background: rgba(0, 0, 0, 0.08);
}

.login_wrap .login_my_id_wrap .btn_type.btn_lock[disabled] {
    border: 1px solid rgba(0, 0, 0, 0.12);
    cursor: default;
}

.login_wrap .login_my_id_wrap .btn_type.btn_lock[disabled]:hover {
    background: #fff;
}

.login_wrap .login_my_id_wrap .btn_type.btn_lock[disabled] .btn_text {
    color: rgba(0, 0, 0, 0.12);
}

.login_wrap .login_my_id_wrap .btn_type.btn_lock .btn_text  {
    padding: 0 12px 0 24px;
    color: rgba(0, 0, 0, 0.38);
    font-weight: 700;
    background: url("../img/common/ico_lock_on2.svg") no-repeat 0 0;
    background-size: auto 20px;
}

.login_wrap.type_user .type_register{
    display:none;
}

.login_wrap.type_user .btn_wrap{
    display:block;
    line-height: 0;
}

@media \0screen\,screen\9 {
    .login_wrap .login_my_id_wrap .btn_type.btn_lock .btn_text  {
        background: url("../img/common/ico_lock_on2.png") no-repeat 0 0;
        background-size: auto 20px;
    }
}

.login_wrap .login_my_id_wrap .btn_type.btn_lock[disabled] .btn_text  {
    background: url("../img/common/ico_lock_disabled.svg") no-repeat 0 0;
    background-size: auto 20px;
}

@media \0screen\,screen\9 {
    .login_wrap .login_my_id_wrap .btn_type.btn_lock[disabled] .btn_text  {
        background: url("../img/common/ico_lock_disabled.png") no-repeat 0 0;
        background-size: auto 20px;
    }
}

.login_wrap .login_my_id_wrap .login_state {
    display: none;
    margin-top: 24px;
    margin-bottom: 16px;
}

.login_wrap .type_disabled input{
    font-size:14px;
}

/* //////////////////////////////////
join
////////////////////////////////// */

.join_wrap {
    position: relative;
    margin: 0 auto;
    max-width: 400px;
    width: 100%;
}

@media screen and (min-width: 994px) {
    .join_wrap.finish {
        float: none;
        margin: 0 auto;
    }
}

.logo_hangame {
    display: block;
    width: 140px;
    height: 20px;
    background: url("../img/logo/logo_login_hangame.svg") no-repeat 0 0;
    background-size: 140px auto;
}

@media \0screen\,screen\9 {
    .logo_hangame {
        background: url("../img/logo/logo_login_hangame.png") no-repeat 0 0;
    }
}

.join_container {
    margin-top: 56px;
}

.join_wrap .txt_title {
    font-size: 24px;
    line-height: 32px;
}

.join_wrap .txt_title .login_status_txt{
    display:block;
}

.join_wrap .txt_title .txt_b {
    font-weight: 700;
}

.join_select_id_wrap .btn_wrap {
    margin-top: 40px;
}

.join_wrap .line_through_text {
    margin-top: 24px;
    line-height: 16px;
}

.join_wrap .line_through_text:before {
    content: '';
    display: inline-block;
    height: 1px;
    width: 176px;
    background: rgba(0, 0, 0, 0.12);
    vertical-align: middle;
}

.join_wrap .line_through_text:after {
    content: '';
    display: inline-block;
    height: 1px;
    width: 176px;
    background: rgba(0, 0, 0, 0.12);
    vertical-align: middle;
}

.join_wrap .line_through_text span {
    display: inline-block;
    padding: 0 13px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.38);
    line-height: 16px;
    vertical-align: middle;
}

@media \0screen\,screen\9 {
    .join_wrap .line_through_text:before {
        background: #e0e0e0;
    }

    .join_wrap .line_through_text:after {
        background: #e0e0e0;
    }

    .join_wrap .line_through_text span {
        color: #b7b8b7;
    }
}

.join_wrap .line_through {
    margin-top: 24px;
    line-height: 16px;
}

.join_wrap .line_through:before {
    content: '';
    display: inline-block;
    height: 1px;
    width: 100%;
    background: rgba(0, 0, 0, 0.12);
    vertical-align: middle;
}

@media \0screen\,screen\9 {
    .join_wrap .line_through:before {
        background: #e0e0e0;
    }
}

@media screen and (max-width: 943px) {
    .join_wrap {
        max-width: 328px;
    }

    .join_wrap .line_through_text:before {
        width: 140px;
    }

    .join_wrap .line_through_text:after {
        width: 140px;
    }
}

.join_method_list {
    margin-top: 24px;
}

.join_method_list li {
    height: 56px;
    margin-top: 16px;
    border: 1px solid rgba(0, 0, 0, 0.38);
    border-radius: 4px;
    box-sizing: border-box;
}

@media \0screen\,screen\9 {
    .join_method_list li {
        border: 1px solid #b7b8b7;
    }
}

.join_method_list a {
    display: table;
    padding: 0 24px;
    width: 100%;
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.join_method_list a:hover {
    background: rgba(0, 0, 0, 0.04);
}

.join_method_list a:active {
    background: rgba(0, 0, 0, 0.08);
}

@media \0screen\,screen\9 {
    .join_method_list a:hover {
        background: #f5f5f5;
    }

    .join_method_list a:active {
        background: #ebebeb;
    }
}

.join_method_list i,.join_method_list span {
    display: table-cell;
    vertical-align: middle;
}

.join_method_list i {
    width: 24px;
    height: 24px;
}

.join_method_list .ico_payco2 {
    background: url("../img/logo/logo_payco3_v2.svg") no-repeat center center;
}

.join_method_list .ico_google2 {
    background: url("../img/logo/logo_google3.svg") no-repeat center center;
}

.join_method_list .ico_facebook2 {
    background: url("../img/logo/logo_facebook3.svg") no-repeat center center;
}

.join_method_list .ico_naver2 {
    background: url("../img/logo/logo_naver3.svg") no-repeat center center;
}

.join_method_list .ico_apple2 {
    background: url("../img/logo/logo_apple3_v2.svg") no-repeat center center;
}

@media \0screen\,screen\9 {
    .join_method_list .ico_payco2 {
        background: url("../img/logo/logo_payco3_v2.png") no-repeat center center;
    }

    .join_method_list .ico_google2 {
        background: url("../img/logo/logo_google3.png") no-repeat center center;
    }

    .join_method_list .ico_facebook2 {
        background: url("../img/logo/logo_facebook3.png") no-repeat center center;
    }

    .join_method_list .ico_naver2 {
        background: url("../img/logo/logo_naver3.png") no-repeat center center;
    }

    .join_method_list .ico_apple2 {
        background: url("../img/logo/logo_apple3_v2.png") no-repeat center center;
    }
}

.join_method_list span {
    font-size: 16px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.38);
    padding-left: 8px;
}

@media \0screen\,screen\9 {
    .join_method_list span {
        color: #9e9e9e;
    }
}

.join_terms_agree {
    margin-top: 40px;
}

.join_terms_agree .inp_wrap {
    font-size: 0;
}

.join_terms_wrap .join_terms_agree .line_through {
    margin-top: 14px;
    line-height: 0;
}

.join_terms_agree div.inp_check label {
    width: 80%;
    line-height: 24px;
    padding: 0 0 0 32px;
    font-weight: 600;
}

.join_terms_agree .each_terms_wrap .inp_wrap {
    margin-top: 16px;
}

.join_terms_agree .each_terms_wrap .inp_wrap label {
    font-weight: 400;
}

.join_terms_agree .each_terms_wrap .inp_wrap label span {
    line-height: 20px;
    padding-top: 2px;
}

.join_terms_agree .each_terms_wrap li {
    position: relative;
}

.join_terms_agree .each_terms_wrap li:first-child .inp_wrap {
    margin-top: 9px;
}

.each_terms_wrap .btn_text {
    position: absolute;
    right: 0;
    top: 2px;
    height: 24px;
    color: rgba(0, 0, 0, 0.72);
    text-decoration: underline;
}

@media \0screen\,screen\9 {
    .join_wrap .each_terms_wrap .btn_text {
        color: #474747;
    }
}

.join_wrap .login_state {
    display: none;
    margin-top: 40px;
}

.join_wrap .login_state.is_show {
    display: block;
}

.join_wrap .login_state.is_show + .join_terms_agree {
    margin-top: 32px;
}

.pop_dialog_wrap .pop_join_wrap {
    overflow: hidden;
}

.pop_dialog_wrap.type5 .pop_dialog_inner {
    width: 400px;
    padding: 24px;
}

@media screen and (max-width: 943px) {
    .join_wrap .login_state {
        margin-top: 24px;
    }

    .pop_dialog_wrap.type5 .pop_dialog_inner {
        width: 328px;
    }
}

.pop_dialog_wrap.type5 .pop_join_title {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #242424;
    line-height: 24px;
}

.pop_dialog_wrap.type5 .pop_join_title em {
    color: #ff6e00;
    font-weight: 600;
}

.pop_dialog_wrap.type5 .pop_join_content .info_account {
    width: 24px;
    height: 24px;
    padding-left: 28px;
    line-height: 24px;
    margin-top: 14px;
    white-space: nowrap;
}

.pop_dialog_wrap.type5 .pop_join_content .info_account.payco {
    background: url("../img/logo/logo_payco3.svg") no-repeat 0 0;
}

.pop_dialog_wrap.type5 .pop_join_content .info_account.naver {
    background: url("../img/logo/logo_naver3.svg") no-repeat 0 0;
}

.pop_dialog_wrap.type5 .pop_join_content .info_account.google {
    background: url("../img/logo/logo_google3.svg") no-repeat 0 0;
}

.pop_dialog_wrap.type5 .pop_join_content .info_account.iosgamecenter {
    background: url("../img/logo/logo_gamecenter3.svg") no-repeat 0 0;
}

.pop_dialog_wrap.type5 .pop_join_content .info_account.facebook {
    background: url("../img/logo/logo_facebook3.svg") no-repeat 0 0;
}

.pop_dialog_wrap.type5 .pop_join_content .info_account.appleid {
    background: url("../img/logo/logo_apple3_v2.svg") no-repeat 0 0;
}

.pop_dialog_wrap.type5 .pop_join_content .info_account.sayclub {
    background: url("../img/logo/logo_sayclub.svg") no-repeat 0 0;
}

@media \0screen\,screen\9 {
    .pop_dialog_wrap.type5 .pop_join_content .info_account.payco {
        background: url("../img/logo/logo_payco3.png") no-repeat 0 0;
    }

    .pop_dialog_wrap.type5 .pop_join_content .info_account.naver {
        background: url("../img/logo/logo_naver3.png") no-repeat 0 0;
    }

    .pop_dialog_wrap.type5 .pop_join_content .info_account.google {
        background: url("../img/logo/logo_google3.png") no-repeat 0 0;
    }

    .pop_dialog_wrap.type5 .pop_join_content .info_account.iosgamecenter {
        background: url("../img/logo/logo_gamecenter3.png") no-repeat 0 0;
    }

    .pop_dialog_wrap.type5 .pop_join_content .info_account.facebook {
        background: url("../img/logo/logo_facebook3.png") no-repeat 0 0;
    }

    .pop_dialog_wrap.type5 .pop_join_content .info_account.appleid {
        background: url("../img/logo/logo_apple3_v2.png") no-repeat 0 0;
    }

    .pop_dialog_wrap.type5 .pop_join_content .info_account.sayclub {
        background: url("../img/logo/logo_sayclub.png") no-repeat 0 0;
    }
}

.pop_dialog_wrap.type5 .pop_join_content .text_desc {
    margin-top: 12px;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.38);
}

@media \0screen\,screen\9 {
    .pop_dialog_wrap.type5 .pop_join_content .text_desc {
        color: #9e9e9e;
    }
}

.pop_dialog_wrap.type5 .pop_join_content .btn_text {
    padding: 0 16px;
}

.pop_dialog_wrap.type5 .pop_join_term_box {
    overflow: auto;
    width:100%;
    height: 270px;
    margin-top: 16px;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style:none;
}

.pop_dialog_wrap.type5 .pop_join_term_box::-webkit-scrollbar {
    display:none
}

@media screen and (orientation: landscape) {
    .pop_dialog_wrap.type5 .pop_join_term_box {
        height: 120px
    }
}

.pop_dialog_wrap.type5 .pop_join_term_box iframe {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.pop_dialog_wrap .pop_terms_title{
    font-size: 16px;
    color:#242424;
    line-height: 24px;
}
#termsIframe body {
    width: 800px;
}
.pop_dialog_wrap .pop_terms_contents{
    margin-top: 8px;
}

.pop_dialog_wrap .pop_terms_contents.type_2{
    margin-top: 16px;
}

.pop_dialog_wrap .pop_terms_contents.type_3{
    margin-top: 20px;
}

.pop_terms_contents .terms_agree_form{
    padding-top: 16px;
    border-top:1px solid rgba(0, 0, 0, 0.12);
}

.pop_terms_contents .terms_item .btn_text{
    top:0;
    transform: translateY(-2%);
}

.terms_agree_form .each_terms_wrap{
    margin-top: 16px;
    padding:16px 12px;
    background: rgba(0, 0, 0, 0.04);
}

.terms_agree_form .each_terms_wrap.type_2{
    padding:16px 12px 24px
}

.terms_agree_form .each_terms_wrap li{
    position: relative;
}
.terms_agree_form .each_terms_wrap li + li{
    padding-top:16px;
}

.terms_agree_form .terms_list .terms_item{
    position: relative;
    margin-top:12px;
    color:rgba(0, 0, 0, 0.72);
    line-height: 20px;
}

.terms_agree_form .terms_list.type_2 .terms_item{
    letter-spacing:-0.6px
}

.terms_agree_form .terms_list.type_2 .terms_item .btn_text{
    letter-spacing:0.1px
}

.terms_agree_form .terms_list .terms_item:first-child{
    margin-top:4px;
}

.terms_item .btn_text{
    position: absolute;
    right: 0;
    top: 2px;
    height: 24px;
    color: rgba(0, 0, 0, 0.72);
    text-decoration: underline;
}

.pop_terms_contents .pop_terms_tab{
    display:flex;
}

.pop_terms_contents .pop_terms_tab .tab_item{
    flex:1;
    border-bottom:1px solid rgba(0, 0, 0, 0.12);
    text-align: center;
}

.pop_terms_contents .pop_terms_tab .tab_item.on{
    border-bottom: 2px solid #FA6E00;
}

.pop_terms_contents .pop_terms_tab .tab_item.on .btn_text{
    font-weight: 700;
    color: #FA6E00;
}

.pop_terms_contents .terms_cont_tab .tab_item.on .btn_text{
    font-weight: 700;
}

.pop_terms_contents .pop_terms_tab .tab_item .btn_text, .terms_cont_tab .tab_item .btn_text{
    display:block;
    width:100%;
    padding:8px 0;
    line-height: 20px;
}

.pop_terms_contents .terms_cont_tab{
    display:flex;
}
.pop_terms_contents .terms_cont_tab .tab_item{
    position: relative;
    flex:1;
    text-align: center;
}
.pop_terms_contents .terms_cont_tab .tab_item + .tab_item:after{
    content:'';
    position: absolute;
    left:0;
    top: 13px;
    width:1px;
    height:10px;
    background-color: #e1e1e1;
}

.pop_terms_contents .terms_cont_box .iframe_wrap{
    overflow: auto;
    width:100%;
    height:328px;
    -webkit-overflow-scrolling: touch !important;
}

.pop_terms_tab + .terms_cont_box .iframe_wrap{
    height:266px;
}

.terms_cont_box .terms_cont_tab + .iframe_wrap{
    height:264px;
}

.pop_terms_contents .terms_cont_box .iframe_wrap iframe{
    overflow: hidden;
    display:block;
    width:100%;
    height:100%;
}

.terms_cont_box.type_2 .iframe_wrap{
    height: 300px;
}

.pop_terms_contents .terms_cont_box .terms_cont {
  overflow: auto;
  height: 300px;
  padding-top: 15px;
  background-color: #f8f8f8;
  font-family:Apple-Gothic, "Malgun Gothic", Dotum, "돋움", Gulim, "굴림", Helvetica, NanumGothic, "나눔고딕", sans-serif;
}
.pop_terms_contents .terms_cont_box .terms_cont.type_3{
    height:321px;
    padding-top:7px;
}
.pop_terms_contents .terms_cont_box .terms_cont.type_3 .d2{
    padding:5px 20px 12px 12px;
    font-family:'notoSansKr',Apple-Gothic, "Malgun Gothic", Dotum, "돋움", Gulim, "굴림", Helvetica, NanumGothic, "나눔고딕", sans-serif;
    font-size:14px;
    color:rgba(0, 0, 0, 0.72)
}
.pop_terms_contents .terms_cont_box .terms_cont .txt_b{
  font-weight: 700;
}

.pop_terms_contents .each_terms_wrap + .btn_wrap{
    margin-top: 15px;
}

@media screen and (hover:none) and (orientation: landscape) {
    .pop_terms_contents .terms_cont_box:has(.terms_cont_tab) .iframe_wrap{
        height: 88px;
    }
    .pop_terms_contents .terms_cont_box .iframe_wrap{
        height: 124px;
    }
    .pop_terms_contents .terms_cont.type_2 {
        height: 147px;
    }
    .pop_terms_contents .terms_cont_box .terms_cont.type_3 {
        height: 147px;
    }
}

.join_cert_method {
    overflow: hidden;
    width: 100%;
    margin-top: 40px;
}

.join_cert_method.has_selected .txt {
  font-weight: 400;
}

.join_cert_method.type_2 {
    margin-top: 16px;
}

.join_cert_method li {
    float: left;
    width: 192px;
    border: 1px solid rgba(0, 0, 0, 0.72);
    border-radius: 4px;
    margin-bottom: 16px;
    padding: 15px 0;
    text-align: center;
    cursor: pointer;
    line-height: 0;
    font-size: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.join_cert_method li.li_default {
    border: 1px solid #ebebeb;
    pointer-events: none;
}

.join_cert_method li:nth-child(2n){
    float: right;
}

.join_cert_method li:nth-child(2n - 1){
    clear:both;
}

.login_state.is_show + .join_cert_method {
    margin-top: 16px;
}

.join_cert_method li.li_default .txt {
    margin-top: 0;
}

.join_cert_method .txt {
    display: block;
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    margin-top: 8px;
}

.join_cert_method i {
    display: inline-block;
    width: 36px;
    height: 36px;
    text-align: center;
}

.join_cert_method .ico_phone {
    background: url("../img/common/ico_phone.svg") no-repeat 0 0;
}

.join_cert_method .ico_card {
    background: url("../img/common/ico_card.svg") no-repeat 0 0;
}

.join_cert_method .ico_pass {
    background: url("../img/common/ico_pass.svg") no-repeat 0 0;
}

.join_cert_method .ico_ipin {
    background: url("../img/common/ico_ipin.svg") no-repeat 0 0;
}

.join_cert_method .ico_payco2 {
    background: url("../img/common/ico_payco2.svg") no-repeat 0 3px;
}

.join_cert_method .ico_default {
    background: url("../img/common/ico_default.svg") no-repeat center;
    height: 64px;
}

.join_cert_method li:not(.li_default).is_selected {
  background-color: #FEEEE0;
}

.join_cert_method li:not(.li_default).is_selected, .join_cert_method li:not(.li_default):hover {
    padding: 14px 0;
    border: 2px solid #ff6f00;
}

.join_cert_method li.is_selected .txt, .join_cert_method li:hover .txt {
  font-weight: 600;
    color: #ff6f00;
}

.join_cert_method li.is_selected .ico_phone, .join_cert_method li:hover .ico_phone {
    background: url("../img/common/ico_phone_on.svg") no-repeat 0 0;
}

.join_cert_method li.is_selected .ico_card, .join_cert_method li:hover .ico_card {
    background: url("../img/common/ico_card_on.svg") no-repeat 0 0;
}

.join_cert_method li.is_selected .ico_pass, .join_cert_method li:hover .ico_pass {
    background: url("../img/common/ico_pass_on.svg") no-repeat 0 0;
}

.join_cert_method li.is_selected .ico_ipin, .join_cert_method li:hover .ico_ipin {
    background: url("../img/common/ico_ipin_on.svg") no-repeat 0 0;
}

.join_cert_method li.is_selected .ico_payco2, .join_cert_method li:hover .ico_payco2 {
    background: url("../img/common/ico_payco2_on.svg") no-repeat 0 3px;
}


@media \0screen\,screen\9 {
    .join_cert_method .ico_phone {
        background: url("../img/common/ico_phone.png") no-repeat 0 0;
    }

    .join_cert_method .ico_card {
        background: url("../img/common/ico_card.png") no-repeat 0 0;
    }

    .join_cert_method .ico_pass {
        background: url("../img/common/ico_pass.png") no-repeat 0 0;
    }

    .join_cert_method .ico_ipin {
        background: url("../img/common/ico_ipin.png") no-repeat 0 0;
    }

    .join_cert_method .ico_payco2 {
        background: url("../img/common/ico_payco2.png") no-repeat 0 3px;
    }

    .join_cert_method .ico_default {
        background: url("../img/common/ico_default.png") no-repeat 0 0;
    }

    .join_cert_method li.is_selected .ico_phone, .join_cert_method li:hover .ico_phone {
        background: url("../img/common/ico_phone_on.png") no-repeat 0 0;
    }

    .join_cert_method li.is_selected .ico_card, .join_cert_method li:hover .ico_card {
        background: url("../img/common/ico_card_on.png") no-repeat 0 0;
    }

    .join_cert_method li.is_selected .ico_pass, .join_cert_method li:hover .ico_pass {
        background: url("../img/common/ico_pass_on.png") no-repeat 0 0;
    }

    .join_cert_method li.is_selected .ico_ipin, .join_cert_method li:hover .ico_ipin {
        background: url("../img/common/ico_ipin_on.png") no-repeat 0 0;
    }

    join_cert_method li.is_selected .ico_payco2, .join_cert_method li:hover .ico_payco2 {
        background: url("../img/common/ico_payco2_on.png") no-repeat 0 3px;
    }
}

.join_wrap .txt_desc {
    line-height: 20px;
}

.id_status_wrap .txt_desc, .dormancy_id_wrap .txt_desc {
    margin-top: 16px;
}

.id_status_wrap .line_through {
    margin-top: 30px;
}

.join_wrap .txt_sub_title {
    display: block;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

.dormancy_id_wrap {
    margin-top: 30px;
}

.dormancy_id_wrap .login_state.is_show {
    margin-top: 24px;
}

.dormancy_id_wrap .login_state.is_show + .login_id_list {
    margin-top: 16px;
}

.join_input_info {
    margin-top: 40px;
}

.join_input_info .inp_validation {
    display: none;
}

.join_input_info .inp_box.type_error + .inp_validation {
    display: block;
}

.join_guardian_wrap .line_through {
    margin-top: 5px;
}

.join_guardian_wrap .txt_desc {
    margin-top: 18px;
}

.join_guardian_wrap .inp_wrap {
    margin-top: 16px;
}

.join_guardian_wrap .inp_validation {
    display: none;
}

.join_guardian_wrap .inp_box.type_error + .inp_validation {
    display: block;
}

.join_message_wrap {
    margin-top: -22px;
}

.join_message_wrap .login_state {
    display: block;
    margin-top: 0;
}

.join_wrap .state_emphasis.type2 .emphasis_desc {
    margin-top: 12px;
    font-size: 24px!important;
}

.join_message_wrap .login_result_wrap {
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.join_wrap .state_emphasis.type2 .emphasis_detail {
    margin-top: 16px;
}

.join_bullet_list {
    margin-top: 16px;
    margin-bottom: -14px;
}
.join_bullet_list li {
    font-size: 14px;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.72);
    margin-top: 8px;
    padding-left: 11px;
    text-indent: -11px;
}

.join_bullet_list li:first-child {
    margin-top: 0;
}

.join_bullet_list li:before {
    display: inline-block;
    width: 3px;
    height: 3px;
    margin-right: 8px;
    background-color: rgba(0,0,0,.38);
    vertical-align: middle;
    content: '';
}

.join_additional_info {
    margin-top: 40px;
}

.join_additional_info .inp_wrap {
    font-size: 0;
    margin-left: 16px;
}

.join_additional_info .line_through {
    margin-top: 14px;
    line-height: 0;
}

.join_additional_info div.inp_check label {
    width: 80%;
    line-height: 24px;
    padding: 0 0 0 32px;
    font-weight: 600;
}

.join_additional_info + .btn_wrap {
    margin-top: 40px;
}

.join_wrap .state_emphasis {
    padding: 0 13px;
}

@media screen and (max-width: 943px) {
    .join_container {
        margin-top: 34px;
    }

    .join_select_id_wrap .btn_wrap {
        margin-top: 24px;
    }

    .join_wrap .login_state.is_show {
        margin-top: 24px;
    }

    .join_cert_method {
        margin-top: 24px;
    }

    .join_cert_method li {
        width: calc(50% - 8px);
  }

  .join_cert_method + .btn_wrap {
    margin-top: 8px;
    }

    .join_wrap .txt_title {
        font-size: 20px;
        line-height: 28px;
    }

    .id_status_wrap .line_through {
        margin-top: 20px;
    }

    .dormancy_id_wrap {
        margin-top: 20px;
    }

    .join_input_info {
        margin-top: 24px;
    }

    .join_guardian_wrap .join_terms_agree + .line_through {
        display: none;
    }

    .join_guardian_wrap .txt_desc {
        margin-top: 32px;
    }

    .join_additional_info {
        margin-top: 24px;
    }

    .join_additional_info .inp_wrap {
        display: none;
    }

    .join_additional_info + .btn_wrap {
        margin-top: 24px;
    }

    .join_bullet_list {
        margin-top: 24px;
        margin-bottom: auto;
    }

    .join_bullet_list li {
        margin-top: 16px;
    }

    .join_wrap .state_emphasis.type2 .emphasis_desc {
        font-size: 20px!important;
    }

    .join_message_wrap {
        margin-top: auto;
    }

    .join_terms_agree div.inp_check label {
        width: 70%;
    }
}

@media screen and (min-width: 280px) and (max-width: 359px) {
    .pop_dialog_wrap.type5 .pop_dialog_inner {
        width: auto;
        margin: 0 10px;
    }
}

.inp_wrap.certi_wrap, .inp_wrap.type_register{
    font-size:0
}
.login_my_id_wrap.renew .txt_desc{
    margin-top:16px
}
.login_my_id_wrap.renew .btn_link{
    padding: 0 0 0 24px;
    line-height: 20px;
}

.pop_dialog_wrap.type6 .pop_dialog_inner{width:400px;padding:24px;color:#242424;box-shadow: 0px 24px 38px 0px rgba(0, 0, 0, 0.14), 0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 0px rgba(0, 0, 0, 0.12);}
.pop_dialog_wrap.type6 .pop_dialog_inner .txt{font-size:14px;line-height:20px}
.pop_dialog_wrap.type6 button{font-family:'notoSansKr'}

.pop_dialog_wrap.type_line .pop_dialog_inner{
    max-width: 328px;
    width: 100%;
    padding: 24px;
}
.pop_dialog_wrap.type_line .pop_title {
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    display: block;
    font-size: 16px;
    line-height: 24px;
    padding-right: 20px;
    box-sizing: border-box;
    color: #242424;
}
.pop_dialog_wrap.type_line .pop_error_lst {
    margin-top: 16px;
}
.pop_dialog_wrap.type_line  .pop_error_lst dl + dl {
    margin-top: 12px;
}
.pop_dialog_wrap.type_line .pop_error_lst dt {
    display: inline-block;
    width: 40px;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    margin-right:4px;
    vertical-align: top;
    color: rgba(0, 0, 0, 0.72);
}
.pop_dialog_wrap.type_line .pop_error_lst dd {
    display: inline-block;
    width: calc(100% - 51px);
    font-size: 14px;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.72);
}
.pop_dialog_wrap.type_line .pop_error_lst .error_message {
    margin-top: -2px;
}

.pop_dialog_wrap.type_line .pop_dialog_button button {
    min-height: 40px;
}
.type_line .pop_dialog_button [class^="btn_type"] .btn_text {
    font-weight: 700;
    font-family: 'notoSansKr';
}

.pop_dialog_wrap.pop_depth{
    z-index:115;
}

.pop_dialog_wrap.pop_depth p{
    line-height:20px;
    color:#242424
}

/* 네이버 채널링 */
.wrap_channeling .bg_area{overflow:hidden;position:relative;height:250px;background-color:#0f090d}
.wrap_channeling .bg_area img{position:absolute;top:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);height:250px}
.wrap_channeling .section{min-height:714px;margin:0 auto;padding:30px 0 58px;box-sizing:border-box}
.wrap_channeling .join_header{margin:34px 0}
.wrap_channeling .terms_box{margin-top:8px}
.wrap_channeling .terms_box iframe{width:100%;height:150px}
.wrap_channeling .join_wrap .login_state.is_show + .join_terms_agree{margin:0}
.wrap_channeling .join_terms_agree{margin-top:34px}
.wrap_channeling .join_terms_agree .type_all_check{margin-top:0;padding:20px 0;border-bottom:1px solid #e0e0e0}
.wrap_channeling .join_terms_agree .type_all_check .inp_check label{font-size:16px;color:#242424}
.wrap_channeling .join_terms_agree .each_terms_wrap li .inp_wrap{margin-top:20px}
.wrap_channeling .join_terms_agree .each_terms_wrap .inp_check label{font-size:14px;line-height:24px;color:#474747}
.wrap_channeling .join_terms_agree .each_terms_wrap .inp_check label span{padding:0}
.wrap_channeling .btn_wrap.col_full{margin-top:40px}

/* width: 900px */
.wrap_channeling .section_type_wide{padding-top:41px}
.wrap_channeling .section_type_wide .join_wrap{max-width:none;width:900px}
.wrap_channeling .section_type_wide .join_wrap .login_state{margin:0}
.wrap_channeling .section_type_wide .join_container{margin-top:0}
.wrap_channeling .section_type_wide .txt_desc_tit{display:block;margin-top:24px;font-size:16px;line-height:24px;color:#222}
.wrap_channeling .section_type_wide .txt_desc_tit + .txt_desc{margin-top:8px}
.wrap_channeling .section_type_wide .btn_wrap.text_align_right{margin-top:28px;font-size:0}
.wrap_channeling .section_type_wide .btn_wrap .btn_type2{width:158px}
.wrap_channeling .section_type_wide .btn_wrap .btn_type2 .btn_text{line-height:24px}
.wrap_channeling .section_type_wide .termination_wrap{width:900px;margin:6px auto 0}
.wrap_channeling .termination_wrap .tit{font-size:24px;line-height:36px;color:#222}
.wrap_channeling .termination_wrap .point{color:#ff6f00}
.wrap_channeling .termination_wrap .noti_box{margin-top:40px;padding:40px 36px;border:1px solid #d9d9d9;border-radius:4px;box-sizing:border-box}
.wrap_channeling .termination_wrap .noti_lst{margin-top:24px}
.wrap_channeling .termination_wrap .noti_item{position:relative;padding-left:10px;font-size:14px;line-height:28px;color:#242424}
.wrap_channeling .termination_wrap .noti_item:before{position:absolute;top:14px;left:0;width:2px;height:2px;background:#80868b;content:''}
.wrap_channeling .termination_wrap .noti_txt{margin-top:8px;font-size:14px;line-height:22px;color:#242424}
.wrap_channeling .termination_wrap .txt_desc_tit{margin-top:20px;font-size:14px;line-height:22px}

/* 본인인증 - 통신사 선택 */
.telecom_comp {
  margin: -8px 0 0 -8px;
  font-size: 0;
  line-height: normal;
}

.telecom_comp + .inp_wrap.certi_wrap{
  margin-top: 24px;
}

.telecom_comp.has_checked .name {
  font-weight: 400;
}

.telecom_comp input:checked + .name {
  padding: 16px 4px;
  border: 2px solid #FA6E00;
  font-weight: 700;
  color: #FA6E00;
  background-color: #FEEEE0;
}

.telecom_comp label {
  display: inline-block;
  width: calc(33.333% - 8px);
  margin: 8px 0 0 8px;
  text-align: center;
  vertical-align: top;
}

.telecom_comp label:hover .name {
  padding: 16px 4px;
  border: 2px solid #FA6E00;
  font-weight: 700;
  color: #FA6E00;
}

.telecom_comp .name {
  display: inline-block;
  width: 100%;
  padding: 17px 5px;
  border: 1px solid #474747;
  border-radius: 4px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  color: #242424;
  white-space: nowrap;
  box-sizing: border-box;
  vertical-align: top;
}
.inp_element {
  font-size: 16px !important;
  line-height: 1.4 !important;
  font-family: inherit !important;
  color: #000;
}

.inp_element:-webkit-autofill {
  font-size: 16px !important;
  line-height: 1.4 !important;
  -webkit-text-fill-color: #000 !important;
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
}