@charset "utf-8";

/* =============================================================


html & body


*  ============================================================= */

html {
	color: #000;
	font-size: 62.5%;
	font-weight: 400;
	font-family: 'Noto Sans JP', sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body img {
	height: auto;
	vertical-align: top;
	width: 100%;
}

/* =============================================================


wrap


*  ============================================================= */

#wrap {
	display: flex;
	overflow: hidden;
	position: relative;
}

@media screen and (max-width: 767px) {
	#wrap {
		display: block;
	}
}

#wrap .wrap-left {
	flex-grow: 1;
}

@media screen and (max-width: 767px) {
	#wrap .wrap-left {
		width: 100%;
	}
}

#wrap .wrap-right {
	flex: 0 0 280px;
	background-color: #f5f5f5;
	position: relative;
}

@media screen and (max-width: 767px) {
	#wrap .wrap-right {
		display: none;
	}
}

/* =============================================================


header


*  ============================================================= */

.header {
	position: relative;
	width: 100%;
}

.header #header-inn {
	height: 72px;
	margin: 0 auto;
	position: absolute;
		top: 64px;
		left: 50%;
	transform: translateX(-50%);
	width: 90%;
	max-width: 1210px;
	z-index: 1000;
}

@media screen and (max-width: 1024px) {
	.header #header-inn {
		position: absolute;
			top: 0;
			left: 50%;
		width: 92%;
		max-width: 600px;
	}
}

@media screen and (max-width: 767px) {
	.header #header-inn {
		background-color: #fff;
		position: fixed;
			top: 0;
			left: 50%;
		width: 100%;
		max-width: 100%;
	}
}

/* =======================================================
inn-conts
*  ======================================================= */

.header #header-inn .inn-conts {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 72px;
	width: 100%;
}

@media screen and (max-width: 767px) {
	.header #header-inn .inn-conts {
		margin: 0 auto;
		width: 92%;
		max-width: 600px;
	}
}

/* ------------------------------------------
conts-left
*  ------------------------------------------ */

.header #header-inn .inn-conts .conts-left {
	display: flex;
	align-items: center;
}

/* left-logo -------------- */

.header #header-inn .inn-conts .conts-left .left-logo {
	width: 362px;
}

@media screen and (max-width: 1024px) {
	.header #header-inn .inn-conts .conts-left .left-logo {
		width: clamp(120px, 64vw, 220px);
	}
}

/* ------------------------------------------
conts-right
*  ------------------------------------------ */

.header #header-inn .inn-conts .conts-right {
	display: none;
}

@media screen and (max-width: 767px) {
	.header #header-inn .inn-conts .conts-right {
		display: block;
	}
	.header #header-inn .inn-conts .conts-right a {
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #f8b500;
		border-radius: 8px;
		color: #fff;
		font-size: 1.5rem;
		font-weight: 500;
		height: 40px;
		width: clamp(100px, 28vw, 120px);
	}
}

/* =============================================================


footer


*  ============================================================= */

.footer {
	background-color: #002a74;
	padding-bottom: 100px;
	padding-top: 110px;
	position: relative;
	width: 100%;
}

@media screen and (max-width: 767px) {
	.footer {
		padding-bottom: 140px;
	}
}

.footer .footer-inn {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin: 0 auto;
	width: 90%;
	max-width: 1210px;
}

@media screen and (max-width: 1024px) {
	.footer .footer-inn {
		flex-wrap: wrap;
		width: 92%;
		max-width: 600px;
	}
}

/* =======================================================
inn-left
*  ======================================================= */

.footer .footer-inn .inn-left {
	width: 68%;
}

@media screen and (max-width: 1024px) {
	.footer .footer-inn .inn-left {
		width: 100%;
	}
}

/* ------------------------------------------
left-subttl
*  ------------------------------------------ */

.footer .footer-inn .inn-left .left-subttl {
	color: #fff;
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.4;
}

@media screen and (max-width: 1024px) {
	.footer .footer-inn .inn-left .left-subttl {
		font-size: clamp(1.30rem, 0.43vw + 1.16rem, 1.60rem);
		text-align: center;
	}
}

/* ------------------------------------------
left-ttl
*  ------------------------------------------ */

.footer .footer-inn .inn-left .left-ttl {
	width: 456px;
}

@media screen and (max-width: 1024px) {
	.footer .footer-inn .inn-left .left-ttl {
		margin: 0 auto;
		width: 72%;
	}
}

/* ------------------------------------------
left-nav
*  ------------------------------------------ */

.footer .footer-inn .inn-left .left-nav {
	margin-top: 40px;
}

.footer .footer-inn .inn-left .left-nav .company-name {
	color: #fff;
	font-size: 1.4rem;
	font-weight: 400;
}

.footer .footer-inn .inn-left .left-nav .company-mail {
	color: #fff;
	font-size: 1.4rem;
	font-weight: 400;
	margin-top: 16px;
}

.footer .footer-inn .inn-left .left-nav .company-mail a {
	color: #fff;
}

.footer .footer-inn .inn-left .left-nav .copyright {
	color: #fff;
	font-size: 1.4rem;
	font-weight: 400;
	margin-top: 16px;
}

@media screen and (max-width: 1024px) {
	.footer .footer-inn .inn-left .left-nav .company-name,
	.footer .footer-inn .inn-left .left-nav .company-mail,
	.footer .footer-inn .inn-left .left-nav .copyright {
		font-size: clamp(1.30rem, 0.14vw + 1.26rem, 1.40rem);
		text-align: center;
	}
}

/* =======================================================
inn-right
*  ======================================================= */

.footer .footer-inn .inn-right {
	width: 32%;
}

@media screen and (max-width: 1024px) {
	.footer .footer-inn .inn-right {
		margin-top: 40px;
		width: 100%;
	}
}

.footer .footer-inn .inn-right a {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #f8b500;
	border-radius: 8px;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 500;
	height: 56px;
	margin-left: auto;
	width: clamp(120px, 100%, 320px);
	transition: all .5s;
}

.footer .footer-inn .inn-right a:hover {
	background-color: #f88600;
}

@media screen and (max-width: 1024px) {
	.footer .footer-inn .inn-right a {
		margin: 0 auto;
		width: 72%;
	}
}

/* =======================================================
backtotop
*  ======================================================= */

#backtotop {
	display: none;
}

@media screen and (max-width: 767px) {
	#backtotop {
		display: block;
		position: relative;
		z-index: 100;
	}
	#backtotop-inn {
		position: fixed;
			bottom: 40px;
			right: 16px;
		width: 40px;
	}
}

/* =============================================================


only


*  ============================================================= */

.pc-only {
	display: block;
}

br.pc-only, a.pc-only, span.pc-only {
	display: inline;
}

@media screen and (max-width: 1024px) {
.pc-only {
		display: none;
	}
	br.pc-only, a.pc-only, span.pc-only {
		display: none;
	}
}

.sp-only {
	display: none;
}

br.sp-only, a.sp-only, span.sp-only {
	display: none;
}

@media screen and (max-width: 1024px) {
	.sp-only {
		display: block;
	}
	br.sp-only, a.sp-only, span.sp-only {
		display: inline;
	}
}