@charset "utf-8";
/* CSS Document */

/*btn*/
.btnCenter{text-align:center; overflow:hidden; margin:5px 0;}
.btnCenter .leftBtn{float:left;}
.btnCenter .rightBtn{float:right;}
.btnC{width:320px; text-align:center; margin:20px 0;}
.in1{width:80px; height:16px; margin:0; padding:2px 0 0 5px; border:1px solid #d3d3d3;}

/*추모실*/
.cherish{position:relative; width:98%; margin:0 0 0 8px; overflow:hidden;}
.cherish ul{width:98%; padding:0 0 25px 0px; float:left;}
.cherish ul li{float:left; margin:0 3px 18px 1px; width:97px; height:84px; background:url(/img/cherish_list_bg.gif) no-repeat;}
.cherish ul li img{max-width:97%; margin:1px 0 0 1px;}
.cherish ul li span{text-align:center; display:block; margin:5px 0 0 0;}
.cherish .cherish_con{width:301px; margin:0px 0 0 0;}
.cherish .cherish_con p{width:100%; height:210px; background:url(/img/cherish_read_bg.gif) no-repeat;}
.cherish .cherish_con img{max-width:99%; margin:1px 0 0 1px;}


/*추모실*/
.cherishIn{position:relative; width:98%; margin:0 0 0 8px; overflow:hidden;}
.cherishIn ul{width:98%; padding:0 0 0px 0px; float:left;}
.cherishIn ul li{width:98px; padding:0 0 0px 2px; float:left; text-align:center;}
.cherishIn ul li img{margin:0 0 4px 2px;}
.cherishIn ul li ul{width:auto; padding:0 2px 0px 0px; float:left; border-left:1px solid #cccccc;}
.cherishIn ul li ul li{clear:both; margin:0 0px 0 0; padding:0 2px 10px 3px; width:92px; height:84px; text-align:center;}
.cherishIn ul li ul li img{max-width:97%; margin:1px 0 0 1px;}
.cherishIn ul li ul li span{text-align:center; display:block; margin:5px 0 0 0;}
.cherishIn .cherish_con{width:301px; margin:0px 0 0 0;}
.cherishIn .cherish_con p{width:100%; height:210px; background:url(/img/cherish_read_bg.gif) no-repeat;}
.cherishIn .cherish_con img{max-width:99%; margin:1px 0 0 1px;}
.cherishIn .bno{border:none;}




/*상담*/
.consults{margin:33px 0 0 28px; overflow:hidden;}
/*문자상담*/
.message{width:296px; margin:0 0 0 10px; padding:0 0 12px 0; border:2px solid #dedede; overflow:hidden;}
.message h3{text-align:center; margin:3px 0;}
.message_con{width:262px; height:188px; margin:0 auto 12px auto; border:1px solid #d0d0d0; overflow:hidden;}
.message_con .mcc{border:1px solid #fff; margin:0 0 12px 0; background:#f3f2f2; width:260px; height:190px;}
.message_con .mcc p{ padding:14px;}
.message_con .mcc textarea{}
.message dl{position:relative; margin:0 0 0 21px; overflow:hidden;}
.message dt{float:left; position:relative; top:2px; width:52px;}
.message dd{float:left;}
.message dd input{width:36px; height:18px; padding:2px 0 0 5px; border:1px solid #d3d3d3;}
.message dd select{width:60px; height:20px; border:1px solid #d3d3d3; vertical-align:top;}
.message .mBtn{border:none 0;}

/*하늘문자*/
.letter{}
.time{color:#999; font-size:14px; margin:10px 0 0 0; font-weight:bold;}
.letterGo{position:relative; background:url(/img/letter_icon.jpg) no-repeat 21px 8px #dedede; padding:0 0 2px 0;}
.letterGo textarea{width:200px; height:16px; padding:2px 0 0 5px; border:1px solid #b1b1b1; margin:4px 5px 0 45px;}
.letterGo input{position:relative; top:5px;}
.letter_del{position:absolute; top:10px; right:14px;}
/* 하늘톡 말풍선 - CSS only (참고: 점선 꼬리 오른쪽 아래), 색상별 (녹색/주황/파랑) */
.letter-card{position:relative; margin:0 0 5px 10px; padding-bottom:24px; filter:drop-shadow(0 1px 4px var(--letter-shadow));}
.letter-card .letter-bubble{position:relative; background-color:#fff; border:2px dotted var(--letter-color); border-radius:16px; padding:12px 14px 16px 40px; margin:0 20px; max-width:400px; min-height:50px; word-wrap:break-word; background-repeat:no-repeat; background-position:10px 10px; background-size:22px 24px;}
.letter-card .letter-bubble .letter-content{position:relative;}
.letter-card .letter-bubble::before{content:''; position:absolute; bottom:-10px; right:33px; width:15px; height:15px; background:#fff; border-right:2px dotted var(--letter-color); border-bottom:2px dotted var(--letter-color); transform:rotate(45deg); z-index:1; pointer-events:none;}
.letter-card .letter-bubble::after{content:''; position:absolute; bottom:0; right:18px; width:20px; height:4px; background:#fff; z-index:2; pointer-events:none;}
.letter-card.letterG{--letter-color:#629341; --letter-shadow:rgba(98,147,65,0.35);}
.letter-card.letterG .letter-bubble{background-image:url(/img/letter_g_img.jpg);}
.letter-card.letterO{--letter-color:#f08b48; --letter-shadow:rgba(240,139,72,0.35);}
.letter-card.letterO .letter-bubble{background-image:url(/img/letter_o_img.jpg);}
.letter-card.letterB{--letter-color:#28599f; --letter-shadow:rgba(40,89,159,0.35);}
.letter-card.letterB .letter-bubble{background-image:url(/img/letter_b_img.jpg);}

/* letter card rise: opacity 0→1, translateY 크게 / letter-bubble 회전 3deg (홀 -3deg→0, 짝 3deg→0) */
.letter-card{opacity:0; transform:translateY(32px);}
.letter-card.letter-card-visible{animation:letterCardRise 0.45s ease-out forwards;}
.letter-card .letter-bubble{transform-origin:50% 100%;}
.letter-card.letter-card-visible .letter-bubble{animation:letterBubbleRotate 0.45s ease-out forwards;}
.letter-card.letter-card-visible .letter-bubble.letter-bubble-tilt-right{animation:letterBubbleRotateRight 0.45s ease-out forwards;}
@keyframes letterCardRise{from{opacity:0; transform:translateY(32px);}to{opacity:1; transform:translateY(0);}}
@keyframes letterBubbleRotate{from{transform:rotate(-3deg);}to{transform:rotate(0deg);}}
@keyframes letterBubbleRotateRight{from{transform:rotate(3deg);}to{transform:rotate(0deg);}}

/* 하늘톡 무한스크롤 sentinel */
.letter-load-more-sentinel{width:100%; min-height:20px;}
.letter-load-more-label{display:block; text-align:center; padding:12px 0; color:#888; font-size:14px;}

/* 하늘톡 Top / 쓰기 FAB + 레이어 팝업 */
@keyframes letterFabFloat{0%, 100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
.letter-top-fab,.letter-write-fab{position:fixed; right:20px; z-index:100; width:51px; height:51px; border-radius:50%; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,0.2); display:flex; align-items:center; justify-content:center; padding:0; font-size:24px; line-height:1; opacity:0.8;}
.letter-top-fab{bottom:87px; border:none; background:#dbdcdd; color:#333;}
.letter-write-fab{bottom:24px; border:2px solid #5a8a3a; background:#629341; color:#fff; animation:letterFabFloat 2s ease-in-out infinite;}
.letter-top-fab:active,.letter-write-fab:active{opacity:0.9; animation:none;}
.letter-write-layer{position:fixed; left:0; top:0; right:0; bottom:0; z-index:200; background:rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center; padding:20px; box-sizing:border-box; min-height:100vh; width:100%;}
.letter-write-popup{position:relative; background:#fff; border-radius:12px; padding:41px 20px 20px 20px; width:90%; max-width:360px; box-shadow:0 8px 32px rgba(0,0,0,0.2), 0 2px 8px rgba(0,0,0,0.1); margin:auto; box-sizing:border-box; max-height:90vh; overflow-y:auto;}
.letter-write-close{position:absolute; top:5px; right:5px; z-index:1; width:32px; height:32px; padding:0; border:none; background:none; font-size:24px; line-height:1; color:#666; cursor:pointer;}
.letter-write-close:hover,.letter-write-close:active{color:#333;}
.letter-write-layer .letterGo{background:none; padding:0;}
.letter-write-layer .letter-write-textarea{width:100%; height:176px; margin:0; padding:8px; border:1px solid #b1b1b1; box-sizing:border-box;}

/*안치단사진*/
.enshrine{}
.enshrine .top{width:300px; margin:0 0 7px 10px; padding:5px 0 5px 0; border-top:1px solid #dddddd; border-bottom:1px solid #dddddd; overflow:hidden;}
.enshrine .top dl{float:left;}
.enshrine .top dt{float:left; width:45px; position:relative; top:3px;}
.enshrine .top dd{float:left; position:relative;}
.enshrine .top .in1{width:80px; height:16px; margin:0; padding:2px 0 0 5px; border:1px solid #d3d3d3; position:absolute; top:0px; left:0px;}
.enshrine .top .searchBtn{margin: 0 0 0 92px;}
.enshrine .top .askBtn{ float:right;}

.enshrineRead{width:296px; margin:0 0 10px 10px; padding:0 0 12px 0; border:2px solid #dedede; overflow:hidden;}
.enshrineRead dl{float:left; width:175px; margin:14px 0 0 16px; line-height:160%;}
.enshrineRead dt{font-size:14px; font-weight:bold;}
.enshrineRead dd{}
.enshrineRead p{width:262px; margin:10px 0 0 16px;}
.enshrineRead p img{max-width:100%;}


.box{overflow:hidden; position:relative;}
.box ul{width:320px;}
.box ul li a{display:block; float:left; cursor:pointer;}
.box ul li {float:left; border:2px solid #dedede; margin:0 0 10px 10px; padding:4px 6px; width:284px; position:relative;}
.box ul li p{float:left; width:92px;}
.box ul li p img{max-width:92px; height:56px;}
.box ul li dl{float:left; width:175px; margin:5px 0 0px 13px;}
.box ul li dt{font-size:14px; font-weight:bold; margin:0 0 5px 0;}
.box ul li dd{}


/*faq*/
.faq{width:300px; margin:0 0 0 10px; _height:300px; min-height:300px;}
.faq dl{}
.faq dt{border-bottom:1px solid #b2b2b2; padding:7px 10px 7px 26px; color:#1b1b1b; background:url(/img/faq_icon.gif) no-repeat 6px 9px;}
.faq dd{border-bottom:1px solid #b2b2b2; padding:7px 20px 7px 20px; background:#f8f8f8;}
.faq dt span{ float:right;}
.faq a{color:#1b1b1b;}
.faq a:hover{color:#1b1b1b;}
.faq a:visited{color:#1b1b1b;}
/*공지탑*/
.faq .notify{border-top:1px solid #559735;}
.faq .notify dt{color:#34670b; background:url(/img/notify_icon.gif) no-repeat 6px 9px #f0f5df;}
.faq .notify dd{ text-align:justify;}
.faq .notify a{color:#34670b;}
.faq .notify a:hover{color:#34670b;}
.faq .notify a:visited{color:#34670b;}
/*글쓰기*/
.faqWrite{width:300px; margin:0 0 0 10px; border-top:1px solid #dddddd;}
.faqWrite dl{overflow:hidden; border-bottom:1px solid #dddddd; padding:6px 0;}
.faqWrite dt{float:left; width:39px; font-weight:bold; padding:0 0 0 7px;}
.faqWrite dd{float:left;}
.faqWrite dd textarea{width:240px; height:199px; border:1px solid #d3d3d3; padding:2px 0 0 4px;}


/*셔틀버스*/
.bus{}
.bus h4{margin:20px 0 7px 10px;}
.bus h3{background:url(/img/b_icon.gif) no-repeat left; padding:0 0 0 18px; margin:0 0 0 10px;}
.bus .box{border:2px solid #dedede; margin:0 0 10px 10px; padding:0px; width:294px;}
.bus .box strong{font-size:14px; margin:13px 0 13px 15px; display:block;}
.bus .box strong span{color:#f55c00;}
.bus ul{margin:12px 0 0 20px; width:295px;}
.bus ul li{}
.ml10{margin-left:10px;}
.tableBlue{width:300px; margin:0 0 0 10px;}
.tableBlue th{background:#dfebf5; color:#0b4e90; font-weight:normal; border:1px solid #dedede; padding:3px 0;}
.tableBlue td{text-align:center; border:1px solid #dedede; padding:3px 0;}

.tableGreen{width:300px; margin:0 0 0 10px;}
.tableGreen th{background:#f0f5df; color:#34670b; font-weight:normal; border:1px solid #dedede; padding:3px 0;}
.tableGreen td{text-align:center; border:1px solid #dedede; padding:3px 0;}


.n01{z-index:500px; position:absolute; top:0px; left:0px;}


/*10가지 특징*/
.feature .box ul li p{float:left; width:92px; z-index:1;}
.feature_con{position:relative;}
.feature_con{width:296px; margin:0 0 10px 10px; padding:0 0 12px 0; border:2px solid #dedede; overflow:hidden;}
.feature_con dl{float:left; width:262px; margin:14px 0 0 16px; line-height:160%;}
.feature_con dt{font-size:14px; font-weight:bold; text-align:center; margin:0 0 7px 0;}
.feature_con dd{font-weight:bold; text-align:center; letter-spacing:-1px; margin:0 0 7px 0;}
.feature_con p{width:262px; margin:0px 0 7px 16px; text-align:justify;}
.feature_con p img{max-width:100%;}
.feature .btnCenter{width:300px; margin:0 0 0 10px;}

.map{margin:0 0 0 10px;}
.map h3{background:url(/img/b_icon.gif) no-repeat left; padding:0 0 0 18px; margin:20px 0 0 0;}
.map ol{list-style:decimal; margin:0 0 0 40px}
.map ol li{}

.tour{width:94%; height:439px; margin:0 0 7px 10px; padding:5px 0 5px 0; border:1px solid #999; overflow-x:scroll; overflow-y:scroll; position:relative; cursor:pointer;}
.tour p img{position:relative; left:-238px;}
.tourIn{margin:0 0 0 8px; padding:0;}
.tourIn img{border:1px solid #999;}
.tourp{margin:10px 0 7px 10px;}


/*오시는길*/
.map .box{border:2px solid #dedede; margin:0 0 10px 1px; padding:0px; width:294px;}
.map .box strong{font-size:14px; margin:13px 0 13px 15px; display:block;}
.map .box strong span{color:#3785cd}



.to_list {margin-top:20px;}
.part_img {display:none; position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; background:rgba(0,0,0,0.8);}
.pop_wrap {position:absolute; top:20%; width:100%; max-width:640px; text-align:center;}
.pop_wrap .close_btn {position:absolute; top:-29px; right:0;}
.pop_wrap .detail_p img {width:100%; max-width:640px;}
.pop_wrap .detail_p .text_p {position:absolute; width:100%; padding:15px 0; bottom:0;background:rgba(0,0,0,0.6); text-align:center; color:#fff; font-size:18px; font-weight:700;}
.pop_wrap .detail_p .text_p span {display:block; font-size:13px;}

.tour_bi {width:100%; height:100%;  max-width:640px; margin:0 auto; overflow:hidden; padding:20px;}
.tour_bi img {width:600px;}