/* 全体
----------------------------------------------- */
.js-fadein {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.25s, transform 0.25s;
  transition-duration: 0.85s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); }

body.isStart .js-fadein.isView {
	opacity: 1;
  transform: translateY(0); }

.spEle {
	display: none; }

body {
	min-height: 0px; }

.main .section {
	background-color: #EFF4DD; }


/* timing__wrap
----------------------------------------------- */
.timing__wrap {
	padding-top: 266px;
	font-family: 'Noto Sans JP', sans-serif; }




/* kv
----------------------------------------------- */
.kv {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.25s, transform 0.25s;
  transition-duration: 0.85s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); }

.kv h2 {
	text-align: center; }

.kv__mainImg {
	margin-top: 38px; }

.kv__mainImg img {
	max-width: 100%; }

body.isStart .kv {
	opacity: 1;
  transform: translateY(0); }




/* keypoint
----------------------------------------------- */
.keypoint {
	position: relative;
	width: 773px;
	margin: 120px auto 0; }

.keypoint p {
	position: absolute;
	top: 156px;
	left: 57px;
	width: 440px;
	color: #000;
	font-size: 17px;
	font-weight: bold;
	line-height: 2.1;
	letter-spacing: 0.075em;
	font-feature-settings: "palt";
	text-align: justify; }




/* period
----------------------------------------------- */
.period {
	width: 960px;
	margin: 150px auto 0; }




/* period__summary
----------------------------------------------- */
.period__summary {
	display: flex;
	justify-content: space-between; }

.period__summary-right {
	padding-top: 11px; }




/* period__anchor
----------------------------------------------- */
.period__anchor {
	margin-top: 46px; }

.period__anchor-speech {
	opacity: 0;
	transform: translate(-10px, 40px);
	transition: opacity 0.25s, transform 0.25s;
  transition-duration: 0.85s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); }

.period__anchor-speech.isView {
	opacity: 1;
	transform: translate(-10px, 0px); }

.period__anchor-speech-inner {
	position: relative;
	bottom: 8px;
	width: 240px;
	margin: 0 auto;
	animation: updown 0.7s cubic-bezier(0.33, 1, 0.68, 1) 0s infinite alternate; }

@keyframes updown {
  0% { transform: translateY(0); }
  100% { transform: translateY(-8px); }
}

.period__anchor-list {
	display: flex; }

.period__anchor-list-item {
	position: relative;
	width: 247px; }

.period__anchor-list-item--on {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity .2s; }

.period__anchor-list-item a:hover .period__anchor-list-item--on {
	opacity: 1; }

.period__anchor-list-item1 {
	z-index: 4; }

.period__anchor-list-item2 {
	margin-left:-10px;
	z-index: 3; }

.period__anchor-list-item3 {
	margin-left:-10px;
	z-index: 2; }

.period__anchor-list-item4 {
	width: 253px;
	margin-left:-14px;
	z-index: 1; }




/* period__box
----------------------------------------------- */
.period__box::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	width: 280px;
	height: calc(100% - 85px);
	transform: translateX(-50%); }

.period__box::after {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 280px;
	height: 86px;
	transform: translateX(-50%);
	clip-path: polygon(0 0, 100% 0, 100% 1px, 50% 100%, 0 1px); }

.period__box-head {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 60px 0 57px; }


.period__box-head-right {
	width: 444px; }

.period__box-head-right p {
	color: #000;
	font-size: 17px;
	font-weight: bold;
	line-height: 2.1;
	text-align: justify; }


/* body */
.period__box-body-cards {
	position: relative;
	border: 2px solid #fff;
	background-color: #D4E697;
	box-sizing: border-box; }

.period__box-body-cards-title {
	color: #000;
	font-size: 28px;
	font-weight: 900;
	line-height: 1.57;
	letter-spacing: 0.03em;
	font-feature-settings: "palt"; }

.period__box-body-cards-title span {
	position: relative;
	z-index: 1; }

.period__box-body-cards-title span::before {
	content: "";
	position: absolute;
	bottom: 2px;
	left: 0;
	width: 100%;
	height: 8px;
	border-radius: 8px;
	background-color: #A5C300;
	z-index: -1; }

.period__box-body-cards-text {
	color: #000;
	font-size: 15px;
	font-weight: bold;
	line-height: 2;
	letter-spacing: 0.015em;
	text-align: justify;
	font-feature-settings: "palt"; }

.period__box-body-cards-text2 {
	color: #000;
	font-size: 18px;
	font-weight: 900;
	line-height: 1.5;
	letter-spacing: 0.015em;
	font-feature-settings: "palt"; }

.period__box-body-cards-text2 span {
	font-size: 14px; }

.period__box-body-cards-icon {
	position: absolute; }

.period__box-body-cards-point {
	position: absolute;
	width: 320px;
	border-radius: 65px;
	box-shadow: 14px 14px 0px 0px rgba(255, 243, 55, 1);
	background-color: #FFF8AB; }

.period__box-body-cards-point-title {
	color: #000;
	font-size: 24px;
	font-weight: 900;
	line-height: 1.58;
	letter-spacing: 0.05em;
	text-align: center;
	font-feature-settings: "palt"; }

.period__box-body-cards-point-text {
	width: 250px;
	margin: 15px auto 0;
	color: #000;
	font-size: 13px;
	font-weight: bold;
	line-height: 2;
	letter-spacing: 0.025em;
	text-align: justify;
	font-feature-settings: "palt"; }


/* box1 */
.period__box1 {
	margin-top: 64px;
	padding-bottom: 168px; }

.period__box1::before,
.period__box1::after {
	background-color: #6ABE84; }

.period__box1 .period__box-head {
	background: rgb(184,220,177);
	background: linear-gradient(180deg, rgba(184,220,177,1) 0%, rgba(106,190,132,1) 100%); }

.period__box1 .period__box-head-left {
	padding: 28px 0 34px; }

.period__box1 .period__box-body {
	margin-top: 86px; }

.period__box1 .period__box-body-cards {
	width: 620px; }

.period__box1 .period__box-body-cards1 {
	margin-left: 60px;
	padding: 78px 0 67px 167px; }

.period__box1 .period__box-body-cards2 {
	margin-top: 106px;
	margin-left: 286px;
	padding: 59px 0 65px 107px; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-title {
	margin-top: 5px; }

.period__box1 .period__box-body-cards-text {
	margin-top: 19px; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-text {
	width: 408px; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-text span {
	letter-spacing: -0.08em; }

.period__box1 .period__box-body-cards1 .period__box-body-cards-icon1 {
	top: -29px;
	left: 44px; }

.period__box1 .period__box-body-cards1 .period__box-body-cards-icon2 {
	top: 205px;
	left: -60px; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-icon1 {
	top: -58px;
	right: -32px; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-icon2 {
	top: 239px;
	right: -74px; }

.period__box1 .period__box-body-cards1 .period__box-body-cards-point {
	top: 67px;
	right: -250px;
	padding: 72px 0 52px; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-point {
	top: 157px;
	left: -258px;
	padding: 65px 0 44px; }

.period__box1 .period__box-body-cards-point-icon {
	position: absolute;
	left: 0;
	width: 100%;
	text-align: center; }

.period__box1 .period__box-body-cards-point-icon {
	top: -51px; }


/* box2 */
.period__box2 {
	padding-bottom: 116px; }

.period__box2 .period__box-head {
	background: rgb(110,193,135);
	background: linear-gradient(180deg, rgba(110,193,135,1) 0%, rgba(77,188,177,1) 100%); }

.period__box2::before,
.period__box2::after {
	background-color: #4DBCB1; }

.period__box2 .period__box-head-left {
	padding: 28px 0 34px; }

.period__box2 .period__box-body {
	margin-top: 80px; }

.period__box2 .period__box-body-cards {
	width: 640px;
	margin-left: 160px;
	padding: 58px 0 57px 120px; }

.period__box2 .period__box-body-cards-text {
	width: 420px;
	margin-top: 23px;
	margin-left: -5px; }

.period__box2 .period__box-body-cards .period__box-body-cards-icon1 {
	top: -45px;
	right: -49px; }

.period__box2 .period__box-body-cards .period__box-body-cards-icon2 {
	top: 48px;
	left: -54px; }



/* box3 */
.period__box3 {
	padding-bottom: 118px; }

.period__box3::before,
.period__box3::after {
	background-color: #01AEBC; }

.period__box3 .period__box-head {
  padding: 0 60px 0 49px;
	background: rgb(117,195,170);
	background: linear-gradient(180deg, rgba(117,195,170,1) 0%, rgba(1,174,188,1) 100%); }

.period__box3 .period__box-head-left {
	padding: 62px 0 72px; }

.period__box3 .period__box-body {
	margin-top: 66px; }

.period__box3 .period__box-body-cards {
	width: 700px;
	margin-left: 131px;
	padding: 66px 0 69px 191px; }

.period__box3 .period__box-body-cards,
.period__box4 .period__box-body-cards {
	width: 700px; }

.period__box3 .period__box-body-cards-text {
	width: 361px;
	margin-top: 17px; }

.period__box3 .period__box-body-cards .period__box-body-cards-icon1 {
	top: 19px;
	left: -58px; }

.period__box3 .period__box-body-cards .period__box-body-cards-icon2 {
	top: 10px;
	right: 34px; }

.period__box3 .period__box-body-cards .period__box-body-cards-icon3 {
	top: 14px;
	right: -61px; }


/* box4 */
.period__box4 {
	margin-top: 52px; }

.period__box4::before,
.period__box4::after {
	display: none; }

.period__box4 .period__box-head {
	display: block;
	padding: 0 0 50px;
	background-color: #00AACA; }

.period__box4 .period__box-title {
	text-align: center; }

.period__box4 .period__box-title img {
	margin-top: -54px; }

.period__box4 .period__box-head p {
	margin-top: 24px;
	color: #fff;
	font-size: 17px;
	font-weight: bold;
	line-height: 2;
	text-align: center; }

.period__box4 .period__box-body {
	margin-top: 82px; }

.period__box4 .period__box-body-cards {
	width: 700px;
	margin: 0 auto;
	padding: 66px 0 69px 122px; }

.period__box4 .period__box-body-cards-text {
	width: 334px;
	margin-top: 17px; }

.period__box4 .period__box-body-cards .period__box-body-cards-icon1 {
	top: 49px;
	left: -58px; }

.period__box4 .period__box-body-cards .period__box-body-cards-icon2 {
	top: 10px;
	right: -73px; }




/*  promotion
----------------------------------------------- */
.promotion__item-note,
.promotion__item-products,
.promotion__item-onlineshop {
	display: block; }

.promotion__item-note {
  order: 1; }

.promotion__item-products {
	order: 2; }

.promotion__item-onlineshop {
	order: 3; }




/* mobile
----------------------------------------------- */
@media only screen and (max-width:999px)
{

	/* 全体
	----------------------------------------------- */
body {
	min-height: 1px; }

.pcEle {
	display: none; }

.spEle {
	display: block; }

.js-fadein {
	transform: translateY(5.333vw); }



/* timing__wrap
----------------------------------------------- */
.timing__wrap {
	padding-top: 150px;
	padding-bottom: 7vw; }

.timing__wrap img {
	width: 100%;
	max-width: 100%; }




/* kv
----------------------------------------------- */
.kv {
  transform: translateY(5.333vw); }

.kv h2 {
	width: 86.667vw;
	margin: 0 auto; }

.kv__mainImg {
	margin-top: 11vw; }

body.isStart .kv {
  transform: translateY(0vw); }




/* keypoint
----------------------------------------------- */
.keypoint {
	position: relative;
	width: 85.6vw;
	margin: 13.5vw auto 0; }

.keypoint p {
	position: absolute;
	top: 42vw;
	left: 7vw;
	width: 71.2vw;
	font-size: 3.733vw;
	line-height: 2; }




/* period
----------------------------------------------- */
.period {
	width: 100%;
	margin: 19.5vw auto 0; }




/* period__summary
----------------------------------------------- */
.period__summary {
	display: block; }

.period__summary-left {
	width: 75.733vw;
	margin: 0 auto; }

.period__summary-right {
	width: 71.467vw;
	margin: 5.5vw auto 0;
	padding-top: 0; }




/* period__anchor
----------------------------------------------- */
.period__anchor {
	margin-top: 7vw; }

.period__anchor-speech {
	transform: translate(-1.333vw, 5.333vw); }

.period__anchor-speech.isView {
	transform: translate(-1.333vw, 0vw); }

.period__anchor-speech-inner {
	width: 42vw; }

.period__anchor-list {
	flex-wrap: wrap;
	width: 84vw;
	margin: 0 auto; }

.period__anchor-list-item {
	position: relative;
	width: 42.667vw; }

.period__anchor-list-item--on {
	display: none; }

.period__anchor-list-item2 {
	margin-left: -1.5vw; }

.period__anchor-list-item3 {
	margin-top: 3.5vw;
	margin-left: 0; }

.period__anchor-list-item4 {
	margin-top: 3.5vw;
	margin-left: -1.5vw; }




/* period__box
----------------------------------------------- */
.period__box {
  position: relative; }

.period__box::before {
	width: 26.667vw;
	height: calc(100% - 11.2vw); }

.period__box::after {
	width: 26.667vw;
	height: 11.3vw; }

.period__box-head {
	display: block;
	position: relative;
	width: 84vw;
	margin: 0 auto;
	padding: 5vw 0 8vw;
	transform: translate(0);
	z-index:1 }

.period__box-head-right {
	width: 69.067vw;
	margin: 2vw auto 0; }

.period__box-head-right p {
	font-size: 3.2vw;
	line-height: 1.8; }


/* body */
.period__box-body {
	position: relative;
	z-index: 1; }

.period__box-body-cards {
	position: relative;
	width: 84vw;
	border: 0.267vw solid #fff;
	background-color: #D4E697;
	box-sizing: border-box; }

.period__box-body-cards-title {
	font-size: 4.8vw;
	line-height: 1.8; }

.period__box-body-cards-title span {
	position: relative;
	z-index: 1; }

.period__box-body-cards-title span::before {
	content: "";
	position: absolute;
	bottom: 0.267vw;
	left: -0.533vw;
	width: 98%;
	height: 1.067vw;
	border-radius: 2vw;
	background-color: #A5C300;
	z-index: -1; }

.period__box-body-cards-text {
	font-size: 3.733vw;
	line-height: 1.8; }

.period__box-body-cards-text2 {
	font-size: 4vw; }

.period__box-body-cards-text2 span {
	font-size: 3.2vw; }

.period__box-body-cards-point {
	border-radius: 8.667vw;
	box-shadow: 2.6vw 2.6vw 0px 0px rgba(255, 243, 55, 1); }

.period__box-body-cards-point-title {
	font-size: 4.8vw;
	line-height: 1.8; }

.period__box-body-cards-point-text {
	width: 49.067vw;
	margin: 2.6vw auto 0;
	color: #000;
	font-size: 3.467vw;
	line-height: 1.8; }


/* box1 */
.period__box1 {
	margin-top: 5.5vw;
	padding-bottom: 77vw; }

.period__box1 .period__box-head-left {
	width: 70.267vw;
	margin: 0 auto;
	padding: 0; }

.period__box1 .period__box-body {
	margin-top: 8.5vw; }

.period__box1 .period__box-body-cards1 {
	width: 84vw;
	margin-left: 5vw;
	padding: 6.4vw 7.2vw 18vw; }

.period__box1 .period__box-body-cards2 {
	width: 84vw;
	margin-top: 79vw;
	margin-left: 10.5vw;
	padding: 7vw 7vw 18vw; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-title {
	margin-top: 0.8vw;
	font-size: 5.333vw; }

.period__box1 .period__box-body-cards-text {
	margin-top: 4.5vw; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-text {
	width: auto;
	margin-top: 3.2vw; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-text span {
	letter-spacing: -0.08em; }

.period__box1 .period__box-body-cards1 .period__box-body-cards-icon1 {
	top: 1vw;
	left: auto;
	right: -7vw;
	width: 14.267vw }

.period__box1 .period__box-body-cards1 .period__box-body-cards-icon2 {
	top: 50.5vw;
	left: -1.5vw;
	width: 29.6vw;
	z-index: 1; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-icon1 {
	top: 13vw;
	right: -4vw;
	width: 16.8vw; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-icon2 {
	top: 81.2vw;
	right: -6vw;
	width: 42.4vw;
	z-index: 1; }

.period__box1 .period__box-body-cards1 .period__box-body-cards-point {
	top: 60vw;
	right: -3vw;
	width: 64vw;
	padding: 13.5vw 0 8vw; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-point {
	top: 97.5vw;
	left: -6vw;
	width: 61.333vw;
	padding: 12.5vw 0 7.5vw; }

.period__box1 .period__box-body-cards-point-icon {
	left: 0;
	width: 100%; }

.period__box1 .period__box-body-cards-point-icon img {
	width: 16vw; }

.period__box1 .period__box-body-cards1 .period__box-body-cards-point-icon {
	top: -6vw; }

.period__box1 .period__box-body-cards2 .period__box-body-cards-point-icon {
	top: -7vw; }


/* box2 */
.period__box2 {
	padding-bottom: 15vw; }

.period__box2 .period__box-head-left {
	width: 66.133vw;
	padding: 0 0 0 6vw; }

.period__box2 .period__box-body {
	margin-top: 8vw; }

.period__box2 .period__box-body-cards {
	width: 84vw;
	margin: 0 auto;
	padding: 6.5vw 7vw 15.5vw; }

.period__box2 .period__box-body-cards-text {
	width: auto;
	margin-top: 4vw;
	margin-left: 0; }

.period__box2 .period__box-body-cards .period__box-body-cards-icon1 {
	top: 0.5vw;
	right: -5vw;
	width: 35.6vw; }

.period__box2 .period__box-body-cards .period__box-body-cards-icon2 {
	top: 54vw;
	right: -6vw;
	left: auto;
	width: 16.8vw; }



/* box3 */
.period__box3 {
	padding-bottom: 29vw; }

.period__box3 .period__box-head {
  padding: 4.5vw 0 8vw; }

.period__box3 .period__box-head-left {
	width: 42.8vw;
	margin: 0 0 0 18vw;
	padding: 0; }

.period__box3 .period__box-body {
	margin-top: 8vw; }

.period__box3 .period__box-body-cards {
	padding: 7vw 7vw 20vw; }

.period__box3 .period__box-body-cards,
.period__box4 .period__box-body-cards {
	width: 84vw;
	margin: 0 auto; }

.period__box3 .period__box-body-cards-title {
	font-size: 5.333vw;
	line-height: 1.6; }

.period__box3 .period__box-body-cards-text {
	width: auto;
	margin-top: 4vw;
	letter-spacing: -0.02em; }

.period__box3 .period__box-body-cards .period__box-body-cards-icon1 {
	top: -6.5vw;
	right: -7vw;
	left: auto;
	width: 30.5vw; }

.period__box3 .period__box-body-cards .period__box-body-cards-icon2 {
	top: 72vw;
	right: auto;
	left: 3vw;
	width: 25.2vw; }

.period__box3 .period__box-body-cards .period__box-body-cards-icon3 {
	top: 65.5vw;
	right: 5vw;
	width: 51.733vw; }


/* box4 */
.period__box4 {
	margin-top: 8vw;
	padding-bottom: 1vw; }

.period__box4 .period__box-head {
	padding: 0 0 10vw; }

.period__box4 .period__box-title {
	width: 70.5vw;
	margin: 0 auto; }

.period__box4 .period__box-title img {
	margin-top: -8vw; }

.period__box4 .period__box-head p {
	width: 66.133vw;
	margin: 6vw auto 0;
	font-size: 3.2vw;
	line-height: 1.8; }

.period__box4 .period__box-body {
	margin-top: 16vw; }

.period__box4 .period__box-body-cards {
	margin: 0 auto;
	padding: 6.5vw 7vw 27vw; }

.period__box4 .period__box-body-cards-title {
	font-size: 5.333vw; }

.period__box4 .period__box-body-cards-text {
	width: auto;
	margin-top: 3.5vw; }

.period__box4 .period__box-body-cards .period__box-body-cards-icon1 {
	top: -9vw;
	left: auto;
	right: -3vw;
	width: 16.8vw; }

.period__box4 .period__box-body-cards .period__box-body-cards-icon2 {
	top: 53vw;
	right: auto;
	left: 19vw;
	width: 45.467vw; }

}