@charset "UTF-8";
body, p, ul, ol, h1,
h2, input {
	margin: 0;
}
ul, ol {
	padding: 0;
}
li {
	list-style: none;
}
a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
img {
	vertical-align: middle;
}
input {
	vertical-align: middle;
}
@font-face {
	font-family: "hpg-sp-webfont";
	font-style: normal;
	font-weight: normal;
	src: url("/SYS/common/fonts/hpg-sp-webfont.eot") format("embedded-opentype"),
	     url("/SYS/common/fonts/hpg-sp-webfont.ttf") format("truetype"),
	     url("/SYS/common/fonts/hpg-sp-webfont.woff") format("woff"),
	     url("/SYS/common/fonts/hpg-sp-webfont.svg") format("svg");
}
*, *::before,
*::after {
	box-sizing: border-box;
}
div, li, dl, dt, dd,
table, th, td, img,
h3, h4, h5, h6, form,
select {
	margin: 0;
}
body, div, p, li, dl,
dt, dd, table, th,
td, img, h1, h2, h3,
h4, h5, h6, form,
select {
	padding: 0;
}
select {
	vertical-align: middle;
	-webkit-appearance: none;
}
table {
	border-collapse: collapse;
	border: none;
	border-spacing: 0;
}
ol {
	list-style: none;
}
img, picture {
	max-width: 100%;
	display: block;
}
address {
	font-style: normal;
}
body, p, ul, ol, h1,
h2, input {
	margin: 0;
}
ul, ol {
	padding: 0;
}
li {
	list-style: none;
}
a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
img {
	vertical-align: middle;
}
input {
	vertical-align: middle;
}
body {
	font-family: Helvetica, Arial, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", sans-serif;
	line-height: 1.4;
	color: #4E4E4E;
}
a {
	word-break: break-all;
	text-decoration: none;
	color: #1470CC;
}
@media (max-width: 768px) {
	a {
	 color: #3BA3CD;
	}
	a:hover {
	 text-decoration: none;
	}
}
@media (max-width: 768px) {
	.mainInner {
	 margin: 0;
	}
}
@keyframes changeSceneKv {
	0% {
	 opacity: 0;
	}
	13% {
	 opacity: 1;
	}
	93% {
	 opacity: 1;
	}
	100% {
	 opacity: 0.1;
	}
}
@keyframes fadeInSP {
	0% {
	 opacity: 0;
	 transform: translateY(30px);
	}
	100% {
	 opacity: 1;
	 transform: translateY(0);
	}
}
@keyframes fadeInSmallFood {
	0% {
	 opacity: 0;
	 transform: translateY(30px);
	}
	14% {
	 opacity: 1;
	 transform: translateY(0);
	}
	85% {
	 opacity: 1;
	 transform: translateY(0);
	}
	100% {
	 opacity: 0;
	 transform: translateY(-30px);
	}
}
@keyframes fadeInLargeFood {
	0% {
	 opacity: 0;
	 transform: translateY(30px);
	}
	15% {
	 opacity: 1;
	 transform: translateY(0);
	}
	92% {
	 opacity: 1;
	 transform: translateY(0);
	}
	100% {
	 opacity: 0;
	 transform: translateY(-30px);
	}
}
@keyframes fadeInBgRightFood {
	0% {
	 opacity: 0;
	 transform: translate(15px, 15px);
	}
	100% {
	 opacity: 1;
	 transform: translate(0, 0);
	}
}
@keyframes fadeInBgLeftFood {
	0% {
	 opacity: 0;
	 transform: translate(-15px, 15px);
	}
	100% {
	 opacity: 1;
	 transform: translate(0, 0);
	}
}
body {
	min-width: 1440px;
	font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", sans-serif;
	font-size: 16px;
	color: #1E212D;
	line-height: 1.6;
}
@media (max-width: 768px) {
	body {
	 min-width: 100%;
	}
}
@media (max-width: 768px) {
	.pcBr {
	 display: none;
	}
}
@media (min-width: 769px) {
	.spBr {
	 display: none;
	}
}
.mainContent {
	min-width: 1440px;
	background-color: #FFFBF0;
	font-feature-settings: 'palt' on;
	overflow: hidden;
}
@media (max-width: 768px) {
	.mainContent {
	 min-width: auto;
	}
}
.sectionHeading {
	display: flex;
	justify-content: center;
}
.descriptionTitle {
	font-size: 32px;
	font-weight: bold;
	color: #1E212D;
}
@media (max-width: 768px) {
	.descriptionTitle {
	 font-size: 20px;
	}
}
.descriptionText {
	font-size: 16px;
	color: #1E212D;
	line-height: 27px;
}
@media (max-width: 768px) {
	.descriptionText {
	 font-size: 14px;
	 line-height: 20px;
	}
}
.attentionWrap > li {
	font-size: 10px;
	color: #666666;
	letter-spacing: 0.5px;
}
@media (max-width: 768px) {
	.attentionWrap {
	 flex-wrap: wrap;
	 justify-content: initial;
	}
	.attentionWrap > li + li {
	 margin: 0;
	}
}
.appBtnWrap {
	display: flex;
	align-items: center;
	gap: 20px;
}
.appBtnWrap > a {
	display: block;
}
.appBtnWrap .sp {
	display: none;
}
@media (max-width: 768px) {
	.appBtnWrap .pc {
	 display: none;
	}
	.appBtnWrap .sp {
	 display: block;
	}
}
.linkTextSpace {
	padding-left: 8px;
}
@media (max-width: 768px) {
	.linkTextSpace {
	 padding-left: 4px;
	}
}
.textRed {
	color: #D0111B;
}
.headerWrap {
	padding: 20px 0;
	border-bottom: 1px solid #CCCCCC;
}
@media (max-width: 768px) {
	.headerWrap {
	 padding: 8px 0;
	}
}
.headerWrap .headerContent {
	display: flex;
	max-width: 1280px;
	margin: auto;
}
.headerWrap .headerContent img {
	max-width: 100%;
}
@media (max-width: 768px) {
	.headerWrap .headerContent {
	 max-width: 100%;
	 padding: 0 10px;
	}
	.headerWrap .headerContent img {
	 width: 94px;
	}
}
.kvSectionWrap {
	display: flex;
	height: 820px;
	padding: 48px 0 8px 70px;
}
@media (min-width: 1920px) {
	.kvSectionWrap {
	 background-size: cover;
	}
}
@media (min-width: 769px) {
	.kvSectionWrap {
	 max-width: 1440px;
	 margin: auto;
	}
}
@media (max-width: 768px) {
	.kvSectionWrap {
	 display: block;
	 height: 100%;
	 padding: 48px 0 0;
	}
}
@media (min-width: 769px) {
	.kvSectionWrap .kvSectionContents {
	 margin-right: 28px;
	}
}
@media (max-width: 768px) {
	.kvSectionWrap .kvSectionContents {
	 max-width: 500px;
	 margin: auto;
	}
}
.kvSectionWrap .kvArea {
	position: relative;
	width: 100%;
	transform: translate3d(0, 0, 0);
}
@media (max-width: 768px) {
	.kvSectionWrap .kvArea {
	 max-width: 500px;
	 margin: auto;
	 aspect-ratio: 375/479;
	}
}
.kvSectionWrap .kvSceneWrap {
	position: absolute;
	top: 75px;
	left: 47px;
	width: 100%;
}
@media (max-width: 768px) {
	.kvSectionWrap .kvSceneWrap {
	 top: 2.50522%;
	 left: -26.93333%;
	 width: 107.73%;
	}
}
.kvSectionWrap .kvSceneWrap .kvScene {
	position: relative;
	z-index: 1;
}
.kvSectionWrap .kvSceneWrap .kvScene .scene1,
.kvSectionWrap .kvSceneWrap .kvScene .scene2,
.kvSectionWrap .kvSceneWrap .kvScene .scene3 {
	opacity: 0;
}
.kvSectionWrap .kvSceneWrap .kvScene > li {
	position: absolute;
	inset: 0;
}
.kvSectionWrap .kvSceneWrap .kvScene > li.fadeIn {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	animation: changeSceneKv 7.5s linear forwards;
}
.kvSectionWrap .kvSmallFoodWrap {
	position: absolute;
	top: 0;
	left: 457px;
	z-index: 2;
	width: 100%;
}
@media (max-width: 768px) {
	.kvSectionWrap .kvSmallFoodWrap {
	 left: 61.33333%;
	 width: 32%;
	}
}
.kvSectionWrap .kvSmallFoodWrap .kvSmallFood {
	position: relative;
	z-index: 1;
}
.kvSectionWrap .kvSmallFoodWrap .kvSmallFood .scene1,
.kvSectionWrap .kvSmallFoodWrap .kvSmallFood .scene2,
.kvSectionWrap .kvSmallFoodWrap .kvSmallFood .scene3 {
	opacity: 0;
}
.kvSectionWrap .kvSmallFoodWrap .kvSmallFood > li {
	position: absolute;
	inset: 0;
}
.kvSectionWrap .kvSmallFoodWrap .kvSmallFood > li.fadeIn {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	animation: fadeInSmallFood 7s ease-in-out 0.5s forwards;
}
.kvSectionWrap .kvLargeFoodWrap {
	position: absolute;
	top: 398px;
	left: 0;
	z-index: 2;
	width: 100%;
}
@media (max-width: 768px) {
	.kvSectionWrap .kvLargeFoodWrap {
	 top: 45.51148%;
	 left: -12.53333%;
	 width: 42.66%;
	}
}
.kvSectionWrap .kvLargeFoodWrap .kvLargeFood {
	position: relative;
	z-index: 1;
}
.kvSectionWrap .kvLargeFoodWrap .kvLargeFood .scene1,
.kvSectionWrap .kvLargeFoodWrap .kvLargeFood .scene2,
.kvSectionWrap .kvLargeFoodWrap .kvLargeFood .scene3 {
	opacity: 0;
}
.kvSectionWrap .kvLargeFoodWrap .kvLargeFood > li {
	position: absolute;
	inset: 0;
}
.kvSectionWrap .kvLargeFoodWrap .kvLargeFood > li.fadeIn {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	animation: fadeInLargeFood 6.5s ease-in-out 1s forwards;
}
.kvSectionWrap .smartphone {
	opacity: 0;
	position: absolute;
	bottom: 0;
	z-index: 2;
	width: 73.6%;
	animation: fadeInSP 1s ease-in-out 0.5s forwards;
}
@media (min-width: 769px) {
	.kvSectionWrap .smartphone {
	 left: 497px;
	}
}
@media (max-width: 768px) {
	.kvSectionWrap .smartphone {
	 right: 0;
	}
}
.kvSectionWrap .kvTextContents {
	width: 435px;
	padding: 70px 17px 0 0;
}
@media (max-width: 768px) {
	.kvSectionWrap .kvTextContents {
	 width: auto;
	 padding: 0 24px 16px;
	}
}
.kvSectionWrap .titleHead {
	display: flex;
	justify-content: center;
	padding-bottom: 32px;
}
.kvSectionWrap .appBtnContents {
	margin-top: 32px;
	padding: 32px 46px;
	border-radius: 20px;
	background-color: #FFFFFF;
	text-align: center;
}
.kvSectionWrap .appBtnContents > * + * {
	display: flex;
	gap: 20px;
}
.kvSectionWrap .appBtnContents > a {
	display: block;
}
.kvSectionWrap .appBtnContents .sp {
	display: none;
}
@media (max-width: 768px) {
	.kvSectionWrap .appBtnContents {
	 display: none;
	 flex-direction: column;
	 border-radius: 15px;
	}
	.kvSectionWrap .appBtnContents > * + * {
	 margin: 8px 0 0;
	}
	.kvSectionWrap .appBtnContents .pc {
	 display: none;
	}
	.kvSectionWrap .appBtnContents .sp {
	 display: block;
	}
}
@media (min-width: 769px) {
	.kvSectionWrap .spAppBtnContents {
	 display: none;
	}
}
@media (max-width: 768px) {
	.kvSectionWrap .spAppBtnContents {
	 margin: 0 24px;
	 padding: 16px 24px;
	 border-radius: 10px;
	 background-color: #FFFFFF;
	 text-align: center;
	}
}
.kvSectionWrap .downloadIcon {
	padding-top: 24px;
}
@media (max-width: 768px) {
	.kvSectionWrap .downloadIcon {
	 display: flex;
	 gap: 12px;
	 justify-content: center;
	 padding-top: 16px;
	}
}
@media (max-width: 768px) and (min-width: 769px) {
	.kvSectionWrap .downloadIcon {
	 display: none;
	}
}
.kvSectionWrap .downloadText {
	font-size: 24px;
	font-weight: bold;
	color: #1E212D;
	text-align: center;
}
@media (max-width: 768px) {
	.kvSectionWrap .downloadText {
	 font-size: 18px;
	 letter-spacing: 0.9px;
	}
}
.kvSectionWrap .smallFontText {
	font-size: 20.4px;
	letter-spacing: 1.02px;
}
@media (max-width: 768px) {
	.kvSectionWrap .smallFontText {
	 font-size: 14px;
	 letter-spacing: 0.7px;
	}
}
.kvSectionWrap .attentionWrap {
	margin-top: 72px;
}
.kvSectionWrap .attentionWrap li + li {
	margin-top: 3px;
}
@media (max-width: 768px) {
	.kvSectionWrap .attentionWrap {
	 display: none;
	}
}
@media (min-width: 769px) {
	.kvSectionWrap .spAttentionWrap {
	 display: none;
	}
}
@media (max-width: 768px) {
	.kvSectionWrap .spAttentionWrap {
	 padding-top: 32px;
	 margin: 0 24px;
	 font-size: 10px;
	 color: #666666;
	}
	.kvSectionWrap .spAttentionWrap li + li {
	 padding-top: 8px;
	}
}
@media (min-width: 769px) {
	.sectionContentsWrap {
	 width: 1050px;
	 margin: auto;
	}
}
.reputationSectionWrap {
	position: relative;
	padding: 80px 0 157px;
	text-align: center;
}
@media (max-width: 768px) {
	.reputationSectionWrap {
	 max-width: 500px;
	 margin: auto;
	 padding: 80px 27px 128px;
	 text-align: left;
	}
}
@media (max-width: 768px) {
	.reputationSectionWrap .descriptionTitle {
	 text-align: center;
	}
}
.reputationSectionWrap .descriptionText {
	margin-top: 14px;
}
@media (max-width: 768px) {
	.reputationSectionWrap .descriptionText {
	 margin-top: 12px;
	}
}
.reputationSectionWrap .imageWrap {
	display: flex;
	justify-content: center;
	margin-top: 48px;
}
@media (min-width: 769px) {
	.reputationSectionWrap .imageWrap > * + * {
	 margin-left: 48px;
	}
}
@media (max-width: 768px) {
	.reputationSectionWrap .imageWrap {
	 gap: 24px;
	 flex-direction: column;
	 align-items: center;
	 margin-top: 48px;
	}
}
.reputationSectionWrap .reserveImage > img,
.reputationSectionWrap .storeImage > img,
.reputationSectionWrap .satisfyImage > img {
	max-width: inherit;
}
.reputationSectionWrap .reserveImage .sp,
.reputationSectionWrap .storeImage .sp,
.reputationSectionWrap .satisfyImage .sp {
	display: none;
}
@media (max-width: 768px) {
	.reputationSectionWrap .reserveImage .pc,
	.reputationSectionWrap .storeImage .pc,
	.reputationSectionWrap .satisfyImage .pc {
	 display: none;
	}
	.reputationSectionWrap .reserveImage .sp,
	.reputationSectionWrap .storeImage .sp,
	.reputationSectionWrap .satisfyImage .sp {
	 display: block;
	}
}
.reputationSectionWrap .attentionWrap {
	margin-top: 32px;
	text-align: center;
}
@media (max-width: 768px) {
	.reputationSectionWrap .attentionWrap .linkTextSpace {
	 padding-left: 0;
	}
}
.reputationSectionWrap .bgFood {
	opacity: 0;
	position: absolute;
	top: 150px;
	right: -405px;
	z-index: 1;
}
@media (max-width: 768px) {
	.reputationSectionWrap .bgFood {
	 top: 391px;
	 right: -23.4666%;
	 width: 44.53333%;
	}
}
.reputationSectionWrap .bgFood.fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgRightFood 0.5s ease-in-out 0s forwards;
}
.pointSectionWrap {
	position: relative;
	padding-bottom: 165px;
}
@media (max-width: 768px) {
	.pointSectionWrap {
	 padding-bottom: 128px;
	}
}
.pointSectionWrap .pointSectionContents {
	margin-top: 48px;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointSectionContents {
	 padding: 0 20px;
	}
}
.pointSectionWrap .pointSectionContents .pointSectionInner {
	width: 788px;
	margin: 0 auto;
	padding: 48px 167px;
	border-radius: 30px;
	background-color: #FFFFFF;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointSectionContents .pointSectionInner {
	 width: auto;
	 margin: 0;
	 padding: 32px 36px;
	 border-radius: 15px;
	}
}
.pointSectionWrap .pointSectionContents .siteLogos {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	justify-content: center;
	width: 378px;
	margin: 0 auto;
	padding-top: 36px;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointSectionContents .siteLogos {
	 gap: 24px 33px;
	 width: 233px;
	 padding-top: 32px;
	}
}
.pointSectionWrap .pointSectionContents .relatedSiteInfoText {
	font-size: 24px;
	font-weight: bold;
	color: #666666;
	text-align: center;
	letter-spacing: 1.2px;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointSectionContents .relatedSiteInfoText {
	 font-size: 20px;
	 letter-spacing: 1px;
	}
}
.pointSectionWrap .pointSectionContents .relatedSiteInfoText.sp {
	display: none;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointSectionContents .relatedSiteInfoText.pc {
	 display: none;
	}
	.pointSectionWrap .pointSectionContents .relatedSiteInfoText.sp {
	 display: block;
	}
}
.pointSectionWrap .pointSectionContents .attentionWrap {
	margin-top: 32px;
	text-align: center;
}
.pointSectionWrap .pointSectionContents .attentionWrap li + li {
	padding-top: 8px;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointSectionContents .attentionWrap li + li {
	 padding-top: 4px;
	}
}
.pointSectionWrap .pointImg li {
	position: absolute;
}
.pointSectionWrap .pointImg li:nth-of-type(1) {
	top: 226px;
	left: 89px;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointImg li:nth-of-type(1) {
	 top: 157px;
	 left: 10px;
	}
}
.pointSectionWrap .pointImg li:nth-of-type(2) {
	top: 426px;
	left: 200px;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointImg li:nth-of-type(2) {
	 top: 477px;
	 left: 44px;
	}
}
.pointSectionWrap .pointImg li:nth-of-type(3) {
	top: 273px;
	right: 89px;
}
@media (max-width: 768px) {
	.pointSectionWrap .pointImg li:nth-of-type(3) {
	 top: 245px;
	 right: 10px;
	}
}
.pointSectionWrap .bgFood {
	opacity: 0;
	position: absolute;
	top: 351px;
	left: -226px;
	z-index: 1;
}
.pointSectionWrap .bgFood.fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgLeftFood 0.5s ease-in-out 0s forwards;
}
.usefulSection {
	position: relative;
}
@media (max-width: 768px) {
	.usefulSection {
	 max-width: 500px;
	 margin: 0 auto;
	}
}
@media (max-width: 768px) {
	.usefulSection section {
	 margin-bottom: 64px;
	}
}
.usefulSection .bgFood img {
	opacity: 0;
	position: absolute;
	z-index: 1;
}
.usefulSection .bgFood img:nth-of-type(1) {
	top: -13px;
	left: -144px;
}
.usefulSection .bgFood img:nth-of-type(1).fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgLeftFood 0.5s ease-in-out 0s forwards;
}
.usefulSection .bgFood img:nth-of-type(2) {
	top: -164px;
	right: -411px;
}
.usefulSection .bgFood img:nth-of-type(2).fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgRightFood 0.5s ease-in-out 0s forwards;
}
.usefulSection .bgFood img:nth-of-type(3) {
	top: 1084px;
	left: -367px;
}
.usefulSection .bgFood img:nth-of-type(3).fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgLeftFood 0.5s ease-in-out 0s forwards;
}
.usefulSection .bgFood img:nth-of-type(4) {
	top: 2300px;
	right: -327px;
}
.usefulSection .bgFood img:nth-of-type(4).fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgRightFood 0.5s ease-in-out 0s forwards;
}
.usefulSection .bgFood img:nth-of-type(5) {
	top: 2988px;
	left: -384px;
}
.usefulSection .bgFood img:nth-of-type(5).fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgLeftFood 0.5s ease-in-out 0s forwards;
}
@media (max-width: 768px) {
	.usefulSection .bgFood {
	 display: none;
	}
}
.searchSection {
	display: grid;
	gap: 0 71px;
	grid-template-areas: "img balloon" "img body";
	grid-template-columns: 465px 1fr;
	width: 950px;
	margin: auto;
}
@media (max-width: 768px) {
	.searchSection {
	 padding: 0 24px;
	}
}
.searchSection.reverse {
	grid-template-areas: "balloon img" "body img";
	grid-template-columns: 1fr 465px;
	gap: 0;
}
@media (max-width: 768px) {
	.searchSection.reverse {
	 grid-template-areas: "balloon img" "body body";
	 grid-template-columns: 1fr 51.98777%;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
@media (max-width: 768px) {
	.searchSection {
	 grid-template-areas: "img balloon" "body body";
	 grid-template-columns: 51.98777% 1fr;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
.searchSection > .balloon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: column;
	grid-area: balloon;
	align-self: flex-end;
	position: relative;
	z-index: 2;
	width: 150px;
	margin-bottom: 26px;
	border-radius: 50%;
	background-color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	color: #D0111B;
	text-align: center;
	filter: drop-shadow(0 5px 10px rgba(98, 98, 98, 0.1));
	aspect-ratio: 1 / 1;
}
@media (min-width: 769px) {
	.searchSection > .balloon.reverse {
	 margin-left: 71px;
	}
}
@media (max-width: 768px) {
	.searchSection > .balloon {
	 align-self: center;
	 justify-self: flex-start;
	 width: 100%;
	 font-size: 14px;
	}
}
.searchSection > .balloon::before {
	display: block;
	width: 45px;
	height: 45px;
	background-image: url("/doc/app/images/pc/icn_search.png");
	background-size: contain;
	content: "";
}
@media (max-width: 768px) {
	.searchSection > .balloon::before {
	 width: 40px;
	 height: 40px;
	}
}
.searchSection > .balloon::after {
	display: block;
	position: absolute;
	right: 0;
	bottom: -12px;
	left: 0;
	width: 10%;
	height: 10%;
	margin: auto;
	background-color: #FFFFFF;
	content: "";
	clip-path: polygon(0 0, 50% 100%, 100% 0%);
}
@media (max-width: 768px) {
	.searchSection > .balloon::after {
	 bottom: 6%;
	 left: 8%;
	 margin: 0;
	 transform: rotate(46deg);
	}
}
.searchSection > .img {
	display: flex;
	grid-area: img;
	justify-content: center;
	position: relative;
	z-index: 1;
}
@media (max-width: 768px) {
	.searchSection > .img {
	 justify-content: flex-start;
	}
	.searchSection > .img.reverse {
	 margin-left: 0;
	}
}
.searchSection > .img::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	width: 465px;
	margin: auto;
	background-color: #FAF7E2;
	border-radius: 50%;
	content: "";
	aspect-ratio: 1 / 1;
}
@media (max-width: 768px) {
	.searchSection > .img::before {
	 left: -41.17647%;
	 width: 182.35294%;
	 margin: 0;
	}
}
.searchSection > .img .pcImgContent {
	box-shadow: 0 10px 40px rgba(98, 98, 98, 0.16);
	border-radius: 30px;
}
@media (min-width: 769px) {
	.searchSection > .img .pcImgContent {
	 margin: 40px 0;
	}
}
.searchSection > .body {
	grid-area: body;
}
@media (min-width: 769px) {
	.searchSection > .body {
	 margin-top: 6px;
	 padding-left: 18px;
	}
}
@media (max-width: 768px) {
	.searchSection > .body {
	 padding-top: 12px;
	}
}
@media (min-width: 769px) {
	.searchSection > .body.reverse {
	 padding-left: 89px;
	}
}
.searchSection > .body .descriptionText {
	width: 395px;
	margin-top: 16px;
	font-size: 16px;
	line-height: 25.6px;
	letter-spacing: 0.8px;
}
@media (max-width: 768px) {
	.searchSection > .body .descriptionText {
	 width: auto;
	}
}
.searchSection > .body .attentionWrap {
	margin-top: 16px;
}
@media (max-width: 768px) {
	.searchSection {
	 margin-top: 48px;
	}
	.searchSection > .balloon::before {
	 background-image: url("/doc/app/images/sp/icn_search.png");
	}
	.searchSection > .img::before {
	 top: 5.96591%;
	 width: 182.35294%;
	 height: unset;
	}
}
.graphSection {
	display: grid;
	gap: 0 71px;
	grid-template-areas: "img balloon" "img body";
	grid-template-columns: 465px 1fr;
	width: 950px;
	margin: auto;
}
@media (max-width: 768px) {
	.graphSection {
	 padding: 0 24px;
	}
}
.graphSection.reverse {
	grid-template-areas: "balloon img" "body img";
	grid-template-columns: 1fr 465px;
	gap: 0;
}
@media (max-width: 768px) {
	.graphSection.reverse {
	 grid-template-areas: "balloon img" "body body";
	 grid-template-columns: 1fr 51.98777%;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
@media (max-width: 768px) {
	.graphSection {
	 grid-template-areas: "img balloon" "body body";
	 grid-template-columns: 51.98777% 1fr;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
.graphSection > .balloon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: column;
	grid-area: balloon;
	align-self: flex-end;
	position: relative;
	z-index: 2;
	width: 150px;
	margin-bottom: 26px;
	border-radius: 50%;
	background-color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	color: #D0111B;
	text-align: center;
	filter: drop-shadow(0 5px 10px rgba(98, 98, 98, 0.1));
	aspect-ratio: 1 / 1;
}
@media (min-width: 769px) {
	.graphSection > .balloon.reverse {
	 margin-left: 71px;
	}
}
@media (max-width: 768px) {
	.graphSection > .balloon {
	 align-self: center;
	 justify-self: flex-start;
	 width: 100%;
	 font-size: 14px;
	}
}
.graphSection > .balloon::before {
	display: block;
	width: 45px;
	height: 45px;
	background-image: url("/doc/app/images/pc/icn_search.png");
	background-size: contain;
	content: "";
}
@media (max-width: 768px) {
	.graphSection > .balloon::before {
	 width: 40px;
	 height: 40px;
	}
}
.graphSection > .balloon::after {
	display: block;
	position: absolute;
	right: 0;
	bottom: -12px;
	left: 0;
	width: 10%;
	height: 10%;
	margin: auto;
	background-color: #FFFFFF;
	content: "";
	clip-path: polygon(0 0, 50% 100%, 100% 0%);
}
@media (max-width: 768px) {
	.graphSection > .balloon::after {
	 bottom: 6%;
	 left: 8%;
	 margin: 0;
	 transform: rotate(46deg);
	}
}
.graphSection > .img {
	display: flex;
	grid-area: img;
	justify-content: center;
	position: relative;
	z-index: 1;
}
@media (max-width: 768px) {
	.graphSection > .img {
	 justify-content: flex-start;
	}
	.graphSection > .img.reverse {
	 margin-left: 0;
	}
}
.graphSection > .img::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	width: 465px;
	margin: auto;
	background-color: #FAF7E2;
	border-radius: 50%;
	content: "";
	aspect-ratio: 1 / 1;
}
@media (max-width: 768px) {
	.graphSection > .img::before {
	 left: -41.17647%;
	 width: 182.35294%;
	 margin: 0;
	}
}
.graphSection > .img .pcImgContent {
	box-shadow: 0 10px 40px rgba(98, 98, 98, 0.16);
	border-radius: 30px;
}
@media (min-width: 769px) {
	.graphSection > .img .pcImgContent {
	 margin: 40px 0;
	}
}
.graphSection > .body {
	grid-area: body;
}
@media (min-width: 769px) {
	.graphSection > .body {
	 margin-top: 6px;
	 padding-left: 18px;
	}
}
@media (max-width: 768px) {
	.graphSection > .body {
	 padding-top: 12px;
	}
}
@media (min-width: 769px) {
	.graphSection > .body.reverse {
	 padding-left: 89px;
	}
}
.graphSection > .body .descriptionText {
	width: 395px;
	margin-top: 16px;
	font-size: 16px;
	line-height: 25.6px;
	letter-spacing: 0.8px;
}
@media (max-width: 768px) {
	.graphSection > .body .descriptionText {
	 width: auto;
	}
}
.graphSection > .body .attentionWrap {
	margin-top: 16px;
}
.graphSection > .balloon::before {
	top: 19.5px;
	background-image: url("/doc/app/images/pc/icn_graph.png");
}
@media (max-width: 768px) {
	.graphSection > .balloon::after {
	 bottom: 10%;
	 left: 85.71429%;
	 transform: rotate(-46deg);
	}
}
@media (max-width: 768px) {
	.graphSection > .balloon::before {
	 background-image: url("/doc/app/images/sp/icn_graph.png");
	}
	.graphSection > .img::before {
	 top: 5.96591%;
	}
}
.questionSection {
	display: grid;
	gap: 0 71px;
	grid-template-areas: "img balloon" "img body";
	grid-template-columns: 465px 1fr;
	width: 950px;
	margin: auto;
}
@media (max-width: 768px) {
	.questionSection {
	 padding: 0 24px;
	}
}
.questionSection.reverse {
	grid-template-areas: "balloon img" "body img";
	grid-template-columns: 1fr 465px;
	gap: 0;
}
@media (max-width: 768px) {
	.questionSection.reverse {
	 grid-template-areas: "balloon img" "body body";
	 grid-template-columns: 1fr 51.98777%;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
@media (max-width: 768px) {
	.questionSection {
	 grid-template-areas: "img balloon" "body body";
	 grid-template-columns: 51.98777% 1fr;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
.questionSection > .balloon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: column;
	grid-area: balloon;
	align-self: flex-end;
	position: relative;
	z-index: 2;
	width: 150px;
	margin-bottom: 26px;
	border-radius: 50%;
	background-color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	color: #D0111B;
	text-align: center;
	filter: drop-shadow(0 5px 10px rgba(98, 98, 98, 0.1));
	aspect-ratio: 1 / 1;
}
@media (min-width: 769px) {
	.questionSection > .balloon.reverse {
	 margin-left: 71px;
	}
}
@media (max-width: 768px) {
	.questionSection > .balloon {
	 align-self: center;
	 justify-self: flex-start;
	 width: 100%;
	 font-size: 14px;
	}
}
.questionSection > .balloon::before {
	display: block;
	width: 45px;
	height: 45px;
	background-image: url("/doc/app/images/pc/icn_search.png");
	background-size: contain;
	content: "";
}
@media (max-width: 768px) {
	.questionSection > .balloon::before {
	 width: 40px;
	 height: 40px;
	}
}
.questionSection > .balloon::after {
	display: block;
	position: absolute;
	right: 0;
	bottom: -12px;
	left: 0;
	width: 10%;
	height: 10%;
	margin: auto;
	background-color: #FFFFFF;
	content: "";
	clip-path: polygon(0 0, 50% 100%, 100% 0%);
}
@media (max-width: 768px) {
	.questionSection > .balloon::after {
	 bottom: 6%;
	 left: 8%;
	 margin: 0;
	 transform: rotate(46deg);
	}
}
.questionSection > .img {
	display: flex;
	grid-area: img;
	justify-content: center;
	position: relative;
	z-index: 1;
}
@media (max-width: 768px) {
	.questionSection > .img {
	 justify-content: flex-start;
	}
	.questionSection > .img.reverse {
	 margin-left: 0;
	}
}
.questionSection > .img::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	width: 465px;
	margin: auto;
	background-color: #FAF7E2;
	border-radius: 50%;
	content: "";
	aspect-ratio: 1 / 1;
}
@media (max-width: 768px) {
	.questionSection > .img::before {
	 left: -41.17647%;
	 width: 182.35294%;
	 margin: 0;
	}
}
.questionSection > .img .pcImgContent {
	box-shadow: 0 10px 40px rgba(98, 98, 98, 0.16);
	border-radius: 30px;
}
@media (min-width: 769px) {
	.questionSection > .img .pcImgContent {
	 margin: 40px 0;
	}
}
.questionSection > .body {
	grid-area: body;
}
@media (min-width: 769px) {
	.questionSection > .body {
	 margin-top: 6px;
	 padding-left: 18px;
	}
}
@media (max-width: 768px) {
	.questionSection > .body {
	 padding-top: 12px;
	}
}
@media (min-width: 769px) {
	.questionSection > .body.reverse {
	 padding-left: 89px;
	}
}
.questionSection > .body .descriptionText {
	width: 395px;
	margin-top: 16px;
	font-size: 16px;
	line-height: 25.6px;
	letter-spacing: 0.8px;
}
@media (max-width: 768px) {
	.questionSection > .body .descriptionText {
	 width: auto;
	}
}
.questionSection > .body .attentionWrap {
	margin-top: 16px;
}
.questionSection > .img .pcImgContent {
	box-shadow: none;
	filter: drop-shadow(0 10px 40px rgba(98, 98, 98, 0.16));
}
.questionSection > .balloon::before {
	top: 24px;
	background-image: url("/doc/app/images/pc/icn_question.png");
}
@media (max-width: 768px) {
	.questionSection {
	 grid-template-columns: 64.22018% 1fr;
	 gap: 0;
	 position: relative;
	}
	.questionSection > .balloon {
	 align-self: start;
	 position: absolute;
	 right: 0;
	 width: 119.64789%;
	}
	.questionSection > .balloon::before {
	 background-image: url("/doc/app/images/sp/icn_question.png");
	}
	.questionSection > .img {
	 margin-top: 36px;
	}
	.questionSection > .img::before {
	 top: 11.57895%;
	 left: -23.80952%;
	 width: 147.61905%;
	}
}
.tapSection {
	display: grid;
	gap: 0 71px;
	grid-template-areas: "img balloon" "img body";
	grid-template-columns: 465px 1fr;
	width: 950px;
	margin: auto;
}
@media (max-width: 768px) {
	.tapSection {
	 padding: 0 24px;
	}
}
.tapSection.reverse {
	grid-template-areas: "balloon img" "body img";
	grid-template-columns: 1fr 465px;
	gap: 0;
}
@media (max-width: 768px) {
	.tapSection.reverse {
	 grid-template-areas: "balloon img" "body body";
	 grid-template-columns: 1fr 51.98777%;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
@media (max-width: 768px) {
	.tapSection {
	 grid-template-areas: "img balloon" "body body";
	 grid-template-columns: 51.98777% 1fr;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
.tapSection > .balloon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: column;
	grid-area: balloon;
	align-self: flex-end;
	position: relative;
	z-index: 2;
	width: 150px;
	margin-bottom: 26px;
	border-radius: 50%;
	background-color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	color: #D0111B;
	text-align: center;
	filter: drop-shadow(0 5px 10px rgba(98, 98, 98, 0.1));
	aspect-ratio: 1 / 1;
}
@media (min-width: 769px) {
	.tapSection > .balloon.reverse {
	 margin-left: 71px;
	}
}
@media (max-width: 768px) {
	.tapSection > .balloon {
	 align-self: center;
	 justify-self: flex-start;
	 width: 100%;
	 font-size: 14px;
	}
}
.tapSection > .balloon::before {
	display: block;
	width: 45px;
	height: 45px;
	background-image: url("/doc/app/images/pc/icn_search.png");
	background-size: contain;
	content: "";
}
@media (max-width: 768px) {
	.tapSection > .balloon::before {
	 width: 40px;
	 height: 40px;
	}
}
.tapSection > .balloon::after {
	display: block;
	position: absolute;
	right: 0;
	bottom: -12px;
	left: 0;
	width: 10%;
	height: 10%;
	margin: auto;
	background-color: #FFFFFF;
	content: "";
	clip-path: polygon(0 0, 50% 100%, 100% 0%);
}
@media (max-width: 768px) {
	.tapSection > .balloon::after {
	 bottom: 6%;
	 left: 8%;
	 margin: 0;
	 transform: rotate(46deg);
	}
}
.tapSection > .img {
	display: flex;
	grid-area: img;
	justify-content: center;
	position: relative;
	z-index: 1;
}
@media (max-width: 768px) {
	.tapSection > .img {
	 justify-content: flex-start;
	}
	.tapSection > .img.reverse {
	 margin-left: 0;
	}
}
.tapSection > .img::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	width: 465px;
	margin: auto;
	background-color: #FAF7E2;
	border-radius: 50%;
	content: "";
	aspect-ratio: 1 / 1;
}
@media (max-width: 768px) {
	.tapSection > .img::before {
	 left: -41.17647%;
	 width: 182.35294%;
	 margin: 0;
	}
}
.tapSection > .img .pcImgContent {
	box-shadow: 0 10px 40px rgba(98, 98, 98, 0.16);
	border-radius: 30px;
}
@media (min-width: 769px) {
	.tapSection > .img .pcImgContent {
	 margin: 40px 0;
	}
}
.tapSection > .body {
	grid-area: body;
}
@media (min-width: 769px) {
	.tapSection > .body {
	 margin-top: 6px;
	 padding-left: 18px;
	}
}
@media (max-width: 768px) {
	.tapSection > .body {
	 padding-top: 12px;
	}
}
@media (min-width: 769px) {
	.tapSection > .body.reverse {
	 padding-left: 89px;
	}
}
.tapSection > .body .descriptionText {
	width: 395px;
	margin-top: 16px;
	font-size: 16px;
	line-height: 25.6px;
	letter-spacing: 0.8px;
}
@media (max-width: 768px) {
	.tapSection > .body .descriptionText {
	 width: auto;
	}
}
.tapSection > .body .attentionWrap {
	margin-top: 16px;
}
.tapSection > .balloon::before {
	top: 24px;
	background-image: url("/doc/app/images/pc/icn_tap.png");
}
@media (max-width: 768px) {
	.tapSection > .balloon::after {
	 bottom: 10%;
	 left: 85.71429%;
	 transform: rotate(-46deg);
	}
}
@media (max-width: 768px) {
	.tapSection > .balloon::before {
	 background-image: url("/doc/app/images/sp/icn_tap.png");
	}
	.tapSection > .img::before {
	 top: 5.96591%;
	}
}
.cardSection {
	display: grid;
	gap: 0 71px;
	grid-template-areas: "img balloon" "img body";
	grid-template-columns: 465px 1fr;
	width: 950px;
	margin: auto;
}
@media (max-width: 768px) {
	.cardSection {
	 padding: 0 24px;
	}
}
.cardSection.reverse {
	grid-template-areas: "balloon img" "body img";
	grid-template-columns: 1fr 465px;
	gap: 0;
}
@media (max-width: 768px) {
	.cardSection.reverse {
	 grid-template-areas: "balloon img" "body body";
	 grid-template-columns: 1fr 51.98777%;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
@media (max-width: 768px) {
	.cardSection {
	 grid-template-areas: "img balloon" "body body";
	 grid-template-columns: 51.98777% 1fr;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
.cardSection > .balloon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: column;
	grid-area: balloon;
	align-self: flex-end;
	position: relative;
	z-index: 2;
	width: 150px;
	margin-bottom: 26px;
	border-radius: 50%;
	background-color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	color: #D0111B;
	text-align: center;
	filter: drop-shadow(0 5px 10px rgba(98, 98, 98, 0.1));
	aspect-ratio: 1 / 1;
}
@media (min-width: 769px) {
	.cardSection > .balloon.reverse {
	 margin-left: 71px;
	}
}
@media (max-width: 768px) {
	.cardSection > .balloon {
	 align-self: center;
	 justify-self: flex-start;
	 width: 100%;
	 font-size: 14px;
	}
}
.cardSection > .balloon::before {
	display: block;
	width: 45px;
	height: 45px;
	background-image: url("/doc/app/images/pc/icn_search.png");
	background-size: contain;
	content: "";
}
@media (max-width: 768px) {
	.cardSection > .balloon::before {
	 width: 40px;
	 height: 40px;
	}
}
.cardSection > .balloon::after {
	display: block;
	position: absolute;
	right: 0;
	bottom: -12px;
	left: 0;
	width: 10%;
	height: 10%;
	margin: auto;
	background-color: #FFFFFF;
	content: "";
	clip-path: polygon(0 0, 50% 100%, 100% 0%);
}
@media (max-width: 768px) {
	.cardSection > .balloon::after {
	 bottom: 6%;
	 left: 8%;
	 margin: 0;
	 transform: rotate(46deg);
	}
}
.cardSection > .img {
	display: flex;
	grid-area: img;
	justify-content: center;
	position: relative;
	z-index: 1;
}
@media (max-width: 768px) {
	.cardSection > .img {
	 justify-content: flex-start;
	}
	.cardSection > .img.reverse {
	 margin-left: 0;
	}
}
.cardSection > .img::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	width: 465px;
	margin: auto;
	background-color: #FAF7E2;
	border-radius: 50%;
	content: "";
	aspect-ratio: 1 / 1;
}
@media (max-width: 768px) {
	.cardSection > .img::before {
	 left: -41.17647%;
	 width: 182.35294%;
	 margin: 0;
	}
}
.cardSection > .img .pcImgContent {
	box-shadow: 0 10px 40px rgba(98, 98, 98, 0.16);
	border-radius: 30px;
}
@media (min-width: 769px) {
	.cardSection > .img .pcImgContent {
	 margin: 40px 0;
	}
}
.cardSection > .body {
	grid-area: body;
}
@media (min-width: 769px) {
	.cardSection > .body {
	 margin-top: 6px;
	 padding-left: 18px;
	}
}
@media (max-width: 768px) {
	.cardSection > .body {
	 padding-top: 12px;
	}
}
@media (min-width: 769px) {
	.cardSection > .body.reverse {
	 padding-left: 89px;
	}
}
.cardSection > .body .descriptionText {
	width: 395px;
	margin-top: 16px;
	font-size: 16px;
	line-height: 25.6px;
	letter-spacing: 0.8px;
}
@media (max-width: 768px) {
	.cardSection > .body .descriptionText {
	 width: auto;
	}
}
.cardSection > .body .attentionWrap {
	margin-top: 16px;
}
.cardSection > .img .pcImgContent {
	box-shadow: none;
	filter: drop-shadow(0 10px 40px rgba(98, 98, 98, 0.16));
}
.cardSection > .balloon::before {
	top: 37px;
	background-image: url("/doc/app/images/pc/icn_card.png");
}
@media (max-width: 768px) {
	.cardSection {
	 grid-template-columns: 58.10398% 1fr;
	 gap: 0;
	}
	.cardSection > .balloon {
	 align-self: start;
	 width: 102.18978%;
	}
	.cardSection > .balloon::before {
	 background-image: url("/doc/app/images/sp/icn_card.png");
	}
	.cardSection > .img {
	 margin-top: 30px;
	}
	.cardSection > .img::before {
	 top: 5.96591%;
	 left: -32.57895%;
	 width: 163.15789%;
	}
}
.couponSection {
	display: grid;
	gap: 0 71px;
	grid-template-areas: "img balloon" "img body";
	grid-template-columns: 465px 1fr;
	width: 950px;
	margin: auto;
}
@media (max-width: 768px) {
	.couponSection {
	 padding: 0 24px;
	}
}
.couponSection.reverse {
	grid-template-areas: "balloon img" "body img";
	grid-template-columns: 1fr 465px;
	gap: 0;
}
@media (max-width: 768px) {
	.couponSection.reverse {
	 grid-template-areas: "balloon img" "body body";
	 grid-template-columns: 1fr 51.98777%;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
@media (max-width: 768px) {
	.couponSection {
	 grid-template-areas: "img balloon" "body body";
	 grid-template-columns: 51.98777% 1fr;
	 gap: 0 5.19878%;
	 width: 100%;
	}
}
.couponSection > .balloon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: column;
	grid-area: balloon;
	align-self: flex-end;
	position: relative;
	z-index: 2;
	width: 150px;
	margin-bottom: 26px;
	border-radius: 50%;
	background-color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	color: #D0111B;
	text-align: center;
	filter: drop-shadow(0 5px 10px rgba(98, 98, 98, 0.1));
	aspect-ratio: 1 / 1;
}
@media (min-width: 769px) {
	.couponSection > .balloon.reverse {
	 margin-left: 71px;
	}
}
@media (max-width: 768px) {
	.couponSection > .balloon {
	 align-self: center;
	 justify-self: flex-start;
	 width: 100%;
	 font-size: 14px;
	}
}
.couponSection > .balloon::before {
	display: block;
	width: 45px;
	height: 45px;
	background-image: url("/doc/app/images/pc/icn_search.png");
	background-size: contain;
	content: "";
}
@media (max-width: 768px) {
	.couponSection > .balloon::before {
	 width: 40px;
	 height: 40px;
	}
}
.couponSection > .balloon::after {
	display: block;
	position: absolute;
	right: 0;
	bottom: -12px;
	left: 0;
	width: 10%;
	height: 10%;
	margin: auto;
	background-color: #FFFFFF;
	content: "";
	clip-path: polygon(0 0, 50% 100%, 100% 0%);
}
@media (max-width: 768px) {
	.couponSection > .balloon::after {
	 bottom: 6%;
	 left: 8%;
	 margin: 0;
	 transform: rotate(46deg);
	}
}
.couponSection > .img {
	display: flex;
	grid-area: img;
	justify-content: center;
	position: relative;
	z-index: 1;
}
@media (max-width: 768px) {
	.couponSection > .img {
	 justify-content: flex-start;
	}
	.couponSection > .img.reverse {
	 margin-left: 0;
	}
}
.couponSection > .img::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	width: 465px;
	margin: auto;
	background-color: #FAF7E2;
	border-radius: 50%;
	content: "";
	aspect-ratio: 1 / 1;
}
@media (max-width: 768px) {
	.couponSection > .img::before {
	 left: -41.17647%;
	 width: 182.35294%;
	 margin: 0;
	}
}
.couponSection > .img .pcImgContent {
	box-shadow: 0 10px 40px rgba(98, 98, 98, 0.16);
	border-radius: 30px;
}
@media (min-width: 769px) {
	.couponSection > .img .pcImgContent {
	 margin: 40px 0;
	}
}
.couponSection > .body {
	grid-area: body;
}
@media (min-width: 769px) {
	.couponSection > .body {
	 margin-top: 6px;
	 padding-left: 18px;
	}
}
@media (max-width: 768px) {
	.couponSection > .body {
	 padding-top: 12px;
	}
}
@media (min-width: 769px) {
	.couponSection > .body.reverse {
	 padding-left: 89px;
	}
}
.couponSection > .body .descriptionText {
	width: 395px;
	margin-top: 16px;
	font-size: 16px;
	line-height: 25.6px;
	letter-spacing: 0.8px;
}
@media (max-width: 768px) {
	.couponSection > .body .descriptionText {
	 width: auto;
	}
}
.couponSection > .body .attentionWrap {
	margin-top: 16px;
}
@media (max-width: 768px) {
	.couponSection.reverse {
	 margin-bottom: 128px;
	}
}
.couponSection > .balloon::before {
	top: 26px;
	background-image: url("/doc/app/images/pc/icn_coupon.png");
}
@media (max-width: 768px) {
	.couponSection > .balloon::after {
	 bottom: 10%;
	 left: 85.71429%;
	 transform: rotate(-46deg);
	}
}
@media (max-width: 768px) {
	.couponSection > .balloon::before {
	 background-image: url("/doc/app/images/sp/icn_coupon.png");
	}
	.couponSection > .img::before {
	 top: 21px;
	}
}
@media (max-width: 768px) {
	.otokuSection {
	 max-width: 500px;
	 margin: auto;
	}
}
.otokuSection .otokuSectionWrap {
	position: relative;
	width: 1050px;
	margin: 120px 0 0;
	padding: 48px 50px;
	border-radius: 20px;
	background-color: #FFFFFF;
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap {
	 width: auto;
	 margin: 0 24px;
	 padding: 48px 9px;
	}
}
.otokuSection .otokuSectionWrap .otokuContents {
	display: flex;
	gap: 22px;
	justify-content: center;
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap .otokuContents {
	 display: block;
	 margin: 0 11px;
	}
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem {
	 margin: auto;
	}
}
.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .otokuContentsItemTitle {
	padding: 48px 0 32px;
	font-size: 18px;
	color: #1E212D;
	letter-spacing: 0.9px;
	text-align: center;
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .otokuContentsItemTitle {
	 padding: 48px 0 16px;
	 font-size: 16px;
	}
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .pointPuls {
	 padding: 32px 0 16px;
	}
}
.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .otokuContentsItemImg {
	display: flex;
	justify-content: center;
	position: relative;
	z-index: 1;
}
.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .otokuContentsItemImg::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	width: 384px;
	height: 384px;
	margin: auto;
	border-radius: 50%;
	background-color: #FFFBF0;
	content: "";
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .otokuContentsItemImg::before {
	 left: 0;
	 width: 287px;
	 height: 287px;
	}
}
.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .otokuContentsItemText {
	padding-top: 32px;
	letter-spacing: 0.8px;
}
@media (min-width: 769px) {
	.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .otokuContentsItemText {
	 text-align: center;
	}
}
.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .textRed {
	font-size: 32px;
	letter-spacing: 1.6px;
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap .otokuContents .otokuContentsItem .textRed {
	 font-size: 20px;
	}
}
.otokuSection .otokuSectionWrap .bgFood picture {
	opacity: 0;
	position: absolute;
	z-index: 1;
}
.otokuSection .otokuSectionWrap .bgFood picture:nth-of-type(1) {
	top: 180px;
	left: -237px;
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap .bgFood picture:nth-of-type(1) {
	 top: 96.521734%;
	 left: -15.59633%;
	 width: 33.02752%;
	}
}
.otokuSection .otokuSectionWrap .bgFood picture:nth-of-type(1).fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgLeftFood 0.5s ease-in-out 0s forwards;
}
.otokuSection .otokuSectionWrap .bgFood picture:nth-of-type(2) {
	top: -44px;
	right: -298px;
}
@media (max-width: 768px) {
	.otokuSection .otokuSectionWrap .bgFood picture:nth-of-type(2) {
	 top: -116px;
	 right: -18.65443%;
	 width: 44.34251%;
	}
}
.otokuSection .otokuSectionWrap .bgFood picture:nth-of-type(2).fadeIn {
	opacity: 0;
	z-index: 100;
	animation: fadeInBgRightFood 0.5s ease-in-out 0s forwards;
}
.downloadWrap {
	position: relative;
}
@media (max-width: 768px) {
	.downloadWrap {
	 max-width: 500px;
	 margin: auto;
	}
}
.downloadWrap .downloadInner {
	width: 646px;
	margin: 0 auto;
	padding: 80px 0 32px;
}
@media (max-width: 768px) {
	.downloadWrap .downloadInner {
	 width: auto;
	 margin: 0 24px;
	}
}
.downloadWrap .downloadContents {
	position: relative;
	z-index: 90;
}
.downloadWrap .downloadText {
	font-size: 24px;
	font-weight: bold;
	color: #1E212D;
	text-align: center;
	letter-spacing: 1.2px;
}
@media (max-width: 768px) {
	.downloadWrap .downloadText {
	 font-size: 18px;
	 letter-spacing: 0.9px;
	}
}
.downloadWrap .smallFontText {
	font-size: 20.4px;
	letter-spacing: 1.02px;
}
@media (max-width: 768px) {
	.downloadWrap .smallFontText {
	 font-size: 14px;
	 letter-spacing: 0.7px;
	}
}
.downloadWrap .appBtnWrap {
	justify-content: center;
	margin-top: 24px;
}
@media (max-width: 768px) {
	.downloadWrap .appBtnWrap {
	 gap: 12px;
	 margin-top: 16px;
	}
}
.downloadContents {
	padding: 32px 160px;
	border-radius: 20px;
	background-color: #FFFFFF;
}
@media (max-width: 768px) {
	.downloadContents {
	 padding: 16px 24px;
	 border-radius: 10px;
	}
}
.noteWrap {
	position: relative;
}
@media (max-width: 768px) {
	.noteWrap {
	 max-width: 500px;
	 margin: auto;
	}
}
.noteWrap .noteInner {
	width: 1050px;
	margin: 0 auto;
	padding-bottom: 222px;
}
@media (max-width: 768px) {
	.noteWrap .noteInner {
	 width: auto;
	 margin: 0 24px;
	 padding-bottom: 140px;
	}
}
@media (max-width: 768px) {
	.noteWrap .noteTitle {
	 font-size: 14px;
	}
}
.noteWrap .noteFlex {
	display: flex;
	gap: 8px 72px;
	margin-top: 4px;
}
@media (max-width: 768px) {
	.noteWrap .noteFlex {
	 flex-direction: column;
	}
}
.noteWrap .noteBlock {
	width: 100%;
	font-size: 10px;
	color: #666666;
}
.noteWrap .noteList {
	margin-left: 22px;
	list-style: disc;
}
.noteWrap .bgFood {
	opacity: 0;
	position: absolute;
	right: 0;
	bottom: -118px;
	z-index: 1;
}
@media (max-width: 768px) {
	.noteWrap .bgFood {
	 bottom: 0;
	 width: 69.33333%;
	}
}
.noteWrap .bgFood.fadeIn {
	opacity: 0;
	z-index: 80;
	animation: fadeInBgRightFood 0.5s ease-in-out 0s forwards;
}
.breadCrumbContents {
	padding: 20px 0;
}
.breadCrumbContents .breadCrumbWrap {
	max-width: 1280px;
	margin: 0 auto;
}
@media (max-width: 768px) {
	.breadCrumbContents .breadCrumbWrap {
	 padding: 0 20px;
	}
}
.breadCrumbContents .breadCrumbWrap .breadCrumbList {
	font-size: 10px;
	line-height: 1;
}
@media (max-width: 768px) {
	.breadCrumbContents .breadCrumbWrap .breadCrumbList {
	 font-size: 12px;
	}
}
.breadCrumbContents .breadCrumbWrap .breadCrumbList > li {
	display: inline;
}
@media (max-width: 768px) {
	.breadCrumbContents .breadCrumbWrap .breadCrumbList > li {
	 line-height: 1.6;
	}
}
.breadCrumbContents .breadCrumbWrap .breadCrumbList > li + li::before {
	display: inline-block;
	width: 5px;
	height: 5px;
	margin: 0 5px 1px 2px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	transform: rotate(45deg);
	content: "";
}
@media (max-width: 768px) {
	.breadCrumbContents .breadCrumbWrap .breadCrumbList > li + li::before {
	 width: 7px;
	 height: 7px;
	 margin: 0 10px 1px 7px;
	 border-top-width: 2px;
	 border-right-width: 2px;
	 transform: rotate(45deg);
	 content: "";
	}
}
.footerWrap {
	padding: 20px 0;
	border-top: 1px solid #CCCCCC;
}
@media (max-width: 768px) {
	.footerWrap {
	 padding: 20px;
	}
}
.footerWrap .footerContentWrap {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-direction: row-reverse;
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	line-height: 1;
}
@media (max-width: 768px) {
	.footerWrap .footerContentWrap {
	 flex-direction: column;
	 width: 100%;
	}
}
.footerWrap .footerContentWrap .footerPageLinkWrap {
	display: flex;
}
@media (max-width: 768px) {
	.footerWrap .footerContentWrap .footerPageLinkWrap {
	 flex-wrap: wrap;
	 gap: 10px 0;
	 width: 280px;
	 margin: 0 auto;
	}
}
.footerWrap .footerContentWrap .footerPageLinkWrap > li {
	position: relative;
	font-size: 10px;
}
@media (max-width: 768px) {
	.footerWrap .footerContentWrap .footerPageLinkWrap > li {
	 font-size: 12px;
	}
}
.footerWrap .footerContentWrap .footerPageLinkWrap > li + li {
	padding-left: 11px;
}
.footerWrap .footerContentWrap .footerPageLinkWrap > li + li::before {
	position: absolute;
	top: 0;
	left: 6px;
	width: 1px;
	height: 10px;
	background-color: #CCCCCC;
	content: "";
}
@media (max-width: 768px) {
	.footerWrap .footerContentWrap .footerPageLinkWrap > li + li::before {
	 height: 12px;
	}
}
@media (max-width: 768px) {
	.footerWrap .footerContentWrap .footerPageLinkWrap > li.siteMapLink,
	.footerWrap .footerContentWrap .footerPageLinkWrap > li.privacyLink::before,
	.footerWrap .footerContentWrap .footerPageLinkWrap > li.legalLink::before {
	 display: none;
	}
}
@media (max-width: 768px) {
	.footerWrap .footerRecruitLinkWrap {
	 width: 100%;
	 margin-top: 30px;
	}
}
.footerWrap .footerRecruitLinkWrap .footerLinkWrap {
	display: flex;
	align-items: flex-end;
	gap: 10px;
}
.footerWrap .footerRecruitLinkWrap .footerLinkWrap:hover {
	text-decoration: none;
}
.footerWrap .footerRecruitLinkWrap .footerLinkWrap .copyright {
	font-family: 'メイリオ', sans-serif;
	font-size: 10px;
	font-weight: bold;
	color: #435B67;
	line-height: 1;
}
.followDownloadWrap {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 150;
	padding: 16px 0;
	background-color: #FFFFFF;
}
.followDownloadWrap.show {
	transform: translate3d(0, 0, 0);
	transition: 500ms;
}
.followDownloadWrap:not(.show) {
	bottom: -100px;
	transform: translate3d(0, 10px, 0);
	transition: 500ms;
}
.followDownloadWrap .followDownloadContents {
	justify-content: center;
	max-width: 1440px;
	margin: auto;
}
@media (min-width: 769px) {
	.followDownloadWrap .followDownloadContents {
	 display: flex;
	 align-items: center;
	}
}
.followDownloadWrap .downloadText {
	font-size: 20px;
	font-weight: bold;
	color: #1E212D;
}
@media (min-width: 769px) {
	.followDownloadWrap .downloadText {
	 margin-right: 32px;
	}
}
@media (max-width: 768px) {
	.followDownloadWrap .downloadText {
	 font-size: 14px;
	 letter-spacing: 0.7px;
	 text-align: center;
	}
}
.followDownloadWrap .smallFontText {
	font-size: 16px;
	letter-spacing: 0.8px;
}
@media (max-width: 768px) {
	.followDownloadWrap .smallFontText {
	 font-size: 12px;
	 letter-spacing: 0.6px;
	}
}
.followDownloadWrap .appBtnWrap {
	gap: 16px;
}
@media (max-width: 768px) {
	.followDownloadWrap .appBtnWrap {
	 justify-content: center;
	 gap: 12px;
	 margin-top: 12px;
	}
}
