@charset "utf-8";
@import url(./fonts/notoSansKr.css);

/* =color variable
-------------------------------------------------------------- */
:root {
    --t-primary: #1b3f95; /* 업체 대표색상 */
    --t-primary-hover: #133178; /* 업체 대표색상 hover컬러 */ 
    --t-primary-dark: #133178;
    
	--t-gray-100: #EDF4FA;
	--t-gray-200: #D2DEEB;
	--t-gray-300: #9AAAC8;
	--t-gray-400: #6A7DA3;
	--t-gray-500: #4E5F83;
	--t-gray-600: #3E4C6A;
	--t-gray-700: #313C54;
	--t-gray-800: #252F40;
	--t-gray-900: #1B2430;
    
    --t-th:	#F3F7FB;
    --t-border-100:	#DEE4EB;
    --t-border-200:	#D3DCE6;
	--t-filter-white: invert(99%) sepia(52%) saturate(198%) hue-rotate(286deg) brightness(116%) contrast(100%);
	--t-filter-primary: invert(19%) sepia(96%) saturate(1475%) hue-rotate(200deg) brightness(94%) contrast(86%);	
	
	--red: #dc3545;
	--blue: #0d6efd;
	--green: #198754;
}


/* =Reset
-------------------------------------------------------------- */
* {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; font-weight: 500;}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
body {
	font-size:13px;
	line-height: 1;
	/*overflow-x:hidden;*/
	background-color: #f4f5f9; /* 배경색 */
}
ol,
ul,
li {
	list-style: none;
}
blockquote,
q {
	quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption,
th,
td {
	font-weight: normal;
	text-align: left;
	vertical-align:middle;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}
html {
	overflow-y: scroll;
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
a:focus {
	_outline: thin dotted;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
	display: block;
}
audio,
canvas,
video {
	display: inline-block;
}
audio:not([controls]) {
	display: none;
}
del {
	color: #333;
}
ins {
	background: #fff9c0;
	text-decoration: none;
}
hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin: 24px;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sup {
	top: -0.5em;
}
sub {
	bottom: -0.25em;
}
small {
	font-size: smaller;
}
img {
	border: 0;
	-ms-interpolation-mode: bicubic;
	image-rendering: auto;
	image-rendering: crisp-edges;
	image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-optimize-contrast; 
	vertical-align:middle;
	
}

/* =Repeatable patterns
-------------------------------------------------------------- */
/* Form fields, general styles first */
button,
input,
textarea {
	border: 1px solid var(--t-gray-200);
	border-radius: 2px;
	font-size: 12px;
	font-family: inherit;
	padding: 3px;
}
input[type="checkbox"],
input[type="radio"] {
	position: relative;
    top: 1.5px;
	border-color: var(--t-gray-200);
	outline: 0;
}
select{
	border: 1px solid var(--t-gray-200);
	border-radius: 2px;
	font-size: 12px;
	font-family: inherit;
	height:25px;
	width:125px;
	padding: 0 20px 0 5px;
	background: url(../svg/chevron-down.svg) no-repeat calc(100% - 5px) center/10px;
	color: var(--t-gray-700);
}

button,
input {
	line-height: normal;
}
textarea {
	font-size: 100%;
	overflow: auto;
	vertical-align: top;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"]
textarea {
	width: 125px;
	height: 25px;
	color: var(--t-gray-700);

	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Reset non-text input types */
input[type="checkbox"],
input[type="radio"],
input[type="file"],
input[type="hidden"],
input[type="image"],
input[type="color"] {
	border: 0;
	border-radius: 0;
	padding: 0;

	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

select{
    appearance: none;
    -webkit-appearance: none; /* 사파리, 크롬 하위버전용 */
    -moz-appearance: none; /* 사파리, 크롬 하위버전용 */
}
select::-ms-expand{ display: none; } /* 익스플로러용 */

/* Buttons */
.menu-toggle,
input[type="submit"],
input[type="button"],
input[type="reset"] {
	padding: 6px 10px;
	font-size: 12px;
	font-weight: normal;
	color: #fff;
	background-color: #2068a0;
	border:solid 1px #2068a0;
	border-radius: 2px;
}
.menu-toggle,
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
	cursor: pointer;
}
button[disabled],
input[disabled] {
	cursor: default;
}
.menu-toggle:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
article.post-password-required input[type=submit]:hover {
	background-color: #2068a0;
	color: #fff;
}
.menu-toggle:active,
.menu-toggle.toggled-on,
button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active {
	color: #757575;
	background-color: #e1e1e1;
	border-color: transparent;
}

/* Make sure videos and embeds fit their containers */
embed,
iframe,
object,
video {
	max-width: 100%;
}

/* =Basic structure
-------------------------------------------------------------- */

/* Body, links, basics */
html {
	height: 100%;
}
body {
	min-width: 360px;
	height: 100%;
	font-size: 13px;
	font-size: 1rem;
	font-family:'Noto Sans KR', 'Helvetica Neue', 'Arial', sans-serif;
	color: var(--t-gray-700);
	background-color: #f4f5f9;
}
a {
	outline: none;
	color: #555;
	text-decoration:none;
}
a:hover {
	color: var(--t-primary-hover);
	cursor: pointer;
}
hr {
	background-color: var(--t-border-100);
	margin: 24px 0;
}

/**
input 커스텀 */
/* placeholder */
input::placeholder, textarea::placeholder {
	color: var(--t-gray-300);
}
input::-moz-placeholder, input::-webkit-input-placeholder,
textarea::-moz-placeholder, textarea::-webkit-input-placeholder {
	color: var(--t-gray-300);
}

/**
input[type="text"] 캘린더 커스텀 */
.calendar {
	width: 125px;
	padding: 0 20px 0 5px;
	background: url(../svg/calendar.svg) no-repeat calc(100% - 5px) center/10px;
}
.calendar_m {
	width: 125px;
	padding: 0 20px 0 5px;
	background: url(../svg/calendar.svg) no-repeat calc(100% - 5px) center/10px;
}

/**
파일 커스텀 */
input[type=file]::file-selector-button {
	height: 25px;
	/* line-height: 25px; */
	border: 1px solid var(--t-gray-500);
	border-radius: 2px;
	background-color: var(--t-gray-500);
	color: #fff;
	cursor: pointer;
}
input[type=file]::file-selector-button:hover {
	background-color: var(--t-gray-600);
	color: #fff;
}

/**
checkbox, radio 버튼 커스텀 */
input[type="checkbox"], input[type="radio"] {
	display: inline-block;
	position: relative;
	top: 5px;
	outline: none;
	width: 13px;
	height: 13px;
	margin: 2px;
	cursor: pointer;
	border: 1px solid var(--t-gray-200);
	background: #fff;
}
input[type="checkbox"]:checked::after,
input[type="radio"]:checked::after {
	content: '';
	position: absolute;
    display: block;
    background-size: 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
input[type="checkbox"]:checked, input[type="radio"]:checked {
	border: 1px solid #0d6efd;
	background-color: #0d6efd;
	opacity: 1;
}
input[type="checkbox"]:disabled, input[type="radio"]:disabled {
	border: 1px solid var(--t-gray-200);
	background-color: #F6F8FF;
	cursor: not-allowed;
	opacity: .9;
}

/* checkbox */
input[type="checkbox"] {
	border-radius: 2px;
}
input[type="checkbox"]:checked::after {
    background-image: url(../svg/check-white.svg);
    width: 120%;
    height: 120%;;
}

/* radio */
input[type="radio"] {
	border-radius: 100px;
}
input[type="radio"]:checked::after {
    background-image: url(../svg/circle-fill-white.svg);
    width: 50%;
    height: 50%;
}


/* =Favorites
-------------------------------------------------------------- */

/* vertical align */
.kcpi {vertical-align:middle;}
.kcpi img {vertical-align:middle;}
.btns {text-align:center;}
.btns img {vertical-align:middle;}

.png24 { 
tmp:expression(setPng24(this)); 
} 

/* Font style */
.fwb {font-weight:bold;}
/* text align */
.tac {text-align:center;}
.tar {text-align:right;}
.tal {text-align:left;}
.vam {vertical-align:middle;}
/* text color */
.t_red {color: var(--t-red);}
.t_blue {color: var(--t-blue);}
.t_green {color: var(--t-green);}
.t_dark {color: var(--t-gray-800);}

/* margin */
.mt0 {margin-top: 0 !important;}
.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt50 {margin-top:50px;}
.mb0 {margin-bottom:0 !important;}
.mb5 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb40 {margin-bottom:40px;}
.mr0 {margin-right:0 !important;}
.mr5 {margin-right:5px;}
.mr10 {margin-right:10px;}
.mr20 {margin-right:20px;}
.mr30 {margin-right:30px;}
.ml0 {margin-left:0 !important;}
.ml5 {margin-left:5px;}
.ml10 {margin-left:10px;}
.ml20 {margin-left:20px;}
.ml40 {margin-left:40px;}

/* 색상 */
/* .41a924 {color: #41a924;} */
/* .ff8200 {color:#ff8200;} */
.red {color: red;}
.blue {color: blue;}
.green {color: green;}
.dark {color: var(--t-gray-800);}

/* 자주사용하는 */
.btnover {cursor:pointer;}
.nobg {background:none;}
.clearboth {clear:both;}
.wsnr {white-space:nowrap;}
.floatleft {float:left;}
.floatright {float:right;}
.floatnone {float:none;}

/* = form
-------------------------------------------------------------- */

/* 텍스트 크기 조절 */
#text_size {margin:0 20px;letter-spacing:-3px;text-align:right;}
#text_size button {margin:0;padding:1px 2px;border:none;background:transparent;vertical-align:middle;cursor:pointer}
.ts_up {font-size:1.167em !important}
.ts_up2 {font-size:1.3em !important}

/* 게시물 선택복사 선택이동 */
#copymove {}
.copymove_current {float:right;color:#ff3061}
.copymove_currentbg {background:#f4f4f4}

/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}
/* 본문 바로가기 */
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}

/* ie6 이미지 너비 지정 */
.img_fix {width:100%;height:auto;}

/* 캡챠 자동등록(입력)방지 기본 */
#captcha {display:inline-block;position:relative}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#captcha #captcha_img {width:100px;height:41px;border:1px solid #e9e9e9}
#captcha #captcha_mp3 {position:absolute;top:0;left:101px;;margin:0;padding:0;width:23px;height:22px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer}
#captcha #captcha_mp3 span {position:absolute;top:0;left:0;width:23px;height:22px;background:url('/plugin/kcaptcha/img/sound.gif')}
#captcha #captcha_reload {position:absolute;top:21px;left:101px;margin:0;padding:0;width:23px;height:22px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer}
#captcha #captcha_reload span {position:absolute;top:0;left:0;width:23px;height:22px;background:url('/plugin/kcaptcha/img/reload.gif')}
#captcha #captcha_key {margin:0 0 0 25px;padding:0 5px;width:70px;height:41px;border:1px solid #b8c9c2;background:#f7f7f7;font-size:1.333em;font-weight:bold;text-align:center;line-height:2.8em}
#captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}
.captcha_box {vertical-align:top;}

/* ckeditor 단축키 */
.cke_sc {display:none;margin:0 0 5px;text-align:right;}
.btn_cke_sc{display:inline-block;padding:0 10px;height:23px;border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none;line-height:1.9em;vertical-align:middle;cursor:pointer}
.cke_sc_def {margin:0 0 5px;padding:10px;border:1px solid #ccc;background:#f7f7f7;text-align:center}
.cke_sc_def dl{margin:0 0 5px;text-align:left;zoom:1}
.cke_sc_def dl:after {display:block;visibility:hidden;clear:both;content:""}
.cke_sc_def dt, .cke_sc_def dd {float:left;margin:0;padding:5px 0;border-bottom:1px solid #e9e9e9}
.cke_sc_def dt {width:20%;font-weight:bold}
.cke_sc_def dd {width:30%}

/* 내용관리 */
#ctt {}
.ctt_admin {clear:both;text-align:right;}
#ctt header h1 {position:absolute;font-size:0;line-height:0;overflow:hidden;}
#ctt_con {}
.ctt_img {}

/* 새창 기본 스타일 */
.new_win {}
.new_win .tbl_wrap {margin:0 20px;}
.new_win #win_title {margin:0 0 20px;padding:20px 0;font-size:1.2em;}
.new_win #win_title .sv {font-size:0.75em;line-height:1.2em;}
.new_win .win_ul {margin:-20px 0 20px 0;padding:0 20px;border-bottom:1px solid #455255;background:#484848;list-style:none;zoom:1;}
.new_win .win_ul:after {display:block;visibility:hidden;clear:both;content:"";}
.new_win .win_ul li {float:left;margin-left:-1px;}
.new_win .win_ul a {display:block;padding:10px 10px 8px;border-right:1px solid #455255;border-left:1px solid #455255;color:#fff;font-weight:bold;text-decoration:none;}
.new_win .win_desc {padding:20px;}

.new_win .win_btn {clear:both;padding:20px;text-align:center;} /* 새창용 */
.new_win .win_btn button {display:inline-block;padding:0 10px;height:30px;border:0;background:#4b545e;color:#fff;line-height:2em;cursor:pointer;}
.new_win .win_btn input {padding:0 10px;height:30px;line-height:2em;}
.new_win .win_btn a {display:inline-block;padding:0 10px;height:30px;background:#4b545e;color:#fff;vertical-align:middle;line-height:2.4em;}
.new_win .win_btn a:focus, .new_win .win_btn a:hover {text-decoration:none;}


/* common -- */
.displaynone {display:none !important;}
/* -- common */

/* =layout
----------------------------------------------- */
.off-nav-links {display:none;}

/* ============================================================================================================================================================================================
===== Wrap */
#wrap {
	position:relative;top:0;left:0;margin:0 auto;padding:0;
	width:100%; 
	
	overflow-x:hidden;
	
}

/* ============================================================================================================================================================================================
===== login */
/* wrap */
#wrap-login {
	position:relative;
	top:0;
	left:0;
	margin:0 auto;
	padding:0;
	width:100%;
	height: 100%;
	overflow-x:hidden;
}

/* container */
#container_login {
	position:relative;
	top:0;
	left:0;
	margin:0px auto 0px;
	padding:0;
	width:100%;
	min-width: 340px;
	max-width: 360px;
	height: 100%;
}
#login_con {width: 100%; padding: 0 10px; position: absolute; top: 50%; transform: translateY(-50%);}
#footer_login {width: 100%; margin-top: 10px; line-height: 1.5; text-align: center; font-size: 10px; color: #B3B4B6;}

/* login box */
.form-login {width: 100%; height: 100%;}

.login_box {padding: 32px; margin: 0 auto; border-radius: 10px; border: 1px solid var(--t-gray-200); background-color: #fff;}
.login_box hr {margin: 20px 0; background-color: #E6E6E6;}

/* login head */
.login_form .logo_login {width: 100%; text-align: center;}
.login_form .logo_login img {width: 110px; height: auto;}
.login_form h1 {text-align: center; font-size: 24px; font-weight: 700; line-height: 1.5; color: var(--t-gray-900);}

/* login form */
.signin {width: 100%; padding-top: 40px;}
.signin .field {color: var(--t-gray-700);}
.signin .field .inp {width: 100%; background-color: #fff;}
.signin .field .inp + .inp {margin-top: 10px;}

.signin .field input:not(input[type="checkbox"]) {display: inline-block;  width: 100%; height: auto; padding: 15px; font-size:14px; font-weight: 500; letter-spacing:-0.5px; border:1px solid var(--t-gray-200); color:var(--t-gray-700); background-color:#fff;}
.signin .field input::placeholder, .signin .field input::-ms-placeholder,
.signin .field input::-moz-placeholder, .signin .field input::-webkit-input-placeholder {color: var(--t-gray-300);}

.signin .check{padding:10px 0; overflow:hidden;}
.signin .check input[type="checkbox"] {width: 16px; height: 16px; padding: 0; margin: 0; top: 0;}
/* .signin .check input[type="checkbox"] {width: 16px; height: 16px; padding: 0; margin: 0; border-color: var(--t-gray-200); outline: 0;} */
.signin .check label{position:relative; display:inline-block; padding-left: 4px; font-size:14px; color: #8c8c8c; vertical-align: top; }

/* login button */
.signin .loginbtn {width: 100%; height: 50px; line-height: 50px; margin-top: 10px; border-radius: 3px; font-size: 14px; font-weight: 700; text-align: center; color: #fff; background-color: var(--t-primary);}
.signin .loginbtn a {color:#fff;}
.signin .loginbtn:hover {background:var(--t-primary-hover); cursor:pointer;}
.signin .loginbtn_gray {width: 100%; height: 50px; line-height: 50px; margin-top: 10px; border-radius: 3px; font-size: 14px; font-weight: 700; text-align: center; color: #fff; background-color: var(--t-gray-300);}
.signin .loginbtn_gray a {color:#fff;}
.signin .loginbtn_gray:hover {background:var(--t-gray-400); cursor:pointer;}

/* login text */
.dat_list_login {width: 100%; font-size: 10px; line-height: 1.5; letter-spacing:-0.5px; color: #8c8c8c;}
.dat_list_login .title {line-height:2; text-align: left; font-weight:700; color: var(--t-gray-700);}
.dat_list_login p {color: #8c8c8c;}

.cus_tel {margin-bottom: 8px;}
.cus_tel span {margin-right: 5px; font-size: 14px; font-weight: 700; color: var(--t-primary);}

/* 보안코드 */
.signin .bo_code {width: 100%; padding: 10px; padding: 10px; margin: 20px 0; border: 1px solid var(--t-gray-200); font-size: 14px; font-weight:700; color: var(--t-gray-600); letter-spacing: -0.5px; background-color:#f7f7f7;}
.signin .bo_code span {float:right; font-size:12px;}
.signin .bo_code span img {width:15px; border:none;  vertical-align:middle;}
.signin .bo_code img {width:100%; border:1px solid #3b3b3b;  vertical-align:middle;}
.signin .bo_code input {width:100%; height:28px; background-color:#fff;}

/* ==== */
/* .signin .dvinfo_right { width:100%; margin-top:15px auto; text-align:center; border:1px solid #fff; }

.signin .dvinfo_right .btn_viewday2 { height:60px; letter-spacing:-2px; background:#ff4fa0; font-size:15px; font-weight:800; line-height:60px; color:#fff; text-align:center; border-radius:50px; width:49%; float:left;}
.signin .dvinfo_right .btn_viewday2 a:hover {color:#fff;}

.signin .dvinfo_right .btn_viewday3 {display:inline-block; height:80px; letter-spacing:-2px; background:#2d2d2d;font-size:15px; font-weight:800;line-height:80px;color:#fff;text-align:center; border-radius:5px; width:49%; float:right;}
.signin .dvinfo_right .btn_viewday3 a:hover {color:#fff;}

.signin .btn {float:right; width:29%; text-align:left; vertical-align:top;}
.signin .btn img {width:100px; height:auto;} */


/* ============================================================================================================================================================================================
===== Header */
#header {height: 80px;}
#header .header-pc, #header .header-mob {width: 100%; height: 100%;}

/* header pc */
#header .header-pc .header_content {display: flex; align-items: center; width: 100%; height: 100%; padding: 0 20px;}
#header .header_l, #header .header_r {display: flex; align-items: center;}
#header .header_l {justify-content: left; width: 60%;}
#header .header_r {justify-content: end; width: 40%;}

/* header mobile */
#header .header-mob {display: none;}
#header .header-mob .header_content {display: flex; align-items: center; justify-content: space-between; width: 100%; height: 100%; padding: 0 20px;}

/* 대리점 이름 */
#header .ji_name {display: flex; align-items: center; font-size: 13px; font-weight: 500; color: var(--t-gray-800);}
#header .ji_name::before {content: "";  background: url(../svg/person-circle.svg) no-repeat center center/80%; display: inline-block; width: 30px; height: 30px; margin-right: 5px;}
#header .ji_name a.btn_logout {display:inline-block; height: 30px; line-height: 1.5; padding:5px 10px; margin-left:5px; font-size:12px; color:var(--t-gray-500); border-radius:100px; border:1px solid var(--t-gray-500); background-color: #fff; text-align:center; }

/* 햄버거 버튼 */
#header .btn_menu, #header .btn_menu_mob {display: inline-block; width: 40px; height: 40px; margin-right: 10px; cursor: pointer;}
#header .btn_menu {background: url("../svg/unindent.svg") no-repeat center center/80%;}
.gnb_toggled #header .btn_menu {background: url("../svg/indent.svg") no-repeat center center/80%;}
#header .btn_menu_mob {display: none; background:url("../svg/list.svg") no-repeat center center/80% ;}

/* 예치금 */
.right_gry_back {position:relative; width:100%; max-width: 550px; height:40px; background-color: #ffffff; border: 1px solid var(--t-gray-200); border-radius: 2px;}
.right_gry {padding: 0 10px;}
.right_gry ul {display: flex; align-items: center; justify-content: space-between; height: 39px;}
.right_gry ul li {display: inline-block; text-align:left; font-weight: 500; font-size:13px; color: var(--t-gray-700);}
.right_gry_back_mobile {position:relative; width:100%; max-width: 550px; height:auto; background-color: #ffffff; border: 1px solid var(--t-gray-200); border-radius: 2px; padding:10px;}
.right_gry_mobile {width:100%; height:100%; display:flex; justify-content:space-between; align-items:center; font-size:12px;}
.right_gry_item_mobile + .right_gry_item_mobile {margin-top:4px;}
.right_gry_mobile_reload {width:auto; height:100%; display:flex; justify-content:center; align-items:center;}

/* 메뉴 검색 */
#header .header_search {display: flex; justify-content: left; height: 40px; font-size: 0;}
#header .header_search input {width: 60%; min-width: 260px; height: 40px; padding: 0 1rem; font-size: 13px; background-color: var(--t-gray-100); border: none; border-top-left-radius: 2px; border-bottom-left-radius: 2px;}
#header .header_search input::placeholder, #header .header_search input::-moz-placeholder,
#header .header_search input::-webkit-input-placeholder {color: var(--t-gray-300)}
#header .header_search input:focus {border: none; outline: none;}
#header .header_search button {width: 40px; height: 40px; background-color: var(--t-gray-500); border: none; border-radius: 2px; background:url("../svg/search-white.svg") no-repeat center center/50% var(--t-gray-500); }
#header .header_search button:hover {background-color: var(--t-gray-600);}

/* 즐겨찾기 선택 */
#header .select_bookmark {width: 240px; height: 40px; padding: 0 1rem; margin-right: 20px; border: 1px solid var(--t-border-100); border-radius: 2px; font-size: 13px; background: url(../svg/chevron-down.svg) no-repeat calc(100% - 10px) center/10px;}


/* ============================================================================================================================================================================================
===== gnb */
.gnb_contain {position: fixed; top: 0; bottom: 0; left: 0; z-index: 1; width: 200px; overflow: hidden; overflow-y: auto; background-color: #fff; -ms-overflow-style: none; border-right: 1px solid #E0E0E0;}
.gnb_contain::-webkit-scrollbar {display: none;}

/* 토글 효과 */
.gnb_toggled .gnb_contain {transform: translateX(-200px);}
.gnb_toggled .page_content {padding-left: 0;}
.gnb_toggled_mob {height: 100%; overflow: hidden;}
.gnb_toggled_mob .gnb_contain {display: block; transform: translateX(0) !important;}
.gnb_toggled_mob .sidebar_backdrop {display: block;}

/* 로고 */
.gnb_contain .logo {width: 100%; height: 60px; margin: 30px 0 0; line-height: 80px; text-align: center;}
.gnb_contain .logo img {width: 110px; height: auto;}

/* 모든 메뉴 열기/닫기 */
.gnb_contain .gnb_btn {padding: 10px 0; text-align: center; margin: 20px 0;}
.gnb_contain .gnb_btn button {position: relative; width: 120px; padding: 5px 0; border: 0; border-radius: 2px; font-size: 12px; background-color: var(--t-primary); color: #fff;} /*line-height: 25px; */
.gnb_contain .gnb_btn button::before {content: ""; transform: translateY(2px); display: inline-block; width: 13px; height: 13px; margin-right: 2px; background: url(../svg/plus.svg) no-repeat center/100%; filter: invert(100%) sepia(0%) saturate(7427%) hue-rotate(23deg) brightness(118%) contrast(118%);}
.gnb_contain .gnb_btn button.open::before {background: url(../svg/plus.svg) no-repeat center/100%;}
.gnb_contain .gnb_btn button.close::before {background: url(../svg/dash.svg) no-repeat center/100%;}

.gnb_contain .ji_name, .gnb_contain .right_gry_back {display: none;} /* pc버전 대리점이름, 예치금 가림 처리 */

/* gnb */
.gnb {width: 100%; height: auto; margin: 0 auto; padding-bottom: 50px;}
.gnb_ul {padding:0; list-style:none;  width:100%; text-align: left;}
.gnb_ul li {line-height: 37px; border-bottom: 1px solid var(--t-gray-100);}
.gnb_ul li a { position: relative; display: inline-block; width: 100%; padding: 0 32px 0 20px; font-size: 14px; color: var(--t-gray-800); font-weight: 500;}
.gnb_ul li.on a, .gnb_ul li a.on {font-weight: 700; color: var(--t-primary);}
.gnb_ul.t2 li.on a, .gnb_ul.t2 li a.on {background-color: var(--t-primary); color: #fff;}

.gnb_ul li .snb {display: none; width:100%; background-color:#fff;}
.gnb_ul li.on .snb {display: block}
.gnb_ul li .snb li {padding-left: 36px; border: 0;}
.gnb_ul li .snb li:hover { background-color:#f5f5f5;}
.gnb_ul li .snb li a, .gnb_ul.t2 li .snb li a,
.gnb_ul li.on .snb li a, .gnb_ul.t2 li.on .snb li a {padding: 0 20px 0 0; font-size: 13px; font-weight: 400; color: var(--t-gray-400); background-color: inherit;}
.gnb_ul li .snb li.on a, .gnb_ul li .snb li a.on,
.gnb_ul.t2 li .snb li.on a, .gnb_ul.t2 li .snb li a.on {font-weight: 400; color: var(--t-gray-700); font-weight: 500; }

.gnb_ul li .snb li ul {display: none;}
.gnb_ul li .snb li.on ul {display: block;}
.gnb_ul li .snb li ul li {padding-left: 16px;}
.gnb_ul li .snb li ul li a, .gnb_ul.t2 li .snb li ul li a,
.gnb_ul li .snb li.on ul li a, .gnb_ul.t2 li .snb li.on ul li a {display: block; padding: 0 20px 0 0; font-weight: 400; color: var(--t-gray-700);}
.gnb_ul li .snb li ul li.on a, .gnb_ul.t2 li .snb li ul li.on a {color: var(--t-gray-400); font-weight: 500;}
.gnb_ul li .snb li ul li a::after {display: none;}

.gnb_ul li a::after, .gnb_ul li .snb li a::after {content: ""; position: absolute; width: 15px; height: 15px; top: 50%; right: 15px; transform: translateY(-50%); background: url('../svg/plus.svg') no-repeat center/100%; filter: invert(63%) sepia(6%) saturate(7%) hue-rotate(317deg) brightness(108%) contrast(78%);}
.gnb li a::after, .gnb li.on a::after {filter: invert(100%) sepia(0%) saturate(7427%) hue-rotate(23deg) brightness(118%) contrast(118%);}
.gnb_ul li.on a::after, .gnb_ul li .snb li.on a::after {background: url('../svg/dash.svg') no-repeat center/100%;}
.gnb_ul li.depth_on a::after, .gnb_ul li .snb li.depth_on a::after {background: url('../svg/dash.svg') no-repeat center/100%;}
.gnb_ul li.no_depth > *::after {display: none;}

.sidebar_backdrop {display: none; position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 2; background: rgba(0,0,0,0.25);}


/* ============================================================================================================================================================================================
===== 푸터 */
#footer {padding-left: 200px; color:#B3B4B6;}

#footer .siteinfo{padding-bottom: 60px; text-align:center;}
#footer .siteinfo span{margin:0px; font-size:10px; line-height:1.5;}

.gnb_toggled #footer {padding-left: 0;}

/* ============================================================================================================================================================================================
===== 하단 메뉴바 */
#appBar {display: none; z-index: 1; position: fixed; left: 0; right: 0; bottom: 0; box-shadow: 0px -4px 10px 0px rgba(0, 0, 0, 0.08);}
#appBar .appbar_list {display: flex; align-items:flex-end; justify-content: space-around;}
#appBar .appbar_menu {background-color : var(--t-primary); width:100%; height:50px; transition:0.3s;}
#appBar .appbar_menu.on {background-color : #fff;}
#appBar .appbar_item {position: relative; display: flex; flex: 1 1 auto; flex-direction: column; justify-content: center; align-items: center; height: 100%; cursor: pointer; text-decoration: none; font-size: 12px; color: #fff; background-color: inherit;}
#appBar .appbar_item.on {color : var(--t-primary);}
#appBar .appbar_menu + .appbar_menu {border-left: 1px solid rgba(255,255,255,0.3);}


/* ============================================================================================================================================================================================
===== Etc. */
.clear{display:block;float:none;clear:both;width:100%;height:0;font-size:0 !important;line-height:0 !important;overflow:hidden;margin:0 !important;padding:0 !important;}


/* ============================================================================================================================================================================================
===== page */
.page_content {padding-left: 200px;}
.container {padding: 30px 20px;}

/* page title */
.page_title {display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;}
.page_title h1 {position: relative; font-size: 16px; font-weight: 700; color: var(--t-gray-800);}

/* 240412추가 - 모바일 예치금 */
.header_deposit_wrap {display: none; padding: 15px 20px;}
.header_deposit_wrap .right_gry_back {max-width: unset; height: auto;}
.header_deposit_wrap .right_gry ul li {line-height: 1.5;}

/* 북마크 버튼 */
.page_title .page_title-bookmark {position: absolute; top: 50%; transform: translateY(-50%); background: url(../svg/star-fill.svg) no-repeat center center/90%; display: inline-block; width: 15px; height: 15px; margin-left: 4px; border: none; filter: invert(76%) sepia(24%) saturate(6%) hue-rotate(43deg) brightness(96%) contrast(94%);}
.page_title .page_title-bookmark.on {filter: invert(34%) sepia(76%) saturate(3131%) hue-rotate(312deg) brightness(105%) contrast(104%);}

/* 사이트 이동 경로 */
.page_title .breadcrumb {font-size: 12px; font-weight: 500; color: var(--t-gray-400); }

/* ============================================================================================================================================================================================
===== 자료실  new*/
/** 240729 추가 **/
.new {display : inline-block; margin-left : 2px; padding : 2px 2px; font-size : 10px; text-align : center; border-radius : 2px; background-color : var(--t-primary); color : #fff; animation : glitter 1.5s infinite;}
@keyframes glitter { 0% {color : #fff;} 80% {color : #fff;} 90% {color: var(--t-primary);} 100% {color : #fff;} }

/* ============================================================================================================================================================================================
===== popup */
.popup_title {clear:both;  padding: 0 20px;  font-size:16px; font-weight:600;  line-height:56px;  height:56px;  color:#fff; text-align:left;   background-color:var(--t-primary-dark);}
/* .popup_title table {width:100%;}
.popup_title table th {text-align:center;}
.popup_title table td {font-size:17px; font-weight:700;  line-height:40px;}
.popup_title table td.l {text-align:left;} */

.popup_board_header {display: flex; align-items: center; gap: 24px; margin-bottom: 10px;}
.popup_board_header .btn_search > * {width: 100px;}

/* 
  팝업 사이즈 
  #wrap에 클래스 추가
*/
.popup_lg {width: 100%; min-width: 1440px;}
.popup_m {width: 100%; min-width: 960px;}
.popup_s {width: 100%; min-width: 640px;}
.popup_xs {width: 100%; min-width: 384px;}
.popup_xxs {width: 100%; min-width: 360px;}


/* ============================================================================================================================================================================================
===== main content */
/* box */
.box {border: 1px solid var(--t-border-100); background-color: #fff;}
.box + .box {margin-top: 20px;}
.box .inner {padding: 20px;}
.box_search + .box_body {border-top: 1px solid var(--t-border-100);}

/* 검색영역 헤더 */
.header_search {display: flex; justify-content: space-between; align-items: center;}
.header_search h2 {font-size: 13px; font-weight: 700; color: var(--t-gray-900);}
.btn_search {display: flex; gap: 5px;}
.btn_search a {display: inline-flex; align-items:center;justify-content:center; vertical-align:middle; height: 30px; border-radius: 2px; font-size: 12px; font-weight: 500; text-align: center;}

/*===== board */
/* header */
.board_header, .board_header_t2 {display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px; line-height: 1.5;}

/* 소제목 */
.subtitle {font-size: 13px; font-weight: 500; color: var(--t-gray-800);}

/* 검색결과 */
.search_na {font-size: 12px; font-weight: 500; color: var(--t-gray-800);}
.search_na span {color: var(--t-primary);}
.btn_group {display: flex; flex-wrap: wrap; gap: 5px;}
.btn_group a {display: inline-flex; align-items:center;justify-content:center; vertical-align:middle; height: 30px; border-radius: 2px; font-size: 12px; font-weight: 500; text-align: center;}

/* 기본 테이블 */
.board {width: 100%; overflow-x: auto; overflow-y: hidden;}
.board table {width: 100%; margin-bottom: 10px; word-break: break-all; white-space: nowrap; border: 0; border-spacing: 0; border-collapse: collapse;table-layout: auto;}
.board table th {height: 35px; padding: 3px 10px; border: 1px solid var(--t-border-100); font-size: 12px; font-weight: 500; text-align: center; background-color: var(--t-th); color: var(--t-gray-800); letter-spacing: 0px;}
.board table td {height: 35px; padding: 3px 10px; border: 1px solid var(--t-border-100); font-size: 12px; text-align: center; vertical-align: middle; letter-spacing: 0px; color: var(--t-gray-700);font-weight: 500; line-height:23px;}
.board table .bg_y{background-color:#F5F5F5;}

/* 기본 테이블 데이터 없는 경우 */
.board .table_no_data {width: 100%; height: 50px; line-height: 50px; margin-top: -10px; border: 1px solid var(--t-border-100); border-top: 0; font-size: 12px; color: var(--t-gray-700); text-align: center;}
.board:has(div.table_no_data) {overflow: hidden;}

/* 가로형 테이블 */
.board table.row th, .board table.row td {height: 36px; padding: 8px; text-align: left; line-height: 1.3;} 
.board table.row th.b, .board table.row td.b {background-color: #F9F9F7; font-weight: 700;}

table ul li {height: 25px; line-height: 25px;}

/* 데이터 없는 경우 */
.row_no_data td {height: 50px; text-align: center;}

/* 테이블 내 a링크 */
.list-link {color: var(--t-primary); font-weight:bolder;}
.list-link:hover {text-decoration: underline;}

/* 페이징  */
.pasing {display: block; width:100%; text-align:center; margin-top:20px; }
.pasing ul {display:inline-block;}
.pasing ul li {position: relative; display: inline-block; width: 24px; height: 24px; line-height: 24px; margin-left: -4px; vertical-align: middle; border: 1px solid var(--t-border-100); font-weight:600; font-size:12px; color:var(--t-gray-300); text-align: center; cursor:pointer;}
.pasing ul li + li {border-left: none;}
.pasing ul li:hover {text-decoration: underline;}
.pasing ul li.on {font-weight:700;  color:var(--t-primary); }
.pasing ul li .prev {display: block; width: 100%; height: 100%; background: url(../svg/chevron-left.svg) no-repeat center center/50%; filter: invert(93%) sepia(6%) saturate(7%) hue-rotate(354deg) brightness(85%) contrast(83%);}
.pasing ul li .next {display: block; width: 100%; height: 100%; background: url(../svg/chevron-right.svg) no-repeat center center/50%; filter: invert(93%) sepia(6%) saturate(7%) hue-rotate(354deg) brightness(85%) contrast(83%);}
.pasing img {vertical-align:top; width:25px; height:auto;}

/* tab */
.cus_tab {width:100%; margin: 20px 0; height:40px; }
.cus_tab table {width:100%; border-spacing:0; border-collapse:collapse; table-layout:fixed;word-break:break-all;border:0; }
.cus_tab table tr {border-bottom:0px solid #cacaca;}

.cus_tab table td {height: 40px; font-size: 12px; font-weight: 500; background-color:#ddd; border: 1px solid #fff; }
.cus_tab table td a {display: inline-block; width: 100%; text-align: center; color: #8c8c8c;}
.cus_tab table td.on {background-color: var(--t-primary);}
.cus_tab table td.on a {color: #fff;}
.cus_tab table td a:hover {color:#1b1b1b !important; cursor: pointer; }
.cus_tab table td.on a:hover {color:#fff !important; cursor: pointer; }
.cus_tab table td img { display:none;}

/* popup - 설명 영역 */
.dat_list {position: relative; width: 100%; padding: 10px; margin-top: 5px; border: 1px solid #e7ebef; background-color: #fff; overflow: hidden;}
.dat_list > * {line-height: 1.71; font-size: 12px; color: var(--t-gray-600);}

/* ============================================================================================================================================================================================
===== button */
/* 버튼 기본 스타일 */
.btn {width: 100px; min-width: 80px; max-width: 100px; border-radius: 2px;}

/* 사이즈별 버튼 */
.btn_s {display: inline-block; padding: 5px 8px; border-radius: 2px; font-size: 12px;}
.btn_s + .btn_s {margin-left: 5px;}

/* 색상별 버튼 */
.btn_primary {background-color: var(--t-primary); color: #fff; border: 0;}
.btn_primary:hover {background-color: var(--t-primary-hover); color: #fff; border: 0;}
.btn_lightgray {background-color: #efefef; color: var(--t-gray-800); border: 0;}
.btn_lightgray:hover {background-color: #e0e0e0; color: var(--t-gray-800); border: 0;}
.btn_gray {background-color: var(--t-gray-400); color: #fff; border: 0;}
.btn_gray:hover {background-color: var(--t-gray-500); color: #fff; border: 0;}
.btn_dark {background-color: var(--t-gray-900); color: #fff; border: 0;}
.btn_dark:hover {background-color: #1d1d1d; color: #fff; border: 0;}
.btn_primary, .btn_gray a, .btn_dark a {color: #fff;}

.btn_line_primary {background-color: transparent; border: 1px solid var(--t-primary); color: var(--t-primary);}
.btn_line_primary:hover {background-color: transparent; color: var(--t-primary);}
.btn_line_default {background-color: transparent; border: 1px solid #dcdcdc; color: var(--t-gray-600);}
.btn_line_default:hover {background-color: transparent; color: var(--t-gray-600);}
.btn_line_lightgray {background-color: transparent; border: 1px solid var(--t-border-200); color: var(--t-gray-500);}
.btn_line_lightgray:hover {background-color: transparent; color: var(--t-gray-500);}
.btn_line_gray {background-color: transparent; border: 1px solid var(--t-gray-500); color: var(--t-gray-700);}
.btn_line_gray:hover {background-color: transparent; color: var(--t-gray-700);}
.btn_line_dark {background-color: transparent; border: 1px solid var(--t-gray-900); color: var(--t-gray-900);}
.btn_line_dark:hover {background-color: transparent; color: var(--t-gray-900);}
.btn_line_primary a, .btn_line_primary:hover a {color: var(--t-primary);}
.btn_line_default a, .btn_line_default:hover a {color: var(--t-gray-600);}
.btn_line_lightgray a, .btn_line_lightgray:hover a {color: var(--t-gray-500);}
.btn_line_gray a, .btn_line_gray:hover a {color: var(--t-gray-700);}
.btn_line_dark a, .btn_line_dark:hover a {color: var(--t-gray-900);}

/* 버튼 형태 */
.btn_oval {border-radius: 100px;}


/* ============================================================================================================================================================================================
===== etc */
.d_flex {display: flex; flex-wrap: wrap;}

/* fix width */
.w10 {width:10px !important;}
.w20 {width:20px !important;}
.w30 {width:30px !important;}
.w40 {width:40px !important;}
.w50 {width:50px !important;}
.w60 {width:60px !important;}
.w70 {width:70px !important;}
.w80 {width:80px !important;}
.w90 {width:90px !important;}
.w100 {width:100px !important;}
.w130 {width:130px !important;}
.w150 {width:150px !important;}
.w200 {width:200px !important;}
.w250 {width:250px !important;}
.w300 {width:300px !important;}
.w350 {width:350px !important;}
.w400 {width:400px !important;}
.w500 {width:500px !important;}
.w600 {width:600px !important;}
.w700 {width:700px !important;}
.w750 {width:750px !important;}
.w800 {width:800px !important;}
.w900 {width:900px !important;}
.w1000 {width:1000px !important;}

/* reponsive width */
.w10p {width:10% !important;}
.w25p {width:25% !important;}
.w20p {width:20% !important;}
.w30p {width:30% !important;}
.w40p {width:40% !important;}
.w50p {width:50% !important;}
.w60p {width:60% !important;}
.w70p {width:70% !important;}
.w80p {width:80% !important;}
.w90p {width:90% !important;}
.w100p {width:100% !important;}

.col-auto {flex: 1 1 auto;}
.col1 {width: 100%;}
.col2 {width: 50%;}
.col3 {width: 33.33333%;}
.col4 {width: 25%;}
.col5 {width: 20%;}
.col6 {width: 16.66667%;}
.col7 {width: 14.28571%;}
.col8 {width: 12.5%;}

/* datepicker */
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {background-color: #fff;}
.ui-widget-content .ui-icon {background-image: url("../images/ui-icons_444444_256x240.png") !important;}
.ui-widget-header .ui-icon {background-image: url("../images/ui-icons_444444_256x240.png") !important;}

	 
/* ============================================================================================================================================================================================
===== 로딩이미지 */
@keyframes ldio-0ao329svy56u {
  0% {
    opacity: 1;
    backface-visibility: hidden;
    transform: translateZ(0) scale(1.5,1.5);
  } 100% {
    opacity: 0;
    backface-visibility: hidden;
    transform: translateZ(0) scale(1,1);
  }
}
.ldio-0ao329svy56u div > div {
  position: absolute;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #000000;
  animation: ldio-0ao329svy56u 1s linear infinite;
}.ldio-0ao329svy56u div:nth-child(1) > div {
  left: 113px;
  top: 68px;
  animation-delay: -0.9s;
}
.ldio-0ao329svy56u > div:nth-child(1) {
  transform: rotate(0deg);
  transform-origin: 120.5px 75.5px;
}.ldio-0ao329svy56u div:nth-child(2) > div {
  left: 104px;
  top: 94px;
  animation-delay: -0.8s;
}
.ldio-0ao329svy56u > div:nth-child(2) {
  transform: rotate(36deg);
  transform-origin: 111.5px 101.5px;
}.ldio-0ao329svy56u div:nth-child(3) > div {
  left: 81px;
  top: 110px;
  animation-delay: -0.7s;
}
.ldio-0ao329svy56u > div:nth-child(3) {
  transform: rotate(72deg);
  transform-origin: 88.5px 117.5px;
}.ldio-0ao329svy56u div:nth-child(4) > div {
  left: 54px;
  top: 110px;
  animation-delay: -0.6s;
}
.ldio-0ao329svy56u > div:nth-child(4) {
  transform: rotate(108deg);
  transform-origin: 61.5px 117.5px;
}.ldio-0ao329svy56u div:nth-child(5) > div {
  left: 31px;
  top: 94px;
  animation-delay: -0.5s;
}
.ldio-0ao329svy56u > div:nth-child(5) {
  transform: rotate(144deg);
  transform-origin: 38.5px 101.5px;
}.ldio-0ao329svy56u div:nth-child(6) > div {
  left: 23px;
  top: 68px;
  animation-delay: -0.4s;
}
.ldio-0ao329svy56u > div:nth-child(6) {
  transform: rotate(180deg);
  transform-origin: 30.5px 75.5px;
}.ldio-0ao329svy56u div:nth-child(7) > div {
  left: 31px;
  top: 41px;
  animation-delay: -0.3s;
}
.ldio-0ao329svy56u > div:nth-child(7) {
  transform: rotate(216deg);
  transform-origin: 38.5px 48.5px;
}.ldio-0ao329svy56u div:nth-child(8) > div {
  left: 54px;
  top: 25px;
  animation-delay: -0.2s;
}
.ldio-0ao329svy56u > div:nth-child(8) {
  transform: rotate(252deg);
  transform-origin: 61.5px 32.5px;
}.ldio-0ao329svy56u div:nth-child(9) > div {
  left: 81px;
  top: 25px;
  animation-delay: -0.1s;
}
.ldio-0ao329svy56u > div:nth-child(9) {
  transform: rotate(288deg);
  transform-origin: 88.5px 32.5px;
}.ldio-0ao329svy56u div:nth-child(10) > div {
  left: 104px;
  top: 41px;
  animation-delay: 0s;
}
.ldio-0ao329svy56u > div:nth-child(10) {
  transform: rotate(324deg);
  transform-origin: 111.5px 48.5px;
}
.loadingio-spinner-spin-xwovdgvl13l {
  width: 150px;
  height: 150px;
  display: inline-block;
  overflow: hidden;
  background: rgba(NaN, NaN, NaN, 0);
}
.ldio-0ao329svy56u {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translateZ(0) scale(1);
  backface-visibility: hidden;
  transform-origin: 0 0; /* see note above */
}
.ldio-0ao329svy56u div { box-sizing: content-box; }

/* ============================================================================================================================================================================================
===== media query */
@media screen and (min-width:1200px) {
	/**
	모바일버전 반응형 처리 */
	.for-mobile {display: none;}
}

/*=== big desktop */
@media screen and (max-width: 1200px) {
	/**
	pc버전 반응형 처리 */
	.for-pc {display: none;}
}

/*=== tablet */
@media screen and (max-width: 992px) {
	/**
	사이드바 */
	.gnb_contain {z-index: 9999; width: 260px; transform: translateX(-260px) !important;}
	.gnb_contain .logo {display: none;}
	.gnb_contain .info {padding: 20px; background-color: #fff;}

	/**
	사이드바 - 대리점 이름 */
	.gnb_contain .ji_name {display: flex; justify-content: space-between; align-items: center; padding-top: 20px; padding-bottom: 10px; font-size: 13px; font-weight: 500; color: var(--t-gray-800);}
	.gnb_contain .ji_name::before {content: "";  background: url(../svg/person-circle.svg) no-repeat center center/80%; display: inline-block; width: 25px; height: 25px; margin-right: 8px;}
	.gnb_contain .ji_name a.btn_logout {display:inline-block; margin-left: auto; font-size:10px; color: var(--t-gray-400); text-decoration: underline;}

	/**
	사이드바 - 예치금 */
	.gnb_contain .right_gry_back {display: block; height: auto; border: 0; border-radius: 10px;}
	.gnb_contain .right_gry {padding: 10px;}
	.gnb_contain .right_gry ul {display: inline-block; height: auto;}
	.gnb_contain .right_gry ul li {font-size: 12px;}
	.gnb_contain .right_gry ul li + li {margin-top: 1px;}
	.gnb_contain .right_gry .btn_deposit_reload img {filter: var(--t-filter-primary);}

	/**
	header */
	/* pc 헤더 가림 */
	.header-pc {display: none;}
	/* 모바일 헤더 레이아웃 조정 */
	.header-mob {display: block !important;}
	#header {height: auto; padding-top: 15px;}
	#header .btn_menu_mob {width: 30px; height: 30px;}
	#header .logo {display: inline-block; width: auto;}
	#header .logo img {height: 25px;}
	/* #header .logo img {width: 100px;} */
	#header .btn_menu_mob {display: block}

	/**
	board */
	.board_header_t2 {flex-direction: column; align-items: start; gap: 8px;}

	/**
	page */
	.page_content {padding-left: 0;}
	.header_deposit_wrap {display: block;}

	/**
	footer */
	#footer {padding-left: 0;}

	/**
	etc */
	.col1-md {width: 100%;}
	.col2-md {width: 50%;}
	.col3-md {width: 33.33333%;}
	.col4-md {width: 25%;}
	.col5-md {width: 20%;}
	.col6-md {width: 16.66667%;}
	.col7-md {width: 14.28571%;}
	.col8-md {width: 12.5%;}

}

/*=== mobile */
@media screen and (max-width: 576px) {
	/**
	하단 메뉴바 */
	#appBar {display: block}

	/**
	page */
	.page_title { justify-content: left; align-items: normal; flex-direction: column-reverse;}
	.page_title .breadcrumb {margin-bottom: 5px;}

	/**
	main content */
	/* box */
	.box .inner {padding: 16px;}

	/**
	board */
	/* 기본 테이블 */
	.board table th {padding: 3px;}
	.board table td {padding: 3px;}

	/* popup - 설명 영역 */
	.dat_list {padding: 10px;}

	/**
	button */
	.btn {width: 80px;}

	/**
	etc */
	.col1-sm {width: 100%;}
	.col2-sm {width: 50%;}
	.col3-sm {width: 33.33333%;}
	.col4-sm {width: 25%;}
	.col5-sm {width: 20%;}
	.col6-sm {width: 16.66667%;}
	.col7-sm {width: 14.28571%;}
	.col8-sm {width: 12.5%;}
}

/* =default
-------------------------------------------------------------- */
@-ms-viewport {
	width: device-width;
}
@viewport {
	width: device-width;
}

/* =Print
----------------------------------------------- */
@media print {
}

/* 비밀번호 찾기 */
.sms_auth_off {background-color: var(--t-gray-100) !important;}