@charset "UTF-8";

/* 원내배치도 */
.planWrap .area{ position:relative; border-radius:1rem; overflow:hidden; line-height:0;}
.planWrap .area li{ position:absolute; padding-bottom:1rem; }
.planWrap .area li.area01{ left: 36%; top: 34%;}/* 본관 */
.planWrap .area li.area02{ right: 21%; top: 41%;}/* 별관 */
.planWrap .area li.area03{ left: 46%; top: 21%;}/* 동관 */
.planWrap .area li.area04{ left: 23%; top: 14%;}/* 부산요양병원 */
.planWrap .area li.area05{ right: 24%; top: 17%; z-index: 1;}/* 재활센터 */
.planWrap .area li.area06{ right: 7%; bottom: 40%;}/* 장례식장 */
.planWrap .area li.area07{ right: 13%; top: 21%; }/* 제1주차장 */
.planWrap .area li.area08{ left: 6%; bottom: 38%; }/* 제4주차장 */
.planWrap .area li a,
.planWrap .area li span{ position:relative; display: block; padding:0 1.5rem 0.2rem; line-height:3rem; color:#fff; font-weight: 600; border-radius:2rem; background:#0f2b00; opacity: 0; transition: all 0.3s; }
.planWrap .area li span{ opacity: 1; background:rgba(0,0,0,0.75);}
.planWrap .area li:before{ content:""; position:absolute; left:calc(50% - 1rem); bottom:0; width:2rem; height:2rem; border-radius:50%; background:rgba(0,0,0,0.5) url('/images/web/busan/sub/ico_mark.png') no-repeat center bottom 2px; z-index: 1;}
.planWrap .area img{ max-width:100%; height:auto;}
.planWrap .area li:hover a,
.planWrap .area li a:focus{ opacity: 1;}
.planWrap .cont{ margin-top:2rem;}
.planWrap.activeArea .cont{ display: none;}
.planWrap.activeArea .cont.active{ display: block;}

/* 조직도 */
.org_wrap{ position:relative; margin-top:3rem;}
.org_wrap::before { content: ''; background: url(/images/web/pocenter/sub/img0104_bg1.png) no-repeat center / contain; width: 25.7rem; height: 7.95rem; display: block; position: absolute; top: 0; left: 0; z-index: -1;}
.org_wrap::after { content: ''; background: url(/images/web/pocenter/sub/img0104_bg2.png) no-repeat center / contain; width: 13.25rem; height: 13rem; display: block; position: absolute; top: 0; right: 0; z-index: -1;}
.org_wrap .std{ position:relative; min-height:3.5rem; line-height:1.3; display: flex; align-items: center; justify-content: center; margin:0 auto; padding:0.25rem 0.5rem; border-radius:0.25rem; text-align: center; font-size: 0.8rem; }

.org_wrap h2{ position:relative;}
.org_wrap h2 span{ display: flex; width:7rem; height:7rem; align-items: center; justify-content: center; line-height:1.3; color:#fff; font-size: 1.1rem; font-weight: 700; padding:1rem; border-radius:50%; border:0.5rem solid #d3decc; background:#2a6900; margin:0 auto;}
.org_wrap h3:before{ content:""; position:absolute; left:50%; top:0; height:100%; border-right:1px solid #ccc; }
.org_wrap h3 .std{ background:#2a6900; color:#fff; }
.org_wrap h4 {position:relative; padding:1.5rem 0; }
.org_wrap h4:before{ content:""; position:absolute; left:50%; top:0; height:100%; border-right:1px solid #ccc; }
.org_wrap h4 .std{ border:2px solid #2a6900; background:#fff; color:#2a6900; }

.org_wrap .inr{ display: flex; align-items: center; justify-content: space-between; max-width:30rem; margin:0 auto;}
.org_wrap .inr + .inr{ margin-top:0.5rem;}
.org_wrap .inr > div{ position:relative; width:50%; }
.org_wrap .inr > div:before{ content:""; position:absolute; top:50%; width:100%; border-top:1px solid #ccc; }
.org_wrap .inr .bg{ display: block; padding:0.25rem; border-radius:0.25rem; background: url(/images/web/busan/sub/bg_org.png);}
.org_wrap .inr .left { padding-right:1rem; margin-top:2rem;}
.org_wrap .inr .right { padding-left:1rem; text-align: right;}
.org_wrap .inr .left:before { left:0;}
.org_wrap .inr .right:before { right:0;}
.org_wrap .inr .left span{ margin-left:0;}
.org_wrap .inr .right span{ margin-right:0;}

.org_wrap .org_dep1{ position:relative; z-index: 1; padding-bottom:1.5rem;}
.org_wrap .org_dep1:before{ content:""; position:absolute; top:0; left:50%; height:100%; border-left:1px solid #ccc;}
.org_wrap .org_dep1 .inr .std{ color:#111; text-align: center; border:1px solid #444; background:#f6f6f6;}
.org_wrap .org_dep1 .inr .std.wh{ margin-top:0.25rem; color:#444; border:1px solid #ccc; background:#fff; font-size: 0.75rem;}

.org_wrap .org_dep2{ position:relative;}
.org_wrap .org_dep2:before{ content:""; position:absolute; top:0; left:calc(5% - 0.25rem); width:calc(90% + 0.5rem); border-top:1px solid #ccc;}
.org_wrap .org_dep2 > ul{ display: flex; gap: 0.5rem;}
.org_wrap .org_dep2 > ul > li{ position:relative; flex: 1; display: flex; flex-direction: column; justify-content: space-between; min-width:0px; padding-top:1.5rem; }
.org_wrap .org_dep2 > ul > li:before{ content:""; position:absolute; top:0; left:50%; height:1.5rem; border-left:1px solid #ccc;}
.org_wrap .org_dep2 > ul > li > .std{ width:100%; color:#fff; background:#215c00; z-index: 1;}

.org_wrap .org_dep3{ position:relative; flex: 1; display: flex; flex-direction: column; justify-content: space-between; border-radius: 0.5rem; background:#f8f8f8; padding:0.25rem;}
.org_wrap .org_dep3 > ul{ display: flex; flex-direction: column; gap: 0.5rem 0; }
.org_wrap .org_dep3 > ul > li{ position:relative; min-width:0px; }
.org_wrap .org_dep3 > ul > li > .std{ border:1px solid #aaa; background:#fff; font-size:0.75rem; min-height: auto; }
.org_wrap .org_dep3 > p{ text-align: center; padding:0.5rem; font-size: 0.8rem; font-weight: 600; color:#111;}

/* 첫방문고객 간편접수 */
.first_user{ margin:1rem 0 3rem; padding:2rem 2.5rem; border:3px solid #ddd; border-radius:10px;}
.first_user .guide{ padding:0.75rem 2.5rem 1.5rem;}
.first_user .top_wrap{ display: flex; align-items: end; gap: 0 2rem ;}
.first_user .top_wrap .img{ line-height:0;}
.first_user .top_wrap .inr{ flex: 1; min-width:0px; padding:1.5rem 0;}
.first_user .top_wrap .inr > h3{ font-size: 1.4rem;}
.first_user .top_wrap .inr > p{ margin-top:0.5rem; font-size:1rem; color:#000;}
.first_user .inr_box{ padding:1rem; margin-bottom:1rem; border-radius:10px; background:#fff; box-shadow:0 0 8px rgba(33, 92, 0, 0.1);}
.first_user .form{ display: flex; flex-wrap: wrap; gap: 1.5rem 2rem; margin-bottom:1.5rem; padding-bottom:1.5rem; border-bottom:1px dashed #ddd;}
.first_user .form dl{ flex:auto; width:calc(50% - 1rem); display: flex; gap: 0.25rem 0.5rem; align-items: start;}
.first_user .form dt{ line-height:2.5rem; color:#000; font-weight: 700; font-size:1rem; min-width:3.5rem;}
.first_user .form dd { flex: 1; min-width:0px;}
.first_user .form dd input{ width:100%; height:2.5rem; line-height:2.5rem;}
.first_user .form dd textarea{ width:100%; min-height:11rem; padding:0.5rem;}
.first_user .form dd input,
.first_user .form dd textarea{ border-radius:0.25rem;}
.first_user .form dd .bytes{ text-align: right; font-size:0.8rem; }
.first_user > .agree_box{ margin-top:-10px;}
.first_user > .agree_box .bold{ font-size: 0.9rem; font-weight: 600; color:#000;}
.first_user > .agree_box .bold:before{ font-weight: 400;}
.first_user > .agree_box .inr{ margin:1rem 0; border-radius:8px; padding:1.5rem; background:#f7f7f7;}
.first_user > .agree_box .check_area{ display: flex; color:#000;}
.first_user > .agree_box .check_area p{ flex: 1; min-width:0; }

/* 국가유공자 안내 감면대상자 */
.exmpt_info .tit { display: block; text-align: right; }
.exmpt_info .tit h5 { text-align: left; }
.exmpt_info .tit span { display: inline-block; }

@media (max-width: 1600px) {

     /* 조직도 */
    .org_wrap .org_dep2{ border-radius:0.5rem; border: 2px solid #eee; padding:1rem;}
    .org_wrap .org_dep2:before,
    .org_wrap .org_dep2 > ul > li:before{ display: none;}
    .org_wrap .org_dep2 > ul{ flex-wrap: wrap; }
    .org_wrap .org_dep2 > ul > li{ padding-top:0; flex: auto; width:calc(50% - 0.5rem);}
    .org_wrap .org_dep3 > ul{ flex: 1; flex-direction: row; flex-wrap: wrap; gap: 0.5rem 0.5rem; justify-content: center; align-content:start; padding:1.25rem 1rem 1rem; margin-top:-0.5rem; background:#fff; border-radius:0.25rem; }
    .org_wrap .org_dep3 > ul > li > .std{ border:none; padding:0; height:auto;}
    .org_wrap .org_dep3 > p{ font-size: 0.75rem;}

}

@media (max-width: 1024px) {

    /* 조직도 */
    .org_wrap::before { width: 20rem; height: 6.1rem; }
    .org_wrap::after { width: 10rem; height: 9rem;}

    /* 원내배치도 */
    .planWrap .area li{ padding-bottom:0.65rem; }
    .planWrap .area li a,
    .planWrap .area li span{ padding:0 1rem 0.25rem; line-height:2rem; font-size:0.75rem;}
    .planWrap .area li:before{ width:1.5rem; height:1.5rem; left:calc(50% - 0.75rem); background-size:auto 1rem;}

    /* 첫방문고객 간편접수 */
    .first_user .guide{ padding:0.75rem 1.5rem 1.5rem;}
    .first_user .top_wrap{gap: 0 1rem ;}
    .first_user .form{ gap: 0.75rem 1rem;}
}

@media (max-width: 880px) {

    /* 조직도 */
    .org_wrap::before,
    .org_wrap::after { display: none;}
}

@media (max-width: 768px) {

    /* 원내배치도 */
    .planWrap .area li.area06{ right: 3%; bottom:30%}/* 장례식장 */
    .planWrap .area li.area07{ right: 7%;}/* 제1주차장 */

    /* 첫방문고객 간편접수 */
    .first_user{ padding:1rem 1.5rem; }
    .first_user > .agree_box .inr{ padding:1rem;}
}

@media (max-width: 640px) {

    /* 원내배치도 */
    .planWrap .area li.area05{ top: 11%;}/* 재활센터 */

    /* 첫방문고객 간편접수 */
    .first_user .guide{ padding: 1.25rem 1rem;}
    .first_user .top_wrap .inr{ padding:0 0 1rem;}
    .first_user .top_wrap .img{ display: none;}
    .first_user .form dl{ width:100%;}
    .first_user > .agree_box .check_area{ gap: 0.5rem; flex-direction: column; align-items: end;} 
}

@media (max-width: 500px) {

    /* 원내배치도 */
    .planWrap .area { display: none;}
}

@media (max-width: 480px) {

    /* 원내배치도 */
    /* .planWrap .area li{ width:calc(50% - 0.15rem); } */

    /* 첫방문고객 간편접수 */
    .first_user .top_wrap .inr > h3{ font-size:1.2rem;}
    .first_user .top_wrap .inr > p,
    .first_user .form dt{ font-size:0.9rem;}
}

@media (max-width: 420px) {

    /* 원내배치도 */
    /* .planWrap .area li{ width:calc(50% - 0.15rem); } */

    .org_wrap .org_dep2{ padding:1rem 0.5rem;}
}

@media screen and (max-width: 320px){

    /* 첫방문고객 간편접수 */
    .first_user .form dl{ flex-direction: column;}
    .first_user .form dt{ line-height:1.4;}
    .first_user .form dd{ width: 100%;}
    .first_user .form dd input { height:2rem; line-height:2rem;}

}