/* ========== common ========== */
/* gnb */
#gnb .gnb_oparea { transform: translateX(-100%); width: 90vw; }
#gnb .gnb_oparea.on { transform: translateX(0%); transition: all 0.5s; }
#m_logo { display: block; width: 100%; }
#m_logo a { margin-left: 25px; }
#m_logo a img { width: 160px; margin-top: 10px; }
.login { width: 40%; margin: 0 auto; margin-bottom: 20px; }
.login ul { width: 100%; margin-left: 0 !important; justify-content: space-between; }
#gnb .title { width: 90%; }
/* 모바일 메뉴 버튼 */
.nav .menu_wrap { display: block; }
.menubt { display: flex; justify-content: space-between; flex-direction: column; width: 25px; height: 23px; position: absolute; top: 22px; right: 6%; }
.menubt .bar1, .menubt .bar2, .menubt .bar3 { margin-top: 3px; background: #415670; width: 25px; height: 4px; -webkit-transform: rotate(-180deg); transform: rotate(-180deg); transition: all 0.5s ease; z-index: 1000; }
.menubt.active .bar1 { position: absolute; top: 8px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); background: #fff; }
.menubt.active .bar2 { opacity: 0; }
.menubt.active .bar3 { position: absolute; bottom: 8px; -webkit-transform: rotate(45deg); transform: rotate(45deg); background: #fff; }


/* ========== index.php ========== */


/* ========== notice.php ========== */
.wrap { width: 90%; margin: 50px auto; padding: 50px 10px; }
.wrap h1 { margin-bottom: 50px; }
.wrap table th:nth-child(1) { width: 30px; }
.wrap table td:nth-child(2) { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.wrap table th:nth-child(3) { width: 100px; }
.wrap table th:nth-child(4) { width: 40px; }


/* ========== notice_write.php ========== */
#write_wrap { width: 90%; margin: 50px auto; padding: 50px 10px; }
#write_tbl .write_input, select { width: 85%; }
.upload-name1, #write_tbl .upload-name2 { width: 50%; }
.file_label1, .file_label2 { padding: 10px; font-size: 0.66em !important; margin-left: 0px; }
#write_tbl label { font-size: 0.66em !important; margin-left: 0; }
.ck-editor__editable { height: 300px; max-height: 300px; }
.ck.ck-editor { max-width: 100%; width: 90%; }


/* ========== notice_view.php ========== */
#write_wrap .tit { margin-top: 50px; }
#write_wrap .btn_area { display: flex; justify-content: center; }
#write_wrap .btn_area .right { float: none; }
#write_wrap .info { padding: 0; }
#write_wrap .info ul { width: 95% !important; margin: 0 auto; justify-content: space-between !important; }
#write_wrap .link .link_txt { width: 22%; }


/* ========== staff_list.php ========== */
.staff { width: 90%; margin: 50px auto; padding: 50px 10px; }
.staff h1 { margin-bottom: 50px; }
table th, td { line-height: 25px; }
.list_table { width: 100%; margin: 0 auto; font-size: 0.6em; }
.list_table thead th { padding: 0; }
.list_table tbody td { padding: 0; }
.list_table .btn_area { width: 100%; }
.staff table th:nth-child(1) { width: 20px; }
.page_num li b { width: 25px; height: 25px; line-height: 25px; }


/* ========== staff_view.php ========== */
#member_wrap { width: 90%; margin: 50px auto; padding: 50px 10px; }
.join_form .form1 { display: block; width: 97.5% !important; padding: 0; }
#member_wrap .member .join_form .form1 .col1 { width: 100%; }
.join_form .form2 { padding: 0; }
.join_form .form2 .label { width: 100px !important; height: 100%; }
.join_form .form2 .col1 { margin-bottom: 10px; }
.join_form .form2 .col2 { width: 200px !important; }
.join_form .line4 { display: block; width: 100%; height: 1px; background-color: #b9c2d1; margin-bottom: 10px; }
.member .join_form .form2 .label::after { height: 60px; }


/* ========== staff_register.php ========== */
.join_form .form1 .col1 { width: 100%; }
.join_form .form1 .col1 input[type="text"], .join_form .form1 .col1 input[type="date"], .join_form .form1 .col1 input[type="password"] { width: 100%; }
.join_form .form1 .col1 input.email { width: 40%; }
.join_form .form1 .col1 div.email { width: 60%; }
.join_form .form1 .col1 div.phone { width: 200px; }
.join_form .form1 .col1 input.phone { width: 25.5%; }
.join_form .form1 .col1 .ex_txt { margin-bottom: 10px; }
.join_form .form2 input[type="text"], .join_form .form2 #extraAddress { width: 100%; }
.join_form .form2 input#postcode { width: 40%; }
.join_form .form2 input[type="button"] { font-size: 0.69em; width: 80px; }
.join_form input[type="button"], .join_form input[type="submit"], .join_form .join_btn ul li a { width: 100px; }


/* ========== regulations ========== */
.rgl_fmt { position: relative; top: 30px; height: auto; width: 100%; font-size: 0.88em; }
.rgl_fmt .fmt_download ul { flex-wrap: wrap; margin-left: 20px; }
.regulations { width: 90%; margin: 50px auto; padding: 50px 10px; background-size: 80%; }
.regulations h1 { line-height: 60px; }
.regulations .rgl_top .top_left img { width: 150px; }
.regulations .rgl_top .top_right { font-size: 0.6em; line-height: 18px; margin-top: 2px; }
.regulations .rgl_wrap .rgl_cont img { width: 100% !important; }
.rgl_fmt .fmt_download ul li { margin-right: 20px;}
.rgl_fmt .fmt_download ul li a {display: block; height: 50px; line-height: 50px; font-size: 0.88em; }
.regulations .rgl_bottom { font-size: 0.88em; }


/* ========== duty.php ========== */
.duty { width: 90%; margin: 50px auto; padding: 50px 10px; }
.duty h1 { margin-bottom: 50px; }
.duty .duty_wrap { display: block; width: 80%; }
.duty .duty_wrap .duty_img { flex-direction: row; width: 100%; margin-bottom: 30px; }
.duty .duty_wrap .duty_img img { width: 40px; }
.duty .duty_wrap .duty_img h2 { margin-top: 0; margin-left: 10px; }
.duty .duty_wrap .duty_txt { margin-left: 0; }
.duty .duty_wrap .duty_txt .duty_list { display: block; }
.duty .duty_wrap .duty_txt .duty_list p { width: auto; }
.div_duty { width: 90%; margin: 50px auto; padding: 50px 10px; }
.duty_w80 img { width: 100% !important; }