@charset "UTF-8";

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	font-size: 10px;
}
@media screen and (max-width: 1360px) {
	html {
		font-size: 0.7352941176vw;
	}
}

@media screen and (max-width: 767.98px) {
	html {
		font-size: 2.6666666667vw;
	}
}

body{
	margin:0;
	color:#000;
	font-family:"Zen Kaku Gothic New","游ゴシック体","Yu Gothic",YuGothic,sans-serif;
	font-size: 1.8rem;
	font-weight:400;
	line-height:1.8;
	-webkit-text-size-adjust:100%;
}
@media screen and (max-width: 767.98px) {
	body {
		font-size: 1.4rem;
		line-height: 1.6;
	}
}

body,
dd,
div,
dl,
dt,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
li,
ol,
p,
td,
th,
ul {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

article,
aside,
figure,
footer,
header,
main,
nav,
section {
	display: block;
	box-sizing: border-box;
}

img {
	width: 100%;
	height: auto;
	display: block;
	border: none;
}

a {
	color: inherit;
	text-decoration: none;
	display: inline-block;
	transition: all .3s ease;
}

a:hover {
	opacity: .75;
}

li {
	list-style: none;
}

.pc {
	display: block !important;
}

.sp {
	display: none !important;
}

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

	.sp {
		display: block !important;
	}
}

/* ------------------------------------
	common
------------------------------------ */

.container {
	width: 100%;
	max-width: 130rem;
	margin: 0 auto;
	padding: 0 2rem;
}

@media screen and (max-width:1440px){
	.container{
		max-width:120rem;
	}
}

@media screen and (max-width: 767.98px) {
	.container {
		padding: 0 2rem;
	}
}

.section {
	position: relative;
	padding: 16rem 0;
}
@media screen and (max-width: 767.98px) {
	.section {
		padding: 6rem 0;
	}
}

.section__title {
	margin-bottom: 4rem;
	font-size: 2rem;
	font-weight: 500;
    letter-spacing:0.03em;
}
@media screen and (max-width: 767.98px) {
	.section__title {
		margin-bottom: 2rem;
		font-size: 1.5rem;
	}
}

.section__title > span {
	display: block;
	color: #15588A;
	margin-bottom: 2rem;
	font-family: "Poppins", sans-serif;
	font-size: 6rem;
	font-weight: 500;
	line-height: 1;
}
@media screen and (max-width: 767.98px) {
	.section__title > span {
		margin-bottom: 1rem;
		font-size: 3rem;
	}
}

.section__lead {
	margin-bottom: 2.5rem;
	font-size: 3rem;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: .05em;
}
@media screen and (max-width:767.98px){
	.section__lead {
		margin-bottom: 2rem;
		font-size: 1.8rem;
		letter-spacing: .01em;
	}
}

/* ------------------------------------
	header
------------------------------------ */

.header{
	position: fixed;
	top: 1rem;
	left: 3.2rem;
	right: 3.2rem;
	z-index: 1000;
}
@media screen and (max-width: 767.98px){
	.header{
		top: 0.8rem;
		left: 0.8rem;
		right: 0.8rem;
	}
}

/* ------------------------------------
	header inner
------------------------------------ */

.header__inner{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 7rem;
	padding: 0 1rem 0 3.5rem;
	background: #FFF;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(0,0,0,.08);
}
@media screen and (max-width: 767.98px){
	.header__inner{
		height: 5rem;
		padding: 0 0.6rem 0 1.6rem;
	}
}

.header__logo{
	position: relative;
	z-index: 1100;
	width: 31rem;
	margin: 0;
	flex-shrink: 0;
}
@media screen and (max-width: 767.98px){
	.header__logo{
		width: 20rem;
	}
}

.header__logo a {
	display: block;
}

.header__logo img {
	display: block;
	width: 100%;
	height: auto;
}

.header__nav{
	display: flex;
	align-items: center;
	gap: 4.5rem;
}
@media screen and (max-width: 767.98px){
	.header__nav{
		position: fixed;
		inset: 0;
		z-index: 1050;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		gap: 0;
		width: 100%;
		height: 100%;
		padding: 10rem 2rem 4rem;
		overflow-y: auto;
		background: #fff;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(-1.5rem);
		transition:
			opacity 0.35s ease,
			visibility 0.35s ease,
			transform 0.35s ease;
	}
}

body.menuon .header__nav{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
}

.header__menu{
	display: flex;
	align-items: center;
	gap: 3.8rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
@media screen and (max-width: 767.98px){
	.header__menu{
		flex-direction: column;
		align-items: center;
		width: 100%;
		gap: 0;
	}
}

.header__menu li{
	margin: 0;
	padding: 0;
}
@media screen and (max-width: 767.98px){
	.header__menu li{
		width: 100%;
		max-width: 45rem;
		opacity: 0;
		transform: translateY(1.5rem);
		transition:
			opacity 0.4s ease,
			transform 0.4s ease;
	}
}

body.menuon .header__menu li{
	opacity: 1;
	transform: translateY(0);
}

body.menuon .header__menu li:nth-child(1){
	transition-delay: 0.08s;
}

body.menuon .header__menu li:nth-child(2){
	transition-delay: 0.13s;
}

body.menuon .header__menu li:nth-child(3){
	transition-delay: 0.18s;
}

body.menuon .header__menu li:nth-child(4){
	transition-delay: 0.23s;
}

.header__menu a {
	position: relative;
	display: block;
	padding: 1rem 0;
	color: #102D48;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.5;
	white-space: nowrap;
	text-decoration: none;
	transition: opacity 0.3s ease;
}
@media screen and (max-width: 767.98px){
	.header__menu a{
		width: 100%;
		padding: 1.7rem 1rem;
		border-bottom: 1px solid #d9e0e6;
		font-size: 1.6rem;
		text-align: center;
	}
}

.header__menu a::after{
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0.3rem;
	width: 0;
	height: 2px;
	background: #102D48;
	transform: translateX(-50%);
	transition: width 0.3s ease;
}
@media screen and (max-width: 767.98px){
	.header__menu a::after{
		display: none;
	}
}

.header__menu a:hover{
	opacity: 1;
}

.header__menu a:hover::after{
	width: 100%;
}

.header__contact {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.8rem;
	width: 16.5rem;
	height: 5rem;
	flex-shrink: 0;
	background: #15588A;
	color: #FFF;
	border-radius: 999px;
	font-family: "Poppins", sans-serif;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	transition: background 0.3s ease;
	letter-spacing: .05em;
}
@media screen and (max-width: 767.98px){
	.header__contact{
		width: 100%;
		max-width: 30rem;
		height: 5.5rem;
		margin-top: 3rem;
		font-size: 1.5rem;
		opacity: 0;
		transform: translateY(1.5rem);
		transition:
			background 0.3s ease,
			opacity 0.4s ease 0.3s,
			transform 0.4s ease 0.3s;
	}
}

.header__contact::before {
	content: "";
	display: inline-block;
	width: 2rem;
	height: 2rem;
	background: url("../img/common/icon-mail.svg") no-repeat center center;
	background-size: contain;
	flex-shrink: 0;
}

.header__contact:hover {
	opacity: 1;
	background: #064872;
}

body.menuon .header__contact {
	opacity: 1;
	transform: translateY(0);
}


/* ------------------------------------
	hamburger
------------------------------------ */

.hamburger{
	display: none;
}
@media screen and (max-width: 767.98px){
	.hamburger{
		position: relative;
		z-index: 1200;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 4.2rem;
		height: 4.2rem;
		flex-shrink: 0;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: #102D48;
		cursor: pointer;
	}
}


/* ------------------------------------
	hamburger lines
------------------------------------ */

.hamburger span,
.hamburger::before,
.hamburger::after{
	content: "";
	position: absolute;
	left: 50%;
	width: 1.9rem;
	height: 0.2rem;
	background: #fff;
	border-radius: 999px;
	transform: translateX(-50%);
	transition:
		top 0.3s ease,
		transform 0.3s ease,
		opacity 0.3s ease;
}

.hamburger::before{
	top: 1.3rem;
}

.hamburger span{
	top: 2rem;
}

.hamburger::after{
	top: 2.7rem;
}


/* ------------------------------------
	hamburger open
------------------------------------ */

body.menuon .hamburger span{
	opacity: 0;
}

body.menuon .hamburger::before{
	top: 2rem;
	transform: translateX(-50%) rotate(45deg);
}

body.menuon .hamburger::after{
	top: 2rem;
	transform: translateX(-50%) rotate(-45deg);
}

body.menuon{
	overflow: hidden;
}

/* ------------------------------------
	subpage mv
------------------------------------ */

.mvsubbox {
	position: relative;
}

.mvsubbox .mvbox-info {
	position: relative;
	display: flex;
	align-items: center;
	height: 50rem;
	background:url("../img/contact/img-mv.jpg") center center / cover no-repeat;
}

@media screen and (max-width:767.98px){
	.mvsubbox .mvbox-info {
		height: 30rem;
	}
}

.mvsubbox .container {
	position: relative;
	z-index: 1;
}

.mvsubbox .mvbox-title{
	color: #FFF;
	font-size: 2rem;
	font-weight: 500;
	letter-spacing:.03em;
    text-shadow:0 .2rem .8rem rgba(0,0,0,.2);
}
@media screen and (max-width:767.98px){
	.mvsubbox .mvbox-title{
		font-size: 1.8rem;
	}
}

.mvsubbox .mvbox-title span{
	display: block;
	margin-bottom: 2rem;
	font-family: "Poppins",sans-serif;
	font-size: 6rem;
	line-height: 1;
}

@media screen and (max-width:767.98px){
	.mvsubbox .mvbox-title span{
		margin-bottom:1rem;
		font-size: 3rem;
	}
}

/*------------------------------------
	footer
------------------------------------*/

.footer{
	padding: 8rem 0 3rem;
	background: #102D48;
	color: #FFF;
}
@media screen and (max-width:767.98px){
	.footer{
		padding: 4rem 0 2rem;
	}
}

.footer__inner{
	text-align:center;
}

.footer__logo img{
	display: block;
	width: 30rem;
	height: auto;
	margin:0 auto;
}
@media screen and (max-width:767.98px){
	.footer__logo img{
		width: 15rem;
	}
}

.footer__address{
	margin-top: 2rem;
	font-size: 1.6rem;
	font-weight: 500;
	line-height:2;
}
@media screen and (max-width:767.98px){
	.footer__address{
		margin-top: 1rem;
		font-size: 1.3rem;
	}
}

.footer__bottom{
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(255,255,255,.35);
}
@media screen and (max-width:767.98px){
	.footer__bottom{
		margin-top: 1.5rem;
		padding-top: 1rem;
	}
}

.footer__copyright{
	text-align:center;
	font-size: 1.4rem;
	letter-spacing: 0.1em;
}
@media screen and (max-width:767.98px){
	.footer__copyright{
		font-size: 1.2rem;
	}
}

/* ------------------------------------
	pagetop
------------------------------------ */

.pagetop{
	position:fixed;
	right:2rem;
	bottom:2rem;
	z-index:900;
	display:flex;
	align-items:center;
	justify-content:center;
	width:5.6rem;
	height:5.6rem;
	border-radius:50%;
	background:#15588A;
	box-shadow:0 .4rem 1.2rem rgba(0,0,0,.15);
	opacity:0;
	visibility:hidden;
	transform:translateY(1rem);
	transition:.3s;
}
@media screen and (max-width:767.98px){
	.pagetop{
		right:1.5rem;
		bottom:1.5rem;
		width:4.6rem;
		height:4.6rem;
	}
}

.pagetop.is-show{
	opacity:1;
	visibility:visible;
	transform:translateY(0);
}

.pagetop:hover{
	background:#1C456A;
}
@media screen and (max-width:767.98px){
	.pagetop:hover{
		background:#102D48;
	}
}

.pagetop span{
	position:relative;
	display:block;
	width:1.2rem;
	height:1.2rem;
	border-top:.2rem solid #fff;
	border-left:.2rem solid #fff;
	transform:rotate(45deg);
}
@media screen and (max-width:767.98px){
	.pagetop span{
		width:1rem;
		height:1rem;
	}
}

/* ------------------------------------
	scroll animation
------------------------------------ */

.js-scroll{
	opacity:0;
	transform:translateY(2rem);
	transition:
		opacity .8s ease,
		transform .8s ease;
	will-change:opacity,transform;
}

@media screen and (max-width:767.98px){
	.js-scroll{
		transform:translateY(1.5rem);
	}
}

.js-scroll.is-show{
	opacity:1;
	transform:translateY(0);
}

@media (prefers-reduced-motion:reduce){
	.js-scroll{
		opacity:1;
		transform:none;
		transition:none;
	}
}