
@charset "utf-8";

:root {--background-color:#F5F6F8; --font-color:#101828; --accent-color:#2f5bff; --font-size:10px; --disabled-color:#f6f3f4;}

html, body		{font-size:var(--font-size);}

body					{color:var(--font-color); font-size:1.2rem;}


.beFlex				{display:flex; align-items:center;}
.beFlex.farAway				{justify-content:space-between; column-gap:10px;}
.beFlex.alignCenter		{justify-content:center;}

.beGrid				{display:grid;}
.beGrid.threeRow				{grid-template-rows:auto 1fr auto;}

.mBtn									{background-color:var(--accent-color); color:#fff;}
.gBtn									{background-color:#22c55e; color:#fff;}
.brBtn									{background-color:#d97706; color:#fff;}
button.download			{background-image:url('/images/icon/i_download.png'); background-repeat:no-repeat; background-position:left 20px center; background-size:auto 30%; padding-inline:46px 20px !important;}

.wrap.beFixed					{position:fixed; inset:0;}
.wrap.beGrid					{background-color:var(--background-color); height:100%;}
.wrap.beFixed.beGrid				{place-items:center;}

.wrap .bottom,
.wrap .top							{background-color:#fff;}

.wrap .conts,
.wrap .bottom > div,
.wrap .top > div				{max-width:1440px; margin-inline:auto; padding-inline:32px;}

.wrap > div > .top							{box-shadow:0 3px 5px 0 rgba(0,0,0,.1); min-height:82px;}
.wrap > div > .top .inner				{min-height:82px;}

.wrap > div > .bottom					{border-top:1px solid #ebe6e7;}
.wrap > div > .bottom .inner			{min-height:69px; color:#6a7282; font:1.4rem / 1 "PretendardR";}


.input-wrap						{border:1px solid #d1d5dc; /* box-shadow:0 0 0 1px #d1d5dc inset; */ border-radius:10px; padding-inline:16px; padding-block:3px; transition:.25s;}
.input-wrap:focus-within					{border-color:var(--accent-color); /* box-shadow:0 0 0 1px var(--accent-color); */}

.input-wrap > input[type="password"],
.input-wrap > input[type="number"],
.input-wrap > input[type="tel"],
.input-wrap > input[type="text"]		{color:#364153; font-family:"PretendardM";}

.input-wrap.disabled,
.input-wrap > input[type="password"][disabled],
.input-wrap > input[type="number"][disabled],
.input-wrap > input[type="tel"][disabled],
.input-wrap > input[type="text"][disabled]										{background-color:var(--disabled-color);}

.input-wrap > input::-webkit-input-placeholder	{color:#999;}

.input-wrap.hasOnlyP												{background-color:#fbf9fa;}
.input-wrap > p															{min-height:40px; align-content:center; text-align:center; font:1.6rem / 1 "PretendardM"; color:#364153;}

.beFlex.hasInputWrap.hasBtn									{column-gap:15px;}
.beFlex.hasInputWrap.hasBtn > .input-wrap			{flex:1 1 0;}
.beFlex.hasInputWrap.hasBtn > button					{flex:0 0 auto;}

.hasInputWrap.hasBtn button,
.btn-wrap button										{min-height:48px; border-radius:1rem; padding-inline:20px; font-size:1.6rem; font-family:"PretendardSB";}

.beFlex.btn-wrap > button						{width:100%;}

.toggleSlide										{border:1px solid #dadada; border-radius:10px; min-height:52px; position:relative;}
.toggleSlide > div							{margin:4px;}
.toggleSlide > div:before				{content:""; position:absolute; left:4px; top:4px; width:calc(50% - 4px); height:calc(100% - 8px); background-color:var(--accent-color); border-radius:10px; z-index:0; transition:.25s;}
.toggleSlide .beFlex a					{text-align:center; align-content:center; width:100%; padding-inline:15px; min-width:120px; z-index:1;}
.toggleSlide .beFlex a b							{font:1.6rem / 1 "PretendardB"; transition:.25s;}

.toggleSlide.beFlex,
.toggleSlide .beFlex							{align-items:stretch;}

.toggleSlide.right a:last-child b,
.toggleSlide.left a:first-child b				{color:#fff;}

.toggleSlide.right > div:before				{left:50%;}



.login-wrap								{min-width:520px; padding-inline:16px;}
.login-wrap .logo					{height:48px; background:url('/images/logo/logo.svg') no-repeat center; background-size:auto 100%;}
.login-wrap .loginInput-wrap					{padding:32px; background-color:#fff; border-radius:14px; box-shadow:0 10px 15px -3px rgba(0,0,0,.1);}

.login-wrap dl > dt										{font-size:1.4rem; font-family:"PretendardM"; color:#364153;}
.login-wrap dl > dd										{margin-block:8px;}

.login-wrap > .beGrid				{row-gap:32px;}

.loginInput-wrap > b:first-child						{font:2rem / 1 "PretendardM";}

.loginInput-wrap.beGrid									{row-gap:32px;}
.loginInput-wrap > .beGrid								{row-gap:16px;}


.listWrap.beGrid													{height:100%; row-gap:32px; align-content:start;}
.listWrap .top .logo												{background:url('/images/logo/logo.svg') no-repeat center; background-size:auto 100%; min-height:32px; aspect-ratio:69 / 16;}

.listWrap .conts.beGrid										{row-gap:24px; align-content:start;}

.listWrap .conts													{width:100%;}
.listWrap .conts > div											{background-color:#fff; min-height:74px; width:100%; border-radius:10px; box-shadow: 0 3px 5px 0 rgba(0,0,0,.1); border:1px solid #ebe6e7; padding-inline:24px; padding-block:16px;}

.listWrap .conts .options dl								{font-size:1.6rem; font-family:"PretendardM"; color:#364153;}
.listWrap .conts .options dl.beFlex					{column-gap:20px;}

.listWrap .conts .options .hasSelect								{padding-inline:15px 5px; background-color:#fbf9fa; border-radius:10px; min-width:150px; box-shadow:0 2px 4px 0 rgba(0,0,0,.1);}
.listWrap .conts .options .hasSelect .select					{background-color:transparent;}
.listWrap .conts .options .hasSelect ul.selectBox		{box-shadow:0 1px 7px 0 rgba(0,0,0,.1); padding:5px; left:-15px; top:calc(100% + 5px) !important;}

.listWrap .conts .options .select_box > label				{position:inherit;}
.listWrap .conts .options .selectBox.show					{opacity:1; height:auto; width:inherit; padding:0; white-space:nowrap;}


.listWrap .conts .list-wrap.beGrid								{row-gap:25px;}
.listWrap .conts .list-wrap												{padding-block:30px;}

.listWrap .conts .list-wrap .list										{border:1px solid #dadada; border-radius:10px; overflow:hidden; position:relative; overflow-y:auto; max-height:710px;}
.listWrap .conts .list-wrap .list table							{width:100%;}
.listWrap .conts .list-wrap .list table font					{font-size:1.4rem; font-family:"PretendardM";}

.listWrap .conts .list table thead								{background-color:#fbf9fa; position:sticky; top:0; box-shadow:0 2px 3px 0 rgba(0,0,0,.1);}

.listWrap .conts .list table th > font,
.listWrap .conts .list table td > font							{display:inline-block; min-height:38px; align-content:center; padding-inline:10px;}

.listWrap .conts .list table th > font							{min-height:41px;}

.listWrap .conts .list table th										{border-bottom:1px solid #ebe6e7;}	
.listWrap .conts .list table td										{text-align:center; border-top:1px solid #eee;}

.listWrap .conts .list table tr										{transition:.25s;}

.listWrap .conts .list table tbody tr:hover				{background-color:#eff6ff;}


/* @media screen and (min-width:376px) and (max-width: 768px) { */
@media screen and (min-width:769px) and (max-width: 1439px) {
	.wrap											{padding-top:0;}
}

@media screen and (width:768px) {
	.wrap											{padding-top:0;}	
}

@media screen and (min-width:376px) and (max-width: 767px) {
	.wrap											{padding-top:0;}	
}

/* @media screen and (max-width: 375px) { */
@media screen and (max-width: 375px) {
	.wrap											{padding-top:0;}	
}