/*@charset "utf-8";
/*********************************************/
/*2025.11.26 修正*/
/*********************************************/
/*ボタン*/
.mp-top-bo-custom-button {
  width: 100%;              /* 横幅100% */
  display: flex;
  justify-content: center;   /* 中央に配置 */
  margin: 60px 0 100px;            /* 上下マージンは任意 */
}

.mp-top-bo-custom-button a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 400px;              /* ボタン自体の幅 */
  height: 60px;
  background-color: #353535;
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  text-decoration: none;
  position: relative;
  transition: background-color 0.3s;
  border-radius: 6px;
}

.mp-top-bo-custom-button a:hover {
  background-color: #d5cbd6; /* 背景を少し明るく */
}

.mp-top-bo-custom-button .mp-top-bo-button-text {
  flex: 1;
  text-align: center;
}

.mp-top-bo-custom-button .mp-top-bo-button-arrow {
  position: absolute;
  right: 24px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media all and (max-width:576px){
	.mp-top-bo-custom-button a {
	  width: 80%;
	}
}

/*ボタン*/
/* 親ボックス（ボタンをまとめる箱） */
.mp-programs-menu-box {
  display: flex;
  flex-wrap: wrap;            /* 横並びで折り返し可能 */
  justify-content: center;     /* 横並び時は中央寄せ */
  gap: 20px;                   /* ボタン間の隙間 */
  margin: 60px 0 100px;       /* 上下マージン */
}

/* ボタンを包む箱 */
.mp-bo-custom-button {
  flex: 0 0 auto; /* 横幅固定で縮まない */
}

/* ボタン本体 */
.mp-bo-custom-button a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 400px;              /* 固定幅 */
  max-width: 90%;            /* 小さい画面で少し縮む */
  height: 60px;
  background-color: #353535;
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  text-decoration: none;
  position: relative;
  transition: background-color 0.3s;
  border-radius: 6px;
}

/* ホバー時 */
.mp-bo-custom-button a:hover {
  background-color: #d5cbd6;
}

/* ボタンテキスト */
.mp-bo-custom-button .mp-bo-button-text {
  flex: 1;
  text-align: center;
}

/* 矢印 */
.mp-bo-custom-button .mp-bo-button-arrow {
  position: absolute;
  right: 24px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* スマホ対応 */
@media all and (max-width: 576px) {
  /* 親ボックスを縦並び＆中央寄せ */
  .mp-programs-menu-box {
    display: flex !important;       /* 確実にflex */
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px;                      /* ボタン間の隙間 */
    width: 100%;
  }

  /* ボタン幅調整 */
  .mp-bo-custom-button {
    flex: none;                     /* 横幅固定で伸びない */
    width: 100%;                     /* 親ボックス内で100% */
    display: flex;
    justify-content: center;        /* 中央寄せ */
  }

  .mp-bo-custom-button a {
    width: 80% !important;          /* ボタン自体80% */
    max-width: 400px;               /* 元のPCサイズ制限を維持 */
  }
}

@media all and (max-width: 576px) {
  /* ボタン箱を縦並びに */
  .mp-programs-menu-box {
    flex-direction: column;
    align-items: center;
  }
  /* ボタン幅調整 */
  .mp-bo-custom-button a {
    width: 80%;
  }
}


/*メニュー*/
#sp_menu{
    display: block !important;
}
.icon_menu {
    display: block !important;
}
#sp_menu.icon_menu {
    display: block !important;
}
.sp_menu_infor_btn a {
	display: block !important;
}
.sp_menu_navi li a { 
	display: block !important;
}
.nav-global { 
	display: block; 
}

/*#header.subpage_header { top: 0; position: relative; }*/
.navsub { padding-bottom: 22px; }
.navsub_box { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; width: 100%; padding-right: 20px;}
.hd_logo a { display: block; }
.icon_menu { position: relative; width: 30px; height: 30px; margin-right: 20px; cursor: pointer; }
.icon_menu:after { content: "Menu"; position: absolute; right: 0; bottom: 0; left: 0; line-height: 1; color: #333333; font-size: 1.2rem; text-align: center; }
.changeicon .icon_menu { margin: 14px auto; }
.icon_menu span { transition: all 0.4s; border-radius: 2px; background-color: #333333; width: 100%; height: 2px; position: absolute; left: 0; }
.icon_menu span:nth-of-type(1) { top: 0; }
.icon_menu span:nth-of-type(2) { top: 6px; width: 80%; }
.icon_menu span:nth-of-type(3) { top: 12px; width: 60%; }
.icon_menu_close { position: relative; width: 30px; height: 30px; background: url(../images/common/ic_close.png) no-repeat; cursor: pointer; }
#header.scrollheader { border-bottom: 3px solid rgba(0,140,199,0.7); }
#header.scrollheader .icon_menu:after { color: #333333; }
#header.scrollheader .icon_menu span { background-color: #333333; }
.nav-global { position: fixed; top: 27px; left: 100%; width: 100%; overflow-y: scroll; transition: .4s; transform: translateX(0); padding: 0; padding-bottom: 0px; background: #ffffff; z-index: 999; visibility: hidden; }
.nav-global { width: 80%; max-width: 350px; }
.nav-global.is-active { height: auto; position: absolute; visibility: visible; transform: translateX(-100%); transition: .4s; padding-bottom: 60px; }
.ftlstbtn_acctive { position: fixed !important; }
.modal-overlay { display: none; position: fixed; top: 0; left: 0; z-index: 100; width: 100%; height: 100%; overflow-y: auto; background-color: rgba(51,51,51,0.75); }
.nav-global .navsub_box { border-bottom: 1px dashed #cccccc; }
.sp_menu_infor { padding: 10px 0 0 0; text-align: center; }
.sp_menu_infor_phone { position: relative; color: #333333; font-weight: bold; font-size: 2.4rem; }
.sp_menu_infor_phone a { color: #333333; text-decoration: none; }
.sp_menu_infor_phone:before { content: "tel:"; font-size: 1.4rem; }
.sp_menu_infor_timework { padding-bottom: 10px; font-size: 1.2rem; }
.sp_menu_infor_btn { max-width: 230px; margin: 0 auto 16px; }
.sp_menu_infor_btn a { position: relative; display: block; padding: 6px 5px 6px 30px; background: #24bbe6; border-bottom: 3px solid #16708a; border-radius: 25px; color: #ffffff; font-size: 1.8rem; text-decoration: none; }
.sp_menu_infor_btn a:before { display: inline-block; content: ""; width: 27px; height: 20px; margin: 0 12px 0 0; background: url(../images/common/ic_pc.png) no-repeat; background-size: 100% auto; vertical-align: text-top; }
.sp_menu_lbl { padding: 4px 20px; background: #e7f9fd; color: #287a9E; }
.sp_menu_navi { position: relative; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-content: stretch; align-items: stretch; }
.sp_menu_brder { border-top: 1px dashed #cccccc; }
.sp_menu_brder:before { content: ""; position: absolute; top: 0; left: 0; right: 0; width: 1px; height: 100%; margin: 0 auto; border-left: 1px dashed #cccccc; }
.sp_menu_navi li { width: 50%; }
.sp_menu_brder li { width: 50%; border-bottom: 1px dashed #cccccc; }
.sp_menu_navi li a { display: block; padding: 10px 0; color: #333333; text-decoration: none; text-align: center; }
.sp_menu_navi li span { width: 22px; height: 22px; margin: 0 10px 0 -20px; }
.sp_menu_navi li span img { max-width: 22px; }
/*#header.subpage_header { position: relative; border-bottom: 3px solid rgba(0,140,199,0.7); background: #ffffff; }*/
#header.subpage_header .navsub { padding-bottom: 0; }
#header.subpage_header .icon_menu span { background-color: #333333; }
#header.subpage_header .icon_menu:after { color: #333333; }

.subpage_header { position: relative; }
.subpage_header .navsub { padding-bottom: 10px; }

@media screen and (max-width: 1109px) {
	.navsub_box { padding-right: 0px;}
}

/*メインキャッチ-------------*/
.wp-main-title-box{
	padding: 80px 0;
}
.wp-main-title-text{
	font-size: 500%;
	line-height: 1.5;
	letter-spacing: -0.01em;
	/*color: #daa520;*/
	color: #000000;
	text-shadow: 4px 2px 5px #ffffff, 4px -2px 5px #ffffff, -4px 2px 5px #ffffff, -4px -2px 5px #ffffff, 4px 0px 5px #ffffff, 0px 2px 5px #ffffff, -4px 0px 5px #ffffff, 0px -2px 5px #ffffff; 
	font-family: "Yu Mincho"; 
	font-weight: bold;
}
@media all and (max-width:1400px){
	.wp-main-title-box{
		padding: 80px 20px;
	}
	.wp-main-title-text{
		font-size: 400%;
		line-height: 1.5;
	}
}
@media all and (max-width:992px){
	.wp-main-title-text{
		font-size: 300%;
		line-height: 1.5;
	}
}
@media all and (max-width:768px){
	.wp-main-title-text{
		font-size: 300%;
		line-height: 1.5;
		margin-top: 40px;
	}
}
@media all and (max-width:576px){
	.wp-main-title-text{
		font-size: 200%;
		line-height: 1.5;
	}
}

/*右側に常時ついているボタン---------*/
.wp-right-btn-box {
	position: fixed;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	gap: 12px;
	z-index: 50;
}
	/* ボタン共通デザイン */
.wp-right-btn {
	writing-mode: vertical-rl;
	text-orientation: upright;
	padding: 40px 8px;
	font-size: 18px;
	font-weight: normal;
	color: #fff;
	text-decoration: none;
	border-radius: 8px 0 0 8px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.25);
	transition: all 0.3s ease;
	letter-spacing: 2px;
}

/* --- 色 --- */
.wp-right-btn-taiken {
	background: #f08300; /* オレンジ */
}
.wp-right-btn-yoyaku {
	background: #24bbe6; /* あお */
}

/* --- ホバーで光る --- */
.wp-right-btn:hover {
	box-shadow: 0 0 15px rgba(255, 255, 255, 0.6);
	transform: translateX(-4px);
	color: #daa520;
}

/* --- スマホの時 --- */
@media (max-width: 768px) {
  .wp-right-btn-box {
    position: fixed;
	top: inherit;
    bottom: 0px;  /* 下から60px */
    left: 0;
    width: 100%;
    transform: none;
    flex-direction: row;
    justify-content: center;
    gap: 10px;
    padding: 5px 10px;  /* paddingはheightで調整するので不要 */
    background: rgba(0,0,0,0.2); /* 透明背景、必要なければ削除 */
    z-index: 50;
  }

  .wp-right-btn {
    writing-mode: horizontal-tb; /* 横書き */
    text-orientation: initial;
	width: 50%;
    height: 40px;  /* 縦幅固定 */
    line-height: 40px; /* テキストを縦中央に */
    padding: 0px 0px;
    font-size: 16px;
    border-radius: 5px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25);
    display: inline-block;
    text-align: center;
  }
  .wp-right-btn:hover {
    transform: translateY(0); /* スマホでは横移動を消す */
  }
	/* フッダー */
	.ft_sub_copy{
		padding-bottom: 60px;
	}
}

/* イベントボックス */
.mp-event-box {
    width: 100%;
    text-align: center; /* 横中央 */
    margin: 0px auto 50px;
}
.mp-event-box img {
    max-width: 100%; /* 画面幅に応じて縮小 */
    height: auto;    /* アスペクト比を維持 */
    display: inline-block;
}

/*内部リンク*/
@media (min-width: 768px) {
	#spb, #trn, #rkn{
		scroll-margin-top: 100px; /* メニュー分の余白 */
	}
}


/*料金
/*********************************************/
.mp-ryoukin-box {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 36px;
	margin-bottom: 36px;
}

.iro-01{
	color: #d09800;
}
.iro-02{
	color: #5a8b00;
}
.iro-03{
	color: #004da2;
}
.iro-04{
	color: #9200a2;
}

.iro-01-back{
	background-color: #d09800;
}
.iro-02-back{
	background-color:  #5a8b00;
}
.iro-03-back{
	background-color:  #004da2;
}
.iro-04-back{
	background-color:  #9200a2;
}
.iro-01-waku{
  border: 1px solid #d09800;
}
.iro-02-waku{
  border: 1px solid #5a8b00;
}
.iro-03-waku{
  border: 1px solid #004da2;
}
.iro-04-waku{
  border: 1px solid #9200a2;
}
.iro-01-waku li::before { color: #d09800; }
.iro-02-waku li::before { color: #5a8b00; }
.iro-03-waku li::before { color: #004da2; }
.iro-04-waku li::before { color: #9200a2; }

/* --- 各ブロック --- */
.mp-ryoukin-training {
  border: 2px solid #b2b2b2;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
  padding: 30px 15px;
  box-sizing: border-box;
}

/* --- h3 --- */
.mp-ryoukin-training h3 {
  font-size: 34px;
  text-align: center;
  margin: 0;
}

/* --- 下のp（タイトル帯） --- */
.mp-ryoukin-training > p {
  width: 100%;
  color: #fff;
  text-align: center;
  padding: 3px 0;
  margin: 0px 0 8px;
  font-size: 21px;
	font-weight: bold;
}

/* --- 画像 --- */
/*
.mp-ryoukin-training img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
  margin-bottom: 20px;
}*/
.mp-ryoukin-training img {
  width: 100%;
  height: auto;   /* ← これが重要 */
  display: block;
  margin-bottom: 20px;
}


/* --- ul 周りの白背景箱 --- */
.mp-ryoukin-training ul {
  background: #fff;
  padding: 15px;
  margin: 0;
  list-style: none;
}

/* --- li（■＋テキスト） --- */
.mp-ryoukin-training ul li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 8px;
  font-size: 16px;
  color: #000;
}

.mp-ryoukin-training ul li::before {
  content: "■";
  margin-right: 6px;
  font-size: 16px;
}

/* 最後の li の下余白を消す */
.mp-ryoukin-training ul li:last-child {
  margin-bottom: 0;
}

/* --- 価格ブロック --- */
.mp-ryoukin-price {
  text-align: center;
  margin-top: 16px;
}

/* 回数（16回、8回） */
.mp-price-kai {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 26px;
  color: #fff;
  font-size: 16px;
  margin-right: 10px;
}

/* 金額（74,980など） */
.mp-price-kingaku {
  color: #ff0049;
  font-size: 32px;
  font-weight: bold;
  margin-right: 0px;
}

/* 円（税込） */
.mp-price-en {
  color: #666666;
  font-size: 18px;
}

/*注釈*/
.wp_course_box{
  border: 2px solid #b2b2b2;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
  padding: 20px;
  box-sizing: border-box;
	width: 100%;
	margin-bottom: 36px;
}
.wp_course_note ul {
  background: #fff;
  padding: 15px;
  margin: 0;
  list-style: none;
}
.wp_course_note ul li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 8px;
  font-size: 16px;
  color: #000;
}
.wp_course_note ul li::before {
  content: "※";
  color: #000;
  margin-right: 6px;
  font-size: 16px;
}

/*スタジオレンタル　b90039*/

.iro-05{
	color: #b90039;
	padding-bottom: 30px;
}
.iro-05-waku li::before { color: #b90039; }
.iro-05-back{
	background-color: #fff8ea;
}
.mp-studio-box {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 36px;
}
.mp-studio-indent{
	color: #000;
	font-size: 16px;
	padding: 2em;
	text-indent: -1em;
}

/*初めての方へ
/*********************************************/
.mp-first-wrap{
	margin: 0 0 100px;
}
.mp-first-txt-box{
	width: 1110px;
	margin: 30px auto 60px;
	font-size: 18px;
}
.mp-first-in-box{
	width: 1110px;
	margin: 30px auto;
	font-size: 18px;
}
.mp-first-in-box p{
	margin: 0 0 30px;
}

@media all and (max-width:1200px){
	.mp-first-txt-box, .mp-first-in-box{
		width: 86%;
	}
}
@media all and (max-width:768px){
	.mp-first-txt-box, .mp-first-in-box{
		width: 96%;
		font-size: 16px;
	}
}


/*基本-----------------------*/
.mp-first-kihon-box {
  border: 2px solid #f2f2f2;
  background: #fff;
  padding: 30px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  box-sizing: border-box;
	margin-top: 50px;
}

/* 2段の中身 */
.mp-first-kihon {
  background: #fff;
}

/* h3（ゴールド背景・白字） */
.mp-first-kihon h3 {
  background: #daa520;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  padding: 10px 12px;
  margin-bottom: 15px;
}

/* 文章 */
.mp-first-kihon p {
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 12px;
	margin-left: 0.5em;
}

/* ※ のインデント */
.mp-first-kihon p.note {
	margin-left: 0.5em;
  padding-left: 1em;
  text-indent: -1em;
}

.mp-first-kihon ul {
  list-style: none;
  padding: 5px;
  margin: 0 0 15px 0;
}

.mp-first-kihon ul li {
  position: relative;
  padding-left: 1em; /* 「・」の分だけ右に寄せる */
	margin-left: 1em;
  font-size: 18px;
  line-height: 1.6;
}

.mp-first-kihon ul li::before {
  content: "•";  /* 自前の丸 */
  position: absolute;
  left: 0;
  top: 0;
  color: #000;   /* 必要なら色変更OK */
  font-size: 1em;
  line-height: 1.6;
}


/* 画像中央寄せ */
.mp-first-kihon img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 20px auto 0;
}

/* スマホ時：1段組みに変更 */
@media (max-width: 768px) {
  .mp-first-kihon-box {
    grid-template-columns: 1fr;
  padding: 10px;
  }
	.mp-first-kihon h3 {
	  font-size: 20px;
	}
	.mp-first-kihon p {
  font-size: 16px;
	}
	.mp-first-kihon ul li {
	  font-size: 16px;
	}
}

/*流れ------------------*/
/* 2段組みレイアウト */
.mp-first-flow-box {
  display: flex;
  align-items: flex-start;
  gap: 70px; /* 画像と文章の間 */
  margin-bottom: 40px;
}

/* 画像コンテナを固定サイズに */
.mp-first-flow-box > div:first-child {
  width: 150px;
  height: 136px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0; /* 縮まないように */
}

/* 画像自体をコンテナ内でフィットさせる */
.mp-first-flow-box img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

/* タイトル */
.mp-first-flow-box h4 {
  font-size: 38px;
  color: #555555;
  margin: 0 0 10px 0;
}

/* 文章 */
.mp-first-flow-box p {
  font-size: 18px;
  margin: 0;
  line-height: 1.6;
}

/* 横幅100%部分（当日の帯） */
.mp-first-flow-toujitsu {
  width: 100%;
  background: #f2f2f2;
  padding: 10px 0;
  text-align: center;
  font-size: 38px;
  margin: 50px 0;
}

/* ---- スマホレスポンシブ ---- */
@media (max-width: 768px) {
  .mp-first-flow-box {
    flex-direction: column;
    align-items: center;
    gap: 20px;
    text-align: center;
  }

  .mp-first-flow-box h4 {
    font-size: 24px;
  }

  .mp-first-flow-box p {
    font-size: 16px;
  }

  .mp-first-flow-toujitsu {
    font-size: 30px;
  }

  .mp-first-flow-box > div:first-child {
    width: 120px;
    height: 110px;
  }
	.mp-first-flow-toujitsu {
	  font-size: 24px;
	}
}

/* ---- メニュー ---- */
.sp_menu_infor_btn { max-width: 230px; margin: 0 auto 16px; }
.sp_menu_infor_btn a { position: relative; display: block; padding: 6px 5px 6px 30px; background: #f08300; border-bottom: 3px solid #f06800; border-radius: 25px; color: #ffffff; font-size: 1.8rem; text-decoration: none; }
.sp_menu_infor_btn a:before { display: inline-block; content: ""; width: 27px; height: 20px; margin: 0 12px 0 0; background: url(../images/common/ic_pc.png) no-repeat; background-size: 100% auto; vertical-align: text-top; }

/* ---- カッコの空き調整 ---- */
.kakko{
	display:inline-block;
	transform: scaleX(0.6);   /* 横幅を縮める */
	margin: 0 -0.2em;        /* 前後の余白を詰める */
	letter-spacing: -0.06em;
}