/* 텍스트 및 이미지 드래그방지 */
body {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
img,
a {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* SPEC-QAP-IMP-14: .selectable 클래스가 부착된 영역은 body 의 user-select:none 을 무력화 — 사용자가 텍스트 드래그/복사 가능.
   chatAll (전체보기 모달) 등에서 사용. */
.selectable,
.selectable * {
    -webkit-touch-callout: default !important;
    -webkit-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
    user-select: text !important;
}

/*body{line-height: 1.1;}*/

/* ios 웹뷰에서 에디터 텍스트 입력이 되지 않는 문제 (iphone xs, iphone 13) */
.note-editor .note-editable,
input,
textarea {
    -webkit-touch-callout: unset;
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
}

.selectable, .selectable * {
    cursor: text;
    -webkit-touch-callout: default;
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;

    /* 롱프레스 시 시스템 메뉴가 뜨는 것 방지 (이미 JS로도 막았지만 CSS로 2중 방어) */
    -webkit-touch-callout: none !important;

    outline: none;
}

/* 글자선택 오버레이 — design.css의 .context_dropdown .cont user-select:none을 무력화 + 드래그 선택 활성화 */
.text_select .context_dropdown .chat-box1,
.text_select .context_dropdown .chat-box2,
.text_select .context_dropdown .speech_bubble,
.text_select .context_dropdown .cont,
.text_select .selectable,
.text_select .selectable *,
.text_select .speech_bubble.selectable .cont,
.text_select .speech_bubble.selectable .cont * {
    -webkit-touch-callout: default !important;
    -webkit-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
    user-select: text !important;
    cursor: text !important;
    touch-action: auto !important;
    pointer-events: auto !important;
}

textarea {
    /* 터치 제스처가 브라우저 기본 스크롤(body)을 트리거하지 않도록 설정 */
    touch-action: pan-y;
    overscroll-behavior: contain; /* 스크롤 끝에 도달해도 부모로 전파 방지 */
    -webkit-overflow-scrolling: touch; /* iOS 부드러운 스크롤 */
}

p {word-break: break-all;}

span.scsText, span.errText{line-height: 1.1;}

/*.ui-sortable {*/
/*    touch-action: none;  !* 터치 스크롤을 비활성화하고 드래그만 가능하게 함 *!*/
/*}*/

/*#bo_v_con *{word-break: break-all;font-weight: 400;font-size: 1.8rem !important;line-height: 1.5em;}*/
#bo_v_con,
#bo_v_con *,
.note-editor .note-editable,
.note-editor .note-editable *{/*font-family: "Nanum Myeongjo", serif !important;font-weight: 400;*/font-size: 1.5rem !important;line-height: 1.4 !important;color: var(--gray-500);}

.jconfirm.jconfirm-white .jconfirm-bg, 
.jconfirm.jconfirm-light .jconfirm-bg,
.jconfirm .jconfirm-bg {background-color: #000000;opacity: 0.5 !important;transition: none !important;animation: none !important;}
.jconfirm .jconfirm-box div.jconfirm-content-pane {margin-bottom: 2.3rem;}
.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content,
.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content *{font-size: 1.4rem;font-weight: 400;line-height: 1.4;color: var(--gray-500);}
.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content b{font-weight: 700;}
.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content .tit_h2{font-size: 2.0rem;font-weight: 600;line-height: 100%;color: var(--text);}
.jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-title,
.jconfirm .jconfirm-box div.jconfirm-title-c{font-size: 2.0rem;font-weight: 600;line-height: 100%;}
.jconfirm .jconfirm-box div.jconfirm-title-c{padding-bottom: 2.3rem;}
.jconfirm .jconfirm-box{padding-top: 2.8rem;}
.jconfirm.jconfirm-white .jconfirm-box,
.jconfirm.jconfirm-light .jconfirm-box{border-radius: 1.6rem;}
.jconfirm .jconfirm-box-container.col-sm-6{ /*특정역역 안에서 보이도록*/
    max-width: 38.2rem;
    /*left: auto !important;
    top: auto !important;
    transform: none !important;
    position: relative !important;*/
}
.jconfirm .jconfirm-box .jconfirm-buttons{margin-left: -4px;margin-right: -4px;}
.jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button,
.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button{font-size: 1.6rem;font-weight: 500;line-height: 1;border-radius: 0.8rem;}
.jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button.btn-default,
.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default{
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
}
/*.jconfirm .jconfirm-box .jconfirm-buttons button.btn-light{
    color: #000;
    background-color: #fff;
    border: 1px solid #D7DCE2;
}
.jconfirm .jconfirm-box .jconfirm-buttons button.btn-light:hover {
    color: #222;
    background-color: var(--gray-200);
    border-color: var(--gray-400);
}*/

.toast {
    opacity: 0;
    transform: none;left: 0;right: 0;margin: 0 auto;align-items: center;justify-content: center;
    display: none;
}
.toast.show {
    display: flex;
    opacity: 1;
}
.toast.hide {
    display: none;
}
/*.toast-body{max-width: 480px;}
.toast-body{font-size: 1.3rem;}*/

.modal_loading.fixed{
    position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 1;
    display: flex;align-items: center;justify-content: center;background: #e3e6ea;background: #E2EEFF;
}
/* SPEC-QAP-CUS-0821-PAGESPIN(곽 대표 08-21 «골뱅이가 너무 자주 보인다»):
     `.fixed` 는 대화 컬럼 전체를 불투명하게 덮는다(546x900, #E2EEFF). 이전글/다음글 로드는
     기존 대화를 그대로 두고 앞뒤에 붙이는 일이라 **가릴 이유가 없다** — 읽던 내용이 사라진다.
   → 페이지네이션은 이 `.edge` 로 가장자리 표시만 한다. 배경 없음·높이 없음·클릭 통과.
     `.fixed` 는 대화상자를 통째로 비우는 원문 보기 재로드에만 남긴다. */
.modal_loading.edge{
    position: fixed;z-index: 1;height: 44px;
    background: transparent;pointer-events: none;
    display: flex;align-items: center;justify-content: center;
}
.modal_loading.edge .spinner-border{width: 2.4rem;height: 2.4rem;border-width: .2rem;}
.text_select{
    position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 1000;
    display: flex;align-items: center;justify-content: center;
    /* 투명하지만 '면'이 존재하게 하여 클릭을 가로챔 */
    background: rgba(0, 0, 0, 0.01);
    /* 모바일에서 터치 하이라이트 제거 */
    -webkit-tap-highlight-color: transparent;
    /* 레이어 자체가 이벤트를 먹도록 설정 */
    pointer-events: auto;
}
.text_select .speech_bubble{
    max-height: 420px;
    overflow-y: scroll;
    overscroll-behavior: contain;
}
.permission-guide{
    position: fixed;bottom: 50%;z-index: 1000;
    display: flex;align-items: center;justify-content: center;flex-direction: column;text-align: center;
    background: #e9e9e9;
    max-width: 300px !important;border-radius: 8px;padding: 16px;
}

.toast{
    left: calc(50% + var(--body_width02));
    transform: translateX(-50%);
    margin: unset;
}
.jconfirm{
    left: calc(50% + var(--body_width02));
    width: 100%;
    transform: translateX(-50%);
    max-width: var(--body_width);
}
.permission-guide,
.text_select,
.modal_loading.edge,
.modal_loading.fixed{
    left: calc(50% + var(--body_width02));
    width: 100%;
    transform: translateX(-50%);
    max-width: var(--body_width);
}
.text_select .context_dropdown .context_backdrop{left: 50%;}

@media (max-width: 991.98px) {
    .toast,
    .jconfirm,
    .permission-guide,
    .text_select,
    .modal_loading.edge,
    .modal_loading.fixed{left: 50%;}
}

#custom_copy_toolbar{display: flex;align-items: center;justify-content: center;padding: 0 8px;box-shadow: 0 4px 12px rgba(0,0,0,0.1);white-space: nowrap;min-width: 120px;}
#custom_copy_toolbar span {
    cursor: pointer;display: inline-block;padding: 9px 8px;
    font-size: 14px;font-weight: 500;word-spacing: -1px;
}

.line1_text{white-space: nowrap;display: block;}
/*.line1_text, .line2_text, .line3_text{white-space: nowrap;display: block;}*/

.is-hidden{visibility: hidden;height: 0;padding: 0;}
.flex1{flex: 1 !important;}
.gap-05{gap: 5px;}
.gap-15{gap: 15px;}
.gap-20{gap: 20px;}
/*.ip_wr .ip_tit{display: flex;align-items: end;justify-content: space-between;}*/
.ip_wr .ip_tit .text-danger{color: var(--primary) !important;}

.modal-content > form{flex: 1 1 auto;}
.modal .modal-header .close{width: auto;}
.modal-dialog{margin: 0 auto;/*max-width: 576px;*/}
.modal-dialog.modal-xsm{max-width: 350px;}
.modal-dialog.modal-lg{padding-left: 16px;padding-right: 16px;}
.modal-body .swiper{/*max-width: 576px;max-width: var(--body_width);*/max-width: 100% !important;}
.modal-body.slider-box-body{max-height: 100%;max-height: calc(100vh - var(--hd_height_m) - 3px);background: #fff;}
.swiper-pagination.swiper-page-box {position: absolute;top: 15px;left: auto;right: 15px;bottom: auto;width: auto;padding: 4px 10px;
    background-color: rgba(9, 9, 9, 0.69);border-radius: 30px;color: #fff;font-size: 12px;font-weight: 400;
}
.modal_full.modal .modal-footer{z-index: 2;}
/*.modal.modal-fullscreen,
.modal_full.modal{
    right: 0 !important;
    left: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
}
.modal_full.modal .hd_m + .modal-body{padding-top: var(--hd_height_m);}
.modal_full.modal .modal-body{height: calc(100vh - var(--hd_height_m));max-height: 100vh;}
.modal_full.modal .modal-body .sub_pg{min-height: auto;padding-top: 0;}
.modal_full.modal .modal-body .tab_sticky{top: 0;}
.modal_full.modal .swiper{height: 100%;}
.modal_full.modal .modal-body.modal-header-none{height: calc(100vh);}
.modal_full.modal .modal-body.modal-header-none .close{position: absolute;right: 16px;top: 10px;z-index: 2;opacity: 1;
    text-shadow: none;padding: 0;margin: 0;border: 0;background: transparent;width: 3.0rem;
}
.modal_full.modal .modal-body.modal-header-none .swiper-wrapper{padding-top: var(--hd_height_m) !important;height: calc(100vh - var(--hd_height_m));}
.modal_full.modal .modal-body .swiper-pagination-fraction{height: var(--hd_height_m);top: 0;display: flex;align-items: center;justify-content: center;gap: 3px;font-size: 1.6rem;}
.modal_full.modal .modal-body .swiper-pagination-fraction .swiper-pagination-current{font-weight: 700;}*/

.dropdown_menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 2;
    display: none;
    float: left;
    min-width: 10rem;
    margin: 0.125rem 0 0;
    font-size: 1.6rem;
    color: var(--text);
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    padding-top: 1.2rem;
    padding-bottom: 1.2rem;
    border: 0;
    border-radius: 12px;
    box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.2);
}
.dropdown_menu-left {
    right: auto;
    left: 0;
}
.dropdown_menu-right {
    right: 0;
    left: auto;
}
.dropdown_menu[x-placement^=top], .dropdown_menu[x-placement^=right], .dropdown_menu[x-placement^=bottom], .dropdown_menu[x-placement^=left]{
    right: auto;
    bottom: auto;
}
.dropdown_menu.show{
    display: block;
}
.dropdown_menu .dropdown-item{
    display: block;
    width: 100%;
    padding: 0.25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    font-size: 14px;
    text-align: center;
    padding-top: 0.9rem;
    padding-bottom: 0.9rem;
}
.dropdown_menu .dropdown-item:hover{background:#F5F6F8;}
/*.dropdown_toggle::after{
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
}
.dropdown_toggle::after {display: none !important;}
.dropdown_toggle:empty::after{
    margin-left: 0;
}*/
.collapse_menu:not(.show) {
    display: none;
}
.collapse_menu.show {
    display: block;
}

body.menu_on{position: fixed;top: 0;overflow-y: scroll;width: 100%;}
.fix-bottom-box{position: fixed;bottom: -1px;width: 100%;transform: none;margin: 0 auto;left: 0;right: 0;z-index: 1;max-width: 576px;padding: 16px;padding-top: 0;background: #fff;}
.hd_m{position: fixed !important;/*border-bottom-color: #E2E2E2;*/}
.hd_m,
.fix-bottom-box{transition: transform 0.3s ease;}
.hd_m.hidden{transform: translateY(-100%);}
.fix-bottom-box.hidden{transform: translateY(100%);}
/*.sub_pg{padding-bottom: 0;}
.tab_fixed{position: fixed !important;top: var(--hd_height_m);background-color: #fff;}
.wrap > .sub_pg{padding-top: var(--hd_height_m);min-height: 100vh;}
.wrap > .sub_tab_pg{padding-top: calc(var(--hd_height_m) + 5.1rem);min-height: 100vh;}*/
.btn2{border: 0; background: none; margin: 0; padding: 0;}
.bottom_btn_box{
    z-index: 1000;
    /*padding: 0.8rem 1.6rem;*/padding-top: 10px;max-width: 576px;
    border-top: 1px solid var(--border);background: #fff;
}
.bottom_side_btn{
    width: 4.0rem;
    height: 4.0rem;
    background-color: #E2DED3;color: #055896;
    border-radius: 50%;
    position: fixed;bottom: 1.5rem;z-index: 1000;
    display: flex;align-items: center;justify-content: center;
    right: 50%;transform: translateX(272px);
    transition: 0.5s all;
}
.bottom_side_btn.up{bottom: 6.5rem;}
.bottom_side_btn.left{left: 50%;right: auto;transform: translateX(-272px);}

@media (max-width: 575.98px) {
    .bottom_side_btn {right: 1.6rem;transform: translateX(0);}
    .bottom_side_btn.left{left: 1.6rem;right: auto;transform: translateX(0);}
}

/*.hd_m .page_tit{position: absolute;width: 100%;left: 0;right: 0;margin: 0 auto;z-index: 0;text-align: center;font-size: 1.8rem;font-weight: 700;color: #000;max-width: 78%;line-height: 1.1;}
.hd_m .page_tit_1{font-size: 1.5rem;}*/
.hd_m .hd_btn{display: flex;align-items: center;/*gap: 15px;*/}
.hd_m button{z-index: 1;}
/*.hd_m .btn-back{width: 3.0rem;text-align: left;}
.hd_m .icon35_txt{height:3.0rem;}*/
.dropdown .btn,
.hd_m .dropdown img{height:2.2rem !important;}
.hd_m .main-logo img{/*vertical-align: 0px;*/width: 120px;}

.tab_sticky{left: auto;transform: none;top: var(--hd_height_m);background-color: #fff;}
.icon18{height: 1.8rem;}
.search_history{padding-top: 2.8rem !important;}
.search_history li{margin-bottom: 2.0rem;}

#list_slt_t .touch_scroll{overflow: visible;}
#list_slt_t .touch_scroll .btn-group{display: flex;flex-wrap: wrap;}
#list_slt_t .touch_scroll .btn-group > .btn{flex: unset;margin-bottom: 7px;}


.agree_cont li .btn-icon{width: 20px;height: 20px;justify-content: end;}
.profile_upload.filebox .file_box,
.group_upload.filebox .file_box{background-repeat: no-repeat;background-position: center center;background-size: cover;position: absolute;}

.comment_img{width: 10rem;height: 10rem;border-radius: 1.0rem;overflow: hidden;}
.comment_bubble p + .comment_img{margin-top: 5px;}
.comm_wrap .comm_box{position: relative;}
.comm_wrap .media{padding-top: 15px;padding-bottom: 15px;}
.com_reply{padding-left: 20px;background-color: #F8F9FB;border-bottom: 1px solid #f1f1f1;}
.com_reply_blind{margin-left: 3rem;display: inline-flex;align-items: center;color: var(--gray);}
.com_reply_blind .mini_profile{display: flex;align-items: center;justify-content: center;}
.com_reply_blind img{width: 22px !important;}
.com_reply_blind img.rotate{transform: rotate(180deg);}
.comm_wrap{max-height: none;}
.comm_wrap .media .mini_profile{z-index: 1}
/*.com_reply:before{
    content: '';position: absolute;width: 1px;background: #ddd;z-index: 0;
    left: calc(3rem + (27px/2) - 0.5px);
    top: calc(3px + 27px);
    height: calc(100% - (3px + 27px + 27px));
}*/
.comm_box .com_reply_blind::before{left: 0;}
.comm_target{
    display: flex;align-items: center;justify-content: space-between;
    background-color: #f1f1f1;
    padding: 0.5rem 0.5rem 0.5rem 1.5rem;
    position: fixed;z-index: 1;
    bottom: 60px;
    max-width: 576px;
    width: 100%;
}
.comm_target.secret{bottom: 82px;}
.comm_target .btn-comment-cancel{width: 30px;padding-left: 0 !important;padding-right: 0 !important;}
.fix-bottom-box .btn.btn-comment-write{margin-bottom: 2px;margin-right: 2px;}
.bo_vc_w .com_ip{border-radius: 0.8rem !important;height: auto;padding-right: 0;}
.chatroom_pg .bo_vc_w .com_ip{
    border-radius: 36rem !important;padding-right: 1.5rem;
    background-color: var(--gray-200);
    border-color: var(--gray-200);
}
.chatroom_pg .bo_vc_w .form-control{background: transparent;}
.bo_vc_w textarea.form-control{resize: none;}
.fix-bottom-box .bo_vc_w textarea.form-control{height: 22px;min-height: 40px;padding: 1.0rem 0;/*1.4rem 0 0.9rem*/overflow: hidden;box-sizing: border-box;max-height: 120px;transition: height 0.1s ease;}
.bo_vc_w textarea.form-control:disabled,
.bo_vc_w textarea.form-control[readonly]{background-color: transparent;}

.comm_wrap .comment_wt{padding-left: 0;padding-right: 0;border: 0;}

.view-withKeyboard .fix-bottom-box:not(.bottom_btn_box).relative{position: relative;padding-left: 0;padding-right: 0;padding-bottom: 15px;margin-top: 38px;}
/*
.g-heart .ic_heart{display: inline-block}
.g-heart .count{font-size: 1.3rem;color: var(--gray-700) !important;}
.heart_btn{display: flex !important;align-items: center !important;gap: 3px;}
.heart_btn .count{margin-top: 2px;font-size: 1.3rem;color: var(--gray);}
.heart_btn .ic_heart,
.heart_btn .ic_bookmark,
.heart_btn img{width: 20px !important;margin-right: 0;}
.heart_btn .ic_heart,
.heart_btn .ic_bookmark{aspect-ratio: 1 / 1;display: inline-block;background-size: cover;background-repeat: no-repeat;}
.heart_btn .ic_heart{background-image: url(../design/img/ic_heart.svg);}
.heart_btn .ic_bookmark {background-image: url(../design/img/ic_bookmark_off.png);}
.heart_btn.active .ic_heart,
.heart_btn .ic_heart.on {background-image: url(../design/img/ic_heart_on.svg);}
.heart_btn.active .ic_bookmark,
.heart_btn .ic_bookmark.on {background-image: url(../design/img/ic_bookmark_on.png);}
.ic_refresh.btn{display: flex;align-items: center;justify-content: center;flex-direction: row;}
.ic_refresh img{width: 18px !important;margin-right: 2px;transform: scaleX(-1);margin-top: -2px;}
.ic_link img{width: 14px !important;margin-right: 5px;transform: rotate(140deg);}
*/

.filebox .file_box,
.upload_img_wrap .filebox .file_box{border: 0;border-radius: 0;}
.upload_img_wrap{margin-left: -0.5rem;margin-right: -0.5rem;row-gap: 1rem;}
.upload_img_wrap .image_upload{width: auto;margin: 0;padding-left: 0.5rem;padding-right: 0.5rem;display: flex;flex: 0 0 25%;max-width: 25%;}
.upload_img_wrap .upload_box{display: inline-block;position: relative;width: 100%;height: auto;}
.upload_img_wrap .filebox .btn_remove, .upload_del{
    top: 0;
    right: 0;
    padding: 0.4rem 0.4rem 0 0 !important;
    width: 2.2rem;
    height: 2.2rem;
}
.image_upload{margin-top: 0.6rem;margin-right: 0.6rem;}
.upload_box{width: 100px;height: 100px;background-color: #fff;/*border-radius: 6px;border-color: var(--border);*/}
/*.profile_set .upload_box{width: 110px;height: 110px;background-color: var(--gray-200);border-radius: 50%;border: 0;}
.profile_set .upload_box label img{width: 100%;aspect-ratio: 1 / 1;object-fit: cover;}*/
.talk_input .touch_scroll .upload_img_wrap{flex-wrap: nowrap;/*width: fit-content;*/width: auto;margin-left: 1.6rem;margin-right: 1.6rem;display: inline-flex;}
.talk_input .touch_scroll .upload_img_wrap .image_upload{padding-left: 0.3rem;padding-right: 0.3rem;width: 94px;height: 88px;flex: auto;max-width: none;flex-shrink: 0;}
.talk_input .touch_scroll .upload_img_wrap .upload_box{border-radius: 0.4rem;}
.talk_input .touch_scroll .upload_img_wrap .rect{height: 100%;aspect-ratio: 1 / 1;}
.talk_input .touch_scroll .upload_img_wrap .rect img{position: static;width: 100%;height: 100%;transform: none;}
/* 고객QA20260708 #2: 대화 입력창 사진 추가 '+' 타일 (모바일 앱 미러 — 미리보기 끝에서 누적 첨부) */
.talk_input .touch_scroll .upload_img_wrap .filebox_add{padding-left: 0.3rem;padding-right: 0.3rem;width: 94px;height: 88px;flex: auto;max-width: none;flex-shrink: 0;cursor: pointer;}
.talk_input .touch_scroll .upload_img_wrap .filebox_add .add_more_box{display: flex;align-items: center;justify-content: center;width: 100%;height: 100%;border: 1.5px dashed var(--gray-300);border-radius: 0.4rem;background: var(--gray-100);}
.talk_input .touch_scroll .upload_img_wrap .filebox_add .add_more_plus{font-size: 3rem;line-height: 1;color: var(--gray-400);font-weight: 300;}
/*.talk_input .touch_scroll .upload_img_wrap::after {
    content: '';
    display: block;
    min-width: 3.2rem;
    height: 1px;
}*/
#more_content.show .more_list,
#more_content.show{/*height: 98px;*/height: 130px;}
#more_content .more_list{background: #fff;border-radius: 1.6rem 1.6rem 0 0;padding: 2.2rem 0rem 0;overflow: hidden;}

.talk_input .write_send:before{background: var(--primary);}

.square-sm{/*width: 10rem;height: 10rem;*/max-width: calc((100% - 25px) / 5);border-radius: 1.0rem;overflow: hidden;}

.sns_icon_box{display: flex;flex-direction: column;align-items: center;justify-content: center;}
.sns_icon_box ul{width: 50%;gap: 0;}
.sns_icon_box li{width: 50%;display: flex;justify-content: center;}
.recent_login{margin-top: 15px;}
.recent_login div{position: relative;color: var(--primary);background-color: #e4dcff;font-size: 13px;padding: 6px 8px;}
.recent_login div:before{content: '';position: absolute;top: -20px;width: 0;height: 0;left: 0;right: 0;margin: 0 auto;border-bottom: 10px solid #e4dcff;border-top: 10px solid transparent;border-left: 5px solid transparent;border-right: 5px solid transparent;}

/*.mini_container{
    overflow-y: scroll;
    max-height: calc(100vh - var(--hd_height_m) - 9.0rem);
    margin-bottom: 9.0rem;
}

.write_num{font-size: 1.2rem;}
.profile_img{width: 50px;height: 50px;border-radius: 50%;}
.profile_sm_img{width: 27px;height: 27px;border-radius: 50%;}

.profile_set{width: 100%;flex-direction: column;display: flex;align-items: center;}
.seller_img {width: 110px;height: 110px;}
.seller_img > label {width: 100%;height: 100%;display: block;}
.seller_img .filebox {width: 100%;height: 100%;display: block;margin: 0;}
.seller_img .filebox .file_box {
    background-color: #fff;border: 1px solid #e1e1e1;
}*/
.rv-star-box{display: flex;align-items: center;/*gap: 1px;margin-left: 10px;*/}
.rv-star-box .rv-star{position: relative;line-height: normal;display: flex;width: 26px;height: 26px;background-color: unset;}
.list-item .rv-star-box .rv-star{width: 11px;height: 11px;}
.rv_star_img{display: inline-block;width: 4.3rem;height: 4.3rem;margin: 0.5rem 0;background-size: 78%;
    background-image: url("./../design/img/ico_star2_off.png");
    background-repeat: no-repeat;background-position: center;
}
.rv_star_5{display: flex;justify-content: center;}
.rv_star_5 .rv_star_img{width: 2.0rem;height: 4.0rem;margin: 0.5rem 0;background-size: 100%;background-image: url("./../design/img/ico_star2_.png");}
.rv_star_5 .rv_star_img.l{margin-left: 0.05rem;}
.rv_star_5 .rv_star_img.r{margin-right: 0.05rem;transform: scaleX(-1);}
.rv-star-box .on img,
.rv_star_5 .rv_star_img.on{filter: invert(20%) sepia(59%) saturate(999%) hue-rotate(3deg) brightness(110%) contrast(109%);}/* https://codepen.io/sosuke/pen/Pjoqqp */
.rv-star-box .rv-star.partial:before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;
    background-image: url("./../design/img/ico_star2_off.png");background-repeat: no-repeat;background-size: 100%;
}

.more-toggle-wr{display: flex;line-height: 1.4em;font-size: 1.4rem;}
.more-toggle-wr .btn_show_answer,
.more-toggle-wr .more-toggle-btn{align-self: flex-end;/*padding-left: 1.5rem;*/ width: 45px;text-align: right;}
.more-toggle-wr .more-btn{padding-bottom: 0;color: var(--gray-500);text-decoration: underline;display: inline-block;}
.more-toggle-wr .more-toggle-text{max-width: calc(100% - 45px);}
.more-toggle-wr.show{display: block;}
.more-toggle-wr.show .more-toggle-text{display: inline;}
.more-toggle-wr.show .more-toggle-btn{display: inline;}

.one_item .item_body {height: 4.6rem;}
.group_item .item_body {height: 5.6rem;}

.talk_content .date,
.speech_item{margin-top: 0;margin-bottom: 2.4rem;}
.speech_item.mb-0{margin-bottom: 0.6rem !important;}
.speech_item .sympathy{margin-top: 0.2rem;}
.speech_item .sympathy_item img{width:1.8rem;height:1.8rem;margin-right:0.3rem;}
.speech_item .message_unread{position: unset;margin-bottom: 0.5rem;}
.speech_item .cont_date{position: unset;}

.talk_content .random_info{margin-top: 0;margin-bottom: 2.4rem;height: auto;}
.speech_item .context_dropdown .chat-box1{display: flex;flex-direction: column;align-items: start;gap: 0.2rem;}
.speech_item .context_dropdown .chat-box1 .chat-box2{order: 1;}
.speech_item .context_dropdown .chat-box1 .cont_date{order: 2;font-size: 1.1rem;color: #69788C;}
.speech_item .context_dropdown .chat-box1 .message_unread{order: 2;margin-left: 3rem;}
/* SPEC-GODOHWA-E6-MSGEDIT: "수정됨" 라벨 — 시간 라벨과 동일 톤(작은 회색), 메타 행 정렬 */
.speech_item .cont_edited{font-size: 1.1rem;color: #99A5B5;order: 2;}
/* SPEC-GODOHWA-E6-MSGEDIT-48H(디자인 대조): Figma 기준 — '수정됨'은 말풍선 안쪽 우측 하단.
   파란 말풍선(발신)에서는 흰 글씨, 흰 말풍선(수신)에서는 어두운 글씨가 되도록 색을 상속하고 투명도로 낮춘다. */
.speech_bubble .cont_edited_in{display:block;text-align:right;font-size:1.1rem;line-height:1.4;margin-top:0.2rem;opacity:0.72;}
.speech_item.speech_item_me .context_dropdown .chat-box1{align-items: end;}
.speech_item .context_dropdown .chat-box2{display: flex;flex-direction: column;align-items: start;gap: 0.6rem;}
.speech_item.speech_item_me .context_dropdown .chat-box2{align-items: end;}
.speech_item .item_body{display: flex;flex-direction: column;align-items: start;}
.speech_item.speech_item_me .item_body{align-items: end;}

.speech_item .speech_bubble{background: var(--gray-100);color:var(--gray-600);border-radius: 0.2rem 1.6rem 1.6rem 1.6rem;}
.speech_item.middle .speech_bubble{border-radius: 0.2rem 1.6rem 1.6rem 0.2rem;}
.speech_item.last .speech_bubble{border-radius: 0.2rem 1.6rem 1.6rem 1.6rem;}
.speech_item .item_body:has(.sympathy) .speech_bubble{border-bottom-left-radius:1.6rem;}
.speech_item .item_body:has(.speech_link) .speech_bubble{border-bottom-left-radius:0.2rem;border-top-left-radius:1.6rem;}

.speech_item.speech_item_me .speech_bubble{background: var(--primary);color:#fff;border-radius: 1.6rem 1.6rem 0.2rem 1.6rem;}
.speech_item.speech_item_me.middle .speech_bubble{border-radius: 1.6rem 0.2rem 0.2rem 1.6rem;}
.speech_item.speech_item_me.last .speech_bubble{border-radius: 1.6rem 0.2rem 1.6rem 1.6rem;}
.speech_item.speech_item_me .item_body:has(.sympathy) .speech_bubble{border-top-right-radius:1.6rem;}
.speech_item.speech_item_me .item_body:has(.speech_link) .speech_bubble{border-radius:1.6rem 1.6rem 0.2rem 1.6rem;}

.speech_item .speech_bubble .btn-chatAll{color: var(--gray-600);}
.speech_item.speech_item_me .speech_bubble .btn-chatAll{color: #fff;}

.text_select .speech_item{position: absolute;left: calc(2.0rem + 3.6rem + 0.8rem);right: auto;border-radius: 1.6rem;}
.text_select .speech_item.speech_item_me{position: absolute;left: auto;right: 2.0rem;}

.speech_photo{cursor: unset;}
.speech_media .media_down{/*width: auto;max-width: 26.0rem;*/gap: 0.6rem;}
.voice_control .time{text-align: right;min-width: 4.4rem;}
.voice_control .play_ing{touch-action: none;margin-left: -1.1rem;transition: left 0.15s linear;will-change: left;}

.speech_record .play_bar .play_toggle.loading-spin {
    background: none !important;
    border: 0.25em solid currentcolor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: 0.75s linear infinite;
    opacity: 0.6;
    pointer-events: none; /* 재시도 중 클릭 방지 */
}

.ad_mark{position: absolute;top: 0.8rem;right: 0.8rem;z-index: 1;padding: 0.1rem 0.4rem;border-radius: 1.0rem;background: #fff;border: 1px solid var(--gray-200);color: #666;
    font-size: 1.0rem;font-weight: 400;display: flex;align-items: center;justify-content: center;line-height: 1.1;
}

/*.talk_pg_1 .speech_item .message_unread{width: 1.4rem;height: 1.4rem;margin-bottom: 0.2rem;background: #777;display: flex;align-items: center;justify-content: center;}
.talk_pg_1 .speech_item .message_unread:after{content: ' ';background: #fff;width: 1.0rem;height: 0.2rem;}*/
.talk_pg_1 .speech_item .message_unread{width: 1.6rem;height: 1.6rem;margin-bottom: 0;background-color: transparent;
    background-image: url("./../design/img/check_icon_on.png");background-size: contain;background-repeat: no-repeat;background-position: center;
}
.talk_pg_1 .speech_item .message_unread::after{content: none;}

.customoverlay {position:relative;bottom:70px;border-radius:0;border: 1px solid #ccc;border-bottom:2px solid #ddd;float:left;margin-left: 14px;}
.customoverlay:nth-of-type(n) {border:0; box-shadow:0 1px 2px #888;}
.customoverlay a {display:block;text-decoration:none;color:#000;text-align:center;border-radius:6px;font-size:14px;font-weight:bold;overflow:hidden;}
.customoverlay .title {display:block;text-align:center;background:#fff;padding:10px 15px;font-size:14px;font-weight:bold;}
.customoverlay:after {content:'';position:absolute;margin-left:-12px;left:50%;bottom:-12px;width:22px;height:12px;background:url('https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white.png')}

.profile_btn .friend_del_add .icon_toggle {
    background-image: url(../design/img/profile_icon02_on.png);
}
.profile_btn .friend_del_add.active .icon_toggle {
    background-image: url(../design/img/profile_icon02.png);
}


/* 채팅 이미지 그리드 — 6-sub-column 으로 마지막 행 빈칸 없이 채움 (카톡 방식) */
/* 고객QA20260722 곽: 업로드 이미지 흰색 테두리 매우 얇게 2px→1px */
.image-grid {display: grid;gap: 0.2rem;border-radius: 1.0rem;overflow: hidden;
    grid-template-columns: repeat(6, 1fr);
    border: 1px solid #fff;
    box-sizing: border-box;
}
.image-grid > button {grid-column: span 2;}
.image-grid button > img {width: 100%;height: 100%;object-fit: cover;border-radius: 0;aspect-ratio: 1 / 1;display: block;}
.image-grid.images-1 {grid-template-columns: 1fr;}
.image-grid.images-1 > button {grid-column: auto;}
/* 고객QA20260603 행18: 낱장(단일) 이미지는 정사각 크롭(aspect-ratio 1/1 + cover) 대신 원본 비율 유지.
   긴 세로 이미지도 잘리지 않고 전체가 보이도록 — 앱 SingleChatImage 비율보존 정책과 동일.
   너무 긴 이미지는 max-height 로 제한(비율 유지하며 폭 축소). */
.image-grid.images-1 > button > img {aspect-ratio: auto;object-fit: contain;width: auto;height: auto;max-width: 100%;max-height: 42rem;}
.image-grid.images-2 > button,
.image-grid.images-4 > button {grid-column: span 3;}
/* 마지막 행 2장 (5,8,11,…) */
.image-grid:not(.images-2):not(.images-4) > button:last-child:nth-child(3n - 1),
.image-grid:not(.images-2):not(.images-4) > button:nth-last-child(2):nth-child(3n + 1) {grid-column: span 3;}
.image-grid:not(.images-2):not(.images-4) > button:last-child:nth-child(3n - 1) > img,
.image-grid:not(.images-2):not(.images-4) > button:nth-last-child(2):nth-child(3n + 1) > img {aspect-ratio: 3 / 2;}
/* 마지막 행 1장 (7,10,13,…) */
.image-grid:not(.images-1):not(.images-2):not(.images-4) > button:last-child:nth-child(3n + 1) {grid-column: span 6;}
.image-grid:not(.images-1):not(.images-2):not(.images-4) > button:last-child:nth-child(3n + 1) > img {aspect-ratio: 3 / 1;}

.checks_ico{
    width: 2.4rem;height: 2.4rem;
    background-image: url(../design/img/check_icon_on.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    flex-shrink: 0;
    position: static;
    margin-right: .8rem;
}
.checks_ico.off{filter:grayscale(1);opacity:.2;}

#upload_progressbar {
    background: rgba(255, 255, 255, 0.9);position: absolute;top: -18px;left: 0;width: 100%;height: 18px;z-index: 1;overflow: hidden;
}
#upload_progressbar .total-progress-label {
    position: absolute;top: 0;left: 0;width: 100%;height: 100%;
    display: flex;align-items: center;justify-content: space-between;padding: 0 2.0rem;z-index: 10;pointer-events: none;
    font-size: 1.1rem;color: #000;/* text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.8); 흰색 외곽선 효과 */
}
#upload_progressbar .progress-bar-bg {
    position: relative;width: 100%;height: 18px;background-color: #e9ecef;overflow: hidden;
}
#upload_progressbar .progress-bar-fill {
    width: 0%;height: 100%;background: var(--primary);transition: width 0.3s ease;
}
#upload_progressbar #current_file_name {
    white-space: nowrap;overflow: hidden;text-overflow: ellipsis;display: block;font-size: 1.1rem;color: #000;
}

#toast-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;/*display: flex;*/
    flex-direction: column;
    gap: 10px;
    z-index: 9999;
}
@media (min-width: 576px) {
    #toast-container {
        display: flex; /* 화면이 커지면 flex로 변경하여 노출 */
    }
}
.toast-message {
    width: 320px;
    padding: 15px;
    background: #ffffff;
    color: #333;
    border-left: 5px solid var(--primary);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-radius: 4px;
    /*animation: slideIn 0.3s ease-out;*/
    animation: fadeInDown 0.3s ease-out;
    font-family: sans-serif;
    overflow: hidden;
}
/*@keyframes slideIn {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}*/
@keyframes fadeInDown {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}
.toast-message.fade-out {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.5s ease-out;
    pointer-events: none;
}


/* SPEC-GODOHWA-A4-CHATSEARCH: 대화방 내 검색바 (Figma 96:19700 / 96:19792)
   헤더 아래 한 행 — 흰 원형 뒤로가기 + 흰 pill 입력창(우측 ∧ ∨ ×). */
/* SPEC-GODOHWA-A4-CHATSEARCH — Figma 96:19884 실측값 (1rem=10px)
   행 390x70(상하 14, 좌우 20, gap 10) / ← 원 42, 아이콘 24 / 필드 298x42, radius 21, 좌 14 우 10
   ∧∨ 원 28(gap 4), 아이콘 20 / × 26, 아이콘 20
   배경: ← 원·필드 = 흰색 74%(대화방 배경색이 비쳐야 함) / ∧∨ 원 = 불투명 흰색 */
.chat_search_bar{position:fixed;left:0;right:0;top:0;z-index:1000;display:flex;align-items:center;gap:1.0rem;padding:1.4rem 2.0rem;background:transparent;}
.chat_search_bar button{padding:0;border:0;display:flex;align-items:center;justify-content:center;}
.chat_search_bar .csb_back{flex:0 0 auto;width:4.2rem;height:4.2rem;border-radius:50%;background:rgba(255,255,255,0.74);color:#38404B;}
.chat_search_bar .csb_field{flex:1 1 auto;height:4.2rem;display:flex;align-items:center;gap:0.4rem;background:rgba(255,255,255,0.74);border-radius:2.1rem;padding:0 1.0rem 0 1.4rem;}
.chat_search_bar .csb_field input{flex:1 1 auto;border:0;outline:0;background:transparent;font-size:1.5rem;line-height:2.2rem;min-width:0;color:#38404B;}
.chat_search_bar .csb_go{flex:0 0 auto;width:2.8rem;height:2.8rem;background:transparent;color:#38404B;}
.chat_search_bar .csb_nav{flex:0 0 auto;width:2.8rem;height:2.8rem;border-radius:50%;background:#fff;color:#444C56;}
.chat_search_bar .csb_nav.disabled{color:#9EA5B0;cursor:default;}
.chat_search_bar .csb_clear{flex:0 0 auto;width:2.6rem;height:2.6rem;background:transparent;color:#38404B;}
#chat_detail_box mark.chat_search_hit{background:#DDE1E6;color:inherit;border-radius:0.3rem;padding:0 0.2rem;}
/* Figma 검색 후 화면에 현재 결과 강조 테두리가 없어 하이라이트만 사용한다 */
.speech_bubble.chat_search_focus{}

/* SPEC-GODOHWA-M2-DELPOPUP — 첨부 삭제 팝업 3종. Figma 96:21223 / 96:21305 / 96:21382 실측
   팝업 342 · 버튼 48 높이, 간격 8 · 보조 #F6F6F8/#38404B · 위험 #FF4D4D/#fff
   묶음사진(3버튼)만 세로 배치(.del_stack) */
.jconfirm-box.jconfirm-type-del_popup,
.jconfirm-type-del_popup .jconfirm-box{width:34.2rem !important;max-width:calc(100% - 4.8rem) !important;padding-bottom:2.0rem !important;}
.jconfirm-box.jconfirm-type-del_popup .jconfirm-buttons,
.jconfirm-type-del_popup .jconfirm-box .jconfirm-buttons{display:flex;gap:0.8rem;margin:0 !important;padding:0;}
.jconfirm-box.jconfirm-type-del_popup .jconfirm-buttons button,
.jconfirm-type-del_popup .jconfirm-box .jconfirm-buttons button{flex:1 1 0;min-width:0 !important;max-width:100%;height:4.8rem;margin:0 !important;padding:0 0.8rem !important;border:0 !important;border-radius:1.0rem !important;font-size:1.6rem;font-weight:500;text-transform:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.jconfirm-box.jconfirm-type-del_popup .jconfirm-buttons button.btn-del-sub,
.jconfirm-type-del_popup .jconfirm-box .jconfirm-buttons button.btn-del-sub{background:#F6F6F8 !important;color:#38404B !important;}
.jconfirm-box.jconfirm-type-del_popup .jconfirm-buttons button.btn-del-danger,
.jconfirm-type-del_popup .jconfirm-box .jconfirm-buttons button.btn-del-danger{background:#FF4D4D !important;color:#fff !important;}
.jconfirm-box.del_stack .jconfirm-buttons,
.del_stack .jconfirm-box .jconfirm-buttons{flex-direction:column;}
/* 세로 배치에서는 flex-grow 가 세로축을 나눠 높이를 눌러버린다 → 고정 높이 유지 */
.jconfirm-box.del_stack .jconfirm-buttons button,
.del_stack .jconfirm-box .jconfirm-buttons button{flex:0 0 auto;width:100%;}