@charset "utf-8";

/*=============================================================
font
==============================================================*/
@font-face {
    font-family:'Pretendard';
    font-weight:400;
    font-style:normal;
    font-display: block;
    src:url('../../font/Pretendard-Regular.woff2') format('woff2'),
        url('../../font/Pretendard-Regular.woff') format('woff')
}
@font-face {
    font-family:'Pretendard';
    font-weight:500;
    font-style:normal;
    font-display: block;
    src:url('../../font/Pretendard-Medium.woff2') format('woff2'),
        url('../../font/Pretendard-Medium.woff') format('woff')
}
@font-face {
    font-family:'Pretendard';
    font-weight:600;
    font-style:normal;
    font-display: block;
    src:url('../../font/Pretendard-SemiBold.woff2') format('woff2'),
        url('../../font/Pretendard-SemiBold.woff') format('woff')
}
@font-face {
    font-family:'Pretendard';
    font-weight:700;
    font-style:normal;
    font-display: block;
    src:url('../../font/Pretendard-Bold.woff2') format('woff2'),
        url('../../font/Pretendard-Bold.woff') format('woff')
}

@font-face {
    font-family: OneShinhan;
    font-style: normal;
    font-weight: 300;
    src: local("※"),url(../../font/OneShinhanLight.woff) format("woff"),url(../../font/OneShinhanLight.otf) format("opentype"),url(../../font/OneShinhanLight.eot) format("embedded-opentype")
}
@font-face {
    font-family: OneShinhan;
    font-style: normal;
    font-weight: 500;
    src: local("※"),url(../../font/OneShinhanMedium.woff) format("woff"),url(../../font/OneShinhanMedium.otf) format("opentype"),url(../../font/OneShinhanMedium.eot) format("embedded-opentype")
}
@font-face {
    font-family: OneShinhan;
    font-style: normal;
    font-weight: 700;
    src: local("※"),url(../../font/OneShinhanBold.woff) format("woff"),url(../../font/OneShinhanBold.otf) format("opentype"),url(../../font/OneShinhanBold.eot) format("embedded-opentype")
}

/*============================================================
reset
=============================================================*/
html,body{-webkit-text-size-adjust:100%;word-break: keep-all;}
html.layer_activated,body.layer_activated{overflow:hidden;height:100%;}
body,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,hgroup,p,blockquote,figure,form,fieldset,input,legend,pre,abbr,button{margin:0;padding:0;}
body,button,input,select,table,textarea,pre{margin:0;padding:0;font-family:'Pretendard',sans-serif;color:#202225;font-size:14px;font-weight:400;line-height:1;}
fieldset,iframe,img{border:0;}
img{width:100%;height:auto;border:none;vertical-align:top;}
ol,ul,li{list-style:none;}
table{table-layout:fixed;border-collapse:collapse;border-spacing:0;width:100%;}
article,aside,footer,header,nav,main,section,summary,details,hgroup,figure,figcaption{display:block;}
button{overflow:visible;border:0;background:none;color:inherit;font:inherit;line-height:inherit;cursor:pointer;}
button:disabled{cursor:default;}
a{color:#2c3238;text-decoration:none;}
a:active,a:hover{color: unset;text-decoration:none;}
a:focus, button:focus, select:focus,input:focus {outline:1px auto #000;border-color:unset}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal;}
.blind,caption{overflow:hidden;position:absolute;clip:rect(0 0 0 0);margin:-1px;width:1px;height:1px;}
caption{position:static;}
input,textarea,select{border-radius:0;box-shadow:none;-webkit-appearance:none;appearance: none;}
input::-webkit-input-placeholder{color:#CDD1D6 !important;}
input:-ms-input-placeholder{color:#CDD1D6 !important;}
textarea::-webkit-input-placeholder{color:#CDD1D6 !important;}
textarea:-ms-input-placeholder{color:#CDD1D6 !important;}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0;}

#skip{position:absolute;width:0;height:0;font-size:0;line-height:0;overflow:hidden;visibility:hidden;display:none;}
.dimd{overflow:hidden;}
.sr_only, caption {position:absolute; top:-9999px; font-size:0; height:0;}
.dim{background: rgba(0, 0, 0, 0.7) !important;cursor:pointer;} 


/*============================================================
공통
=============================================================*/
html{height:100%;}
body{height:100%;background: #171a1f;}
body.header_activated {overflow:hidden}
.container_dev.pd_none {padding-top:0}
.visual_top {position:relative;height:180px;}
.visual_top .visual_con_wrap {position:relative;z-index:1;height:100%}
.visual_top .visual_con_wrap .inner {padding:0 20px}
.visual_top .visual_con_wrap .top_wrap {padding-top:54px;text-align:center;}
.visual_top .visual_con_wrap .top_wrap .tit_depth2 {color:#FFF}
.visual_top .visual_con_wrap .top_wrap .desc {padding-top:16px;font-size:16px;font-weight:700;color:#FFF;line-height:24px;letter-spacing:-.08px;}

.content {background-color: #fff;}
.content .inner {max-width: 1224px;padding:0 20px}

/*============================================================
가이드
=============================================================*/
p.top_tit{position:fixed;width:100%; padding:16px 0;background:#000;text-align:center;top:0;z-index:50}
p.top_tit span{font-size:24px;font-weight:normal;color:#fff;display:block;max-width:1024px;margin:0 auto;position:relative;}
.g_container{padding:100px 20px 50px;background-color:#f7f7f7;}
div.g_item + div.g_item{margin-top:20px;}
div.g_item{padding:24px;background-color:#fff;border:1px solid rgba(0,0,0,.2);border-radius:5px;}
div.g_item > .g_title{padding-bottom:8px;font-size:20px;color:rgba(0,0,0,.3);margin-bottom:10px;border-bottom:1px solid rgba(0,0,0,.2);}
div.g_item > .g_content >p{font-size: 14px;}
div.g_item > .g_content >p + p{margin-top:7px}
div.g_item > .g_content >.g_desc {font-size:13px;color:#223a6a}
div.g_item > .g_content >.g_underline button {text-decoration:underline;}
div.g_item > .g_content .g_title_sub {padding-bottom:8px;font-size:15px;font-weight:500;color:rgba(0,0,0,.3);}

/* nodata */
.board_none {position:relative;margin-top: 60px;padding-top:154px;padding-bottom: 160px;text-align: center;}
.board_none::before {content:'';position:absolute;top:0;left:50%;width:108px;height:154px;margin-left:-54px;background:url(../images/front/common/nodata.svg) no-repeat 0 0 / 100%}
.board_none p {font-size:18px;font-weight:700;line-height:24px;letter-spacing:-.09px}

/* font */
.tit_depth1 {font-family:'OneShinhan';font-size:32px;font-weight:700;line-height:40px;letter-spacing:-.16px;}
.tit_depth2 {font-family:'OneShinhan';font-size:24px;font-weight:700;line-height:32px;;letter-spacing:-.12px;}
.tit_depth3 {font-family:'OneShinhan';font-size:20px;font-weight:700;line-height:28px;letter-spacing:-.1px;}
.tit_depth4 {font-family:'OneShinhan';font-size:18px;font-weight:700;line-height:24px;letter-spacing:-.09px;}

/* button */
.btn_wrap {display:flex;align-items:center;justify-content:center;}
.btn_primary {width:100%;padding:16px 32px;border-radius:8px;background:#0046FF;font-size:16px;font-weight:700;color:#FFF;line-height:24px;letter-spacing:-.08px;}
.btn_primary:disabled {opacity:.3;}
.btn_gray {width:100%;padding:16px 32px;border-radius:8px;background:#8F9297;font-size:16px;font-weight:700;color:#FFF;line-height:24px;letter-spacing:-.08px;}

/* paging */
.paging {display:flex;justify-content:center;}
.paging a {width:40px;height:48px;font-size:16px;line-height:48px;letter-spacing:-.08px;text-align:center;}
.paging a.active {font-weight:700;color:#0046FF}
.paging a.btn_first {width:48px;background:url(../images/front/common/btn_paging_first.svg) no-repeat 0 0 / 48px;}
.paging a.btn_last {width:48px;background:url(../images/front/common/btn_paging_last.svg) no-repeat 0 0 / 48px;}

/* header */
.header_dev .inner {height:56px;padding:0 20px;transition:all .5s}
.header_dev .h_wrap {position:relative;height:100%}
.header_dev .h_top {position:fixed;top:0;left:0;right:0;z-index:100;height:56px;padding:0 20px;background:#0F1114;transform:translateY(0);transition:transform .5s}
.header_dev.active .h_top {background:#0F1114}
.wrap.down .h_top {transform:translateY(-100%);transition:transform .5s}
.header_dev .logo {display:flex;align-items:center;width:230px;height:56px;transition:all .5s}
.header_dev .logo a {display:block}
.header_dev .logo .ico {display:block;width:230px;height:30px;background:url(../images/front/common/gnb_logo_m.svg) no-repeat 0 0 / 100% 100%}
.header_dev .btn_dropdown {position:absolute;top:50%;right:20px;width:32px;height:32px;margin-top:-16px;background:url(../images/front/common/gnb_menu.svg) no-repeat 50% 50% / 32px;text-indent:-9999px;}
.header_dev.on .logo {position:fixed;z-index:200}
.header_dev.on .btn_dropdown {position:fixed;top:16px;right:0;z-index:200;margin-top:0}
.header_dev .nav_dev .navbar_dev {display:flex;flex-direction:column;gap:12px;overflow-y:auto;position:fixed;top:56px;right:-100%;z-index:100;width:100%;height:calc(100% - 56px);padding:16px 20px 40px;background:#FFF;transition:right .3s;box-sizing:border-box}
.header_dev.active .btn_dropdown {background:url(../images/front/common/ico_close_x32.svg) no-repeat 0 0 / 32px}
.header_dev.active .nav_dev .navbar_dev {right:0}
.wrap.down .header_dev.active .nav_dev .navbar_dev {right:-100%;}

.header_dev .navbar_dev>li>a {display:block;position:relative;padding:12px 52px 12px 0;font-size:18px;font-weight:700;line-height:24px;letter-spacing:-.09px;}
.header_dev .navbar_dev>li>a:hover {color:#202225}
.header_dev .navbar_dev>li.has_sub>a::after {content:'';position:absolute;top:50%;right:0;width:32px;height:32px;margin-top:-16px;background:url(../images/front/common/ico_arw_up_x32.svg) no-repeat 0 0 / 32px;transform:rotate(180deg);}
.header_dev .navbar_dev>li.has_sub>a.active::after {transform:rotate(0);}
.header_dev .navbar_dev>li>a.ico_arw::after {content:'';display:inline-block;width:16px;height:16px;margin-left:2px;background:url(../images/front/common/ico_new_window.svg) no-repeat 0 0 / 16px;vertical-align:top;}
.header_dev .navbar_dev>li .sub_menu {overflow:hidden;height:0;transition:height .4s}
.header_dev .navbar_dev>li.has_sub>a.active+.sub_menu {height:auto}
.header_dev .navbar_dev>li .sub_menu li a {display:block;padding:8px 20px;font-size:16px;line-height:24px;letter-spacing:-.08px;}
.header_dev .navbar_dev>li .sub_menu li a:hover {color:#202225}

.header_dev.v2 {position:fixed;z-index:200}
.header_dev.v2 .h_top {background: rgba(0, 0, 0, 0.10);}
.header_dev.v2.active .h_top {background:#0F1114}
.wrap.pc_down .header_dev.v2 .h_top {background: #0F1114}

/* footer */
.footer_dev {background:#171A1F}
.footer_dev .inner {padding:40px 20px;}
.footer_dev .f_top .f_logo {width:110px;height:32px;background:url(../images/front/common/f_logo.svg) no-repeat 0 0 / 100%}
.footer_dev .f_top .f_link {padding-top:20px}
.footer_dev .f_top .f_link ul {display:flex;gap:16px;flex-wrap: wrap;}
.footer_dev .f_top .f_link ul li a {font-size:12px;font-weight:400;color:#B2B4B8;line-height:14px;letter-spacing:-.06px;}
.footer_dev .f_top .f_link ul li.txt_bold a {font-weight: 700;}
.footer_dev .f_info {padding-top:20px}
.footer_dev .f_info ul {display:flex;gap:24px}
.footer_dev .f_info ul li {position:relative;padding-left:24px;}
.footer_dev .f_info ul li::before {content:'';position:absolute;top:0;left:0;width:20px;height:20px;}
.footer_dev .f_info ul li a {font-size:13px;color:#B2B4B8;line-height:20px;letter-spacing:-.065px;}
.footer_dev .f_info ul li.ico2::before {background:url(../images/front/common/ico_footer2.svg) no-repeat 0 0 / 20px}
.footer_dev .f_info ul li.ico1::before {background:url(../images/front/common/ico_footer1.svg) no-repeat 0 0 / 20px}
.footer_dev .copyright {padding-top:20px;font-size:13px;color:#999;line-height:16px;letter-spacing:-.065px;}

.footer_dev .f_family {position:relative;padding-top:40px}
.footer_dev .f_family .btn {position:relative;width:100%;height:40px;padding:0 50px 0 24px;border-radius: 20px;background: #1D2229;text-align:left;}
.footer_dev .f_family .btn::after {content:'';position:absolute;top:50%;right:16px;width:16px;height:16px;margin-top:-8px;background:url(../images/front/common/ico_plus_x16.svg) no-repeat 0 0 / 16px}
.footer_dev .f_family .btn span {font-size:12px;font-weight: 700;color:#B2B4B8;line-height:14px;letter-spacing:-.05px;}
.footer_dev .f_family .family_site_list {overflow:hidden;position:absolute;bottom:44px;width:100%;height:0;border-radius: 12px;background: #1D2229;transition:height .3s ease}
.footer_dev .f_family .family_site_list.active {height:auto}
.footer_dev .f_family .family_site_list ul {padding:6px 0}
.footer_dev .f_family .family_site_list ul li a {display:block;padding:12px 24px;font-size:12px;font-weight: 700;color:#B2B4B8;line-height: 14px;letter-spacing:-.05px;}

/* tab */
.tab_wrap {overflow:hidden;}
.tab_wrap .swiper-container {padding:0 20px}
.tab_wrap .tabs {justify-content:start;}
.tab_wrap .tabs.unset {justify-content:unset}
.tab_wrap .tabs .tab_link {flex:none;width:auto;margin-right:8px}
.tab_wrap .tabs .tab_link:last-child {margin-right:0}
.tab_wrap .tabs .tab_link a {display:block;padding:10px 24px;border-radius:28px;background:#FFF;border:1px solid #E6EAED;font-size:14px;font-weight:700;line-height:20px;letter-spacing:-.07px;}
.tab_wrap .tabs .tab_link.active a {border:1px solid #0046FF;background:#0046FF;color:#FFF;}

/* tab - under_line */
.tab_wrap.under_line .tab_list {display: flex;}
.tab_wrap.under_line .tab_list .tab_link {flex: 1;margin-right: 0;}
.tab_wrap.under_line .tab_list .tab_link a {display: block;position: relative;padding: 16px 0;border: none;border-bottom: 1px solid #dbdee1;border-radius: unset;background: none;font-size: 18px;font-weight: 700;color: #8F9297;line-height: 24px;text-align: center ;}
.tab_wrap.under_line .tab_list .tab_link.active a {color: #000;}
.tab_wrap.under_line .tab_list .tab_link.active a::before {content: '';position: absolute;left: 0;bottom: 0;width: 100%;height: 2px;background:#0046FF;}

/* table */
.tbl_wrap {overflow-x:auto;padding-bottom:8px}
.tbl_wrap thead th {position:relative;padding:12px 8px;background:#F9FAFB;font-size:14px;font-weight:700;line-height:20px;letter-spacing:-.07px;}
.tbl_wrap thead th::before {content:'';position:absolute;top:50%;left:0;width:1px;height:24px;margin-top:-12px;background:#B2B4B8;}
.tbl_wrap thead th:first-child::before {display:none}
.tbl_wrap thead th:first-child {border-radius:12px 0 0 12px}
.tbl_wrap thead th:last-child {border-radius:0 12px 12px 0}
.tbl_wrap tbody td {padding:16px 8px;border-bottom:1px solid #DBDEE1;font-size:14px;line-height:20px;letter-spacing:-.07px;text-align:center;}

.tbl_data_wrap{overflow-x: auto;padding-bottom: 4px;}
.tbl_data_wrap table{table-layout: auto;}
.tbl_data_wrap thead th{padding: 16px;border-right: 1px solid #DBDEE1;border-top: 1px solid #202225;background-color: #f9fafb;font-size: 16px;line-height: 24px;text-align: center;}
.tbl_data_wrap thead th:last-child{border-right: none;}
.tbl_data_wrap tbody tr{border-top: 1px solid #dbdee1;}
.tbl_data_wrap tbody td{padding: 16px;border-right: 1px solid #dbdee1;border-bottom: 1px solid #dbdee1;font-size: 16px;line-height: 24px;vertical-align: top;word-break: break-all;}
.tbl_data_wrap tbody td:last-child{border-right: none;}
.tbl_data_wrap tbody td ul li{margin-top: 8px;}

/* collapse */
.faq_list li {margin-top:8px;}
.faq_list li:first-child {margin-top:0}
.faq_list li .acc_head .btn_que {display:flex;flex-direction: column;row-gap: 8px;position:relative;width:100%;padding:16px 60px 16px 20px;background-color:#F9FAFB;border-radius:8px;font-size:14px;font-weight:700;line-height:20px;letter-spacing:-.07px;text-align:left;word-break: break-all;}
.faq_list li .acc_head .btn_que span {font-size: 13px;color: #0046FF;line-height: 16px;}
.faq_list li .acc_head .btn_que i {display:inline-block;width:24px;height:24px;flex:none;}
.faq_list li .acc_head .btn_que .ico_down {position:absolute;top:50%;right:16px;margin-top:-12px;background:url(../images/front/common/ico_arw_down.svg) no-repeat 50% 50% / 24px;transition:all .3s}
.faq_list li .acc_body {overflow: hidden;max-height: 0;padding: 0;background-color:#F9FAFB;border-radius:0 0 8px 8px;transition: max-height .3s linear;}
.faq_list li .acc_head.on .btn_que {border-radius:8px 8px 0 0}
.faq_list li .acc_head.on .btn_que .ico_down {transform:rotate(-180deg);transition:all .3s}
.faq_list li .acc_body .editor {position:relative;padding:0 20px 16px 20px;font-size:14px;color:#6F7277;line-height:20px;letter-spacing:-.07px;word-break: break-all;}

/* select */
.sel_base {width:100%;height:48px;padding:12px 60px 12px 20px;border-radius:8px;border:1px solid #DBDEE1;background:url(../images/front/common/ico_arw_sel_down.svg) no-repeat right 24px center / 24px;font-size:14px;line-height:20px;letter-spacing:-.07px;box-sizing: border-box;}

/* etc */
.badge{display: inline-block;position: relative;width: 48px;height: 20px;padding: 3px 8px;border-radius: 4px;font-size: 12px;font-weight: 700;line-height: 14px;text-align: center;}
.badge.primary{background-color: #e7eeff;color: #0046FF;}
.badge.green{background-color: #f0fae9;color: #5ac916}
.badge.orange{background-color: #ffefea;color: #fb521c;}
.badge.able{width: unset;height: unset;padding: 5px 12px 5px 28px;border-radius: 8px;background-color: #e7eeff;color: #0046FF;}
.badge.able::before{content: '';position: absolute;left: 12px;top:50%;width: 12px;height: 12px;background: url(../images/front/common/flag_succes.svg) no-repeat center / 12px;transform: translateY(-50%);}
.badge.disable{width: unset;height: unset;padding: 5px 12px 5px 28px;border-radius: 8px;background-color: #ffefea;color: #fb521c;}
.badge.disable::before{content: '';position: absolute;left: 12px;top:50%;width: 12px;height: 12px;background: url(../images/front/common/flag_error.svg) no-repeat center / 12px;transform: translateY(-50%);}


.info_txt{display: block;position: relative;margin-top: 4px;padding-left: 12px;font-size: 13px;color: #8F9297;line-height: 16px;}
.info_txt::before{content:'※';position:absolute;top:0;left:0;}

.list_num{display: flex;flex-direction: column;gap: 8px 0;counter-reset: number 0;}
.list_num li{display: flex;align-items: start;font-size: 16px;font-weight: 500;line-height: 24px;}
.list_num li::before{counter-increment: number 1;content: counter(number)'.';margin-right: 4px;}


/* scrollbar */
.scroller::-webkit-scrollbar {height: 7px;}
.scroller::-webkit-scrollbar-thumb {background:#E6EAED;border-radius:7px}
.scroller::-webkit-scrollbar-track {background:transparent}

.pre_area pre::-webkit-scrollbar {height: 7px;}
.pre_area pre::-webkit-scrollbar-thumb{background:#B2B4B8;border-radius:7px}

/* form */
.form_wrap {display:inline-block;position:relative}
.form_wrap input[type="checkbox"] {position:absolute;width:24px;height:24px}
.form_wrap input[type="checkbox"]+label {display:inline-block;padding-left:32px;font-size:14px;line-height:24px;letter-spacing:-.07px;}
.form_wrap input[type="checkbox"]+label::before {content:'';position:absolute;top:0;left:0;width:24px;height:24px;margin-right:8px;background:url(../images/front/common/ico_chkbox.svg) no-repeat 0 0 / 24px 24px;}
.form_wrap input[type="checkbox"]:checked+label::before {background:url(../images/front/common/ico_chkbox_on.svg) no-repeat 0 0 / 24px 24px}

.form_grid_item {padding-top:20px}
.form_grid_item:first-child {padding-top:0}
.form_grid_item .label {display:block;margin-bottom:8px;font-size:16px;font-weight:700;line-height:24px;letter-spacing:-.08px;}
.form_grid_item.pd_top {padding-top:40px}
.form_grid_item .inp_box {position:relative}

.inp_base {width:100%;height:48px;padding:14px 20px;border-radius:8px;border:1px solid #DBDEE1;font-size:14px;line-height:20px;letter-spacing:-.07px;box-sizing: border-box;}
.inp_base:disabled {background:#FFF;}


/******************** DDREQ-6521 PG개인정보처리방침 개정 ********************/
/* box type */
.box_type1 {margin-top:20px;padding:10px 15px;background:#fffbf5;color:#6F7277;border:1px solid #f2e6db}
.btn_link {display:inline-block;height:22px;padding:0 10px;border-radius:2px;line-height:22px;border:1px solid #ccc;background:#fff;font-size:13px;}
.box_type1 .btn_link {margin-left:15px;}
.box_type1 .txt_info {display:inline-block;padding-left:15px;text-indent:-11px;line-height:1.5;font-size:14px;}
.box_type1 .tit_info {font-weight:bold;margin:10px 0 0 0;font-size:14px;line-height: 1.5;}
.box_type1 .tit_info:first-child {margin-top:0}

/* text type */
.bold {font-weight:bold}
.u_line {text-decoration:underline;}
/******************** //DDREQ-6521 PG개인정보처리방침 개정 ********************/

/*============================================================
main
=============================================================*/
.wrap.main .header_dev .nav_dev .navbar_dev {background:#0F1114}
.wrap.main .header_dev .navbar_dev>li>a {color:#fff}
.wrap.main .header_dev .navbar_dev>li .sub_menu li a {color:#fff}
.wrap.main .header_dev .navbar_dev>li.has_sub>a::after {background:url(../images/front/common/ico_arw_up_w_x32.svg) no-repeat 0 0 / 32px}
.wrap.main .header_dev .navbar_dev>li>a.ico_arw::after {background:url(../images/front/common/ico_new_window_w.svg) no-repeat 0 0 / 16px}

.container_dev.main_dev {background: #171A1F}
.container_dev.main_dev .btn_line {display:inline-block;padding:12px 20px;border-radius: 8px;border:1px solid #fff;font-size:16px;font-weight:700;color:#fff;line-height:24px;letter-spacing:-.08px;transition: all 0.2s;}
.container_dev.main_dev .btn_line:hover {background-color: #fff;color: #202225;}
.container_dev.main_dev .txt_wrap {color:#fff}
.container_dev.main_dev .txt_wrap h3 {font-family: OneShinhan;font-size:20px;font-weight:700;line-height:28px;letter-spacing:-.12px;}
.container_dev.main_dev .txt_wrap h3 .br {display:block}
.container_dev.main_dev .txt_wrap .desc {margin-top:16px;font-size:16px;color:#C1C5CB;line-height:24px;letter-spacing:-.08px;word-break: break-all;}
.container_dev.main_dev .img_wrap.is_pc {display:none}
.container_dev.main_dev .img_wrap.is_mobile {position:relative;padding-top:66.89%;margin-top:32px}
.container_dev.main_dev .img_wrap.is_mobile img {position:absolute;top:0;left:0;right:0;bottom:0;max-width:100%;max-height:100%;min-width:100%;min-height:100%;width:0;height:0;margin:auto;object-fit: cover;}

.container_dev .main_visual {overflow:hidden;background:#20232A}
.container_dev .main_visual .inner {padding:60px 32px 0}

.container_dev .main_visual .txt_wrap h2 {padding-right:10px;font-family: OneShinhan;font-size:28px;font-weight:700;line-height:36px;letter-spacing:-.14px;}
.container_dev .main_visual .txt_wrap h2 span {display:inline-block}
.container_dev .main_visual .txt_wrap .desc {display: none;}
.container_dev .main_visual .txt_wrap .btn_line {margin-top:32px;padding:12px 32px}

.container_dev .main_intro {overflow: hidden;}
.container_dev .main_intro .inner {padding:64px 20px 40px}
.container_dev .main_intro .swiper-container {position:relative;margin-top:32px;}
.container_dev .main_intro .swiper-slide {width:284px;padding:32px;border-radius:16px;background-color: #20232A;transition:background-color .4s}
.container_dev .main_intro .swiper-slide .txt_wrap {position:relative;padding-top:104px}
.container_dev .main_intro .swiper-slide .txt_wrap::before {content:'';position:absolute;top:0;left:0;width:80px;height:80px;}
.container_dev .main_intro .swiper-slide.slide_common .txt_wrap::before {background:url(../images/front/main/ico_intro1.svg) no-repeat 0 0 / 80px}
.container_dev .main_intro .swiper-slide.slide_card .txt_wrap::before {background:url(../images/front/main/ico_intro2.svg) no-repeat 0 0 / 80px}
.container_dev .main_intro .swiper-slide.slide_virtual .txt_wrap::before {background:url(../images/front/main/ico_intro3.svg) no-repeat 0 0 / 80px}
.container_dev .main_intro .swiper-slide.slide_transfer .txt_wrap::before {background:url(../images/front/main/ico_intro8.svg) no-repeat 0 0 / 80px}
.container_dev .main_intro .swiper-slide.slide_regular .txt_wrap::before {background:url(../images/front/main/ico_intro4.svg) no-repeat 0 0 / 80px}
.container_dev .main_intro .swiper-slide.slide_brand .txt_wrap::before {background:url(../images/front/main/ico_intro5.svg) no-repeat 0 0 / 80px}
.container_dev .main_intro .swiper-slide.slide_escrow .txt_wrap::before {background:url(../images/front/main/ico_intro6.svg) no-repeat 0 0 / 80px}
.container_dev .main_intro .swiper-slide.slide_agency .txt_wrap::before {background:url(../images/front/main/ico_intro7.svg) no-repeat 0 0 / 80px}
.container_dev .main_intro .swiper-slide .tit {font-family: OneShinhan;font-size:20px;color:#F3F6FF;line-height:28px;}
.container_dev .main_intro .swiper-slide .desc {min-height:48px;margin-top:12px;font-size:16px;color:#8F9297;line-height:24px;}
.container_dev .main_intro .swiper-slide .btn_wrap {position: relative;z-index: 10;margin-top:24px;justify-content:flex-start;gap:12px}
.container_dev .main_intro .swiper-horizontal>.swiper-scrollbar {left:0;bottom:-40px;width:100%;height:2px;border-radius: 0;background:#262A33}
.container_dev .main_intro .swiper-scrollbar-drag {background:#DBDEE1}

.container_dev .main_api .inner {padding:64px 20px 0}
.container_dev .main_api .cont_wrap ul {display:flex;flex-direction:column;gap:20px;margin-top:32px}
.container_dev .main_api .cont_wrap ul li .img_box {overflow:hidden;border-radius:16px;}
.container_dev .main_api .cont_wrap ul li .txt_box {margin-top:20px}
.container_dev .main_api .cont_wrap ul li .txt_box .tit {font-family: 'Pretendard';font-size:18px;color:#fff;line-height:24px;}
.container_dev .main_api .cont_wrap ul li .txt_box .desc {margin-top:8px;font-size:16px;color:#8F9297;line-height:24px;word-break: keep-all;}

.container_dev .main_build {margin-top:64px;background:url(../images/front/main/main_build_bg.png) no-repeat 0 0 / cover}
.container_dev .main_build .inner {padding:40px 20px}
.container_dev .main_build .cont_wrap .panel_ul {display:flex;flex-direction:column;gap:20px;margin-top:32px}
.container_dev .main_build .cont_wrap .panel_ul li .img_box {overflow:hidden;border-radius:16px;}
.container_dev .main_build .cont_wrap .panel_ul li .txt_box {margin-top:20px}
.container_dev .main_build .cont_wrap .panel_ul li .txt_box .tit {font-family: OneShinhan;font-size:18px;color:#fff;line-height:24px;letter-spacing:-.09px;}
.container_dev .main_build .cont_wrap .panel_ul li .txt_box .desc {margin-top:8px}
.container_dev .main_build .cont_wrap .panel_ul li .txt_box .desc ul li {position:relative;padding-left:12px;font-size:14px;color:#C1C5CB;line-height:20px;letter-spacing:-.07px;}
.container_dev .main_build .cont_wrap .panel_ul li .txt_box .desc ul li::before {content:'';position:absolute;top:8px;left:0;width:3px;height:3px;background:#C1C5CB;border-radius:50%;}

.container_dev .main_faq .inner {padding:64px 20px 0;}
.container_dev .main_faq .txt_wrap {height:400px;border-radius:16px;background:url(../images/front/main/main_faq_m.jpg) no-repeat 100% 100% / cover;}
.container_dev .main_faq .txt_wrap a {display:block;height:100%;padding:32px 28px;}
.container_dev .main_faq .txt_wrap strong {display:block;font-family: OneShinhan;font-size:20px;font-weight:700;color:#fff;line-height:28px;}
.container_dev .main_faq .txt_wrap strong .br {display:block}
.container_dev .main_faq .txt_wrap .btn_line {margin-top:24px}

.container_dev .main_notice .inner {padding:60px 20px 0}

.container_dev .main_notice .panel_wrap .panel {padding:24px;border-radius: 16px;background: #20232A;color:#fff}
.container_dev .main_notice .panel_wrap .panel .tit_wrap {position:relative}
.container_dev .main_notice .panel_wrap .panel .tit_wrap .tit {font-family: OneShinhan;font-size:20px;line-height:28px;}
.container_dev .main_notice .panel_wrap .panel .tit_wrap .btn_more {position:absolute;top:0;right:0;width:32px;height:32px;background:url(../images/front/common/ico_plus_x32.svg) no-repeat 0 0 / 32px}
.container_dev .main_notice .panel_wrap .panel .cont_wrap {margin-top:22px;}
.container_dev .main_notice .panel_wrap .panel .cont_wrap ul li {margin-top:16px}
.container_dev .main_notice .panel_wrap .panel .cont_wrap ul li:first {margin-top:0}
.container_dev .main_notice .panel_wrap .panel .cont_wrap .tit {overflow:hidden;font-size:16px;color:#C1C5CB;line-height:24px;letter-spacing:-.08px;text-overflow:ellipsis;white-space:nowrap;}
.container_dev .main_notice .panel_wrap .panel .cont_wrap .date {margin-top:8px;font-size:16px;color:#6F7277;line-height:24px;letter-spacing:-.08px;}

.container_dev .main_util {margin-top:64px;background: #292C35;}
.container_dev .main_util .inner {padding:20px;}
.container_dev .main_util .txt_wrap .tit {font-family: OneShinhan;font-size:18px;color:#fff;line-height:24px;letter-spacing:-.09px;}
.container_dev .main_util .txt_wrap .desc {margin-top:4px;font-size:14px;color:#8F9297;line-height:20px;}
.container_dev .main_util .util_wrap {margin-top:12px}
.container_dev .main_util .util_wrap ul li {margin-top:4px;font-size:14px;font-weight:700;color:#fff;line-height:20px;}
.container_dev .main_util .util_wrap ul li a {font-size:14px;font-weight:700;color:#fff;line-height:20px;}

/*============================================================
main v2
=============================================================*/
.container_dev.v2 .main_intro .swiper-slide .desc {min-height:144px}

.main_visual_v2 {overflow:hidden;position:relative;height:534px}
.main_visual_v2 .swiper {height:100%}
.main_visual_v2 .bg {position:relative;height:100%;background-repeat:no-repeat;background-position:center;background-size:cover;transform:scale(1.5)}
.main_visual_v2 .bg::before {content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.5)}
.main_visual_v2 .bg1 {background-position:center right 30%}
.main_visual_v2 .bg2 {background-position:center right 17%}
.main_visual_v2 .bg3 {background-position:center right 28%}
.main_visual_v2 .inner {position:absolute;top:104px;left:32px;right:32px;transition:left .5s}
.main_visual_v2 .txt_wrap h2 {padding-right:10px;font-family: OneShinhan;font-size:28px;font-weight:700;line-height:36px;letter-spacing:-.14px;}
.main_visual_v2 .txt_wrap h2 .br {display:block}
.main_visual_v2 .txt_wrap .desc {display: none;}
.main_visual_v2 .txt_wrap .btn_line {margin-top:32px;padding:12px 32px}

.main_visual_v2 .control {position:absolute;bottom:48px;left:32px;width:90%;transition:left .5s}
.main_visual_v2 .pager_container {display:flex;align-items:center;}

.main_visual_v2 .swiper-button-prev::after, .main_visual_v2 .swiper-button-next::after {display:none}
.main_visual_v2 .swiper-button-prev, .main_visual_v2 .swiper-button-next {margin-top:0}
.main_visual_v2 .swiper-button-prev {position:static;width:24px;height:24px;background:url(../images/front/main/btn_swiper_prev.svg) no-repeat 0 0 / 24px}
.main_visual_v2 .swiper-button-next {position:static;width:24px;height:24px;background:url(../images/front/main/btn_swiper_next.svg) no-repeat 0 0 / 24px}
.main_visual_v2 .swiper-pagination {display:flex;position:static;width:auto}
.main_visual_v2 .swiper-pagination-bullet {position:relative;width:24px;height:2px;margin:0 4px;border-radius:0;background:rgba(255, 255, 255, 0.2)}
.main_visual_v2 .swiper-pagination-bullet-active {background:transparent}
.main_visual_v2 .swiper-pagination-bullet em {display:none}
.main_visual_v2 .swiper-pagination-bullet i {position:absolute;bottom:0;left:0;z-index:1;width:100%;height:2px;background-color:rgba(255, 255, 255, 0.2)}
.main_visual_v2 .swiper-pagination-bullet b {position:absolute;bottom:0;left:0;z-index:2;width:0;height:2px;background-color:#FFF}
.main_visual_v2 .swiper-pagination-bullet-active b {animation:countingBar 4s 1 ease-in alternate forwards;-webkit-animation:countingBar 4s 1 ease-in alternate forwards;}
@keyframes countingBar {
    0% {width:0;}
    100% {width:100%;}
}
@-webkit-keyframes countingBar {
    0% {width:0;}
    100% {width:100%;}
}
.main_visual_v2 .swiper-button-pause {position:relative;z-index:1;width:24px;height:24px;background:url(../images/front/main/btn_swiper_pause.svg) no-repeat 0 0 / 24px;color:transparent}
.main_visual_v2 .swiper-button-play {display:none;position:relative;z-index:1;width:24px;height:24px;background:url(../images/front/main/btn_swiper_play.svg) no-repeat 0 0 / 24px;color:transparent}

.main_visual_v2 .scroll_down {position:absolute;bottom:20px;right:20px;z-index:1}
.main_visual_v2 .scroll_down .scroll_txt {display:inline-block;margin:6px 14px 0 0;font-size:12px;font-weight:700;color:#FFF;line-height:14px;letter-spacing: -.06px;vertical-align:top;}
.main_visual_v2 .scroll_down .scroll_mouse {position:relative;display:inline-block;width:6px;height:24px;background:gray;border-radius:20px;background:rgba(255, 255, 255, 0.2)}
.main_visual_v2 .scroll_down .scroll_wheel {position:absolute;top:0;left:0;width:6px;height:6px;background:#fff;border-radius:50%;animation:scrollDown 2.5s infinite}
@keyframes scrollDown {
	0% {top: 0;opacity: 0;}
	15% {top: 0;opacity: 1;}
	30% {top: 0;opacity: 1;}
	45% {top: 18px;opacity: 1;}
    100% {top: 18px;opacity: 0;}
}
@-webkit-keyframes scrollDown {
	0% {top: 0;opacity: 0;}
	15% {top: 0;opacity: 1;}
	30% {top: 0;opacity: 1;}
	45% {top: 18px;opacity: 1;}
    100% {top: 18px;opacity: 0;}
}

/*============================================================
FAQ
=============================================================*/
.visual_top .faq_bg {position:absolute;top:0;left:0;right:0;bottom:0;background:url(../images/front/customer/visual_faq.jpg) no-repeat 50% 50% / cover}
.faq_area{padding-bottom: 80px;}
.faq_area .tab_wrap {padding-top:40px}
.faq_area .faq_list {padding-top:20px}
.faq_area .paging {margin-top:8px }
.faq_inquiry .inner {padding:20px;background: #292C35;}
.faq_inquiry .txt_area {text-align:left;}
.faq_inquiry .txt_area strong {font-size:18px;color:#FFF;line-height:24px;letter-spacing:-.09px;}
.faq_inquiry .txt_area p {margin-top:4px;font-size:14px;color:#8F9297;line-height:20px;letter-spacing:-.07px;}
.faq_inquiry .info_area {display: flex;flex-direction: column;row-gap: 4px;margin-top:16px;text-align: left;}
.faq_inquiry .info_area a{font-weight: 700;color:#fff;line-height: 20px;}
.faq_inquiry .info_area span {display:inline-block;position:relative;font-size:14px;color:#FFF;font-weight:700;line-height:20px;letter-spacing:-.07px;}
.faq_inquiry .info_area span:last-child {padding-left:8px;margin-left:8px;}
.faq_inquiry .info_area span:last-child::after {content:'';position:absolute;top:50%;left:0;width:1px;height:12px;margin-top:-6px;background:#FFF}

.faq_area .board_none {margin-top: 100px;padding-top:174px;padding-bottom:220px}
.faq_area .board_none::before {top:20px}

/*============================================================
공지사항
=============================================================*/
.visual_top.height120 {height:120px}
.visual_top.height120 .visual_con_wrap .top_wrap {padding-top: 44px;text-align: left;}
.visual_top .notice_bg{position:absolute;top:0;left:0;right:0;bottom:0;background:url(../images/front/customer/visual_notice.jpg) no-repeat 50% 50% / cover;}
.board_area{padding:40px 0 80px;}
.board_area .board_list{border-top:1px solid #202225;word-break: break-all;}
.board_area .board_list .th_head{display:none;}
.board_area .board_list li{padding:16px 0;border-bottom:1px solid #DBDEE1;}
.board_area .board_list li div{display:flex;flex-direction:column;}
.board_area .board_list li div .no{display:none;}
.board_area .board_list li div .tit{font-size:16px;font-weight:700;line-height:24px;letter-spacing:-.08px;}
.board_area .board_list li div .tit a{overflow:hidden;display:-webkit-box;width:100%;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.board_area .board_list li div .date{padding-top:8px;line-height:20px;letter-spacing:-.07px;}
.board_area .paging{display:flex;align-items:center;justify-content:center;margin-top:8px;padding:12px 0;}

.board_area .view_head{padding:16px 0;border-top:1px solid #202225;border-bottom:1px solid #DBDEE1;}
.board_area .view_head .tit{font-size:16px;font-weight:700;line-height:24px;letter-spacing:-.08px;word-break: break-all;}
.board_area .view_head .date{padding-top:8px;font-size: 14px;line-height:20px;letter-spacing:-.07px;}
.board_area .view_body{padding:16px 0;font-size:16px;line-height:24px;letter-spacing:-.07px;border-bottom:1px solid #DBDEE1;word-break: break-all;}
.board_area .view_body .view_detail {padding: 15px 0;border-top: 1px dashed #202225;border-bottom:1px dashed #202225;}
.board_area .btn_wrap{padding-top:40px;}

/*============================================================
자료실
=============================================================*/
.visual_top .dataroom_bg {position:absolute;top:0;left:0;right:0;bottom:0;background:url(../images/front/customer/visual_dataroom.jpg) no-repeat 50% 50% / cover}
.board_area .file_list {display: flex;flex-direction: column;row-gap: 8px;margin-top: 40px;}
.board_area .file_list .btn_file {display: flex;flex-direction: column;width: 100%;padding: 12px 24px 12px 16px;border: 1px solid #DBDEE1;border-radius: 4px;background-color: #F9FAFB;text-align: left;}
.board_area .file_list .btn_file .file_name {font-size: 14px;font-weight: 700;line-height: 20px;}
.board_area .file_list .btn_file .file_size {margin-top: 4px;font-size: 11px;line-height: 13px;color: #6f7e77;}

/*============================================================
PG API 소개
=============================================================*/
/* 신용카드 */
.visual_top .intro_bg {position:absolute;top:0;left:0;right:0;bottom:0;background:url(../images/front/pgapi/visual_creditcard.jpg) no-repeat 50% 50% / cover}
.intro_wrap .intro_detail_area:first-child{padding-top: 40px;}
.intro_wrap .intro_detail_area{padding-bottom: 40px;}

.intro_detail_area .list_bullet {margin-top: 24px;word-break: break-all;}
.intro_detail_area .list_bullet li{position: relative;margin-bottom: 16px;padding-left: 12px;font-size: 16px;line-height: 24px;}
.intro_detail_area .list_bullet li:last-child{margin-bottom: 0;}
.intro_detail_area .list_bullet li::before{content: '';position: absolute;top:9px;left: 0;width: 6px;height: 6px;border-radius: 50%;background: #202225;}
.intro_detail_area .list_bullet li .info_txt{margin-top: 4px;}

.intro_detail_area .process_area {display: block;position: relative;margin-top: 24px;}
.intro_detail_area .process_area::after {content:'';position:absolute;bottom:0;right:0;width:40px;height:40px;background:url(../images/front/pgapi/btn_expand.jpg) no-repeat 0 0 / 100%}

.intro_detail_area .tbl_data_wrap{padding-top: 24px;white-space: nowrap;}
.intro_detail_area .tbl_data_wrap table{max-width: 1200px;}

.intro_detail_area .faq_list{margin-top: 24px;}

/* popup */
.layer_wrap{position: fixed;left: 0;top: 0;z-index: 1002;width: 100%;height: 100%;}
.layer_wrap .dim{position: fixed;left: 0;top: 0;z-index: 1001;width: 100%;height: 100%;}
.layer_wrap .inner{display: flex;height: 100%;align-items: center;justify-content: center;}
.dim {background: rgba(0, 0, 0, 0.6);cursor:pointer;}
.dim.bg_white {background:#ffff !important; cursor:unset;pointer-events: none;}
#loadingPop .dim {opacity: 0;}

/* loading */
.loader {position: fixed;z-index: 1002;    animation: rotate 1s infinite;height: 46px;width: 46px;}
.loader:before,.loader:after {border-radius: 50%;content: "";display: block;height: 16px;width: 16px;}
.loader:before {animation: ball1 1s infinite;background-color: #DBDEE1;box-shadow: 30px 0 0 #ff3d00;margin-bottom: 10px;}
.loader:after {animation: ball2 1s infinite;background-color: #0046FF;box-shadow: 30px 0 0 #fff;}

@keyframes rotate {
    0% { transform: rotate(0deg) scale(0.8) }
    50% { transform: rotate(360deg) scale(1.2) }
    100% { transform: rotate(720deg) scale(0.8) }
}
@keyframes ball1 {
    0% {box-shadow: 30px 0 0 #0046FF;}
    50% {box-shadow: 0 0 0 #0046FF;margin-bottom: 0;transform: translate(15px, 15px);}
    100% {box-shadow: 30px 0 0 #0046FF;margin-bottom: 14px;}
}

@keyframes ball2 {
    0% {box-shadow: 30px 0 0 #DBDEE1;}
    50% {box-shadow: 0 0 0 #DBDEE1;margin-top: -16px;transform: translate(15px, 15px);}
    100% {box-shadow: 30px 0 0 #DBDEE1;margin-top: 0;}
}

/*============================================================
로그인
=============================================================*/
.login_wrap{display: flex;justify-content: center;align-items: center;height: 100vh;padding: 0;background-color: #E6EAED;}
.login_wrap .login_box{width: 320px;padding: 40px 20px;border-radius: 16px;background-color: #fff;}
.login_wrap .login_box .logo{display: inline-block;}
.login_wrap .login_box .logo .ico{display: block;width: 160px;height: 28px;background: url(../images/front/common/logo.svg) no-repeat 0 0 / 100% 100%;}
.login_wrap .login_box .form_container{margin-top: 32px;}
.login_wrap .login_box .form_container .label{font-size: 18px;}
.login_wrap .login_box .form_container .inp_base{height: 52px;}
.login_wrap .login_box .form_container .form_wrap{margin-top: 20px;}
.login_wrap .login_box .form_container .form_wrap label{margin-bottom: 0;font-size: 16px;}
.login_wrap .login_box .btn_primary{margin-top: 28px;}

/*============================================================
에러
=============================================================*/
.error_wrap {display:flex;justify-content:center;align-items:center;flex-direction:column;height:100vh;padding:0 20px}
.error_wrap .error_con {position:relative;padding-top:170px;text-align:center;}
.error_wrap .error_con::before {content:'';position:absolute;top:0;left:50%;width:210px;height:170px;margin-left:-105px;background:url(../images/front/common/error_404.svg) no-repeat 0 0 / 210px 170px}
.error_wrap .error_con.error500::before {background:url(../images/front/common/error_500.svg) no-repeat 0 0 / 210px 170px}
.error_wrap .error_con .tit {margin-top:16px;font-size:18px;font-weight:700;line-height:24px;letter-spacing:-.09px;}
.error_wrap .error_con .desc {margin-top:12px;font-size:14px;color:#6F7277;line-height:20px;letter-spacing:-.07px;}
.error_wrap .error_con .desc .br {display:block}
.error_wrap .btn_wrap {width:100%;margin-top:40px}

/*============================================================
서비스 이용약관
=============================================================*/
.policy_cont {background-color: #fff;}
.policy_cont .inner {padding:50px 20px 80px}
.policy_cont .tit_depth2 {margin-bottom:40px;text-align:center}
.policy_cont h3 {margin-bottom:20px;font-family: OneShinhan;font-size:20px;font-weight:700;line-height:28px;letter-spacing:-.1px;}
.policy_cont h4 {margin-bottom:20px;font-size:18px;font-weight:700;line-height:24px;letter-spacing:-.09px;}
.policy_cont p {font-size:16px;color:#6F7277;line-height:24px;letter-spacing:-.08px;word-break: keep-all;}
.policy_cont p + ol {margin-top:20px}
.policy_cont ol + p {margin-top: 20px;}
.policy_cont p a {color: #6F7277;}
.policy_cont ol li {font-size:16px;color:#6F7277;line-height:24px;letter-spacing:-.08px;word-break: keep-all;}
.policy_cont ol li > ol {padding-left: 20px;padding-top: 4px;}
.policy_cont ol li > ol li {font-size: 14px;line-height: 20px;}
.policy_cont ol li a{color:#6F7277;}
.policy_cont article {margin-bottom:20px}
.policy_cont .tbl_data_wrap{margin-top: 20px;white-space: nowrap;}
.policy_cont .tbl_data_wrap thead th{color:#6F7277;}
.policy_cont .tbl_data_wrap tbody td{color:#6F7277;}


/* 퀵배너 */
.quick_banner{position: fixed;right: 20px;bottom: 20px;;z-index: 10;}
.quick_banner.absolute{position: absolute !important;bottom: -28px;}
.quick_banner .btn_quick{display: flex;justify-content: center;align-items: center;width: 56px;height: 56px;border-radius: 50%;background: #0046FF;font-size: 10px;font-weight: 700;color:#fff;}
.quick_banner .btn_quick span{display: flex;flex-direction: column;justify-content: center;align-items: center;}
.quick_banner .btn_quick span::before{content: '';display: inline-block;width: 21px;height: 21px;padding-bottom: 2px;background: url(../images/front/common/ico_guide.svg) no-repeat center / 21px;}

@media screen and (min-width:1024px){
    /*============================================================
    공통
    =============================================================*/
    .container_dev {padding-top:80px;transition:all .2s}
    .wrap.pc_down .container_dev {padding-top:64px}
    .container_dev.v2 {padding-top:0}
    .wrap.pc_down .container_dev.v2 {padding-top:0}
    .wrap.main .header_dev.v2 .nav_dev .navbar_dev {background:transparent}

    .visual_top.height120{height: 200px;}
    .visual_top.height120 .inner{max-width: 1224px;margin: 0 auto;padding: 0 80px;box-sizing: content-box;}
    .visual_top.height120 .inner .top_wrap{padding-top: 72px;}

    .tab_wrap .tabs{justify-content: center;}
    .tab_wrap .tabs .tab_link a{font-size: 18px;line-height: 24px;}

    .board_none{margin-top: 100px;padding-bottom: 120px;}
    .board_none p {font-size:24px;line-height:32px;letter-spacing:-.12px;}

    /*============================================================
    가이드
    =============================================================*/

    /* button */
    .btn_primary {width: 160px;padding: 16px 40px;font-size: 18px;letter-spacing: -.09px;}
    .btn_gray {width:auto;padding:16px 40px;font-size:18px;letter-spacing:-.09px;}

    /* header */
    .header_dev {position:fixed;top:0;left:0;right:0;z-index:200;height:80px;background:#0F1114;transition:all .2s}
    .header_dev .inner {height:80px;padding:0 40px}
    .header_dev .h_top {position:initial;height:auto;padding:0;transform: none;transition:none}
    .header_dev .logo {position:absolute;width:368px;height:80px;z-index:110;}
    .header_dev .logo .ico {width:368px;height:48px;background: url(../images/front/common/gnb_logo.svg) no-repeat 0 0 / 100% 100%;}
    .header_dev .btn_dropdown {display:none}

    .header_dev .nav_dev  {display:flex;align-items:center;height:100%}
    .header_dev .nav_dev .navbar_dev {overflow-y:unset;align-items:center;justify-content:flex-end;flex-direction:row;gap:2%;position:initial;height:auto;padding:0;background:transparent}
    .header_dev .navbar_dev>li {position:relative;height:100%;transition:all .3s ease}
    .header_dev .navbar_dev>li:last-child {padding-right:0}
    .header_dev .navbar_dev>li .sub_menu {display:flex;flex-direction:column;gap:4px;position:absolute;top:62px;left:1vw;overflow:hidden;visibility:hidden;width:140px;padding:12px 8px;border-radius:16px;border:1px solid rgba(255, 255, 255, 0.05);background:#252933}
    .header_dev .navbar_dev>li.has_sub>a.active+.sub_menu {height:0}
    .header_dev .navbar_dev>li>a {display:flex;align-items:center;height:80px;padding:0 2vw;color:#FFF;opacity:.8;}
    .header_dev .navbar_dev>li>a:hover {color:#FFF}
    .header_dev .navbar_dev>li.has_sub>a::after {display:none}
    .header_dev .navbar_dev>li>a.ico_arw::after {height:24px;background:url(../images/front/common/ico_new_window_pc.svg) no-repeat 0 0 / 16px}
    .header_dev .navbar_dev>li .sub_menu li a {padding:12px;font-size:16px;color:#fff;opacity:.8;}
    .header_dev .navbar_dev>li .sub_menu li a:hover {border-radius: 8px;background: #20232A;font-weight:700;color:#FFF}
    .header_dev .navbar_dev>li:hover>a {opacity: 1;}
    .header_dev .navbar_dev>li.has_sub:hover>a+.sub_menu {overflow:visible;visibility:visible;height:auto !important;max-height:unset !important}
    .header_dev.hide .navbar_dev>li.has_sub:hover>a+.sub_menu {display: none;}
    .header_dev .navbar_dev>li>a.focused {opacity: 1;}
    .header_dev .navbar_dev>li.has_sub>a.focused+.sub_menu {overflow:visible;visibility:visible;height:auto !important;max-height:unset !important}

    .wrap.pc_down .header_dev {height:64px}
    .wrap.pc_down .header_dev .inner {height:64px}
    .wrap.pc_down .header_dev .logo {width:322px;height:64px;}
    .wrap.pc_down .header_dev .logo .ico {width:322px;height:64px}
    .wrap.pc_down .header_dev .navbar_dev>li>a {height:64px}
    .wrap.pc_down .header_dev .navbar_dev>li .sub_menu {top:50px}

    .header_dev.v2 {background: rgba(0, 0, 0, 0.10);}
    .wrap.pc_down .header_dev.v2 {background: #0F1114}

    /* footer */
    .footer_dev .inner {display: flex;gap: 80px;position:relative;padding:40px;}
    .footer_dev .f_top {display:flex;align-items:start;gap:80px}
    .footer_dev .f_top .f_logo {flex: none;width:136px;height:32px}
    .footer_dev .f_top .f_link {padding-top:0}
    .footer_dev .f_top .f_link ul {gap:16px 32px;}
    .footer_dev .f_top .f_link ul li a {font-size:16px;line-height:20px;letter-spacing:-.08px;}
    .footer_dev .f_info ul li a {font-size:16px;letter-spacing:-.08px;}
    .footer_dev .copyright {padding-top:24px;font-size:16px;line-height:20px;letter-spacing:-.08px;}
    .footer_dev .f_family {margin-left: auto;padding-top:0;}
    .footer_dev .f_family .btn {width:200px;}
    .footer_dev .f_family .btn::after {width:24px;height:24px;margin-top:-12px;background:url(../images/front/common/ico_plus_x24.svg) no-repeat 0 0 / 24px}
    .footer_dev .f_family .family_site_list{bottom: 144px;}

    /* collapse */
    .faq_list li .acc_head .btn_que {padding:20px 60px 20px 20px;font-size:18px;line-height:24px;letter-spacing:-.09px;}
    .faq_list li .acc_head .btn_que span {font-size:13px;line-height:16px;letter-spacing:-.09px;}
    .faq_list li .acc_head .btn_que i {width:24px;height:24px;}
    .faq_list li .acc_head .btn_que .ico_down {right:20px}
    .faq_list li .acc_body .editor {padding:0px 20px 20px;font-size:16px;line-height:24px;letter-spacing:-.09px;}

    /* font */
    .tit_depth1 {font-size:64px;line-height:72px;letter-spacing:-.32px;}
    .tit_depth2 {font-size:48px;line-height:56px;letter-spacing:-.24px;}
    .tit_depth3 {font-size:32px;line-height:40px;letter-spacing:-.16px;}
    .tit_depth4 {font-size:24px;line-height:32px;letter-spacing:-.12px;}

    /*============================================================
    공통
    =============================================================*/
    .visual_top {height:200px}
    .visual_top .visual_con_wrap .top_wrap {padding-top:94px}
    .visual_top .visual_con_wrap .top_wrap .desc {padding-top:24px;font-size:24px;line-height:32px;letter-spacing:-.12px;}

    .content .inner {padding:0 80px}
    .tab_wrap .swiper-container {padding:0 80px}

    /*============================================================
    main
    =============================================================*/
    .container_dev.main_dev .txt_wrap h3 {font-size:32px;line-height:40px;letter-spacing:-.16px;}
    .container_dev.main_dev .txt_wrap h3 .br {display: inline;}
    .container_dev.main_dev .txt_wrap .desc {font-size:18px}

    .container_dev .main_visual {height:640px}
    .container_dev .main_visual::before {right:-330px;width:840px;height:600px}
    .container_dev .main_visual .inner {position:relative;padding:180px 40px}
    .container_dev .main_visual .txt_wrap h2 {padding-right:0;font-size:40px;line-height:56px;letter-spacing:-.2px;}
    .container_dev .main_visual .txt_wrap h2 span:last-child {display:block}
    .container_dev .main_visual .txt_wrap .desc {display:block;font-size:18px}
    .container_dev .main_visual .txt_wrap .btn_line {margin-top:48px}
    .container_dev .main_visual .img_wrap.is_mobile {display:none}
    .container_dev .main_visual .img_wrap.is_pc {display:flex;align-items:flex-end;position:absolute;bottom:0;left:50%}
    .container_dev .main_visual .img_wrap.is_pc .img_left {position:relative;z-index:1;width:240px;height:440px;margin-right:-80px;background:url(../images/front/main/main_visual_pc1.png) no-repeat 0 0 / cover;animation:motion01 1.5s both}
    .container_dev .main_visual .img_wrap.is_pc .img_right {width:800px;height:560px;background:url(../images/front/main/main_visual_pc2.png) no-repeat 0 0 / cover;animation:motion02 1.5s both}

    @keyframes motion01 {
        0% {transform: translateX(-40px)}
        100% {transform: translateX(0)}
    }
    @keyframes motion02 {
        0% {transform: translateX(0)}
        100% {transform: translateX(-40px)}
    }

    .container_dev .main_intro .inner {padding:120px 40px 0}
    .container_dev .main_intro .swiper-container {min-height: 1390px;margin-top:48px;}
    .container_dev .main_intro .swiper-wrapper {flex-wrap:wrap;gap:20px 24px}
    .container_dev .main_intro .swiper-slide {width:calc(33.33% - 16px);padding:40px}
    .container_dev .main_intro .swiper-slide:hover {background-color:#252933}
    .container_dev .main_intro .swiper-slide.slide_common::after {content:'';position:absolute;right:0;bottom:0;width:200px;height:180px;background:url(../images/front/main/shinhan_mark.svg) no-repeat 0 0 / cover}
    .container_dev .main_intro .swiper-slide .desc {font-size:16px}
    .container_dev .main_intro .swiper-slide .btn_wrap {margin-top:32px}

    .container_dev .main_api .inner {padding:120px 40px 0}
    .container_dev .main_api .cont_wrap ul {flex-direction: row;gap:24px;margin-top:48px}
    .container_dev .main_api .cont_wrap ul li {flex:1}

    .container_dev .main_build {margin-top:120px}
    .container_dev .main_build .inner {padding:120px 40px}
    .container_dev .main_build .cont_wrap .panel_ul {flex-direction:row;gap:40px;margin-top:48px}
    .container_dev .main_build .cont_wrap .panel_ul li {flex:1}
    .container_dev .main_build .cont_wrap .panel_ul li .txt_box .tit {font-size:20px;line-height:28px;letter-spacing:-.1px;}
    .container_dev .main_build .cont_wrap .panel_ul li .txt_box .tit .pc_br {display:block}
    .container_dev .main_build .cont_wrap .panel_ul li .txt_box .desc ul li {font-size:16px;line-height:24px;}

    .container_dev .main_faq .inner {padding:120px 40px 0}
    .container_dev .main_faq .txt_wrap {height:264px;background:url(../images/front/main/main_faq.jpg) no-repeat 50% 0 / cover}
    .container_dev .main_faq .txt_wrap a {padding:60px 72px}
    .container_dev .main_faq .txt_wrap strong {font-size:24px;line-height:32px;}
    .container_dev .main_faq .txt_wrap strong .br {display: inline;}
    .container_dev .main_faq .txt_wrap .btn_line {margin-top:32px}

    .container_dev .main_notice .inner {padding:80px 40px 0}
    .container_dev .main_notice .panel_wrap {flex-direction: row;gap:24px}
    .container_dev .main_notice .panel_wrap .panel {flex:none; padding:32px 40px}
    .container_dev .main_notice .panel_wrap .panel .tit_wrap .tit {line-height:32px}
    .container_dev .main_notice .panel_wrap .panel .cont_wrap {margin-top:32px}
    .container_dev .main_notice .panel_wrap .panel .cont_wrap ul li a {display:flex;justify-content: space-between;gap:20px}
    .container_dev .main_notice .panel_wrap .panel .cont_wrap .tit {flex:1}
    .container_dev .main_notice .panel_wrap .panel .cont_wrap .date {margin-top:0}

    .container_dev .main_util {margin-top:80px}
    .container_dev .main_util .inner {display:flex;justify-content:space-between;align-items:center;padding:32px 40px;}
    .container_dev .main_util .txt_wrap {display:flex;align-items: center;gap:20px}
    .container_dev .main_util .txt_wrap .tit {font-size:20px;line-height:28px;}
    .container_dev .main_util .txt_wrap .desc {margin-top:0;font-size:16px;line-height:24px;}
    .container_dev .main_util .util_wrap {margin-top:0}
    .container_dev .main_util .util_wrap ul {display:flex;gap:20px;}
    .container_dev .main_util .util_wrap ul li {margin-top:0;font-size:16px;line-height:24px}
    .container_dev .main_util .util_wrap ul li a {font-size:16px;line-height:24px}

    /*============================================================
    main v2
    =============================================================*/
    .main_visual_v2 {height:calc(var(--vh, 1vh) * 100);min-height:800px;}
    .main_visual_v2 .txt_wrap h2 {font-size:40px;line-height:48px;letter-spacing:-.2px;}
    .main_visual_v2 .txt_wrap h2 .br {display:inline}
    .container_dev.main_dev .main_visual_v2 .txt_wrap .desc {display:block;margin-top:40px;}
    .main_visual_v2 .txt_wrap .btn_line {margin-top:60px;padding:16px 59px;font-size:18px;}

    .main_visual_v2 .inner {top:25%;left:120px;right:120px;max-width:1224px;margin:0 auto}
    .main_visual_v2 .control {bottom:25%;left:120px;max-width:1224px;margin:0 auto}
    .main_visual_v2 .swiper-pagination-bullet {width:60px}
    .main_visual_v2 .scroll_down {bottom:40px;right:40px}

    /*============================================================
    FAQ
    =============================================================*/
    .visual_top .faq_bg {background:url(../images/front/customer/visual_faq_pc.jpg) no-repeat 50% 50% / cover}
    .faq_area{padding-bottom: 120px;}
    .faq_area .tab_wrap {padding-top:80px}
    .faq_area .faq_list {padding-top:40px}
    .faq_area .paging {margin-top: 20px;}

    .faq_inquiry{background-color: #292C35;}
    .faq_inquiry .inner {display: flex;align-items: center;justify-content: space-between;max-width: 1224px;margin: 0 auto;padding: 32px 80px;box-sizing: content-box;}
    .faq_inquiry .txt_area strong{font-size: 20px;line-height: 28px;}
    .faq_inquiry .txt_area p{margin-top: 16px;font-size: 16px;line-height: 24px;}
    .faq_inquiry .inner .info_area{display: flex;flex-direction: unset;column-gap: 40px;margin-top: 0;}
    .faq_inquiry .info_area a{font-size: 16px;line-height: 24px;}

    .faq_area .board_none {padding-top:194px;padding-bottom:80px}
    .faq_area .board_none::before {top:40px}

    /*============================================================
    공지사항
    =============================================================*/
    .visual_top .notice_bg{background:url(../images/front/customer/visual_notice_pc.jpg) no-repeat 50% 50% / cover;}
    .board_area{padding:80px 0 120px;}
    .board_area .board_list .th_head{display:block;padding:16px 0;border-top: 1px solid #202225;border-bottom:0;background-color:#F9FAFB;}
    .board_area .board_list .th_head div{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;}
    .board_area .board_list .th_head div span{font-size:16px;font-weight:700;line-height:24px;letter-spacing:-.09px;text-align:center;}
    .board_area .board_list .th_head div .head_num{flex-shrink:0;width:120px;}
    .board_area .board_list .th_head div .head_tit{flex:1;}
    .board_area .board_list .th_head div .head_date{flex-shrink:0;width:240px;}
    .board_area .board_list{border-top:0}
    .board_area .board_list li{padding:16px 0;}
    .board_area .board_list li div span{text-align:center;}
    .board_area .board_list li div{display:flex;flex-direction:unset;justify-content:space-between;flex-wrap:nowrap;}
    .board_area .board_list li div .no{display:block;flex-shrink:0;width:120px;font-size: 16px;line-height: 24px;}
    .board_area .board_list li div .tit{flex:1;padding:0 16px;font-size:16px;letter-spacing:-.09px;text-align:left;}
    .board_area .board_list li div .tit a{-webkit-line-clamp:1}
    .board_area .board_list li div .date{width:240px;padding-top:0;font-size:16px;line-height:24px;letter-spacing:-.09px;}

    .board_area .view_head{display:flex;align-items:center;justify-content:space-between;padding:20px 0;}
    .board_area .view_head .tit{font-size:18px;}
    .board_area .view_head .date{padding-top:0;font-size:18px;line-height:24px;letter-spacing:-.09px;}
    .board_area .view_body{padding:32px 0;line-height:24px;letter-spacing:-.09px;}

    /*============================================================
    자료실
    =============================================================*/
    .visual_top .dataroom_bg {background:url(../images/front/customer/visual_dataroom_pc.jpg) no-repeat 50% 50% / cover}

    .board_area .file_list {display: flex;flex-direction: unset;flex-wrap: wrap;column-gap: 8px;margin-top: 40px;}
    .board_area .file_list .btn_file {display: flex;flex-direction: column;position: relative;width: auto;padding: 12px 24px 12px 56px;}
    .board_area .file_list .btn_file::before {content: '';position: absolute;left: 16px;top: 50%;width: 32px;height: 32px;background: url(../images/front/customer/ico_file.svg) no-repeat center / 32px;transform: translateY(-50%);}
    .board_area .file_list .btn_file .file_size {margin-top: 0;font-size: 13px;line-height: 16px;color: #6f7e77;}

    /*============================================================
    PG API 소개
    =============================================================*/
    /* 신용카드 */
    .visual_top .intro_bg {background:url(../images/front/pgapi/visual_creditcard_pc.jpg) no-repeat 50% 50% / cover}
    .intro_wrap .intro_detail_area:first-child{padding-top: 80px;}
    .intro_wrap .intro_detail_area{padding-bottom: 64px;}
    .intro_wrap .intro_detail_area:last-child{padding-bottom: 120px;}
    .intro_detail_area .tit_depth3{font-size: 32px;line-height: 40px;}
    .intro_detail_area .process_area::after {display:none}

    .intro_detail_area .tbl_data_wrap{white-space: unset;}

    /*============================================================
    로그인
    =============================================================*/
    .login_wrap{padding-top: 0;}
    .login_wrap .login_box{width: 520px;padding: 40px;}
    .login_wrap .login_box .logo .ico{width: 184px;height: 32px;}
    .login_wrap .login_box .btn_primary{width: 100%;}

    /*============================================================
    에러
    =============================================================*/
    .error_wrap .error_con .tit {margin-top:24px;font-size:24px;line-height:32px;letter-spacing:-.12px;}
    .error_wrap .error_con .desc {margin-top:20px;font-size:18px;line-height:24px;letter-spacing:-.09px;}
    .error_wrap .error_con .desc br {display:none}

    /*============================================================
    서비스 이용약관
    =============================================================*/
    .policy_cont .inner {max-width:1440px;margin:0 auto;padding:100px 80px 160px}
    .policy_cont .tit_depth2 {margin-bottom:80px}
    .policy_cont h3 {font-size:32px;line-height:40px;letter-spacing:-.16px;}
    .policy_cont h4 {font-size:24px;line-height:32px;letter-spacing:-.12px;}
    .policy_cont p {font-size:18px;letter-spacing:-.09px;}
    .policy_cont ol li {font-size:18px;letter-spacing:-.09px;word-break: keep-all;}
    .policy_cont ol li > ol li {font-size:16px;line-height: 24px;}
    .policy_cont .sel_box {width:230px;margin-left:auto}
    .policy_cont .tbl_data_wrap{white-space: unset;}

    /* 퀵배너 */
    .quick_banner.absolute{bottom: -40px;}
    .quick_banner{right: 40px;bottom: 40px;}
    .quick_banner .btn_quick{display: flex;justify-content: center;align-items: center;width: 80px;height: 80px;border-radius: 50%;background: #0046FF;font-size: 13px;font-weight: 700;color:#fff;}
    .quick_banner .btn_quick span::before{content: '';display: inline-block;width: 32px;height: 32px;padding-bottom: 2px;background: url(../images/front/common/ico_guide.svg) no-repeat center / 32px;}
}

@media screen and (min-width:1030px){
    .footer_dev .f_top{align-items: center;}
    .footer_dev .f_family .family_site_list{bottom: 120px;}
}

@media screen and (min-width:1280px){
    /*============================================================
    공통
    =============================================================*/
    .content .inner {max-width:1224px;margin:0 auto;box-sizing: content-box;}

    /*============================================================
    FAQ
    =============================================================*/
    .faq_area .bann_box .inner {display:flex;justify-content:space-between;align-items:center;padding:58px 300px 58px 80px}
}

@media screen and (min-width:1440px){
    /* footer */
    .footer_dev .inner {max-width: 1224px;margin:0 auto;box-sizing:content-box;}

    /*============================================================
    main
    =============================================================*/
    .container_dev .main_visual .inner {max-width:1224px;margin:0 auto;box-sizing: content-box;}
    .container_dev .main_visual .img_wrap.is_pc {right:-285px}

    .container_dev .main_intro .inner {max-width:1224px;margin:0 auto;padding:120px 40px 0;box-sizing: content-box;}
    .container_dev .main_intro .swiper-wrapper {gap:24px}
    .container_dev .main_intro .swiper-container {min-height: 924px;margin-top:48px;}
    .container_dev .main_intro .swiper-slide {width:calc(25% - 18px)}

    .container_dev .main_api .inner {max-width:1224px;margin:0 auto;padding:120px 40px 0;box-sizing: content-box;}
    .container_dev .main_build .inner {max-width:1224px;margin:0 auto;padding:120px 40px;box-sizing: content-box;}
    .container_dev .main_faq .inner {max-width:1224px;margin:0 auto;padding:120px 40px 0;box-sizing: content-box;}
    .container_dev .main_notice .inner {max-width:1224px;margin:0 auto;box-sizing: content-box;}
    .container_dev .main_util .inner {max-width:1224px;margin:0 auto;box-sizing: content-box;}
    .container_dev .main_util .util_wrap ul {gap:40px}

    /*============================================================
    main v2
    =============================================================*/
    .main_visual_v2 .control {position:relative;left:auto;}

    /*============================================================
    FAQ
    =============================================================*/
    .faq_inquiry .inner .txt_area{display: flex;align-items: center;column-gap: 20px;}
    .faq_inquiry .inner .txt_area p {margin-top: 0;}
}

/*============================================================
개발가이드
=============================================================*/
.dev_guide_wrap{padding: 40px 0;background-color: #fff;}
.dev_guide_wrap .title_group{padding-top: 40px;}
.dev_guide_wrap .title_group .title{padding-top: 24px;font-family:'OneShinhan';font-size: 32px;font-weight: 700;line-height: 40px;}
.dev_guide_wrap .title_group p{padding-top: 24px;font-size: 18px;line-height: 24px;}
.dev_guide_wrap .dev_menu{display: flex;justify-content: center;padding-top: 48px;}
.dev_guide_wrap .dev_menu .btn_dev_menu{flex: 1;height: 48px;padding: 12px 0;border-top: 1px solid #E6EAED;border-right:1px solid #E6EAED;border-left:1px solid #E6EAED;border-bottom:1px solid #202225;background-color: #f9fafb;font-size: 18px;color: #B2B4B8;line-height: 24px;}
.dev_guide_wrap .dev_menu .btn_dev_menu.active{border-top:1px solid #202225;border-right:1px solid #202225;border-left:1px solid #202225 !important;border-bottom: #fff;background-color: #fff;font-weight: 700;color: #202225;}

.dev_contents .guide_cont_box{word-break: break-all;}
.dev_contents .guide_cont_box .h1_title{padding-top: 48px;font-size: 24px;font-weight: 700;line-height: 32px;}
.dev_contents .guide_cont_box .h2_title{padding-top: 32px;font-size: 20px;font-weight: 700;line-height: 28px;}
.dev_contents .guide_cont_box .h3_title {padding-top: 24px;font-size:18px;font-weight: 600;line-height:24px;}
.dev_contents .guide_cont_box .txt{padding-top: 8px;font-size: 16px;line-height: 24px;}
.dev_contents .guide_cont_box .txt span{color:#0046FF;}
.dev_contents .guide_cont_box .h4_title{position: relative;padding-top: 24px;padding-left: 10px;font-size: 16px;font-weight: 600;line-height: 24px;}
.dev_contents .guide_cont_box .h4_title::before{content: '';position: absolute;bottom:10px;left: 0;width: 4px;height: 4px;border-radius: 2px;background-color: #202225;}
.dev_contents .guide_cont_box .list_num{padding-top: 8px;}
.dev_contents .guide_cont_box .pre_area{overflow-x: auto;margin-top: 16px;padding: 20px 20px 4px 20px;border-radius: 4px;background-color: #E6EAED;}
.dev_contents .guide_cont_box .tbl_data_wrap{padding-top: 16px;white-space: nowrap;}
.dev_contents .guide_cont_box .tbl_data_wrap thead th{border-top: 1px solid #DBDEE1;}
.dev_contents .guide_cont_box .tbl_data_wrap tbody .txt_bold{font-weight: 700;}
.dev_contents .guide_cont_box .tbl_data_wrap tbody .sub_txt{font-size: 13px;color: #6F7277;line-height: 16px;}
.dev_contents .guide_cont_box .tbl_data_wrap tbody .badge{margin-right: 4px;}
.dev_contents .guide_cont_box .tb_desc{font-size: 13px;color:#6f7e77;line-height: 16px;}
.dev_contents .guide_cont_box .dev_payment_flow{display: block;position: relative;margin-top: 16px;border-radius: 8px;}
.dev_contents .guide_cont_box .dev_payment_flow::after{content: '';position: absolute;right: 0;bottom: 0;width: 40px;height: 40px;background: url(../images/front/pgapi/btn_expand.jpg) no-repeat center / 100%;}
.dev_contents .guide_cont_box .dev_payment_flow img{border-radius: 8px;}
.dev_contents .guide_cont_box .pre_area pre{overflow-y: hidden;background-color: #E6EAED;line-height: 20px;}

/* 여백조절 */
.dev_contents .guide_cont_box .pt40 {padding-top: 40px;}
.dev_contents .guide_cont_box .mt40 {margin-top: 40px;}

@media screen and (min-width:1024px){
    /*============================================================
    개발가이드
    =============================================================*/
    .dev_guide_wrap{padding: 80px 0 160px;}
    .dev_guide_wrap .title_group{padding-top: 0;}
    .dev_guide_wrap .dev_top_area{display: flex;flex-direction: row-reverse;justify-content: space-between;align-items: end;}
    .dev_guide_wrap .dev_top_area .sel_box{width: 240px;}
    .dev_guide_wrap .title_group .title{font-size: 40px;}
    .dev_guide_wrap .dev_menu{justify-content: start;border-bottom: 1px solid #202225;}
    .dev_guide_wrap .dev_menu .btn_dev_menu{flex: none;padding: 12px 32px;margin-bottom: -1px;border-left: none;}
    .dev_guide_wrap .dev_menu .btn_dev_menu:first-child{border-left: 1px solid #E6EAED;}

    .dev_contents .guide_cont_box .h1_title{font-size: 32px;line-height: 40px;}
    .dev_contents .guide_cont_box .h2_title {font-size:24px;line-height:32px;}
    .dev_contents .guide_cont_box .h3_title{font-size: 20px;line-height: 28px;}
    .dev_contents .guide_cont_box .tbl_data_wrap{white-space: unset;}
    .dev_contents .guide_cont_box .dev_payment_flow::after{content: none;}
}

/*============================================================
api 서비스 소개 업데이트
=============================================================*/
.sub_visual_top{overflow: hidden;position: relative;}
.sub_visual_top.credit{background: transparent url(../images/front/pgapi/visual_creditcard_v2.png) no-repeat 50% 0 / 1024px 560px;}
.sub_visual_top.virtual{background: transparent url(../images/front/pgapi/visual_virtual_v2.png) no-repeat 50% 0 / 1024px 560px;}
.sub_visual_top.account{background: transparent url(../images/front/pgapi/visual_account_v2.png) no-repeat 50% 0 / 1024px 560px;}
.sub_visual_top.regular{background: transparent url(../images/front/pgapi/visual_regular_v2.png) no-repeat 50% 0 / 1024px 560px;}
.sub_visual_top.brand{background: transparent url(../images/front/pgapi/visual_brand_v2.png) no-repeat 50% 0 / 1024px 560px;}
.sub_visual_top.escrow{background: transparent url(../images/front/pgapi/visual_escorw_v2.png) no-repeat 50% 0 / 1024px 560px;}
.sub_visual_top.agency{background: transparent url(../images/front/pgapi/visual_agency_v2.png) no-repeat 50% 0 / 1024px 560px;}

.sub_visual_top .inner{display: flex;flex-direction: column;justify-content: flex-end;align-items: center;height: 560px;padding: 0 20px 40px;box-sizing: border-box;}
.sub_visual_top .inner .top_wrap{padding-top: 0;color:#fff;text-align: left;word-break: break-all;}
.sub_visual_top .inner .top_wrap .tit_category{font-size: 18px;font-weight: 700;line-height: 24px;letter-spacing: -.08px;}
.sub_visual_top .inner .top_wrap .tit_depth1{padding-top: 8px;letter-spacing: -.08px;}
.sub_visual_top .inner .top_wrap .desc{font-size: 16px;font-weight: 500;line-height: 24px;letter-spacing: -.08px;}
.sub_visual_top .inner .top_wrap .desc.top_line{position: relative;margin-top: 16px;padding-top: 16px;}
.sub_visual_top .inner .top_wrap .desc.top_line::before{content: '';position: absolute;top: 0;left: 0;width: 40px;height: 2px;background: #fff;}

/* 신용카드 */
.intro_detail_area.bg_gradient{background-image: linear-gradient(109deg, #e8fcf9, #e7ecfb, #e6e2fd);}
.intro_detail_area.bg_gray{background: #f3f6ff;}
.intro_detail_area .feature_list{display: flex;flex-direction: column;gap: 16px;padding-top: 16px;}
.intro_detail_area .feature_list li{padding: 28px 24px;border-radius: 16px;background: #fff;box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.12);word-break: break-all;}
.intro_detail_area .feature_list li .list_tit{display: inline-block;background: linear-gradient(to right, #0046ff, #2390df);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;font-size: 18px;font-weight: 700;color: transparent;line-height: 24px;}
.intro_detail_area .feature_list li .list_desc{padding-top: 8px;font-size: 16px;color:#202225;line-height: 24px;}

.intro_detail_area .api_advantage_list{display: flex;flex-direction: column;gap: 16px;padding-top: 24px;}
.intro_detail_area .api_advantage_list li{padding: 28px 24px;border-radius: 16px;background-color: #fff;}
.intro_detail_area .api_advantage_list li .ico{display: inline-block;width: 56px;height: 56px;}
.intro_detail_area .api_advantage_list li .ico.card01{background: url(../images/front/pgapi/ico_card_advantage01.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.card02{background: url(../images/front/pgapi/ico_card_advantage02.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.card03{background: url(../images/front/pgapi/ico_card_advantage03.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.card04{background: url(../images/front/pgapi/ico_card_advantage04.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.card05{background: url(../images/front/pgapi/ico_card_advantage05.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.card06{background: url(../images/front/pgapi/ico_card_advantage06.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.card07{background: url(../images/front/pgapi/ico_card_advantage07.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.card08{background: url(../images/front/pgapi/ico_card_advantage08.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .tit_box{padding-top: 8px;word-break: break-all;}
.intro_detail_area .api_advantage_list li .tit_box strong{font-size: 18px;font-weight: 700;line-height: 24px;letter-spacing: -.08px;word-break: break-all;}
.intro_detail_area .api_advantage_list li .tit_box p{padding-top: 8px;font-size: 16px;color: #6f7277;line-height: 24px;letter-spacing: -.08px;word-break: break-all;}
.api_wrap .intro_detail_area.bg_gradient{padding: 40px 0;}
.api_wrap .intro_detail_area.bg_gray{margin-bottom: 40px;padding: 40px 0;}
.api_wrap .intro_detail_area{padding-bottom: 40px;}

.intro_detail_area .btn_more{display: none;}
.intro_detail_area.mo_active .btn_more{display: block;width: 100%;margin-top: 24px;padding: 12px 16px;border-radius: 8px;border: 1px solid #dbdee1;font-family: 'Pretendard';font-size: 16px;color: #6f6f6f;;font-weight: 700;line-height: 24px;letter-spacing: -0.08px;}
.intro_detail_area.mo_active .api_advantage_list > li:nth-child(n+4){display: none;}

.intro_detail_area .use_ex{margin-top: 24px;padding: 17px 0;border-top: 1px solid #dbdee1;border-bottom: 1px solid #dbdee1;}
.intro_detail_area .use_ex dl{margin-bottom: 16px;word-break: break-all;}
.intro_detail_area .use_ex dl:last-child{margin-bottom: 0;}
.intro_detail_area .use_ex dl dt{position: relative;padding-left: 12px;font-size: 16px;font-weight: 700;line-height: 24px;}
.intro_detail_area .use_ex dl dt::before{content: '';position: absolute;left: 0;top:50%;width: 4px;height: 4px;background: #202225;transform: translateY(-50%);}
.intro_detail_area .use_ex dl dd{padding-left: 12px;color: #6f7277;line-height: 20px;}

/* 가상계좌 */
.intro_detail_area .api_advantage_list li .ico.virtual01{background: url(../images/front/pgapi/ico_virtual_advantage01.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.virtual02{background: url(../images/front/pgapi/ico_virtual_advantage02.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.virtual03{background: url(../images/front/pgapi/ico_virtual_advantage03.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.virtual04{background: url(../images/front/pgapi/ico_virtual_advantage04.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.virtual05{background: url(../images/front/pgapi/ico_virtual_advantage05.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.virtual06{background: url(../images/front/pgapi/ico_virtual_advantage06.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.virtual07{background: url(../images/front/pgapi/ico_virtual_advantage07.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.virtual08{background: url(../images/front/pgapi/ico_virtual_advantage08.svg) no-repeat center / 56px;}

/* 계좌이체 */
.intro_detail_area .api_advantage_list li .ico.account01{background: url(../images/front/pgapi/ico_account_advantage01.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.account02{background: url(../images/front/pgapi/ico_account_advantage02.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.account03{background: url(../images/front/pgapi/ico_account_advantage03.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.account04{background: url(../images/front/pgapi/ico_account_advantage04.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.account05{background: url(../images/front/pgapi/ico_account_advantage05.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.account06{background: url(../images/front/pgapi/ico_account_advantage06.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.account07{background: url(../images/front/pgapi/ico_account_advantage07.svg) no-repeat center / 56px;}

/* 정기결제 */
.intro_detail_area .api_advantage_list li .ico.regular01{background: url(../images/front/pgapi/ico_regular_advantage01.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular02{background: url(../images/front/pgapi/ico_regular_advantage02.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular03{background: url(../images/front/pgapi/ico_regular_advantage03.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular04{background: url(../images/front/pgapi/ico_regular_advantage04.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular05{background: url(../images/front/pgapi/ico_regular_advantage05.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular06{background: url(../images/front/pgapi/ico_regular_advantage06.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular07{background: url(../images/front/pgapi/ico_regular_advantage07.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular08{background: url(../images/front/pgapi/ico_regular_advantage08.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular09{background: url(../images/front/pgapi/ico_regular_advantage09.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.regular10{background: url(../images/front/pgapi/ico_regular_advantage10.svg) no-repeat center / 56px;}

/* 브랜드페이 */
.intro_detail_area .api_advantage_list li .ico.brand01{background: url(../images/front/pgapi/ico_brand_advantage01.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.brand02{background: url(../images/front/pgapi/ico_brand_advantage02.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.brand03{background: url(../images/front/pgapi/ico_brand_advantage03.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.brand04{background: url(../images/front/pgapi/ico_brand_advantage04.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.brand05{background: url(../images/front/pgapi/ico_brand_advantage05.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.brand06{background: url(../images/front/pgapi/ico_brand_advantage06.svg) no-repeat center / 56px;}

/* 에스크로 */
.intro_detail_area .api_advantage_list li .ico.escrow01{background: url(../images/front/pgapi/ico_escrow_advantage01.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.escrow02{background: url(../images/front/pgapi/ico_escrow_advantage02.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.escrow03{background: url(../images/front/pgapi/ico_escrow_advantage03.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.escrow04{background: url(../images/front/pgapi/ico_escrow_advantage04.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.escrow05{background: url(../images/front/pgapi/ico_escrow_advantage05.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.escrow06{background: url(../images/front/pgapi/ico_escrow_advantage06.svg) no-repeat center / 56px;}

/* 지급대행 */
.intro_detail_area .api_advantage_list li .ico.agency01{background: url(../images/front/pgapi/ico_agency_advantage01.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.agency02{background: url(../images/front/pgapi/ico_agency_advantage02.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.agency03{background: url(../images/front/pgapi/ico_agency_advantage03.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.agency04{background: url(../images/front/pgapi/ico_agency_advantage04.svg) no-repeat center / 56px;}
.intro_detail_area .api_advantage_list li .ico.agency05{background: url(../images/front/pgapi/ico_agency_advantage05.svg) no-repeat center / 56px;}


@media screen and (min-width:1024px){
    /*============================================================
    api 서비스 소개 업데이트
    =============================================================*/
    .sub_visual_top.credit{background: transparent url(../images/front/pgapi/visual_creditcard_v2_pc.png) no-repeat 50% 0 / cover;}
    .sub_visual_top.virtual{background: transparent url(../images/front/pgapi/visual_virtual_v2_pc.png) no-repeat 50% 0 / cover}
    .sub_visual_top.account{background: transparent url(../images/front/pgapi/visual_account_v2_pc.png) no-repeat 50% 0 / cover}
    .sub_visual_top.regular{background: transparent url(../images/front/pgapi/visual_regular_v2_pc.png) no-repeat 50% 0 / cover}
    .sub_visual_top.brand{background: transparent url(../images/front/pgapi/visual_brand_v2_pc.png) no-repeat 50% 0 / cover}
    .sub_visual_top.escrow{background: transparent url(../images/front/pgapi/visual_escorw_v2_pc.png) no-repeat 50% 0 / cover}
    .sub_visual_top.agency{background: transparent url(../images/front/pgapi/visual_agency_v2_pc.png) no-repeat 50% 0 / cover}


    .sub_visual .inner{max-width: 1440px;margin: 0 auto;padding: 80px;box-sizing: content-box;}
    .sub_visual_top .inner{max-width: 1224px;margin: 0 auto;padding: 80px;box-sizing: content-box;}
    .sub_visual_top .inner .top_wrap .tit_category{font-size: 24px;line-height: 32px;}
    .sub_visual_top .inner .top_wrap .tit_depth1{font-size: 48px;line-height: 56px;}
    .sub_visual_top .inner .top_wrap .desc{font-size: 18px;line-height: 24px;}
    .sub_visual_top .inner .top_wrap .desc.top_line{margin-top: 24px;padding-top: 24px;}

    /* 신용카드 */
    .api_wrap .intro_detail_area{padding-bottom: 64px;}
    .api_wrap .intro_detail_area:last-child{padding-bottom: 120px;}
    .api_wrap .intro_detail_area.bg_gradient{overflow: hidden;padding:80px 0 0;}
    .api_wrap .intro_detail_area.bg_gray{margin-bottom: 80px;padding: 80px 0;}

    .intro_detail_area .feature_list{flex-direction: unset;gap: 24px;padding-top: 24px;}
    .intro_detail_area .feature_list li{flex: 1;height: 200px;padding: 32px 32px 0;border-bottom-left-radius: 0;border-bottom-right-radius: 0;}
    .intro_detail_area .feature_list li .list_tit{font-size: 24px;line-height: 32px;}
    .intro_detail_area .api_advantage_list{flex-direction: unset;gap: 24px;flex-wrap: wrap;}
    .intro_detail_area .api_advantage_list li{display: flex;gap: 24px;width: calc(50% - 16px);padding: 32px;}
    .intro_detail_area .api_advantage_list > li:nth-child(n+4){display: flex;}
    .intro_detail_area .api_advantage_list li .ico{flex: none;width: 80px;height: 80px;}
    .intro_detail_area .api_advantage_list li .ico.card01{background: url(../images/front/pgapi/ico_card_advantage01.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.card02{background: url(../images/front/pgapi/ico_card_advantage02.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.card03{background: url(../images/front/pgapi/ico_card_advantage03.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.card04{background: url(../images/front/pgapi/ico_card_advantage04.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.card05{background: url(../images/front/pgapi/ico_card_advantage05.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.card06{background: url(../images/front/pgapi/ico_card_advantage06.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.card07{background: url(../images/front/pgapi/ico_card_advantage07.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.card08{background: url(../images/front/pgapi/ico_card_advantage08.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .tit_box{padding-top: 0;}
    .intro_detail_area .api_advantage_list li .tit_box strong{font-size: 24px;line-height: 32px;}
    .intro_detail_area .api_advantage_list li .tit_box p{font-size: 18px;}

    .intro_detail_area .use_ex{padding: 16px 0;}
    .intro_detail_area .use_ex dl{display: flex;gap: 16px;}
    .intro_detail_area .use_ex dl dt{width: 212px;}
    .intro_detail_area .use_ex dl dd{font-size: 16px;line-height: 24px;}

    /* 가상계좌 */
    .intro_detail_area .api_advantage_list li .ico.virtual01{background: url(../images/front/pgapi/ico_virtual_advantage01.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.virtual02{background: url(../images/front/pgapi/ico_virtual_advantage02.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.virtual03{background: url(../images/front/pgapi/ico_virtual_advantage03.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.virtual04{background: url(../images/front/pgapi/ico_virtual_advantage04.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.virtual05{background: url(../images/front/pgapi/ico_virtual_advantage05.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.virtual06{background: url(../images/front/pgapi/ico_virtual_advantage06.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.virtual07{background: url(../images/front/pgapi/ico_virtual_advantage07.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.virtual08{background: url(../images/front/pgapi/ico_virtual_advantage08.svg) no-repeat center / 80px;}

    /* 계좌이체 */
    .intro_detail_area .api_advantage_list li .ico.account01{background: url(../images/front/pgapi/ico_account_advantage01.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.account02{background: url(../images/front/pgapi/ico_account_advantage02.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.account03{background: url(../images/front/pgapi/ico_account_advantage03.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.account04{background: url(../images/front/pgapi/ico_account_advantage04.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.account05{background: url(../images/front/pgapi/ico_account_advantage05.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.account06{background: url(../images/front/pgapi/ico_account_advantage06.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.account07{background: url(../images/front/pgapi/ico_account_advantage07.svg) no-repeat center / 80px;}

    /* 정기결제 */
    .intro_detail_area .api_advantage_list li .ico.regular01{background: url(../images/front/pgapi/ico_regular_advantage01.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular02{background: url(../images/front/pgapi/ico_regular_advantage02.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular03{background: url(../images/front/pgapi/ico_regular_advantage03.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular04{background: url(../images/front/pgapi/ico_regular_advantage04.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular05{background: url(../images/front/pgapi/ico_regular_advantage05.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular06{background: url(../images/front/pgapi/ico_regular_advantage06.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular07{background: url(../images/front/pgapi/ico_regular_advantage07.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular08{background: url(../images/front/pgapi/ico_regular_advantage08.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular09{background: url(../images/front/pgapi/ico_regular_advantage09.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.regular10{background: url(../images/front/pgapi/ico_regular_advantage10.svg) no-repeat center / 80px;}

    /* 브랜드페이 */
    .intro_detail_area .api_advantage_list li .ico.brand01{background: url(../images/front/pgapi/ico_brand_advantage01.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.brand02{background: url(../images/front/pgapi/ico_brand_advantage02.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.brand03{background: url(../images/front/pgapi/ico_brand_advantage03.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.brand04{background: url(../images/front/pgapi/ico_brand_advantage04.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.brand05{background: url(../images/front/pgapi/ico_brand_advantage05.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.brand06{background: url(../images/front/pgapi/ico_brand_advantage06.svg) no-repeat center / 80px;}

    /* 에스크로 */
    .intro_detail_area .api_advantage_list li .ico.escrow01{background: url(../images/front/pgapi/ico_escrow_advantage01.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.escrow02{background: url(../images/front/pgapi/ico_escrow_advantage02.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.escrow03{background: url(../images/front/pgapi/ico_escrow_advantage03.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.escrow04{background: url(../images/front/pgapi/ico_escrow_advantage04.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.escrow05{background: url(../images/front/pgapi/ico_escrow_advantage05.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.escrow06{background: url(../images/front/pgapi/ico_escrow_advantage06.svg) no-repeat center / 80px;}

    /* 지급대행 */
    .intro_detail_area .api_advantage_list li .ico.agency01{background: url(../images/front/pgapi/ico_agency_advantage01.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.agency02{background: url(../images/front/pgapi/ico_agency_advantage02.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.agency03{background: url(../images/front/pgapi/ico_agency_advantage03.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.agency04{background: url(../images/front/pgapi/ico_agency_advantage04.svg) no-repeat center / 80px;}
    .intro_detail_area .api_advantage_list li .ico.agency05{background: url(../images/front/pgapi/ico_agency_advantage05.svg) no-repeat center / 80px;}
}