/* ===================================
html base style
=================================== */
html {
	font-size: 1vw;
	-webkit-text-size-adjust:100%;
}
@media screen and (max-width:1280px){
	html {
		font-size:1vw;
		-webkit-text-size-adjust:100%;
	}
}

@media screen and (max-width:991px){
	html {
		font-size: 1.5vw;
		-webkit-text-size-adjust:100%;
	}
}

@media screen and (max-width:540px){
	html {
		font-size: 4vw;
		-webkit-text-size-adjust:100%;
	}
}

body {
  font-family: "Noto Sans JP", sans-serif;
  	font-weight: 500;
    line-height: 2.3;
    letter-spacing:1px;
    width: 100%;
    height: 100%;
    margin:0;
    padding:0;
    box-sizing: border-box;
	font-optical-sizing: auto;
  color: #484848;
}

@media screen and (max-width:540px) {
	body {
    font-family: "Noto Sans JP", sans-serif;
  	font-weight: 600;
		text-align:left;
		line-height: 2;
    letter-spacing: 0px;
		width: 100%;
		height: 100%;
		margin:0;
		padding:0;
		box-sizing: border-box;
		font-optical-sizing: auto;
    /* ステータスバーの下からコンテンツを開始させる */
    min-height: 100dvh; 
    padding-top: env(safe-area-inset-top);
	}
}


/*
* {
  border: 1px solid #f00;
}


.row>div {
  padding: 0;
}
*/

*:focus-visible {
  outline: none;
  box-shadow: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  /*
  -webkit-text-fill-color: inherit !important;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  transition: background-color 9999s ease-in-out 0s;*/
  -webkit-text-fill-color: inherit;
  -webkit-box-shadow: 0 0 0 1000px var(--input-bg) inset;
  box-shadow: 0 0 0 1000px var(--input-bg) inset;
  caret-color: inherit;
  border: 1px solid var(--input-border);
  transition: background-color 9999s ease-in-out 0s;
}

a {
  /* リンクの引きずり出し（ドラッグ）を禁止 */
  -webkit-user-drag: none;
  /* テキスト選択を禁止（クリック時の誤作動防止） */
  user-select: none;
  -webkit-user-select: none;
  /* 前回の対策も合わせて入れておく */
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}
a:active::after {
  display: none
}



@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&display=swap');

html{
    scroll-behavior: smooth;
}
.container-fluid {
	padding: 0;
}
.padding00 {
  padding: 0;
}
ul {
    list-style: none;
}

a {
    	color: #505050;
    text-decoration: none;
    transition: 0.3s ease-in-out;
    font-size: 0.8rem;
}
a:hover {
    color: #164499;
    text-decoration: none;
    transition: 0.3s ease-in-out;
}

h1 {
	font-size: 2.2rem;
}

h2 {
	font-size: 2.5rem;
}

h3 {
	font-size: 2rem;
}
p {
	margin-bottom: 0;
	font-size: 1rem;
}
p.page_title {
  font-size: 2.5rem;
  line-height: 1.5;
}
h2.page_title {
  font-size: 2.5rem;
  line-height: 1.5;
}
p.comment {
  font-size: 2.5rem;
  line-height: 1.5;
}
p.subtitle_p {
  font-size: 2.9rem;
}
.small_font {
  font-size: 0.7rem;
}
th,td {
  font-size: 0.9rem;
}
li {
  font-size: 0.9rem;
}
.big_font {
  font-size: 1.5rem;
}
figcaption {
  margin-top: 0.2rem;
}
.color_bu {
  color: #0051BF;
}






@media screen and (max-width:1280px) {
  p {
    margin-bottom: 0;
    font-size: 1rem;
  }
  a {
    font-size: 1rem;
  }
  li {
    font-size: 1rem;
  }
  th,td {
    font-size: 1rem;
  }
}

@media screen and (max-width:991px) {
  h2 {
    font-size: 3rem;
    font-weight: 400;
  }
  p.page_title {
    font-size: 2.2rem;
    line-height: 1.5;
  }
  h2.page_title {
    font-size: 2.2rem;
    line-height: 1.5;
  }
  p.subtitle_p {
    font-size: 2.5rem;
    letter-spacing: -3px;
  }
  p.comment {
    font-size: 2rem;
    line-height: 1.5;
  }
  .big_font {
    font-size: 1.8rem;
  }
}

@media screen and (max-width:540px) {
  h2 {
    font-size: 3.3rem;
    font-weight: 400;
  }
  p.page_title {
    font-size: 2rem;
    line-height: 1.5;
  }
  h2.page_title {
    font-size: 2rem;
    line-height: 1.5;
  }
  p.subtitle_p {
    font-size: 2.8rem;
  }
  p {
    margin-bottom: 0;
    font-size: 1rem;
  }
  a {
    font-size: 1rem;
  }
  li {
    font-size: 1rem;
  }
  th,td {
    font-size: 1rem;
  }
}



/** google font **/
.noto-serif {
  font-family: "Noto Serif JP", serif;
  font-weight: 400;
  font-optical-sizing: auto;
  font-style: normal;
}
.jost {
  font-family: "Jost", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 500;
}
.zen_kaku {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  font-style: normal;
}
/** google font **/

/**adobe fonts**/
.minerva {
  font-family: "minerva-modern", sans-serif;
  font-weight: bold;
  font-style: normal;
}
.din {
  font-family: "din-condensed", sans-serif;
  font-weight: 400;
}
.din_bold {
  font-family: "din-condensed-variable", sans-serif;
  font-variation-settings: "wght" 600;
}


/**adobe fonts**/

img {
	width: 100%;
  height: auto;
  align-self: flex-start;
}
.img_rabius {
  border-radius: 10px;
}
.img_shadow {
  box-shadow: 0px 3px 6px #D6D6D6;
}
.title_img_zone {
  box-shadow: none !important;
}
.bg_color {
  background-color: #F6F6F6;
  padding-top: 3.5rem;
}
iframe {
  filter: grayscale(100%);
  border-radius: 10px;
}
table {
  width: 100%;
}
table tr {
  font-size: 0.9rem;
}
@media screen and (max-width:1080px) {

}

@media screen and (max-width:991px) {

}

@media screen and (max-width:540px) {

}



.wrap {
	margin: auto;
}
.margin_230 {
  margin: auto;
  margin-top: 11.5rem;
}
.padding_230 {
  padding-top: 11.5rem;
}
.margin_200 {
  margin: auto;
  margin-top: 10rem;
}
.margin_130 {
  margin: auto;
  margin-top: 6.5rem;
}
.margin_100 {
    margin: auto;
    margin-top: 5rem;
}
.margin_70 {
  margin: auto;
  margin-top: 3.5rem;
}
.inner_margin {
	margin: auto;
	margin-top: 2rem;
}
.margin_right00 {
  margin-right: 0;
}



@media screen and (max-width:991px) {
  .margin_230 {
    margin: auto;
    margin-top: 7rem;
  }
  .margin_200 {
    margin: auto;
    margin-top: 5rem;
  }
	.margin_130 {
    margin: auto;
    margin-top: 3.5rem;
  }
  .margin_100 {
    margin: auto;
    margin-top: 3.5rem;
  }
  .margin_70 {
    margin: auto;
    margin-top: 3.5rem;
  }
	.inner_margin {
		margin: auto;
		margin-top: 3.5rem;
	}
  .margin_right00 {
    margin-right: auto;
  }
  
}


@media screen and (max-width:540px) {
  .padding_230 {
    padding-top: 9.5rem;
  }
}



/**reponsive**/
.res_991 {
	display: none !important;
}
.res_540 {
	display: none !important;
}
.res_1280 {
	display: none !important;
}
.tab_991 {
  display: none !important;
}
@media screen and (max-width:1280px) {
	.pc_1280 {
		display: none !important;
	}
	.res_1280 {
		display: block !important;
	}
}
@media screen and (max-width:991px) {
  .tab_991 {
    display: block !important;
  }
	.pc_991 {
		display: none !important;
	}
	.res_991 {
		display: block !important;
	}
	
}
@media screen and (max-width:540px) {
  .tab_991 {
    display: none !important;
  }
	.pc_540 {
		display: none !important;
	}
	.res_540 {
		display: block !important;
	}
	.res_padding_top {
        padding-top: 40px !important;
    }
    .res_margin00 {
        margin-top: 0 !important;
    }
}




/**=================
header
==================**/
header {
  background-color: #092354;
  position: fixed;
  top: 0;
  z-index: 999;
}
.navbar-brand {
  width: 2.5rem;
  height: auto;
  margin-left: 2.5rem;
}
.navbar-expand-lg .navbar-collapse {
  display: flex;
  justify-content: end;
}
header .navbar-expand-lg .navbar-nav {
  flex-direction: row;
  padding: 0.2rem 2rem;
  line-height: 1.2; 
}
header .navbar-expand-lg .navbar-nav .nav-item {
  /*padding: 0.3rem 1.5rem;*/
  padding: 0.3rem 1.5rem 0.5rem 1.5rem ;
  margin: auto;

}

header .navbar-expand-lg .navbar-nav .nav-link {
  padding: 0.5rem 0;
  transition: 0.5s;
  color: #fff;
  font-size: 0.7rem;
  line-height: 2;
}
header .navbar-collapse .entry {
  background-color: #0066B9;
  border-radius: 5px;
  text-align: center;
  padding-top: 0.3rem 0;
  margin-left: 0.5rem !important;
  transition: ease .2s;
  position: relative;
  overflow: hidden;
}
header .navbar-collapse .entry:hover a {
  color: #0066B9;
  transition: 0.5s;
  z-index: 3;
  font-weight: 600;
}
header .navbar-collapse .entry a {
  padding: 0.1rem 0.3rem !important;
}
header .navbar-collapse .entry a::after {
  display: none;
}
header .navbar-collapse .entry span.small_font {
  font-size: 0.6rem;
}
header .navbar-collapse .entry span{
  line-height: 1;
  height: fit-content;
  display: block;
}

/*== 背景が流れる（左から右） */
.bgleft:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
   /*色や形状*/
  background:#fff;/*背景色*/
  width: 100%;
 height: 100%;
 border-radius: 5px;
   /*アニメーション*/
  transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
  transform: scale(0, 1);
 transform-origin: right top;
}

/*hoverした際の形状*/
.bgleft:hover:before{
 transform-origin:left top;
 transform:scale(1, 1);
}


.hover-border li a{
  position: relative;
}

.hover-border li a::after {
  content: '';
  /*絶対配置で線の位置を決める*/
  position: absolute;
  top: initial;
  bottom: 0;
  left: 0%;
  right: 0;
  margin: auto;
  /*線の形状*/
  width: 100%;
  height: 1px !important;
  background:#fff;
  /*アニメーションの指定*/
  transition: all .3s;
  transform: scale(0, 1);/*X方向0、Y方向1*/
  transform-origin: left top;/*左上基点*/
}

/*現在地とhoverの設定*/
.hover-border li.current a::after,
.hover-border li a:hover::after {
  transform: scale(1, 1);/*X方向にスケール拡大*/
}
.dropdown-toggle::after {
  border-top: none;
}



@media screen and (max-width:991px) {
  /*header {
    background: none;
  }*/
  .navbar-brand {
    display: inline-block;
    width: 12rem;
    height: auto;
    margin-left: 1.5rem;
    padding: 0;
    padding-top: 5px;
  }

header .btn_section {
  display: inline-flex !important;
  flex-direction: column;
  position: relative;
}
header  .btn_section:after {
  content: "";
  position: absolute;
  border-bottom: 1px dashed #fff; 
  top: 0;
  bottom:-3px;
  margin: auto;
  left: 0;
  width: 100%;
  height: 1px;
}
header .btn_zone a {
  width: 100%;
  color: #fff;
  font-size: 1.5rem;
  line-height: 1.3;
  margin-bottom: 10px;
  width: 20rem;
}
header  .btn_section .arrow_right {
  border-bottom: none;
}
header  .btn_section .arrow_right .arrow {
  margin-bottom: 10px !important;
}
header .left_section {
  text-align: right;
  margin-top: 1.5rem;
}
header .left_section h3 {
  font-size: 1.4rem;
  color: #fff;
  margin-top: 5rem;
}
header .left_section p.address_text,
header .left_section a.link_a {
  font-size: 0.9rem;
  color: #fff;
}
header .left_section a {
  color: #fff;
  font-size: 1.5rem;
  line-height: 1;
}
header.left_section .arrow_right {
  border-bottom: none ;
}
header .left_section .arrow_right:first-child {
  margin-bottom: 0.5rem;
}
header .left_section .arrow_right .arrow {
  margin-bottom: 0 !important;
}
header .left_section a.link_a img {
  width: 1.6rem;
  height: auto;
  margin-left: 1rem;
  margin-bottom: 2px;
}







}

@media screen and (max-width:540px) {

}



/* ===================================
hamburger(ハンバーガーアイコン)
=================================== */
.hamburger {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  background-color: #0066B9;
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  /*width: 50px;*/
  height: fit-content;
  cursor: pointer;
  z-index: 300;
  padding: 1rem;
  border-radius: 5px;
}
.hamburger:hover {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  cursor: pointer;
  z-index: 300;
}
.hamburger p {
font-weight: bold;
font-size: 1rem;
color: #fff;
line-height: 1;
padding-right: 1rem;
border-right: 1px dashed #fff;
}
.menu_border {
  position: relative;
  width: 3rem;
 /*height: 3rem;*/
}
.hamburger__line {
  position: absolute;
  width: 0.9rem;
  height: 1px;
  right: 8px;
  transition: all 0.5s;
  z-index: 1;
  background: #fff;
}
.hamburger__line--1 {
  top: 0.35rem;
}
.hamburger__line--2 {
  top: 0.9rem;
}
.hamburger__line--3 {
  top: 0.75rem;
}

/*ハンバーガーがクリックされたら*/
.open .hamburger__line--1 {
  transform: rotate(-45deg);
  top: 0.4rem;
}
.open .hamburger__line--2 {
  opacity: 0;
}
.open .hamburger__line--3 {
  transform: rotate(45deg);
  top: 0.4rem;
}
.sp-nav-ul ul {
  display: block;
  padding-left: 0;
  column-count: 2;
  /*column-gap: 20px;*/
  column-gap: 0px;
  margin-bottom: 0;
}
/* --- [ベースのスタイル] --- */
/* まずは一番画面が小さい状態（540px以下）をベースとして定義します */
.sp-nav {
  display: block;
  position: fixed;
  right: -100%; /* 540px以下では最初は隠しておく */
  top: 0;
  width: 50%;
  height: 100vh;
  transition: all 0.5s;
  z-index: 200;
  overflow-y: auto;
  background-color: #06193e;
  /*
  background-image: url("../img/h-menu_bg_img_tab.jpg");
  background-repeat: no-repeat;
  background-position: top;
  background-size: cover;*/
}

/* 540px以下で、ボタンが押されて .open がついたときだけ画面内に出す */
.open .sp-nav {
  right: 0;
}


/* --- [メディアクエリの追加] --- */
/* 541px 〜 991px の間だけ適用するルール */
@media screen and (min-width: 541px) and (max-width: 991px) {
  .sp-nav {
    right: 0 !important;
  }
  /* この幅のときは、メニューが出っぱなしなのでボタンは隠す */
  #js-hamburger {
    display: none !important;
  }
}

/* --- 540px以下のとき（ここを追加・確認してください） --- */
@media screen and (max-width: 540px) {
  /* 540px以下になったら、ボタンをしっかり表示させる */
  #js-hamburger {
    display: flex; /* もしインライン要素なら inline-block など適切なものに */
    position: fixed; /* 画面に固定する場合など、必要に応じて位置を調整 */
    z-index: 210;    /* .sp-nav(z-index: 200) より上にくるようにする */
  }
}

.sp-nav-ul ul.inner_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
  column-gap:2rem;
  padding-left: 0;
  column-count: 2;
  margin-bottom: 0;
}




.sp-nav-ul ul.inner_list li {
  width: 5rem;
}
.black-bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.7); /* 黒の60%透過 */
  z-index: 100; /* メニュー(.sp-nav)より下に配置 */
  
  /* 初期状態は非表示（透明 & クリック不可） */
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s; 
}

/* メニューが開いたとき、背景を表示する */
#nav-wrapper.open .black-bg {
  opacity: 1;
  visibility: visible;
}


.sp-nav .logo_zone {
  margin-top: 3rem;
  margin-bottom: 2rem;
}
.sp-nav a {
  display: inline-block;
  color: #fff;
  padding: 0.4rem 0;
  font-weight: 700;
}
.sp-nav p.sp-nav-logo {
  width: 18rem;
  height: auto;
}
.sp-nav-ul {
  margin: auto;
}
.open .sp-nav {
  right: 0;
  display: block;
}

.open .sp-nav a {
  padding: 0.4rem 0;
  display:inline-block;
  color: #fff;
  font-weight: 700;
}

@media screen and (max-width:991px) {
  .sp-nav .logo_zone {
    margin-top: 18rem;
    margin-bottom: 2rem;
  }
}
@media screen and (max-width:540px) {
  .sp-nav .logo_zone {
    margin-top: 3rem;
    margin-bottom: 2rem;
  }
  header li.nav-item>a {
    font-size: 0.9rem;
  }
  .sp-nav-ul ul.inner_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    column-gap: 1rem;
}

}
@media screen and (max-width:540px) {
  .hamburger {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    background-color: #0066B9;
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    /* width: 50px; */
    height: fit-content;
    cursor: pointer;
    z-index: 300;
    padding: 0.8rem;
    border-radius: 5px;
}
.hamburger:hover {
  bottom: 1rem;
  right: 1rem;
  position: fixed;
  cursor: pointer;
  z-index: 300;
}
  .hamburger p {
    font-weight: bold;
    font-size: 0.7rem;
    color: #fff;
    line-height: 1;
    padding-right: 1rem;
    border-right: 1px dashed #fff;
    }
    .hamburger__line--1 {
      top: 0.1rem;
    }
    .hamburger__line--2 {
      top: 0.9rem;
    }
    .hamburger__line--3 {
      top: 0.6rem;
    }
  .sp-nav .logo_zone {
    margin-top: 0rem;
    margin-bottom: 0rem;
  }
  .sp-nav p.sp-nav-logo {
    width: 12rem;
    height: auto;
  }
    .sp-nav {
      position: fixed;
      right: -100%;
      top: 0;
      width: 103%;
      height: 100vh;
      transition: all 0.5s;
      z-index: 200;
      overflow-y: auto;
      background-image: url("../img/h-menu_bg_img_res.jpg");
      background-repeat: no-repeat;
      background-position: top;
      background-size:cover
    }
    .open.sp-nav {
      position: fixed;
      right: -100%;
      top: 0;
      width: 103%;
      height: 100vh;
      transition: all 0.5s;
      z-index: 200;
      overflow-y: auto;
    }
   .sp-nav a {
      display: inline-block;
      color: #fff;
      font-weight: 700;
      font-size: 0.8rem;
  }

.sp-nav-ul ul {
  display: block;
  padding-left: 0;
  column-count: 2;
  column-gap: 0px;
  margin-bottom: 0;
}
  header .btn_section {
    display: inline-flex !important;
    flex-direction: column;
    position: relative;
    margin-top: 0.5rem;
    width: 83%;
  }
  header .btn_zone a {
    width: 100%;
    color: #fff;
    font-size: 1.4rem;
    line-height: 1.3;
    margin-bottom: 10px;
    width: 20rem;
}
  header .left_section h3 {
    font-size: 1.3rem;
    color: #fff;
    margin-top: 1.5rem;
  }
  
  header .left_section .inner_margin {
    margin-top: 0.5rem;
  }
  header .left_section p.address_text, header .left_section a.link_a {
    font-size: 0.8rem;
    color: #fff;
  }
  header .navbar-nav .l-list {
    width: 9rem;
  }


}















/**=================
footer
==================**/
.split {
  break-before: column;
}
footer {
  color: #fff;
  position: relative;

}
footer .footer {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top: 6.5rem;

}
footer .footer h2.footer_logo {
  width: 6.5rem;
  height: auto;
}
footer .footer  .btn_section {
  display: inline-flex;
  flex-direction: column;
  position: relative;
}
footer .footer  .btn_section:after {
  content: "";
  position: absolute;
  border-bottom: 1px dashed #fff; 
  top: 0;
  bottom:-3px;
  margin: auto;
  left: 0;
  width: 100%;
  height: 1px;
}
footer .footer .left_section p.address_text,
footer .footer .left_section a.link_a {
  font-size: 0.9rem;
}
footer .footer .left_section a {
  color: #fff;
  font-size: 1.5rem;
  line-height: 1;
}
footer .footer .left_section .arrow_right {
  border-bottom: none ;
}
footer .footer .left_section .arrow_right:first-child {
  margin-bottom: 0.5rem;
}
footer .footer .left_section .arrow_right .arrow {
  margin-bottom: 0 !important;
}
footer .footer .left_section a.link_a img {
  width: 1.6rem;
  height: auto;
  margin-left: 1rem;
  margin-bottom: 2px;
}
footer .footer .right_section a {
  /*font-size: 1.2rem;*/
  color: #fff;
  position: relative;
  z-index: 2;
  width: 100%;
  display: inline-block;
}
footer .footer .right_section {
  margin-block: auto;
  margin-bottom: 0;
}
footer .footer .right_section ul.main_list {
  column-count: 2;
  padding-left: 0;
  column-gap: 20px;
  margin-bottom: 0;
}
footer .footer .right_section ul.inner_list  {
  padding-left: 0;
}
footer .footer .right_section ul .arrow_footer a {
  font-size: 1.2rem;
}
footer .footer .right_section ul.inner_list a::after {
  display: none;
}
footer .footer .right_section ul li.split {
  width: 15rem;
}
/*
footer .footer .right_section ul li.split>a::after {
  bottom: -2.2rem;
}
*/
/**
footer .footer .right_section ul.inner_list a {
  padding: 0.2rem 0;
  width: 4rem;
}*/
footer .footer .right_section li.inner_list {
  padding: 0.2rem 0;
  width: 6rem;
}
footer .footer .right_section li.inner_list a {
  font-size: 1rem;
}
.arrow_footer {
  width: 12rem;
  position: relative;
  display: block;
  padding: 1rem 0;
}

.arrow_footer .arrow {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0.8rem;
  width: 2.5rem;
  height :2.5rem;
  margin: auto 0;
  line-height: 1;
}

footer .arrow_footer .arrow {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0.1rem;
  width: 2.5rem;
  height: 2.5rem;
  margin: auto 0;
  line-height: 1;
}
.arrow_footer:before,
.arrow_footer:after {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
background-position: center;
background-repeat: no-repeat;
background-size: 1rem;
animation-fill-mode: forwards;
animation-duration: 0.3s;
}
.arrow_footer .arrow:before {
  background-image: url("../img/arrow_wh.png");
}
.arrow_footer .arrow:after {
  background-image: url("../img/arrow_wh.png");
  background-color:initial;
}


.arrow_footer:hover .arrow:before {
  animation-name: transformRightLeft; /* 修正: hover時のアニメーションを指定 */
  animation-delay: 0s;
}
.arrow_footer:hover .arrow:after {
  animation-name: transformLeftRight; /* 修正: hover時のアニメーションを指定 */
  animation-delay: 0.2s;
}
  
@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
  
footer .copy_text_zone {
  text-align: center;
}

@media screen and (max-width:1280px) {
  footer .arrow_footer .arrow {
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0rem;
    width: 2.5rem;
    height: 2.5rem;
    margin: auto 0;
    line-height: 1;
    margin-bottom: 10px !important;
  }
  footer .footer .right_section li.inner_list {
    padding: 0.2rem 0;
    width: 6rem;
  }
  
}


@media screen and (max-width:991px) {
  footer {
    overflow: hidden;
    margin-top: 0 !important;
  }
  footer .footer {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: 5rem;
  }
  footer .arrow_footer .arrow {
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0rem;
    width: 2.5rem;
    height: 2.5rem;
    margin: auto 0;
    line-height: 1;
    margin-bottom: 3px !important;
}
  footer img.footer_bg {
    height: 63rem;
    width: auto;
  }
  .arrow_footer {
    width: 12rem;
    position: relative;
    display: block;
    padding: 0.3rem 0;
  }
  footer .footer .right_section ul.inner_list {
    padding-left: 0;
    column-count: 2;
  }
  footer .footer .right_section .btn_zone a {
    color: #fff;
    font-size: 1.5rem;
    line-height: 1.3;
    margin-bottom: 10px;
  }
  footer .footer .right_section ul .arrow_footer a {
    font-size: 1rem;
  }
  footer .footer .right_section ul.inner_list a {
    padding: 0.2rem 0;
    width: 5rem;
    font-size: 0.9rem;
  }

  footer .footer .right_section .arrow_right {
    border-bottom: none ;
  }
  /*
  footer .footer .right_section .arrow_right:first-child {
    margin-bottom: 10px;
  }
  */
  footer .arrow_right .arrow {
    bottom: 5px;
}
  footer .footer  .btn_section:after {
    content: "";
    position: absolute;
    border-bottom: 1px dashed #fff; 
    top: 0;
    bottom:-4px;
    margin: auto;
    left: 0;
    width: 100%;
    height: 1px;
  }
  footer .footer .left_section {
    text-align: right;
    margin-top: 3.5rem;
  }
  footer .footer .left_section .inner_margin {
    margin-top: 1rem;
  }
  footer .footer h2.footer_logo {
    width: 4rem;
    height: auto;
    margin-inline: auto;
    margin-right: 0;
  }
  footer .left_section h3 {
    font-size: 1.5rem;
}
  footer .copy_text_zone {
    text-align: right;
     margin-top: 1.5rem;
  }
}


@media screen and (max-width:540px) {
  /**スライドゾーンがあるため、一応調整**/
  footer {
    margin-top: 0 !important;
  }
  footer img.footer_bg {
    height: 58rem;
    width: auto;
  }
  footer .arrow_footer .arrow {
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0rem;
    width: 2.5rem;
    height: 2.5rem;
    margin: auto 0;
    line-height: 1;
    margin-bottom: -1px !important;
}
  footer .footer .right_section ul.main_list {
    column-count: 2;
    padding-left: 0;
    column-gap: 0px;
    margin-bottom: 0;
  }
  footer .footer .right_section a {
    font-size: 0.8rem;
    color: #fff;
    position: relative;
    z-index: 2;
    width: 100%;
    display: inline-block;
  }
  .arrow_footer {
    width: 9rem;
    position: relative;
    display: block;
    padding: 0.3rem 0;
}
  footer .arrow_right .arrow {
    bottom: 10px;
}
footer .footer .right_section ul .arrow_footer a {
  font-size: 0.9rem;
}
footer .footer .right_section ul.inner_list a {
  padding: 0.2rem 0;
  width: 5rem;
  font-size: 0.8rem;
}
  footer .footer .right_section ul li.split {
    width: 11rem;
  }
  footer .footer .left_section p.address_text, footer .footer .left_section a.link_a {
    font-size: 0.8rem;
}
  footer .copy_text_zone p {
    font-size: 0.8rem;
  }
  footer .left_section h3 {
    font-size: 1.3rem;
  }
}



































.space{
  height: 100vh;
}

/*text animetions*/
@keyframes showTextFromBottom{
  0%{
    transform: translateY( 100% );
  }
  100%{
    transform: translateY( 0px );
  }
}
.anime-up.displayed span{
  animation: showText 1s backwards;
  display: inline-block;
}
.anime-up.displayed > span{
  overflow: hidden;
}
.anime-up.displayed > span > span{
  animation: showTextFromBottom 0.5s backwards;
}