@charset "utf-8";
/****************************************************************************************************************
	00.settion
****************************************************************************************************************/
sub {display:inline-block;margin-top:-4px;vertical-align:top;}
i {box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;}
/****************************************************************************************************************
	[layout guide]
	20. section, contents, wrap
	21. layout
	22. etc
	30. template guide
****************************************************************************************************************/
/* 20. section, contents, wrap */
[class$="-wrap"] {}
[class$="-section"] {}
[class$="-article"] {}

.content-section {}
.content-header {padding:27px 0 20px;min-height:90px;}
.content-header [class*="-tit"] {float:left;}
.content-header .inquiry-field {margin-bottom:0;}
.content-footer {}
.content-footer [class*="-btn"] {width:100%;}

.section-wrap {}
.section-header {}
.section-footer {}

/* section : menu-nav */
[data-menu-depth="1"] > li {display:inline-block;}
[data-menu-depth="1"] > li > [class*="menu-link"] {color:#212429;font-size:16px;}
[data-menu-action="disabled"] .menu-link-btn {color: #acb5bd;cursor:default;}
[data-menu-action="disabled"]:hover .menu-link-btn:before {display:none;}
.menu-nav li {position:relative;text-align:left;vertical-align:top;}

/* section : terms */
.terms-section {padding-bottom:25px;text-align:left;}
.terms-section * {-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;appearance:none;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;}
.terms-section .terms-large-tit {margin-bottom:44px;text-align:center;}
.terms-section .terms-medium-tit {margin-top:22px;margin-bottom:10px;}
.terms-section .terms-medium-tit:first-child {margin-top:0;}
.terms-section .terms-small-tit {font-weight:600;margin-top:18px;margin-bottom:10px;}
.terms-section .terms-small-tit:first-child {margin-top:0;}
.terms-section .terms-small-tit + .terms-board-article {margin-top:0;}
.terms-section .form-small-tit {display:block;margin-bottom:12px;}
.terms-section * + .terms-default-txt,
.terms-section .terms-default-txt + * {margin-top:20px;}
.terms-section .terms-default-txt b {font-weight:600;text-decoration:underline;}
.terms-section [data-form-type="field"] {margin-top:30px;}
.terms-section [data-form-type="field"] li + li {padding-top:22px;}
.terms-section .terms-list {}
.terms-section .terms-list b {font-weight:600;}
.terms-section .terms-list li + li {margin-top:20px;}
.terms-section .terms-list li li + li {margin-top:10px;}
.terms-section .terms-list li ul,
.terms-section .terms-list li ol {margin-top:10px;}
.terms-section .terms-list .terms-small-tit {display:block;margin-top:20px;}
.terms-section .terms-list .terms-small-tit + .terms-default-txt {margin-top:0;margin-left:24px;text-indent:-24px;}
.terms-section .terms-list .terms-link-btn,
.terms-section .terms-list .terms-default-txt {text-indent:0;}
.terms-section .terms-board-article {margin-top:30px;}
.terms-section .terms-board-article td, 
.terms-section .terms-board-article th {border:1px solid #eceff1;text-align:left;}
.terms-section .terms-board-article thead th {background-color:#fcfcfc;}
.terms-section .terms-board-article b {font-weight:600;}
.terms-section [data-terms-type="history"] {margin-top:50px;}
:not(.terms-section) .terms-default-txt + .terms-small-tit {display: block;}
.terms-article {background-color:#fcfcfc;border:1px solid #c6c8ca;border-radius:10px;height:194px;padding:18px 30px;}
.terms-article .terms-area {height:100%;padding-right:54px;overflow-y:scroll;}
.terms-link-area {padding-bottom:10px;text-align:right;}
.terms-link-area .terms-link-btn {color:#002ae1;}

/* section : 차트 */
.chart-section {align-content:center;position:relative;background-color:#ffffff;border-radius:8px;display:flex;flex-direction:column;flex-wrap:wrap;height:320px;justify-content:center;text-align:center;}
.chart-section .chart-small-tit {margin-bottom:20px;}
.chart-section .chart-default-txt {}
.chart-section .chart-header {}
.chart-section .chart-header .chart-medium-tit {margin-bottom:10px;}
.chart-section .chart-header .output-form {font-size:28px;}
.chart-section .chart-legend-list {text-align:left;}
.chart-section .chart-legend-list [data-chart-color="red"]:before {background-color:#ff8787;}
.chart-section .chart-legend-list [data-chart-color="green"]:before {background-color:#38d9a9;}
.chart-section .chart-legend-list [data-chart-color="blue"]:before {background-color:#0f38de;}
.chart-section .chart-legend-list [data-chart-color="grey"]:before {background-color:#333333;}
.chart-section .chart-legend-list [data-chart-color="#ff8787"]:before {background-color:#ff8787;}
.chart-section .chart-legend-list [data-chart-color="#38d9a9"]:before {background-color:#38d9a9;}
.chart-section .chart-legend-list [data-chart-color="#0f38de"]:before {background-color:#0f38de;}
.chart-section .chart-legend-list [data-chart-color="#333333"]:before {background-color:#333333;}
.chart-section .chart-legend-list [data-form-type="percent"] {margin-left:10px;}

/* article : balance */
.balance-article {align-content:center;background-color:#ffffff;border-radius:8px;display:flex;flex-direction:column;flex-wrap:wrap;height:320px;justify-content:center;text-align:center;}
.balance-article .figure-area {height:70px;margin:0 auto;width:76px;}
.balance-article .balance-small-tit {margin:5px 0;}
.balance-article [data-form-type="USD"] {font-size:28px;font-weight:600;}
.balance-list {overflow:hidden;}
.balance-list li {float:left;width:calc(25% - 22.5px);}
.balance-list li + li {margin-left:30px;}
.balance-list .chart-section {}
.balance-list .chart-legend-list {margin:20px auto 0;width:140px;}
.balance-list .chart-legend-list li:not([data-chart-color]) {width:100%;text-align:center;}
.balance-list .chart-legend-list li {width:100%;margin-left:0;text-transform:capitalize;}
/* .balance-list .chart-legend-list li:nth-child(2n) {margin-left:4px;} */
.balance-list .chart-legend-list li:nth-child(n+3) {margin-top:5px;}
.balance-list .chart-legend-list li:before {content:'';display:inline-block;border-radius:50%;width:10px;height:10px;margin-right:5px;vertical-align:middle;}
.balance-list .progress-area {align-content:center;background-color:#ffffff;border-radius:8px;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:center;height:320px;padding:0 27px;text-align:center;}
.balance-list .progress-area [data-form-type="LTV"] {font-size:28px;font-weight:600;margin-bottom:14px;}

/* article : portfolio */
.portfolio-wrap {overflow:hidden;}
.portfolio-wrap [data-offset] {width:calc(50% - 15px);}
.portfolio-wrap .products-function-area {padding:50px 0 30px;}
.portfolio-wrap .products-function-area .main-link-btn {min-width:256px;}
.portfolio-header .portfolio-medium-tit {font-weight:600;min-height:44px;}
.portfolio-header .product-link-btn {position:absolute;top:36px;right:38px;}
.portfolio-article {background-color:#f2f5ff;border-radius:8px;padding:25px 38px;position:relative;}
.portfolio-article .board-header {background-color:#ffffff;font-size:16px;font-weight:600;padding:30px 30px;height:138px;}
.portfolio-article .board-header .board-default-txt + .board-default-txt {margin-top:8px;}
.portfolio-article .board-header .board-default-txt .output-form {margin-left:10px;}
.portfolio-article .board-header .default-txt-area .board-default-txt,
.portfolio-article .board-header .progress-area > * {display:inline-block;vertical-align:middle;}
.portfolio-article .board-header .progress-area .progress-bar {width:calc(78% - 4px);}
.portfolio-article .board-header .progress-area [data-form-type="LTV"] {font-size:16px;font-weight:600;width:22%;text-align:right;}
.portfolio-article .board-article {background-color:transparent;border-bottom:1px solid #dde2e5;border-radius:0;height:510px;}
.portfolio-article .board-article th, 
.portfolio-article .board-article td {padding-left:5px;padding-right:5px;}
.portfolio-article .board-article .board-noDate-area {height:auto;line-height:453px;padding:0 0;}
.portfolio-article .board-article .portfolio-link-btn:after {content:'>';display:inline-block;margin-left:5px;}
.portfolio-article .board-article .output-form {display:inline-block;width:auto;text-align:inherit;}
.portfolio-article .board-article [data-day-type="over"] {color:#f00 !important}
.portfolio-article .board-article [data-day-type="over"]:after {content:"days over";}
.portfolio-article .board-article [data-day-type="left"]:after {content:"days left";}
.portfolio-article .board-article [data-form-type="token"]:before {display:none;}
.portfolio-article .board-article [data-form-type="LTV"] {font-weight:600;}

/* start - 삭제 예정 : UI 변경으로 사용여부 확인 필요*/
.portfolio-article .list-header {background-color:#ffffff;font-size:16px;font-weight:600;padding:30px 30px;height:138px;}
.portfolio-article .list-header .list-default-txt {text-align:center;}
.portfolio-article .list-header .list-default-txt + .list-default-txt {margin-top:8px;}
.portfolio-article .list-header .list-default-txt .output-form {margin-left:10px;}
.portfolio-article .list-header .default-txt-area {font-size:12px;margin-top:8px;}
.portfolio-article .list-header .default-txt-area .output-form {display:block;font-size:16px;margin-left:0;}
.portfolio-article .list-header .default-txt-area .list-default-txt + .list-default-txt {margin-top:0;}
.portfolio-article .list-header .default-txt-area .list-default-txt {width:calc(50% - 2px);}
.portfolio-article .list-header .default-txt-area .list-default-txt,
.portfolio-article .list-header .progress-area > * {display:inline-block;vertical-align:middle;}
.portfolio-article .list-header .progress-area .progress-bar {width:calc(78% - 4px);}
.portfolio-article .list-header .progress-area [data-form-type="LTV"] {font-size:16px;font-weight:600;width:22%;text-align:right;}
.portfolio-article .list-article {background-color:transparent;border-top:none;padding:0 0;}
.portfolio-article .list-article li {padding:20px 0;}
.portfolio-article .list-article li + li {margin-top:0;border-top:1px solid #dde2e5;}
.portfolio-article .list-article [data-form-type="token"]:before {display:none;}
.portfolio-article .list-article .portfolio-link-btn {font-size:16px;width:100%;text-align:left;}
.portfolio-article .list-article .portfolio-link-btn .output-form:first-child {margin-left:0;}
.portfolio-article .list-article .portfolio-link-btn .output-form {margin-left:10px;}
.portfolio-article .list-article .portfolio-link-btn [data-form-type="crypto"] {float:right;width:auto;text-align:right;}
.portfolio-article .list-article .portfolio-link-btn [data-form-type="crypto"]:after {content:'>';display:inline-block;margin-left:10px;}
.portfolio-article .list-article .portfolio-link-btn [data-form-type="LTV"] {font-weight:600;margin-left:38px;}
/* end - 삭제 예정 */
 
/* wrap : utility-wrap */
.utility-wrap {}
.utility-wrap > * {display:inline-block;position:relative;}
.utility-wrap .arrDown-userInfo-icon {margin-left:10px;transition:all .35s ease-in-out;transform:rotate(0deg);}
.utility-wrap .userInfo-open-btn {padding:0 0;max-width:150px;}
.utility-wrap .userInfo-link-btn {border:solid 1px #eceff1;border-radius:3px;height:30px;line-height:30px;width:100%;text-indent:-24px;}
.utility-wrap .userInfo-link-btn [class*="userInfo-icon"] {float:left;margin-left:10px;margin-top:9px;}
.utility-wrap .userInfo-submit-btn {background-color:#f2f5ff;font-weight:600;height:35px;line-height:35px;width:100%;}
.utility-wrap .userInfo-submit-btn,
.utility-wrap .userInfo-tit {font-weight:600;}
.utility-wrap .userInfo-tit,
.utility-wrap .userInfo-txt {display:block;padding:0 14px;width:100%;}
.utility-wrap .userInfo-txt {color:#002ae1;}
.utility-wrap .userInfo-wrap {font-size:12px;padding:25px 0;margin-right:10px;}
.utility-wrap .userInfo-wrap:after {background-color:#dde2e5;content:'';display:inline-block;width:1px;height:20px;vertical-align:middle;}
.utility-wrap .userInfo-wrap:hover .arrDown-userInfo-icon {transform:rotate(180deg);}
.utility-wrap .userInfo-wrap:hover .userInfo-area {padding-top:26px;}
.utility-wrap .userInfo-area {background-color:#ffffff;border:1px solid #e0e0e0;border-radius:5px;box-shadow:0 10px 20px 0 rgba(0, 0, 0, 0.1);position:absolute;top:64px;left:50%;width:186px;text-align:center;transform:translateX(-50%);z-index:10;}
.utility-wrap .userInfo-list {margin:23px 14px 16px;}
/* wrap : userInfo */
.userInfo-wrap [class*="userInfo-icon"] {margin-right:10px;}
.userInfo-wrap .userInfo-function-btn {}
.userInfo-wrap .userInfo-link-btn {}
.userInfo-wrap .userInfo-open-btn {}
.userInfo-wrap .userInfo-submit-btn {}
.userInfo-wrap .userInfo-tit {}
.userInfo-wrap .userInfo-txt {}
.userInfo-area {}
.userInfo-list li + li {margin-top:5px;}

.utility-wrap .coinInfo-link-btn [class*="coinInfo-icon"] {float:left;margin-left:10px;margin-top:9px;}
.utility-wrap .langInfo-wrap,
.utility-wrap .coinInfo-wrap {font-size:12px;padding:25px 0;margin-right:10px;}
.utility-wrap .langInfo-wrap:after {background-color:#dde2e5;content:'';display:inline-block;width:1px;height:20px;vertical-align:middle;margin-left:14px;}
.utility-wrap .langInfo-wrap:hover .arrDown-userInfo-icon,
.utility-wrap .coinInfo-wrap:hover .arrDown-userInfo-icon,
.utility-wrap .coinInfo-wrap:hover .arrDown-coinInfo-icon {transform:rotate(180deg);}
.utility-wrap .langInfo-wrap:hover .langInfo-area,
.utility-wrap .coinInfo-wrap:hover .coinInfo-area {padding:5px;}
.utility-wrap .langInfo-area,
.utility-wrap .coinInfo-area {background-color:#ffffff;border:1px solid #e0e0e0;border-radius:5px;box-shadow:0 10px 20px 0 rgba(0, 0, 0, 0.1);position:absolute;top:64px;left:50%;width:88px;text-align:center;transform:translateX(-50%);z-index:10;}
.utility-wrap .langInfo-text,
.utility-wrap .coinInfo-text {display:block;width:100%;padding:8px 0;background:transparent;border:0;cursor:pointer;font-size:12px;color:#222;}
.utility-wrap .langInfo-text:hover,
.utility-wrap .coinInfo-text:hover,
.utility-wrap .langInfo-text.is-active,
.utility-wrap .coinInfo-text.is-active {color:#002ae1;font-weight:600;}
.utility-wrap .coinInfo-list {margin:23px 14px 16px;}

/* wrap : visual-wrap */
.visual-wrap {overflow:hidden;}
.visual-wrap [data-offset="left"] {width:790px;}
.visual-wrap [data-offset="right"] {width:380px;}
.visual-wrap .chart-section {}
.visual-wrap .chart-header {position:absolute;left:30px;top:50%;transform:translateY(-50%);min-width:250px;}
.visual-wrap .doughnut-chart {width:500px !important;margin:0 auto;}
.visual-wrap .chart-legend-list {position:absolute;right:80px;top:50%;transform:translateY(-50%);}
.visual-wrap .chart-legend-list li {font-size:16px;}
.visual-wrap .chart-legend-list li + li {margin-top:15px;}
.visual-wrap .chart-legend-list [data-form-type="token"]:before {width:24px;height:24px;}

/* wrap : promotion-banner */
.promotion-banner {}

/* wrap : sitemap (사용하지 않음) */
.sitemap-wrap {}
.sitemap-area {background-color:rgba(0,0,0,0.9);position:fixed;top:0;right:0;bottom:0;z-index:10;overflow:hidden;text-align:center;transition:all .35s ease-in-out;}
.sitemap-area:after {display:inline-block;content:"";height:100%;vertical-align:middle;}

/* wrap : breadcrumb (사용하지 않음) */
.breadcrumb {text-align:right;}
.breadcrumb span:before {content:"";display:inline-block;vertical-align:middle;}
.breadcrumb .home:before {}
.breadcrumb .home ~ span:before {content:">";}

/* wrap : footer > social-list */
.social-list {}
.social-list li {display:inline-block;}
.social-list li + li {margin-left:30px;}
.social-link-btn {width:24px;height:24px;}

/* 21. layout */
/* layout : default — MR-A A3 wiring: max-width + center + gutters (all wraps)
   Literals first as fallback if tokens.css fails to parse. */
.container {
	width: 100%;
	max-width: 1200px;
	max-width: var(--container-max, 1200px);
	margin-left: auto;
	margin-right: auto;
	padding-left: 40px;
	padding-left: var(--page-gutter, 40px);
	padding-right: 40px;
	padding-right: var(--page-gutter, 40px);
	box-sizing: border-box;
	position: relative;
}
/* min-height (not height): a fixed-height parent releases the sticky banner/header after one viewport */
.default-section {min-height:100%;}
/* pure-wrap KYC pages: same content axis when no .container child */
.default-section[data-layout-type="mobile"] {
	width: 100%;
	max-width: 1200px;
	max-width: var(--container-max, 1200px);
	margin-left: auto;
	margin-right: auto;
	padding-left: 40px;
	padding-left: var(--page-gutter, 40px);
	padding-right: 40px;
	padding-right: var(--page-gutter, 40px);
	box-sizing: border-box;
}
.default-header {background-color:#ffffff;position:sticky;top:0;z-index:39;}
/* Absolute chrome must follow gutter (left/right:0 ignores container padding) */
.default-header .logo-default-tit {
	position:absolute;
	left:40px;
	left:var(--page-gutter, 40px);
	top:18px;
}
.default-header .menu-nav {height:70px;padding-left:225px;padding-right:280px;}
.default-header .menu-nav ul, .default-header .menu-nav li {height:100%;}
.default-header .menu-nav li:hover > [data-menu-depth="2"] {padding:22px 23px;}
.default-header [data-menu-depth="1"] > li > .menu-link-btn {padding:22px 25px;min-width:110px;height:100%;}
.default-header [data-menu-depth="1"] > li:hover {background-color:#f2f5ff;}
.default-header [data-menu-depth="1"] > .active > .menu-link-btn {color:#4263eb;}
.default-header [data-menu-depth="1"] > .active > .menu-link-btn:before {background-color:#4263eb;content:'';height:3px;position:absolute;bottom:0;left:0;right:0;}
.default-header [data-menu-depth="2"] {background-color:#ffffff;border:1px solid #e0e0e0;border-radius:5px;box-shadow:0 10px 20px 0 rgba(0, 0, 0, 0.1);min-width:110px;padding:0 23px;position:absolute;top:69px;left:0;z-index:10;}
.default-header [data-menu-depth="2"] > li + li {margin-top:20px;}
.default-header [data-menu-depth="2"] > li > .menu-link-btn {color:#828282;padding:0 0;}
.default-header [data-menu-depth="2"] > li > .menu-link-btn:hover {color:#002ae1;}
.default-header .utility-wrap {
	position:absolute;
	top:0;
	right:40px;
	right:var(--page-gutter, 40px);
}
.default-footer,
.default-lite-footer {background-color:#ffffff;padding:40px 0 28px;text-align:left;}
.default-lite-footer {border-top:1px solid #dde2e5;}
.default-footer a:hover,
.default-lite-footer a:hover {text-decoration:underline;}

/* Sign-in / page modal: full-bleed bar, content column centered */
[data-modal-key="page"] .default-lite-footer {
	align-self:stretch;
	width:100%;
	box-sizing:border-box;
	text-align:left;
	margin-top:48px;
	padding:40px 0 32px;
	background-color:#ffffff;
}

/* One inner shell — centered content axis shared by all 3 tiers */
.default-footer .footer-inner,
.default-lite-footer .footer-inner {
	width:100%;
	max-width: var(--container-max);
	margin:0 auto;
	padding:0 var(--page-gutter);
	box-sizing:border-box;
	text-align:left;
}

/* Tier 1 — 4 equal columns, shared top edge */
.default-footer .footer-link-grid,
.default-lite-footer .footer-link-grid {
	display:grid !important;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:28px 48px;
	align-items:start;
	justify-items:stretch;
}
.footer-col {
	min-width:0;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
}
.footer-col-label {
	display:block;
	width:100%;
	color:#828282;
	font-size:12px;
	font-weight:500;
	line-height:1.4;
	margin:0 0 14px;
	min-height:1.4em;
}

.footer-support-email {margin:0 0 8px;}
.footer-support-email .support-link-btn {
	color:#002ae1;
	font-size:15px;
	font-weight:500;
	text-decoration:none;
}
.footer-support-phone {margin:0;font-size:12px;line-height:1.5;color:#828282;}
.footer-home-link {margin:18px 0 0;font-size:12px;line-height:1.45;}
.footer-home-link .home-link-btn {color:#666666;text-decoration:none;font-weight:400;}

.footer-link-list {
	margin:0;
	padding:0;
	list-style:none;
	width:100%;
}
.footer-link-list li + li {margin-top:10px;}
.footer-link-list .footer-link,
.default-footer .footer-link-list .footer-link,
.default-lite-footer .footer-link-list .footer-link,
.default-footer .terms-list .menu-link-btn,
.default-lite-footer .terms-list .menu-link-btn {
	display:inline;
	font-size:13px;
	font-weight:400;
	padding:0;
	line-height:1.45;
	color:#555555;
	text-decoration:none;
	background:none;
	border:none;
}
/* Upbit pattern: Privacy Policy only is emphasized */
.default-footer .footer-link-list .footer-link[data-button-lable="privacy"],
.default-lite-footer .footer-link-list .footer-link[data-button-lable="privacy"],
.default-footer .terms-list .menu-link-btn[data-button-lable="privacy"],
.default-lite-footer .terms-list .menu-link-btn[data-button-lable="privacy"] {
	font-weight:700;
	color:#333333;
}

/* Tier 2 — corporate band (same content axis as columns) */
.footer-corporate-band {
	margin-top:28px;
	padding-top:20px;
	border-top:1px solid #dde2e5;
	text-align:left;
}
.footer-corporate-line {margin:0;font-size:12px;line-height:1.8;color:#555555;}
.footer-corporate-line .footer-sep {color:#b0b0b0;padding:0 4px;}
.footer-risk-notice {margin:6px 0 0;font-size:11px;line-height:1.5;color:#828282;}

/* Tier 3 — copyright + trust pills */
.footer-bottom-bar {
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:16px;
	margin-top:20px;
	padding-top:16px;
	border-top:1px solid #dde2e5;
	text-align:left;
}
.footer-bottom-bar .copyright-type-txt {
	float:none;
	display:block;
	margin:0;
	font-size:11px;
	line-height:1.4;
	color:#828282;
}
.footer-trust-pills {
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	align-items:center;
	justify-content:flex-end;
	margin:0;
	padding:0;
	list-style:none;
}
.footer-trust-pills li {
	font-size:11px;
	line-height:1.3;
	color:#555555;
	background:#f5f6f8;
	border:1px solid #e0e0e0;
	border-radius:20px;
	padding:3px 12px;
	white-space:nowrap;
}
.default-article {background-color:#f9fafc;padding-bottom:60px;min-height:calc(100vh - 350px);}
.default-article .tab-wrap:not(.content-header + .tab-wrap),
.default-article .board-section:not(.content-header + .board-section) {margin-top:90px;}
.default-article .tab-article .board-section:first-child {margin-top:0;}
.default-article .balance-list + .promotion-banner,
.default-article .chart-section + .promotion-banner,
.default-article .chart-section + .portfolio-wrap,
.default-article .board-section + .chart-section {margin-top:30px;}

/* layout : products */
.products-article {}
.products-article .select-field * {color:#333333;font-size:16px;font-weight:600;}
.products-article .select-field .select-function-btn,
.products-article .select-field .option-function-btn {height:56px;line-height:56px;}
.products-article .select-field[data-select-offset="top"] .option-list {top:58px;}
.products-article .notice-area {margin-top:43px;}
.products-article .notice-area .notice-small-tit {font-weight:600;margin-bottom:18px;}
.products-article .withdraw-field {margin-top:18px;padding-top:30px;border-top:1px solid #D9D9D9;}
.products-article .withdraw-field .gray-box-area {margin-top:30px;padding:30px 22px;overflow:hidden;}
.products-article .withdraw-field .gray-box-area .default-field:nth-of-type(1) {margin-top:0;}
.products-article .withdraw-field + .products-footer {margin-top:40px;} /* [2021-07-01] .withdraw-submit-area 클래스명 변경 */
.products-article .withdraw-field + .products-footer [class*="-btn"] + [class*="-btn"] {margin-left:4px;}
.products-article .deposit-field {}
.products-article .deposit-field .form-default-txt {background-color:#ffffff;border-radius:8px;height:56px;line-height:56px;padding:0 22px;}
.products-article .deposit-field .form-default-txt .default-field {width:calc(100% - 24px);}
.products-article .deposit-field .form-default-txt .input-form {border:none;padding:0 0;}
.products-article .deposit-field .form-default-txt * {color:#333333;}
.products-article .deposit-field .form-default-txt .copy-function-btn {float:right;margin-top:16px;}
.products-summary {border-radius:8px;padding:30px 70px 60px;}
.products-summary * {color:#ffffff;}
.products-summary .article-large-tit * {display:inline-block;vertical-align:middle;}
.products-summary .article-large-tit [data-form-label="productName"],
.products-summary .article-large-tit [data-form-label="productId"] {width:auto;}
.products-summary .article-large-tit [class*="product-icon"] {margin-left:30px;}
.products-summary .article-large-tit .list-link-btn {margin-right:30px;}
.products-summary .article-large-tit [class*="wallet-icon"] {display:block;}
.products-summary .article-medium-tit {margin-bottom:18px;}
.products-summary .article-default-txt {text-align:right;}
.products-summary .list-small-tit {display:block;font-size:12px;margin-bottom:18px;}
.products-summary .list-default-txt {text-align:right;}
.products-summary [data-day-type="over"] {color:#f00 !important}
.products-summary [data-day-type="over"]:after {content:"Days over";}
.products-summary [data-day-type="left"]:after {content:"Days left";}
.products-summary [data-form-label="leftDay"]:after {margin-left:5px;}
.products-summary [data-form-label="leftDay"],
.products-summary [data-form-type="LTV"] {font-size:20px;font-weight:600;line-height:57px;}
.products-summary [data-form-type="LTV"] {margin-left:40px;}
.products-summary [data-form-type="LTV"]:before,
.products-summary [data-form-type="LTV"]:after {color:#ffffff !important;}
.products-summary .summary-list li {border:solid 1px #ffffff;border-radius:8px;float:left;padding:20px 27px;width:calc(25% - 7.5px);min-height:100px;}
.products-summary .summary-list li + li {margin-left:10px;margin-top:0;}
.products-summary .summary-list .section-default-txt {font-size:16px;}
.products-summary .figure-article {width:170px;}
.products-summary .figure-caption {font-size:18px;text-align:center;}
.products-summary .figure-caption[data-token-type]:after {content:"QR Code";margin-left:10px;}
.products-summary strong.figure-caption {display:block;}
.products-summary strong.figure-caption:before {background:url('/front/images/common/icon/icon-arrLeft.png') no-repeat center center;background-size:contain;content:'';display:block;width:24px;height:24px;margin:0 auto;}
.products-summary .figure-area {background-color:#ffffff;margin-top:28px;/* padding:15px 15px; */}
.products-summary .products-function-area {border-bottom:1px dashed #ffffff;display:block;margin:15px -70px 46px;padding:0 70px 46px;text-align:right;}
.products-contents .article-medium-tit {text-align:center;}
.products-contents .article-medium-tit .output-form {color:#002ae1;margin-right:5px;}
.products-contents .list-small-tit {font-weight:600;}
.products-contents .list-wrap {border-bottom:none;}
.products-contents .list-article {border-radius:8px;border-top:none;float:left;padding:0 0;width:calc(50% - 15px);}
.products-contents .list-article + .list-article {margin-left:30px;}
.products-contents .list-article li {height:58px;padding:18px 46px;}
.products-contents .list-article li + li {border-top:1px solid #F5F5F5;margin-top:0;}
.products-contents .step-list {margin:0 0;padding:0 0;}
.products-contents .step-list:after {border:1px dashed #B8B8B8;top:50%;transform:translateY(-50%);}
.products-contents .step-list li {background-color:#f9fafc;padding-top:0;height:48px;line-height:48px;z-index:2;}
.products-contents .step-list li:before {background-color:transparent;color:inherit;content:counter(list-number)". ";font-size:inherit;height:auto;width:auto;line-height:inherit;position:static;}
.products-contents .step-list li:not(.active) {color:#BDBDBD;font-weight:400;}
.products-contents .step-list li:not(.active):before {border:none;height:auto;width:auto;line-height:inherit;}
.products-contents [data-column-value="3"] {margin-left:calc(100% - 258px);}
.products-contents [data-column-value="3"]:after {left:5px;right:3px;}
.products-contents [data-column-value="3"] li {width:calc(33.33% - 20px);}
.products-contents [data-column-value="3"] li + li {margin-left:30px;}

.products-function-area [class*="-function-btn"] {min-width:140px;}
.products-function-area [class*="-function-btn"] + [class*="-function-btn"] {margin-left:6px;}
.products-function-area .main-function-btn {background-color:#38d9a9;}
.products-function-area .main-function-btn:hover, .products-header a.main-function-btn:hover {background-color:#439f84;}
.products-function-area .main-function-btn[disabled], .products-header a.main-function-btn[disabled],
.products-function-area .main-function-btn[disabled]:hover, .products-header a.main-function-btn[disabled]:hover {background-color:#38d9a9;opacity:0.5;}
.products-function-area .general-function-btn, .products-function-area .general-function-btn:hover {border-color:#ffffff;color:#ffffff;}

[lang="ko"] .products-summary .figure-caption[data-token-type]:after {content:"QR 코드";}
[lang="ko"] .products-summary [data-day-type="over"]:after {content:"Days over";}
[lang="ko"] .products-summary [data-day-type="left"]:after {content:"일 뒤 만기";}

/* layout : field */
.field-article {background-color:#FFFFFF;border-radius:12px;box-shadow:0 2px 4px 0 rgb(33 36 41 / 5%);padding:70px 0;}
.field-article .article-medium-tit {margin-bottom:60px;text-align:center;}
.field-article .default-field + .checkbox-field {margin-top:18px;margin-bottom:12px;font-weight:600;}
.field-article [data-form-type="field"],
.field-article .gray-bg-box-area {margin:0 auto;width:600px;}
.field-article .gray-bg-box-area + * {margin-top:50px;}
.field-article .gray-bg-box-area .article-default-txt + * {margin-top:20px;}
.field-article .gray-box-area {height:104px;padding:16px 16px;overflow-y:auto;text-align:left;}
.field-article .gray-box-area + .checkbox-field {margin-top:42px;}
.field-article .gray-box-area + .checkbox-field .check-label {font-size:14px;}
.field-article .field-footer {margin-top:60px;padding:0 50px;text-align:center;}

/* layout : step */
.step-article {margin:0 auto;}
.step-article [data-column-value="2"]:after {left:120px;right:120px;}
.step-article [data-column-value="4"]:after {left:49px;right:49px;}
.step-article [data-column-value="6"]:after {left:22px;right:22px;}
.step-footer {padding-top:40px;}
.step-footer [class*="-btn"] {width:100%;}
.step-footer [class*="-btn"] + [class*="-btn"] {margin-left:4px;}
.step-contents {background-color:#ffffff;border-radius:8px;box-shadow:0 2px 4px 0 rgb(33 36 41 / 5%);}
.step-contents .article-medium-tit {margin-bottom:60px;}
.step-contents .checkbox-field {margin-top:22px;}
.step-contents .list-article .checkbox-field {margin-top:0;}
.step-list {margin:0 auto;padding:27px 0;position:relative;text-align:center;overflow:hidden;}
.step-list:after {border:1px dashed #002ae1;content:'';position:absolute;top:50px;}
.step-list ol {counter-reset:list-number;}
.step-list li {counter-increment:list-number;float:left;color:#002ae1;font-size:12px;font-weight:600;padding-top:56px;position:relative;}
.step-list li:before {background-color:#002ae1;border:none;border-radius:50%;color:#ffffff;content:counter(list-number);font-size:16px;height:48px;line-height:48px;width:48px;position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:2}
.step-list .active ~ *:before {background-color:#ffffff;border:1px solid #002ae1;color:#002ae1;height:46px;line-height:46px;width:46px;}

/* layout : 보안 상태 리스트 */
.verification-list {margin:0 auto; display:flex; justify-content:center }
.verification-list[data-column-value="2"] li {width:calc(50% - 2px);}
.verification-list[data-column-value="3"] li {width:calc(33.33% - 2.5px);}
.verification-list[data-column-value="4"] li {width:calc(25% - 3px);}
.verification-list[data-column-value="5"] li {width:calc(20% - 4px);}
.verification-list li {border:solid 1px #f2f2f2;display:inline-block;font-size:12px;min-height:92px;padding:10px 10px;text-align:center;vertical-align:middle;}
.verification-list li:first-child {border-radius:8px 0 0 8px;}
.verification-list li:last-child {border-radius:0 8px 8px 0;}
.verification-list [class*="tit"] {display:block;font-weight:600;margin-bottom:15px;}
.verification-list .list-default-txt {color:#ff8787;}
.verification-list .active {background-color:#f2f5ff;}
.verification-list .active .list-default-txt {color:#38d9a9;}

/* layout : swap */
.swap-article {margin:0 auto;width:600px;}
.swap-article .article-medium-tit + .article-small-tit {margin-top:60px;}
.swap-article .article-medium-tit, 
.swap-article .article-small-tit {text-align:center;}
.swap-article .article-medium-tit .output-form,
.swap-article .article-small-tit .output-form,
.swap-article .article-default-txt .output-form {color:#002ae1;margin-right:5px;}
.swap-article .article-default-txt {font-size:24px;text-align:center;}
.swap-article .swap-contents {background-color:#FFFFFF;border-radius:8px;box-shadow:0 2px 4px 0 rgb(33 36 41 / 5%);padding:65px 60px;margin:50px 0;}
.swap-article .swap-field .swap-icon-btn {display:block;width:35px;height:35px;margin:60px auto;}
.swap-article .swap-field .select-field * {color:#333333;font-weight:600;}
.swap-article .swap-field [data-form-type="token"]:before {margin-top:-5px;}
.swap-article .swap-field [data-offset="left"] {width:60%;margin-right:5px;}
.swap-article .swap-field [data-offset="left"] + * {width:calc(40% - 5px);margin-top:0;}
.swap-article .swap-footer [class*="-btn"] {width:100%;}
.swap-article .list-wrap {border-bottom:none;}
.swap-article .list-footer {padding-bottom:0;}
.swap-article .list-article .list-small-tit {font-weight:600;}
.swap-article .list-article [data-form-label="paid"] {color:#ff8787;}
.swap-article .swap-contents + .list-wrap {margin-top:0;display:none;}
.swap-article .swap-contents + .list-wrap .list-article {border-radius:8px;border-top:none;box-shadow:0 2px 4px 0 rgb(33 36 41 / 5%);padding:0 0;}
.swap-article .swap-contents + .list-wrap .list-article li {height:58px;padding:18px 46px;}
.swap-article .swap-contents + .list-wrap .list-article li + li {border-top:1px solid #F5F5F5;margin-top:0;}
.swap-article .swap-contents + .list-wrap .list-footer {border-top:none;}

/* layout > default-article : overview */
[data-layout-type="overview"] {}

/* layout > default-article : setting */
[data-layout-type="setting"] {}
[data-layout-type="setting"] [class*="link-area"] {padding:0 50px;text-align:left;}
[data-layout-type="setting"] .article-medium-tit {margin-bottom:60px;text-align:center;}
[data-layout-type="setting"] .article-default-txt b {font-weight:600;}
[data-layout-type="setting"] .article-default-txt + .article-default-txt {margin-top:20px;}
[data-layout-type="setting"] .userInfo-tit:after {content:":";margin-left:5px;}
[data-layout-type="setting"] .options-function-btn {width:270px;}
[data-layout-type="setting"] .userInfo-wrap {background-color:#011fa1;border-radius:8px;/* height:230px; */height:220px;padding:50px 50px;overflow:hidden;}
[data-layout-type="setting"] .userInfo-wrap * {color:#ffffff;}
[data-layout-type="setting"] .userInfo-wrap .userInfo-area {float:left;height:100%;padding-left:45px;padding-right:45px;}
[data-layout-type="setting"] .userInfo-wrap .userInfo-area + .userInfo-area {border-left:1px dashed #ffffff;}
[data-layout-type="setting"] .userInfo-wrap [data-wrap-type="profile"] {padding-left:0;width:45%;}
/*[data-layout-type="setting"] .userInfo-wrap [data-wrap-type="profile"] .userInfo-large-tit {margin-bottom:38px;}*/
[data-layout-type="setting"] .userInfo-wrap [data-wrap-type="profile"] .userInfo-txt {color:#ffffff;}
[data-layout-type="setting"] .userInfo-wrap [data-wrap-type="security"] {width:25%;}
[data-layout-type="setting"] .userInfo-wrap [data-wrap-type="verificationLevel"] {padding-right:0;width:30%;}
[data-layout-type="setting"] .userInfo-wrap .userInfo-large-tit {margin-bottom:28px;}
[data-layout-type="setting"] .userInfo-wrap .userInfo-container {padding-left:140px;}
[data-layout-type="setting"] .userInfo-wrap .figure-area {float:left;width:120px;height:120px;}
[data-layout-type="setting"] .userInfo-list .userInfo-tit {margin-right: 5px;}
[data-layout-type="setting"] .userInfo-list .userInfo-txt {color:#38d9a9;}
[data-layout-type="setting"] .userInfo-list .userInfo-link-btn {color:#ff8787;}
[data-layout-type="setting"] .tab-wrap {margin-top:40px !important;}
[data-layout-type="setting"] .tab-list {height:52px;}
[data-layout-type="setting"] .tab-list li, [data-layout-type="setting"] .tab-list .tab-function-btn {height:100%;}
[data-layout-type="setting"] .tab-article {background-color:#ffffff;border-radius:12px;box-shadow:0 2px 4px 0 rgba(33, 36, 41, 0.05);padding:70px 0;}
[data-layout-type="setting"] .tab-article .gray-bg-box-area {padding:30px 60px;}
[data-layout-type="setting"] .tab-article .gray-bg-box-area .support-link-btn {color:#002ae1;vertical-align:inherit;text-decoration:underline;}
[data-layout-type="setting"] .tab-article .gray-bg-box-area + * {margin-top:50px;}
[data-layout-type="setting"] .list-wrap {border:none;margin:0 auto;width:600px;}
[data-layout-type="setting"] .list-wrap + .list-wrap {margin-top:50px;}
[data-layout-type="setting"] .list-article li + li {margin-top:20px;}
[data-layout-type="setting"] .list-article li li {display:inline-block;margin-top:0;width:calc(50% - 4px);}
[data-layout-type="setting"] .list-article li li:nth-child(n+3) {margin-top:20px;}
[data-layout-type="setting"] .list-article li > [class*="-field"] {display:inline-block;width:calc(100% - 150px);}
[data-layout-type="setting"] .list-article li > .checkbox-field,
[data-layout-type="setting"] .list-article li > .toggleBtn-checkbox-field {width:150px;text-align:right;}
[data-layout-type="setting"] .list-article .list-small-tit {width:calc(100% - 150px);}
[data-layout-type="setting"] .notice-area .notice-medium-tit {margin-bottom:20px;}
[data-layout-type="setting"] .board-footer {border-top:1px solid #eceff1;}
[data-layout-type="setting"] .verification-list {margin-bottom:40px;}
[data-layout-type="setting"] .resetPassword-field {margin:0 auto;width:600px;}
[data-layout-type="setting"] .step-article {width:600px;}
[data-layout-type="setting"] .step-article [data-column-value="4"] {width:480px;}
[data-layout-type="setting"] .step-contents {padding:80px 60px;}
[data-layout-type="setting"] .step-contents .article-small-tit {margin-bottom:20px;}
[data-layout-type="setting"] .step-contents .figure-area {width:70px;height:70px;}
[data-layout-type="setting"] .step-contents .list-wrap {width:auto;}
[data-layout-type="setting"] .setting-footer {margin-top:60px;padding:0 50px;text-align:center;}

/* layout > default-article : products */
[data-layout-type="products"] {}

/* layout > default-article : field */
[data-layout-type="field"] {}

/* layout > default-article : step */
[data-layout-type="step"] {}
[data-layout-type="step"] .content-header [class*="-tit"] {float:none;display:inline-block;vertical-align:middle;}
[data-layout-type="step"] .content-medium-tit {color:#002ae1;margin-left:10px;}
[data-layout-type="step"] .article-small-tit {margin-bottom:20px;}
[data-layout-type="step"] .checkbox-field [class*="-link-btn"] {color:#002ae1;}
[data-layout-type="step"] .signature-section .output-form {color:#333333;}
[data-layout-type="step"] .step-article {width:540px;}
[data-layout-type="step"] .step-article .step-list[data-column-value="4"] {width:400px;}
[data-layout-type="step"] .step-contents {padding:50px 60px;}
[data-layout-type="step"] .step-contents .article-medium-tit {text-align:center;}
[data-layout-type="step"] .step-contents .article-medium-tit [data-form-type="crypto"] {color:#002ae1;margin-right:5px;}
[data-layout-type="step"] .step-contents .article-default-txt {text-align:center;}

/* layout > default-article : mobile (모바일 최소 높이는 510에 최적화 됨) */
[data-layout-type="mobile"] {}
[data-layout-type="mobile"] * {-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;appearance:none;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;}
[data-layout-type="mobile"] [data-form-type="field"] [class*="-txt"] {margin-bottom:10px;}
[data-layout-type="mobile"] [class*="-btn"] {min-width:auto;}
[data-layout-type="mobile"] .enclosure-type-txt {margin-top:10px;}
[data-layout-type="mobile"] .enclosure-type-txt:before {content:"*";margin-right:5px;}
[data-layout-type="mobile"] .step-list {padding-top:0;width:240px;}
[data-layout-type="mobile"] .step-list:after {top:14px;left:0;right:0;}
[data-layout-type="mobile"] .step-list li {font-size:0;height:30px;line-height:30px;padding-top:0;width:30px;z-index:1;}
[data-layout-type="mobile"] .step-list li + li {margin-left:20px;}
[data-layout-type="mobile"] .step-list li:before {content:"V";height:100%;line-height:30px;width:100%;}
[data-layout-type="mobile"] .step-list .active {background-color:#002ae1;border-radius:10px 10px;color:#ffffff;font-size:12px;width:calc(100% - 151px);}
[data-layout-type="mobile"] .step-list .active:before {display:none;}
[data-layout-type="mobile"] .step-list .active ~ *:before {content:counter(list-number);}
[data-layout-type="mobile"] .notice-area {margin-top:20px;}
[data-layout-type="mobile"] .notice-area .dashed-list li {text-indent:-3px;margin-left:6px;}
[data-layout-type="mobile"] .default-article {position:relative;min-height:100%;padding:0 10px 110px;}
[data-layout-type="mobile"] .content-header {min-height:auto;padding:30px 0;}
[data-layout-type="mobile"] .content-header [class*="-tit"] {float:none;}
[data-layout-type="mobile"] .container {background-color:#ffffff;box-shadow:0 2px 4px 0 rgb(33 36 41 / 5%);border-radius:8px;padding:20px 10px;width:auto;}
[data-layout-type="mobile"] .content-footer {position:absolute;bottom:30px;left:10px;right:10px;}

/* layout > default-article : swap */
[data-layout-type="swap"] {}

/* layout : error */

/* 22. etc */
.visual-wrap .swiper-pagination-bullet {background-color:transparent;border:1px solid #ffffff;height:13px;width:13px;opacity:1;}
.visual-wrap .swiper-pagination-bullet-active {background-color:#ffffff;border:none;}
.visual-wrap .swiper-container-horizontal>.swiper-pagination-bullets,
.visual-wrap .swiper-pagination-custom, .swiper-pagination-fraction {bottom:24px;}

.swiper-pagination-progressbar {background:#e4e6e9;}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background:#a50034;}
.swiper-container-horizontal>.swiper-pagination-progressbar,
.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {top:inherit;bottom:0;}

/* 23. app header */
.app-main-header {display:none;position:fixed;top:0;left:0;width:100%;background:#fff;z-index:49;box-shadow:0 2px 4px rgba(0,0,0,0.1);}
.app-header-inner {
	display:flex;align-items:center;justify-content:space-between;height:60px;
	padding:0 20px;
	padding-left:var(--page-gutter, 20px);
	padding-right:var(--page-gutter, 20px);
	box-sizing:border-box;
}
.app-main-logo {display:flex;align-items:center;}
.app-main-logo img {height:24px;width:auto;}
.app-menu-hamburger {width:24px;height:24px;position:relative;background:none;border:none;padding:0;cursor:pointer;}
.app-menu-hamburger span {display:block;width:100%;height:2px;background:#333;position:absolute;left:0;transition:all 0.3s ease;}
.app-menu-hamburger span:nth-child(1) {top:6px;}
.app-menu-hamburger span:nth-child(2) {top:12px;}
.app-menu-hamburger span:nth-child(3) {top:18px;}
.app-menu-hamburger.active span:nth-child(1) {transform:rotate(45deg);top:12px;}
.app-menu-hamburger.active span:nth-child(2) {opacity:0;}
.app-menu-hamburger.active span:nth-child(3) {transform:rotate(-45deg);top:12px;}
.app-user-profile {display:flex;align-items:center;gap:10px;}
.app-utility-type {display:none;color:#666;font-size:14px;}
.app-user-menu-toggle {display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;padding:8px;border-radius:6px;}
.app-user-menu-toggle:hover {background:#f5f5f5;}
.app-username-display {display:none;font-size:14px;font-weight:500;color:#333;}
.app-dropdown-arrow {width:8px;height:8px;border-right:2px solid #333;border-bottom:2px solid #333;transform:rotate(45deg);margin-top:-4px;}
.app-mobile-navigation {position:fixed;top:60px;left:-100%;width:100%;height:calc(100vh - 60px);background:#fff;transition:left 0.3s ease;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.app-mobile-navigation.active {left:0;}
.app-mobile-nav-container {padding:20px;}
.app-mobile-nav-list {list-style:none;}
.app-mobile-nav-item {margin-bottom:10px;}
.app-mobile-nav-button {display:flex;align-items:center;justify-content:space-between;width:100%;padding:15px;background:none;border:none;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;}
.app-mobile-nav-item.active .app-dropdown-arrow {transform:rotate(-135deg);}
.app-mobile-subnav {display:none;list-style:none;padding:10px 15px;}
.app-mobile-nav-item.active .app-mobile-subnav {display:block;}
.app-mobile-subnav a {display:block;padding:12px 15px;color:#666;text-decoration:none;font-size:15px;border-radius:6px;}
.app-mobile-subnav a:hover {background:#f5f5f5;color:#4263eb;}
.app-user-dropdown {position:fixed;top:60px;right:-100%;width:100%;max-width:320px;background:#fff;box-shadow:-2px 0 4px rgba(0,0,0,0.1);transition:right 0.3s ease;z-index:49;}
.app-user-dropdown.active {right:0;}
.app-user-dropdown-container {padding:20px;}
.app-user-dropdown-info {padding-bottom:15px;border-bottom:1px solid #eee;margin-bottom:15px;}
.app-user-fullname {display:block;font-size:18px;font-weight:600;margin-bottom:5px;}
.app-user-account-id {display:block;font-size:14px;color:#666;}
.app-user-dropdown-links {list-style:none;margin-bottom:20px;}
.app-logout-button {width:100%;padding:12px;background:#4263eb;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:500;cursor:pointer;}
.app-navigation-overlay {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:48;}
.app-navigation-overlay.active {display:block;}

/***************************************************************************
	MR-A shell — phone switch. Literal 750px MUST match tokens.css --bp-sm.
	Page body @media BP literals are forbidden (use tokens / this shell only).
***************************************************************************/
@media screen and (max-width:750px) { /* --bp-sm */
	.terms-section {padding:10px 10px;}
	.terms-section .terms-link-btn,
	.terms-section .support-link-btn,
	.terms-section .privacyPolicy-link-btn {color:#002ae1;display:inline;text-align:left;text-decoration:underline;vertical-align:inherit;word-break:break-all;}

	.container {
		width:100%;
		padding-left:20px;
		padding-left:var(--page-gutter, 20px);
		padding-right:20px;
		padding-right:var(--page-gutter, 20px);
	}

	.default-lite-footer .container,
	.default-footer .container,
	.default-lite-footer .footer-inner,
	.default-footer .footer-inner {padding-left:var(--page-gutter);padding-right:var(--page-gutter);}
	.default-footer .footer-link-grid,
	.default-lite-footer .footer-link-grid {
		grid-template-columns:repeat(2,minmax(0,1fr)) !important;
		gap:28px 24px;
	}
	.footer-bottom-bar {flex-direction:column;align-items:flex-start;}
	.footer-trust-pills {justify-content:flex-start;}
	.default-section {padding-top: 60px;}

	.default-header {display: none;}
	.app-main-header {display: block;}

    .default-article {padding: 0;}

    .content-large-tit {font-size: var(--font-size-title-lg-sm);}
    .content-medium-tit {font-size: var(--font-size-title-md-sm);}
    .layerPop-large-tit {font-size: var(--font-size-title-lg-sm);}

    [data-layout-type="setting"] .userInfo-wrap {height: auto; padding: 1rem;}

    [data-layout-type="setting"] .userInfo-wrap [data-wrap-type="profile"] {width:100%;}
    [data-layout-type="setting"] .userInfo-wrap [data-wrap-type="security"] {width:100%;}
    [data-layout-type="setting"] .userInfo-wrap [data-wrap-type="verificationLevel"] {width:100%;}
    [data-layout-type="setting"] .userInfo-wrap .userInfo-container {padding-left:0;}
    [data-layout-type="setting"] .userInfo-wrap .userInfo-area {padding-left:0;padding-right:0;}
    [data-layout-type="setting"] .userInfo-wrap .userInfo-area + .userInfo-area {border-left:none; margin-top: 40px;}

    .userInfo-wrap { display: flex; flex-direction: column; flex-wrap: wrap; justify-content: space-between;}
    .userInfo-wrap .userInfo-area { display: flex; flex-direction: column; align-items: center;}

    [data-layout-type="setting"] .tab-article {padding: 20px 0;}
    [data-layout-type="setting"] .list-wrap {width: 100%;}
    [data-layout-type="setting"] .resetPassword-field {width: 100%; padding: 10px;}
    [data-layout-type="setting"] .step-article {width: 100%;}
    [data-layout-type="setting"] .step-contents {padding: 20px;}
    [data-layout-type="setting"] .tab-article .gray-bg-box-area {display:flex;flex-direction:column;padding:10px 20px;}

    .default-footer,
    .default-lite-footer {padding-left: 10px;padding-right: 10px;}
    .default-footer .footer-link-grid,
    .default-lite-footer .footer-link-grid {
		grid-template-columns:1fr !important;
		gap:24px;
	}
    .default-lite-footer .logo-default-tit {height:auto;}

    [data-layout-type="setting"] .tab-list {overflow-x: scroll;display: flex;}
    [data-layout-type="setting"] .tab-list li {min-width: max-content;}

    [data-layout-type="setting"] .step-article [data-column-value="4"] {width: 100%;}
    .step-list {padding-left:0;}

    .gray-bg-box-area .main-function-btn {margin-top:20px;}

    [data-layout-type="step"] .step-contents {padding:10px 12px;}

    .products-summary strong.figure-caption {display: none;}

    .visual-wrap .doughnut-chart {width:100% !important;}

    .visual-wrap .chart-legend-list {position:static;right:0;top:0;transform:translateY(0%);}
    .chart-section .chart-legend-list {padding: 14px;}
    .visual-wrap .chart-header {position:static;left:0;top:0;transform:translateY(0%);}
    .visual-wrap .chart-section {display: flex; flex-direction: column; height: auto;}

    .products-summary {border-radius:8px;padding:10px 20px 16px;}

    .field-article .gray-bg-box-area {width:100%;}
    .field-article [data-form-type="field"],
    .field-article .gray-bg-box-area {width:100%; padding:10px;}
    [data-layout-type="setting"] .setting-footer {margin-top:60px;padding:0;}
}

@media screen and (min-width:1280px) {
	/* margin:auto already on .container — keep rule for legacy specificity */
	.container {margin-left:auto;margin-right:auto;}
}

/****************************************************************************************************************
	MR-A — Table policy utility classes (apply in MR-D pages; do not invent page-local BP)
	Policy: docs/MR-A-tokens-shell-2026-07-16.md § Table policy
	- Wide data tables (many columns, compare amounts): .table-scroll-wrap
	- Dense ops tables that work as stacked cards on phone: .table-to-card (markup hooks in D)
****************************************************************************************************************/
.table-scroll-wrap {
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.table-scroll-wrap > .default-table,
.table-scroll-wrap > table {
	min-width: 0;
}
/* Optional min-width for desktop column integrity — set per page via --table-min-width */
.table-scroll-wrap .default-table,
.table-scroll-wrap table {
	min-width: var(--table-min-width, 0);
}
@media screen and (max-width:750px) { /* --bp-sm */
	.table-to-card .default-table thead {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
	.table-to-card .default-table,
	.table-to-card .default-table tbody,
	.table-to-card .default-table tr,
	.table-to-card .default-table td {
		display: block;
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
		min-width: 0 !important;
	}
	.table-to-card .default-table {
		table-layout: auto;
	}
	.table-to-card .default-table tr {
		border: 1px solid #dde2e5;
		border-radius: 8px;
		margin-bottom: 12px;
		padding: 12px var(--page-gutter-sm);
		background: #fff;
		box-shadow: 0 2px 4px rgba(0,0,0,0.06);
	}
	.table-to-card .default-table td {
		border: none;
		padding: 8px 0;
		text-align: left !important;
		height: auto;
		min-height: 0;
	}
	.table-to-card .default-table td:first-child {
		padding-top: 0;
		padding-bottom: 10px;
		border-bottom: 1px solid #f0f0f0;
		margin-bottom: 4px;
		font-weight: 600;
	}
	.table-to-card .default-table td:before {
		content: attr(data-th);
		display: block;
		color: #828282;
		font-size: var(--font-size-label);
		font-weight: 500;
		margin-bottom: 4px;
	}
	.table-to-card .default-table td:not([data-th])::before,
	.table-to-card .default-table td[data-th=""]::before {
		display: none;
	}
	.table-to-card .default-table td .output-form {
		display: inline-block;
		font-size: 15px;
		font-weight: 600;
		color: #111827;
		line-height: 1.35;
		word-break: break-all;
	}
	.table-to-card .default-table td[data-column-value="2"],
	.table-to-card .default-table td:last-child {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px;
		padding-top: 12px;
		margin-top: 4px;
		border-top: 1px solid #f0f0f0;
	}
	.table-to-card .default-table td[data-column-value="2"]::before,
	.table-to-card .default-table td:last-child::before {
		flex: 0 0 100%;
		margin-bottom: 0;
	}
	.table-to-card .default-table [class*="link-btn"],
	.table-to-card .default-table [class*="function-btn"] {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 0;
		flex: 1 1 calc(50% - 4px);
		padding: 10px 12px;
		line-height: 1.2;
		height: auto;
		box-sizing: border-box;
	}
	.table-to-card .default-table .board-noDate-area {
		text-align: center;
		padding: 2rem 1rem;
		border: none;
		box-shadow: none;
	}
}

@media screen and (min-width:1441px) {

}

@media screen and (min-width:1920px) {

}
/****************************************************************************************************************
	[template 제어]
	40. contract
****************************************************************************************************************/
/* 40-21. layout */
#template .contract-submit-area {margin-top:43px;}
#template [class*="submit-area"] [class*="btn"] {min-width:170px;height:48px;line-height:48px;}