@CHARSET "UTF-8";

.funeral_step{display:flex;flex-direction:column;}
.funeral_step > li{position:relative;display:flex;flex-direction:column;padding-bottom:60px;}
.funeral_step > li::before{content:'';position:absolute;top:0;left:calc(70px / 2);width:1px;height:100%;background:#c3c7cb;z-index:-1;}
.funeral_step > li:last-child{padding-bottom:0;}
.funeral_step > li:last-child::before{display:none;}
.funeral_step li dl{display:flex;align-items:center;gap:30px;}
.funeral_step li dl dt{display:inline-flex;justify-content:center;align-items:center;width:70px;height:70px;background:linear-gradient(to bottom,  #507da0 0%,#253a4b 100%);border-radius:100%;color:#fff;font-weight:700;}
.funeral_step li dl dd{font-size:1.9rem;font-weight:700;}
.funeral_step li .cont{padding-left:100px;}
.funeral_step li .cont > ol{display:flex;gap:60px;}
.funeral_step li .cont > ol li{position:relative;flex:1;max-width:250px;padding-top:90px;font-weight:500;text-align:center;}
.funeral_step li .cont > ol li::before,
.funeral_step li .cont > ol li::after{content:'';position:absolute;background-repeat:no-repeat;background-size:cover;}
.funeral_step li .cont > ol li::before{top:0;left:50%;width:75px;height:75px;transform:translateX(calc(-50% + 0.5px));}
.funeral_step li .cont > ol li:nth-child(n+2)::after{top:50%;left:-40px;width:20px;height:20px;background-image:url(/nanum/site/builder/skin/main/img/common/step_arr.png);transform:translateY(calc(-50% + 0.5px));}
.funeral_step li .cont > ol.step1_box li.step1::before{background-image:url(/nanum/site/builder/dir/funeral/img/menu6436/funeral_step1_icon1.png);}
.funeral_step li .cont > ol.step1_box li.step2::before{background-image:url(/nanum/site/builder/dir/funeral/img/menu6436/funeral_step1_icon2.png);}
.funeral_step li .cont > ol.step1_box li.step3::before{background-image:url(/nanum/site/builder/dir/funeral/img/menu6436/funeral_step1_icon3.png);}
.funeral_step li .cont > ol.step1_box li.step4::before{background-image:url(/nanum/site/builder/dir/funeral/img/menu6436/funeral_step1_icon4.png);}
.funeral_step li .cont > ol.step2_box li.step1::before{background-image:url(/nanum/site/builder/dir/funeral/img/menu6436/funeral_step2_icon1.png);}
.funeral_step li .cont > ol.step2_box li.step2::before{background-image:url(/nanum/site/builder/dir/funeral/img/menu6436/funeral_step2_icon2.png);}
.funeral_step li .cont > ol.step3_box li.step1::before{background-image:url(/nanum/site/builder/dir/funeral/img/menu6436/funeral_step3.png);}
.funeral_step li .cont .note_box{display:flex;gap:30px;margin-top:50px;padding:30px 40px;background:#f9f9f9;border-radius:10px;}
.funeral_step li .cont .note_box .note_title{position:relative;padding-left:30px;font-weight:700;}
.funeral_step li .cont .note_box .note_title::before{content:'';position:absolute;top:2px;;left:0;width:20px;height:20px;background:url(/nanum/site/builder/dir/funeral/img/menu6436/funeral_note_icon.png) no-repeat;background-size:cover;}


/********************태블릿********************/
@media all and (max-width:1024px){
	
.funeral_step{gap:60px;}
.funeral_step > li{gap:30px;padding-bottom:0;}
.funeral_step > li::before{display:none;}
.funeral_step li dl dt{width:50px;height:50px;font-size:1.5rem;}
.funeral_step li .cont{padding-left:0;}
.funeral_step li .cont > ol{gap:40px;}
.funeral_step li .cont > ol li{max-width:none;padding-top:64px;font-size:1.7rem;}
.funeral_step li .cont > ol li::before{width:48px;height:48px;}
.funeral_step li .cont > ol li:nth-child(n+2)::after{left:-28px;width:16px;height:16px;}
	
}

/********************모바일2********************/
@media all and (max-width:480px){
	
.funeral_step{gap:30px;}
.funeral_step > li{gap:20px;}
.funeral_step li dl{gap:20px;}
.funeral_step li .cont > ol{flex-direction:column;}
.funeral_step li .cont > ol li{padding:50px 10px 10px 10px;border:1px solid #e5e5e5;}
.funeral_step li .cont > ol li::before{top:10px;width:32px;height:32px;}
.funeral_step li .cont > ol li:nth-child(n+2)::after{top:-26px;left:50%;width:12px;height:12px;transform:translateX(calc(-50% + 0.5px)) rotate(90deg);}
.funeral_step li .cont > ol li br{display:none;}
.funeral_step li .cont .note_box{flex-direction:column;gap:15px;margin-top:30px;padding:20px;}
.funeral_step li .cont .note_box .note_title{padding-left:26px;}
.funeral_step li .cont .note_box .note_title::before{width:16px;height:16px;}
	
}