/* sub-visual */
.sub-visual { padding-block: 180px 40px;}
.sub-visual .inner { padding: 0; max-width: 1460px; margin: 0 auto; width: 90%;}
.sub-visual .heading { line-height: 1.2; margin-bottom: 24px;}
.sub-visual .sbj { font-size: 24px; margin-bottom: 32px;}
.sub-visual .desc { color: #666;}

.sub-visual.wr { padding-bottom: 80px; border-bottom: 1px solid #ddd;}
.sub-visual.login { text-align: center; padding-bottom: 20px;}
.sub-visual.login .heading { margin-bottom: 0; line-height: 1;}
.sub-visual.login .sbj,
.sub-visual.login .desc { display: none;}
.sub-visual.mypage { display: none;}
.sub-visual.thelayer .inner { width: 100%; max-width: 100%; padding: 0 80px;}
@media screen and (max-width: 1024px) {
  .sub-visual.thelayer .inner { padding: 0 30px;}
}
@media screen and (max-width: 767px) {
  .sub-visual { padding: 130px 0 40px;}
  .sub-visual.thelayer .inner { padding: 0 20px;}
  .sub-visual .sbj { font-size: 20px; margin-bottom: 15px;}
}


/* board */
#bo_list,
#bo_gall { max-width: 1460px; margin: 0 auto; width: 90%; padding-bottom: 170px;}
#bo_list *:not(i) { font-family: "Pretendard";}
.board_wr { border: none; margin: 0; border-radius: 0;}
#bo_top { display: flex; margin-bottom: 42px;}
#bo_sch { display: block !important; position: relative; top: 0; left: 0; padding: 0; margin-left: auto; width: auto;}
.btn_close { display: none;}
.btn_bosch_op { display: none;}
#bo_cate { display: flex; margin-bottom: 40px;}
#bo_cate a { border: 1px solid #ddd; border-radius: 35px; font-size: 20px; font-weight: 500; color: #666; width: 135px; height: 52px; font-family: 'Teko' !important; display: flex; align-items: center; justify-content: center;}
#bo_cate #bo_cate_on { border: 3px solid var(--accent-color); color: var(--accent-color); background: transparent;}
#bo_cate ul { margin: 0;}
#bo_cate ul li + li { margin-left: 10px;}
form[name="fsearch"] { display: flex; gap: 15px;}
#bo_sch .sfl { position: relative;}
#bo_sch .sfl:after { content:''; position: absolute; top: 50%; right: 29px; width: 12px; height: 11px; background: url(/images/ico-select-arrow.svg) no-repeat center/auto 100%;  transform: translateY(-50%);}
#bo_sch .sort { position: relative;}
#bo_sch .sort:after { content:''; position: absolute; top: 50%; right: 29px; width: 12px; height: 11px; background: url(/images/ico-select-arrow.svg) no-repeat center/auto 100%;  transform: translateY(-50%);}
#bo_sch select { position: relative; background: transparent; height: 52px; border-radius: 35px; float: left; border: 1px solid #ddd; padding: 0 43px 0 29px; font-size: 16px; color: #000; width: auto; min-width: 135px;}
#bo_sch .search-box { position: relative; width: 410px; border-radius: 35px; border: 1px solid #ddd; padding: 5px 47px 5px 28px;}
#bo_sch .sch_input { background: transparent; height: 100%; padding: 0; width: 100%; border: 0; border-radius: 0;}
#bo_sch .sch_input::placeholder { color: #707070; font-size: 16px;}
#bo_sch .sch_btn { width: 18px; height: 18px; top: 50%; right: 29px; transform: translateY(-50%); background: url(/images/ico-search.svg) no-repeat center/auto 100%;}
.bo_total { font-size: 16px; place-content: end;}
.bo_total span { vertical-align: baseline; font-weight: 600; color: #487F84; margin-right: -3px;}
input[type=text].frm_input::placeholder, input[type=tel].frm_input::placeholder, input[type=email].frm_input::placeholder, input[type=password].frm_input::placeholder, input[type=submit].frm_input::placeholder { color: #aaa;}
@media screen and (max-width: 1024px) {
  #bo_top { flex-wrap: wrap; gap: 10px; margin-bottom: 20px;}
  form[name="fsearch"] { flex-wrap: wrap; gap: 10px;}
  #bo_sch .search-box { height: 52px;}
}
@media screen and (max-width: 767px) {
  #bo_list, #bo_gall { padding-bottom: 100px;}
  .bo_total { font-size: 14px;}
  #bo_sch { width: 100%;}
  form[name="fsearch"] { gap: 5px;}
  #bo_sch .search-box { width: auto; padding: 5px 30px 5px 15px; height: 42px; }
  #bo_sch select { height: 42px; min-width: 90px; padding: 0 30px 0 15px; font-size: 14px;}
  #bo_sch .sfl:after { right: 20px; width: 8px; height: 7px;}
  #bo_sch .sort:after { right: 20px; width: 8px; height: 7px;}
  #bo_sch .sch_input::placeholder { font-size: 14px;}
  #bo_sch .sch_btn { width: 12px; height: 12px;}
  #bo_cate a { font-size: 16px; width: auto; padding: 2px 20px; height: auto;}
  #bo_cate li { margin: 0;}
}

.al_chk { padding: 15px 40px;}
.bo_btn { border: none; height: max-content; padding: 0; margin-bottom: 20px;}
.bo_btn li a { width: fit-content; padding: 8px 27px; border-radius: 35px; border: 1px solid #ddd; display: flex; align-items: center; line-height: normal; font-weight: 600;}
.bo_ul { border-top: 2px solid #000;}
.bo_ul li { background: transparent; padding: 0;}
.bo_ul li a { padding: 33px 40px; display: flex; flex-direction: column; border-bottom: 1px solid #ddd; border-top: none;}
.bo_ul li a.pin { background: #FAF8F7;}
.bo_info { float: none; width: auto; text-align: left;}
.bo_cate_link { display: block; font-family: 'Kanit' !important; font-size: 16px; margin-bottom: 11px; color: #487F83 !important; font-weight: 600;}
.bo_ul li a.NOTICE .bo_cate_link { color: var(--accent-color) !important;}
.bo_ul li a.EVENT .bo_cate_link { color: #487F83 !important;}
.bo_subject { font-size: 22px; font-weight: 600; margin-bottom: 15px; width: auto;}
.bo_subject a { display: flex; align-items: center;}
.bo_subject .text { display: flex; gap: 12px; align-items: center;}
.bo_date { font-size: 16px; color: #666;}
.bo_name { position: relative; font-size: 16px; font-weight: 500; padding-right: 20px;}
.bo_name.v2 { position: static; padding-right: 10px;}
.bo_name::after { content: ''; display: block; position: absolute; top: 50%; right: 0; width: 1px; height: 10px; background: #D9D9D9; transform: translateY(-50%);}
.bo_hit { padding-left: 10px;}
#bo_v_con { font-size: 17px; user-select: none; -webkit-user-drag: none;}
.bo_v_nb { margin: 60px 0 98px; display: flex; justify-content: space-between; gap: 20px;}
.bo_v_nb::after { display: none;}
.bo_v_nb li { width: calc(50% - 10px); color: #666; font-size: 16px;}
.bo_v_nb li a { white-space: normal; padding: 0; overflow: visible; text-overflow: inherit;}
.bo_v_nb li .nb-label { display: block; font-family: 'Kanit' !important; font-weight: bold; font-size: 36px; margin-bottom: 20px; color: #000;}
.bo_v_nb li .nb-content { width: 100%; display: flex; gap: 15px;}
.bo_v_nb li .nb-content .nb-img { flex: 0 0 38%; aspect-ratio: 1.37;}
.bo_v_nb li .nb-content .nb-img img { width: 100%; height: 100%; object-fit: cover;}
.bo_v_nb li .nb-content .nb-sbj { font-weight: 500; margin-bottom: 16px; line-height: 1;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; color: #000; width: 100%;}
.bo_v_nb li .nb-content .nb-desc { font-size: 16px; line-height: 1.5; color: #666; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; width: 100%; text-align: left;}
.bo_v_nb li.bo_v_prev .nb-text { margin-right: auto; word-break: break-all; width: calc(62% - 15px);}
.bo_v_nb li.bo_v_next .nb-text { margin-left: auto; word-break: break-all; width: calc(62% - 15px); text-align: right;}
.bo_v_nb li.bo_v_next .nb-label { text-align: right;}
@media screen and (max-width: 1024px) {

}
@media screen and (max-width: 767px) {
  .bo_ul li a { padding: 30px 0;}
  .bo_subject .text { font-size: 20px;}
  .bo_subject .text > img { max-width: 40px; aspect-ratio: 1/ 0.5; object-fit: cover;}
  .bo_cate_link { font-size: 14px;}
  .bo_date { font-size: 14px;}
  .bo_v_nb { gap: 20px;}
  .bo_v_nb li { width: calc(50% - 10px);}
  .bo_v_nb li.bo_v_next .nb-text { width: 100%;}
  .bo_v_nb li.bo_v_prev .nb-text { width: 100%;}
  .bo_v_nb li .nb-label { font-size: 26px;}
  .bo_v_nb li .nb-content .nb-desc,
  .bo_v_nb li .nb-content .nb-sbj { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; font-size: 16px;}
  .bo_v_nb li .nb-content .nb-desc { font-size: 14px;}
  .bo_v_nb li .nb-content .nb-img { display: none;}
}

.mbskin { width: 90%; overflow: hidden;}
#bo_w { max-width: 1460px; width: 90%; margin: 0 auto; padding: 0 0 100px;}
#bo_vc_w { margin: 0;}
#bo_vc_w > h2 { font-size: 20px; font-weight: 700; margin-bottom: 40px;}
#bo_vc_w > h2 span { vertical-align: baseline;}
#bo_vc_w > .name { font-size: 16px; font-weight: 500; margin-bottom: 22px;}
.bo_vc_w { margin: 0;}
.bo_vc_w textarea { background: #F2F2F2; padding: 16px 20px; height: 100px; border: none;}
.bo_vc_w textarea::placeholder { font-size: 16px; font-weight: 500; color: #adadad;}
.bo_vc_w .btn_confirm { position: absolute; bottom: 16px; right: 16px; margin: 5px 0 0;}
.bo_vc_w .btn_confirm input[type=submit] { background: #DBDBDB; padding: 2px 17px; border-radius: 35px; font-size: 14px; font-weight: 500; color: #fff; height: 33px; border: none;}
#bo_vc_w { padding-bottom: 40px; border-bottom: 1px solid #ddd;}
#bo_vc { margin: 0 !important;}
#bo_vc article { padding: 40px 0; border-bottom: 1px solid #ddd; margin: 0;}
#bo_vc article.child,
#bo_vc article.last { padding: 32px 0;}
#bo_vc article.child::before { content: ''; display: block; width: 1px; height: 100%; position: absolute; top: 0; left: -25px; background: #ddd;}
#bo_vc article.child.first::before { content: ''; display: block; width: 1px; height: calc(100% - 32px); top: auto; position: absolute; bottom: 0; left: -25px; background: #ddd;}
#bo_vc article.last::before { content: ''; display: block; width: 1px; height: calc(100% - 32px); position: absolute; top: 0; left: 20px; background: #ddd;}
#bo_vc header { display: flex; flex-direction: column; font-size: 14px; font-weight: 400; color: #6b6b6b; margin-bottom: 20px; padding-left: 0 !important;}
#bo_vc header .member { font-size: 16px; font-weight: 500; line-height: 1.2; margin-bottom: 12px; color: #101010;}
.member-name { position: relative; width: fit-content; cursor: pointer; margin-right: auto;}
.member-name button { position: absolute; left: 50%; top: calc(100% - 5px); transform: translateX(-50%); padding: 25px 40px 17px; background: url(/images/bubble3.png) no-repeat center/ 100% 100%; font-size: 14px; color: #242424; opacity: 0; visibility: hidden;}
.member-name:hover .member { text-decoration: underline; text-underline-offset: 5px;}
.member-name:hover button { opacity: 1; visibility: visible; transition: all .3s;}
#bo_v_info .member-name { padding-bottom: 10px;}
#bo_vc .cmt_contents { padding: 0; margin: 0; font-size: 16px; font-weight: 400; color: #242424; border: none;}
#bo_vc .cmt_contents p { font-size: inherit; display: flex; align-items: center; flex-wrap: wrap;}
#bo_vc .cmt_contents p .reply_to { color: #F2911B; font-weight: 500; margin-right: 3px;}
#bo_vc .cmt_opt { display: flex; align-items: center; justify-content: center; transform: rotate(90deg); top: 30px;}
#bo_vc .bo_vl_act { top: 65px; right: -57px; box-shadow: none; border: none; border-radius: 5px; width: 142px; padding: 10px 5px 5px;}
#bo_vc .btn_edit li { padding: 0; border: none;}
#bo_vc .btn_edit li a { padding: 7px 10px; line-height: normal; font-size: 14px !important; text-align: center; color: #242424;}
#bo_vc .btn_edit::before { content: ''; position: absolute; width: 120%; height: 120%; background: url(/images/bubble.png) no-repeat center / auto 100%; left: 50%; top: 50%; transform: translate(-50%, -50%);}
#bo_vc .btn_edit li:last-child a { color: #C94A4A;}
#bo_vc .bo_group { display: flex; align-items: center; gap: 30px; margin-top: 20px;}
#bo_vc .bo_group > div { display: flex; align-items: center; font-size: 16px; font-weight: 400; color: #6b6b6b;}
#bo_vc .bo_group a { font-size: 16px; font-weight: 500;}
.btn_edit li a { line-height: 40px; display: block;}
span[id^="edit_"],
span[id^="reply_"] { display: none; margin-top: 32px; position: relative;}
span[id^="edit_"] .btn_cancel,
span[id^="reply_"] .btn_cancel { background: transparent; border: none; color: #242424; font-size: 14px; font-weight: 500; position: absolute; bottom: 16px; right: calc(98px + 15px); z-index: 2;}
span[id^="edit_"] textarea,
span[id^="reply_"] textarea { height: 146px; margin-top: 10px;}
@media (hover: hover) and (pointer: fine) {
  .bo_vc_w .btn_confirm input[type=submit]:hover { background: #222; color: #fff;}
}
#bo_v { max-width: 860px; margin: 0 auto; width: 90% !important; padding: 80px 0 140px; border: none;}
#bo_v header { display: flex; justify-content: space-between;}
#bo_v header .controls { display: flex; gap: 10px;}
#bo_v header .controls a { width: fit-content; padding: 8px 27px; border-radius: 35px; border: 1px solid #ddd; display: flex;align-items: center;line-height: normal;font-weight: 600; height: fit-content;}
#bo_v *:not(i) { font-family: 'Pretendard';}
#bo_v_title { font-size: 18px; padding-top: 0;}
#bo_v_title .bo_v_tit { font-size: 40px; font-weight: 600; margin: 0 0 40px; line-height: 1.5;}
#bo_v_title .bo_v_tit > img { vertical-align: baseline;}
#bo_v_info { padding: 0; margin-bottom: 40px;}
.bo_v_cate { font-size: 20px; display: block; margin: 0 0 20px; text-align: center; font-weight: bold;}
#bo_v.EVENT .bo_v_cate { color: #487F83; }
#bo_v.NOTICE .bo_v_cate { color: var(--accent-color); }
#bo_v_info { display: flex; align-items: center; justify-content: flex-start;; gap: 16px; border: none;}
#bo_v .btn_b03 { width: 163px; height: 58px; border-radius: 35px; background: #222; color: #fff; font-weight: 500; text-align: center; place-content: center; display: block; margin: 80px auto 0;}
.bo_view-date { position: relative; padding-right: 16px;}
.bo_view-date::after { content:''; display: block; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 10px; background: #D9D9D9;}
#bo_v_atc { padding: 0; margin: 20px 0;}
.view-actions { display: flex; padding: 21px 0; border-block: 1px solid #ddd;}
#bo_v_act { margin: 0; text-align: left;}
#bo_v_share { margin-left: auto; margin-right: 20px; margin-bottom: 0;}
#bo_v_share .btn_scrap { line-height: normal; border: none; float: none; padding: 0; border-radius: 0;}
#bo_v_act .bo_v_good { border: none; color: #6B6B6B; padding: 0; font-weight: 400;}
#bo_v_act .bo_v_good strong,
#bo_v_act .bo_v_good .accent { font-weight: 600; color: #487F83; vertical-align: baseline;}
.tooltip-trigger { position: relative; opacity: 0.5;}
.tooltip-trigger::before { content: attr(data-tooltip); position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: #242424; color: white; padding: 8px 9px; border-radius: 4px; font-size: 14px; white-space: nowrap; opacity: 0; visibility: hidden; transition: all 0.2s ease; margin-bottom: 10px; z-index: 9;}
.tooltip-trigger::after { content: ''; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); border: 5px solid transparent; border-top-color: #333; opacity: 0; visibility: hidden; transition: all 0.2s ease; z-index: 9;}
.tooltip-trigger:hover::before,
.tooltip-trigger:hover::after { opacity: 1; visibility: visible;}
@media (hover: hover) and (pointer: fine) {
  .tooltip-trigger:hover { opacity: 1;}
  #bo_v_share .btn_scrap:hover { background: transparent;}
}
@media screen and (max-width: 767px) {
  #bo_v { padding-bottom: 60px;}
  #bo_v_title .bo_v_tit { font-size: 24px;}
  #bo_v_share { margin-right: 5px;}
  #bo_v header { flex-wrap: wrap-reverse; gap: 30px;}
  #bo_v header .controls { margin-left: auto;}
  #bo_v .btn_b03 { width: 93px; height: 38px;}
  #bo_v_title .bo_v_tit > img { vertical-align: sub;}
}

#bo_gall *:not(i) { font-family: "Pretendard";}
#bo_gall .gall_li .gall_img .no-img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; padding: 0; align-content: center;}
#bo_gall #gall_allchk { margin: 0 0 10px;}
#bo_gall #gall_ul { margin: 0; padding: 18px 0 0 0; border-top: 1px solid #242424; margin-bottom: 60px;}
#bo_gall #gall_ul:after { content: none;}
#bo_gall .gall_li { width: 100%; float: none; padding: 0;}
#bo_gall .gall_li article > a { display: flex; padding-block: 32px; border-bottom: 1px solid #ddd;}
#bo_gall .gall_li article .gall_img { flex: 0 0 39.2%;}
#bo_gall .gall_li article figure { padding-bottom: 59%;}
#bo_gall .gall_li article .gall_text_href { flex: 1; padding: 0 0 0 40px;}
#bo_gall .gall_li article .gall_text_href .sbj { font-size: 28px; font-weight: 600; margin-bottom: 16px;}
#bo_gall .gall_li article .gall_text_href .desc { font-size: 16px; color: #666; font-weight: 400; margin-bottom: 32px;}
#bo_gall .gall_li .gall_img img { height: 100%; object-fit: cover;}
#bo_gall .gall_info { display: flex; gap: 20px;}
#bo_gall .gd_rc { position: static; padding: 0; background: transparent; color: #6B6B6B; line-height: normal; margin: 0;}
#bo_gall .gall_li_tit { margin: 0;}
#bo_gall .gd_rc i { vertical-align: baseline; margin-right: 4px;}
#bo_gall .bo_view i { vertical-align: baseline; margin-right: 4px;}
#bo_gall.art #gall_ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); grid-auto-rows: 1fr; gap: 84px 20px;}
#bo_gall.art #gall_ul .gall_li article > a{ padding: 0; flex-direction: column; border: none;}
#bo_gall.art #gall_ul .gall_li article figure { padding-bottom: 123%; margin-bottom: 32px;}
#bo_gall.art #gall_ul .gall_li article .gall_text_href { padding: 0;}
#bo_gall.art #gall_ul .text-header { display: flex; justify-content: space-between; margin-bottom: 20px; align-items: center;}
#bo_gall.art #gall_ul .text-header .category-name { font-size: 16px; font-weight: 600; color: #487F83;}
#bo_gall.art #gall_ul .text-header .new { padding: 8px 20px; font-size: 14px; font-weight: 600; line-height: 1.2; color: #fff; border-radius: 35px; background: #EC8C48;}
@media screen and (max-width: 1024px) {
  #bo_gall .gall_li article .gall_text_href .sbj { font-size: 24px;}
}
@media screen and (max-width: 767px) {
  #bo_gall #gall_ul { padding: 0; margin: 0;}
  #bo_gall.art #gall_ul { gap: 50px 20px;}
  #bo_gall.art #gall_ul .gall_li article > a { flex-direction: row;}
  #bo_gall .gall_li article > a { flex-wrap: wrap; gap: 20px; flex-direction: row;}
  #bo_gall.art #gall_ul .gall_li article figure { padding-bottom: 100%; margin-bottom: 0;}
  #bo_gall .gall_li article .gall_img { flex: 0 0 100%;}
  #bo_gall .gall_li article .gall_text_href { padding: 0;}
  #bo_gall .gall_li article .gall_text_href .sbj { font-size: 20px;}
}
/* mypage */
.mypage { padding-top: 80px; display: flex;}
.mypage h1.title { font-size: 32px; font-weight: 700; margin-bottom: 28px; display: flex; gap: 21px; line-height: 1;}
.mypage h1.title .label { font-size: 16px; font-weight: 500; background: #008290; color: #fff; padding: 5px 20px; border-radius: 35px; place-content: center;}
.mypage h1.title .msg { font-size: 16px; font-weight: 400; align-self: flex-end;}
.mypage h1.title .msg .accent { font-weight: 600;}
.mypage h2.title { font-size: 24px; font-weight: 700; line-height: 1.5; padding: 0 0 20px; border-bottom: 1px solid #ddd; background: transparent; margin-bottom: 20px;}
.mypage h2.title .msg { font-size: 16px; font-weight: 400; align-self: flex-end; margin-left: 24px; color: #333;}
.mypage h2.title.v2 { border: 0; padding: 0; margin-bottom: 40px;}
.mypage h2.title.v2 span.msg { font-size: 16px; color: #333; margin-left: 22px; font-weight: 400;}
.mypage h2.title.v2 span.msg .accent { font-weight: 600;}
.mypage * { font-family: 'Pretendard';}
.mypage .submit { width: 163px; height: 58px; background: #222; color: #fff; margin: 40px auto 0; display: block; font-weight: 500; border-radius: 35px;}
.mypage-links { padding: 120px 80px 120px 150px; background: #F7F7F7; border-right: 1px solid #ddd;}
.mypage-links .heading { margin-bottom: 40px; font-family: 'Teko'; line-height: 1.2;}
.mypage-links .swiper-wrapper { flex-direction: column;}
.mypage-links .swiper-slide { width: auto; height: auto;}
.mypage-links .swiper-slide + .swiper-slide { margin-top: 8px;}
.mypage-links a { display: block; width: 260px; height: 72px; padding: 5px 48px 5px 40px; background: #fff; border-radius: 35px; font-weight: 700; display: flex; align-items: center; font-family: 'Pretendard'; position: relative; color: #666;}
.mypage-links a::after { content: ''; display: block; position: absolute; top: 50%; right: 24px; width: 24px; height: 24px; background: url(/images/ico-arrow.svg)no-repeat center/auto 100%; transform: translateY(-50%); filter : invert(.5);}
.mypage-links a.active { color: #fff; background: #222;}
.mypage-links a.active::after { filter: invert(1);}
.mypage a.btn_cancel { background: #fff; font-weight: 500;}
.mypage button[type='submit'] { font-weight: 500;}
.mypage input[type=text].frm_input,
.mypage input[type=tel].frm_input,
.mypage input[type=email].frm_input,
.mypage input[type=password].frm_input,
.mypage input[type=submit].frm_input { background: #fff;}
.mypage input[type=text].frm_input[disabled],
.mypage input[type=tel].frm_input[disabled],
.mypage input[type=email].frm_input[disabled],
.mypage input[type=password].frm_input[disabled],
.mypage input[type=submit].frm_input[disabled] { background: #F8F8F8;}
.mypage input[type=text]::placeholder,
.mypage input[type=tel]::placeholder,
.mypage input[type=email]::placeholder,
.mypage input[type=password]::placeholder,
.mypage textarea::placeholder { color: #333; font-size: 16px;}
.mypage textarea { margin: 4px 0; padding: 28px; border:1px solid #ddd; font-weight: 500; font-size: 16px; border-radius: 20px; color: #333;}
.mypage .select-box { position: relative; width: max-content;}
.mypage .select-box::after { content: ''; display: block; position: absolute; top: 50%; right: 28px; transform: translateY(-50%) rotate(90deg); background: url('/images/ico-arrow.svg') no-repeat center/auto 100%; width: 24px; aspect-ratio:1; z-index: -1;}
.mypage .input-group { display: flex;}
.mypage .input-group input[type="email"] { width: auto; flex: 1;}
.mypage .input-group button { width: 195px; background: var(--accent2-color); color: #fff; font-size: 16px; font-weight: 500; border-radius: 35px; margin-left: 20px;}
.mypage-right { padding: 120px 5% 140px; flex: 1; max-width: 1320px;}
.mypage .file-display { flex: 1;}
.mypage .file-name { width: 100%; margin: 4px 0; height: 55px; padding: 5px 28px; border: 1px solid #ddd; background: #fff; font-weight: 500; font-size: 16px; border-radius: 35px; place-content: center; color: #666;}
.mypage .file-name.active { color: inherit;}
.mypage .file-info { font-size: 14px; color: #333; margin-top: 6px;}
.mypage select { width: 320px; margin: 4px 0; height: 55px; padding: 5px 60px 5px 28px; border: 1px solid #ddd; font-weight: 500; font-size: 16px; border-radius: 35px; display: block; color: #333; cursor: pointer;}
.mypage .total-txt { font-size: 16px; font-weight: 400;}
.mypage .total-txt span { font-weight: 600; vertical-align: baseline;}
.mypage .checkbox-label { display: flex; align-items: center; cursor: pointer; user-select: none; }
.mypage .checkbox-label .custom-checkbox { display: none; }
.mypage .checkbox-box { width: 20px; height: 20px; border: 1px solid #ddd; position: relative; transition: all 0.2s ease;}
.mypage .checkbox-box::after { content: ''; position: absolute; left: 6px; top: 2px; width: 6px; height: 10px; border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); opacity: 0; transition: opacity 0.2s ease;}
.mypage .custom-checkbox:checked + .checkbox-box { background-color: #007bff; border-color: #007bff; }
.mypage .custom-checkbox:checked + .checkbox-box::after { opacity: 1;}
.mypage .btn-remove { padding: 8px 20px; border-radius: 5px; border: 1px solid #ddd; display: flex; align-items: center; gap: 4px;}
.mypage .report-box { padding: 6px 8px; border-radius: 2px; border: 1px solid #ddd; font-size: 14px; display: flex; align-items: center; gap: 4px; cursor: pointer;}
@media screen and (max-width: 1280px) {
  .mypage { flex-direction: column;}
  .mypage-links { padding: 100px 60px; overflow: hidden;}
  .mypage-links .swiper { overflow: visible;}
  .mypage-links .swiper-wrapper { flex-direction: row;}
  .mypage-links .swiper-slide + .swiper-slide { margin-top: 0;}
}
@media screen and (max-width: 1024px) {
  .mypage-links { padding: 100px 30px;}
  .mypage-links a { width: auto; height: 50px; padding: 5px 48px 5px 20px;}
  .mypage-links a::after { right: 15px;}
}
@media screen and (max-width: 767px) {
  .mypage h2.title { font-size: 20px; margin-bottom: 20px;}
  .mypage h2.title.v2 { margin-bottom: 20px;}
  .mypage h2.title .msg { margin-left: 0; font-size: 14px; margin-top: 5px;}
  .mypage-links { padding: 60px 20px;}
  .mypage-right { padding: 60px 20px 100px;}
  .mypage-links a { height: 40px;}
  .mypage h1.title { font-size: 24px; flex-wrap: wrap;}
  .mypage .select-box { width: 100%;}
  .mypage .select-box::after { right: 15px;}
  .mypage textarea { padding: 20px 15px; font-size: 14px;}
  .mypage textarea::placeholder { font-size: 14px;}
  .mypage .file-name { height: 40px; padding: 5px 20px; font-size: 14px;}
  .mypage .file-upload-row { flex-direction: column;}
  .mypage .submit { width: 110px; height: 40px;}
  .mypage select { width: 100%; height: 40px; font-size: 14px; padding-left: 15px;}
  .qna .form-row { flex-wrap: wrap;}
  .mypage input[type=text]::placeholder,
  .mypage input[type=tel]::placeholder,
  .mypage input[type=email]::placeholder,
  .mypage input[type=password]::placeholder,
  .mypage textarea::placeholder { font-size: 14px;}
  .mypage .input-group button { width: 100%; height: 40px; margin: 0;}
}
/* member-form */
.member-form { padding: 120px 5% 140px; width: 100%; overflow: hidden;}
.member-form form { max-width: 1120px;}
.member-form .login_frm { width: 100%; max-width: 1120px;}
.member-form .login_frm ul { width: 100%; max-width: 712px;}
.mypage .sfl { position: relative; width: auto; margin-left: auto;}
.mypage .sfl select { width: auto; height: 48px; margin: 0;}
.mypage .sfl:after { content:''; position: absolute; top: 50%; right: 29px; width: 12px; height: 11px; background: url(/images/ico-select-arrow.svg) no-repeat center/auto 100%;  transform: translateY(-50%);}
.mypage .sch_input { background: transparent; height: 100%; padding: 0; width: 100%; border: 0; border-radius: 0;}
.mypage .sch_input::placeholder { color: #707070; font-size: 16px;}
.mypage .sch_btn { position: absolute; width: 18px; height: 18px; top: 50%; right: 29px; transform: translateY(-50%); background: url(/images/ico-search.svg) no-repeat center/auto 100%;}
@media screen and (max-width: 1024px) {
  .member-form { padding-top: 100px;}
}
@media screen and (max-width: 767px) {
  .member-form { padding-top: 60px; padding-bottom: 100px;}
  .mypage .sfl select { height: 40px;}
}

/* teacher */
.teacher-header { padding: 55px; background: #f7f7f7; display: flex; align-items: center; justify-content: center; font-weight: 500; font-size: 22px; border-radius: 10px; margin-bottom: 40px;}
.teacher-header span { font-weight: 600; vertical-align: baseline; color: var(--accent2-color);}
.teacher-header span.verified { color: #F2911B;}
.teacher-btns { display: flex;}
.teacher-btns button { flex: 1; font-size: 16px; height: 50px; border: 1px solid #ddd; border-radius: 10px 10px 0 0;}
.teacher-btns button.active { font-weight: 600; background: #222; color: #fff;}
.teacher-area { padding: 60px; display: none; border: 1px solid #ddd; border-top: 0; border-radius: 0 0 10px 10px;}
.teacher-area.active { display: block;}
.teacher .notice-box { background: #F7F7F7; border-radius: 10px; padding: 40px; margin-top: 20px;}
.teacher .notice-box p { font-size: 16px; font-weight: 400; line-height: 1.5;}
.teacher .notice-box .domain-list { margin: 16px 0; background: #EAEAEA; padding: 10px 18px; border-radius: 5px;}
.teacher .notice-box .small-text { font-size: 14px; font-weight: 400; color: #333;}
.teacher .notice-box .document-list { padding: 20px; background: #EAEAEA; margin: 16px 0; border-radius: 5px;}
.teacher .notice-box .document-list h4 { font-size: 16px; font-weight: 400; margin-bottom: 10px;}
.teacher .notice-box .document-list li { position: relative; padding-left: 16px; font-size: 16px; font-weight: 400; line-height: 1.5;}
.teacher .notice-box .document-list li::before { content: ''; display: block; position: absolute; top: 50%; left: 0; width: 4px; height: 4px; background: #101010; border-radius: 50%; transform: translateY(-50%);}
.teacher .notice-box .document-list li + li { margin-top: 4px;}
.teacher .result-content { padding: 60px; border-radius: 5px; border: 1px solid #ddd; text-align: center;}
.teacher .result-content h2.title { margin-bottom: 30px;}
.teacher .result-content p { font-size: 16px; font-weight: 400; line-height: 1.5;}
.teacher .result-content p + p { margin-top: 30px;}
.teacher .result-content p .accent2 { font-weight: 600;}
@media screen and (max-width: 767px) {
  .teacher-header { font-size: 18px; padding: 30px; flex-wrap: wrap;}
  .teacher-btns button { font-size: 14px;}
  .teacher-area { padding: 30px;}
  .mypage h2.title.v2 span.msg { margin-left: 0; margin-top: 15px;}
  .teacher-area .input-group { flex-wrap: wrap;}
  .teacher-area .input-group button { height: 40px; width: 100%; margin: 5px 0 0;}
  .teacher .notice-box { padding: 20px;}
  .teacher .notice-box p { font-size: 14px;}
  .teacher .notice-box .document-list li { font-size: 14px; padding-left: 10px;}
  .teacher .notice-box .document-list li::before { transform: none; top: 7px;}
  .teacher .result-content { padding: 30px;}
}

/* qna */
.qna label { display: block; margin-bottom: 12px; font-weight: 700;}
.qna .form-row { display: flex; gap: 20px; flex-wrap:wrap;}
.qna .form-row > * { flex: 1;}
.qna .form-row + .form-row { margin-top: 20px;}
@media screen and (max-width: 767px) {
  .qna .form-row > * { flex: 0 0 100%;}
}

/* scrap */
.scrap { padding: 120px 5% 140px; flex: 1; max-width: 1320px; width: 100%; overflow: hidden;}
.scrap-btns { display: flex;}
.scrap-btns a { flex: 1; font-size: 16px; height: 50px; border: 1px solid #ddd; border-radius: 10px 10px 0 0; display: flex; justify-content: center; align-items: center;}
.scrap-btns a.active { font-weight: 600; background: #222; color: #fff;}
.scrap-area { padding: 60px; display: none; border: 1px solid #ddd; border-top: 0; border-radius: 0 0 10px 10px;}
.scrap-area.active { display: block;}
.scrap .scrap-del { padding: 9px 18px; border:1px solid #ddd; border-radius: 5px; font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 4px; width: fit-content; margin-left: auto;}

.scrap.magazine .magazine-wrap { margin-bottom: 40px;}
.scrap.magazine .magazine-wrap article { padding: 20px 0; border-bottom: 1px solid #ddd;}
.scrap.magazine .magazine-wrap article .magazine-item { display: flex; gap: 40px;}
.scrap.magazine .magazine-img { width: 37%;}
.scrap.magazine .magazine-img img { width: 100%; height: 100%; object-fit: cover;}
.scrap.magazine .magazine-label { font-weight: 600; margin-bottom: 16px; font-family: 'Teko'; color: #F2911B;}
.scrap.magazine .magazine-sbj { font-size: 24px; font-weight: 600; margin-bottom: 16px;}
.scrap.magazine .magazine-desc { font-size: 16px; font-weight: 400; color: #666; margin-bottom: 32px;}
.scrap.magazine .magazine-info { display: flex; align-items: center; gap: 20px;}
.scrap.magazine .magazine-info * { font-size: 16px; color: #6b6b6b; font-weight: 400;}

.scrap.art .select-wrap { display: flex; align-items: center; gap: 24px; margin-bottom: 28px;}
.scrap.art .select-name { font-weight: 700;}
.scrap.art .select-box { flex: 1;}
.scrap.art .select-box select { width: 100%;}
.scrap.art .art-wrap { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 350px), 1fr)); grid-auto-rows: 1fr; gap: 28px 40px; margin-top: 20px; margin-bottom: 40px;}
.scrap.art .art-item { display: block; padding: 28px; background: #F9F9F9; margin-bottom: 8px;}
.scrap.art .art-label { font-size: 16px; font-weight: 600; color: var(--accent2-color); margin-bottom: 20px;}
.scrap.art .art-sbj { font-size: 20px; font-weight: 500; margin-bottom: 24px;}
.scrap.art .art-info { display: flex; align-items: center; font-size: 16px; color: #6b6b6b;}
.scrap.art .art-name { font-weight: 500;}
.scrap.art .art-line { width: 1px; height: 10px; background: #d9d9d9; margin: 0 20px;}
@media screen and (max-width: 767px) {
  .scrap { padding: 60px 20px 100px ;}
  .scrap-area { padding: 30px;}
  .scrap.art .select-wrap { flex-wrap: wrap; gap: 10px;}
  .scrap.art .select-wrap .select-box { flex: 0 0 100%;}
  .scrap.magazine .magazine-wrap article .magazine-item { flex-wrap: wrap; gap: 20px;}
  .scrap.magazine .magazine-img { width: 100%;}
  .scrap.magazine .magazine-text { margin-bottom: 10px;}
  .scrap.magazine .magazine-sbj { font-size: 20px;}
  .scrap.art .art-item { padding: 20px;}
}


.memo { padding: 120px 5% 140px; flex: 1; max-width: 1320px; width: 100%; overflow: hidden;}
.memo-btns { display: flex;}
.memo-btns button { flex: 1; font-size: 16px; height: 50px; border: 1px solid #ddd; border-radius: 10px 10px 0 0; display: flex; justify-content: center; align-items: center;}
.memo-btns button.active { font-weight: 600; background: #222; color: #fff;}
.memo-content { overflow-x: auto; border: 1px solid #ddd; border-top: 0; border-radius: 0 0 10px 10px;}
.memo-area { padding: 60px; display: none; width: max-content; min-width: 100%;}
.memo-area.active { display: block;}
.memo .memo-toolbar { display: flex; gap: 15px; margin-bottom: 20px;}
.memo .search-box { position: relative; width: 410px; border-radius: 35px; border: 1px solid #ddd; padding: 5px 47px 5px 28px;}
.memo .memo-write { padding: 5px 45px; background: var(--accent2-color); color: #fff; font-size: 16px; font-weight: 600; border-radius: 5px;}
.memo .memo-list { margin-bottom: 20px;}
.memo .memo-list li { font-size: 16px;}
.memo .memo-list li:first-child { text-align: center; font-weight: 600; padding: 20px 0; border-top: 2px solid #000; border-bottom: 1px solid #ddd; display: grid; grid-template-columns: 20px 16% auto 16%; gap: 40px;}
.memo .memo-list.v2 li:first-child { grid-template-columns: 20px 16% auto 16% 16%;}
.memo .memo-list li a { display: block; padding: 20px 0; border-bottom: 1px solid #ddd; display: grid; grid-template-columns: 20px 16% auto 16%; gap: 40px;}
.memo .memo-list.v2 li a { grid-template-columns: 20px 16% auto 16% 16%;}
.memo .memo-list li a > * { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #666;}
.memo .memo-list li .memo-sender,
.memo .memo-list li .memo-date { text-align: center;}
.memo .memo-list li .memo-inner { color: inherit; font-weight: 600;}
.memo .memo-list li.read .memo-inner { color: #666; font-weight: 400;}
@media screen and (max-width: 767px) {
  .memo { padding: 60px 20px 100px;}
  .memo-btns button { height: 40px; font-size: 14px;}
  .memo .memo-list li:first-child { padding: 10px 0;}
  .memo-area { padding: 30px;}
  .memo .memo-write { padding: 5px 15px;}
}

/* 팝업 오버레이 */
.popup-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); display: none; justify-content: center; align-items: center; z-index: 101;}
.popup-overlay .title { font-size: 40px;}
.popup-overlay * { font-family: 'Pretendard'; }
.popup-overlay.active { display: flex; }
.popup-container { background: #fff; width: 90%; max-width: 560px; max-height: 90vh; overflow: hidden; padding: 60px 40px 50px; position: relative;}
.popup-container h2.title { text-align: center; margin-bottom: 20px;}
.popup-container .form-group { display: flex; align-items: center; gap: 28px; margin-bottom: 4px;}
.popup-container .form-group label { font-weight: 700; flex-shrink: 0;}
.popup-close { position: absolute; top: 30px; right: 40px;}
.char-counter { width: fit-content; margin-left: auto; display: flex; align-items: center; gap: 3px; font-size: 16px; font-weight: 500; color: #666; margin-bottom: 20px;}
.popup-container .memo-box { display: flex; align-items: center; padding: 10px 18px; border-radius: 5px; background: #f7f7f7; font-size: 16px; margin-bottom: 16px;}
.popup-container .memo-box .memo-text { padding-right: 16px; position: relative; margin-right: 16px;}
.popup-container .memo-box .memo-text::after { content: ''; display: block; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 2px; height: 12px; background: #ddd;}
.popup-container .memo-box .memo-current { line-height: 1;}
.popup-container .memo-box .memo-current .current { color: var(--accent2-color); font-weight: 600;}
.popup-container .small-text { position: relative; font-size: 14px; color: #333; padding-left: 21px; line-height: 1.4; margin-bottom: 46px;}
.popup-container .small-text::before { content: ''; display: block; position: absolute; left: 0; top: 0; width: 16px; height: 16px; background: url(/images/ico-star.svg) no-repeat center/auto 100%;}
.popup-container .register-step-btns { max-width: 230px; margin-top: 0;}
.popup-container .register-step-btns button { font-size: 16px; height: 43px;}
.message-info .info-item { display: flex; gap: 28px; align-items: center;}
.message-info .info-item + .info-item { margin-top: 16px;}
.message-info .info-item dt { font-weight: bold; line-height: 1.2;}
.message-info .info-item dd { font-size: 16px; line-height: 1.2; display: flex; align-items: center; gap: 12px;}
.popup-overlay textarea { margin: 4px 0; padding: 28px; border:1px solid #ddd; font-weight: 500; font-size: 16px; border-radius: 20px; color: #333; height: 100%;}
.popup-overlay textarea::placeholder { color: #333; font-size: 16px; font-weight: 500;}

.popup-overlay#messagePopup2 .popup-container { padding: 60px 0 50px;}
.popup-overlay#messagePopup2 .popup-header { padding: 0 40px;}
.popup-overlay#messagePopup2 .content-top { padding: 0 40px 30px; border-bottom: 1px solid #ddd;}
.popup-overlay#messagePopup2 .content-body { padding: 30px 40px 0;}
.popup-overlay#messagePopup2 .message-value { max-height: 347px; height: 100%; overflow-y: auto; font-size: 16px; line-height: 1.5; margin-bottom: 40px;}

.popup-overlay#messagePopup3 .login_frm { padding: 0; border: none;}
.popup-overlay#messagePopup3 .reason-list { margin-bottom: 30px;}
@media screen and (max-width: 767px) {
  .popup-container { padding: 60px 20px 50px;}
  .popup-overlay#messagePopup2 .content-top { padding: 0 20px 30px;}
  .message-info .info-item dd { font-size: 14px;}
  .popup-overlay#messagePopup2 .content-body { padding: 30px 20px 0;}
  .popup-container .register-step-btns button { font-size: 14px; height: 40px;}
  .popup-close { right: 20px; }
  .popup-close i { width: 30px; height: 30px;}
  .char-counter { font-size: 14px;}
  .popup-overlay .title { font-size: 24px;}
  .popup-overlay textarea { padding: 15px; font-size: 14px;}
  .popup-overlay textarea::placeholder { font-size: 14px;}
  .popup-container .memo-box { font-size: 14px;}
  .popup-container .small-text { margin-bottom: 20px;}
}

/* activity */
.activity { padding: 120px 5% 140px; flex: 1; max-width: 1320px; width: 100%; overflow: hidden;}
.mypage .activity .sfl select { padding: 5px 52px 5px 28px;}
.mypage .activity .sfl { margin: 0;}
.mypage .activity .sfl:first-child { margin-left: auto;}
.activity .activity-btns { display: flex;}
.activity .activity-btns button { flex: 1; font-size: 16px; height: 50px; border: 1px solid #ddd; border-radius: 10px 10px 0 0; display: flex; justify-content: center; align-items: center;}
.activity .activity-btns button.active { font-weight: 600; background: #222; color: #fff;}
.activity .activity-content { border: 1px solid #ddd; border-top: 0; border-radius: 0 0 10px 10px; overflow-x: auto;}
.activity .activity-area { padding: 60px; display: none; width: max-content; min-width: 100%;}
.activity .activity-area.active { display: block;}
.activity .activity-toolbar { display: flex; gap: 15px; margin-bottom: 20px;}
.activity .search-box { position: relative; width: 410px; border-radius: 35px; border: 1px solid #ddd; padding: 5px 47px 5px 28px;}
.activity .activity-list li { font-size: 16px;}
.activity .activity-list li:first-child { text-align: center; font-weight: 600; padding: 20px 0; border-top: 2px solid #000; border-bottom: 1px solid #ddd; display: grid; grid-template-columns: 82px 9% auto 8% 12%; gap: 40px;}
.activity .activity-list li a { display: block; padding: 20px 0; border-bottom: 1px solid #ddd; display: grid; grid-template-columns: 82px 9% auto 8% 12%; gap: 40px; color: #666; align-items: center;}
.activity .activity-list li a div:not(.activity-inner) { text-align: center;}
.activity .activity-list li a .activity-status span { font-weight: 600;}
.activity .activity-list li a .pending { color: var(--accent2-color);}
.activity .activity-list li a .completed { padding: 8px 18px; background: #EC8C48; color: #fff; border-radius: 35px;}
.activity .activity-area.v2 { border: 1px solid #ddd; display: block; border-radius: 10px;}
.activity .activity-area.v2 + .activity-area { margin-top: 20px;}
.activity .activity-area.v2 dl { display: flex; gap: 97px; padding: 20px 0; border-top: 1px solid #ddd;}
.activity .activity-area.v2 dl:first-child { border: none; padding-top: 0;}
.activity .activity-area.v2 .view-info { display: flex;}
.activity .activity-area.v2 dt { font-weight: 700; line-height: 1.5; flex: 0 0 105px;}
.activity .activity-area.v2 dd { font-size: 16px; color: #666; line-height: 1.5; place-content: center;}
.activity .activity-area.v2 .ico-down { display: inline-block; width: 32px; height: 32px; background: url(/images/ico-download.png) no-repeat center/auto 100%; vertical-align: middle; margin-left: 16px;}
.activity .activity-area.v2 .result-top { display: flex; justify-content: space-between; align-items: center; padding-bottom: 20px; border-bottom: 1px solid #ddd;  margin-bottom: 20px;}
.activity .activity-area.v2 .result-top h3.title { font-weight: 700;}
.activity .activity-area.v2 .result-top .year { font-size: 16px; font-weight: 500; color: #666;}
.activity .activity-area.v2 .result-value p { font-size: 16px; color: #333;}
.activity .prev-list { padding: 18px 50px; border-radius: 35px; background: #222; color: #fff; width: fit-content; margin: 60px auto 0; font-weight: 500; display: block;}

.activity .request .activity-list li:first-child { grid-template-columns: 82px auto 8% 12%;}
.activity .request .activity-list li a { grid-template-columns: 82px auto 8% 12%;}
@media screen and (max-width: 1024px) {
  .activity { padding: 60px 20px 100px;}
  .activity .request .activity-list li:first-child { grid-template-columns: 82px auto 12% 12%;}
}
@media screen and (max-width: 767px) {
  .activity .activity-area { padding: 30px;}
  .activity .activity-btns button { height: 40px; font-size: 14px;}
  .activity .activity-list li:first-child { padding: 10px 0;}
}

/* member-leave */
.member-leave { padding: 120px 5% 140px; flex: 1;}
.member-leave .login_frm { margin-top: 20px;}
.member-leave .login_frm li { display: flex; flex-direction: column;}
.member-leave .login_frm li + li { margin-top: 20px;}
.member-leave .login_frm li input { max-width: 650px;}
.member-leave .login_frm .reason-list .custom-checkbox { margin: 0;}
.member-leave .login_frm .reason-list textarea { margin-top: 12px; padding: 20px; border-radius: 5px;}
.member-leave .final-check { padding: 40px 60px; background: #F7F7F7; border-radius: 5px; margin: 20px 0 40px;}
.member-leave .final-check h2 { font-weight: 400; font-size: 22px; margin-bottom: 16px;}
.member-leave .final-check li { font-size: 16px; position: relative; padding-left: 16px;}
.member-leave .final-check li::before { content: ''; display: block; position: absolute; top: 8px; left: 0; width: 4px; height: 4px; border-radius: 50%; background: #101010;}
.member-leave .final-check li + li { margin-top: 7px; }
.member-leave label[for="check-all"] { justify-content: center;}
@media screen and (max-width: 767px) {
  .member-leave { padding: 60px 20px 100px;}
  .member-leave form { max-width: 1120px;}
  .member-leave .final-check { padding: 30px;}
  .member-leave .final-check h2 { font-size: 20px;}
  .member-leave .final-check li { font-size: 14px;}
}

.artlounge.mypage { padding-bottom: 140px; padding-top: 40px; max-width: 1460px; width: 90%; margin: 0 auto; flex-direction: column;}
.artlounge form { padding: 60px;margin:0 auto; border-radius: 10px; border: 1px solid #ddd; width: 100%;}
.artlounge .scrap-btns a { height: 64px; font-size: 20px;}
.artlounge.mypage .input-group button { width: 260px;}
.artlounge.qna .form-row + .form-row { margin-top: 28px;}
.artlounge.mypage select { width: 432px;}
.artlounge.mypage textarea::placeholder { color: #666;}
.artlounge input[type=text].frm_input,
.artlounge input[type=tel].frm_input,
.artlounge input[type=email].frm_input,
.artlounge input[type=password].frm_input,
.artlounge input[type=submit].frm_input {width:100%;margin: 4px 0; height: 55px; padding: 5px 28px; border: 1px solid #ddd; background: #F8F8F8; font-weight: 500; font-size: 18px; border-radius: 35px; background: #fff;}
.artlounge input[type=text].frm_input::placeholder,
.artlounge input[type=tel].frm_input::placeholder,
.artlounge input[type=email].frm_input::placeholder,
.artlounge input[type=password].frm_input::placeholder,
.artlounge input[type=submit].frm_input::placeholder { color: #666; }
.artlounge .register-step-btns { max-width: 410px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 40px auto 0;}
.artlounge .register-step-btns .btn_prev { place-content: center; text-align: center; font-weight: 500; border: 1px solid #ddd; border-radius: 35px; height: 58px;}
.artlounge .register-step-btns .btn_login { background: #222; color: #fff;}
.artlounge .register-step-btns *:not(:first-child){ background: #222; color: #fff; border-radius: 35px;}
@media screen and (max-width: 1024px) {
  .artlounge form { padding: 60px 30px;}
}
@media screen and (max-width: 767px) {
  .artlounge form { padding: 60px 20px;}
  .artlounge input[type=text].frm_input, .artlounge input[type=tel].frm_input, .artlounge input[type=email].frm_input, .artlounge input[type=password].frm_input, .artlounge input[type=submit].frm_input { height: 40px; font-size: 14px;}
  .artlounge.qna .form-row { flex-direction: column;}
  .artlounge .scrap-btns a { height: 50px; font-size: 16px;}
  .artlounge.mypage select { width: 100%; font-size: 14px; height: 40px; padding: 5px 40px 5px 20px;}
  .artlounge.mypage .input-group button { width: auto; height: 40px; margin: 0;}
  .artlounge .register-step-btns .btn_prev { height: 40px;}
}


/* thelayer */
.people.inner { padding-top: 70px; padding-bottom: 140px;}
.people-area + .people-area { margin-top: 100px;}
.people-btns { display: flex; align-items: center; gap: 40px; margin-bottom: 40px;}
.people-btns * { font-size: 32px; font-weight: 700; line-height: 1.5;}
.people-btns button { opacity: .4; color: #101010;}
.people-btns button.active { opacity: 1;}
.people-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); grid-auto-rows: 1fr; gap: 0 40px;}
.people-list li { padding: 20px 0 40px; border-top: 1px solid #ddd; }
.people-list li .people-name { font-size: 24px; font-weight: 500; margin-bottom: 12px;}
.people-list li .text { font-size: 16px; color: #666;}
@media screen and (max-width: 1024px) {
  .people-btns * { font-size: 22px;}
}
@media screen and (max-width: 767px) {
  .people.inner { padding-top: 60px;}
  .people-area + .people-area { margin-top: 60px;}
  .people-btns { gap: 20px;}
  .people-btns * { font-size: 18px;}
  .people-list { grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr)); gap: 0 20px;}
  .people-list li .people-name { font-size: 18px;}
}

/* about */
.about h2.title { font-size: 40px; font-weight: 500; line-height: 1.5; color: #242424;}
.about .about-header .text { color: #666; margin-bottom: 10px;}
.about-intro { height: 300vh;}
.about-intro .sticky { width: 100%; height: 100vh; top: 0px; overflow: hidden;}
.about-intro .intro-area { position: relative; width: 100%; height: 100%; }
.about-intro .intro-bg { background: url(/images/sub/about-bg.jpg) no-repeat center/cover; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.about-intro .intro-text { font-weight: 500; position: absolute; bottom: 22%; right: 130px; color: #fff; transform: translateY(180%);}
.about-intro .intro-text p + p { margin-top: 30px;}
.about-intro .intro-text img { display: block; margin-top: 15px; margin-left: auto;}
@media screen and (max-width: 1024px) {
  .about-intro .intro-text { right: 30px;}
  .about h2.title { font-size: 30px;}
}
@media screen and (max-width: 767px) {
  .about h2.title { font-size: 24px;}
  .about-intro { height: auto;}
  .about-intro .sticky { height: auto;;}
  .about-intro .intro-text { transform: none; right: 0; width: 100%; padding: 60px 20px; bottom: 0px; position: relative;}
}
.about-teaching { padding-top: 180px;}
.about-teaching .inner { display: flex;}
.about-teaching .inner > * { flex: 1;}
.about-teaching h3.title { font-size: 32px; font-weight: 500;}
.about-teaching .teaching-msg strong { margin-bottom: 20px;}
.about-teaching .teaching-msg p { color: #333;}
.about-teaching .teaching-msg p + p { margin-top: 25px;}
.about-teaching .teaching-msg .name { margin-top: 44px; display: flex; align-items: center; gap: 20px; font-weight: 500; color: #242424;}
@media screen and (max-width: 1024px) {
  .about-teaching { padding-top: 100px;}
}
@media screen and (max-width: 767px) {
  .about-teaching { padding-top: 60px;}
  .about-teaching h3.title { font-size: 24px;}
  .about-teaching .inner { flex-wrap: wrap; gap: 30px;}
  .about-teaching .inner > * { flex: 0 0 100%;}
  .about-teaching .teaching-msg .name { flex-wrap: wrap;}
}

.about-features { padding: 200px 0; height: 300vh;}
.about-features .sticky { overflow: hidden; height: 100vh; top: 0; place-content: center;}
.about-features .inner { display: flex; gap: 223px; width: max-content;}
.about-features .inner > * { flex-shrink: 0;}
.about-features .features-list .swiper-wrapper { display: flex; gap: 20px;}
.about-features .features-list .swiper-slide { padding: 40px; width: 487px; aspect-ratio: 0.75; display: flex; flex-direction: column; color: #fff; background-size: cover; background-repeat: no-repeat; background-position: center;}
.about-features .features-list .swiper-slide .label { font-weight: 500; font-size: 20px;}
.about-features .features-list .swiper-slide .sbj { font-size: 28px; font-weight: 600; line-height: 1; margin-top: auto; margin-bottom: 16px;}
.about-features .features-list .swiper-slide .desc { font-size: 16px; line-height: 1.5; color: #f4f4f4;}
.about-features .features-list .swiper-slide:nth-child(1) { background-image: url(/images/sub/features-img1.png);}
.about-features .features-list .swiper-slide:nth-child(2) { background-image: url(/images/sub/features-img2.png);}
.about-features .features-list .swiper-slide:nth-child(3) { background-image: url(/images/sub/features-img3.png);}
.about-features .features-list .swiper-slide:nth-child(4) { background-image: url(/images/sub/features-img4.png);}
.about-features .features-list .swiper-slide:nth-child(5) { background-image: url(/images/sub/features-img5.png);}
@media screen and (max-width: 1024px) {
  .about-features { padding: 100px 0;}
}
@media screen and (max-width: 767px) {
  .about-features { padding: 60px 0; height: auto;}
  .about-features .sticky { height: auto;}
  .about-features .inner { flex-wrap: wrap; width: 100%; gap: 50px;}
  .about-features .inner > * { flex-shrink: 1;}
  .about-features .swiper { overflow: visible; width: 100%;}
  .about-features .features-list .swiper-slide { padding: 30px;}
  .about-features .features-list .swiper-slide .sbj { font-size: 20px;}
  .about-features .features-list .swiper-wrapper { gap: 0;}
}

.about-record { padding-bottom: 200px; overflow: hidden;}
.about-record .inner { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 50px;}
.about-record .record-list { display: flex; gap: 40px; overflow: visible;}
.about-record .record-list .swiper-wrapper { gap: 40px;}
.about-record .record-list .swiper-slide { width: auto;}
.about-record .record-list .img-box { margin-bottom: 22px; max-width: 410px;}
.about-record .record-list .desc { font-size: 20px; font-weight: 600; color: #000; line-height: 1;}
@media screen and (max-width: 1024px) {
  .about-record { padding-bottom: 100px;}
}
@media screen and (max-width: 767px) {
  .about-record { padding-bottom: 60px;}
  .about-record .record-list { gap: 0px; width: 100%;}
  .about-record .record-list .swiper-wrapper { gap: 0;}
  .about-record .record-list .img-box { margin-bottom: 10px;}
  .about-record .record-list .desc { font-size: 16px; font-weight: 500;}
}

.about-post { padding-bottom: 80px;}
.about-post .post-area { background: #F7F7F7; text-align: center; padding: 110px 30px 90px;}
.about-post .text { font-size: 20px; line-height: 1.5; color: #242424; margin-bottom: 40px;}
.about-post .text span { font-weight: 600; vertical-align: baseline;}
.about-post a { padding: 18px 50px; border-radius: 35px; font-weight: 500; line-height: 1; color: #fff; background: #222; display: block; margin: 0 auto; width: fit-content;}
@media screen and (max-width: 767px) {
  .about-post .post-area { padding: 60px 30px;}
  .about-post .text { font-size: 16px;}
  .about-post a { padding: 12px 20px;}
}


/* policy */
.privacy * { font-family: 'Pretendard';}
.privacy .inner { padding: 0; max-width: 1460px; width: 90%; margin: 0 auto; padding-bottom: 100px;}
.privacy table { table-layout: fixed; border: 1px solid #ddd; margin: 10px 0;}
.privacy table th,
.privacy table td { border: 1px solid #ddd; padding: 5px;}
.privacy table th { text-align: center;}
