@charset "UTF-8";
 /*
	Author: jinwook
	Date:
	Project:
*/
/* 큰 모니터: */
@media only screen and (min-width : 1824px) {
       /* Styles */
}


/* 태블릿 및 작은 데스크탑: */
@media only screen and (min-width : 768px) and (max-width : 1224px) {       
       /* header */
       .head_area .pc_sublist{display:none;}
       .head_area .mobile_sublist{position:relative; display:flex; flex-direction: column; align-items: center;}
       .logo_slogans{display:none !important;}
       /* header */
       /* body */
       .container{padding-left:0;}
       .aside_wrap{display:none !important;}
       .com_area{width:100%;}
       .com_area .list{width:calc(50% - 15px);}
       /* body */
}


/* iPad (가로/세로): */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
       .searchbar_area .searchbar_box{width:260px;}
}


/* iPad (가로): */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
       /* header */
       .mobile_area{display:flex;}
       .head_area .logo{ transform: translateX(10%);}
       .logo_slogans{display:none !important;}
       /* header */

        /* body */
       .container{padding-left:0;}
       .aside_wrap{display:none !important;}
       .com_area{width:100%;}
       /* body */

       /* 작성 */
       .post_area{width:100%}
       /* 작성 */

       /* 내정보 */
       .choice_area{padding-left:0;}
       .com_area .list.view{width:100%;}
       /* 내정보 */
}


/* iPad (세로): */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
       /* header */
       .mobile_area{display:flex;}
       .head_area .logo{ transform: translateX(10%);}
       .head_area .add_btn > span{display:none;}
       .logo_slogans{display:none !important;}
       /* header */

       /* body */
       .container{padding-left:0;}
       .aside_wrap{display:none !important;}
       .com_area{width:100%;}
       .com_area .list{width:calc(100% / 2 - 20px);}
       /* body */

       /* 작성 */
       .post_area{width:100%}
       /* 작성 */

       /* 상세보기 */
       .com_area .list.view{width:100%;}
       /* 상세보기 */

       /* 내정보 */
       .choice_area{padding-left:0;}
       .com_area .list.view{width:100%;}
       /* 내정보 */
}



/* 모바일 디바이스 (스마트폰): */
@media only screen and (max-width : 767px) {
       /* header */
       .header{border-bottom:1px solid var(--bodycolor);}
       .mobile_area{display:flex;}
       .head_area .logo{ transform: translateX(0);}
       .head_area .logo .mobile_logo{display:block;}
       .head_area .logo .pc_logo{display:none;}
       .head_area .my_area .name{display:none;}
       .head_area .my_area.login_trigger .name{display:none !important;}
       .logo_slogans{display:none !important;}
       /* mobile header */
       .mobile_side_list{width:70%;}
       .head_area .pc_sublist{display:none;}
       .head_area .mobile_sublist{position:relative; display:flex; flex-direction: column; align-items: center;}
       /* mobile header */
       /* header */

       /* 알림 */
       .head_area .alram_area .alram_list{ display:none; position:absolute; top:29px; width:calc(100vw - 20px); max-width:300px; right:10px;}
       /* 알림 */

        /* body */
       .container{padding-left:0;}
       .aside_wrap{display:none !important;}
       .contents_wrap {width:100%; padding:70px 10px 10px; box-sizing:border-box;}
       .contents_wrap.center{padding:20px 10px 80px; box-sizing:border-box;}
       .com_area{width:100%;}
       .com_area .list{width:100%; margin:0 0 15px 0; box-sizing:border-box; padding:15px !important; overflow:hidden;}
       .com_area .list .title_area{font-size:1.5em !important; word-break: break-word; overflow-wrap: break-word;}
       .com_area .list .title_area p{word-break: break-word; overflow-wrap: break-word; max-width:100%;}
       .com_area .list .contents_area{ display: -webkit-box !important; -webkit-line-clamp: 5 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; max-height: 8.5em !important; word-break: break-word; overflow-wrap: break-word;}
       .com_area .list .contents_area p{display: -webkit-box !important; -webkit-line-clamp: 5 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; max-height: 10.625em !important; word-break: break-word; overflow-wrap: break-word; max-width:100%;}
       .com_area .list .contents_area *{max-height: inherit !important; overflow: hidden !important;}
       .com_area .list .contents_area img{max-width:100% !important; height:auto !important; box-sizing:border-box;}
       /* 게시글 이미지 영역 모바일 대응 */
       .com_area .list .post_image_area{width:100% !important; margin:10px 0 !important; border-radius:8px; overflow:hidden; box-sizing:border-box;}
       .com_area .list .post_image_area .post_thumbnail{width:100% !important; height:auto !important; max-height:300px !important; object-fit:cover; display:block; box-sizing:border-box;}
       /* 구글 애드센스 광고 모바일 대응 */
       .com_area .grid-item.adsense-ad{width:100% !important; margin:0 0 15px 0 !important; box-sizing:border-box;}
       .com_area .grid-item.adsense-ad .adsense-placeholder{font-size:11px;}
       .choice_area{ width:100%; padding:0; margin-bottom:10px; overflow-x:auto; transition: .2s ease-in; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; }
       .choice_area::-webkit-scrollbar{ display: none; }
       .choice_area .choice_box{display:flex; gap:10px; padding:0 10px; flex-shrink: 0; }
       .choice_area .choice_box button{width:120px; min-width:120px; padding:12px; font-size:14px; touch-action: manipulation; flex-shrink: 0; white-space: nowrap; }
       .searchbar_area .searchbar_box{width:90%;top:60px;background:var(--bodycolor); left:50%; position:absolute; transform: translateX(-50%);}
       .searchbar_area .searchbar_box .search_select{min-width:80px; max-width:120px; font-size:0.9em;}
       .searchbar_area .searchbar_box .search_select select{font-size:0.9em; padding:0 5px;}
       .searchbar_area .searchbar_box .input{width:calc(100% - 100px);}
       /* body */

       /* 글쓰기 */
       .post_area{width:100%; padding:25px 15px; box-sizing:border-box;}
       .file_area .filename{flex-direction: column;}
       .text_area .title{flex-direction: column; gap:10px;}
       .dropdown.post_dropdown{width:100%; padding:12px; font-size:16px; touch-action: manipulation; box-sizing:border-box;}
       .text_area .title textarea{width:100%; padding:12px; font-size:16px; box-sizing:border-box;}
       .text_area .word textarea{width:100%; padding:12px; font-size:16px; min-height:200px; box-sizing:border-box;}
       .btn_area{flex-direction: column-reverse; gap:10px;}
       .btn_area a, .btn_area button{width:100%; padding:14px; font-size:16px; touch-action: manipulation;}
       /* 글쓰기 */

       /* 글보기, 댓글 */
       .com_area .list.view{width:100%; padding:25px 15px; box-sizing:border-box;}
       .comments_area .otheruser_comment.other{margin-left:1rem;}
       .comments_area .user_comment.other{margin-left:1rem;}
       .tag_area .icon{min-width:44px; min-height:44px; touch-action: manipulation;}
       .tag_area button.icon{min-width:44px; min-height:44px; touch-action: manipulation;}
       /* 글보기, 댓글 */

       /* 내정보 */
       .contents_wrap.center_my{padding:70px 10px 10px; box-sizing:border-box;}
       /* 내정보 */

       /* 모달 */
       .login_modal_content, .mypage_modal_content{width:95%; max-width:460px; padding:24px 20px; margin:20px; box-sizing:border-box;}
       .login_modal_form label input{font-size:16px; padding:12px; min-height:44px; box-sizing:border-box;}
       .login_modal_submit{min-height:44px; padding:12px; font-size:16px; touch-action: manipulation;}
       /* 모달 */
       
       /* 푸터 모바일 대응 */
       .footer{position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important; padding: 10px 10px !important; margin-top: 0 !important; box-sizing: border-box !important; font-size: 11px !important;}
       .footer > div:first-child{flex-direction: row !important; justify-content: center !important; align-items: center !important; gap: 4px !important; flex-wrap: wrap !important; margin-bottom: 4px !important;}
       .footer .footer_links{flex-direction: row !important; justify-content: center !important; align-items: center !important; gap: 4px !important; flex-wrap: wrap !important; margin-bottom: 4px !important;}
       .footer .footer_links a{font-size: 11px !important; padding: 2px 4px !important; white-space: nowrap !important;}
       .footer .footer_links .separator{display: inline !important; font-size: 10px !important; color: var(--CommunityTheme-line, #e2e8f0) !important;}
       .footer .footer_copyright{text-align: center !important; font-size: 9px !important; line-height: 1.3 !important; word-break: keep-all !important; padding: 0 5px !important;}
}


/* 작은 모바일 디바이스: */
@media only screen and (max-width : 360px) {
       .head_area .logo{ transform: translateX(0);}
       .choice_area .choice_box button{width:100px; min-width:100px; font-size:13px; padding:10px;}
       .com_area .list{padding:12px !important;}
       .com_area .list .title_area{font-size:1.3em !important;}
       .login_modal_content, .mypage_modal_content{padding:20px 16px;}
}


/* iPhone4와 같은 높은 해상도: */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {
       /* Styles */
}