/* 250725 CATE NAV
------------------------------------------------------- */

/* PAGE LINK*/
.navi-center {
  width: 100vw; /* 親コンテナの影響を受けず画面幅で中央に */
  display: flex;
  justify-content: center;
  padding: 20px 0;
}

.navi-wrap {
  display: flex;
  gap: 15px;
}

.navi-btn {
  width: 150px;
  padding: 10px 5px;
  text-align: center;
  text-decoration: none;
  color: #333;
  background: #fff;
  font-family: sans-serif;
  box-sizing: border-box;
  background-color: #f9f9f9;
}
.blue01 .navi-btn {
  background-color: #E9F4FC;
}
.pink01 .navi-btn {
  background-color: #fef5f6;
}
.navi-wrap.navi-3 {
  margin:0 15px;
}

.navi-3 .navi-btn {
  width: 33.3%;
}

.navi-title {
  font-weight: bold;
  display: block;
  font-size: 13px;
  margin-bottom:5px;
  line-height: 1.1em;
}
.navi-title:after{
  content:"\A▼";
  color:#ababab;
  white-space: pre;
}
.blue01 .navi-title:after{
  content:"\A▼";
  color:#7cb2e8;
  white-space: pre;
}
.pink01 .navi-title:after{
  content:"\A▼";
  color:#f7b9c0;
  white-space: pre;
}
.navi-3 .navi-title {
  font-size: 12px;
}
.navi-3 .navi-title.smalltxt {
  font-size: 11px;
}
.navi-desc {
  font-size: 11px;
  color: #666;
  display: block; 
  line-height: 1.3!important;
}
/* //PAGE LINK*/

/* -------------------------
共通：見出しスタイル
-------------------------- */
.navi-list-ttl {
  background: #fbe7a3;
  padding: 10px;
  color: rgb(113, 65, 65);
}
#category h2.navi-list-ttl {
  margin: 0 0 20px;
  line-height: 1.3em;
  font-size: 18px;
}
.navi-list-ttl.blue01 {
  background: #e4f1fa;
  color: #000;
}

/* -------------------------
共通：アイテム基本スタイル
-------------------------- */
.scene-item,
.kind-item {
  width: 220px; /* PCデフォルト */
  text-align: center;
}
.scene-item.large {
  font-size: 1.1em;
  font-weight: bold;
}
.scene-item a:hover,
.kind-item a:hover {
  opacity: 0.6;
}

/* -------------------------
共通：アイテム中身スタイル
-------------------------- */
.item-content,
.kind-item-content {
  display: flex;
  align-items: center;
  border: 1px solid #000;
  border-radius: 6px;
  overflow: hidden;
}
.kind-item-content {
  padding:10px;
  min-height: 70px;
}
.item-content.green01 { background: #E9F8F0; }
.item-content.blue01  { background: #e4f1fa; }
.item-content.purple01{ background: #faeaf7; }
.item-content.pink01{ background: #ffe6e6; }
.item-content.pink02{ background: #fef5f6; }
.item-content.nude01{ background: #fef4e3; }
.item-content img,
.large .item-content img {
  width: 65px;
  height: 65px;
  object-fit: cover;
  margin: 2px 5px;
}
.scene-5 .item-content img {
  margin: 2px 0 2px -15px;
}

.item-text,
.kind-item-text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 5px;
}
.scene-5 .item-text,
.scene-5 .kind-item-text {
  padding: 5px 5px 5px 0;
}

.item-text strong,
.kind-item-text strong {
  font-size: 14px;
  font-weight: bold;
  text-align: left;
  line-height: 1.2em;
}
.kind-item-text strong {
  font-size: 16px;
 }
.item-text strong.txt12-txt16,
.kind-item-text strong.txt12-txt16 {
  font-size: 12px;
}

.arrow {
  font-size: 16px;
  color: #999;
}
.description {
  font-size: 12px;
  color: #666;
  margin-top: 5px;
  padding-left: 10px;
}

/* -------------------------
レイアウト：共通
-------------------------- */
.scene-block {
  margin: 0 0 40px;
}
.scene-row-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
}
.scene-5 .scene-item,
.scene-5 .kind-item {
  width: 178px;
}

/* -------------------------
PCスタイル
-------------------------- */
@media (min-width: 769px) {
	/* PAGE LINK*/
  .navi-center {
  width: 100%;
  }
  .navi-wrap {
    margin: 0 auto;
    gap: 20px;
  }
  .navi-wrap.navi-3 {
    margin: 0 auto;
  }
  .navi-btn{
    width: 200px;
    padding: 5px;
  }
  .navi-3 .navi-btn {
    width: 200px;
  }
  .navi-title,
  .navi-3 .navi-title,
  .navi-3 .navi-title.smalltxt {
    font-size: 14px;
  }
  .navi-title:after{
    font-size: .9em;
  }
  .navi-desc,
  .navi-3 .navi-desc {
    font-size: 12px;
  }
	/* //PAGE LINK*/
  .navi-list-ttl {
    scroll-margin-top: 80px;
  }
  .scene-row-top {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 20px;
  }
  .scene-row-top .scene-item.large {
    width: 380px;
  }
  .item-text strong.txt12-txt16,
  .kind-item-text strong.txt12-txt16 {
    font-size: 16px;
  }
  .i879_bunner_ttl {
    line-height: 1.2em;
  }
  .large .item-text strong {
    font-size: 16px;
    line-height: 1.2em;
  }
}


/* -------------------------
スマホスタイル（最大767px）
-------------------------- */
@media screen and (max-width: 767px) {
  .scene-block {
    margin: 0 20px 40px;
  }
  .scene-row-top,
  .scene-row-bottom {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    justify-items: center;
  }
  .scene-row-top {
    gap: 20px;
    margin-bottom: 20px;
  }
  .scene-item,
  .kind-item,
  .scene-5 .scene-item,
  .scene-5 .kind-item {
    width: 100%;
  }
  .scene-item:nth-last-child(1):nth-child(odd),
  .kind-item:nth-last-child(1):nth-child(odd),
  .scene-row-bottom .scene-item:only-child,
  .scene-row-bottom .kind-item:only-child {
    grid-column: span 2;
    justify-self: center;
  }
  .scene-row-bottom .scene-item:nth-last-child(1):nth-child(odd),
  .scene-row-bottom .kind-item:nth-last-child(1):nth-child(odd) {
    width: 60%;
    margin: 2% auto;
  }
  .item-content img, .large .item-content img {
    width: 60px;
    height: 60px;
    margin: 2px 5px 2px -20px;
  }
}

/* //250725 CATE NAV
------------------------------------------------------- */