@charset "utf-8";
@media screen and (max-width: 1300px) {
  /* ----------------------------------------------- */
  html {
    font-size: 61%;
  }
  /* ----------------------------------------------- wrapper */
  #wrapper {}
  /* ----------------------------------------------- float */
  .f_left {}
  .f_right {}
  .clear {}
  /* ----------------------------------------------- header */
  header {}
  header h1 {}
  header .header_right {}
  header h1 a:hover,
  header .header_right a:hover {}
/* language */
  header .header_right .language {}
  header .header_right .language li {}
  header .header_right .language li a {}
  header .header_right .language li a:link,
  header .header_right .language li a:visited,
  header .header_right .language li a:active {}
  header .header_right .language li a:hover {}
  header .header_right .language li.on a {}
  header .header_right .language li.on a:link,
  header .header_right .language li.on a:visited,
  header .header_right .language li.on a:active {}
  /* serach */
  header .header_right .serach {}
  header .header_right .serach input[type="text"] {
    font-size: 1.4rem;
  }
  header .header_right .serach ::placeholder { }
  header .header_right .serach input[type="submit"] {}
  @media screen and (max-width: 920px) {
    header {
      height: 80px;
      align-items: center;
    }
    header h1 {
      padding-top: 5px;
    }
    header h1 img {
      width: 80%;
      max-width: 427px;
      height: auto;
    }
    header .header_right .language {
      width: auto;
      padding-right: 60px;
      display: block;
      border: none;
    }
    header .header_right .language li {
      width: auto;
    }
    header .header_right .language li a {
      display: inline-block;
      padding: 7px 15px;
      background-color: #e1e6f9;
    }
    header .header_right .language li.on,
    header .header_right .serach {
      display: none;
    }
  }
  /* -------------------------------------------------- overlay */
  @media screen and (max-width: 920px) {
    .overlay {/*
      width: 100%;
      height: 100%;
      position: fixed;
      z-index: 10000;
      background: #11206d;
      background: linear-gradient(145deg,rgba(17, 32, 109, 1) 0%, rgba(28, 65, 124, 1) 100%);
      display: none;
      top: 80px;
      left: 0;*/
    }
  }
  /* -------------------------------------------------- nav */
  #nav {}
  #nav .toggle {}
  #nav nav {}
  #nav nav .serach {}
  #nav nav ul {}
  #nav nav ul li {}
  #nav nav ul a {
    padding: 17px 5px;
  }
  #nav nav ul li:last-child a {
    border-right: none;
  }
  #nav nav ul a span {
    font-size: 1.4rem;
    padding-right: 15px;
  }
  #nav nav ul a span::before {}
  #nav nav ul li:hover a {}
  #nav nav ul li:hover {}
  #nav nav ul li:hover a span {}
  #nav nav ul li:hover a span::before {}
  #nav nav ul a.on {/*on*/}
  #nav nav ul a.on::before {}
  @media screen and (max-width: 920px) {
    #nav {
      position: absolute;
      z-index: 200000;
      width: 100%;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      pointer-events: none;
      /*overflow-y: auto;*/
    }
    #nav .toggle * {
      margin: 0;
      padding: 0;
      outline: none;
      border: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      pointer-events: auto;/**/
    }
    #nav .toggle {
      position: absolute;
      display: block;
      top: 15px;
      right: 15px;
      z-index: 100000;
      width: 50px;
      height: 50px;
      background: #11206d;
      background: linear-gradient(145deg,rgba(17, 32, 109, 1) 0%, rgba(28, 65, 124, 1) 100%);
      border-radius: 100%;
      cursor: pointer;
      outline: none;
      pointer-events: auto;/**/
    }
     #nav .toggle span {
      position: absolute;
      display: block;
      width: 20px;
      height: 3px;
      transition: all 0.2s;
      transform-origin: 0% 0%;
      transform: translateY(-50%);
      background-color: #fff;
      border-radius: 20px;
      right: 19px;
    }
     #nav .toggle .bar01 {
      top: 33%;
    }
     #nav .toggle .bar02 {
      top: 50%;
    }
     #nav .toggle .bar03 {
      top: 66%;
    }
    /**/
     #nav .toggle.active span {
      width: 30px;
      right: 7px;
    }
     #nav .toggle.active .bar01 {
      transform: rotate(0.6rad) translateY(-50%);
    }
     #nav .toggle.active .bar02 {
      opacity: 0;
    }
     #nav .toggle.active .bar03 {
      transform: rotate(-0.6rad) translateY(-50%);
    }
    /**/
    #nav .toggle span::before {
      position: absolute;
      content: '';
      top: -1px;
      right: -8px;
      width: 4px;
      height: 4px;
      border-radius: 10px;
      background-color: #fff;
    }
    #nav .toggle.active span::before {
      display: none;
    }
    /**/
    #nav nav {
      display: none !important;
      padding-bottom: 30px;
    }
    #nav .active {
      display: block !important;
    }
    /**/
    #nav nav {
      position: absolute;
      top: 80px;
      left: 0;
      z-index: 10000;
      pointer-events: auto;/**/
      overflow-y: scroll;
      width: 100%;
      height: 100%;
      background: #11206d;
      background: linear-gradient(145deg,rgba(17, 32, 109, 1) 0%, rgba(28, 65, 124, 1) 100%);
    }
    #nav nav ul {
      display: -webkit-block;
      display: block;
      width: 100%;
    }
    #nav nav ul li {
      width: 100%;
      margin: 0px;
      padding: 0px;
    }
    /**/
    #nav nav ul li a {
      position: relative;
      display: block;
      padding: 12px 30px;
      text-decoration: none;
    }
    #nav nav ul li a::after {
      position: absolute;
      content: '';
      top: 20px;
      right: 30px;
      width: 8px;
      height: 8px;
      border-top: 2px solid #fff;
      border-right: 2px solid #fff;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
      transition: .4s;
    }
    #nav nav ul a span {
      color: #fff;
      text-decoration: none;
    }
    /* serach */
    #nav nav .serach {
      display: block;
      text-align: center;
      margin: 30px auto;
    }
    #nav nav .serach input[type="text"] {
      width: 80%;
      padding: 8px 15px;
      background-color: #fff;
      border: none;
      border-radius: 30px;
      text-align: left;
    }
    #nav nav .serach ::placeholder {
      color: #9b9b9b;
    }
    #nav nav .serach input[type="submit"] {
      margin-left: 5px;
      width: 45px;
      height: 45px;
      background-color: rgba(255,255,255,0.2);
      border-radius: 100%;
      background-image: url("../img/search.svg");
      background-position: center;
      background-size: 20px auto;
      background-repeat: no-repeat;
    }
  }
  /* ----------------------------------------------- link > dot */
  .link_dot {}
  .link_dot::before {
    width: 18px;
    height: 18px;
  }
  .link_dot:hover::before {}
  @media screen and (max-width: 920px) {
    .link_dot::before {
      width: 15px;
      height: 15px;
    }
  }
  /* ----------------------------------------------- footer */
  footer {}
  footer .inner {}
  footer .inner p img {}
  footer .inner p.jsom,
  footer .inner p.jsom span {
    font-size: 1.3rem;
  }
  footer .inner p.jsom span {
    font-size: 1.5rem;
  }
  footer .inner address {
    font-size: 1.2rem;
  }
  /* footer_navi */
  footer .footer_navi {}
  footer .footer_navi li {
    width : calc(100%/5);
    text-align: left;
    padding: 15px;
  }
  footer .footer_navi li a:link,
  footer .footer_navi li a:active,
  footer .footer_navi li a:visited {
    font-size: 1.5rem;
  }
  /**/
  footer .inner p.copy {}
  @media screen and (max-width: 920px) {
    footer .footer_navi {
      display: none;
    }
    footer .inner p.copy {
      padding-top: 30px;
      text-align: center;
    }
  }
  /* ----------------------------------------------- pagetop*/
  .pagetop {}
  .pagetop a {}
  .pagetop a::before {}

}