@charset "utf-8";

*:where(:not(iframe, canvas, img, svg, video):not(svg *, symbol *)){
all:unset;display:revert}
*,*::before,*::after{box-sizing:border-box;font-style:normal}
a,button{cursor:revert}
ol,ul,menu{list-style:none}
main img{width: 100%; height: auto;}
table{border-collapse:collapse}
textarea{white-space:revert}
meter{-webkit-appearance:revert;appearance:revert}
::placeholder{color:unset}
:where([hidden]){display:none}
:where([contenteditable]){-moz-user-modify:read-write;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space}
:where([draggable="true"]){-webkit-user-drag:element}
ul,dl,ol,li,dt,dd{margin:0;padding:0}

html{font-size:62.5%;line-height:1.7;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;word-break:break-all;font-feature-settings:"palt"; scroll-behavior: smooth;/**/}


@supports (font-size: clamp(1rem, 1vw, 1rem)) {
  :root {
    --font-size-xs: clamp(1rem, 0vw + 1.1rem, 1rem);
    --font-size-s: clamp(1.3rem, 0.1vw + 1.2rem, 1.4rem);
    --font-size-m: clamp(1.6rem, 0.3vw + 1.4rem, 1.7rem);
    --font-size-l: clamp(1.8rem, 0.5vw + 1.6rem, 2rem);
    --font-size-xl: clamp(2.2rem, 0.7vw + 1.8rem, 2.5rem);
    --font-size-xxl: clamp(2.7rem, 1.1vw + 2.1rem, 3.2rem);
    --font-size-xxxl: clamp(3.2rem, 1.6vw + 2.3rem, 3.9rem);
  }
}

@supports not (font-size: clamp(1rem, 1vw, 1rem)) {
  :root {
    --font-size-xs: 1rem;
    --font-size-s: 1.3rem;
    --font-size-m: 1.6rem;
    --font-size-l: 1.8rem;
    --font-size-xl: 2.2rem;
    --font-size-xxl: 2.7rem;
    --font-size-xxxl: 3.2rem;
  }
  @media screen and (min-width: 1000px) {
    :root {
      --font-size-xs: 1rem;
      --font-size-s: 1.4rem;
      --font-size-m: 1.7rem;
      --font-size-l: 2rem;
      --font-size-xl: 2.5rem;
      --font-size-xxl: 3.2rem;
      --font-size-xxxl: 3.9rem;
    }
  }
}

.font-size-xs{ font-size: var(--font-size-xs);}
.font-size-s{ font-size: var(--font-size-s);}
.font-size-m{ font-size: var(--font-size-m);}
.font-size-l{ font-size: var(--font-size-l);}
.font-size-xl{ font-size: var(--font-size-xl);}
.font-size-xxl{ font-size: var(--font-size-xxl);}
.font-size-xxxl{ font-size: var(--font-size-xxxl);}

body{
  margin:0;
  padding:0;
  background-color:#fff;
  color:#333;
  font-size: var(--font-size-m);
  font-family: Meiryo,-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,sans-serif;
  font-weight:400;
  line-height: 1.7;
}

strong{ font-weight:600;}

a,area,button,input,label,select,summary,textarea,
[tabindex] {
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

a {
  color: #333;
  text-decoration: none;
  cursor: pointer;
}

a:visited,
a:hover,
a:focus,
a:active { color: #333;}

@media (hover: hover) {
a { transition: all .5s ease;}
a:hover { opacity: 0.8;}
}/* End hover */

img {
  width: 100%;
  height: auto;
  border: none;
  background: transparent;
  vertical-align: bottom;
}

.serif{
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  font-display: swap;
  font-weight: 500;
}

.en-sans-serif{
  font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  font-display: swap;
  font-weight: 400;
}

.wrap{
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
  display: block;
	font-family: "Noto Sans JP", sans-serif;
	letter-spacing: 0.05em;
}


/*** CONTENTS ***/

#CONTENTS{
  position: relative;
  width: 100%;
	line-height: 1.6;
}

.contents-section{
  position: relative;
  margin: auto;
	padding-bottom: 10rem;
  width: 94%;
  max-width: 140rem;
}

.contents-section-full{
  position: relative;
  margin: auto;
  width: 100%;
}

.section-inner{
  position: relative;
  margin: auto;
  width: 100%;
	max-width: 120rem;
}

.contents-section-full .section-inner{
  position: relative;
  margin: auto;
  width: 94%;
  max-width: 120rem;
}


/*** IMAGE ASPECT-RATIO ***/
.aspect-1-1 { aspect-ratio: 1 / 1;}
.aspect-1-2 { aspect-ratio: 1 / 2;}
.aspect-2-1 { aspect-ratio: 2 / 1;}
.aspect-3-1 { aspect-ratio: 3 / 1;}
.aspect-3-2 { aspect-ratio: 3 / 2;}
.aspect-4-3 { aspect-ratio: 4 / 3;}
.aspect-9-16 { aspect-ratio: 9 / 16;}
.aspect-16-9 { aspect-ratio: 16 / 9;}
.aspect-728-185 { aspect-ratio: 728 / 185;}
.aspect-46-55 { aspect-ratio: 46 / 55;}
.aspect-96-35 { aspect-ratio: 96 / 35;}
.aspect-5-4 { aspect-ratio: 5 / 4;}
.aspect-10-3 { aspect-ratio: 10 / 3;}
.aspect-59-27 { aspect-ratio: 59 / 27;}

.mt-1{ margin-top: 1em;}
.mt-2{ margin-top: 2em;}
.mt-3{ margin-top: 3em;}
.mt-4{ margin-top: 4em;}
.mt-5{ margin-top: 5em;}
.mt-6{ margin-top: 6em;}
.mt-7{ margin-top: 7em;}

.mb-1{ margin-bottom: 1em;}
.mb-2{ margin-bottom: 2em;}
.mb-3{ margin-bottom: 3em;}
.mb-4{ margin-bottom: 4em;}
.mb-5{ margin-bottom: 5em;}
.mb-6{ margin-bottom: 6em;}
.mb-7{ margin-bottom: 7em;}

.ml-1{ margin-left: 1em;}
.ml-2{ margin-left: 2em;}
.ml-3{ margin-left: 3em;}
.ml-4{ margin-left: 4em;}

.mr-1{ margin-right: 1em;}
.mr-2{ margin-right: 2em;}
.mr-3{ margin-right: 3em;}
.mr-4{ margin-right: 4em;}

.pt-1{ padding-top: 1em;}
.pt-2{ padding-top: 2em;}
.pt-3{ padding-top: 3em;}
.pt-4{ padding-top: 4em;}
.pt-5{ padding-top: 5em;}
.pt-6{ padding-top: 6em;}
.pt-7{ padding-top: 7em;}

.pb-1{ padding-bottom: 1em;}
.pb-2{ padding-bottom: 2em;}
.pb-3{ padding-bottom: 3em;}
.pb-4{ padding-bottom: 4em;}
.pb-5{ padding-bottom: 5em;}
.pb-6{ padding-bottom: 6em;}
.pb-7{ padding-bottom: 7em;}

.pl-1{ padding-left: 1em;}
.pl-2{ padding-left: 2em;}
.pl-3{ padding-left: 3em;}
.pl-4{ padding-left: 4em;}

.pr-1{ padding-right: 1em;}
.pr-2{ padding-right: 2em;}
.pr-3{ padding-right: 3em;}
.pr-4{ padding-right: 4em;}

.padding-1{ padding: 1em;}
.padding-2{ padding: 2em;}

.blue-frame {
	display: inline-block;
	color: #fff;
	background-color: #047df4;
	border-radius: 1rem;
}

/*HEADER*/
#HEADER {
	display: flex; 
	align-items: center; 	
	width: 100%;
	height: 11rem;
	background: #fff; 
  position: fixed;
  top: 0;
  z-index: 999;
  transition: transform 0.3s 0.3s;	
}

#HEADER.hidden, .menu-body.active.hidden {
	transform: translateY(-11rem);
}
.menu-body.active.hidden {opacity: 0;}

#CONTENTS {padding-top: 11rem;}


#HEADER .head-logo{
  position: relative;
  margin-top: 1rem;
  width: 30rem;
  height: auto;
  z-index: 10;
}

#HEADER .head-logo img {width: 100%;}

.header-inner {
	width: 100%;
	height: 11rem;
	max-width: 180rem;
	margin: 0 auto;
	padding: 0 1rem;
	background-color: #fff;	
	display: flex;
	justify-content: space-between;
}

/*MENU*/
.menu-body{
  position: fixed;
  top: 0;
  margin: 0;
  padding: 0 1rem;
  width: 100%;
  height: 11rem;
  height: 100vh;
	max-width: 180rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  transition: all 0.5s ease;
  pointer-events: none;
}

.menu-body .menu-inner {
	position: absolute;
	top: 0;
	padding: 0 1rem;
}


@media screen and (max-width: 1200px) {
	.global-menu-trigger{
		margin: 3rem 0 0;
		padding: 0;
		width: 4.4rem;
		height: 4.4rem;
		display: flex;
		align-items: center;
		justify-content: center;
		overflow: hidden;
		cursor: pointer;
		transition: all 0.5s ease;
		z-index: 1200;
	}

	.global-menu-trigger em{
		position: relative;
		margin: -0.1rem 0 0;
		padding: 0;
		width: 3rem;
		height: 0.2rem;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #333;
		cursor:pointer;
		outline: 0;
		transition: .2s;
		z-index: 1200;
	}

	.global-menu-trigger em:before,
	.global-menu-trigger em:after {  
		position: absolute;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #333;
		transition: .2s;
		content: "";
	}

	.global-menu-trigger em:before { transform: translateY(-0.9rem);}
	.global-menu-trigger em:after { transform: translateY(0.9rem);}
	.global-menu-trigger.active em { background-color: transparent;}
	.global-menu-trigger.active em:before { transform: rotate(45deg);}
	.global-menu-trigger.active em:after { transform: rotate(-45deg);}

	.menu-inner {
		position:fixed;
		z-index: 999;
		top:0;
		right: -120%;
		width:90%;
		height: 100%;
		background:#e6f5fa;
		transition: all 0.6s;
		
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-content: center;
		
	}	

} /*End max 1200*/

.global-menu-trigger strong {display: none;}

.close-menu span{ display: none;}

.menu-logo {display: none;}

.global-menu {
	display: flex;
	text-align: right;
	font-weight: bold;
	pointer-events: all;
}

.global-menu li a {
	display: block;
	padding: 4rem 2rem 0;
}

.global-menu .blue-frame {
	margin: 3rem 0 0 2rem;
}

.global-menu .blue-frame a {
	padding: 1rem 2rem 1rem;
	color: #fff;
}


@media screen and (max-width: 640px) {
	.global-menu-trigger {margin: 2rem 0 0;}
	
	#HEADER, .header-inner {height: 8rem;}
	
	#HEADER .head-logo {max-width: 23rem;}
	
	#CONTENTS {padding-top: 8rem;}
	
}


/*aside form-banner*/
.form-banner{opacity: 0;}

.page-top {opacity: 0;}