@charset "utf-8";
@import url('https://cdn.jsdelivr.net/npm/destyle.css@1.0.15/destyle.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/*font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
*/


/* ------- LINK ---------------------------------------------- */
a:link {
  color: inherit;
  text-decoration: inherit;
}
a:visited {
  color: inherit;
  text-decoration: inherit;
}
a:hover {
  color: inherit;
  text-decoration: inherit;
}
a:active {
  color: inherit;
  text-decoration: inherit;
}

a.text-link{
  color: inherit;
  text-decoration: underline;
}

@media (hover: hover) and (pointer: fine){
  a.text-link:hover{
		color: #001228;
  }
}



/* ------- BODY ---------------------------------------------- */
html{
  font-size: 62.5%;
}
body {
  color: #414141;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  line-height: 2;
  overflow-x: hidden;
  position: relative;
	word-wrap: break-word;
	overflow-wrap: anywhere;
}


*{
  backface-visibility: hidden;/* animation時のにじみ防止 */
  -webkit-backface-visibility: hidden;/* animation時のにじみ防止 */
  -webkit-font-smoothing: antialiased/* animation時の文字にじみ防止 */
  -moz-osx-font-smoothing: grayscale;/* animation時の文字にじみ防止 */
  -webkit-font-smoothing: antialiased;
}

img {
  height: auto;
  max-width: 100%;
	vertical-align: bottom;
}


/* ------- RESPONSIVE ---------------------------------------------- */
@media print, screen and (min-width:781px) {
  .pc-ver {
    display: block;
  }
  .sp-ver {
    display: none;
  }
}
@media screen and (max-width: 780px) {
  .pc-ver {
    display: none;
  }
  .sp-ver {
    display: block;
  }
}


/* ------- BODY ---------------------------------------------- */
@media print, screen and (min-width:781px) {
	body{
    font-size: 1.6rem;
	}
}
@media screen and (max-width: 780px) {
	body{
    font-size: 1.6rem;
	}
}




/* ------- HEADER ---------------------------------------------- */
#header-area{
	background-color: #E8E7E7;
}
#logo-main{
	color: #021F3B;
	font-weight: 400;
	line-height: 1;
}
@media print, screen and (min-width:781px) {
	.header-inner{
		height: 50px;
		display: flex;
		align-items: center;
		margin-left: auto;
		margin-right: auto;
		max-width: 1340px;
		width: 90%;
	}
	#logo-main{
		font-size: min(1.09vw,1.5rem);
		display: flex;
		align-items: flex-end;
	}
	#logo-main img{
		margin-right: 10px;
	}
}
@media screen and (max-width: 780px) {
	.header-inner{
		padding-top: 5px;
		padding-bottom: 5px;
		display: flex;
		align-items: center;
		margin-left: auto;
		margin-right: auto;
		width: 90%;
	}
	#logo-main{
		font-size: min(2.14vw,1.5rem);
		display: flex;
		flex-direction: column;
	}
	#logo-main img{
		margin-bottom: 5px;
		width: 60%;
	}
}








/* ------- CONTENTS ---------------------------------------------- */
@media print, screen and (min-width:781px) {
  .inner{
		margin-left: auto;
		margin-right: auto;
		max-width: 1340px;
		width: 90%;
  }
}
@media screen and (max-width: 780px) {
}



/* ------- FOOTER ---------------------------------------------- */
#footer-area{
	position: relative;
}
#footer-area .btn-pagetop{
	transition: .3s;
}
#footer-area .catalog{
	background-color: #021F3B;
	display: flex;
	justify-content: center;
	align-items: center;
}
#footer-area .catalog > a{
	border: 1px solid #FFF;
	color: #FFF;
	font-weight: 500;
	line-height: 1;
	display: block;
	text-align: center;
	transition: .3s;
}
.copyright{
	font-weight: 400;
	text-align: center;
}
@media print, screen and (min-width:781px) {
	#footer-area .btn-pagetop{
		position: absolute;
		right: 0;
		top: -35px;
		transform: translateY(-100%);
	}
	#footer-area .catalog{
		padding-top: 60px;
		padding-bottom: 60px;
	}
	#footer-area .catalog > a{
		font-size: min(1.31vw,1.6rem);
		padding: 10px;
		max-width: 377px;
		width: 19.635%;
	}
	#footer-area .catalog > a:not(:first-child){
		margin-left: 10%;
	}
	@media (hover: hover) and (pointer: fine){
		#footer-area .btn-pagetop:hover{
			opacity: .7;
		}
		#footer-area .catalog > a:hover{
			opacity: .7;
		}
	}
	.footer-contents{
		padding-top: 25px;
		padding-bottom: 25px;
	}
	.footer-contents > ul{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.footer-contents > ul > li:nth-child(n + 2){
		border-left: 1px solid #021F3B;
		padding-left: 35px;
		margin-left: 35px;
	}
	.copyright{
		font-size: 1.5rem;
		display: block;
		margin-top: 40px;
	}
}
@media screen and (max-width: 780px) {
	#footer-area .btn-pagetop{
		height: 30px;
		width: 30px;
		position: absolute;
		right: 5%;
		top: -25px;
		transform: translateY(-100%);
	}
	#footer-area .catalog{
		flex-direction: column;
		padding-top: 30px;
		padding-bottom: 30px;
	}
	#footer-area .catalog > a{
		font-size: min(3.18vw,1.8em);
		padding: 10px;
		width: 42.85%;
	}
	#footer-area .catalog > a:not(:first-child){
		margin-top: 15px;
	}
	.footer-contents{
		padding-top: 25px;
		padding-bottom: 25px;
	}
	.footer-contents > ul{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.footer-contents > ul > li{
		display: flex;
		align-items: center;
	}
	.footer-contents > ul > li:nth-child(n + 2){
		border-left: 1px solid #021F3B;
		padding-left: 15px;
		margin-left: 15px;
	}
	.footer-contents > ul > li:nth-child(1) img{
		height: auto;
		width: 45px;
	}
	.footer-contents > ul > li:nth-child(2) img{
		height: auto;
		width: 50px;
	}
	.copyright{
		font-size: min(2.14vw,1.5rem);
		display: block;
		margin-top: 20px;
	}
}



/* ------- COMMON ---------------------------------------------- */

.note-list > li{
	text-indent: -1em;
	padding-left: 1em;
}
@media print, screen and (min-width:781px) {
}
@media screen and (max-width: 780px) {
}




/* ------- ANIMATION PARTS ---------------------------------------------- */
.fade-in {
  opacity: 0;
  transition-duration: 1s;
  transition-property: opacity, transform;
}
.fade-in-up {
  transform: translate(0, 30px);
}

.fade-in-down {
  transform: translate(0, -30px);
}

.fade-in-left {
  transform: translate(-30px, 0);
}

.fade-in-right {
  transform: translate(30px, 0);
}
.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}