@charset "UTF-8";
/*
    Author: jinwook
    Date:
    Project:
    */
    /* http://meyerweb.com/eric/tools/css/reset/
    v2.0 | 20110126
    License: none (public domain)
*/
:root{
    --canvers:#DAE0E6;

    --bodycolor:#ffffff;
    --bodytext:#334155;
    --bodysubtext:#878a8c;
    --bluecolor:#5d87ff;
    --bluecolor-term:#ecf2ff;
    --yellowcolor:#ffae1f;
    --yellowcolor-term:#fef5e5;
    --orangecolor:#fa896b;
    --orangecolor-term:#fdede8;
    --greencolor:#13deb9;
    --greencolor-term:#e6fffa;

    --inputbgcolor:#f5f6f8;

    --iscreamcolor:#e14d25;

    --bodylinecolor:#ccc;
    --commentsbodycolor:#f3f7f9;

    --CommunityTheme-line:#edeff1;
    --CommunityTheme-icon:#878a8c;

    --notice_color_bg:#fff4d8;

}

/* 팝업기본 */
.lypop_container { display: none; background-color:#fff; border-radius:15px; color:#000; margin: -12.5vh 20px 20px 20px; padding:2vh; }
/* 팝업기본 */

/* 텍스트박스 */
.text_box{position:relative; display:flex; flex-direction: column;}
.text_box .tit{font-size:1.25em; margin-bottom:8px; font-weight:600;}
.text_box .text_box{position:relative;}
.text_box .text_box > input{width:100%; height:36px; background:var(--inputbgcolor); border:0; resize: none; border-radius:10px; padding:9px 36px 9px 12px;}
.text_box .text_box > textarea{width:100%; height:36px; background:var(--inputbgcolor); border:0; resize: none; border-radius:10px; padding:9px 36px 9px 12px;}
.text_box .msg_box{padding-top:8px; line-height:1.5;}
.text_box .msg_box .msg{font-size:1.25em;}
.text_box .msg_box .red{color:var(--iscreamcolor);}
/* 텍스트박스 */

/* 드랍메뉴 */
.dropdown.post_dropdown{ width:240px; height:42px;}
.dropdown {cursor: pointer;border-radius:5px;padding:11px 50px 11px 15px; border:1px solid var(--CommunityTheme-line); outline:none; overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
/* 드랍메뉴 */

/* 버튼 통합 */
.btn_area {display:flex; gap:8px;}
.btn_area.end {justify-content: end;}
.btn_area.center {justify-content: center;}
.btn_area button{padding:10px 20px; color:var(--bodycolor); border-radius:30px; font-size:1.25em; touch-action: manipulation; -webkit-tap-highlight-color: transparent;}
.btn_area a{padding:10px 20px; color:var(--bodycolor); border-radius:30px; font-size:1.25em; touch-action: manipulation; -webkit-tap-highlight-color: transparent;}
.btn_area button.cancle{background:var(--bodysubtext);}
.btn_area button.add{background:var(--orangecolor);}
.btn_area a.cancle{background:var(--bodysubtext);}
/* 버튼 통합 */

/* 알람 애니메이션 */
.new_alram{position:absolute; top:0; right:0; width:10px; height:10px; border-radius:50%; background:var(--iscreamcolor); animation: new_alram 1s linear infinite;}
@keyframes new_alram{
    0%{opacity: 0.6; background: var(--orangecolor);}
    50%{opacity: 1;}
    100%{opacity: 0.6; background: var(--orangecolor);}
}
/* 알람 애니메이션 */


/* 위로가기 */
.up_btn{position:fixed; bottom:2rem; right:2rem; width:40px; height:40px; background:var(--bluecolor); display:flex; justify-content: center; align-items: center; cursor:pointer; opacity: 0; visibility: hidden; transition: .2s; z-index:9999; touch-action: manipulation; -webkit-tap-highlight-color: transparent; min-width:44px; min-height:44px;}
.up_btn.active{opacity: 1; visibility: visible;}
.up_btn ion-icon{color:var(--bodycolor); font-size:2em;}
/* 위로가기 */

.line{width:100%;height:1px;background:var(--CommunityTheme-line);margin:15px 0;}
/* 사용자 수정 작제 */
.editdel{position:absolute; top:10px; right:10px;  color:var(--CommunityTheme-icon); z-index:100;}
.editdel .comments_box_open{font-size:1.25em; cursor:pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center;}
.editdel .comments_box{ position:absolute; top:20px; right:0; width:70px; display:none; flex-direction: column; background:var(--bodycolor); text-align:center; border:1px solid var(--CommunityTheme-line);}
.editdel .comments_box.active{ display:flex;}
.editdel .comments_box a{padding:10px; touch-action: manipulation; -webkit-tap-highlight-color: transparent; min-height:44px; display:flex; align-items:center; justify-content:center;}
.editdel .comments_box button{padding:10px; touch-action: manipulation; -webkit-tap-highlight-color: transparent; min-height:44px; display:flex; align-items:center; justify-content:center;}
/* 사용자 수정 작제 */
/* mobile css */
/* 메뉴온오프 */
.mobile_menu{position:relative;width:30px;height:30px;cursor: pointer;display:flex;justify-content: center;align-items: center;}
.mobile_menu::before{content: '';position:absolute;width:20px;height:2px;background:#999;transition: 0.2s;transform: translateY(-7px);box-shadow: 0 7px 0 #999;}
.mobile_menu::after{content: '';position:absolute;width:20px;height:2px;background:#999;transition: 0.2s;transform: translateY(7px);}
.mobile_menu.active{background:transparent;}
.mobile_menu.active::before{ content:''; transform: translateY(0px); transform: rotate(45deg); box-shadow: 0 0 0 transparent; background:var(--orangecolor); box-shadow: var(--orangecolor);}
.mobile_menu.active::after{ content:''; transform: translateY(0px); transform: rotate(-45deg); background:var(--orangecolor); }
/* 메뉴온오프 */

/* 모바일 메뉴 리스트 */
.mobile_side_list{position:fixed; top:48px; left:0; width:100%; background:var(--bodycolor); border:1px solid var(--CommunityTheme-line); opacity: 0; visibility: hidden; overflow-y:auto; padding:20px 0; max-height:400px; z-index:900;}
.mobile_side_list.active{opacity: 1; visibility: visible; border-top:0;}
/* 모바일 메뉴 리스트 */
/* mobile css */


/* 대쉬보드 메인 */
.pc_area{display:flex; align-items: center; justify-content: space-between; width:100%;}
.mobile_area{ position:relative; display:none;}
.header{position:fixed; top:0; left:0; right:0; height:48px; display:inline-flex; align-items: center; flex-direction: row; border-bottom:1px solid var(--CommunityTheme-line); background:var(--bodycolor); z-index:300;}
.head_area{ display:inline-flex; flex-direction: row; flex-grow: 1; align-items: center; justify-content: space-between; padding:0 20px; }
.head_area .logo{display:flex; align-items: center;}
.head_area .logo .pc_logo{display:block;}
.head_area .logo .mobile_logo{display:none;}
.head_area .head_sublist{display:flex; gap:5px; align-items: center;}
.head_area .my_area{ position:relative; display:flex; justify-content: center; align-items: center; gap:5px; cursor:pointer; padding:5px 10px; }
.head_area .my_area .photo{ width:30px; height:30px; }
.head_area .my_area .photo img{ width:30px; height:30px; object-fit: cover; border-radius:40px; border:1px solid var(--CommunityTheme-line)}
.head_area .my_area ion-icon{font-size:20px; color:var(--bodytext);}
.head_area .my_area ion-icon.arrow{font-size:20px; color:var(--CommunityTheme-icon);}
.head_area .my_area .name{font-size:1.25em;}
.head_area .my_area .name > span:first-child{color:var(--bluecolor);}
.head_area .my_area .name > span:last-child{color:var(--CommunityTheme-icon);}
.head_area .add_btn{ display:flex; align-items: center; gap:8px; border:1px solid var(--bodylinecolor); border-radius:50px; font-size:1.25em; color:var(--bodysubtext); transition:.2s ease-in; padding:5px 10px;}
.head_area .add_btn:hover{ color:var(--bodycolor); background:var(--orangecolor); border:1px solid var(--bodycolor);}
.head_area .add_btn ion-icon{ font-size:1.33em;}
.head_area .add_btn:hover a{ color:var(--bodycolor);}
.head_area .pc_sublist{display:flex; align-items: center; gap:10px;}
.head_area .mobile_sublist{display:none;}
.head_area .mobile_sublist .btnn{border-radius:50%; display:flex; align-items: center;}
.head_area .mobile_sublist .btnn ion-icon{font-size:2em; font-weight:600; color:var(--CommunityTheme-icon);}
.head_area .mobile_sublist .slide_area{ display:none; position:absolute; top:25px; right:0; width:140px; flex-direction: column; gap:10px; background:var(--bodycolor); border:1px solid #edeff1; padding:5px; border-top:0;}
.head_area .mobile_sublist .slide_area.active{ display:flex;}
.head_area .mobile_sublist .slide_area .add_btn{ border:0; text-align:center; justify-content: center; }

.head_area .alram_area{ position:relative; display:flex; align-items: center;}
.head_area .alram_area .notifications{ position:relative; font-size:1.8em;}
.head_area .alram_area .alram_list{ display:none; position:absolute; top:36px; right:0; width:440px; height:300px; background:var(--bodycolor); padding:5px 10px; border:1px solid var(--CommunityTheme-line); border-top:0; overflow-y:auto;}
.head_area .alram_area .alram_list.active{display:block;}
.head_area .alram_area .alram_list .list{display:flex; flex-direction: column; gap:10px; border-bottom:1px solid var(--CommunityTheme-line); padding:10px;}
.head_area .alram_area .alram_list .list:hover{background:var(--CommunityTheme-line);}
.head_area .alram_area .alram_list .list.active{background:var(--CommunityTheme-line);}
.head_area .alram_area .alram_list .list .list_title{display:flex; align-items: center; gap:10px; font-size:1.25em; }
.head_area .alram_area .alram_list .list .list_title .lima{color:var(--bodycolor); padding:5px; border-radius:10%; width:70px;}
.head_area .alram_area .alram_list .list .list_title .lima.notice{background:var(--bluecolor);}
.head_area .alram_area .alram_list .list .list_title .lima.topic{background:var(--orangecolor);}
.head_area .alram_area .alram_list .list .list_title .text{width:210px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis; font-weight:600;}
.head_area .alram_area .alram_list .list .list_body{font-size:1.25em; text-align:left; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}

.head_menu{display:none; position:absolute; top:44px; right:-1px; width:220px; flex-direction: column; align-items: center; background:var(--bodycolor); border:1px solid var(--CommunityTheme-line); border-top:none;}
.head_menu.active{display:flex;}
.head_menu .list{display:flex; align-items: center; gap:10px; font-size:1.25em; width:100%; padding:10px 20px; border-radius:5px; color:var(--bodysubtext)}
.head_menu .list:hover{background:var(--orangecolor); color:var(--bodycolor);}
.head_menu .list:hover ion-icon{ color:var(--bodycolor); }
.aside_wrap{ position:fixed; top:48px; left:0; width:220px; overflow:hidden; display:flex; flex-direction: column; background:var(--bodycolor); height:calc(100vh - 48px);}

.menu{overflow-y:auto; max-height:820px;}
.menu .title-m{font-size:1.00em; padding:25px 24px 8px; color:var(--bodysubtext);}
.menu a{display:flex; flex-direction: row; align-items:center; gap:10px; color:var(--bodytext); padding:8px 24px; font-size:1.25em;}
.menu button{ width:100%; display:flex; flex-direction: row; align-items: center; padding:0 20px; background:transparent; border:0; font-size:1.25em; padding:8px 24px; gap:10px;}
.menu button:hover,.menu a:hover{ background:var(--CommunityTheme-line); }
.menu button span{width:100%; text-align:left;}
.menu button .arrow{transition: .2s ease;}
.menu button .arrow.active{transform: rotate(180deg);}
.menu a.active, .menu button.active{ background:var(--CommunityTheme-line); font-weight: 600; }
.menu a.active ion-icon, .menu button.active ion-icon{ color:var(--orangecolor) !important; }
.menu a[data-board-id].active ion-icon{ color:#fa896b !important; }
.menu a[data-board-id].active > ion-icon{ color:#fa896b !important; }
.menu a.active-icon ion-icon, .menu ion-icon.active-icon{ color:#fa896b !important; }
.mobile_side_list .menu a.active ion-icon{ color:#fa896b !important; }
.mobile_side_list .menu a.active{ background:var(--CommunityTheme-line); font-weight: 600; }
.menu button.active > ion-icon:not(.arrow){ color:var(--orangecolor) !important; }
.side_list a.active ion-icon{ color:var(--orangecolor) !important; }
.side_list a.active{ background:var(--CommunityTheme-line); font-weight: 600; }
.side_list{ display:none; flex-direction: column; margin:0 20px 0 60px; transition: .2s ease-in-out;  }
.side_list.active{ display:flex; }
.side_list a{padding:10px 4px; font-size:1.25em;}
.side_list a.active{ background:var(--CommunityTheme-line);}
.container{padding-left:220px; padding-top:48px; display:flex; flex-grow: 1; justify-content: center;}

.searchbar_area .searchbar_box{position:relative; width:500px; display:flex; border:1px solid var(--bodylinecolor); padding:0 20px; border-radius:40px;}
.searchbar_area .searchbar_box:has(.input input:focus){border:1px solid var(--orangecolor);}
.searchbar_area .searchbar_box .input{width:90%; height:37px;}
.searchbar_area .searchbar_box .input input[type='text']{ width:100%; height:100%; border:0; font-size:1.50em; background:transparent;}
.searchbar_area .searchbar_box .input input::placeholder{font-size:17px;}
.searchbar_area .searchbar_box .input input:focus{ outline:none !important; border:0; }
.searchbar_area .searchbar_box .search_btn{ position:absolute; top:2px; right:15px; width:35px; height:35px;}

/* 대쉬보드 메인 */

/* 뷰 메인 */
.contents_wrap {padding:10px;}
.contents_wrap.center {width:100%; display:flex; justify-content: center; padding:30px 10px;}
.contents_wrap.center_my {width:100%; display:flex; justify-content: center; padding:30px 10px; flex-direction: column; align-items: center;}
.search_text_area{font-size:2em; padding:10px 5px;}
.search_text_area > span > b{color:var(--bluecolor)}
.choice_area{ display:flex; height:50px; padding-left:20px;}
.choice_area .choice_box{ display:flex; align-items: center; gap:15px; }
.choice_area .choice_box button{ display:flex; align-items: center; gap:8px; padding:8px 10px; color:var(--bodycolor); border-radius:50px; font-size:1.25em; justify-content: center; touch-action: manipulation; -webkit-tap-highlight-color: transparent;}
.choice_area .choice_box button:nth-child(1){ background:var(--bluecolor); }
.choice_area .choice_box button:nth-child(2){ background:var(--greencolor);}
.choice_area .choice_box button:nth-child(3){ background:var(--yellowcolor); }
.choice_area .choice_box button:nth-child(4){ background:var(--orangecolor); }
.choice_area .choice_box button:hover{ opacity: 0.8;}
.choice_area .choice_box button:active{ opacity: 0.7;}
.choice_area .choice_box button ion-icon{font-size:1.33em;}

.com_area .list{ position:relative; width:300px; border:1px solid var(--CommunityTheme-line); background:var(--bodycolor); padding:20px 20px; margin-bottom:15px; overflow:hidden; box-shadow: 0 3px 5px #0000000b;}
.com_area .list.notice_box{ background:var(--notice_color_bg);}
.com_area .list.notice_box .category_box{color:var(--iscreamcolor) !important;}
.com_area .list .link_move{ position:absolute; top:0; left:0; width:100%; height:100%; background: transparent; z-index:99;}
.com_area .list.view{ display:flex; flex-direction: column; justify-content: center; width:740px; border:1px solid var(--CommunityTheme-line); background:var(--bodycolor); padding:25px 30px; margin-bottom:0; overflow:hidden; box-shadow: 0 3px 5px #0000000b;}
.com_area .list .category_area{ display:flex; flex-direction: column; font-size:1.13em; gap:10px; margin-bottom:15px;}
.com_area .list .category_area .category_box{ color:var(--bluecolor); font-weight:600;}
.com_area .list .category_area .category_box span:after{ content:'>'; margin:0 5px;}
.com_area .list .category_area .category_box span:last-child:after{ content:''; }
.com_area .list .category_area .name_day_box{display:flex; align-items: center; gap:10px; font-size:1.25em;}
.com_area .list.view .category_area .name_day_box span:first-child{ font-weight:600; margin-right:10px;}
.com_area .list .title_area{display:block; font-size:2.20em; font-weight:600; margin-bottom:10px;}
.com_area .list .title_area p{overflow: hidden; line-height:1.2;}
.com_area .list .contents_area{line-height:1.7; font-weight:200; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; font-size:1.00em; margin-bottom:10px; font-variant-numeric: normal !important; font-feature-settings: normal !important;}
.com_area .list .contents_area p{font-size:1.25em; font-variant-numeric: normal !important; font-feature-settings: normal !important;}
.com_area .list.view .contents_area{max-height:100%; display:block; -webkit-line-clamp: initial; -webkit-box-orient: initial; font-variant-numeric: normal !important; font-feature-settings: normal !important;}
.com_area .list.view .contents_area p{ margin:10px 0; display:block; font-weight:400; line-height:1.5; font-size:1.0em; font-variant-numeric: normal !important; font-feature-settings: normal !important;}
/* 콜론이 정상적으로 표시되도록 전역 스타일 추가 */
.com_area .list .contents_area *,
.com_area .list.view .contents_area * {
    font-variant-numeric: normal !important;
    font-feature-settings: normal !important;
}
/* ionicon SVG 크기 조절 - 전역 (common.css에서 처리) */

.com_area .list .contents_area img{max-width:100%; margin:0 auto; position:relative; object-fit: contain;}
.com_area .list .contents_area video{width:100%;}
.com_area .list .contents_area iframe{width:100%;}
.com_area .list .tag_area{display:flex; gap:10px; flex-grow:1;}
.com_area .list.view .tag_area{margin-bottom:15px;}
.com_area .list .tag_area .icon{display:flex; align-items: center; gap:5px; font-size:1.10em; color:var(--bodysubtext); padding:5px 10px;}
.com_area .list .tag_area .icon:nth-child(2):hover{background:var(--CommunityTheme-line); }
.com_area .list .tag_area ion-icon{font-size:1.33em;}
.comments_area{background:var(--commentsbodycolor); padding:0.6rem;}
.comments_area .user_comment{display:flex; flex-direction: column; background:var(--bodycolor); padding:10px;}
.comments_area .user_comment.other{margin-left:2rem;}
.comments_area .user_comment .user{position:relative; display:flex; align-items: center; gap:0.5rem; padding:0.5rem 0; }
.comments_area .user_comment .user .name{font-size:1.33em;}
.comments_area .user_comment .user .day{font-size:1.00em; color:var(--CommunityTheme-icon)}
.comments_area .user_comment .user .text_count{position:absolute; top:0; right:0; display:flex; align-items: center; color:var(--CommunityTheme-icon);}
.comments_area .user_comment .comment{border:2px solid var(--bodylinecolor); border-radius:5px; margin-bottom:10px;}
.comments_area .user_comment .comment > pre{word-break:break-all; white-space:pre-wrap;}
.comments_area .user_comment .comment > pre code{white-space: pre; overflow-x: auto; -webkit-overflow-scrolling:touch;}
.comments_area .user_comment textarea{resize:none; width:100%; height:4rem; outline: none; padding:12px 15px; box-sizing: border-box; overflow:hidden; border:0; border-radius:5px;}
.comments_area .otheruser_comment{ position:relative; display:flex; flex-direction: column; padding:10px;}
.comments_area .otheruser_comment.other{ margin-left:2rem; }
.comments_area .otheruser_comment.my{ background:var(--canvers); margin-bottom:20px;}
.comments_area .otheruser_comment.my .reple{ margin-bottom:0; }
.comments_area .otheruser_comment .otheruser{display:flex; align-items: center; gap:0.5rem; padding-bottom:1rem;}
.comments_area .otheruser_comment .otheruser .name{font-size:1.33em;}
.comments_area .otheruser_comment .otheruser .day{font-size:1.00em; color:var(--CommunityTheme-icon)}
.comments_area .otheruser_comment .comment{ border-radius:5px;color:var(--CommunityTheme-icon); padding-bottom:1rem;}
.comments_area .otheruser_comment .comment > pre{ word-break:break-all; white-space:pre-wrap;}
.comments_area .otheruser_comment .comment > pre code{white-space: pre; overflow-x: auto; -webkit-overflow-scrolling:touch;}
.comments_area .otheruser_comment .comment p {font-size:1.17em;}
.comments_area .otheruser_comment .reple{ display:flex; align-items: center; gap:5px; cursor:pointer; color:var(--bluecolor); margin-bottom:20px;}
.comments_area .btn{display:flex; align-items: center; gap:7px; justify-content: end; }
.comments_area .btn button{font-size:1.25em; font-weight:600; color:var(--CommunityTheme-icon); }

/* 박스 스타일 */
/* .card span.rutin:nth-child(1){position: absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(to right,transparent, #b6c9ff);animation: ani_line_one 3s linear infinite;}
@keyframes ani_line_one{
    0%{transform: translateX(-100%);}
    100%{transform: translateX(100%);}
}
.card span.rutin:nth-child(2){position: absolute;top:0;right:0;width:3px;height:100%;background:linear-gradient(to bottom,transparent, #b6c9ff);animation: ani_line_two 3s linear infinite;animation-delay: 1s;}
@keyframes ani_line_two{
    0%{transform: translateY(-100%);}
    100%{transform: translateY(100%);}
}
.card span.rutin:nth-child(3){position: absolute;bottom:0;left:0;width:100%;height:3px;background:linear-gradient(to left,transparent, #b6c9ff);animation: ani_line_three 3s linear infinite;}
@keyframes ani_line_three{
    0%{transform: translateX(100%);}
    100%{transform: translateX(-100%);}
}
.card span.rutin:nth-child(4){position: absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(to top,transparent, #a5bdff);animation: ani_line_four 3s linear infinite;animation-delay: 1s;}
@keyframes ani_line_four{
    0%{transform: translateY(100%);}
    100%{transform: translateY(-100%);}
} */
/* 박스 스타일 */
/* 뷰 메인 */

/* 글쓰기 메인 */
.post_area{width:740px; border:1px solid var(--bodylinecolor); background:var(--bodycolor); padding:20px;}
.post_area > div{padding-bottom:20px;}
.post_area > div:last-child{padding-bottom:0;}
.post_area .tag_area{display:flex; align-items: center;}
.post_area .tag_area .select{ width:calc(100% / 2); display:flex; align-items: center; gap:5px; font-size:1.33em; color:var(--bodytext); justify-content:center; text-align:left; border-right:1px solid var(--bodylinecolor); border-bottom:1px solid var(--CommunityTheme-line); padding:17px 10px;}
.post_area .tag_area .select:last-child{ border-right:0; }
.post_area .tag_area .select.active{ border-bottom:2px solid var(--orangecolor); color:var(--orangecolor); font-weight:600;}
.post_area .tag_area span ion-icon{font-size:1.50em;}
.text_area{display:flex; flex-direction: column;}
.text_area .title{ display:flex; gap:10px; align-items: center; margin-bottom:10px;}
.text_area .title textarea{resize:none; border:1px solid var(--CommunityTheme-line); border-radius:5px; outline: none; padding:12px 15px; box-sizing: border-box; overflow:hidden; flex-grow: 2;}
.text_area .word{margin-bottom:10px;}
.text_area .word img{width:100%;}
.file_area{display:flex; flex-direction: column;}
.file_area .title{display:flex; align-items: center; gap:10px; justify-content: space-between; font-size:1.50em; padding:0 10px 10px; font-weight:600; }
.file_area .title > span{display:flex; align-items: center; gap:5px;}
.file_area .output{line-height:1.5; font-size:1.17em;}
.file_area .fileupload button{background:var(--bluecolor); color:var(--bodycolor); border-radius:5px; padding:5px 8px;}
.file_area .fileupload label{background:var(--bluecolor); color:var(--bodycolor); border-radius:5px; padding:5px 8px;}
.file_area .filename{ display:flex; flex-direction: row; gap:15px; font-size:1.25em; border:1px dashed var(--bluecolor); padding:10px; flex-wrap:wrap}
.file_area .filename li{display:flex; align-items: center; gap:5px; cursor:pointer; background:var(--bluecolor-term); padding:5px;}
.file_area .filename li:hover{color:var(--bodysubtext)}
.file_area.view .filename{flex-direction: column; margin:10px 0 0;}

/* 글쓰기 메인 */

/* 내정보 */
.approval_wrap .photo_area{display:flex; align-items: center; gap:20px; margin-bottom:20px;}
.approval_wrap .photo_area .photo{position:relative;}
.approval_wrap .photo_area .photo img{width:80px; height:80px; object-fit: cover; border-radius:80px;}
.approval_wrap .photo_area .approval_edit{ display:none; position:absolute; bottom:-92px; right:-25px; background:var(--bodycolor); border:1px solid var(--CommunityTheme-line);padding:10px; z-index:2; font-size:1.25em;}
.approval_wrap .photo_area .approval_edit.active{display:block;}
.approval_wrap .photo_area .approval_edit a{ display:block; line-height:2;}
.approval_wrap .photo_area .approval_icon{position:absolute; bottom:-8px; right:-8px; width:35px; height:35px; background:var(--bodycolor); font-size:1.80em; display:flex; justify-content: center; align-items: center; border-radius:30px; border:1px solid var(--CommunityTheme-line)}
.approval_wrap .photo_area .text{font-size:1.25em;}
.approval_wrap .nickname_area{margin-bottom:20px;}
.approval_wrap .email_area{margin-bottom:20px;}
.approval_wrap .info_text{ width:100%; text-align:center; font-size:1.25em; line-height:1.5; margin-bottom:20px;}
/* 내정보 */

/* 404 에러 */
.errorpage_404{display:flex; flex-direction: column; align-items: center; justify-content: center; width:100%; height:100vh; text-align:center;}
.errorpage_404 div{padding:10px 0;}
.errorpage_404 div:nth-of-type(1){font-size:10em;}
.errorpage_404 div:nth-of-type(2){font-size:4em;}
.errorpage_404 div:nth-of-type(3){font-size:1.5em;}
.errorpage_404 div:nth-of-type(3) p{padding:5px 0;}
.errorpage_404 a{margin-top:20px;}
/* 404 에러 */

/* 푸터 */
.footer{width:100%; padding:30px 20px; background:var(--bodycolor); border-top:1px solid var(--CommunityTheme-line); margin-top:50px;}
.footer_content{max-width:1400px; margin:0 auto; text-align:center;}
.footer_links{display:flex; align-items: center; justify-content: center; gap:15px; margin-bottom:15px; flex-wrap:wrap;}
.footer_links a{color:var(--bodysubtext); text-decoration:none; font-size:0.95em; transition:color 0.2s;}
.footer_links a:hover{color:var(--bluecolor);}
.footer_links .separator{color:var(--CommunityTheme-line);}
.footer_copyright{color:var(--bodysubtext); font-size:0.85em;}
.footer_copyright p{margin:0;}