@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
*************************/

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 {
	--lp-color_white: #fff;
	--lp-color_gray: #ccc;
	--lp-color_lightGray: #ddd;
	--lp-color_black: #333;
	--lp-color_red: #c80000;

	--lp-color_shadow-black: rgba(0, 0, 0, .15);

	--lp-color_kv-bg: #fbdb00;
	--lp-color_kv-line: #1778b2;
	--lp-color_contents-yellowLight: #fefbdb;

	--lp-color_coupon-blueLight: #f2fcff;
	--lp-color_coupon-blueDark: #aedde9;

	--lp-color_entry-greenLight: #fafff7;
	--lp-color_entry-greenDark: #dcfdcd;
	--lp-color_entry-blueMedium: #1778b2;
	--lp-color_entry-wineRed: #eb1364;

	--lp-color_andmall-blue: #2882ff;
	--lp-color_outlet-orange: #f08200;
	--lp-color_line-greenDark: #3aae36;
	--lp-color_line-greenLight: #f0ffea;
	--lp-color_appPush-paleBrown: #fff6e5;
}

/*************************
animation keyframes
*************************/

/* エントリーボタン挙動 */
@keyframes loadingAnimation {
	from { transform: rotate(0turn); }
	to { transform: rotate(1turn); }
}

@keyframes backgroundFlash {
    0% { transform: scale(0) rotate(45deg); }
	100% { transform: scale(50) rotate(45deg); }
	0%, 100% { opacity: 0; }

	80% {
		transform: scale(0) rotate(45deg);
		opacity: .5;
	}
    81% {
		transform: scale(4) rotate(45deg);
		opacity: 1;
	}
}

@keyframes objectScaleInOut {
    0% { transform: scale(.5); }
	50% { transform: scale(1.1); }
	100% { transform: scale(1); }
}

/* フローティングボタン挙動 */
@keyframes floatingObject {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

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

/* ---------------------------
ページ共通
--------------------------- */
#LP {
	counter-reset: number 0;
	color: var(--lp-color_black);
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	line-height: 1.5;
	text-decoration: none;
	overflow: hidden;
	width: 100%;
}
#LP.is_end { pointer-events: none; }

body:has(.is_end) { overflow-y: hidden; }

#LP a {
	color: var(--lp-color_red);
	text-decoration: none;
}

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

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

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

#LP .textBold { 
	font-weight: 700;
	padding: 0 .2em;
}

#LP .textOrange { color: var(--lp-color_outlet-orange); }

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

/* ボタン */
#LP .common__button a {
	background-color: var(--lp-color_black);
    border-radius: 100px;
    color: var(--lp-color_white);
	cursor: pointer;
    font-size: 3vw;
    font-weight: 700;
    line-height: 1.4;
    display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: center;
	text-align: center;
    text-decoration: none;
	transition: .4s filter, .4s background, .4s border, .4s color;
	user-select: none;
    position: relative;
    margin: 0 auto;
    padding: .5em 1em;
    width: 88%;
    min-height: 4em;
}
#LP .common__button.square a { border-radius: 0; }
#LP .common__button a:hover { filter: brightness(.7); }

#LP .common__button a::after {
	border-top: 2px solid var(--lp-color_white);
    border-right: 2px solid var(--lp-color_white);
    content: "";
    display: block;
    position: absolute;
    top: calc(50% - 1vw);
    right: 1em;
    transform: rotate(45deg);
    transition: border .4s, filter .4s;
    width: 2vw;
    height: 2vw;
}

#LP .anchorLink a::after { transform: rotate(135deg); }

/* リボン */
#LP .common__headerRibbon {
    background-color: var(--lp-color_black);
    color: var(--lp-color_white);
    clip-path: polygon(0 0, 100% 0, 96% 50%, 100% 100%, 0 100%, 4% 50%);
    font-size: 4.2vw;
    font-weight: 900;
    line-height: 1.2;
    display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 0 auto;
	margin-bottom: 1.5em;
    min-height: 3em;
}

#LP .andmall .common__headerRibbon,
#LP a.andmall { background-color: var(--lp-color_andmall-blue); }

#LP .outlet .common__headerRibbon,
#LP a.outlet { background-color: var(--lp-color_outlet-orange); }

#LP .example .common__headerRibbon { background-color: var(--lp-color_entry-blueMedium); }

/* 吹き出し */
#LP .common__bubble {
	font-weight: 900;
	text-align: center;
	position: relative;
	margin: 0 auto;
	padding-bottom: .5em;
	width: fit-content;
}

#LP .common__bubble::before,
#LP .common__bubble::after {
	position: absolute;
	top: calc(50% - 1em);
}

#LP .common__bubble::before {
	content: "\FF3C";
	left: -1em;
}
#LP .common__bubble::after {
	content: "\FF0F";
	right: -1em;
}

#LP .common__bubble > .textBlock { display: inline-block; }

/* 注意書き */
#LP .common__list {
	margin: 0 auto;
	max-width: 800px;
}
#LP .common__list:not(:last-child) { padding-bottom: 1.5em; }

#LP .common__list a {
	border-bottom: 1px solid var(--lp-color_andmall-blue);
	color: var(--lp-color_andmall-blue);
    text-decoration: none;
	padding: 0 .5%;
}

#LP .common__list time {
	font-weight: 600;
	padding: 0 .2em;
}

#LP .common__list .point {
	border-bottom: 2px solid var(--lp-color_black);
	letter-spacing: -.05em;
}

#LP .common__list > li {
	color: var(--lp-color_black);
	font-size: 3vw;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: -.05em;
	text-align: left;
	padding-left: 1em;
}
#LP .common__list > li::before {
    content: '※';
	display: inline-block;
	text-align: center;
	margin-left: -1em;
	width: 1em;
}
#LP .common__list > li:not(:last-of-type) { margin-bottom: .35em; }

/* ---------------------------
キービジュアル
--------------------------- */
#LP .kv {
	background-color: var(--lp-color_kv-bg);
	border: 10px solid var(--lp-color_kv-line);
	border-left: none;
	border-right: none;
	width: 100%;
	height: auto;
}

#LP .kv__inner {
	background-repeat: no-repeat;
	background-position: center;
}

#LP .kv__h1 {
	margin: 0 auto;
	width: 100%;
}

/* ---------------------------
メインコンテンツ共通
--------------------------- */

#LP .contents { background-color: var(--lp-color_contents-yellowLight); }

#LP .contents__inner {
	margin: 0 auto;
	padding: 6% 0 8% 0;
	width: 100%;
}

/* ---------------------------
セクション共通
--------------------------- */

#LP .section__block {
	margin-left: auto;
	margin-right: auto;
	padding: 0 4.26%;
	width: 100%;
}
#LP .section__block:not(:last-of-type) { margin-bottom: 6%; }

/* ---------------------------
EC導線
--------------------------- */

#LP .ecLink {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 1em;
}
#LP .ecLink__button { width: 100%; }

/* ---------------------------
各コンテンツ固有スタイル
--------------------------- */

/* エントリー条件 */
#LP .section__block.terms { max-width: 1000px; }

#LP .terms__block {
	text-align: center;
	margin: 0 auto;
}

#LP .terms__block:not(:last-child) { margin-bottom: 2.5em; }
#LP .terms__box:not(:last-of-type) { margin-bottom: 1em; }

#LP .terms__detail {
    font-size: 3.2vw;
    font-weight: 900;
	text-align: center;
}

#LP .terms__detail.textColorChange {
    background: linear-gradient(transparent 75%, #f4c542 75%);
	color: var(--lp-color_entry-wineRed);
	display: inline-block;
	font-size: 2.4vw;
	font-weight: 500;
	margin-top: 1em;
}

#LP .terms__header {
	font-size: 4vw;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1em;
	position: relative;
	margin-bottom: 1em;
	width: 100%;
}

#LP .terms__header::before,
#LP .terms__header::after {
	background-color: var(--lp-color_black);
	content: "";
	flex: 1;
	width: 100%;
	height: 2px;
}

#LP .terms__list { max-width: 100%; }

/* スライダー */
#LP .sliders {
	margin: 0 auto;
	max-width: 1100px;
}

#LP .sliders > .contents__inner {
	background-color: var(--lp-color_white);
	border-radius: 16px;
	padding: 3em 3%;
}

#LP .sliders__baloon {
	font-size: 5vw;
	text-align: center;
}

#LP .sliderDynamic {
	margin-right: auto;
	margin-left: auto;
	max-width: 980px;
	width: 100%;
}

#LP .sliderDynamic:not(:last-of-type) { margin-bottom: 3em; }

#LP .sliders__block {
	background-color: var(--lp-color_white);
	border-radius: 10px;
	margin-bottom: 6%;
	padding: 6% 4%;
}

#LP .silders__header {
	font-size: 4.4vw;
	margin-bottom: 4%;
}

#LP .silders__wrapper,
#LP .silders__header {
	margin-left: auto;
	margin-right: auto;
	max-width: 980px;
}

#LP .silders__wrapper:not(:last-of-type) { margin-bottom: 6%; }

#LP .category__slider__more {
	display: none;
	text-align: right;
    position: absolute;
    top: 0;
    right: 0;
}

#LP .is_show .category__slider__more { display: block; }

#LP .category__slider__more a {
	border-bottom: 2px solid var(--lp-color_black);
	color: var(--lp-color_black);
	font-size: 3.5vw;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5em;
	text-decoration: none;
	opacity: 0;
	padding: .25em;
}
#LP .is_show .category__slider__more a { opacity: 1; }

#LP .is_show .category__slider__more a::after {
    border-top: 3px solid var(--lp-color_black);
    border-right: 3px solid var(--lp-color_black);
    content: '';
    vertical-align: middle;
    transform: rotate(45deg);
    width: .5em;
    height: .5em;
}

/* キャンペーン参加方法 */
#LP .section__block.step {
	font-size: 5vw;
	text-align: center;
	margin-bottom: 0;
	padding-bottom: 1em;
	max-width: 1000px;
}

#LP .step__block:not(:last-of-type) { margin-bottom: 1.5em; }

#LP .step__header {
    background: linear-gradient(transparent 70%, #f4c542 70%);
    color: var(--lp-color_entry-blueMedium);
    display: inline-block;
    font-weight: 900;
    margin-bottom: 1em;
    padding: 0 .25em;
}

#LP .step__text {
	font-size: .75em;
    font-weight: 600;
}

#LP .step__list > li:not(:last-of-type) { margin-bottom: 2em; }

#LP .step__list > li > *:not(:last-child) { margin-bottom: 1em; }

#LP .step__button a,
#LP .step__list__button a { background-color: var(--lp-color_entry-blueMedium); }

#LP .step__button a.entry { background-color: var(--lp-color_entry-wineRed); }

#LP .step__button:not(:last-of-type) { margin-bottom: .5em; }

#LP .step__notes { max-width: 100%; }

#LP .step__list__image {
	margin: 0 auto;
	width: 100%;
}

#LP .step__list__image img {
	margin: 0 auto;
	width: 100%;
}

#LP .step__04 .step__list__block,
#LP .step__04 .step__list__image {
	background-color: var(--lp-color_white);
	padding: 1.5em 1em;
}
#LP .step__04 .step__list__block > .step__list__image { padding: 0;}

#LP .step__04 .step__list__image { margin-bottom: 1.5em; }

/* エントリーエリア */
#LP .section__block.entry {
	background-color: #fff48e;
	clip-path: polygon(
		0 0,
		50% 3em,
		100% 0,
		100% 100%,
		0 100%
	);
	font-size: 5vw;
	text-align: center;
	padding-top: 3em;
}

#LP .entry__inner {
	margin: 0 auto; 
	padding-top: 1.5em;
	padding-bottom: 2.5em;
	max-width: 1000px;
	width: 100%;
}

#LP .entry__header {
	background: linear-gradient(
		transparent 70%,
		#f4c542 70%
	);
	color: var(--lp-color_entry-blueMedium);
	display: inline-block;
	font-weight: 900;
	margin-bottom: 1em;
	padding: 0 .25em;
}

#LP .entry__list { max-width: 980px; }

#LP .entry__button {
    background-color: var(--lp-color_gray);
    border-radius: 100px;
    cursor: no-drop;
	color: var(--lp-color_black);
    font-size: 3.3vw;
    font-weight: 700;
    line-height: 1.4;
    display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    text-decoration: none;
    transition: .4s filter, .4s background, .4s border, .4s color;
    user-select: none;
    position: relative;
    margin: 0 auto;
    padding: .5em 1em;
    width: 80%;
	min-height: 4em;
}

#LP .entry__button:hover { filter: initial; }

#LP .entry__button:empty {
	background-color: var(--lp-color_gray);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: row-reverse wrap;
	gap: .5em;
}
#LP .entry__button:empty::before {
	animation: loadingAnimation 1s ease-out infinite;
	border: .2em solid var(--lp-color_white);
	border-top-color: var(--lp-color_lightGray);
	border-radius: 50%;
	content: "";
	display: block;
	width: 1.25em;
	height: 1.25em;
}
#LP .entry__button:empty::after {
    border: none;
	content: "エントリー情報を送受信中";
    position: initial;
    transform: rotate(0);
	width: fit-content;
	height: auto;
}
#LP .entry__button:empty::before,
#LP .entry__button:empty::after { opacity: .7; }

#LP .member.licensed .entry__button {
	background-color: var(--lp-color_entry-wineRed);
	cursor: pointer;
	color: var(--lp-color_white);
	pointer-events: all;
	overflow: hidden;
}

#LP .member.licensed .entry__button::before {
    animation: backgroundFlash 3s ease-in-out infinite;
	background-color: rgba(255, 255, 255, .4);
    content: "";
    display: inline-block;
	position: absolute;
    top: -100px;
    left: 0;
    width: 30px;
    height: 100%;
}

#LP .member .entry__button.is_complate { animation: objectScaleInOut .4s ease-in-out; }

#LP .member:not(.licensed) .entry__button::after { border: none; }

#LP .entry__conditions,
#LP .entry__error {
	font-size: 2.4vw;
	text-align: center;
	transition: .4s opacity ease, height .4s ease, padding .4s ease;
	opacity: 0;
	pointer-events: none;
	margin: 0 auto;
	width: 100%;
	max-width: fit-content;
	height: 0;
}
#LP .guest .entry__conditions,
#LP .entry__error.is_show {
	opacity: 1;
	pointer-events: all;
	padding-top: 1em;
	height: auto;
}

#LP .entry__error { color: var(--lp-color_red); }

#LP .entry__conditions a {
	border-bottom: 2px solid currentColor;
	font-weight: 700;
	padding: 0 .2em;
}

#LP .entry__conditions .bylaws { margin-top: .5em; }
#LP .entry__conditions .bylaws a { color: var(--lp-color_andmall-blue); }

/* 購入例 */
#LP .section__block.example { max-width: 1000px; }

#LP .example__block:not(:last-of-type) { margin-bottom: 10%; }

#LP .example__header {
	font-size: 3vw;
	text-align: center;
	margin-bottom: 2.4vw;
}
#LP .example__ribbon { margin-bottom: .5em; }

#LP .example__illustration { margin-bottom: 3em; }
#LP .example__illustration > li:not(:last-of-type) { margin-bottom: 1.5em; }

#LP .example__bylows { margin-bottom: 3em; }

#LP .example__bylows__header {
	background-color: var(--lp-color_black);
	color: var(--lp-color_white);
	cursor: pointer;
	font-size: 3.6vw;
	font-weight: 700;
    display: flex;
	justify-content: center;
    align-items: center;
    position: relative;
	padding: 1em 3em;
    width: 100%;
}

#LP .example__bylows__header::before,
#LP .example__bylows__header::after {
    background-color: var(--lp-color_white);
    border-radius: 3px;
    content: "";
    position: absolute;
    transition: transform .4s;
    top: calc(50% - (3px / 2));
    right: 1em;
    width: 1em;
    height: 3px;
}
#LP .example__bylows__header::after { transform: rotate(90deg); }

#LP .example__bylows__header:hover::before { transform: rotate(90deg); }
#LP .example__bylows__header:hover::after { transform: rotate(180deg); }

#LP .is_show .example__bylows__header::before { transform: rotate(180deg); }
#LP .is_show .example__bylows__header::after { transform: rotate(360deg); }

#LP .example__bylows__text {
	background-color: var(--lp-color_white);
	font-size: 3vw;
	font-weight: 400;
	overflow: hidden;
	opacity: 0;
	transition: opacity .4s, max-height .4s ease, padding .4s;
	padding: 0 1.5em;
	max-height: 0;
}
#LP .is_show .example__bylows__text {
	opacity: 1;
	padding-top: 1.5em;
	padding-bottom: 1.5em;
}

#LP .example__bylows__block > *:not(:last-child) { margin-bottom: 1.25em; }
#LP .example__bylows__block:not(:last-of-type) { margin-bottom: 2.5em; }

#LP .example__bylows__block > .example__bylows__block__header {
	font-size: 1.1em;
	font-weight: 500;
	margin-bottom: .25em;
}

#LP .example__bylows__block > .example__bylows__block__ol {
	list-style: decimal;
	padding-left: 1em;
}

#LP .example__bylows__block__ol .example__bylows__block__ul { margin: .5em 0; }

#LP .example__bylows__block > .example__bylows__block__ul { padding-left: .5em; }

#LP .example__bylows__block li:not(:last-of-type) { margin-bottom: .25em; }

#LP .example__bubble {
	font-size: 2.8vw;
	padding-bottom: .5em;
}
#LP .example__bubble::before {
	transform: rotate(15deg);
	left: -.75em;
}
#LP .example__bubble::after {
	transform: rotate(-15deg);
	right: -.75em;
}
#LP .example__bubble::before,
#LP .example__bubble::after { top: calc(50% - .5em); }

/* フローティングボタン */
#LP .floating {
    transition: .4s opacity, transform .4s ease;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    z-index: 8;
    right: 0;
    bottom: 0;
    transform: translateY(2em);
    width: 100%;
}
#LP .floating.is_visible {
    opacity: 1;
    transform: translateY(0);
}

#LP .floating__inner {
    margin: 0 auto;
    width: 100%;
    max-width: 1920px;
}
#LP .is_visible .floating__inner { pointer-events: none; }

#LP .floating a {
    animation: floatingObject 4s infinite ease-in-out;
    background-color: var(--lp-color_entry-wineRed);
    border-radius: 1000px;
    box-shadow: 0 0 2px var(--lp-color_shadow-black);
    color: var(--lp-color_white);
    display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: center;
    gap: .25em;
    font-size: 3vw;
    font-weight: 700;
    letter-spacing: .01em;
    transition: bottom 1s ease-in-out, .4s background, .4s color;
    text-align: center;
    pointer-events: none;
    position: relative;
    right: 1.5vw;
    bottom: 1.5vw;
    user-select: none;
    line-height: 1.2;
    margin-left: auto;
    width: 22vw;
    height: 22vw;
}
#LP .floating.is_visible a { pointer-events: auto; }

#LP .floating a:hover {
    background-color: var(--lp-color_white);
    border: 2px solid var(--lp-color_black);
    color: var(--lp-color_black);
}

#LP .floating .textBlock.arrow {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	gap: .25em;
	position: relative;
}

#LP .floating .textBlock.arrow::after {
    border-top: 3px solid var(--lp-color_white);
    border-right: 3px solid var(--lp-color_white);
    border-radius: 0 3px 0 0;
    content: "";
    display: inline-block;
    transform: rotate(45deg);
    transition: border .4s, transform .4s;
    width: 2vw;
    height: 2vw;
}

#LP .floating a:hover .textBlock.arrow::after {
    border-top-color: var(--lp-color-black);
    border-right-color: var(--lp-color-black);
}

#LP .floating .textBlock.arrow:hover::after {
    border-top-color: var(--lp-color-black);
    border-right-color: var(--lp-color-black);
    transform: rotate(45deg) translate(5px, -5px);
}

/* モーダル本体 */
#LP .modal {
	background-color: var(--lp-color_white);
	border-radius: 8px;
	box-sizing: border-box;
	font-size: 3.6vw;
	text-align: center;
	display: flex;
	flex-flow: column wrap;
	gap: 1.5em;
	transform: translateY(10px);
	transition: transform .3s ease;
	padding: 2em 1em;
	width: 90%;
	max-width: 500px;
}
@media screen and (min-width: 768px) {
	#LP .modal { font-size: 3vw; }
}

#LP .modal .supplement {
	font-size: .8em;
	display: block;
	margin-top: .5em;
}

/* モーダル背景オーバーレイ */
#LP .modal__overlay {
	background: rgba(0, 0, 0, .6);
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s ease;
	z-index: 1000;
}

/* モーダル本体表示状態 */
#LP .modal__overlay.isActive {
	opacity: 1;
	visibility: visible;
}

/* モーダル本体表示時のアニメーション */
#LP .modal__overlay.isActive .modal { transform: translateY(0); }

/* モーダルテキスト: ボタン */
#LP .modal__close {
	background-color: var(--lp-color_red);
	border: none;
	border-radius: 8px;
	color: var(--lp-color_white);
	cursor: pointer;
	font-size: .75em;
	font-weight: 500;
	margin: 0 auto;
	padding: .5em 1.5em;
	width: 50%;
}

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

@media screen and (min-width: 980px) {
	/* ---------------------------
	ページ共通
	--------------------------- */

	#LP {
		overflow: hidden;
		margin: 0 auto;
		width: 100%;
		min-width: 1000px;
	}

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

	/* ボタン共通 */
    #LP .common__button a::after {
        border-top-width: 3px;
        border-right-width: 3px;
        top: calc(50% - (14px / 2));
        width: 14px;
        height: 14px;
    }

	#LP .common__button a {
        font-size: 20px;
        max-width: 450px;
        width: 100%;
    }

	#LP .anchorLink a { max-width: 650px; }

	#LP .common__headerRibbon {
        font-size: 28px;
        min-height: 3em;
        max-width: 650px;
    }

	/* 注意書き */
	#LP .common__list > li {
		font-size: 14px;
		line-height: 1.35;
	}

	/* ---------------------------
	キービジュアル
	--------------------------- */

	#LP .kv__inner {
		background-image: url("../images/pc/wh_kv_main-background.png");
		background-size: 1468px auto;
	}

	#LP .kv__h1 { width: fit-content; }

	/* ---------------------------
	メインコンテンツ共通
	--------------------------- */

	#LP .contents__inner { padding: 48px 0; }

	#LP .section__block { padding: 0; }
	#LP .section__block:not(:last-of-type) { margin-bottom: 60px; }

	/* ---------------------------
	EC導線
	--------------------------- */

	#LP .ecLink { flex-direction: row; }
	#LP .ecLink__button { max-width: 450px; }

	/* ---------------------------
	各コンテンツ固有スタイル
	--------------------------- */

	/* スライダー */
	#LP .sliders { padding: 0 10px; }

	#LP .sliders > .contents__inner { padding: 3em 10px; }

	#LP .sliders__baloon { font-size: 32px; }

	#LP .sliders__block {
		margin-bottom: 3em;
		padding: 3em 1.5em;
	}

	#LP .silders__header {
		font-size: 36px;
		margin-bottom: 1em;
	}

	#LP .silders__wrapper:not(:last-of-type) { margin-bottom: 3em; }

	#LP .is_show .category__slider__more a { font-size: 22px; }

	/* エントリー条件 */
	#LP .section__block.terms { padding: 0 10px; }

	#LP .terms__detail { font-size: 24px; }
	#LP .terms__detail.textColorChange { font-size: 18px; }

	#LP .terms__header { font-size: 18px; }

	#LP .terms__block img {
		margin: 0 auto;
		width: 100%;
		max-width: fit-content;
	}

	/* キャンペーン参加方法 */
	#LP .section__block.step {
		font-size: 36px;
		padding: 0 10px;
	}

	#LP .step__button a.entry { max-width: 450px; }

	#LP .step__list__image img,
	#LP .step__04 .step__list__block > .step__list__image { max-width: fit-content; }

	/* エントリーエリア */
	#LP .section__block.entry { font-size: 36px; }

	#LP .entry__inner {
		padding-left: 10px;
		padding-right: 10px;
	}

	#LP .entry__button {
		font-size: 20px;
		max-width: 450px;
		width: 100%;
	}

	#LP .entry__explanation { margin-bottom: 48px; }
	#LP .entry__component:not(:last-of-type) { margin-bottom: 72px; }

	#LP .entry__text { font-size: 24px; }

	#LP .entry__button:empty::before {
		border-width: 4px;
		width: 1.5em;
		height: 1.5em;
	}

	#LP .entry__conditions,
	#LP .entry__error { font-size: 16px; }

	/* 購入例 */
	#LP .section__block.example { padding: 0 10px; }

	#LP .example__block:not(:last-of-type) { margin-bottom: 60px; }

	#LP .example__header {
		font-size: 16px;
		margin-bottom: 36px;
	}

	#LP .example__bylows__header { font-size: 20px; }

	#LP .example__bylows__text { font-size: 14px; }

	#LP .example__bubble { font-size: 24px; }

	#LP .example__bubble::before {
		transform: rotate(0);
		left: -1em;
	}
	#LP .example__bubble::after {
		transform: rotate(0);
		right: -1em;
	}
	#LP .example__bubble::before,
	#LP .example__bubble::after { top: calc(50% - 1em); }

    /* フローティングボタン */
    #LP .floating { transform: translateY(25px); }

    #LP .floating a {
        font-size: 15px;
        bottom: 25px;
        right: 25px;
        width: 120px;
        height: 120px;
    }

	#LP .floating .textBlock.arrow::after {
        width: 12px;
        height: 12px;
    }

	/* モーダル本体 */
	#LP .modal { font-size: 20px; }
}