@charset "utf-8";

@font-face {
    font-family: 'GmarketSansLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Chosunilbo_myungjo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/Chosunilbo_myungjo.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GongGothicLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

:root {
    --list-color: transparent;
    --list-item-color: transparent;

    --load-text: #2f4b30;
    --load-text2: #FFF3D5;
    --load-base: #ffffff;
    --load-base2: #FFF3D5;
    --load-point: #4D694E;
    --load-point-trans: #4D694E99;
    --load-point2: #E79662;
    --load-point2-trans: #E7966233;
    --load-shadow: rgba(47, 75, 48, 0.2);
    --load-pic-shadow: rgba(47, 75, 48, 0.08);
    --load-reply-shadow: rgba(47, 75, 48, 0.04);
    --load-gra: linear-gradient(to right, #4D694E, #759176);

    --load-hash: #FFF3D5;
    --load-hash-bg: #E79662;
    --hash-font: 'GongGothicLight';

    --page-font-size: 10px;
    --text-font: 'Chosunilbo_myungjo';
    --point-font: 'GmarketSansLight';
}

/*아보카도 디자인 설정 덮어쓰기*/
body #log_list { background-color: var(--list-color); }
body #log_list .item { background-color: var(--list-item-color); }
body #log_list .item .item-inner .ui-pic { color: var(--load-point); background-color: transparent; }
body #log_list .item .item-inner .ui-comment,
body #log_list .item .item-inner .item-comment { background-color: var(--load-base); }
body #log_list .item .item-inner .item-comment.item-reply { opacity: 1; }
body #log_list .item .item-inner .item-comment.parent,
#log_list .item .item-inner .ui-comment .item-comment.item-reply { margin-bottom: 0px !important; }
body #log_list .item .item-inner .ui-comment { padding: 0px; }
body #log_list .item .item-inner .item-comment { color: var(--load-text); }

.error { position: relative; text-align: center; line-height: 1.8em; padding-top: 70px; }
.error .btn-group { padding: 20px 0 0; }

.ui-mmb-list-category { text-align: center; }
.ui-mmb-list-category a { display: inline-block; position: relative; padding: 6px 10px; font-weight: bold; border-radius: 3px; }

.ui-mmb-button { text-align: center; padding-top: 10px; }
.help.ui-btn { width: 100%; padding: 2px; line-height: 1.2em; border-radius: 3px; margin-bottom: 5px; }
.ui-paging { margin-bottom: 0; padding-bottom: 0; }


/***************************************
    List Page
****************************************/

.connect-wiget { min-height: 40px; text-align: center; line-height: 40px; }

.board-notice {
    width: 340px;
    padding: 20px;
    margin: 20px auto;
    text-align: center;
    box-sizing: border-box;
    filter: drop-shadow(1px 1px 3px var(--load-shadow));
}

#navi_category { text-align: center; vertical-align: middle; padding: 10px 5px 0px 0px; }
#navi_category li { display: inline-block; padding: 0 20px; }

#log_list { position: relative; margin-top: 30px; }
#log_list .empty_list { text-align: center; line-height: 100px; }
#log_list .item { clear: both; margin: 0 0 35px 0; }
#log_list .item:after { content: ""; display: block; clear: both; }
#log_list .item .ui-pic,
#log_list .item .ui-comment { float: left; box-sizing: border-box; }
#log_list .item .ui-comment { padding: 0; overflow: hidden; width: 100%; }
#log_list .item-comment-box {
    background: transparent !important;
    background-color: transparent !important;
}

#log_list .item.ui-wrap .ui-pic,
#log_list .item.ui-wrap .ui-comment,
#log_list .item.both .ui-pic,
#log_list .item.both .ui-comment { float: none; clear: both; width: 100% !important; }
#log_list .item.ui-wrap .ui-pic { max-width: 100% !important; }
#log_list .item.ui-wrap .ui-comment,
#log_list .item.both .ui-comment { margin-left: 0px; padding-top: 20px; width: 100% !important; box-sizing: border-box; }


/** Picture **/
#log_list .item .ui-pic { position: relative; min-width: 100%; }

#log_list .item .ui-pic .pic-header {
    position: relative;
    line-height: 47px;
    padding: 0 10px;
    background-color: var(--load-base);
    box-shadow: 0px 4px 4px -2px var(--load-pic-shadow);
    z-index: 3;
}

.pic-footer {
    position: relative;
    line-height: 60px;
    padding: 0 10px;
    background-color: var(--load-base);
    box-shadow: 0px -4px 4px -2px var(--load-pic-shadow);
    z-index: 3;
    height: 40px;
}
.pic-footer .footer-memo { top: -7px; right: 20px; position: absolute; }
.pic-footer .material-icons { padding: 0px 4px; }

.pic-data .theme-box,
.pic-data .theme-box2 { border-radius: 0px; }

/* No. 아이콘 */
#log_list .item .ui-pic .pic-header .no:before {
    display: block;
    position: absolute;
    content: '';
    width: 35px;
    height: 35px;
    border-radius: 50%;
    margin: 6px 3px;
    background-image: url(./img/holo.jpg) !important;
    animation-duration: 10s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: linear;
    animation-name: fluid;
    background-size: 500%;
    box-shadow: inset 0px 1px 2px var(--load-shadow);
}
#log_list .item .ui-pic .pic-header .no {
    display: inline-block;
    font-family: var(--point-font);
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
}
#log_list .item .ui-pic .pic-header .no .hologram {
    margin: 0px 0px 0px 51px;
    letter-spacing: -0.9px;
    display: inline-block;
}
#log_list .item .ui-pic .pic-header span.date {
    font-weight: normal;
    font-size: 12px;
    opacity: 0.7;
    padding: 0 5px;
}
#log_list .item-comment .co-header .date {
    float: right;
    font-size: 10px;
    font-weight: normal;
    color: #888;
    font-family: gulim;
}
#log_list .item-inner {
    box-shadow: 0px 0px 12px rgba(77, 105, 78, 0.25);
    border-radius: 15px;
    overflow: hidden;
}

.animate__animated.animate__bounce { --animate-duration: 2s; }

.smooth-box {
    transition-duration: 0.5s;
    transition-timing-function: ease-in-out;
}

#log_list .item .ui-pic .pic-header .del {
    display: inline-block;
    width: 18px;
    height: 18px;
    overflow: hidden;
    text-indent: -999px;
    background: #000;
    color: white;
    transform: rotate(45deg);
    float: right;
    margin: 16px 7px 0px 5px;
    font-weight: bold;
}
#log_list .item .ui-pic .pic-header .del:hover { color: black; background: white; }
#log_list .item .ui-pic .pic-header .del:before {
    content: 'X';
    display: block;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    line-height: 19px;
    text-indent: 0;
    text-align: center;
    font-size: 11px;
    transform: rotate(-45deg);
}

#log_list .item .ui-pic .pic-header .mod {
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    overflow: hidden;
    text-indent: -999px;
    margin: 16px 5px 0px 5px;
    background: #000;
    color: white;
    transform: rotate(45deg);
    float: right;
    font-weight: bold;
}
#log_list .item .ui-pic .pic-header .mod:before {
    content: 'M';
    display: block;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    line-height: 19px;
    text-indent: 0;
    text-align: center;
    font-size: 11px;
    transform: rotate(-45deg);
}
#log_list .item .ui-pic .pic-header .mod:hover { color: black; background: white; }

#log_list .item .ui-pic .pic-header .new { display: inline-block; float: right; vertical-align: middle; position: relative; width: 14px; height: 30px; line-height: 30px; overflow: hidden; text-indent: -999px; padding-left: 10px; }
#log_list .item .ui-pic .pic-header .new:before { content: 'N'; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 30px; text-indent: 0; text-align: center; font-size: 11px; font-weight: bold; }

#log_list .item .ui-pic .ch-tags { padding: 5px 10px; }
#log_list .item .ui-pic .ch-tags a { display: inline-block; margin-left: 2px; }
#log_list .item .ui-pic .ch-tags .ui-btn.small { height: 20px; line-height: 20px; font-size: 11px; padding: 0 8px; opacity: 0.8; }
#log_list .item .ui-pic .ch-tags > span { margin-left: 2px; cursor: default; }

/* 카테고리 */
#log_list .item .ui-pic .ico-category { font-size: 11px; font-family: var(--point-font); font-weight: 400; margin-left: 7px; }

#log_list .item .ui-pic .pic-data {
    text-align: center;
    overflow: hidden;
    margin: 0 auto;
    background: radial-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0));
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    width: 100%;
}
#log_list .item .ui-pic .pic-data.ui-blind { overflow: hidden; height: 250px; }
#log_list .item .ui-pic .pic-data.ui-slide > div { display: none; }
#log_list .item .ui-pic .pic-data.ui-slide > .ui-open-log { display: block; height: 25px; text-align: center; line-height: 25px; }

#log_list .item .ui-pic .pic-data.ui-slide-mobile > div { overflow: hidden; height: auto; }
#log_list .item .ui-pic .pic-data.ui-slide-mobile > div > a { display: block; position: relative; overflow: hidden; }
#log_list .item .ui-pic .pic-data.ui-slide-mobile > div > a:before { content: ""; display: block; position: absolute; line-height: 300px; font-size: 18px; top: 0; left: 0; right: 0; bottom: 0; color: #fff; background: rgba(0,0,0,0.5); }
#log_list .item .ui-pic .pic-data.ui-slide-mobile > div > a:after { content: "클릭 시 원본 이미지를 확인할 수 있습니다."; display: block; position: absolute; top: 50%; left: 0; right: 0; color: #fff; transform: translateY(-50%); font-size: 12px; }

#log_list .item .ui-pic .pic-data .ui-remove-blind { display: block; position: absolute; top: 30px; left: 0; right: 0; bottom: 0; background: #000; overflow: hidden; text-align: center; }
#log_list .item .ui-pic .pic-data .ui-remove-blind:before { content: ""; display: inline-block; width: 0px; height: 100%; vertical-align: middle; }
#log_list .item .ui-pic .pic-data .ui-remove-blind span { display: inline-block; font-size: 14px; line-height: 1.5em; vertical-align: middle; color: #999; }

#log_list .item .ui-pic .pic-data .theme-box { padding: 15px 0; }
#log_list .item .ui-pic .pic-data .theme-box div {
    font-family: var(--text-font);
    font-weight: bold;
    padding: 0 15px;
    text-align: left;
    letter-spacing: -0.3px;
    font-size: 12px;
    text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.3);
    line-height: 160%;
    word-break: break-all;
}
#log_list .item .ui-pic .pic-data .theme-box.scroll div { overflow-y: auto; }

#log_list .item .ui-pic .pic-data .theme-box2 { padding: 15px 0; }
#log_list .item .ui-pic .pic-data .theme-box2 div {
    font-family: var(--text-font);
    font-weight: bold;
    padding: 0 15px;
    text-align: left;
    letter-spacing: -0.3px;
    font-size: 12px;
    text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.3);
    line-height: 160%;
    word-break: break-all;
    color: var(--load-text);
}
#log_list .item .ui-pic .pic-data .theme-box2.scroll div { overflow-y: auto; }

#log_list .item .ui-pic img { cursor: pointer; }
#log_list .item .ui-pic .img-data { position: relative; }
#log_list .item .ui-pic .img-data * { max-width: 100%; }


/** Comment **/
#log_list .item-comment { position: relative; }
#log_list .item-comment .co-header { position: relative; line-height: 100%; padding: 16px 35px 3px 35px; font-weight: bold; }
#log_list .item .item-inner .item-comment { border-radius: 0px !important; }
#log_list .item .item-inner .item-comment.item-reply { background-color: transparent !important; margin-top: 0px !important; z-index: 1; }
#log_list .item .item-inner .item-comment.item-reply .co-header { line-height: normal; }
#log_list .item.ui-wrap .ui-comment,
#log_list .item.both .ui-comment { padding-top: 0px !important; }

#log_list .item .item-inner .item-comment.item-reply .co-header:before { content: ""; font-weight: bold; position: absolute; left: -1px; }
#log_list .item-comment .co-header:after { content: ""; display: block; clear: both; }
#log_list .item-comment .co-header p { float: left; }
#log_list .item-comment .co-header .link { float: right; padding-right: 5px; }
#log_list .item-comment .co-header i { display: inline-block; height: 25px; }
#log_list .item-comment .co-header i img { max-height: 100%; }

#log_list .item .item-inner .parent { box-shadow: 0px 2px 3px var(--load-reply-shadow); z-index: 2; }
#log_list .item .item-inner .last { box-shadow: none; }
#log_list .item-comment .co-content { padding: 3px 35px; }
#log_list .item .item-inner .item-comment.item-reply .co-content { padding: 3px 35px; }
#log_list .item-comment .co-content .original_comment_area { word-break: break-all; }
#log_list .item-comment .co-content .member_call { padding: 0 5px; }
#log_list .item-comment .co-content .other-site-link { font-weight: bold; }
#log_list .item-comment .co-content .re_more { display: none; }
#log_list .item-comment .co-content .co-more:after { content: "▼"; }
#log_list .item-comment .co-content .co-more.on:after { content: "▲"; }
#log_list .item-comment .dice { display: block; padding-bottom: 7px; }
#log_list .item-comment .dice img { border-radius: 5px; overflow: hidden; }
#log_list .item-comment .link-box { display: block; padding-bottom: 10px; }

#log_list .item-comment .co-footer { line-height: 20px; padding-right: 17px; padding-bottom: 7px; }
#log_list .item-comment .co-footer:after { content: ""; display: block; clear: both; }

#log_list .item-comment .co-footer .del { display: inline-block; float: right; vertical-align: middle; position: relative; width: 14px; height: 14px; line-height: 14px; overflow: hidden; text-indent: -999px; margin-left: 7px; margin-bottom: 8px; transform: rotate(45deg); }
#log_list .item-comment .co-footer .del:before { content: 'X'; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 15px; text-indent: 0; text-align: center; font-size: 10px; font-weight: bold; transform: rotate(-45deg); }
#log_list .item-comment .co-footer .mod { display: inline-block; float: right; vertical-align: middle; position: relative; width: 14px; height: 14px; line-height: 14px; overflow: hidden; text-indent: -999px; margin-left: 7px; margin-bottom: 8px; transform: rotate(45deg); }
#log_list .item-comment .co-footer .mod:before { content: 'M'; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 15px; text-indent: 0; text-align: center; font-size: 10px; font-weight: bold; transform: rotate(-45deg); }
#log_list .item-comment .co-footer .re { display: inline-block; float: right; vertical-align: middle; position: relative; width: 14px; height: 14px; line-height: 14px; overflow: hidden; text-indent: -999px; margin-left: 7px; margin-bottom: 8px; transform: rotate(45deg); }
#log_list .item-comment .co-footer .re:before { content: 'R'; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 15px; text-indent: 0; text-align: center; font-size: 10px; font-weight: bold; transform: rotate(-45deg); }

#log_list .item-comment-form-box { padding: 10px 0 0; background-color: transparent; }
.formbox { transition-duration: 0.5s; background-color: white; height: 0px; }

#log_list .modify_area { display: none; position: relative; }
#log_list .modify_area textarea { display: block; width: 100%; min-height: 100px; padding: 10px; }
#log_list .modify_area button { width: 60px; }

.log-item-box { position: relative; padding-left: 70px; min-height: 60px; margin-bottom: 10px; }
.log-item-box em { display: block; position: absolute; width: 60px; height: 60px; overflow: hidden; top: 0; left: 0; }
.log-item-box p { padding: 10px 0; }
.log-item-box p span { display: block; }


/***************************************
    Write Page
****************************************/

#bo_w { max-width: 640px; margin: 0 auto; padding: 20px 0; }
#bo_w dl,
#bo_w dt,
#bo_w dd { display: block; position: relative; margin: 0; padding: 0; }
#bo_w dl { overflow: hidden; }
#bo_w label { cursor: pointer; }
#bo_w dt { position: absolute; top: 0; left: 0; width: 85px; padding-top: 5px; font-size: 12px; line-height: 20px; text-align: center; }
#bo_w dt select { box-sizing: border-box; font-size: 12px; padding: 0 5px; }
#bo_w dd { padding-top: 5px; min-height: 22px; margin-left: 85px; }
#bo_w dd fieldset { display: inline-block; padding-right: 12px; }
#bo_w.chick .upload_box { position: relative; }
#bo_w.chick .upload_box dd { margin-right: 70px; }
#bo_w.chick .upload_box button { position: absolute; right: 0; top: 6px; width: 70px; }
#bo_w .option_box { font-size: 12px; }
#bo_w .option_box select { padding: 0 5px; }

#view_image + dl dt { width: 100px; }
#view_image + dl dd { margin-left: 100px; }

#bo_w .frm_input { width: 100%; height: 25px; }
#bo_w #wr_content { height: 170px; padding: 10px; }

#view_image { position: relative; width: 100%; height: 330px; line-height: 330px; overflow: hidden; margin: 0 auto; text-align: center; }
#view_image img { max-width: 100%; max-height: 330px; }
#view_image em { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 330px; text-align: center; }
#view_image em img { width: 50px; height: 50px; }
#view_image > span { position: absolute; left: 0; right: 0; bottom: 0; height: 30px; line-height: 30px; text-align: center; }

#board_category { text-align: center; }
#board_category input { display: none; }
#board_category li { display: inline-block; line-height: 31px; }
#board_category li label { display: inline-block; cursor: pointer; padding: 0 15px; }
#board_category input:checked + label:before { content: "《 "; }
#board_category input:checked + label:after { content: " 》"; }

#board_action { padding-top: 15px; }

#load_log_board .inner { padding: 0 30px 0; }
@media all and (max-width: 640px) {
    #load_log_board .inner { padding: 0; }
}

.comment-data { display: none; padding: 10px 0 10px 20px; border-left: 1px solid #996c33; margin-left: 5px; }
.comment-data.on { display: block; }
.comment-data select,
.comment-data input[type="text"] { width: 100%; box-sizing: border-box; }

.ui-mmb-list-write { position: relative; max-width: 400px; margin: 0 auto; }
.ui-mmb-list-write span { display: inline-block; margin: 3px; }
.upload-box + fieldset { padding: 10px 0; }
.upload-box { position: relative; padding-left: 95px; padding-right: 80px; box-sizing: border-box; }
.upload-box select { position: absolute; top: 0; left: 0; width: 95px; }
.upload-box fieldset { display: block; position: relative; }
.upload-box input[type="file"],
.upload-box input[type="text"] { width: 100%; box-sizing: border-box; }
.upload-box button { display: block; position: absolute; top: 0; right: 0; width: 80px; height: 30px; }

.guest-box { position: relative; text-align: left; }
.guest-box input[type="text"], .guest-box input[type="password"] { max-width: 40%; }

.blur-off { filter: blur(0px) !important; }

.nightstars { background: url(./img/nightstars.gif) no-repeat !important; background-size: cover !important; width: 100%; }
.nightstars .theme-box2 div { color: var(--load-text2) !important; text-shadow: 0px 0px 3px var(--load-text2) !important; }

.backgr { background: url(./img/back.jpg) no-repeat !important; background-size: cover !important; }
.backgr .theme-box2 div { color: var(--load-text2) !important; text-shadow: 0px 0px 3px rgba(0,0,0,0.9) !important; }

.backgr2 { background: url(./img/back2.jpg) no-repeat !important; background-size: cover !important; }
.backgr2 .theme-box2 div { color: var(--load-text2) !important; text-shadow: 0px 0px 3px rgba(0,0,0,0.9) !important; }

.backgr3 { background: url(./img/back3.jpg) no-repeat !important; background-size: cover !important; }
.backgr3 .theme-box2 div { color: var(--load-text2) !important; text-shadow: 0px 0px 3px var(--load-text2) !important; }

.backgr4 { background: url(./img/back4.jpg) no-repeat !important; background-size: cover !important; }
.backgr4 .theme-box2 div { color: var(--load-text2) !important; text-shadow: 0px 0px 3px var(--load-text2) !important; }

.theme-box2 u {
    text-decoration: none;
    color: var(--load-text);
    position: relative;
    background-image: var(--load-gra);
    background-size: 100% 100%;
    background-position: center 100%;
    background-repeat: no-repeat;
    font-weight: bold;
}
.theme-box2 u:hover::before { transform: translateY(0); }

.ui-pic .backpic:before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: inherit;
    z-index: -1;
    filter: blur(5px) opacity(0.8);
    -webkit-filter: blur(5px) opacity(0.8);
}

/*강조 효과들*/
.highlight-holo {
    background-image: url(./img/holo.jpg) !important;
    animation-duration: 10s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: linear;
    animation-name: fluid;
    background-size: 500%;
    display: inline-block;
    padding: 1px 7px;
    margin-bottom: 5px;
    line-height: 18px;
    border-radius: 5px;
    color: white;
    font-weight: bold;
    filter: drop-shadow(0px 0px 1px var(--load-shadow));
    text-shadow: 0px 0px 2px rgba(0,0,0,0.5);
}

.highlight2 {
    font-weight: bold;
    font-family: var(--point-font);
    display: inline-block;
    padding: 1px 7px;
    margin-bottom: 5px;
    line-height: 18px;
    border-radius: 5px;
    background: var(--load-point);
    color: #fff;
    border: 1px solid var(--load-text);
    transition-duration: 0.2s;
    box-shadow: 1px 1px 0px var(--load-shadow);
}
.highlight2:hover {
    background: var(--load-text);
    color: var(--load-point);
    border: 1px solid var(--load-point);
    box-shadow: 1px 1px 0px transparent;
    transform: translateX(1px) translateY(1px);
}

.holoback {
    background-image: url(./img/holo.jpg) !important;
    animation-duration: 10s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: linear;
    animation-name: fluid;
    background-size: 500%;
}

@keyframes fluid {
    from { background-position: top; }
    to { background-position: bottom; }
}

.highlight3 {
    color: var(--load-point);
    text-shadow:
        -1px -1px 0 var(--load-point2),
        1px -1px 0 var(--load-point2),
        -1px 1px 0 var(--load-point2),
        1px 1px 0 var(--load-point2);
    font-weight: bold;
    font-family: var(--point-font);
}

.hologram {
    background-image: url(./img/holo.jpg) !important;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation-duration: 10s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: linear;
    animation-name: fluid;
    background-size: 500%;
    position: relative;
    text-shadow: none;
    filter: drop-shadow(0px 0px 1px rgba(0,0,0,0.3));
}

.highlight5 {
    color: var(--load-text);
    font-family: var(--point-font);
    font-weight: bold;
    font-size: 12px;
    background: var(--load-gra);
    background-size: 100% 40%;
    background-position: center 100%;
    background-repeat: no-repeat;
    letter-spacing: -0.8px;
}

.sub2 {
    display: inline-block;
    position: relative;
    font-weight: bold;
    font-size: 15px;
    line-height: 100%;
    overflow: hidden;
    font-family: var(--point-font);
    margin: 3px 0px 0px 0px;
    padding: 0px 10px 0px 0px;
}
.sub2:before {
    display: inline-block;
    content: '';
    background: var(--load-point);
    width: 11px;
    height: 16px;
    vertical-align: middle;
    margin: 0px 3px 0px 0px;
}


/*이미지 효과*/
.whiteline {
    filter: drop-shadow(1px 0px 0px #fff) drop-shadow(0px 1px 0px #fff) drop-shadow(-1px 0px 0px #fff) drop-shadow(0px -1px 0px #fff);
}
.pinkline {
    filter: drop-shadow(1px 0px 0px #ff00ff) drop-shadow(0px 1px 0px #ff00ff)
        drop-shadow(-1px 0px 0px #ff00ff) drop-shadow(0px -1px 0px #ff00ff);
}
.pic_shadow { filter: drop-shadow(1px 1px 2px rgba(50, 88, 130, 0.32)); }

.gray:hover {
    animation-duration: 0.2s;
    animation-name: squa;
    filter: grayscale(100%);
}
.blur2 { filter: blur(5px); }

.rainbowline {
    animation-duration: 3s;
    animation-name: rainbowLine;
    animation-iteration-count: infinite;
}
@keyframes rainbowLine {
    0%   { filter: drop-shadow(0px 0px 0px #F78181); }
    12%  { filter: drop-shadow(0px 0px 0px #F7BE81); }
    24%  { filter: drop-shadow(0px 0px 0px #F3F781); }
    36%  { filter: drop-shadow(0px 0px 0px #D0F5A9); }
    48%  { filter: drop-shadow(0px 0px 0px #81F7BE); }
    60%  { filter: drop-shadow(0px 0px 0px #D0F5A9); }
    72%  { filter: drop-shadow(0px 0px 0px #819FF7); }
    84%  { filter: drop-shadow(0px 0px 0px #9F81F7); }
    93%  { filter: drop-shadow(0px 0px 0px #F781BE); }
    100% { filter: drop-shadow(0px 0px 0px #F78181); }
}

.blackshadow,
.blackshadow:hover { filter: brightness(0); }

.blush { opacity: 0.3; filter: blur(2px); }
.backblush { backdrop-filter: blur(0px) !important; background-repeat: no-repeat !important; background-size: contain !important; }


/*해시태그 디자인*/
body #log_list .item .item-inner .co-content .link_hash_tag,
.pic-footer .link_hash_tag {
    font-family: var(--hash-font);
    font-size: 11px;
    position: relative;
    font-weight: bold;
    margin-left: 7px;
    padding: 0px 5px;
    color: var(--load-hash);
    background-color: var(--load-hash-bg);
    border-radius: 0px 3px 3px 0px;
    filter: drop-shadow(0px 0px 1px rgba(0,0,0,0.3));
    transition-duration: 0.2s;
}
body #log_list .item .item-inner .co-content .link_hash_tag:after,
.pic-footer .link_hash_tag:after {
    content: "";
    position: absolute;
    left: -5px;
    top: 0;
    width: 0;
    height: 0;
    border-right: 5px solid var(--load-hash-bg);
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    transition-duration: 0.2s;
}
body #log_list .item .item-inner .co-content .link_hash_tag:hover:after,
.pic-footer .link_hash_tag:hover:after { border-right-color: var(--load-hash); }

body #log_list .item .item-inner .co-content .link_hash_tag:before,
.pic-footer .link_hash_tag:before {
    content: "";
    width: 4px;
    position: absolute;
    height: 4px;
    left: -2px;
    top: 4px;
    background: var(--load-hash);
    border-radius: 50%;
    z-index: 2;
}
body #log_list .item .item-inner .co-content .link_hash_tag:hover,
.pic-footer .link_hash_tag:hover { color: var(--load-hash-bg); background-color: var(--load-hash); }


/* ===== 색상 통일 + 홀로그램 제거 + 코멘트 리디자인 ===== */

/* 홀로그램 → 단색으로 override */
.hologram {
    background-image: none !important;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: #4D694E;
    animation: none;
    text-shadow: none;
    filter: none;
    color: #4D694E;
}
.highlight-holo {
    background-image: none !important;
    background: #4D694E !important;
    animation: none;
}
.holoback {
    background-image: none !important;
    background: #4D694E !important;
    animation: none;
    color: #fff !important;
    border-radius: 4px;
}

/* No. 옆 동그라미 제거 */
#log_list .item .ui-pic .pic-header .no:before { display: none !important; }
#log_list .item .ui-pic .pic-header .no .hologram { margin: 0px; }

/* + comment 버튼 */
#log_list .item-inner .combox {
    display: inline-block !important;
    padding: 8px 24px !important;
    margin: 10px 0 !important;
    background: #4D694E !important;
    background-image: none !important;
    background-size: unset !important;
    background-position: unset !important;
    background-repeat: unset !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    transition: all 0.2s !important;
    text-shadow: none !important;
}
#log_list .item-inner .combox:hover { background: #759176 !important; }

/* 코멘트 폼 전체 */
#log_list .bo_vc_w {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    position: relative;
}
#log_list .bo_vc_w > h4 { display: none !important; }
#log_list .bo_vc_w > h4:before { content: ""; }

#log_list .bo_vc_w .input-comment {
    padding: 12px;
    background: transparent;
    border-top: none;
}

/* textarea */
#log_list .bo_vc_w .input-comment textarea {
    display: block;
    width: 100%;
    height: 70px;
    padding: 10px 12px;
    border: 1px solid #a7c3a8 !important;
    border-radius: 8px !important;
    background: #fff;
    color: #2f4b30;
    font-size: 13px;
    font-family: 'Noto Sans KR', sans-serif;
    line-height: 1.5;
    resize: vertical;
    outline: none;
    box-sizing: border-box;
    margin-bottom: 0 !important;
}
#log_list .bo_vc_w .input-comment textarea:focus {
    border-color: #4D694E !important;
    box-shadow: 0 0 0 2px rgba(176,201,235,0.25);
}

/* 메모 + 파일 한 줄 배치 */
#log_list .bo_vc_w .input-comment .memo_box {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 6px;
    padding-right: 0 !important;
}
#log_list .bo_vc_w .input-comment .memo_box input,
#log_list .bo_vc_w .input-comment .memo_box input.wr_1 {
    flex: 8 !important;
    min-width: 0 !important;
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #a7c3a8 !important;
    border-radius: 8px !important;
    background: #fff;
    color: #2f4b30;
    font-size: 12px;
    outline: none;
    box-sizing: border-box;
    margin-bottom: 0 !important;
}
#log_list .bo_vc_w .input-comment .memo_box input:focus { border-color: #4D694E !important; }
#log_list .bo_vc_w .input-comment .memo_box a { display: none !important; }

#log_list .bo_vc_w .input-comment .file_box {
    display: flex !important;
    align-items: center !important;
    flex: 2 !important;
    padding: 0 !important;
    min-width: 0 !important;
}
#log_list .bo_vc_w .input-comment .file_box .file_del { display: none !important; }
#log_list .bo_vc_w .input-comment .file_box input[type="file"] {
    font-size: 11px !important;
    color: #6b8c6c !important;
    padding: 4px !important;
}
#log_list .bo_vc_w .input-comment .file_box input[type="file"]::file-selector-button {
    padding: 4px 12px;
    background: #4D694E;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    margin-right: 8px;
    font-family: inherit;
}
#log_list .bo_vc_w .input-comment .file_box input[type="file"]::file-selector-button:hover { background: #759176; }

/* 하단 옵션 영역 */
#log_list .bo_vc_w .input-comment .action-check,
#log_list .bo_vc_w .input-comment .form-input {
    margin-top: 8px !important;
    padding: 8px 10px !important;
    padding-right: 80px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    font-size: 11px;
    color: #6b8c6c;
    min-height: auto !important;
    height: auto !important;
    position: relative;
    display: block !important;
}
#log_list .bo_vc_w .input-comment .action-check span,
#log_list .bo_vc_w .input-comment .form-input span { display: inline-block; padding-right: 10px; }
#log_list .bo_vc_w .input-comment .action-check label { color: #6b8c6c; font-size: 11px; }
#log_list .bo_vc_w .input-comment .action-check input[type="checkbox"] { accent-color: #4D694E; }
#log_list .bo_vc_w .input-comment .action-check select {
    padding: 4px 8px;
    border: 1px solid #a7c3a8;
    border-radius: 6px;
    background: #FFF3D5;
    color: #2f4b30;
    font-size: 11px;
    outline: none;
}

/* 비회원 이름/PW 입력칸 */
#log_list .bo_vc_w .input-comment .action-check p input[type="text"],
#log_list .bo_vc_w .input-comment .action-check p input[type="password"] {
    padding: 6px 12px !important;
    border: 1px solid #d6e4d6 !important;
    border-radius: 6px !important;
    background: #FFF3D5 !important;
    color: #2f4b30 !important;
    font-size: 12px !important;
}
#log_list .bo_vc_w .input-comment .action-check p input[type="text"]:focus,
#log_list .bo_vc_w .input-comment .action-check p input[type="password"]:focus {
    background: #FFF3D5 !important;
    border-color: #4D694E !important;
}
#log_list .bo_vc_w .input-comment .action-check p input::placeholder {
    color: #4D694E !important;
    font-size: 11px;
}

/* 입력 버튼 */
#log_list .bo_vc_w .btn_confirm {
    position: absolute !important;
    top: 4px !important;
    right: 4px !important;
    bottom: 4px !important;
    width: 68px !important;
    height: auto !important;
    transform: none !important;
}
#log_list .bo_vc_w .btn_confirm .ui-comment-submit {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: #4D694E !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
}
#log_list .bo_vc_w .btn_confirm .ui-comment-submit:hover { background: #759176 !important; }

/* 이모티콘 링크 */
#log_list .bo_vc_w .action-check .new_win { color: #4D694E; text-decoration: none; font-size: 11px; }

/* 수정/삭제 버튼 색상 */
#log_list .item .ui-pic .pic-header .del,
#log_list .item .ui-pic .pic-header .mod {
    background: #4D694E !important;
    background-image: none !important;
    animation: none !important;
    color: #fff !important;
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
}

/* 리플 수정/삭제/답글 버튼 색상 */
#log_list .item-comment .co-footer .re,
#log_list .item-comment .co-footer .del,
#log_list .item-comment .co-footer .mod {
    background: #4D694E !important;
    background-image: none !important;
    animation: none !important;
    color: #fff !important;
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
}

/* 페이지 버튼 */
body .pg_wrap {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 24px 0 !important;
}
body .pg_wrap .pg_page {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    border-radius: 8px !important;
    border: 1px solid #a7c3a8 !important;
    background: #fff !important;
    color: #6b8c6c !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 2px !important;
    -webkit-clip-path: none !important;
    clip-path: none !important;
    line-height: 30px !important;
    overflow: visible !important;
    text-indent: 0 !important;
    min-width: auto !important;
    transform: none !important;
    position: relative !important;
    box-sizing: border-box !important;
}
body .pg_wrap .pg_page:hover {
    background: #f5efe6 !important;
    border-color: #4D694E !important;
    color: #2f4b30 !important;
    transform: none !important;
    padding: 0 !important;
}
body .pg_wrap .pg_current,
body .pg_wrap .pg_current:hover {
    background: #4D694E !important;
    color: #fff !important;
    border: 1px solid #4D694E !important;
    box-shadow: none !important;
    transform: none !important;
    padding: 0 !important;
}
body .pg_wrap .pg_control {
    overflow: hidden !important;
    text-indent: -9999px !important;
    text-align: left !important;
    position: relative !important;
}
body .pg_wrap .pg_control:before {
    display: block !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    text-indent: 0 !important;
    text-align: center !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 30px !important;
    color: #6b8c6c !important;
    margin: 0 !important;
    padding: 0 !important;
}
body .pg_wrap .pg_start:before { content: "«" !important; }
body .pg_wrap .pg_end:before { content: "»" !important; }
body .pg_wrap .pg_prev,
body .pg_wrap .pg_next { display: none !important; }

/* 관리자 버튼 핑크 */
.ui-mmb-button .ui-btn.admin { background: #E79662 !important; color: #fff !important; border-color: #E79662 !important; }
.ui-mmb-button .ui-btn.admin:hover { background: #c97844 !important; border-color: #c97844 !important; }

/* 댓글 수정/삭제 버튼 원형으로 */
/* 수정/삭제/답글 버튼 마름모 → 원형 (글자 수직 유지) */
#log_list .item .ui-pic .pic-header .del,
#log_list .item .ui-pic .pic-header .mod,
#log_list .item-comment .co-footer .del,
#log_list .item-comment .co-footer .mod,
#log_list .item-comment .co-footer .re {
    transform: none !important;
    -webkit-transform: none !important;
    border-radius: 50% !important;
}
#log_list .item .ui-pic .pic-header .del:before,
#log_list .item .ui-pic .pic-header .mod:before,
#log_list .item-comment .co-footer .del:before,
#log_list .item-comment .co-footer .mod:before,
#log_list .item-comment .co-footer .re:before {
    transform: none !important;
    -webkit-transform: none !important;
}

/* 글 수정/삭제 버튼 박스 크기 키우기 */
#log_list .item .ui-pic .pic-header .del,
#log_list .item .ui-pic .pic-header .mod {
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
}

/* 댓글 수정/삭제/답글 버튼 박스 크기 키우기 */
#log_list .item-comment .co-footer .del,
#log_list .item-comment .co-footer .mod,
#log_list .item-comment .co-footer .re {
    width: 20px !important;
    height: 20px !important;
    line-height: 20px !important;
}

/* 수정 아이콘 (연필) */
#log_list .item .ui-pic .pic-header .mod:before,
#log_list .item-comment .co-footer .mod:before {
    content: 'edit' !important;
    font-family: 'Material Icons' !important;
    font-size: 14px !important;
    font-weight: normal !important;
    line-height: inherit !important;
}

/* 삭제 아이콘 (휴지통) */
#log_list .item .ui-pic .pic-header .del:before,
#log_list .item-comment .co-footer .del:before {
    content: 'cancel' !important;
    font-family: 'Material Icons' !important;
    font-size: 14px !important;
    font-weight: normal !important;
    line-height: inherit !important;
}

/* 답글 아이콘 (화살표) */
#log_list .item-comment .co-footer .re:before {
    content: '' !important;
    background-image: url(./img/reply_icon.png) !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 14px !important;
    height: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: auto !important;
}

/* 글 수정/삭제 버튼 - material icon */
#log_list .item .ui-pic .pic-header .del,
#log_list .item .ui-pic .pic-header .mod {
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
    overflow: hidden !important;
    text-indent: -999px !important;
    position: relative !important;
}
#log_list .item .ui-pic .pic-header .del:before {
    content: 'close' !important;
    font-family: 'Material Icons' !important;
    font-size: 14px !important;
    font-weight: normal !important;
    text-indent: 0 !important;
    line-height: 22px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    text-align: center !important;
}
#log_list .item .ui-pic .pic-header .mod:before {
    content: 'edit' !important;
    font-family: 'Material Icons' !important;
    font-size: 14px !important;
    font-weight: normal !important;
    text-indent: 0 !important;
    line-height: 22px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    text-align: center !important;
}

/* 버튼 호버 효과 */
#log_list .item .ui-pic .pic-header .del,
#log_list .item .ui-pic .pic-header .mod,
#log_list .item-comment .co-footer .del,
#log_list .item-comment .co-footer .mod,
#log_list .item-comment .co-footer .re {
    transition: all 0.2s !important;
    cursor: pointer !important;
}
#log_list .item .ui-pic .pic-header .del:hover,
#log_list .item .ui-pic .pic-header .mod:hover {
    background: #759176 !important;
    transform: none !important;
}

/* 댓글 수정 입력창 - 우측 정렬 + 라운딩 */
#log_list .item-comment .input-comment {
    margin-left: auto !important;
    max-width: 70% !important;
    background: transparent !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 12px !important;
}#log_list .item-comment .input-comment textarea {
    border-radius: 8px !important;
    border: 1px solid #a7c3a8 !important;
    background: #fff !important;
}


/* 댓글 수정 제출 버튼 */
#log_list .input-comment button[type="submit"],
#log_list .item-comment button[type="submit"] {
    background: #4D694E !important;
    color: #fff !important;
    border: none !important;
    padding: 0 16px !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    cursor: pointer !important;
    opacity: 1 !important;
    min-width: 60px !important;
    height: 28px !important;
    line-height: 28px !important;
    letter-spacing: 1px !important;
    vertical-align: middle !important;
    margin: 0 !important;
    display: inline-block !important;
    position: relative !important;
    top: 0 !important;
    float: none !important;
}
#log_list .input-comment button[type="submit"]:hover,
#log_list .item-comment button[type="submit"]:hover {
    background: #759176 !important;
}

/* 수정 버튼을 다음 줄로 내리고 우측 정렬 */
#log_list .input-comment .action-check,
#log_list .item-comment .action-check {
    padding-right: 0 !important;
}
#log_list .input-comment button[type="submit"],
#log_list .item-comment button[type="submit"] {
    position: absolute !important;
    right: 10px !important;
    bottom: 10px !important;
    margin: 0 !important;
    float: none !important;
}
/* 댓글 수정 모드 - 옵션 줄과 수정 버튼 정렬 */
#log_list .item-comment .action-check,
#log_list .item-comment .form-input {
    position: relative !important;
    padding-right: 80px !important;
    min-height: 34px !important;
}
#log_list .item-comment .btn_confirm,
#log_list .item-comment-form-box .btn_confirm {

    top: auto !important;
    bottom: 4px !important;
    transform: none !important;
    position: absolute !important;
    margin: auto 0 !important;
    right: 4px !important;
    width: 68px !important;
    height: auto !important;
    padding: 0 !important;
}
#log_list .item-comment .btn_confirm .ui-comment-submit,
#log_list .item-comment .btn_confirm button[type="submit"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    background: #4D694E !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
}
#log_list .item-comment .btn_confirm .ui-comment-submit:hover,
#log_list .item-comment .btn_confirm button[type="submit"]:hover {
    background: #759176 !important;
}

/* 수정창 페이드 효과 */
.bo_vc_w {
    animation: commentFadeIn 0.3s ease;
}
@keyframes commentFadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}


/* 댓글 말풍선 스타일 */
#log_list .item-comment {
    display: flex !important;
    flex-direction: column !important;
    padding: 8px 10px !important;
    margin-bottom: 4px !important;
}
#log_list .item-comment .co-content {
    position: relative;
    background: #ede8e0;
    border-radius: 12px;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-right: 40px;
    margin-left: 12px;
    max-width: 80%;
    width: fit-content;
    word-break: break-word;
}
#log_list .item-comment .co-content:after {
    content: '';
    position: absolute;
    top: -10px;
    left: 14px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 10px solid #ede8e0;
}

/* 답글(대댓글) - 오른쪽 */
#log_list .item-comment.item-reply {
    align-items: flex-end !important;
    padding-left: 0 !important;
}
#log_list .item-comment.item-reply .co-footer {
    align-self: flex-end !important;
    width: fit-content !important;
}
#log_list .item-comment.item-reply .co-content {
    background: #4D694E;
    color: #fff;
    margin-right: 12px;
    margin-left: 40px;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    width: fit-content;
}
#log_list .item-comment.item-reply .co-content:after {
    left: auto;
    right: 14px;
    top: -10px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 10px solid #4D694E;
    border-top: none;
}
#log_list .item-comment.item-reply .co-header {
    text-align: right;
    padding-right: 14px;
}
#log_list .item-comment.item-reply .co-footer {
    justify-content: flex-end;
    padding-right: 14px;
}
#log_list .item-comment.item-reply .co-content a {
    color: #fff !important;
    text-decoration: underline;
}

/* 헤더 정리 */
#log_list .item-comment .co-header {
    display: flex !important;
    align-items: center !important;
    gap: 8px;
    padding: 2px 14px;
    font-size: 12px;
    margin-bottom: 10px;
}
#log_list .item-comment .co-header .font3 {
    font-size: 12px;
    color: #4a6a4b;
}
#log_list .item-comment .co-header .date {
    color: #4D694E;
    font-size: 10px;
    font-weight: 400;
    opacity: 0.8;
}

/* 답글 헤더 우측 정렬 */
#log_list .item-comment.item-reply .co-header {
    justify-content: flex-end !important;
}

#log_list .item-comment.item-reply .co-footer {
    align-self: flex-end !important;
    justify-content: flex-start !important;
    width: fit-content !important;
    min-width: 80px;
}

/* 푸터 (수정/삭제 버튼) */
#log_list .item-comment .co-footer {
    display: flex;
    gap: 4px;
    padding: 4px 14px;
    margin-top: 4px;
    justify-content: flex-start !important;
}

/* 댓글 영역 배경 투명 */
#log_list .item-inner .ui-comment .item-comment-box {
    background-color: transparent !important;
}

/* 파일업로드, 이미지효과 숨기기 */
#log_list .item-comment .input-comment .file_box,
#log_list .item-comment .input-comment .action-check select.re-effect,
#log_list .bo_vc_w .input-comment .file_box,
#log_list .bo_vc_w .input-comment .action-check select {
    display: none !important;
}

/* 댓글 구분선 제거 */
#log_list .item-comment,
#log_list .item-comment.item-reply,
#log_list .item-comment.last,
#log_list .item-comment.parent {
    border: none !important;
    box-shadow: none !important;
}

/* 답글 말풍선 강제 적용 */
#log_list .item .item-inner .item-comment.item-reply .co-content {
    padding: 10px !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
    width: fit-content !important;
    max-width: 80% !important;
}

/* ====================================================
   수정/삭제 버튼 말풍선 바깥 배치 + 호버 시 출현
   ==================================================== */

/* 말풍선과 버튼을 가로로 나란히 배치하는 row */
#log_list .item-comment .co-bubble-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    width: 100% !important;
}

/* 답변(item-reply)은 말풍선이 오른쪽이므로 row 반전 */
#log_list .item-comment.item-reply .co-bubble-row {
    flex-direction: row-reverse !important;
}

/* 수정/삭제 버튼 묶음 */
#log_list .item-comment .cmt-admin-btns {
    display: flex !important;
    flex-direction: row !important;
    gap: 2px !important;
    flex-shrink: 0 !important;
    padding: 10px 1px 0 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.25s ease, transform 0.25s ease !important;
    transform: translateX(-6px) !important;
}
#log_list .item-comment.item-reply .cmt-admin-btns {
    transform: translateX(6px) !important;
}

/* 호버 시 등장 */
#log_list .item-comment:hover .cmt-admin-btns {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
}

/* 아이콘 버튼 공통 */
#log_list .item-comment .cmt-admin-btns a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    text-decoration: none !important;
    text-indent: 0 !important;
    overflow: visible !important;
    transform: none !important;
    float: none !important;
    position: static !important;
    transition: background 0.15s !important;
}

#log_list .item-comment .cmt-admin-btns a.mod,
#log_list .item-comment .cmt-admin-btns a.del,
#log_list .item-comment .cmt-admin-btns a.re {
    font-size: 0 !important;
}
#log_list .item-comment .cmt-admin-btns a.re:before {
    font-family: 'Material Icons' !important;
    content: 'subdirectory_arrow_right' !important;
    font-size: 15px !important;
    display: block !important;
    color: #E79662 !important;
    transform: none !important;
    text-indent: 0 !important;
    top: auto !important; left: auto !important;
    right: auto !important; bottom: auto !important;
    line-height: 1 !important;
    position: static !important;
    text-align: center !important;
}
#log_list .item-comment .cmt-admin-btns a.re:hover {
    background: rgba(100, 180, 150, 0.15) !important;
}
#log_list .item-comment .cmt-admin-btns a.mod:before {
    font-family: 'Material Icons' !important;
    content: 'edit' !important;
    font-size: 15px !important;
    display: block !important;
    color: #4D694E !important;
    transform: none !important;
    text-indent: 0 !important;
    top: auto !important; left: auto !important;
    right: auto !important; bottom: auto !important;
    line-height: 1 !important;
    position: static !important;
    text-align: center !important;
}
#log_list .item-comment .cmt-admin-btns a.del:before {
    font-family: 'Material Icons' !important;
    content: 'cancel' !important;
    font-size: 15px !important;
    display: block !important;
    color: #E79662 !important;
    transform: none !important;
    text-indent: 0 !important;
    top: auto !important; left: auto !important;
    right: auto !important; bottom: auto !important;
    line-height: 1 !important;
    position: static !important;
    text-align: center !important;
}

#log_list .item-comment .cmt-admin-btns a.mod:hover {
    background: rgba(120, 120, 180, 0.15) !important;
}
#log_list .item-comment .cmt-admin-btns a.del:hover {
    background: rgba(180, 100, 100, 0.15) !important;
}

/* 말풍선 오른쪽 여백 줄이기 (버튼이랑 간격 좁히기) */
#log_list .item-comment .co-content {
    margin-right: 4px !important;
}
#log_list .item-comment.item-reply .co-content {
    margin-left: 4px !important;
}

/* co-footer-admin 숨기기 */
#log_list .item-comment .co-footer-admin {
    display: none !important;
}

#log_list .item-comment.item-reply .co-header {
    flex-direction: row-reverse !important;
}

#log_list .item-comment .co-content img[src*="/data/emoticon/"] {
    width: 60px !important;
    height: 60px !important;
    object-fit: contain !important;
}

#log_list .item-comment-form-box .action-check {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    position: relative !important;
    padding: 8px 80px 8px 10px !important;
    font-size: 11px !important;
    color: #6b8c6c !important;
    min-height: 38px !important;
    box-sizing: border-box !important;
}
#log_list .item-comment-form-box .action-check input[type="text"],
#log_list .item-comment-form-box .action-check input[type="password"] {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #a7c3a8 !important;
    border-radius: 0 !important;
}

#log_list .item-comment-form-box .btn_confirm {
    position: absolute !important;
    top: 4px !important;
    bottom: 4px !important;
    right: 4px !important;
    width: 68px !important;
    height: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

#log_list .bo_vc_w .input-comment .action-check input[type="text"],
#log_list .bo_vc_w .input-comment .action-check input[type="password"],
#log_list .item-comment-form-box .action-check input[type="text"],
#log_list .item-comment-form-box .action-check input[type="password"] {
    width: 55px !important;
    max-width: 55px !important;
    min-width: 0 !important;
    padding: 4px 6px !important;
    font-size: 11px !important;
    box-sizing: border-box !important;
}

/* ======================================
   글쓰기 폼 레이아웃 정리
====================================== */
#bo_w { max-width: 580px; margin: 30px auto; padding: 0 16px; }

/* 업로드 박스 */
#bo_w .upload_box { background: #fff; border: 1px solid #d6e4d6; border-radius: 12px; padding: 16px; margin-bottom: 12px; }
#bo_w .upload_box dl { display: flex; align-items: flex-start; gap: 10px; margin: 0; }
#bo_w .upload_box dl dt { flex-shrink: 0; padding-top: 6px; }
#bo_w .upload_box dl dd { flex: 1; min-width: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
#bo_w .upload_box select { padding: 6px 10px; border: 1px solid #a7c3a8; border-radius: 8px; background: #FFF3D5; font-size: 12px; color: #2f4b30; outline: none; }
#bo_w .upload_box input[type="file"] { font-size: 11px; color: #6b8c6c; padding: 4px 0; }
#bo_w .upload_box input[type="file"]::file-selector-button { padding: 4px 12px; background: #4D694E; color: #fff; border: none; border-radius: 6px; font-size: 11px; font-weight: 700; cursor: pointer; margin-right: 8px; }
#bo_w .upload_box input[type="text"],
#bo_w .upload_box textarea { width: 100%; padding: 8px 12px; border: 1px solid #a7c3a8; border-radius: 8px; background: #fff; font-size: 12px; color: #2f4b30; outline: none; box-sizing: border-box; }
#bo_w .upload_box textarea { min-height: 80px; resize: vertical; }
#bo_w .upload_box input[type="text"]:focus,
#bo_w .upload_box textarea:focus { border-color: #4D694E; }

/* 이미지 미리보기 */
#view_image { border-radius: 12px; overflow: hidden; margin-bottom: 12px; background: #FFF3D5; border: 1px solid #d6e4d6; min-height: 60px; }

/* 옵션 박스 */
#bo_w .option_box { background: #fff; border: 1px solid #d6e4d6; border-radius: 12px; padding: 12px 16px; margin-bottom: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 12px; color: #4a6a4b; }
#bo_w .option_box select { padding: 4px 8px; border: 1px solid #a7c3a8; border-radius: 6px; background: #FFF3D5; font-size: 11px; color: #2f4b30; outline: none; }
#bo_w .option_box label { font-size: 11px; color: #6b8c6c; }
#bo_w .option_box input[type="checkbox"] { accent-color: #4D694E; }

/* Memo + 본문 */
#bo_w .comments,
#bo_w dl { margin-bottom: 12px; }
#bo_w dl { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid #d6e4d6; border-radius: 12px; padding: 10px 16px; }
#bo_w dl dt { flex-shrink: 0; font-size: 12px; color: #6b8c6c; width: 50px; }
#bo_w dl dd { flex: 1; min-width: 0; margin: 0; }
#bo_w dl input.frm_input { width: 100%; padding: 6px 0; border: none; border-bottom: 1px solid #d6e4d6; background: transparent; font-size: 13px; color: #2f4b30; outline: none; border-radius: 0; box-sizing: border-box; }
#bo_w dl input.frm_input:focus { border-bottom-color: #4D694E; }

/* 등록/목록 버튼 */
#bo_w .txt-center { display: flex; justify-content: center; gap: 8px; margin: 20px 0; }
#bo_w .txt-center .ui-btn { padding: 10px 28px; border-radius: 10px; font-size: 13px; font-weight: 700; }

/* hr 간격 정리 */
#bo_w hr.padding { margin: 12px 0; border: none; border-top: 1px solid #ede8e0; }
/* 글쓰기 폼 hr 실선 제거 */
#bo_w hr.padding,
#bo_w hr.padding.small { display: none !important; }



/* 글쓰기 textarea/메모 라운딩 통일 */
#bo_w #wr_content,
#bo_w textarea {
    border-radius: 12px !important;
    border: 1px solid #d6e4d6 !important;
    padding: 12px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

#bo_w .ui-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    line-height: normal !important;
}

/* 글쓰기/코멘트 이모티콘 버튼 스타일 */
#bo_w .option_box a[title="이모티콘"],
#log_list .bo_vc_w a[title="이모티콘"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    background: #4D694E !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    vertical-align: middle !important;
    flex-shrink: 0 !important;
}
#bo_w .option_box a[title="이모티콘"] .material-icons,
#log_list .bo_vc_w a[title="이모티콘"] .material-icons {
    color: #fff !important;
    font-size: 18px !important;
    vertical-align: middle !important;
    line-height: 28px !important;
}
#bo_w .option_box a[title="이모티콘"]:hover,
#log_list .bo_vc_w a[title="이모티콘"]:hover {
    background: #759176 !important;
}

/* 코멘트 옵션 박스 테두리/배경 제거 */
#log_list .bo_vc_w .input-comment .action-check,
#log_list .bo_vc_w .input-comment .form-input,
#log_list .item-comment-form-box .action-check {
    border: none !important;
    background: transparent !important;
    position: relative !important;
    padding: 8px 80px 8px 10px !important;
    min-height: 38px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
}
/* 이름·비밀번호 입력창 배경 투명 (autofill 포함) */
#log_list .item-comment-form-box .action-check input[type="text"],
#log_list .item-comment-form-box .action-check input[type="password"],
#log_list .bo_vc_w .input-comment .action-check input[type="text"],
#log_list .bo_vc_w .input-comment .action-check input[type="password"] {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #a7c3a8 !important;
    border-radius: 0 !important;
    color: #2f4b30 !important;
    outline: none !important;
}

#log_list .item-comment-form-box .action-check input[type="text"]:-webkit-autofill,
#log_list .item-comment-form-box .action-check input[type="password"]:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #FFF3D5 inset !important;
    -webkit-text-fill-color: #2f4b30 !important;
    transition: background-color 5000s ease-in-out 0s !important;
}

#log_list .bo_vc_w .input-comment .action-check p input[type="text"]:-webkit-autofill,
#log_list .bo_vc_w .input-comment .action-check p input[type="password"]:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #FFF3D5 inset !important;
    -webkit-text-fill-color: #2f4b30 !important;
    transition: background-color 5000s ease-in-out 0s !important;
}