/*===============================
MARK: root 
=================================*/
:root {
	--fz10: 0.625rem;
	--fz12: 0.75rem;
	--fz13: 0.8125rem;
	--fz14: 0.875rem;
	--fz16: 1rem;
	--fz17: 1.0625rem;
	--fz18: 1.125rem;
	--fz20: 1.25rem;
	--fz22: 1.375rem;
	--fz24: 1.5rem;
	--fz26: 1.625rem;
	--fz28: 1.75rem;
	--fz30: 1.875rem;
	--fz32: 2rem;
	--fz34: 2.125rem;
	--fz36: 2.25rem;
	--fz38: 2.375rem;
	--fz40: 2.5rem;
	--transform-center: translate(-50%, -50%);
}

/*===============================
MARK: common
=================================*/
html {
	overflow-x: hidden;
}

body {
	position: relative;
	overflow-x: hidden;
	font-family: 'Noto Sans JP', 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN',
		'Hiragino Sans', Meiryo, sans-serif;
	font-weight: 500;
	-webkit-font-smoothing: antialiased;
	color: #0d3d77;
	font-display: swap;
	background-color: #fdf6f1;
}

main {
	overflow-x: hidden;
}

a {
	transition: 0.3s;
}

a:hover {
	opacity: 0.8;
}

img {
	display: block;
	width: 100%;
}

.d-flex {
	display: flex;
	align-items: start;
	justify-content: start;
}

.tb-content {
	display: none;
}

.sp-content {
	display: none;
}

.indent1em {
	text-indent: -1em;
	margin-left: 1em;
}

.indent2em {
	text-indent: -2em;
	margin-left: 2em;
}

.text-center {
	text-align: center !important;
}

.text-right {
	text-align: right !important;
}

.c-white,
.c-white * {
	color: #fff;
}

.container {
	margin-inline: auto;
	width: min(100%, 1140px);
	padding-inline: 20px;
}

/*===============================
MARK: ボタン
=================================*/

/*===============================
MARK: header
=================================*/
.site-header {
	position: absolute;
	top: 34px;
	left: 34px;
	padding: 0;
	width: 100%;
	z-index: 1;
}

.site-logo {
	position: absolute;
	display: inline-block;
	width: clamp(105px, 15%, 205px);
}

.site-logo img {
	max-width: 100%;
}

/*===============================
MARK: MV
=================================*/
#mv {
	position: relative;
	z-index: 0;
}

.mv-image {
	margin-inline: auto;
	overflow: hidden;
}

.mv-image img {
	width: 100%;
	height: 100%;
}

.page-ttl {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	visibility: hidden;
}

.separator {
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	height: 7%;
	background: url(../images/separator.png);
	background-repeat: repeat-x;
	background-position: bottom;
	background-size: contain;
}

/*===============================
MARK: TOP-CONTENT
=================================*/

.page-content {
	position: relative;
	padding-top: 20px;
}

.page-content::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 85%;
	background: #fff5cc;
	background: linear-gradient(
		0deg,
		rgba(255, 245, 204, 1) 0%,
		rgba(208, 190, 28, 1) 43%,
		rgba(225, 201, 137, 1) 100%
	);
	z-index: -1;
}

.section-inner {
	background: #fff;
	border: 14px solid #f15e35;
	border-radius: 90px;
	box-shadow: 0 3px 16px rgba(0, 0, 0, 0.16);
	margin-top: 90px;
}

#otoshidama01 .section-inner {
	padding-bottom: 40px;
	margin-top: 10px;
}

#otoshidama02 .section-inner,
#otoshidama03 .section-inner {
	padding-bottom: 40px;
}

.section-heading {
	position: relative;
	padding-block: 60px 25px;
}

.section-heading .number {
	position: absolute;
	bottom: 50%;
	right: 79%;
	width: 25%;
}

#otoshidama03 .section-heading .number {
	bottom: 36%;
}

.section-heading h2 {
	color: #013f16;
	font-weight: 800;
	font-size: 43px;
	line-height: 1.4;
	padding-inline: 15px;
}

.section-heading h2 img {
	max-width: 606px;
	margin-inline: auto;
}

#otoshidama01 .row-01 {
	gap: 25px;
	padding-inline: 70px;
}

#otoshidama01 .row-01 > div {
	flex: 1;
}

.price {
	color: #ea3e0d;
	font-weight: 700;
}

.price-ttl {
	border: 2px solid #ea3e0d;
	font-size: var(--fz28);
	padding: 0 15px 2px 15px;
}

.price .attention {
	font-size: var(--fz30);
	margin-top: 5px;
}

.price-main {
	font-size: 80px;
	color: #ff3900;
	filter: drop-shadow(3px 7px 0 rgba(0, 0, 0, 0.16));
	line-height: 1.4;
	margin-top: -0.2em;
	margin-bottom: 5px;
}

.price-discount img {
	max-width: 378px;
	margin-inline: auto;
}

.product {
	position: relative;
}

.product .item-wrap {
	position: relative;
}

.product .badge {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	bottom: 88%;
	left: 85%;
	background-color: #ea3e0d;
	color: #fff;
	border-radius: 50%;
	width: 99px;
	height: 99px;
	font-size: 21px;
	font-weight: 700;
	z-index: 0;
}

.product .notice {
	background: #fdf6f1;
	color: #ea3e0d;
	font-weight: 700;
	font-size: var(--fz20);
	border-radius: 6px;
	margin-top: 35px;
	text-align: center;
	padding: 7px 5px;
}

#otoshidama01 .row-02 {
	margin-top: 60px;
	padding-inline: 70px;
}

#otoshidama01 .row-02 h3 {
	background: #eef7ff;
	font-size: 25px;
	border-radius: 50em;
	padding: 9px 1em;
	margin-bottom: 15px;
}

.point {
	gap: 34px;
}

.point-item {
	flex: 1;
}

.point-item h4 {
	font-size: 25px;
	line-height: 1.7;
	margin-bottom: 20px;
}

.point-item .detail {
	line-height: 2;
	margin-top: 7px;
}

.icon-list {
	list-style: none;
	gap: 25px;
	margin-top: 45px;
	align-items: center;
	justify-content: center;
	margin-bottom: 40px;
}

.promotion {
	background: #f15e35;
	color: #fff;
	font-size: 17px;
	padding: 8px 10px 13px 10px;
	font-weight: 700;
	line-height: 1.9;
	margin-bottom: 30px;
}

.promotion .notice {
	font-size: 15px;
}

.campaign {
	padding-inline: 20px;
}

.bnr-wrap {
	position: relative;
	margin-inline: 7%;
}

.bnr-wrap .badge {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	bottom: 60%;
	right: 93%;
	background-color: #ffe300;
	color: #ff3900;
	border-radius: 50%;
	width: 110px;
	height: 110px;
	font-size: 22px;
	font-weight: 700;
	text-align: center;
	line-height: 1.3;
	z-index: 0;
}

.campaign .notice {
	color: #332a23;
	width: fit-content;
	margin-inline: auto;
	font-weight: 500;
	line-height: 2;
	margin-top: 30px;
}

#otoshidama02 .row-01 {
	gap: 25px;
	padding-inline: 70px;
	margin-bottom: 30px;
}

#otoshidama02 .price {
	flex: 1;
}

#otoshidama02 .product {
	width: 43%;
}

#otoshidama02 .price-discount {
	gap: 35px;
	align-items: stretch;
	margin-top: 20px;
}

.fukidashi {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: end;
	background: #ea3e0d;
	color: #fff;
	border-radius: 6px;
	font-size: 37px;
	line-height: 1.2;
	padding: 20px 14px 18px 57px;
}

.fukidashi::after {
	content: '';
	display: block;
	width: 20px;
	height: 19px;
	background: #ea3e0d;
	clip-path: polygon(0 0, 0 100%, 100% 50%);
	position: absolute;
	top: 50%;
	left: calc(100% - 4px);
	transform: translateY(-50%);
}

.fukidashi .badge {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	bottom: 5%;
	right: 77%;
	background-color: #e2d567;
	border-radius: 50%;
	width: 108px;
	height: 108px;
	font-size: 22px;
	font-weight: 700;
	text-align: center;
	line-height: 1.3;
	z-index: 0;
}

.fukidashi .badge img {
	width: 3.2em;
}

#otoshidama02 .price-discount .img-wrap {
	flex: 1;
}

#otoshidama02 .product .item-wrap img {
	max-width: 306px;
	margin-inline: auto;
}

#otoshidama03 {
	padding-bottom: 40px;
}

#otoshidama03 .row-01 {
	padding-inline: 50px;
	margin-bottom: 30px;
}

.subitem-list {
	list-style: none;
	gap: 35px;
	align-items: stretch;
	justify-content: center;
	margin-top: 15px;
}

.subitem-list li {
	flex: 1;
	color: #013f16;
}

.subitem-list .item-inner {
	border: 4px solid #d0be1c;
	border-radius: 30px;
	background: #cbeefd;
	background: linear-gradient(0deg, rgba(203, 238, 253, 1) 0%, rgba(255, 255, 255, 1) 100%);
	padding: 15px 15px 30px 15px;
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: 332px;
}

.subitem-list h4 {
	font-size: var(--fz30);
	margin-bottom: 20px;
}

.subitem-list li:nth-child(1) .item-inner {
	padding-inline: 25px;
}

.subitem-list li:nth-child(2) img {
	max-height: 206px;
}

.subitem-list li:nth-child(3) .item-inner {
	padding-right: 20px;
}

.item-name {
	font-weight: 700;
	font-size: var(--fz20);
	margin-top: 10px;
}

.sub-price {
	margin-top: 15px;
}

.subitem-list li:nth-child(1) .sub-price img,
.subitem-list li:nth-child(3) .sub-price img {
	max-width: 154px;
	margin-inline: auto;
}

.subitem-list li:nth-child(2) .sub-price img {
	max-width: 189px;
	margin-inline: auto;
}

#link {
	background-color: #fdf6f1;
}

#link h2 img {
	max-width: 587px;
	margin-inline: auto;
}

#link .btn-wrap {
	justify-content: center;
	padding-bottom: 80px;
	margin-top: 30px;
	gap: 80px;
}

#link .btn-wrap a {
	display: block;
	max-width: 400px;
}

/*===============================
MARK: footer
=================================*/

.site-footer {
	background-color: #fdf6f1;
}

.site-footer .container {
	position: relative;
}

.copyright {
	position: relative;
	padding-bottom: 70px;
	font-size: 14px;
	font-weight: 400;
	text-align: center;
	color: #013f16;
	z-index: 1;
}
