@CHARSET "UTF-8";



/***************************************************
■  공통
****************************************************/
.con{max-width:var(--content-width); margin:0 auto;}


/***************************************************
■  서브비주얼
****************************************************/
#wrap{--left_menu:clamp(15rem, 14.438rem + 2.813vw, 17.813rem); --content-gap:var(--gap-80); --content-bottom:clamp(5rem, 4.563rem + 2.188vw, 7.188rem); overflow: hidden;}

.sepration_wrap {width:100%;  height: clamp(8.75rem, 8.063rem + 3.438vw, 12.188rem); min-height: 10rem; position:relative; z-index: 10;}
.sepration_wrap #sepration {display: flex; align-items: center; justify-content: center; margin: 0 auto; padding:0 var(--side-padding); padding-left:calc(var(--side-padding) + clamp(15rem, 14.438rem + 2.813vw, 17.813rem));height:100%; max-width: var(--content-width);  }
.sepration_wrap .location ul{display:flex; gap:var(--gap-4)}
.sepration_wrap .location ul:before{content:""; display:block; flex-shrink: 0; width: var(--num-20); width: var(--num-20); background-color: #121212; forced-color-adjust: none; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(/images/krds/ico_bread_home.svg); mask-image: url(/images/krds/ico_bread_home.svg);}
.sepration_wrap .location ul li{display:flex; gap:var(--gap-4)}
.sepration_wrap .location ul li:before{content:"";    display: inline-flex; width: var(--num-20); height: var(--num-20); background-color: #121212; forced-color-adjust: none;  -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat;  mask-position: center center; mask-size: contain; -webkit-mask-image: url(/images/krds/ico_angle.svg); mask-image: url(/images/krds/ico_angle.svg); transform: rotate(-90deg); }

.h-tit-drop {position:relative;}
.h-tit-drop .h-tit{font-size: clamp(1.625rem, 1.223rem + 1.071vw, 2.188rem); font-weight: 700; text-align:center; margin-top:var(--num-24);  font-family: var(--ff-body);}
.h-tit-drop .drop-btn{display: none; align-items: center; justify-content: center;  flex-direction: row; gap: 1rem; width: 100%;}
.h-tit-drop .drop-btn:after{ content: "";   display: inline-flex; width: 2rem; height: 2rem; background-color: #232323; forced-color-adjust: none; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat;  mask-position: center center;  mask-size: contain; -webkit-mask-image: url(/resource/images/krds/ico_expand.svg);  mask-image: url(/images/default/content/ico_expand.svg);  transition: 0.4s ease-in-out; transform: rotate(90deg);}
.h-tit-drop .drop-btn:is(.on):after {transform: rotate(270deg);}
.h-tit-drop .drop-menu{display: none ;margin-top: 1rem; width: 120%;  max-width: 15rem; min-width: 13rem;  ;  transform: translateX(-50%);  position: absolute; top: 110%; left: 50%; z-index: 106;}
.h-tit-drop .drop-menu:after {content:"";position:absolute;bottom:100.6%;left:50%;transform:translateX(-50%);border-left:0.6rem solid transparent;border-right:0.6rem solid transparent;border-bottom:0.6rem solid var(--Brand-Color-susub);}
.h-tit-drop .drop-menu .drop-list { width: 100%;}
.h-tit-drop .drop-menu .left_menu_ul {box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px; border-radius: 0.8rem; background-color: #fff; overflow:hidden; }
.h-tit-drop .drop-menu .left_menu_ul > li:not(:first-child) {border-top:1px dashed #E7E7E7;}
.h-tit-drop .drop-menu .left_menu_ul > li.on {background:var(--Brand-Color-bg); border-radius: 0.375rem;}
.h-tit-drop .drop-menu .left_menu_ul > li:first-child.on {margin-top:0;}
.h-tit-drop .drop-menu .left_menu_ul > li > a {display: flex; align-items: center; justify-content: flex-start; flex-direction: row; width: 100%; gap: 0.5rem; padding: 0 1.25rem; font-size: var(--font-size-17); height: 2.5rem; background-color: #fff; z-index: 1; position: relative;}
.h-tit-drop .drop-menu .left_menu_ul > li.on > a{ background-color: var(--Brand-Color-susub); color:#fff; font-weight:600;}
.h-tit-drop .drop-menu .third_ul {padding: 0 1rem 1rem; background:#fff;}
.h-tit-drop .drop-menu .third_ul > li:not(:first-child) {margin-top:0.35rem;}
.h-tit-drop .drop-menu .third_ul > li > a {padding-left:1rem; color: #777; font-size: var(--font-size-16); position:relative;}
.h-tit-drop .drop-menu .third_ul > li > a:before {content:''; display:block; width:3px; height:3px; border-radius:100%; background:#ddd; position:absolute; top:0.45em; left:0.3rem;}
.h-tit-drop .drop-menu .third_ul > li > a:is(.blank) {display: flex; gap: 0.25rem;}
.h-tit-drop .drop-menu .third_ul > li > a:is(.blank):after {content: "\f090"; align-self: center; font-family: "remixicon"; display: inline-block; vertical-align: middle;}

.h-tit-drop .drop-menu .left_menu_ul > li.on .third_ul {padding:0.8rem 1rem; background:#EEF7FE;}
.h-tit-drop .drop-menu .left_menu_ul > li.on .third_ul > li.on > a {color: var(--Brand-Color-susub); font-weight: 600;}
.h-tit-drop .drop-menu .left_menu_ul > li.on .third_ul > li.on > a:before {background: var(--Brand-Color-susub)}


@media (max-width:1030px){
	.sepration_wrap{background-position:97% 0 !important; }
	.sepration_wrap #sepration {padding-left:var(--side-padding)}
	
	.h-tit-drop .h-tit {display:none;}
	.h-tit-drop .drop-btn {display:flex;}
}

@media (max-width:768px){
	#wrap .sepration_wrap .location ul:before {order:-2}
	#wrap .sepration_wrap .location ul:after {content: ""; display: inline-flex; width: var(--num-20); height: var(--num-20); background-color: #121212;  forced-color-adjust: none;  -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center;  mask-size: contain; -webkit-mask-image: url(/images/krds/ico_angle.svg); mask-image: url(/images/krds/ico_angle.svg); transform: rotate(-90deg); order:-1}
	#wrap .sepration_wrap .location ul li:not(.home):not(:last-child) {position: absolute !important;  width: 1px !important; height: 1px !important;  padding: 0 !important;   margin: -1px !important; overflow: hidden !important;  clip: rect(0, 0, 0, 0) !important;  white-space: nowrap !important;  border: 0 !important;}
	#wrap .sepration_wrap .location ul li:not(.home):last-child::after {content:''; display:block; flex-shrink: 0; width:1rem; height:1rem; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat;  mask-position: center center;  mask-size: contain; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23303336' fill-rule='evenodd' d='M4.4 12a1.2 1.2 0 1 1 2.4 0 1.2 1.2 0 0 1-2.4 0m6.4 0a1.2 1.2 0 1 1 2.4 0 1.2 1.2 0 0 1-2.4 0m7.6-1.2a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4' clip-rule='evenodd'/%3E%3C/svg%3E");  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23303336' fill-rule='evenodd' d='M4.4 12a1.2 1.2 0 1 1 2.4 0 1.2 1.2 0 0 1-2.4 0m6.4 0a1.2 1.2 0 1 1 2.4 0 1.2 1.2 0 0 1-2.4 0m7.6-1.2a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4' clip-rule='evenodd'/%3E%3C/svg%3E"); transform:rotate(180deg); background:#000;  order: -1;}
}


/***************************************************
■  컨텐츠 메뉴
****************************************************/
#sub_container{display:flex; gap:var(--content-gap); max-width:var(--content-width);  margin:0 auto; padding:0 var(--side-padding) var(--content-bottom);}
#sub_container .content_body{flex:1; padding:var(--num-70) 0 0}

/*레프트메뉴*/
#left_menu{width:var(--left_menu);  flex-shrink: 0; --tit-height:20.875rem; --tit-bottom:12.3rem; margin-top:calc(-1 * calc(var(--tit-height) - var(--tit-bottom))); position: relative; z-index: 20;}
#left_menu .lnb-tit{position:relative; overflow:hidden; height:var(--tit-height); padding-bottom:var(--tit-bottom);  padding-top: 1.3rem; display: flex; align-items: center;  justify-content: center; color:#fff;  border-radius: clamp(1.2rem, 0.8rem + 1.25vw, 3.2rem); background: linear-gradient(171deg, #2069D7 4.67%, #18A8F1 100.15%);  }
#left_menu .lnb-tit span{position:relative; color:#fff; font-size:var(--font-size-28); font-family: 'CloudSans'; font-weight:700; display:inline-block; z-index:1;}
#left_menu .lnb-tit:after{content:""; position:absolute; left:40%; top:5%; width:74%;   aspect-ratio: 1; border-radius:50%; background: linear-gradient(334deg, rgba(29, 103, 208, 0.60) 11.4%, #2279F4 81.05%);}
#left_menu .snb{position:relative; margin-left: clamp(0.75rem, 0.713rem + 0.188vw, 0.938rem); padding:var(--num-20); padding-top:calc(var(--num-20) + 1px); width: calc(100% + clamp(0.75rem, 0.713rem + 0.188vw, 0.938rem)); border-radius: clamp(1.2rem, 0.84rem + 1.125vw, 3rem) 0 clamp(1.2rem, 0.84rem + 1.125vw, 3rem) 0;  background: #FFF;  box-shadow: 4px 7px 16px 0 rgba(230, 234, 239, 0.60); margin-top:calc(-1 *  var(--tit-bottom) + 2.5px); z-index:1; }
#left_menu .snb .left_menu_ul > li{position:relative;}
#left_menu .snb .left_menu_ul > li > a{position:relative; display:flex; align-items: center; height:var(--num-60); padding:0 var(--num-8); font-size:var(--font-size-18);  font-weight:500; align-content:center; border-bottom:1px solid #d8d8d8; }
#left_menu .snb .left_menu_ul > li > a:before{content:""; position:absolute; left:0; bottom:-1px; width:0; height:2px; background:#1F68D4; -webkit-transition: width 0.4s ease-out 0s; transition: width 0.4s ease-out 0s;}
#left_menu .snb .left_menu_ul > li:has(.third_ul) > a:after{ content: ""; margin-left:auto;  flex-shrink: 0;  display: inline-flex;  width: var(--num-20);  height: var(--num-20);  background-color: var(--Gray-Color-900);
    forced-color-adjust: none; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain;
    -webkit-mask-image: url(/images/krds/ico_angle.svg); mask-image: url(/images/krds/ico_angle.svg); margin-top: 0.2rem; margin-left: auto;  transition: 0.4s ease-in-out;  transform: rotate(0deg);}
#left_menu .snb .left_menu_ul > li .third_ul{display:none; padding:var(--num-16) 0; border-bottom:1px solid #d8d8d8; }
#left_menu .snb .left_menu_ul > li .third_ul a{display:flex; gap:var(--gap-8); padding:var(--num-14) var(--num-16); font-size:var(--font-size-17);  font-weight:500;}
#left_menu .snb .left_menu_ul > li .third_ul a:before{content: "·"; font-weight: 700;}
#left_menu .snb .left_menu_ul > li:last-child > a{border-bottom:none;}
#left_menu .snb .left_menu_ul > li .third_ul a:is(.blank):after {content: "\f090"; align-self: center; font-family: "remixicon"; display: inline-block; vertical-align: middle;}


#left_menu .snb .left_menu_ul > li.on > a{color:#1F68D4; font-weight:700;}
#left_menu .snb .left_menu_ul > li.on > a:after{transform: rotate(180deg);}
#left_menu .snb .left_menu_ul > li:hover > a:before,
#left_menu .snb .left_menu_ul > li.on > a:before{width:100%;}
#left_menu .snb .left_menu_ul > li.on .third_ul{display:block;}
#left_menu .snb .left_menu_ul > li.on .third_ul li.on a{ background: #F5F9FF; border-radius:clamp(0.5rem, 0.475rem + 0.125vw, 0.625rem);}


@media (max-width:1030px){
	/*레프트메뉴*/
	#left_menu {display:none;}
}
