@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_light-gray: #ddd;
	--lp-color_black: #333;
	--lp-color_red: #c80000;
	--lp-color_shadow-black: rgba(0, 0, 0, .15);

	--lp-color_dark-pink: #d87caa;
	--lp-color_middle-pink: #ee64ae;
	--lp-color_light-pink: #ffd9e4;
	--lp-color_light-azure: #64aeee;
	--lp-color_steel-blue: #2c67a2;
	--lp-color_pale-lemon: #fbf69c;

	--lp-color_main: #f3ecae;
	--lp-color_kv: #f6eecc;

	--lp-component_entryButton: #eb1364;
}

/*************************
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); }
}

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

#LP {
	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 a {
	text-decoration: none;
	transition: .4s filter;
}
#LP a:hover { filter: brightness(.7); }

#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 .device_sp { display: block; }
#LP .device_pc { display: none; }

/* ボタ共通 */
#LP .common__button {
	margin: 0 auto;

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

		&::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;
		}

		&:hover { filter: brightness(.7); }
	}

	&:has(.tolkShow__button) a { background-color: var(--lp-color_dark-pink); }

	&:has(.ecRegist) a,
	&:has(.ecLogin) a { background-color: var(--lp-color_light-azure); }
}

#LP .common__ribbon {
	font-size: 5vw;
	font-weight: 900;
	line-height: 1.8;
	position: relative;
	margin: 0 auto;
	margin-bottom: .5em;
	width: 100%;
	height: auto;
}

#LP .common__ribbon__body {
	color: #fff;
	display: flex;
	text-align: center;
	justify-content: center;
	align-items: center;
	position: relative;
	margin: 0 auto;
	padding: .4em .75em;
	width: 100%;
	max-width: 686px;

	&::before,
	&::after {
		background: #a2d4ff;
		content: "";
		position: absolute;
		z-index: 1;
		width: .8em;
		height: calc(100% - .4em * 2);
	}

	&::before {
		clip-path: polygon(
			100% 0,
			0 0,
			40% 50%,
			0 100%,
			100% 200%
		);
		bottom: 0;
		left: 0;
	}

	&::after {
		clip-path: polygon(
			0 0,
			100% 0,
			60% 50%,
			100% 100%,
			0 200%
		);
		top: 0;
		right: 0;
	}

	> .textBlock {
		background: var(--lp-color_light-azure);
		display: block;
		user-select: none;
		position: relative;
		z-index: 2;
		width: 100%;
		max-width: 686px;
		height: auto;

		&::before,
		&::after {
			content: "";
			position: absolute;
			z-index: 2;
			width: calc(.4em * 5 / 3);
			height: .4em;
		}

		&::before {
			background: linear-gradient(
				30deg,
				#a2d4ff 50%,
				#f48fb1 50%
			);
			bottom: -.4em;
			left: 0;
		}

		&::after {
			background: linear-gradient(
				30deg,
				#f48fb1 50%,
				#a2d4ff 50%
			);
			top: -.4em;
			right: 0;
		}
	}
}

/* KV */
#LP .kv {
	background-color: #d3e9fc;
	margin: 0 auto;
	width: 100%;
	height: auto;
}

#LP .kv__h1 {
	margin: 0 auto;
	width: 100%;
	max-width: 750px;

	> img { width: 100%; }
}

/* メインコンテンツ */
#LP .contents {
	background-color: #f4faff;
	margin: 0 auto;
	width: 100%;
}

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

	&.cm,
	&.no2 { background-color: #fffdf4; }
}

#LP .section__inner {
	margin: 0 auto;
	padding: 6.75% 5.4%;
	max-width: 750px;

	img { width: 100%; }
	&.bylows__inner { padding-top: 0; }
}

#LP .kyosuki__h2 {
	color: var(--lp-color_steel-blue);
	font-size: 4vw;
	font-weight: 900;
	text-align: center;
	margin-bottom: 1em;
}

#LP .kyosuki__cmpList {
	color: var(--lp-color_steel-blue);
	font-size: 3.6vw;
	font-weight: 700;
	text-align: center;

	> li {
		background-color: var(--lp-color_white);
		border-radius: 8px;
		box-shadow: 0 0 10px rgba(128, 182, 229 , .42);
		padding: 1em .75em;

		&:not(:last-of-type) { margin-bottom: 1em; }
	}
}

#LP .kyosuki__cmpList__h3 {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: .5em;
	margin-bottom: 1em;
}

#LP .kyosuki__cmpList__h3__baloon {
	background-color: var(--lp-color_light-azure);
	border-radius: 1000px;
	color: var(--lp-color_white);
	display: inline-block;
	font-size: .6em;
	position: relative;
	padding: .15em .75em;

	&::after {
		border-style: solid;
		border-width: .35em 0 .35em .5em;
		border-color:
			transparent
			transparent
			transparent
			var(--lp-color_light-azure);
		translate: 100% -50%;
		content: "";
		position: absolute;
		top: 50%;
		right: .1em;
	}
}

#LP .kyosuki__cmpList__h3__merit {
    background: linear-gradient(
		transparent 75%,
		var(--lp-color_light-pink) 75%
	);
	font-size: .8em;
	font-weight: 900;
	display: inline-block;
}

#LP .kyosuki__cmpList__box {
	display: flex;
	flex-flow: row;
	align-items: center;
	justify-content: space-between;

	&:has(.kyosuki__cmpList__image:empty) .kyosuki__cmpList__caption {
		font-size: 1em;
		padding: .5em 0;
		width: 100%;
	}
}

#LP .kyosuki__cmpList__caption,
#LP .kyosuki__cmpList__image { width: calc(50% - .5em / 2); }

#LP .kyosuki__cmpList__caption {
	font-size: .75em;
	font-weight: 900;
}

#LP .kyosuki__cmpList__image:empty { display: none; }

#LP .kyosuki__cmpList__anchor {
	position: relative;
	margin-top: 1em;

	a {
		background-color: var(--lp-color_middle-pink);
		border-radius: 1000px;
		color: var(--lp-color_white);
		font-size: .75em;
		font-weight: 700;
		line-height: 1;
		display: inline-flex;
		align-items: center;
		transition: filter .4s;
		position: relative;
		padding: .3em 1.75em .3em .75em;
		width: fit-content;

		&::before,
		&::after {
			content: "";
			position: absolute;
		}

		&::before {
			background-color: var(--lp-color_white);
			border-radius: 1000px;
			top: .35em;
			right: .5em;
			width: .85em;
			height: .85em;
		}
		&::after {
			border: .125em solid var(--lp-color_middle-pink);
			border-top: none;
			border-left: none;
			transform: rotate(45deg);
			top: .55em;
			right: .75em;
			width: .35em;
			height: .35em;
		}
	}
}

#LP .cm__h3 {
	font-size: 3vw;
	font-weight: 900;
	text-align: center;
	position: relative;
	margin-bottom: 1em;

	> .textBlock {
		color: var(--lp-color_steel-blue);
		display: inline-block;

		&::after,
		&::before {
			content: "";
			display: inline-block;
			background-image: url('../images/wh_contents_icon-concentration-ine.svg');
			background-size: contain;
			background-repeat: no-repeat;
			width: 1.2em;
			height: 1.2em;
		}

		&::after { transform: scaleX(-1); }
	}
}

#LP .cm__youtube {
	background-color: var(--lp-color_white);
	box-shadow: 0 0 10px rgba(141, 141, 14, .42);
	border-radius: 8px;
	font-size: 3.6vw;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1em;

	> iframe {
		aspect-ratio: 16 / 9;
		border-radius: 8px;
		width: 100%;
		height: auto;
	}
}

#LP .campaign__block {
	font-size: 4.2vw;
	&:not(:last-child) { margin-bottom: 1.5em; }

	&.schedule {
		font-weight: 900;
		text-align: center;

		> li {

			&:not(:last-of-type) { margin-bottom: 1em; }
			.textSmall {
				font-size: .8em;
				margin-top: .4em;
			}
		}
	}
}

#LP .campaign__h4,
#LP .campaign__text {
	color: var(--lp-color_steel-blue);
	font-weight: 900;
	text-align: center;
	position: relative;
	margin-bottom: 1em;

	> .textSmall {
		font-size: .9em;
		margin-top: .25em;
	}

	> .textMarker {
		background: linear-gradient(transparent 75%, var(--lp-color_pale-lemon) 75%);
		font-size: 1.1em;
		display: inline-block;
	}
}

#LP .tolkShow__notes {
	font-size: .4em;
	font-weight: 400;
	text-align: center;
	margin-top: 1em;

	> li {
		position: relative;
		&::before { content: "※"; }
	}
}

#LP .comingSoon {
	color: var(--lp-color_steel-blue);
	font-size: 4vw;
	font-weight: 900;
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	justify-content: center;
	text-align: center;
	user-select: none;
	position: relative;
	z-index: 1;
	padding: 1.5em 0;

	&::before {
		backdrop-filter: blur(10px); 
		content: "";
		position: absolute;
		inset: 0;

		background: linear-gradient(
			to bottom,
			rgba(139, 139, 139, .6),
			rgba(139, 139, 139, .6)
		);
	}

	&::after {
		content: "coming soon";
		color: var(--lp-color_white);
		font-weight: 700;
		position: absolute;
		z-index: 2;
	}
}

#LP .coordinate > li {
	font-size: 3vw;
	font-weight: 700;
	background-color: #e5f3ff;
	border-radius: 8px;
	box-shadow: 0 0 4px var(--lp-color_shadow-black);
	padding: 1em;

	&:not(:last-of-type) { margin-bottom: 1em; }
}

#LP .coordinate__commentator {
	display: flex;
	align-items: flex-start;
	gap: 1em;
	margin-bottom: 1em;
}

#LP .coordinate__commentator__photo {
	text-align: center;
	width: 25%;
}

#LP .coordinate__commentator__caption { color: var(--lp-color_steel-blue); }

#LP .coordinate__commentator__image {
	aspect-ratio: 1 / 1;
	background-color: var(--lp-color_white);
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: .5em;
	width: 100%;
	height: 100%;
}

#LP .coordinate__commentator__baloon {
	background-color: var(--lp-color_white);
	border-radius: 8px;
	box-shadow: 5px 5px 0 rgba(84, 138, 185, .47);
	position: relative;
	z-index: 2;
	width: 75%;
}

#LP .coordinate__commentator__body {
	position: relative;
	z-index: 0;
	padding: 1em;

	&::before {
        border-style: solid;
		border-width: .5em .5em .5em 0;
		border-color: transparent rgba(84, 138, 185, .47) transparent transparent;
		translate: 100% -50%;
        content: "";
        position: absolute;
		z-index: -1;
        top: 50%;
        left: calc(-1em + 1px);
    }

    &::after {
        border-style: solid;
		border-width: .5em .5em .5em 0;

		border-color: transparent var(--lp-color_white) transparent transparent;
		translate: 100% -50%;
        content: "";
        position: absolute;
		z-index: 1;
        top: calc(50% - .2em);
        left: calc(-1em + 1px);
    }
}

#LP .coordinate__commentator__header {
	color: var(--lp-color_light-azure);
	margin-bottom: .25em;
}
#LP .coordinate__commentator__text { font-size: .8em; }

#LP .coordinate__gallary {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	gap: 1em;

	> li {
		aspect-ratio: 1 / 1;
		background-color: #ddd;
		display: flex;
		align-items: center;
		justify-content: center;
		width: calc((100% - 2em) / 3);
	}
}

#LP .campaign__step > li {
	font-size: 3vw;
	font-weight: 700;

	&:not(:last-of-type) { margin-bottom: 1.5em; }
	&:first-of-type .campaign__h5::before { background-image: url('../images/wh_contents_icon-step1.svg'); }
	&:nth-of-type(2) .campaign__h5::before { background-image: url('../images/wh_contents_icon-step2.svg'); }
}

#LP .campaign__h5 {
	display: flex;
	align-items: center;
	position: relative;
	gap: .75em;
	margin-bottom: 1.5em;

	&::before {
		content: "";
		display: inline-block;
		background-size: contain;
		background-repeat: no-repeat;
		width: 3.5em;
		height: 3.5em;
	}
}

#LP .campaign__ecLink > .common__button:not(:last-of-type) { margin-bottom: 1em; }

#LP .entry__explanation { margin-bottom: 4%; }

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

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

#LP .entry__text {
	font-size: 2.8vw;
	padding: 0 .5em;
}

#LP .entry__execution { padding: 4% 0; }

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

	&::after {
		border-top: 2px solid var(--lp-color_light-gray);
		border-right: 2px solid var(--lp-color_light-gray);
		content: "";
		display: block;
		position: absolute;
		top: calc(50% - 1vw);
		right: 1em;
		transform: rotate(45deg);
		transition: border .4s, filter .4s;
		width: 2vw;
		height: 2vw;
	}
}
#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_light-gray);
	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-component_entryButton);
	color: var(--lp-color_white);
	cursor: pointer;
	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 .guest .entry__button { color: var(--lp-color_light-gray); }

#LP .entry__conditions,
#LP .entry__error {
	background-color: var(--lp-color_pale-lemon);
	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%;
	height: 0;
}
#LP .guest .entry__conditions,
#LP .entry__error.is_show {
	opacity: 1;
	pointer-events: all;
	margin-top: 2em;
	padding: 2em 1em;
	height: auto;
}

#LP .entry__error { color: #c80000; }

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

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

/* モーダル本体 */
#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, 0.6);
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.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: .8em;
	font-weight: 500;
	margin: 0 auto;
	padding: .5em 1.5em;
	width: 50%;
}

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

#LP .bylows__h4 { margin-bottom: 1em; }

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

#LP .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 .bylows__header::before,
#LP .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 .bylows__header::after { transform: rotate(90deg); }

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

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

#LP .bylows__text {
	background-color: var(--lp-color_white);
	border-radius: 0 0 4px 4px;
	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 .bylows__text {
	opacity: 1;
	padding-top: 1.5em;
	padding-bottom: 1.5em;
}

#LP .bylows__text a {
	color: var(--lp-color_dark-pink);
	font-weight: 900;
}

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

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

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

#LP .bylows__block__ol .bylows__block__ul { margin: .5em 0; }

#LP .bylows__block > .bylows__block__ul { padding-left: .5em; }

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

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

#LP .accBody {
	box-shadow: 0 0 4px var(--lp-color_shadow-black);
	border-radius: 0 0 4px 4px;
}

/**************************************************
main
tablet and PC_layout（768px以上）
**************************************************/

@media screen and (min-width: 768px) {
    #LP {
        overflow: hidden;
        margin: 0 auto;
        width: 100%;
        min-width: 1000px;
    }

	#LP img { width: auto; }

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

	#LP .common__ribbon { font-size: 40px; }

	#LP .common__button {
        width: 100%;

		a {
			font-size: 20px;
			max-width: 500px;

			&::after {
				border-top-width: 3px;
				border-right-width: 3px;
				top: calc(50% - (14px / 2));
				width: 14px;
				height: 14px;
			}
		}
    }

	#LP .section__inner {
		margin: 0 auto;
		padding: 48px 32px;
		max-width: 750px;
	}

	#LP .kyosuki__h2 { font-size: 40px; }

	#LP .kyosuki__cmpList { font-size: 26px; }

	#LP .kyosuki__cmpList__caption { font-size: .85em; }

	#LP .kyosuki__cmpList__anchor a { font-size: 15px; }

	#LP .cm__h3,
	#LP .cm__youtube { font-size: 24px; }

	#LP .campaign__block { font-size: 30px; }

	#LP .comingSoon { font-size: 30px; }

	#LP .coordinate > li { font-size: 24px; }

	#LP .campaign__step > li { font-size: 20px; }

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

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

	#LP .entry__execution { padding: 24px 0; }

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

		&::after {
			border-top-width: 3px;
			border-right-width: 3px;
			top: calc(50% - (14px / 2));
			width: 14px;
			height: 14px;
		}
    }

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

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

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

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

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

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

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