:root {
  --mg4:0.4rem;
  --mg8:0.8rem;
  --mg10:1rem;
  --mg12:1.2rem;
  --mg18:1.8rem;
  --mg20:2rem;
  --mg24:2.4rem;
  --mg28:2.8rem;
  --mg32:3.2rem;
  --mg40:4rem;
  --mg48:4.8rem;
  --mg60:6rem;
  --mg80:8rem;
  --mg120:12rem;
  --Black:#000;
  --gray22:#222;
  --gray33:#333;
  --gray66:#666;
  --gray76:#767676;
  --gray99:#999;
  --graycc:#ccc;
  --graydf:#dfdfdf;
  --grayea:#eaeaea;
  --grayf3:#f3f3f3;
  --grayf8:#f8f8f8;
  --White:#fff;
  --PR_50:#0072F8;
  --PR_40:#4FA0FF;
  --PR_30:#93C4FF;
  --PR_20:#D8EAFF;
  --PR_10:#F4F9FF;
  --SC_50:#F90;
  --SC_40:#ffad33;
  --SC_30:#ffc266;
  --SC_20:#ffe0b2;
  --SC_10:#fff5e5;
  --Positive:#4CAF50;
  --Link:#0091EA;
  --Warning:#F9A825;
  --Negative:#D32F2F;
  --color-text:#000;
  --colog-bg:#000;
  --color-bg-accent:#FFE018;
  --size:clamp(10rem, 1rem + 40vmin, 30rem);
  --gap:calc(var(--size) / 14);
  --duration:60s;
  --scroll-start:0;
  --scroll-end:calc(-100% - var(--gap));
}

/* common */
/* 접근성을 위한 숨김 텍스트 (스크린 리더용) */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

[class^="bx-"] {width: 100%; border-radius: 2rem; padding: 3rem;}
.bx-gray {background: #F6F7FA;}
.bx-white {background: #ffffff;}
.bx-line {background: #ffffff; border: 1px solid #EFEFEF; border-radius: 0;}
.radius-2{border-radius: 2rem;}
[class^="bx-"] + [class^="bx-"] {margin-top: 2.5rem}

.d-flex > [class^="bx-"] + [class^="bx-"] {margin-top: 0}
.fc-white {color: #fff;}
.fc-black {color: #000;}
.fc-blue{color: #0C3381;}
.fc-3 {color: #333;}
.fc-6 {color: #666;}
.m-block {display: none;}
.pc-only {display: block;}
.d-flex{display: flex;}
.justify-between{justify-content: space-between;}
.align-center{align-items: center;}
.arrow-right{display: inline-block; margin-left: 1.4rem; width: 3rem; height: 1.5rem; background: url("../images/common/arrow_right_white.png") no-repeat center; background-size: contain;}
/* button */
.btn-white {width: 100%; height: 6.6rem; display: flex; align-items: center; justify-content: center; color: #343434; background: #fff; border-radius: 5rem; font-size: 3rem;}

/* form */
select, input:not([type="radio"]), input:not([type="checkbox"]), textarea {width: 100%; background: #333333; border: 1px solid #dfdfdf; border-radius: 10px; font-size: 1.4rem; padding: 1rem 1.5rem;}
select, input:not([type="radio"]), input:not([type="checkbox"]) {height: 4.4rem;}
select {-webkit-appearance: none; -moz-appearance: none;appearance: none; display: inline-block;width: 100%; padding: 0.8rem 3.1rem 1.4rem 1.5rem; background: #fff url("../images/common/arrow_down.svg") no-repeat 98% 50%;font-size: 1.6rem;font-weight: 400; line-height: 1.5;}
.ipt-group {margin-top: 2rem; display: flex;align-items: center;}
.ipt-group label {display: block; color: #202020; font-size: 1.5rem; width: 10.2rem; flex-shrink: 0; font-weight: 500;}
.ipt-group:has(textarea) {align-items: baseline;}

.ellipsis {overflow: hidden; white-space: nowrap; word-break: break-all; text-overflow: ellipsis; -o-text-overflow: ellipsis;}
.ellipsis-multiple-2 {overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word;}
.ellipsis-multiple-3 {overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; word-wrap:break-word;}
.ellipsis-multiple-7 {overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:7; -webkit-box-orient:vertical; word-wrap:break-word;}
.clearfix {zoom: 1;}
.clearfix:after {content: ""; display: block; clear: both;}
.hide {position: absolute; z-index: -10; width: 0; height: 0; line-height: 0; font-size: 0; text-indent: -9999px; display: none;}

/* Form Controls */
fieldset {border: 0;}
input:not([type="checkbox"]),input:not([type="radio"]),select,textarea {  font: inherit;color:inherit;background:#fff;border: 1px solid #dfdfdf; border-radius: 0.4rem;}
optgroup {font-weight: bold;}
button,input,select {overflow: visible;}
button,input,select,textarea {margin: 0;}
button,select {text-transform: none;} /* FireFox에서 변환 텍스트의 상속을 제거 */
select {outline: none;}
button,[type="button"],[type="reset"],[type="submit"] {cursor: pointer;} [disabled] {cursor: default;}
button,html[type="button"],[type="reset"],[type="submit"] {-webkit-appearance: button;}  /* 아이폰 input 디자인 변경가능 */
button::-moz-focus-inner,input::-moz-focus-inner {border: 0; padding: 0;} /* FireFox의 내부 테두리와 패딩을 제거 */
button:-moz-focusring,input:-moz-focusring {outline: 1px dotted ButtonText;}
input:focus {outline: none;}

textarea {min-height: 10em;}
[type="checkbox"],[type="radio"] {box-sizing: border-box; padding: 0;}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {height: auto; -webkit-appearance: none;
  margin: 0;}
[type="search"] {-webkit-appearance: textfield;}
[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}

/* space */
.T10 {padding-top: 10px;}
.T20 {padding-top: 20px;}
.T30 {padding-top: 30px;}
.T40 {padding-top: 40px;}
.T50 {padding-top: 50px;}

.R10 {padding-right: 10px;}
.R20 {padding-right: 20px;}
.R30 {padding-right: 30px;}
.R40 {padding-right: 40px;}
.R50 {padding-right: 50px;}

.B10 {padding-bottom: 10px;}
.B20 {padding-bottom: 20px;}
.B30 {padding-bottom: 30px;}
.B40 {padding-bottom: 40px;}
.B50 {padding-bottom: 50px;}

.L10 {padding-left: 10px;}
.L20 {padding-left: 20px;}
.L30 {padding-left: 30px;}
.L40 {padding-left: 40px;}
.L50 {padding-left: 50px;}

.mT0 {margin-top: 0 !important;}
.mT06 {margin-top: 6px !important;}
.mT10 {margin-top: 10px;}
.mT12 {margin-top: 12px !important;}
.mT20 {margin-top: 20px;}
.mT22 {margin-top: 22px !important;}
.mT30 {margin-top: 30px !important;}
.mT40 {margin-top: 40px !important;}
.mT50 {margin-top: 50px;}
.mT60 {margin-top: 60px !important;}

.mR10 {margin-right: 10px;}
.mR20 {margin-right: 20px;}
.mR30 {margin-right: 30px;}
.mR40 {margin-right: 40px;}
.mR50 {margin-right: 50px;}

.mB0 {margin-bottom: 0 !important;}
.mB10 {margin-bottom: 10px;}
.mB20 {margin-bottom: 20px;}
.mB30 {margin-bottom: 30px;}
.mB40 {margin-bottom: 40px;}
.mB50 {margin-bottom: 50px;}

.mL10 {margin-left: 10px;}
.mL20 {margin-left: 20px;}
.mL30 {margin-left: 30px;}
.mL40 {margin-left: 40px;}
.mL50 {margin-left: 50px;}
.hide{display: none; opacity: 0; visibility: hidden;}

.required {
  color: #F32828 !important;
  font-size: 1.6rem !important;
}
/*table*/
table{position: relative; border-bottom: 1px solid #C4C4C4;}
table::before{content: ''; display: block; width: 100%; height: 1px; background: #000; position: absolute; top: 0; left: 0;}
table thead th{background: #EEEEEE; line-height: 1; border-right: 1px solid #C4C4C4; font-weight: 400; padding: 1rem 0; border-bottom: 1px solid #C4C4C4;}
table tbody td{text-align: center; padding: 1.5rem 0;border-right: 1px solid #C4C4C4;}
table thead th:last-child,
table tbody td:last-child{border-right: none;}

.inner{max-width: 196rem; box-sizing: border-box; padding: 0 6rem; width: 100%;  margin: 0 auto;}

/* header */
header{ position: fixed; top: 0; left: 0; width: 100%; height: 8rem; box-sizing: border-box; background: #000; color: #fff;display: flex; align-items: center; justify-content: space-between; z-index: 999;}
header.on::before{content: ''; display: block; width: 100%; height: 22rem; background-color: #111111; position: absolute; top: 8rem; left: 0;}

header .logo{width: 11.4rem;}
header .gnb > ul{display: flex; text-align: center;}
header .gnb > ul > li{color: #fff; font-size: 2.2rem; font-weight: 600; line-height: 1; position: relative; width: 16rem; height: 8rem; display: flex; align-items: center; justify-content: center;}

header .gnb .sub-menu{position: absolute; display: none; top: 8rem; width: 100%; padding-top: 1.2rem;}
header .gnb .sub-menu li{font-size: 1.6rem; font-weight: 500; line-height: 3rem; display: flex; align-items: center; justify-content: center; color: rgba(255, 255, 255, 0.87);}
header .gnb .sub-menu li + li{margin-top: 1.6rem;}
header .gnb .sub-menu li a{display: inline-block; position: relative; overflow: hidden;}
header .gnb .sub-menu li a::before{content: ''; width: 100%; position: absolute; bottom: 0; left: -100%; background-color:#ED2024; height: 2px; transition: .3s; }
header .gnb .sub-menu li:hover a::before{left: 0;}
header.on .sub-menu{display: block;}

header .logo-black{display: none;}
header.fix{background: #f3f3f3;}
header .logo-black{display: none;}
header.fix .logo-white{display: none;}
header.fix .logo-black{display: block}
header.fix .gnb ul li{color: #333;}
#aside{display: none;}

/* footer */
footer{background: #131313; color: #fff;}
footer .inner{width: 100%; max-width: 196rem; margin: 0 auto; padding: 10rem 6rem; box-sizing: border-box;}
footer a{font-size: 2rem; font-weight: 500;}
footer .copy{font-size: 1.5rem; margin: 4rem 0;}
footer p{font-size: 1.6rem;line-height: 3.4rem;}
footer .ft_logo{width: 15.5rem;}
footer .ft_t3{gap: 2rem;}

/* 1920 */
@media (max-width:1920px) {
  header .gnb ul li{font-size: 2.2rem;}
}

@media (max-width:1024px) {
  /*common*/
  .m-block {display: block;}
  .pc-only {display: none;}

  header{height: 6.4rem;}
  header .logo{width: 10rem;}
  header .gnb{display: none;}
  header .menu-btn{width: 4rem; height: 4rem; -webkit-mask: url(../images/common/btn_menu.svg) no-repeat center; background-color: #fff;}
  #aside{display: block; position: fixed; width: 100%; height: 100%; top: 0; right: -100%; z-index: 999; background-color: #000; transition: .3s;}
  #aside.on{right: 0;}
  #aside .aside-top{width: 100%; height: 6.4rem; padding: 0 1.6rem; box-sizing: border-box;}
  #aside .aside-top .m-close{width: 4rem; height: 4rem; -webkit-mask: url(../images/common/btn_close.svg) no-repeat center; background-color: #fff;}
  #aside .aside-con{padding: 3.2rem 2rem;}
  #aside .menu-list > li .menu-list-li{cursor: pointer; border-bottom: 1px solid #555555; color: #666666; font-weight: 700; font-size: 2.4rem; line-height: 3.6rem; padding: 1.6rem 0; }
  #aside .menu-list > li.active p{color: #fff; border-bottom: 2px solid #ED2024; }
  #aside .menu-sub-list{padding: 2rem 0 3rem 0;border-bottom: 1px solid #555555; display: none;}
  #aside .menu-sub-list li{font-size: 2rem; line-height: 3rem; color: #fff;}
  #aside .menu-sub-list li + li{margin-top: 2rem;}
  #aside .menu-sub-list li:hover{color: #ED2024; font-weight: 700;}
  #aside .menu-list > li.active .menu-sub-list{display: block;}

  footer .inner{position: relative; padding: 6rem 4rem;}
  footer .right{position: absolute; top: 6rem; right: 4rem;}
  footer .ft_t3{flex-wrap: wrap; gap: 0 3rem; line-height: 3.4rem;}
}
@media (max-width:768px) {
  .inner{padding: 0 2rem;}

  /*footer*/
  footer{}
  footer .inner{flex-wrap: wrap;padding: 5rem 1.6rem;}
  footer a{font-size: 1.6rem;}
  footer .copy{margin: 3rem 0;}
  footer p,
  footer .ft_t3{font-size: 1.5rem; line-height: 2.6rem;}
  footer .ft_t3 span{display: block; width: 100%;}
  footer .right{position: relative; margin-top: 5rem; right: 0; top: unset;}
}