@import url(notosansjapanese.css);
/* ===========================  =============================== */
/* 暥帤壔偗懳嶔 */
/* CSS 弶婜壔 */
/* Box sizing rules */
#main *,
#main *::before,
#main *::after {
  box-sizing: border-box;
}

/* Remove default padding */
#main ul[class],
#main ol[class] {
  padding: 0;
}

/* Remove default margin */
/* #main body,
#main h1,
#main h2,
#main h3,
#main h4,
#main p,
#main ul[class],
#main ol[class],
#main figure,
#main blockquote,
#main dl,
#main dd {
  margin: 0;
}
*/

/* Set core root defaults */
/* html {
  scroll-behavior: smooth;
  font-size: 62.5%;
} */

/* Set core body defaults */
/* body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
} */

/* Remove list styles on ul, ol elements with a class attribute */
#main ul[class],
#main ol[class] {
  list-style: none;
}

/* A elements that don't have a class get default styles */
#main a:not([class]) {
  text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
#main img,
#main picture {
  max-width: 100%;
  display: block;
}

/* Natural flow and rhythm in articles by default */
#main article > * + * {
  margin-top: 1em;
}

/* Inherit fonts for inputs and buttons */
#main input,
#main button,
#main textarea,
#main select {
  font: inherit;
}

/* Blur images when they have no alt attribute */
#main img:not([alt]) {
  filter: blur(10px);
}

/* Remove all animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  #main * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
/* =========================== original =============================== */

/* html,body{
	min-width: 320px;
} */

#main a{
	text-decoration: none;
	color: #024097;
	transform: translateZ(0);
	/* safari */
	transform: none;
	/* will-change: transform; */
}
/* ::selection {
    background: #f5f7ff;
    color: #1c4097;
}
::-moz-selection {
    background: #f5f7ff;
    color: #1c4097;
}
a::selection {
    background: #ff7f00;
    color: #ffffff;
}
a::-moz-selection {
    background: #ff7f00;
    color: #ffffff;
} */
/* support pc or sp*/
#main .sup_pc {
  display: block;
}

#main .sup_sp{
  display: none;
}

#main #container {
  position: relative;
  margin: 0 auto;
  padding: 0 0 0 0;
  min-width: 1200px;
  /* opacity: 0; */
}

/* global menu */
.mp-menu a {
	color: #ffffff!important;
	font-size: 16px!important;
}
.mp-menu h2 {
	color: #ffffff!important;
	font-size: 16px!important;
}
li.icon.icon-arrow-right > a:before,
li.icon.icon-arrow-right > a:after,
h2.icon.icon-arrow-left .mp-back:before,
h2.icon.icon-arrow-left .mp-back:after{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	/* margin: auto; */
	content: "";
	vertical-align: middle;
}

li.icon.icon-arrow-right > a {
	/* display: inline-block; */
	/* padding: 0 0 0 16px; */
	color: #000;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
	position: relative;
}
li.icon.icon-arrow-right > a:before {
	content: "";
	position: absolute;
	top: calc(50% - 4px);
	bottom: 0;
	left: 55%;
	/* margin: auto; */
	vertical-align: middle;
	/* 	left: 3px; */
	width: 10px;
	height: 10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

h2.icon.icon-arrow-left .mp-back {
	position: relative;
	padding-left: 27px;
}

h2.icon.icon-arrow-left .mp-back:before {
	width: 18px;
	height: 1px;
	top: calc(50% - 0.3px);
	left: 9px;

	background: #fff;
}
h2.icon.icon-arrow-left .mp-back:after{
	width: 7px;
	height: 7px;
	top: calc(50% - 3.5px);
	left: 10px;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.mp-menu ul li.small > a {
	font-size: 12px!important;
}

/* =========================== original media =============================== */
@media screen and (max-width: 768px) {
  /* html, body {
    height: 100%;
  } */
  #main .sup_pc {
    display: none;
  }
  #main .sup_sp {
    display: block;
  }
  #main img[src$=".svg"] {
    width: 100%;
    height: auto;
  }
}
@media screen and (max-width: 768px) {
  #main #container {
    min-width: initial;
    min-width: auto;
  }
  #main .more-link a {
    padding-right: 25px;
    background-size: 15px 15px;
    font-size: 10px;
    line-height: 15px;
  }
  #main .pagetop {
    bottom: 20px;
    right: 20px;
  }
  #main .pagetop a {
    width: 40px;
    height: 40px;
  }
  #main .pagetop a::after, #main .pagetop a::before {
    top: 12px;
    width: 1px;
    height: 16px;
  }
}

.menu_close {
	position: absolute;
	color: #ffffff;
	font-size: 46px;
	font-weight: 100;
	left: 12%;
	top: 0.2%;
	z-index: 1000;
	opacity: 0;
	-webkit-transition: opacity 0.3s 1.0s;
	-moz-transition: opacity 0.3s 1.0s;
	transition: opacity 0.3s 1.0s;
}

.mp-pushed .menu_close {
	opacity: 1.0;
}

.menu_close > .mp-back {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	box-shadow: none;
}

.menu_close > .mp-back:after{
	display: none;
}
#sp-commonHeader{
	z-index: 1000!important;
}


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

 /* *{
 	transition: 0.5s all;
 } */

 #main {
 	background: #F5F7FF;
 }

 #main .role_inner {}

 #main .section_inner {
 	max-width: 900px;
 	margin: 0 auto;
 }

 #main .inner{
 	margin: 0 auto;
 	padding: 0;
 	position: static;
 	width: 100%;
 }

 #main .hgroup {
 	margin: 0 0 24px;
 	text-align: center;
 }

 #main .hgroup h2 {
 	font-size: 20px;
 	display: inline-block;
 	position: relative;
 }

 #main .hgroup h2 span {}

 body {
 	font-family: 'Noto Sans Japanese', "僸儔僊僲妏僑 Pro W3", "Hiragino Kaku Gothic Pro","儊僀儕僆", Meiryo, sans-serif;
 	font-weight: 300;
 }