@charset "utf-8";

.p16-wrap {display:flex; flex-direction:column; min-height:100%; background:var(--snow);}

/* 헤더 */
.p16-head {display:flex; align-items:center; gap:18.5px; padding:22.2px 29.5px; background:var(--navy);}
.p16-head .ic {display:flex; align-items:center; justify-content:center; width:66.5px; height:66.5px; background:rgba(255,255,255,0.12); border-radius:18.5px;}
.p16-head .ic img {width:36.9px; height:36.9px;}
.p16-head h1 {flex:1; color:#fff; font-size:31.4px; font-weight:700;}

/* 지도 (구글 지도) */
.p16-map {position:relative; height:443px; overflow:hidden; background:#E8F4F0;}
.p16-map iframe {width:100%; height:100%; border:0; display:block;}
.p16-map .openbtn {position:absolute; bottom:22.2px; left:22.2px; z-index:2; display:flex; align-items:center; gap:9.2px; padding:12.9px 25.8px; background:var(--navy); border-radius:36.9px; color:#fff; font-size:20.3px; font-weight:700; box-shadow:0 4px 14px rgba(0,0,0,0.3);}
.p16-map .openbtn img {width:24px; height:24px; filter:brightness(0) invert(1);}

/* 본문 */
.p16-body {flex:1; display:flex; flex-direction:column; padding:25.8px 29.5px; gap:22.2px;}

/* 교회 정보 카드 */
.p16-info {background:var(--card); border:1.85px solid var(--line); border-radius:29.5px; overflow:hidden;}
.p16-info .top {display:flex; align-items:center; gap:22.2px; padding:25.8px 29.5px;}
.p16-info .top .ic {display:flex; align-items:center; justify-content:center; width:81.2px; height:81.2px; background:var(--mint); border-radius:22.2px; flex:none;}
.p16-info .top .ic img {width:40.6px; height:40.6px;}
.p16-info .top .tx {flex:1; min-width:0; display:flex; flex-direction:column; gap:3.7px;}
.p16-info .top .tx .nm {color:var(--ink); font-size:27.7px; font-weight:800;}
.p16-info .top .tx .ad {color:var(--body); font-size:24px;}
.p16-info .top .tx .sub {color:var(--sub); font-size:20.3px;}
.p16-info .acts {display:flex; border-top:1.85px solid var(--line);}
.p16-info .acts button {flex:1; display:flex; flex-direction:column; align-items:center; gap:7.4px; padding:20.3px; font-size:20.3px; font-weight:600;}
.p16-info .acts button + button {border-left:1.85px solid var(--line);}
.p16-info .acts button img {width:33.2px; height:33.2px;}
.p16-info .acts .a-route {color:var(--teal);}
.p16-info .acts .a-copy {color:#2563EB;}
.p16-info .acts .a-share {color:#7C3AED;}

/* 섹션 제목 */
.p16-h {display:flex; align-items:center; gap:14.8px; margin-bottom:3px;}
.p16-h .bar {flex:none; width:5.5px; height:33px; border-radius:3.7px; background:linear-gradient(180deg, #0F766E, #1E3A5F);}
.p16-h h2 {color:var(--ink); font-size:27.7px; font-weight:700;}

/* 교통편 탭 */
.p16-ttabs {display:flex; gap:14.8px;}
.p16-ttab {flex:1; display:flex; flex-direction:column; align-items:center; gap:9.2px; padding:20.3px; background:var(--snow); border:1.85px solid var(--line); border-radius:18.5px; color:var(--body); font-size:20.3px; font-weight:600;}
.p16-ttab img {width:36.9px; height:36.9px;}
.p16-ttab.on {background:#EEF2FF; border-color:var(--navy); color:var(--navy);}

/* 교통 카드 (지하철/버스) */
.p16-tcard {background:var(--card); border:1.85px solid var(--line); border-radius:29.5px; overflow:hidden;}
.p16-trow {display:flex; align-items:flex-start; gap:22.2px; padding:24px 29.5px;}
.p16-trow + .p16-trow {border-top:1.85px solid var(--line);}
.p16-linebadge {flex:none; padding:7.4px 18.5px; border-radius:36.9px; color:#fff; font-size:20.3px; font-weight:800;}
.lb-2 {background:#00A84D;}
.lb-bd {background:#FABE00;}
.p16-tinfo {flex:1; min-width:0; display:flex; flex-direction:column; gap:5.5px;}
.p16-tinfo .st {color:var(--ink); font-size:25.8px; font-weight:700;}
.p16-tinfo .ex {color:var(--body); font-size:22.2px;}
.p16-tinfo .wk {display:flex; align-items:center; gap:9.2px; color:var(--teal); font-size:22.2px; font-weight:600;}
.p16-tinfo .wk img {width:25.8px; height:25.8px;}
.p16-tmin {flex:none; display:flex; flex-direction:column; align-items:center;}
.p16-tmin b {color:var(--navy); font-size:33.2px; font-weight:800;}
.p16-tmin span {color:var(--sub); font-size:18.5px;}
.p16-walkbox {background:var(--snow); border-top:1.85px solid var(--line); padding:20.3px 25.8px; display:flex; flex-direction:column; gap:14.8px;}
.p16-walkbox .lab {display:flex; align-items:center; gap:9.2px; color:var(--body); font-size:20.3px; font-weight:700;}
.p16-walkbox .lab img {width:22.2px; height:22.2px;}
.p16-steps {display:flex; align-items:flex-start; gap:5.5px; overflow-x:auto; -ms-overflow-style:none; scrollbar-width:none;}
.p16-steps::-webkit-scrollbar {display:none;}
.p16-step {flex:none; display:flex; flex-direction:column; align-items:center; gap:5.5px; min-width:96px;}
.p16-step .c {display:flex; align-items:center; justify-content:center; width:51.7px; height:51.7px; border-radius:50%;}
.p16-step .c img {width:25.8px; height:25.8px;}
.p16-step .t {color:var(--body); font-size:18.5px; font-weight:600; text-align:center; line-height:1.3;}
.c-green {background:#00A84D;}
.c-orange {background:#D97706;}
.c-teal {background:#0D9488;}
.p16-steps .arr {flex:none; align-self:center; color:var(--sub); font-size:22.2px; padding-top:18px;}

/* 버스 정류장 */
.p16-busstop {display:flex; align-items:center; gap:18.5px; padding:22.2px 29.5px; border-bottom:1.85px solid var(--line);}
.p16-busstop .ic {display:flex; align-items:center; justify-content:center; width:66.5px; height:66.5px; background:#F0FDF4; border-radius:18.5px; flex:none;}
.p16-busstop .ic img {width:33.2px; height:33.2px;}
.p16-busstop .tx {display:flex; flex-direction:column; gap:1.85px;}
.p16-busstop .tx .nm {color:var(--ink); font-size:24px; font-weight:700;}
.p16-busstop .tx .de {color:var(--sub); font-size:20.3px;}
.p16-buslist {display:flex; flex-wrap:wrap; gap:11.1px; padding:22.2px 29.5px;}
.p16-bus {padding:9.2px 22.2px; border-radius:36.9px; font-size:22.2px; font-weight:700;}
.bus-main {background:#EFF6FF; color:#2563EB;}
.bus-local {background:#F0FDF4; color:#16A34A;}
.bus-wide {background:#FEF2F2; color:#DC2626;}

/* 자가용 */
.p16-carrow {display:flex; align-items:center; gap:18.5px; padding:24px 29.5px;}
.p16-carrow + .p16-carrow {border-top:1.85px solid var(--line);}
.p16-carrow .ic {display:flex; align-items:center; justify-content:center; width:66.5px; height:66.5px; background:var(--mint); border-radius:18.5px; flex:none;}
.p16-carrow .ic img {width:33.2px; height:33.2px;}
.p16-carrow .tx {flex:1; display:flex; flex-direction:column; gap:3.7px;}
.p16-carrow .tx .nm {color:var(--ink); font-size:24px; font-weight:700;}
.p16-carrow .tx .tm {color:var(--body); font-size:20.3px;}

/* 주차 */
.p16-park {display:flex; align-items:center; gap:18.5px; padding:24px 29.5px;}
.p16-park + .p16-park {border-top:1.85px solid var(--line);}
.p16-park .ic {display:flex; align-items:center; justify-content:center; width:66.5px; height:66.5px; background:var(--snow); border-radius:18.5px; flex:none;}
.p16-park .ic img {width:33.2px; height:33.2px;}
.p16-park .tx {flex:1; min-width:0; display:flex; flex-direction:column; gap:3.7px;}
.p16-park .tx .nm {color:var(--ink); font-size:24px; font-weight:700;}
.p16-park .tx .de {color:var(--sub); font-size:20.3px;}
.p16-pbadge {flex:none; padding:5.5px 16.6px; border-radius:36.9px; font-size:18.5px; font-weight:700;}
.pb-busy {background:var(--cream); color:#D97706;}
.pb-paid {background:var(--snow); color:var(--sub); border:1.85px solid var(--line);}
.p16-pnote {display:flex; gap:14.8px; align-items:flex-start; padding:22.2px 29.5px; background:var(--cream); border-top:1.85px solid var(--line);}
.p16-pnote img {flex:none; width:29.5px; height:29.5px;}
.p16-pnote p {color:#B45309; font-size:20.3px; line-height:1.6;}

/* 문의하기 */
.p16-contact {display:flex; flex-direction:column;}
.p16-crow {display:flex; align-items:center; gap:18.5px; padding:22.2px 29.5px;}
.p16-crow + .p16-crow {border-top:1.85px solid var(--line);}
.p16-crow .ci {display:flex; align-items:center; justify-content:center; width:66.5px; height:66.5px; border-radius:18.5px; flex:none;}
.ci-teal {background:var(--mint);}
.ci-blue {background:#EFF6FF;}
.ci-green {background:#F0FDF4;}
.p16-crow .ci img {width:31.4px; height:31.4px;}
.p16-crow .cc {flex:1; min-width:0; display:flex; flex-direction:column; gap:3.7px;}
.p16-crow .cc .k {color:var(--sub); font-size:20.3px;}
.p16-crow .cc .v {color:var(--ink); font-size:24px; font-weight:600;}
.p16-cbtn {flex:none; padding:11.1px 25.8px; border-radius:14.8px; color:#fff; font-size:20.3px; font-weight:700;}
.cbtn-teal {background:var(--teal);}
.cbtn-blue {background:#2563EB;}
.cbtn-green {background:#16A34A;}

/* 카드 래퍼 */
.p16-card {background:var(--card); border:1.85px solid var(--line); border-radius:29.5px; overflow:hidden;}
.p16-sec {display:flex; flex-direction:column; gap:14.8px;}

/* 푸터 탭바 */
.p16-nav {display:flex; align-items:center; justify-content:space-between; padding:20px 40px; background:var(--card); border-top:1.85px solid var(--line);}
.p16-nav .tab {display:flex; flex-direction:column; align-items:center; gap:5.8px; color:var(--sub); font-size:19.2px;}
.p16-nav .tab img {width:42px; height:42px;}
.p16-nav .tab.on {color:var(--teal);}
.p16-nav .tab-fab {position:relative; align-self:stretch; width:96px;}
.p16-nav .tab-fab .fab {position:absolute; left:50%; top:0; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; width:96px; height:96px; border-radius:50%; background:linear-gradient(135deg, #0D9488, #1E3A5F); border:5px solid var(--card); box-shadow:0 10px 24px rgba(13,148,136,0.4);}
.p16-nav .tab-fab .fab img {width:48px; height:48px;}
