@charset "utf-8";
body {
	font-family: 'Noto Sans JP', sans-serif;
	color: #2F2F2F;
	margin: 0;
	padding: 0;
	letter-spacing: 0.02em;
	font-feature-settings: "palt";
}
.pc{ display: block; }
.sp{ display: none; }

#kv {
	width: 100%;
	text-align: center;
}
	#kv h1 {
		margin: 0 auto;
        width: 100%;
        font-size: 0;
	}
	#kv h1 picture {
        width: 100%;
        position: relative;
	}
	#kv h1 img {
		width: 100%;
		height: auto;
	}

#target {
	width: 100%;
	text-align: center;
}
#target h2 {
	font-size: 26px;
	line-height: 170%;
	font-weight: normal;
	padding: 20px 0;
}
	#target em {
		text-decoration: inherit;
		font-style: normal;
		font-weight: bold;
	}
#target .cta {
	background-color: #FF6E00;
	color: #fff;
	padding: 15px 0 25px 0;
}
	#target .cta h3 {
		font-weight: bold;
		font-size: 42px;
		margin: 0;
		padding: 0;
	}

	#target .cta .promo-bar{
		color: #FFF;
	}
		#target .cta .promo-bar .promo-bar__inner{
			position: relative;
			max-width: 100%;
			margin: 0 auto;
			padding: 16px 24px 20px 24px;
			text-align: center;
			overflow: hidden;
			display: inline-block;
		}
		#target .cta .promo-bar .promo-bar__text{
			margin: 0;
			font-size: 42px;
			line-height: 1.2;
			font-weight: bold;
			letter-spacing: 0;
			color: #FFF;
			padding: 0 20px;
		}
			#target .cta .promo-bar .promo-bar__inner::before,
			#target .cta .promo-bar .promo-bar__inner::after{
				content: "";
				position: absolute;
				top: 50%;
				width: 3px;
				height: 50px;
				background: #FFF;
				transform-origin: 50% 50%;
			}
			#target .cta .promo-bar .promo-bar__inner::before{
				left: 15px;
				transform: translateY(-50%) rotate(-30deg);
			}
			#target .cta .promo-bar .promo-bar__inner::after{
				right: 15px;
				transform: translateY(-50%) rotate(30deg);
			}
			#target .cta .btn a {
				border-radius: 10px;
				padding: 20px 0 20px 0;
				font-weight: 700;
				color: #2F2F2F;
				font-size: 22px;
				text-align: center;
				max-width: 500px;
				margin: 0 auto;
				background-color: #fff;
				background-image: url(../_images/icon_x.svg), url(../_images/arrow_b.svg);
				background-position: left 35px center, right 28px center;
				background-repeat: no-repeat, no-repeat;
				box-shadow: 0 2px 0 rgba(200, 93, 4, 1);
				display: block;
			}
				#target .cta .btn a:hover,
				#target .cta .btn a:focus-visible{
					background-color: #f4d924;
					text-decoration: none;
					opacity: 1;
					filter: alpha(opacity=100);
				}
			#target .cta .note {
				font-size: 16px;
				line-height: 24px;
				margin-top: 25px;
			}

#content {
	background-color: #FFE9D9;
	background-image: url(../_images/content_bg_l.png), url(../_images/content_bg_r.png);
	background-position: left 0 top, right 0 top;
	background-repeat: repeat-y, repeat-y;
}
	#content .contents__inner {
		max-width: 900px;
		margin: 0 auto;
		padding: 0 20px;
	}
	#content .contents__inner h3 {
		color: #FF6E00;
		font-size: 26px;
		line-height: 26px;
		background-image: url("../_images/icon_head.svg");
		background-repeat: no-repeat;
		background-size: 32px;
		background-position: bottom 1px left;
		padding: 60px 0 0 38px;
		margin: 0 0 20px 0;
		font-weight: bold;
	}
	#content .contents__inner p.date {
		font-size: 30px;
		line-height: 34px;
		font-weight: bold;
	}
	#content .contents__inner p.read {
		font-size: 18px;
		line-height: 26px;
		margin-bottom: 10px;
	}
	#content .contents__inner .influencer {
		display: flex;
		/*justify-content: center;*/
		align-items: center;
		margin: 5px 0 20px 0;
	}
		#content .contents__inner .influencer .profile {
			margin: 0 20px 0 0;
		}
		#content .contents__inner .influencer .profile img {
			max-width: 160px;
		}
		#content .contents__inner .influencer em {
			font-size: 18px;
			font-weight: bold;
			display: block;
			margin: 0 0 5px 0;
		}

#content .contents__inner #cta-section {
	width: 100%;
	text-align: center;
	position: relative;
	padding: 0 0 40px 0;
}
	#content .contents__inner #cta-section .inner {
		max-width: 1000px;
		margin: 0 auto;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#content .contents__inner #cta-section .inner:first-child {
		padding: 40px 0 0 0;
	}
	#content .contents__inner #cta-section .inner:last-child {
		padding: 40px 0 40px 0;
	}
	#content .contents__inner #cta-section .inner a {
		position: relative;
		text-align: left;
		height: auto;
		overflow: hidden;
		margin-right: 20px;
		padding-left: 15px;
		font-size: 18px;
		border-radius: 10px;
	}
	#content .contents__inner #cta-section .inner a:last-child {
		margin-right: 0;
	}
	#content .contents__inner #cta-section .inner a p {
		display: block;
		font-weight: bold;
	}
	#content .contents__inner #cta-section .inner a p span {
		font-size: 16px;
		font-weight: bold;
		display: block!important;
	}
	#content .contents__inner #cta-section .inner a.ctabtn {
		width: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid #002368;
		color: #002368;
		background-color: #fff;
		height: 90px;
		text-decoration: none;
		position: relative;
		text-align: center;
	}
	#content .contents__inner #cta-section .inner a.ctabtn img {
		width: 56px;
		height: auto;
		margin-right: 15px;
	}
	#content .contents__inner #cta-section .inner a.ctabtn:hover {
		text-decoration: none;
		transition: background-color .4s;
		opacity: 0.8;
		filter: alpha(opacity=80);
	}
	#content .contents__inner #cta-section .inner a.ctabtn::before {
		content: "";
		position: absolute;
		left: 25px;
		
		background-image: url(../_images/icon_store.svg);
		background-position: left 0 center;
		background-repeat: no-repeat;
		width: 114px;
  		height: 74px;
	}
	#content .contents__inner #cta-section .inner a.ctabtn::after {
		content: "▶︎";
		position: absolute;
		right: 25px;
		font-family: none;
    	transform: scale(0.8, 1.0);
	}


	#content .contents__inner ul.caption {
		padding-bottom: 10px;
	}
	#content .contents__inner ul.caption li {
		list-style: none;
		text-indent: -1.1em;
		padding-left: 1.1em;
		margin-bottom: 3px;
		font-size: 14px;
		line-height: 22px;
	}
	#content .contents__inner ul.caption li::before {
		content: "※";
		margin-right: 3px;
		font-size: 14px;
	}
	#content .contents__inner .btn a {
		border-radius: 10px;
		padding: 20px 0 20px 0;
		font-weight: 700;
		color: #FFF;
		font-size: 22px;
		text-align: center;
		max-width: 500px;
		margin: 30px auto 10px auto;

		background-color: #FF6E00;
		background-image:
			url("../_images/icon_x_w.svg"),
			url("../_images/arrow_w.svg");
		background-position:
			left  28px center,
			right 28px center;
		background-size: 34px,12px;
		background-repeat: no-repeat, no-repeat;
		box-shadow: 0 2px 0 rgba(153,74,29,1);
		display: block;
	}
		#content .contents__inner .btn a:hover,
		#content .contents__inner .btn a:focus-visible{
			color: #2F2F2F;
			background-color: #f4d924;
			background-image:
			url("../_images/icon_x.svg"),
			url("../_images/arrow_b.svg");
			text-decoration: none;
			opacity: 1;
			filter: alpha(opacity=100);
		}
	#content .contents__inner .present {
		background-color: #FFF;
		padding: 30px;
		text-align: center;
		margin-top: 60px;
	}
		#content .contents__inner .present .present__text {
			margin: 0;
			font-size: 32px;
			line-height: 1.2;
			font-weight: bold;
			letter-spacing: 0;
			color: #FF6E00;
			padding: 0 40px;
			position: relative;
			display: inline-block;
			margin-bottom: 30px;
		}
			#content .contents__inner .present .present__text::before,
			#content .contents__inner .present .present__text::after{
				content: "";
				position: absolute;
				top: 50%;
				width: 3px;
				height: 80px;
				background: #FF6E00;
				transform-origin: 50% 50%;
			}
			#content .contents__inner .present .present__text::before{
				left: 0;
				transform: translateY(-50%) rotate(-30deg);
			}
			#content .contents__inner .present .present__text::after{
				right: 0;
				transform: translateY(-50%) rotate(30deg);
			}
		#content .contents__inner .present img {
			width: 65%;
			margin: 0 auto;
		}

	#content .contents__inner .photos ul {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		width: 100%;
	}
		#content .contents__inner .photos ul li {
			width: 48%;
			list-style: none;
			font-size: 0;
			font-weight: bold;
			margin-bottom: 25px
		}
		#content .contents__inner .photos ul li p.photo {
			border: 7px solid #fff;
			
			border-radius: 3px;
			box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.4);
			margin-bottom: 8px;
		}
			#content .contents__inner .photos ul li p.photo img {
				width: 100%;
			}
		#content .contents__inner .photos ul li.image {
			text-align: center;
			display: flex;
			justify-content: center;
			align-items: center;
		}
			#content .contents__inner .photos ul li.image img {
				width: 70%;
				margin: 0 auto;
			}
		#content .contents__inner .photos ul li p.tag {
			font-size: 18px;
			font-weight: bold;
		}

#notes {
	padding: 80px 0;
	width: 100%;
	background-color: #fff;
}
	#notes .notes__inner {
		max-width: 900px;
		padding: 0 20px;
		margin: 0 auto;
	}
	#notes .notes__inner p {
		font-size: 14px;
		margin: 15px 0 0 0;
		line-height: 1.4rem;
	}
	#notes .notes__inner h3 {
		font-size: 26px;
		font-weight: bold;
		text-align: center;
		margin-bottom: 40px;
	}
	#notes .notes__inner h4 {
		font-size: 20px;
		position: relative;
		padding-left: 15px;
		margin-bottom: 5px;
		font-weight: 600;
	}
		#notes .notes__inner h4::before{
			content:"";
			position: absolute;
			left: 0;
			top: 50%;
			transform: translateY(-50%);
			width: 3px;
			height: 20px;
			background: #2F2F2F;
			border-radius: 1px;
		}

	#notes .notes__inner h5 {
		font-size: 16px;
		margin-block-start: 0;
		margin-block-end: 0;
		margin: 25px 0 10px 0;
		font-weight: 600;
	}
	#notes .notes__inner ul li {
		font-size: 14px;
		list-style: none;
		text-indent: -1.0em;
		padding-left: 1.0em;
		margin-bottom: 3px;
	}
	#notes .notes__inner ul li::before {
		content:"・";
		margin-right: 3px;
		font-size: 14px;
		line-height: 26px;
	}

.steps__list{
    list-style: none;
    margin: 0 auto 15px auto;
    width: 100%;
    gap: 24px;
    position: relative;
    display: flex;
    justify-content: space-between;
}
	.steps__list::before{
		content:"";
		position: absolute;
		left: 50%; top: 50%;
		transform: translate(-50%,-50%);
		border-left: 20px solid #111;
		border-top: 22px solid transparent;
		border-bottom: 22px solid transparent;
	}
	.steps__item{
		position: relative;
		background: #fff;
		box-shadow: 0 10px 30px rgba(0,0,0,.06);
		padding: calc(22px + 36px) 20px 20px;
		text-align: center;
		color: #111;
		overflow: hidden;
		width: 42%;
		border-radius: 10px;
	}
	.steps__item::before{
	  content: attr(data-step);
	  position: absolute; inset: 0 auto auto 0;
	  height: 36px;
	  width: 100%;
	  background: #111;
	  color: #fff;
	  font-weight: 700;
	  line-height: 36px;
	  letter-spacing: .04em;
	  border-radius: 10px 10px 0 0;
	}

	.steps__icon{ height: 130px; display: block; margin: 6px auto 16px; }
	.steps__text{ margin: 0; font-size: 20px; line-height: 1.6; font-weight: 400; }
	.steps__text .hl{
		text-decoration: none;
		font-weight: 700;
		background: linear-gradient(to top, rgba(255,243,116,1) 0 40%, transparent 40% 100%);
		box-decoration-break: clone;
		color: #ED6C1A;
	}


@media only screen and (max-width: 1160px) {
	#target h2 {
		font-size: 2.8vw;
		padding: 3vw 0;
	}
	#target .cta .promo-bar .promo-bar__text {
		font-size: 4vw;
	}
}

@media only screen and (max-width: 767px) {
	.pc{
		display: none;
	}
	.sp{
		display: block;
	}
	
	#target h2 {
		font-size: 4.3vw;
		line-height: 170%;
		padding: 4vw 0;
	}
	#target .cta .promo-bar .promo-bar__text {
		font-size: 6.6vw;
		padding: 0 4vw;
		font-weight: bold;
		line-height: 1.3;
	}
	#target .cta .promo-bar .promo-bar__inner {
		padding: 2vw 4.8vw 4vw 4.8vw;
	}
	#target .cta .promo-bar .promo-bar__inner::before {
		left: 4vw;
		transform: translateY(-50%) rotate(-20deg);
	}
	#target .cta .promo-bar .promo-bar__inner::after {
		right: 4vw;
		transform: translateY(-50%) rotate(20deg);
	}
	#target .cta .promo-bar .promo-bar__inner::before, #target .cta .promo-bar .promo-bar__inner::after {
		width: .6vw;
		height: 26vw;
	}
	#target .cta .btn {
		width: 90%;
        margin: 0 auto;
	}
	#target .cta .note {
		font-size: 3.6vw;
		line-height: 5.4vw;
		margin-top: inherit;
		width: 90%;
		margin: 3vw auto 0 auto;
	}
	#content .contents__inner p.date {
		font-size: 6vw;
		line-height: 8vw;
	}
	#content .contents__inner h3 {
		font-size: 6vw;
		line-height: 6vw;
		background-size: 7.4vw;
		padding: 10vw 0 0 10vw;
		margin: 0 0 4vw 0;
	}
	#content .contents__inner ul.caption li {
		margin-bottom: .6vw;
		font-size: 3.5vw;
		line-height: 1.7;
	}
		#content .contents__inner ul.caption li::before{
			margin-right: .6vw;
			font-size: 3.5vw;
		}
	#content .contents__inner ul.caption {
		padding-bottom: 0;
	}
	#content .contents__inner .btn a {
		border-radius: 2vw;
		padding: 4vw 0 4vw 0;
		font-size: 4.8vw;
		max-width: inherit;
		width: auto;
		margin: 6vw auto 2vw auto;
		background-position: left 6vw center, right 5.6vw center;
		background-size: 8vw, 2.4vw;
	}
	#content .contents__inner .present {
		padding: 6vw 0;
		margin-top: 10vw;
	}
	#content .contents__inner .present .present__text {
		font-size: 5.8vw;
		line-height: 1.4;
		padding: 0 8vw;
		margin-bottom: 5vw;
	}
	#content .contents__inner .present img {
		width: 84%;
	}
	#content .contents__inner .present .present__text::before {
		left: 6vw;
		transform: translateY(-50%) rotate(-25deg);
	}
	#content .contents__inner .present .present__text::after {
		right: 6vw;
		transform: translateY(-50%) rotate(25deg);
	}
	#content .contents__inner .present .present__text::before, #content .contents__inner .present .present__text::after {
		width: .6vw;
		height: 24vw;
	}
	#content .contents__inner .photos ul {
		display: block;
	}
	#content .contents__inner .photos ul li {
		width: auto;
		margin-bottom: 5vw;
	}
	#content .contents__inner .photos ul li p.tag {
		font-size: 4vw;
	}
	#content .contents__inner .photos ul li.image.sp {
		display: none;
	}
	#content .contents__inner p.read {
		font-size: 4.2vw;
		line-height: 6.8vw;
		margin-bottom: 2vw;
	}
	#content .contents__inner .influencer {
		display: block;
		text-align: center;
		margin: 1vw 0 5vw 0;
	}
	#content .contents__inner .influencer .profile {
		margin: 4vw 0 2vw 0;
	}
	#content .contents__inner .influencer .profile img {
		max-width: 45%;
	}
	#content .contents__inner .influencer em {
		font-size: 4.6vw;
		margin: 0 0 1vw 0;
	}
	#content .contents__inner .influencer a {
		font-size: 3.4vw;
	}
	#content .contents__inner #cta-section .inner:last-child {
		padding: 4vw 0 7vw 0;
	}
	#content .contents__inner #cta-section .inner a.ctabtn {
		width: 100%;
		height: 20vw;
	}
	#content .contents__inner #cta-section .inner a::before {
		right: 5vw;
	}
	#content .contents__inner #cta-section .inner a.ctabtn img {
		width: 13.6vw;
		margin-right: 3.6vw;
		margin-left: 1.8vw;
	}
	#content .contents__inner #cta-section .inner a.ctabtn::before {
		left: 5vw;
		width: 23vw;
		height: 15vw;
	}
	#content .contents__inner #cta-section .inner a p {
		font-size: 4.8vw;
	}
	#content .contents__inner #cta-section {
		padding: 0 0 5vw 0;
	}
	#notes {
		padding: 12vw 0;
	}
	#notes .notes__inner {
		padding: 0 4vw;
	}
	#notes .notes__inner p {
		font-size: 3.6vw;
		line-height: 1.7;
	}
	#notes .notes__inner h3 {
		margin-bottom: 6vw;
		font-size: 5.2vw;
	}
	#notes .notes__inner h4 {
		font-size: 4.8vw;
		padding-left: 3vw;
		margin-bottom: 4vw;
		font-weight: bold;
	}
		#notes .notes__inner h4::before{
			width: .6vw;
			height: 4.6vw;
		}
	#notes .notes__inner h5 {
		font-size: 4.4vw;
		margin: 7vw 0 1vw 0;
		font-weight: bold;
	}
	#notes .notes__inner ul li {
		font-size: 3.5vw;
		margin-bottom: 1.4vw;
		line-height: 1.7;
	}
	#notes .notes__inner ul li::before {
		margin-right: 1.75vw;
		font-size: 3.5vw;
		line-height: inherit;
	}
	#target .cta .btn a {
		border-radius: 2vw;
		padding: 4vw 0 4vw 0;
		font-size: 4.8vw;
		background-position: left 6vw center, right 5.6vw center;
	}
	.steps__list {
		margin: 0 auto 3vw auto;
		gap: 10vw;
		flex-direction: column;
	}
	.steps__item {
		box-shadow: 0 2vw 6vw rgba(0, 0, 0, .06);
		padding: calc(4vw + 7vw) 4vw 4vw;
		width: auto;
		border-radius: 2vw;
	}
	.steps__list::before {
		border-top: 4vw solid #111;
		border-right: 4.4vw solid transparent;
		border-left: 4.4vw solid transparent;
		top: 49.4%;
	}
	.steps__item::before {
		height: 7.2vw;
		line-height: 7.2vw;
		border-radius: 2vw 2vw 0 0;
		font-size: 4vw;
        padding: 1vw 0;
	}
	.steps__icon {
		height: 30vw;
		margin: 1vw auto 3.2vw;
	}
	.steps__text {
		font-size: 4.4vw;
	}
}