@charset "utf-8";

input[type="text"],
input[type="password"],
input[type="submit"],
input[type="button"],
button,
select,
textarea {font-family:'Pretendard Variable', Pretendard, sans-serif;}
button, input[type="button"], input[type="submit"] {cursor:pointer}
.editor-out p {min-height:1.5em}

/* 컬러셋팅 */
.colorB1 {background:#0061ba}
.colorB2 {background:#002752}
.colorB3 {background:#008eac}
.colorB4 {background:#ff9900}
.colorF1 {color:#333;background:#ececec}
.colorF2 {color:#333;background:#f7f7f7}

/* 박스 스타일 */
.w-box {background:#fff;border:1px solid #ddd;overflow:hidden;position:relative}
.g-box {background:#f8f8f8;border:1px solid #ddd;overflow:hidden;position:relative;padding:20px}
.r-box {background:#fbf0e6;border:1px dashed #d1001d;overflow:hidden;position:relative}

/* 인쇄미리보기 */
@media print {
	#header-wrap,
	#svisual-wrap,
	#side-wrap,
	#charge-satisfy,
	#footer-wrap,
	.b-tab01,
	.c-tab01,
	.board-search-wrap .board-search,
	.board-list-paging {display:none !important}
	.loaded #container-wrap,
	#container-wrap,
	#container {padding:0 !important}
	#contents {float:none;max-width:none;width:100%;min-height:initial}
}

/* 반응형br */
.br {display:block}
@media all and (max-width:1000px)  {
	.br {display:inline}
}

/* apple 기기 */
input[type=text], input[type=password], input[type=button], input[type=submit], button, textarea, select {-webkit-appearance:none;-moz-appearance:none;appearance:none}
select {border:0;height:28px;box-sizing:border-box;border:1px solid #ccc;background:rgba(255,255,255,0.3) url(/resources/_Img/Common/selfrm_arr.gif) no-repeat right 50%;min-width:120px;padding-right:1px;padding-left:5px;padding-top:1px;line-height:1.2em;border-radius:0}
select::-ms-expand {display:none}

/* ie9 업그레이드 안내창 */
.lowIE-update {position:fixed;top:0;left:0;z-index:9999;width:100%;height:100%;line-height:1.6}
.lowIE-update .update-cont {position:relative;margin:130px auto 0 auto;width:570px;height:410px;background:#2a2a2a;color:#fff;padding:30px 0 0 0;text-align:center;z-index:7100}
.lowIE-update .update-cont .tit {font-size:21px;padding:65px 0 25px 0;margin:0 40px 25px 40px;background:url(/resources/_Img/Common/ie_logo.png) no-repeat center 0;line-height:1.2;border-bottom:1px solid #444}
.lowIE-update .update-cont .btxt {font-weight:bold;font-size:15px;margin-bottom:10px}
.lowIE-update .update-cont .txt {font-size:12px;color:#c0c0c0;margin-bottom:35px}
.lowIE-update .update-cont .txt .spc {color:#0c8ecb;font-weight:bold}
.lowIE-update .update-cont .btn-upgrade {display:inline-block;font-size:15px;font-weight:bold;color:#fff;padding:15px 20px;background:#0c8ecb}
.lowIE-update .update-cont .btn-upgrade span {display:inline-block;vertical-align:middle;line-height:20px;color:#fff;padding-left:35px;background:url(/resources/_Img/Common/ie_arr.png) no-repeat 0 50%}
.lowIE-update .update-cont .chk-uclose {position:absolute;left:0;bottom:0;width:100%;height:40px;text-align:right;background:#0e0e0e}
.lowIE-update .update-cont .chk-uclose label {display:inline-block;vertical-align:middle;font-size:11px;color:#9f9f9f;padding:0 50px 0 5px;display:inline;zoom:1;line-height:40px}
.lowIE-update button {position:absolute;bottom:0;right:0;width:40px;height:40px;background:#000 url(/resources/_Img/Common/ie_close.png) no-repeat 50% 50%;border:0}

/* 포인트컬러값 */
.csc-p01 {color:#004756}
.csc-p02 {color:#0088a5}
.csc-p03 {color:#37a1b7}
.csc-p04 {color:#90c2c8}
.csc-p01bg {background:#004756}
.csc-p02bg {background:#0088a5}
.csc-p03bg {background:#37a1b7}
.csc-p04bg {background:#90c2c8}

/* 링크스타일 */
.sico-nwin {color:#006476 !important;letter-spacing:-0.05em;margin:0 5px 0 0}
.sico-nwin:after {content:"";display:inline-block;width:10px;height:10px;background:url(/resources/_Img/Common/ico_nw.gif) no-repeat 0 0;margin:0 0 1px 5px}
.sico-nwin:focus, .sico-nwin:active, .sico-nwin:hover {text-decoration:underline}

/* 탭메뉴 */
.c-tab01 {position:relative;margin: 30px auto 0;box-sizing:border-box;max-width: 1740px;}
/* max-width(1740) 에 auto 마진이라 1740px 미만에서는 좌우 여백이 0이 된다.
   #container(layout_kor.css) 와 같은 값으로 최소 여백을 맞춘다. */
@media all and (min-width:1441px) {
	.c-tab01 { max-width: min(1740px, calc(100% - 120px)); }
}
.c-tab01 ul { border-bottom : 1px solid #BFB8AA; display:inline-block;font-size:0;width:100%;position:relative;vertical-align:top;z-index:1}
.c-tab01 ul li {display:inline-block;position:relative;vertical-align:top;margin-right: 48px;}
.c-tab01 ul li::before {content : "/";position : absolute;left: 100%;width: 48px;text-align: center;top: 50%;transform: translateY(-50%);color: #D4CEA1;font-size: 16px;font-weight: 500;line-height: 1.5;letter-spacing: -0.025em;}

.c-tab01 ul li:last-child { margin : 0 }
.c-tab01 ul li:last-child::before { content: none; }

.c-tab01 ul li a {display: flex;align-items: center;justify-content: center;position:relative;text-align:center;box-sizing:border-box;padding: 20px 0;font-size: clamp(1rem, 0.75rem + 0.83vw, 1.5rem);z-index:0;color: #9F9065;transition:all .3s ease;line-height: 1.5;font-family: "Tenor Sans",sans-serif;transition: all 0.3s ease-in-out;border-bottom: 2px solid transparent;}
.c-tab01 ul li a:focus,
.c-tab01 ul li:hover a,
.c-tab01 ul li.over a {color: #715400; border-bottom: 2px solid #91825A;}


.c-tab01 ul li a span {display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;z-index:1;/* font-family: "Tenor Sans",sans-serif; */}
.c-tab01 ul li a span::after {content: "";display: none;position:absolute;z-index:1;width: 7px;height: 7px;border-radius: 50%;background: #fff;left: 0;top: 50%;transform: translateY(-50%);}
.c-tab01 ul li a[target="_blank"] span { padding-right: 15px; }
.c-tab01 ul li a[target="_blank"] span:after {content:"";display:inline-block;width: 20px;height: 20px;background: url(/resources/_Img/Common/ico_newtab.svg) no-repeat center 5px;vertical-align:middle;left: 18px;background-size: 10px;}


.c-tab01 ul li a[target="_blank"]:focus span:after,
.c-tab01 ul li a[target="_blank"]:hover span:after,
.c-tab01 ul li.over a[target="_blank"] span:after {background:url(/resources/_Img/Common/ico_newtab-b.svg)no-repeat center 5px; background-size: 10px; }

/* 모바일 셀렉트형 탭 — 영일피혁 골드/베이지 팔레트에 맞춤.
   데스크탑 탭(.c-tab01 ul li a)과 동일하게 Tenor Sans / #9F9065 → 활성 #715400 을 쓰고,
   긴 영문 제품군명이 잘리지 않도록 2열이 아닌 1열로 펼친다. */
.c-tab01.mSet {border:0; z-index:101; overflow:visible; position:relative; z-index:9; margin: 0 20px 0; }

.c-tab01.mSet:before,
.c-tab01.mSet:after {display:none}
.c-tab01.mSet button.ctab01Ctrl {position:relative;width:100%;border:1px solid #BFB8AA;background:#fff;font-size:0;text-align:left;box-sizing:border-box;padding:0 50px 0 20px;overflow:hidden;border-radius:10px;transition:border-color .3s ease}
.c-tab01.mSet button.ctab01Ctrl:before {content:"";display:inline-block;width:0;height: 55px;vertical-align:middle}
.c-tab01.mSet button.ctab01Ctrl span {display:inline-block;vertical-align:middle;font-family:"Tenor Sans",sans-serif;font-size:16px;color:#715400;font-weight:400;line-height:1.2;letter-spacing:0;}
.c-tab01.mSet button.ctab01Ctrl span:before {display:none}
.c-tab01.mSet button.ctab01Ctrl:after {content:"";display:block;position:absolute;right:22px;top: 22px;width:8px;height:8px;z-index:9;border:solid;border-width:0 0 1px 1px;border-color:transparent transparent #91825A #91825A;transform:rotate(-45deg);transition:all .3s ease}
.c-tab01.mSet button.ctab01Ctrl.over {border-color:#91825A}
.c-tab01.mSet button.ctab01Ctrl.over:after {transform:rotate(135deg);top:26px}
.c-tab01.mSet ul {display:none;position:absolute;width:100%;left:0;top:calc(100% + 6px);background:#fff;box-sizing:border-box;overflow:hidden;border:1px solid #BFB8AA;box-shadow:0 8px 20px rgba(58,51,46,.12);border-radius:10px;}
.c-tab01.mSet ul:after {display:none}
.c-tab01.mSet ul li {display:block;float:none;width:100%;padding:0;margin:0;min-width:0;max-width:none;box-sizing:border-box;}
.c-tab01.mSet ul li:nth-child(odd) {border-right:0}
.c-tab01.mSet ul li:before {content:"";display:block;position:absolute;width:100%;height:1px;left:0;bottom:0;background:#EAE8DB;z-index:1;; transform: translateY(0); top: auto;}
.c-tab01.mSet ul li:last-child:before {display:none}

.c-tab01.mSet ul li:after {display:none}
.c-tab01.mSet ul li:last-child {border-bottom:0}
/* 부모(.c-tab01 ul li a)가 flex + justify-content:center 이므로 좌측 정렬은 flex 로 풀고,
   행 높이는 min-height 로 잡는다. (a:before 는 content 가 없어 높이 지정이 먹지 않음) */
.c-tab01.mSet ul li a {justify-content:flex-start;text-align:left;padding:0 20px;min-height:56px;width:auto;background:transparent;z-index:0;color:#9F9065;border-bottom:0;transition:background .3s ease, color .3s ease}
.c-tab01.mSet ul li a:before {display:none}
.c-tab01.mSet ul li a:after {display:none}
.c-tab01.mSet ul li a span {font-family:"Tenor Sans",sans-serif;font-size:15px;letter-spacing:0;}
.c-tab01.mSet ul li a:focus,
.c-tab01.mSet ul li:hover a {background:#F2EFE6;color:#715400;border-bottom:0}
.c-tab01.mSet ul li button {height:44px}
.c-tab01.mSet ul li button:before,
.c-tab01.mSet ul li:first-child.over button,
.c-tab01.mSet ul li:first-child.over a {border:0}
.c-tab01.mSet ul li.over a {margin:0;background:#F2EFE6;color:#715400;border-radius:0;border-bottom:0}
.c-tab01.mSet ul li.over a span {color:#715400;}
.c-tab01.mSet ul li.over a span:after { display : none; }
.c-tab01.mSet ul li.over a span:before {display:none}

@media all and  (max-width:1440px) {
	/* #container 가 이 구간에서 margin:53px 20px 0 이므로 좌우 20px 로 맞춘다 */
	.c-tab01 { margin: 20px auto 0; max-width: calc(100% - 40px); }

}

@media all and (max-width:699px ) {
	.c-tab01 { order: 3; }
}

@media all and (max-width:500px) {
	.c-tab01.mSet {margin:0 20px; }
	.c-tab01.mSet button.ctab01Ctrl { padding : 0 44px 0 16px; }
	.c-tab01.mSet button.ctab01Ctrl:before { height : 50px; }
	.c-tab01.mSet button.ctab01Ctrl span { font-size : 15px; }
	.c-tab01.mSet button.ctab01Ctrl:after { right : 18px; top : 20px; }
	.c-tab01.mSet button.ctab01Ctrl.over:after { top : 24px; }
	.c-tab01.mSet ul li a { min-height : 50px; min-width: auto; padding : 0 16px; }
	.c-tab01.mSet ul li a span { font-size : 14px; }
}

.c-tab02 {position:relative;line-height:1;margin-top: 40px;z-index:8;font-size:0;text-align:center}
.c-tab02 ul {display: flex;justify-content: center;font-size:0;gap: 35px;}
.c-tab02 ul li {display:inline-block;position:relative;width:auto;vertical-align:top;}
.c-tab02 ul li a {display:block;color: #222;text-align:center;box-sizing:border-box;font-size:0;position:relative;padding-bottom: 20px;max-width:250px;transition:all .3s ease;/* margin-right: 35px; */}
.c-tab02 ul li a:before {content:"";display: block;width: 0;height: 2px;background: #222;position: absolute;bottom: 0;left: 50%;transition: width 0.3s ease, left 0.3s ease;}
.c-tab02 ul li a:after {/* content:""; */display:block;position:absolute;width:3px;height:3px;background:#333;left:0;top:50%;transform:translateY(-50%);background:#ccc;border-radius:50%}
.c-tab02 ul li:last-child a { margin : 0; }
.c-tab02 ul li a span {display:inline-block;font-size:16px;vertical-align:middle;line-height: 1.2; font-weight: 500;}

.c-tab02 ul li a[target="_blank"] span:after {content:"";display:inline-block;width:12px;height:12px;background:url(/resources/_Img/Common/nwin_spr.png) no-repeat -22px -25px;margin:-2px 0 0 10px;vertical-align:middle}

.c-tab02 ul li.over a:before,
.c-tab02 ul li:focus a:before,
.c-tab02 ul li:hover a:before {left:0; width:100%; background:#222;}

@media all and (max-width:699px ) {
	.c-tab02 {order: 4;margin: 30px 20px 0;}
	.c-tab02 ul li a span { font-size : 15px; }
}

@media all and (max-width:500px) {
	.c-tab02 ul { flex-wrap : wrap; gap : 20px; }
	.c-tab02 ul li a { padding-bottom : 15px; }
	.c-tab02 ul li a span { font-size : 13px; }
}

.b-tab01 {position:relative;border:0;margin-bottom:20px;height:65px;box-sizing:border-box;padding:0 65px;opacity:0;}
.b-tab01 .mCSB_scrollTools.mCSB_scrollTools_horizontal {height:0;overflow:hidden;bottom:0}
.b-tab01:after {content:"";display:block;position:absolute;width:100%;height:3px;left:0;bottom:0;background:#eee;z-index:-1}
.b-tab01.arrKeyHide {padding:0}
.b-tab01.arrKeyHide.hasOutAll .outAll {left:0}
.b-tab01.stable {opacity:1}

.b-tab01.hasOutAll .tabinwr {margin-left:200px;z-index:0}
.b-tab01.hasOutAll .outAll {position:absolute;width:200px;height:100%;left:65px;top:0;box-sizing:border-box;z-index:1}
.b-tab01.hasOutAll .outAll a {display:block;width:100%;height:100%;box-sizing:border-box;position:relative;text-align:center;color:#222;transition:all .3s ease}
.b-tab01.hasOutAll .outAll a:before {content:"";display:inline-block;width:0;height:100%;vertical-align:middle}
.b-tab01.hasOutAll .outAll a:after {content:"";display:block;position:absolute;width:100%;height:3px;background:#aaa;left:0;bottom:0;transition:all .3s ease}
.b-tab01.hasOutAll .outAll a:focus:after,
.b-tab01.hasOutAll .outAll a:hover:after {background:#f0b959}
.b-tab01.hasOutAll .outAll a span {display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;line-height:1}

.b-tab01.hasOutAll ul li.all {display:none;width:0 !important}
.b-tab01 .tabinwr {display:block;box-sizing:border-box;position:relative;overflow:auto;height:100%}
.b-tab01 ul {display:block;position:absolute;text-align:left;font-size:0;height:100%;white-space:nowrap;left:0;box-sizing:border-box;transition:left .3s ease}
.b-tab01 ul li {display:inline-block;text-align:center;box-sizing:border-box;position:relative;font-size:18px;width:240px;height:100%;vertical-align:top;z-index:0}
.b-tab01 ul li a {display:block;position:relative;color:#222;padding:0;height:100%;box-sizing:border-box;background:transparent;transition:all .3s ease}
.b-tab01 ul li a:before {content:"";display:inline-block;width:0;height:100%;vertical-align:middle}
.b-tab01 ul li a:after {content:"";display:block;position:absolute;width:0;height:3px;background:#f0b959;left:50%;bottom:0;transition:all .3s ease}
.b-tab01 ul li a span {display:inline-block;box-sizing:border-box;position:relative;position:relative;vertical-align:middle;line-height:1.2;word-wrap:break-word;word-break:keep-all;white-space:normal;font-size:.944em}
.b-tab01 ul li a:focus,
.b-tab01 ul li a:hover {color:#000}
.b-tab01 ul li a:focus:after,
.b-tab01 ul li a:hover:after {width:100%;left:0}
.b-tab01 ul li.over a {font-weight:500}
.b-tab01 ul li.over a:after {width:100%;left:0}
.b-tab01 ul li.over a:focus,
.b-tab01 ul li.over a:hover {color:#000}

.b-tab01 .button-wr.show {display:block}
.b-tab01 .button-wr.hide {display:none}
.b-tab01 .button-wr button {display:block;position:absolute;width:65px;height:65px;border:0;background:transparent;top:0;box-sizing:border-box;transition:all .3s ease}
.b-tab01 .button-wr button:after {content:"";display:block;position:absolute;opacity:.3;width:20px;height:10px;top:0;right:0;bottom:0;left:0;margin:auto;background:url(/resources/_Img/Common/style_spr.png) no-repeat;transition:opacity .3s ease, border .3s ease}
.b-tab01 .button-wr button:focus:after,
.b-tab01 .button-wr button:hover:after {opacity:1}

.b-tab01 .button-wr button.disabled:after {opacity:.3}
.b-tab01 .button-wr button.disabled:focus:after,
.b-tab01 .button-wr button.disabled:hover:after {opacity:.3}
.b-tab01 .button-wr button.btn-prev {left:0}
.b-tab01 .button-wr button.btn-prev:after {background-position:-274px 0}
.b-tab01 .button-wr button.btn-next {right:0}
.b-tab01 .button-wr button.btn-next:after {background-position:-304px 0}
@media all and (max-width:1199px) {
	.b-tab01.hasOutAll .outAll {width:100px}
	.b-tab01.hasOutAll .tabinwr {margin-left:100px}
}
@media all and (max-width:699px) {
	.b-tab01 {height:50px;padding:0 50px}
	.b-tab01.hasOutAll .outAll {width:50px;left:50px}
	.b-tab01.hasOutAll .tabinwr {margin-left:50px}
	.b-tab01 .button-wr button {width:50px;height:50px}
	.b-tab01 .button-wr button:after {opacity:1}
	.b-tab01 .button-wr button.disabled:after {opacity:.2}
	.b-tab01 .button-wr button.disabled:focus:after,
	.b-tab01 .button-wr button.disabled:hover:after {opacity:.2}
}

/* 회원 버튼 */
.lw-btn, .lg-btn, .lp-btn, .ldp-btn {position:relative;display:inline-block;vertical-align:top;line-height:1.1;box-sizing:border-box;min-width:180px;max-width:300px;padding:0 5px;font-size:0;text-align:center;transition:all .3s ease}
a.lw-btn:before, a.lg-btn:before, a.lp-btn:before, a.ldp-btn:before {content:"";display:inline-block;width:0;height:63px;vertical-align:middle}
a.lw-btn span, a.lg-btn span, a.lp-btn span, a.ldp-btn span {display:inline-block;line-height:1.2;box-sizing:border-box;vertical-align:middle;font-size:18px}
input.lw-btn, input.lg-btn, input.lp-btn, input.ldp-btn, button.lw-btn, button.lg-btn, button.lp-btn, button.ldp-btn {padding:0 10px;height:65px;cursor:pointer;font-size:18px}
.lw-btn, a.lw-btn {background:#fff;border:1px solid #ccc;color:#444 !important}
.lw-btn:hover, .lw-btn:focus {background:#fff;border:1px solid #306db8}
.lg-btn, a.lg-btn {background:#f7f7f7;border:1px solid #ccc;color:#444 !important}
.lg-btn:hover, .lg-btn:focus {background:#f7f7f7;border:1px solid #306db8}
.lp-btn, a.lp-btn {background:#0463bb;border:1px solid #0463bb;color:#fff !important}
.lp-btn:hover, .lp-btn:focus {background:#004687;border:1px solid #004687}
.ldp-btn, a.ldp-btn {background:#002752;border:1px solid #002752;color:#fff !important}
.ldp-btn:hover, .ldp-btn:focus {background:#001c42;border:1px solid #001c42}

/* 이미지 슬라이드 */
.img-slide-wr {width:100%;position:relative;margin:0 auto}
.img-slide-wr .item .viewDetail {display:block;position:absolute;width:50px;height:50px;right:0;bottom:0;z-index:1;background:#fff;font-size:0;transition:all .3s ease}
.img-slide-wr .item .viewDetail:after {content:"";display:block;position:absolute;width:18px;height:18px;top:0;right:0;bottom:0;left:0;margin:auto;background:url(/resources/_Img/Common/style_spr.png) no-repeat -210px -20px;opacity:.4;transition:all .3s ease}
.img-slide-wr .item .viewDetail:focus:after,
.img-slide-wr .item .viewDetail:hover:after {opacity:1}
.img-slide-wr .item .viewNormal {display:block;width:100%;position:relative;z-index:0}
.img-slide-wr .owl-stage-outer {z-index:0}
.img-slide-wr .owl-nav {position:absolute;bottom:0;right:50px;font-size:0;z-index:1}
.img-slide-wr .owl-nav button {display:inline-block;position:relative;width:50px;height:50px;background:rgba(0, 0, 0, .7) !important;margin:0 1px 0 0;transition:all .3s ease}
.img-slide-wr .owl-nav button:after {content:"";display:block;position:absolute;width:22px;height:10px;top:0;right:0;bottom:0;left:0;margin:auto;background:url(/resources/_Img/Common/style_spr.png) no-repeat}
.img-slide-wr .owl-nav .owl-prev:after {background-position:-210px 0}
.img-slide-wr .owl-nav .owl-next:after {background-position:-242px 0}
.img-slide-wr .owl-nav button:focus,
.img-slide-wr .owl-nav button:hover {background:#000 !important}
.img-slide-wr .dataUtil {position:relative;width:100%;text-align:center;font-size:0;margin:14px 0 0;display:none}
.img-slide-wr .dataUtil > div {display:inline-block;vertical-align:middle;font-size:0;box-sizing:border-box}
.img-slide-wr .dataUtil > div button {width:23px;height:23px;box-sizing:border-box;position:relative;border:0;background:transparent}
.img-slide-wr .dataUtil > div button:after {content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;box-sizing:border-box;transition:all .3s ease}

.img-slide-wr .dataUtil .dataDots button:after {width:7px;height:7px;border-radius:50%;background:#969696;transition:all .3s ease}
.img-slide-wr .dataUtil .dataDots button:focus:after,
.img-slide-wr .dataUtil .dataDots button:hover:after {background:#000}
.img-slide-wr .dataUtil .dataDots button.active:after {width:20px;height:4px;border-radius:0;background:#faa61a}
.img-slide-wr .dataUtil .dataAuto {margin:0 0 0 3px}
.img-slide-wr .dataUtil .dataAuto .btn-stop {display:block}
.img-slide-wr .dataUtil .dataAuto .btn-stop:after {width:10px;height:13px;border:solid;border-width:0 3px;border-color:transparent #565656}
.img-slide-wr .dataUtil .dataAuto .btn-stop:focus:after,
.img-slide-wr .dataUtil .dataAuto .btn-stop:hover:after {border-color:transparent #faa61a}
.img-slide-wr .dataUtil .dataAuto .btn-play {display:none}
.img-slide-wr .dataUtil .dataAuto .btn-play:after {width:0;height:0;border:solid;border-width:6px 0 6px 9px;border-color:transparent transparent transparent #565656}
.img-slide-wr .dataUtil .dataAuto .btn-play:focus:after,
.img-slide-wr .dataUtil .dataAuto .btn-play:hover:after {border-color:transparent transparent transparent #faa61a}
@media all and (max-width:799px) {
	.img-slide-wr .item .viewDetail {width:35px;height:35px}
	.img-slide-wr .owl-nav {right:35px}
	.img-slide-wr .owl-nav button {width:35px;height:35px}
}

/* 이미지 확대보기 */
.img-zoom {position:relative;width:100%}
.img-zoom img {max-width:100%}
.img-zoom .btn-zoom {position:absolute;top:0;right:0;display:block;width:35px;height:35px;background:#fff;z-index:1;box-sizing:border-box;border:1px solid #ddd;transition:all .3s ease;}
.img-zoom .btn-zoom:after {content:"";display:block;position:absolute;width:18px;height:18px;top:0;right:0;bottom:0;left:0;margin:auto;background:url(/resources/_Img/Common/style_spr.png) no-repeat -210px -20px}
.img-zoom .btn-zoom:focus,
.img-zoom .btn-zoom:hover {background:rgba(0, 0, 0, .5);}
@media all and (max-width:768px){
	.img-zoom img {width:100%}
}
@media all and (max-width:699px) {
	.img-zoom .btn-zoom {width:35px;height:35px}
}

/* pdf 뷰어 */
.pdf-view-wr {position:relative;border-top:2px solid #777;background:#fbfbfb;padding:25px}
.pdf-view-wr p {font-size:15px;background:url(/resources/_Img/Common/sicon_acrobat.png) no-repeat;padding-left:38px;line-height:1.8;margin-right:270px}
.pdf-view-wr p .pdf-down {display:block;font-size:13px;font-weight:bold;color:#ff0000;letter-spacing:-0.025em;text-decoration:underline}
.pdf-view-wr .btn-down {position:absolute;top:50%;right:55px;line-height:1.8;margin-top:-12px;font-size:15px;color:#555;padding-right:50px}
.pdf-view-wr .btn-down:before {content:"";display:inline-block;vertical-align:middle;width:19px;height:23px;background:url(/resources/_Img/Common/ficon/pdf.gif) no-repeat 0 0;margin-right:8px;margin-top:-2px}
.pdf-view-wr .btn-down:after {position:absolute;top:50%;right:0;margin-top:-17px;content:"";display:block;width:35px;height:35px;background:url(/resources/_Img/Content/pdf_sprite.png) no-repeat 0 0}
@media all and (max-width:899px){
	.pdf-view-wr p {margin-right:0}
	.pdf-view-wr .btn-down {display:inline-block;position:relative;top:auto;right:auto;margin-top:10px;margin-left:8px}
}

/* 준비중, 에러 메시지, 안내 페이지 */
.msg-wrap {width:100%;max-width:617px;text-align:center;color:#333;padding:120px 0;margin:0 auto}
.msg-wrap:before {content:"";display:block;width:114px;height:103px;background:url(/resources/_Img/Common/style_spr.png) no-repeat 0 0;margin:0 auto 55px}
.msg-wrap.wait:before {background-position:0 -140px}
.msg-wrap.error:before {background-position:-124px -140px}
.msg-wrap.info:before {background:url(/resources/_Img/Member/member_spr.png) no-repeat 0 -68px; width: 105px; height: 85px; background-position: -350px -68px; position: absolute; top: 0; left: 50%; margin-left: -52.5px;}
.msg-wrap.logout:before {background-position:-372px -140px}
.msg-wrap .tit {font-size:1.167em;color:#333;font-weight:500;line-height:1.2;margin-bottom:15px;letter-spacing:-.05em}
.msg-wrap .txt {font-size:1em;color:#444;line-height:1.6;width:100%;letter-spacing:-.03em}
.msg-wrap .msgBox {font-size:15px;color:#666;line-height:1.6;width:100%;margin-top:15px;letter-spacing:-.03em}
.msg-wrap .btn {margin:34px 0 0;text-align:center;overflow:hidden}
.msg-wrap .btn > * {margin:0 3px}
@media all and (max-width:999px) {
	.msg-wrap:before {margin:0 auto 30px}
}
@media all and (max-width:599px) {
	.msg-wrap .btn {margin:20px 0 0}
	.msg-wrap .btn > * {display:block;margin:0;min-width:0;max-width:none}
	.msg-wrap .btn.has1 > * {width:100%}
	.msg-wrap .btn.has2 > * {width:49%}
	.msg-wrap .btn.has2 > *:first-child {float:left}
	.msg-wrap .btn.has2 > *:last-child {float:right}
}
@media all and (max-width:399px) {
	.msg-wrap .txt br {display:none}
	.msg-wrap .txt br + br {display:block}
}

/* 플로우 차트 */
.flow-type01 ul,
.flow-type01 ol {display:flex;flex-flow:row;flex-wrap:wrap}
.flow-type01 li {display:inline-block;vertical-align:top;margin:20px 7.759% 0 0;box-sizing:border-box;position:relative}
.flow-type01 li .txtPkg {display:block;min-height:130px;background:#48b7ce;box-sizing:border-box;padding:59px 10px 20px 20px;position:relative;z-index:1;height:100%;position:relative}
.flow-type01 li .txtPkg .num {display:block;position:absolute;font-family:address-sans-pro, sans-serif;font-size:14px;opacity:.8;letter-spacing:.05em;border-radius:0 999px 999px 0;background:rgba(0, 0, 0, .3);left:0;top:10px;color:rgba(255, 255, 255, .8);line-height:1;padding:13px 15px}
.flow-type01 li .txtPkg .str {font-size:.889em;line-height:1.25;font-weight:300;color:#fff}
.flow-type01 li .txtPkg .str span {display:block}

.flow-type01 li .arrPkg {display:block;position:absolute;height:18px;left:100%;top:47px;z-index:0}
.flow-type01 li .arrPkg:before,
.flow-type01 li .arrPkg:after {content:"";display:block;position:absolute;background:url(/resources/_Img/Common/style_spr.png) no-repeat}
.flow-type01 li .arrPkg:before {width:15px;height:14px;background-position:-238px -20px;top:0;right:0;bottom:0;left:0;margin:auto;z-index:1}
.flow-type01 li .arrPkg:after {width:127px;height:10px;background-position:-90px -110px;right:0;top:0;z-index:0}
.flow-type01 li:first-child .txtPkg,
.flow-type01 li:last-child .txtPkg {background:#0061ba}
.flow-type01 li:last-child .arrPkg {display:none}
.flow-type01.has5 li {width:13.7928%}
.flow-type01.has5 li:nth-child(5n) {margin-right:0}
.flow-type01.has5 li:nth-child(5n) .arrPkg {display:none}
.flow-type01.has5 li:nth-child(-n+5) {margin-top:0}
.flow-type01.has5 li .arrPkg {width:56.25%}
.flow-type01.has4 li {width:19.18075%}
.flow-type01.has4 li:nth-child(4n) {margin-right:0}
.flow-type01.has4 li:nth-child(4n) .arrPkg {display:none}
.flow-type01.has4 li:nth-child(-n+4) {margin-top:0}
.flow-type01.has4 li .arrPkg {width:40.25%}
.flow-type01.has3 li {width:28.16066%}
.flow-type01.has3 li:nth-child(3n) {margin-right:0}
.flow-type01.has3 li:nth-child(3n) .arrPkg {display:none}
.flow-type01.has3 li:nth-child(-n+3) {margin-top:0}
.flow-type01.has3 li .arrPkg {width:27.25%}

.flow-type01.type2 li {margin:20px 3.70% 0 0}
.flow-type01.type2 li .txtPkg {min-height:0;border:solid;border-width:0 3px 3px;border-color:#48b7ce;padding:0;background:#fff}
.flow-type01.type2 li .txtPkg .strBox1 {background:#48b7ce;box-sizing:border-box;padding:59px 0 0}
.flow-type01.type2 li .txtPkg .strBox1 .num {left:-3px}
.flow-type01.type2 li .txtPkg .strBox1 .str {box-sizing:border-box;padding:5px 16px 18px;font-size:.944em}
.flow-type01.type2 li .txtPkg .strBox2 {background:#fff;color:#555;font-size:.944em;line-height:1.1764;box-sizing:border-box;padding:16px 17px 10px}

.flow-type01.type2 li .txtPkg .strBox2 li {display:block;width:100%;margin:0 0 10px !important;box-sizing:border-box;position:relative;padding:0 0 0 11px}
.flow-type01.type2 li .txtPkg .strBox2 li:before {content:"";display:block;position:absolute;width:4px;height:4px;border-radius:50%;background:#555;left:0;top:9px}
.flow-type01.type2 li .txtPkg .strBox2 li:last-child {margin:0 !important}
.flow-type01.type2 li .arrPkg {top:50%;transform:translateY(-50%)}
.flow-type01.type2 li:first-child .txtPkg,
.flow-type01.type2 li:last-child .txtPkg {border-color:#0061ba}
.flow-type01.type2 li:first-child .txtPkg .strBox1,
.flow-type01.type2 li:last-child .txtPkg .strBox1 {background:#0061ba}

.flow-type01.type2.has4 li {width:22.225%}
.flow-type01.type2.has4 li:nth-child(4n) {margin-right:0}
.flow-type01.type2.has4 li:nth-child(4n) .arrPkg {display:none}
.flow-type01.type2.has4 li:nth-child(-n+4) {margin-top:0}
.flow-type01.type2.has4 li .arrPkg {width:16.25%}

.flow-type01.type2.has3 li {width:30.866%}
.flow-type01.type2.has3 li .arrPkg {width:12.25%}

@media all and (max-width:1199px) {
	.flow-type01 li {margin:20px 6.25% 0 0}
	.flow-type01 li .txtPkg {padding:45px 15px 20px}
	.flow-type01 li .txtPkg .num {padding:6px 10px 5px}
	.flow-type01 li .arrPkg {top:50%;transform:translateY(-50%)}
	.flow-type01.has5 li {width:15%}
	.flow-type01.has5 li .arrPkg {width:41.25%}
	.flow-type01.has4 li {width:20.3125%}
	.flow-type01.has4 li .arrPkg {width:30.25%}
	.flow-type01.has3 li {width:29.1666%}
	.flow-type01.has3 li .arrPkg {width:21.25%}
	.flow-type01.type2 li .txtPkg .strBox1 {padding:45px 0 0}
	.flow-type01.type2 li .txtPkg .strBox1 .str {font-size:.889em}
}
@media all and (max-width:999px) {
	.flow-type01 li {margin:20px 2.5% 0 0}
	.flow-type01 li .arrPkg:before {display:none}
	.flow-type01.has5 li {width:18%}
	.flow-type01.has5 li .arrPkg {width:14.25%}
	.flow-type01.has4 li {width:23.125%}
	.flow-type01.has4 li .arrPkg {width:10.25%}
	.flow-type01.has3 li {width:31.6666%}
	.flow-type01.has3 li .arrPkg {width:7.25%}

	.flow-type01.type2 li {margin:20px 2.5% 0 0}
	.flow-type01.type2.has4 li {width:31.6666%}
	.flow-type01.type2.has4 li:nth-child(4n) {margin-right:2.5%}
	.flow-type01.type2.has4 li:nth-child(3n) {margin-right:0}
	.flow-type01.type2.has4 li:nth-child(4n) .arrPkg {display:block}
	.flow-type01.type2.has4 li:nth-child(3n) .arrPkg {display:none}
	.flow-type01.type2.has4 li:nth-child(-n+4) {margin-top:20px}
	.flow-type01.type2.has4 li:nth-child(-n+3) {margin-top:0}
	.flow-type01.type2.has4 li .arrPkg {width:7.25%}

	.flow-type01.type2.has3 li {width:31.6666%}
	.flow-type01.type2.has3 li:nth-child(4n) {margin-right:2.5%}
	.flow-type01.type2.has3 li:nth-child(3n) {margin-right:0}
	.flow-type01.type2.has3 li:nth-child(4n) .arrPkg {display:block}
	.flow-type01.type2.has3 li:nth-child(3n) .arrPkg {display:none}
	.flow-type01.type2.has3 li:nth-child(-n+4) {margin-top:20px}
	.flow-type01.type2.has3 li:nth-child(-n+3) {margin-top:0}
	.flow-type01.type2.has3 li .arrPkg {width:7.25%}
}
@media all and (max-width:899px) {
	.flow-type01 li {width:31.6666% !important}
	.flow-type01 li .arrPkg {width:7.25% !important}
	.flow-type01 li:nth-child(5n) {margin-right:2.5% !important}
	.flow-type01 li:nth-child(4n) {margin-right:2.5% !important}
	.flow-type01 li:nth-child(3n) {margin-right:0 !important}
	.flow-type01 li:nth-child(5n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(4n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(3n) .arrPkg {display:none !important}
	.flow-type01 li:nth-child(-n+5) {margin-top:20px !important}
	.flow-type01 li:nth-child(-n+4) {margin-top:20px !important}
	.flow-type01 li:nth-child(-n+3) {margin-top:0 !important}

	.flow-type01.type2 li .txtPkg .strBox2 li {width:100% !important}
}
@media all and (max-width:768px) {
	.flow-type01.type2 li .txtPkg .strBox2 li:before {top:8px}
}
@media all and (max-width:699px) {
	.flow-type01 li {width:48% !important;margin-right:4% !important}
	.flow-type01 li .txtPkg {min-height:0;padding:42px 10px 10px}
	.flow-type01 li .arrPkg {width:7.25% !important}
	.flow-type01 li:nth-child(5n) {margin-right:4% !important}
	.flow-type01 li:nth-child(4n) {margin-right:4% !important}
	.flow-type01 li:nth-child(3n) {margin-right:4% !important}
	.flow-type01 li:nth-child(2n) {margin-right:0 !important}
	.flow-type01 li:nth-child(5n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(4n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(3n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(2n) .arrPkg {display:none !important}
	.flow-type01 li:nth-child(-n+5) {margin-top:20px !important}
	.flow-type01 li:nth-child(-n+4) {margin-top:20px !important}
	.flow-type01 li:nth-child(-n+3) {margin-top:20px !important}
	.flow-type01 li:nth-child(-n+2) {margin-top:0 !important}

	.flow-type01.type2 li .txtPkg .strBox1 {padding:40px 0 0}
	.flow-type01.type2 li .txtPkg .strBox1 .str {padding:3px 10px 10px}
}
@media all and (max-width:399px) {
	.flow-type01 li {width:100% !important;margin:0 !important;padding:0 0 20px}
	.flow-type01 li .arrPkg {display:block !important;width:50px !important;height:18px;left:42%;transform:translate(0, 0) rotate(90deg);top:auto;bottom:16px;overflow:hidden}
	.flow-type01 li:last-child .arrPkg {display:none !important}
	.flow-type01 li:nth-child(5n) {margin-right:0 !important}
	.flow-type01 li:nth-child(4n) {margin-right:0 !important}
	.flow-type01 li:nth-child(3n) {margin-right:0 !important}
	.flow-type01 li:nth-child(2n) {margin-right:0 !important}
	.flow-type01 li:nth-child(5n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(4n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(3n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(2n) .arrPkg {display:block !important}
	.flow-type01 li:nth-child(-n+5) {margin-top:0 !important}
	.flow-type01 li:nth-child(-n+4) {margin-top:0 !important}
	.flow-type01 li:nth-child(-n+3) {margin-top:0 !important}
	.flow-type01 li:nth-child(-n+2) {margin-top:0 !important}

	.flow-type01.type2.has4 li .arrPkg,
	.flow-type01.type2.has3 li .arrPkg {transform:translate(0, 0) rotate(90deg) !important;top:auto}
}

/* Form-style 정보 */
.finfo-ex01,
.finfo-ex02,
.finfo-ex03,
.finfo-ex04 {display:block;position:relative;line-height:1.4;padding-left:25px;margin:10px 5px 0 0;font-size:0.889em;color:#777777;text-align:left;}
.finfo-ex01.inline,
.finfo-ex02.inline,
.finfo-ex03.inline,
.finfo-ex04.inline {display:inline-block}
.finfo-ex01:before,
.finfo-ex02:before,
.finfo-ex03:before,
.finfo-ex04:before {content:"";display:block;position:absolute;left:0;top:0;width:18px;height:18px;background:url(/resources/_Img/Common/style_spr.png) no-repeat -230px -110px}
.finfo-ex01:before {background-position:-230px -110px;}
.finfo-ex02:before {background-position:-258px -110px;}
.finfo-ex03:before {background-position:-286px -110px;width:20px;height:20px;}
.finfo-ex04:before {background-position:-316px -110px;width:14px;height:14px;top:2px;}
.finfo-ex02 {color:#fa3030;}
.finfo-ex03 {color:#00204b;padding-left:30px;}
.finfo-ex04 {font-size:0.778em;color:#777777;padding-left:19px;letter-spacing:-0.05em;}

/* Form-style(라디오, 체크버튼, 숫자형) */
.frm-rdos-wr {font-size:0}

.frm-rdos-wr .frm-rdos {display:inline-block;text-align:center;vertical-align:top}
.frm-rdos-wr .frm-rdos input[type=radio] {position:absolute;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}
.frm-rdos-wr .frm-rdos input[type=radio] + label {display:block;position:relative;background:#fff;border:1px solid #cccccc;border-left-width:0;min-width:77px;padding:0 12px;color:#555;font-size:16px;font-weight:400;line-height:43px;box-sizing:border-box;cursor:pointer;transition:width .3s ease}
.frm-rdos-wr .frm-rdos input[type=radio] + label:before {content:"";display:none;width:11px;height:6px;border:solid;border-width:0 0 2px 2px;border-color:transparent transparent #fff #fff;transform:rotate(-45deg);margin:-5px 5px 0 0;vertical-align:middle;box-sizing:border-box;}
.frm-rdos-wr .frm-rdos:first-child input[type=radio] + label {border-left-width:1px}
.frm-rdos-wr .frm-rdos input[type=radio]:checked + label {background:#2360c5;border-color:#2360c5;color:#fff}
.frm-rdos-wr .frm-rdos input[type=radio]:checked + label:before {display:inline-block}
.frm-rdos-wr .frm-rdos input[type=radio]:focus + label:after {display:block;content:'';position:absolute;top:0;left:0;width:100%;height:100%;box-sizing:border-box;border:1px dashed rgb(252, 100, 97);}
.Code-eng .frm-rdos-wr .frm-rdos input[type=radio] + label {min-width:60px;}

.frm-chks-wr {font-size:0}

.frm-chks-wr .frm-chks {display:inline-block;text-align:center;vertical-align:top}
.frm-chks-wr .frm-chks input[type=checkbox] {position:absolute;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}
.frm-chks-wr .frm-chks input[type=checkbox] + label {display:block;position:relative;background:#fff;border:1px solid #cccccc;border-left-width:0;min-width:77px;padding:0 12px;color:#555;font-size:16px;font-weight:400;line-height:43px;box-sizing:border-box;transition:width .3s ease}
.frm-chks-wr .frm-chks input[type=checkbox] + label:before  {content:"";display:none;width:11px;height:6px;border:solid;border-width:0 0 2px 2px;border-color:transparent transparent #fff #fff;transform:rotate(-45deg);margin:-5px 5px 0 0;vertical-align:middle;box-sizing:border-box;}
.frm-chks-wr .frm-chks:first-child input[type=checkbox] + label  {border-left-width:1px}
.frm-chks-wr .frm-chks input[type=checkbox]:checked + label {background:#2360c5;border-color:#2360c5;color:#fff}
.frm-chks-wr .frm-chks input[type=checkbox]:checked + label:before {display:inline-block}
.frm-rdos-wr .frm-chks input[type=radio]:focus + label:after {display:block;content:'';position:absolute;top:0;left:0;width:100%;height:100%;box-sizing:border-box;border:1px dashed rgb(252, 100, 97);}

@media all and (max-width:599px){
	.frm-rdos-wr .frm-rdos input[type=radio] + label,
	.frm-chks-wr .frm-chks input[type=checkbox] + label {font-size:14px}
	.frm-rdos-wr .frm-rdos input[type=radio] + label:before,
	.frm-chks-wr .frm-chks input[type=checkbox] + label:before {width:10px;margin-top:-6px}
}

.frm-nums-wr {font-size:0}
.frm-nums-wr > * {display:inline-block;border:1px solid #ddd;line-height:48px;text-align:center;vertical-align:top;box-sizing:border-box}
.frm-nums-wr > button {position:relative;background:#fff;width:68px;height:50px}
.frm-nums-wr > button.frm-minus {border-top-left-radius:50px;border-bottom-left-radius:50px}
.frm-nums-wr > button.frm-plus {border-top-right-radius:50px;border-bottom-right-radius:50px}
.frm-nums-wr > button.frm-minus:before,
.frm-nums-wr > button.frm-plus:before,
.frm-nums-wr > button.frm-plus:after {content:"";display:inline-block;position:absolute;left:0;right:0;top:0;bottom:0;background-color:#848484;width:14px;height:2px;margin:auto}
.frm-nums-wr > button.frm-plus:after {width:2px;height:14px}
.input-num-box .input-num input[type="text"] {max-width:55px;margin:0 5px;padding:0;text-align:center}
.input-num-box .input-num-txt {font-size:17px}
.frm-nums-wr > .num-txt {background:#f2f2f2;border-left:0;border-right:0;width:120px;height:auto;padding:0 10px;color:#333333;font-size:18px;font-weight:500;letter-spacing:-.05em}

/* 260317 */
.styleguide-line {width: 110%;height: 40px;background: #F4F4F4;margin: 60px 0;transform: translateX(-70px);}
.styleguide .main {font-family : "Pretendard Variable", Pretendard, "Noto Sans KR", "맑은고딕", "돋움", arial, Dotum, Verdana, helvetica, clean, sans-serif !important;padding: 80px 67px;background : #434343;display : flex;align-items : center;justify-content : space-between;max-width: 1406px;margin : 0 auto;line-height: 1.2 !important; border-radius: 30px 30px 0 0; }
.styleguide .main h2 { font-weight : 700; color : #fff; font-size : 40px; padding-bottom : 0 }
.styleguide .main span { color : rgba(255,255,255,0.6) ; font-weight : 600; font-size : 40px;  }
#wrap .styleguide #cont {font-family : "Pretendard Variable", Pretendard, "Noto Sans KR", "맑은고딕", "돋움", arial, Dotum, Verdana, helvetica, clean, sans-serif !important}

.sg-tit h2 { font-weight : 400; font-size : 56px; color : #000; }
.sg-tit h2 span { font-weight : 600; }

.m-tit {font-size : 20px;font-weight: 700;color: #878787;margin-bottom: 30px;}

.List-guide {margin-left : 360px; display: flex;}
.List-guide div { width : calc(100% / 2)}

.Info-guide { margin-left : 360px; }
.Info-guide .flex-box {display: inline-flex;gap: 20px;}
.Info-guide  .m-tit { margin-bottom : 20px;}

.Button-guide { margin-left : 360px;   }
.Button-guide .m-tit { margin-bottom : 20px; }
.Button-guide .flex-box { display : flex; gap : 10px;  }
.Button-guide .flex-box:nth-child(3) {margin-top: 20px;display: inline-block;border-radius: 5px;}
.Button-guide .flex-box .box p { text-align : center; margin-bottom : 10px; color:#878787; font-size : 16px; font-weight:600; }
.Button-guide .flex-box .box div { padding : 10px; display : flex; flex-flow : column; gap : 10px; }
.Button-guide .flex-box.pg .box div { border-radius : 5px}

.State-guide {padding: 20px;border-radius : 5px;display : flex;flex-flow : column;gap : 20px;}
.State-guide div {display : flex;gap : 20px;flex-wrap: wrap;}

.Form-guide { margin-left : 360px; display: flex; flex-direction: column; gap: 0;  }
.Form-guide .box { display : flex; gap : 20px; align-items : center; padding: 16px 0; }
.Form-guide .box .flex-box {border-radius : 5px;display : flex;gap : 20px;padding: 24px 20px;}
.Form-guide .box:last-child .flex-box { gap : 0px; }
.Form-guide .box .m-tit {width : 200px;margin : 0;}

/* ==============================================
   01. Colors
   ============================================== */

.color-guide .row {display: flex;align-items: flex-start;gap: 0;margin-bottom: 40px;justify-content: space-between;}
.color-guide .row > p {min-width: 360px;font-size: 32px;color: #444;font-weight: 500;}
.color-guide .row > div {flex: 1;}
.color-guide .chip {border-radius: 10px;min-height: 90px; position: relative;max-width: 1038px;width: 100%;}
.color-guide .chip::before {content: 'A';font-size: 16px;font-weight: 600;color: #fff;position: absolute;left: 15px;bottom: 7px;}
.color-guide .clabel {text-align: center;margin-top: 9px;}
.color-guide .clabel b {display: block;font-size: 16px;font-weight: 700;color: #000;}
.color-guide .clabel span {display: block;font-size: 16px;color: #666;margin-top: 9px;}
.color-guide .cgrid {	display: grid;	gap: 14px; }
.color-guide .cgrid.col2 { grid-template-columns: repeat(2, 1fr); }
.color-guide .cgrid.col3 { grid-template-columns: repeat(3, 1fr); }
.color-guide .cgrid.col4 { grid-template-columns: repeat(4, 1fr); }
.color-guide .cgrid.col5 { grid-template-columns: repeat(5, 1fr); }

.chip.c-main { background: #036BE0; }
.chip.c-point {background: linear-gradient(to right, #40A700 , #2D8F96 , #3744BD);}
.clabel-point {text-align: center;margin-top: 10px;}
.clabel-point div {display : flex;justify-content: space-between;}
.clabel-point div span {position: relative;font-size: 16px;color: #666;line-height: 1.2;padding-left: 22px;}
.clabel-point div span::before {content:"";position: absolute;left : 0;top:0;width: 0;height: 0;border-left: 13px solid #d9d9d9;border-bottom: 13px solid transparent;}
.clabel-point .name {font-size: 16px;font-weight: 700;color: #000;text-align: center;}

.chip.c-sub1 { background: #43A734; }
.chip.c-sub2 { background: #009F85; }
.chip.c-sub3 { background: #2D7DDE; }
.chip.c-sub4 { background: #FF6200; }

.chip.c-bg1 {background: #F5F5F5;/* border: 1px solid #eaeaea; */}
.chip.c-bg2 {background: #F8F8F8;/* border: 1px solid #eaeaea; */}
.chip.c-bg1::before,
.chip.c-bg2::before {color: #000;}

.chip.c-bdk  { background: #000000; }
.chip.c-bmd  { background: #222222; }
.chip.c-bnm  { background: #444444; }
.chip.c-bsl  { background: #666666; }
.chip.c-blt  { background: #767676; }

.chip.c-info { background: #4A5169; }
.chip.c-ok   { background: #0EA063; }
.chip.c-err  { background: #EB5757; }

.chip.c-bdr    { background: #fff; border: 1px solid #DDDDDD; }
.chip.c-bdrlt  { background: #fff; border: 1px solid #E4E4E3; }
.chip.c-bdrdk  { background: #fff; border: 1px solid #BEC3D2; }
.chip.c-bdr::before,
.chip.c-bdrlt::before,
.chip.c-bdrdk::before { color: rgba(0,0,0,.15); }

.chip.c-shadow {background: #fff;box-shadow: 0 20px 30px rgba(0,0,0,0.15);}
.chip.c-shadow::before { color: rgba(0,0,0,.15); }

/* ==============================================
   02. Typography
   ============================================== */

.fonw300 { font-weight: 300; }
.fonw400 { font-weight: 400; }
.fonw500 { font-weight: 500; }
.fonw600 { font-weight: 600; }
.fonw700 { font-weight: 700; }

.let0 { letter-spacing: 0; }

.kor1 {	font-family: "Pretendard Variable", Pretendard, 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif;	font-size: 18px;	line-height: 1.8;	color: #222;	letter-spacing: -0.03em;	margin-bottom: 10px; }

.kor2 { font-family: "Escoredream", "Pretendard Variable", Pretendard, "Noto Sans KR", "맑은고딕", "돋움", arial, Dotum, Verdana, helvetica, clean, sans-serif !important;	font-size: 18px;	line-height: 1.8;	color: #222;	letter-spacing: -0.03em;	margin-bottom: 10px;}

.eng1 {	font-family: 'address-sans-pro', 'Pretendard', sans-serif; font-size: 18px;	line-height: 1.8;	color: #222;	margin-bottom: 10px;}

.body-txt1 {font-family: "Pretendard Variable", Pretendard, sans-serif;font-size: 18px;line-height: 1.3;color: #444444;letter-spacing: -0.03em;}
.body-txt2 {font-family: "Pretendard Variable", Pretendard, sans-serif;font-size: 17px;line-height: 1.3;color: #444;letter-spacing: -0.03em;}

h3.c-tit01, .c-tit01 {font-family: "Escoredream", "Pretendard Variable", Pretendard, "Noto Sans KR", "맑은고딕", "돋움", arial, Dotum, Verdana, helvetica, clean, sans-serif !important; font-size: 30px;font-weight: 700;color: #000;line-height: 1;margin-bottom: 30px;letter-spacing: -0.03em;}
h4.c-tit02, .c-tit02 {font-family:"Escoredream", "Pretendard Variable", Pretendard, "Noto Sans KR", "맑은고딕", "돋움", arial, Dotum, Verdana, helvetica, clean, sans-serif !important;font-size: 25px;font-weight: 700;color: #003B7E;line-height: 1;letter-spacing: -0.03em;margin-bottom: 20px; }
h5.c-tit03, .c-tit03 {font-family: "Escoredream", "Pretendard Variable", Pretendard, "Noto Sans KR", "맑은고딕", "돋움", arial, Dotum, Verdana, helvetica, clean, sans-serif !important;font-size: 18px;font-weight: 500;color: #036BE0;letter-spacing: -0.03em;margin-bottom: 15px; padding-left: 17px; position: relative;}
h5.c-tit03::before, .c-tit03::before { content: ""; width: 7px; height: 7px; background: #036BE0; border-radius: 100%; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}

.typo-guide {max-width : 1040px;margin: 0 0 0 auto;position: relative;display: flex;flex-flow: column;gap: 76px;}
.typo-guide::before { content:"";position : absolute; left: -459px; bottom : 0; background:url(/resources/_Img/styleguide_Aa.png) no-repeat center center; width : 295px; height:311px;}
.typo-guide .row {display: flex;align-items: flex-start;gap: 30px;margin-bottom: 38px;padding-bottom: 38px;}
.typo-guide .row:last-child {flex-flow: column;gap: 20px;display: flex;}
.typo-guide .row > .label { font-size: 20px;color: #878787;font-weight: 700;flex-shrink: 0;}
.typo-guide .row > .content {flex: 1;display: flex;flex-flow: column;gap: 17px;}
.typo-guide .row > .content .font-name {font-size: 40px;font-weight: 700; line-height: 1.2;color: #000;}
.typo-guide .row > .content .font-info {font-size: 14px;color: #000;line-height: 1.8; font-weight: 700;}
.typo-guide .row > .content .font-link {font-size: 16px;color: #878787;text-decoration: underline;font-weight: 400;line-height: 1.4;}
.typo-guide hr {	border: 0;	border-top: 1px solid #e8e8e8;	margin: 14px 0;}
.typo-guide .header-box {border-radius: 5px;padding: 20px;display: flex;gap: 25px;flex-flow: column;width: 231px;}

@media all and (max-width: 999px) {
	h3.c-tit01, .c-tit01 { font-size: 24px; }
}
@media all and (max-width: 699px) {
	h3.c-tit01, .c-tit01 { margin-bottom: 25px; }
	h4.c-tit02, .c-tit02 { font-size: 20px; margin-bottom: 25px; }
	h5.c-tit03, .c-tit03 { font-size: 17px; margin-bottom: 25px; }
}

/* ==============================================
   03. List Style
   ============================================== */

/* 베이스 */
[class^=c-list0] {text-align:left}
[class^=c-list0] >li {position:relative;color:#5E5E5E;/* margin-bottom:15px; */line-height:1.412}
[class^=c-list0] >li:last-child {margin-bottom:0}
[class^=c-list0] >li:before {content:"";display:block;position:absolute;left:0}
[class^=c-list0] > li ul:not([class^=c-list]) {padding:5px 0 1px 1px}
[class^=c-list0] > li ul:not([class^=c-list]) li {position:relative;margin-top:10px;padding-left:24px;color:#5B5B5B;font-size:.9441em;line-height:1.25}
[class^=c-list0] > li ul:not([class^=c-list]) li:first-child {margin-top:0}
[class^=c-list0] > li ul:not([class^=c-list]) li:before {content:"";display:block;position:absolute;left:11px;top:10px;background:#AFAFAF;width:7px;height:1px}
[class^=c-list0] > li ul li ul li{position:relative;font-size:1em}
[class^=c-list0] > li .tit,
[class^=c-list0] > li .tit-in {display:block;color:#2E2E2E;font-weight:700;margin-right:4px}
[class^=c-list0] > li .tit-in {display:inline-block}
[class^=c-list0] > li .txt {display:inline-block}
[class^=c-list0] + p,
p + [class^=c-list0] {margin-top:20px}


.c-list01, .c-list02, .c-list03, .c-list04, .c-list04-1, .c-list05 { text-align: left; }
.c-list01 > li,
.c-list02 > li,
.c-list01-li,
.c-list02-li {	position: relative;	padding: 0 0 0 15px;	/* margin: 9px 0 0; */	line-height: 1.6;	font-size: .944em;	letter-spacing: 0; }
.c-list01 > li:first-child,
.c-list02 > li:first-child { margin: 0; }

.c-list01 > li::before,
.c-list01-li::before {content: '';display: block;position: absolute;top: 11px;left: 0;width: 3px;height: 3px;background: #000;border-radius: 100%;}

/* ul > ul 공통 */
.c-list01 > li ul,
.c-list02 > li ul {margin: 4px 0;}

.c-list01 > li ul li,
.c-list02 > li ul li {position: relative;font-size: 18px;color: #444;line-height: 1.6;/* margin: 0 0 5px; */}

.c-list01 > li ul li:last-child,
.c-list02 > li ul li:last-child {margin: 0;}

.c-list01 > li .tit {display: inline-block;color: #222;font-weight: 700;font-size: 18px;line-height: 1.6;}
.c-list01 > li ul li .tit::after { top: 0; }
.c-list01 > li .txt { display: inline-block; }

.c-list02 > li,
.c-list02-li {position: relative;padding: 4px 0 4px 28px;font-size: 18px;line-height: 1.6;font-weight: 400;color: #444;}
.c-list02 > li .tit {color: #222;position: absolute;top: 3px;left: 0;font-weight: 400;text-align: center;font-size: 18px;line-height: 1.6;}
.c-list02 > li .tit.num {	font-family: 'Pretendard', sans-serif;	text-align: left;	top: 5px;	letter-spacing: 0;}
.c-list02 > li .tit::after,
.c-list02-li .tit::after { content: '.'; display: inline-block; }
.c-list02 > li .titStr {display: block;color: #222;font-weight: 700;line-height: 1.6;font-size: 18px;}
.c-list02 > li .tit.num2::after { display : none;}

@media all and (max-width: 999px) {
	.c-list01 > li::before,
	.c-list01-li::before { top: 10px; }

	.c-list01 > li ul li,
	.c-list02 > li ul li { font-size: 16px; }

	.c-list01 > li .tit { font-size: 16px; }
	.c-list02 > li,
	.c-list02-li { font-size: 16px; }
	.c-list02 > li .tit { font-size: 16px; }
	.c-list02 > li .titStr { font-size: 16px; }
}

@media all and (max-width: 768px) {
	.c-list01 > li::before,
	.c-list01-li::before { top: 9px; }

	.c-list01 > li ul li,
	.c-list02 > li ul li { font-size: 15px; }

	.c-list01 > li .tit { font-size: 15px; }
	.c-list02 > li,
	.c-list02-li { font-size: 15px; padding-left: 22px; }
	.c-list02 > li .tit { font-size: 15px; }
	.c-list02 > li .titStr { font-size: 15px; }
}


/* ==============================================
   04. Table Style
   ============================================== */

/* 반응형 래퍼 */
.is-wauto-box { position: relative; width: 100%; overflow-x: auto; }
.is-wauto-box > table { min-width: 720px; }
.rsv-info {display:block;position:relative;text-align:center}
.rsv-info .ico {display:block;position:relative;padding:15px 55px 28px;line-height:1.3;font-size:.889em}
.rsv-info .ico:before,
.rsv-info .ico:after {content:"";display:block;position:absolute;width:47px;height:10px;top:18px;background:url(/resources/_Img/Common/style_spr.png) no-repeat}
.rsv-info .ico:before {left:0;background-position:-263px -20px}
.rsv-info .ico:after {right:0;background-position:-320px -20px}
@media all and (max-width:499px) {
	.rsv-info .ico {padding:10px 55px}
	.rsv-info .ico:before,
	.rsv-info .ico:after {top:11px}
}

.tbl-type01 {position: relative;border-collapse: collapse;border-spacing: 0;table-layout: fixed;width: 100%;text-align: center;border-top: 2px solid #222;font-size: 1em;}
.tbl-type01 thead th { color: #000;}
.tbl-type01 thead th,
.tbl-type01 tbody th,
.tbl-type01 tfoot th {font-weight: 700;}
.tbl-type01 tbody th {color: #000;}
.tbl-type01 tfoot th {color: #000; }
.tbl-type01 tfoot th, .tbl-type01 tfoot td { background : #F9F9F9; }
.tbl-type01 thead th,
.tbl-type01 tbody th,
.tbl-type01 tbody td,
.tbl-type01 tfoot th,
.tbl-type01 tfoot td {border-bottom: 1px solid #DFE0E1;border-left: 1px solid #DFE0E1;border-right: 1px solid #DFE0E1;overflow: hidden;}
.tbl-type01 thead th,
.tbl-type01 tfoot th,
.tbl-type01 tfoot td { padding: 16px 10px; }
.tbl-type01 tbody th,
.tbl-type01 tbody td { padding: 14px 10px; }
.tbl-type01 th:first-child,
.tbl-type01 td:first-child { border-left: 0; }
.tbl-type01 th:last-child,
.tbl-type01 td:last-child { border-right: 0; }
.tbl-type01 .bor1 { border-right: 1px solid #ddd; }
.tbl-type01 .bol1 { border-left: 1px solid #ddd; }

.tbl-type01 table {	border-collapse: collapse;	table-layout: fixed;	width: 100%;	text-align: center;	font-size: .9em;	border-top: 1px solid #555; }
.tbl-type01 table thead th { color: #555; background: transparent; }
.tbl-type01 table th,
.tbl-type01 table td {	border-left: 1px solid #ddd;	border-bottom: 1px solid #ddd;	word-wrap: break-word;	word-break: break-all; }
.tbl-type01 table thead th { padding: 8px 5px; }
.tbl-type01 table tbody th,
.tbl-type01 table tbody td,
.tbl-type01 table tfoot th,
.tbl-type01 table tfoot td { color: #777; font-size: .95em; padding: 9px 5px; }

.tbl-type01.hasColRowThead thead th { border-left: 1px solid #ddd; }
.tbl-type01.hasColRowThead thead th:first-child { border-left: 0; }

.tbl-type-s01 {	position: relative;	border-collapse: collapse;	border-spacing: 0;	table-layout: fixed;	width: 100%;	text-align: center;	border-top: 1px solid #555;	font-size: .9em; }
.tbl-type-s01 thead th { background: #F5F5F5; color: #444; }
.tbl-type-s01 thead th,
.tbl-type-s01 tbody th,
.tbl-type-s01 tfoot th { font-weight: 500; }
.tbl-type-s01 tbody th { color: #444; }
.tbl-type-s01 thead th,
.tbl-type-s01 tbody th,
.tbl-type-s01 tbody td,
.tbl-type-s01 tfoot th,
.tbl-type-s01 tfoot td {	border-bottom: 1px solid #ddd;	border-left: 1px solid #ddd;	border-right: 1px solid #ddd;	overflow: hidden; }
.tbl-type-s01 thead th,
.tbl-type-s01 tfoot th,
.tbl-type-s01 tfoot td { padding: 12px 10px; }
.tbl-type-s01 tbody th,
.tbl-type-s01 tbody td { padding: 10px; }
.tbl-type-s01 th:first-child,
.tbl-type-s01 td:first-child { border-left: 0; }
.tbl-type-s01 th:last-child,
.tbl-type-s01 td:last-child { border-right: 0; }
.tbl-type-s01 .bor1 { border-right: 1px solid #ddd; }
.tbl-type-s01 .bol1 { border-left: 1px solid #ddd; }

@media all and (max-width: 999px) {
	.tbl-type01 thead th,
	.tbl-type01 tfoot th,
	.tbl-type01 tfoot td { padding: 10px 6px; }
	.tbl-type01 tbody th,
	.tbl-type01 tbody td { padding: 8px 6px; }
}

/* ==============================================
   05. Info Style
   ============================================== */
/* --- info-box2 --- */
.info-box1 {box-sizing: border-box;position: relative;padding: 20px 24px;border: 1px solid #ddd;border-radius: 20px;background: #fff;display: flex;gap: 15px;}
.info-box1::before { z-index: 0; width: 4px; height: 100%; background: #FF6200; }
.info-box1::after  { z-index: -1; width: 100%; height: 1px; background: #e0e0e0; }
.info-box1 .pTit {box-sizing: border-box;padding: 4px 18px 4px 45px;line-height: 1.2;font-weight: 700;color: #222;max-width: 150px;position: relative;font-size: 1.05em;}
.info-box1 .pTit::before,
.info-box1 .pTit::after { content: ''; display: block; position: absolute; }
.info-box1 .pTit::before {width: 30px;height: 30px;left: 0;top: 0;background: url(/resources/_Img/Common/style_spr-n.png) no-repeat 0 0;}
.info-box1 .pTit::after {width: 1px;height: 20px;right: 0;top: 5px;background: #d2d2d2;}
.info-box1 .pTxt > * { margin: 0 0 12px; }
.info-box1 .pTxt > *:last-child { margin: 0; }
.info-box1 .pTxt p {font-size: 1.05em;color: #444;}
.info-box1.ico2 .pTit::before { background-position: -190px -60px; }
.info-box1.ico3 .pTit::before { background-position: -230px -60px; }

@media all and (max-width: 460px) {
	.info-box1 {padding : 15px 19px;gap: 10px;}
	.info-box1 .pTit {padding: 3px 13px 3px 29px;}
	.info-box1 .pTit::before {background-position: -187px -46px;width: 20px;height: 20px;top: 2px;}
	.info-box1 .pTit::after {height: 15px;}
}
@media all and (max-width: 415px) {
	.info-box1 { display : block; }
	.info-box1 .pTit::after { display : none;}
	.info-box1 .pTxt { padding-top : 10px; }
}

/* --- info-ex01 / 02 / 03 --- */
.info-ex01,
.info-ex02,
.info-ex03 {display: block;position: relative;line-height: 1.6;padding: 0px 0 0px 25px;margin-top: 10px;font-size: .95em; text-align: left; font-family: "Pretendard Variable", Pretendard, "Noto Sans KR", "맑은고딕", "돋움", arial, Dotum, Verdana, helvetica, clean, sans-serif !important;}

.info-ex01 { color: #4A5169; }
.info-ex02 { color: #036BE0; }
.info-ex03 { color: #EB5757; }

.info-ex01.inline,
.info-ex02.inline,
.info-ex03.inline { display: inline-block; }
.info-ex01::before,
.info-ex02::before,
.info-ex03::before {content: '';display: block;position: absolute;left: 0;top: 4px;width: 20px;height: 20px;background: url(/resources/_Img/Common/style_spr-n.png) no-repeat;}
.info-ex01::before { background-position: -45px 0; }
.info-ex02::before {background-position: -80px 0;}
.info-ex03::before {background-position: -115px 0;}

.info-fex01,
.info-fex02,
.info-fex03 {display: block;position: relative;line-height: 1.2;padding: 0px 0 0px 20px;margin-top: 10px;font-size: .88em; text-align: left; font-weight: 400; }

.info-fex01 { color: #4A5169; }
.info-fex02 { color: #0EA063; }
.info-fex03 { color: #EB5757; }

.info-fex01.inline,
.info-fex02.inline,
.info-fex03.inline { display: inline-block; }
.info-fex01::before,
.info-fex02::before,
.info-fex03::before {content: '';display: block;position: absolute;left: 0;top: 1px;width: 14px;height: 14px;background: url(/resources/_Img/Common/style_spr-n.png) no-repeat;}
.info-fex01::before {background-position: -150px 0;}
.info-fex02::before {background-position: -179px 0;}
.info-fex03::before {background-position: -208px 0;}

/* --- info-list --- */
.info-list {	position: relative;	padding: 4px 0 5px 50px; }
.info-list::before {	content: '';	display: block;	position: absolute;	left: 0; top: 3px;	width: 38px; height: 38px;	background: url(/resources/_Img/Common/style_spr.png) no-repeat 0 -60px; }
.info-list .pTit { display: block; color: #222; font-weight: 600; margin: 0 0 6px; }
.info-list ul li {	display: block;	position: relative;	font-size: .944em;	margin: 0 0 5px;	padding: 0 0 0 12px;	line-height: 1.6;	letter-spacing: 0;}
.info-list ul li::before {	content: '';	display: block;	position: absolute;	width: 3px; height: 3px;	background: #FF6200;	left: 0; top: 11px;	border-radius: 50%; }
.info-list ul li:last-child { margin: 0; }
.info-list.ico1::before { background-position: 0 -60px; }
.info-list.ico2::before { background-position: -50px -60px; }
.info-list.ico3::before { background-position: -100px -60px; }

/* ==============================================
   06. Button
   ============================================== */
/* 공통 hover/focus */
.sw-btn:hover, .sg-btn:hover, .sp-btn:hover, .sdp-btn:hover,
.bw-btn:hover, .bg-btn:hover, .bp-btn:hover, .bdp-btn:hover,
.lw-btn:hover, .lg-btn:hover, .lp-btn:hover, .ldp-btn:hover,
.sw-btn:focus, .sg-btn:focus, .sp-btn:focus, .sdp-btn:focus,
.bw-btn:focus, .bg-btn:focus, .bp-btn:focus, .bdp-btn:focus,
.lw-btn:focus, .lg-btn:focus, .lp-btn:focus, .ldp-btn:focus,
.cw-btn:hover, .cg-btn:hover, .cp-btn:hover, .cdp-btn:hover,
.cw-btn:focus, .cg-btn:focus, .cp-btn:focus, .cdp-btn:focus { text-decoration: none; }

.nw-btn {	display: inline-block;	color: #036BE0 !important;	transition: all .3s ease;}
.nw-btn::after {	content: '';	display: inline-block;	width: 12px; height: 12px;	background: url(/resources/_Img/Common/nwin_spr.png) no-repeat -22px -25px;	margin: -2px 0 0 5px;	vertical-align: middle; }
.nw-btn span {	position: relative; padding: 0 3px 2px; transition: all .3s ease; }
.nw-btn span::after {	content: '';	display: block;	position: absolute;	width: 100%; height: 1px;	background: #036BE0;	left: 0; bottom: 0;	z-index: -1;	transition: all .3s ease; }
.nw-btn:focus span,
.nw-btn:hover span { color: #fff; }
.nw-btn:focus span::after,
.nw-btn:hover span::after { height: 100%; border-radius: 3px; }

/* sw / sg / sp / sdp — 작은 컨텐츠 버튼  */
.sw-btn, .sg-btn, .sp-btn, .sdp-btn {display: inline-block;position: relative;font-size: 15px;font-weight: 500;vertical-align: top;min-width: 93px;box-sizing: border-box;text-align: center;border-radius: 5px;transition: all .25s ease;}

.sw-btn, a.sw-btn {background: #fff;border: 1px solid #d1d1d1;color: #444 ;}
.sw-btn span, .sg-btn span, .sp-btn span, .sdp-btn span {display: block;padding: 6px 5px; line-height: 1.8;letter-spacing: -0.03em;position: relative;}
.sw-btn.icon span, .sg-btn.icon span, .sp-btn.icon span, .sdp-btn.icon span {padding: 6px 35px 6px 15px;}
.sw-btn.icon span::before, .sg-btn.icon span::before, .sdp-btn.icon span::before {content : "";right: 10px;top: 9px;position: absolute;width: 20px;height: 20px;background: url(/resources/_Img/Common/style_spr-n.png) no-repeat 0px -46px;}
.sp-btn.icon span::before {content : "";right: 10px;top: 9px;position: absolute;width: 20px;height: 20px;background: url(/resources/_Img/Common/style_spr-n.png) no-repeat -35px -46px;}

input.sw-btn, input.sg-btn, input.sp-btn, input.sdp-btn,
button.sw-btn, button.sg-btn, button.sp-btn, button.sdp-btn {	padding: 0 8px;	height: 44px;	cursor: pointer; }

.sw-btn.single, .sg-btn.single, .sp-btn.single, .sdp-btn.single {width: 60px;height: 60px;min-width: 0;font-size: 0;}
.sw-btn.single span, .sg-btn.single span, .sp-btn.single span, .sdp-btn.single span {	display: block;	position: absolute;	padding: 0;	width: 20px; height: 20px;	top: 0; right: 0; bottom: 0; left: 0;	margin: auto;	font-size: 0;	background: url(/resources/_Img/Common/style_spr.png) no-repeat; }
.sw-btn.single .arr, .sg-btn.single .arr   { background-position: 0 0; }
.sw-btn.single .plus, .sg-btn.single .plus { background-position: -30px 0; }
.sw-btn.single .nw, .sg-btn.single .nw     { background-position: -60px 0; }
.sw-btn.single .zoom, .sg-btn.single .zoom { background-position: -90px 0; }
.sw-btn.single .down, .sg-btn.single .down { background-position: -120px 0; }
.sw-btn.single .calendar, .sg-btn.single .calendar { background-position: -150px 0; }
.sw-btn.single .delete, .sg-btn.single .delete { background-position: -180px 0; }
.sp-btn.single .arr, .sdp-btn.single .arr   { background-position: 0 -30px; }
.sp-btn.single .plus, .sdp-btn.single .plus { background-position: -30px -30px; }
.sp-btn.single .nw, .sdp-btn.single .nw     { background-position: -60px -30px; }
.sp-btn.single .zoom, .sdp-btn.single .zoom { background-position: -90px -30px; }
.sp-btn.single .down, .sdp-btn.single .down { background-position: -120px -30px; }
.sp-btn.single .calendar, .sdp-btn.single .calendar { background-position: -150px -30px; }
.sp-btn.single .delete, .sdp-btn.single .delete { background-position: -180px -30px; }

.sw-btn.single span::before { display : none; }
.sw-btn.single .pri { background: url(/resources/_Img/Common/style_spr-n.png) no-repeat 0px -46px; }
.sw-btn.single { border :none; }
.sw-btn.single:hover { background : #fff;}

.sw-btn:hover, .sw-btn:focus { border-color: #036BE0; background : #036BE0; color : #fff;  }
.sw-btn:hover span::before , .sw-btn:focus span::before  { background-position : -35px -46px; }

.sw-btn.hover { border-color: #036BE0; background : #036BE0; color : #fff; }
.sw-btn.hover span::before { background-position : -35px -46px; }

.sg-btn, a.sg-btn { background:#F5F5F5; border: 1px solid #ccc; color: #444 ; }
.sg-btn:hover, .sg-btn:focus { border-color: #C0C0C0; background : #E3E3E3; }
.sg-btn.hover { border-color: #C0C0C0; background : #E3E3E3; }

.sp-btn, a.sp-btn { background: #036BE0; border: 1px solid #036BE0; color: #fff ; }
.sp-btn:hover, .sp-btn:focus { background: #0051AD; border-color: #0051AD; }
.sp-btn.hover { background: #0051AD; border-color: #0051AD; }

.sdp-btn, a.sdp-btn { background: #222222; border: 1px solid #222222; color: #fff ; }
.sdp-btn:hover, .sdp-btn:focus { background: #111; border-color: #111; }




/*  cw / cg / cp / cdp — 컨텐츠 버튼 */
.cw-btn, .cg-btn, .cp-btn, .cdp-btn {position: relative;display: inline-block;vertical-align: top;line-height: 1.1;box-sizing: border-box;min-width: 120px;/* max-width: 120px; */font-size: 15px;font-weight: 500; text-align: center;border-radius: 5px;transition: all .25s ease;}

a.cw-btn span, a.cg-btn span,
a.cp-btn span, a.cdp-btn span {padding: 8px 26px; display: inline-block;line-height: 1.8;box-sizing: border-box;vertical-align: middle;font-size: 16px;font-weight: 500;position: relative;}

a.cw-btn.icon span, a.cg-btn.icon span,
a.cp-btn.icon span, a.cdp-btn.icon span {padding: 8px 40px 8px 26px;}

input.cw-btn, button.cw-btn,
input.cg-btn, button.cg-btn,
input.cp-btn, button.cp-btn,
input.cdp-btn, button.cdp-btn {	padding: 0 20px;	height: 44px;	cursor: pointer;}

/* 아이콘 */
.cw-btn.icon span::after, .cg-btn.icon span::after {width: 24px;height: 24px;position: absolute;right: 7px;top: 11px;content: "";display: block;background: url(/resources/_Img/Common/style_spr-n.png) no-repeat -109px -46px;}
.cp-btn.icon span::after {width: 24px;height: 24px;position: absolute;right: 7px;top: 11px;content: "";display: block;background: url(/resources/_Img/Common/style_spr-n.png) no-repeat -148px -46px;}
.cw-btn .arr::after, .cg-btn .arr::after   { background-position: 0 0; }
.cw-btn .plus::after, .cg-btn .plus::after { background-position: -30px 0; }
.cw-btn .nw::after, .cg-btn .nw::after     { background-position: -60px 0; }
.cw-btn .zoom::after, .cg-btn .zoom::after { background-position: -90px 0; }
.cw-btn .down::after, .cg-btn .down::after { background-position: -120px 0; }
.cw-btn .calendar::after, .cg-btn .calendar::after { background-position: -150px 0; }
.cw-btn .delete::after, .cg-btn .delete::after { background-position: -180px 0; }
.cp-btn .arr::after, .cdp-btn .arr::after   { background-position: 0 -30px; }
.cp-btn .plus::after, .cdp-btn .plus::after { background-position: -30px -30px; }
.cp-btn .nw::after, .cdp-btn .nw::after     { background-position: -60px -30px; }
.cp-btn .zoom::after, .cdp-btn .zoom::after { background-position: -90px -30px; }
.cp-btn .down::after, .cdp-btn .down::after { background-position: -120px -30px; }
.cp-btn .calendar::after, .cdp-btn .calendar::after { background-position: -150px -30px; }
.cp-btn .delete::after, .cdp-btn .delete::after { background-position: -180px -30px; }

.cw-btn, a.cw-btn   { background: #fff; border: 1px solid #D1D1D1; color: #444 ; }
.cw-btn:hover, .cw-btn:focus { border-color: #036BE0; background : #036BE0; color: #fff ; }
.cw-btn.hover { border-color: #036BE0; background : #036BE0; color: #fff ; }
.cw-btn.hover span::after {background-position: -148px -46px;}
.cw-btn:hover span::after {background-position: -148px -46px;}

.cg-btn, a.cg-btn   { background: #EDEDED;  color: #222 ; border : 1px solid #EDEDED; }
.cg-btn:hover, .cg-btn:focus { background: #E3E3E3; border-color : #EDEDED; }
.cg-btn.hover { background: #E3E3E3; }

.cp-btn, a.cp-btn   { background: #036BE0; border: 1px solid #036BE0; color: #fff ; }
.cp-btn:hover, .cp-btn:focus { background: #0051AD; border-color: #0051AD; }
.cp-btn.hover { background: #0051AD; border-color: #0051AD; }

.cw-btn.single { border : none; min-width : 0; width : 24px; height : 24px; font-size: 0;padding: 0;}
.cw-btn.single:hover { background : #fff; }
.cw-btn.single span::before, .cw-btn.single span::after { display : none; }
.cw-btn.single span {	display: block;	position: absolute;	padding: 0;	width: 20px; height: 20px;	top: 0; right: 0; bottom: 0; left: 0;	margin: auto;	font-size: 0;	background: url(/resources/_Img/Common/style_spr-n.png) no-repeat; }
.cw-btn.single span.down {background-position: -72px -48px;}
.cw-btn.single span.arr {background-position: -111px -48px;}

/* bw / bg / bp / bdp — 프로그램 버튼 */
.bw-btn, .bg-btn, .bp-btn, .bdp-btn {position: relative;display: inline-block;vertical-align: top;box-sizing: border-box;min-width: 150px;max-width: 300px;font-size: 0;text-align: center;border-radius: 5px;transition: all .25s ease; font-family: "Pretendard Variable", Pretendard, sans-serif;}

.bw-btn span, .bg-btn span,
.bp-btn span, .bdp-btn span,
a.bw-btn span, a.bg-btn span,
a.bp-btn span, a.bdp-btn span {padding: 9px 25px;display: inline-block;line-height: 1.8;vertical-align: middle;font-size: 18px;font-weight: 600;}
input.bw-btn, input.bg-btn, input.bp-btn, input.bdp-btn,
button.bw-btn, button.bg-btn, button.bp-btn, button.bdp-btn {	padding: 0 10px;	height: 60px;	cursor: pointer;font-size: 18px;font-weight: 600; line-height: 1.8;}
.bw-btn, a.bw-btn   {background: #fff;border: 1px solid #D1D1D1;color: #444 ;}
.bw-btn:hover, .bw-btn:focus { border-color: #036BE0; background : #036BE0; color : #fff; }
.bw-btn.hover{  border-color: #036BE0; background : #036BE0; color : #fff; }

.bg-btn, a.bg-btn   {background: #EDEDED;border: 1px solid #EDEDED;color: #444;}
.bg-btn:hover, .bg-btn:focus { border-color: #E3E3E3; background : #E3E3E3;  }
.bg-btn.hover{ border-color: #E3E3E3; background : #E3E3E3;  }

.bp-btn, a.bp-btn   { background: #036BE0; border: 1px solid #036BE0; color: #fff ; }
.bp-btn:hover, .bp-btn:focus { background: #0051AD; border-color: #0051AD; }
.bp-btn.hover{ background: #0051AD; border-color: #0051AD; }

.bdp-btn, a.bdp-btn { background: #222222; border: 1px solid #222222; color: #fff; }
.bdp-btn:hover, .bdp-btn:focus { background: #111; border-color: #111; }

/* lw / lg / lp / ldp — 회원 버튼 (large) */
.lw-btn, .lg-btn, .lp-btn, .ldp-btn {	position: relative;	display: inline-block;	vertical-align: top;	box-sizing: border-box;	min-width: 180px;	max-width: 320px;	padding: 0 8px;	font-size: 0;	text-align: center;	border-radius: 4px;	transition: all .25s ease; }
a.lw-btn::before, a.lg-btn::before,
a.lp-btn::before, a.ldp-btn::before {	content: '';	display: inline-block;	width: 0; height: 62px;	vertical-align: middle; }
a.lw-btn span, a.lg-btn span,
a.lp-btn span, a.ldp-btn span {	display: inline-block;	line-height: 1.3;	vertical-align: middle;	font-size: 17px;	font-weight: 500; }
input.lw-btn, input.lg-btn, input.lp-btn, input.ldp-btn,
button.lw-btn, button.lg-btn, button.lp-btn, button.ldp-btn {	padding: 0 10px;	height: 62px;	cursor: pointer; font-size: 17px;	font-weight: 500; }
.lw-btn, a.lw-btn   { background: #fff; border: 1px solid #ccc; color: #444 !important; font-family: "Pretendard Variable", Pretendard, sans-serif; }
.lw-btn:hover, .lw-btn:focus { border-color: #036BE0; }
.lg-btn, a.lg-btn   { background: #F5F5F5; border: 1px solid #ccc; color: #444 !important; }
.lg-btn:hover, .lg-btn:focus { border-color: #036BE0; }
.lp-btn, a.lp-btn   { background: #036BE0; border: 1px solid #036BE0; color: #fff !important; }
.lp-btn:hover, .lp-btn:focus { background: #0254b8; border-color: #0254b8; }
.ldp-btn, a.ldp-btn { background: #222222; border: 1px solid #222222; color: #fff !important; }
.ldp-btn:hover, .ldp-btn:focus { background: #111; border-color: #111; }

/* 상태값 */
/* .stateLet0 {font-size : 15px;font-weight : 600;letter-spacing : -0.03em;color: #4F4F4F;background : #D9D9D9; border-radius : 20px;padding: 4px 13px;}
.state01 { color : #16AA00 ; background : rgba(22, 170, 0, 0.2) ;  }
.state02 { color : #0EA2A4 ; background : rgba(14, 162, 164, 0.2) ; }
.state03 { color : #036BE0 ; background : rgba(3, 107, 224, 0.2) ; }
.state04 { color : #E54B82 ; background : rgba(229, 75, 130, 0.2) ; }
.state05 { color : #A745B7 ; background : rgba(167, 69, 183, 0.2) ; }
.state06 { color : #FF6F1C ; background : rgba(255, 111, 28, 0.2) ; }
.state07 { color : #E62828 ; background : rgba(211, 81, 81, 0.2) ; }
.state08 { color : #676767 ; background : rgba(103, 103, 103, 0.2); }
.state09 { color : #FFFFFF ; background : #676767 ; }
.state10 { color : #FFFFFF ; background : #036BE0 ; }

.statusLet0 {font-size : 15px;font-weight : 600;letter-spacing : -0.03em !important;color: #4F4F4F;background : #EEEEEE;border-radius : 20px;padding: 4px 10px 4px 21px;position: relative;}
.statusLet0::before {content : "";width : 6px;height : 6px;position: absolute;left: 10px;top: 14px;border-radius: 100%;background: #4F4F4F;}
.status01 { color : #16AA00 ; background : #EAF9E8 ;  }
.status01::before { background : #16AA00 ; }
.status02 { color : #0EA2A4 ; background : #EBF8F9 ; }
.status02::before { background : #0EA2A4 ; }
.status03 { color : #036BE0 ; background : #ECF0F5 ; }
.status03::before { background : #036BE0 ; }
.status04 { color : #E54B82 ; background : #FFF2F6; }
.status04::before { background : #E54B82 ; }
.status05 { color : #A745B7 ; background : #F7EFF9 ; }
.status05::before { background : #A745B7 ; }
.status06 { color : #FF6F1C ; background : #FDEEE5 ; }
.status06::before { background : #FF6F1C ; }
.status07 { color : #E62828 ; background : #FFEDED ; }
.status07::before { background : #E62828 ; }
.status08 { color : #676767 ; background : #E3E5EA; }
.status08::before { background : #676767 ; }
.status09 { color : #FFFFFF ; background : #676767 ; }
.status09::before { background : #FFFFFF ; }
.status10 { color : #FFFFFF ; background : #036BE0 ; }
.status10::before { background : #FFFFFF ; } */

@media all and (max-width: 768px) {
	.sw-btn, .sg-btn, .sp-btn, .sdp-btn { min-width: 70px; }
	/* .sw-btn span, input.sw-btn, button.sw-btn,
	.sg-btn span, input.sg-btn, button.sg-btn,
	.sp-btn span, input.sp-btn, button.sp-btn, .sdp-btn span {font-size: 13px;} */

	.sw-btn.icon span::before, .sg-btn.icon span::before, .sdp-btn.icon span::before {top: 6px;}

	.cw-btn, .cg-btn, .cp-btn, .cdp-btn { min-width: 100px; }
	/* 	a.cw-btn span, input.cw-btn, button.cw-btn,
        a.cg-btn span, input.cg-btn, button.cg-btn,
        a.cp-btn span, input.cp-btn, button.cp-btn,
        a.cdp-btn span { font-size: 14px; } */
	.cw-btn span::after, .cg-btn span::after, .cp-btn span::after  {top: 8px;}

	.bw-btn, a.bw-btn,
	.bg-btn, a.bg-btn,
	.bp-btn, a.bp-btn {min-width: 140px;}
	a.bw-btn span, a.bg-btn span, a.bp-btn span, a.bdp-btn span {font-size: 16px;padding: 8px 22px;}

	.lw-btn, .lg-btn, .lp-btn, .ldp-btn { min-width: 130px; }
	a.lw-btn span, a.lg-btn span, a.lp-btn span, a.ldp-btn span { font-size: 16px; }


}

@media all and (max-width: 499px) {
	.sw-btn span, input.sw-btn, button.sw-btn,
	.sg-btn span, input.sg-btn, button.sg-btn,
	.sp-btn span, input.sp-btn, button.sp-btn, .sdp-btn span  { font-size: 14px; /* height: 44px; */ }
	.sw-btn.single, .sg-btn.single, .sp-btn.single, .sdp-btn.single { width: 44px; /* height: 44px; */ }

	a.cw-btn span, input.cw-btn, button.cw-btn,
	a.cg-btn span, input.cg-btn, button.cg-btn,
	a.cp-btn span, input.cp-btn, button.cp-btn,
	a.cdp-btn span  { font-size: 14px; }

	.bw-btn, a.bw-btn,
	.bg-btn, a.bg-btn,
	.bp-btn, a.bp-btn {min-width: 120px; height: 45px;}
	a.bw-btn span, a.bg-btn span, a.bp-btn span, a.bdp-btn span {font-size: 15px;padding: 7px 20px;}
	input.bw-btn, input.bg-btn, input.bp-btn, input.bdp-btn,
	button.bw-btn, button.bg-btn, button.bp-btn, button.bdp-btn { height: 45px; font-size: 15px; }

	.lw-btn, .lg-btn, .lp-btn, .ldp-btn { min-width: 110px; height: 45px; }
	a.lw-btn::before, a.lg-btn::before, a.lp-btn::before, a.ldp-btn::before { height: 45px; }
	a.lw-btn span, a.lg-btn span, a.lp-btn span, a.ldp-btn span { font-size: 15px; }

	input.lw-btn, input.lg-btn, input.lp-btn, input.ldp-btn,
	button.lw-btn, button.lg-btn, button.lp-btn, button.ldp-btn {height: 45px;font-size: 16px;}
}


/* ==============================================
   07. Form
   ============================================== */

/* 라디오 / 체크박스 */
.rdos {position:relative;line-height:1}
.rdos.inline {display:inline-block;vertical-align:top}
.rdos input[type="radio"] {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.rdos input[type="radio"] + label {display:inline-block;vertical-align:middle;position:relative;padding: 5px 0 5px 25px;cursor:pointer;user-select:none;line-height:1.2;margin-right:5px;font-size: .95em;text-align:left;transition:all .3s ease}
.rdos input[type="radio"] + label:before,
.rdos input[type="radio"] + label:after {content:'';position:absolute;box-sizing:border-box;border-radius:50%;transition:all .3s ease}
.rdos input[type="radio"] + label:before {left:0;top: 8px;margin:0;width: 15px;height: 15px;background: #ddd;border: 1px solid #999999;}
.rdos input[type="radio"] + label:after {width:15px;height:15px;left:0px;top:8px;background:#fff;border: 5px solid #036BE0;opacity:0;}


.rdos input[type="radio"] + label:focus,
.rdos input[type="radio"] + label:hover {color:#0061ba}
.rdos input[type="radio"] + label:focus:before,
.rdos input[type="radio"] + label:hover:before {border-color:#0061ba}
.rdos input[type="radio"]:checked + label:before {border-color:#01346b;background:#01346b}
.rdos input[type="radio"]:checked + label:after {opacity:1}
.chks {position:relative;line-height:1}
.chks.inline {display:inline-block;vertical-align:top}
.chks input[type="checkbox"] {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.chks input[type="checkbox"] + label {display:inline-block;vertical-align:middle;position:relative;padding:5px 0 5px 32px;cursor:pointer;user-select:none;line-height:1.2;margin-right:5px;font-size:.944em;text-align:left;transition:all .3s ease}
.chks input[type="checkbox"] + label:before,
.chks input[type="checkbox"] + label:after {content:'';display:block;position:absolute;box-sizing:border-box;transition:all .3s ease}
.chks input[type="checkbox"] + label:before {width:21px;height:21px;left:0;top:6px;margin:0;background:#fff;border:1px solid #ccc}
.chks input[type="checkbox"] + label:after {width:9px;height:6px;left:6px;top:12px;border:solid;border-width:0 0 2px 2px;border-color:transparent transparent #fff #fff;transform:rotate(-45deg);opacity:0}
.chks input[type="checkbox"] + label:focus,
.chks input[type="checkbox"] + label:hover {color:#0061ba}
.chks input[type="checkbox"] + label:focus:before,
.chks input[type="checkbox"] + label:hover:before {border-color:#0061ba}
.chks input[type="checkbox"]:checked + label:before {border-color: #036BE0;background: #036BE0;}
.chks input[type="checkbox"]:checked + label:after {opacity:1}

.chks { position: relative; line-height: 1; }
.chks.inline { display: inline-block; vertical-align: top; }
.chks input[type="checkbox"] {	position: absolute;	width: 1px; height: 1px;	padding: 0; margin: -1px;	overflow: hidden;	clip: rect(0,0,0,0);	border: 0; }
.chks input[type="checkbox"] + label {	display: inline-block;	vertical-align: middle;	position: relative;	padding: 5px 0 5px 25px;	cursor: pointer;	user-select: none;	line-height: 1.2;	margin-right: 5px;	font-size: .95em;	text-align: left;	transition: all .3s ease; }
.chks input[type="checkbox"] + label:before,
.chks input[type="checkbox"] + label:after {	content: '';	display: block;	position: absolute;	box-sizing: border-box;	transition: all .3s ease;}

.chks input[type="checkbox"] + label:before {width: 20px;height: 20px;left: 0;top: 5px;background: #ddd;border: 1px solid #999;border-radius: 5px;}
.chks input[type="checkbox"] + label:after {width: 9px;height: 5px;left: 6px;top: 11px;border: solid;border-width: 0px 0px 2px 2px;border-color: transparent transparent #fff #fff;transform: rotate(-45deg);opacity: 0;}
.chks input[id="chk3"] + label:after {top: 13px;left: 7px;}

.frm-input {height: 45px;padding: 10px 20px;border-radius: 5px;font-size: 17px;color: #444;background: #F1F1F1;box-sizing: border-box;outline: none;min-width: 160px;border: none;font-family: 'Pretendard', 'Apple SD Gothic Neo', sans-serif;}
.frm-input::placeholder { color: #444; }
.frm-input:focus { border-color: var(--main1); }
.frm-input[readonly] { color : #666; }

.select-wrap {position: relative;flex-shrink: 0;border: 1px solid #ccc;border-radius: 25px;display: flex; width: 200px;height: 45px;padding: 11px 20px;align-items: center;justify-content: space-between;gap: 20px;background: #fff;cursor: pointer; user-select: none; position: relative; box-sizing: border-box;}

.select-wrap select {appearance: none;-webkit-appearance: none;background: transparent;border: none;outline: none;font-size: 17px;color: #555;cursor: pointer; width: 100%;position: relative;z-index: 5;}

.select-wrap .arrow {position: absolute;width: 11px;right: 20px;height: 15px;z-index: 4;}
.select-wrap .arrow:before,
.select-wrap .arrow:after{transition: all 0.3s ease-in-out;content:"";width: 8px;height: 2px;background:#555;position : absolute;left:0;top: 50%;transform: translateY(-50%);}
.select-wrap .arrow:before {transform: rotate(45deg);left: 0px;}
.select-wrap .arrow:after {transform: rotate(-45deg);left: 5px;}

.select-wrap.open { border-color : #4A5169; }
.select-wrap.open .arrow:before {transform: rotate(-45deg);}
.select-wrap.open .arrow:after {transform: rotate(45deg);}

.select-wrap .selected-text { font-size: 17px; color: #555; white-space: nowrap; flex: 1; pointer-events: none; font-family: "Pretendard Variable" !important;}
.select-wrap.open .selected-text { color : #4A5169; }

/*  */
#frm_searchs .search-bar{ display:flex; align-items:center; justify-content:center; background:#f5f5f5; border:1px solid #D4D4D4; border-radius:10px; padding:15px 20px; gap:20px; margin-bottom:20px; }
#frm_searchs .search-label{ font-family:"Pretendard Variable", Pretendard, sans-serif !important; display:flex; align-items:center; gap:10px; font-size:17px; font-weight:700; color:#000; white-space:nowrap; flex-shrink:0; }
#frm_searchs .line{ width:1px; height:24px; background:#b1b1b1; }

#frm_searchs .select-wrap.open { border-color:#4A5169; }
#frm_searchs .l-box { display:flex; max-height:45px; }
#frm_searchs .input-wrap { padding:7px 20px; width:400px; background:#fff; border-radius:25px; border:1px solid transparent; transition:border-color 0.2s; box-sizing: border-box; }
#frm_searchs .input-wrap:focus-within { border-color:#036BE0; }
#frm_searchs .input-wrap input[type="text"] { width:100%; height:100%; border:none; outline:none; font-size:17px !important; color:#444 !important; background:transparent; padding:0; line-height:1.2; font-family:"Pretendard Variable", Pretendard, sans-serif !important; }
#frm_searchs .input-wrap input[type="text"]::placeholder { color:#767676 !important; opacity:1; font-size:inherit; }
#frm_searchs .search-btn { flex-shrink:0; width:45px; height:45px; border-radius:50%; background:#036BE0; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background 0.2s; }
#frm_searchs .search-btn:hover { background:#0051AD; }

@media(max-width:1024px) {
	#frm_searchs .input-wrap { width:300px; }
}

@media(max-width:768px) {
	#frm_searchs .search-bar { padding:12px 16px; gap:12px; border-radius:8px; }
	#frm_searchs .search-label { font-size:15px; gap:6px; }
	#frm_searchs .input-wrap { width:100%; padding:9px 14px; }
	#frm_searchs .input-wrap input[type="text"] { font-size:15px !important; }
	#frm_searchs .l-box { flex:1; max-height:40px; }
	#frm_searchs .search-btn { width:40px; height:40px; flex-shrink:0; }
}

@media(max-width:550px) {
	#frm_searchs .search-bar { flex-wrap:wrap; }
	#frm_searchs .l-box { flex-basis:100%; }
	#frm_searchs .input-wrap { flex:1; width:auto; }
}

@media(max-width:499px) {
	#frm_searchs .input-wrap input[type="text"] { font-size:13px !important; }
	#frm_searchs .input-wrap { padding:3px 12px; }
}

.custom-dropdown { display: block !important; opacity: 0; visibility: hidden;  transform: scaleY(0);  transform-origin: top center;  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s; position: absolute; top: 100%; left: 0; min-width: 100%; background: #fff; border: 1px solid #ccc; border-radius: 10px; list-style: none; margin: 0; z-index: 999; overflow: hidden;}
.select-wrap.open .custom-dropdown { opacity: 1; visibility: visible;  transform: scaleY(1);}
.custom-dropdown .dropdown-item { padding: 8px 20px; font-size: 17px; color: #333; cursor: pointer; transition: background 0.15s; white-space: nowrap; font-family: "Pretendard Variable", Pretendard, sans-serif !important;}
.custom-dropdown .dropdown-item:hover { background: #f0f5ff; color: #036BE0;}
.custom-dropdown .dropdown-item.active { background: #036BE0; color: #fff; }

@media all and (max-width: 999px) {
	.frm-input { font-size: 15px; height: 42px; padding: 8px 16px; min-width: 130px; }
}

@media all and (max-width: 768px) {
	.frm-input { font-size: 14px; height: 40px; padding: 8px 14px; width: 100%; min-width: 0; }

	.select-wrap {height: 40px; width: 160px;}
	.select-wrap .selected-text { font-size: 15px; }
	.select-wrap .arrow { right: 18px; }
	.custom-dropdown .dropdown-item { font-size: 14px; padding: 7px 14px; }

	.rdos input[type="radio"] + label {font-size: .9em;padding: 6px 0 6px 21px;}
	.rdos input[type="radio"] + label:before, .rdos input[type="radio"] + label:after {top: 7px;}

	.chks input[type="checkbox"] + label { font-size: .9em; }
	.chks input[type="checkbox"] + label:before { width : 18px; height : 18px; }
	.chks input[type="checkbox"] + label:after {top: 10px;left: 5px;}

	.custom-dropdown .dropdown-item { font-size: 15px; padding: 8px 14px; }
}

@media (max-width: 550px) {
	.select-wrap { width: 100%;}
}

@media all and (max-width: 499px) {
	.frm-input { font-size: 13px; height: 38px; }
	.select-wrap .selected-text { font-size: 13px; }
	.custom-dropdown .dropdown-item { font-size: 13px; padding: 6px 12px; }
	/* .select-wrap { height: 35px;} */
	.select-wrap .arrow { width: 9px; }
}


@media all and (max-width: 1200px) {
	.styleguide .main { padding: 60px 40px; }
	.styleguide .main h2,
	.styleguide .main span { font-size: 32px; }

	.sg-tit h2 { font-size: 44px; }

	.color-guide .row > p { min-width: 260px; font-size: 26px; }

	.typo-guide { max-width: 100%; }
	.typo-guide::before { display: none; }
	.typo-guide .row > .content .font-name { font-size: 32px; }
}

@media all and (max-width: 999px) {
	.styleguide .main { padding: 40px 28px; border-radius: 20px 20px 0 0; }
	.styleguide-line { transform: translateX(-40px); }

	.color-guide .row { flex-direction: column; gap: 10px; }
	.color-guide .row > p { min-width: 0; font-size: 22px; }
	.color-guide .cgrid.col5 { grid-template-columns: repeat(3, 1fr); }

	.typo-guide { gap: 40px; }
	.typo-guide .row { gap: 20px; }
	.typo-guide .row > .content .font-name { font-size: 28px; }
	.typo-guide .header-box { width: auto; }

	.List-guide { margin-left: 0; flex-direction: column; }
	.List-guide div { width: 100%; }

	.Info-guide { margin-left: 0; }
	.Info-guide .flex-box { flex-direction: column; width: 100%; }

	.Button-guide { margin-left: 0; }
	.Button-guide .flex-box { flex-wrap: wrap; }

	.Form-guide { margin-left: 0; }
	.Form-guide .box .m-tit { width: 140px; }
}

@media all and (max-width: 768px) {
	.styleguide .main { padding: 30px 20px; }

	.sg-tit h2 { font-size: 28px; }
	.styleguide-line { width: 100%; transform: none; margin: 40px 0; }

	.color-guide .cgrid.col4 { grid-template-columns: repeat(2, 1fr); }
	.color-guide .cgrid.col5 { grid-template-columns: repeat(2, 1fr); }
	.color-guide .cgrid.col3 { grid-template-columns: repeat(2, 1fr); }

	.typo-guide .row { flex-direction: column; gap: 12px; }
	.typo-guide .row > .content .font-name { font-size: 24px; }
	.typo-guide .row > .label { font-size: 16px; }

	.Form-guide .box { flex-direction: column; align-items: flex-start; }
	.Form-guide .box .m-tit { width: auto; margin-bottom: 8px; }
	.Form-guide .box .flex-box { width: 100%; }
}

@media all and (max-width: 499px) {
	.color-guide .cgrid.col2 { grid-template-columns: repeat(1, 1fr); }
	.color-guide .cgrid.col3 { grid-template-columns: repeat(1, 1fr); }
	.color-guide .cgrid.col4 { grid-template-columns: repeat(2, 1fr); }
	.color-guide .cgrid.col5 { grid-template-columns: repeat(2, 1fr); }

	.typo-guide .row > .content .font-name { font-size: 20px; }

	.Form-guide .box .flex-box {flex-direction: column;padding: 12px;gap: 10px;}
}

