@charset "UTF-8";
h2.top-title {
  padding: 2.5em 0;
  font-weight: 500;
  z-index: 2; }
  @media screen and (max-width: 768px) {
    h2.top-title {
      padding: 2em 0 1em; } }

h2 {
  position: relative;
  margin-bottom: 0.2rem;
  font-weight: bold;
  font-size: 26px;
  text-align: center;
  color: #004094; }
  h2::before {
    font-family: "Oswald", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    color: #c7ddf9;
    font-size: 80px;
    text-transform: uppercase;
    z-index: -1; }
    @media screen and (max-width: 768px) {
      h2::before {
        font-size: 60px; } }
    @media screen and (max-width: 576px) {
      h2::before {
        font-size: 40px;
        top: 15px; } }
  h2.top-title-massage::before {
    content: 'message'; }
    @media screen and (max-width: 576px) {
      h2.top-title-massage::before {
        font-size: 35px; } }
  h2.top-title-news::before {
    content: 'news'; }
  h2.top-title-profile {
    color: #FFF; }
    h2.top-title-profile::before {
      content: 'profile';
      color: #0f87bf; }
  h2.top-title-instagram::before {
    content: 'Instagram';
    font-size: 60px; }
    @media screen and (max-width: 768px) {
      h2.top-title-instagram::before {
        font-size: 32px; } }
    @media screen and (max-width: 576px) {
      h2.top-title-instagram::before {
        font-size: 29px; } }
  h2.top-title-policy::before {
    content: 'policy'; }
  h2.top-title-support {
    color: #FFF; }
    h2.top-title-support::before {
      content: 'support';
      color: #0f87bf; }
  h2.top-title-access::before {
    content: 'access'; }

section.profile, section.support {
  background: #004094;
  color: #FFF; }

/*------------------------------------------------------
 common
-------------------------------------------------------*/
section {
  padding: 50px 0 100px 0; }
  section p {
    font-size: 18px; }
  @media screen and (max-width: 768px) {
    section {
      padding: 30px 10px 60px 10px; }
      section p {
        font-size: 14px; } }

/*------------------------------------------------------
 メインビジュアル
-------------------------------------------------------*/
.mainvisual {
  padding: 47px 0; }
  @media screen and (max-width: 768px) {
    .mainvisual {
      padding: 20px 10px; } }

/*------------------------------------------------------
 News
-------------------------------------------------------*/
.tab-menu {
  display: flex;
  justify-content: space-between;
  list-style: none;
  padding: 0;
  margin: 0 0 10px;
  text-align: center; }
  .tab-menu .tab {
    width: calc(100% / 5 - 5px);
    padding: 10px 0;
    cursor: pointer;
    border-bottom: none;
    background: #111;
    color: #FFF; }
    @media screen and (max-width: 576px) {
      .tab-menu .tab {
        font-size: 0.6em;
        width: calc(100% / 5 - 3px); } }
    .tab-menu .tab.active {
      background: #004094;
      font-weight: bold; }
      .tab-menu .tab.active.category-action {
        background-color: #025cd3; }
      .tab-menu .tab.active.category-question {
        background-color: #0f87bf; }
      .tab-menu .tab.active.category-notice {
        background-color: #0099aa; }

.tab-content {
  display: none;
  padding: 15px;
  background: #fff; }
  .tab-content.active {
    display: block; }

section.news .news-pickup-wrap a {
  display: block;
  width: 100%;
  border-radius: 10px;
  padding: 1rem;
  text-decoration: none;
  color: #111; }
  section.news .news-pickup-wrap a img {
    object-fit: cover;
    width: 100%;
    height: 250px; }
  section.news .news-pickup-wrap a:hover {
    background: #F4F4F4; }

/*------------------------------------------------------
 about
-------------------------------------------------------*/
section.about .about-circle {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 5%; }
  section.about .about-circle img {
    width: 300px;
    height: 290px;
    object-fit: cover;
    border-radius: 50%; }

/*------------------------------------------------------
 messege
-------------------------------------------------------*/
section.messege .vertical-text-con {
  position: relative; }
section.messege .vertical-text-wrap {
  position: absolute;
  right: 50%;
  background: #004094;
  color: #FFF;
  padding: 1rem;
  margin: 2rem auto; }
  @media screen and (max-width: 768px) {
    section.messege .vertical-text-wrap {
      position: static;
      right: auto;
      margin: 2rem auto;
      width: 180px;
      display: flex;
      justify-content: center;
      align-items: center; } }
  section.messege .vertical-text-wrap .vertical-text {
    writing-mode: vertical-rl;
    text-orientation: upright; }
section.messege img.profile {
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 0 1rem; }
section.messege img.signature {
  width: 100%;
  max-width: 150px;
  height: auto;
  margin: 0 1rem; }
section.messege a.pagelinks span {
  padding: 0 10px; }

/*------------------------------------------------------
 policy
-------------------------------------------------------*/
section.policy p {
  margin: 0 auto 1.5rem; }
section.policy .policy-title {
  background: #004094;
  color: #FFF;
  padding: 10px 1em;
  font-size: 23px;
  font-weight: bold; }
section.policy .policy-img img {
  object-fit: cover;
  width: 100%;
  height: 250px; }
  section.policy .policy-img img.object-top {
    object-position: 0 0; }
section.policy .policy-links {
  display: flex;
  align-content: space-between;
  flex-wrap: wrap; }
  section.policy .policy-links .policy-links-btn {
    width: 100%;
    display: flex;
    justify-content: flex-end; }

/*------------------------------------------------------
 support
-------------------------------------------------------*/
section.profile img {
  max-height: 400px; }
  @media screen and (max-width: 576px) {
    section.profile img {
      max-height: 300px; } }

/*------------------------------------------------------
 support
-------------------------------------------------------*/
section.support .row .support-item {
  background: #FFF;
  width: 100%;
  max-width: 320px;
  padding: 1rem 1.5rem;
  color: #111;
  display: flex;
  align-content: space-between;
  flex-direction: column; }
  section.support .row .support-item p {
    line-height: 1.4; }
  @media screen and (max-width: 768px) {
    section.support .row .support-item {
      margin-bottom: 1rem; } }
  section.support .row .support-item h4 {
    font-size: 28px;
    font-weight: bold;
    text-align: center;
    color: #004094; }
section.support .support-links {
  height: 100%;
  display: flex;
  align-items: flex-end;
  text-align: center;
  justify-content: center; }

/*------------------------------------------------------
 access
-------------------------------------------------------*/
section.access .map-wrap {
  width: 98%;
  max-width: 1000px;
  margin: 0 auto; }
section.access h3 {
  color: #004094;
  font-weight: bold; }
