@charset "UTF-8";

/* =================================================
	宅配
================================================= */
/*============//共通//============*/
/*画像*/
.delivery__content img{ height:auto; }

/*四角いボタン*/
.delivery__button{
	margin:40px auto 0;
	min-width:300px;
	min-height:80px;
	border-radius:16px;
	padding:5px 75px 5px 40px;
}
.delivery__button-arrow{
	right:25px;
}
@media (max-width:767px) {
	.delivery__button{ width:100%; min-width:auto; }
}
/*============//宅配サービスのしくみ//============*/
.delivery__about{ margin-bottom:120px; }
.delivery__about .section-title{ text-align:center; }
.delivery__about-layout{
	padding:30px 80px 80px 80px;
	background:#fff;
	width:var(--base-w);
	margin:0 auto;
	box-shadow:var(--next-card-shadow);
	border-radius:24px;
}
.delivery__about-card{
	margin-top:40px;
	padding:60px 70px 70px;
	border:solid 10px var(--color-accent);
	border-radius:16px;
	background:linear-gradient(to bottom, var(--color-bg-base) 300px, var(--color-bg-base2) 300px);
	position:relative;
	overflow:hidden;
	z-index:1;
}
.delivery__about-card:before {
	content:"";
	width:1404px;
	height:153px;
	display:block;
	position:absolute;
	top:160px;
	left:50%;
	transform:translateX(-50%);
	z-index:-1;
	-webkit-mask-image:url(../img/round-bg.png);
	mask-image:url(../img/round-bg.png);
	-webkit-mask-position:center center;
	mask-position:center center;
	-webkit-mask-repeat:no-repeat;
	mask-repeat:no-repeat;
	-webkit-mask-size:contain;
	mask-size:contain;
	background:var(--color-bg-base2);
}
.delivery__about-lead,
.delivery__about-card-text,
.delivery__about-card-figure{ text-align:center; }
.delivery__about-card-figure{ margin-bottom:40px; }
.delivery__about-card-figure img{
	max-width:85%;
}
.delivery__about-card-text{ margin-bottom:70px; line-height:4rem; }
.delivery__about-card-accent{ color:var(--color-accent); font-size:2.4rem; display:inline-block; }

.delivery__about-lead{
	padding: 5px 10px;
	margin-bottom:20px;
	color:#fff;
	font-size:2.4rem;
	border-radius:50px;
	background:var(--color-accent);
}
.delivery__about-list{ display:flex; gap:40px; }
.delivery__about-item{
	width:calc((100% - 80px) / 3);
	text-align:center;
	display:flex;
	flex-direction:column;
}
.delivery__about-item-figure{ display:flex; }
.delivery__about-item-figure img{
	display:flex;
	margin-top:auto;
}
.delivery__about-item-text{ font-weight:var(--font-medium); }

@media (min-width:901px) {
	.delivery__about-item-figure{ min-height:276px; }
}
@media (max-width:1240px) {
	.delivery__about-layout{
		width:var(--content-width-med);
		padding:30px 15px 15px;
	}
	.delivery__about-card{
		padding: 40px 15px 40px;
		border:solid 5px var(--color-accent);
	}
}
@media (max-width:1024px) {
	.delivery__about{ margin-bottom:60px; }
}
@media (max-width:900px) {
	.delivery__about-item-figure,
	.delivery__about-item-figure img,
	.delivery__about-item{ width:100%; }
	.delivery__about-list{ flex-direction:column; }
	.delivery__about-item-figure{ display:block; text-align:center; }
	.delivery__about-item-figure img{ display:inline-block; max-width:220px; }
}
@media (max-width:767px) {
	.delivery__about-layout{ width:var(--content-width-sm); }
	.delivery__about-lead{ font-size:2rem; }
	.delivery__about-card-text{ text-align:left;margin-bottom:40px; }
}

/*============//トヨタ生協の多彩なカタログ//============*/
.delivery__catalog-list{
	width:1000px;
	margin:0 auto 120px;
	border-radius:16px;
	box-shadow: var(--next-card-shadow);
	overflow:hidden;
	background:#fff;
}
.delivery__catalog-toggle{
	margin-bottom:0;
	padding:15px 0 0;
	text-align:center;
	color:#fff;
	background:var(--color-accent);
	position:relative;
	cursor:pointer;
}
.delivery__catalog-toggle .button-accordion{
	position:absolute;
	right:40px;
	top: 20px;
}
.delivery__catalog-toggle[aria-expanded="true"] .fa-plus { display:none; }
.delivery__catalog-toggle[aria-expanded="false"] .fa-minus { display:none; }

.delivery__catalog-items{
	display:flex;
	flex-wrap:wrap;
	gap:40px;
	padding:40px 40px 0;
}
.delivery__catalog-item{
	width:calc((100% - 80px) / 3);
	text-align:center;
}
.delivery__catalog-body{
	border-radius:0 0 20px 20px;
	border:solid 10px var(--color-accent);
	overflow:hidden;
	transition:max-height 0.3s ease;
	background:#fafaf8;
}
.delivery__catalog-item-name{
	margin-top:20px;
	padding:5px 20px;
	font-weight:var(--font-medium);
	border-radius:50px;
	background:#f5e7d7;
}
.delivery__catalog-item-figure img{ box-shadow:var(--next-card-shadow); }
.delivery__catalog-button{ margin:40px auto 60px; }

@media (max-width:1240px) {
	.delivery__catalog-list{ width:var(--content-width-lg); }
}
@media (max-width:1024px) {
	.delivery__catalog-list{ margin:0 auto 60px; }
	.delivery__catalog-toggle{ font-size: 2rem; line-height: 3.2rem; }
	.delivery__catalog-body{ border:solid 5px var(--color-accent); }
}
@media (max-width:767px) {
	.delivery__catalog-list{ width:var(--content-width-sm); }
	.delivery__catalog-button{ width: calc(100% - 30px); margin:40px 15px 40px; }
	.delivery__catalog-items{ padding:20px 15px 0; gap:20px; }
	.delivery__catalog-item{ width:100%; }
	.delivery__catalog-toggle .button-accordion{ right:20px; }
}


/*============//ご注文の商品がお手元に届くまで//============*/
.delivery__flow{ padding-bottom:80px; }
.delivery__flow-layout{
	margin:0 auto;
	width:var(--base-w);
}
.delivery__flow-item{
	display:flex;
	gap:30px;
	position:relative;
	padding-bottom:20px;
}
.delivery__flow-item-figure{
	width:240px;
	height:240px;
	border-radius:50%;
	background:#fff;
	box-shadow:var(--next-card-shadow);
	border:1px solid var(--color-accent);
	align-items:center;
	justify-content:center;
	display:flex;
}
.delivery__flow-list{ margin-top:40px; }
.delivery__flow-list .delivery__flow-item:not(:last-of-type):before{
	content:"";
	width:1px;
	height:100%;
	display:block;
	background:var(--color-accent);
	position:absolute;
	left:120px;
	top:0;
	z-index:-1;
}
.delivery__flow-list .delivery__flow-item:nth-of-type(1),
.delivery__flow-list .delivery__flow-item:nth-of-type(2){
	padding-bottom:84px;
}
.delivery__flow-item-body{
	width:100%;
	display:flex;
	justify-content:center;
	flex-direction:column;
}
.delivery__flow-item-period{
	min-width:120px;
	display:inline-block;
	text-align:center;
	color:#fff;
	padding:10px 30px;
	border-radius:50px;
	font-weight:var(--font-medium);
	background:var(--color-accent);
	position:absolute;
	bottom:-64px;
	left:50%;
	transform:translateX(-50%);
}
.delivery__flow-item-media{ position:relative; }
.delivery__flow-item-step{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:120px;
	padding:5px 30px;
	margin-right:15px;
	border-radius:50px;
	font-size:1.6rem;
	color:var(--color-overlay);
	background:var(--color-bg-base);
	vertical-align:middle;
}
.delivery__flow-item-title{
	display:flex;
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:1px solid var(--color-border);
	font-size:2.4rem;
	color:var(--color-accent);
}
.delivery__flow-item-step-num{
	color:var(--color-accent);
	font-family:var(--font-eng);
	vertical-align:middle;
}
.delivery__flow-item-text,
.delivery__flow-item-note-text{
	font-weight:var(--font-medium);
}
.delivery__flow-item-note{
	margin-top:20px;
	display:flex;
	gap:20px;
}
.delivery__flow-item-note-figure{
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:8px;
	min-width:120px;
	min-height:120px;
	background:var(--color-bg-base);
}
.delivery__flow-item-note-caption{ display:block; font-size:1.4rem; }
.delivery__box{
	display:flex;
	margin-top:40px;
	border-radius:16px;
	overflow:hidden;
	background:#fff;
	box-shadow:var(--next-card-shadow);
}
.delivery__box-figure{ background:var(--color-bg-base); }
.delivery__box-figure,
.delivery__box-body{ padding:40px; }

.delivery__join-title,
.delivery__introduction-title{
	margin-bottom:40px;
	text-align:center;
	font-size:3.2rem;
}
.delivery__join-title:after,
.delivery__introduction-title:after{
	padding-left:0.5rem;
}
.delivery__join-title:before,
.delivery__introduction-title:before{
	padding-left:0.5rem;
}
.delivery__join-title:after,
.delivery__introduction-title:after,
.delivery__join-title:before,
.delivery__introduction-title:before{
	content:"/";
	color:var(--color-accent);
	display:inline-block;
}
.delivery__join-title:before,
.delivery__introduction-title:before{
	transform:scaleX(-1);
}
.delivery__box-title{
	padding-left: 25px;
	margin-bottom: 30px;
	font-size:2rem;
	position: relative;
}
.delivery__box-title:before{
	display: flex;
	content:"";
	height: 100%;
	width:4px;
	border-radius: 8px;
	background:var(--color-accent);
	position: absolute;
	left: 0;
}
.delivery__box-item{
	display:flex;
	align-items:center;
}
.delivery__box-item + .delivery__box-item{
	margin-top:20px;
}
.delivery__box-term{
	min-width:120px;
	margin-right:20px;
	padding:5px 10px;
	border-radius:50px;
	color:#fff;
	text-align:center;
	background:var(--color-accent);
}
.delivery__box-desc{
	font-weight:var(--font-medium);
	letter-spacing:0.02em;
}


@media (max-width:1240px) {
	.delivery__flow-layout{ width:var(--content-width-med); }
}
@media (max-width:1024px) {
	.delivery__flow{ padding-bottom:40px; }
}
@media (max-width:767px) {
	.delivery__flow-layout{ width:var(--content-width-sm); }
	.delivery__flow-item-figure{ width:120px; height:120px; }
	.delivery__flow-item-figure img{
		height:60px;
		width:auto;
	}
	.delivery__flow-list .delivery__flow-item:not(:last-of-type):before{ left:60px; }
	.delivery__flow-item-period{ font-size:1.4rem; padding:5px 15px;  bottom:-50px; }
	.delivery__flow-item-title{ flex-direction:column; font-size:2rem; padding-bottom:10px; margin-bottom:10px; }
	.delivery__join-title,
	.delivery__introduction-title{
		margin-bottom:20px;
		font-size:2rem;
	}
	.delivery__flow-item-step{ margin-right:0; margin-bottom:10px; }
	.delivery__box{ flex-direction:column; }
	.delivery__box-figure,
	.delivery__box-body{ padding:20px; }

	.delivery__flow-item-note,
	.delivery__box-item{ flex-direction:column; }
	.delivery__flow-item-note{ gap:10px; }
	.delivery__box-term{
		width: 100%;
		margin-bottom: 10px;
		margin-right: 0;
	}
	.delivery__join-title,
	.delivery__introduction-title{
		margin-bottom:20px;
		font-size:2.4rem;
	}
}

/*============//キャンペーン//============*/

.delivery__campaign-group{
	padding:160px 0;
	background:var(--color-bg-base);
}
@media (max-width:1024px) {
	.delivery__campaign-group{ padding:100px 0; }
}

/*============//新規加入キャンペーン//============*/
.delivery__introduction,
.delivery__join{
	width:var(--base-w);
	margin:0 auto;
}
.delivery__join-body{ margin-bottom:120px; }

.delivery__introduction-body,
.delivery__join-body{
	padding:40px;
	border-radius:24px;
	overflow:hidden;
	box-shadow:var(--next-card-shadow);
	background:#fff;
}
.delivery__introduction-figure img,
.delivery__join-figure img{ width:100%; }
.delivery__introduction-figuree,
.delivery__join-figure { margin-bottom:40px; }

.delivery__introduction-figure{ margin-top:40px; }

.delivery__introduction-lead{
	margin-bottom:40px;
	font-size:2.4rem;
	color:var(--color-accent);
	text-align:center;
}

@media (max-width:1240px) {
	.delivery__introduction,
	.delivery__join{ width:var(--content-width-lg); }
}
@media (max-width:1024px){
	.delivery__join-body{margin-bottom:60px;padding: 20px;}
}
@media (max-width:767px) {
	.delivery__introduction-body,
	.delivery__join-body{ padding:20px; }
	.delivery__introduction,
	.delivery__join{ width:var(--content-width-sm); }
	.delivery__introduction-lead{
		margin-bottom:20px;
		font-size:2rem;
		text-align:left;
	}
}


/*============//配送方法・手数料について//============*/
.delivery__commission,
.delivery__station,
.delivery__area,
.delivery__application{
	width:var(--base-w);
	margin:0 auto;
}

.delivery__commission,
.delivery__station,
.delivery__area{
	margin-bottom:120px;
}
.delivery__commission{ padding-top:60px; }
.delivery__application{ padding-bottom:40px; }
.delivery__info-group .section-title{ margin-bottom:20px; }
.delivery__commission-text{
	line-height:3.2rem;
}
.delivery__commission-type-list{
	margin-top:20px;
	margin-bottom:40px;
	padding:40px 30px;
	border-radius:16px;
	border:1px solid var(--color-border);
	background:#fff;
}
.delivery__commission-type-item{
	display:flex;
	align-items:center;
}
.delivery__commission-type-item + .delivery__commission-type-item{
	margin-top:20px;
}
.delivery__commission-type-term{
	min-width:120px;
	margin-right:20px;
	padding:5px 10px;
	border-radius:50px;
	color:#fff;
	text-align:center;
	background:var(--color-accent);
}

.delivery__commission-type-desc{
	font-weight:var(--font-medium);
	letter-spacing:0.02em;
}
.delivery__commission-note{ margin-bottom:20px; }

.delivery__commission-table-scroll{
	margin-top:20px;
	margin-bottom:80px;
	overflow-x: auto;
}
.delivery__commission-table-wrap {
	overflow:hidden;
	min-width: 1160px;
	border:1px solid var(--color-border);
	border-radius:16px;
}
.delivery__commission-table {
	width:100%;
	border-collapse:collapse;
	font-feature-settings:"palt";
}
.delivery__commission-table-head {
	padding:15px;
	border:1px solid var(--color-border);
	color:#fff;
	text-align:left;
	background:var(--color-accent);
}
.delivery__commission-table-label,
.delivery__commission-table-cell,
.delivery__commission-table-head {
	padding:15px;
	border:1px solid var(--color-border);
	
}
.delivery__commission-table-label,
.delivery__commission-table-cell{ font-weight:var(--font-medium); }

.delivery__commission-table-label{
	background:#fff;
	text-align:left;
}
.delivery__commission-table-cell--shipping-fee {
	background-color:#ffe8da;
}
.delivery__commission-table-sub{
	display:block;
	font-size:1.4rem;
}
.delivery__commission-table-note{ margin-left:1em; }
.delivery__commission-table-note,
.delivery__commission-table-cell--shipping-fee-note,
.delivery__commission-table-tax{ font-size:1.4rem; }

.delivery__discount-title{
	padding-left:25px;
	padding-bottom:20px;
	margin-bottom:20px;
	font-size:2.4rem;
	position:relative;
	border-bottom:1px solid var(--color-border);
}
.delivery__discount-title:before{
	content:"";
	width:8px;
	height:8px;
	display:block;
	border-radius:50%;
	position:absolute;
	background:var(--color-accent);
	left:0;
	top:2.4rem;
	transform:translateY(-50%);
}

/* 外周セルのボーダーを消す */
.delivery__commission-table tr:first-child th,
.delivery__commission-table tr:first-child td {
	border-top:none;
}
.delivery__commission-table tr:last-child th,
.delivery__commission-table tr:last-child td {
	border-bottom:none;
}
.delivery__commission-table tr th:first-child,
.delivery__commission-table tr td:first-child {
	border-left:none;
	border-bottom:none;
}
.delivery__commission-table tr th:last-child,
.delivery__commission-table tr td:last-child {
	border-right:none;
}

/*共通オレンジ字タイトル*/
.delivery__station-lead,
.delivery__area-lead{
	margin-bottom:30px;
	color:var(--color-accent);
	font-size:2.4rem;
}
.delivery__discount-text{
	margin-bottom:20px;
	font-weight:var(--font-medium);
}
.delivery__discount-item{
	padding:25px;
	border-radius:16px;
	background:var(--color-bg-base);
}
.delivery__discount-item + .delivery__discount-item{ margin-top:20px; }
.delivery__discount-term{ font-size:2rem; }
.delivery__discount-num{
	color:var(--color-accent);
	font-size:2.4rem;
	font-family:var(--font-eng);
	font-weight:var(--font-bold);
	margin-right:20px;
	padding-right:20px;
	border-right:1px solid var(--color-border);
}
.delivery__discount-desc{ font-weight:var(--font-medium); }


@media (max-width:1240px) {
	.delivery__commission,
	.delivery__station,
	.delivery__area,
	.delivery__application{ width:var(--content-width-med); }
}

@media (max-width:1024px) {
	.delivery__commission,
	.delivery__station,
	.delivery__area,
	.delivery__commission-table-scroll{
		margin-bottom:60px;
	}
	.delivery__commission{ padding-top:20px; }
	.delivery__commission-type-list{ padding:30px 20px; }
	.delivery__discount-title{ font-size:2rem; }
	.delivery__discount-title:before{ top:2rem; }
	.delivery__discount-item{ padding:15px; }
	.delivery__discount-term{ font-size:1.8rem; }
}
@media (max-width:767px) {
	.delivery__commission,
	.delivery__station,
	.delivery__area,
	.delivery__application{ width:var(--content-width-sm); }
	.delivery__commission-type-item{ flex-direction:column; }
	.delivery__commission-type-term{ width:100%; margin-bottom:10px; margin-right:0; }
}


/*============//ステーションについて//============*/
.delivery__station{ display:flex; gap:40px; justify-content:space-between; }
.delivery__station-table-layout{ width:640px; }
.delivery__station-condition-item{
	margin-bottom:10px;
	padding-left:40px;
	font-weight:var(--font-medium);
	position:relative;
}
.delivery__station-condition-item:before{
	content:"\f00c";
	width:24px;
	height:24px;
	border-radius:4px;
	color:#fff;
	display:flex;
	justify-content:center;
	align-items:center;
	font:var(--fa-font-solid);
	font-size:1.4rem;
	background:var(--color-accent);
	position:absolute;
	top:50%;
	left:0;
	transform:translateY(-50%);
}
.delivery__station-lead{ margin-bottom:40px; }

.delivery__station-table{ width:100%; }
.delivery__station-table-cell{ background:#fff; }
.delivery__station-table-cell,
.delivery__station-table-head{
	padding:15px;
	border:1px solid var(--color-border);
}
.delivery__station-table-head{
	color:#fff;
	text-align:left;
	background:var(--color-accent);
}
.delivery__station-table-wrap{
	overflow:hidden;
	border:1px solid var(--color-border);
	min-width:100%;
	margin-bottom:10px;
	border-radius:16px;
}


/* 外周セルのボーダーを消す */
.delivery__station-table tr:first-child th,
.delivery__station-table tr:first-child td {
	border-top:none;
}
.delivery__station-table tr:last-child th,
.delivery__station-table tr:last-child td {
	border-bottom:none;
}
.delivery__station-table tr th:first-child,
.delivery__station-table tr td:first-child {
	border-left:none;
	border-bottom:none;
}
.delivery__station-table tr th:last-child,
.delivery__station-table tr td:last-child {
	border-right:none;
}
.delivery__station-hours{
	border-radius:16px;
	padding:14px 20px;
	color:#fff;
	background:var(--color-accent);
}
@media (max-width:1024px) {
	.delivery__station{flex-direction:column;gap:30px;}
	.delivery__station-table-layout{ width:100%; }
	.delivery__station-lead, .delivery__area-lead { font-size:2rem; }
}

/*============//配達エリア//============*/
.delivery__area{ display:flex;gap:50px; }
.delivery__area-list{
	display:flex;
	margin-bottom:30px;
	flex-wrap:wrap;
	gap:10px;
}
.delivery__area-item{
	padding:7.5px 15px;
	border-radius:8px;
	font-size:1.4rem;
	background:var(--color-bg-base);
}
.delivery__area-note{ line-height:3.2rem; }
.delivery__area-figure{ min-width:680px;min-height:560px;  }
.delivery__area-figure img{ min-width:680px; min-height:560px; object-fit:cover; border-radius:16px; }
.delivery__area-layout{ width:calc(100% - 730px ); }

@media (max-width:1240px) {
	.delivery__area-figure{ min-width:476px; min-height:392px; }
	.delivery__area-figure img{ min-width:476px; min-height:392px; }
	.delivery__area-layout{ width:calc(100% - 526px); }
}
@media (max-width:1024px) {
	.delivery__area{flex-direction:column;gap:25px;}
	.delivery__area-figure,
	.delivery__area-figure img,
	.delivery__area-layout{ min-width:100%; min-height:auto; width:100%; }
}

/*============//新規申込・お問い合わせ//============*/
.delivery__application{
	display:flex;
	padding:40px;
	border-radius:24px;
	gap:80px;
	background:var(--color-accent);
	box-shadow:var(--next-item-shadow);
}
.delivery__application-header{ color:#fff; }
.delivery__application-list{
	width:600px;
}
.delivery__application-item{
	padding:40px;
	border-radius:16px;
	background:#fff;
}
.delivery__application-item + .delivery__application-item{ margin-top:20px; }

.delivery__application-item-title{
	margin-bottom:15px;
	padding-left:16px;
	position:relative;
}
.delivery__application-item-title:before {
	content:"";
	width:8px;
	height:8px;
	display:block;
	border-radius:50%;
	position:absolute;
	background:var(--color-accent);
	left:0;
	top:50%;
	transform:translateY(-50%);
}
.delivery__application-text{ font-weight:var(--font-medium); }
.delivery__application-tel-main .delivery__application-tel-number{
	font-size:4.8rem;
	line-height:5.8rem;
	color:var(--color-accent);
	font-family:var(--font-eng);
	font-weight:var(--font-bold);
}
.delivery__application-tel-sub .delivery__application-tel-number{
	font-family:var(--font-eng);
	font-size:2.4rem;
	font-weight:var(--font-bold);
}
.delivery__application-tel-main,
.delivery__application-tel-sub{ display:flex; align-items:baseline; }

.delivery__application-hours{ margin-top:10px; }
.delivery__application-hours-item{
	font-weight:var(--font-medium);
}
.delivery__application-hours-label{
	display:inline-block;
	font-size:1.2rem;
	padding:.2rem 1.5rem;
	border-radius:50px;
	background:var(--color-bg-base);
}
.delivery__application-hours-value{
	margin-left:10px;
	display:inline-block;
	font-size:1.4rem;
}
.delivery__application-hours-item + .delivery__application-hours-item{
	margin-top:5px;
}
.delivery__application-item .button{ width:100%; }


@media (max-width:1024px) {
	.delivery__application { padding:20px; gap:40px; }
	.delivery__application-tel-main{ flex-direction:column; }
}
@media (max-width:767px) {
	.delivery__application-item {
		padding:15px;
	}
	.delivery__application{ flex-direction:column; }
	.delivery__application-list{ width:100%; }
	.delivery__application-tel-main .delivery__application-tel-number{
		font-size:3.8rem;
		line-height:4.8rem;
	}
}
