/* ============================================================
   あさタクシー 車内タブレット スタイル
   ブランド：オレンジ #EA7C1F / グリーン #1C8B61
   13インチ横向き想定・高齢者向けに大きな文字
   ============================================================ */

:root{
  --orange:#EA7C1F;
  --green:#1C8B61;
  --ink:#333;
  --bg:#ffffff;
  --header-h:11vh;
  --footer-h:8vh;
}

*{ margin:0; padding:0; box-sizing:border-box; }

html,body{
  width:100%; height:100%; overflow:hidden;
  background:#000; color:var(--ink);
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif;
  user-select:none; -webkit-user-select:none;
}

/* ===== ヘッダー ===== */
#header{
  position:fixed; top:0; left:0; width:100%; height:var(--header-h);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 2.5vw;
  background:rgba(255,255,255,0.95);
  border-bottom:3px solid var(--orange);
  z-index:30;
}
.header-left{ display:flex; align-items:center; gap:1.5vw; }
.logo{ height:6.5vh; width:auto; }
.season{ font-size:4.4vh; }
.greeting{ font-size:3.6vh; font-weight:800; color:var(--green); white-space:nowrap; }
.header-right{ display:flex; align-items:center; gap:1.5vw; }

/* 3日間予報（カラフルなチップ） */
.forecast{ display:inline-flex; align-items:center; gap:0.6vw; }
.fc-day{
  display:inline-flex; align-items:center; gap:0.45vw;
  padding:0.7vh 0.9vw; border-radius:1.4vh;
  box-shadow:0 0.2vh 0.6vh rgba(0,0,0,0.12);
  white-space:nowrap;
}
.fc-label{ font-size:2vh; font-weight:800; color:#3a3a3a; white-space:nowrap; }
.fc-icon{ font-size:3vh; line-height:1; }
.fc-temp{ font-size:2.4vh; font-weight:900; white-space:nowrap; }
.fc-max{ color:#d6342a; }          /* 最高気温＝赤 */
.fc-min{ color:#15539e; }          /* 最低気温＝青 */
.fc-sep{ color:#888; margin:0 0.2vw; font-weight:700; }
/* 天気ごとのカラフルな背景 */
.wx-sunny  { background:linear-gradient(135deg,#fff0b3,#ffd27a); }
.wx-pcloudy{ background:linear-gradient(135deg,#fff3c4,#d4ecff); }
.wx-cloudy { background:linear-gradient(135deg,#eef1f5,#d3dae3); }
.wx-rain   { background:linear-gradient(135deg,#d4ecff,#a9d2f7); }
.wx-snow   { background:linear-gradient(135deg,#eef9ff,#d4eeff); }
.wx-storm  { background:linear-gradient(135deg,#e7dbf7,#c7b0ec); }
.clock{ font-size:8vh; font-weight:800; color:var(--orange); line-height:1; letter-spacing:1px; white-space:nowrap; }
.date{ font-size:3.6vh; font-weight:700; color:var(--ink); white-space:nowrap; }

/* ===== メイン ===== */
#main{
  position:fixed; top:var(--header-h); left:0; width:100%;
  height:calc(100% - var(--header-h) - var(--footer-h));
  overflow:hidden; background:#000;
}

/* 風景スライドショー */
#slideshow{ position:absolute; inset:0; }
.slide{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:0; transition:opacity 1.2s ease-in-out;
}
.slide.active{ opacity:1; }

/* ===== Fスライド差し込み ===== */
.ad-overlay{
  position:absolute; inset:0; z-index:20;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
}
.ad-overlay.hidden{ display:none; }
.ad-slide{
  display:none; width:100%; height:100%;
  flex-direction:column; align-items:center; justify-content:center;
  padding:3vh 5vw; text-align:center;
}
.ad-slide.show{ display:flex; }
.ad-title{
  font-size:6vh; font-weight:800; color:var(--orange);
  margin-bottom:3vh;
}
.ad-catch{
  margin-top:3vh; font-size:4.8vh; font-weight:800; color:var(--green);
}
.ad-footer-bar{
  margin-top:3vh; font-size:3.2vh; font-weight:700; color:#fff;
  background:var(--orange); padding:1.2vh 3vw; border-radius:999px;
}

/* F① 連絡先 */
.contact-cols{ display:flex; gap:4vw; width:100%; justify-content:center; }
.contact-col{
  flex:1; max-width:38vw; border-radius:2vh; padding:3vh 2vw;
  display:flex; flex-direction:column; align-items:center; gap:1vh;
}
.tel-col{ background:rgba(234,124,31,0.10); border:4px solid var(--orange); }
.line-col{ background:rgba(28,139,97,0.10); border:4px solid var(--green); }
.contact-icon{ font-size:5.6vh; }
.contact-label{ font-size:3.6vh; font-weight:800; }
.tel-col .contact-label{ color:var(--orange); }
.line-col .contact-label{ color:var(--green); }
.tel-number{ font-size:6.4vh; font-weight:900; color:var(--orange); letter-spacing:0.5px; white-space:nowrap; }
.contact-sub{ font-size:3.2vh; font-weight:700; color:var(--ink); }
.qr{ width:20vh; height:20vh; object-fit:contain; }
.qr-placeholder{
  width:20vh; height:20vh; border:3px dashed var(--green); border-radius:1vh;
  align-items:center; justify-content:center; text-align:center;
  font-size:2.6vh; font-weight:800; color:var(--green); line-height:1.4;
  display:flex;
}

/* F② プロフィール */
.profile-wrap{ display:flex; align-items:center; gap:4vw; max-width:90vw; }
.profile-photo{
  height:52vh; width:auto; border-radius:2vh; object-fit:cover;
  box-shadow:0 0.5vh 2vh rgba(0,0,0,0.2);
}
.profile-text{ text-align:left; }
.profile-name{ font-size:5.8vh; font-weight:900; }
.profile-kana{ font-size:3vh; font-weight:700; color:#777; }
.profile-role{ font-size:3.6vh; font-weight:700; color:#555; margin-bottom:1.5vh; }
.profile-career{
  display:inline-block; font-size:4vh; font-weight:800; color:#fff;
  background:var(--green); padding:1vh 2.5vw; border-radius:999px; margin-bottom:2vh;
}
.profile-catch{ font-size:4.2vh; font-weight:800; color:var(--orange); line-height:1.5; margin-bottom:2vh; }
.profile-close{ font-size:3.6vh; font-weight:700; }

/* F③ サービス */
.service-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:2.5vh 4vw;
  width:100%; max-width:80vw;
}
.service-item{
  display:flex; align-items:center; gap:1.5vw;
  font-size:4.6vh; font-weight:800; color:var(--ink);
  background:rgba(234,124,31,0.08); border-radius:1.5vh; padding:2vh 2vw;
}
.service-emoji{ font-size:5.6vh; }

/* F④ シーン */
.scene-list{ display:flex; flex-direction:column; gap:2.5vh; width:100%; max-width:75vw; }
.scene-item{
  display:flex; align-items:center; gap:2vw; text-align:left;
  font-size:3.9vh; line-height:1.4;
  background:rgba(28,139,97,0.08); border-radius:1.5vh; padding:2vh 2.5vw;
}
.scene-item b{ font-size:4.4vh; }
.scene-item small{ font-size:3.2vh; color:#555; }
.scene-emoji{ font-size:6.2vh; }

/* F⑤ 月替わり情報 */
.tips-body{
  background:rgba(234,124,31,0.08); border-left:1vw solid var(--orange);
  border-radius:1.5vh; padding:4vh 5vw; max-width:80vw;
}
.tips-headline{ font-size:5.8vh; font-weight:900; color:var(--orange); margin-bottom:2.5vh; }
.tips-text{ font-size:4.2vh; font-weight:600; line-height:1.7; }
.tips-sign{ margin-top:3vh; font-size:3.2vh; font-weight:700; color:var(--green); }

/* ===== フッター ===== */
#footer{
  position:fixed; bottom:0; left:0; width:100%; height:var(--footer-h);
  display:flex; align-items:center; gap:1.2vw; padding:0 2.5vw;
  background:rgba(255,255,255,0.95); border-top:3px solid var(--green);
  z-index:30; overflow:hidden;
}
.footer-cal{ font-size:3.4vh; }
.footer-label{
  font-size:2.9vh; font-weight:800; color:#fff; background:var(--green);
  padding:0.6vh 1.5vw; border-radius:999px; white-space:nowrap;
}
.footer-text{ font-size:3.6vh; font-weight:700; color:var(--ink); white-space:nowrap; }