@charset "utf-8";

/********************************************************
■ Side Menu : 사이드 메뉴
********************************************************/
#sub-visual {display: flex;flex-direction: column;align-items: center;height: 670px;position: relative;}
.sub-visual__img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 0;}
.sub-visual__img img {width: 100%;height: 100%;position: absolute;top: 0;left: 50%;transform: translateX(-50%);}
.sub-visual__cont {width: 100%;height: 100%;z-index: 1;position: relative;}
.sub-visual__cont .cinner {/* width: 100%; *//* height: 100%; */display: flex;justify-content: space-between;align-items: center;position: absolute;left: 0;right: 0;bottom: 24%;}
.sub-visual__cont .title-cont {color: #fff;font-weight: 700;}
.sub-visual__cont .title-cont .sub-tit {margin-bottom: 10px;font-size: 1.25em;opacity: .5;}
.sub-visual__cont .title-cont .tit {font-size: 3.0em;font-weight: 700;}
/* .sub-visual__cont .title {color: #fff;font-size: 3.50em;font-weight: 700;position: absolute;left: 0;bottom: 158px;}
.sub-visual__cont .txt {color: #fff;text-align: center;line-height: 1.3;} */
#cnavi {/* width: 100%; *//* height: 70px; *//* background: rgba(0, 0, 0, 0.1); *//* backdrop-filter: blur(16px); *//* position: absolute; *//* left: 0; *//* right: 0; *//* bottom: 0; *//* z-index: 990; */}
#cnavi .home {flex: 0 0 auto;display: flex;justify-content: center;align-items: center;width: 40px;aspect-ratio: 1 /1;background: #fff;border-radius: 50%;}
#cnavi .home > img {max-width: 33px;}
.cnavi-in {/* height: 100%; */}
.cnavi__list {display: flex;align-items: center;gap: 0 40px;height: 100%;}
.cnavi__list [class*=cn-dl] {display: flex;align-items: center;min-width: 175px;height: 100%;padding-bottom: 10px;border-bottom: 1px solid #fff;box-sizing: border-box;position: relative;}
.cnavi__list .cn-dl1::after {content: '';display: block;width: 10px;height: 10px;border-top: 2px solid #FFF;border-right: 2px solid #FFF;transform: rotate(45deg);position: absolute;top: 0;right: -24px;bottom: 0;margin: auto;opacity: .2;}
.cnavi__list [class*=cn-dl] dt {display: block;width: 100%;height: 100%;position: relative;}
.cnavi__list [class*=cn-dl] dt > .arrow {display: block;width: 10px;height: 10px;border-top: 2px solid #FFF;border-right: 2px solid #FFF;transform: rotate(135deg);position: absolute;top: 4px;right: 0;margin: auto;cursor: pointer;}
.cnavi__list [class*=cn-dl]:has(.list.open) dt > .arrow {transform: rotate(-45deg) translateY(4px);}
.cnavi__list [class*=cn-dl] .tit {display: flex;align-items: center;width: 100%;height: 100%;/* padding: 0 30px; *//* padding-right: 72px; */color: #FFF;font-size: 16px;font-weight: 500;/* position: relative; */}
.cnavi__list [class*=cn-dl] .list {display: none;width: 100%;max-height: 0;overflow: hidden;background: #fff;position: absolute;top: 35px;left: 0;z-index: 999;transition: max-height 0.35s ease-in-out, border 0.4s ease-in-out;}
.cnavi__list [class*=cn-dl] .list.open {display: block;border-width: 1px;}
.cnavi__list [class*=cn-dl] .list li {padding: 10px 18px;}
.cnavi__list [class*=cn-dl] .list a {display: block;color: #333;font-size: 16px;font-weight: 500;transition: .35s;}
.cnavi__list [class*=cn-dl] .list li a:hover,
.cnavi__list [class*=cn-dl] .list li a:focus,
.cnavi__list [class*=cn-dl] .list li.active a {color: var(--color-main);font-weight: 600;}

@media all and (max-width: 1499px){
	
}
@media all and (max-width: 1399px){
	#sub-visual {height: 540px;}
	.sub-visual__cont .cinner {bottom: 18%;}
}
@media all and (max-width: 1024px){
	#sub-visual {height: 480px;}
	.sub-visual__cont .cinner {flex-direction: column;align-items: normal;}
	.sub-visual__cont .title-cont {margin-bottom: 30px;}
	.sub-visual__cont .title-cont .sub-tit {margin-bottom: 10px;font-size: 1.44em;}
	.sub-visual__cont .title-cont .tit {font-size: 2.67em;}
	.cnavi__list {gap: 0 20px;}
}
@media all and (max-width: 768px){
	#sub-visual {height: 420px;}
	
}
@media all and (max-width: 640px){
	.sub-visual__cont .title-cont {margin-bottom: 20px;}
	.sub-visual__cont .title-cont .sub-tit {margin-bottom: 5px;font-size: 1.22em;}
	.sub-visual__cont .title-cont .tit {font-size: 2.22em;}
	
}