﻿@charset "utf-8";


/* 헤드 */
#head{position:fixed; border-bottom:1px solid rgba(255,255,255,0.2);}
#head::after{display:none;}
#head .head_box h1.logo_box a.logo{background-image:url("/data/builder/logo_funeral_w.png");}
#head .head_box h1.logo_box a.new_home{color:#fff; border:1px solid #fff;}

#menu_navi > .menu_area > ul > li > a span{color:#fff;}


/* 비주얼 */
.mvisual{position:relative;width:100%;height:770px;margin:0 auto;overflow: hidden;}
/*.mvisual:before{content:'';position:absolute;width:100%;height:100%;background: linear-gradient(180deg, rgb(0 0 0 / 10%), transparent, transparent, transparent);z-index: 2;}*/
.mvisual .swiper-slide img{width: 100%;height: 100%;object-fit: cover;}
.mvisual .swiper-slide .mcont_txt{position:absolute;left:50%;top:151px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;max-width:1280px;height:380px;padding:0 2vw;transform:translateX(-50%);text-align:center;}
.mvisual .swiper-slide .mcont_txt .msub_tit{color:#fff; font-weight:800; line-height: 1.3; font-size:5.4rem;}
.mvisual .swiper-slide .mcont_txt .btxt{color:#fff;font-size:2.1rem;}

.mvisual .control{position:absolute;left:50%;top:50%;width:1280px; transform:translate(-50%, -50%);z-index:3;}
.mvisual .control .pop_swiper-button-prev,
.mvisual .control .pop_swiper-button-next{position: absolute;left:0;top:50%; transform:translateY(-50%);cursor:pointer;z-index:1;}
.mvisual .control .pop_swiper-button-next{left:auto;right:0;}
.mvisual .control .pop_swiper-button-prev::before,
.mvisual .control .pop_swiper-button-next::before{content:""; opacity:.5; display:block;width:53px;height:26px;background-image:url("/nanum/site/builder/main/funeral/img/slide_arrow.png");background-size:100% auto;background-repeat: no-repeat;}
.mvisual .control .pop_swiper-button-prev::before{transform:rotate(180deg);}

/**/
.mvisual .swiper-slide-active .mcont_txt .btxt{-webkit-animation:text-active-animation 0.5s ease-in-out both;animation:text-active-animation 0.5s ease-in-out both;-webkit-animation-delay:0.5s;animation-delay:0.5s;}
.mvisual .swiper-slide-active .mcont_txt .msub_tit{-webkit-animation:text-active-animation 0.5s ease-in-out both;animation:text-active-animation 0.5s ease-in-out both;-webkit-animation-delay:1s;animation-delay:1s;}
@keyframes text-active-animation{
	from{
		opacity:0;
		transform: translateY(50px); 
		filter:Alpha(opacity=0);
		-webkit-transform: translateY(50px); 
	}
	to{
		opacity:1;
		transform: translateY(0); 
		filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
	}
}


/* 퀵메뉴 */
.quick_menu{position:absolute;left:50%;bottom:55px;width:1280px;margin:0 auto;padding:0 2vw;transform:translateX(-50%);box-sizing:border-box;z-index:1;}
.quick_menu ul{display:flex; align-items:flex-end;}
.quick_menu ul li{position:relative;display:flex;align-items:end;justify-content:center;width:25%;box-sizing:border-box;}
.quick_menu ul li:nth-child(n+2)::before{content:"";position:absolute;left:0;bottom:0;width:1px;height:100%;background:rgba(255,255,255,0.15);}
.quick_menu ul li a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:25px;color:#fff;font-size:1.9rem;font-weight:600;transition:.3s;}
.quick_menu ul li a::before{content:"";display:block;width:115px;height:115px;border-radius:30px;backdrop-filter:blur(5px);background-color:rgba(255,255,255,0.1);background-size: 100% auto;background-repeat: no-repeat;}
.quick_menu ul li.icon01 a::before{background-image: url("/nanum/site/builder/main/funeral/img/quick_icon01.png");}
.quick_menu ul li.icon02 a::before{background-image: url("/nanum/site/builder/main/funeral/img/quick_icon02.png");}
.quick_menu ul li.icon03 a::before{background-image: url("/nanum/site/builder/main/funeral/img/quick_icon03.png");}
.quick_menu ul li.icon04 a::before{background-image: url("/nanum/site/builder/main/funeral/img/quick_icon04.png");}


/* 빈소이용현황 */
.title{margin-bottom:50px; text-align:center; font-size:3.5rem; font-weight:700;}

.msection1{position:relative; min-height:500px; padding:100px 0; background:#f5f5f7 url("/nanum/site/builder/main/funeral/img/funeral_parlorbg.png") no-repeat center bottom / 100% auto; overflow:hidden;}
.msection1::before, .msection1::after{content: ""; position: absolute; bottom:0; background-size: 100%; background-repeat: no-repeat;}
.msection1::before{bottom:-130px; left:-80px; width:366px; height:346px; background-image: url("/nanum/site/builder/main/funeral/img/parlor_bg01.png"); background-position:bottom left;}
.msection1::after{right:-160px; bottom:80px; width:468px; height:502px; background-image: url("/nanum/site/builder/main/funeral/img/parlor_bg02.png"); background-position:bottom right;}
.msection1 h1.title{position:relative; text-align:center; font-family: 'GowunBatang'; font-size:3rem; color:#888; font-weight:normal;}
.msection1 h1.title::before{content: ""; display: block; width:44px; height:64px; margin:0 auto 20px auto; background-image: url("/nanum/site/builder/main/funeral/img/mortuary_tit.png"); background-size: cover; background-repeat: no-repeat; background-position: center;}

.msection1 .mortuary{position:relative; width:100%; max-width:1280px; margin:50px auto 0 auto; z-index:1;}
.msection1 .mortuary .tit_txt{font-size:3.6rem; font-weight:700;}

.msection1 .mortuary .mortuary_box{display:flex; gap:30px; margin-top:30px;}
.msection1 .mortuary .mortuary_box dl{width:calc(33.333% - 17px); padding:35px 30px; border-radius:20px; background: #fff; box-shadow: 0 0 15px rgba(0,0,0,0.05); box-sizing:border-box;}
.msection1 .mortuary .mortuary_box dl dt{text-align:center; border-bottom:1px dashed #ddd;}
.msection1 .mortuary .mortuary_box dl dt .room_tit{padding:13px 20px; font-size:2rem; color:#fff; font-weight:700; border-radius:10px; background: #343465;}
.msection1 .mortuary .mortuary_box dl dt .name{padding:20px 0; font-size:2.5rem; font-weight:700;}
.msection1 .mortuary .mortuary_box dl dd{padding:30px 0 0 0;}
.msection1 .mortuary .mortuary_box dl dd ul li{display:flex; gap:10px;}
.msection1 .mortuary .mortuary_box dl dd ul li:nth-child(n+2){margin-top:15px;}
.msection1 .mortuary .mortuary_box dl dd ul li .tit{display:flex; align-items:center; justify-content:center; min-width:90px; min-height:35px; font-size:1.5rem; font-weight:700; border-radius:5px; background: #ddd;}
.msection1 .mortuary .mortuary_box dl dd ul li .txt{font-size:1.7rem; align-self:center;}

.msection1 .mortuary .plus_btn{position: absolute; right:0; top:0;}
.msection1 .mortuary .plus_btn a{display:flex; align-items:center; gap:15px; padding:13px 20px; font-weight:700; font-size:1.6rem; color:#fff; border-radius:50px; background: #000;}
.msection1 .mortuary .plus_btn a::after{content:""; display: block; width:8px; height:13px; background: url("/nanum/site/builder/main/funeral/img/arrow.png") no-repeat center / 100% auto;}



/******************** 메인 스크롤 ********************/
@media all and (max-width:1280px){

	.main{min-width:1280px; overflow-x:scroll;}

}

/********************태블릿********************/
@media all and (max-width:1024px){
	
	/* 헤드 */
	.viewAllMenu > button span{background:#fff;}
	.viewAllMenu > button::after{filter:invert(100%) sepia(0%) saturate(7500%) hue-rotate(182deg) brightness(100%) contrast(105%);}
	.viewAllMenu.on > button::after{filter:none;}
	
	/* 메인비주얼 */
	.main{min-width:auto; overflow-x:auto;}
	
	.mvisual .swiper-slide .mcont_txt .btxt{font-size:1.8rem;}
	.mvisual .swiper-slide .mcont_txt .msub_tit{font-size:5rem;}
	
	.mvisual .control{width:95%;}
	.mvisual .control .pop_swiper-button-prev::before, .mvisual .control .pop_swiper-button-next::before{width:43px; height: 20px;}
		
	.quick_menu{width:100%; padding:0;}
	
	/* 빈소이용현황 */
	.msection1 h1.title{padding:0 2vh;}
	.msection1 .mortuary{width:auto; margin:50px 2vw 0 2vw;}
	.msection1 .mortuary .mortuary_box{flex-direction:column;}
	.msection1 .mortuary .mortuary_box dl{width:100%;}


	
	br.none{display:none;}
	
	
	
}
/********************모바일********************/
@media all and (max-width:767px){

	/* 메인비주얼 */
	.mvisual{height: 500px;}
	.mvisual .swiper-slide .mcont_txt{top:0; height: 430px;}
	.mvisual .control{display:none;}
	
	.quick_menu{bottom:30px;}
	.quick_menu ul{flex-wrap:wrap; gap:30px 0;}
	.quick_menu ul li a{gap:15px 0;}
	.quick_menu ul li a::before{width:85px; height: 85px;}
	
	/* 빈소이용현황 */
	.msection1 h1.title{font-size:2.5rem;}
	.msection1 h1.title::before{margin:0 auto 20px auto;}
	
	.msection1{padding:50px 0;}
	.msection1::before{width:218px; height:100%;}
	.msection1::after{width:277px; height:100%;}
	
	.msection1 .mortuary .mortuary_box{gap:20px 0;}
	.msection1 .mortuary .mortuary_box dl{padding:30px 25px;}
	
}

/********************모바일********************/
@media all and (max-width:480px){
	
	.title .tit_txt{font-size:2.5rem;}
	.mvisual .swiper-slide .mcont_txt{height: 320px;}
	
	.slide_mortuary .swiper-button{width:32px; height:32px; background-size: 14px auto;}
	
	.quick_menu ul{gap:20px 0; padding:0 8vw;}
	.quick_menu ul li{width:50%;}
	.quick_menu ul li:nth-child(n+2)::before{display:none;}
	.quick_menu ul li a{gap:10px 0;}
	.quick_menu ul li a::before{width:70px; height: 70px; border-radius:25px;}
	
}
	
/********************웹********************/
@media all and (min-width:1025px) {
	
	
	.quick_menu ul li a:hover{gap:35px 25px;}
	
	.mvisual .control .pop_swiper-button-prev:hover::before,
	.mvisual .control .pop_swiper-button-next:hover::before{opacity: 1;}
		
	.slide_mortuary .swiper-button:hover{background-color:#333; background-image:url("/nanum/site/builder/main/funeral/img/slide_btn_on.png");}
	.loction_map .location_box .lo_info .lo_info_list > ul > li a:hover{color:#fff;}
	.loction_map .location_box .lo_info .lo_info_list > ul > li a:hover::before{width:100%;}
	
	.msection3 .msection_box ul > li:hover{margin-top:-30px;}
	
	
	
}
