@charset "utf-8";

/* Sub page shell */
.sub-visual{position:relative;width:100%;padding-top:150rem;}
.sub-contents{position:relative;width:100%;}

/* Page intro (inside .sub-visual) */
.page-intro{width:100%;}
.page-intro-img{margin-top:40rem;}
.page-intro-label{margin:0;font-size:var(--font24);font-weight:var(--fw-regular);letter-spacing:-.48rem;color:var(--bk-deep);}
.page-intro-tit{margin:24rem 0 0;font-size:55rem;font-weight:var(--fw-bold);line-height:1.3;letter-spacing:0;}
.page-intro-tit em{font-style:normal;}
.page-intro-img{width:100%;aspect-ratio:1300/480;}
.page-intro-img--funeral{background:url('../img/sub/funeral/hero.jpg') no-repeat center / cover;}
.page-intro-img--company{background:url('../img/sub/company/hero.jpg') no-repeat center / cover;}
.page-intro-img--review{background:url('../img/sub/community/review_hero.jpg') no-repeat center / cover;}
.page-intro-img--notice{background:url('../img/sub/community/notice_hero.jpg') no-repeat center / cover;}

.sub-sec{padding:150rem 0 0;background:var(--wh);}
.sub-sec:last-child{padding-bottom:150rem;}
.sub-sec--pale{background:var(--main-pale);}
.pd-bt{padding-bottom:150rem;}

/* Tabs — Figma underline style */
.sub-tab{width:100%;background:var(--wh);scroll-margin-top:24rem;}
.sub-tab-in{display:flex;gap:24rem;width:100%;}
.sub-tab-item{flex:1;display:flex;align-items:center;justify-content:center;padding:0 0 16rem;border-bottom:2px solid transparent;color:var(--gray-500);font-size:var(--font20);letter-spacing:-.4rem;text-align:center;}
.sub-tab-item.is-active{border-bottom-color:var(--main-light);color:var(--main-light);font-weight:var(--fw-bold);}

/* Sub-page section variants (community / support boards) */
.community-top{padding-top:0;padding-bottom:150rem;}
.community-top .sub-tab{margin:100rem 0;}
.support-top{padding-top:0;padding-bottom:150rem;}
.support-top .sub-tab{margin:100rem 0;}
/* 뷰(탭 없음): 히어로 ↔ 본문 간격 — Figma 100 */
.support-top > .inner > .board-view{margin-top:100rem;}

/* Support board common (notice / qa list table) */
.support-board{width:100%;}
.support-toolbar{margin:0 0 24rem;}
.support-toolbar:after{display:block;visibility:hidden;clear:both;content:"";}
.support-toolbar .btn_bo_user{float:right;margin:0;padding:0;list-style:none;}
.support-toolbar .btn_bo_user > li{position:relative;float:left;margin-left:6rem;}
.support-board #bo_cate{margin:0 0 var(--gap-sm);}
.support-board #bo_cate h2{position:absolute;font-size:0;line-height:0;overflow:hidden;}
.support-board #bo_cate ul{display:flex;flex-wrap:wrap;gap:10rem;margin:0;padding:0;list-style:none;}
.support-board #bo_cate a{
  display:block;padding:10rem 22rem;border:1px solid var(--color-border);border-radius:var(--radius-full);
  color:var(--color-text-secondary);font-size:var(--font16);line-height:1.3;
}
.support-board #bo_cate a:hover,
.support-board #bo_cate #bo_cate_on{
  border-color:var(--main-light);background:var(--main-pale);color:var(--main);font-weight:var(--fw-semibold);box-shadow:none;
}

/* Board category — mobile select (공용: #bo_cate, .facility-cate) */
.bo-cate-select-btn{display:none;}
.support-table{margin:0 0 30rem;}
.support-table table{width:100%;border-collapse:collapse;border-top:0;}
.support-table thead th{
  padding:0 20rem;height:80rem;border-bottom:0;background:var(--main-pale);
  color:var(--bk-deep);font-size:var(--font18);font-weight:var(--fw-semibold);letter-spacing:-.36rem;text-align:center;
}
.support-table td{
  padding:0 20rem;height:80rem;border-bottom:1px solid var(--gray-200);color:var(--bk-deep);
  font-size:var(--font18);font-weight:var(--fw-semibold);letter-spacing:-.36rem;line-height:1.5;text-align:center;word-break:break-all;
}
.support-table .td_subject{text-align:left;}
.support-table .td_subject .bo_tit,
.support-table .td_subject .bo_tit a{color:var(--bk-deep);font-weight:var(--fw-semibold);}
.support-table .td_subject .bo_tit:hover,
.support-table .td_subject .bo_tit a:hover{color:var(--main-light);}
.support-table tbody tr:hover td{background:rgba(242,246,237,.5);}
.support-table .bo_notice td{background:var(--main-pale);}
.support-table .bo_notice td a{font-weight:var(--fw-bold);}
.support-table .notice_icon{
  display:inline-block;padding:4rem 10rem;border-radius:var(--radius-full);
  background:var(--main);color:var(--wh);font-size:var(--font14);font-weight:var(--fw-semibold);
}
.support-table .bo_cate_link{
  display:inline-block;margin-right:8rem;padding:2rem 8rem;border-radius:var(--radius-full);
  background:var(--main-pale);color:var(--main);font-size:var(--font14);
}
.support-table .new_icon{
  display:inline-block;margin-left:6rem;padding:0 6rem;border-radius:2rem;
  background:var(--main);color:var(--wh);font-size:var(--font14);font-weight:var(--fw-bold);vertical-align:middle;
}
.support-table .td_num2{width:100rem;}
.support-table .td_num{width:100rem;}
.support-table .td_datetime,
.support-table .td_date{width:200rem;}
.support-table .empty_table{padding:80rem 0;text-align:center;color:var(--color-text-muted);}
.support-table .bo_admin_edit{
  margin-left:8rem;color:var(--main-light);font-size:var(--font14);font-weight:var(--fw-semibold);text-decoration:underline;
}
.support-list-foot{
  display:flex;align-items:center;justify-content:center;gap:40rem;position:relative;width:100%;margin-top:40rem;
}
.support-list-foot .pg_wrap{flex:1;text-align:center;}
.support-list-foot .btn_write_qa{
  position:absolute;right:0;top:50%;transform:translateY(-50%);
  display:inline-flex;align-items:center;justify-content:center;width:100rem;height:auto;padding:12rem 0;
  border:1px solid var(--bk-deep);border-radius:var(--radius-full);background:var(--wh);color:var(--bk-deep);
  font-size:var(--font18);font-weight:var(--fw-semibold);letter-spacing:-.36rem;
}

/* Section heads */
.sec-head{margin-bottom:60rem;}
.sec-head h3{margin:0;font-size:var(--font45);font-weight:var(--fw-bold);line-height:1.4;letter-spacing:-.45rem;color:var(--bk-deep);}
.sec-head p{margin:24rem 0 0;font-size:var(--font18);line-height:1.5;letter-spacing:-.36rem;color:var(--gray-500);}

/* Write form (Figma: 후기작성 / 문의상담 글쓰기) */
.write-form{width:100%;margin-top:90rem;}
.write-form-list{width:100%;}
.write-form-row{margin-top:20rem;}
.write-form-row{display:flex;gap:20rem;align-items:center;width:100%;}
.write-form-row.is-textarea{align-items:flex-start;}
.write-form-label{flex:none;min-width:110rem;font-size:var(--font20);font-weight:var(--fw-bold);letter-spacing:-.4rem;color:var(--bk-deep);line-height:1.5;white-space:nowrap;}
.write-form-field{flex:1;min-width:0;display:flex;align-items:center;}
.write-form-field-extra{flex-wrap:wrap;gap:12rem;}
.write-form-input{
  width:100%;height:60rem;padding:0 24rem;border:1px solid var(--gray-200);border-radius:var(--radius-full);
  background:var(--wh);color:var(--bk-deep);font-size:var(--font20);letter-spacing:-.4rem;outline:none;
}
.write-form-input::placeholder{color:var(--gray-400);}
.write-form-input:focus{border-color:var(--main-light);}
.write-form-select-wrap{position:relative;}
.write-form-select-wrap::after{
  content:"";position:absolute;top:50%;right:24rem;width:12rem;height:12rem;margin-top:-8rem;
  border-right:2px solid var(--gray-500);border-bottom:2px solid var(--gray-500);
  transform:rotate(45deg);pointer-events:none;
}
.write-form-select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding-right:52rem;cursor:pointer;background-image:none;
}
.write-form-select:invalid{color:var(--gray-400);}
.write-form-select option{color:var(--bk-deep);}
.write-form-textarea{
  width:100%;min-height:300rem;padding:24rem;border:1px solid var(--gray-200);border-radius:20rem;
  background:var(--wh);align-items:stretch;
}
.write-form-textarea textarea{
  display:block;width:100%;height:252rem;min-height:252rem;padding:0;border:0;background:transparent;
  color:var(--bk-deep);font-size:var(--font20);letter-spacing:-.4rem;line-height:1.5;resize:vertical;outline:none;
}
.write-form-textarea textarea::placeholder{color:var(--gray-400);}
.write-form-divider{width:100%;height:0;margin:20rem 0 0;border:0;border-top:1px dashed var(--gray-200);}
.write-form-file{position:relative;gap:10rem;flex-wrap:wrap;}
.write-form-file-name{
  flex:1;min-width:0;height:60rem;padding:0 24rem;border:1px solid var(--gray-200);border-radius:var(--radius-full);
  display:flex;align-items:center;color:var(--gray-400);font-size:var(--font20);letter-spacing:-.4rem;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.write-form-file-btn{
  flex:none;display:inline-flex;align-items:center;justify-content:center;width:100rem;height:60rem;
  border:1px solid var(--bk-deep);border-radius:var(--radius-full);color:var(--bk-deep);
  font-size:var(--font18);font-weight:var(--fw-semibold);letter-spacing:-.36rem;cursor:pointer;background:var(--wh);
}
.write-form-file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.write-form-file-del{width:100%;margin-top:4rem;}
.write-form-check{display:inline-flex;align-items:center;gap:8rem;font-size:var(--font16);color:var(--gray-500);cursor:pointer;}
.write-form-check input{width:16rem;height:16rem;}
.write-form-btns{display:flex;justify-content:center;gap:10rem;margin-top:60rem;}
.write-form-btn{
  display:inline-flex;align-items:center;justify-content:center;width:265rem;height:68rem;
  border-radius:var(--radius-full);font-size:var(--font20);font-weight:var(--fw-bold);letter-spacing:-.4rem;
}
.write-form-btn-cancel{background:var(--gray-200);color:var(--gray-500);}
.write-form-btn-submit{border:0;background:var(--main-light);color:var(--wh);}
.write-form-btn-submit:hover{background:var(--main);}
.write-form-admin{margin-top:10rem;}

/* Board view (notice / facility / qa) — Figma: 공지/문의 view */
.board-view{display:flex;flex-direction:column;align-items:center;width:100%;}
.board-view > * + *{margin-top:60rem;}
.board-view-head{width:100%;}
.board-view-head > * + *{margin-top:20rem;}
.board-view-cate{
  display:inline-block;align-self:flex-start;padding:4rem 10rem;border-radius:var(--radius-full);
  background:var(--main-pale);color:var(--main);font-size:var(--font14);
}
.board-view-tit{margin:0 0 15rem;color:var(--bk-deep);font-size:var(--font45);font-weight:var(--fw-bold);line-height:1.4;letter-spacing:-.45rem;}
.board-view-meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:20rem;
  margin:0;color:var(--gray-500);font-size:var(--font20);letter-spacing:-.4rem;
}
.board-view-meta-item{display:inline-flex;align-items:center;gap:10rem;}
.board-view-meta-label{color:var(--gray-400);font-weight:var(--fw-bold);}
.board-view-meta-val{color:var(--gray-500);font-weight:var(--fw-regular);}
.board-view-date{margin:0;color:var(--gray-500);font-size:var(--font16);}
.board-view-meta-sep{flex:none;width:2px;height:20rem;background:var(--gray-200);}
.board-view-body{width:100%;padding:0 0 40rem;border-top:1px solid var(--gray-200);border-bottom:1px solid var(--gray-200);}
.board-view-img{margin:40rem 0 24rem;}
.board-view-img img{display:block;max-width:100%;height:auto;margin:0 0 12rem;}
.board-view-con{padding-top:40rem;line-height:1.5;color:var(--bk-deep);font-size:var(--font20);letter-spacing:-.4rem;}
.board-view-con img{max-width:100%;height:auto;}
.board-view-files{margin:24rem 0 0;padding:0;list-style:none;}
.board-view-files li{margin:0 0 8rem;}
.board-view-files a{color:var(--main-light);text-decoration:underline;}
.board-view-list-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10rem;
  width:200rem;height:60rem;border:1px solid var(--bk-deep);border-radius:var(--radius-full);
  color:var(--bk-deep);font-size:var(--font20);font-weight:var(--fw-bold);letter-spacing:-.4rem;background:var(--wh);margin-bottom:60rem;
}
.board-view-list-btn img{display:block;width:24rem;height:auto;}
.board-view-nav{width:100%;margin:0;padding:0;list-style:none;}
.board-view-nav li{
  display:flex;align-items:center;gap:40rem;padding:0 20rem;
  border-top:1px solid var(--gray-200);
}
.board-view-nav li:last-child{border-bottom:1px solid var(--gray-200);}
.board-view-nav li + li{border-top-style:dashed;}
.board-view-nav .nav-label{
  flex:none;display:flex;align-items:center;justify-content:space-between;gap:12rem;
  width:100rem;color:var(--bk-deep);font-size:var(--font20);font-weight:var(--fw-bold);letter-spacing:-.4rem;
}
.board-view-nav .nav-label img{display:block;width:20rem;height:auto;}
.board-view-nav .nav-label.is-prev img{transform:rotate(180deg);}
.board-view-nav .nav-sep{flex:none;align-self:stretch;width:1px;background:var(--gray-200);}
.board-view-nav a,
.board-view-nav .nav-empty{
  flex:1;min-width:0;padding:30rem 0;color:var(--bk-deep);font-size:var(--font20);letter-spacing:-.4rem;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.board-view-btns{display:flex;justify-content:center;flex-wrap:wrap;gap:10rem;width:100%;}
.board-view-btns.is-admin-only{justify-content:flex-end;}
.board-view-btn{
  display:inline-flex;align-items:center;justify-content:center;min-width:120rem;height:48rem;padding:0 24rem;
  border-radius:var(--radius-full);background:var(--gray-200);color:var(--gray-500);
  font-size:var(--font16);font-weight:var(--fw-semibold);
}
.board-view-btn.is-admin{background:var(--main-pale);color:var(--main-light);}
.qa-answer{width:100%;margin-top:40rem;padding-top:40rem;border-top:1px solid var(--gray-200);}
.qa-answer .board-view-btns.is-top{position:absolute;top:0;right:0;margin:0;}
.qa-answer-head{position:relative;}

@media screen and (max-width:1024px){
  .sub-visual{padding-top:80rem;}
  .page-intro-tit{font-size:36rem;}
  .page-intro-img{aspect-ratio:16/9;}
  .sec-head h3{font-size:32rem;}
  .sub-sec{padding:80rem 0 0;}
  .sub-sec:last-child{padding-bottom:80rem;}
  .pd-bt{padding-bottom:80rem;}
  .sub-tab{scroll-margin-top:0;}
  .community-top .sub-tab,
  .support-top .sub-tab{margin:40rem 0;}
  .support-top > .inner > .board-view{margin-top:60rem;}
  .write-form{margin-top:60rem;}
  .write-form-label{min-width:0;width:auto;font-size:var(--font16);}
  .write-form-input,
  .write-form-file-name{height:52rem;font-size:var(--font16);}
  .write-form-file-btn{width:88rem;height:52rem;font-size:var(--font15);}
  .write-form-textarea{min-height:240rem;padding:18rem;border-radius:16rem;}
  .write-form-textarea textarea{height:200rem;min-height:200rem;font-size:var(--font16);}
  .write-form-btn{width:200rem;height:56rem;font-size:var(--font18);}
  .board-view-tit{font-size:32rem;}
  .board-view-meta{font-size:var(--font16);gap:12rem;}
  .board-view-con{font-size:var(--font16);}
  .board-view-list-btn{width:160rem;height:52rem;font-size:var(--font16);}
  .board-view-nav .nav-label,
  .board-view-nav a,
  .board-view-nav .nav-empty{font-size:var(--font16);}
}
@media screen and (max-width:800px){
  .sub-visual .inner{padding:0;}
  .page-intro .page-intro-text{padding:0 20rem;}
  .page-intro-label{font-size:var(--font16);}
  .page-intro-tit{font-size:var(--font65);}
  .page-intro-img{aspect-ratio:375/138;}
  .sub-tab-in{gap:0;overflow-x:auto;justify-content:center;}
  .sub-tab-item{flex:none;padding:0 16rem 12rem;font-size:14rem;white-space:nowrap;}
  .community-top,.support-top{padding:0 0 var(--gap-sub);}
  .support-top > .inner > .board-view{margin-top:var(--gap-md);}
  .write-form{margin-top:var(--gap-md);}
  .write-form-row{margin-top:16rem;}
  .write-form-row,
  .write-form-row.is-textarea{flex-direction:column;align-items:stretch;gap:10rem;}
  .write-form-label{width:auto;}
  .write-form-btns{flex-direction:column;align-items:stretch;margin-top:var(--gap-md);}
  .write-form-btn{width:100%;}
  .board-view > * + *{margin-top:var(--gap-md);}
  .board-view-tit{font-size:var(--font45);}
  .board-view-meta{gap:8rem 12rem;}
  .board-view-meta-sep{display:none;}
  .board-view-nav li{flex-wrap:wrap;gap:12rem;padding:0;}
  .board-view-nav .nav-sep{display:none;}
  .board-view-nav a,
  .board-view-nav .nav-empty{padding:16rem 0 24rem;}
  .support-table thead{display:none;}
  .support-table tr{display:block;padding:16rem 0;border-bottom:1px solid var(--gray-200);}
  .support-table td{display:block;width:100% !important;height:auto;padding:4rem 0;border:0;text-align:left;}
  .support-table .td_num2,
  .support-table .td_num,
  .support-table .td_datetime,
  .support-table .td_date{display:inline-block;width:auto !important;margin-right:12rem;}
  .support-list-foot{flex-direction:column;gap:20rem;}
  .support-list-foot .btn_write_qa{position:static;transform:none;width:100%;}

  /* Board category → select box */
  #bo_cate,
  .facility-cate{
    position:relative;z-index:5;width:100%;margin:0 0 24rem;
  }
  .bo-cate-select-btn{
    display:flex;align-items:center;justify-content:space-between;gap:12rem;
    width:100%;height:52rem;padding:0 20rem;
    border:1px solid var(--main-light);background:var(--wh);
    color:var(--main-light);font-size:var(--font16);font-weight:var(--fw-medium);
    letter-spacing:-.32rem;line-height:1.3;text-align:left;cursor:pointer;
  }
  .bo-cate-select-btn::after{
    content:"";flex:none;width:10rem;height:10rem;margin-top:-4rem;
    border-right:1.5px solid var(--main-light);border-bottom:1.5px solid var(--main-light);
    transform:rotate(45deg);transition:transform .2s,margin .2s;
  }
  #bo_cate.is-open .bo-cate-select-btn::after,
  .facility-cate.is-open .bo-cate-select-btn::after{
    margin-top:4rem;transform:rotate(225deg);
  }
  #bo_cate > ul,
  .facility-cate > ul{
    display:none !important;
    position:absolute;left:0;right:0;top:100%;z-index:20;
    flex-direction:column;flex-wrap:nowrap;gap:0 !important;
    margin:0;padding:0;list-style:none;
    border:1px solid var(--gray-d5);border-top:0;background:var(--wh);
  }
  #bo_cate.is-open > ul,
  .facility-cate.is-open > ul{display:flex !important;}
  #bo_cate > ul li,
  .facility-cate > ul li{width:100% !important;margin:0;padding:0;float:none;}
  #bo_cate > ul a,
  .facility-cate > ul a,
  .support-board #bo_cate > ul a,
  .community-cate > ul a{
    display:block;width:100%;height:auto;min-height:0;margin:0;padding:14rem 20rem;
    border:0 !important;border-radius:0 !important;background:transparent !important;
    color:var(--gray-8) !important;font-size:var(--font16);font-weight:var(--fw-regular);
    letter-spacing:-.32rem;line-height:1.4;text-align:left;box-shadow:none !important;
  }
  #bo_cate > ul a:hover,
  .facility-cate > ul a:hover,
  .support-board #bo_cate > ul a:hover,
  .community-cate > ul a:hover{
    color:var(--main-light) !important;background:transparent !important;
  }
  #bo_cate > ul a#bo_cate_on,
  .facility-cate > ul a.is-on,
  .facility-cate > ul a#bo_cate_on,
  .support-board #bo_cate > ul a#bo_cate_on,
  .community-cate > ul a#bo_cate_on{
    color:var(--bk-deep) !important;font-weight:var(--fw-bold) !important;
    background:transparent !important;border:0 !important;box-shadow:none !important;
  }
  #bo_cate > ul a#bo_cate_on::after,
  .facility-cate > ul a.is-on::after{display:none !important;}

  .sec-head{margin-bottom:32rem;}
  .sec-head p{margin-top:16rem;}
}
