@charset "UTF-8";

/* ==================================================
Library
================================================== */

/* Mediaquery
------------------------------ */
@media screen and (min-width: 769px) {}
@media screen and (max-width: 768px) {}

@media screen and (max-width: 480px) {}


/* View Switch
------------------------------ */
@media screen and (min-width: 769px) {
	.sp-only { display: none !important; }
}

@media screen and (max-width: 768px) {
	.pc-only { display: none !important; }
}

/* Smartphone View */
/*html[data-browse-mode="S"] .pc-only  { display: none !important; }*/

/* PC View */
/*html[data-browse-mode="P"] .sp-only  { display: none !important; }*/


/* Introduction Animation
------------------------------ */
#lp-edit-wrap {
	will-change: animation;
	animation: accessFadein 0.6s linear 0.1s both;
}

@keyframes accessFadein {
	0% { opacity: 0; }
	40% { opacity: 0; }
	100% { opacity: 1.2; }
}

/* Clrfix
------------------------------ */
.clrfix::before, .clrfix::after { display: table; content: ''; }
.clrfix::after { clear: both; }


/* 検証用
------------------------------ */
.none { display: none; }


/* ==================================================
Fonts Size - Variable
================================================== */
/* 
.lp-format .font-jp {
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight: 400;
	text-transform: initial;
}

.lp-format .font-en {
	font-family: 'neuhan', sans-serif;
	font-weight: 300;
	text-transform: initial;
}
*/

/* 游ゴシック - Medium */
.lp-format .fw400 { font-weight: 400; }

/* Neue Hans Kendrick - Light */
.lp-format .fw300 { font-weight: 300; }

/* Neue Hans Kendrick - Medium or 游ゴシック - Bold */
.lp-format .fw600 { font-weight: 600; }


.lp-format .fz-xxsmall { font-size: 11px; }
.lp-format .fz-xsmall { font-size: 12px; }
.lp-format .fz-small { font-size: 13px; }
.lp-format .fz-regular { font-size: 14px; }
.lp-format .fz-large { font-size: 15px; }
.lp-format .fz-xlarge { font-size: 16px; }
.lp-format .fz-xxlarge { font-size: 17px; }
.lp-format .fz-extra { font-size: 18px; }
.lp-format .fz-xextra { font-size: 20px; }

@media screen and (max-width: 480px) {
	.lp-format .fz-xxsmall { font-size: clamp(9px, 2.292vw, 11px); }
	.lp-format .fz-xsmall { font-size: clamp(10px, 2.500vw, 12px); }
	.lp-format .fz-small { font-size: clamp(11px, 2.708vw, 13px); }
	.lp-format .fz-regular { font-size: clamp(12px, 2.917vw, 14px); }
	.lp-format .fz-large { font-size: clamp(13px, 3.125vw, 15px); }
	.lp-format .fz-xlarge { font-size: clamp(14px, 3.333vw, 16px); }
	.lp-format .fz-xxlarge { font-size: clamp(15px, 3.542vw, 17px); }
	.lp-format .fz-extra { font-size: clamp(16px, 3.750vw, 18px); }
	.lp-format .fz-xextra { font-size: clamp(17px, 4.167vw, 20px); }
}


/* ==================================================
Text Color
================================================== */
/*.lp-format .txtcolor-red { color: #C66; }*/
.lp-format .txtcolor-red { color: #f00; }


/* ==================================================
Magine
================================================== */
.lp-format .mt-22 { margin-top: min(34.375%, 220px); }
.lp-format .mt-20 { margin-top: min(31.25%, 200px); }
.lp-format .mt-18 { margin-top: min(28.125%, 180px); }
.lp-format .mt-16 { margin-top: min(25%, 160px); }
.lp-format .mt-15 { margin-top: min(23.4375%, 150px); }
.lp-format .mt-14 { margin-top: min(21.875%, 140px); }
.lp-format .mt-12 { margin-top: min(18.75%, 120px); }
.lp-format .mt-10 { margin-top: min(15.625%, 100px); }
.lp-format .mt-8 { margin-top: min(12.5%, 80px); }
.lp-format .mt-6 { margin-top: min(9.375%, 60px); }
.lp-format .mt-5 { margin-top: min(7.8125%, 50px); }
.lp-format .mt-4 { margin-top: min(6.25%, 40px); }
.lp-format .mt-3 { margin-top: min(4.6875%, 30px); }
.lp-format .mt-2 { margin-top: min(3.125%, 20px); }
.lp-format .mt-1 { margin-top: min(1.5625%, 10px); }

.lp-format .mb-22 { margin-bottom: min(34.375%, 220px); }
.lp-format .mb-20 { margin-bottom: min(31.25%, 200px); }
.lp-format .mb-18 { margin-bottom: min(28.125%, 180px); }
.lp-format .mb-16 { margin-bottom: min(25%, 160px); }
.lp-format .mb-15 { margin-bottom: min(23.4375%, 150px); }
.lp-format .mb-14 { margin-bottom: min(21.875%, 140px); }
.lp-format .mb-12 { margin-bottom: min(18.75%, 120px); }
.lp-format .mb-10 { margin-bottom: min(15.625%, 100px); }
.lp-format .mb-8 { margin-bottom: min(12.5%, 80px); }
.lp-format .mb-6 { margin-bottom: min(9.375%, 60px); }
.lp-format .mb-5 { margin-bottom: min(7.8125%, 50px); }
.lp-format .mb-4 { margin-bottom: min(6.25%, 40px); }
.lp-format .mb-3 { margin-bottom: min(4.6875%, 30px); }
.lp-format .mb-2 { margin-bottom: min(3.125%, 20px); }
.lp-format .mb-1 { margin-bottom: min(1.5625%, 10px); }