@charset "utf-8";
.ttg_den { font-family: "Kaisei Decol", sans-serif; font-size: 48px; font-weight: 400; letter-spacing: 0.00em; color: transparent;  -webkit-text-stroke: 1px hsla(210,82%,27%,0.36); }
.ttg_h3_b { font-family: "Kaisei Decol", serif; font-size: 32px; font-weight: 700; line-height: 1.2; letter-spacing: 0.00em; color: #0C447C!important; position: relative; top: -2px; }
.ttg_h4 { font-family: "Noto Sans JP", sans-serif; font-size: 32px; font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; color: #042C53!important; }
.ttg_p_03 { font-family: "Noto Sans JP", sans-serif; font-size: 15px; font-weight: 400; line-height: 1.4; letter-spacing: 0.03em; text-align: center; }
.ttg_cp_01 { font-family: "Noto Sans JP", sans-serif; font-size: 16px!important; font-weight: 500!important; letter-spacing: 0.03em!important; padding: 10px 24px 12px 24px!important; }
.ttg_ff_01 { font-family: "Noto Sans JP", sans-serif!important; }
.ttg_ff_02 { font-family: "Kaisei Decol", serif!important; }
.ttg_fs_01 { font-size: 72%; }
.ttg_fs_02 { }
.ttg_lh_01 { line-height: 1.4!important; }
.ttg_lh_02 { line-height: 1.2!important; }
.ttg_ul_01 { border-bottom: double 6px #87CEFA; }
.ttg_ul_02 { background: linear-gradient(transparent 72%, #fef263 72%); }
.ttg_dan_01 { padding-left: 1.5em; text-indent: -1.5em; }
.ttg_bg_01 { background-image: url(/img/bg_01.webp); background-size: cover; background-position: center center; background-attachment: fixed; }
.ttg_bg_02 { background-image: url(/img/bg_02.webp); background-size: cover; background-position: center center; background-attachment: fixed; }
.ttg_bg_03 { background-image: url(/img/bg_03.webp); background-size: cover; background-position: center center; background-attachment: fixed; }
.ttg_bg_04 { background-image: url(/img/bg_04.webp); background-size: cover; background-position: center center; background-attachment: fixed; }
.ttg_bg_05 { background-image: url(/img/bg_05.webp); background-size: cover; background-position: center center; background-attachment: fixed; }
.ttg_bg_11 { background-color: hsla(197,82%,43%,0.06)!important; }
@media (max-width: 1920px) {
.ttg_den { font-size: 48px; }
.ttg_h3_b { font-size: 32px; }
.ttg_h4 { font-size: 32px; }
.ttg_p_03 { font-size: 15px; }
}
@media (max-width: 1599.98px) {
.ttg_den { font-size: 45px; }
.ttg_h3_b { font-size: 30.5px; }
.ttg_h4 { font-size: 30.5px; }
.ttg_p_03 { font-size: 14.75px; }
}
@media (max-width: 1399.98px) {
.ttg_den { font-size: 42px; }
.ttg_h3_b { font-size: 29px; }
.ttg_h4 { font-size: 29px; }
.ttg_p_03 { font-size: 14.5px; }
}
@media (max-width: 1199.98px) {
.ttg_den { font-size: 39px; }
.ttg_h3_b { font-size: 27.5px; }
.ttg_h4 { font-size: 27.5px; }
.ttg_p_03 { font-size: 14.25px; }
}
@media (max-width: 991.98px) {
.ttg_den { font-size: 36px; }
.ttg_h3_b { font-size: 26px; }
.ttg_h4 { font-size: 26px; }
.ttg_p_03 { font-size: 14px; }
.ttg_ul_01 { border-bottom: double 2px #87CEFA; }
}
/* 768px 〜 991.98px の間だけ 124% を適用 */
@media (min-width: 768px) and (max-width: 991.98px) {
  .ttg_fs_02 {
    font-size: 124%;
  }
}
@media (max-width: 767.98px) {
.ttg_den { font-size: 32px; }
.ttg_h3_b { font-size: 24px; }
.ttg_h4 { font-size: 24px; }
.ttg_p_03 { font-size: 13.66px; }
}
@media (max-width: 575.98px) {
.ttg_den { font-size: 28px; }
.ttg_h3_b { font-size: 22px; }
.ttg_h4 { font-size: 22px; }
.ttg_p_03 { font-size: 13.33px; }
.ttg_bg_01 { background-image: url(/img/bg_01sp.webp); background-size: auto; background-repeat: repeat; background-position: center center; background-attachment: fixed; }
.ttg_bg_02 { background-image: url(/img/bg_02sp.webp); background-size: auto; background-repeat: repeat; background-position: center center; background-attachment: fixed; }
.ttg_bg_03 { background-image: url(/img/bg_03sp.webp); background-size: auto; background-repeat: repeat; background-position: center center; background-attachment: fixed; }
}
@media (max-width: 479.98px) {
.ttg_den { font-size: 24px; -webkit-text-stroke: 1px hsla(210,82%,27%,0.24); }
.ttg_h3_b { font-size: 20px; }
.ttg_h4 { font-size: 20px; }
.ttg_p_03 { font-size: 13px; }
}



/* フォント2 */
.ttg_h1 { font-family: "Kaisei Decol", serif; font-size: 48px; font-weight: 700; line-height: 1.4; letter-spacing: 0.03em; color: #e82c60; }
.ttg_h2 { font-family: "Kaisei Decol", serif; font-size: 36px; font-weight: 700; line-height: 1.4; letter-spacing: 0.03em; color: #e82c60; }
.ttg_h2_b { font-family: "Noto Sans JP", sans-serif; font-size: 36px; font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; color: #042C53!important; }
.ttg_h3 { font-family: "Kaisei Decol", serif; font-size: 24px; font-weight: 700; line-height: 1.4; letter-spacing: 0.03em; color: #121212; }
.ttg_h3_c { font-family: "Kaisei Decol", serif; font-size: 24px; font-weight: 700; line-height: 1.4; letter-spacing: 0.03em; color: #0C447C!important; }
.ttg_h3_d {  }
.ttg_p_01 { font-family: "Noto Sans JP", sans-serif; font-size: 17px; font-weight: 400; line-height: 2.0; letter-spacing: 0.03em; text-align: justify; color: #121212!important; }
.ttg_p_02 { font-family: "Noto Sans JP", sans-serif; font-size: 12px; font-weight: 400; line-height: 2.0; letter-spacing: 0.03em; color: #242424!important; }
.ttg_p_04 { font-family: "Noto Sans JP", serif; font-size: 24px; font-weight: 600; line-height: 1.6; letter-spacing: 0.03em; color: #0C447C!important; }
.ttg_p_04_b { font-family: "Noto Sans JP", serif; font-size: 24px; font-weight: 600; line-height: 1.3; letter-spacing: 0.03em; color: #0C447C!important; }
.ttg_p_05 { font-family: "Noto Sans JP", serif; font-size: 20px!important; font-weight: 500!important; line-height: 1.6; letter-spacing: 0.03em; color: #0C447C!important; }
.ttg_fs_03 { font-family: "Kaisei Decol", serif; font-size: 144%!important; color: #e82c60; background: linear-gradient(transparent 72%, #fef263 72%); }
.ttg_fs_04 {  }
.ttg_ff_03 { font-family: "Noto Sans JP", serif!important; font-weight: 500!important; }
@media (max-width: 1599.98px) {
.ttg_h1 { font-size: 45.5px; }
.ttg_h2 { font-size: 34.5px; }
.ttg_h2_b { font-size: 34.5px; }
.ttg_h3 { font-size: 23.5px; }
.ttg_h3_c { font-size: 23.5px; }
.ttg_p_01 { font-size: 16.5px; }
.ttg_p_04 { font-size: 23.5px; }
.ttg_p_04_b { font-size: 23.5px; }
.ttg_p_05 { font-size: 16.5px!important; }
}
@media (max-width: 1399.98px) {
.ttg_h1 { font-size: 43px; }
.ttg_h2 { font-size: 33px; }
.ttg_h2_b { font-size: 33px; }
.ttg_h3 { font-size: 23px; }
.ttg_h3_c { font-size: 23px; }
.ttg_p_01 { font-size: 16px; }
.ttg_p_04 { font-size: 23px; }
.ttg_p_04_b { font-size: 23px; }
.ttg_p_05 { font-size: 19px!important; }
}
@media (max-width: 1199.98px) {
.ttg_h1 { font-size: 40.5px; }
.ttg_h2 { font-size: 31.5px; }
.ttg_h2_b { font-size: 31.5px; }
.ttg_h3 { font-size: 22.5px; }
.ttg_h3_c { font-size: 22.5px; }
.ttg_p_01 { font-size: 15.5px; }
.ttg_p_04 { font-size: 22.5px; }
.ttg_p_04_b { font-size: 22.5px; }
.ttg_p_05 { font-size: 18.5px!important; }
}
@media (max-width: 991.98px) {
.ttg_h1 { font-size: 38px; }
.ttg_h2 { font-size: 30px; }
.ttg_h2_b { font-size: 30px; }
.ttg_h3 { font-size: 22px; }
.ttg_h3_c { font-size: 22px; }
.ttg_h3_d { font-family: "Kaisei Decol", serif; font-size: 20px; font-weight: 700; line-height: 1.4; letter-spacing: 0.03em; color: #121212; }
.ttg_p_01 { font-size: 15px; }
.ttg_p_04 { font-size: 22px; }
.ttg_p_04_b { font-size: 22px; }
.ttg_p_05 { font-size: 18px!important; }
}
@media (max-width: 767.98px) {
.ttg_h1 { font-size: 36.66px; }
.ttg_h2 { font-size: 28px; }
.ttg_h2_b { font-size: 28px; }
.ttg_h3 { font-size: 21.33px; }
.ttg_h3_c { font-size: 21.33px; }
.ttg_h3_d { font-size: 19.33px; }
.ttg_p_01 { font-size: 14.33px; }
.ttg_p_04 { font-size: 21.33px; }
.ttg_p_04_b { font-size: 21.33px; line-height: 1.5; }
.ttg_p_05 { font-size: 17.33px!important; }
}
@media (max-width: 575.98px) {
.ttg_h1 { font-size: 33.33px; }
.ttg_h2 { font-size: 26px; }
.ttg_h2_b { font-size: 26px; }
.ttg_h3 { font-size: 20.66px; }
.ttg_h3_c { font-size: 20.66px; }
.ttg_h3_d { font-size: 18.66px; }
.ttg_p_01 { font-size: 13.66px; line-height: 1.8; }
.ttg_p_04 { font-size: 20.66px; }
.ttg_p_04_b { font-size: 20.66px; line-height: 1.4; }
.ttg_p_05 { font-size: 16.66px!important; }
}
@media (max-width: 479.98px) {
.ttg_h1 { font-size: 28px; }
.ttg_h2 { font-size: 24px; }
.ttg_h2_b { font-size: 24px; }
.ttg_h3 { font-size: 20px; }
.ttg_h3_c { font-size: 20px; }
.ttg_h3_d { font-size: 18px; }
.ttg_p_01 { font-size: 13px; }
.ttg_p_04 { font-size: 20px; }
.ttg_p_04_b { font-size: 20px; }
.ttg_p_05 { font-size: 16px!important; }
.ttg_fs_04 { font-size: 22px!important; }
}



/* とちぎ旅　HeroImage */
@media (max-width: 2560px) {
.ttg_hi_01 { width: 1100px; }
.ttg_hi_01b { width: 1050px; }
.ttg_hi_jsmt { margin-top: -36px; }
.ttg_hi_mt_00 { margin-top: -120px; }
.ttg_hi_mt_01 { margin-top: 6px; }
.ttg_hi_mt_02 { margin-top: 18px; }
.ttg_hi_ds_01 { filter: drop-shadow(12px 12px 12px hsla(0,0%,0%,0.12)); }
}
@media (max-width: 1920px) {
.ttg_hi_01 { width: 800px; }
.ttg_hi_01b { width: 700px; }
.ttg_hi_mt_00 { margin-top: -84px; }
.ttg_hi_mt_01 { margin-top: 6px; }
.ttg_hi_mt_02 { margin-top: 18px; }
}
@media (max-width: 1699.98px) {
.ttg_hi_01 { width: 744px; }
.ttg_hi_01b { width: 644px; }
.ttg_hi_mt_00 { margin-top: -96px; }
}
@media (max-width: 1599.98px) {
.ttg_hi_01 { width: 720px; }
.ttg_hi_01b { width: 620px; }
}
@media (max-width: 1499.98px) {
.ttg_hi_01 { width: 756px; }
.ttg_hi_01b { width: 656px; }
}
@media (max-width: 1399.98px) {
.ttg_hi_01 { width: 616px; }
.ttg_hi_01b { width: 516px; }
}
@media (max-width: 1299.98px) {
.ttg_hi_01 { width: 566px; }
.ttg_hi_01b { width: 466px; }
}
@media (max-width: 1199.98px) {
.ttg_hi_01 { width: 616px; }
.ttg_hi_01b { width: 566px; }
}
@media (max-width: 991.98px) {
.ttg_hi_01 { width: 480px; }
.ttg_hi_01b { width: 430px; }
.ttg_hi_mt_00 { margin-top: auto!important; }
}
@media (max-width: 767.98px) {
.ttg_hi_01 { width: 400px; }
.ttg_hi_01b { width: 300px; }
}
@media (max-width: 575.98px) {
.ttg_hi_01 { width: 340px; }
.ttg_hi_01b { width: 290px; }
.ttg_hi_mt_01 { margin-top: 18px!important; }
}
@media (max-width: 479.98px) {
.ttg_hi_01 { width: 320px; }
.ttg_hi_01b { width: 270px; }
.ttg_hi_mt_01 { margin-top: 24px!important; }
}
@media (max-width: 375px) {
.ttg_hi_01 { width: 280px; }
.ttg_hi_01b { width: 230px; }
.ttg_hi_mt_01 { margin-top: 12px!important; }
}
@media (max-width: 320px) {
.ttg_hi_01 { width: 240px; }
.ttg_hi_01b { width: 190px; }
.ttg_hi_mt_01 { margin-top: 12px!important; }
}

/* ==========================================================
   とちぎ旅 HeroImage（.ttg_hi_01b）高さ連動の上限
   ・ブラウザの縦横比に関わらず、ファーストビューに
   　「メイン画像＋応募バナー＋クーポン文言＋JTB／じゃらんバナー」
   　が収まるよう、画像の幅に「画面の高さから算出した上限」を設ける
   ・上の width 指定（幅ごとのデザインサイズ）はそのまま残し、
   　画面の高さが足りない時だけ max-width で縮小する
   ・算出式：画像の高さ ≦ 画面の高さ − R（画像以外の要素の高さ＋余白）
   　画像の幅 = 画像の高さ × 1366 / 1254
   ・R はブレークポイントごとに実測した値＋12px の安全マージン
   ・svh（ブラウザのツールバー表示時の高さ）に対応したブラウザでは
   　スマホ・タブレットのアドレスバー分も考慮（非対応ブラウザは vh で計算）
   ・横向きスマホ等の極端に低い画面では 120px を下限とする
   ========================================================== */
/* 2561px以上 */
.ttg_hi_01b {
	max-width: calc((100vh - 544px) * 1366 / 1254);
	max-width: min(100%, max(120px, calc((200svh - 100vh - 544px) * 1366 / 1254)));
}
/* 1921〜2560px */
@media (max-width: 2560px) {
.ttg_hi_01b {
	max-width: calc((100vh - 328px) * 1366 / 1254);
	max-width: min(100%, max(120px, calc((200svh - 100vh - 328px) * 1366 / 1254)));
}
}
/* 1700〜1920px */
@media (max-width: 1920px) {
.ttg_hi_01b {
	max-width: calc((100vh - 364px) * 1366 / 1254);
	max-width: min(100%, max(120px, calc((200svh - 100vh - 364px) * 1366 / 1254)));
}
}
/* 1600〜1699px */
@media (max-width: 1699.98px) {
.ttg_hi_01b {
	max-width: calc((100vh - 352px) * 1366 / 1254);
	max-width: min(100%, max(120px, calc((200svh - 100vh - 352px) * 1366 / 1254)));
}
}
/* 1200〜1599px */
@media (max-width: 1599.98px) {
.ttg_hi_01b {
	max-width: calc((100vh - 336px) * 1366 / 1254);
	max-width: min(100%, max(120px, calc((200svh - 100vh - 336px) * 1366 / 1254)));
}
}
/* 992〜1199px */
@media (max-width: 1199.98px) {
.ttg_hi_01b {
	max-width: calc((100vh - 300px) * 1366 / 1254);
	max-width: min(100%, max(120px, calc((200svh - 100vh - 300px) * 1366 / 1254)));
}
}
/* 768〜991px */
@media (max-width: 991.98px) {
.ttg_hi_01b {
	max-width: calc((100vh - 622px) * 1366 / 1254);
	max-width: min(100%, max(120px, calc((200svh - 100vh - 622px) * 1366 / 1254)));
}
}
/* 576〜767px（ヒーロー高さ 80vh のため 80vh 基準） */
@media (max-width: 767.98px) {
.ttg_hi_01b {
	max-width: calc((80vh - 468px) * 1366 / 1254);
	max-width: min(100%, max(120px, min(calc((80vh - 468px) * 1366 / 1254), calc((200svh - 80vh - 112px - 468px) * 1366 / 1254))));
}
}
/* 575px以下（バナー幅が画面幅に比例するため R も画面幅に比例：57vw + 178px） */
@media (max-width: 575.98px) {
.ttg_hi_01b {
	max-width: calc((80vh - 57vw - 178px) * 1366 / 1254);
	max-width: min(100%, max(120px, min(calc((80vh - 57vw - 178px) * 1366 / 1254), calc((200svh - 80vh - 112px - 57vw - 178px) * 1366 / 1254))));
}
}




/* フッターフォント */
.ttg_ftp_01 { font-size: 20px; font-weight: 600; }
@media (max-width: 1599.98px) {
.ttg_ftp_01 { font-size: 19.5px; }
}
@media (max-width: 1399.98px) {
.ttg_ftp_01 { font-size: 19px; }
}
@media (max-width: 1199.98px) {
.ttg_ftp_01 { font-size: 18.5px; }
}
@media (max-width: 991.98px) {
.ttg_ftp_01 { font-size: 18px; }
}
@media (max-width: 767.98px) {
.ttg_ftp_01 { font-size: 17.33px; }
}
@media (max-width: 575.98px) {
.ttg_ftp_01 { font-size: 16.66px; }
}
@media (max-width: 479.98px) {
.ttg_ftp_01 { font-size: 16px; }
}




/* 幅 */
.ttg_ptblr_00 { padding: 0px 0px 0px 0px!important; }
.ttg_ptblr_00_l { padding: 0px 12px 0px 60px!important; }
.ttg_ptblr_00_r { padding: 0px 60px 0px 12px!important; }
.ttg_ptblr_00_t { padding: 24px 36px 0px 36px!important; }
.ttg_ptblr_01 { padding: 24px 36px 24px 36px!important; }
.ttg_ptblr_02 { padding: 24px 36px 36px 36px!important; }
.ttg_ptblr_03 { padding: 24px 36px 48px 36px!important; }
.ttg_ptblr_04 { padding: 0px 0px 0px 0px!important; background-color: hsla(0,0%,100%,0.00)!important; }
.ttg_ptblr_05 { padding: 48px 30px 30px 24px!important; }
.ttg_ptblr_06 { padding: 24px 24px 24px 24px!important; }
.ttg_ptblr_07 { padding: 12px 12px 12px 12px!important; }
.ttg_ptblr_08 { padding: 30px 36px 30px 36px!important; }
.ttg_ptblr_08b { padding: 30px 18px 30px 18px!important; }
.ttg_ptblr_08c { padding: 30px 18px 30px 18px!important; }
.ttg_ptblr_08d { padding: 30px 36px 30px 36px!important; }
.ttg_ptb_01 { padding-top: 120px!important; padding-bottom: 120px!important; }
.ttg_ptb_02 { padding-top: 0px!important; padding-bottom: 0px!important; }
.ttg_ptb_03 { padding-top: 84px!important; padding-bottom: 72px!important; }
.ttg_ptb_04 { padding-top: 0px!important; padding-bottom: 120px!important; }
.ttg_plr_01 { padding-left: 24px!important; padding-right: 24px!important; }
.ttg_plr_02 {  }
.ttg_pr_01 { padding-right: 48px!important; }
.ttg_pr_01b { padding-right: 0px!important; }
.ttg_mtblr_00 { margin: 0px!important; }
.ttg_mtblr_01 { margin: 0px!important; }
.ttg_mt_01 { margin-top: 0px!important; }
.ttg_mt_02 { margin-top: 12px!important; }
.ttg_mt_03 { margin-top: 48px!important; }
.ttg_mt_04 { margin-top: 120px!important; }
.ttg_mt_05 { margin-top: 24px!important; }
.ttg_mt_05b { margin-top: 24px!important; }
.ttg_mt_06 { margin-top: 18px!important; }
.ttg_mt_07 { margin-top: 60px!important; }
.ttg_mt_08 {  }
.ttg_mt_09 { margin-top: 120px!important; }
.ttg_mt_10 { margin-top: 60px!important; }
.ttg_mt_11 {  }
.ttg_mt_12 { margin-top: 18px!important; }
.ttg_mt_12b { margin-top: 18px!important; }
.ttg_mt_13 { margin-top: -144px!important; }
.ttg_mt_14 {  }
.ttg_mb_01 { margin-bottom: 0px!important; }
.ttg_ml_01 {  }
.ttg_ml_02 {  }
.ttg_ml_03 {  }
.ttg_mlr_01 { margin-left: auto!important; margin-right: auto!important; }
.ttg_mlr_02 { margin-left: -12px; margin-right: -12px; }
.ttg_mlr_02b { margin-left: -12px; margin-right: -12px; margin-top: -24px; }
.ttg_mlr_02c { margin-left: -12px; margin-right: -12px; }
.ttg_waku_01 { padding: 36px 24px 24px 36px!important; border-radius: 36px; background-color: hsla(0,0%,100%,0.72); }
.ttg_waku_02 { padding: 4px 12px 4px 12px!important; background-color: hsla(0,0%,100%,0.78); }
.ttg_waku_03 { padding: 36px 24px 36px 24px!important; border-radius: 36px; margin-top: 60px; margin-bottom: 60px; background-color: hsla(0,0%,100%,0.72); }
.ttg_w_01 { width: 100%; }
.ttg_w_02 { width: 100%; }
.ttg_w_03 { width: 24px; height: 24px; }
.ttg_w_04 { width: 160px; height: 139px; }
.ttg_w_05 { width: 78%!important; margin-left: auto; margin-right: auto; }
.ttg_w_06 { width: 240px; height: 109px; }
.ttg_w_07 { width: 72%; }
.ttg_w_08 { width: 480px; }
.ttg_w_09 { min-width: 60px; }
.ttg_w_10 { width: 720px; }
.ttg_w_11 { min-width: 100%!important; max-width: 100%!important; }
.ttg_mw_01 { min-width: 624px!important; }
.ttg_mw_02 {  }
.ttg_mw_03 { min-width: 84%!important; }
.ttg_ps_01 { position: relative; top: -8px; ; }
@media (max-width: 1599.98px) {
.ttg_ptblr_08 { padding: 18px 36px 18px 36px!important; }
.ttg_ptblr_08b { padding: 18px 36px 18px 36px!important; }
.ttg_ptblr_08c { padding: 18px 36px 18px 36px!important; }
.ttg_ptblr_08d { padding: 18px 18px 18px 18px!important; }
.ttg_mt_05 { margin-top: 12px!important; }
.ttg_mt_05b { margin-top: 12px!important; }
.ttg_mt_13 { margin-top: -120px!important; }
.ttg_w_04 { width: 140px; height: 122px; }
.ttg_w_06 { width: 220px; height: 100px; }
.ttg_mw_01 { min-width: 564px!important; }
}
@media (max-width: 1399.98px) {
.ttg_mt_05 { margin-top: 0px!important; }
.ttg_mt_05b { margin-top: 0px!important; }
.ttg_w_04 { width: 120px; height: 104px; }
.ttg_w_06 { width: 200px; height: 91px; }
.ttg_w_09 { min-width: 54px; }
.ttg_w_10 { width: 640px; }
}
@media (max-width: 1199.98px) {
.ttg_ptblr_08c { padding: 18px 6px 18px 18px!important; }
.ttg_ptblr_08d { padding: 18px 6px 18px 18px!important; }	
.ttg_mt_05 { margin-top: -24px!important; }
.ttg_mt_05b { margin-top: -24px!important; }
.ttg_mt_08 { margin-top: 60px!important; }
.ttg_mt_13 { margin-top: -30px!important; }
.ttg_w_04 { width: 160px; height: 139px; }
.ttg_w_06 { width: 240px; height: 109px; }
.ttg_mw_01 { min-width: 444px!important; }
.ttg_mw_03 { min-width: 100%!important;  }
}
@media (max-width: 991.98px) {
.ttg_ptblr_01 { padding: 12px 24px 12px 24px!important; }
.ttg_ptblr_02 { padding: 12px 24px 24px 24px!important; }
.ttg_ptblr_03 { padding: 12px 24px 24px 24px!important; }
.ttg_ptblr_08c { padding: 18px 18px 18px 18px!important; }
.ttg_pr_01 { padding-right: 0px!important; }
.ttg_mlr_02c { margin-top: -24px; }
.ttg_mt_12b { margin-top: 0px!important; }
.ttg_mt_13 { margin-top: -24px!important; }
.ttg_mt_14 { margin-top: 20px!important; }
.ttg_mw_01 { min-width: 100%!important; }
.ttg_w_04 { width: 140px; height: 122px; }
.ttg_w_06 { width: 220px; height: 100px; }
.ttg_w_05 { width: 100%!important; }
.ttg_w_07 { width: 84%; }
.ttg_w_08 { width: 360px; }
.ttg_w_09 { min-width: 48px; }
.ttg_w_10 { width: 480px; }
.ttg_ptb_01 { padding-top: 96px!important; padding-bottom: 96px!important; }
.ttg_ptb_03 { padding-top: 60px!important; padding-bottom: 60px!important; }
.ttg_ptb_04 { padding-top: 0px!important; padding-bottom: 96px!important; }
}
@media (max-width: 767.98px) {
.ttg_ptblr_00_l { padding: 0px 24px 0px 24px!important; }
.ttg_ptblr_00_r { padding: 12px 24px 0px 24px!important; }
.ttg_ptblr_00_t { padding: 12px 24px 0px 24px!important; }
.ttg_mt_04 { margin-top: 96px!important; }
.ttg_mt_05b { margin-top: 0px!important; }
.ttg_mt_09 { margin-top: 96px!important; }
.ttg_mt_10 { margin-top: 48px!important; }
.ttg_mt_14 { margin-top: 20px!important; margin-bottom: -12px!important; }
.ttg_w_04 { width: 120px; height: 104px; }
.ttg_w_06 { width: 200px; height: 91px; }
.ttg_w_07 { width: 100%; }
.ttg_waku_01 { padding: 24px 12px 12px 24px!important; }
}
@media (max-width: 575.98px) {
.ttg_ptblr_01 { padding: 12px 12px 12px 12px!important; }
.ttg_ptblr_02 { padding: 12px 12px 18px 12px!important; }
.ttg_ptblr_03 { padding: 12px 12px 24px 12px!important; }
.ttg_ptblr_08 { padding: 18px 3px 12px 36px!important; }
.ttg_ptblr_08b { padding: 18px 3px 12px 36px!important; }
.ttg_ptb_01 { padding-top: 60px!important; padding-bottom: 60px!important; }
.ttg_ptb_04 { padding-top: 0px!important; padding-bottom: 60px!important; }
.ttg_waku_01 { padding: 24px 12px 12px 12px!important; width: 90%; }
.ttg_waku_03 { padding: 18px 12px 18px 12px!important; border-radius: 24px; }
.ttg_mt_07 { margin-top: 48px!important; }
.ttg_mt_08 { margin-top: 48px!important; }
.ttg_mt_09 { margin-top: 60px!important; }
.ttg_mt_11 { margin-top: -24px!important; }
.ttg_ml_01 { margin-left: 24px!important; }
.ttg_ml_02 { margin-left: 6px!important; }
.ttg_ml_03 { margin-left: 12px!important; position: relative; top: -10px; }
.ttg_w_02 { width: 90%; }
.ttg_w_04 { width: 100px; height: 87px; }
.ttg_w_06 { width: 180px; height: 82px; }
.ttg_w_09 { width: 36px; }
.ttg_mw_02 { max-width: 60px!important; }
}
@media (max-width: 479.98px) {
.ttg_ptblr_08c { padding: 18px 6px 18px 6px!important; }
.ttg_plr_02 { padding-left: 12px!important; padding-right: 12px!important; }
.ttg_mt_05 { margin-top: 0px!important; }
}



/* 幅2 */
.ttg_mw_101 { width: 120px; }
.ttg_mw_101b { width: 108px; }
.ttg_mw_102 { width: 168px; }
.ttg_mw_102b { width: 168px; }
.ttg_mw_103 {  }
.ttg_mw_104 { width: 72%; }
.ttg_mw_1200 { min-width: 100%; }
@media (max-width: 1199.98px) {
.ttg_mw_101 { width: 96px; }
.ttg_mw_101b { width: 96px; }
.ttg_mw_102 { width: 144px; }
.ttg_mw_102b { width: 144px; }
.ttg_mw_104 { width: 100%; }
}
@media (max-width: 991.98px) {
.ttg_mw_101 { width: 120px; }
.ttg_mw_101b { width: 108px; }
.ttg_mw_102 { width: 144px; }
.ttg_mw_102b { width: 120px; }
.ttg_mw_1200 { min-width: 84%; }
}
@media (max-width: 767.98px) {
.ttg_mw_101 { width: 120px; }
.ttg_mw_101b { width: 120px; }
.ttg_mw_102 { width: 144px; }
.ttg_mw_102b { width: 144px; }
.ttg_mw_1200 { min-width: 100%; }
}
@media (max-width: 575.98px) {
.ttg_mw_101 { width: 84px; }
.ttg_mw_102 { width: 120px; }
.ttg_mw_103 { padding-left: 4%; padding-right: 4%; }
}
@media (max-width: 479.98px) {
.ttg_mw_101 { width: 72px; }
.ttg_mw_102 { width: 84px; }
}



/* 配置 */
@media (max-width: 575.98px) {
.ttg_tac_101 { text-align: center; }
}



/* 段落・色 */
.ttg_1399_on { display: none!important; }
.ttg_1399_off { display: inline!important; }
.ttg_1199_on { display: none!important; }
.ttg_1199_off { display: inline!important; }
.ttg_991_on { display: none!important; }
.ttg_991_off { display: inline!important; }
.ttg_767_on { display: none!important; }
.ttg_767_off { display: inline!important; }
.ttg_575_on { display: none!important; }
.ttg_575_off { display: inline!important; }
.ttg_479_on { display: none!important; }
.ttg_479_off { display: inline!important; }
.ttg_ds_01 { display: none!important; }
.ttg_ds_02 { display: none!important; }
.ttg_ds_03 { display: none!important; }
.ttg_ds_04 { display: none!important; }
.ttg_ds_04b { display: none!important; }
.ttg_ds_05 { display: inherit; }
.ttg_ds_06 { display: none; }
.ttg_alpha a:hover img { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; transition: all, 0.25s, linear; }
a.ttg_type_01 { color: #043c78; }
a.ttg_type_01:hover { color: #e4007f; text-decoration: underline; }
a.ttg_type_02 { color: #121212!important; }
a.ttg_type_02:hover { color: #47248e!important; }
a.ttg_type_03 { color: #121212!important; }
a.ttg_type_03:hover { color: #fff!important; background: #47248e!important; }
a.ttg_type_04 { color: #121212!important; text-decoration: underline; }
a.ttg_type_04:hover { color: #042C53!important; text-decoration: none; font-weight: 500; }
.ttg_fc_01 { background: #fff9f5; }
.ttg_fc_02 { background: #fffff9; }
.ttg_fc_03 { background: #fef9fb; }
.ttg_fc_04 { background: #fff; }
.ttg_fc_05 { background: #001e43!important; }
.ttg_fc_06 { color: #0C447C; }
.ttg_fc_07 { color: #e73063!important; line-height: 1.4!important; }
.ttg_fc_08 { background: #f5ecf4!important; }
.ttg_fc_09 { color: #d70035!important; }
.ttg_fc_11 { color: #fff!important; }
.ttg_fc_12 { color: #e82c60!important; }
.ttg_fc_13 { color: #aa4c8f!important; }
.ttg_fc_14 { color: #121212!important; font-weight: 600!important; }
@media (max-width: 1599.98px) {
.ttg_ds_02 { display: inherit!important; }
.ttg_ds_04 { display: inherit!important; }
}
@media (max-width: 1399.98px) {
.ttg_1399_on { display: inline!important; }
.ttg_1399_off { display: none!important; }
.ttg_ds_01 { display: inherit!important; }
.ttg_ds_02 { display: none!important; }
}
@media (max-width: 1199.98px) {
.ttg_fc_06 { width: 24px!important; height: 24px!important; font-size: 24px!important; line-height: 24px!important; }
.ttg_1199_on { display: inline!important; }
.ttg_1199_off { display: none!important; }
.ttg_ds_02 { display: inherit!important; }
.ttg_ds_03 { display: inherit!important; }
.ttg_ds_05 { display: none; }
}
@media (max-width: 991.98px) {
.ttg_991_on { display:flex!important }
.ttg_991_off { display: none!important; }
.ttg_ds_03 { display: none!important; }
.ttg_ds_04 { display: none!important; }
.ttg_ds_04b { display: none!important; }
.ttg_ds_06 { display: inherit; }
}
@media (max-width: 767.98px) {
.ttg_767_on { display: inline!important; }
.ttg_767_off { display: none!important; }
.ttg_ds_01 { display: none!important; }
.ttg_ds_02 { display: none!important; }
.ttg_ds_04 { display: inherit!important; }
}
@media (max-width: 575.98px) {
.ttg_575_on { display: inline!important; }
.ttg_575_off { display: none!important; }
.ttg_ds_03 { display: inherit!important; }
.ttg_ds_04 { display: none!important; }
.ttg_ds_04b { display: none!important; }
}
@media (max-width: 479.98px) {
.ttg_479_on { display: inline!important; }
.ttg_479_off { display: none!important; }
.ttg_ds_02 { display: inherit!important; }
.ttg_ds_04b { display: inherit!important; }
}



/* 枠 */
.ttg_box_01 { padding: 12px 24px 12px 24px; color: #565656; background: #ffeaea; box-shadow: 0px 0px 0px 10px #ffeaea; border: dashed 2px #ffc3c3; border-radius: 8px; display: block; margin-left: auto; margin-right: auto; margin-bottom: 84px; width: 78%; }
.ttg_box_01b { display: block; margin-left: auto; margin-right: auto; margin-bottom: 36px; width: 78%; }
.ttg_box_11 { position: relative; }
.ttg_box_12 { position: absolute; top: -72px; left: -12px; }
@media (max-width: 1399.98px) {
.ttg_box_12 { position: absolute; top: -60px; left: -12px; }
}
@media (max-width: 1199.98px) {
.ttg_box_01 { margin-bottom: 72px; width: 100%; }
.ttg_box_01b { margin-bottom: 36px; width: 100%; }
.ttg_box_12 { position: absolute; top: -72px; left: -12px; }
}
@media (max-width: 991.98px) {
.ttg_box_01 { margin-top: 24px; margin-bottom: 60px; width: 100%; }
}
@media (max-width: 767.98px) {
.ttg_box_01b { margin-bottom: 24px;  }
.ttg_box_12 { position: absolute; top: -60px; left: -12px; }
}
@media (max-width: 575.98px) {
.ttg_box_01 { padding: 6px 12px 6px 12px; }
.ttg_box_12 { position: absolute; top: -48px; left: -12px; }
}



/* 追記 */
.ttg_box_top { display: flex!important; flex-direction: row!important; align-items: center!important; -webkit-box-pack: start; justify-content: flex-start; column-gap: 16px; }
.ttg_box_top .box-icon { flex-shrink: 0; margin-top: 0!important; }
.ttg_box_top .box-header { margin-top: 0!important; }
@media (max-width: 575.98px) {
.ttg_box_top { column-gap: 12px; }
}
/* Step.1〜3のアイコン（ttg_w_09）を上揃いで配置 */
.ttg_box_top:has(> div > img.ttg_w_09) { align-items: flex-start!important; }
.ttg_box_top:has(> div > img.ttg_w_09) > div:first-child { flex-shrink: 0; margin-top: 0!important; }
.icon-box.ttg_mw_01 { justify-content: flex-start!important; }
.ttg_img_wrap { position: relative!important; }
.ttg_img_float { position: absolute; top: -30px; right: -12px; width: 108px; height: auto; z-index: 2; pointer-events: none; }
@media (max-width: 1199.98px) {
.ttg_img_float { position: absolute; top: -24px; right: -12px; width: 96px; }
}
@media (max-width: 991.98px) {
.ttg_img_float { position: absolute; top: -24px; right: -18px; width: 84px; }
}
@media (max-width: 767.98px) {
.ttg_img_float { position: absolute; top: -42px; right: -24px; width: 96px; }
}
@media (max-width: 575.98px) {
.ttg_img_float { position: absolute; top: -24px; right: -12px; width: 84px; }
}
.ttg_img_float_2 { position: absolute; top: 0px; right: 84px; width: 84px; height: auto; z-index: 3; pointer-events: none; }
@media (max-width: 1199.98px) {
.ttg_img_float_2 { position: absolute; top: 6px; right: 72px; width: 72px; }
}
@media (max-width: 991.98px) {
.ttg_img_float_2 { display: none; }
}
@media (max-width: 767.98px) {
.ttg_img_float_2 { display: inline; position: absolute; top: -6px; right: 60px; width: 66px; }
}
@media (max-width: 575.98px) {
.ttg_img_float_2 { position: absolute; top: 12px; right: 54px; width: 54px; }
}
@media (max-width: 575.98px) {
.comment .unit-spacing-lg.flex-column.flex-sm-row { flex-direction: row!important; flex-wrap: nowrap!important; }
.comment .unit-spacing-lg.flex-column.flex-sm-row .unit-left { flex-shrink: 0!important; margin-top: 0!important; }
.comment .unit-spacing-lg.flex-column.flex-sm-row .unit-body { flex: 1 1 auto!important; min-width: 0!important; margin-top: 0!important; }
}
@media (min-width: 992px) {
.row:has(> #osusume1) { display: grid!important; grid-template-columns: repeat(4, 1fr)!important; grid-template-rows: auto auto!important; column-gap: 24px!important; row-gap: 24px!important; margin: 0!important; }
.row:has(> #osusume1) > [id^="osusume"] { flex: none!important; width: auto!important; max-width: none!important; margin: 0!important; padding: 0!important; }
#osusume1 { grid-column: 1 / 2!important; grid-row: 1 / 2!important; }
#osusume2 { grid-column: 2 / 3!important; grid-row: 1 / 2!important; }
#osusume3 { grid-column: 3 / 5!important; grid-row: 1 / 3!important; }
#osusume4 { grid-column: 1 / 2!important; grid-row: 2 / 3!important; }
#osusume5 { grid-column: 2 / 3!important; grid-row: 2 / 3!important; }
.row:has(> #osusume1) [id^="osusume"] img { width: 100%!important; height: auto!important; aspect-ratio: 1 / 1!important; object-fit: cover!important; display: block; }
}
@media (max-width: 991.98px) {
.row:has(> #osusume1) { display: grid!important; grid-template-columns: repeat(2, 1fr)!important; grid-template-rows: auto auto auto!important; column-gap: 12px!important; row-gap: 12px!important; margin: 0!important; }
.row:has(> #osusume1) > [id^="osusume"] { flex: none!important; width: auto!important; max-width: none!important; margin: 0!important; padding: 0!important; }
#osusume1 { grid-column: 1 / 2!important; grid-row: 1 / 2!important; }
#osusume2 { grid-column: 2 / 3!important; grid-row: 1 / 2!important; }
#osusume4 { grid-column: 1 / 2!important; grid-row: 2 / 3!important; }
#osusume5 { grid-column: 2 / 3!important; grid-row: 2 / 3!important; }
#osusume3 { grid-column: 1 / 3!important; grid-row: 3 / 4!important; }
.row:has(> #osusume1) [id^="osusume"] img { width: 100%!important; height: auto!important; aspect-ratio: 1 / 1!important; object-fit: cover!important; display: block; }
}
.row:has(> #osusume1) [id^="osusume"] { position: relative!important; }
.row:has(> #osusume1) [id^="osusume"] .ttg_waku_02 { position: absolute!important; left: 0; right: 0; bottom: 0; margin-top: 0; text-align: center!important; z-index: 2; }
iframe[src*="google.com/maps"] {
  filter: grayscale(50%) contrast(0.72) brightness(1.05);
}



/* ヒーロー画像セクションをdisplay:inlineではなくblockで確実に表示（inline指定によるレイアウト不整合を回避） */
.ttg_hero_pc { display: block!important; }
@media (max-width: 1399.98px) {
.ttg_hero_pc { display: none!important; }
}
.ttg_hero_pc1399 { display: none!important; }
@media (max-width: 1399.98px) {
.ttg_hero_pc1399 { display: block!important; }
}
@media (max-width: 767.98px) {
.ttg_hero_pc1399 { display: none!important; }
}
.ttg_hero_sp { display: none!important; }
@media (max-width: 767.98px) {
.ttg_hero_sp { display: block!important; }
}



/* JTB/じゃらん/キャンペーン応募の行全体を、ヒーロー画像に重なるよう引き上げる
   実際の画像サイズで計測し、Enter_the_campaign.webpの下端がHeroImage_pc.webpの
   下端から正確に120px上になるよう margin-top を算出（-428px） */
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -548px!important; }
.ttg_hero_overlap .wow { visibility: visible!important; }
@media (max-width: 2560px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -425px!important; }
.jjj_mw { max-width: 1280px; }
.jjj_ps { position: relative; top: -96px; }
}
@media (max-width: 1920px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -425px!important; }
.jjj_mw { max-width: 1080px; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 1799.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -400px!important; }
.jjj_mw { max-width: 960px; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 1699.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -375px!important; }
.jjj_mw { max-width: 840px; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 1599.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -350px!important; }
.jjj_mw { max-width: 767px; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 1499.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -325px!important; }
.jjj_mw { max-width: 767px; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 1399.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -475px!important; }
.jjj_mw { max-width: 72%; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 1199.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -375px!important; }
.jjj_mw { max-width: 78%; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 991.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -275px!important; }
.jjj_mw { max-width: 84%; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 767.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -450px!important; }
.jjj_mw { max-width: 84%; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 575.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -350px!important; }
.jjj_mw { max-width: 90%; }
.jjj_ps { position: relative; top: -48px; }
}
@media (max-width: 479.98px) {
.ttg_hero_overlap { position: relative!important; z-index: 2; margin-top: -250px!important; }
.jjj_mw { max-width: 100%; }
.jjj_ps { position: relative; top: -48px; }
}



/* ヒーロー画像の下端から120px分の余白を追加で確保する
   （#campaign の元のpadding-top(120/96/60px)に240pxを上乗せ：
   　もとの120px追加分 + 今回セクションを120px引き上げた分の補正） 
#campaign { padding-top: 360px!important; }

@media (max-width: 991.98px) {
#campaign { padding-top: 336px!important; }
}
@media (max-width: 575.98px) {
#campaign { padding-top: 300px!important; }
}
*/


/* ==========================================================
   キャンペーン概要セクション上部：フェードイン装飾画像
   ========================================================== */
.ttg_deco_host { position: relative; overflow: visible; }

.ttg_float_deco {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 5;
}

.ttg_deco_img {
	position: absolute;
	width: clamp(149.4px, 14.94vw, 282.2px);
	height: auto;
	opacity: 0;
	transform: scale(0.5);
	transform-origin: center center;
	will-change: transform, opacity;
}

.ttg_deco_img_01 { left: 3%;  top: 25%; }
.ttg_deco_img_02 { right: 3%; top: 50%; }
.ttg_deco_img_03 { left: 5%;  top: 75%; }

@media (max-width: 1499.98px) {
.ttg_deco_img {
	width: clamp(90px, 9vw, 170px);
}
}
@media (max-width: 767.98px) {
	.ttg_float_deco { display: none; }
}



/* ==========================================================
   セクション最上部から60px下：電光掲示板風 横スクロールテキスト（マーキー）
   ・通常は右から左へ継ぎ目なく無限スクロール
   ・Windows「簡単操作」等でアニメーションを無効化している環境では
   　スクロールを止めて文字列を静止表示する（非表示にはしない）
   ========================================================== */
.ttg_marquee_bar {
	position: absolute;
	top: 24px;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 1.4;
	z-index: 7;
	pointer-events: none;
}

.ttg_marquee_track {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	will-change: transform;
	animation-name: ttg-marquee-scroll;
	animation-duration: 22s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.ttg_marquee_track .ttg_den {
	display: inline-block;
	white-space: nowrap;
	padding-right: 120px;
}

@keyframes ttg-marquee-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* Windows の「簡単操作」等でアニメーションを無効にしていても、
   このマーキーは常にスクロールし続ける（prefers-reduced-motion では止めない） */



/* ==========================================================
   「旅行者・応募者／事務局／当選者」カードの高さ揃え
   ・同じ行内でテキスト量が増えて高さに差が出ても、
   　最も高いカラムに他のカードの高さを揃える
   ・画像サイズには手を加えない
   ========================================================== */
.row > .height-fill > .ttg_ptblr_06 {
	height: 100%;
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	display: flex;
	flex-direction: column;
}

.ttg_ptblr_06 .box-top {
	flex-shrink: 0;
}

.ttg_ptblr_06 .box-body {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}



/* ==========================================================
   他ページから /campaign/#entry-requirements 等のハッシュ付きリンクで
   移動してきたときに、見出しが固定ヘッダーの下に隠れないようにする
   ========================================================== */
#entry-requirements,
#how-to-apply,
#prize-d,
#Double-Chance-Prize {
	scroll-margin-top: 100px;
}



/* ==========================================================
   FAQページ内の「お客様向け／宿泊施設様向け」ページ内リンクが
   グローバルナビ（固定ヘッダー）の分だけ隠れてズレるのを防ぐ
   ========================================================== */
#customer,
#facility {
	scroll-margin-top: 100px;
}



/* ==========================================================
   メイン見出し（h1「とちぎに泊まって応募しよう！」）の左上・右上に
   装飾画像（「合計360名様に当たる！」「2連泊以上で倍率アップ！」）を重ねる
   ・position: absolute のため通常のレイアウトの高さには影響しない
   　（section の padding には影響を与えない）
   ・position: relative の基準は .ttg_h1_wrap（h1自身を包むラッパー）に
   　限定しているため、他の要素（section-lg / section-intro 等）の
   　padding や位置には一切影響しない
   ・位置（top/left/right）は仮の値。表示位置は後程調整する
   ========================================================== */
.ttg_h1_wrap { position: relative; }
.ttg_h1_deco { position: absolute; width: clamp(90px, 12vw, 180px); height: auto; z-index: 3; pointer-events: none; }
.ttg_h1_deco_l { width: 200px; top: -72px; left: 156px; }
.ttg_h1_deco_r { width: 400px; top: -72px; right: -12px; }
@media (max-width: 1399.98px) {
.ttg_h1_deco_l { width: 180px; top: -60px; left: 156px; }
.ttg_h1_deco_r { width: 360px; top: -60px; right: -12px; }
}
@media (max-width: 1199.98px) {
.ttg_h1_deco_l { width: 180px; top: -60px; left: 60px; }
.ttg_h1_deco_r { width: 360px; top: -60px; right: -12px; }
}
@media (max-width: 991.98px) {
.ttg_h1_deco_l { width: 144px; top: -60px; left: 0px; }
.ttg_h1_deco_r { width: 288px; top: -60px; right: -12px; }
}
@media (max-width: 575.98px) {
.ttg_h1_deco_l { width: 116px; top: -48px; left: 0px; }
.ttg_h1_deco_r { width: 232px; top: -48px; right: -12px; }
}






/* ==========================================================
   トップページ ヒーローセクション（h1「Transform your business...」）
   の背景に /img/HeroImage.webp を設置
   ・768px以上：表示領域の高さ = ブラウザの高さの100%（100vh）
   ・767.98px以下：表示領域の高さ = ブラウザの高さの80%（80vh）
   ・background-size: cover により、画像の縦横比を保ったまま
   　表示領域全面を覆い、はみ出た部分は自動的に非表示になる
   ・box-sizing: border-box（Bootstrapのグローバル指定）により、
   　padding分を含めた要素全体の高さが指定した vh に一致する
   ========================================================== */
.ttg_hero_bg {
	position: relative;
	height: 100vh;
	overflow: hidden;
	background-image: url("/img/HeroImage.webp");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

@media (max-width: 767.98px) {
.ttg_hero_bg {
	height: 80vh;
}
}



/* ==========================================================
   JTB／じゃらんの予約導線バナー2つを、同じ行内の
   「キャンペーンに応募する」バナーの高さに対して
   天地（縦方向）中央に配置する
   ・HTMLは変更せず、リンク先URL（jtb.co.jp / jalan.net）を
   　手がかりに対象の要素（バナーを包む列）を特定
   ・行（.row）は display:flex のため、対象列だけ
   　align-self: center を指定すれば他の列（stretchのまま）の
   　高さには影響を与えず、見た目上だけ中央寄せになる
   ・スマートフォン表示時に複製される同内容の行（.ttg_991_on）にも
   　同じセレクターが自動的に適用される
   ========================================================== */
div:has(> a[href*="jtb.co.jp"]),
div:has(> a[href*="jalan.net"]) {
	align-self: center;
}



/* ==========================================================
   賞品カード（A賞〜D賞／Wチャンス賞）のアイコン画像とテキストの配置を、
   575.98px以下でも767.98px以下（576px〜767.98px）と同じ、
   画像とテキストを横並びにする配置にする
   ・HTMLは変更せず、対象を .icon-box 内の
   　.unit-spacing-lg.flex-column.flex-sm-row に限定
   　（お知らせ欄の .comment 内の同名クラスには影響しない）
   ・Bootstrapの .flex-column（576px未満で縦積みにする指定）を
   　上書きし、576px以上767.98px以下と同じ flex-direction: row にする
   ・縦積み時のみ必要だった画像の text-align: center も、
   　横並びにする際は不要なため解除する
   ========================================================== */
@media (max-width: 575.98px) {
.icon-box .unit-spacing-lg.flex-column.flex-sm-row {
	flex-direction: row!important;
	flex-wrap: nowrap!important;
}
.icon-box .unit-spacing-lg.flex-column.flex-sm-row .unit-left {
	flex-shrink: 0!important;
	margin-top: 0!important;
}
.icon-box .unit-spacing-lg.flex-column.flex-sm-row .unit-body {
	flex: 1 1 auto!important;
	min-width: 0!important;
	margin-top: 0!important;
}
.icon-box .unit-spacing-lg.flex-column.flex-sm-row .ttg_tac_101 {
	text-align: left!important;
}
}



/* ==========================================================
   プライバシーポリシーページ「Cookieを無効にする場合」内の
   箇条書き（list-marked）の先頭マークを、アイコンフォントの
   『✔』から『・』に変更する
   ========================================================== */
.list-marked li:before {
	content: '・'!important;
	font-family: inherit!important;
}



/* ==========================================================
   プライバシーポリシーページ「Cookieを無効にする場合」内の
   箇条書き（list-marked）で、各項目末尾（（外部サイトへリンク）の右）に
   自動付与されていた『；』を非表示にする
   ========================================================== */
.list-marked li:not(:last-child):after {
	content: none!important;
}



/* ==========================================================
   プライバシーポリシーページ「Cookieを無効にする場合」内の
   箇条書き（list-marked）で、最後の項目末尾に自動付与されていた
   『。』も非表示にする
   ========================================================== */
.list-marked li:last-child:after {
	content: none!important;
}



/* ==========================================================
   トップページ ヒーローセクション最上部：フェードイン装飾画像
   （Hunter_Mountain_Shiobara / Yunishigawa_Kamakura_Festival / Senjogahara）
   ・576px以上でのみ表示（575.98px以下では非表示）
   ・各画像はJS（all.js）によって、フェードイン→拡大→フェードアウト→
   　ランダムな待機時間、の順で無限に繰り返される
   ========================================================== */
.ttg_hero_deco_wrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: visible;
	pointer-events: none;
	z-index: 5;
}

.ttg_hero_deco_img {
	position: absolute;
	width: clamp(480px, 12vw, 220px);
	height: auto;
	opacity: 0;
	transform-origin: center center;
	will-change: transform, opacity;
}
.ttg_hero_deco_img_1 { left: 0%;  top: -6%; }
.ttg_hero_deco_img_2 { right: 5%; top: 18%; }
.ttg_hero_deco_img_3 { left: 3%;  top: 36%; }

@media (max-width: 1599.98px) {
.ttg_hero_deco_img { width: clamp(400px, 12vw, 220px); }
}
@media (max-width: 1399.98px) {
.ttg_hero_deco_img { width: clamp(360px, 12vw, 220px); }
}
@media (max-width: 1299.98px) {
.ttg_hero_deco_img { width: clamp(320px, 12vw, 220px); }
}
@media (max-width: 1199.98px) {
.ttg_hero_deco_img { width: clamp(280px, 12vw, 220px); }
}
@media (max-width: 991.98px) {
.ttg_hero_deco_img { width: clamp(240px, 12vw, 220px); }
.ttg_hero_deco_img_1 { left: 0%;  top: 6%; }
.ttg_hero_deco_img_2 { right: 0%; top: 36%; }
.ttg_hero_deco_img_3 { left: 2%;  top: 66%; }
}
@media (max-width: 767.98px) {
.ttg_hero_deco_img { width: clamp(200px, 12vw, 220px); }
.ttg_hero_deco_img_1 { left: 0%;  top: 6%; }
.ttg_hero_deco_img_2 { right: 0%; top: 36%; }
.ttg_hero_deco_img_3 { left: 2%;  top: 66%; }
}

@media (max-width: 575.98px) {
.ttg_hero_deco_wrap { display: none!important; }
}

/* 画像1：11時50分 → 12時10分方向へ回転しながらフェードイン */
@keyframes ttg-hero-deco-1 {
	0%       { opacity: 0; transform: scale(0.5)  rotate(-5deg); }
	66.6667% { opacity: 1; transform: scale(0.75) rotate(5deg); }
	66.7%    { opacity: 1; transform: scale(0.78) rotate(5deg); }
	100%     { opacity: 0; transform: scale(1)    rotate(5deg); }
}

/* 画像2：12時05分 → 11時45分方向へ回転しながらフェードイン */
@keyframes ttg-hero-deco-2 {
	0%       { opacity: 0; transform: scale(0.5)  rotate(2.5deg); }
	66.6667% { opacity: 1; transform: scale(0.75) rotate(-7.5deg); }
	66.7%    { opacity: 1; transform: scale(0.78) rotate(-7.5deg); }
	100%     { opacity: 0; transform: scale(1)    rotate(-7.5deg); }
}

/* 画像3：11時55分 → 12時15分方向へ回転しながらフェードイン */
@keyframes ttg-hero-deco-3 {
	0%       { opacity: 0; transform: scale(0.5)  rotate(-2.5deg); }
	66.6667% { opacity: 1; transform: scale(0.75) rotate(7.5deg); }
	66.7%    { opacity: 1; transform: scale(0.78) rotate(7.5deg); }
	100%     { opacity: 0; transform: scale(1)    rotate(7.5deg); }
}


/* ------------------------------------------------------------
   1,000円OFFクーポン吹き出し（JTB／じゃらんボタンに重ねる）
------------------------------------------------------------ */
.ttg_coupon_wrap { position: relative; }
#coupon_left,
#coupon_right { position: absolute; top: 0; z-index: 10; width: auto; pointer-events: none; }
#coupon_left img,
#coupon_right img { display: block; width: auto; max-width: none; height: auto; } 
/* JTB：ボタンの左上に少し重ねる */
#coupon_left { left: calc(var(--bs-gutter-x) * 0.5); transform: translate(-78%, -90%); }
/* じゃらん：ボタンの右上に少し重ねる */
#coupon_right { right: calc(var(--bs-gutter-x) * 0.5); transform: translate(78%, -90%); }