@charset "utf-8";
.fade {
	-webkit-animation-name: fade;
	-webkit-animation-duration: 1.5s;
	animation-name: fade;
	animation-duration: 1.5s;
}

@-webkit-keyframes fade {
	from {
		opacity: .4
	}
	to {
		opacity: 1
	}
}

@keyframes fade {
	from {
		opacity: .4
	}
	to {
		opacity: 1
	}
}


/* =====↓ ページ共通 ↓===== */
.sec-title-green {
	color: #0f8264;
	border-color: #0f8264;
}

.sec-title-sub {
	font-size: 20px;
	line-height: 50px;
}

.cta-btn {
	width: 480px;
	margin: 56px auto 0;
	font-size: 26px;
	font-weight: 900;
	line-height: 61px;
	color: white;
	background: #d70f3d;
	border-radius: 11px;
}


/* =====↑ ページ共通 ↑===== */


/* =====↓ トップのリード ↓===== */

#top-lead {
	background: #0f8263;
	-webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.5);
}

#top-lead .lead-parts {
	padding: 23px 0 33px;
	text-align: center;
}

#top-lead .lead-parts .part-01 {
	display: inline-block;
	font-size: 24px;
	line-height: 36px;
	color: white;
	border-bottom: 1px dashed white;
}

#top-lead .lead-parts .part-02 {
	font-size: 42px;
	font-weight: 900;
	line-height: 82px;
	color: yellow;
}

#top-lead .lead-parts .part-03 {
	font-size: 36px;
	font-weight: 900;
	line-height: 1;
	color: white;
}


/* =====↑ トップのリード ↑===== */


/* =====↓ メインビジュアル ↓===== */

#main-visual {
	position: relative;
	margin: 5px 0 0;
	background-image: url(../img/home/main-02.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}

#main-visual .trans {
	position: absolute;
	top: 0;
	left: calc(50% - 130px);
	transform: translateX(-50%);
}

#main-visual .mv-banner {
	position: relative;
	width: 100%;
	height: 450px;
}

#main-visual .mv-banner img {
	position: absolute;
	bottom: 6px;
	right: 90px;
}


/* =====↑ メインビジュアル ↑===== */


/* =====↓ こんな食料品を配達します ↓===== */

#food-kinds {
	padding: 68px 0 78px;
	text-align: center;
}

#food-kinds .fk-list {
	display: flex;
	margin-top: 52px;
	margin-left: -20px;
	margin-right: -20px;
}

#food-kinds .fk-list .fk-item {
	width: calc(25% - 10px);
	margin: 0 20px;
}

#food-kinds .fk-list .fk-item .btn {
	width: 100%;
	margin-top: 31px;
	text-align: center;
	font-size: 24px;
	line-height: 44px;
	color: white;
	background: #0f8263;
	border-radius: 7px;
}


/* =====↑ こんな食料品を配達します ↑===== */


/* =====↓ 注文もラクラク ↓===== */

#order-guide {
	padding: 41px 39px;
	text-align: center;
	background: #fff5d7;
}


/* =====↑ 注文もラクラク ↑===== */


/* =====↓ 商品を事前確認できて安心 ↓===== */

#pre-confirm {
	margin: 41px 0 51px;
	padding: 137px 0 123px;
	text-align: center;
	background-image: url(../img/home/safe-bg.jpg);
	background-repeat: no-repeat;
	backgruond-position: center;
	background-size: cover;
}

#pre-confirm .sec-title {
	color: #0d8265;
	border-color: #0d8265;
}

#pre-confirm .txt {
	margin: 36px 0 0;
	font-size: 20px;
	line-height: 38px;
}

#food-kinds .fk-list.sp {
	display: none;
}


/* =====↑ 商品を事前確認できて安心 ↑===== */


/* =====↓ パツ ↓===== */

@media screen and ( max-width: 1200px) {
	#top-lead .lead-parts .part-01 {
		font-size: 22px;
	}

	#top-lead .lead-parts .part-02 {
		font-size: 36px;
	}

	#top-lead .lead-parts .part-03 {
		font-size: 32px;
	}

	#food-kinds .fk-list .fk-item .btn {
		margin-top: 26px;
		font-size: 22px;
		line-height: 40px;
	}
}

@media screen and ( max-width: 992px) {
	#top-lead .lead-parts .part-02 {
		font-size: 30px;
	}
	#top-lead .lead-parts .part-03 {
		font-size: 28px;
	}
	#top-lead .lead-parts {
		padding: 18px 0 18px;
	}
	#main-visual .trans {
		left: 50%;
		height: 100%;
	}
	#main-visual .mv-banner {
		height: 396px;
	}
	#main-visual .mv-banner img {
		height: 316px;
		right: -18px;
	}
	.sec-title {
		font-size: 28px;
		display: block;
	}
	#food-kinds .fk-list .fk-item .btn {
		margin-top: 20px;
		font-size: 18px;
		line-height: 1.8
	}
	.sec-title-sub {
		font-size: 18px;
	}
	.order-flow-list .order-flow-item .txt {
		font-size: 18px;
	}
	.cta-btn {
		width: 448px;
		margin-top: 38px;
		font-size: 22px;
		line-height: 2.2;
	}
	#pre-confirm .txt {
		font-size: 18px;
	}
	#pre-confirm .sec-title {
		font-size: 26px;
	}
}

@media screen and ( max-width: 768px) {
	#main-visual {
		background-image: url(../img/home/main.jpg);
	}

	#main-visual .mv-banner {
		height: 216px;
	}

	#sp-main-visual {
		margin-top: 2%;
	}

	#sp-main-visual .wrap {
		text-align: center
	}

	#food-kinds {
		padding: 6% 0;
	}

	#food-kinds .fk-list {
		margin: 0;
		margin-top: 4%;
	}

	#food-kinds .fk-list.pc {
		display: none;
	}

	#food-kinds .fk-list.sp {
		display: flex;
		text-align: center;
		align-items: center;
		width: 80%;
		margin: 0 auto;
		padding: 6% 0;
	}

	#food-kinds .fk-list.sp .slide-left,
	#food-kinds .fk-list.sp .slide-right {
		cursor: pointer;
	}
	#food-kinds .fk-list .fk-item {
		width: 60%;
		margin: 0 auto;
	}
	#food-kinds .fk-list .fk-slide {
		display: none;
		text-align: center;
	}
	#food-kinds .fk-list .fk-slide-active {
		display: block;
	}
	#food-kinds .fk-list .fk-item .btn {
		width: 90%;
		margin: 4% auto 0;
		font-size: 24px;
		line-height: 2.2;
		background: white;
		color: #0f8264;
		border: solid 2px #0f8264;
		font-weight: 700;
	}
	#order-guide {
		padding: 6% 0;
	}
	.order-flow-list {
		margin: 0 auto;
		margin-top: 2%;
		flex-wrap: wrap;
	}
	.order-flow-list .order-flow-item {
		width: 52%;
		margin: 0 auto;
		margin: 2% auto;
	}
	.order-flow-list .order-flow-item .img-wrapper::after {
		display: none;
	}
	.order-flow-list .order-flow-item .txt {
		font-size: 20px;
	}
	.cta-btn {
		width: 92%;
		margin-top: 4%;
	}
	#pre-confirm {
		margin: 4% 0;
		padding: 6% 0;
	}
	.sec-title-sub {
		width: 60%;
		margin: 0 auto;
		line-height: 1.8;
		padding-top: 2%;
	}
	.slick-dots {
		display: none !important;
	}
	.slick-list {
		width: 92%;
		margin: 0 auto;
	}
	.slick-next {
		background: url('./../img/home/right-arrow.png');
		background-position: center;
		background-size: contain;
		background-repeat: no-repeat;
	}
	.slick-prev {
		background: url('./../img/home/left-arrow.png');
		background-position: center;
		background-size: contain;
		background-repeat: no-repeat;
	}
	.slick-next:before,
	.slick-prev:before {
		content: '';
		position: unset;
		top: unset;
		display: unset;
		border: unset;
		width: unset;
		height: unset;
		transform: unset;
		-webkit-transform: unset;
		-moz-transform: unset;
		-ms-transform: unset;
		-o-transform: unset;
		color: unset;
		opacity: unset;
		font-size: unset;
		font-family: unset;
	}
	.slick-slide img {
		margin: 0 auto;
	}
	.slick-prev,
	.slick-next {
		top: 44%;
	}
}

@media screen and ( max-width: 760px) {
	#top-lead .lead-parts .part-01 {
		font-size: 20px;
		line-height: 1.8;
	}
	#top-lead .lead-parts .part-02 {
		font-size: 24px;
		line-height: 3;
	}
	#top-lead .lead-parts .part-03 {
		font-size: 22px;
		line-height: 1.8
	}
}

@media screen and ( max-width: 640px) {
	#top-lead .lead-parts .part-02 {
		font-size: 24px;
		line-height: 1.5;
		padding-top: 2%;
	}
	#top-lead .lead-parts .part-03 {
		line-height: 1.5;
	}
	#main-visual .mv-banner {
		height: 192px;
	}
	#sp-main-visual {
		margin-top: 4%;
	}
	#food-kinds {
		padding: 4% 0;
	}
	#food-kinds .fk-list .fk-item .btn {
		font-size: 22px;
	}
	.sec-title {
		font-size: 24px;
	}
}

@media screen and ( max-width: 540px) {
	.cta-btn {
		font-size: 20px;
		line-height: 2.2;
	}
	#pre-confirm .txt {
		margin-top: 4%;
		line-height: 1.5;
		 text-align: left;
		 text-shadow:0.5px 0.5px 0 #FFF, -0.5px -0.5px 0 #FFF,
              -0.5px 0.5px 0 #FFF, 0.5px -0.5px 0 #FFF,
              0px 0.5px 0 #FFF,  0-0.5px 0 #FFF,
              -0.5px 0 0 #FFF, 0.5px 0 0 #FFF;
	}
	#food-kinds .fk-list .fk-item .btn {
		font-size: 20px;
	}
}

@media screen and ( max-width: 420px) {
	#top-lead .lead-parts .part-01 {
		font-size: 18px;
	}
	#top-lead .lead-parts .part-02 {
		font-size: 22px;
	}
	#top-lead .lead-parts .part-03 {
		font-size: 20px;
	}
	#main-visual .mv-banner {
		height: 162px;
	}
	.sec-title {
		font-size: 22px;
	}
	#pre-confirm .sec-title {
		font-size: 22px;
	}
	#pre-confirm .txt {
		margin-bottom: 4%;
		font-size: 16px;
	}
	#food-kinds .fk-list .fk-item .btn {
		font-size: 18px;
	}
}


/* =====↑ パツ ↑===== */