@charset "UTF-8";
/* ==================================================
common
================================================== */



/* =========================================================
MODAL BLOCK (BASIC STYLE)
========================================================= */
.modal_wrap {
}

.modal_wrap .trigger {
}

.modal_wrap .trigger span {
}

.modal_wrap .window_bg {
	content: "";
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	transition: all 0.8s ease-out 0s;
	background-color: rgba(255,255,255,0);
	visibility: hidden;
	z-index: -101;
}

.modal_wrap .modal_bg {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	background: #fff;
	width: 100%;
	height: 100vh;
	border-radius: 8px;
	border: 1px solid #f2f2f2;
	padding: 20px 0;
	box-shadow: 0 0 20px rgba(0,0,0,0.15);
	transition: all 0.8s ease-out 0s;
	opacity: 0;
	transform: scale(0.4);
	visibility: hidden;
	z-index: -100;
}

/**/
.modal_wrap .window_bg.modal_open {
	background-color: rgba(255,255,255,0.96);
	visibility: visible;
	z-index: 1000;
}

.modal_wrap .modal_bg.modal_open {
	opacity: 1;
	transform: scale(1);
	visibility: visible;
	z-index: 1001;
}
/**/



.modal_wrap .modal_cnt {
	width: 100%;
	height: 100%;
	margin: 0 auto;
}

.modal_wrap .modal_cnt .modal_ttl {
	font-family: "Ekster-Bold", sans-serif;
	font-weight: normal;
	font-style: normal;
	font-feature-settings: "palt";
	letter-spacing: 0;
	line-height: 1;
	height: 35px;
	border-bottom: 2px solid #000;
	font-size: 2.8rem;
	text-align: center;
}

.modal_wrap .modal_cnt .modal_body {
	overflow-y: scroll;
	height: calc(100% - 35px);
	padding: 30px 5% 0;
	font-size: 1.4rem;
	text-align: left;
}

.modal_wrap .modal_cnt .modal_body .sct {
	margin-bottom: 30px;
}

.modal_wrap .modal_cnt .modal_body .sct .ttl {
	font-size: 1.6rem;
	background: #000;
	font-weight: 700;
	line-height: 1.2;
	padding: 8px 10px 5px;
	border-bottom: 1px dotted #000;
	margin-bottom: 15px;
	/*! border-top-left-radius: 8px; */
	/*! border-top-right-radius: 8px; */
	color: #fff;
}

.modal_wrap .modal_cnt .modal_body .sct .detail {
}

.modal_wrap .modal_cnt .modal_body .sct .detail p {
}

.modal_wrap .modal_cnt .modal_body .sct .detail p:not(:last-child) {
	margin-bottom: 2.2em;
}

.modal_wrap .modal_cnt .modal_body .sct .detail dl {
	margin-bottom: 1.8em;
}

.modal_wrap .modal_cnt .modal_body .sct .detail dl dt {
	font-weight: 700;
	margin-top: 35px;
	margin-bottom: 8px;
	line-height: 1.4;
	border-left: 5px solid #000;
	padding-left: 10px;
}

.modal_wrap .modal_cnt .modal_body .sct .detail dl dt a {
	display: block;
	position: relative;
	padding-right: 20px;
}

.modal_wrap .modal_cnt .modal_body .sct .detail dl dt a::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 5px;
	margin: auto 0;
	width: 8px;
	height: 8px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	transform: rotate(45deg);
}

.modal_wrap .modal_cnt .modal_body .sct .detail dl dd {
}

.modal_wrap .modal_cnt .modal_body .sct .detail dl dd a {
}

.modal_wrap .modal_cnt .modal_body .sct .detail .caution {
	font-size: 1.2rem;
	opacity: 0.7;
}

.modal_wrap .modal_cnt .modal_body .sct .detail .note {
	font-size: 1.3rem;
	opacity: 0.7;
}

.modal_wrap .modal_cnt .modal_body .sct .detail .btn_signup {
	padding: 30px 0;
}

.modal_wrap .modal_cnt .modal_body .sct .detail .btn_signup a {
	border: 2px solid #000;
	border-radius: 50px;
	display: block;
	width: 260px;
	position: relative;
	margin: 0 auto;
	padding: 8px;
	background: #000;
	color: #fff;
}

.modal_wrap .modal_cnt .modal_body .sct .detail .btn_signup a span {
	font-weight: 700;
	line-height: 1.2;
	display: block;
	font-size: 1.6rem;
	text-align: center;
}




/* howto_modal_wrap
------------------------------ */
#howto_modal_wrap.modal_wrap {
	margin-top: 20px;
}

#howto_modal_wrap.modal_wrap .trigger {
	border: 2px solid #fff;
	border-radius: 50px;
	width: 260px;
	height: 56px;
	position: relative;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	align-items: center;
}

#howto_modal_wrap.modal_wrap .trigger::before {
	content: "";
	display: inline-block;
	width: 26px;
	height: 26px;
	margin-right: 8px;
	transform: translateY(-1px);
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22%23fff%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M22.489%2019.581h-1.389v2.8h1.389c0.027%200.002%200.059%200.003%200.091%200.003%200.796%200%201.447-0.617%201.503-1.398l0-0.005c-0.056-0.786-0.707-1.403-1.502-1.403-0.032%200-0.064%200.001-0.096%200.003l0.004-0zM22.173%2011.862c-5.561%200-10.069%204.508-10.069%2010.069s4.508%2010.069%2010.069%2010.069c5.561%200%2010.069-4.508%2010.069-10.069v0c-0.001-5.561-4.508-10.068-10.069-10.069h-0zM22.489%2023.931h-1.389v2.034c0%200%200%200%200%200%200%200.391-0.317%200.708-0.708%200.709h-0.355c0%200%200%200%200%200-0.391%200-0.708-0.317-0.708-0.708%200-0%200-0.001%200-0.001v0-7.23c0%200%200%200%200%200%200-0.39%200.317-0.707%200.707-0.707%200%200%200.001%200%200.001%200h2.452c0.058-0.004%200.125-0.006%200.193-0.006%201.678%200%203.052%201.299%203.173%202.945l0.001%200.010c-0.121%201.659-1.497%202.959-3.176%202.959-0.067%200-0.134-0.002-0.2-0.006l0.009%200zM8.178%206.963c4.517%200%208.177-1.558%208.177-3.482s-3.655-3.481-8.177-3.481-8.178%201.559-8.178%203.481%203.661%203.482%208.178%203.482zM8.178%2012.857c4.517%200%208.177-1.558%208.177-3.481v-0.866c-0-0.437-0.354-0.791-0.791-0.791-0.112%200-0.218%200.023-0.314%200.065l0.005-0.002c-1.909%201.001-4.17%201.589-6.569%201.589-0.178%200-0.355-0.003-0.532-0.010l0.026%200.001c-0.153%200.006-0.332%200.009-0.513%200.009-2.398%200-4.659-0.588-6.647-1.627l0.079%200.038c-0.091-0.039-0.197-0.062-0.308-0.062-0.437%200-0.791%200.354-0.792%200.79v0.866c0%201.924%203.661%203.481%208.178%203.481zM8.178%2015.457c-0.148%200.005-0.322%200.009-0.497%200.009-2.403%200-4.669-0.59-6.66-1.632l0.079%200.038c-0.091-0.040-0.197-0.063-0.309-0.063-0.437%200-0.791%200.354-0.791%200.791%200%200%200%200.001%200%200.001v-0%200.86c0%201.925%203.662%203.485%208.175%203.485%200.4%200%200.793-0.011%201.178-0.037%200.327-1.38%200.831-2.596%201.499-3.704l-0.032%200.058c-0.79%200.121-1.701%200.19-2.629%200.19-0.005%200-0.011%200-0.016%200h0.001zM8.178%2021.545c-0.148%200.005-0.322%200.009-0.497%200.009-2.403%200-4.669-0.59-6.66-1.632l0.079%200.038c-0.091-0.040-0.198-0.063-0.31-0.063-0.436%200-0.79%200.354-0.79%200.79%200%200.001%200%200.002%200%200.004v-0%200.866c0%201.92%203.662%203.481%208.175%203.481%200.4%200%200.8-0.011%201.189-0.038-0.231-0.916-0.364-1.967-0.364-3.049%200-0.006%200-0.012%200-0.019v0.001c0-0.136%200-0.271%200.010-0.407-0.271%200.011-0.547%200.016-0.834%200.016zM8.178%2027.632c-0.148%200.005-0.322%200.009-0.497%200.009-2.403%200-4.669-0.589-6.66-1.631l0.079%200.038c-0.091-0.040-0.197-0.063-0.309-0.063-0.437%200-0.791%200.354-0.791%200.791%200%200.001%200%200.001%200%200.002v-0%200.866c0%201.92%203.662%203.48%208.175%203.48%200.036%200%200.079%200%200.122%200%201.421%200%202.802-0.175%204.12-0.505l-0.117%200.025c-0.803-0.902-1.491-1.933-2.026-3.051l-0.034-0.079c-0.608%200.073-1.313%200.114-2.027%200.114-0.013%200-0.026%200-0.040-0h0.002z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
}

#howto_modal_wrap.modal_wrap .trigger span {
	color: #fff;
}

#howto_modal_wrap.modal_wrap .trigger span em {
	display: block;
	line-height: 1;
}

#howto_modal_wrap.modal_wrap .trigger span em.en {
	font-family: "Ekster-Bold", sans-serif;
	font-weight: normal;
	font-style: normal;
	font-feature-settings: "palt";
	letter-spacing: 0;
	font-size: 1.6rem;
}

#howto_modal_wrap.modal_wrap .trigger span em.jp {
	font-size: 1.3rem;
	font-weight: 700;
}

#howto_modal_wrap.modal_wrap .window_bg {
}

#howto_modal_wrap.modal_wrap .modal_bg {
}

/**/
#howto_modal_wrap.modal_wrap .window_bg.modal_open {
}

#howto_modal_wrap.modal_wrap .modal_bg.modal_open {
}
/**/

#howto_modal_wrap.modal_wrap .modal_bg .close {
}

#howto_modal_wrap.modal_wrap .modal_bg .close:hover {
}

#howto_modal_wrap.modal_wrap  .modal_bg .close::before,
#howto_modal_wrap.modal_wrap .modal_bg .close::after {
}

#howto_modal_wrap.modal_wrap .modal_bg .close::before {
}

#howto_modal_wrap.modal_wrap .modal_bg .close::after {
}

#howto_modal_wrap.modal_wrap .modal_cnt {
}

#howto_modal_wrap.modal_wrap .modal_cnt .modal_ttl {
}

#howto_modal_wrap.modal_wrap .modal_cnt .modal_body {
}

