@charset "UTF-8";
/* 共通のベーススタイル */
.depth1 {
  list-style: none;
  margin: 0;
  padding: 0;
}
.depth1 > li {
  position: relative;
}
.depth2 {
  list-style: none;
  margin: 0;
  padding: 0;
}
/* PC表示用のスタイル（769px以上） */
@media (min-width: 769px) {
  /* メインメニューを等間隔に配置 */
  /* メインメニュー項目のスタイル */
  /* メインメニューリンクのスタイル */
  /* サブメニューのスタイル - シンプルな黒地に白文字 */
  /* ホバー時にサブメニューを表示 */
  /* サブメニュー項目のスタイル */
  /* モバイル用の要素をPC表示では非表示 */
  nav ul.depth1 {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
  }
  nav ul.depth1 > li.depth1 {
    flex: 1 1 auto !important;
    text-align: center !important;
    position: relative !important;
  }
  nav ul.depth1 > li.depth1 > a {
    display: inline-block !important;
    white-space: nowrap !important;
    padding: 15px 5px !important;
  }
  .depth2 {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    min-width: 200px !important;
    background-color: #000000 !important;
    /* 黒背景 */
    padding: 10px 0 !important;
    display: none !important;
    z-index: 1000 !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2) !important;
  }
  .depth1.has_children:hover .depth2 {
    display: block !important;
  }
  .depth2 li.depth2 {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .depth2 li.depth2 a {
    display: block !important;
    padding: 8px 15px !important;
    color: #FFFFFF !important;
    /* 白文字 */
    text-decoration: none !important;
    font-size: 14px !important;
    text-align: left !important;
  }
  .mobile-dropdown-icon {
    display: none !important;
  }
}
/* モバイル表示用のスタイル（768px以下） */
@media (max-width: 768px) {
  /* サブメニューのスタイル改善 */
  /* サブメニューが表示されたときのスタイル */
  /* サブメニュー項目のスタイル改善 */
  /* サブメニューリンクのスタイル改善 */
  /* 親メニュー項目のスタイル調整 */
  /* モバイル用ドロップダウンアイコンの位置調整 */
  /* 親メニューのリンクスタイル調整 */
  /* メニュー全体の調整 */
  .depth2 {
    max-height: none !important;
    /* 高さ制限を解除 */
    width: 100% !important;
    /* 幅を100%に設定 */
    background-color: #f5f5f5 !important;
    padding: 10px 0 !important;
    margin: 5px 0 !important;
    position: static !important;
    /* 絶対配置を解除 */
    display: none;
    /* 初期状態では非表示 */
  }
  .depth2.show, .depth2[style*="display: block"], .depth2[style*="max-height:"] {
    display: block !important;
    opacity: 1 !important;
  }
  .depth2 li.depth2 {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
  }
  .depth2 li.depth2 a {
    display: block !important;
    padding: 10px 20px !important;
    color: #333 !important;
    font-size: 16px !important;
    /* フォントサイズを大きく */
    text-align: left !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .depth1.has_children {
    position: relative !important;
  }
  .mobile-dropdown-icon {
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 40px !important;
    /* サイズを大きく */
    height: 40px !important;
    /* サイズを大きく */
    line-height: 40px !important;
    text-align: center !important;
    font-size: 24px !important;
    /* フォントサイズを大きく */
    z-index: 100 !important;
  }
  .depth1.has_children > a {
    padding-right: 50px !important;
    /* アイコン用のスペースを確保 */
  }
  nav ul.depth1 {
    width: 100% !important;
  }
  nav ul.depth1 > li.depth1 {
    width: 100% !important;
    display: block !important;
    position: relative !important;
  }
}
/*# sourceMappingURL=./device_judge3.css.map */