@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;700&family=Noto+Sans+JP:wght@400;500;700&display=swap');

/* =======================================

  CommonElements

======================================= */
:root {
  --logo-blue: #1c63b7;
  --a-blue: #0080ff;
  --h-blue: #bce5ef80;
  --m-gray: #98a6b5;
  --l-gray: #f0f3f5;
  --d-gray: #707f89;
  --b-black: #333333;
  --white: #ffffff;
  --spacing-xxs: 12px;
  --spacing-xs: 20px;
  --spacing-s: 40px;
  --spacing-m: 60px;
  --spacing-l: 72px;
  --spacing-xl: 80px;
  --spacing-xxl: 100px;
  --spacing-xxxl: 130px;
}

@media (max-width: 768px) {
  :root {
    --spacing-xxs: 2.6666vw;
    --spacing-xs: 5.3333vw;
    --spacing-s: 8.53vw;
    --spacing-m: 10.6666vw;
    --spacing-l: 16vw;
    --spacing-xl: 19.2vw;
    --spacing-xxl: 21.3vw;
    --spacing-xxxl: 26.6vw;
  }
}

/* ------------------------------------
  辻（※『辻』の正しい表記は1点しんにょうです。）関連
  「Zen Kaku Gothic New」の辻は1点しんにょうの模様
------------------------------------ */
@font-face {
  font-family: 'tuji';
  font-style: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/zenkakugothicnew/v18/gNMYW2drQpDw0GjzrVNFf_valaDBcznOkj4KXW7oIgA9sLCeNoPLhe6Lpg_IbDMC.80.woff2) format('woff2');
  font-weight: 400;
  unicode-range: U+8FBB;
}
@font-face {
  font-family: 'tuji';
  font-style: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/zenkakugothicnew/v18/gNMVW2drQpDw0GjzrVNFf_valaDBcznOqs9LaWG6XGtdu7-LJIjxku6yox_CeVZufvVB.80.woff2) format('woff2');
  font-weight: 500;
  unicode-range: U+8FBB;
}
@font-face {
  font-family: 'tuji';
  font-style: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/zenkakugothicnew/v18/gNMVW2drQpDw0GjzrVNFf_valaDBcznOqodNaWG6XGtdu7-LJIjxku6yox_CeVZufvVB.80.woff2) format('woff2');
  font-weight: 700;
  unicode-range: U+8FBB;
}

/************************
 BASE
*************************/
html {
  font-size: 62.5%;
}
body {
  font-family: 'tuji', 'Noto Sans JP', sans-serif;
  font-feature-settings: 'palt' 1;
  font-kerning: auto;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.777;
  font-weight: 500;
  color: var(--b-black);
}
@media (max-width: 768px) {
  body {
    font-size: 3.2vw;
  }
  .pc {
    display: none !important;
  }
}
@media (min-width: 769px) {
  body {
    font-size: 1.406vw;
  }
  a[href^='tel:'] {
    pointer-events: none;
  }
  .sp {
    display: none !important;
  }
}

@media (min-width: 1280px) {
  body {
    font-size: 1.8rem;
  }
}

a:link {
  text-decoration: none;
  color: var(--b-black);
}
a:visited {
  text-decoration: none;
  color: var(--b-black);
}
a:active {
  text-decoration: underline;
  color: var(--a-blue);
}
a:hover {
  text-decoration: underline;
  color: var(--a-blue);
}

img {
  max-width: 100%;
  height: auto;
}

.w30 {
  width: 30%;
}
.w50 {
  width: 50%;
}
.w80 {
  width: 80%;
}
.w100 {
  width: 100%;
}
.mt-none {
  margin-top: 0 !important;
}
.mb-none {
  margin-bottom: 0 !important;
}
.mt-xxl {
  margin-top: var(--spacing-xxl);
}
.mt-xl {
  margin-top: var(--spacing-xl);
}
.mt-l {
  margin-top: var(--spacing-l);
}
.mt-m {
  margin-top: var(--spacing-m);
}
.mt-s {
  margin-top: var(--spacing-s);
}
.mt-xs {
  margin-top: var(--spacing-xs);
}
.mt-xxs {
  margin-top: var(--spacing-xxs);
}
.tac {
  text-align: center !important;
}
.tal {
  text-align: left !important;
}
.tar {
  text-align: right !important;
}
.blue {
  color: var(--logo-blue);
}

/* ------------------------------------
  IconFont
------------------------------------ */
@font-face {
  font-family: 'icon';
  src: url('fonts/icon.eot?plzs8o');
  src: url('fonts/icon.eot?plzs8o#iefix') format('embedded-opentype'), url('fonts/icon.ttf?plzs8o') format('truetype'),
    url('fonts/icon.woff?plzs8o') format('woff'), url('fonts/icon.svg?plzs8o#icon') format('svg');
  font-weight: normal;
  font-style: normal;
}

.linkbtn:after {
  font-family: 'icon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.linkbtn:after {
  content: '\e900';
}

/* ------------------------------------
  wrapper
------------------------------------ */
.wrap {
  width: 100%;
  overflow: hidden;
}
.section {
  position: relative;
  display: block;
  padding: var(--spacing-l) 0;
}
.container {
  width: 80.52%;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 2;
}
.container .container_s {
  width: 85.4%;
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width: 1280px) {
  .container_s {
    width: 940px;
  }
  .container {
    width: 1100px;
  }
}
@media only screen and (max-width: 768px) {
  .section {
    padding: var(--spacing-s) 0;
  }
  .container {
    width: 100%;
    padding: 0 4.1%;
  }
  .container .container_s {
    padding: 0;
    width: 100%;
  }
}

/* =====================================
  ClearFixElements
===================================== */

.clearfix:after {
  content: '';
  clear: both;
  display: block;
}

/* =====================================
  header
===================================== */
header {
  display: flex;
  align-items: center;
  position: fixed;
  inset: 0 0 auto;
  width: 100%;
  height: 80px;
  z-index: 100;
  background-color: var(--white);
  box-shadow: 0 1px 9px rgba(203, 203, 203, 0.45);
  transition: all 0.3s ease-out;
}
header h1 {
  width: 163px;
  height: 50px;
  margin: 0 auto 0 80px;
  line-height: 1;
}
header h1 > a {
  font-size: 1.4rem;
  vertical-align: middle;
}
@media screen and (max-width: 1470px) {
  header h1 {
    margin-left: 2%;
  }
}
@media screen and (max-width: 1240px) {
  header h1 {
    width: 12%;
    height: auto;
  }
}
/* mdd_nav */
header > .mdd_nav > ul {
  display: flex;
}
header > .mdd_nav > ul > li {
  min-height: 80px;
}

header .mdd_nav > ul > li > a {
  display: flex;
  position: relative;
  height: 100%;
  padding-inline: 16px;
  font-size: 0.88888em;
  white-space: nowrap;
  align-items: center;
}
@media screen and (max-width: 1470px) {
  header .mdd_nav > ul > li > a {
    font-size: 0.8em;
  }
}
header .mdd_nav > ul > li:not([class^='nav_']) > a::after {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: var(--logo-blue);
  transition: height 0.3s ease-out;
}
header .mdd_nav > ul > li > .parent_link {
  padding-left: 24px;
  &::before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 6px;
    height: 6px;
    border-right: solid 1px var(--logo-blue);
    border-bottom: solid 1px var(--logo-blue);
    rotate: 45deg;
    translate: 5px -50%;
  }
}
@media screen and (max-width: 1240px) {
  header .mdd_nav > ul > li > a {
    padding-inline: 0.3em;
  }
  #global_header_en .mdd_nav > ul > li > a {
    padding-inline: 0.8em;
  }
  header .mdd_nav > ul > li > .parent_link {
    padding-left: 16px;
  }
}
/* sub_nav */
header .mdd_nav > ul > li[class^='nav_'] a {
  display: flex;
  width: 92px;
  height: 100%;
  font-size: 0.666em;
  color: var(--white);
  flex-flow: column nowrap;
  gap: 0.2em;
  justify-content: center;
}
#global_header .mdd_nav > ul > li.nav_contact,
#global_header_en .mdd_nav > ul > li.nav_lang {
  margin-left: 0.5em;
}
@media screen and (max-width: 1240px) {
  header .mdd_nav > ul > li[class^='nav_'] a {
    width: 8em;
  }
}
header .mdd_nav > ul > li.nav_lang a {
  background: var(--d-gray);
  &::before {
    content: '';
    width: 50%;
    height: 2.5em;
    background: url(/img/header_world_icon.png) center center no-repeat;
    background-size: contain;
    display: block;
    margin: 0.3em auto;
  }
}
header .mdd_nav > ul > li.nav_contact a {
  background: var(--logo-blue);
  &::before {
    content: '';
    width: 50%;
    height: 2.5em;
    background: url(/img/header_inq_icon.png) center center no-repeat;
    background-size: contain;
    display: block;
    margin: 0.3em auto;
  }
}
header .mdd_nav > ul > li.nav_potal a {
  background: #76a1d4;
  &::before {
    content: '';
    width: 50%;
    height: 2.5em;
    background: url(/img/header_potal_icon.png) center center no-repeat;
    background-size: contain;
    display: block;
    margin: 0.3em auto;
  }
}
@media (hover: hover) and (pointer: fine) {
  header .mdd_nav > ul > li > a:hover {
    text-decoration: none;
  }
  header .mdd_nav > ul > li:not([class^='nav_']) > a:hover::after {
    height: 6px;
  }
  header .mdd_nav > ul > li[class^='nav_'] a:hover {
    opacity: 0.8;
  }
}
/* mdd_wrap */
header .header_accordion .mdd_wrap {
  position: absolute;
  overflow: hidden;
  width: 100%;
  inset: 80px 0 auto;
  background-color: var(--white);
  box-shadow: 0 9px 9px -9px rgba(203, 203, 203, 0.45) inset;
  z-index: 30;
}
header .mdd_inner {
  position: absolute;
  display: flex;
  align-items: flex-start;
  position: relative;
  margin: 33px auto;
  width: 90%;
  max-width: 1100px;
}
header .mdd_inner > a {
  width: 25%;
  line-height: 1.8;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  color: var(--logo-blue);
}
header .mdd_inner > a hgroup h2 {
  font-size: 1.2em;
  color: var(--logo-blue);
  position: relative;
  padding-left: 16px;
  &::before {
    content: '';
    display: block;
    position: absolute;
    inset: 0 auto 0 0;
    width: 8px;
    height: 8px;
    margin: auto;
    border-right: 1px solid var(--logo-blue);
    border-bottom: 1px solid var(--logo-blue);
    rotate: -45deg;
  }
}
header .mdd_inner > a hgroup p {
  display: block;
  font-weight: bold;
  font-size: 0.7em;
  line-height: 1.417;
}
header .mdd_inner .clm_wrap {
  width: 75%;
  min-height: 55px;
  padding-left: 2em;
  border-left: 2px solid var(--logo-blue);
}
header .mdd_inner .clm_wrap > ul {
  display: grid;
  grid-auto-flow: column;
  grid-auto-rows: min-content;
  grid-template-rows: repeat(4, min-content);
  align-items: start;
  margin-bottom: -25px;
}
header .mdd_inner .clm_wrap > ul > li {
  padding-bottom: 25px;
  min-width: 25%;
}
header .mdd_inner .clm_wrap > ul > li.break {
  grid-column-start: auto;
  grid-row-start: 1; /* 次のカラムの1行目に移動 */
}
header .mdd_inner .clm_wrap > ul > li > a {
  padding-left: 1.2rem;
  font-size: 0.8em;
  font-weight: 500;
  line-height: 1.429;
  display: block;
  position: relative;
}
header .mdd_inner .clm_wrap > ul > li > a::before {
  content: '　';
  display: inline-block;
  position: absolute;
  top: 0.15em;
  left: 0;
  width: 1rem;
  height: 1.4vw;
  max-width: 1.8rem;
  max-height: 1.8rem;
  background: url('/img/arrow.svg') center center no-repeat;
  background-size: contain;
  font-size: inherit;
  line-height: inherit;
}

@media (hover: hover) and (pointer: fine) {
  header a,
  header .mdd_inner .clm_wrap > ul > li > a,
  header .mdd_inner .clm_wrap > ul > li > a::before {
    transition: opacity 0.3s ease, color 0.3s ease, border-color 0.2s ease;
  }
  header .mdd_inner > a:hover {
    opacity: 0.7;
    text-decoration: none;
  }
  header .mdd_inner .clm_wrap > ul > li > a:hover {
    text-decoration: none;
  }
  header .mdd_inner .clm_wrap > ul > li > a:hover::before {
    border-color: var(--logo-blue);
  }
}
@media screen and (max-width: 768px) {
  body.menu-open {
    position: fixed;
    width: 100%;
    overflow: hidden;
  }
  header h1 {
    margin: 0 0 0 4.1%;
    width: auto;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  header h1 a {
    display: flex;
    height: 100%;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
  }
  header h1 img,
  header #logo_field img {
    padding-top: 0;
    width: 100px;
    height: auto;
  }
  header #spMenu {
    display: block;
    position: absolute;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    top: 50%;
    right: 2vw;
  }
  header #spMenu .switch_btn {
    width: 50px;
    height: 50px;
    display: block;
  }
  header #spMenu .switch_btn span {
    width: 66%;
    height: 2px;
    background-color: #002d78;
    border-radius: 2px;
    position: absolute;
    left: 17%;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
  }
  header #spMenu .switch_btn,
  .switch_btn span {
    display: inline-block;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    box-sizing: border-box;
  }
  header #spMenu .switch_btn span:nth-of-type(1) {
    top: 14px;
    transform: rotate(0);
    -webkit-transform: rotate(0);
  }
  header #spMenu .switch_btn span:nth-of-type(2) {
    top: 24px;
    transform: scale(1);
    -webkit-transform: scale(1);
  }
  header #spMenu .switch_btn span:nth-of-type(3) {
    top: 34px;
    transform: rotate(0);
    -webkit-transform: rotate(0);
  }
  header #spMenu .switch_btn[aria-expanded='true'] {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
  }
  header #spMenu .switch_btn[aria-expanded='true'] span:nth-of-type(1) {
    top: 4px !important;
    transform: translateY(20px) rotate(-45deg);
    -webkit-transform: translateY(20px) rotate(-45deg);
  }
  header #spMenu .switch_btn[aria-expanded='true'] span:nth-of-type(2) {
    top: 24px;
    transform: translateY(0) rotate(45deg);
    -webkit-transform: translateY(0) rotate(45deg);
  }
  header #spMenu .switch_btn[aria-expanded='true'] span:nth-of-type(3) {
    opacity: 0;
  }
  header > .mdd_nav {
    position: fixed;
    width: 100%;
    height: calc(100svh - 80px);
    top: 80px;
    left: 0;
    padding: 0 0 60px;
    overflow-x: hidden;
    overflow-y: scroll;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transition: max-height 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.2s ease, visibility 0.2s;
  }
  header > .mdd_nav[aria-hidden='false'] {
    max-height: calc(100svh - 80px);
    opacity: 1;
    visibility: visible;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(12px);
  }
  header > .mdd_nav > ul {
    display: block;
  }
  header .mdd_nav .ac_toggle,
  header .mdd_nav > ul > li[class^='nav_'] > a {
    font-size: 0.8em;
  }
  header .mdd_nav > ul > li,
  #global_header .mdd_nav > ul > li.nav_contact,
  #global_header_en .mdd_nav > ul > li.nav_lang {
    display: block;
    margin: 0;
    padding: 0;
    position: relative;
    border-bottom: rgba(255, 255, 255, 0.4) 1px solid;
    min-height: auto;
    font-size: 1.5em;
  }
  header .mdd_nav > ul > li > a,
  #global_header_en .mdd_nav > ul > li > a,
  header .mdd_nav > ul > li[class^='nav_'] > a {
    width: 100%;
    height: auto;
    padding: 1.5em 6%;
    display: block;
    position: relative;
    color: var(--white) !important;
    line-height: 1em;
    text-align: left;
    background-color: rgba(28, 99, 183, 0.9);
  }
  header .mdd_nav > ul > li > a:visited {
    color: var(--white);
  }
  header .mdd_nav > ul > li > .parent_link {
    padding-left: 6%;
  }
  header .mdd_nav > ul > li[class^='nav_'] > a {
    width: 100%;
    &::before {
      display: none;
    }
  }
  header .mdd_nav > ul > li > a:not(.parent_link)::after {
    content: '';
    background: url(/img/arrow_footer.png) center no-repeat;
    background-size: contain;
    width: 12px;
    height: 12px;
    display: block;
    position: absolute;
    top: 50%;
    right: 7%;
    bottom: auto;
    left: auto;
    transform: translateY(-50%);
  }
  header .mdd_nav .ac_toggle {
    display: block;
    position: absolute;
    top: 0.5vw;
    right: 0;
    width: calc(58 / 375 * 100vw);
    height: 100%;
    max-height: calc(3vw * 5);
    cursor: pointer;
    z-index: 20;
  }
  header .mdd_nav .ac_toggle::before,
  header .mdd_nav .ac_toggle::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 3px;
    border-radius: 5px;
    background-color: var(--white);
    translate: -50% -50%;
    transition: all 0.3s ease-out;
  }
  header .mdd_nav .ac_toggle::after {
    rotate: -90deg;
  }
  header .mdd_nav .ac_toggle[aria-expanded='true']::after {
    rotate: 0deg;
  }
  /* mdd_wrap */
  header .header_accordion .mdd_wrap {
    position: relative;
    overflow: hidden;
    width: 100%;
    inset: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-shadow: none;
    z-index: 30;
    max-height: none;
    opacity: 1;
    visibility: visible;
    transition: max-height 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.2s ease, visibility 0.2s;
  }
  header .header_accordion .mdd_wrap .mdd_inner {
    display: block;
    margin: 0;
    width: 100%;
  }
  header .header_accordion .mdd_wrap .mdd_inner > a {
    display: none;
  }
  header .mdd_inner .clm_wrap {
    width: 100%;
    min-height: auto;
    padding-left: 0;
    border-left: none;
  }
  header .mdd_inner .clm_wrap > ul {
    display: block;
    margin-bottom: 0;
  }
  header .mdd_inner .clm_wrap > ul li {
    padding: 0;
    border-top: rgba(255, 255, 255, 0.4) 1px solid;
  }
  header .mdd_inner .clm_wrap > ul > li > a {
    display: block;
    width: 100%;
    padding: 1.5em 6%;
    font-size: calc(14.4 / 375 * 100vw);
    background-color: rgba(28, 99, 183, 0.8);
    color: var(--white);
    &::before {
      inset: 0 6.6% 0 auto;
      width: 16px;
      height: 16px;
      filter: invert(71%) sepia(7%) saturate(632%) hue-rotate(170deg) brightness(92%) contrast(91%);
      margin: auto;
    }
  }



  header .mdd_nav > ul > li:not([class^='nav_']) > a:hover::after {
    height: 12px;
  }
  header .mdd_nav > ul > li:not([class^='nav_']) > a.parent_link:hover::after {
    height: 0;
  }
  header .mdd_nav > ul > li[class^='nav_'] > a:hover {
    opacity: 1;
  }
  header .mdd_inner .clm_wrap > ul > li > a:hover::before {
    border-color: var(--l-gray);
  }
}
/*-----------------------------------------
  footer
-----------------------------------------*/
footer {
  width: 100%;
  color: #333;
  background: var(--l-gray);
}
footer a {
  color: #333;
}
/* footer_head_block */
footer .footer_head_block {
  width: 100%;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: flex-start;
  padding-top: 48px;
}
footer .footer_head_block .footer_logo {
  width: 17.9%;
  margin: 32px auto;
}
footer .footer_head_block .sns_nav ul {
  display: flex;
  justify-content: center;
}
footer .footer_head_block .sns_nav li {
  width: 34px;
  margin: 0 4px;
}
@media only screen and (max-width: 768px) {
  footer .footer_head_block .footer_logo {
    width: 117px;
    margin-bottom: 3.2vw;
  }
  footer .footer_head_block .sns_nav li {
    width: 43px;
    margin: 0 8px;
  }
}

/* nav_field */
footer .footer_sitemap {
  padding: 3em 0;
}
footer .nav_field {
  width: 100%;
  display: flex;
  flex-flow: column wrap;
  max-height: 69em;
  gap: 2.3em 0;
}
footer .nav_field.en {
  max-height: 55em;
}
footer .nav_field > li {
  width: calc(100% / 3);
}
footer .nav_field li.break::after {
  content: '';
  display: block;
  height: 8em;
}
footer .nav_field li.break.en::after {
  height: 28em;
}
footer .nav_field > li.pc a.blank {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  &::after {
    content: '';
    width: 20px;
    height: 20px;
    background: url(/img/icon_blank.svg) center center no-repeat;
    background-size: 12px 12px;
    display: inline-block;
  }
}
footer .nav_field > li > ul {
  padding: 1em 0 0;
  li {
    a {
      padding: 0.4em 0 0.4em 1.5em;
      position: relative;
      font-size: 0.88888em;
      color: #98a6b5;
      &::before {
        content: '';
        background: url(/img/arrow_footer.png) center left no-repeat;
        background-size: contain;
        width: 1em;
        height: 1em;
        margin: 0 0.5em 0 0;
        display: inline-block;
        position: absolute;
        top: 0.65em;
        left: 0;
      }
    }
  }
}
footer .nav_field a,
footer .nav_field p {
  display: block;
  line-height: 1.4;
}
footer .nav_field .footer_accordion {
  position: relative;
  button {
    position: absolute;
  }
}
@media only screen and (max-width: 768px) {
  footer .footer_sitemap {
    padding: 6.4vw 0 8.3333vw;
  }
  footer .nav_field {
    display: block;
    max-height: none;
  }
  footer .nav_field.en {
    max-height: none;
  }
  footer .nav_field a,
  footer .nav_field p {
    padding: 1em 0;
    font-size: 1.5em;
  }
  footer .nav_field > li {
    width: 100%;
    border-top: 1px #cdd6dd solid;
  }

  footer .nav_field li.break::after {
    display: none;
    height: 0;
  }
  footer .nav_field > li > ul {
    padding: 0 0 5.3vw;
    li {
      a {
        padding: 0.4em 0 0.4em 1em;
        font-size: 1.3333em;
        &::before {
          width: 0.6em;
          height: 1.3333em;
          top: 0.4em;
        }
      }
    }
  }
  footer .nav_field li {
    .single,
    .blank {
      position: relative;
      &::after {
        content: '';
        width: 40px;
        height: 100%;
        background: url(/img/icon_blank.svg) center no-repeat;
        background-size: 12px 12px;
        right: 0;
        top: 0;
        position: absolute;
        display: block;
      }
    }
    .single {
      position: relative;
      &::after {
        background: url(/img/arrow_footer.png) center no-repeat;
      }
    }
  }
  footer .nav_field .footer_accordion {
    button {
      width: 40px;
      padding: 1em 0;
      font-size: 1.5em;
      background: url(/img/Icon_material-minus-circle-outline.svg) center no-repeat;
      background-size: 15px 15px;
      right: 0;
      top: 0;
      z-index: 10;
      &::before {
        content: '　';
      }
      &[aria-expanded='false'] {
        background: url(/img/Icon_material-add-circle-outline.svg) center no-repeat;
        background-size: 15px 15px;
      }
    }
  }
}
footer small.copyright {
  width: 100%;
  padding: 0 30px;
  display: block;
  color: var(--white);
  letter-spacing: 0.1em;
  font-weight: 500;
  height: 55px;
  line-height: 55px;
  background: var(--logo-blue);
  font-size: 0.66666em;
  text-align: center;
}
/*	:hover	*/
body.pc_view footer .address_field address .btn_area .btn,
body.pc_view footer a,
body.pc_view footer .nav_field a::after,
body.pc_view footer .nav_field a::before {
  transition: all 0.3s ease;
}
@media only screen and (min-width: 769px) {
  body.pc_view footer .address_field address .btn_area .btn:hover {
    border: 1px solid #002d78;
  }
  body.pc_view footer a:hover,
  body.pc_view footer .nav_fiel a:hover,
  body.pc_view footer .nav_field a:hover::after,
  body.pc_view footer .nav_field a:hover::before {
    color: #85c5ee;
  }
  body.pc_view footer .nav_field a:hover::before {
    background: #85c5ee;
  }
}

/* ------------------------------------
  style
------------------------------------ */

.section h2 {
  font-size: 1.6666em;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  line-height: 1.2;
  margin-bottom: var(--spacing-s);
}
.section h2 .en {
  color: var(--logo-blue);
  font-size: 0.5em;
  display: block;
  line-height: 1.777;
  font-weight: bold;
  margin-bottom: 10px;
}
.section h3 {
  color: var(--logo-blue);
  font-size: 1.6666em;
  margin-bottom: 1em;
}
.section h4 {
  font-size: 1.2222em;
}
.btn_more,
.btn_back {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  font-weight: 600;
}
.btn_more.left,
.btn_back.left {
  justify-content: flex-start;
}
.btn_more:hover,
.btn_back:hover {
  text-decoration: none;
}
.btn_more::after {
  width: 32px;
  height: 32px;
  content: '';
  background: url(/img/right_arrow_circle_blue_s.png) no-repeat;
  background-size: contain;
  margin-left: 0.75em;
  transition: 0.5s;
}
.btn_more:hover::after {
  transform: translateX(8px);
}
.btn_back {
  margin: var(--spacing-s) 0 var(--spacing-s) auto;
}
.btn_back::before {
  width: 55px;
  height: 55px;
  content: '';
  background: url(/img/right_arrow_circle_blue.png) no-repeat;
  background-size: contain;
  margin-right: 1em;
  transform: scale(-1, 1);
  transition: 0.5s;
}
.btn_back:hover::before {
  transform: scale(-1, 1) translateX(8px);
}

@media only screen and (max-width: 767px) {
  .btn_more::after {
    width: 8vw;
    height: 8vw;
    content: '';
    background: url(/img/right_arrow_circle_blue.png) no-repeat;
    background-size: contain;
    margin-left: 1em;
    transition: 0.5s;
  }
  .btn_back::before {
    width: 12vw;
    height: 12vw;
    content: '';
    background: url(/img/right_arrow_circle_blue.png) no-repeat;
    background-size: contain;
    margin-right: 1em;
    transform: scale(-1, 1);
    transition: 0.5s;
  }
}
/* ------------------------------------
  news style
------------------------------------ */

.news_list li {
  border-bottom: 1px solid var(--l-gray);
  padding: var(--spacing-xs) 0;
  min-height: 115px;
  display: flex;
}
.news_list li time {
  font-size: 0.88888em;
  color: var(--m-gray);
  width: 5em;
}
.news_list li a,
.news_list li.nolink .news_list_text {
  width: calc(100% - 5em);
  display: flex;
  justify-content: flex-start;
  padding-left: 1.8em;
  padding-right: 10px;
}
.news_list li a .news_list_text {
  padding-right: 2em;
  width: calc(100% - 20px);
}

.news_list li a .icon_pdf {
  width: 15.2px;
  height: 20px;
  background: url(/img/icon_pdf.png) no-repeat;
  background-size: 100% auto;
  display: block;
  margin-top: 0.25em;
}
@media only screen and (max-width: 767px) {
  .news_list li {
    flex-flow: column;
  }
  .news_list li a,
  .news_list li.nolink .news_list_text {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
  .info_container.news_list li a {
    width: 100%;
  }
  .info_container.news_list li a .news_list_text {
    padding-right: 0;
    width: 100%;
  }
}

/* ----------------------
  formパーツ
------------------------*/

/***input / textarea***/

input[type='text'],
input[type='email'],
input[type='tel'],
input[type='url'],
textarea {
  border-radius: 7px;
  background: #f6fbff;
  border: 1px solid #707f89;
  padding: var(--spacing-xxs);
  font-size: 0.88888em;
}
.err-msg-req {
  font-size: 0.7777em;
  color: #b71c1c;
}
.input-invalid {
  background: #fff6f6 !important;
  border: 1px solid #b71c1c !important;
}
p.note {
  font-size: 0.8888em;
  color: var(--d-gray);
}

/***チェックボックス＆ラジオボタン***/
@supports (-webkit-appearance: none) or (-moz-appearance: none) {
  input[type='checkbox'],
  input[type='radio'] {
    --active: #1c63b7;
    --active-inner: #fff;
    --focus: 2px rgba(28, 99, 183, 0.5);
    --border: #707f89;
    --border-hover: #275efe;
    --background: #f6fbff;
    --disabled: #f0f3f5;
    --disabled-inner: #cdd6dd;
    -webkit-appearance: none;
    -moz-appearance: none;
    height: 21px;
    /* outline: none; */
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin: 0;
    cursor: pointer;
    border: 1px solid var(--bc, var(--border));
    background: var(--b, var(--background));
    transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;
  }
  input[type='checkbox']:after,
  input[type='radio']:after {
    content: '';
    display: block;
    left: 0;
    top: 0;
    position: absolute;
    transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
  }
  input[type='checkbox']:checked,
  input[type='radio']:checked {
    --b: var(--active);
    --bc: var(--active);
    --d-o: 0.3s;
    --d-t: 0.6s;
    --d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2);
  }
  input[type='checkbox']:disabled,
  input[type='radio']:disabled {
    --b: var(--disabled);
    cursor: not-allowed;
    opacity: 0.9;
  }
  input[type='checkbox']:disabled:checked,
  input[type='radio']:disabled:checked {
    --b: var(--disabled-inner);
    --bc: var(--border);
  }
  input[type='checkbox']:disabled + label,
  input[type='radio']:disabled + label {
    cursor: not-allowed;
  }
  input[type='checkbox']:hover:not(:checked):not(:disabled),
  input[type='radio']:hover:not(:checked):not(:disabled) {
    --bc: var(--border-hover);
  }
  input[type='checkbox']:focus,
  input[type='radio']:focus {
    box-shadow: 0 0 0 var(--focus);
  }
  input[type='checkbox']:not(.switch),
  input[type='radio']:not(.switch) {
    width: 21px;
  }
  input[type='checkbox']:not(.switch):after,
  input[type='radio']:not(.switch):after {
    opacity: var(--o, 0);
  }
  input[type='checkbox']:not(.switch):checked,
  input[type='radio']:not(.switch):checked {
    --o: 1;
  }
  input[type='checkbox'] + label,
  input[type='radio'] + label {
    font-size: 0.88888em;
    line-height: 21px;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
    margin-left: 4px;
  }

  input[type='checkbox']:not(.switch) {
    border-radius: 7px;
  }
  input[type='checkbox']:not(.switch):after {
    width: 5px;
    height: 9px;
    border: 2px solid var(--active-inner);
    border-top: 0;
    border-left: 0;
    left: 7px;
    top: 4px;
    transform: rotate(var(--r, 20deg));
  }
  input[type='checkbox']:not(.switch):checked {
    --r: 43deg;
  }

  input[type='radio'] {
    border-radius: 50%;
  }
  input[type='radio']:after {
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: var(--active-inner);
    opacity: 0;
    transform: scale(var(--s, 0.7));
  }
  input[type='radio']:checked {
    --s: 0.5;
  }
}

/***セレクトボックス***/
.selectwrap {
  position: relative;
  width: 50%;
  min-width: 262px;
}
.selectwrap::after {
  position: absolute;
  top: calc(50% - 3px);
  right: 15px; /* 矢印の位置 */
  width: 6px; /* 矢印の大きさ */
  height: 6px; /* 矢印の大きさ */
  border-top: 1px solid var(--logo-blue); /* 矢印の線 */
  border-left: 1px solid var(--logo-blue); /* 矢印の線 */
  -webkit-transform: rotate(-135deg); /* 矢印の傾き */
  transform: rotate(-135deg); /* 矢印の傾き */
  pointer-events: none; /* 矢印部分もクリック可能にする */
  content: '';
}
.selectwrap select {
  appearance: none; /* デフォルトの矢印を消す */
  width: 100%; /* セレクトボックスの幅 */
  height: 55px; /* セレクトボックスの高さ */
  line-height: 55px;
  background-color: #f6fbff; /* セレクトボックスの背景色 */
  border: 1px solid #707f89; /* セレクトボックスのデフォルトの枠線を消す */
  border-radius: 7px; /* セレクトボックスの四隅の丸み */
  color: #333333; /* セレクトボックスの文字色 */
  padding: 0 15px; /* セレクトボックスの内側の余白 */
  cursor: pointer;
  position: relative;
  font-size: 0.8888em;
}
/* .selectwrap select:focus {
  outline: none; /* focus 時のデフォルトの枠線を消す 
} */
::-ms-expand {
  display: none; /* IE 対応( select のデフォルト矢印を消す) */
}

/*必須アイコン*/
span.label_req {
  display: inline-block;
  background-color: var(--logo-blue);
  border-radius: 7px;
  color: #fff;
  font-size: 0.77em;
  width: 64px;
  height: 29px;
  line-height: 29px;
  text-align: center;
  margin-right: 0.5em;
}

.en span.label_req {
  display: inline-block;
  background-color: var(--logo-blue);
  border-radius: 7px;
  color: #fff;
  font-size: 0.66em;
  width: 64px;
  height: 29px;
  line-height: 29px;
  text-align: center;
  margin-left: 1em;
}
