@charset "UTF-8";

/*スマホ設定*/
/*----------------------------------------------------------------*/
/*ナビゲーション展開時に背景を固定*/
body.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
}

/*----------------------------------------------------------------*/
/*タップ時のハイライトを削除*/
a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/*----------------------------------------------------------------*/
/*----------------------------------------------------------------*/
/*スマホ用オーバーレイナビゲーション*/
/*ナビゲーションの背景 初期状態では非表示*/
nav.overlay {
  visibility: hidden;
  position: fixed;
  width: 100%;
  height: 0;
  background: #000;
  padding: 80px 0 12px 0;
  top: 0;
  right: 0;
  opacity: 0;
  box-shadow: 0px 0px 100px 30px rgba(0, 0, 0, 0.1) inset;
  /*透明度、表示を変更、高さを変更する際のアニメーション設定*/
  -webkit-transition: opacity .35s, visibility .35s, height .35s;
  /*PAGETOPリンクは100とする*/
  z-index: 98;
  /*スクロールをスムーズに設定*/
  -webkit-overflow-scrolling: touch;
}

.big {
  width: 200px;
  max-width: auto;
}


/*レイアウト*/
nav.overlay .inner {
  margin: 0 auto;
}

/*ナビゲーションのリスト 初期状態では非表示*/
nav.overlay .inner ul {
  /*visibility: hidden;*/
  -webkit-transition: opacity .001s, visibility .001s, height .001s;
}

/*----------------------------------------------------------------*/
/*#navToggleをクリックで.overlayに追加するクラス*/
nav.overlay.overlay-active {
  opacity: .94;
  visibility: visible;
  overflow: auto;
  height: 100%;
  /*max-height: 340px;*/
  -webkit-transition: opacity .35s, visibility .35s, height .35s;
  z-index: 98;
}

/*#navToggleをクリックで.inner ulに追加するクラス*/
nav.overlay .inner ul.innerUl-active {
  opacity: .94;
  visibility: visible;
  /*overflow: auto;*/
  z-index: 98;
  /*透明度、表示を変更、高さを変更する際のアニメーション設定*/
  -webkit-transition: opacity .001s, visibility .001s, height .001s;
}

/*----------------------------------------------------------------*/
/*ハンバーガーメニュー*/
#navToggle {
  position: absolute;
  width: 40px;
  height: 40px;
  background: url("./_image/nav_open.svg") no-repeat center top/100% auto;
  top: 10px;
  /*fixedで親要素を起点にする場合はleftを指定しない*/
  right: 10px;
  /*テキストを非表示*/
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  box-sizing: border-box;
  /*カーソルをリンクマークに変更*/
  cursor: pointer;
  z-index: 999998;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

}

/*ハンバーガーメニュー 閉じるボタンに切り替え*/
#navToggle.navToggle-active {
  background: url("./_image/nav_close.svg") no-repeat center top/100% auto;
  opacity: .7;
  z-index: 999999;
}

/*----------------------------------------------------------------*/
@media screen and (min-width:480px) and (max-width:600px) {
  /*--------------------------------------------------------end@media*/
}

@media screen and (min-width:600px) and (max-width:960px) {
  /*　iPad用 画面サイズが600pxから960pxまではここを読み込む　*/
  /*--------------------------------------------------------end@media*/
}

@media screen and (min-width:960px) and (max-width:1280px) {
  /*　小型PC用 画面サイズが960pxから1280pxまではここを読み込む　*/
  /*--------------------------------------------------------end@media*/
}

@media screen and (min-width:1280px) {
  /*　大型PC用 画面サイズが1280pxからはここを読み込む　*/
  /*--------------------------------------------------------end@media*/
}

@media screen and (min-width:668px) {

  /*----------------------------------------------------------------*/
  /*　PC用 画面サイズが668pxからはここを読み込む　*/

  nav.overlay2 {
    visibility: visible;
    position: relative;
    width: 100%;
    padding: 0;
    top: 0;
    right: 0;
    opacity: 1;
    box-shadow: 0px 0px 0 0 rgba(0, 0, 0, 0) inset;
    /*PAGETOPリンクは100とする*/
    z-index: 98;
    /*スクロールをスムーズに設定*/
    -webkit-overflow-scrolling: touch;
    z-index: 10;
  }

  /*レイアウト*/
  nav.overlay2 .inner {
    position: relative;
    background: rgba(0, 0, 0, 0.7);
    margin: 0 auto;
    padding: 8px 20px 10px;
    mix-blend-mode: multiply;
  }


  /*----------------------------------------------------------------*/
  /*ハンバーガーメニュー*/
  /*PCではボタンを非表示*/
  #navToggle {
    display: none;
  }

  /*--------------------------------------------------------end@media*/
}

@media screen and (max-width: 320px) {
  /*　iPhone5用 画面サイズが320px以下はここを読み込む　*/
  /*--------------------------------------------------------end@media*/
}