@charset "utf-8";


/* 基本要素	---------------- */
div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}
html{
	position: relative;
}
body {
	margin:0 0;
	width:100%;
	color:#1a1004;
	position: relative;
	background: #fff;
	-webkit-text-size-adjust: none;
	font-family: 'Noto Sans JP', sans-serif;
	font-feature-settings: "palt" 1;
	font-weight:400;
	line-height: 2;
	text-align:justify;
	font-size: 100%;
	overflow-x:hidden;
	box-sizing:border-box;
}

@media(max-width:700px){
	body main{
		font-size:93%;
	}
}
body *{
	box-sizing:border-box;
}
.mincho{
	font-family: 'Noto Serif JP', serif;
}
input , select , textarea , button{
	font-size: 100%;
	font-family: inherit;
}
ul {
	list-style: none;
}
ol{
	list-style: decimal;
}
li {
}

ol li{
	margin-left:1em;
}
.page ul li{
	text-indent:-1em;
	margin-left:1em;
}
.page ul li:not(:last-child){
	margin-bottom:1em;
}
.page ul li:first-letter{
	font-feature-settings: normal;
}
img {
	border: 0;
	vertical-align:bottom;
	max-width:100%;
	height:auto;
}
table {
	font-size: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}
th, td {
	vertical-align: top;
	line-height: 150%;
}
caption, th {
	text-align: left;
}
address, caption, cite, code, dfn, em, th, var {
	font-style: normal;
	font-weight: normal;
}
p {
	line-break: strict;
	word-break: normal;
	margin:0;
}
a{
	transition: 0.6s ease;
}
a:hover img{
	opacity:0.8;
}
a:link {
	color: #329fdb;
	text-decoration: none;
}
a:visited {
	color: #329fdb;
	text-decoration: none;
}
a:hover {
	color: #329fdb;
	text-decoration: underline;
}

label {
	cursor: pointer;
}
.clfx:after {
	display: block;
	clear: both;
	height: 0px;
	visibility: hidden;
	content: ".";
	overflow: hidden;
	font-size: 0.1em;
	line-height: 0;
}
.clfx {
	min-height: 1px;
}
* html .clfx {
	height: 1px;
	/*¥*//*/ /*MAC IE5.x対策*/
	height: auto;
	overflow: hidden;
	/**/
}

main,header,footer,nav{
	display:block;
}
#skip {
	position: absolute;
	left: -9999em;
}

.mb1{
	margin-bottom:1em !important;
}
.mb2{
	margin-bottom:2em !important;
}
.mb50{
	margin-bottom:50px !important;
}
.mb60{
	margin-bottom:60px !important;
}
.mb70{
	margin-bottom:70px !important;
}
.mb80{
	margin-bottom:80px !important;
}
.mb90{
	margin-bottom:90px !important;
}
.mb100{
	margin-bottom:100px !important;
}
.i0{
	text-indent:0 !important;
}

.text-center{
	text-align:center;
}


/* 基本レイアウト---------------- */
.wrapper {
	width:100%;
	max-width:1120px;
	margin: 0 auto;
	padding: 0 10px;
	position:relative;
}
.width-limiter{
	width:100%;
	max-width:1280px;
	margin: 0 auto;
}

@media screen and (max-width:680px){
	.wrapper {
		width:100%;
		padding: 0px 20px 0;
	}
}



/* メインイメージ---------------- */
#slider{
	width: 100%;
	padding-top:36.45%;
	position:relative;
}
#slider .text{
	width: 60%;
	max-width:1090px;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50% , -50%);
}
#slider .text img{
	width: 100%;
}
#slider .image{
	display: flex;
	width: 100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	overflow: hidden;

}
#slider .image img{
	width: auto;
	max-width:none;
	height: 100%;
}
#slider .image img:first-child{
	 animation: slide1 30s -15s linear infinite;
	 backface-visibility: hidden;
	 will-change: transform;
}
#slider .image img:last-child{
	animation: slide2 30s linear infinite;
	 backface-visibility: hidden;
	 will-change: transform;
}
@keyframes slide1 {
	0% {
		transform: translateX(100%);
	}
	to {
		transform: translateX(-100%);
	}
}

@keyframes slide2 {
	0% {
		transform: translateX(0);
	}
	to {
		transform: translateX(-200%);
	}
}

@media only screen and (max-width:700px){

	#slider{
		width: 100%;
		padding-top:87.5%;
		position:relative;
	}
	#slider .text{
		width: calc(100% - 20px);
	}
}



@media(min-width:701px){
.sp{
	display:none;	
}
.pc{
	display:block;	
}
}
@media(max-width:700px){
.sp{
	display:block;	
}
.pc{
	display:none;	
}
}
@media print{
.sp{
	display:none;	
}
.pc{
	display:block;	
}
}





.before-h2{
	text-align:center;
	position:relative;
	font-size:1.56em;
	font-weight:700;
	color:#00268F;
	margin-bottom:20px;
}
.before-h2-line{
	position:relative;
	padding-left:142px;
	font-size:1.56em;
	font-weight:700;
	color:#00268F;
	margin-bottom:20px;
}
.before-h2-line:before{
	content:"";
	display:block;
	height:2px;
	width:130px;
	background:#00268F;
	position:absolute;
	left:0;
	top:calc(50% - 1px);
}

h2.top{
	text-align:center;
}
.before-h2-line+h2.top{
	text-align:left;
}
h2.top img{
	width:auto;
	height:74px;
	object-fit: contain;
}

@media only screen and (max-width:1100px){
	.before-h2{
		font-size:1em;
		margin-bottom:5px;
	}
	.before-h2-line{
		padding-left:68.5px;
		font-size:1em;
		margin-bottom:5px;
	}
	.before-h2-line:before{
		height:2px;
		width:60px;
	}

	h2.top img{
		height:35px;
	}
}


.button-blue{
}
.button-blue a{
	display:block;
	text-align:center;
	max-width:300px;
	padding:15px;
	background:#00195D;
	color:#fff;
	font-size:1em;
	font-weight:500;
	text-decoration:none;
	transition:0.3s ease opacity;
}
.button-blue a:after{
	content: '';
	display: inline-block;
	width: 47.5px;
	height: 12px;
	background-image: url(../images/arrow-white.png);
	background-size: contain;
	vertical-align: middle;
	margin-left:10px;
}
.button-blue a:hover{
	opacity:0.6;
}

.button-blue.center a{
	margin-left:auto;
	margin-right:auto;
}
@media only screen and (max-width:1100px){
	.button-blue a{
		margin-left:auto;
		margin-right:auto;
	}
	.button-blue a:after{
	width: 24.5px;
	height: 5.6px;
		margin-left:5px;
	}
}


.button-tel{
}
.button-tel div,
.button-tel a{
	display:block;
	text-align:center;
	max-width:300px;
	padding:9px 15px;
	background:#fff;
	color:#000;
	font-size:0.875em;
	font-weight:500;
	text-decoration:none;
	transition:0.3s ease background;
	border:1px solid #00268F;
	line-height:1.2;
}
/*
.button-tel div:hover,
.button-tel a:hover{
	background:rgba(0,25,91,0.3);;
}
*/

.button-tel .tel{
	color:#00268F;
}
.button-tel .tel span{
	font-size:1.57em;
}
.button-tel.center div,
.button-tel.center a{
	margin-left:auto;
	margin-right:auto;
}
@media only screen and (max-width:1100px){
	.button-tel div,
	.button-tel a{
		margin-left:auto;
		margin-right:auto;
	}
}



#page-heading{
	position:relative;
	margin-bottom:40px;
}
#page-heading .image img{
	width:100%;
	height:320px;
	object-fit:cover;
}
#page-heading.bottom .image img{
	object-position: bottom;
}
#page-heading .text{
	color:#fff;
	position:absolute;
	left:0;
	top:50%;
	width:100%;
	max-width:1100px;
	left:50%;
	transform:translate(-50%,-50%);
	
	font-family: 'Noto Serif JP', serif;
	text-align:center;
}
#page-heading.navy .text{
	color:#00195D;
}
#page-heading.left .text{
	text-align:left;
}
#page-heading .text .en{
	font-size:3.125em;
	font-weight:700;
	letter-spacing:0.1em;
}
#page-heading .text .jp{
	font-size:1.25em;
	font-weight:600;
	letter-spacing:0.15em;
}
@media only screen and (max-width:1100px){
	#page-heading{
		margin-bottom:50px;
	}
	#page-heading .image img{
		height:200px;
	}
	#page-heading .text{
		top:50%;
		width:calc(100% - 52px);
	}
	#page-heading .text .en{
		font-size:1.875em;
	}
	#page-heading .text .jp{
		font-size:1.25em;
	}
}


#page-content{
	margin-bottom:50px;
}

/* その場で */
.fadeIn{
animation-name:fadeInAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* 下から */

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/* 上から */

.fadeDown{
animation-name:fadeDownAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeDownAnime{
  from {
    opacity: 0;
	transform: translateY(-100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/* 左から */

.fadeLeft{
animation-name:fadeLeftAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeLeftAnime{
  from {
    opacity: 0;
	transform: translateX(-100px);
  }

  to {
    opacity: 1;
	transform: translateX(0);
  }
}

/* 右から */

.fadeRight{
animation-name:fadeRightAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeRightAnime{
  from {
    opacity: 0;
	transform: translateX(100px);
  }

  to {
    opacity: 1;
	transform: translateX(0);
  }
}


/*スクロールダウン全体の場所*/
.arrowdown{
	position:relative;
	height:20px;
}
.arrowdown figure{
	position:absolute;
	bottom:0px;
	left:50%;
	transform:translateX(-50%);
	animation: arrowmove 1s ease-in-out infinite;
}

/*下からの距離が変化して全体が下→上→下に動く*/
@keyframes arrowmove{
      0%{bottom:0px;}
      50%{bottom:20px;}
     100%{bottom:0px;}
 }



.gmap {
	height: 0;
	overflow: hidden;
	padding-bottom: 27.77%;
	position: relative;
}
.gmap iframe {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
}
.gmap + p{
	text-indent:0;
	margin-left:40px;
	margin-top:25px;
	margin-bottom:45px;
}
@media only screen and (max-width:700px){
	.gmap + p{
		margin-left:0;
	}
	.gmap {
		height: 0;
		overflow: hidden;
		padding-bottom: 100%;
		position: relative;
	}
}
