@charset "UTF-8";
/*----------------------------------------
表示を切り替える幅
----------------------------------------*/
/*----------------------------------------
フォント
----------------------------------------*/
/*----------------------------------------
カラー 
----------------------------------------*/
/*--------ガムシス ----------*/
/*--------コーポレートサイト ----------*/
/*----------------------------------------
カラー 
----------------------------------------*/
/*----------------------------------------
フォント
----------------------------------------*/
/*----------------------------------------
カラー 
----------------------------------------*/
/*----------------------------------------
フォント
----------------------------------------*/
/*----------------------------------------
表示を切り替える幅
----------------------------------------*/
/*----------------------------------------
ブレークポイント
----------------------------------------*/
@media screen and (max-width: 767px) {
  .area_main_c {
    width: 100%;
    margin-top: 0px;
  }
  .area_backglund_image {
    top: 0;
  }
  .header_c {
    top: auto;
    bottom: 10vmin;
    flex-direction: column;
    justify-content: center;
    pointer-events: none;
    height: auto;
    padding-top: 0;
    background-color: rgba(255, 255, 255, 0);
  }
  .nav_header_c {
    position: relative;
    top: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    text-align: center;
    height: auto;
    padding-right: 0;
  }
  .button_menu_header_c {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    text-align: center;
    pointer-events: auto;
    width: 18vmin;
    height: 18vmin;
    color: white;
    font-weight: 900;
    background-color: #616161;
    border-radius: 1000px;
    border: 1.5vmin solid #ff8800;
    box-shadow: 0 0 0 0px #ff8800;
    animation-name: menuEmphasis;
    animation-duration: 2s;
    animation-iteration-count: infinite;
  }
  @keyframes menuEmphasis {
    0% {
      box-shadow: 0 0 0 0px #ff8800;
    }
    100% {
      box-shadow: 0 0 0 15px rgba(255, 136, 0, 0);
    }
  }
  .menu_OODOUGU_header_c {
    border: 1.5vmin solid #f5d933;
    animation-name: menuEmphasisOODOUGU;
    animation-duration: 2s;
    animation-iteration-count: infinite;
  }
  @keyframes menuEmphasisOODOUGU {
    0% {
      box-shadow: 0 0 0 0px #f5d933;
    }
    100% {
      box-shadow: 0 0 0 15px rgba(45, 62, 159, 0);
    }
  }
  .ul_header_c {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: auto;
    width: auto;
  }
  .ul_header_c.active .li_header_c {
    transform: translate(calc(var(--x)), calc(var(--y))) scale(0.9);
    opacity: 1;
  }
  .li_header_c {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: auto;
    margin-right: 0;
    opacity: 0;
    transition: transform 0.5s ease, opacity 0.5s ease;
    --angle: calc(195deg + calc(150deg / 4 * var(--index)));
    --x: calc(cos(var(--angle)) * 30vw);
    --y: calc(sin(var(--angle)) * 33vw);
    transform: translate(calc(var(--x)), calc(var(--y))) scale(0.4);
  }
  .li_header_centerY_c {
    --x: calc(cos(var(--angle)) * 34vw);
  }
  .li_header_centerX_c {
    --y: calc(sin(var(--angle)) * 43vw);
  }
  .li_header_c.active {
    animation-name: liHeaderIN;
    animation-duration: 0.3s;
    animation-fill-mode: forwards;
  }
  @keyframes liHeaderIN {
    0% {
      opacity: 0;
      transform: translate(calc(var(--x)), calc(var(--y))) scale(0.4);
    }
    100% {
      opacity: 1;
      transform: translate(calc(var(--x)), calc(var(--y))) scale(0.9);
    }
  }
  .button_header_c {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    cursor: pointer;
    height: 17vmin;
    padding: 0px 0;
    color: white;
    font-size: 4.2vmin;
    background-color: #616161;
    border: 1.2vmin solid #00b7ff;
    border-radius: 1000px;
    box-shadow: 0 0 5vmin rgb(255, 255, 255);
  }
  .button_OODOUGU_header_c {
    color: rgb(0, 0, 0);
    background-color: #ffffff;
    border: none;
    box-shadow: 0 0 5vmin rgb(113, 113, 113);
  }
  .area_button_header_c {
    display: flex;
    align-items: center;
  }
  .footer_c {
    display: block;
    align-items: center;
    width: 100%;
    padding: 10px 10px;
    padding-bottom: 150px;
    z-index: 8999;
  }
  .area_footer {
    margin-top: 30px;
  }
  .title_footer_c {
    font-size: 18px;
  }
  .button_footer_c {
    font-size: 16px;
  }
  .text_footer_c {
    font-size: 14px;
  }
  .area_pagemap_c {
    display: none;
  }
}/*# sourceMappingURL=SP_common_ver1.0.css.map */