@charset "utf-8";

/* Header */
	header {position:sticky; left:0; top:0; background:white; z-index:var(--zih);}
	header .h-notice {display:none; position:relative; background:var(--main-color); height:56px; font-weight:700; text-align:center;}
	header .h-notice .inner {position:relative; width:1280px;}
	header .h-notice button {position:absolute; right:var(--init-lrp); top:50%; transform:translate(0, -50%);}
	header .h-notice.active {display:flex; align-items: center; color:white;}

	header .h-wrap {border-bottom:1px solid #ddd;}
	header .h-wrap .inner {display:flex; justify-content: center; position:relative; height:88px;}
	header .h-logo {position:absolute; left:0; top:50%; transform:translate(0, -50%);}
	header .h-logo .panel-logo {display:none;}
	header .h-menu {display:flex; align-items: center; font-size:18px; font-weight:500; text-align:center;}
	header .h-menu > li {position:relative; width:110px;}
	header .h-menu a:hover {font-weight:700; color:var(--main-color);}
	header .h-submenu {display:none; position:absolute; left:0; top:65px; width:100%; font-size:14px; line-height:40px;}
	header .h-util {display:flex; align-items: center; gap:24px; position:absolute; right:0; top:17px; font-size:12px;}
	header .h-menu-bg {background:white; position:absolute; left:0; top:0; width:100%; height:200px; transform:translate(0, -100%);}

	header .h-quick {position:fixed; right:0; top:50%; transform:translate(0, -50%); color:white;}
	header .h-quick a {display:flex; flex-direction: column; align-items: center; justify-content: space-evenly; width:80px; height:96px;}
	header .h-quick a:before {content:""; display:inline-block; background:var(--icon); background-size:var(--bgsize); font-size:0;}
	header .h-quick .type-01 a:before {background-position:-950px -100px; width:30px; height:40px;}
	header .h-quick .type-02 a:before {background-position:-450px -150px; width:56px; height:44px;}

	header .h-appdown {display:none; position:absolute; right:-20px; top:40px; background:white; border:1px solid #e5e5e5; border-radius:4px; width:336px; height:278px; padding:24px;}
	header .h-appdown:before {content:""; position:absolute; left:50%; top:-15px; background:var(--icon); background-size:var(--bgsize); background-position:-600px -150px; width:16px; height:15px; transform:translate(-50%, 0);}
	header .h-appdown [class*="thumb-"] {background:#d4d4d4; width:88px; height:88px;}
	header .h-appdown .h-app-tit {font-size:16px; font-weight:700; text-align:center;}
	header .h-appdown .btncus-ic-ct-close02 {position:absolute; right:0; top:0; width:69px; height:69px;}
	header .h-appdown.active {display:block;}

	header.active .h-menu-bg {transform:translate(0, 89px);}
	header.active .h-notice.active + .h-menu-bg {transform:translate(0, 145px);}
	header.active .h-submenu {display:block;}

/* B2B Header */
	.b2b-layout header {display:flex; flex-direction: column; justify-content: space-between; flex:0 0 268px; position:absolute; left:8px; top:8px; background:var(--main-color); border-radius:24px 0px 0px 24px; width:268px; height:calc(100vh - 16px); padding:15px;}
	.b2b-layout header .h-notice {display:none;}
	.b2b-layout header .h-logo {position:static; transform:translate(0);}
	.b2b-layout header .btncus-ic-home {margin-top:50px;}
	.b2b-layout header .h-menu {flex-direction: column; align-items: normal; gap:28px; border-top:1px solid white; border-bottom:1px solid white; margin:26px 0; padding:28px 0 28px 17px; font-weight:700; text-align:left; color:white;}
	.b2b-layout header .h-menu a:hover {color:white;}
	.b2b-layout header .h-util {justify-content: flex-end; position:fixed; right:32px; top:0; background:white; border-bottom:1px solid #e5e5e5; width:calc(100vw - 339px); padding:32px 0 24px 0;}
	.b2b-layout header .ic-alarm .txt-num {position:absolute; right:-10px; top:-10px; background:#E86365; border-radius:12px; height:auto; padding:0 3px; font-size:9px; font-weight:700; line-height:16px; color:white;}
	
	.b2b-layout header.active {overflow:hidden; flex:0 0 100px; width:80px;}
	.b2b-layout header.active + #container {padding-left:112px;}
	.b2b-layout header.active .h-logo a {overflow:hidden; display:block;}
	.b2b-layout header.active .h-menu {overflow:hidden; border-bottom:0; height:0; padding:0;}
	.b2b-layout header.active .btncus-ic-menu {font-size:0;}
	.b2b-layout header.active .btncus-ic-menu:after {background-position:-850px -200px;}
	.b2b-layout header.active .btncus-ic-home,
	.b2b-layout header.active .h-logo02 {display:none;}

/* Header for Login */
	.header-h-util { display: flex; justify-content: flex-end; align-items: center; gap: 24px; right: 44px; top: 36px; font-size: 12px; padding-bottom: 30px;}
	.header-h-util .ic-alarm .txt-num { position: absolute; right: -10px; top: -10px; background: #E86365; border-radius: 12px; height: auto; padding: 0 3px; font-size: 9px; font-weight: 700; line-height: 16px; color: white;}

/* Footer */
	footer {border-top:1px solid #ddd;}
	footer .inner {display:flex; justify-content: space-between; padding-bottom:48px;}
	footer .f-logo {padding-top:48px;}
	footer .f-logo img {width:172.5px;}
	footer .f-center {padding-top:48px;}
	footer .f-menu {display:flex; font-size:14px;}
	footer .f-copy {margin-top:16px; font-size:12px; line-height:20px; color:#666;}
	footer .f-link {display:flex; margin-top:40px;}

	.b2b-layout footer {margin-top:48px;}
	.b2b-layout footer .inner {width:100%; padding-bottom:40px;}
	.b2b-layout footer .f-logo,
	.b2b-layout footer .f-link {display:none;}

/* Container */
	[class*="inner"] {width:var(--init-cont-w); margin:0 auto; padding:0 var(--init-lrp);}
	#container {padding:70px 0 150px;}

	.sub-top {border-bottom:1px solid var(--main-color); padding-bottom:16px;}
	.sub-top .sub-tit {font-size:40px; font-weight:700; text-align:center;}

	.sub-top02 {padding-bottom:72px;}
	.sub-top02 .sub-tit {font-size:40px; font-weight:700; line-height:56px; text-align:center;}

	.page-loc {display:flex; gap:13px; margin-top:48px; color:#666;}
	.page-loc > * {display:flex; align-items: center; gap:13px;}
	.page-loc > *:first-child {font-weight:700; color:var(--main-color);}
	.page-loc > * + *:before {content:""; display:inline-block; background:var(--icon); background-size:var(--bgsize); background-position:-650px 0; width:7px; height:12px;}

/* B2B Container */
	.b2b-layout {display:flex; overflow-x:hidden; overflow-y:auto; height:100vh; padding:8px 0 8px 8px; font-size:14px;}
	.b2b-layout #container {display:flex; flex-direction: column; justify-content: space-between; width:100%; height:100%; padding:30px 32px 0 300px;}
	.b2b-layout .txt-alarm-msg {display:none; text-align:center;}
	.b2b-layout .txt-alarm-msg.active {display:block;}
	.b2b-layout .txt-alarm-msg .btncus-ic-ct-close {position:absolute; right:10px; top:50%; transform:translate(0, -50%);}
	.b2b-layout .sub-top {border:0; border-top:1px solid #e5e5e5;}
	.b2b-layout .sub-top .sub-tit {padding:48px 0; font-size:24px; text-align:left;}
	.b2b-layout .sub-top-area {padding:48px 0;}
	.b2b-layout .sub-top-area .sub-tit {padding:0;}