@charset "utf-8"; /********************************************************
■ Side Menu : 사이드 메뉴
********************************************************/



/* #sub-visual { position:relative; height:600px; overflow:hidden; } 
#sub-visual .flex-box.column { display:flex; flex-direction: column; gap:20px; align-items: center; } 
#sub-visual .sub-visual__img::before { content:''; position:absolute; inset:0; background:rgba(5, 18, 38, .45); } 
.sub-visual__cont { position:relative; z-index:2; height:100%; } 
.sub-visual__cont .cinner { height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; } 
.sub-visual__title { font-size:62px; font-weight:900; line-height:1; color:#ffc229; letter-spacing:-0.06em; text-align:center; } 
#cnavi { position: absolute; left: 50%; bottom: 100px; z-index: 3; transform: translateX(-50%); } 
.cnavi-in { display:flex; justify-content:center; } 
.cnavi__list { display:flex; align-items:center; gap:14px; } 
.cnavi_home { width:34px; height:34px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0; } 
.cnavi_home::before { content:''; width:16px; height:16px; background:#0d1d35; mask:url('data:image/svg+xml; utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"/></svg>') no-repeat center / contain; -webkit-mask:url('data:image/svg+xml; utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"/></svg>') no-repeat center / contain; } 
.cnavi_arrow { color:rgba(255,255,255,.55); font-size:25px; } 
.cnavi_select { position:relative; min-width:160px; } 
.cnavi_select select { width:100%; height:38px; padding:0 34px 0 14px; border:0; border-bottom:1px solid rgba(255,255,255,.55); background:transparent; color:#fff; font-size:14px; outline:none; appearance:none; -webkit-appearance:none; cursor:pointer; } 
.cnavi_select select option { color:#111; } 
.cnavi_select::after { content:''; position:absolute; right:12px; top:50%; width:7px; height:7px; border-right:1px solid #fff; border-bottom:1px solid #fff; transform:translateY(-65%) rotate(45deg); pointer-events:none; } */

/* @media (max-width:768px){
 #sub-visual { height:300px; } 
 .sub-visual__title { font-size:42px; } 
 .sub-visual__icon { width:46px; } 
 #cnavi { bottom:32px; } 
 .cnavi__list { gap:8px; } 
 .cnavi_select { min-width:120px; } 
 .cnavi_select select { font-size:13px; } 
 }*/



 @media (max-width:768px){
 #sub-visual { height:400px; overflow:visible; } 

 #cnavi { position:absolute; left:0; right:0; bottom:0; transform:none; width:100%; background:rgba(0, 20, 35, .9); backdrop-filter:blur(8px); } 

 #cnavi .cinner { width:100%; padding:0; } 

 .cnavi-in { display:block; } 

 .cnavi__list { width:100%; display:flex; align-items:stretch; gap:0; padding:0; } 

 .cnavi_arrow { display:none; } 

 .cnavi_home { width:72px; height:70px; border-radius:0; background:transparent; border-right:1px solid rgba(255,255,255,.25); } 

 .cnavi_home::before { width:28px; height:28px; background:#fff; } 

 .cnavi_select { flex:1; min-width:0; height:70px; border-right:1px solid rgba(255,255,255,.25); } 

 .cnavi_select select { width:100%; height:100%; padding:0 48px 0 20px; border:0; background:transparent; color:#fff; font-size:16px; font-weight:700; } 

 .cnavi_select::after { right:22px; width:13px; height:13px; border-right:1px solid #fff; border-bottom:1px solid #fff; transform:translateY(-70%) rotate(45deg); } 

 .cnavi_select select option { color:#111; } 

 .sub-visual__icon { max-width:180px; } 
 }

@media (max-width:500px){
 .cnavi_home { width:45px; height:60px; } 

 .cnavi_home::before { width:24px; height:24px; } 

 .cnavi_select { height:60px; } 

 .cnavi_select select { padding:0 38px 0 16px; font-size:14px; } 

 .cnavi_select::after { right:18px; width:10px; height:10px; } 
 }
/* 
@media (max-width:500px){
 .sub-visual__title { font-size:34px; } 
 .cnavi__list { width:100%; padding:0 20px; } 
 .cnavi_select { flex:1; min-width:0; } 
 }*/

#sub-visual { position:relative; height:600px; overflow:hidden; } 

#sub-visual .flex-box.column { display:flex; flex-direction:column; gap:20px; align-items:center; } 

#sub-visual .sub-visual__img::before { content:''; position:absolute; inset:0; background:rgba(5, 18, 38, .45); } 

.sub-visual__cont { position:relative; z-index:2; height:100%; } 

.sub-visual__cont .cinner { height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; } 

.sub-visual__title { font-size:62px; font-weight:900; line-height:1; color:#ffc229; letter-spacing:-0.06em; text-align:center; } 

/* 탭 메뉴 */
#cnavi { position:relative; z-index:3; width:100%; background:#fff; margin-top:50px; } 

.cnavi-in { display:flex; justify-content:center; } 

.cnavi_tab { width:100%; display:flex; flex-wrap:wrap; background:#fff; } 

.cnavi_tab li { width:25%; min-width:0; box-sizing:border-box; border:1px solid #ddd; margin:-1px 0 0 -1px; } 

.cnavi_tab li a { height:58px; display:flex; align-items:center; justify-content:center; padding:0 10px; font-size:18px; font-weight:600; color:#333; background:#fff; text-align:center; transition:.25s; } 

.cnavi_tab li.active a,
.cnavi_tab li a:hover { background:#0d1d35; color:#fff; } 
.cnavi_tab li.active a {
    background:#0d1d35;
    color:#fff;
}
/* 반응형 */
@media (max-width:768px){
 #sub-visual { height:400px; } 

 #cnavi {width: 92%;
        margin: 0 auto;
        padding-top: 40px;}
 .cnavi_tab li { width:50%; } 

 .cnavi_tab li a { height:52px; font-size:15px; } 

 .sub-visual__icon { max-width:180px; } 
 }

@media (max-width:500px){
 .cnavi_tab li { width:50%; } 

 .cnavi_tab li a { height:48px; font-size:14px; } 
 }