@charset "utf-8";
/*--------------------------------------------
  mypage.common.css
		マイページ系共通CSS
--------------------------------------------*/
:root {
	--mp-content-width: clamp(calc(100% - 20px), width:95%, calc(100% - 20px));
	/*アイコン*/
	--icon_campaignList: url("../../img/common/mypage/icon_campaignList.svg");
	--icon_enqueteList: url("../../img/common/mypage/icon_enqueteList.svg");
	--icon_favoriteGoods: url("../../img/common/mypage/icon_favoriteGoods.svg");
	--icon_logout: url("../../img/common/mypage/icon_logout.svg");
	--icon_memberAddressBookList: url("../../img/common/mypage/icon_memberAddressBookList.svg");
	--icon_memberInquiryHistory: url("../../img/common/mypage/icon_memberInquiryHistory.svg");
	--icon_memberIntroduce: url("../../img/common/mypage/icon_memberIntroduce.svg");
	--icon_memberModify: url("../../img/common/mypage/icon_memberModify.svg");
	--icon_memberOrderList: url("../../img/common/mypage/icon_memberOrderList.svg");
	--icon_mypageTop: url("../../img/common/mypage/icon_mypageTop.svg");
	--icon_regularSchedule: url("../../img/common/mypage/icon_regularSchedule.svg");
	--icon_socialConnectList: url("../../img/common/mypage/icon_socialConnectList.svg");
	--icon_stockRequestList: url("../../img/common/mypage/icon_stockRequestList.svg");
	/*svgファイル用カラー（filter: で指定）*/
	--filter-color_gray: invert(39%) sepia(0%) saturate(1%) hue-rotate(31deg) brightness(101%) contrast(92%);
	--filter-color_white: invert(100%) sepia(0%) saturate(7476%) hue-rotate(110deg) brightness(98%) contrast(108%);
}
/* レイアウト */
#contents {
	&.twoColumns {
		grid-template-columns: minmax(var(--screen-pd-lr), 1fr) 270px min(calc(100% - 270px - var(--screen-pd-lr)*2), 752px) minmax(var(--screen-pd-lr), 1fr);
	}
}
/* 画面説明 */
.dispInfoItemWrap, .dispInfoForCorporationItemWrap {
	font-size: var(--font-size-s);
	font-weight: bold;
	& div, & span {
		font-weight: inherit;
	}
}
/* タイトル下テキスト */
.h3Wrap + [class*="dispInfo"].includeWrap {
	margin-bottom: 8px;
}
/* ボタン */
.contents {
	& .campaignListButtonGroup, & .orderListButtonGroup, & .regularlyListButtonGroup {
		&.buttonArea, & .areaLink {
			display: block;
			margin: 0;
			& .linkWrap {
				margin-top: 10px;
			}
		}
		& a {
			min-width: unset;
			&[class*="btn_"] {
				background: none;
				border: none;
				display: inline-block;
				padding-top: 0;
				padding-right: 0;
				padding-bottom: 0;
				width: fit-content;
				margin: 0 0 0 auto;
				display: flex;
				align-items: center;
			}
		}
	}
}
/* アイコン */
.contents {
	.campaignList,
	.enqueteList,
	.favoriteGoodsList,
	.logout,
	.memberAddressBookList,
	.memberInquiryHistory,
	.memberIntroduce,
	.memberModify,
	.memberOrderList,
	.mypageTop,
	.regularSchedule,
	.socialConnectList,
	.stockRequestList {
		& a::before {
			content: "";
			background-repeat: no-repeat;
			background-position: center center;
			background-size: contain;
			display: inline-block;
			width: 1.25em;
			height: 1.25em;
			position: absolute;
			inset: 0;
			margin: auto auto auto 0.5em;
		}
	}
	.campaignList a::before {
	background-image: var(--icon_campaignList);
	}
	.enqueteList a::before {
		background-image: var(--icon_enqueteList);
	}
	.favoriteGoodsList a::before {
		background-image: var(--icon_favoriteGoods);
	}
	.logout a::before {
		background-image: var(--icon_logout);
	}
	.memberAddressBookList a::before {
		background-image: var(--icon_memberAddressBookList);
	}
	.memberInquiryHistory a::before {
		background-image: var(--icon_memberInquiryHistory);
	}
	.memberIntroduce a::before {
		background-image: var(--icon_memberIntroduce);
	}
	.memberModify a::before {
		background-image: var(--icon_memberModify);
	}
	.memberOrderList a::before {
		background-image: var(--icon_memberOrderList);
	}
	.mypageTop a::before {
		background-image: var(--icon_mypageTop);
	}
	.regularSchedule a::before {
		background-image: var(--icon_regularSchedule);
	}
	.socialConnectList a::before {
		background-image: var(--icon_socialConnectList);
	}
	.stockRequestList a::before {
		background-image: var(--icon_stockRequestList);
	}
}
@media screen and (max-width: 960px) {
	.contents {
		/* レイアウト */
		& .newsGroup, & .campaignListGroup, & .orderHistoryGroup, & .regularlyGroup {
			width: var(--cont-width);
			margin-left: auto;
			margin-right: auto;
		}
		/* タイトル */
		& .level_h3 {
			width: 100%;
		}
	}
	/* タイトル下テキスト */
	.dispInfoItemWrap, .dispInfoForCorporationItemWrap {
		padding: 0 var(--screen-pd-lr);
	}
}
@media screen and (max-width: 780px) {
	/* 画面説明 */
	.dispInfoItemWrap, .dispInfoForCorporationItemWrap {
		font-weight: normal;
	}
	/* 注文系tableの注文番号・日付等、SPで背景が青になる指定 */
	.contents .table {
		&.outlineArea {
			border: 1px solid var(--color-corporate);
			display: flex;
			flex-direction: column;
			& .tr, & tr {
				border: none;
				& .th, & th, & .td, & td {
					border: none;
					display: block;
					text-align: center;
					width: 100%;
				}
			}
			& .th, & th {
				background-color: var(--color-corporate);
				color: #fff;
				& label {
					font-weight: bold;
					display: inline;
				}
			}
			& .td, & td {
				color: var(--color-corporate);
				font-size: 1.1rem;
				font-weight: bold;
				& div, & span {
					font-size: inherit;
					font-weight: inherit;
				}
			}
		}
	}
}

/*--------------------------------------------
  サイドメニュー
--------------------------------------------*/
.sideContents {
	width: 240px;
	& .guest {
		height: 100%;
	}
	& h3 {
		&.level_h3 {
			display: none;
			margin: 0;
			border: none;
			border-top: 1px solid;
			font-weight: bold;
			padding: 10px 6px 10px 1.25em;
			position: relative;
			&::before, &::after {
				position: absolute;
				content: '';
				background-color: #fff;
				transition: all .3s ease-in-out;
				inset: 0;
				margin: auto 20px auto auto;
				width: 1em;
				height: 2px;
			}
			&::before {
				transform: rotate(90deg);
			}
			&.active {
				&::before, &::after {
					background-color: var(--text-color);
				}
				&::before {
					transform: rotate(180deg);
				}
			}
		}
	}
	& .mypage_menu {
		border-top: 1px solid;
		> li {
			border-bottom: 1px solid;
			> a {
				display: block;
				color: var(--text-color);
				font-weight: bold;
				padding: 8px 2.25em;
				position: relative;
				&::before {
					filter: var(--filter-color_gray);
				}
			}
		}
	}
}
.MyPageMenueBottom {
	display: none;
}
@media screen and (max-width: 960px) {
	.sideContents {
		display: block;
		width: 100%;
		& h3 {
			&.level_h3 {
				display: block;
			}
		}
		& .mypage_menu {
			display: none;
			> li {
				& a {
					padding: 12px 1em 12px 3.25em;
					position: relative;
					&::before {
						margin-left: 1.5em;
					}
					&::after {
						content: "▼";
						display: inline-block;
						position: absolute;
						transform: rotate(-90deg) translateY(-50%);
						scale: 0.8 1;
						font-size: 10px;
						color: #777;
						line-height: 0;
						top: 50%;
						right: 24px;
					}
				}
			}
		}
	}
}

/*--------------------------------------------
  お知らせ
--------------------------------------------*/
.newsCol {
	border-top: 1px solid var(--border-color-table);
	font-size: .875rem;
	display: flex;
	> span, > a, > a:link {
		color: var(--text-color);
		display: block;
		padding: 1em 0;
	}
	> span {
		padding-right: 1em;
		white-space: nowrap;
	}
	> a {
		flex: 1 0 0%;
	}
}
.newsRow:last-of-type .newsCol {
	border-bottom: 1px solid var(--border-color-table);
}

/*--------------------------------------------
  キャンペーン
--------------------------------------------*/
.contents {
	& .table {
		&.campaign {
			margin: 1em 0 0;
			&.data-table {
				font-size: .875rem;
			}
			& tbody tr {
				& td {
					border: none;
					border-bottom: 1px dashed var(--border-color-table);
					padding: 1em 0;
				}
				&:first-of-type td {
					border-top: 1px solid var(--border-color-table);
				}
				&:last-of-type td {
					border-bottom-style: solid;
				}
			}
			& .promotionLinkText {
					display: block;
					padding-left: 10px;
					position: relative;
					&::before {
						content: "";
						display: inline-block;
						background: no-repeat center center / contain;
						width: 6px;
						height: 7px;
						position: absolute;
						inset: 0;
						margin: 0.5em auto auto 0;
					}
				}
		}
	}
}

/*--------------------------------------------
  マイページトップ
--------------------------------------------*/
/* ナビ */
.mypageNav {
	display: grid;
	gap: 20px;
	grid-template-rows: repeat(6, 1fr);
	grid-template-columns: repeat(2, 1fr);
	& dt {
		& a {
			font-weight: bold;
			color: #fff;
			display: block;
			padding: 0.4em 2.25em;
			position: relative;
			&::before {
				filter: var(--filter-color_white);
			}
			&::after {
				content: "";
				display: inline-block;
				background: no-repeat center center / contain;
				width: 9px;
				height: 15px;
				position: absolute;
				inset: 0;
				margin: auto 0.5em auto auto;
			}
		}
	}
	& dd {
		font-size: 0.75rem;
		margin-top: 8px;
	}
}
@media screen and (max-width: 960px) {
	.mypageNav {
		grid-template-rows: unset;
		grid-template-columns: unset;
		grid-auto-flow: unset;
		& dt {
			& a {
				padding: 0.6em 2.25em;
			}
		}
		& dd {
			display: none;
		}
	}
}
/* ご利用ガイド・よくある質問 */
.mypageGuide, .mypageFaq {
	margin-top: 30px;
	& a, a:link {
		display: block;
		color: var(--text-color);
	}
	& .mypageGuideTitleWrap, & .mypageFaqTitleWrap {
		line-height: 1;		
		& a {
			padding: 18px 18px 18px calc(18px + 1.5em + 1em);
			position: relative;
			&::before {
				content: "";
				background: no-repeat center center / contain;
				width: 2.5em;
				height: 2.5em;
				display: inline-block;
				position: absolute;
				inset: 0;
				margin: auto 0 auto 10px
			}
		}
	}
	& .linksWrap {
		border: 1px solid;
		border-top: 0;
		padding: 18px 20px;
	}	
	& h3 {
		font-size: 1.06rem;
		font-weight: bold;
		margin-bottom: 5px;
		padding-left: 10px;
		position: relative;
		&::before {
			content: "";
			display: inline-block;
			background: no-repeat center center / contain;
			width: 6px;
			height: 7px;
			position: absolute;
			inset: 0;
			margin: auto auto auto 0;
		}
	}
	& .lead {
		font-size: 0.75rem;
	}
	& .links, & .featuredFaqLinks {
		line-height: 1;
		gap: 6px 20px;
		> li {
			display: inline-block;
			> a {
				color: #666;
				font-size: 0.75rem;
				display: block;
				line-height: 1.3;
				padding-left: 10px;
				position: relative;
				&::before {
					content: "";
					display: inline-block;
					background: no-repeat center center / contain;
					width: 6px;
					height: 7px;
					position: absolute;
					inset: 0;
					margin: 0.3em auto auto 0
				}
			}
		}
	}
}
/*ご利用ガイド*/
.mypageGuide {
	& .mypageGuideTitleWrap {
		& a {
			&::before {
				background-image: url("../../img/common/mypage/icon_file.svg");
			}
		}
	}
	& .links {
		display: grid;
		grid-template-rows: repeat(7, 1fr);
		grid-template-columns: repeat(2, 1fr);
		grid-auto-flow: column;
	}
}

/*よくある質問*/
.mypageFaq {
	& .mypageFaqTitleWrap {
		& a {
			&::before {
				background-image: url("../../img/common/mypage/icon_question.svg");
			}
		}
	}
	& h4 {
		font-size: 0.75rem;
		font-weight: bold;
		margin-bottom: 6px;
	}
	& .links {
		> li {
			margin: 0 2em 6px 0;
		}
	}
	& .featuredFaqWrap {
		background-color: #fff;
		line-height: 1;
		margin: 10px -10px 0;
		padding: 15px 10px;
	}
	& .featuredFaqLinks {
		display: grid;
		grid-template-rows: repeat(3, 1fr);
		grid-template-columns: repeat(2, 1fr);
		grid-auto-flow: column;
		> li {
			&:nth-child(5) {
				grid-area: 2 / 2 / 4 / 3;
			}
		}
	}
}
@media screen and (max-width: 960px) {
	.mypageGuide, .mypageFaq {
		display: none;
	}
}

/*--------------------------------------------
  注文履歴（定期お届け情報も共通）
--------------------------------------------*/
.contents { /*指定が当たらないものだけここに記述*/
	& .orderRow {
		border-radius: 3px;
		font-size: .875em;
	}
}
.orderRow {
	border: 1px solid;
	padding: 1em;
	+ .orderRow {
		margin-top: 20px;
	}
}
/* 注文内容 */
.orderHeader {
	margin-bottom: 15px;
	display: flex;
	flex-wrap: wrap;
	gap: 5px 1.5em;
	& label {
		font-weight: bold;
		+ .items {
			display: inline-block;
		}
	}
}
.orderNoItemWrap, .regularlyPeriodNoItemWrap {
	flex: 1 0 0%;
	& label {
		&::after {
			content: "：";
		}
	}
	& .orderNo, & .regularlyPeriodNo {
		font-weight: bold;
	}
}
/* 注文商品一覧 */
.rderDetailList, .reglOrderDetail {
	overflow: hidden;
	width: 100%;
}
.orderDetailRow {
	border-top: 1px solid var(--border-color-table);
	padding: 10px 0;
	display: flex;
	gap: 10px;
	&:first-child {
		border-top: none;
	}
}
/*注文商品 商品名の子要素*/
[class*="goodsInfo"i], [class*="goodsName" i] {
	& .childGoods, & .childGoodsName {
		padding-left: 1em;
		white-space: pre-wrap;
	}
}
/*お届け先*/
.destinationGroupField {
	background-color: var(--bg-color-l-gray);
	padding: 5px 0.8em;
	position: relative;
	& legend {
		font-weight: bold;
		position: absolute;
		&::after {
			content: "：";
			position: absolute;
			left: 3em;
		}
	}
	& .destinationGroup {
		padding-left: 4.25em;
	}
}
/*チェックボックス*/
.goodsSelectGroup {
	width: 13px;
	& .goodsSelectItemWrap {
		height: 100%;
		display: flex;
		align-items: center;
		& .items {
			display: inline-flex;
		}
		& input {
			margin: 0;
		}
	}
}
/*商品画像*/
.goodsImgItemWrap, .reglGoodsImgItemWrap {
	width: 75px;
}
/*商品情報*/
.goodsInfoGroup {
	flex: 1 0 0%;
	padding-right: 170px;
	position: relative;
	&:has(.writeReviewLinkItemWrap), &:has(.reviewWrittenMsgItemWrap) {
		min-height: 118px;
	}
}
/* 定期商品名 */
.reglGoodsName {
	font-weight: bold;
}
/*定期間隔*/
.reglTermPreLabel {
	&::after {
		content: "：";
	}
}
/*ボタン:お気に入りなど*/
.contents .goodsButtonArea {
	width: 160px;
	max-width: 100%;
	display: flex;
	flex-wrap: wrap;
	position: absolute;
	right: 0;
	top: 0;
	& .itemWrap {
		margin-bottom: 5px;
	}
	& a, & a.btn_1, span, .addedFavoriteMsg {
		padding: 3px 10px;
		display: flex;
		align-items: center;
		justify-content: center;
		max-width: 100%;
		min-width: 160px;
		width: clamp(200px, 100%, 400px);
		margin: 0;
		border-radius: 3px;
	}
}
.contents {
	/* お気に入り */
	& .addFavoriteLink, & .addFavoriteLink.btn_1 {
		background: #000;
		color: #fff;
		&::before {
			content: "\f004";
			font-family: "Font Awesome 5 Free";
			font-weight: bold;
			margin-right: 0.5em;
		}
	}
	/* レビュー */
	& .reviewLink, & .reviewLink.btn_1, & .writeReviewLink, & .writeReviewLink.btn_1 {
		background: var(--color-corporate);
		color: #fff;
	}
	/* もう一度注文 */
	& .addCartLink, & .addCartLink.btn_1 {
		color: #fff;
		&::before {
			content: "";
			background: no-repeat center center / contain;
			margin-right: 0.3em;
			width: 1.3em;
			height: 1.16em;
		}
	}
}
/* 注文ボタン */
/*選択した商品を前回のお届け先で*/
.selectGoodsReOrderGroup {
	margin: 10px 0;
}
/*この内容で再注文*/
input.btn_lg.reOrderButton[type="button"] {
	width: 160px;
	max-width: 400px;
	padding: 10px;
	margin: 10px 0 0 auto;
}
/*注文・定期の詳細を見るリンク*/
.orderFooterLayout, .reglOrderFooterLayout {
	text-align: right;
	padding-top: 10px;
	border-top: 1px solid var(--border-color-table);
	& a {
		display: inline-block;
		padding-left: 10px;
		position: relative;
		&::before {
			content: "";
			display: inline-block;
			background: no-repeat center center / contain;
			width: 6px;
			height: 7px;
			position: absolute;
			inset: 0;
			margin: 0.6em auto auto 0;
		}
	}
}
/* ページネーション */
.matrix-header, .matrix-footer {
	> .pagingResultsShow {
		margin-bottom: 10px;
	}
	& .pageInfo {
		font-size: .875rem;
		float: none;
		display: flex;
		align-items: center;
		flex-direction: row-reverse;
		& .pagingResultsShow {
			margin-right: auto;
		}
	}
}
.matrix-footer {
	& .pageInfo, > .pagingResultsShow {
		margin: 1em 0 0 0;
	}
}
@media screen and (max-width: 960px) {
	.orderList {
		overflow: hidden;
	}
	.orderRow {
		position: relative;
		margin-top: 40px;
		+ .orderRow {
			margin-top: 50px;
		}
	}
	/* 注文内容 */
	.orderHeader {
		flex-direction: column;
	}
	.orderNoItemWrap {
		flex: none;
		text-align: center;
		font-size: 1rem;
		& label {
			display: block;
			text-align: center;
			&::after {
				content: none;
			}
		}
	}
	.orderDateItemWrap, .dateAppointItemWrap {
		position: absolute;
		left: 0;
		top: -30px;
		& label {
			display: none;
		}
		& .orderDate, & .dateAppoint {
			font-weight: bold;
			display: block;
			border-left: 5px solid var(--text-color-accent-sub);
			line-height: 1.2;
			padding-left: 10px;
		}
	}
	.regularlyPeriodNoItemWrap {
		& span.regularlyPeriodNo {
			font-weight: normal;
			color: var(--text-color);
		}
	}
	/* 注文商品一覧 */
	/*チェックボックス*/
	.goodsSelectGroup {
		order: 1;
		width: 18px;
		& .goodsSelectItemWrap {
			align-items: flex-start;
			padding-top: 3px;
			& input {
				width: 18px;
				height: 18px;
			}
		}
	}
	/*商品情報*/
	.goodsInfoGroup {
		padding-right: 0;
	}
	/* 定期商品名 */
	.reglGoodsName {
		font-size: 1rem;
	}
	/*ボタン:お気に入りなど*/
	.contents .goodsButtonArea {
		margin-top: 5px;
		width: 100%;
		position: unset;
		& div {
			width: 100%;
		}
		& a, & a.btn_1. & span.btn_1 {
			min-width: unset;
			max-width: 250px;
		}
	}
	/* 注文ボタン */
	/*この内容で再注文*/
	input.btn_lg.reOrderButton[type="button"] {
		margin-right: auto;
		width: 80%;
	}
	/* ページネーション */
	.matrix-header, .matrix-footer {
		& .pageInfo {
			flex-wrap: wrap;
			flex-direction: column-reverse;
			justify-content: normal;
			& .pagingResultsShow {
				margin-bottom: 5px;
			}
		}
	}
}

/*--------------------------------------------
  定期お届け情報
--------------------------------------------*/
.bundleChangeDisableMessage {
	color: var(--text-color-alert);
}
@media screen and (max-width: 960px) {
	.bundleChangeDisableMessage {
		text-align: center;
		margin-bottom: 10px;
	}
}

/*--------------------------------------------
  注文履歴詳細・定期スケジュール詳細
--------------------------------------------*/
/* 共通 */
/*合計金額周り*/
.amountTotalContents {
	background-color: var(--bg-color-l-gray);
	margin-top: 30px;
	padding: 20px var(--screen-pd-lr);
	& :first-child {
		& .level_h2 {
			margin-top: 0;
		}
	}
}
#contents {
	& [class*="TotalGroup"] {
		margin-left: auto;
		margin-top: 1em;
		max-width: fit-content;
		min-width: 300px;
		width: 100%;
		& .th, & .td, & td {
			background: none;
			border-left: none;
			border-right: none;
			font-weight: bold;
			padding-left: 0;
			padding-right: 0;
			&[class*="totalAm"] {
				color: var(--text-color-alert);
				font-size: 1.1em;
			}
			& div, & span, & label {
				font-weight: inherit;
				white-space: nowrap;
			}
			&.breakdownTitleArea, &.breakdownResultsArea {
				border-top: 1px dashed #c0c1c2;
			}
		}
		& .th {
			width: auto;
		}
		& .td, & td {
			text-align: right;
			& .NUMBER:not(.createPoint, .pointDiscountAmt)::before {
				content: "￥";
			}
			& .suffixLabel:not(.createPointSuffixLabel, .pointDiscountAmtSuffixLabel) {
				display: none;
			}
		}
	}
	& [class*="TotalGroup"]:has(.breakdownArea) {
		& [class*="totalAm"] {
			& .th, & .td {
				border-bottom: none;
			}
		}
	}
	& #breakdownResults {
		& .breakdownResultsBreakdownNameCol {
			padding-right: 10px;
		}
		& td {
			border: none;
			padding: 0;
		}
	}
	& .orderPremiumGroup {
		& .level_h2 {
			font-size: var(--font-size-s);
		}
	}
}

.attensionMessage {
	display: block;
	font-size: var(--font-size-ss);
	margin-top: 1em;
}

@media screen and (max-width: 768px) {
	/* 共通 */
	/*合計金額周り*/
	.amountTotalContents {
		background: none;
		padding-top: 0;
		padding-bottom: 0;
	}
}
@media screen and (max-width: 600px) {
	/* 共通 */
	/*合計金額周り*/
	#contents {
		& [class*="TotalGroup"] {
			margin-left: 0;
			min-width: 100%;
			max-width: 100%;
			& .tr {
				&:has(+ [class*="totalAmount"]) {
					& .th, & .td, & td {
						border-width: 3px;
					}
				}
			}
			& .th, & .td, & td {
				&[class*="totalAmount"] {
					color: var(--text-color);
				}
			}
		}
	}
}

/*--------------------------------------------
  定期情報変更・定期まとめて決済方法変更
--------------------------------------------*/
/* ラジオボタン 変更する/しない */
.regularChangeButton {
	& .radioWrap {
		margin-bottom: 10px;
		text-align: right;
		& label {
			border: 1px solid #ccc;
			background: #F6F6F6;
			color: #333;
			font-size: 0.875rem;
			border-radius: 5px;
			padding: 2px 10px;
			display: inline-block;
			text-align: center;
			width: 115px;
			&:has(input[type="radio"]:focus), &:has(input[type="radio"]:checked) {
				background-color: var(--color-corporate);
				border-color: var(--color-corporate);
				color: #fff;
			}
		}
	}
}
@media screen and (max-width: 768px) {
	.regularChangeButton {
		& .radioWrap {
			& label {
				padding: 8px 10px;
			}
		}
	}
}
@media screen and (max-width: 600px) {
	/* ラジオボタン 変更する/しない */
	.contents .regularChangeButton {
		& .radioWrap {
			& .items {
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
				gap: 10px;
			}
			& label {
				margin: 0;
				text-align: center;
				width: calc(100% / 2 - 5px);
			}
			&::before, &::after {
				content: none;
			}
			& #deliveryDateChange_template {
				width: 100%;
				& label {
					width: 100%;
				}
			}
		}
	}
}