@charset "UTF-8";

/*全体共通*/
:root{ font-size: 10px; } 
*{ box-sizing: border-box; }
body {
	--max-width: 900px;
  --c-main: #007DC8;
  --c-base: #000;
  --c-accent: #000;
	--ff-main: "Noto Sans JP", sans-serif;
  /* --ff-main: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif; */
	--ff-mincho: "游明朝", YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", serif;
  --ff-en: "Barlow Semi Condensed", sans-serif;

  position: relative;
  width: 100%;
  overflow-x: hidden;
	font-family: var(--ff-main);
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.4;
  -webkit-text-size-adjust: 100%;
}
body.-fixed{
	position: fixed;
	left: 0;
	width: 100%;
	height: 100%;
}
@media screen and (max-width: 1440px) {
	:root{ font-size: .6944vw; }  /* 1440pxの時に 1rem=10px */
}
@media screen and (max-width: 752px) {
	:root{ font-size: 2.65vw; } /* 376pxの時に 1rem=10px */
}
a{
	display: inline-block;
	color: inherit;
	font-weight: inherit;
	transition: opacity .3s;
	cursor: pointer;
}
a:hover{
	opacity: .6;
}
img, svg{
  display: inline-block;
  max-width: 100%;
  vertical-align: bottom;
}
::before, ::after{
	box-sizing: border-box;
}

.--ff-en{ font-family: var(--ff-en); }
.--center{ text-align: center !important; }
.--nowrap{ white-space: nowrap; }

.--img-cover{ width: 100%; height: 100%; object-fit: cover; }
.--img-contain{ width: 100%; height: 100%; object-fit: contain; }

.--d-ib{ display: inline-block !important; }
.--d-n{ display: none !important; }

/* PC */
@media (min-width: 1025px){
	.--tab{ display: none !important; }
	.--sp{ display: none !important; }
	.--tab-sp{ display: none !important; }
}
/* TAB */
@media screen and (max-width: 1024px) and (min-width: 753px) {
	.--pc{ display: none !important; }
	.--sp{ display: none !important; }
	.--pc-sp{ display: none !important; }
}
/* SP */
@media screen and (max-width: 752px) {
	.--pc{ display: none !important; }
	.--tab{ display: none !important; }
	.--pc-tab{ display: none !important; }
}

/* 共通 */
.cntInner,
._Inner{
	width: 100%;
	margin: 0 auto;
}
._Inner{
	max-width: 1440px;
}

/* ローディング */
#loading{
	position: fixed;
	top: 0;
	left: 0;
	background: #fff;
	width: 100%;
	height: 100%;
	z-index: 999;
}

/* ヘッダー */
#header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 108px;
	/* background: linear-gradient(to bottom, #000, rgba(115, 115, 115, 0)); */
	z-index: 200;
}
#header .cntInner {
	display: flex;
	justify-content: space-between;
	gap: 0 3rem;
	background: linear-gradient(to bottom, #000, rgba(115, 115, 115, 0));
}
#header .cntImg-logo{
	margin-top: 14px;
	margin-left: 4rem;
	min-width: 109px;
}
#header .cntBox {
	display: flex;
	align-items: center;
	justify-content: right;
	margin-top: 27px;
	padding-right: 22px;
	height: fit-content;
	max-width: 750px;
	width: 100%;
}

#header .cntList {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	color: #fff;
	position: relative;
	gap: 0 8px;
	padding-right: 3rem;
	max-width: 515px;
	width: 100%;
}
#header .cntList .item {
	white-space: nowrap;
}
#header .cntList::after {
	position: absolute;
	content: "";
	width: 1px;
	height: 20px;
	background: #fff;
	top: calc(50% - 10px);
	right: 0;
}
#header .cntBtn-contact {
	display: block;
	font-size: 14px;
	color: #F6F6F6;
	margin: 0 2rem 0 3rem;
	white-space: nowrap;
}
#header .cntBtn-search {
	display: flex;
	align-items: center;
	width: 30px;
	height: 30px;
	padding: 5px;
	flex-shrink: 0;
}
#header .cntBtn-search .icon {
	width: 100%;
}
#header .cntBtn-lang {
	font-size: 14px;
	color: #fff;
	letter-spacing: .1em;
	padding-right: 18px;
	position: relative;
	margin-left: 2.2rem;
	cursor: pointer;
}
#header .cntBtn-lang::after {
	content: "";
	position: absolute;
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 5px 0px 5px;
	border-color: #fff transparent transparent transparent;
	top: 5px;
	right: 0;
}
@media screen and (max-width: 1024px){
	#header .cntImg-logo {
		margin-top: 11px;
		margin-left: 24px;
		min-width: auto;
		max-width: 130px;
	}
	#header .cntBox {
		margin-top: 0;
		padding-right: 0;
	}
}

@media screen and (max-width: 752px) {
	#header {
		height: 64px;
	}
	#header .cntImg-logo {
		min-width: auto;
		max-width: 109px;
	}
}

/* ============================================= header */
.header {
   position: fixed;
   z-index: 99;
   width: 100%;
   top: 0;
   right:0;
   left: 0;
	margin:auto;
	max-width:1440px;
   height: 10.8rem;
   background: linear-gradient(to bottom, #000, rgba(115, 115, 115, 0));
}
.header_logo {
   position: absolute;
   top: 1.5rem;
   display: grid;
   padding: 0 0 0 4.1rem;
}
.header_logo a {
   display: block;
   position: relative;
}
.header_logo a span {
   width: 20vw;
   max-width: 20rem;
   position: relative;
   display: block;
}
/* ------------------------------------- for sp */
@media screen and (max-width: 768px) {
   .header {
      height: 64px;
   }
   .header_logo {
      position: relative;
      top: 0;
      height: 64px;
      padding: 0;
   }
.header_logo a {
	  max-width:109px;
        margin-top: 11px;
        margin-left: 24px;}
   .header_logo a span {
      width: inherit;
	max-width:inherit;
   }
}

/* ============================================= global_navigation */
.global_navigation_show {
   overflow-y: hidden;
   position: fixed;
   z-index: 5;
}
.global_navigation {
   position: fixed;
   z-index: 20;
   top: 0;
   left: 0;
   width: 100%;
}
.global_navigation .external a span {
   display: inline-block;
   position: relative;
   padding-right: 1.8rem;
   background-repeat: no-repeat;
   background-position: 100% 50%;
   background-size: 1.2rem auto;
   background-image: url("../images/common/icon_external.svg");
}
.global_navigation a {
   text-decoration: none;
}
.global_navigation em,
.global_navigation i {
   font-style: normal;
}
.global_navigation li {
   list-style: none;
}
.global_navigation_menu {
   margin: 0;
}
#Global-Navigation-Check,
.global_navigation_menu input {
   display: none;
}
.global_navigation_parent {
   position: relative;
}
.global_navigation_parent label a {
   display: inline-block;
}
.global_navigation_child {
   position: absolute;
   width: auto;
   transition: 0.2s;
   display: grid;
   grid-template-rows: 0fr;
}
.global_navigation_child > div,
.global_navigation_child ul {
   overflow: hidden;
}
.global_navigation_child li a {
   line-height: 1.2;
   display: grid;
   align-items: center;
   width: fit-content;
}
.global_navigation_child li a span i {
   display: inline-block;
}
.global_navigation_child li:last-child {
   border: none;
}
/* ------------------------------------- humbergar */
.global_navigation_button {
   display: none;
}
/* ------------------------------------- search */
.global_navigation_search input[type="text"] {
   background-color: transparent;
   border: none;
   outline: none;
   line-height: 1;
   padding: 0 1rem;
   font-size: 1.4rem;
   color: #ffffff;
}
.global_navigation_search input[type="text"]::placeholder {
   color: rgba(255,255,255,0.5);
}

/* ------------------------------------- for sp */
@media screen and (max-width: 768px) {
   .global_navigation {
      transition: 0.3s;
      color: #ffffff;
      font-size: 1.6rem;
   }
   .global_navigation a {
      color: #ffffff;
      line-height: 1;
      position: relative;
   }
   .global_navigation .external a span {
      background-image: url("../images/common/icon_external_white.svg");
   }
   .global_navigation_wrapper {
      height: 0;
      overflow: hidden;
   }
   .global_navigation_menu {
      display: none;
      padding: 0 2.4rem;
      margin: 0 0 1rem;
   }
   .global_navigation_menu > li > a,
   .global_navigation_menu label {
      display: block;
      position: relative;
      padding: 1.2rem 1.2rem 1.2rem 1.9rem;
   }
   .global_navigation_parent {
      height: auto;
      width: 100%;
   }
   .global_navigation_child {
      position: relative;
      opacity: 1;
      top: 0;
      margin: 0 0 0 2rem;
      left: auto;
      width: auto;
   }
   .global_navigation_child p {
      font-size: 1.8rem;
      font-weight: bold;
      margin-bottom: 1rem;
   }
   .global_navigation_child p:not(:nth-of-type(1)) {
      margin: 2rem 0;      
   }
   .global_navigation_child ul {
      padding: 0;
      margin: 0 0 1rem;
      display: grid;
      gap: 2rem;
   }
   .global_navigation_child ul.f_center {
     margin: 0.5rem 0 1rem;
   }
   .global_navigation_child li a {
      grid-template-columns: 4rem auto;
      gap: 0 1.2rem;
   }
   .global_navigation_child li a > i {
      display: block;
      background-color: #ffffff;
   }
   #Global-Navigation-Check:checked ~ * .global_navigation_wrapper {
      position: fixed;
      overflow-y: scroll;
      overflow-x: hidden;
      width: 100%;
      height: 100dvh;
      background-color: #0068b6;
      transition: 0.3s;
      padding: 6.4rem 0 2.4rem;
   }
   #Global-Navigation-Check:checked ~ * .global_navigation_menu {
      display: block;
      opacity: 1;
   }
   #Global-Navigation-Check:checked ~ * .global_navigation_parent {
      max-height: inherit;
      overflow-y: visible;
   }
   #Global-Navigation-Check:checked ~ * .global_navigation_child {
      transition: 0.3s;
   }
   #Global-Navigation input[type="checkbox"]:checked ~ .global_navigation_child {
      grid-template-rows: 1fr;
   }
   .global_navigation_menu > li > a::before,
   .global_navigation_menu label::before {
      position: absolute;
      content: "";
      display: block;
      width: 0.8rem;
      aspect-ratio: 1 / 1;
      left: 0;
      top: calc(50% - 0.4rem);
      transform: rotate(45deg);
      transform-origin: 50% 50%;
      transition: 0.3s;
      border-right: 2px solid #ffffff;
      border-top: 2px solid #ffffff;
   }
   .global_navigation_menu input[type="checkbox"]:checked + label::before {
      transform: rotate(135deg);
   }
   /* ------------------------------------- humbergar */
   .global_navigation_button {
      display: block;
      position: fixed;
      top: 0;
      right: 0;
      z-index: 5;
   }
   .global_navigation_button span {
      display: block;
      width: 64px;
      height: 64px;
      background-color: #0068b6;
   }
   .global_navigation_button span i {
      display: block;
      overflow: hidden;
      width: 1px;
      height: 1px;
   }
   .global_navigation_button span i::before,
   .global_navigation_button span i::after,
   .global_navigation_button span::after {
      position: absolute;
      left: 20px;
      content:"";
      width: 26px;
      height: 2px;
      background-color: #FFF;
      transition: 0.3s;
   }
   /*  */
   .global_navigation_button span i::before {
      bottom:34px;
   }
   #Global-Navigation-Check:checked ~ .global_navigation label.global_navigation_button span i::before {
      top: 30px;
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
   }
   /*  */
   .global_navigation_button span::after {
      bottom: 20px;
   }
   #Global-Navigation-Check:checked ~ .global_navigation label.global_navigation_button > span::after {
      top:30px;
      transform: rotate(45deg);
      -webkit-transform: rotate(45deg);
   }
   /*  */
   .global_navigation_button span i::after {
      bottom:27px;
   }
   #Global-Navigation-Check:checked ~ .global_navigation label.global_navigation_button span i::after {
      display: none;
   }
   /* ------------------------------------- search */
   .global_navigation_search_icon {
      display: none;
   }
   .global_navigation_search {
      margin: 0 2.4rem 2.4rem;
      padding: 1.5rem 0;
      background-color: #005AA5;
   }
   .global_navigation_search p {
      display: grid;
      grid-template-columns: 4rem 1fr;
      align-items: center;
   }
   .global_navigation_search p i {
      display: block;
      height: 2rem;
      background-repeat: no-repeat;
      background-position: 56% 50%;
      background-size: 1.5rem auto;
      background-image: url("../images/common/icon_search_white.svg");
   }
   .global_navigation_search p span {
      border-left: 2px solid #ffffff;
   }
   .global_navigation_search p i.global_navigation_search_close {
      display: none;
   }
   
   
    .global_navigation_search div.search_outer {
      display: grid;
      grid-template-columns: 4rem 1fr;
      align-items: center;
   }
   .global_navigation_search div.search_outer i {
      display: block;
      height: 2rem;
      background-repeat: no-repeat;
      background-position: 56% 50%;
      background-size: 1.5rem auto;
      background-image: url("../images/common/icon_search_white.svg");
   }
   .global_navigation_search div.search_outer > div {
      border-left: 1px solid #ffffff;
   }
   .global_navigation_search div.search_outer i.global_navigation_search_close {
      display: none;
   }
	.global_navigation_search .mt-site-search input[type="search"] {
		width:100%;
		border:none;
		background:none;
		outline: none;
		line-height: 1;
		padding: 0 0 0.2rem 1rem;
		font-size: 1.4rem;
		color: #ffffff;
	}
	.global_navigation_search .mt-site-search input[type="search"]::placeholder {
	   color: rgba(255,255,255,0.5);
	}
	.global_navigation_search .mt-site-search button {
		display:none;
	}
   
   
   /* ------------------------------------- language */
   .global_navigation_language {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0 1rem;
      width: fit-content;
      margin: 0 2.4rem;
      padding: 0;
   }
   .global_navigation_language a,
   .global_navigation_language span {
      line-height: 1;
      display: block;
      padding: 1rem 1.5rem;
      border: 1px solid #ffffff;
   }
   .global_navigation_language span {
      opacity: 0.5;
   }
}
/* ------------------------------------- for tablet and PC */
@media screen and (min-width: 769px) {
   #Global-Navigation {
      position: relative;
      z-index: 99;
      display: flex;
      width: 46%;
      margin: 2.7rem 0 0 auto;
      align-items: start;
   }
   .global_navigation_menu > li {
      margin: 0 0.5rem;
   }
   .global_navigation_parent > label span,
   .global_navigation_menu > li > a {
      padding: 1.2rem 0.5rem;
      color: #ffffff;
      font-size: 1.4rem;
      font-weight: 500;
      line-height: 1;
      display: block;
   }
   .global_navigation_menu > li.global_navigation_parent {
      padding-bottom: 0;
   }
   .global_navigation_parent > label {
      margin-bottom: 6rem;
      margin-bottom: 0;
   }
   .global_navigation_home {
      display: none;
   }
   .global_navigation_wrapper {
      display: flex;
   }
   .global_navigation_menu {
      display: flex;
      justify-content: space-between;
      margin-right: 1rem;
   }
   .global_navigation_menu > li label span::after,
   .global_navigation_menu > li a::before,
   .global_navigation_menu > li a::after {
      content: "";
      display: block;
      position: absolute;
   }
   .global_navigation_menu > li label span, 
   .global_navigation_menu > li > a {
      position: relative;
   }
   .global_navigation_menu > li label span::after,
   .global_navigation_menu > li > a::before {
      bottom: 0;
      left: 0;
      width: 0;
      height: 3px;
      background-color: #007DC8;
      transition: 0.3s;
   }
   .global_navigation_menu > li label:hover span::after,
   .global_navigation_menu > li > a:hover::before {
      width: 100%;
   }
   .global_navigation_menu .current a::before,
   .global_navigation_menu .current a:hover::before {
      width: 100%;
      background-color: #9bcbe7;
   }
   .global_navigation_parent {
      flex-grow: 1;
      font-weight: 500;
      white-space: nowrap;
      text-align: center;
      position: unset;
   }
   .global_navigation_parent:last-child {
      border: unset;
   }
   .global_navigation_parent > a {
      transition: 0.3s;
   }
   .global_navigation_parent > a,
   .global_navigation_parent > label {
      display: block;
   }
   .global_navigation_parent > label:hover {
      cursor: pointer;
   }
   .global_navigation_child {
      overflow: hidden;
      position: absolute;
      margin: 0;
      right: 0.5rem;
      width: calc(100vw - 2rem);
      height: 0;
      text-align: left;
      z-index: 10;
      transition: 0.3s;
      opacity: 0;
      transform: translateY(1rem);
   }
   .global_navigation_parent:hover .global_navigation_child {
      position: absolute;
      grid-template-rows: 1fr;
      opacity: 1;
      transform: translateY(0);
      height: auto;
      padding: 10rem 1rem 1rem;
   }
   .global_navigation_child > div {
      position: relative;
      width: 100%;
      background-color: #ffffff;
      padding: 2rem;
      border-radius: 1.6rem;
      box-shadow: 0 0 2rem rgba(0,0,0,0.1);
   }
   .global_navigation_child p {
      color: #000000;
      font-size: 1.8rem;
      font-weight: bold;
      line-height: 1;
      margin-bottom: 1rem;
   }
   .global_navigation_child p:not(:nth-of-type(1)) {
      margin: 2rem 0 1rem;
   }
   .global_navigation_child ul {
      display: grid;
      grid-template-columns: 34% 32% 34%;
      gap: 1rem;
      padding: 0 0 0.9rem;
      margin: 0;
   }
   .global_navigation_child ul.f_center {
		display: grid;
		justify-content: center;
		grid-auto-flow: column;
		column-gap: 8rem;
		list-style: none;
		padding: 0;
		margin: 0 auto;
		grid-template-columns: auto;
   }
   .global_navigation_child li a {
      font-size: 1.4rem;
      grid-template-columns: 7rem 1fr;
      gap: 0 1rem;
      color: #000000;
   }
   .global_navigation_child li a span {
      position: relative;
      transition: 0.3s;
   }
   .global_navigation_child li a span::after {
      content: "";
      display: block;
      position: absolute;
      bottom: -0.8rem;
      left: 0;
      width: 0;
      height: 2px;
      background-color: #0068b6;
      transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
   }
   .global_navigation_child li a:hover span {
      opacity: 0.7;
      transform: translateY(-0.2rem);
      padding-bottom: 0.2rem;
   }
   .global_navigation_child li a:hover span::after {
      width: 100%;
   }
   .global_navigation_child li span i {
      display: block !important;
   }
   /* ------------------------------------- search */
   .global_navigation_search_icon {
      display: block;
      position: absolute;
      cursor: pointer;
      right: 4.6em;
      top: 0rem;
   }
   .global_navigation_search_icon.active {
      cursor: unset;
   }
   .global_navigation_search_icon i {
      width: 4.5rem;
      height: 4.5rem;
      display: block;
      background-repeat: no-repeat;
      background-position: 50% 40%;
      background-size: 1.83rem auto;
      background-image: url("../images/common/icon_search.svg");
      transition: 0.3s;
   }
   .global_navigation_search_icon.active i,
   .global_navigation_search_icon:hover i {
      filter: brightness(0.5) invert(1) saturate(0);
   }
   .global_navigation_search {
      position: absolute;
      top: 8.2rem;
      right: 0;
      background-color: #0068b6;
      z-index: 15;
      overflow: hidden;
      width: 0;
      transition: 0.3s;
   }
   .global_navigation_search.active {
      width: 33rem;
   }
   .global_navigation_search p {
      padding: 1.2rem;
      display: grid;
      grid-template-columns: 3rem 1fr 3rem;
      align-items: center;
   }
   .global_navigation_search p i {
      display: block;
   }
   .global_navigation_search p i:nth-of-type(1) {
      width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-position: 100% 50%;
      background-size: 2rem auto;
      background-image: url("../images/common/search_arrow.svg");
   }
   .global_navigation_search input[type="text"] {
      width: 22.5rem;
   }
   .global_navigation_search_close {
      cursor: pointer;
      height: 3rem;
      text-align: center;
      background-repeat: no-repeat;
      background-position: 50% 50%;
      background-size: 1.2rem;
      background-image: url("../images/common/search_close.svg");
   }
   
   
   
   .global_navigation_search div.search_outer {
      padding: 1.2rem;
      display: grid;
      grid-template-columns: 3rem 1fr 3rem;
      align-items: center;
   }
   .global_navigation_search div.search_outer i {
      display: block;
   }
   .global_navigation_search div.search_outer i:nth-of-type(1) {
      width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-position: 100% 50%;
      background-size: 2rem auto;
      background-image: url("../images/common/search_arrow.svg");
   }
   .global_navigation_search .mt-site-search {
      width: 22.5rem;
   }
	.global_navigation_search .mt-site-search input[type="search"] {
		width:100%;
		border:none;
		background:none;
		outline: none;
		line-height: 1;
		padding: 0 0 0.5rem 1rem;
		font-size: 1.4rem;
		color: #ffffff;
	}
	.global_navigation_search .mt-site-search input[type="search"]::placeholder {
	   color: rgba(255,255,255,0.5);
	}
	.global_navigation_search .mt-site-search button {
		display:none;
	}
   
   
   
   /* ------------------------------------- language */
   .global_navigation_language {
      position: absolute;
      top: 0.6rem;
      right: 2rem;
      height: 3rem;
      overflow: hidden;
      padding: 0;
      display: grid;
      text-align: left;
      font-size: 1.4rem;
   }
   .global_navigation_language::before {
      content: "";
      display: block;
      position: absolute;
      width: 1rem;
      aspect-ratio: 10 / 5;
      background-color: #ffffff;
      right: 0;
      top: calc(50% - 0.5rem);
      clip-path: polygon(0 0, 100% 0, 50% 100%);
      transition: 0.3s;
   }
   .global_navigation_language li {
      position: relative;
      margin: 0;
      width: 3.5rem;
      height: 3rem;
      display: grid;
      align-items: center;
      line-height: 1;
   }
   .global_navigation_language li a,
   .global_navigation_language li span {
      display: block;
      color: #ffffff;
      padding-bottom: 0.3rem;
   }
   .global_navigation_language li a {
      border-bottom: 1px solid #ffffff;
      opacity: 0;
      transition: 0.3s;
   }
   .global_navigation_language:hover .current {
      display: none;
   }
   .global_navigation_language:hover a {
      opacity: 1;
   }
   .global_navigation_language:hover::before {
      top: calc(50% - 0.2rem);
   }
}
/* ------------------------------------- for PC */
@media screen and (min-width: 1280px) {
   .global_navigation {
      padding-top: 0.7rem; /* add */
	width:fit-content!important;
   }
   .global_navigation_menu {
      margin-right: 0;
   }
   .global_navigation_menu > li {
      margin: 0 1rem;
   }
   .global_navigation_menu > li {
      padding-bottom: 4rem;
   }
   .global_navigation_parent > label span,
   .global_navigation_menu > li > a {
      padding: 1.2rem 1rem;
   }
   .global_navigation_menu > li.global_navigation_parent {
      padding-bottom: 0;
   }
/* ----
   .global_navigation_child {
      right: calc((100vw - 123.6rem) / 2);
      width: 123.6rem;
   }
---- */
   
   .global_navigation_child {
      right: calc(50% - 700px);
      width: 97%;
	position:fixed!important;
	max-width:1400px;
   }

@media screen and (max-width:1440px){
   .global_navigation_child {
      right: 1.5%;}
}


   .global_navigation_child > div {
      padding: 3rem 5rem;
   }
   
   .global_navigation_child div.g_inner {
		width:123.6rem;
		max-width:100%;
		margin:0 auto;
	}
   
   .global_navigation_child p {
      margin: 2rem 0;
   }
   .global_navigation_child p:not(:nth-of-type(1)) {
      margin: 2rem 0 1.5rem;
   }
   .global_navigation_child ul {
      grid-template-columns: repeat(4, 1fr);
      gap: 2rem 0;
   }
	.global_navigation_child ul.f_center {
		display: grid;
		justify-content: center;
		grid-auto-flow: column;
		column-gap: 8rem;
		list-style: none;
		padding: 0;
		margin: 0 auto;
		grid-template-columns: auto;
	}
   .global_navigation_menu > li:last-of-type {
      position: relative;
      margin-left: 3rem;
   }
   .global_navigation_menu > li:last-of-type a::before {
      width: 100%;
      height: 0;
      left: 0;
      top: -3.4rem;
      background-color: #0068b6;
      z-index: -1;
      transition: 0.3s;
   }
   .global_navigation_menu > li:last-of-type a:hover::before {
      height: 10.8rem;
   }
   .global_navigation_menu > li:last-of-type a::after {
      width: 2px;
      height: 2rem;
      left: -2rem;
      top: 1rem;
      background-color: #3a3a3a;
   }
   /* ------------------------------------- search */
   .global_navigation_search_icon {
      position: relative;
      right: unset;
      top: unset;
      height: 4.5rem;
   }
   .global_navigation_search {
      top: 8.2rem;
   }
   /* ------------------------------------- language */
   .global_navigation_language {
      position: relative;
      right: unset;
      top: unset;
      margin: 0.5rem 3rem 0 1rem;
   }
}




/* サイドナビ */
#side-nav{
	position: fixed;
	top: 180px;
	left: 0;
	display: flex;
	justify-content: flex-start;
	padding: 32px 3.2rem;
	z-index: 98;
	background-color: rgba(255, 255, 255, 0.95);
}
#side-nav .cntList{
	height: 100%;
	gap: 3.2rem 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: stretch;
}
#side-nav .item{
	display: block;
	width: 100%;
	padding-right: 2.7rem;
	line-height: 1;
	font-size: 16px;
	font-weight: 600;
	font-family: var(--ff-en);
	padding-bottom: 7px;
	position: relative;
}
#side-nav .item::before{
	position: absolute;
	content: "";
	width: 100%;
	height: 1px;
	bottom: 0;
	left: 0;
	background: #000;
}
#side-nav .item::after{
	position: absolute;
	content: "";
	width: 1px;
	height: 9px;
	transform-origin: bottom center;
	transform: rotate(-40deg);
	bottom: 0;
	right: 0;
	background: #000;
}
@media screen and (max-width: 752px) {
	#side-nav {
		top: 64px;
		left: 0;
		padding: 0;
		width: 100%;
		background: none;
	}
	#side-nav .cntList {
		width: 100%;
		gap: 0;
		flex-direction: row;
		justify-content: space-between;
	}
	#side-nav li {
		width: 100%;
	}
	#side-nav .item {
		height: 100%;
		padding: 10px 5px;
		text-align: center;
		color: #fff;
		border: 1px solid #B8B8B8;
		transition: background-color .3s;
		position: relative;
		background-color: rgba(0, 104, 182, 0.3);
	}
	#side-nav .item:hover{
		background-color: rgba(0, 104, 182, 0.6);
		opacity: 1;
	}
	#side-nav .item::before {
		display: none;
	}
	#side-nav .item::after {
		display: none;
	}
	
}

._Navbtn{
	position: relative;
	cursor: pointer;
	width: 64px;
	height: 64px;
	background: #0066CC;
}
._Navbtn span{
	position: absolute;
	content: "";
	left: 20px;
	display: inline-block;
	width: 24px;
	height: 2px;
	background: #fff;
	transition: all .5s;
}
._Navbtn span:nth-of-type(1){
	top: 25px;
}
._Navbtn span:nth-of-type(2){
	top: 50%;
	transform: translateY(-1px);
}
._Navbtn span:nth-of-type(3){
	bottom: 25px;
}
._Navbtn.active span:nth-of-type(1){
	transform: translateY(6px) rotate(45deg);
}
._Navbtn.active span:nth-of-type(2){
	opacity: 0;
}
._Navbtn.active span:nth-of-type(3){
	transform: translateY(-6px) rotate(-45deg);
}

/* スマホナビ */
#nav{
	display: none;
}

/* フッター */
#footer{
	position: relative;
	width: 100%;
	margin-top: -18.7rem;
	background: #F5F5F5;
	z-index: 90;
	max-width:1440px;
	margin-left:auto;
	margin-right:auto;
}
#footer .cntInner{
	max-width: 1380px;
	padding: 53px 30px 36px;
}
#footer .cntBox{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px 30px;
	margin-bottom: 40px;
}
#footer .cntBox-logo{
	display: flex;
	align-items: center;
}
#footer .cntBox-logo .logo-en{
	padding-right: 24px;
}
#footer .cntBox-logo .logo-en img{
	width: 160px;
}
#footer .cntBox-logo .logo-jp{
	padding-left: 24px;
	position: relative;
}
#footer .cntBox-logo .logo-jp::before{
	position: absolute;
	content: "";
	height: 50px;
	width: 1px;
	background: #B8B8B8;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
}
#footer .cntBox-logo .logo-jp img{
	display: block;
	width: 185px;
}
#footer .cntBox-list{
	display: flex;
	justify-content: right;
	gap: 4px 3.2rem;
}
#footer .cntBox-list .item{
	display: block;
	font-size: 14px;
	color: #000000;
	line-height: 1.7;
}
#copyright{
	display: block;
	font-size: 10px;
	color: #2F2F2F;
	line-height: 1.7;
}
/* SP */
@media screen and (max-width: 752px) {
	#footer{
		position: absolute;
		bottom: 0;
		left: 0;
		height: 21.3rem;
		margin-top: 0;
	}
	#footer .cntInner{
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 100%;
		padding: 0 2.4rem;
	}
	#footer .cntBox{
		row-gap: 1.2rem;
		margin-bottom: 1.2rem;
	}
	#footer .cntBox-logo{
		flex-direction: column;
		gap: 1.4rem 0;
	}
	#footer .cntBox-logo .logo-en{
		width: 16rem;
		height: 4rem;
		padding-right: 0;
	}
	#footer .cntBox-logo .logo-jp{
		width: 16rem;
		height: 1.7rem;
		padding-left: 0;
	}
	#footer .cntBox-logo .logo-jp::before{
		display: none;
	}
	#footer .cntBox-logo img{
		width: 100% !important;
		max-width: 100% !important;
		height: 100%;
		object-fit: contain;
		object-position: left;
	}
	#footer .cntBox-list{
		gap: .4rem 2.4rem;
		flex-direction: column;
		justify-content: flex-start;
	}
	#footer .cntBox-list .item{
		font-size: 1rem;
	}
	#copyright{
		font-size: 1rem;
	}
}

/* モーダル */
._Modal{
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  /* display: flex; */
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  padding: 50px;
  background: #00000080;
  z-index: 100;
}
._Modal .cntInner{
  position: relative;
  max-width: 850px;
  width: 100%;
  max-height: 575px;
  overflow: hidden;
  overflow-y: scroll;

  /* padding: 42px 64px 50px; */
  padding: 24px 64px 50px;
  background: #fff;
  z-index: 2;
}
._Modal.small .cntInner{
  max-width: 469px;
}
._Modal .cntBox{
  display: flex;
  align-items: center;
  height: 64px;
  /* margin-bottom: 25px; */
  margin-bottom: 7px;
  padding-left: 87px;
  position: relative;
}
._Modal .cntBox:not(:first-child){
  margin-top: 64px;
}
._Modal .cntBox .icon {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 110px;
  height: 110px;
  /* border: 5px solid var(--c-main); */
  border-radius: 50%;
  /* top: -18px; */
  top: 0;
  left: -40px;
  /* background: rgba(0, 125, 200, 0.1); */
  background: #E6F3FA;
  overflow: hidden;
}
._Modal .cntBox .icon::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 5px solid var(--c-main);
  z-index: 2;
}
._Modal .cntBox .title{
  font-size: 18px;
  font-weight: 700;
  line-height: 1.6;
  line-height: 1.2;
  color: #0068B6;
}
._Modal .cntList{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 5.6rem 4rem; 
}
.noimage .item .image {
    height:50px;
    aspect-ratio:inherit!important;
    background:inherit!important;
}
._Modal .cntList .image{
  margin-bottom: 20px;
/*  padding: 6.76% 8.82%;*/
  border-radius: 4px;
  background: linear-gradient(to bottom right, #F7F7F7, #C1C1C1);
  aspect-ratio: 340/250;
}
._Modal .cntList .image img{
  aspect-ratio: 280/205;
}
._Modal .cntList .title{
  display: inline-block;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.6;
  color: #000000;
  padding: 0 16px 8px 0;
  position: relative;
  margin-bottom: 10px;
}
._Modal .cntList .title::after{
  position: absolute;
  content: "";
  width: 100%;
  height: 8px;
  border-bottom: 1px solid var(--c-main);
  border-right: 1px solid var(--c-main);
  bottom: 0;
  left: 0;
}
._Modal .cntList .text{
  font-size: 16px;
  font-weight: 400;
  line-height: 1.85;
}
._Modal .cntList .btn{
  display: flex;
  gap: 0 10px;
  justify-content: center;
  margin-top: 16px;
  font-size: 14px;
  font-weight: 400;
  color: #4D4D4D;
  border: 1px solid #0066cc;
  border-radius: 7px;
  max-width: 256px;
  width: 100%;
  text-align: center;
  padding: 7px;
}
._Modal .cntList .btn:hover{
    background-color: #0066cc;
    color: #ffffff;
	opacity:1;
}

._Modal .cntList a:hover .arrow::before,
._Modal .cntList a:hover .arrow::after {
	background: #ffffff;
}

._Modal .cntList .arrow{
  width: 7px;
  display: block;
  position: relative;
}
._Modal .cntList .arrow::before,
._Modal .cntList .arrow::after{
  position: absolute;
  content: "";
  width: 10px;
  height: 2px;
  background: #4D4D4D;
  top: calc(50% - 1px);
  right: 0;
  transform-origin: center right;
}
._Modal .cntList .arrow::before{
  transform: rotate(-45deg);
}
._Modal .cntList .arrow::after{
  transform: rotate(45deg);
}
/*
._Modal .cntBox-btn{
  position: absolute;
  top: calc(50% + 288px);
  left: 50%;
  width: 100%;
  max-width: 950px;
  padding: 2.4rem 50px;
  transform: translateX(-50%);
}
*/
._Modal .cntBox-btn .btn{
  display: block;
  width: 40px;
  height: 40px;
  margin-left: auto;
  background: #B8B8B8;
  z-index: 2;
  cursor: pointer;
  font-size: 0;
}
._Modal .cntBox-btn .btn::before{
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2219%22%20height%3D%2219%22%20viewBox%3D%220%200%2019%2019%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cline%20x1%3D%221.12898%22%20y1%3D%220.707108%22%20x2%3D%2218.0995%22%20y2%3D%2217.6777%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%2F%3E%3Cline%20x1%3D%220.706956%22%20y1%3D%2217.6778%22%20x2%3D%2217.6775%22%20y2%3D%220.707249%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%2F%3E%3C%2Fsvg%3E') center/45% 45% no-repeat;
}
.item a[target="_blank"] span:before {
    display:none;
}
.item a[target="_blank"] span:after {
    width:12px!important;
    height:12px!important;
    background:url("../images/modal/newindow.png")!important;
    background-size:100% 100%!important;
    display:inline-block!important;
    position:relative;
    top:inherit!important;
    right:inherit!important;
    transform-origin: inherit;
    transform:none!important;
    margin:4px 0 0 0;
}
.item a[target="_blank"]:hover span:after {
    background:url("../images/modal/newindow_h.png")!important;
}
/*
._Modal.small .cntBox-btn {
	width:37.5%!important;
	min-width:469px;}

._Modal.noimage.small .cntBox-btn {
	top:calc(43% + 290px);
	max-width:569px;}

._Modal.small .cntBox-btn {
	max-width:569px;}
*/


@media screen and (max-width: 752px) {
  ._Modal{
    padding: 20px;
  }
  ._Modal .cntInner{
    padding-left: 30px;
    padding-right: 30px;
  }
  ._Modal .cntList{
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 40px 30px;
  }
  ._Modal .cntBox{
    margin-bottom: 0;
    padding-left: 80px;
  }
  ._Modal .cntBox:not(:first-child){
    margin-top: 40px;
  }
  ._Modal .cntBox .icon{
    width: 80px;
    height: 80px;
    left: -15px;
  }
  ._Modal .cntBox .icon::before{
    border-width: 3px;
  }
/*
  ._Modal .cntBox-btn{
    top: auto;
    bottom: 7.5%;
    padding: 2.4rem 20px;
    z-index: 2;
  }

._Modal.small .cntBox-btn {
	width:100%!important;
	min-width:inherit}
*/
}

/* 共通 / inview */
.js-modal-btn{
  background: none;
  border: none;
  opacity: 1;
  cursor: pointer;
  outline: none;
}
.js-modal-btn:hover .bubble{
  margin-bottom: 5px;
}

/* 共通 / inview */
.js-inview{
  transition: opacity .8s ease-out, transform .8s ease-out;
}
.js-inview.fadeup{
  opacity: 0;
  transform: translateY(16rem);
}
.js-inview.fadedown{
  opacity: 0;
  transform: translateY(-16rem);
}
.js-inview.faderight{
  opacity: 0;
  transform: translateX(-17.3rem);
}
.js-inview.fadeleft{
  opacity: 0;
  transform: translateX(17.3rem);
}
.js-inview.inview{
  opacity: 1;
  transform: none;
}
.js-inview .bubble{
  opacity: 0;
  transform: translateY(3rem);
  transition: opacity .2s 1s ease-out, transform .2s 1s ease-out, margin .2s ease-out 0s;
}
.js-inview.delay-0 .bubble{
  transition: opacity .2s .5s ease-out, transform .2s .5s ease-out, margin .2s ease-out 0s;
}
.js-inview.inview .bubble{
  opacity: 1;
  transform: none;
}
.js-inview .wipe{
  opacity: 0;
  transition: opacity .4s .5s ease-out;
}
.js-inview.delay-0 .wipe{
  transition-delay: 0s;
}
.js-inview.inview .wipe{
  opacity: 1;
  transform: none;
}

/* メイン / LP */
#lp{
  --width: 1440;
  --w-ratio: 14.40;
  --height: 8776;
  --h-ratio: 87.76;

  position: relative;
  max-width: 1440px;
  margin: 0 auto;
  overflow: hidden;
}
#lp .cntInner{
  position: relative;
  width: 100%;
  height: auto;
  padding-top: 609.4444%;
  padding-top: calc((var(--height)/1440)*100%);
  background: url(../images/illust/bg.jpg) top center/contain no-repeat;
  z-index: 2;
  overflow: hidden;
}
#lp .cntInner .arrow{
  position: fixed;
  top: 36.4rem;
  right: 2.883rem;
  width: 0;
  height: 0;
  border-style: solid;
  border-top: .7rem solid transparent;
  border-bottom: .7rem solid transparent;
  border-left: 1.6rem solid #ffffff;
  border-right: 0;
  z-index: 20;
}
#lp .cntInner .stars{
  position: absolute;
  left: 0;
  top: 2.18%;
  width: 100%;
  height: 80%;
  background: url(../images/illust/bg_stars.png) top center/contain no-repeat;
  z-index: -5;
}
#lp .cntInner .planet{
  position: absolute;
  z-index: -4;
}
#lp .cntInner .planet-1{
  top: calc(620%/var(--h-ratio));
  left: calc(204%/var(--w-ratio));
  width: calc(419%/var(--w-ratio));
  height: calc(419%/var(--h-ratio));
}
#lp .cntInner .planet-2{
  top: calc(941%/var(--h-ratio));
  left: calc(730%/var(--w-ratio));
  width: calc(589%/var(--w-ratio));
  height: calc(605%/var(--h-ratio));
}
#lp .cntInner .altitude{
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  /* background: url(../images/illust/bg-altitude-sp.jpg) top center/contain no-repeat; */
  z-index: -1;
  color: #fff;
  font-family: var(--ff-en);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: .03em;
  text-align: right;
}
#lp .cntInner .altitude span{
  position: absolute;
  right: 3.3rem;
  transform: translateY(20px);
  opacity: 0;
  transition: transform .8s ease-out, opacity .8s ease-out;
}
#lp .cntInner .altitude span.inview{
  transform: none;
  opacity: 1;
}
#lp .cntInner .altitude span:nth-child(1){ top: 83.9rem; }
#lp .cntInner .altitude span:nth-child(2){ top: 119.7rem; }
#lp .cntInner .altitude span:nth-child(3){ top: 191.1rem; }
#lp .cntInner .altitude span:nth-child(4){ top: 214.7rem; }
#lp .cntInner .altitude span:nth-child(5){ top: 262.6rem; }
#lp .cntInner .altitude span:nth-child(6){ top: 310.2rem; }
#lp .cntInner .altitude span:nth-child(7){ top: 342.7rem; }
#lp .cntInner .altitude span:nth-child(8){ top: 393.4rem; }
#lp .cntInner .altitude span:nth-child(9){ top: 406.1rem; }
#lp .cntInner .altitude span:nth-child(10){ top: 762.2rem; }
#lp .cntInner .altitude span:nth-child(11){ top: 840.8rem; }
#lp .cntBox-text{
  position: absolute;
  top: calc(208%/var(--h-ratio));
  left: 0;
  width: 100%;
  color: #fff;
  text-align: center;
}
#lp .cntBox-text .title{
  opacity: 0;
  transition: opacity .6s .6s ease-out;
  font-family: var(--ff-en);
  font-size: 10.9rem;
  font-weight: 600;
  line-height: 1.03;
  text-shadow: 0 0 6rem #000000b3;
}
#lp .cntBox-text.inview .title{
  opacity: 1;
}
#lp .cntBox-text .text{
  margin-top: 15px;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .3s 1.2s ease-out, transform .3s 1.2s ease-out;
  font-weight: bold;
  font-size: 3.8rem;
  line-height: 1.35;
  letter-spacing: .2em;
  text-shadow: 0 0 6rem #000000b3;
}
#lp .cntBox-text.inview .text{
  opacity: 1;
  transform: none;
}
#lp .cntBox{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  z-index: 2;
}
#lp .cntBox .elem{
  position: absolute;
  z-index: 10;
}
#lp .cntBox .elem img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
#lp .cntBox .bubble{
  position: absolute;
  left: 0;
  bottom: calc(100% + 1em);
  display: block;
  padding: 0 3.2rem 3px;
  background: #fff;
  color: #007DC8;
  font-size: 16px;
  font-weight: bold;
  line-height: 2.063;
  white-space: nowrap;
}
#lp .cntBox .bubble::before{
  content: "";
  position: absolute;
  top: 99%;
  left: calc(50% - 7px);
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 7px solid transparent;
  border-left: 7px solid transparent;
  border-top: 12.12px solid #ffffff;
  border-bottom: 0;
}
#lp .cntBox .wipe{
  position: absolute;
  top: 6%;
  left: 95%;
  width: 11rem;
  height: 11rem;
}
#lp .cntBox .wipe img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media screen and (max-width: 752px) {
  #lp{
    --width: 752;
    --w-ratio: 7.52;
    --height: 9826;
    --h-ratio: 98.26;
  }
  #lp .cntInner{
    padding-top: 1306.6489%;
    padding-top: calc((var(--height)/752)*100%);
    background-image: url(../images/illust/bg-sp.jpg);
  }
  #lp .cntInner .arrow{
    top: 30.58rem;
    /* top: 30.6rem; */
    right: .883rem;
  }
  #lp .cntInner .stars{
    top: 2.66%;
    background-image: url(../images/illust/bg_stars-sp.png);
  }
  #lp .cntInner .planet-1{
    top: 36.2rem;
    left: 3.1rem;
    width: 15.7rem;
    height: 15.7rem;
  }
  #lp .cntInner .planet-2{
    top: 55.9rem;
    left: 13.3rem;
    width: 21rem;
    height: 21.5rem;
  }
  #lp .cntInner .altitude span{
    right: 1.6rem;
    font-size: .8rem;
  }
  #lp .cntInner .altitude span:nth-child(1){ top: 42.6rem; top: 42.7rem; }
  #lp .cntInner .altitude span:nth-child(2){ top: 66.3rem; top: 66.6rem; }
  #lp .cntInner .altitude span:nth-child(3){ top: 90.2rem; top: 90.5rem; }
  #lp .cntInner .altitude span:nth-child(4){ top: 114.0rem; top: 114.4rem; }
  #lp .cntInner .altitude span:nth-child(5){ top: 137.7rem; top: 138.3rem; }
  #lp .cntInner .altitude span:nth-child(6){ top: 161.6rem; top: 162.2rem; }
  #lp .cntInner .altitude span:nth-child(7){ display: none; }
  #lp .cntInner .altitude span:nth-child(8){ top: 193.5rem; top: 194.3rem; }
  #lp .cntInner .altitude span:nth-child(9){ top: 198.8rem; top: 199.7rem; }
  #lp .cntInner .altitude span:nth-child(10){ top: 435.3rem; top: 436.9rem; }
  #lp .cntInner .altitude span:nth-child(11){ top: 459.5rem; top: 461.2rem; }
  #lp .cntBox-text{
    top: 13.4rem;
  }
  #lp .cntBox-text .title{
    font-size: 4.2rem;
  }
  #lp .cntBox-text .text{
    margin-top: 1.1rem;
    font-size: 1.4rem;
  }
  #lp .cntBox .bubble{
    padding: 0 16px 1px;
    /* font-size: 14px; */
    /* font-size: clamp(14px, 1.4rem, 1.4rem); */
    font-size: 1.4rem;
    /* bottom: calc(100% + 2rem); */
    bottom: 120%;
    line-height: 1.928;
  }
  #lp .cntBox .wipe{
    width: 6.6rem;
    height: 6.6rem;
  }
}

/* メイン / LP / 各パーツ */
#lp .cntBox#space{
  --top: 0;
}
#lp .cntBox#sky{
  --top: 2943%;
  top: calc(var(--top)/var(--h-ratio));
}
#lp .cntBox#deepsea{
  --top: 6549%;
  top: calc(var(--top)/var(--h-ratio));
}

/* メイン / LP / space */
#lp .cntBox .elem-1{
  top: calc(650%/var(--h-ratio));
  left: calc(362%/var(--w-ratio));
  width: calc(209%/var(--w-ratio));
  height: calc(179%/var(--h-ratio));
}
#lp .cntBox .elem-1 .bubble{
  left: auto;
  right: 0;
}
#lp .cntBox .elem-2{
  top: calc(1007%/var(--h-ratio));
  left: calc(939%/var(--w-ratio));
  width: calc(306%/var(--w-ratio));
  height: calc(177%/var(--h-ratio));
}
#lp .cntBox .elem-3{
  top: calc(2029%/var(--h-ratio));
  left: calc(719%/var(--w-ratio));
  width: calc(543%/var(--w-ratio));
  height: calc(320%/var(--h-ratio));
  transition-delay: .5s;
}
#lp .cntBox .elem-3 .bubble{
  left: 34%;
  bottom: calc(100% + 5rem);
}
#lp .cntBox .elem-4{
  top: calc(1806%/var(--h-ratio));
  left: calc(272%/var(--w-ratio));
  width: calc(373%/var(--w-ratio));
  height: calc(206%/var(--h-ratio));
}
#lp .cntBox .elem-4 .bubble{
  left: 20%;
}
#lp .cntBox .elem-6{
  top: calc(2537%/var(--h-ratio));
  left: calc(386%/var(--w-ratio));
  width: calc(300%/var(--w-ratio));
  height: calc(174%/var(--h-ratio));
}
#lp .cntBox .elem-6 .bubble{
  bottom: 100%;
  left: auto;
  right: 29%;
}
/* SP */
@media screen and (max-width: 752px) {
  #lp .cntBox .elem-1{
    top: 36rem;
    left: 6.7rem;
    width: 11.1rem;
    height: 9.5rem;
  }
  #lp .cntBox .elem-2{
    top: 55.9rem;
    left: 15.8rem;
    width: 15.5rem;
    height: 9rem;
  }
  #lp .cntBox .elem-3{
    top: 106.4rem;
    left: 5.9rem;
    width: 25.3rem;
    height: 14.9rem;
  }
  #lp .cntBox .elem-3 .bubble{
    left: 21%;
    bottom: 116%;
  }
  #lp .cntBox .elem-4{
    top: 83.6rem;
    left: 5.6rem;
    width: 17.2rem;
    height: 10.4rem;
  }
  #lp .cntBox .elem-4 .bubble{
    left: 2%;
    bottom: 123%;
  }
  #lp .cntBox .elem-6{
    top: 133.4rem;
    left: 11.1rem;
    width: 15.4rem;
    height: 9rem;
  }
  #lp .cntBox .elem-6 .bubble{
    bottom: 113%;
    right: 24%;
  }
}

/* メイン / LP / sky & ground */
#lp .cntBox .elem-7{
  top: calc((3001% - var(--top))/var(--h-ratio));
  left: calc(200%/var(--w-ratio));
  width: calc(466%/var(--w-ratio));
  height: calc(150%/var(--h-ratio));
}
#lp .cntBox .elem-7 .bubble{
  left: 44%;
  bottom: 82%;
}
#lp .cntBox .elem-8{
  top: calc((3206% - var(--top))/var(--h-ratio));
  left: calc(963%/var(--w-ratio));
  width: calc(248%/var(--w-ratio));
  height: calc(73%/var(--h-ratio));
  /* transition-delay: .5s; */
}
#lp .cntBox .elem-8 .bubble{
  left: 5%;
}
#lp .cntBox .elem-9{
  top: calc((3871% - var(--top))/var(--h-ratio));
  left: calc(417%/var(--w-ratio));
  width: calc(209%/var(--w-ratio));
  height: calc(117%/var(--h-ratio));
}
#lp .cntBox .elem-9 .bubble{
  left: auto;
  right: -5%;
}
#lp .cntBox .elem-10{
  top: calc((3654% - var(--top))/var(--h-ratio));
  left: calc(822%/var(--w-ratio));
  width: calc(242%/var(--w-ratio));
  height: calc(291%/var(--h-ratio));
}
#lp .cntBox .elem-10 .bubble{
  left: auto;
  right: 10%;
}
#lp .cntBox .elem-11{
  top: calc((4242% - var(--top))/var(--h-ratio));
  left: calc(223%/var(--w-ratio));
  width: calc(290%/var(--w-ratio));
  height: calc(237%/var(--h-ratio));
}
#lp .cntBox .elem-11 .bubble{
  left: auto;
  right: 21%;
}
#lp .cntBox .elem-12{
  top: calc((4237% - var(--top))/var(--h-ratio));
  left: calc(793%/var(--w-ratio));
  width: calc(505%/var(--w-ratio));
  height: calc(350%/var(--h-ratio));
}
#lp .cntBox .elem-12 .bubble{
  bottom: calc(100% + 3rem);
  left: auto;
  right: 15%;
}
#lp .cntBox .elem-12 .wipe{
  top: 12%;
  left: 83%;
}
#lp .cntBox .elem-13{
  top: calc((5091% - var(--top))/var(--h-ratio));
  left: calc(850%/var(--w-ratio));
  width: calc(495%/var(--w-ratio));
  height: calc(234%/var(--h-ratio));
}
#lp .cntBox .elem-13 .bubble{
  left: 33%;
  bottom: 110%;
}
#lp .cntBox .elem-13 .wipe{
  top: -6%;
  left: 77%;
}
#lp .cntBox .elem-14{
  top: calc((4581% - var(--top))/var(--h-ratio));
  left: calc(191%/var(--w-ratio));
  width: calc(491%/var(--w-ratio));
  height: calc(370%/var(--h-ratio));
}
#lp .cntBox .elem-14 .bubble{
  bottom: 75%;
  left: auto;
  right: 12%;
}
#lp .cntBox .elem-14 .wipe{
  top: 45%;
  left: 90%;  
}
#lp .cntBox .elem-15{
  top: calc((4886% - var(--top))/var(--h-ratio));
  left: calc(-71%/var(--w-ratio));
  width: calc(1107%/var(--w-ratio));
  height: calc(57%/var(--h-ratio));
  z-index: -1;
}
#lp .cntBox .elem-15 .bubble{
  bottom: 165%;
  left: auto;
  right: 7%;
}
#lp .cntBox .elem-16{
  top: calc((5166% - var(--top))/var(--h-ratio));
  left: calc(269%/var(--w-ratio));
  width: calc(269%/var(--w-ratio));
  height: calc(93%/var(--h-ratio));
}
#lp .cntBox .elem-16 .bubble{
  left: 12%;
  bottom: 140%;
}
#lp .cntBox .elem-17{
  top: calc((5448% - var(--top))/var(--h-ratio));
  left: calc(258%/var(--w-ratio));
  width: calc(378%/var(--w-ratio));
  height: calc(131%/var(--h-ratio));
}
#lp .cntBox .elem-17 .bubble{
  left: auto;
  right: 16%;
  bottom: 100%;
}
#lp .cntBox .elem-18{
  top: calc((5564% - var(--top))/var(--h-ratio));
  left: calc(860%/var(--w-ratio));
  width: calc(424%/var(--w-ratio));
  height: calc(220%/var(--h-ratio));
}
#lp .cntBox .elem-18 .bubble{
  left: auto;
  right: 38%;
  bottom: 103%;
}
#lp .cntBox .elem-18 .wipe-18-1{
  top: -14%;
  left: 83%;
}
#lp .cntBox .elem-18 .wipe-18-2{
  top: 39%;
  left: 83%;
}
#lp .cntBox .elem-20{
  top: calc((5931% - var(--top))/var(--h-ratio));
  left: calc(919%/var(--w-ratio));
  width: calc(390%/var(--w-ratio));
  height: calc(181%/var(--h-ratio));
}
#lp .cntBox .elem-20 .bubble{
  left: auto;
  right: 11%;
  bottom: 118%;
}
#lp .cntBox .elem-21{
  top: calc((6088% - var(--top))/var(--h-ratio));
  left: calc(259%/var(--w-ratio));
  width: calc(411%/var(--w-ratio));
  height: calc(488%/var(--h-ratio));
}
#lp .cntBox .elem-21 .bubble{
  left: auto;
  right: 41%;
  bottom: 88%;
}
#lp .cntBox .elem-22{
  top: calc((6346% - var(--top))/var(--h-ratio));
  left: calc(823%/var(--w-ratio));
  width: calc(431%/var(--w-ratio));
  height: calc(315%/var(--h-ratio));
}
#lp .cntBox .elem-22 .bubble{
  left: 54%;
  bottom: 89%;
}
/* SP */
@media screen and (max-width: 752px) {
  #lp .cntBox#sky{
    top: 145rem;
  }
  #lp .cntBox .elem-7{
    top: 9.3rem;
    left: 3.7rem;
    width: 19.6rem;
    height: 6.3rem;
  }
  #lp .cntBox .elem-7 .bubble{
    left: 41%;
    bottom: 100%;
  }
  #lp .cntBox .elem-8{
    top: 21.5rem;
    left: 19.3rem;
    width: 12.5rem;
    height: 3.7rem;
  }
  #lp .cntBox .elem-8 .bubble{
    left: calc(50% - 83px);
    bottom: 149%;
  }
  #lp .cntBox .elem-9{
    top: 49.2rem;
    left: 5.1rem;
    width: 10.3rem;
    height: 5.8rem;
  }
  #lp .cntBox .elem-9 .bubble{
    bottom: 148%;
    right: calc(50% - 5.9rem);
  }
  #lp .cntBox .elem-10{
    top: 38.2rem;
    left: 18.7rem;
    width: 9.8rem;
    height: 11.8rem;
  }
  #lp .cntBox .elem-10 .bubble{
    right: 10%;
  }
  #lp .cntBox .elem-11{
    top: 64rem;
    left: 3.2rem;
    width: 15.3rem;
    height: 12.5rem;
  }
  #lp .cntBox .elem-11 .bubble{
    right: 20%;
    bottom: 110%;
  }
  #lp .cntBox .elem-11 .wipe{
    top: 10%;
    left: 97%;
  }
  #lp .cntBox .elem-12{
    top: 77.9rem;
    left: 14rem;
    width: 20.6rem;
    height: 14.3rem;
  }
  #lp .cntBox .elem-12 .bubble{
    bottom: 117%;
    right: 10%;
  }
  #lp .cntBox .elem-12 .wipe{
    top: 16%;
    left: 73%;
  }
  #lp .cntBox .elem-13{
    top: 120.3rem;
    left: 13.2rem;
    width: 19.9rem;
    height: 8.1rem;
  }
  #lp .cntBox .elem-13 .bubble{
    left: 25%;
    bottom: 135%;
  }
  #lp .cntBox .elem-13 .wipe{
    top: -47%;
    left: 73%;
  }
  #lp .cntBox .elem-14{
    top: 96rem;
    left: -3.2rem;
    width: 21rem;
    height: 15.8rem;
  }
  #lp .cntBox .elem-14 .bubble{
    bottom: 90%;
    right: 11%;
  }
  #lp .cntBox .elem-14 .wipe{
    top: 36%;
    left: 95%;  
  }
  #lp .cntBox .elem-15{
    top: 109.9rem;
    left: -12.6rem;
    width: 47.4rem;
    height: 2.4rem;
  }
  #lp .cntBox .elem-15 .bubble{
    bottom: 225%;
    right: 4%;
  }
  #lp .cntBox .elem-16{
    top: 135.6rem;
    left: 2.4rem;
    width: 16.8rem;
    height: 5.8rem;
  }
  #lp .cntBox .elem-16 .bubble{
    left: 4%;
    bottom: 144%;
  }
  #lp .cntBox .elem-17{
    top: 147rem;
    left: 10.4rem;
    width: 23.2rem;
    height: 8.1rem;
  }
  #lp .cntBox .elem-17 .bubble{
    right: 12%;
    bottom: 105%;
  }
  #lp .cntBox .elem-18{
    top: 163.2rem;
    left: 5.1rem;
    width: 24.9rem;
    height: 12.8rem;
  }
  #lp .cntBox .elem-18 .bubble{
    right: 31%;
    bottom: 116%;
  }
  #lp .cntBox .elem-18 .wipe-18-1{
    top: -12%;
    left: 86%;
  }
  #lp .cntBox .elem-18 .wipe-18-2{
    top: 43%;
    left: 86%;
  }
  #lp .cntBox .elem-20{
    top: 188.5rem;
    left: 17.3rem;
    width: 17rem;
    height: 7.9rem;
  }
  #lp .cntBox .elem-20 .bubble{
    right: 7%;
    bottom: 124%;
    bottom: calc(100% + 19px);
  }
  #lp .cntBox .elem-21{
    top: 199.4rem;
    left: 4.7rem;
    width: 17rem;
    height: 20.2rem;
  }
  #lp .cntBox .elem-21 .bubble{
    right: 29%;
    bottom: 94%;
  }
  #lp .cntBox .elem-22{
    top: 218.7rem;
    left: 16.2rem;
    width: 16.6rem;
    height: 12.1rem;
  }
  #lp .cntBox .elem-22 .bubble{
    left: 35%;
    bottom: 109%;
  }
}

/* メイン / LP / deep sea */
#lp .cntBox .elem-23{
  top: calc((6711% - var(--top))/var(--h-ratio));
  left: calc(238%/var(--w-ratio));
  width: calc(674%/var(--w-ratio));
  height: calc(295%/var(--h-ratio));
}
#lp .cntBox .elem-23 .bubble{
  left: auto;
  right: 28%;
  bottom: 87%;
}
#lp .cntBox .elem-25{
  top: calc((7144% - var(--top))/var(--h-ratio));
  left: calc(234%/var(--w-ratio));
  width: calc(321%/var(--w-ratio));
  height: calc(171%/var(--h-ratio));
}
#lp .cntBox .elem-25 .bubble{
  left: 26%;
  bottom: 113%;
}
#lp .cntBox .elem-26{
  top: calc((7133% - var(--top))/var(--h-ratio));
  left: calc(1095%/var(--w-ratio));
  width: calc(456%/var(--w-ratio));
  height: calc(160%/var(--h-ratio));
}
#lp .cntBox .elem-26 .bubble{
  left: 22%;
  bottom: 122%;
}
#lp .cntBox .elem-27{
  top: calc((8288% - var(--top))/var(--h-ratio));
  left: calc(146%/var(--w-ratio));
  width: calc(261%/var(--w-ratio));
  height: calc(114%/var(--h-ratio));
}
#lp .cntBox .elem-27 .bubble{
  left: auto;
  right: 18%;
  bottom: 125%;
}
#lp .cntBox .elem-28{
  top: calc((7569% - var(--top))/var(--h-ratio));
  left: calc(1038%/var(--w-ratio));
  width: calc(226%/var(--w-ratio));
  height: calc(192%/var(--h-ratio));
}
#lp .cntBox .elem-28 .bubble{
  left: calc(32% - 20px);
  bottom: 117%;
}
/* SP */
@media screen and (max-width: 752px) {
  #lp .cntBox#deepsea{
    top: 373rem;
  }

  #lp .cntBox .elem-23{
    top: 8.1rem;
    left: 9rem;
    width: 24rem;
    height: 10.9rem;
  }
  #lp .cntBox .elem-23 .bubble{
    right: 43%;
    bottom: calc(100% - 5px);
  }
  #lp .cntBox .elem-25{
    top: 24.9rem;
    left: 7.7rem;
    width: 12.4rem;
    height: 6.6rem;
  }
  #lp .cntBox .elem-25 .bubble{
    left: 41%;
    bottom: 118%;
  }
  #lp .cntBox .elem-26{
    top: 46.9rem;
    left: 22.7rem;
    width: 19.8rem;
    height: 7rem;
  }
  #lp .cntBox .elem-26 .bubble{
    left: 13%;
    bottom: 132%;
  }
  #lp .cntBox .elem-27{
    top: 83.8rem;
    left: 2.8rem;
    width: 13.3rem;
    height: 5.8rem;
  }
  #lp .cntBox .elem-27 .bubble{
    right: calc(50% - 5.6rem);
    bottom: 150%;
  }
  #lp .cntBox .elem-28{
    top: 63.2rem;
    left: 22.8rem;
    width: 11rem;
    height: 9.3rem;
  }
  #lp .cntBox .elem-28 .bubble{
    left: calc(30% - 13px);
    bottom: 125%;
  }
}

/* メイン / LP / 雲 */
#lp .cntBox .cloud-1{
  top: calc((3456% - var(--top))/var(--h-ratio));
  left: calc(798%/var(--w-ratio));
  width: calc(651%/var(--w-ratio));
  height: calc(228%/var(--h-ratio));
  transition-duration: 1.2s;
}
#lp .cntBox .cloud-2{
  top: calc((3282% - var(--top))/var(--h-ratio));
  left: calc(-140%/var(--w-ratio));
  width: calc(772%/var(--w-ratio));
  height: calc(228%/var(--h-ratio));
  transition-duration: 1.2s;
}
#lp .cntBox .cloud-3{
  top: calc((2908% - var(--top))/var(--h-ratio));
  left: calc(945%/var(--w-ratio));
  width: calc(363%/var(--w-ratio));
  height: calc(192%/var(--h-ratio));
  transition-duration: 1.2s;
}
#lp .cntBox .cloud-4{
  top: calc((3665% - var(--top))/var(--h-ratio));
  left: calc(-100%/var(--w-ratio));
  width: calc(387%/var(--w-ratio));
  height: calc(226%/var(--h-ratio));
  transition-duration: 1.2s;
}
/* SP */
@media screen and (max-width: 752px) {
  #lp .cntBox .cloud-1{
    top: 36.1rem;
    left: 15.7rem;
    width: 22.7rem;
    height: 7.9rem;
  }
  #lp .cntBox .cloud-2{
    top: 19.4rem;
    left: -4.9rem;
    width: 27rem;
    height: 8rem;
  }
  #lp .cntBox .cloud-3{
    top: 5rem;
    left: 26.4rem;
    width: 12.7rem;
    height: 6.7rem;
  }
  #lp .cntBox .cloud-4{
    top: 38.1rem;
    left: -4rem;
    width: 13.5rem;
    height: 9.3rem;
  }
.forpc {display:none!important;}
}


@media screen and (min-width: 753px) {
	.forsp {display:none!important;}
}
/* 1440以降 */
@media screen and (min-width: 1440px) {
	#lp .cntInner .arrow {
	right:calc(50vw - 720px + 2.883rem);}
}