@charset "utf-8";
/* CSS Document */

body{
	color: #43454B;
	font-family: "秀英角ゴシック金", Shuei KakuGo Gin, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
img{
	max-width: 100%;
}
a, a:hover{
	text-decoration: none;
}
h2{
	line-height: 1.3em;
	font-size: 36px;
}
h3{
	font-size: 24px;
}
ul{
	list-style: none;
}
ol{
	margin: 0;
	padding: 0;
	list-style: none;
}
p{
	line-height: 1.75em;
	margin-bottom: 0;
}
table,tr,td{
	margin: 0;
	padding: 0;
	border-collapse: collapse;
}
@media screen and (min-width: 992px){
	h2{
		font-size: 40px;
	}
}
/*loading-------------------*/
.area-loading{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #FBFAF4;
	z-index: 1000;
}
/*header-------------------*/
header [class*='menu-btn']{
	position: fixed;
	top: 0;
	left: 0;
	width: 50px;
	height: 50px;
	padding: 20px 17px 19px;
	background: rgb(0,152,68);
	background: linear-gradient(315deg, rgba(13,183,155,0.9) 0%, rgba(0,152,68,0.9) 100%);
	z-index: 200;
}
header [class*='menu-btn'] > span{
	display: block;
	height: 1px;
	background-color: #ffffff;
	transition: ease 0.5s;
}
header .menu-btn_open span{
	width: 100%;
	margin-bottom: 4px;
}
header .menu-btn_close span{
	position: relative;
	width: 20px;
}
header .menu-btn_close span:nth-child(1){
	top: 4px;
	left: -2px;
	transform: rotate(45deg);
}
header .menu-btn_close span:nth-child(2){
	top: 3px;
	left: -2px;
	transform: rotate(-45deg);
}
header .menu-btn_close span:last-child{
	display: none;
}
/*menu-link-------------------*/
header .menu-link_close{
	position: fixed;
	top: 0;
	left: 0;
	opacity: 0;
	visibility: hidden;
	transition: ease 0.5s;
	z-index: 40;
}
header .menu-link_open{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding-top: 64.5px;
	padding-bottom: 42px;
	background: rgba(255,255,255,0.9);
	opacity: 1;
	visibility: visible;
	transition: ease 0.5s;
	z-index: 50;
}
header .header-rogo{
	display: none;
}
header nav .header-link{
	margin: 15px 15px 40px;
	padding-inline-start: 0;
}
header nav .header-link li{
	border-bottom: 1px solid #D7D8D9;
}
header nav .header-link a{
	display: block;
	position: relative;
	padding: 15.5px 10px;
	color: #43454B;
}
header nav .header-link li a:after{
	position: absolute;
	content: '';
	display: inline-block;
	top: calc(50% - 6px);
	right: 10px;
	width: 8px;
	height: 13px;
	background-image: url("../images/angle-right.svg");
	background-size: contain;
	background-repeat: no-repeat;
}
header nav .header-link li a:hover{
	color: #009844;
	transition: ease 0.3s;
}
@media screen and (min-width: 992px){
	header .menu-link_open{
		padding-top: 0;
	}
	header nav .header-link li a:hover{
	color: #F5E17D;
	}
}
/*btn-------------------*/
header .header-btn{
	padding: 0 30px;
}
.btn{
	width: 100%;
	padding: 0;
}
.btn a{
	display: block;
	position: relative;
	max-width: 500px;
	line-height: 50px;
	text-align: center;
	-webkit-box-shadow: 0 1px 0 #21211F33;
	box-shadow: 0 1px 0 #21211F33;
}
.btn a:after{
	position: absolute;
	content: '';
	display: inline-block;
	top:calc(50% - 8px);
	right: 15px;
	width: 16px;
	height: 14px;
	background-image: url("../images/arrow@2x.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.btn a:hover{
	color: #ffffff;
	transition: all 0.3s ease;
}
.btn-lightblue{
	height: 50px;
	margin-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
	border-radius: 25px;
	background-color: #0DB79B;
	background-size: cover;
	color: #ffffff;
	font-weight: 500;
}
.btn-lightblue:hover{
	background-color: #18C8AB;
}
.btn-green{
	height: 50px;
	margin-left: auto;
	margin-right: auto;
	border-radius: 25px;
	background-color: #009844;
	color: #ffffff;
	font-weight: 500;
}
.btn-green:hover{
	background-color: #07B254;
	color: #ffffff;
}
.btn-black{
	width: 100%;
	padding: 0;
}
.btn-black a{
	display: block;
	position: relative;
	max-width: 350px;
	line-height: 50px;
	text-align: center;
	-webkit-box-shadow: 0 1px 0 #21211F33;
	box-shadow: 0 1px 0 #21211F33;
}
.btn-black a:hover{
	color: #000000;
	transition: all 0.3s ease;
}
.btn-yellow{
	height: 50px;
	margin-left: auto;
	margin-right: auto;
	border-radius: 25px;
	background-color: #F4D240;
	color: #21211F;
	font-weight: 700;
}
.btn-yellow:hover{
	background-color: #F4BE40;
}
.btn-black a:after{
	display: inline-block;
	content: '';
	position: absolute;
	top:calc(50% - 8px);
	right: 15px;
	width: 16px;
	height: 14px;
	background-image: url("../images/arrow-black@2x.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.btn-orange{
	height: 50px;
	margin-left: auto;
	margin-right: auto;
	border-radius: 25px;
	background-color: #EE4C36;
	background-size: cover;
	color: #ffffff;
	font-weight: 500;
}
.btn-orange:hover{
	background-color: #FC715F;
}
.btn-low a{
	display: block;
	position: relative;
	max-width: 180px;
	line-height: 40px;
	font-size: 14px;
	text-align: center;
	-webkit-box-shadow: 0 1px 0 #21211F33;
	box-shadow: 0 1px 0 #21211F33;
	
}
.btn-low a:after{
	display: inline-block;
	content: '';
	position: absolute;
	top:calc(50% - 8px);
	right: 13px;
	width: 14px;
	height: 16px;
	background-image: url("../images/arrow-low.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.btn-low .btn-green{
	height: 40px;
	margin-right: 0;
}
/*cart-icon-------------------*/
.cart-icon{
	position: relative;
}
.cart-icon:before{
	display: inline-block;
	content: '';
	position: relative;
	top: -2px;
	width: 20px;
	height: 18px;
	margin-right: 12px;
	background-image: url("../images/shopping-cart@2x.png");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
}
@media screen and (min-width: 768px){
	header [class*='menu-btn']{
		width: 60px;
		height: 60px;
		padding: 24px 20px 21px;
	}
	header .menu-btn_open span{
		margin-bottom: 5px;
	}
	header .menu-btn_close span{
		position: relative;
		width: 25px;
	}
	header .menu-btn_close span:nth-child(1){
		top: 6px;
		left: -3px;
		transform: rotate(45deg);
	}
	header .menu-btn_close span:nth-child(2){
		top: 5px;
		left: -3px;
		transform: rotate(-45deg);
	}
	header nav{
		max-width: 88%;
		margin-left: auto;
		margin-right: auto;
	}
	header .header-btn{
		max-width: 500px;
		margin-left: auto;
		margin-right: auto;
	}
	.btn a{
		line-height: 60px;
	}
	.btn-lightblue{
		height: 60px;
		border-radius: 35px;
	}
	.btn-green{
		height: 60px;
		border-radius: 35px;
	}
	.btn-orange{
		height: 60px;
		border-radius: 35px;
	}
}
@media screen and (min-width: 992px){
	header .menu-link_close{
		opacity: 1;
		visibility: visible;
	}
	header [class*='menu-btn']{
		opacity: 0;
		visibility: hidden;
	}
	header nav{
		position: fixed;
		width: 100%;
		max-width: none;
		height: 80px;
		background: rgb(0,152,68);
		background: linear-gradient(315deg, rgba(13,183,155,0.9) 0%, rgba(0,152,68,0.9) 100%);
		z-index: 20;
	}
	header .header-rogo{
		display: block;
		margin-right: 60px;
	}
	header nav .header-link{
		margin: 0;
	}
	header nav .header-link li{
		border-bottom: 0;
	}
	header nav .header-link a{
		padding: 20px -1%;
		color: #ffffff;
		font-size: 15px;
	}
	header nav .header-link li a:after{
		display: none;
	}
	header .header-btn{
		display: none;
	}
	.btn a{
		line-height: 50px;
	}
	.btn-lightblue{
		height: 50px;
		border-radius: 25px;
	}
	.btn-green{
		height: 50px;
		border-radius: 25px;
	}
	.btn-orange{
		height: 50px;
		border-radius: 25px;
	}
	.btn-low a{
		max-width: 190px;
	}
}
@media screen and (min-width: 1200px){
	header nav .header-link a{
		padding: 20px 17.5px;
		font-size: 16px;
	}
}
/*ファーストビュー-------------------*/
.intro{
	position: relative;
}
.intro-box{
	position: relative;
	width: 100%;
	height: 100vh;
	background-image: url("../images/intro.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
.intro-box .intro-logo{
	position: absolute;
  	top: 41%;
  	left: 50%;
	width: 90%;
	max-width: 480px;
  	-webkit-transform: translate(-50%, -50%); 
  	transform: translate(-50%, -50%);
}
.intro-box .intro-catalog{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 120px;
	padding: 16px 30px 22px;
	background: rgb(0,152,68);
	background: linear-gradient(-70deg, rgba(13,183,155,0.9) 0%, rgba(0,152,68,0.9) 100%);
	text-align: center;
}
.intro-box .intro-catalog .intro-text{
	position: relative;
	margin-bottom: 11px;
	color: #ffffff;
}
.intro-box .intro-catalog .intro-text:before{
	display: inline-block;
	content: '';
	position: relative;
	top: -2px;
	width: 20px;
	height: 18px;
	background-image: url("../images/file@2x.png");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
}
.intro .intro-linkbtn{
	padding: 20px 30px 20px;
	background-color: #ffffff;
}
.pc-br{
	display: none;
}
@media screen and (min-width: 768px){
	.intro-box .intro-catalog{
		bottom: 30px;
		left: 50%;
		width: 380px;
		height: 120px;
		padding: 16px 15px 22px;
		border-radius: 10px;
  		-webkit-transform: translateX(-50%); 
  		transform: translateX(-50%);
	}
}
@media screen and (min-width: 992px){
	.intro-box .intro-logo{
		top: 50%;
		width: 41%;
		max-width: 592px;
	}
	.intro-box .intro-catalog{
		left: 22%;
		bottom: 30px;
		width: 380px;
		height: 120px;
		padding: 16px 15px 22px;
		border-radius: 10px;
	}
	.intro .intro-linkbtn{
		height: 0;
		margin: 0;
		padding: 0;
	}
	.intro .intro-linkbtn .btn a:after{
		top: 100px;
		right: 53px;
	}
	.intro .intro-linkbtn .btn-lightblue{
		position: absolute;
		bottom: 178px;
		right: 30px;
		width: 128px;
		height: 128px;
		line-height: 23px;
		margin-bottom: 0;
		padding: 25px 22px 0;
		border-radius: 100%;
		letter-spacing: 0.8px;
	}
	.intro .intro-linkbtn .btn-green{
		position: absolute;
		bottom: 30px;
		right: 30px;
		width: 128px;
		height: 128px;
		line-height: 60px;
		padding: 32px 0;
		border-radius: 100%;
	}
	.intro .intro-linkbtn .btn .cart-icon:before{
		margin-right: 6px;
	}
	.pc-br{
		display: block;
	}
}
/*モーニングコープって？-------------------*/
.contents01{
	padding-top: 80px;
	background-color: #FBFAF4;
}
.h2-green{
	position: relative;
	margin-bottom: 30px;
	color: #009844;
	text-align: center;
}
.h2-green:before{
	display: inline-block;
	content: '';
	position: absolute;
	top: -25px;
	right: calc(50% - 15px);
	width: 36px;
	height: 5px;
	background-image: url("../images/h2-green.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.h2-deco{
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
}
.outer01{
	margin-bottom: 30px;
}
.outer01:last-child{
	margin-bottom: 50px;
}
.inner01{
	padding-left: 15px;
	padding-right: 15px;
}
.inner01-img{
	position: relative;
	width: 100%;
	margin-bottom: 13px;
}
.inner01-shadow{
	border-radius: 8px;
	-webkit-box-shadow: 6px 6px 0 #0000000D;
    box-shadow: 6px 6px 0 #0000000D;
}
.inner01-01{
	position: absolute;
	bottom: -77px;
	left: 19px;
	width: 51px;
	height: 88px;
}
.inner01 h3{
	line-height: 1.4em;
	margin-left: 75px;
	color: #009844;
	font-weight: 700;
}
.inner01 .h2-small{
	font-size: 20px;
}
.inner01-text{
	line-height: 28px;
	margin-left: 30px;
}
.inner02-text{
	line-height: 28px;
	margin-left: 30px;
	margin-bottom: 15px;
}
@media screen and (min-width: 768px){
	.inner01{
		padding-left: 0;
		padding-right: 0;
	}
	.inner01:nth-child(odd){
		padding-right: 15px;
	}
	.inner01-text{
		margin-left: 15px;
	}
	.outer01:nth-child(n+3){
		margin-bottom: 80px;
	}
}
@media screen and (min-width: 992px){
	.contents01{
		padding-top: 100px;
	}
	.h2-green{
		margin-bottom: 50px;
	}
	.outer01{
		margin-bottom: 56px;
	}
	.inner02-text{
		margin-bottom: 10px;
	}
}
/*モーニングコープのおすすめ商品-------------------*/
.contents02{
	padding-top: 80px;
	padding-bottom: 30px;
	background-color: #F4F3EA;
}
.h2-orenge{
	position: relative;
	margin-bottom: 30px;
	color: #EE4C36;
	text-align: center;
}
.h2-orenge:before{
	content: '';
	display: inline-block;
	position: absolute;
	top: -25px;
	right: calc(50% - 15px);
	width: 36px;
	height: 5px;
	background-image: url("../images/h2-orange.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.h2-text{
	margin-bottom: 30px;
	padding-left: 15px;
	padding-right: 15px;
}
.outer02{
	margin-bottom: 20px;
}
.inner02-01{
	margin-right: 30px;
	padding: 10px 10px 20px;
	border-radius: 8px;
	background-color: #ffffff;
	-webkit-box-shadow: 6px 6px 0 #0000000D;
    box-shadow: 6px 6px 0 #0000000D;
}
.inner02-box{
	margin: 0 5px;
}
.inner02-box h4{
	line-height: 24px;
	margin-bottom: 10px;
	font-size: 16px;
	font-weight: 700;
}
.inner02-box h4 small{
	font-size: 13px;
	font-weight: 700;
}
.inner02-box ul{
	margin-bottom: 13px;
	padding-inline-start: 15px;
}
.inner02-box ul li{
	position: relative;
	line-height: 21px;
	margin-bottom: 4px;
	font-size: 14px;
}
.inner02-box ul li:before{
	position: absolute;
	content: '';
	display: block;
	top: 6px;
	left: -15px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #EE4C36;
}
[class*='inner02'] > p{
	font-size: 14px;
}
.user-voice-vege{
	margin: 0 5px;
	font-size: 14px;
}
.user-voice{
	position: relative;
	margin-bottom: 8px;
	padding-left: 23px;
	padding-top: 11px;
	background-image: url("../images/boder-dashed.png");
	background-repeat: repeat-x;
	background-position: top;
	color: #EE4C36;
	font-weight: 700;
}
.user-voice:before{
	position: absolute;
	content: '';
	display: inline-block;
	top: calc(50% - 4px);
	left: 0;
	width: 18px;
	height: 17px;
	background-image: url("../images/balloon.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.user-voice:after{
	content: '';
	display: inline-block;
	position: relative;
	width: 63px;
	height: 11px;
	margin-left: 5px;
	background-image: url("../images/uservoice.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.inner02-02{
	margin-left: 30px;
	padding: 10px 10px 20px;
	background-color: #ffffff;
	border-radius: 8px;
	-webkit-box-shadow: 6px 6px 0 #0000000D;
    box-shadow: 6px 6px 0 #0000000D;
}
.inner02-box h4 .h4-smallmonth{
	font-size: 14px;
}
.inner02-02 .img-space{
	margin-bottom: 8px;
}
@media screen and (min-width: 768px){
	.contents02{
		padding-top: 100px;
	}
	.h2-orenge{
		margin-bottom: 47px;
	}
	.h2-text{
		margin-bottom: 40px;
		padding: 0;
		text-align: center;
	}
	.inner02-01{
		margin-right: 0;
	}
	.inner02-02{
		margin-left: 0;
	}
	.inner02-vege{
		margin-left: 10px;
		margin-right: 10px;
	}
	.inner02-vege img{
		max-width: 330px;
	}
	.inner02-box h4 .h4-smallmonth{
		font-size: 16px;
	}
	.user-voice-vege{
		margin: 0 10px;
	}
}
@media screen and (min-width: 992px){
	.outer02{
		margin-bottom: 30px;
	}
	.h2-orenge{
		font-size: 40px;
	}
	.inner02-vege img{
		max-width: 280px;
	}
}
@media screen and (min-width: 1200px){
	.inner02-vege img{
		max-width: 330px;
	}
}
/*どんな商品を注⽂できるの？-------------------*/
.inner03{
	margin: 0 15px;
}
.inner03 h3{
	line-height: 36px;
	margin-bottom: 10px;
	color: #009844;
	font-weight: 700;
}
.inner03 h3 span{
	font-size: 20px;
}
.inner03 p{
	margin-bottom: 30px;
}
.inner03-ohayo{
	padding: 16px;
	border-radius: 10px;
	background-color: #fff;
}
.inner03-ohayo p{
	margin-bottom: 15px;
	font-weight: 700;
	text-align: center;
}
.inner03-ohayo .btn .btn-lightblue{
	max-width: 343px;
}
.inner03-ohayo .btn .btn-green{
	width: 46%;
	max-width: 235px;
	font-size: 15px;
}
.inner03-ohayo .btn .btn-green:after{
	right: 4px;
	margin-left: 9px;
}
.inner03-ohayo .btn .btn-green:nth-child(1){
	margin-bottom: 15px;
}
.inner03-ohayo .btn .btn-green:nth-child(2){
	margin-bottom: 15px;
}
.inner03-ohayo .btn .btn-green:nth-child(2n-1){
	margin-right: 8px;
}
.inner03-ohayo .btn .btn-green:nth-child(2n){
	margin-left: 8px;
}
@media screen and (min-width: 768px){
	.inner03-ohayo{
		-webkit-box-shadow: 6px 6px 0 #0000000D;
		box-shadow: 6px 6px 0 #0000000D;
	}
	.inner03-ohayo .btn .btn-green{
		font-size: 16px;
	}
	.inner03-ohayo .btn .btn-green:after{
		right: 15px;
	}
}
/*ご利⽤開始までの流れ-------------------*/
.ttl-usage{
	position: relative;
	margin-bottom: 20px;
}
.ttl-usage .step-number{
	width: 75px;
	height: 70px;
}
.ttl-usage .h3-catalog{
	position: relative;
	top: 50%;
	line-height: 36px;
	margin-left: 10px;
	margin-bottom: 0;
	color: #EA6000;
	font-weight: 700;
	vertical-align: middle;
}
.inner04{
	margin-bottom: 10px;
	padding: 15px 15px 20px;
	border-radius: 10px;
	background-color: #fff;
}
.inner04 .h4-check{
	position: relative;
	margin-bottom: 5px;
	font-size: 18px;
	font-weight: 700;
}
.inner04 .h4-check:before{
	display: inline-block;
	content: '';
	position: relative;
	top: -2px;
	width: 18px;
	height: 18px;
	margin-right: 8px;
	background-image: url("../images/check-circle.png");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
}
.inner04 .inner04-border{
	margin-bottom: 20px;
	background-image: url("../images/dashed.png");
	background-repeat: repeat-x;
	background-position: bottom;
}
.contents02 .inner04 p{
	padding-bottom: 15px;
}
.inner04 .inner04-border .btn .btn-orange:first-child{
	margin-bottom: 15px;
}
.inner04 .inner04-border .btn .btn-orange:last-child{
	margin-bottom: 20px;
}
.inner04 .inner04-border .inner04-tel{
	padding-bottom: 20px;
	text-align: center;
}
.inner04 .inner04-border .inner04-tel p{
	padding-bottom: 0;
}
.inner04 .inner04-border .inner04-tel .contact-tel{
	font-size: 28px;
	letter-spacing: 2.8px;
}
.inner04 .inner04-map{
	margin-bottom: 15px;
	border-radius: 8px;
}
.inner04-box .h4-map{
	position: relative;
	margin-bottom: 10px;
	font-size: 16px;
	font-weight: 700;
	color: #EE4C36;
}
.inner04-box .h4-map:before{
	display: inline-block;
	content: '';
	position: relative;
	top: -2px;
	width: 16px;
	height: 14px;
	margin-right: 8px;
	background-image: url("../images/map-marked-alt-solid.png");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
}
.inner04 .p-small{
	font-size: 14px;
}
.inner04-box .post-form form{
	display: flex;
	flex-wrap: wrap;
	position: relative;
	max-width: 350px;
	margin-left: auto;
  	margin-right: auto;
	font-family: "秀英角ゴシック金", Shuei KakuGo Gin, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.inner04-box .post-form input{
	background: url("../images/post.svg") no-repeat;
	background-position: left 5% top 49%;
}
.inner04-box .post-form input[type="number"]::-webkit-outer-spin-button,.inner04-box .post-form input[type="number"]::-webkit-inner-spin-button{
	-webkit-appearance: none;
	margin: 0;
}
.inner04-box .post-form input[type="number"]{
	-moz-appearance:textfield;
}
.inner04-box .post-form .pbox1{
	width: 72%;
	height: 48px;
	padding-left: 28px;
	border: 2px solid #EE4C36;
	border-top-left-radius: 25px;
	border-bottom-left-radius: 25px;
	background-color: #fff;
	outline: none;
}
.inner04-box .post-form .pbtn1{
	position: absolute;
	top: 0;
	right: 0;
	width: 100px;
	height: 48px;
	border: 2px solid #EE4C36;
	border-radius: 0 25px 25px 0;
	background-color: #EE4C36;
	color: #fff;
	outline: none;
}
.contents02 .arrowdown{
	margin-bottom: 50px;
	text-align: center;
}
.contents02 .arrowdown img{
	width: 37.333%;
	max-width: 140px;
	margin-bottom: 8px;
}
.contents02 .arrowdown .p-arrowdown{
	font-size: 18px;
	font-weight: 700;
	color: #EE4C36;
}
.contents02 .outer03{
	margin-bottom: 40px;
}
.ttl-usage .step3{
	line-height: 75px;
}
.inner04 ul{
	padding-inline-start: 0;
}
.inner04 li{
	position: relative;
	padding-left: 12px;
}
.inner04 li:before{
	display: block;
	content: '';
	position: absolute;
	width: 8px;
	height: 8px;
	top: 0.4em;
	left: 0;
	border-radius: 50%;
	background-color: #EE4C36;
}
.inner04 .inner04-order{
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
}
.inner04 .delivery-image{
	position: relative;
}
.inner04 .delivery-image .btn .btn-orange{
	position: absolute;
	bottom: 25px;
	left: 50%;
	width: 90%;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
	-webkit-transform: translateX(-50%);
  	transform: translateX(-50%);
}
.inner04 .inner04-bank{
	position: relative;
	font-size: 18px;
	font-weight: 700;
	color: #EE4C36;
}
.inner04 .inner04-bank span{
	position: absolute;
	margin-left: 8px;
	padding: 5px 9px;
	border-radius: 25px;
	background-color: #EE4C36;
	color: #fff;
	font-size: 13px;
	font-weight: 400;
	top: 50%;
  	-webkit-transform: translateY(-50%);
  	transform: translateY(-50%);
}
.inner04 .text-left .p-bottom{
	padding-bottom: 10px;
}
.inner04 .text-left .p-small{
	padding-bottom: 0;
}
.inner04 .text-left .p-small span{
	font-weight: 700;
	color: #EE4C36;
}
.inner04 .inner04-box .output-form{
	margin-top: 15px;
	font-weight: 700;
	text-align: center;
}
@media screen and (min-width: 768px){
	.inner04{
		text-align: center;
		padding: 30px 30px;
	}
	.inner04 .h4-check{
		margin-bottom: 10px;
	}
	.inner04 .h4-md{
		margin-bottom: 20px;
	}
	.ttl-usage{
		margin-left: 15px;
	}
	.ttl-usage .h3-catalog{
		line-height: 75px;
	}
	.inner04 .inner04-box{
		margin-top: 22px;
		text-align: left;
	}
	.inner04 ul{
		text-align: left;
	}
	.inner04 .inner04-bank{
		margin-bottom: 20px;
		text-align: left;
	}
	.inner04 .inner04-bank span{
		margin-left: 20px;
	}
}
@media screen and (min-width: 992px){
	.inner04{
		margin-bottom: 20px;
	}
	.contents02 .inner04 p{
		padding-bottom: 20px;
	}
	.inner04 .inner04-border{
		margin-bottom: 30px;
	}
	.inner04 .inner04-border .inner04-tel{
		padding-bottom: 30px;
	}
	.inner04 .btn .btn-orange{
		max-width: 350px;
	}
	.inner04 .inner04-border .btn .btn-orange{
		width: 50%;
	}
	.inner04 .inner04-border .btn .btn-orange:first-child{
		margin-left: auto;
		margin-right: 15px;
		margin-bottom: 30px;
	}
	.inner04 .inner04-border .btn .btn-orange:last-child{
		margin-left: 15px;
		margin-right: auto;
		margin-bottom: 30px;
	}
	.inner04-box .post-form{
		margin-bottom: 30px;
		padding-bottom: 30px;
	}
	.inner04 ul{
		margin-bottom: 30px;
	}
	.inner04 .p-ice{
		text-align: left;
	}
	.inner04 .delivery-image img{
		position: absolute;
		bottom: -10px;
		left: 65px;
		width: 265px;
		height: 272px;
	}
	.inner04 .inner04-border .p-bank{
		padding-bottom: 30px;
	}
}
/*宅配料⾦-------------------*/
.inner05{
	padding: 0 15px 60px;
}
.inner05 .h4-privilege{
	margin-bottom: 24px;
	font-size: 20px;
	font-weight: 700;
	color: #009844;
	text-align: center;
	letter-spacing: 6px;
}
.inner05 ol{
	margin-bottom: 20px;
	border: none;
	counter-reset: number;
}
.inner05 ol li{
	position: relative;
	line-height: 28px;
	padding: 0 0 0.5em 1.3em;
	font-weight: 700;
}
.inner05 ol li:last-child{
	padding-bottom: 0;
}
.inner05 ol li:before{
	position: absolute;
	content: counter(number);
	counter-increment: number;
	top: 4px;
	left: 0;
	width: 16px;
	height: 16px;
	line-height: 17px;
	border-radius: 50%;
	background-color: #0DB79B;
	color: #fff;
	font-size: 13px;
	font-family: "秀英角ゴシック金", Shuei KakuGo Gin, "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-align: center;
	vertical-align: middle;
}
.inner05 ol li span{
	color: #EE4C36;
}
.inner05 .inner05-box{
	margin-bottom: 24px;
	white-space: nowrap;
	overflow: scroll;
}
.inner05 .inner05-box table{
	width: 120%;
	border: 1px solid #D2D2D2;
	font-size: 14px;
	font-family: "Noto Sans JP", sans-serif;
	text-align: center;
}
.inner05 .inner05-box .b0{
	border: 0;
}
.inner05 .inner05-box td{
	border: 1px solid #D2D2D2;
}
.inner05 .inner05-box thead{
	border-color: #D2D2D2;
}
.inner05 .inner05-box thead th{
	padding: 10px 15px;
	background-color: #009844;
	color: #fff;
}
.inner05 .inner05-box tbody .price-back{
	padding: 5px 32px;
	background-color: #FCF7DE;
}
.inner05 .inner05-box tbody .point-back{
	padding: 8px 13px;
	background-color: #CCEADA;
}
.inner05 .inner05-box tbody .text-free{
	color: #EA6000;
	font-size: 21px;
	font-weight: 700;
}
.inner05 .inner05-box tbody .orange-back{
	background-color: #EA6000;
	color: #fff;
}
.inner05 .inner05-box tbody .text-tax{
	font-size: 18px;
	font-weight: 700;
}
.inner05 .inner05-box tbody .text-tax span{
	font-size: 12px;
	font-weight: 400;
}
.inner05 .inner05-box tbody .light-back{
	background-color: #F9CFB2;
}
.inner05 .table-text{
	margin-bottom: 20px;
	font-size: 13px;
}
@media screen and (min-width: 768px){
	.inner05 .inner05-box table{
		width: 110%;
		font-size: 21px;
	}
	.inner05 .inner05-box tbody .price-back{
		padding-top: 12px;
		padding-bottom: 12px;
	}
	.inner05 .inner05-box tbody .point-back{
		padding-top: 15px;
		padding-bottom: 15px;
	}
	.inner05 .inner05-box tbody .text-free{
		font-size: 32px;
	}
	.inner05 .inner05-box tbody .text-tax{
		font-size: 27px;
	}
	.inner05 .inner05-box tbody .text-tax span{
		font-size: 18px;
	}
}
@media screen and (min-width: 992px){
	.inner05 .inner05-box{
		overflow: hidden;
	}
	.inner05 .inner05-box table{
		width: 100%;
	}
	.inner05 .table-text{
		margin-bottom: 30px;
		text-align: center;
	}
	.inner05 .btn a{
		max-width: 350px;
	}
}
/*よくある質問-------------------*/
.inner06-box{
	margin-bottom: 10px;
	padding-inline-start: 0;
}
.inner06-box li{
	margin-bottom: 20px;
}
.inner06-box .ttl-question{
	position: relative;
	margin-bottom: 12px;
	font-family: "Noto Sans JP", sans-serif;
}
.inner06-box .ttl-question .p-question{
	position: absolute;
	top: 50%;
	left: 50px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	line-height: 24px;
	margin-left: 10px;
	color: #EE4C36;
	font-weight: 700;
	vertical-align: middle;
}
.inner06-box img{
	width: 50px;
	height: 50px;
}
/*footer-------------------*/
footer .footer01{
	width: 100%;
	height: 100%;
	padding: 30px 15px 20px;
	background: rgb(0,152,68);
	background: linear-gradient(-70deg, rgba(13,183,155,1) 0%, rgba(0,152,68,1) 100%);
	text-align: center;
}
footer .footer01 h3{
	color: #ffffff;
	line-height: 1.75em;
	margin: 0 15px 20px;
	background-image: url("../images/border-deco1@2x.png");
	background-repeat: repeat;
	background-size: 42 100%;
	background-position: bottom;
}
footer .footer01 h4{
	font-size: 18px;
	font-weight: 700;
}
footer .footer01 .footer-box{
	background-color: #FBFAF4FA;
	border-radius: 10px;
	padding: 15px;
	margin-bottom: 15px;
}
footer .footer01 .footer-box:last-child{
	margin-bottom: 0;
}
footer .footer01 .footer-box .footer-text{
	margin-bottom: 5px;
}
.contact-tel{
	color: #EE4C36;
	font-weight: 700;
	letter-spacing: 1.6px;
}
.contact-tel:hover{
	color: #FC715F;
}
.contact-tel:before{
	position: relative;
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	vertical-align: middle;
	top: -2px;
	margin-right: 8px;
	background-image: url("../images/phone-square@2x.png");
	background-size: contain;
	background-repeat: no-repeat;
}
footer .footer01 .footer-box .contact-tel{
	font-size: 32px;
}
.small-text{
	font-size: 14px;
	margin-bottom: 0;
}
footer .footer02{
	background-color: #FBFAF4;
	padding: 38px 15px 71px;
}
footer .footer02 .footer-logo{
	text-align: center;
	margin-bottom: 20px;
}
footer .footer02 .footer-link{
	background-color: #ffffff;
	margin: 0 0 30px 0;
	padding: 0 15px;
	border-radius: 8px;
}
footer .footer02 .footer-link li{
	background-image: url("../images/border-deco2@2x.png");
	background-repeat: repeat-x;
	background-position: bottom;
}
footer .footer02 .footer-link li:last-child{
	background-image: none;
}
footer .footer02 .footer-link a{
	position: relative;
	display: block;
	color: #43454B;
	padding: 15px 0;
	font-size: 15px;
}
footer .footer02 .footer-link a:after{
	position: absolute;
	content: '';
	display: inline-block;
	top: calc(50% - 6px);
	right: 0;
	width: 8px;
	height: 13px;
	background-image: url("../images/angle-right.svg");
	background-size: contain;
	background-repeat: no-repeat;
}
footer .footer02 .footer-annotation{
	text-align: center;
	margin-bottom: 31px;
}
footer .footer02 .footer-annotation a{
	color: #14171E;
	font-size: 14px;
}
footer .footer02 .footer-copyright{
	font-size: 13px;
	text-align: center;
}
@media screen and (min-width: 768px){
	footer .footer01{
		padding-left: 50px;
		padding-right: 50px;
	}
	.sp-br{
		display: none;
	}
	footer .footer01 h3{
		max-width: 85%;
		margin-left: auto;
		margin-right: auto;
		background-repeat: repeat no-repeat;
		line-height: 2.5em;
	}
	footer .footer02{
		padding-left: 50px;
		padding-right: 50px;
	}
}
@media screen and (min-width: 992px){
	footer .footer01 h3{
		margin-bottom: 30px;
		max-width: 730px;
	}
	footer .footer01 .footer-box{
		margin-bottom: 0;
		margin-right: 30px;
		padding: 20px;
		width: 350px;
	}
	footer .footer01 .footer-box:nth-child(2){
		margin-right: 0;
	}
	footer .footer01 .footer-box .footer-hd{
		margin-bottom: 35px;
	}
	footer .footer02{
		padding-left: 0;
		padding-right: 0;
	}
	footer .footer02 .footer-link{
		width: 100%;
		margin-right: auto;
		margin-left: auto;
		max-width: 950px;
	}
	footer .footer02 .footer-link li{
		background-image: none;
	}
	footer .footer02 .footer-link li a{
		font-size: 14px;
		padding-right: 27px;
		padding-left: 27px;
	}
	footer .footer02 .footer-link li a:after{
		right: 10px;
		top: calc(50% - 7px);
	}
}
@media screen and (min-width: 1200px){
	footer .footer02 .footer-link{
		width: 100%;
		padding-bottom: 0;
		max-width: 1140px;
	}
	footer .footer02 .footer-link li a{
		font-size: 15px;
	}
}



















