@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Roboto:wght@700&family=Zen+Maru+Gothic:wght@700&display=swap");
/***************************
 *
 * トップページ
 * ★ページ中身用★
 *
 **************************/
@media all and (min-width: 737px) {
	.l-wrap {
		min-width: auto;
		background: url(../img/lp/bg-blue.jpg) 0 0 repeat;
		background-size: 1400px 736px;
	}
	.en {
		font-family: "Roboto", sans-serif;
		font-weight: 700;
		font-style: normal;
	}
	.maru {
		font-family: "Zen Maru Gothic", serif;
		font-weight: 700;
		font-style: normal;
	}
	/*
	HEADER
	*/
	.l-header-lp {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
	}
	.l-header-lp .header-title-lp {
		position: absolute;
		left: 30px;
		top: 30px;
		width: 247px;
		z-index: 5;
	}
	/*
	FOOTER
	*/
	.copyright {
		text-align: center;
		font-size: 1.5rem;
		color: #424242 !important;
		margin-top: 100px;
	}
	.btn-line {
		position: fixed;
		right: 0;
		bottom: 0px;
		width: 303px;
	}
	/*
	PAGE HEADER
	*/
	.page-header-visual {
		background: url(../img/lp/page-header-visual.jpg) center center no-repeat;
		background-size: cover;
		height: 570px;
	}

	/*
	MAIN LP
	*/
	.l-main-lp {
		position: relative;
	}

	/*
	FEATS
	*/
	.lp-feats {
		position: relative;
		margin-top: -400px;
	}
	.list-feats {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-gap: 10px;
		width: 680px;
		margin: 0 auto;
	}
	.list-feats > li img {
		display: block;
		box-shadow: 0px 0px 50px rgba(159, 168, 170, 0.4);
		border-radius: 100%;
	}

	/*
	FORM
	*/
	.lp-form {
		position: relative;
		margin-top: 30px;
	}
	.lp-form .box-content {
		background: #fff;
		width: 960px;
		margin: 0 auto;
		max-width: auto;
		min-width: auto;
		box-shadow: 0px 0px 50px rgba(119, 211, 229, 0.4);
		border-radius: 70px;
	}
	.scene {
		position: relative;
		padding: 60px 115px;
		display: none;
		opacity: 0;
		animation-name: fadeIn;
		animation-fill-mode: forwards;
		animation-duration: 1s;
	}
	.scene.is-active {
		display: block;
		opacity: 1;
	}
	@keyframes fadeIn {
		0% {
			opacity: 0;
		}

		100% {
			opacity: 1;
		}
	}
	.lp-form-title {
		text-align: center;
		font-size: 3rem;
		color: #289cc0;
		line-height: 1.5em;
		margin-bottom: 40px;
	}
	.list-step {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-gap: 0;
		margin: 0 auto;
		width: 600px;
	}
	.list-step > li {
		text-align: center;
		position: relative;
		box-sizing: border-box;
		/* background: #f6f7de; */
		color: #cdd34d;
		font-size: 1.8rem;
		font-weight: bold;
		line-height: 70px;
		height: 70px;
	}
	.list-step > li:nth-child(n + 2) {
		left: -20px;
	}
	.list-step > li:nth-child(n + 3) {
		left: -35px !important;
	}
	.list-step > li:nth-child(n + 4) {
		left: -45px !important;
	}
	.list-step > li:nth-child(n + 5) {
		left: -61px;
	}
	.list-step > li > div {
		position: relative;
		z-index: 4;
	}
	.list-step > li:before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		background: url(../img/lp/step.png) 0 0 no-repeat;
		background-size: contain;
		width: 173px;
		height: 70px;
	}
	.list-step > li span {
		font-size: 2.4rem;
	}
	.list-step > li.is-active {
		color: white;
	}
	.list-step > li.is-active:before {
		background: url(../img/lp/step-active.png) 0 0 no-repeat;
		background-size: contain;
		width: 165px;
		height: 70px;
		z-index: 3;
	}

	.lp-form-header {
		position: relative;
		padding-top: 35px;
		margin-bottom: 25px;
	}
	.lp-form-header .lp-form-title-2 {
		text-align: center;
		font-size: 2.6rem;
		color: #289cc0;
		font-family: "Zen Maru Gothic", serif;
		font-weight: 700;
		font-style: normal;
	}
	.lp-form-header .lp-form-title-2:before {
		content: "";
		background: url(../img/lp/lp-form-title-2.png) center top no-repeat;
		background-size: contain;
		width: 38px;
		height: 37px;
		display: block;
		margin: 0 auto 10px;
	}
	.lp-form-header .lp-form-caption {
		text-align: center;
		font-size: 1.6rem;
		margin-top: 10px;
		margin-bottom: 0;
	}
	.required {
		text-align: center;
		display: block;
		color: white;
		background: #f29e9e;
		font-size: 1.5rem;
		border-radius: 10px;
		width: 54px;
		height: 30px;
		line-height: 30px;
		position: absolute;
		right: 0;
		bottom: 5px;
	}

	.mwform-checkbox-field {
	}
	.mwform-checkbox-field > label input[type="checkbox"] {
		display: none;
	}
	.mwform-checkbox-field > label {
		display: flex !important;
		align-items: center;
		margin: 0;
		background: #f0f4f5;
		border-radius: 30px;
		position: relative;
		height: 80px;
		padding-left: 20px;
		cursor: pointer;
		border: 2px dashed #f0f4f5;
		font-weight: normal;
		box-sizing: border-box;
		padding: 0px 0px 2px 0;
	}
	.mwform-checkbox-field.is-active > label {
	}
	.mw_wp_form .horizontal-item + .horizontal-item {
		margin: 0;
	}
	.mwform-checkbox-field > label:has(input[type="checkbox"]:checked) {
		background: #d6eef5;
		border: 2px dashed #325c68;
	}
	.mwform-checkbox-field > label .mwform-checkbox-field-text {
		padding-left: 20px;
		z-index: 5;
		padding-left: 75px;
		padding-right: 50px;
	}
	.mwform-checkbox-field > label .mwform-checkbox-field-text:before {
		content: "";
		background: url(../img/lp/checkbox.png) center center no-repeat;
		background-size: contain;
		width: 40px;
		height: 40px;
		position: absolute;
		vertical-align: middle;
		display: inline-block;
		left: 20px;
		top: 20px;
		transition: 0.3s ease;
	}
	.mwform-checkbox-field > label input[type="checkbox"]:checked + .mwform-checkbox-field-text {
	}
	.mwform-checkbox-field > label input[type="checkbox"]:checked + .mwform-checkbox-field-text:before {
		background: url(../img/lp/checkbox-active.png) center center no-repeat;
		background-size: contain;
	}
	.check-btns {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 20px;
	}
	.check-btns.check-btns-3 {
		grid-template-columns: repeat(3, 1fr);
	}

	.scene-btns {
		display: flex;
		justify-content: center;
		margin-top: 50px;
		padding-top: 50px;
		border-top: 2px dashed #e0e0e0;
		margin-left: -110px;
		margin-right: -110px;
	}
	.scene-btns .btn-back {
		font-size: 1.6rem;
		text-align: center;
		display: block;
		background: #f0f4f5;
		border-radius: 40px;
		width: 240px;
		height: 80px;
		line-height: 80px;
		margin-right: 10px;
		cursor: pointer;
		transition: 0.3s ease;
	}
	.scene-btns .btn-back:hover {
		opacity: 0.7;
	}
	.scene-btns .btn-next {
		font-size: 2.2rem;
		font-weight: bold;
		color: #424242;
		background: #cdd34d;
		width: 420px;
		height: 80px;
		line-height: 80px;
		border-radius: 40px;
		text-align: center;
		font-family: "Zen Maru Gothic", serif;
		font-weight: 700;
		font-style: normal;
		margin-left: 10px;
		cursor: pointer;
		transition: 0.3s ease;
	}
	.scene-btns .btn-next:hover {
		opacity: 0.7;
	}

	.table-lp-form-content {
		width: 100%;
	}
	.table-lp-form-content tr {
		position: relative;
	}
	.table-lp-form-content th {
		font-family: "Zen Maru Gothic", serif;
		font-weight: 700;
		font-style: normal;
		font-size: 2rem;
		color: #424242;
		vertical-align: middle;
		width: 155px;
	}
	.table-lp-form-content td {
		width: 580px;
		padding: 15px 0;
	}
	input[type="text"] {
		margin: 0;
		padding: 0;
		background: none;
		border: none;
		border-radius: 0;
		outline: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
	}
	.table-lp-form-content input[type="text"] {
		background: #fff;
		border: 2px solid #dbe5e7;
		border-radius: 30px;
		width: 360px;
		height: 76px;
		line-height: 76px;
		font-size: 2rem;
		box-sizing: border-box;
		padding: 20px 20px;
	}
	input::placeholder {
		color: #c7d3d5;
		font-size: 2rem;
		font-style: normal;
		font-weight: normal;
	}
	.table-lp-form-content .required-2 {
		position: absolute;
		/* right: 130px; */
		left: 530px;
		font-size: 1.6rem;
		margin-top: -5px;
	}
	.table-lp-form-content .required-2 span {
		text-align: center;
		display: inline-block;
		color: white;
		background: #f29e9e;
		font-size: 1.5rem;
		border-radius: 10px;
		width: 54px;
		height: 30px;
		line-height: 30px;
		margin-right: 5px;
	}

	.select-wrap {
		position: relative;
		display: inline-block;
		width: 360px;
	}

	.select-wrap:before {
		z-index: 5;
		position: absolute;
		right: 25px;
		top: 33px;
		content: "";
		display: block;
		background: url(../img/lp/select.png) center center no-repeat;
		background-size: contain;
		width: 17px;
		height: 10px;
		pointer-events: none;
	}

	.mw_wp_form_confirm .select-wrap:before {
		content: none !important;
	}
	.mw_wp_form_confirm .select-wrap {
		width: auto !important;
		top: auto !important;
	}
	select {
		outline: none;
		-moz-appearance: none;
		text-indent: 0.01px;
		text-overflow: "";
		background: white;
		vertical-align: middle;
		font-size: inherit;
		color: inherit;
		-webkit-appearance: button;
		-moz-appearance: button;
		appearance: button;
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		background: #fff;
		border: 2px solid #dbe5e7;
		border-radius: 30px;
		width: 360px;
		height: 76px;
		line-height: 76px;
		font-size: 2rem;
		box-sizing: border-box;
		padding: 0 20px;
	}
	.select-wrap.select-wrap-short select {
		height: 38px;
	}
	select option {
		background-color: #fff;
		color: black;
	}
	select::-ms-expand {
		display: none;
	}
	select:-moz-focusring {
		color: transparent;
		text-shadow: 0 0 0 #828c9a;
	}
	.p-last {
		text-align: center;
		font-size: 1.6rem;
		color: #424242;
		line-height: 1.875em;
		margin-top: 30px;
	}
	.p-last a {
		color: #289cc0;
	}
	.scene.scene-result {
		opacity: 1;
		display: block;
	}
	.scene.scene-result .lp-form-title-2:before {
		content: none;
	}
	.scene.scene-result .lp-form-title-2 + p {
		text-align: center;
		margin-top: 30px;
	}
	.scene.scene-result .btn {
		width: 420px;
		margin: 45px auto 5px;
	}
	.scene.scene-result .btn a {
		background: #cdd34d;
		font-family: "Zen Maru Gothic", serif;
		font-size: 2.2rem;
		color: #424242;
		line-height: 80px;
		border-radius: 40px;
	}
	.scene.scene-result .btn a:before {
		background: url(../img/lp/btn.png) 0 0 no-repeat;
		background-size: contain;
		width: 30px;
		height: 30px;
		right: 25px;
	}
	.scene.scene-result .btn a:hover {
		border: none;
	}

	/*
	RECS
	*/
	.lp-recs {
		position: relative;
		margin-top: 60px;
	}
	.lp-recs .box-content {
		width: 960px;
	}
	.lp-recs .lp-recs-title {
		text-align: center;
		font-size: 3rem;
		color: #289cc0;
		line-height: 1.333em;
		margin-bottom: 35px;
	}
	.recs {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-gap: 30px;

		margin: 0 auto;
	}
	.recs .rec {
		position: relative;
		background: #fff;
		border-radius: 70px;
		box-sizing: border-box;
		box-shadow: 0px 0px 50px rgba(119, 211, 229, 0.4);
		padding: 35px;
	}
	.recs .rec .rec-link {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 3;
	}
	.recs .rec .rec-area {
		font-size: 1.5rem;
		line-height: 1.6em;
		color: #424242;
		margin-bottom: 15px;
	}
	.recs .rec .rec-info {
		font-size: 1.5rem;
		line-height: 1.6em;
		color: #289cc0;
		margin-bottom: 15px;
	}
	.recs .rec .rec-ex {
		font-size: 1.8rem;
		line-height: 1.555em;
		color: #424242;
		margin-bottom: 0px;
	}
	.p-country-name {
		display: none;
	}
	.btn-submit {
		font-size: 2.2rem;
		font-weight: bold;
		color: #424242;
		background: #cdd34d;
		width: 420px;
		height: 80px;
		line-height: 80px;
		border-radius: 40px;
		text-align: center;
		font-family: "Zen Maru Gothic", serif;
		font-weight: 700;
		font-style: normal;
		margin-left: 10px;
		cursor: pointer;
		transition: 0.3s ease;
	}
	.btn-submit:hover {
		opacity: 0.7;
	}
	.error {
		display: none !important;
		opacity: 0;
		animation-name: fadeIn;
		animation-fill-mode: forwards;
		animation-duration: 1s;
		text-align: center;
		color: white !important;
		background: #f29e9e;
		padding: 15px 0;
		font-weight: bold;
		border-radius: 10px;
		margin: 10px auto;
		font-family: "Zen Maru Gothic", serif;
	}
	.error.is-active {
		display: block !important;
		opacity: 1;
	}
	table .error {
		width: 360px;
		margin: 10px 0;
	}
}