iframe {
  display: block;
  border: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

/*footer*/
.site_info {
  justify-content: center;
  text-align: center;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  padding-bottom: 20px;
  color: #86868b;
  font-size: 12px;
  letter-spacing: 0.4px;
  margin: 15px 0 0;
}

.site_info a, .site_info a:visited {
  color: #6e6e73;
  transition: all 0.2s ease;
  text-decoration: none;
}

.site_info a:hover {
  color: #2997ff;
  text-decoration: underline;
}

.site_info_box {
  padding: 50px 0 30px;
  background: #eaeaea;
  width: 100%;
  box-sizing: border-box;
  color: #1d1d1f;
  border-top: 1px solid #d2d2d7;
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-areas: 
    "logo logo logo logo logo logo logo logo logo logo logo logo"
    "menu menu menu menu menu menu menu menu menu menu menu menu"
    "submenu submenu submenu submenu submenu submenu submenu submenu submenu submenu submenu submenu"
    "lang lang lang lang lang lang lang lang lang lang lang lang"
    "sns sns sns sns sns sns sns sns sns sns sns sns"
    "legal legal legal legal legal legal legal legal legal legal legal legal"
    "copy copy copy copy copy copy copy copy copy copy copy copy";
  row-gap: 25px;
  box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.05);
}

/* メインメニュー */
.site_info_1 {
  grid-area: menu;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 20px 0;
  position: relative;
}

.site_info_1::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  height: 1px;
  background: #d1d1d1;
}

.site_info_1 a {
  color: #424245;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.3s ease;
  white-space: nowrap;
  letter-spacing: 0.01em;
  position: relative;
  padding: 6px 0;
}

.site_info_1 a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background-color: #6e6e73;
  transition: width 0.3s ease;
  border-radius: 1px;
}

.site_info_1 a:hover {
  color: #1d1d1f;
  text-decoration: none;
}

.site_info_1 a:hover::after {
  width: 100%;
}

/* サブメニュー */
.site_info_submenu {
  grid-area: submenu;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 60px;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px 20px;
}

.submenu_column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 160px;
}

.submenu_title {
  font-weight: 600;
  color: #1d1d1f;
  margin-bottom: 12px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

.submenu_column a {
  color: #515154;
  text-decoration: none;
  font-size: 13px;
  margin-bottom: 10px;
  transition: all 0.2s ease;
  position: relative;
  padding-left: 0;
}

.submenu_column a:hover {
  color: #1d1d1f;
  padding-left: 5px;
}

/* 法的情報 */
.legal_info {
  grid-area: legal;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
}

.legal_info a {
  color: #6e6e73;
  text-decoration: none;
  font-size: 12px;
  transition: all 0.2s ease;
}

.legal_info a:hover {
  color: #1d1d1f;
  text-decoration: underline;
}

/* タイトル */
.title_all {
  grid-area: logo;
  margin: 0 auto 15px;
  padding: 10px 0;
  text-align: center;
  position: relative;
}

.title_all::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 2px;
  background: #6e6e73;
  border-radius: 2px;
  opacity: 0.5;
}

.site_info_title {
  width: 350px;
  opacity: 0.85;
  transition: all 0.3s ease;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1)) grayscale(30%);
}

.site_info_title:hover {
  opacity: 1;
  transform: scale(1.05);
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.15)) grayscale(0%);
}

/* コピーライト */
.copyright {
  grid-area: copy;
  font-size: 12px;
  color: #86868b;
  font-weight: 400;
  letter-spacing: 0.3px;
  text-align: center;
  margin-top: 15px;
}

/* SNSセクション */
.sns_section {
  grid-area: sns;
  display: flex;
  justify-content: center;
  gap: 20px;
  margin: 0 auto;
}

.sns_section img {
  height: 24px;
  width: auto;
  opacity: 0.7;
  transition: all 0.3s ease;
  filter: grayscale(70%);
}

.sns_section img:hover {
  opacity: 1;
  transform: translateY(-3px);
  filter: grayscale(0%);
}

/* lsクラスはそのまま維持 */
.ls {
  grid-area: lang;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  padding: 0;
  max-width: 300px;
}

.ls img {
  height: 24px;
  width: auto;
  margin-right: 10px;
  opacity: 0.8;
}

.ls p {
  margin: 0 5px;
  font-size: 13px;
  color: #424245;
}

.ls a {
  padding: 3px 8px;
  border-radius: 4px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.ls a p {
  margin: 0;
  color: #424245;
}

.ls a:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

.ls a:hover p {
  color: #1d1d1f;
}

/* レスポンシブデザイン */
@media screen and (max-width: 768px) {
  .site_info_box {
    padding: 40px 15px 20px;
    row-gap: 20px;
    grid-template-areas: 
      "logo logo logo logo logo logo logo logo logo logo logo logo"
      "menu menu menu menu menu menu menu menu menu menu menu menu"
      "submenu submenu submenu submenu submenu submenu submenu submenu submenu submenu submenu submenu"
      "lang lang lang lang lang lang lang lang lang lang lang lang"
      "sns sns sns sns sns sns sns sns sns sns sns sns"
      "legal legal legal legal legal legal legal legal legal legal legal legal"
      "copy copy copy copy copy copy copy copy copy copy copy copy";
  }
  
  /* メインメニューを横並びにして折り返し対応 */
  .site_info_1 {
    flex-direction: row; /* 縦から横に変更 */
    flex-wrap: wrap; /* 折り返しを有効化 */
    justify-content: center;
    gap: 15px 20px; /* 縦の間隔15px、横の間隔20px */
    width: 100%;
    text-align: center;
    padding: 10px 0 20px;
    max-width: 100%;
  }
  
  .site_info_1 a {
    display: inline-block;
    padding: 8px 12px; /* 左右のパディングを追加 */
    font-size: 14px; /* フォントサイズを少し小さく */
    white-space: nowrap; /* テキストの改行を防ぐ */
    min-width: auto; /* 最小幅を自動に */
    flex: 0 0 auto; /* フレックスアイテムのサイズを内容に合わせる */
  }
  
  .site_info_1 a::after {
    left: 50%;
    transform: translateX(-50%);
  }

  /* サブメニューも同様に調整 */
  .site_info_submenu {
    flex-direction: row; /* 横並びに変更 */
    flex-wrap: wrap; /* 折り返しを有効化 */
    justify-content: center;
    align-items: flex-start; /* 上揃えに変更 */
    gap: 20px 30px; /* 縦20px、横30pxの間隔 */
    padding-bottom: 10px;
  }

  .submenu_column {
    align-items: center;
    width: auto; /* 幅を自動に */
    min-width: 120px; /* 最小幅を設定 */
    flex: 0 0 auto; /* サイズを内容に合わせる */
  }
  
  .submenu_column a {
    text-align: center;
    margin-bottom: 8px; /* 間隔を少し狭く */
    font-size: 12px; /* フォントサイズを調整 */
  }

  /* 法的情報も横並びで折り返し */
  .legal_info {
    flex-direction: row; /* 横並びに変更 */
    flex-wrap: wrap; /* 折り返しを有効化 */
    justify-content: center;
    gap: 10px 15px; /* 間隔を調整 */
    align-items: center;
    padding: 15px 0;
  }
  
  .legal_info a {
    font-size: 11px; /* フォントサイズを小さく */
    white-space: nowrap; /* 改行を防ぐ */
  }
  
  .site_info_title {
    width: 200px;
  }
  
  .title_all::after {
    width: 50px;
  }
  
  .ls {
    flex-wrap: wrap;
    margin-bottom: 15px;
    justify-content: center;
    gap: 5px 10px; /* 間隔を調整 */
  }

  /* SNSセクションも調整 */
  .sns_section {
    gap: 15px; /* 間隔を調整 */
    flex-wrap: wrap;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .site_info_box {
    padding: 50px 20px 30px;
    row-gap: 20px;
  }
  
  .site_info_1 {
    gap: 25px;
    padding: 15px 0;
  }

  .site_info_submenu {
    gap: 40px;
  }

  .submenu_column {
    min-width: 140px;
  }
  
  .site_info_title {
    width: 330px;
  }
}