/* CSS Document */

@font-face {
	font-family: 'KosugiMaru Regular';
	src: url('../fonts/KosugiMaru-Regular.woff') format('woff');
	font-display: swap;
}

html {
	font-size: 10px;
}

body {
	font-family: 'KosugiMaru Regular', sans-serif, system-ui;
	font-size: 1.6rem;

	margin: 0;
	padding: 0;
}

.page_frame {
	min-width: 96.2rem;
	max-width: 96.2rem;
}

.page_frame_half {
	min-width: 48.1rem;
	max-width: 48.1rem;
}

.page_header1 {
	color: #333;
	font-size: 1.5rem;
	white-space: nowrap;

	height: 5rem;
	padding: 0 4.5rem;
}

.page_header2 {
	height: 7rem;
	padding: 0 4.5rem;
}

.page_logo {
	width: 15rem;
}

.page_header_menu {
	border-top: 0.1rem solid #ccc;
	border-bottom: 0.1rem solid #ccc;
}

.page_header_spmenu {
	display: none!important;
}

#global_nav ul {
	list-style: none;

	margin: 0;
	padding: 0;
}

#global_nav li .page_header_menu_image {
	width: 12.5rem;
}

#global_nav li:nth-of-type(6) .page_header_menu_image {
	width: 12.1rem;
}

#global_nav li:nth-of-type(7) .page_header_menu_image {
	width: 12.6rem;
}

.page_header_menu_image:hover {
	opacity: 0.7;
}

.page_footer_menu {
	background-color: #c5edff;

	color: #0961b2;
	font-size: 2rem;
	line-height: 2rem;
	white-space: nowrap;
}

.page_footer_menu ul {
	list-style: none;

	height: 10.7rem;
	margin: 0;
	padding: 0;
}

.page_footer_menu li {
	border-right: 0.1rem solid #0961b2;

	padding: 0 3rem;
}

.page_footer_menu li:last-of-type {
	border-right: 0;
}

.page_footer_menu a {
	color: #0961b2;
	transition: opacity 0.3s;
}

.page_footer_menu a:hover {
	color: #0961b2;
	text-decoration: none;
	opacity: 0.7;
}

.page_footer_copyright {
	background-color: #0961b2;

	color: #fff;
	font-size: 2rem;
	white-space: nowrap;
}

.page_footer_copyright_text {
	height: 5.7rem;
}

/* お申込みメインイメージ */
.apply_image {
	width: 82.1rem;
	margin-bottom: 3rem;
}

/* お申込み 3つボタン */
.apply_button1_image {
	position: absolute;
	left: 8rem;
	bottom: 0;
	width: 26.1rem;
	height: 28.9rem;
	transition: opacity 0.3s;
}

.apply_button1_image:hover {
	opacity: 0.7;
}

.apply_button2_image {
	width: 24.9rem;
	height: 29.9rem;
	transition: opacity 0.3s;
}

.apply_button2_image:hover {
	opacity: 0.7;
}

.apply_button3_image {
	position: absolute;
	left: -4rem;
	bottom: 0;
	width: 22.9rem;
	height: 23.9rem;
}

.apply_button3_active {
	background-color: #fff;
	border-radius: 1rem;

	position: absolute;
	left: -3.2rem;
	bottom: 1.6rem;
	width: 20.6rem;
	height: 7.4rem;
	opacity: 0;
	transition: opacity 0.3s;
	z-index: 1;
}

.apply_button3_active:hover,
.apply_button3_image:hover + .apply_button3_active {
	opacity: 0.3;
}

/* お申込み 2つボタン */
.apply_jackup1 {
	height: 20rem;
}

.apply_button4_image {
	position: absolute;
	right: 11rem;
	bottom: 1.5rem;
	width: 83.8rem;
	height: 18.4rem;
	transition: opacity 0.3s;
}

.apply_button4_image:hover {
	opacity: 0.7;
}

.apply_button5_image {
	width: 74.2rem;
	height: 13.1rem;
}

.apply_button5_active {
	background-color: #fff;
	border-radius: 1rem;

	position: absolute;
	right: 15.8rem;
	bottom: 3.2rem;
	width: 20.6rem;
	height: 7.4rem;
	opacity: 0;
	transition: opacity 0.3s;
	z-index: 1;
}

.apply_button5_active:hover,
.apply_button5_image:hover + .apply_button5_active {
	opacity: 0.3;
}

.spshow {
	display: none;
}

.spshow_inline {
	display: none;
}

/* お申込み 1つボタン */
.apply_button6a_image {
	width: 45.2rem;
	height: 8.5rem;
	margin: 4rem 0;
}

.apply_button6b_image {
	width: 54.4rem;
	height: 8.4rem;
	transition: opacity 0.3s;
}

.apply_button6b_image:hover {
	opacity: 0.7;
}

/* 海外からのお申込み */
.apply_button7_image {
	width: 49.3rem;
	height: 3.8rem;
	margin: 10rem 0 11.5rem;
	transition: opacity 0.3s;
}

.apply_button7_image:hover {
	opacity: 0.7;
}

/* 安心サポート */
.support {
	background-color: #0bb5cb;

	position: relative;
	height: 7.6rem;
	margin-bottom: 40.6rem;
}

.support_image,
.support_alpha_image {
	width: 81.3rem;
}

.support_button1_image {
	width: 50.3rem;
	height: 8.4rem;
	transition: opacity 0.3s;
}

.support_button1_image:hover {
	opacity: 0.7;
}


/* 脈動するアニメ */
.animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

.animated.infinite {
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
}

/* 脈動するアニメ スロー版 */
.animated_slow {
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

.animated_slow.infinite {
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
}

/* アニメーション本体 */
.pulse {
	-webkit-animation-name: pulse;
	animation-name: pulse;
}

.page_close {
	display: none;
}

.pagetop {
	display: none;
}

@-webkit-keyframes pulse {
	from {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}

	50% {
		-webkit-transform: scale3d(1.05, 1.05, 1.05);
		transform: scale3d(1.05, 1.05, 1.05);
	}

	to {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@keyframes pulse {
	from {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}

	50% {
		-webkit-transform: scale3d(1.05, 1.05, 1.05);
		transform: scale3d(1.05, 1.05, 1.05);
	}

	to {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@media screen and (max-width: 992px) {
	.page_frame {
		min-width: 90%;
		max-width: 90%;
	}

	.page_frame_half {
		min-width: 90%;
		max-width: 90%;
	}

	main {
		width: 100%;
		overflow-x: hidden;
	}

	.spshow {
		display: block;
	}

	.spshow_inline {
		display: inline;
	}

	.sphide {
		display: none;
	}

	.page_header_spmenu {
		list-style: none;
		/* display: none; */
		display: flex!important;
		position: fixed;
		left: 0;
		bottom: 0;
		margin: 0;
		padding: 0;
		width: 100vw;
		z-index: 100;
	}

	.page_header_spmenu.dummy {
		display: none;
		position: relative;
		left: 0;
		bottom: 0;
		margin: 0;
		padding: 0;
		opacity: 0;
		z-index: -1;
	}

	.page_header_spmenu_image {
		height: 5.73rem;
	}

	.page_header1 {
		display: none!important;
	}

	.page_header2 {
		height: 9.8rem;
		padding: 0;
	}

	#global_nav {
		display: none;
	}

	#global_nav.spactive {
		background-color: rgba(0, 0, 0, 0.5);
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		overflow-y: auto;
		z-index: 101;

		animation-name: fadeIn;
		animation-duration: 0.5s;
	}

	@keyframes fadeIn {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}

	#global_nav ul {
		margin-top: calc((100vh - 65%) / 8);
	}

	#global_nav ul li {
		position: relative;
	}

	.page_header_menu_image {
		width: 90vw!important;
		margin: 0 5vw;
		opacity: 1;
		z-index: 102;
	}

	.page_header_menu_image:hover {
		opacity: 1;
	}

	.page_logo {
		width: calc(38.5rem * 0.9 / 2);
		transform: translateX(-5%);
	}

	.page_menu {
		cursor: pointer;
		width: calc(8.9rem * 0.9 / 2);
		position: absolute;
		top: 2rem;
		right: -1.25rem;
	}

	.apply_image {
		width: calc(99.1rem * 0.9 / 2);
	}

	.apply_jackup1 {
		height: 12rem;
	}

	.apply_button1_image {
		left: -2.3rem;
		width: calc(37.9rem * 0.9 / 2);
		height: calc(42.1rem * 0.9 / 2);
	}

	.apply_button2_image {
		position: absolute;
		left: 0.75rem;
		bottom: 0;
		width: calc(36.3rem * 0.9 / 2);
		height: calc(43.7rem * 0.9 / 2);
	}

	.apply_button3_image {
		left: 1.75rem;
		width: calc(33.3rem * 0.9 / 2);
		height: calc(34.9rem * 0.9 / 2);
	}

	.apply_button3_active {
		border-radius: 0.5rem;
		left: 2.2rem;
		bottom: 1.1rem;
		width: 13.6rem;
		height: 4.8rem;
	}

	.apply_button4_image {
		right: 2.4rem;
		width: calc(99.1rem * 0.9 / 2);
		height: auto;
	}

	.apply_button5_image {
		width: calc(87.8rem * 0.9 / 2);
		height: auto;
		transform: translateX(0.2rem);
	}

	.apply_button5_active {
		border-radius: 0.5rem;
		right: 4.95rem;
		bottom: 1.7rem;
		width: 11rem;
		height: 3.9rem;
	}

	.apply_button6a_image {
		width: calc(78rem * 0.9 / 2);
		height: auto;
	}

	.apply_button6b_image {
		width: calc(87.8rem * 0.9 / 2);
		height: auto;
		transform: translateX(0.2rem);
	}

	.apply_button7_image {
		width: calc(78rem * 0.9 / 2);
		height: auto;
		margin: 3.5rem 0 9.5rem;
	}

	.support {
		margin-bottom: 36.1rem;
	}

	.support_image,
	.support_alpha_image {
		width: calc(112.5rem * 0.9 / 2);
		transform: translateX(-5%);
	}

	.support_button1_image {
		width: calc(64rem * 0.9 /2);
		height: auto;
		transform: translate(1rem, -3rem);
	}

	.page_footer_menu {
		font-size: 1.75rem;
		padding: 2.5rem 0;
	}

	.page_footer_menu li {
		border: 0;
		padding: 1rem 0;
	}

	.page_footer_copyright {
		font-size: 1.65rem;
	}

	.page_close {
		cursor: pointer;
		display: block;
		position: absolute;
		top: -2rem;
		right: 2rem;
		width: calc(12.2rem * 0.9 / 2);
	}

	.pagetop {
		display: block;
		position: fixed;
		right: 1.6rem;
		bottom: 8.7rem;
		width: 10.7rem;
	}
}

@media screen and (max-width: 768px) {
	#global_nav ul {
		margin-top: calc((100vh - 65%) / 6);
	}
}

@media screen and (max-width: 586px) {
	#global_nav ul {
		margin-top: calc((100vh - 65%) / 4);
	}
}

@media screen and (max-width: 992px) and (orientation: landscape) {
	#global_nav ul {
		margin-top: 2rem;
	}

	.pagetop {
		right: 1.25rem;
		bottom: 7.2rem;
		max-width: calc(8.9rem * 0.9 / 2);
	}
}