@charset "UTF-8";
/* style.css（TOP専用：背景 / MV / セクション / NEWS / footer固定） */

/* =========================
   1) 全体背景（ページ全体パララックス）
   ※板は動かさず、背景位置だけ動かす（切れない版）
========================= */
main { background: transparent; }

main.wrap::before{
  content: "";
  position: fixed;
  inset: 0;              /* 余計な巨大化をやめる */
  z-index: -1;

  background-image: url("../common/bg1.jpg");
  background-size: cover;
  background-repeat: no-repeat;

  /* ここがポイント：背景の“位置”だけ動かす */
  background-position:
    center calc(50% + (var(--bg-move, 0px) * -1));

  will-change: background-position;
}

@media (max-width: 960px){
  main { background: none; } /* 競合防止 */
  main.wrap::before{
    background-image: url("../common/bg1.jpg"); /* SP別画像ならここで差し替え */
  }
}

/* =========================
   TOP（メインビジュアル：背景なし）
========================= */
#main_vis_back{
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding-top: 80px; /* header分 */
  overflow: hidden;
  display: grid;
  place-items: center;
}

@media (max-width: 960px){
  #main_vis_back{
    padding-top: 60px; }
}

.top_waku{
  width: 1100px;
  max-width: 100%;
  position: relative;
}

@media (max-width: 960px){
  .top_waku{
    width: 100%;
  }
}

.title_logo{
  display: block;
  width: 100%;
  height: auto;
}

/* =========================
   3) セクション（TOP内）
========================= */
section{
  margin: auto;
  padding: 70px 7% 90px;
}
section.bg_color{
  border-top: 1px #BDAC81 solid;
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.55) 50%, rgba(0,0,0,0.25) 100%);
}
section.bg_color2{
  border-top: 1px #867E69 solid;
  background-image: linear-gradient(to bottom, rgba(97,67,21,0.15) 50%, rgba(97,67,21,0.00) 100%);
  margin-bottom: 5rem;
}
@media (max-width: 960px){
  section{ padding: 40px 7% 50px; }
}

/* コンテンツ幅（TOPで使う分だけ） */
.text__area{
  margin: 0 auto;
  width: 100%;
  max-width: 1100px;
  line-height: 1.8;
}

/* =========================
   4) タイトル＆キャッチ（TOPで使う分だけ）
========================= */
.title{
  font-weight: 900;
  font-size: 4.5rem;
  letter-spacing: 0.05rem;
  line-height: 1.4;
  text-align: center;
  margin: 0;
  text-shadow: 0 0 10px #CB0B08, 0 0 20px #D55372, 0 0 30px #E3B265;
}
@media (max-width: 960px){
	.title{ font-size: 3.2rem; }
}

.catch_copy1{
  color: #FFFFFF;
  font-weight: 900;
  font-size: 4.0rem;
  letter-spacing: 0;
  line-height: 1.4;
  margin: 0 0 10px;
  text-shadow: 0 0 10px #CB7509, 0 0 20px #E3DB8C, 0 0 30px #E3DB8C;
}
@media (max-width: 960px){
  .catch_copy1{ font-size: 2.4rem; margin: 6px 0; }
}

/* =========================
   5) NEWS（TOP専用）
========================= */
.info_box{
  width: 100%;
  max-width: 1100px;
  height: 380px;
  overflow: auto;
  margin: 0 auto;
}
.divdate{
  font-family: "Roboto", sans-serif;
  font-weight: 800;
  text-align: center;
  width: 155px;
  padding: 3px 12px;
  margin-top: 30px;
  color: #FFFFFF;
  border-right: 1px #867E69 solid;
  border-bottom: 1px #867E69 solid;
  background-color: rgba(0,0,0,0.60);
	text-shadow: 0 0 7px #CB7509, 0 0 15px #E3DB8C;
}
.divinfo{
  position: relative;
  text-align: left;
  padding: 15px 10px 20px 15px;
  border-bottom: 1px #867E69 solid;
  line-height: 1.50;
}
.divinfo a{
  position: absolute;
  inset: 0;
  text-indent: -999px;
}
.divinfo:hover{
  color: #FDF5A9;
  background-color: rgba(0,0,0,0.35);
}
@media (max-width: 960px){
  .divdate{
    width: 120px;
    padding: 1px 3px;
    margin-top: 20px;
    font-size: 14px;
  }
  .divinfo{ padding: 12px 10px 16px; }
}

/* =========================
   6) リンク色（サイト全体の見た目に関わるが、ここに置くなら固定）
========================= */
a:link, a:visited{ color: #FFD539; text-decoration: none;
	text-shadow:
    1px 1px 2px #000,
    0 0 6px rgba(0,0,0,0.80) }
a:hover{ color: #FF95AB; text-decoration: underline;
	text-shadow:
    1px 1px 2px #000,
    0 0 6px rgba(0,0,0,0.80) }

/* =========================
   7) フッター（TOP）
========================= */
footer{
  border-top: 1px #BDAC81 solid;
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.80) 50%, rgba(0,0,0,0.70) 100%);
  margin-top: 0px;
}
footer #ticket_btn{
  position: fixed;
  left: 0.0em;
  bottom: 1.0em;
}
footer #ticket_btn img{ width: 72%; }
footer #footer_items{
  padding: 3.5em 7% 3.5em;
  margin: 0 auto;
  text-align: center;
  font-size: 1.4rem;
  font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
}
.copyright1{ font-size: 1.55rem; color: #DEDEDE; }
.copyright1b{ padding-top: 12px; font-size: 1.55rem; color: #DEDEDE; }
.copyright2{ padding-top: 12px; font-size: 1.3rem; color: #CBCBCB; }

@media (max-width: 960px){
	footer #ticket_btn{ bottom: 0.7em; }
  footer #ticket_btn img{ width: 55%; }
  footer #footer_items{ padding: 2.5em 5% 2.2em; }
  .copyright1{ font-size: 1.2rem; }
  .copyright1b{ padding-top: 8px; font-size: 1.2rem; }
  .copyright2{ padding-top: 8px; font-size: 1.0rem; }
}

/* =========================
   固定ボタン（TOPへ）
========================= */
.pagetop{
  position: fixed;
  right: 17px;
  bottom: 17px;
  transition: .3s;
  opacity: 1;
  visibility: visible;
  z-index: 100;
}

.pagetop a{
  display: flex;
  width: 58px;
  height: 58px;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  transition: opacity .3s ease;
  border: 1px #BDAC81 solid;
  background-color: rgba(0,0,0,0.75);
  color: #fff;
  font-size: 33px;
  text-decoration: none;
}

.pagetop a:hover{ opacity: .7; }

/* =========================
   固定SNSアイコン（右下）
========================= */
.snsicons{
  position: fixed;
  right: 17px;
  bottom: 85px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 100;
}

.snsicons a{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 58px;
  height: 58px;
  border-radius: 100%;
  background-color: rgba(0,0,0,0.75);
  border: 1px #BDAC81 solid;
  transition: opacity .3s ease;
}

.snsicons a:hover{ opacity: .7; }

.snsicons img{
  width: 28px;
  height: auto;
}

/* =========================
   SP調整（少し大きく）
========================= */
@media (max-width: 960px){

  .pagetop{
    right: 14px;
    bottom: 14px;
  }
  .pagetop a{
    width: 42px;
    height: 42px;
    font-size: 23px;
  }
  .snsicons{
    right: 14px;
    bottom: 64px;
    gap: 6px;
  }
  .snsicons a{
    width: 42px;
    height: 42px;
  }
  .snsicons img{
    width: 21px;
  }
}

/* =========================
   8) 浜田省吾　画像
========================= */

.shogo_img { width: 100%; margin: 0 auto; }

@media (max-width: 960px){
	.shogo_img { width: 100%; }
}

