@font-face {
    font-family: 'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/JalnanGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

#spot.spot {height: 740px; background-color: #ffe7dd;}
#spot.spot .tit {margin-bottom: 20px;}
#spot.spot .bg {position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center bottom; background-size:100% auto ;}

#spot.spot .inr-c {padding-bottom: 120px;}
#spot.spot .tit {padding-top: 10px; font-family: 'yg-jalnan'; font-size: 53px;}
#spot.spot .tit em {position: relative;}
#spot.spot .tit em::after {content:""; position: absolute; left: 50%; top: -.4em; width: .2em; height: .2em; background-color: #e54459; border-radius: 50%; transform:translateX(-50%);}



#area4 {position: relative; padding: 110px 2em 2em; background-color: #fff; border-radius: 2em;}
#area4::after {content:""; position: absolute; left: 5%; top: -29px; width: 90%; height: 100px; background-image: url('/2026_04/images/delivery/botm_bg.png'); background-size: auto 100%; background-repeat: repeat-x; background-position: 0 bottom;}
#area4 .item {background-color: #fff;}
#area4 .box_float {align-items:center;}
#area4 .box_float .item:first-child {width: 45%;}
#area4 .tit_mf1 {text-align: center; font-family: 'SBAggro'; line-height: 1.5; font-weight: 300 !important;}
#area4 .tit_mf1 span {font-weight: 300;}

.boxs {position: relative; padding: 4em 2em 2.5em; background-color: #fff; border: 1px dashed #5e524a; border-radius: 1em;}
.boxs .tit {z-index: 1; position: absolute; left: 50%; top: -2em; padding: 1em 2.5em .5em; transform:translateX(-50%); border: 3px solid #5e524a; border-radius: 3em; background-color: #fff;}
.boxs .tit .tit_mf1 {padding: 0 !important; margin: 0 !important; line-height: 1; white-space:nowrap;}
.boxs .tit .tit_mf1 span {margin-right: .3em; font-size: 1.8em; letter-spacing:-0.075em; color: #5e524a;}
.boxs .tit .tit_mf1 em {font-weight: 300;}
.boxs .box_float {position: relative;}
.boxs .ico {position: absolute;}


.desc_mf1.pl {padding-left: .5em;}


.icon.icon1 {position: absolute; left: 47%; bottom: -2.5em; width: 150px;}
.icon.icon2 {position: absolute; bottom: -2.5em;}
.icon.icon3 {position: absolute; bottom: 0; left: 87%; width: 300px;}

@media all and (max-width:798px){ 
	#spot.spot {height: auto; }
	#spot.spot .inr-c {padding-bottom: 50px; padding-top: 50px;}
	#spot.spot p.t1 {margin-bottom: .5em !important; font-size: 1em !important; margin-bottom: 0;}
	#spot.spot .tit {letter-spacing:-0.0325em; font-size: 26px; margin-bottom: 15px; padding-top: 0;}

	#spot.spot .inr-c img {max-width:110px;}

	.boxs {padding: 3em 1em 1em;}
	.boxs .tit {padding: .5em 1.5em .2em; text-align: center;}
	.boxs .tit .tit_mf1 span {font-size: 1em;}
	.boxs .tit .tit_mf1 em {font-size: .7em; display: block; margin-top: .1em;}

	.desc_mf1.pl {padding-left: 0;}

	.warm2_wrap {padding-top: 50px;}

	#area4 {padding-top: 60px; padding-left: 1em; padding-right: 1em;}
	#area4::after {height: 55px; top: -14px;}
	#area4 .tit_mf1 {font-size: 1em; line-height: 1.4;}


	#area4 .box_float .item:first-child {width: auto;}


	.icon.icon1 {position: static; width: 80px; margin-bottom: -2em;}
	.icon.icon2 {position: static; margin-bottom: -2em;}
	.icon.icon3 {left: 100%; margin-left: -30px; width: 150px;}
}