@charset "utf-8";

#wrap{ position: relative; width: 100%; max-width: 100%;  margin: 0 auto ;background-color: var(--ma_bg01);}
#wrap.sub_wrap{padding: 75px 0;min-height: 100vh;box-sizing: border-box;}

/* header */
#header{position: fixed;width: 100%;z-index: 1000;background: var(--ma_bg01);top: 0;left: 0;}
#header .pc_header{display:flex;align-items: center;height: 65px;}
#header .pc_header h1{padding-left: 15px;width: 305px ;font-size: 0;box-sizing: border-box;}
#header .pc_header h1 .logo_box{width: 145px;}
#header .pc_header h1 a{display: block; position:relative; width:100%; padding-bottom:13.793%; }
#header .pc_header h1 a img{position:absolute;left:0; right:0;  top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;}
#header .pc_header .right_box{display: flex;align-items: center;justify-content: space-between; width: calc(100% - 305px);height: 100%;padding-right: 15px;}
#header .pc_header .right_box form{position: relative;display: flex;height: 45px;background: #fff;width:calc(100% - 305px); border-radius: 23px;padding: 0 25px; gap: 10px; align-items: center;box-sizing: border-box;}
#header .pc_header .right_box form input{border: 0; font-size: 14px;width: calc(100% - 25px);}
#header .pc_header .right_box form input:focus{outline: none;}
#header .pc_header .right_box form input[type="search"]::-webkit-search-cancel-button {-webkit-appearance: none;appearance: none;display: none;}
#header .pc_header .right_box form .search_wrap{position: absolute;height: auto;max-height: 260px;overflow-y: scroll; left: 0;top: calc(100% + 10px);width: 100%;border-radius: 10px;background: #fff;box-shadow: 1px 1px 15px 0px rgba(0,0,0,.1);padding: 25px;}
#header .pc_header .right_box form .search_wrap::-webkit-scrollbar {width: 4px;}
#header .pc_header .right_box form .search_wrap::-webkit-scrollbar-thumb{background: var(--ma_c01);border-radius: 10px;}
#header .pc_header .right_box form .search_wrap::-webkit-scrollbar-track {background: transparent;}
#header .pc_header .right_box form .search_wrap .search_box:not(:last-child){margin-bottom: 10px;}
#header .pc_header .right_box form .search_wrap .search_box p.tit{font-size: 13px;font-weight: 600;margin-bottom: 15px;}
#header .pc_header .right_box form .search_wrap .search_box ul li{display: flex;gap:10px;align-items: center;margin-bottom: 10px;}
#header .pc_header .right_box form .search_wrap .search_box ul li:last-child{margin-bottom: 0;}
#header .pc_header .right_box form .search_wrap .search_box ul li .ico_box{width: 30px;}
#header .pc_header .right_box form .search_wrap .search_box ul li .ico_box .ico{position:relative; width:100%; padding-bottom:100%;border-radius: 50%;overflow: hidden;}
#header .pc_header .right_box form .search_wrap .search_box ul li .ico_box .ico img{position:absolute;left:0; right:0;  top:0; bottom:0; margin:auto; width:100%; height:100%; max-width:100%; max-height:100%;object-fit:cover;}
#header .pc_header .right_box form .search_wrap .search_box ul li .txt p{font-size: 12px;}
#header .pc_header .right_box form .search_wrap .search_box ul li .txt span{font-size: 11px;color: #555;}
#header .right_box .btn_box .logout_box,
#header .right_box .btn_box .login_box{position: relative;display: flex;align-items: center;gap:5px;justify-content: flex-end;}
/* #header .right_box .btn_box .logout_box{display: none;} */
#header .login_btn{display: block; width: 80px;line-height: 34px; border-radius: 17px;font-size: 14px;color: #fff;font-weight: 700;text-align: center; background: linear-gradient(to right, #FF2E2E, #FF7300);}
#header .right_box .login_box .create_btn{display: block; width: 80px;line-height: 34px; border-radius: 17px;font-size: 14px;color: #fff;font-weight: 700;text-align: center; background: #00CED1;}
#header .right_box .login_box .f_img_wrap{width: 34px;cursor: pointer;}
#header .right_box .login_box .f_img_wrap .img_box{position:relative; width:100%; padding-bottom:100%;overflow:hidden;border-radius: 50%;}
#header .right_box .login_box .f_img_wrap .img_box img{position:absolute;left:0; right:0;  top:0; bottom:0; margin:auto; width:100%; height:100%; max-width:100%; max-height:100%;object-fit:cover;}
#header .right_box .login_box .fade_box{display: none;position: absolute;right: 0;top: calc(100% + 10px);padding: 12px; width: 200px;border-radius: 12px;background: #fff;box-shadow: 1px 1px 15px 0px rgba(0,0,0,.2);}
#header .right_box .login_box .fade_box .f_box{display: flex;gap:10px;align-items: center;margin-bottom: 40px;}
#header .right_box .login_box .fade_box .f_box .f_img_wrap{width: 44px;}
#header .right_box .login_box .fade_box .f_box .txt{width: calc(100% - 54px);color: #454545;}
#header .right_box .login_box .fade_box .f_box .txt strong{font-size: 14px;}
#header .right_box .login_box .fade_box .f_box .txt p{font-size: 12px;font-weight: 500;margin-top: 10px;}
#header .right_box .login_box .fade_box .f_btn_box{display: flex;gap:5px;}
#header .right_box .login_box .fade_box .f_btn_box a,
#header .right_box .login_box .fade_box .f_btn_box button{display: flex;align-items: center;gap:3px;height: 18px;padding: 0 5px; border-radius: 4px;background: var(--ma_bg01);font-size: 11px;color: #333;font-weight: 500;}



#header .mob_header{display: none;}



/* leftMenu */
#leftMenu{position: fixed;top: 65px;left: 0;width: 305px;background-color: var(--ma_bg01);height: calc(100vh - 65px);z-index: 1000;padding: 0 15px;}
#leftMenu #gnb{height: 100%;}
#leftMenu .home_btn{margin-bottom: 5px;}
#leftMenu .home_btn a{display: flex;height: 45px;border-radius: 12px;gap: 13px;align-items: center;padding-left: 15px; background: #fff;margin: 0 auto;}
#leftMenu .home_btn a span{font-size: 14px;font-weight: 700;color: #454545;}
#leftMenu ul.menu01{height: 70%;overflow-y: scroll;}
#leftMenu ul.menu01::-webkit-scrollbar {width: 4px;}
#leftMenu ul.menu01::-webkit-scrollbar-thumb{height: 30%;background: rgba(255,255,255,.5);border-radius: 10px;}
#leftMenu ul.menu01::-webkit-scrollbar-track {background: transparent;}
#leftMenu ul.menu01 li .btn_box{display: flex;align-items: center;height: 45px;padding: 0 13px;justify-content: space-between;}
#leftMenu ul.menu01 li .btn_box a{position: relative;display: flex;gap:13px;align-items: center;width: calc(100% - 20px);}
/* #leftMenu ul.menu01 li > a:after{content:'';position: absolute;transition: .2s; right: 13px;top: 50%;transform: translateY(-50%);width:11px;height: 6px;background:url(/asset/images/main/main_meun_ico11.svg)center no-repeat;background-size:cover ;  }
#leftMenu ul.menu01 li.on > a:after{transform: rotate(180deg);} */
#leftMenu ul.menu01 li .btn_box button{display: flex;width: 15px;align-items: center;justify-content: center;}
#leftMenu ul.menu01 li .btn_box button img{transition: .3s;}
#leftMenu ul.menu01 li .btn_box.on button img{transform: rotate(180deg);}
#leftMenu ul.menu01 li a span{display: block;width: calc(100% - 50px);transition:.2s; color: #454545;font-size: 14px;font-weight: 700;white-space: nowrap; overflow:hidden;text-overflow: ellipsis; }
#leftMenu ul.menu01 li a span:hover,
#leftMenu ul.menu01 li .btn_box.on a span{color: var(--ma_c01);}
#leftMenu ul.menu01 li ul{display: none;} 
#leftMenu ul.menu01 li ul li .btn_box{padding: 0 27px;} /* 왼쪽 메뉴 간격 조정 기존 20px -> 27px */
#leftMenu ul.menu01 li ul li .btn_box button img{width: 11px;}
/* #leftMenu ul.menu01 li ul li a:after{right: 20px;width:10px;transition: .2s;height: 5px;background:url(/asset/images/main/main_meun_ico12.svg)center no-repeat;background-size:cover ; } */
#leftMenu ul.menu01 li ul li a .btn_box.on span{color:var(--ma_c01);}
/* #leftMenu ul.menu01 li ul li.on a:after{transform: rotate(180deg);} */
#leftMenu ul.menu01 li ul li ul li .btn_box{padding: 0 30px 0 45px;height: 35px;}
#leftMenu ul.menu01 li ul li ul li .btn_box button img{width: 9px;}
#leftMenu ul.menu01 li ul li ul li a{position: relative; display: block;}
#leftMenu ul.menu01 li ul li ul li a span{width: calc(100% - 10px); font-size: 13px;color: #454545;line-height: 35px;font-weight: 500;}
/* #leftMenu ul.menu01 li ul li ul li a:after{width:7px;height: 4px;} */
#leftMenu ul.menu01 li ul li ul li a:before{content:'';position: absolute;left: -7px;top: 50%;transform: translateY(-50%);width: 1px;height: 11px;background: #454545;}
#leftMenu ul.menu01 li ul li ul li ul li .btn_box{padding: 0 45px 0 55px;}
#leftMenu ul.menu01 li ul li ul li ul li a{position: relative;}
#leftMenu ul.menu01 li ul li ul li ul li a:before{left: -10px;width: 2px;height: 2px;border-radius: 50%;background: #000;}
#leftMenu ul.menu01 li ul li ul li ul li a span{width: 100%;font-size: 12px;color: #454545;font-weight: 500;height: 30px;line-height: 30px;}
#leftMenu .dev_btn{position: absolute;bottom: 35px;left: 50%;transform: translateX(-50%);}
#leftMenu .dev_btn a{display: flex;align-items: center; justify-content: center;gap:5px;width: 235px;height: 45px;border-radius: 12px;background: #09C5C3;}
#leftMenu .dev_btn a span{font-size: 14px;color: #fff;font-weight: 700;}
#leftMenu .left_menu_bg{display: none;}


/* banner */
#banner{position: fixed;top: 65px;width: 268px;right: 15px;height: calc(100vh - 65px);overflow-y: scroll;}
#banner::-webkit-scrollbar {width: 4px;}
#banner::-webkit-scrollbar-thumb{background: var(--ma_c01);border-radius: 10px;}
#banner::-webkit-scrollbar-track {background: transparent;}
#banner .banner_box{position: sticky;top: 65px;right: 0;overflow: hidden;}
#banner .banner_box ul li a{display: block; position:relative; width:100%; padding-bottom:101.493%;overflow:hidden;border-radius: 12px;}
#banner .banner_box ul li a img{position:absolute;left:0; right:0;  top:0; bottom:0; margin:auto; width:100%; height:100%; max-width:100%; max-height:100%;object-fit:cover;}
#banner .con_box{min-height: calc(100vh - 353px);margin-top: 20px;}
#banner .con_box .con_foot p{font-size: 12px;letter-spacing: -.5px;line-height: 1.4;}
#banner .con_box .con_foot p.copy{margin-top: 5px;color: #999;}
#banner .con_box .con_foot p span{padding: 0 5px;}

/* member */
.member_form input[type="text"],
.member_form input[type="password"]{width: 100%;border: 1px solid #DADADA;border-radius: 12px;padding: 0 20px;font-size: 13px;height: 45px;}
.member_form input[type="file"]{display: none;}
.member_form input[type="file"] + label{display: flex;gap:8px;align-items: center;justify-content: center;flex-direction: column; width: 130px;height: 130px;border-radius: 12px;border: 1px solid #D9D9D9;background-size: cover;background-position: center;cursor: pointer;overflow: hidden;position: relative;}
.member_form input[type="file"] + label span{font-size: 13px;color: #999;}
.member_form input::placeholder{color: #999;}
input:read-only{background: #e6e5e5;outline: none;}
.btn_wrap input{padding: 0 100px 0 20px;}
.member_form ul li.name_box input{width: calc((100% - 8px)/2);}

/* 버튼스타일 */
.btn_st01{width: 75px;height: 35px;border-radius: 10px;background: #FF8601;color: #fff;font-size: 12px;font-weight: 600;}
.btn_st02{display: flex;gap:10px;align-items: center;justify-content: center; width: 100%;height: 45px;border-radius: 10px;font-size: 14px;color: #fff;font-weight: 600;background: var(--ma_c01);}
.btn_st03{background: #FAFAFA;}
.btn_st03 span{color: #000;}
.btn_st04{background: linear-gradient(to bottom, #18ACFE, #0265E1);}
.btn_st05{background: #000;}
.btn_st06{display: block; width: 105px;height: 34px;border-radius: 17px;background: #00CED1;color: #fff;font-size: 14px;font-weight: 700;margin: 0 auto;}
.btn_st07{display: block;text-align: center;line-height: 42px; width: 140px;height: 42px;border-radius: 10px;background: var(--ma_c01);color: #fff;font-size: 14px;font-weight: 600;margin: 0 auto;}
.btn_st07_g{ background: #868686;}
.btn_st08{width: 60px;height: 28px;border-radius: 8px;background: #6C6C6C;font-size: 12px;font-weight: 600;color: #fff;}

/* 내 글 보기 버튼 스타일 */
.myPost_btn { display: inline-block; text-decoration: none; margin-top: 8px;}

.myPost_btn button {
    display: inline-block;
    padding: 8px 16px;
    background: #fff;
    color: var(--ma_c01);
    border: 1px solid var(--ma_c01);
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    font-family: "Noto Sans KR", sans-serif;
}

.myPost_btn:hover button {
    background: var(--ma_c01);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(255, 99, 1, 0.3);
}

.myPost_btn:active button {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(255, 99, 1, 0.2);
} /* ? 마이 페이지 내 글 보기 스타일 */


/* 체크박스 스타일 */
.ck_box input{display: none;}
.ck_box label{position: relative; display: block;padding-left: 22px;font-size: 13px;font-weight: 600;}
.ck_box label:after{content:'';position: absolute;left: 0;top: 50%;transition:.2s;transform: translateY(-50%);width: 16px;height: 16px;border-radius: 4px;border: 1px solid rgba(0,0,0,.2);}
.ck_box input:checked + label:after{background: var(--ma_c01);border: 1px solid var(--ma_c01);}
.ck_box label:before{content:'';position: absolute;z-index: 10;left: 4px;top: 50%;transform: translateY(-50%);width: 10px;height: 7px;background: url(../images/sub/terms_ico01.svg);}
.ck_box label span{color: #FF2E2E;}


/* 라디오 스타일 */
.ra_box input{display: none;}
.ra_box label{position: relative; display: block;padding-left: 22px;font-size: 13px;font-weight: 600;}
.ra_box label:after{content:'';position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 15px;height: 15px;border-radius: 50%;border: 1px solid rgba(0,0,0,.5);}
.ra_box label:before{content:'';position: absolute;z-index: 10;left:4px;top: 50%;transform: translateY(-50%);transition:.2s;opacity: 0; width: 8px;height: 8px;background: var(--ma_c01);border-radius: 50%;}
.ra_box input:checked + label:before{opacity: 1;}


/* 셀렉트 박스 */
.select_st01{position: relative;width: 200px;height: 40px;border-radius: 12px;border: 1px solid #DADADA ;padding: 0 15px;font-size: 12px;text-align: left;appearance: none;background: url(../images/sub/post_ico01.svg) right  15px center  no-repeat;background-size: 8px auto;}
.select_st02{width: 120px;height: 35px;border-radius: 8px;}

/* 게시판 스타일 */
table.board_table{table-layout: fixed;width: 100%;}
table.board_table th{padding: 13px 0;text-align: center;font-size: 15px;background: #09C5C3;color: #fff;font-weight: 600;line-height: 1.3;}
table.board_table th:nth-child(1),
table.board_table td:nth-child(1){border-radius: 4px 0 0 4px;}
table.board_table th:last-child,
table.board_table td:last-child{border-radius: 0 4px 4px 0;}
table.board_table td{padding: 13px 0;text-align: center;font-size: 14px; border-bottom: 1px solid #ddd;transition:.2s;line-height: 1.3;}
table.board_table tr:hover td{background: #f1f1f1;}
table.board_table td a{display: flex;justify-content: center; gap:5px;}
table.board_table td a p{font-size: 14px; max-width:calc(100% - 150px);text-align: left; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; }
table.board_table td a span{font-size: 13px;color: var(--ma_c01);}


ul.board_list{display: none;}


/* 페이징 */
ul.paging{display: flex;justify-content: center;align-items: center; margin-top: 50px;gap:3px;}
ul.paging li a{display: flex;align-items: center;justify-content: center;width: 30px;height: 30px;border: 1px solid #ddd;font-size: 13px;transition:.2s;}
ul.paging li.on01 a{background: var(--ma_c01);color: #fff;border: 1px solid var(--ma_c01);}
ul.paging li a:hover{background: var(--ma_c01);color: #fff;border: 1px solid var(--ma_c01);}


/* 이미지설정 */
.img_cover_Wrap{width: 100px;}
.img_cover{position:relative; width:100%;padding-bottom: 100%;}
.img_cover img{position:absolute;left:0; right:0;  top:0; bottom:0; margin:auto; width:100%; height:100%; max-width:100%; max-height:100%;object-fit:cover;}

.img_ratio_Wrap{width: 100px;}
.img_ratio{position:relative; width:100%;padding-bottom: 100%;}
.img_ratio img{position:absolute;left:0; right:0;  top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;}


/* 이미지 없을때 설정 */
.no_img{position: relative; width: 100%;padding-bottom: 100%;border-radius: 50%;overflow:hidden;background: #ccc;}
.no_profile_wrap{padding-bottom: 0 !important;}
.no_img i{position: absolute;left: 50%;top: 65%;transform: translate(-50% , -50%);font-size: 40px;color: #999;}

#mypage_wrap .no_img i{font-size: 120px;}


/* 팝업 */
.pop_wrap{position: fixed;width: 100%;height: 100vh;left: 0;top: 0;background: rgba(0,0,0,.5); z-index: 10000;}
.pop_wrap .pop_box{position: absolute;top: 50%;left: 50%;transform: translate(-50% , -50%);width: 400px;border: 1px solid #ddd;background: #fff;border-radius: 20px;overflow: hidden;}
.pop_wrap .pop_box img{width: 100%;}
.pop_wrap .pop_box .close_box{display: flex;width: 100%;border-top: 1px solid #ddd;}
.pop_wrap .pop_box .close_box button,
.pop_wrap .pop_box .close_box a{display: flex;align-items: center;justify-content: center;line-height: 1.3;height: 50px;text-align: center;flex:1;font-size: 14px;border-right: 1px solid #ddd;color: #000;}



/* 공통 sub */
.sub02_wrap{position: relative;width: calc(100% - 305px);height: calc(100% - 35px);min-height: calc(100vh - 110px);border-radius: 12px;height: 100%;background: #fff;padding: 30px 25px 100px;}
.sub02_wrap h3{font-size: 18px;margin-bottom: 15px;}
.sub02_wrap.sub02_wrap_bgn{background: var(--ma_bg01);padding: 0;}
.sub02_wrap.sub02_wrap_bgn h4{font-size: 15px;font-weight: 600;margin-bottom: 15px ;}


/* footer */
#footer{position: fixed;left: 305px;bottom: 0;width: calc(100% - 625px);height: 40px;line-height: 40px;text-align: center;background:var(--ma_bg01);z-index: 1000;}



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

#header .pc_header h1{padding-left: 15px;width: 270px;font-size: 0;box-sizing: border-box;}
#header .pc_header .right_box{width: calc(100% - 270px);}
#header .pc_header .right_box form{width: calc(100% - 265px);}
#leftMenu{width: 270px;}

.sub02_wrap{width: 100%;}

#banner{display: none;}

#footer{left: 270px;width: calc(100% - 285px);}

}


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

#wrap {position:relative; width:100%; max-width:1024px; min-width: 375px; margin:0 auto;}

#header .pc_header{display: none;}
#header .mob_header{display: flex;padding: 0 15px;align-items: center;justify-content: space-between;height: 60px;}
#header .mob_header .left_box{display: flex;align-items: center;gap:15px;}
#header .mob_header .left_box button {position: relative;width:30px;height: 20px;}
#header .mob_header .left_box button span{position: absolute;display: block;width: 100%;height: 2px;background: #454545;left: 0;top: 0;transition:.4s;}
#header .mob_header .left_box button span:nth-child(1){top: 2px;}
#header .mob_header .left_box button span:nth-child(2){top: 50%;transform:translateY(calc(-50% + 1px));}
#header .mob_header .left_box button span:nth-child(3){top: calc(100% - 2px);}
/* 버튼 누를시 애니메이션 */
#header .mob_header .left_box button.on span:nth-child(1){transform:rotate(-45deg) translateY(-50%);top: 50%;}
#header .mob_header .left_box button.on span:nth-child(2){transform:translateY(-50%) translateX(20px);opacity: 0;}
#header .mob_header .left_box button.on span:nth-child(3){transform:rotate(45deg) translateY(-50%);top: 50%;}

#header .mob_header .left_box h1{width: 25px;}
#header .mob_header .left_box a{display: block;position:relative; width:100%; padding-bottom:100%; }
#header .mob_header .left_box a img{position:absolute;left:0; right:0;  top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;}

#header .mob_header .right_box{display: flex;align-items: center;gap:15px;}
#header .mob_header .right_box button.search_btn img{width: 25px;}

#header .mob_header .search_box{position: fixed;display: none; top: 60px;left: 0;width: 100%;background: var(--ma_bg01);border-top: 1px solid var(--ma_c01);}
#header .mob_header .search_box .flex_box{display: flex;align-items: center;justify-content: center;height: 70px;}
#header .mob_header .search_box form{display: flex;height: 40px;background: #fff;width:90%; border-radius: 23px;padding: 0 25px; gap: 10px; align-items: center;box-sizing: border-box;}
#header .mob_header .search_box form input{border: 0; font-size: 14px;width: calc(100% - 25px);}
#header .mob_header .search_box form input:focus{outline: none;}
#header .mob_header .search_box form input[type="search"]::-webkit-search-cancel-button {-webkit-appearance: none;appearance: none;display: none;}
#header .mob_header .search_box form .search_wrap{position: absolute;left: 0;top: 100%;width: 100%;background:var(--ma_bg01);padding-bottom: 25px;}
#header .mob_header .search_box form .search_wrap .s_bg_box{margin: 0 auto;height: 260px;overflow-y: scroll;background: #fff;width: 90%;box-shadow: 1px 1px 15px 0px rgba(0,0,0,.1);padding: 25px;border-radius: 10px;}
#header .mob_header .search_box form .search_wrap .s_bg_box::-webkit-scrollbar {width: 4px;}
#header .mob_header .search_box form .search_wrap .s_bg_box::-webkit-scrollbar-thumb{background: var(--ma_c01);border-radius: 10px;}
#header .mob_header .search_box form .search_wrap .s_bg_box::-webkit-scrollbar-track {background: transparent;}
#header .mob_header .search_box form .search_wrap .search_box_mob:not(:last-child){margin-bottom: 10px;}
#header .mob_header .search_box form .search_wrap .search_box_mob p.tit{font-size: 13px;font-weight: 600;margin-bottom: 15px;}
#header .mob_header .search_box form .search_wrap .search_box_mob ul li{display: flex;gap:10px;align-items: center;margin-bottom: 10px;}
#header .mob_header .search_box form .search_wrap .search_box_mob ul li:last-child{margin-bottom: 0;}
#header .mob_header .search_box form .search_wrap .search_box_mob ul li .ico_box{width: 30px;}
#header .mob_header .search_box form .search_wrap .search_box_mob ul li .ico_box .ico{position:relative; width:100%; padding-bottom:100%;border-radius: 50%;overflow: hidden;}
#header .mob_header .search_box form .search_wrap .search_box_mob ul li .ico_box .ico img{position:absolute;left:0; right:0;  top:0; bottom:0; margin:auto; width:100%; height:100%; max-width:100%; max-height:100%;object-fit:cover;}
#header .mob_header .search_box form .search_wrap .search_box_mob ul li .txt p{font-size: 12px;}
#header .mob_header .search_box form .search_wrap .search_box_mob ul li .txt span{font-size: 11px;color: #555;}

#leftMenu{display: none;height: calc(100vh - 60px);top: 60px;}
#leftMenu .left_menu_bg{display: block;position: fixed;right: 0;top: 60px;width: calc(100% - 270px);height: calc(100vh - 60px);background: rgba(0,0,0,.5);}

.sub02_wrap{width: 100%;padding-bottom: 80px;}

#footer{position: fixed;left: 0;bottom: 0;width: 100%;height: 35px;line-height: 35px;font-size: 14px;text-align: center;background:var(--ma_bg01);z-index: 800;}
#footer.sub_footer{left:0px;width: 100%;}

}


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

#wrap {position:relative; width:100%; max-width:767px; min-width: 320px; margin:0 auto;}
#wrap.sub_wrap{padding: 0px 0;}


#header .pc_header{display: none;}
#header .mob_header{display: flex;padding: 0 10px;align-items: center;justify-content: space-between;height: 50px;}
#header .mob_header .left_box{display: flex;align-items: center;gap:10px;}
#header .mob_header .left_box button {position: relative;width:25px;height: 20px;}
#header .mob_header .left_box button span{position: absolute;display: block;width: 100%;height: 1px;background: #454545;left: 0;top: 0;transition:.4s;}
#header .mob_header .left_box button span:nth-child(1){top: 2px;}
#header .mob_header .left_box button span:nth-child(2){top: 50%;transform:translateY(calc(-50% + 0px));}
#header .mob_header .left_box button span:nth-child(3){top: calc(100% - 2px);}
/* 버튼 누를시 애니메이션 */
#header .mob_header .left_box button.on span:nth-child(1){transform:rotate(-45deg) translateY(-50%);top: 50%;}
#header .mob_header .left_box button.on span:nth-child(2){transform:translateY(-50%) translateX(-20px);opacity: 0;}
#header .mob_header .left_box button.on span:nth-child(3){transform:rotate(45deg) translateY(-50%);top: 50%;}

#header .mob_header .left_box a{font-size: 0;}
#header .mob_header .left_box a img{width: 25px;}

#header .mob_header .right_box{display: flex;align-items: center;gap:10px;}
#header .mob_header .right_box button.search_btn img{width: 20px;}
#header .login_btn{width: 60px;line-height: 30px; border-radius: 13px;font-size: 12px;color: #fff;font-weight: 700;text-align: center; background: linear-gradient(to right, #FF2E2E, #FF7300);}
#header .right_box .login_box .create_btn{width: 60px;line-height: 30px; border-radius: 13px;font-size: 12px;}

#header .mob_header .search_box{position: fixed;display: none; top: 50px;left: 0;width: 100%;background: var(--ma_bg01);border-top: 1px solid var(--ma_c01);}
#header .mob_header .search_box .flex_box{display: flex;align-items: center;justify-content: center;height: 70px;}
#header .mob_header .search_box form{display: flex;height: 40px;background: #fff;width:90%; border-radius: 23px;padding: 0 25px; gap: 10px; align-items: center;box-sizing: border-box;}
#header .mob_header .search_box form input{border: 0; font-size: 14px;width: calc(100% - 25px);}
#header .mob_header .search_box form input:focus{outline: none;}

#leftMenu{display: none;width: 265px;height: calc(100vh - 50px);top: 50px;}
#leftMenu .left_menu_bg{display: block;position: fixed;right: 0;top: 50px;width: calc(100% - 265px);height: calc(100vh - 50px);background: rgba(0,0,0,.5);}


/* 팝업 */
.pop_wrap{position: fixed;width: 100%;height: 100vh;left: 0;top: 0;background: rgba(0,0,0,.5); z-index: 10000;}
.pop_wrap .pop_box{position: absolute;top: 50%;left: 50%;transform: translate(-50% , -50%);width: 300px;border: 1px solid #ddd;background: #fff;border-radius: 20px;overflow: hidden;}
.pop_wrap .pop_box img{width: 100%;}
.pop_wrap .pop_box .close_box{display: flex;width: 100%;border-top: 1px solid #ddd;}
.pop_wrap .pop_box .close_box button,
.pop_wrap .pop_box .close_box a{display: flex;align-items: center;justify-content: center; height: 40px;line-height: 1.3;text-align: center;flex:1;font-size: 12px;border-right: 1px solid #ddd;color: #000;}
.pop_wrap .pop_box .close_box button:last-child{border-right: 0;}


.sub02_wrap{width: 100%;padding-bottom: 60px;}
.sub02_wrap.sub02_wrap_bgn h4{margin-bottom: 20px;}


/* 게시판 스타일 */
table.board_table{display: none;}

ul.board_list{display: block;}
ul.board_list li{padding:10px;border: 1px  solid #ddd;border-bottom: 0;}
ul.board_list li:last-child{border-bottom: 1px  solid #ddd;}
ul.board_list li a{display: block;}
ul.board_list li a .top{margin-bottom: 10px;}
ul.board_list li a .top strong{display: block;font-size: 14px;margin-bottom: 10px;}
ul.board_list li a .top .txt{ display: flex;gap:3px;}
ul.board_list li a .top p{max-width: calc(100% - 80px);font-size: 13px;line-height: 1.2; font-weight: 500;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word;}
ul.board_list li a .top span{font-size: 12px;color: var(--ma_c01);}
ul.board_list li a .bot{display: flex;gap:10px;align-items: center;}
ul.board_list li a .bot p{position: relative;font-size: 13px;}
ul.board_list li a .bot p:after{content:'';position: absolute;right: -6px;top: 50%;transform: translateY(-50%);width: 1px;height: 13px;background: #ddd;}
ul.board_list li a .bot p:last-child:after{display: none;}


/* 페이징 */
ul.paging{margin-top: 30px;gap:2px;}
ul.paging li a{width: 25px;height: 25px;font-size: 11px;}


#footer{position: fixed;left: 0;bottom: 0;width: 100%;height: 35px;line-height: 35px;font-size: 14px;text-align: center;background:var(--ma_bg01);z-index: 800;}

}


/* 카테고리 대제목(섹션 타이틀) 스타일 */
.category-title {
    display: block;
    font-size: 2rem;
    font-weight: 700;
    color: #222;
    margin-bottom: 18px;
    margin-top: 10px;
    letter-spacing: -0.5px;
    text-align: left;
}

@media screen and (max-width: 767px) {
  .category-title {
    font-size: 1.3rem;
    margin-bottom: 12px;
    margin-top: 6px;
  }
}