@charset "UTF-8";/* variables - color */
:root,:host {
    --gray900s: #191919;
    --gray700s: #424242;
    --gray600s: #595959;
    --gray550s: #8e8e8e;
    --gray500s: #949494;
    --gray400s: #B2B2B2;
    --gray300s: #CCCCCC;
    --gray200s: #DDDDDD;
    --gray100s: #EEEEEE;
    --gray050s: #F5F5F5;
    --gray000s: #F7F7F7;
    --gray700a: rgba(0,0,0,.7);
    --gray400a: rgba(0,0,0,.3);
    --gray200a: rgba(0,0,0,.14);
    --gray150a: rgba(0,0,0,.12);
    --gray120a: rgba(0,0,0,.1);
    --gray070a: rgba(0,0,0,.06);
    --gray050a: rgba(0,0,0,.04);
    --gray000a: rgba(0,0,0,.03);
    --white000s: #fff;
    --blue700s: #19234B;
    --blue500s: #326EDC;
    --purple500s: #745FFF;
    --blue300s: #ABC1D1;
    --blue100s: #F4F9FF;
    --red500s: #F4551E;
    --red100s: #FDF3F0;
    --yellow500s: #FEE500;
}

/* font */
@font-face {
    font-family: Pretendard;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local("Pretendard Regular"),url("https://t1.kakaocdn.net/kakaobusiness_fe/uiop/assets/fonts/Pretendard-Regular.subset.woff2") format("woff2"),url("https://t1.kakaocdn.net/kakaobusiness_fe/uiop/assets/fonts/Pretendard-Regular.subset.woff") format("woff");
}

@font-face {
    font-family: Pretendard;
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local("Pretendard Medium"),url("https://t1.kakaocdn.net/kakaobusiness_fe/uiop/assets/fonts/Pretendard-Medium.subset.woff2") format("woff2"),url("https://t1.kakaocdn.net/kakaobusiness_fe/uiop/assets/fonts/Pretendard-Medium.subset.woff") format("woff");
}

@font-face {
    font-family: Pretendard;
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: local("Pretendard SemiBold"),url("https://t1.kakaocdn.net/kakaobusiness_fe/uiop/assets/fonts/Pretendard-SemiBold.subset.woff2") format("woff2"),url("https://t1.kakaocdn.net/kakaobusiness_fe/uiop/assets/fonts/Pretendard-SemiBold.subset.woff") format("woff");
}

@font-face {
    font-family: Pretendard;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local("Pretendard Bold"),url("https://t1.kakaocdn.net/kakaobusiness_fe/uiop/assets/fonts/Pretendard-Bold.subset.woff2") format("woff2"),url("https://t1.kakaocdn.net/kakaobusiness_fe/uiop/assets/fonts/Pretendard-Bold.subset.woff") format("woff");
}

/* reset */
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,button {
    margin: 0;
    padding: 0;
}

fieldset,img {
    border: 0 none;
}

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

blockquote,q {
    quotes: none;
}

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

input,select,textarea,button {
    vertical-align: middle;
}

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

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

body {
    background: var(--white000s);
}

:host,body,th,td,input,select,textarea,button {
    font-size: 14px;
    line-height: 1.5;
    font-family: Pretendard,system-ui,-apple-system,'Helvetica Neue','Apple SD Gothic Neo','Segoe UI',Roboto,Arial,'NotoSans',Open Sans,'Malgun Gothic','맑은 고딕',sans-serif;
    color: var(--gray900s);
}

a {
    color: var(--gray900s);
    text-decoration: none;
}

a:active,a:hover {
    text-decoration: underline;
}

a:active {
    background-color: transparent;
}

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

/* global */
.direct-link {
    position: absolute;
    top: -1px;
    left: 0;
    z-index: 1000;
    height: 1px;
}

/* 바로가기 */
.direct-link a {
    position: absolute;
    top: -999px;
    padding: 5px 10px;
    font-weight: bold;
    color: #fff;
    background: #333;
    text-decoration: none;
    white-space: nowrap;
}

.direct-link a:focus {
    top: 0;
}

.ir_pm {
    display: block;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
}

/* PC용 사용된 이미지내 의미있는 텍스트의 대체텍스트를 제공할때 */
.ir_wa {
    display: block;
    overflow: hidden;
    position: relative;
    z-index: -1;
    width: 100%;
    height: 100%;
}

/* 중요한 이미지 대체텍스트로 이미지off시에도 대체 텍스트를 보여주고자 할때 */
.screen_out {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    font-size: 1px;
    line-height: 1px;
    clip-path: inset(100%);
    clip: rect(1px,1px,1px,1px);
}

/* 대체텍스트가 아닌 접근성을 위한 숨김텍스트를 제공할때 */
.show {
    display: block;
}

.hide {
    display: none;
}

/*** layout ***/
/*** layout ***/
:host,html,body {
    height: 100%;
}

body {
    background-color: #f7f7f7;
}

body.bg_type2 {
    background-color: #fff;
}

.container-doc {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0%;
    padding-left: 245px;
    box-sizing: border-box;
}

.container-doc.container-wide {
    padding-left: 0;
}

.container-doc.container-wide .inner-main {
    min-width: inherit;
}

.container-doc.container-wide .content-article {
    min-width: inherit;
    padding: 30px;
}

.doc-main {
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    width: 100%;
}

.inner-main {
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    position: relative;
    min-width: 1180px;
    height: 100%;
    padding: 70px 0 100px;
    box-sizing: border-box;
}

.inner-main:after {
    content: '';
    display: block;
    clear: both;
}

.content-article {
    display: flex;
    flex-direction: column;
    min-width: 1300px;
    height: 100%;
    padding: 70px 60px;
    box-sizing: border-box;
}

.content_area {
    width: 1180px;
    min-height: 100%;
    margin: 0 auto;
}

/* header */
#kakaoHead {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-width: 1320px;
    height: 70px;
    padding: 12px 24px 12px 30px;
    background-color: #fff;
    border-bottom: 1px solid #eee;
    box-sizing: border-box;
}

/** LNB **/
#mFeature {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    padding-top: 70px;
    width: 245px;
    z-index: 990;
    background-color: #fff;
}

#mFeature:after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    background-color: #eee;
}

/** footer **/
.kakao_foot {
    position: relative;
    min-width: 1180px;
    width: 100%;
    height: 100px;
    margin-top: -100px;
    text-align: center;
    box-sizing: border-box;
}

.kakao_foot:after {
    display: block;
    visibility: hidden;
    height: 0;
    font-size: 0;
    clear: both;
    content: "";
}

.kakao_foot .inner_footer {
    overflow: hidden;
    display: inline-block;
    padding: 42px 60px 0;
    margin: 0 auto;
}

.kakao_foot a:hover {
    text-decoration: underline;
}

.kakao_foot .link_copyright {
    float: left;
    font-size: 13px;
    line-height: 16px;
    color: #191919;
    font-weight: 500;
}

.kakao_foot .link_copyright strong {
    font-weight: 700;
}

.kakao_foot .list_policy {
    float: left;
    margin-left: 34px;
}

.kakao_foot .list_policy li {
    float: left;
    font-size: 13px;
    line-height: 16px;
}

.kakao_foot .list_policy li:before {
    float: left;
    width: 1px;
    height: 13px;
    margin: 1.5px 16px 0;
    background-color: #ddd;
    content: "";
}

.kakao_foot .list_policy li:first-child:before {
    display: none;
}

.kakao_foot .list_policy li:last-child .link_policy {
    font-weight: 700;
}

/** common icons **/
.ico_comm {
    overflow: hidden;
    display: inline-block;
    background: url(https://t1.kakaocdn.net/kakaobusiness_fe/public/img/dashboard/ico_dashboard.png) no-repeat;
    background-size: 400px auto;
    font-size: 1px;
    line-height: 0;
    color: transparent;
    text-indent: -9999px;
    vertical-align: top;
    flex-shrink: 0;
}

/*** common component ***/
/* 버튼 CSS */
a:hover {
    text-decoration: none;
}

/* (공통)기본버튼 */
.btn_gb,.btn_gm,.btn_gs {
    display: inline-block;
    border-radius: 6px;
    background: var(--gray050s);
    text-align: center;
    box-sizing: border-box;
    vertical-align: top;
}

.btn_gb:hover,.btn_gm:hover,.btn_gs:hover {
    background: var(--gray120a);
    text-decoration: none;
}

.btn_gb .inner_g,.btn_gm .inner_g,.btn_gs .inner_g {
    display: block;
    border: 1px solid transparent;
    border-radius: 6px;
    color: var(--gray900s);
    box-sizing: border-box;
}

/* 기본버튼 > 비활성화 */
.btn_gb:disabled,.btn_gm:disabled,.btn_gs:disabled,.btn_gb.disabled,.btn_gm.disabled,.btn_gs.disabled {
    background: var(--gray100s);
    pointer-events: none;
    cursor: default;
}

.btn_gb:disabled:hover,.btn_gm:disabled:hover,.btn_gs:disabled:hover,.btn_gb.disabled:hover,.btn_gm.disabled:hover,.btn_gs.disabled:hover {
    background: var(--gray100s);
}

.btn_gb:disabled .inner_g,.btn_gm:disabled .inner_g,.btn_gs:disabled .inner_g,.btn_gb.disabled .inner_g,.btn_gm.disabled .inner_g,.btn_gs.disabled .inner_g {
    color: var(--gray400s);
}

/* (공통)강조버튼 */
.btn_gb.g_emph,.btn_gm.g_emph,.btn_gs.g_emph {
    background: var(--yellow500s);
}

.btn_gb.g_emph:hover .inner_g,.btn_gm.g_emph:hover .inner_g,.btn_gs.g_emph:hover .inner_g {
    background: var(--gray050a);
}

.btn_gb.g_emph .inner_g,.btn_gm.g_emph .inner_g,.btn_gs.g_emph .inner_g {
    border-color: transparent;
    color: var(--gray900s);
}

/* 강조버튼 > 비활성화 */
.btn_gb.g_emph.disabled,.btn_gm.g_emph.disabled,.btn_gs.g_emph.disabled {
    background: var(--gray000a);
}

.btn_gb.g_emph.disabled:hover .inner_g,.btn_gm.g_emph.disabled:hover .inner_g,.btn_gs.g_emph.disabled:hover .inner_g {
    background: none;
}

.btn_gb.g_emph.disabled .inner_g,.btn_gm.g_emph.disabled .inner_g,.btn_gs.g_emph.disabled .inner_g {
    color: var(--gray400s);
}

/* (공통)라인강조버튼 */
.btn_gb.g_line,.btn_gm.g_line,.btn_gs.g_line {
    background: var(--white000s);
}

.btn_gb.g_line .inner_g {
    border-color: var(--gray200s);
}

.btn_gm.g_line .inner_g {
    border-color: var(--gray200s);
}

.btn_gs.g_line .inner_g {
    border-color: var(--gray200s);
}

.btn_gb.g_line:hover .inner_g {
    background: var(--gray120a);
}

.btn_gm.g_line:hover .inner_g {
    background: var(--gray120a);
}

.btn_gs.g_line:hover .inner_g {
    background: var(--gray120a);
}

/* 라인강조버튼 > 비활성화 */
.btn_gb.g_line.disabled,.btn_gm.g_line.disabled,.btn_gs.g_line.disabled {
    background: var(--white000s);
}

.btn_gb.g_line.disabled .inner_g,.btn_gm.g_line.disabled .inner_g,.btn_gs.g_line.disabled .inner_g {
    border-color: var(--gray100s);
    color: var(--gray400s);
}

.btn_gb.g_line.disabled:hover .inner_g,.btn_gm.g_line.disabled:hover .inner_g,.btn_gs.g_line.disabled:hover .inner_g {
    background: none;
}

/* (공통)라인강조버튼2 */
.btn_gb.g_line2,.btn_gm.g_line2,.btn_gs.g_line2 {
    background: var(--white000s);
}

.btn_gb.g_line2 .inner_g,.btn_gm.g_line2 .inner_g,.btn_gs.g_line2 .inner_g {
    border-color: var(--gray900s);
}

.btn_gb.g_line2:hover .inner_g,.btn_gm.g_line2:hover .inner_g,.btn_gs.g_line2:hover .inner_g {
    background: var(--gray120a);
}

/* 라인강조버튼2 > 비활성화 */
.btn_gb.g_line2.disabled,.btn_gm.g_line2.disabled,.btn_gs.g_line2.disabled {
    background: var(--white000s);
}

.btn_gb.g_line2.disabled .inner_g,.btn_gm.g_line2.disabled .inner_g,.btn_gs.g_line2.disabled .inner_g {
    color: var(--gray400s);
    border-color: var(--gray150a);
}

.btn_gb.g_line2.disabled:hover .inner_g,.btn_gm.g_line2.disabled:hover .inner_g,.btn_gs.g_line2.disabled:hover .inner_g {
    background: none;
}

/* 화이트버튼 */
.btn_gb.g_white,.btn_gm.g_white,.btn_gs.g_white {
    background: var(--white000s);
}

.btn_gb.g_white:hover .inner_g {
    background: var(--gray120a);
}

.btn_gm.g_white:hover .inner_g {
    background: var(--gray120a);
}

.btn_gs.g_white:hover .inner_g {
    background: var(--gray120a);
}

/* 화이트버튼 > 비활성화 */
.btn_gb.g_white.disabled,.btn_gm.g_white.disabled,.btn_gs.g_white.disabled {
    background: var(--white000s);
}

.btn_gb.g_white.disabled .inner_g,.btn_gm.g_white.disabled .inner_g,.btn_gs.g_white.disabled .inner_g {
    color: var(--gray400s);
}

.btn_gb.g_white.disabled:hover .inner_g,.btn_gm.g_white.disabled:hover .inner_g,.btn_gs.g_white.disabled:hover .inner_g {
    background: none;
}

/* 버튼 - large */
.btn_gb {
    min-width: 140px;
}

.btn_gb .inner_g {
    height: 52px;
    padding: 15px 19px;
    font-weight: 700;
    font-size: 16px;
    line-height: 19px;
}

.btn_gb .ico_comm {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 3px 6px 0 0;
    vertical-align: top;
}

.btn_gb .ico_add {
    background-position: -190px -40px;
}

.btn_gb.disabled .ico_add {
    background-position: -210px -40px;
}

/* 버튼 - Medium */
.btn_gm .inner_g {
    height: 42px;
    padding: 11px 19px;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
}

.btn_gm .ico_comm {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin: 2px 6px 0 0;
    vertical-align: top;
}

.btn_gm .ico_add {
    background-position: -230px -40px;
}

.btn_gm.disabled .ico_add {
    background-position: -250px -40px;
}

/* 버튼 - Small */
.btn_gs {
    min-width: 53px;
}

.btn_gs .inner_g {
    height: 36px;
    padding: 8px 15px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
}

.btn_gs .ico_comm {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 3px 2px 0 0;
    vertical-align: top;
}

.btn_gs .ico_add {
    background-position: -270px -40px;
}

.btn_gs.disabled .ico_add {
    background-position: -290px -40px;
}

/* (공통)텍스트 버튼 */
.link_gb,.link_gm,.link_gs {
    display: inline-block;
    color: var(--gray900s);
    vertical-align: top;
}

.link_eb,.link_em,.link_es {
    display: inline-block;
    color: var(--blue500s);
    vertical-align: top;
}

.link_eb.g_line,.link_em.g_line,.link_es.g_line,.link_gb.g_line,.link_gm.g_line,.link_gs.g_line {
    position: relative;
}

.link_eb.g_line:after,.link_em.g_line:after,.link_es.g_line:after,.link_gb.g_line:after,.link_gm.g_line:after,.link_gs.g_line:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    border-bottom: 1px solid var(--gray900s);
}

.link_eb.g_line:after,.link_em.g_line:after,.link_es.g_line:after {
    border-bottom-color: var(--blue500s);
}

.link_eb.g_line:after,.link_gb.g_line:after,.link_em.g_line:after,.link_gm.g_line:after {
    bottom: 3px;
}

.link_es.g_line:after,.link_gs.g_line:after {
    bottom: 2px;
}

.link_eb.g_line,.link_em.g_line,.link_es.g_line,.link_gb.g_line,.link_gm.g_line,.link_gs.g_line,.link_gb.g_line.disabled:hover,.link_gm.g_line.disabled:hover,.link_gs.g_line.disabled:hover {
    text-decoration: none;
}

.link_gb.disabled,.link_gm.disabled,.link_gs.disabled {
    color: var(--gray400s);
    pointer-events: none;
    cursor: default;
}

.link_gb.disabled:hover,.link_gm.disabled:hover,.link_gs.disabled:hover {
    text-decoration: none;
}

.link_eb.disabled,.link_em.disabled,.link_es.disabled {
    opacity: 0.3;
    pointer-events: none;
    cursor: default;
}

.link_gb.disabled:after,.link_gm.disabled:after,.link_gs.disabled:after {
    border-color: var(--gray400s);
}

/* 텍스트버튼 - large */
.link_gb,.link_eb {
    font-size: 15px;
    line-height: 18px;
}

.link_gb .ico_comm,.link_eb .ico_comm {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 1px 0 0 2px;
    vertical-align: top;
}

.link_gb .ico_arr,.link_eb .ico_arr {
    background-position: -200px -70px;
}

.link_gb:hover .ico_arr,.link_eb:hover .ico_arr {
    background-position: -220px -70px;
}

/* 텍스트버튼 - Medium */
.link_gm,.link_em {
    font-size: 14px;
    line-height: 20px;
}

/* 텍스트버튼 - Small */
.link_gs,.link_es {
    font-size: 12px;
    line-height: 17px;
}

/** loading **/
.group_loading {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    height: 100%;
    text-align: center;
}

.group_loading .desc_loading {
    margin-top: 10px;
    font-size: 13px;
    line-height: 21px;
    color: var(--gray600s);
}

.group_loading.load_type2 .desc_loading {
    margin-top: 20px;
    font-size: 15px;
    line-height: 18px;
}

.group_loading .item_loading {
    overflow: hidden;
    display: inline-block;
    width: 32px;
    height: 32px;
    background: url(https://t1.kakaocdn.net/kakaobusiness_fe/public/img/dashboard/ico_dashboard.png) no-repeat;
    background-position: -100px -220px;
    background-size: 400px auto;
    font-size: 1px;
    line-height: 0;
    color: transparent;
    text-indent: -9999px;
    vertical-align: top;
    animation: loadingCircle 1s linear infinite;
}

.group_loading.load_type2 .item_loading {
    width: 60px;
    height: 60px;
    background-position: -90px -270px;
}

.group_loading.load_type3 .item_loading {
    width: 16px;
    height: 16px;
    background-position: -180px -70px;
}

@keyframes loadingCircle {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}

.group_refresh {
    position: relative;
    height: 100%;
    text-align: center;
}

.group_refresh .btn_refresh {
    display: block;
    width: 40px;
    height: 40px;
    margin: 0 auto;
    text-align: center;
}

.group_refresh .btn_refresh .ico_refresh {
    width: 40px;
    height: 40px;
    margin: 0 auto;
    background-position: -50px -220px;
}

.group_refresh .desc_refresh {
    margin-top: 10px;
    font-size: 13px;
    line-height: 19px;
    color: var(--gray600s);
}

.group_refresh .btn_gs {
    margin-top: 20px;
}

.group_refresh.load_type2 .btn_refresh {
    width: 60px;
    height: 60px;
}

.group_refresh.load_type2 .btn_refresh .ico_refresh {
    width: 60px;
    height: 60px;
    background-position: -160px -270px;
}

.group_refresh.load_type2 .desc_refresh {
    margin-top: 20px;
    font-size: 15px;
    line-height: 18px;
}

/** Empty **/
/* full Type */
.wrap_error {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%;
    height: 100%;
}

.wrap_error:before {
    content: '';
    width: 100%;
    height: 100%;
    flex: 0.45;
}

.wrap_error:after {
    content: '';
    width: 100%;
    height: 100%;
    flex: 0.55;
}

.wrap_error .inner_error {
    overflow: hidden;
    text-align: center;
}

.wrap_error .ico_comm {
    width: 60px;
    height: 60px;
    margin: 0 auto 30px;
}

.wrap_error .ico_error {
    background-position: 0 -150px;
}

.wrap_error .ico_check {
    background-position: -60px -150px;
}

.wrap_error .ico_info {
    background-position: -120px -150px;
}

.wrap_error .ico_close {
    background-position: -180px -150px;
}

.wrap_error .ico_refresh {
    background-position: -240px -150px;
}

.wrap_error .ico_etc {
    background-position: -300px -150px;
}

.wrap_error .tit_error {
    display: block;
    margin-bottom: 15px;
    font-weight: 700;
    font-size: 22px;
    line-height: 26px;
    color: var(--gray900s);
}

.wrap_error .txt_error {
    font-size: 15px;
    line-height: 20px;
    color: var(--gray600s);
}

.wrap_error .txt_error strong {
    font-weight: 500;
}

.wrap_error .txt_error + .txt_error {
    margin-top: 10px;
}

.wrap_error .page_btn {
    margin-top: 40px;
    text-align: center;
}

.wrap_error .page_btn .btn_gb {
    margin: 0 5px;
}

.wrap_error .page_btn .btn_gb .inner_g {
    font-weight: 500;
}

/* section Type */
.cont_error {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    height: 100%;
}

.cont_error .inner_error {
    overflow: hidden;
    text-align: center;
}

.cont_error .ico_comm {
    width: 40px;
    height: 40px;
    margin: 0 auto 10px;
    background-position: 0 -220px;
}

.cont_error .tit_error {
    display: block;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    color: var(--gray900s);
}

.cont_error .txt_error {
    margin-top: 6px;
    font-size: 15px;
    line-height: 18px;
    color: var(--gray500s);
}

.cont_error .inner_error .txt_error:only-child {
    margin-top: 0;
}

.cont_error .page_btn .btn_gs + .btn_gs {
    margin-left: 4px;
}

.cont_error .page_btn {
    margin-top: 30px;
    text-align: center;
}

.type_error2 .inner_error {
    display: flex;
    text-align: left;
}

.type_error2 .txt_error {
    margin-top: 4px;
}

.type_error2 .page_btn {
    margin: auto 0;
    margin-left: 20px;
}