/* COMMON */
/* 디자인 시스템 */
:root {
  --color01: #29235c; /*버튼류*/
  --color02: #279c38; /*텍스트 강조*/
  --color03: #511b0a; /*기타 강조색*/
}
.inner{width: 65%; margin: auto; position: relative; }
.content_wrapper .inner{background: #fff; padding: 30px; margin: 40px auto; }
.flexCC{display: flex; align-items: center; justify-content: center;}
.flexSC{display: flex; align-items: center; justify-content: space-between;}
.flexSS{display: flex; align-items: start; justify-content: space-between;}
.flexEC{display: flex; align-items: center; justify-content: end;}
.flexC{display: flex; align-items: center; }
.mt10{margin-top: 10px;}
.mt15{margin-top: 15px;}
.mt20{margin-top: 20px !important;}
.mt30{margin-top: 30px !important;}
.mb20{margin-bottom: 20px;}
.mt40{margin-top: 40px !important;}
.mt50{margin-top: 50px !important;}
.mt80{margin-top: 80px !important;}
.mt100{margin-top: 100px !important;}
.mt60{margin-top: 80px !important;}
.mr05{margin-right: 5px;}
.block{display: block;}
body{position: relative; min-height: 100vh; color: #4a4a4a;}
.blNone{border-left: none !important;}

.only_pc{}
.only_mob{display: none;}

.colorB{color: #1659be;}
.colorR{background: var(--color02); color: #fff; padding: 2px 5px;}
.colorG{color: #929292;}

b{color: #2e2e2e;}

/*파일 다운로드 아이콘*/
.icon01{background-repeat: no-repeat; width: 17px; height: 15px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 33.89 36.73'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %236b6e70; stroke-linecap: round; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Cline class='cls-1' x1='16.95' y1='2' x2='16.95' y2='25.72'/%3E%3Cpolyline class='cls-1' points='26.53 17.05 16.95 26.64 7.36 17.05'/%3E%3Cline class='cls-1' x1='2' y1='34.73' x2='31.89' y2='34.73'/%3E%3C/g%3E%3C/svg%3E");
}
/*링크 아이콘*/
.icon02{background-repeat: no-repeat; width: 17px; height: 16px; display: inline-block;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 33.11 33.11'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cg id='icon__' data-name='icon_ㅁ'%3E%3Cg%3E%3Cpath class='cls-1' d='M18.26,25.19l-4.27,4.27c-2.86,2.86-7.49,2.86-10.35,0h0c-2.86-2.86-2.86-7.49,0-10.35l5.5-5.5c2.86-2.86,7.49-2.86,10.35,0h0'/%3E%3Cpath class='cls-1' d='M14.78,7.98l4.33-4.33c2.86-2.86,7.49-2.86,10.35,0h0c2.86,2.86,2.86,7.49,0,10.35l-5.5,5.5c-2.86,2.86-7.49,2.86-10.35,0h0'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
/*삭제 아이콘*/
.icon03{background-repeat: no-repeat; width: 17px; height: 20px; display: inline-block;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.24 26.26'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; stroke: %231d1d1b; stroke-linejoin: round; stroke-width: 1px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_2' data-name='Layer 2'%3E%3Crect class='cls-1' x='2.73' y='6.58' width='13.78' height='18.69'/%3E%3Crect class='cls-1' x='1' y='4.35' width='17.24' height='4.45'/%3E%3Crect class='cls-1' x='5.5' y='1' width='8.24' height='3.35'/%3E%3Cline class='cls-1' x1='6.68' y1='12.06' x2='6.68' y2='21.65'/%3E%3Cline class='cls-1' x1='9.62' y1='12.06' x2='9.62' y2='21.65'/%3E%3Cline class='cls-1' x1='12.55' y1='12.06' x2='12.55' y2='21.65'/%3E%3C/g%3E%3C/svg%3E");
  }
/*로그아웃 아이콘*/
.icon04{background-repeat: no-repeat; width: 17px; height: 17px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 57.28 56.44'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %239c9c9c; stroke-linecap: round; stroke-width: 5px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Cpolyline class='cls-1' points='36.49 41.33 36.49 54.44 28.12 54.44 18.75 54.44 10.37 54.44 2 54.44 2 41.33 2 28.22 2 15.11 2 2 10.37 2 18.75 2 28.12 2 36.49 2 36.49 15.11'/%3E%3Cg%3E%3Cpolyline class='cls-1' points='43.28 17.05 54.45 28.22 43.28 39.39'/%3E%3Cline class='cls-1' x1='54.45' y1='28.22' x2='27.2' y2='28.22'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
/*검색 아이콘*/
.icon05{background-repeat: no-repeat; width: 30px; height: 30px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 37.37 37.37'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_타이틀' data-name='타이틀'%3E%3Cg%3E%3Cpath class='cls-1' d='m22.4,5.09c4.78,4.78,4.78,12.53,0,17.31-4.78,4.78-12.53,4.78-17.31,0C.31,17.62.31,9.87,5.08,5.09,9.87.3,17.62.3,22.4,5.09Z'/%3E%3Cline class='cls-1' x1='22.77' y1='22.77' x2='35.87' y2='35.87'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
/*아이디 아이콘*/
.icon06{background-repeat: no-repeat; width: 25px; height: 25px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 37 51.26'%3E%3Cdefs%3E%3Cstyle%3E .cls-1, .cls-2 %7B fill: none; stroke: %23050834; stroke-width: 4px; %7D .cls-2 %7B stroke-linecap: round; stroke-linejoin: round; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Cpath class='cls-2' d='m12.08,25.22c-1.97.84-3.75,2.04-5.24,3.54-1.49,1.49-2.7,3.27-3.54,5.24-.83,1.97-1.3,4.14-1.3,6.42v8.84h33v-8.84c0-2.28-.46-4.45-1.3-6.42-.83-1.97-2.04-3.75-3.54-5.24'/%3E%3Ccircle class='cls-1' cx='18.5' cy='13.61' r='11.61'/%3E%3C/g%3E%3C/svg%3E");
}
/*비밀번호 아이콘*/
.icon07{background-repeat: no-repeat; width: 25px; height: 25px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40.33 55.67'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke-linecap: round; %7D .cls-1, .cls-2 %7B fill: none; stroke: %23050834; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Cg%3E%3Cpath class='cls-2' d='m31.4,20.37v-8.14c0-6.2-5.04-10.23-11.23-10.23s-11.23,4.04-11.23,10.23v8.14'/%3E%3Cpath class='cls-1' d='m8.93,21.37v-8.14c0-6.2,5.04-10.23,11.23-10.23s11.23,4.04,11.23,10.23v8.14'/%3E%3Crect class='cls-2' x='2' y='28.19' width='36.33' height='25.48'/%3E%3Cline class='cls-2' x1='20.17' y1='37.53' x2='20.17' y2='44.32'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
/*화살표 아이콘*/
.icon08{background-repeat: no-repeat; width: 9px; height: 15px; display: inline-block; margin-left: 10px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26.59 47.51'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Cpolyline class='cls-1' points='1.41 1.41 23.76 23.76 1.41 46.1'/%3E%3C/g%3E%3C/svg%3E");
}
/*화살표 아이콘*/
.icon08_top{background-repeat: no-repeat; width: 17px; height: 25px; display: inline-block;; rotate: -90deg;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26.59 47.51'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Cpolyline class='cls-1' points='1.41 1.41 23.76 23.76 1.41 46.1'/%3E%3C/g%3E%3C/svg%3E");
}
/* 엑스 아이콘 */
.icon09{background-repeat: no-repeat; width: 15px; height: 15px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 41.37 41.37'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23d65212; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Cline class='cls-1' x1='39.96' y1='39.96' x2='1.41' y2='1.41'/%3E%3Cline class='cls-1' x1='1.41' y1='39.96' x2='39.96' y2='1.41'/%3E%3C/g%3E%3C/svg%3E");
}
/* 동그라미 아이콘 */
.icon10{background-repeat: no-repeat; width: 17px; height: 17px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 45.46 45.46'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23108a58; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Ccircle class='cls-1' cx='22.73' cy='22.73' r='20.73'/%3E%3C/g%3E%3C/svg%3E");
}
/* 플러스 아이콘 */
.icon11{background-repeat: no-repeat; width: 17px; height: 17px; display: inline-block; margin-right: 3px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56.89 56.89'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 7px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_2' data-name='Layer 2'%3E%3Cline class='cls-1' x1='28.44' y1='2' x2='28.44' y2='54.89'/%3E%3Cline class='cls-1' x1='54.89' y1='28.44' x2='2' y2='28.44'/%3E%3C/g%3E%3C/svg%3E");
}
/* 플러스 아이콘(회색) */
.icon11G{background-repeat: no-repeat; width: 17px; height: 17px; display: inline-block; margin-right: 3px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56.89 56.89'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %236b6e70; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 7px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_2' data-name='Layer 2'%3E%3Cline class='cls-1' x1='28.44' y1='2' x2='28.44' y2='54.89'/%3E%3Cline class='cls-1' x1='54.89' y1='28.44' x2='2' y2='28.44'/%3E%3C/g%3E%3C/svg%3E");
}
/* 연필 아이콘 */
.icon12{background-repeat: no-repeat; width: 17px; height: 17px; display: inline-block; margin-right: 3px; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 38.54 43'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23108a58; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_타이틀' data-name='타이틀'%3E%3Cg%3E%3Cpath class='cls-1' d='m17.44,37.07c.57-.7-2.17-3.91-6.13-7.17-3.96-3.26-7.63-5.35-8.21-4.65-.02.03-.03.06-.04.08l-.09-.07-.82,9.02-.66,7.23,7.1-1.91,8.85-2.39-.09-.07s.06-.03.08-.05Z'/%3E%3Cpath class='cls-1' d='m33.9,9.12c-1.87-2.07-4.1-3.92-6.49-5.35-1.57-.94-3.2-1.72-4.84-2.26-6.55,7.93-13.09,15.86-19.63,23.79,1.64.55,3.28,1.32,4.84,2.27,2.39,1.44,4.62,3.28,6.49,5.35,1.22,1.36,2.29,2.82,3.14,4.32,6.54-7.93,13.09-15.86,19.63-23.79-.85-1.51-1.92-2.96-3.14-4.32Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
/* 프로젝트 아이콘 */
.icon13{background-repeat: no-repeat; width: 18px; height: 17px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 33.9 39.25'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23108a58; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_타이틀' data-name='타이틀'%3E%3Cg%3E%3Cpath class='cls-1' d='m28.31,5.73c-2.25,0-4.09.79-4.09,1.74s-2.25,1.75-5,1.75h-4.54c-2.75,0-5-.79-5-1.75s-1.84-1.74-4.09-1.74S1.5,7.98,1.5,10.73v22.01c0,2.75,2.25,5,5,5h20.9c2.75,0,5-2.25,5-5V10.73c0-2.75-1.84-5-4.09-5Z'/%3E%3Cpath class='cls-1' d='m14.68,1.5c-2.75,0-5,1.74-5,3.86s2.25,3.86,5,3.86h4.54c2.75,0,5-1.74,5-3.86s-2.25-3.86-5-3.86h-4.54Z'/%3E%3C/g%3E%3Cline class='cls-1' x1='13.54' y1='17.76' x2='20.36' y2='17.76'/%3E%3Cline class='cls-1' x1='13.54' y1='25.94' x2='20.36' y2='25.94'/%3E%3C/g%3E%3C/svg%3E");
}
/* 햄버거 아이콘 */
.icon14{background-repeat: no-repeat; width: 16px; height: 15px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.22 7'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_1' data-name='Layer 1'%3E%3Cline class='cls-1' x1='.5' y1='.5' x2='7.72' y2='.5'/%3E%3Cline class='cls-1' x1='.5' y1='3.5' x2='7.72' y2='3.5'/%3E%3Cline class='cls-1' x1='.5' y1='6.5' x2='7.72' y2='6.5'/%3E%3C/g%3E%3C/svg%3E");
}
/* 시계 아이콘 */
.icon15{background-repeat: no-repeat; width: 20px; height: 20px; display: inline-block; 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32.82 32.82'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23fff; %7D .cls-1, .cls-2 %7B fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D .cls-2 %7B stroke: %23fff; %7D %3C/style%3E%3C/defs%3E%3Cg id='_레이어_1-2' data-name='레이어 1'%3E%3Cg%3E%3Cpath class='cls-2' d='m31.32,16.41c0,8.24-6.67,14.91-14.91,14.91S1.5,24.64,1.5,16.41,8.18,1.5,16.41,1.5s14.91,6.67,14.91,14.91Z'/%3E%3Cpolyline class='cls-1' points='17.13 6.68 17.13 16.32 8.8 16.32'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
/* 집 아이콘 */
.icon16{background-repeat: no-repeat; width: 15px; height: 15px; display: inline-block; 
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_2' data-name='레이어 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 982.23 1203.06'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23979292; %7D %3C/style%3E%3C/defs%3E%3Cg id='_섁1' data-name='섁1'%3E%3Cpath class='cls-1' d='M511.2,8.58c-11.6-11.43-28.57-11.43-39.87,0L10.71,471.53c-6.83,6.6-10.71,16.32-10.71,26.68v669.16c0,19.77,13.69,35.69,30.66,35.69h921.22c16.66,0,30.36-15.92,30.36-35.69V498.21c0-10.36-3.88-20.08-10.41-26.68L511.2,8.58Z'/%3E%3C/g%3E%3C/svg%3E");
}
/*유튜브 아이콘 */
.icon_youtube{background-repeat: no-repeat; width: 51px; height: 35px; display: inline-block; background-size: cover;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' width='313.23315mm' height='216.02286mm' viewBox='0 0 313.23315 216.02286'%3E%3Cpath fill='%23f03' d='M210.532 221.299s98.125 0 122.464-6.481c13.705-3.672 24.011-14.258 27.628-27.327 6.689-23.978 6.689-74.42 6.689-74.42s0-50.117-6.689-73.88c-3.617-13.393-13.923-23.762-27.628-27.326-24.34-6.59-122.464-6.59-122.464-6.59s-97.906 0-122.136 6.59C74.91 15.429 64.386 25.798 60.548 39.19c-6.469 23.763-6.469 73.88-6.469 73.88s0 50.442 6.469 74.42c3.837 13.07 14.362 23.655 27.848 27.327 24.23 6.48 122.136 6.48 122.136 6.48' style='stroke-width:.0208149' transform='translate(-54.08 -5.276)'/%3E%3Cpath fill='%23fff' d='m259.301 113.287-81.008-45.905v91.81z' style='stroke-width:.0208149' transform='translate(-54.08 -5.276)'/%3E%3C/svg%3E");
}

/* 버튼 모음 */
/* 수료증, 바로가기 */
.btn01{background: #868686; color: #fff; font-size: 18px; padding: 5px 10px; display: flex; border-radius: 3px;}
.btn01_02{background: var(--color01); color: #fff; font-size: 18px; padding: 5px 10px; display: flex; border-radius: 3px;}
.el-lock-badge{background: var(--color01); color: #fff; font-size: 18px; padding: 5px 10px; display: flex; border-radius: 3px;}
/* 홈페이지 내 이동 버튼 */
.link_page{background: var(--color01); color: #fff; padding: 5px 10px; border-radius: 3px;}

.header {position: sticky; top: 0; width: 100%; background: #fff; border-bottom: 1px solid #eaeaea; z-index: 1000;  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.header-inner {position: relative; display: flex;align-items: center; max-width: 1400px; margin: 0 auto; height: 80px; padding: 0 40px; z-index: 10; background-color: #ffffff;}
.logo {width: 300px;}
.logo img{width: 100%;}
.header .logo{width: auto;}
.header .logo a{display: flex; align-items: center;}
.header .logo img{width: auto; height: 42px;}
.header .logo .logo-tit{margin-left: 10px; font-size: 15px; line-height: 1.35; font-weight: 700; color: #111;}
.gnb {height: 100%; margin: auto;}
.gnb .depth1 {display: flex; gap: 85px; height: 100%;}
.gnb .depth1 > li { position: relative; height: 100%; display: flex; align-items: center;}
.gnb .depth1 > li > a {font-size: 17px; font-weight: 600; transition: color 0.3s ease; display: flex; align-items: center; height: 100%; position: relative;}
.gnb .depth1 > li:hover > a {color: #039A83;}      
.gnb .depth1 > li > a::after {content: ''; position: absolute; bottom: 0;  left: 0; width: 0; height: 3px; background-color: #039A83; transition: width 0.3s; }
.gnb .depth1 > li:hover > a::after {width: 100%; }
.gnb .depth2 {position: absolute;  top: 80px;  left: 50%; transform: translateX(-50%); width: 180px; text-align: center; display: none; padding: 30px 0; z-index: 20; }
.gnb .depth2 li { margin-bottom: 16px; }
.gnb .depth2 li:last-child { margin-bottom: 0; }
.gnb .depth2 a { font-size: 15px;color: #666; font-weight: 400; transition: all 0.2s; word-break: keep-all;}
.gnb .depth2 a:hover { color: #039A83; font-weight: 700; }
.gnb-bg {position: absolute; top: 80px; left: 0; width: 100%; height: 0; background: #ffffff; border-bottom: 1px solid #eaeaea; box-shadow: 0 10px 15px rgba(0,0,0,0.03); z-index: 5; overflow: hidden;}
.btn-menu {
    display: none; /* PC에서는 숨김 (반응형에서 노출) */
    flex-direction: column;  justify-content: space-between; width: 24px; height: 18px; background: none;  border: none; cursor: pointer;
    z-index: 1001; /* 모바일 메뉴 위로 */
    }
.btn-menu span {display: block;  width: 100%; height: 2px; background-color: #111; transition: all 0.3s ease;}
 .header.header-hidden {
            transform: translateY(-100%);
        }

/* 햄버거 버튼 X 애니메이션 */
.btn-menu.active span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.btn-menu.active span:nth-child(2) { opacity: 0; }
.btn-menu.active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* footer */
footer{background: #e0e0e0; width: 100%; padding: 20px 0;}
.link_list{display: flex; margin-left: -10px; margin-bottom: 20px;}
.link_list li{position: relative;}
.link_list li::after{content: ''; width: 1px; height: 100%; display: block; background: #bdb0b0; position: absolute; left: 0; top: 0;}
.link_list li:nth-child(1)::after{display: none;}
.link_list li:nth-child(1){font-weight: 600;}
.link_list a{padding: 5px 10px;}

/* 상단이동 탑버튼 */
#scrollTopBtn {display: none; position: fixed; bottom: 30px; right: 30px; z-index: 999; background-color: #29235c; color: #fff; border: none; outline: none; cursor: pointer; padding: 12px 18px; border-radius: 50px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);}
#scrollTopBtn:hover {background-color: #29235c;}

/* 메인페이지 */
.main_page{}
/* .main_page .main_wrap{width: 100%; height: 80vh; overflow: hidden; background: url('./../images/BGIMG.png') center/100% no-repeat; position: relative; display: flex; align-items: center; justify-content: center; padding-top: 20px;} */
.main_page .main_wrap{width: 100%; height: 80vh; overflow: hidden; background: #f7f7f7; position: relative; display: flex; align-items: center; justify-content: center; padding: 50px 0;}
.main_page .main_wrap{width: 100%; height: 80vh; overflow: hidden; background: url('./../images/BGIMG.png') center/100% no-repeat; position: relative; display: flex; align-items: center; justify-content: center; padding: 50px 0;}
/* .main_page .main_wrap .main_img01{width: 38%; } */
.main_page .main_wrap .tit_wrap{ width: 85%; display: flex; flex-direction: column; align-items: center;}
.main_page .main_wrap .tit_img{width: 700px; margin-top: 30px; margin: auto;}
.main_page .main_wrap .tit_img img{width: 100%;}
.main_page .main_wrap .main_img02{width: 70%; margin-top: 30px;}
.main_page .main_wrap  img{width: 100%;}
.main_page .sec01{background: linear-gradient(to right, #52936a, #009e3b); padding: 10px 0; width: 100%; display: flex; align-items: center;}
.mainbtn_wrap{display: flex; gap: 20px;}
.mainbtn_wrap li{width: 50%; background: #f3f3f3; display: flex; align-items: center; border-radius: 5px;}
.mainbtn_wrap li a{ padding: 15px 10px; display: flex; align-items: center;width: 100%; justify-content: center;}
.mainbtn_wrap li a.logo_link{}
.mainbtn_wrap li a.logo_link img{width: 100%; max-width: 200px;}
.mainbtn_wrap li a span{font-size: 20px; font-weight: 600; margin-left: 10px;}

/* 서브페이지 */
.page_content {min-height: 100vh; margin: auto; padding-top: 40px;}
.page_title{}
.page_title h2{font-size: 25px; color: #2e2e2e;}
.page_title .location_wrap{display: flex; align-items: center;}
.page_title .location_wrap li{color: #979292;}
.page_title .location_wrap li{color: #979292; position: relative; padding-right: 14px;}
.page_title .location_wrap li::after{display: block; position: absolute; top: 6px; right: 5px; padding: 3px; content: ''; border: solid #BEBEC6; border-width: 0 1px 1px 0; transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.page_title .location_wrap li:last-child:after{display: none;}

.page_title02{width: 100%; height: 350px; background: url('./../images/sub_img.jpg') center/cover no-repeat;  box-sizing: border-box;   background-attachment: fixed; padding: 30px 0; box-sizing: border-box; margin-top: 20px;}
.page_title02 .inner{height: 100%;} 
.page_title02 .page_menu{display: flex; gap: 50px; margin-bottom: 30px; border-bottom: 1px solid #b9b9b9;}
.page_title02 .page_menu li{color: #b9b9b9;}
.page_title02 .page_menu li.on{color: #fff; font-weight: 600; border-bottom: 2px solid #fff;}
.page_title02 .page_menu li a{padding: 10px; display: block;}
.page_title02 .page_tit{font-size: 30px; color: #fff;}
.page_title02 .sub_tit{font-size: 18px; line-height: 1.3; margin-top: 20px; color: #fff; display: none;}

.content_wrap{margin-top: 30px; padding-bottom: 30px; font-size: 18px; line-height: 1.5;}
.tit01{font-size: 25px; margin-bottom: 10px; position: relative; padding-left: 15px; color: #2e2e2e; margin-left: -30px;}
/* .tit01::before{content: ""; position: absolute; width: 3px; height: 50%; background: #2e2e2e; bottom: 9px; left: 0;} */
.tit02{font-size: 25px; margin-bottom: 10px; color: #2e2e2e; margin-left: -60px;}
.tit03{font-size: 23px;}
.tit04{text-align: center; font-size: 25px;}
.tit05{font-size: 26px;}
/* 본문 텍스트 */
.des01{text-align: center; font-size: 20px;}
.des02{text-align: center; font-size: 23px; color: #4a4a4a;}
.des02 b{color: #2e2e2e;}

/* 강조 문장 */
.text_box{background: #fff; text-align: center; padding: 5px 0 10px; font-size: 25px; line-height: 1.5; border:10px solid var(--color02); position: relative; width: 75%; margin: auto;}
.text_box::before{content: ''; width: 95%; height: 10px; position: absolute; top: -10px; left: 50%; transform: translateX(-50%); background: #fff;}
.text_box::after{content: ''; width: 95%; height: 10px; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); background: #fff;}

/* 강조문장(숙의토론) */
.text_box02{background: #fff5c3; width: 60%; margin: auto; margin-top: 80px; text-align: center; position: relative; font-size: 20px; padding: 20px;}
.text_box02::before {content: '';position: absolute; top: -30px;  left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 40px solid transparent; border-right: 40px solid transparent; border-bottom: 30px solid #fff5c3;}
/* 네모장식 기본 리스트 디자인 */
.list01{}
.list01 li{position: relative; padding-left: 15px;}
.list01 li.none::before{display: none;}
.list01 li::before{content: ''; width: 7px; height: 7px; background: var(--color03); position: absolute; left: 0; top: 10px;}

/* 2열 그리드 */
.list02 {display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; padding: 20px; margin: 30px; list-style: none; background-color: #f2f3f3; border-radius: 10px; counter-reset: card-counter;}
.list02 > li {counter-increment: card-counter; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 20px; align-items: center; background-color: #fff;  padding: 20px 32px; border-radius: 8px;  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02); }
.list02 > li::before {content: counter(card-counter, decimal-leading-zero); grid-column: 1; grid-row: 1 / span 2; font-size: 32px; font-weight: 700; color: var(--color02); padding-right: 20px; border-right: 2px solid #e4e7e5; line-height: 1; display: flex; align-items: center; height: 100%;}
.list02 > li > span {grid-column: 2; grid-row: 1; display: block;font-size: 18px; font-weight: 700;color: #2e2e2e; margin-bottom: 6px;}
.list02 > li > p {grid-column: 2; grid-row: 2; margin: 0; font-size: 16px; color: #4a4a4a; line-height: 1.5; word-break: keep-all;}

/* 4칸 그리드 (번호 없이 , 그리드만) */
.list02_01 {display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding: 20px; margin: 25px; list-style: none; background-color: #f2f3f3; border-radius: 10px; }
.list02_01 > li { display: grid; align-content: start;  align-items: center; background-color: #fff;  padding: 20px 20px; border-radius: 8px;  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02); }
.list02_01 > li > span {grid-column: 2; grid-row: 1; display: block;font-size: 19px; font-weight: 700;color: #2e2e2e; margin-bottom: 6px;}
.list02_01 > li > p {grid-column: 2; grid-row: 2; margin: 0; font-size: 18px; color: #4a4a4a; line-height: 1.5; word-break: keep-all;}

/* 2칸 /1칸 그리드 (번호 없이 , 그리드만) */
.list02_02 {display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; padding: 15px; margin: 0 100px;background-color: #f2f3f3; border-radius: 10px; }
.list02_02 > li { display: flex; flex-direction: column; background-color: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);}
.list02_02 > li:last-child { grid-column: 1 / -1;}
.list02_02 > li > span { grid-column: 2; grid-row: 1; display: block; font-size: 19px; font-weight: 700; color: var(--color02); margin-bottom: 6px;}
.list02_02 > li > p {grid-column: 2; grid-row: 2;  margin: 0; font-size: 18px; color: #4a4a4a; line-height: 1.5; word-break: keep-all; word-break: keep-all;}

/* 시민참여안내 그리드 */
.list03{display: flex; justify-content: space-between; border-top: 2px solid #2e2e2e; padding-top: 20px; padding-left: 20px; margin-top: 30px;}
.list03 + .list03{margin-top: 80px;}
.list03 .tit{font-size: 30px; color: #2e2e2e;}
.list03 .tit span{font-size: 25px;}
.list03 > ul{width: 70%;}
.list03 > ul li{font-size: 18px; border-bottom: 1px solid #e0e0e0; padding-bottom: 10px;}
.list03 > ul li + li{margin-top: 10px;}

/* 일정 프로그래스 */
.list04{width: 100%; position: relative; margin-top: 50px; display: flex; justify-content: space-between;}
.list04::before{content: ''; width: 100%; height: 3px; top: 10px; background: #ececec; position: absolute;}
.list04 li{position: relative; padding-top: 30px; display: inline-flex; flex-direction: column; width: 30%;}
.list04 li::before{content: ''; width: 20px; height: 20px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: #343a52; border-radius: 3px;}
.list04 li.last::before{ background: #289c39; box-shadow: -1px -1px 10px 5px #c2e5c7;}
.list04 li .tit{ text-align: center; font-size: 25px; font-weight: 600; color: #343a52;}
.list04 li.last .tit{ text-align: center; font-size: 25px; font-weight: 600; color: #289c39;}
.list04 li .tit span{ font-size: 20px; font-weight: 400; margin-top: -10px; display: inline-block; }
.list04 li .des01{display: flex; font-size: 18px;  color: #4a4a4a; text-align: left; padding-left: 60px;}
.list04 li:nth-child(1) .des01{padding-left: 0;}
.list04 li:nth-child(4) .des01{padding-left: 30px;}
.list04 li .des01 p{font-weight: 600; margin-right: 10px; color: #2e2e2e; }

/* 소제목이 있는 리스트 */
.list05{}
.list05 li{ color: #1b1b1b; display: flex; flex-direction: column; color: #4a4a4a;}
.list05 li + li{margin-top: 5px;}
.list05 li span{font-weight: 600; color: #2e2e2e;}

/* 숙의공론 */
.list06 li .tit{font-size: 23px; color: #2e2e2e; font-weight: 600; border-bottom: 2px solid #015888; padding-bottom: 10px; position: relative;}
.list06 li .tit::after{content: ''; width: 20px; height: 2px; background: #015888; position: absolute; right: -1px; bottom: 3px; rotate: 32deg;}
.list06 {display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px;}
.list06 > li {position: relative; display: flex; flex-direction: column; padding-bottom: 120px; font-size: 17px;}
.list06 li > ul {margin-top: 15px; flex: 1; }
.list06 li .ul_img { width: 130px; position: absolute; right: 0; bottom: 0; }
.list06 li .ul_img img {width: 100%; display: block;}

/* 로그인 */
.login_info{margin-top: 50px;}
/* 학습동영상 */
.video_tit_wrap{display: flex; justify-content: space-between; align-items: flex-start;}
.video_tit_wrap .video_tit{font-size: 30px;}
.video_tit_wrap .video_tit02{font-size: 20px;}
.video{width: 80%; padding-bottom: 45%; background: #e4e4e4; margin: auto; position: relative; margin-top: 20px;}
.video > img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}


/* 탭메뉴 */
.tab-container { max-width: 1000px; margin: 0 auto; }
/* 탭 메뉴 스타일 */
.tab-menu { display: flex; justify-content: center; gap: 32px; list-style: none; margin-bottom: 40px; }
.tab-menu li button {background: none; border: none; font-size: 18px; font-weight: 700; color: #999; padding: 8px 20px; cursor: pointer; position: relative; transition: color 0.2s ease;}
/* 활성화된 탭 스타일  */
.tab-menu li.active button {color: #111;}
.tab-menu li.active button::after {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background-color: #111;}
/* 콘텐츠 영역 */
.tab-pane { display: none; }
.tab-pane.active { display: block; }

/* 과정소개 */
.tabTit{font-size: 23px;}
.videoInfo{display: flex; gap: 30px; justify-content: center; margin-top: 20px;}
.videoInfo li{display: flex; flex-direction: column; font-size: 20px; border: 1px solid #ddd; border-left: 4px solid #000; width: 25%; padding: 10px 20px;}
.videoInfo li .tit{font-weight: 600; margin-right: 10px; }

/* 학습자료 */
.downLoad_list{}
.downLoad_list li{border-bottom: 1px solid #ddd; padding-bottom: 10px; display: flex; justify-content: space-between; align-items: center;}
.downLoad_list .tit_wrap{display: flex; align-items: center;}
.downLoad_list .tit_wrap .icon{width: 34px; margin-right: 10px;}
.downLoad_list .tit_wrap .icon img{width: 100%;}
.downLoad_list .tit_wrap .tit{}
.downLoad_list .tit_wrap .tit p{font-weight: 600;}
.downLoad_list .down_btn{padding: 4px;}


/* 6. 모바일 반응형 대응 (768px 이하에서는 1열로 변경) */
@media (max-width: 768px) {
    .list02 { grid-template-columns: 1fr;padding: 16px;}
    .list02 > li {padding: 20px 24px;}
}

/* 테이블 디자인 */
.table01 { width: 100%;border-top: 2px solid #535353; border-bottom: 1px solid #e0e0e0; line-height: 1.5;}
.table01 td {padding: 20px; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; vertical-align: middle; word-break: keep-all; background-color: #ffffff;text-align: left;}
.table01 tr td:last-child {border-right: none;}
.table01 .tit {background-color: #f2f4f7; font-weight: 600; text-align: center; width: 30%;}

.table02 { width: 100%;border-top: 2px solid #bdbdbd; border-bottom: 1px solid #e0e0e0; line-height: 1.5;}
.table02 th {padding: 20px; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; vertical-align: middle; word-break: keep-all; background-color: #ffffff;text-align: left;}
.table02 tr th:last-child {border-right: none;}
.table02 td {padding: 20px; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; vertical-align: middle; word-break: keep-all; background-color: #ffffff;text-align: center;}
.table02 tr td:last-child {border-right: none;}
.table02 .tit {background-color: #f2f4f7; font-weight: 600; text-align: center; width: 30%;}
.table02.tal td:first-child {text-align: center;}
.table02.tal td {text-align: left;}

.table03 { width: 80%; margin: auto; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; line-height: 1.5;}
.table03 td {padding: 20px; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; vertical-align: middle; word-break: keep-all; background-color: #ffffff;text-align: left; width: 45%;}
.table03 tr td:first-child {text-align: right;}
.table03 tr td:last-child {border-right: none;}
.table03 .tit {background-color: #f2f4f7; font-weight: 600; text-align: center; width: 10%;}

.table03_01 { width: 80%; margin: auto; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; line-height: 1.5;}
.table03_01 th {padding: 20px; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; vertical-align: middle; word-break: keep-all; background-color: #ffffff;text-align: left;}
.table03_01 tr th:last-child {border-right: none;}
.table03_01 td {padding: 20px; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; vertical-align: middle; word-break: keep-all; background-color: #ffffff;text-align: left; width: 40%;}
.table03_01 tr td:first-child {text-align: right;}
.table03_01 tr td:last-child {border-right: none;}
.table03_01 .tit {background-color: #f2f4f7; font-weight: 600; text-align: center; width: 20%;}
.table03_01 .tit02 {background-color: #f2f4f7; font-weight: 600; text-align: center; width: 20%; font-size: inherit; color: #4a4a4a;}


/* 서브페이지 본문 이미지 */
.con_img{width: 90%; margin: auto;}
.con_img img{width: 100%;}

/* 사전학습 */
.video_wrapper{}
.video_wrapper .top{}
.video_wrapper .top .right{}
.video_wrapper .top .left{}
.video_wrapper .login{display: flex; align-items: center; gap: 10px; justify-content: end;}
.video_wrapper .login .right a{font-size: 16px; border: 1px solid #ddd; padding: 2px 3px; display: flex; align-items: center; border-radius: 3px;}
.video_wrapper .login .right a .icon04{margin-left: 10px;}


/* 목록 스타일 */
.series_list li {display: flex;  align-items: center; padding: 20px; border-bottom: 1px solid #eee; align-items: stretch;}

/* 썸네일 영역 */
.series_thumb {width: 250px; height: 150px; background-color: #ddd; margin-right: 20px; overflow: hidden;}
.series_thumb img {width: 100%; height: 100%; object-fit: cover; display: block;}

.series_list .info { flex: 1; display: flex; flex-direction: column; justify-content: space-around;}
.series_list .tit {display: flex; justify-content: space-between; align-items: center;}

/* 강의명 */
.series_list .tit h4 {margin: 0; font-size: 20px;}

/* 버튼 영역 */
.btn_wrap {display: flex; gap: 10px; }
.progress .bar{width: 100%; height: 10px; background: #d6d6d6;}
.progress .bar span{height: 100%; display: block; background: #039A83;}
.progress .info{display: flex; justify-content: space-between; flex-direction: row;}
.progress .info02{display: flex; justify-content: space-between; flex-direction: row; margin-top: 10px;}



/* 모바일 배경 딤(Dim) 처리 */
.dim-bg {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 999; display: none;}

/* 게시판 */
/*board*/
.pagination{width:100%;height: 30px;margin-top: 20px; font-size: 0; text-align: center}
.pagination li{display: inline-block;width:30px;height: 30px;margin-right:5px;vertical-align: top;line-height: 30px}
.pagination a{display: inline-block;width: 100%;height:100%;line-height: 30px; text-align: center;font-size: 16px;color: #1a1a1a}
.pagination li.on{font-weight: 700; text-align: center;font-size: 16px;color: var(--color02)}
.pagination li.first a, .pagination li.prev a, .pagination li.next a, .pagination li.last a{border:1px solid rgba(0,0,0,.2);background-size: 80%;background-repeat: no-repeat;background-position: center; text-indent: -9999px}
.pagination li.first a{background-image: url('../images/ico_first.png')}
.pagination li.prev{margin-right: 10px}
.pagination li.prev a{background-image: url('../images/ico_prev.png')}
.pagination li.next{margin-left: 0}
.pagination li.next a{background-image: url('../images/ico_next.png')}
.pagination li.last{margin-right: 0}
.pagination li.last a{background-image: url('../images/ico_last.png')}

/* .board-util{display: flex;justify-content: space-between; margin-top: 80px;} */
.board-util{display: flex;    justify-content: flex-end; position: absolute; right: 0; bottom: 0;
    margin-top: 0px;}
.board-util .btn01{display: inline-block; background: #dfdfdf; color: #5d5d5d; font-size: 20px; padding: 8px 15px; margin-right: 10px;}
.board-util .board-search{display: flex;}
.board-util .search01-wrp{display: flex;}
.board-util .board-search .btn-srch01{color: #fff; display: flex; font-size: 18px; display: flex; align-items: center;}
.board-util .board-search .btn-srch01 .icon05{width: 25px; height: 25px; margin-right: 5px;}
.board-util .board-search select{font-size: 18px; padding: 5px 10px;}
.board-util .board-search input{font-size: 18px; padding: 5px 10px; margin-right: 10px;}

/* .board-util{position: absolute; bottom: 0; width: 100%;height: 36px; margin-bottom: auto;} */
/* .board-search{display: flex; position: absolute;top: 0;right: 0;width: 300px; height: 36px} */
/* .board-search select{width: 90px; height: 100%; border:1px solid #ccc} */
/* .board-search .search01-wrp{width: 200px;margin-left: 10px;padding-right: 36px;border:1px solid #ccc} */
/* .search01-wrp > input{display: inline-block;width: 100%;height: 100%;padding-left: 10px;border: 0!important;background-color: #fff} */
/* .search01-wrp > .btn-srch01{display: block;position: absolute;top: 1px;right: 1px} */
.search01-wrp.w80p{width: 80%;height: 36px; margin-left: auto;margin-right: auto}

.board-view .tit{padding:20px 30px 4px; border-top: 2px solid #333;font-size: 24px;color: #444;font-weight: 700}
.board-view .info {position: relative; width: 100%; padding-left: 20px;padding-bottom: 20px;border-bottom: 1px solid #ccc}
.board-view .info li{display: inline-block;padding-left: 10px;padding-right: 10px; line-height: 16px; color: #828980;font-size: 14px}
.board-view .info li:first-child{border-right: 1px solid #ccc}
.board-view .con{width: 100%;padding:30px}
.board-view .file{width: 100%;padding:10px 30px; border-top: 1px solid #ccc}
.board-view .file > li{padding-top: 10px}
.board-view .file > li:first-child{padding-top: 0}
.board-view .file > li > a{display: inline-block;padding-left: 30px;padding-right: 10px;line-height: 30px; background: #eee url(../images/ico_file.png) no-repeat 6px center;background-size: 16px 18px; font-size: 14px}
.board-view .file > li > a img{display: inline-block;height: 20px;vertical-align: middle}
.board-btn{width: 100%; padding-top: 20px; border-top: 1px solid #ccc;text-align: right}
.board-btn li{display: inline-block; margin-left: 10px}

.board-write{width: 100%; padding: 20px 30px 0; border-top: 1px solid #333}
.board-write > ul{font-size: 0}
.board-write > ul > li{display: inline-block;padding-bottom: 20px;line-height: 40px; font-size: 16px;vertical-align: top}
.board-write > ul > li.th{width: 14%;font-weight: 700;color: #666}
.board-write > ul > li.td{width: 86%}

.ico-re{display: inline-block; padding: 5px; margin-right: 10px; background: url(../images/ico_reply.png) no-repeat; background-size: 100% 100%}

.board-list{width: 100%}
.board-list ul{display: flex}
.board-list ul > li{height: 50px; padding-left: 10px;padding-right: 10px;line-height: 50px; min-width: 0; overflow: hidden; box-sizing: border-box}
.board-list ul.thd > li.th01{width: 10%}
.board-list ul.thd > li.th02{width: 60%}
.board-list ul.thd > li.th03{width: 15%}
.board-list ul.thd > li.th04{width: 15%}
.board-list ul.tbd > li{border-bottom: 1px solid #ccc}
.board-list ul.thd > li{background-color: #eee;font-weight: 700;color: #888;text-align: center}
.board-list ul.tbd > li.td01{width: 10%;text-align: center}
.board-list ul.tbd > li.td02{width: 60%}
.board-list ul.tbd > li.td03{width: 15%;text-align: center}
.board-list ul.tbd > li.td04{width: 15%;text-align: center}
.board-list ul.tbd > li > a{display: block;width: 100%;height: 50px;line-height: 50px; overflow: hidden;text-overflow: ellipsis;white-space: nowrap}


/* 헤더 모바일 */
    @media (max-width: 1024px) {
        .header-inner { padding: 0 20px; height: 60px; }
        .btn-menu { display: flex; } /* 모바일에서 햄버거 버튼 노출 */
        
        /* GNB 모바일 사이드 메뉴화 */
        .gnb {position: fixed; top: 0; right: -100%; width: 80%; max-width: 320px; height: 100vh; background: #fff; z-index: 1000; padding-top: 80px; overflow-y: auto; transition: right 0.4s cubic-bezier(0.77, 0, 0.175, 1);}
        .gnb.is-open {right: 0;}

        /* 모바일 1뎁스 스타일 */
        .gnb .depth1 {flex-direction: column; gap: 0; height: auto;}

        .gnb .depth1 > li {display: block; height: auto; border-bottom: 1px solid #f0f0f0;}

        .gnb .depth1 > li > a {
            height: 60px;
            padding: 0 30px;
            font-size: 18px;
            justify-content: space-between;
        }

        /* PC 호버 효과 제거 */
        .gnb .depth1 > li > a::after { display: none; }
        
        /* 모바일 아코디언 화살표 */
        .gnb .depth1 > li > a::before {
            content: '';
            position: absolute;
            right: 30px;
            top: 50%;
            width: 8px;
            height: 8px;
            border-right: 2px solid #333;
            border-bottom: 2px solid #333;
            transform: translateY(-50%) rotate(45deg);
            transition: transform 0.3s;
        }

        .gnb .depth1 > li > a.open::before {
            transform: translateY(-50%) rotate(-135deg);
            border-color: #00BFD6;
        }
        .gnb .depth1 > li > a.open { color: #00BFD6; }

        /* 모바일 2뎁스 (아코디언) */
        .gnb .depth2 {
            position: static;
            transform: none;
            width: 100%;
            background: #f9f9f9;
            text-align: left;
            padding: 0;
            display: none; /* jQuery로 제어 */
        }

        .gnb .depth2 li { margin-bottom: 0; }
        .gnb .depth2 a {display: block; padding: 15px 30px 15px 40px; font-size: 15px; color: #555;}
        .gnb-bg { display: none !important; } /* PC용 배경 숨김 */
        .page-content { padding: 40px 20px; margin-top: 20px; }
        .page-title { font-size: 28px; }
    }

/* 반응형 */
@media only screen and (max-width: 1400px) {
   
}
@media only screen and (max-width: 1200px) {
    .inner{width: 80%;}
    .main_page .main_wrap{height: auto;}
    .main_page .main_wrap .tit_wrap{flex-direction: column;}
    .main_page .main_wrap .tit_img{width: 80%;}
    .main_page .main_wrap .main_img02{width: 100%;}
  }

  @media only screen and (max-width: 1100px) {

  }
  @media only screen and (max-width: 768px) {
    .only_pc{display: none;}
    .only_mob{display: block;}
    .inner{width: 90%; }

    .header-inner{justify-content: space-between;}
    .logo{width: 200px;}
    .header .logo img{height: 32px;}
    .header .logo .logo-tit{font-size: 12px;}
    .mt40{margin-top: 20px !important;}
    .mt50{margin-top: 30px !important;}
    .mt80{margin-top: 50px !important;}

    .colorR{color: var(--color02); background: none; padding: 0; font-weight: 600;}
    .des{line-height: 1.5;}

    .des01{font-size: 18px;}
    .des02{font-size: 18px;}

    .text_box{font-size: 18px; width: 100%; border: 1px solid var(--color02); padding: 15px; box-sizing: border-box;}
    .text_box::after{display: none;}
    .text_box::before{display: none;}

    .text_box02{width: 100%; box-sizing: border-box; font-size: 18px; word-break: keep-all; margin-top: 40px;}
    /* footer */
    .link_list{flex-wrap: wrap; gap: 10px; margin-left: 0;}
    .link_list li{width:  calc(50% - 10px);}
    .link_list li::after{display: none;}
    .link_list a{display: block; width: 100%; word-break: keep-all;}

    /* 메인페이지 */
    .main_page .main_wrap .tit_wrap{width: 95%;}
    .mainbtn_wrap{flex-direction: column;}
    .mainbtn_wrap li {width: 100%;}
    .mainbtn_wrap li a{justify-content: space-between;}
    .mainbtn_wrap li a.logo_link img{width: 120px;}
    .mainbtn_wrap li a span{font-size: 16px;}

    /* 타이틀 */
    .tit01{padding-left:  0; margin-left: 0; font-size: 20px; word-break: keep-all;}
    .tit02{margin-left: 0; font-size: 20px;}

    /* 서브페이지 */
    .page_content{padding-top: 20px; min-height: auto;}
    .page_title{}
    .page_title .top{flex-direction: column;}
    .page_title .location_wrap{margin-top: 10px;}
    .page_title02{height: auto; padding-top: 15px;}
    .page_title02 .page_menu{flex-wrap: wrap; gap: 10px; justify-content: space-between;}
    .page_title02 .page_menu li{width: calc(50% - 10px);}
    .page_title02 .page_tit{font-size: 25px; text-align: center;}

    .content_wrap{font-size: 16px;}
    .con_img{width: 100%;}

    /* 리스트 */
    .list01 li{padding-left: 25px; word-break: keep-all;}
    .list01 li + li{margin-top: 15px;}
    .list01 li::before{left: 10px; background: #c3a399;}
    .list01 li.none::before{display: none;}

    .list02{margin: 0; margin-top: 20px; }
    .list02_02 > li > p{font-size: 16px;}
    .list02_01{grid-template-columns: 1fr; padding: 16px; margin: 0; margin-top: 20px;}
    .list02_02{grid-template-columns: 1fr; padding: 16px; margin: 0; margin-top: 20px;}

    .list03{flex-direction: column; padding: 0; border-top: none;}
    .list03 + .list03{margin-top: 40px;}
    .list03 li{word-break: keep-all;}
    .list03 .tit{border-bottom: 2px solid #2e2e2e; padding-bottom: 5px; margin-bottom: 20px; font-size: 20px; display: flex;}
    .list03 .tit span{font-size: 20px;}
    .list03 > ul{width: 100%;}

    
    .list04{flex-direction: column; padding-left: 10px; box-sizing: border-box; margin-top: -30px;}
    .list04::before{top: 53%; transform: translateY(-50%); left: 0; height: 80%; width: 2px;}
    .list04 li{width: 100%; flex-direction: row;}
    .list04 li::before{left: -15px; top: 50%; transform: translate(0, 50%); width: 10px; height: 10px;}
    .list04 li .tit {font-size: 18px; display: flex; flex-direction: column; justify-content: center;}
    .list04 li.last .tit{font-size: 18px;}
    .list04 li .tit span{font-size: 16px; word-break: keep-all; margin-top: 0;}
    .list04 li .left{margin-left: 20px;}
    .list04 li .des01{padding-left: 0;}
    .list04 li .des01 p{font-size: 16px; word-break: keep-all; }
    .list04 li .des01 span{font-size: 16px;}
    .list04 li:nth-child(4) .des01{padding: 0;}

    .list06{grid-template-columns:repeat(1, 1fr) !important; gap: 0px;}
    .list06 li .ul_img{bottom: 50px; width: 100px;}
    .list06 li > ul{width: 70%; word-break: keep-all;}

    .series_list li{flex-direction: column; }
    .series_list .info{margin-top: 10px;}
    .series_thumb{width: 100%; margin: 0;}
    /* 테이블 */
    /* 공론화와 사회적 대화 */
    .table03_01{width: 100%;}
    .table03_01 .tit{padding: 10px;}
    .table03_01 td{padding: 10px;}

    .table01 td{padding: 10px;}

    .table02 th{padding: 10px;}
    .table02 td{padding: 10px;}
    .table02 td .link_page{display: flex; font-size: 14px;}

    .table03{width: 100%; font-size: 14px;}
    .table03 td{padding: 10px;}
    .table03 td b{font-size: 16px !important;}

    .board-util{position: static; flex-direction: column; margin-top: 30px;}
    .board-util .btn01{width: 50px; text-align: center; margin-left: auto; font-size: 16px; }
    .board-util .board-search{flex-direction: column;}

  }