@charset "UTF-8";

/*************************
font_import
*************************/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');

/*************************
reset style　＆　CMS unique style
*************************/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,main,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}*[hidden]{display:none}body{line-height:1}menu,ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body.noscroll{overflow:hidden}.iframe{width:100%;height:100%}.overlay{position:fixed;top:0;left:0;height:100vh;width:100%}.overlay.hidden{top:-100vh}#header.fixed{top:0;height:48px;position:sticky;box-shadow:0 2px 10px #2121211a}#header,#footer{overflow:hidden}@media screen and (min-width: 768px){#header.fixed{height:64px}}

*, *::before, *::after { box-sizing: border-box; }

#header {
	position: relative;
	z-index: 100;
}

#drawer.overlay,
#search-modal.overlay { z-index: 101; }

#drawer.overlay.hidden,
#search-modal.overlay.hidden {
	opacity: 0;
	z-index: 0;
}

/* 以下へページ固有のスタイル記述していく */

/*************************
custom properties
*************************/

#LP.instaCP {
	--lp-color_main: #6D240F;

	--lp-color_black: #333;
	--lp-color_dark-gray: 100, 100, 100;
	--lp-color_white: #fff;

	--lp-color_orange: #F7900F;
	--lp-color_yellow: #FFF490;
	--lp-color_pale-beige: #FEFAEC;
	--lp-color_light-blue: #0575F0;
	--lp-color_sky-blue: #DDF3FF;
}

/*************************
main
SP_layout（980px未満）
*************************/

/* LP共通 */
#LP.instaCP {
	color: var(--lp-color_black);
	font-family: 'Noto Sans JP', sans-serif;
	line-height: 1.6;
	font-weight: 500;
	width: 100%;
	height: auto;
	overflow: hidden;
}
#LP.instaCP.is_end { pointer-events: none; }

#LP.instaCP a { color: var(--lp-color_black); }

#LP.instaCP img {
	user-select: none;
	vertical-align: bottom;
	width: 100%;
	height: auto;
}

#LP.instaCP time,
#LP.instaCP span {
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
}

#LP.instaCP .device_sp { display: block; }
#LP.instaCP .device_pc { display: none; }

#LP.instaCP .text-block {
	color: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
	display: block;
}

#LP.instaCP .commonParts__h2 {
	color: var(--lp-color_main);
	font-size: 4.5vw;
	font-weight: 900;
	text-align: center;
	line-height: 1.5;
	letter-spacing: .12em;
	user-select: none;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5em;
	margin-bottom: 5%;
	position: relative;
}

#LP.instaCP .commonParts__h2::before,
#LP.instaCP .commonParts__h2::after {
    background-image: radial-gradient(currentColor 1px, transparent 2px);
    background-size: 12px 12px;
    background-repeat: repeat-x;
    content: '';
    flex-grow: 1;
    height: 1.5em;
}
#LP.instaCP .commonParts__h2::before { background-position: right; }
#LP.instaCP .commonParts__h2::after { background-position: left; }

#LP.instaCP .commonParts__insta a {
	color: var(--lp-color_light-blue);
	transition: filter .4s;
}
#LP.instaCP .commonParts__insta a:hover { filter: brightness(.7); }

#LP.instaCP .commonParts__insta-link {
	margin: 0 auto 3% auto;
	width: 100%;
}
#LP.instaCP .commonParts__insta-link a { display: block; }

#LP.instaCP .commonParts__insta-supplement {
	font-size: 2.4vw;
	font-weight: 600;
	letter-spacing: .01em;
	text-align: center;
}

#LP.instaCP .commonParts__insta-supplement a { color: var(--lp-color_light-blue); }

/* キービジュアル */
#LP.instaCP .mainVisulal__h1 {
	margin: 0 auto;
	width: 100%;
}

#LP.instaCP .mainVisulal__text {
	font-size: 3.6vw;
	font-weight: bold;
	text-align: center;
	letter-spacing: -.01em;
	line-height: 1;
	margin: 0 auto;
	padding: 3.5% 0;
	width: 100%;
}

/* メインコンテンツ */
#LP.instaCP .overView {
	background: repeating-linear-gradient(
		-45deg,
		var(--lp-color_pale-beige) 0, var(--lp-color_pale-beige) 13px,
		var(--lp-color_white) 0, var(--lp-color_white) 26px
	);
}

#LP.instaCP .overView__inner {
	text-align: center;
	line-height: 1.65;
	margin: 0 auto;
	padding: 5% 0 10% 0;
	width: 92%;
}

#LP.instaCP .overView__h2 {
	margin: 0 auto;
	padding-bottom: 4%;
	line-height: 1.8;
    font-size: 3.5vw;
    font-weight: 900;
}

#LP.instaCP .overView__h2 span {
	line-height: 1.4;
	font-size: 120%;
	color: var(--lp-color_orange);
	background:linear-gradient(transparent 75%, var(--lp-color_yellow) 75%);
}

#LP.instaCP .overView__box .campaignItem_name {
	margin-bottom: 6%;
	text-align: center;
    font-size: 2.6vw;
}

#LP.instaCP .overView__btn-anchor a {
    background-color: var(--lp-color_orange);
    color: var(--lp-color_white);
    cursor: pointer;
	display: block;
    font-size: 4vw;
    font-weight: 700;
    text-align: center;
	text-decoration: none;
    line-height: 1.2;
    transition: .4s;
    user-select: none;
    position: relative;
	margin: 0 auto;
	margin-top: 8%;
    padding: 4%;
    width: 75%;
}
#LP.instaCP .overView__btn-anchor a::before { 
	border-top: 2px solid var(--lp-color_white);
    border-right: 2px solid var(--lp-color_white);
	content: '';
	vertical-align: middle;
	transform: rotate(135deg);
	position: absolute;
    top: calc(50% -2vw);
    right: 5%;
    width: 3vw;
    height: 3vw;
}
#LP.instaCP .overView__btn-anchor a:hover { filter: brightness(.7); }

#LP.instaCP .presentExplain__inner {
	margin: 0 auto;
	padding: 8% 0;
	width: 88%;
}

#LP.instaCP .presentExplain__text {
    font-size: 3.8vw;
    font-weight: 900;
    text-align: center;
    line-height: 1.8;
	letter-spacing: -.025em;
}

#LP.instaCP .presentExplain,
#LP.instaCP .applyStep { background-color: var(--lp-color_pale-beige); }

#LP.instaCP .applyStep__inner {
	margin: 0 auto;
	padding: 2% 0 10% 0;
	width: 88%;
}

#LP.instaCP .applyStep__block { margin-bottom: 8%; }

#LP.instaCP .applyStep__block-orderList {
	background-color: var(--lp-color_white);
	border: 3px solid var(--lp-color_main);
}

#LP.instaCP .applyStep__block-orderList > li { position: relative; }

#LP.instaCP .applyStep__figure { padding: 1.5em 0; }

#LP.instaCP .applyStep__block-orderList > li:not(:last-of-type) {
	border-bottom: 3px solid var(--lp-color_main);
}
#LP.instaCP .applyStep__block-orderList > li:not(:last-of-type)::before {
	content: "";
	position: absolute;
	left: calc(50% - 16px);
	bottom: -16px;
	width: 0;
	height: 0;
	border-left: 16px solid transparent;
	border-right: 16px solid transparent;
	border-top: 16px solid var(--lp-color_main);
}
#LP.instaCP .applyStep__block-orderList > li:not(:last-of-type)::after {
	content: "";
	position: absolute;
	left: calc(50% - 12px);
	bottom: -11.5px;
	width: 0;
	height: 0;
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
	border-top: 12px solid var(--lp-color_white);
}

#LP.instaCP .applyStep__image {
	margin: 0 auto;
	padding-bottom: 1em;
	width: 22.6%;
}

#LP.instaCP .applyStep__figcaption {
	font-size: 2.5vw;
	text-align: center;
	line-height: 1.75;
}

#LP.instaCP .applyStep__figcaption a {
	color: var(--lp-color_light-blue);
	font-weight: 700;
	transition: .4s;
}
#LP.instaCP .applyStep__figcaption a:hover { filter: brightness(.7); }

#LP.instaCP .detailExplain { background-color: var(--lp-color_white); }

#LP.instaCP .detailExplain__inner {
	margin: 0 auto;
	padding: 5% 0 10% 0;
	width: 88%;
}

#LP.instaCP .detailExplain__box {
	font-size: 3.6vw;
	line-height: 1.8;
	letter-spacing: .01em;
	text-align: center;
}
#LP.instaCP .detailExplain__box:not(:last-of-type) { margin-bottom: 8%; }

#LP.instaCP .detailExplain__text {
	font-weight: 600;
	letter-spacing: .01em;
	line-height: 1.6;
}

#LP.instaCP .detailExplain__unorderList {
	font-size: 3.4vw;
	text-align: left;
}

#LP.instaCP .detailExplain__unorderList > li {
	position: relative;
	padding-left: 1em;
}
#LP.instaCP .detailExplain__unorderList > li:before {
	background-color: var(--lp-color_black);
	border-radius: 50%;
	content: "";
	font-size: .65em;
	position: absolute;
	top: 1em;
	left: 0;
	width: 0.8em;
	height: 0.8em;
}

#LP.instaCP .detailExplain__unorderList > li:not(:last-of-type) { margin-bottom: 5%; }

#LP.instaCP .detailExplain__unorderList-h3 {
	font-weight: 900;
	letter-spacing: 0.2em;
	margin-bottom: 1%;
}

#LP.instaCP .detailExplain__unorderList-text {
	font-size: 90%;
	font-weight: 500;
	letter-spacing: .05em;
	line-height: 1.5;
}
#LP.instaCP .detailExplain__unorderList-text > .text-block > span { font-size: 80%; }

#LP.instaCP .detailExplain__unorderList-text > .text-block > .text-conjunction {
	display: inline-block;
	margin: 0 .5em;
}
#LP.instaCP .detailExplain__unorderList-text > .text-block > .device_pc { display: none; }
#LP.instaCP .detailExplain__unorderList-text > .text-block > .device_sp { display: inline; }

#LP.instaCP .detailExplain__notes-text,
#LP.instaCP .detailExplain__notes-orderList { text-align: left; }

#LP.instaCP .detailExplain__notes-text {
	font-size: 4vw;
	font-weight: 900;
	line-height: 1.5;
	margin-bottom: 3.5%;
}

#LP.instaCP .detailExplain__notes-orderList {
	list-style-position: inside;
	margin-bottom: 8%;
}

#LP.instaCP .detailExplain__notes-orderList > li {
	font-size: 3vw;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: .05em;
	text-indent: -1em;
	padding-left: 1em;
}
#LP.instaCP .detailExplain__notes-orderList > li:not(:last-of-type) { margin-bottom: .5em; }

#LP.instaCP .detailExplain__terms {
	border: 1px solid var(--lp-color_black);
	box-shadow: 3px 3px 6px -3px rgba(var(--lp-color_dark-gray), .4) inset;
	font-size: 2.5vw;
	letter-spacing: .12em;
	line-height: 1.5;
	text-align: left;
	overflow-y: scroll;
	padding: 6%;
	height: 30vh;
}
#LP.instaCP .detailExplain__terms-unorderList { line-height: 1.7; }

#LP.instaCP .detailExplain__terms-unorderList a { transition: .4s; }
#LP.instaCP .detailExplain__terms-unorderList a:hover { color: var(--lp-color_main); }

#LP.instaCP .detailExplain__terms-unorderList span { font-weight: bold; }
#LP.instaCP .detailExplain__terms-unorderList span.header {
	display: inline-block;
	margin-bottom: 2%;
}

#LP.instaCP .detailExplain__terms-unorderList > li { letter-spacing: .05em; }
#LP.instaCP .detailExplain__terms-unorderList > li:not(:last-of-type) { margin-bottom: 5%; }

/*************************
main
PC_layout（980px以上）
*************************/

@media screen and (min-width: 980px) {
	#LP.instaCP { min-width: 1000px; }

	#LP.instaCP .device_sp { display: none; }

	#LP.instaCP .device_pc { display: block; }
	#LP.instaCP .text-block.device_pc { display: inline; }

	#LP.instaCP .commonParts__h2 {
		font-size: 28px;
		gap: 1em;
		margin-bottom: 25px;
	}

	#LP.instaCP .commonParts__h2::before,
	#LP.instaCP .commonParts__h2::after {
		background-image: radial-gradient(currentColor 2px, transparent 3px);
        background-size: 18px 18px;
	}

	#LP.instaCP .commonParts__insta {
		margin: 0 auto;
		width: fit-content;
	}

	#LP.instaCP .commonParts__insta-link {
		margin-bottom: 15px;
		width: fit-content;
	}

	#LP.instaCP .commonParts__insta-supplement {
		font-size: 16px;
		letter-spacing: .001em;
	}

	/* キービジュアル */
	#LP.instaCP .mainVisulal__inner {
		background-color: var(--lp-color_sky-blue);
		background-image:url('../images/pc/wh_kv_bg_illust.png');
		background-repeat: no-repeat;
		background-size: auto;
		background-position-x: center;
		height: 230px;
	}

	#LP.instaCP .mainVisulal__h1 {
		width: fit-content;
		padding-top: 25px;
	}

	#LP.instaCP .mainVisulal__text {
		font-size: 22px;
		letter-spacing: 0.05em;
		padding: 20px 0;
		width: fit-content;
	}

	#LP.instaCP .overView__inner {
		padding: 40px 0 60px 0;
		width: 980px;
	}

	#LP.instaCP .overView__h2 {
		padding-bottom: 28px;
		line-height: 1.9;
		font-size: 28px;
	}

	#LP.instaCP .overView__h2 span {
		line-height: 1;
		font-size: 36px;
		background: linear-gradient(transparent 70%, var(--lp-color_yellow) 70%);
	}

	#LP.instaCP .overView__box .campaignItem img {
		width: fit-content;
		margin: 0 auto;
	}

	#LP.instaCP .overView__box .campaignItem_name {
		margin-bottom: 48px;
		font-size: 18px;
	}

	#LP.instaCP .overView__btn-anchor a {
        font-size: 24px;
		margin-top: 40px;
        padding: 20px 0;
		width: 450px;
	}
	#LP.instaCP .overView__btn-anchor a::before { 
		top: calc(50% - 10px);
        right: 20px;
        width: 14px;
        height: 14px;
	}

	#LP.instaCP .presentExplain__inner {
		padding: 53px 0 35px 0;
		width: 980px;
	}

	#LP.instaCP .presentExplain__text {
		font-size: 23px;
		letter-spacing: .01em;
	}

	#LP.instaCP .applyStep__inner {
		padding: 15px 0 50px 0;
		width: 980px;
	}

	#LP.instaCP .applyStep__h2.commonParts__h2 { margin-bottom: 35px; }

	#LP.instaCP .applyStep__block-orderList > li:not(:last-of-type)::before {
		top: calc(50% - 24px);
		right: -40px;
		left: initial;
		bottom: 0;
		width: 0;
		height: 0;
		border-top: 24px solid transparent;
		border-bottom: 24px solid transparent;
		border-left: 24px solid var(--lp-color_main);
	}
	#LP.instaCP .applyStep__block-orderList > li:not(:last-of-type)::after {
		top: calc(50% - 20px);
		right: -32px;
		left: initial;
		bottom: 0;
		border-top: 20px solid transparent;
		border-bottom: 20px solid transparent;
		border-left: 20px solid var(--lp-color_white);
	}

	#LP.instaCP .applyStep__block {
		margin-bottom: 40px;
	}
	
	#LP.instaCP .applyStep__block-orderList {
		display: flex;
		flex-flow: row wrap;
	}

	#LP.instaCP .applyStep__block-orderList > li { width: 50%; }

	#LP.instaCP .applyStep__block-orderList > li:not(:last-of-type) {
		border-bottom: none;
		border-right: 3px solid var(--lp-color_main);
	}

	#LP.instaCP .applyStep__image {
		width: fit-content;
	}

	#LP.instaCP .applyStep__figcaption {
		font-size: 14px;
		font-weight: 700;
	}

	#LP.instaCP .detailExplain__inner {
		padding: 50px 0 100px 0;
		width: 980px;
	}

	#LP.instaCP .detailExplain__box {
		font-size: 20px;
		line-height: 1.5;
	}
	#LP.instaCP .detailExplain__box:not(:last-of-type) { margin-bottom: 50px; }

	#LP.instaCP .detailExplain__unorderList {
		width: 830px;
		margin: 0 auto;
		font-size: 20px;
	}

	#LP.instaCP .detailExplain__unorderList > li:before { top: .8em; }

	#LP.instaCP .detailExplain__unorderList > li:not(:last-of-type) { margin-bottom: 30px; }

	#LP.instaCP .detailExplain__unorderList-h3 { margin-bottom: 10px; }
	#LP.instaCP .detailExplain__unorderList-text { font-size: 80%; }
	#LP.instaCP .detailExplain__unorderList-text > .text-block > .device_pc { display: inline; }
	#LP.instaCP .detailExplain__unorderList-text > .text-block > .device_sp { display: none; }

	#LP.instaCP .detailExplain__notes-text {
		font-size: 24px;
		letter-spacing: .01em;
		margin-bottom: 24px;
	}

	#LP.instaCP .detailExplain__notes-orderList { margin-bottom: 35px; }
	#LP.instaCP .detailExplain__notes-orderList > li { font-size: 16px; }

	#LP.instaCP .detailExplain__terms {
		font-size: 15px;
		padding: 35px;
		height: 370px;
	}

	#LP.instaCP .detailExplain__terms-unorderList span.header { margin-bottom: 8px; }
	#LP.instaCP .detailExplain__terms-unorderList > li:not(:last-of-type) { margin-bottom: 25px; }
}