/* common class */
:root 
{
    --content-title: 42px;
    --alarm: 28px;
    --icon-title:20px;
    --icon-subtitle:16px;
    --main: #E76203;
    --black: #111;
    --gray:#767676;
}

.logistics_alarm 
{
	text-align:center;
	font-size: var(--alarm);
	color:var(--main);
}

.body_bottom_text_wrap 
{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap:12px 0;
	justify-content: center;
	margin: 100px 0 40px;
}

.bbt_title
{
	font-size:var(--content-title);
}

.bbt_sub_title
{
	font-size:var(--content-sub-title);
}

.body_bottom_image_wrap 
{
	width: 100%;
    display: flex;
    flex-direction: column;
    gap: 40px 0;
}

.body_bottom_image_wrap  > img
{
	width: 100%;
	height: 540px;
	object-fit:cover;
	border-radius: 30px;
}

.body_bottom_icon_wrap 
{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 1fr; /* 세로비율을 알아서 자동 조정해줌 */
    gap: 0 40px;
}

.body_bottom_icon 
{
	display: flex;
    flex-direction: column;
    padding: 40px 24px;
    border: 1px solid #e5e5ec;	
    gap: 12px 0;
    border-radius: 13px;
}

.body_bottom_icon > img 
{
	width: 36px;
	height: 36px;
	margin-bottom: 12px;
}

.body_bottom_icon h5 
{
	font-size: var(--icon-title);
    letter-spacing: -1.5;
}

.body_bottom_icon p 
{
	font-size: var(--icon-sub-title);
}

section.logistics .sub_title
{
	display: flex;
    flex-direction: column;	
    line-height:1;
}

/* 반응형 구간 */

/* 테블릿 가로 (해상도 768px ~ 1023px)*/ 
@media all and (max-width:1023px) 
{ 
	:root 
	{
	    --alarm: 20px;
	    --icon-title:20px;
	    --icon-subtitle:16px;
	}
	.content_body { gap: 40px 0 !important; }
	.bbt_sub_title { text-align: center; }
	.body_bottom_icon_wrap { grid-template-columns: repeat(2, 1fr); gap: 40px; }
	section.logistics .sub_title br { display: block!important;}
	section.logistics .sub_title span, section.logistics .sub_title { line-height:1.5;}
} 

/* 모바일 가로 & 테블릿 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px)
{
	:root 
	{
	    --content-title: 32px;
	    --content-sub-title:16px;
	    --slider-title:24px;
	    --slider-sub-title:16px;
	}

	.body_bottom_image_wrap > img { height: 280px; }
	.body_bottom_icon_wrap { grid-template-columns: repeat(1, 1fr); gap: 40px; }
}
/* 모바일 세로 (해상도 ~ 479px)*/ 
@media all and (max-width:479px) 
{   
	.sub_menu_text { letter-spacing: -1.5px; }
}