/* ---------------------------------------------
//  トップページ
// --------------------------------------------- */

/* メインビジュアル */
/* ACF の画像1〜10を使う、上下2段のマルキー型メインビジュアル */
#top_mv:has(.mv_marquee) { --mv-teal:#089ca2; position:relative; isolation:isolate; display:grid; max-height:630px; overflow:hidden; place-items:center; padding:72px 20px; background:#f7f5f3; }
#top_mv .mv_marquee { position:absolute; inset:0; z-index:-1; display:grid; align-content:space-between; padding:10px 0; pointer-events:none; }
#top_mv .mv_marquee_row { width:100%; overflow:hidden; padding:30px 0 52px; }
#top_mv .mv_marquee_track { display:flex; width:max-content; will-change:transform; animation:mv_marquee 266s linear infinite; }
#top_mv .mv_marquee_row--bottom .mv_marquee_track { animation-duration:189s; animation-direction:reverse; }
#top_mv .mv_marquee_set { display:flex; flex:0 0 auto; align-items:center; gap:clamp(18px, 2.2vw, 42px); padding-right:clamp(18px, 2.2vw, 42px); }
#top_mv .mv_photo { flex:0 0 auto; width:clamp(150px, 15vw, 270px); aspect-ratio:3 / 2; margin:0; overflow:hidden; border-radius:12px; background:#fff; box-shadow:0 8px 22px rgb(31 42 43 / 12%); }
#top_mv .mv_photo img { display:block; width:100%; height:100%; object-fit:cover; }
#top_mv .mv_photo--lg { width:clamp(190px, 19vw, 340px); aspect-ratio:4 / 3; }
#top_mv .mv_photo--md { width:clamp(160px, 16vw, 285px); }
#top_mv .mv_photo--sm { width:clamp(130px, 13vw, 235px); }
#top_mv .mv_photo--up { transform:translateY(-18px); }
#top_mv .mv_photo--down { transform:translateY(22px); }
#top_mv .mv_content { position:relative; z-index:1; width:min(660px, 100%); box-sizing:border-box; padding:clamp(25px, 4vw, 72px) clamp(20px, 4vw, 66px); text-align:center; border-radius:20px; background:rgb(255 255 255 / 97%); box-shadow:0 14px 34px rgb(31 42 43 / 10%); }
#top_mv .mv_content > :first-child { margin-top:0; }
#top_mv .mv_content > :last-child { margin-bottom:0; }
#top_mv .mv_content p { margin:0; font-weight:700; color:#172025; }
#top_mv .mv_content p:first-child { font-size:clamp(26px, 3.7vw, 44px); line-height:1.35; letter-spacing:.03em; }
#top_mv .mv_content p:first-child::after { display:block; width:66px; height:2px; margin:28px auto 24px; content:""; background:var(--mv-teal); }
#top_mv .mv_content p + p { margin-top:16px; font-size:clamp(16px, 1.8vw, 20px); line-height:1.5; }
#top_mv .mv_content p:last-child { margin-top:32px; }
#top_mv .mv_content p:last-child a { display:inline-block; position:relative; min-width:min(100%, 390px); box-sizing:border-box; padding:15px 58px 15px 34px; border-radius:999px; background:var(--mv-teal); color:#fff; font-size:clamp(16px, 2vw, 24px); line-height:1.2; text-decoration:none; box-shadow:0 6px 12px rgb(8 156 162 / 20%); }
#top_mv .mv_content p:last-child a::after { position:absolute; top:50%; right:28px; width:9px; height:9px; border-top:2px solid #fff; border-right:2px solid #fff; content:""; transform:translateY(-50%) rotate(45deg); }
#top_mv .mv_content p:last-child a:hover, #top_mv .mv_content p:last-child a:focus-visible { background:#07878c; }
#top_mv .mv_motion_toggle { position:absolute; width:1px; height:1px; opacity:0; }
#top_mv .mv_motion_button { position:absolute; z-index:2; right:18px; bottom:18px; display:grid; width:38px; height:38px; place-items:center; border-radius:50%; background:rgb(255 255 255 / 92%); box-shadow:0 2px 8px rgb(31 42 43 / 12%); cursor:pointer; }
#top_mv .mv_motion_button::before { width:9px; height:13px; border-right:3px solid #172025; border-left:3px solid #172025; content:""; }
#top_mv .mv_motion_button span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
#top_mv .mv_motion_button_play { display:none; }
#top_mv .mv_motion_toggle:checked ~ .mv_marquee .mv_marquee_track { animation-play-state:paused; }
#top_mv .mv_motion_toggle:checked ~ .mv_motion_button::before { width:0; height:0; border-width:7px 0 7px 11px; border-style:solid none solid solid; border-color:transparent currentcolor transparent #172025; }
#top_mv .mv_motion_toggle:checked ~ .mv_motion_button .mv_motion_button_pause { display:none; }
#top_mv .mv_motion_toggle:checked ~ .mv_motion_button .mv_motion_button_play { display:block; }
#top_mv .mv_motion_toggle:focus-visible ~ .mv_motion_button { outline:3px solid #172025; outline-offset:3px; }
@keyframes mv_marquee { to { transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce) { #top_mv .mv_marquee_track { animation-play-state:paused; } #top_mv .mv_motion_button { display:none; } }
@media (max-width:640px) { #top_mv:has(.mv_marquee) { min-height:500px; padding:0 15px; } #top_mv .mv_marquee { padding:0; } #top_mv .mv_marquee_row--top { padding:20px 0 52px; } #top_mv .mv_marquee_row--bottom { padding:52px 0 20px; } #top_mv .mv_photo--up { transform:translateY(-10px); } #top_mv .mv_photo--down { transform:translateY(12px); } #top_mv .mv_content { border-radius:16px; } #top_mv .mv_content p:first-child::after { margin:16px auto 12px; } #top_mv .mv_content p:last-child { margin-top:20px; } #top_mv .mv_content p:last-child a { width:100%; min-width:0; } }

#top_mv{
  display: flex;
  flex-wrap: wrap;
  background-color: var(--light-gray);
}
#top_mv .mv_txt{
  width: 40%;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.4;
}
#top_mv .mv_txt span{
  color: var(--orange);
}
#top_mv .mv_txt .btn_web a{
  display: block;
  position: relative;
  width: max(300px, 100%);
  background-color: var(--blue-green);
  border-radius: 50px;
  font-size: 24px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  margin: 20px auto;
  padding: 10px 10px;
}
#top_mv .mv_txt .btn_web a::after{
  position: absolute;
  content: "";
  top: calc(50% - 5px);
  right: 15px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

#top_mv .mv_img{
  width: 40%;
}
#top_mv .mv_mask {
  margin: 0;
  mask-image: url("../images/top/top_mv_mask.png");/*マスクレイヤーとして使用する画像*/
  mask-repeat: no-repeat;
  mask-position: 0 0;
  mask-size: cover;
  -webkit-mask-image: url("../images/top/top_mv_mask.png");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: 0 0;
  -webkit-mask-size: cover;
}

/* PCとSPの間サイズの調整 */
@media (max-width: 1000px) {
  #top_mv .mv_txt{
    width: 40%;
  }
}

@media (max-width: 770px) {
  #top_mv .mv_txt{
    width: 50%;
    font-size: 34px;
  }
}


/* SPのスタイル */
@media (max-width: 640px){
  #top_mv .mv_txt,
  #top_mv .mv_txt p,
  #top_mv .mv_txt .btn_web,
  #top_mv .mv_img{
    width: 100%;
  }
  #top_mv .mv_txt{
    padding: 50px 10px;
    text-align: center;
  }

  #top_mv .mv_txt .btn_web a{
    box-sizing: border-box;
    font-size: 22px;
    width: min(300px, 100%);
  }
  #top_mv .mv_mask {
    mask-image: url("../images/top/top_mv_mask_sp.png");/*マスクレイヤーとして使用する画像*/
    mask-position: center;
    -webkit-mask-image: url("../images/top/top_mv_mask_sp.png");
    -webkit-mask-position: center;
  }

}



/* お知らせ */
.news_wrap{
	margin-top: 40px;
}
.news_wrap .container_large{
  display: flex;
  flex-wrap: wrap;
  padding: 20px 15px;
  background-color: var(--light-gray);
  border-radius: var(--common-radius);
}
.news_wrap .topics{
  width: calc(100% - 145px);
  padding: 0 10px 0 0;
  display: flex;
  font-size: 16px;
}
.news_wrap .topics a,
.news_wrap .topics a:visited{
  color: #000;
}
.news_wrap .topics .label{
  width: 115px;
  text-align: center;
  align-self: center;
  border-right: 1px solid #c6c4c2;
}
.news_wrap .topics .txt{
  padding: 0 0 0 20px;
}
.news_wrap .btn_all_news{
  width: 135px;
  background-color: var(--white);
  border-radius: var(--common-radius);
  align-self: center;
}
.news_wrap .btn_all_news a,
.news_wrap .btn_all_news a:visited{
  text-decoration: none;
  color: #000;
  display: block;
  text-align: center;
  font-size: 14px;
  position: relative;
  padding: 3px;
}
.news_wrap .btn_all_news a::after{
  position: absolute;
  content: "";
	top: calc(50% - 2px);
	right: 8px;
	width: 4px;
	height: 4px;
	border-top: 1px solid #888;
	border-right: 1px solid #888;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.news_wrap .btn_all_news a:hover{
  border-radius: var(--common-radius);
}

/* 概要 */
.top_about{
  
}
.top_about .container_small{
	padding: 100px 0;
}
.top_about .midashi_about{
	text-align: center;
}
.about_img_wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 20px auto;
}
.about_img_wrap div{
	width: 32%;
}
.top_about p{
	text-align: center;
	font-size: 24px;
	font-weight: 700;
}






/* PCとSPの間サイズの調整 */
@media (max-width: 770px) {
  #top_mv .container_top_mv .mv_rogo div{
    width: 115px;
  }
  #top_mv .container_top_mv .mv_rogo h2{
    font-size: 30px;
    padding: 0 0 30px 20px;
  }
}



/* SPのスタイル */
@media (max-width: 640px){

  /* メインビジュアル */
  #top_mv .container_top_mv{
    padding: 0;
  }
  #top_mv .container_top_mv .mv_rogo div{
    width: 78px;
  }
  #top_mv .container_top_mv .mv_rogo h2{
    text-align: center;
    font-size: 24px;
    padding: 10px 0 15px 0;
    width: 100%;
  }
  #top_mv .container_top_mv .mv_txt{
    font-size: 12px;
  }

  /* お知らせ */
  .news_wrap{
    margin-top: 20px;
    padding: 0 10px;
  }
  .news_wrap .container_large{
    justify-content: space-between;
    padding: 12px 10px;
  }
  .news_wrap .topics{
    display: contents;
    font-size: 14px;
  }
  .news_wrap .topics .label{
    order: 1;
    width: 85px;
    margin: 0px;
  }
  .news_wrap .btn_all_news{
    order: 2;
    border-radius: var(--common-radius);
    font-size: 14px;
    width: 130px;
    margin: 0;
  }
  .news_wrap .topics .txt{
    order: 3;
    padding: 10px 10px 0 10px;
    width: 100%;
  }


  /* 概要 */
.top_about .container_small{
	padding: 50px 0;
}
	.top_about p{
		font-size: 18px;
	}








}

/* ---------------------------------------------
//  メインビジュアル 2026-11-09 決定案（見本：MV_決定案プレビュー2_白箱.html）
//  inc/shortcode/mv2.php が #top_mv に .mv_v2 を付けたときだけ効く（mv2.php を戻せば元の見た目に戻る）。
//  パソコン：カード無し・左寄せ・文字のまとまりの後ろに少し透ける白箱・ボタン2つ。写真の白い幕は薄め。
//  スマホ：上の「max-width:640px」の白い角丸の箱（.mv_content）のまま。
// --------------------------------------------- */
@media (min-width:641px) {
  #top_mv.mv_v2:has(.mv_marquee) { --mv-teal:#1f96a6; --mv-ink:#172025; --box-px:min(44px, 3vw); display:block; max-height:none; min-height:560px; padding:0; place-items:initial; }
  /* 写真の上の幕（左＝文字の側をわずかに濃く） */
  #top_mv.mv_v2 .mv_veil { position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(90deg, rgb(247 245 243 / 40%) 0%, rgb(247 245 243 / 28%) 50%, rgb(247 245 243 / 12%) 100%); }
  #top_mv.mv_v2 .mv_marquee { z-index:-1; }
  /* 白箱が画面の左端にはみ出さないよう、箱の外に最低24pxを残す */
  #top_mv.mv_v2 .mv_copy { position:relative; z-index:1; width:min(1200px, calc(100% - 2 * (var(--box-px) + 24px))); margin:0 auto; padding:64px 0 72px; box-sizing:border-box; text-align:left; }
  #top_mv.mv_v2 .mv_box { display:inline-block; box-sizing:border-box; max-width:calc(100% + 2 * var(--box-px)); margin:calc(22px - var(--box-px)) calc(-1 * var(--box-px)) calc(-1 * var(--box-px)); padding:var(--box-px); background:rgb(255 255 255 / 92%); border-radius:16px; box-shadow:0 4px 18px rgb(31 42 43 / 7%); }
  #top_mv.mv_v2 .mv_title { margin:22px 0 0; color:var(--mv-ink); font-size:clamp(30px, 3.75vw, 52px); font-weight:900; line-height:1.38; letter-spacing:.02em; word-break:keep-all; overflow-wrap:anywhere; }
  /* 行の上の余白と、文末「。」の字の中に残る空き（約.18字）を打ち消して、見た目の余白を四辺そろえる */
  #top_mv.mv_v2 .mv_box .mv_title { margin-top:-.19em; margin-right:-.18em; }
  /* 文末の「、」「。」を半角幅の字形にして右の空きをなくす（Chrome・Safari 共通の仕組み） */
  #top_mv.mv_v2 .mv_box .mv_title .p_end { font-style:normal; font-feature-settings:"halt"; letter-spacing:0; }
  #top_mv.mv_v2 .mv_title span, #top_mv.mv_v2 .mv_lead span { display:inline-block; }
  #top_mv.mv_v2 .mv_lead { margin:20px 0 0; color:var(--mv-teal); font-size:clamp(15px, 1.6vw, 22px); font-weight:700; line-height:1.6; letter-spacing:.03em; word-break:keep-all; }
  #top_mv.mv_v2 .mv_btns { display:flex; gap:16px; margin-top:34px; }
  #top_mv.mv_v2 .mv_btn { position:relative; display:flex; flex-direction:column; justify-content:center; width:300px; min-height:76px; box-sizing:border-box; padding:10px 44px 10px 78px; border-radius:999px; color:#fff; text-decoration:none; line-height:1.25; box-shadow:0 6px 14px rgb(31 42 43 / 16%); }
  #top_mv.mv_v2 .mv_btn--web { background:var(--mv-teal); }
  #top_mv.mv_v2 .mv_btn--line { background:#06c755; }
  #top_mv.mv_v2 .mv_btn::before { position:absolute; left:26px; top:50%; translate:0 -50%; content:""; background-repeat:no-repeat; background-size:contain; background-position:center; }
  #top_mv.mv_v2 .mv_btn--web::before { width:37px; height:26px; background-image:url(../images/common/icon_web.png); }
  #top_mv.mv_v2 .mv_btn--line::before { width:33px; height:28px; background-image:url(../images/common/icon_line.png); }
  #top_mv.mv_v2 .mv_btn::after { position:absolute; right:24px; top:50%; width:9px; height:9px; border-top:2px solid #fff; border-right:2px solid #fff; content:""; transform:translateY(-50%) rotate(45deg); }
  #top_mv.mv_v2 .mv_btn_main { font-size:24px; font-weight:700; letter-spacing:.04em; }
  #top_mv.mv_v2 .mv_btn_sub { order:-1; font-size:13px; font-weight:700; opacity:.95; letter-spacing:.02em; }
  /* パソコンではスマホ用の箱を出さない */
  #top_mv.mv_v2 .mv_content { display:none; }
}
@media (max-width:640px) {
  #top_mv.mv_v2 .mv_veil, #top_mv.mv_v2 .mv_copy { display:none; }
}