@charset "UTF-8";
/*---------------------------------------------------------------
　　　common
---------------------------------------------------------------*/
@import url(nav.css);
html {
  font-size: 62.5%; }

.forSP {
  display: none; }
  @media all and (max-width: 959px) {
    .forSP {
      display: block; } }

.forPC {
  display: block; }
  @media all and (max-width: 959px) {
    .forPC {
      display: none; } }

img {
  width: 100%; }

a {
  text-decoration: none; }

body {
  background: url(../img/parts/bg.png) repeat top center;
  margin: 0;
  padding: 0;
  font-family: 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 1.8rem;
  color: #333; }
  @media all and (max-width: 959px) {
    body {
      font-size: 1.6rem; } }

/* Toggle Button */
#nav-toggle {
  position: absolute;
  right: 12px;
  top: 14px;
  width: 80px;
  height: 80px;
  cursor: pointer;
  z-index: 9000 !important;
  background: rgba(51, 152, 49, 0.8);
  border-radius: 50px; }
  #nav-toggle div {
    position: relative;
    width: 40%;
    height: 35px;
    margin: 20px auto; }
  #nav-toggle p {
    color: white;
    font-weight: bold;
    position: absolute;
    bottom: 12px;
    width: 100%;
    font-size: 1.2rem;
    text-align: center; }

#nav-toggle span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background: white;
  left: 0;
  -webkit-transition: .35s ease-in-out;
  -moz-transition: .35s ease-in-out;
  transition: .35s ease-in-out; }

#nav-toggle span:nth-child(1) {
  top: 0; }

#nav-toggle span:nth-child(2) {
  top: 11px; }

#nav-toggle span:nth-child(3) {
  top: 22px; }

/*スマホ*/
#top-head,
.inner {
  width: 100%;
  padding: 0; }

#top-head {
  top: 0;
  position: fixed;
  margin-top: 0;
  z-index: 8000 !important; }

/* Fixed reset */
#top-head.fixed {
  padding-top: 0;
  background: transparent; }

/*#mobile-head {
    width: 100%;
    height: 56px;
    z-index: 999;
    position: relative;
}*/
#global-nav {
  position: absolute;
  /* 開いてないときは画面外に配置 */
  top: -550px;
  background: white;
  width: 100%;
  text-align: center;
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  z-index: 500; }
  #global-nav ul {
    list-style: none;
    position: static;
    right: 0;
    bottom: 0;
    padding: 0 100px 0 0;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    z-index: 600; }
    @media all and (max-width: 959px) {
      #global-nav ul {
        padding: 60px 0 0; } }
    #global-nav ul li {
      border-bottom: 1px solid #339831;
      width: calc(100%/6);
      margin: 0; }
      @media all and (max-width: 959px) {
        #global-nav ul li {
          width: 100%; } }
      #global-nav ul li a {
        width: 100%;
        display: block;
        color: #339831;
        padding: 10px 0;
        background: white;
        font-family: "UD Shin Maru Go DemiBold";
        line-height: 3;
        transition: all .3s; }
        #global-nav ul li a:hover {
          background: #f8b62d;
          color: white; }

#nav-toggle {
  display: block; }

/* #nav-toggle 切り替えアニメーション */
.open #nav-toggle span:nth-child(1) {
  top: 11px;
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  transform: rotate(315deg); }

.open #nav-toggle span:nth-child(2) {
  width: 0;
  left: 50%; }

.open #nav-toggle span:nth-child(3) {
  top: 11px;
  -webkit-transform: rotate(-315deg);
  -moz-transform: rotate(-315deg);
  transform: rotate(-315deg); }

/* #global-nav スライドアニメーション */
.open #global-nav {
  /* #global-nav top + #mobile-head height */
  -moz-transform: translateY(550px);
  -webkit-transform: translateY(550px);
  transform: translateY(550px); }

/*# sourceMappingURL=nav.css.map */
