/* ======================================= */
/* transportations */
/* ======================================= */

/* 色 */
:root { 
--bg-1:#f1fbff;
--tr-bl:#1068c1;
--tr-gr:#b9e700;
--or:#ea5a46;
--bottom-content:#d4f28f;
}

/* 汎用 */
.w700 { font-weight:700; }
.color-tr-bl { color:var(--tr-bl); }
.color-or { color:var(--or); }

/* ベース */
.transportations-content { background-color:var(--bg-1); padding:40px 0 0 0; }

/* 見出し */
.page-midashi { font-size:20px; line-height:30px; letter-spacing:1px; padding:0 20px; margin-bottom:20px; }

/* タブ切り替えボタン */
.flight-tabs { justify-content:space-between; padding:0 20px; }
.flight-tabs__btn { border-bottom:3px solid transparent; opacity:0.6; }
.flight-tabs__btn.is-active { border-bottom:3px solid var(--tr-gr); opacity:1; }
.flight-tabs__label { font-size:11px; font-weight:400; }
.flight-tabs__name { font-size:20px; font-weight:700; line-height:30px; letter-spacing:1px; }
.flight-tabs__code { font-size:14px; line-height:16px; letter-spacing:0.42px; }

/* 切り替わるタブ部分 */
.flight-panels__item { display:none; }
.flight-panels__item.is-active { display:block; }

/* コンテンツ内部 */
.content-innar { padding:0 20px; }
.root { font-size:18px; font-weight:700; line-height-step:26px; letter-spacing:0.9px; }

/* コンテンツ二つ目 */
.second-content { background-color:#b5d9e9; padding-top:40px; }

/* アコーディオン格納リスト */
.vehicles { display:flex; flex-direction:column; gap:4px; padding:10px 0; }
.vehicles .vehicles-item { background-color:var(--wh); border:2px solid #d4f28f; display:flex; flex-direction:column; width:100%; }
.vehicles .vehicles-item .all-content { align-items:center; cursor:pointer; display:flex; gap:20px; justify-content:space-between; padding:20px; }
.vehicles-midashi { font-size:18px; font-weight:700; line-height:26px; letter-spacing:0.9px; margin-bottom:9px; }
.gray-text { color:#a3a3a3; font-size:14px; font-weight:700; line-height:16px; letter-spacing:0.42px; }
.attention { color:var(--tr-bl); font-size:14px; line-height:16px; letter-spacing:0.42px; }
.acc-open { background-color:#f6f6f6; }
.acc-open .img img { max-width:100%; width:100%; }
.acc-open-text { padding:0 20px 30px 20px; }
.acc-open-text p, .acc-open-text li { font-size:14px; font-weight:500; line-height:16px; letter-spacing:0.42px; }
.acc-open-text p.naka-midashi { font-size:16px; font-weight:600; margin:16px 0; }
.acc-open-text a { text-decoration:underline; }
.acc-2 { padding:15px 0; }
.acc-2.last-acc-2 { padding:0 0 15px 0; }
.acc-2-button { background-color:var(--bottom-content); cursor:pointer; font-size:16px; font-weight:500; line-height:20px; letter-spacing:0.48px; padding:20px 8px; width:100%; }
.acc-2-open img { max-width:100%; width:100%; }

/* +/- アイコン（CSS疑似要素で描画） */
.acc-icon {
  padding-right:10px;
  position: relative;
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.acc-icon::before,
.acc-icon::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  background:var(--tr-bl);
  transition:transform .3s ease;
}
/* 横棒（常に表示） */
.acc-icon::before {
  width: 16px;
  height: 2px;
  transform: translate(-50%, -50%);
}
/* 縦棒（開くと回転して消える） */
.acc-icon::after {
  width: 2px;
  height: 16px;
  transform: translate(-50%, -50%);
}
.is-open .acc-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

/* 展開コンテンツ内側の余白 */
.acc-open__inner {
  padding: 16px 0;
}

.acc-2-button {
  background-color: var(--bottom-content);
  cursor: pointer;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0.48px;
  padding: 20px 8px;
  width: 100%;
  text-align: left;
  position: relative;
  padding-left: 28px;    /* アイコン分の余白 */
}

/* ▶ アイコン（閉じ） */
.acc-2-button::before {
  content: '';
  position: absolute;
  left: 10px;
  top: 50%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 8px;
  border-color: transparent transparent transparent var(--or);
  transform: translateY(-50%);
  transition: transform .3s ease;
}

/* ▼ アイコン（開き） */
.acc-2.is-open .acc-2-button::before {
  transform: translateY(-50%) rotate(90deg);
}

/* タブ切り替え以外のコンテンツ */
.bottom-content { background-color:var(--bottom-content); padding:40px 0; }
.bottom-content .bottom-title { font-size:20px; font-weight:700; line-height:30px; letter-spacing:1px; position:relative; margin-bottom:32px; width:fit-content; z-index:1; }
.bottom-title::after { aspect-ratio:210/180; background-size:contain; background-repeat:no-repeat; background-position:center; background-image:url('../img/transportation/ticket.png'); content:''; display:inline-block; position:absolute; top:-50%; right:0; transform:translateY(-30%) translateX(40px); height:100px; width:117px; z-index:-1; }
.bottom-content h3 { color:var(--tr-bl); font-size:20px; font-weight:700; line-height:30px; letter-spacing:1px; margin-bottom:8px; }
.bottom-content ul { list-style-type:disc; padding-left:20px; margin-bottom:8px; }
.bottom-content ul li { font-size:16px; line-height:24px; letter-spacing:0.48px; }
.bottom-content ul li a { color:var(--tr-bl); text-decoration:underline; }
.bottom-note { align-items:flex-start; display:flex; justify-content:flex-start; }
.bottom-note .note-title { align-items:center; display:flex; gap:6px; flex-shrink:0; white-space:nowrap; }
.note-txt { flex:1; text-align:left; }

@container( min-width:1000px ) {

/* 見出し */
.page-midashi { font-size:32px; line-height:38px; letter-spacing:1.6px; padding:0; margin:auto; margin-bottom:32px; max-width:1000px; width:100%; }

/* コンテンツ内部 */
.vehicles { gap:16px; }
.content-innar { padding:32px 0; margin:auto; max-width:1000px; width:100%; }

/* タブ切り替えボタン */
.flight-tabs { justify-content:space-around; padding:0; margin:auto; max-width:1000px; }
.flight-tabs__label { font-size:18px; }
.flight-tabs__name { font-size:35px; font-weight:600; line-height:normal; }
.flight-tabs__code { font-size:24px; line-height:24px; }

/* タブ切り替え以外のコンテンツ */
.bottom-content .bottom-title { font-size:30px; line-height:38px; letter-spacing:1.5px; }
.bottom-title::after { height:180px; width:210px; }
.bottom-content h3 { font-size:30px; line-height:38px; letter-spacing:1.5px; }
.bottom-content ul { margin-bottom:16px; }
.bottom-content ul li { line-height:32px; }

/* アコーディオン格納リスト */
.vehicles .vehicles-item .all-content { padding:40px 75px; }
.acc-open-text { padding:0 75px 40px 75px; }
.vehicles-midashi { font-size:24px; line-height:38px; letter-spacing:1.2px; margin-bottom:16px; }
.left-content { min-width:0; width:100%; }
.left-content-flex { display:grid; grid-template-columns:1fr 1fr; gap:0 30px; }
.left-content-flex p { font-size:18px; font-weight:700; line-height:18px; letter-spacing:0.54px; min-width:0; }
.acc-open-text p, .acc-open-text li { font-size:20px; line-height:32px; letter-spacing:0.6px; }
.acc-open-text p.naka-midashi { font-size:20px; font-weight:600; }

}