/*
Theme Name: estudio MARZO Theme 2026
Description: スタジオマルソのTheme 2026
Author: goodscoot.design
*/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  background-image: url(images/grand_bg.jpg);
  background-repeat: repeat;
  margin: 0px;
  padding: 0px;
  height: 100%;
}
body {
  margin: 0;
  padding: 0;
  color: #333;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  background-repeat: repeat-y;
  height: 100%;
  position: relative;
  z-index: 0;
  background-position: center top;
}
ul, ol, dl {
  padding: 0;
  margin: 0;
}
h1, h2, h3, h4, h5, h6 {
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
  font-weight: normal;
  word-break: break-all;
}
a img {
  border: none;
}
figure {
  padding: 0px;
  margin: 0px;
}
a:link {
  color: #42413C;
  text-decoration: underline;
}
a:visited {
  color: #6E6C64;
  text-decoration: underline;
}
a:hover, a:active, a:focus {
  text-decoration: none;
}
/* mov wrap */
.movie-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.movie-wrap iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
.gmap {
  position: relative;
  padding-bottom: 40.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}
.gmap iframe, .gmap object, .gmap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-style: none;
}
/* homepage css ------------------------------------ */
.innerbox {
  width: 90%;
  max-width: 1020px;
  margin-left: auto;
  margin-right: auto;
}
/* -- curtain background Images ------------------------- */
.curtain {
  margin-bottom: -118px;
  position: relative;
  height: 100%;
}
div.newItem {
  z-index: 1;
  position: absolute;
  left: 60px;
  top: -10px;
  margin: 0px;
  background-image: url(images/new.png);
  background-repeat: no-repeat;
  height: 39px;
  width: 41px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  font-size: 9px;
  color: #FFF;
  text-indent: -1000px;
  overflow: hidden;
}
img, object, embed, video {
  width /***/ : 100%;
  vertical-align: top;
  height: auto;
}
/* container css ------------------------------------ */
#containerHome {
  background-image: url(images/ka_bg_top.png);
  background-repeat: repeat-y;
  background-position: right top;
  padding: 0px;
  background-size: 10vw auto;
}
#containerPage, #containerCategory {
  background-image: url(images/ka_bg_top.png);
  background-repeat: repeat-y;
  background-position: right top;
  margin: 0px;
  padding: 0px;
  background-size: 10vw auto;
}
#containerPage .curtain, #containerCategory .curtain {
  position: relative;
  padding-bottom: 100px;
}
.curtain2 {
  background-repeat: no-repeat;
  background-position: right bottom;
  background-image: url(images/ka_bg_btm_top.png);
  margin-bottom: -100px;
  position: relative;
  height: 100%;
  background-size: 18vw auto;
}
#containerPage.notfound {
  height: 100%;
}
#containerPage.notfound h1 {
  text-align: center;
}
/* page background img css ----------------------- */
.newsImg, .eventImg {
  width: 60vw;
  position: absolute;
  max-width: 500px;
  left: -13vw;
  top: -2vw;
  z-index: 0;
}
.homepageImg {
  width: 60vw;
  max-width: 500px;
  position: absolute;
  left: -13vw;
  top: -2vw;
  z-index: 0;
}
.beginnerImg {
  width: 40vw;
  max-width: 450px;
  position: absolute;
  left: -13vw;
  top: -5vw;
  z-index: 10;
}
.studioImg, .booking-formImg {
  width: 35vw;
  max-width: 400px;
  position: absolute;
  left: -5vw;
  top: -5vw;
  z-index: 10;
}
.lessonImg {
  width: 30vw;
  max-width: 400px;
  position: absolute;
  left: -1vw;
  top: -28vw;
  z-index: 10;
}
.moviesImg {
  width: 30vw;
  max-width: 280px;
  position: absolute;
  left: -0vw;
  top: 0%;
  z-index: 10;
}
.accessImg {
  width: 80vw;
  position: absolute;
  max-width: 800px;
  left: -30vw;
  top: -35%;
  z-index: 10;
}
.linkImg {
  width: 50vw;
  position: absolute;
  max-width: 280px;
  left: -2vw;
  top: -25%;
  z-index: 10;
}
.contactImg {
  width: 50vw;
  position: absolute;
  max-width: 400px;
  left: -5vw;
  top: -25%;
  z-index: 10;
}
.resistImg {
  width: 35vw;
  position: absolute;
  max-width: 500px;
  left: -8vw;
  top: -4vw;
  z-index: 10;
}
/* footer CSS -------------------------------------- */
#footerHome {
  background-color: #990000;
  z-index: 1;
  width: 100%;
  clear: both;
  position: fixed;
  bottom: 0px;
}
#footerPage {
  background-color: #990000;
  z-index: 1;
  width: 100%;
  clear: both;
  position: relative;
  bottom: 0px;
}
#footerSecond {
  background-color: #900;
  clear: both;
  height: 100px;
  position: relative;
  background-image: url(images/ka2_bg_btm.png);
  background-repeat: no-repeat;
  background-position: center -600px;
  bottom: 0px;
  margin: 0px;
  padding: 0px;
}
.footerInner {
  width: 980px;
  margin-right: auto;
  margin-left: auto;
  padding-top: 10px;
  padding-bottom: 10px;
}
.footerWrap {
  display: flex;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: center;
}
.footerLeftBox {
  width: 44%;
  font-size: 85%;
  color: #CCC;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-right: 10px;
  padding-left: 10px;
}
.footerLeftBox h2 {
  font: bold 150% Arial, Helvetica, sans-serif;
  color: #FFF;
  margin-bottom: 0.5em;
}
.footerLeftBox p {
  padding-top: 0em;
  padding-right: 1em;
  padding-bottom: 1em;
  margin: 0px;
  font-size: 90%;
}
.footerWrap nav {
  width: 50%;
}
#footerBtnmenu {
  list-style-type: none;
  display: flex;
  align-items: center;
  flex-flow: wrap;
  gap: 8px;
  margin-right: 60px;
  padding-bottom: 1em;
}
#footerBtnmenu li {
  width: 48%;
  list-style-type: none;
  text-indent: 0;
  position: relative;
  text-align: center;
}
#u_navi01 a, #u_navi02 a {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  white-space: nowrap;
  padding: 16px 22px;
  background-color: #FFF;
  border-radius: 6px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  color: #333;
  font-size: 15px;
  text-decoration: none;
  overflow: visible;
  top: auto;
  transition: opacity 0.2s ease;
  position: relative;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 100%;
  text-align: center;
}
#u_navi01 a::after, #u_navi02 a::after {
  position: absolute;
  content: '';
  background-color: #990106;
  width: 4px;
  height: 80%;
  left: 10px;
  border-radius: 100px;
}
#u_navi01 a:hover, #u_navi02 a:hover {
  display: flex;
  background-image: none;
  opacity: 0.75;
  -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.12);
}
.curtain_btm {
  position: absolute;
  content: '';
  width: 18.15vw;
  height: auto;
  bottom: 0%;
  right: 0%;
  pointer-events: none;
}
.topheader-contents {
  width: 100%;
  position: relative;
}
.topheader-contents .innerbox {
  display: flex;
  flex-flow: row;
  justify-content: space-around;
}
.headcont {
  width: 55%;
}
.topheader-contents h1 {
  float: left;
  width: 404px;
  margin-top: 150px;
  margin-left: 120px;
  margin-right: 10px;
  position: relative;
  z-index: 2;
}
.topheader-contents .betisbox {
  position: relative;
  width: 100%;
  margin: 0px;
  padding: 0px;
  left: 120px;
  max-width: 400px;
}
.topheader-contents .betisbox a:hover {
  opacity: 0.5;
}
#sidemenu {
  width: 100%;
  margin-top: 20px;
  padding-top: 1em;
  padding-bottom: 1em;
}
#sidemenu ul {
  text-align: center;
  z-index: 1;
  width: 100px;
  padding: 0px;
  list-style-type: none;
  height: 60px;
  margin: 0px;
  float: left;
}
/* sidemenu navigation ---------------------------------- */
#sidemenu li {
  list-style-type: none;
  text-indent: -10000px;
  position: relative;
  overflow: hidden;
  padding-bottom: 5px;
}
#sidemenu li a {
  width: 100%;
}
/* ロゴ項目だけ、文字隠しテクニックを解除する */
#sidemenu li.pcnav-logo {
  text-indent: 0;
  overflow: visible;
  height: auto;
  padding-bottom: 10px; /* メニューとの間隔。不要なら0でOK */
}
#sidemenu li.pcnav-logo a {
  display: block;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}
#sidemenu li.pcnav-logo img {
  display: block;
  width: 100%;
  height: auto;
}
/* menu */
#navi01 a {
  background-position: 0px 0px;
  height: 38px;
  display: block;
  top: 0px;
  background-image: url(images/topmenu.png);
  overflow: hidden;
}
#navi01 a:hover {
  display: block;
  background-image: url(images/topmenu.png);
  background-position: 0px -340px;
}
#navi02 a {
  background-position: 0px -42px;
  height: 46px;
  display: block;
  top: 0px;
  background-image: url(images/topmenu.png);
  overflow: hidden;
}
#navi02 a:hover {
  display: block;
  background-image: url(images/topmenu.png);
  background-position: 0px -382px;
}
#navi03 a {
  background-position: 0px -88px;
  height: 38px;
  display: block;
  top: 0px;
  background-image: url(images/topmenu.png);
  overflow: hidden;
}
#navi03 a:hover {
  display: block;
  background-image: url(images/topmenu.png);
  background-position: 0px -428px;
}
#navi04 a {
  background-position: 0px -130px;
  height: 38px;
  width: 270px;
  display: block;
  top: 0px;
  background-image: url(images/topmenu.png);
  overflow: hidden;
}
#navi04 a:hover {
  display: block;
  background-image: url(images/topmenu.png);
  background-position: 0px -470px;
}
#navi05 a {
  background-position: 0px -172px;
  height: 38px;
  width: 270px;
  display: block;
  top: 0px;
  background-image: url(images/topmenu.png);
  overflow: hidden;
}
#navi05 a:hover {
  display: block;
  background-image: url(images/topmenu.png);
  background-position: 0px -512px;
}
#navi06 a {
  background-position: 0px -215px;
  height: 34px;
  width: 270px;
  display: block;
  top: 0px;
  background-image: url(images/topmenu.png);
  overflow: hidden;
}
#navi06 a:hover {
  display: block;
  background-image: url(images/topmenu.png);
  background-position: 0px -555px;
}
#navi07 a {
  background-position: 0px -255px;
  height: 37px;
  width: 270px;
  display: block;
  top: 0px;
  background-image: url(images/topmenu.png);
  overflow: hidden;
  margin-top: 0px;
}
#navi07 a:hover {
  display: block;
  background-image: url(images/topmenu.png);
  background-position: 0px -595px;
}
#navi08 a {
  background-position: 0px -298px;
  height: 37px;
  width: 270px;
  display: block;
  top: 0px;
  background-image: url(images/topmenu.png);
  overflow: hidden;
  margin-top: 0px;
}
#navi08 a:hover {
  display: block;
  background-image: url(images/topmenu.png);
  background-position: 0px -638px;
}
/* under container */
#under-container {
  width: 85%;
  clear: both;
  margin-right: auto;
  margin-left: auto;
  margin-top: 5vw;
  padding-bottom: 200px;
}
#under-container .innerbox {
  display: flex;
  flex-flow: wrap;
  justify-content: space-between;
}
#under-container a:link {
  color: #42413C;
  text-decoration: none;
}
#under-container a:visited {
  color: #333;
  text-decoration: none;
}
#under-container a:hover, a:active, a:focus {
  text-decoration: none;
  color: #900;
}
#under-container .bg {
  background-image: url(images/ka_bg_btm_top.png);
  background-repeat: no-repeat;
  background-position: right -400px;
  height: 200px;
}
#under-container .underInner {
  width: 980px;
  margin-right: auto;
  margin-left: auto;
  padding-top: 10px;
}
#under-container ul {
  list-style-type: none;
  margin-left: 10px;
}
#under-container .box01 {
  width: 48%;
}
#under-container h2 {
  margin-bottom: 0px;
  padding-bottom: 0px;
  margin-top: 0px;
  padding-top: 0px;
  max-width: 151px;
}
#under-container .box01 dl {
  clear: both;
  margin-top: 0px;
  margin-bottom: 5px;
  border-bottom-width: 1px;
  border-bottom-style: dotted;
  border-bottom-color: #999;
  border-top-style: none;
  position: relative;
  margin-left: 5px;
}
#under-container .box01 dt {
  float: left;
  width: 80px;
  clear: both;
  font-size: 85%;
  font-weight: bold;
  color: #900;
  font-family: Georgia, "Times New Roman", Times, serif;
}
#under-container .box01 dd {
  float: left;
  padding: 0px;
  margin-left: 10px;
  margin-right: 10px;
}
#under-container .box01 dl dd ul {
  margin: 0px;
  padding: 0px;
}
#under-container .box02 {
  width: 48%;
}
#under-container .top_resultWrap {
  display: flex;
  flex-flow: wrap;
  justify-content: space-between;
}
#under-container .top_resultBox {
  vertical-align: top;
  width: 32%;
  display: inline-block;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  text-align: left;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 5px;
  padding-left: 0px;
  position: relative;
  transition: all 0.5s;
}
#under-container .top_resultBox div.newItem {
  z-index: 1;
  position: absolute;
  left: -10px;
  top: -10px;
  margin: 0px;
  background-image: url(images/new.png);
  background-repeat: no-repeat;
  height: 39px;
  width: 41px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  font-size: 9px;
  color: #FFF;
  text-indent: -1000px;
  overflow: hidden;
}
#under-container .top_resultBox:hover {
  opacity: 0.5;
}
#under-container .top_resultBox h2 {
  font-size: 100%;
  position: relative;
  top: -25px;
  font-weight: normal;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: -15px;
  margin-left: 0px;
  width: 125px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 5px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#under-container .top_resultBox .thumbnailBox {
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  background-image: url(images/thumbnail_bg_top.png);
  background-repeat: no-repeat;
  background-position: left top;
  margin: 0px;
  width: 100%;
}
#under-container .top_resultBox .DateYear {
  font-size: 85%;
  color: #FFF;
  text-align: left;
  position: relative;
  margin-top: 0px;
  background-color: #900;
  padding-top: 0px;
  padding-right: 5px;
  padding-bottom: 0px;
  padding-left: 5px;
  width: 100%;
}
@media screen and (max-width: 1100px) {
  #containerPage #sidemenu, #containerCategory #sidemenu {
    width: 100%;
    margin-top: 20px;
    background-image: linear-gradient(93deg, rgba(255, 255, 255, 0) 0.4%, rgba(255, 255, 255, 0.71) 86.97%, rgba(255, 255, 255, 0.81));
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    box-shadow: 38px 0 24px -5px rgba(37, 0, 2, 0.18);
  }
}
@media screen and (max-width: 900px) {
  #under-container {
    padding-bottom: 0px;
  }
  #under-container .box01, #under-container .box02 {
    width: 100%;
    margin-bottom: 5vw;
  }
  #under-container .top_resultBox {
    width: 48%;
  }
  /* under-containerにfooterHomeが重ならないよう、PC用の重ね合わせ調整を解除 */
  .curtain {
    margin-bottom: 0;
    height: auto;
    padding-bottom: 0px;
  }
  /* #footerHome 内をflexboxで縦積み・高さ自動に */
  #footerHome {
    height: auto;
    background-image: none;
    position: relative;
  }
  .footerInner {
    display: flex;
    flex-direction: column;
  }
  .footerLeftBox {
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 15px 15px 0;
  }
  .footerWrap nav {
    width: 100%;
    margin-bottom: 5vw;
  }
  #footerBtnmenu {
    display: flex;
    flex-direction: column;
    width: 100%;
    list-style: none;
    margin: 1vw 0 0;
    padding: 0;
  }
  #footerBtnmenu li {
    width: 100%;
    height: auto;
    margin-bottom: 0px;
  }
  .curtain_btm {
    display: none;
  }
}
/* Page_Category CSS --------------------------------------- */
#mainWrapper {
  display: flex;
  flex-flow: wrap;
  width: 100%;
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
  height: 100%;
}
#mainContnts {
  width: 70%;
  position: relative;
  background-color: #f7f6f6;
  -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.14);
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.14);
}
#mainContnts header {
  position: relative;
}
#mainContnts header h1 {
  margin-top: 50px;
  text-align: right;
  padding-right: 20px;
}
#subPageMenu {
  width: 100%;
  text-align: right;
  font-size: 90%;
  color: #FFF;
  background-image: url(images/submenu_bg.png);
  background-repeat: no-repeat;
  background-position: left top;
  padding-top: 6.5%;
  margin: 0px auto;
  min-height: 130px;
  background-size: 100% auto;
}
#subPageMenu .spm-nav {
  z-index: 11;
  position: relative;
}
#subPageMenu ul {
  width: 100%;
  text-align: right;
  padding-top: 10px;
  margin-right: 20px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: normal;
}
#subPageMenu li {
  padding-right: 10px;
  display: inline;
  list-style-type: none;
  border-left-width: 1px;
  border-left-style: solid;
  border-left-color: #CCC;
  padding-left: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
  background-color: rgba(153, 0, 0, 0.38);
}
#subPageMenu li a {
  display: inline-block;
}
#subPageMenu li a:link {
  color: #FFF;
  text-decoration: underline;
}
#subPageMenu li a:visited {
  color: #FFF;
  text-decoration: underline;
}
#subPageMenu li a:hover, #subPageMenu li a:active, #subPageMenu li a:focus {
  text-decoration: none;
  color: #FC0;
}
/* ---- サブページメニュー アコーディオン用トグルボタン（PCでは非表示） ---- */
.spm-toggle {
  display: none;
}
/* TextBody CSS ------------------------------------------ */
#textBody {
  padding-top: 0px;
  padding-right: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  position: relative;
  z-index: 5;
  margin: 0px;
}
#textBody.st_contact {
  clear: both;
  padding-top: 50px;
}
#textBody header.singleBg {
  background-image: url(images/h1_bg.png);
  background-repeat: no-repeat;
  background-position: right bottom;
  padding-bottom: 50px;
  padding-top: 50px;
  margin-bottom: 10px;
  margin-right: 0px;
  margin-left: 0px;
  padding-right: 0px;
  padding-left: 0px;
  text-align: left;
  background-size: 100% auto;
  display: flex;
  flex-flow: wrap;
}
#textBody p {
  padding-left: 0.5em;
  padding-right: 0.5em;
  margin-bottom: 2vw;
  position: relative;
}
a.contactBtn {
  margin: 0px;
  background-image: url(images/contact_btn.png);
  background-position: 0px 0px;
  width: 100%;
  background-repeat: no-repeat;
  display: block;
  text-indent: -1000px;
  background-size: cover;
  aspect-ratio: 16 / 2.8;
}
a.contactBtn:hover {
  background-image: url(images/contact_btn_hover.png);
  background-repeat: no-repeat;
}
.telNo {
  font-size: 200%;
  font-weight: bold;
  font-family: "Times New Roman", Times, serif;
}
.btnWrap {
  width: auto;
}
.btnBase {
  background-color: #b20000;
  padding: 1em;
  font-size: 150%;
  color: #FFFFFF;
  width: 100%;
  display: block;
  text-align: center;
  border-radius: 10px;
  -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.36);
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.36);
  transition: 0.3s;
  font-weight: bold;
  border: 2px solid rgba(161, 0, 2, 1.00);
}
.btnBase:link, .btnBase:visited {
  color: #E4B800;
  text-decoration: none;
}
.btnBase:hover {
  color: #000000;
  background-color: #FFB600;
}
#textBody iframe {
  border: 2px solid #CCC;
}
#textBody .priceTB {
  width: 100%;
  font-size: 100%;
  margin-right: auto;
  margin-left: auto;
  border-style: none;
}
#textBody .priceTB td {
  padding: 10px;
  margin: 0px;
  vertical-align: top;
  border-right-style: none;
}
#textBody .priceTB td.itemName {
  width: 100px;
  background-color: #900;
  color: #FFF;
  text-align: center;
  border-style: none;
}
#textBody .priceTB td.itemValue {
  background-color: #E8E8E8;
  padding-left: 10px;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
}
#textBody .singleDateBox {
  width: 15%;
  text-align: center;
  margin: 0px;
  padding-top: 0px;
  padding-right: 5px;
  padding-bottom: 0px;
  padding-left: 0px;
  z-index: 0;
}
#textBody .singleDateBox .DateDay {
  text-align: center;
  font-size: 150%;
  color: #FFF;
  padding-top: 20px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  height: 81px;
  width: 76px;
  font-weight: bold;
  margin-top: 10px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 10px;
  border-radius: 10px; /* CSS3 */
  -moz-border-radius: 10px; /* Firefox */
  -webkit-border-radius: 10px; /* Safari,Chrome */
  -webkit-background-clip: padding-box;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
  background-image: url(images/date_bg.png);
}
#textBody .singleDateBox .DateMon {
  font-size: 120%;
  color: #999;
  padding: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
  font-weight: bold;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
#textBody .singleDateBox .DateYear {
  font-size: 80%;
  color: #CCC;
  margin: -30px 0px 0px;
  font-family: Verdana, Geneva, sans-serif;
  padding: 0px 0px 0px 1.4em;
  width: 76px;
}
.DateYear {
  font-size: 50%;
  color: #CCC;
  margin-top: 0px;
  font-weight: bold;
}
#textBody .singleDateBox p {
  padding-right: 0px;
  padding-left: 0px;
  padding-bottom: 5px;
}
#textBody .singleTitletBox {
  float: left;
  margin-left: 10px;
  width: 80%;
  padding-top: 30px;
}
#textBody article .singleTitletBox h1 {
  margin: 0px;
  text-align: left;
  font-size: 130%;
  padding: 0px;
}
#textBody h2, #newsBody h2 {
	padding: 2em 40px 1em;
	margin-left: 0px;
	background-image: url(images/h2_bg_sp.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100% auto;
	position: relative;
}
#textBody h2::before, #newsBody h2::before {
  content: '';
  width: 50px;
  height: 70px;
  background-image: url(images/logosilhouette.png);
  background-position: left top;
  background-size: 100%;
  position: absolute;
  left: -1.5vw;
  background-repeat: no-repeat;
  top: 35%;
	z-index: 1;
}
#textBody h2::after, #newsBody h2::after {
  content: '';
  width: 100%;
  height: 20px;
  position: absolute;
  left: 0%;
  bottom: 0%;
  background-image: url(images/h2_bg_tx.png);
  background-position: 38px top;
  background-size: contain;
  background-repeat: no-repeat;
  border-top: thin solid #990000;
  z-index: 0;
}
.single #textBody h2 {
  clear: both;
  padding-left: 10px;
  font-size: 130%;
  padding-top: 20px;
  padding-bottom: 20px;
}
#textBody h3 {
  border-bottom-width: 1px;
  border-bottom-style: dotted;
  border-bottom-color: #CCC;
  font-size: 140%;
  padding-right: 0.8em;
  padding-left: 0.8em;
  position: relative;
}
#textBody h3::after {
  position: absolute;
  content: '';
  width: 6px;
  height: 90%;
  background-color: #990000;
  left: 0%;
  top: 0%;
  border-radius: 100px;
}
#textBody h3 {
  margin-left: 0px;
  margin-right: 0px;
}
#textBody h4, #textBody h5 {
  padding-top: 0px;
  padding-bottom: 0px;
  clear: both;
  color: #FFF;
  background-color: #900;
  border-radius: 100px; /* CSS3草案 */
  -webkit-border-radius: 100px; /* Safari,Google Chrome用 */
  -moz-border-radius: 100px; /* Firefox用 */
  display: inline-block;
  padding-right: 10px;
  padding-left: 10px;
}
#textBody .leftText {
  float: left;
  width: 350px;
}
#textBody .rightText h2 {
  padding-top: 0px;
  padding-right: 0px;
  padding-left: 0px;
  background-image: none;
}
#textBody .rightText p {
  padding-right: 0px;
  padding-left: 0px;
}
#textBody .whBox {
  background-color: #FFF;
  width: 100%;
  clear: both;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 10px;
  border-radius: 10px; /* CSS3 */
  box-shadow: 0px 0px 7px #ccc; /* CSS3 */
  position: relative;
  padding: 0.5em 2em;
}
#textBody .whBox p {
  padding-top: 0px;
  padding-right: 0px;
  padding-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-left: 0px;
}
#textBody .whBox .clIcon {
  margin: 0px;
  padding: 0px;
  border-bottom-style: none;
  background-image: none;
}
#textBody .whBox p.clText {
	padding: 5px 0px 5px 15px;
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #CCC;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
a.linkBtn {
  color: #FFF;
  background: #900 url(images/allow2.png) no-repeat 10px center;
  padding: 14px 10px 10px 25px;
  text-decoration: none;
  display: inline-block;
  box-shadow: 0px 0px 5px #999;
}
a.linkBtn:hover {
  color: #900;
  background: #CCC url(images/allow2.png) no-repeat 10px center;
}
.memberBox {
  background-color: #FFF;
  padding: 0px;
  width: 580px;
  clear: both;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 10px;
  border-radius: 10px; /* CSS3 */
  -webkit-border-radius: 10px; /* Safari,Google Chrome用 */
  -moz-border-radius: 10px; /* Firefox用 */
  box-shadow: 0px 0px 7px #ccc; /* CSS3 */
  -moz-box-shadow: 0px 0px 7px #ccc; /* Mozilla */
  -webkit-box-shadow: 0px 0px 7px #ccc; /* Webkit */
  behavior: url(/wp-content/themes/marzo/js/PIE.htc);
  position: relative;
  text-align: left;
}
#memTB {
  margin: 0px auto;
  padding: 10px;
  width: 560px;
  text-align: left;
  border-style: none;
}
.memberBox #memTB p {
  margin: 0px;
  padding: 0px;
}
#memTB td {
  margin: 0px;
  padding: 0px 5px;
  border-style: none;
}
#memTB td.title {
  width: 300px;
  text-align: left;
  padding: 0px;
  border-radius: 10px; /* CSS3 */
  -webkit-border-radius: 10px; /* Safari,Google Chrome用 */
  -moz-border-radius: 10px; /* Firefox用 */
  background: #f0f0f0;
}
#memTB td.memcomment {
  width: 150px;
  border-right: 1px dotted #CCC;
  padding-top: 10px;
  padding-left: 10px;
  border-left: 1px dotted #CCC;
  margin-left: 10px;
}
#memTB td.memprice {
  width: 100px;
  text-align: right;
  font-size: 120%;
  padding-top: 20px;
}
#memTB td .ti {
  text-align: left;
  padding: 5px 10px;
  border-radius: 10px; /* CSS3 */
  -webkit-border-radius: 10px; /* Safari,Google Chrome用 */
  -moz-border-radius: 10px; /* Firefox用 */
  box-shadow: 0px 0px 7px #ccc; /* CSS3 */
  -moz-box-shadow: 0px 0px 7px #ccc; /* Mozilla */
  -webkit-box-shadow: 0px 0px 7px #ccc; /* Webkit */
  background-color: #900;
  color: #FFF;
  font-size: 120%;
}
#memTB td .mTime {
  font-size: 90%;
  font-weight: bold;
  padding-top: 5px;
  padding-left: 10px;
  color: #666;
  padding-bottom: 5px;
}
.membcontact_table {
  border-style: none;
}
.membcontact_table td {
  border-style: none;
}
.membcontact_table td.comme {
  width: 80%;
}
.membcontact_table td.btnarea {
  width: 20%;
}
a.member_contactbtn {
  background: #903 url(images/allow2.png) no-repeat 10px center;
  padding: 10px;
  color: #FFF;
  width: 100px;
  display: block;
  text-align: center;
}
.estudioLeft {
  width: 300px;
  float: left;
  margin: 0px;
  padding: 0px;
}
.estudioRight {
  float: left;
  margin-top: 30px;
  background-color: #E7E7E7;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  padding-top: 5px;
  padding-right: 5px;
  padding-bottom: 0px;
  padding-left: 5px;
}
/* instructor page css */
.instructorPage {
  background-image: url(images/kugiri.png);
  background-repeat: no-repeat;
  background-position: bottom;
  clear: both;
  padding-bottom: 63px;
}
.instructorBG01 {
  background-image: url(images/submenu_bg.png);
  width: 100%;
  position: relative;
  left: -20px;
  background-repeat: no-repeat;
  background-position: left 10%;
  background-size: contain;
}
.instructorBG02 {
  background-image: url(images/instructor_bg02.png);
  height: 380px;
  width: 360px;
  position: relative;
  left: -20px;
  background-repeat: no-repeat;
  background-position: left top;
  padding-left: 300px;
  clear: both;
  margin-top: 50px;
}
#textBody .instructorBG01 h3.nobg, #textBody .instructorBG02 h3.nobg {
  background-image: none;
  padding-top: 0px;
  padding-right: 0px;
  padding-left: 30px;
  display: block;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  margin-top: 0px;
  margin-right: 0px;
  margin-left: 0px;
  height: 120px;
}
.instructorBG01 p {
  font-size: 80%;
}
/* schedule page css */
#scheduleTB {
  border-spacing: 5px 5px;
  border-collapse: separate;
  width: 570px;
  margin-right: auto;
  margin-left: auto;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
}
#scheduleTB td {
  border-spacing: 0px 10px;
  border-collapse: separate;
  text-align: center;
  padding: 5px;
  border-radius: 10px; /* CSS3 */
  -moz-border-radius: 10px; /* Firefox */
  -webkit-border-radius: 10px;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  vertical-align: top;
  line-height: 1;
  font-size: 90%;
}
#scheduleTB td .clName {
  font-size: 250%;
  font-weight: 100;
  margin-top: 0px;
  margin-right: 0px;
  margin-left: 0px;
  font-family: "Times New Roman", Times, serif;
  padding: 0px;
  display: block;
}
#scheduleTB td.aclass {
  color: #FFF;
  background-color: #9C0;
}
#scheduleTB td.gray {
  color: #666;
  background-color: #E3E3E3;
}
#scheduleTB td.fclass {
  color: #FFF;
  background-color: #F90;
}
#scheduleTB td.free {
  color: #FFF;
  background-color: #9C0;
}
#scheduleTB2 {
  border-spacing: 5px 5px;
  border-collapse: separate;
  width: 570px;
  margin-right: auto;
  margin-left: auto;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
}
#scheduleTB2 td {
  border-spacing: 0px 10px;
  border-collapse: separate;
  text-align: center;
  padding: 5px;
  border-radius: 10px; /* CSS3 */
  -moz-border-radius: 10px; /* Firefox */
  -webkit-border-radius: 10px;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  vertical-align: top;
  line-height: 1;
  font-size: 90%;
}
#scheduleTB2 td .clName {
  font-size: 250%;
  font-weight: 100;
  margin-top: 0px;
  margin-right: 0px;
  margin-left: 0px;
  font-family: "Times New Roman", Times, serif;
  padding: 0px;
  display: block;
}
#scheduleTB2 td.aclass {
  color: #FFF;
  background-color: #9C0;
}
#scheduleTB2 td.gray {
  color: #666;
  background-color: #E3E3E3;
}
#scheduleTB2 td.fclass {
  color: #FFF;
  background-color: #F90;
}
#scheduleTB2 td.free {
  color: #FFF;
  background-color: #9C0;
}
.scTB {
  margin: 0;
}
/* WordPressテーマ標準のテーブル罫線をリセット */
.scTB table, .scTB th, .scTB td {
  border: none !important;
}
/* table/tbody/trをCSS Gridに変換し、tdを7列グリッドのアイテムとして扱う */
.scTB table {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  box-sizing: border-box;
}
.scTB tbody, .scTB tr {
  display: contents;
}
.scTB td {
  box-sizing: border-box;
  min-width: 0;
  text-align: center;
  padding: 0;
}
/* 曜日ヘッダー行（1行目）：背景なしのテキストのみ */
.scTB tr:first-child td {
  padding: 8px 0 16px;
  font-size: clamp(14px, 2.2vw, 20px);
  color: #333;
  font-weight: 400;
}
/* データ行のセル（2行目以降）：正方形のグレー角丸ボックス（空セルも含む） */
.scTB tr:not(:first-child) td {
  min-height: 130px;
  background: #e2e2e2;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 4px;
  color: #666;
  font-size: clamp(12px, 1.6vw, 15px);
  line-height: 1.15;
}
/* クラス名（A/B/C...）：大きい文字 */
.scTB .clName {
  display: block;
  font-size: clamp(36px, 4.5vw, 40px);
  color: #555;
  font-weight: 400;
  margin-bottom: 2px;
  font-family: Georgia, "Times New Roman", serif;
}
/* PC：時間　縦棒のまま */
.clDivider {
  margin-bottom: -1em;
}
/* ===== スマホ表示（曜日ごとに縦積み） ===== */
@media (max-width: 764px) {
  .scTB {
    max-width: 100%;
    overflow-x: hidden;
  }
  .scTB table {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    max-width: 100%;
  }
  /* PC：時間　横棒のにする */
  .clDivider {
    visibility: hidden;
    position: relative;
    margin-bottom: 0em;
    margin-right: 0.5em;
  }
  .clDivider::before {
    content: "－";
    visibility: visible;
    position: absolute;
  }
  /* セルを曜日単位（月→火→水…）にまとめて並び替える */
  .scTB tr:nth-child(1) td:nth-child(1) {
    order: 0;
  }
  .scTB tr:nth-child(2) td:nth-child(1) {
    order: 1;
  }
  .scTB tr:nth-child(3) td:nth-child(1) {
    order: 2;
  }
  .scTB tr:nth-child(4) td:nth-child(1) {
    order: 3;
  }
  .scTB tr:nth-child(1) td:nth-child(2) {
    order: 4;
  }
  .scTB tr:nth-child(2) td:nth-child(2) {
    order: 5;
  }
  .scTB tr:nth-child(3) td:nth-child(2) {
    order: 6;
  }
  .scTB tr:nth-child(4) td:nth-child(2) {
    order: 7;
  }
  .scTB tr:nth-child(1) td:nth-child(3) {
    order: 8;
  }
  .scTB tr:nth-child(2) td:nth-child(3) {
    order: 9;
  }
  .scTB tr:nth-child(3) td:nth-child(3) {
    order: 10;
  }
  .scTB tr:nth-child(4) td:nth-child(3) {
    order: 11;
  }
  .scTB tr:nth-child(1) td:nth-child(4) {
    order: 12;
  }
  .scTB tr:nth-child(2) td:nth-child(4) {
    order: 13;
  }
  .scTB tr:nth-child(3) td:nth-child(4) {
    order: 14;
  }
  .scTB tr:nth-child(4) td:nth-child(4) {
    order: 15;
  }
  .scTB tr:nth-child(1) td:nth-child(5) {
    order: 16;
  }
  .scTB tr:nth-child(2) td:nth-child(5) {
    order: 17;
  }
  .scTB tr:nth-child(3) td:nth-child(5) {
    order: 18;
  }
  .scTB tr:nth-child(4) td:nth-child(5) {
    order: 19;
  }
  .scTB tr:nth-child(1) td:nth-child(6) {
    order: 20;
  }
  .scTB tr:nth-child(2) td:nth-child(6) {
    order: 21;
  }
  .scTB tr:nth-child(3) td:nth-child(6) {
    order: 22;
  }
  .scTB tr:nth-child(4) td:nth-child(6) {
    order: 23;
  }
  .scTB tr:nth-child(1) td:nth-child(7) {
    order: 24;
  }
  .scTB tr:nth-child(2) td:nth-child(7) {
    order: 25;
  }
  .scTB tr:nth-child(3) td:nth-child(7) {
    order: 26;
  }
  .scTB tr:nth-child(4) td:nth-child(7) {
    order: 27;
  }
  /* デスクトップ用の正方形ボックスをリセット */
  .scTB td {
    width: 100%;
    aspect-ratio: unset;
    text-align: left;
  }
  /* 曜日ヘッダー：赤い下線付きの見出し */
  .scTB tr:nth-child(1) td {
    background-image: none;
    border-radius: 20px 0 0;
    display: block;
    padding: 1em;
    margin-top: 8px;
    margin-right: 0;
    margin-left: 0;
    font-size: 18px;
    color: #FFFFFF;
    border-bottom: 2px solid #c0504d;
    background-color: rgba(154, 4, 22, 1.00);
    position: relative;
  }
  /* イベントセル：横並びの角丸ボックス（名前 左／時間 右） */
  .scTB tr:not(:nth-child(1)) td {
    min-height: 80px;
    aspect-ratio: unset;
    min-width: 0;
    flex-direction: row;
    justify-content: flex-end;
    gap: 4px;
    align-items: center;
    background: #e2e2e2;
    border-radius: 8px;
    margin: 8px 0;
    padding: 16px 20px;
    font-size: 120%;
    color: #555;
    white-space: nowrap;
    overflow: hidden;
  }
  /* 空のセルは高さゼロで完全に消す */
  .scTB tr:not(:nth-child(1)) td:empty {
    display: none;
    margin: 0;
    padding: 0;
  }
  /* 時間の改行を無くして1行で右寄せ表示 */
  .scTB tr:not(:nth-child(1)) td br {
    display: none;
  }
  .scTB .clName {
    color: #333;
    margin-bottom: 0;
    padding-left: 0.5em;
    border-right: thin dotted rgba(122, 120, 120, 1.00);
    padding-right: 1em;
    position: absolute;
    left: 20px;
  }
}
@media (max-width: 299px) {
  .scTB tr:not(:nth-child(1)) td {
    min-height: 80px;
    aspect-ratio: unset;
    min-width: 0;
    flex-direction: inherit;
    flex-flow: wrap;
    justify-content: center;
    gap: 4px;
    align-items: center;
    background: #e2e2e2;
    border-radius: 8px;
    margin: 8px 0;
    padding: 16px 20px;
    font-size: 120%;
    color: #555;
    white-space: nowrap;
    overflow: hidden;
  }
  .scTB .clName {
    width: 100%;
    margin-bottom: 0.5em;
    padding-left: 0em;
    position: relative;
    border-right: none;
    border-bottom: thin dotted rgba(122, 120, 120, 1.00);
  }
}
/* news event Body */
#newsBody {
  margin-top: 10px;
  margin-right: 20px;
  margin-bottom: 20px;
  margin-left: 20px;
  position: relative;
  z-index: 10;
}
#newsBody div.newItem {
  z-index: 1;
  position: absolute;
  left: -30px;
  top: 0px;
  margin: 0px;
  background-image: url(images/new.png);
  background-repeat: no-repeat;
  height: 39px;
  width: 41px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  font-size: 9px;
  color: #FFF;
  text-indent: -1000px;
  overflow: hidden;
}
#newsBody a:link {
  color: #333;
  text-decoration: none;
}
#newsBody a:visited {
  color: #333;
  text-decoration: none;
}
#newsBody a:hover, #newsBody a:active, #newsBody a:focus {
  text-decoration: none;
  color: #900;
}
#newsBody .resultBox {
  margin-top: 0px;
  margin-bottom: 5px;
  padding-bottom: 10px;
  padding-top: 10px;
  border-radius: 10px;
  box-shadow: 0px 0px 5px #ccc;
  background-color: #FFFFFF;
}
#newsBody .resultBox a {
  display: flex;
  flex-flow: wrap;
  justify-content: space-between;
  padding-right: 2em;
}
#newsBody .resultBox:hover {
  background-color: #EAEAEA;
  border-radius: 10px;
}
.dateBox {
  width: 15%;
  text-align: center;
  margin: 0px;
  padding-top: 0px;
  padding-right: 5px;
  padding-bottom: 0px;
  padding-left: 0px;
  position: relative;
  z-index: 0;
}
.dateBox-line {
  float: left;
  width: 60px;
  text-align: center;
  margin: 0px;
  padding-top: 0px;
  padding-right: 14px;
  padding-bottom: 0px;
  padding-left: 0px;
  border-right-width: 4px;
  border-right-style: solid;
  border-right-color: #BFAD8A;
}
.dateBox p {
  text-align: center;
}
.DateDay {
  text-align: center;
  font-size: 150%;
  color: #FFF;
  padding-top: 20px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  height: 81px;
  width: 76px;
  font-weight: bold;
  margin-top: 10px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 10px;
  border-radius: 10px; /* CSS3 */
  -moz-border-radius: 10px; /* Firefox */
  -webkit-border-radius: 10px; /* Safari,Chrome */
  -webkit-background-clip: padding-box;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
  background-image: url(images/date_bg.png);
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.DateMon {
  font-size: 120%;
  color: #999;
  padding: 0px;
  width: 86px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
  font-weight: bold;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
#newsBody .newsTextBox {
  width: 82%;
  margin-bottom: 10px;
  position: relative;
}
#newsBody .newsTextBox h1 {
  font-size: 130%;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #CCC;
  margin-top: 20px;
  margin-right: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
  padding: 0px;
}
#newsBody .movTextBox {
  width: 82%;
  display: flex;
  flex-flow: row;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 10px;
  position: relative;
}
#newsBody .movTextBox h1 {
  float: left;
  width: 58%;
  flex: 1;
  border-bottom-width: 1px;
  border-bottom-style: dotted;
  border-bottom-color: #CCC;
  margin-top: 20px;
  font-size: 130%;
}
#newsBody .movTextBox .thumbnailBox {
  background-color: #ECECEC;
  width: 40%;
  padding: 5px;
}
/* login ------------------------------------ */
.wpmem_login {
  margin: 0px;
  padding: 0px;
}
.wpmem_login form {
  width: 100%;
}
.wpmem_login form table {
  margin-right: auto;
  margin-left: auto;
  padding: 0px;
}
.wpmem_login form table tr td {
  background: url(none);
  margin: 0px;
  padding: 0px;
}
#textBody .wpmem_login h2 {
  background: url(images/h2_bg.png) no-repeat left;
  padding-top: 50px;
  margin: 0px;
  height: 100px;
}
/* next prev Page navigation------------------------------------ */
.prevnext-page {
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: #CCC;
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 10px;
  margin-left: auto;
  width: 100%;
  display: flex;
  flex-flow: row;
}
.prevnext-page p {
  padding: 0px;
  min-height: 30px;
}
.prevnext-page .prev {
  width: 48%;
}
.prevnext-page .prev span {
  background-image: url(images/btn_prev.png);
  text-indent: -10000px;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: left 0px;
  display: block;
  height: 60px;
  width: 100%;
  padding-top: 0px;
  padding-bottom: 0px;
  transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -webkit-transition: all .3s ease-out;
}
.prevnext-page .prev span:hover {
  background-image: url(images/btn_prev.png);
  background-repeat: no-repeat;
  background-position: left -70px;
  display: block;
  background-color: #E1E1E1;
}
.prevnext-page .next {
  width: 48%;
  text-align: right;
}
.prevnext-page .next span {
  background-image: url(images/btn_next.png);
  text-indent: 10000px;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: right 0px;
  display: block;
  height: 60px;
  width: 100%;
  padding-top: 0px;
  padding-bottom: 0px;
  transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -webkit-transition: all .3s ease-out;
}
.prevnext-page .next span:hover {
  background-image: url(images/btn_next.png);
  background-repeat: no-repeat;
  background-position: right -70px;
  display: block;
  background-color: #E1E1E1;
}
.pageNaviWrap {
  position: relative;
  width: 100%;
  z-index: 6;
  top: -420px;
}
/* contact Css ----------------------------------- */
.titleBox {
  text-align: left;
  padding-left: 20px;
  padding-top: 20px;
  padding-bottom: 0px;
  margin: 0px;
}
.wpcf7-form {
  border-style: none;
}
#contactTB {
  width: 95%;
  color: #FFFFFF;
  margin-top: 10px;
  padding: 0px;
  margin-left: auto;
  margin-right: auto;
  border-style: none;
}
#contactTB td {
  color: #666;
  padding: 15px 5px 2px;
  border-bottom: 1px dotted #CCC;
  margin: 0px 0px 10px;
  border-top-style: none;
  border-right-style: none;
  border-left-style: none;
  font-size: 100%;
  font-weight: bold;
}
#contactTB input, #contactTB textarea {
  position: relative;
  padding: 5px;
  margin: 2px;
  color: #333;
  background-color: #EAEAEA;
  border: 1px solid #CCC;
  border-radius: 10px; /* CSS3 */
  -moz-border-radius: 10px; /* Firefox */
  -webkit-border-radius: 10px; /* Safari,Chrome */
  behavior: url(/js/PIE.htc);
  font-size: 130%;
  width: 100%;
}
#contactTB select {
  font-size: 130%;
  padding: 5px;
}
#contactTB input.wpcf7-submit {
  position: relative;
  text-align: center;
  font-size: 100%;
  font-weight: bold;
  padding: 1.5em;
  border: thin solid #900;
  color: #FFF;
  background: #900;
  border-radius: 100px;
  width: 100%;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  transition: 0.3s;
}
#contactTB input.wpcf7-submit:hover {
  background-color: #FFFFFF;
  color: #990000;
}
#contactTB .namearea {
  color: #666;
  margin: 0px;
  width: 20%;
}
#contactTB .inputarea {
  width: 80%;
}
#contactTB .submitArea {
  text-align: center;
  margin: 20px 10px 10px;
  border-style: none;
  padding: 10px;
}
.hissuItem {
  color: #C30;
  font-weight: bold;
  padding-left: 0.1em;
  font-size: 70%;
  margin-bottom: 0px;
  position: relative;
  top: -0.5em;
}
.catImgBox {
  margin-top: 30px;
}
/* Page Navi plugin Css ------------------------------- */
.wp-pagenavi {
  text-decoration: none;
  color: #999;
  list-style: none;
  margin-top: 0px;
  margin-right: 2px;
  margin-bottom: 20px;
  margin-left: 2px;
  padding-right: 30px;
  padding-bottom: 0px;
  padding-top: 50px;
  font-family: "Times New Roman", Times, serif;
  clear: both;
  background-image: url(images/kugiri.png);
  background-repeat: no-repeat;
  background-position: top;
  text-align: center;
}
.wp-pagenavi span, .wp-pagenavi a {
  padding: 0.7em 1em;
  margin-right: 2px;
  margin-left: 2px;
  font-size: 100%;
  border-radius: 10px;
}
.wp-pagenavi a, .wp-pagenavi a:link {
  text-decoration: none;
  color: #FFF;
  background-color: #CCC;
}
.wp-pagenavi a:visited {
  text-decoration: none;
  color: #666;
  background-color: #CCC;
}
.wp-pagenavi a:hover {
  color: #F90;
}
.wp-pagenavi a:active {
  text-decoration: none;
  color: #FFF;
  background-color: #F90;
}
.wp-pagenavi span.pages {
  color: #FFF;
  text-decoration: none;
}
.wp-pagenavi span.current {
  color: #FFF;
  margin-right: 2px;
  margin-left: 2px;
  background-color: #900;
}
.wp-pagenavi span.extend {
  color: #FFF;
  background-color: #999;
  margin-top: 0px;
  margin-right: 5px;
  margin-bottom: 0px;
  margin-left: 5px;
}
.wp-pagenavi a.nextpostslink, .wp-pagenavi a.previouspostslink {
  color: #930002;
  margin-top: 0px;
  margin-right: 5px;
  margin-bottom: 0px;
  margin-left: 5px;
  background-color: inherit;
}
.wp-pagenavi a.nextpostslink:hover, .wp-pagenavi a.previouspostslink:hover {
  color: #999;
  margin-top: 0px;
  margin-right: 5px;
  margin-bottom: 0px;
  margin-left: 5px;
}
/*========================================

 clearfix Css

========================================*/
.clearfix:after {
  content: "."; /* 新しい要素を作る */
  display: block; /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}
.clearfix {
  min-height: 1px;
}
* html .clearfix {
  height: 1px;
  /*¥*/ /*/
  height: auto;
  overflow: hidden;
  /**/
}
/*========================================
 .wp-block 
======================================== */
.wp-block-columns {
  padding-left: 1em;
  padding-right: 1em;
}
.post-password-form input {
  position: relative;
  padding: 5px;
  margin: 2px;
  color: #333;
  background-color: #EAEAEA;
  border: 1px solid #CCC;
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  behavior: url(/js/PIE.htc);
  font-size: 130%;
}
.post-password-form input[type="submit"] {
  width: 20%;
  font-size: 15px;
  color: #fff;
  display: inline-block;
  padding: 10px 0px;
  text-align: center;
  background-color: #900;
  border: 1px solid #900;
  border-radius: 100px;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.3s;
  position: relative;
  top: -2px;
}
/*--hover--*/
input[type="submit"]:hover {
  color: #900;
  background-color: #ffffff;
  border: 1px solid #900;
  cursor: pointer;
  transition: background-color 1s;
}
/*========================================

 スマホ用

========================================*/
@media screen and (max-width: 767px) {
  /* homepage css ------------------------------------ */
  .topheader-contents .innerbox {
    display: flex;
    flex-flow: row;
    justify-content: space-around;
  }
  .headcont {
    width: 100%;
  }
  .topheader-contents h1 {
    float: inherit;
    width: 100%;
    margin-top: 150px;
    position: relative;
    margin-left: 0px;
    margin-right: 0px;
  }
  .topheader-contents .betisbox {
    position: relative;
    width: 100%;
    margin: 0px;
    padding: 0px;
    left: 0px;
  }
  /* page image css ------------------------------------ */
  .beginnerImg {
    width: 50vw;
    position: absolute;
    left: -11vw;
    top: -10vw;
    z-index: 10;
  }
  .studioImg, .booking-formImg {
    width: 45vw;
    max-width: 400px;
    position: absolute;
    left: -5vw;
    top: -8vw;
    z-index: 10;
  }
  .lessonImg {
    width: 40vw;
    position: absolute;
    left: -3vw;
    top: -30vw;
    z-index: 10;
  }
  .moviesImg {
    width: 40vw;
    max-width: 280px;
    position: absolute;
    left: -3vw;
    top: 0%;
    z-index: 10;
  }
  .accessImg {
    width: 80vw;
    position: absolute;
    max-width: 800px;
    left: -30vw;
    top: -10vw;
    z-index: 10;
  }
  .linkImg {
    width: 25vw;
    position: absolute;
    max-width: 280px;
    left: -5vw;
    top: -10vw;
    z-index: 10;
  }
  .contactImg {
    width: 55vw;
    position: absolute;
    max-width: 400px;
    left: -5vw;
    top: -22vw;
    z-index: 10;
  }
  #mainWrapper {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    height: 100%;
  }
  #mainContnts {
    width: 100%;
  }
  #containerHome, .curtain, #footerHome {
    background-image: none;
  }
  #textBody {
    top: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
  #textBody h2, #newsBody h2 {
    padding: 2em 0px 0.5em 1.5em;
    margin-left: 0px;
    background-image: url(images/h2_bg_sp.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% auto;
    position: relative;
  }
  #textBody h2::before, #newsBody h2::before {
    content: '';
    width: 40px;
    height: 60px;
    background-image: url(images/logosilhouette.png);
    background-position: left top;
    background-size: 100%;
    position: absolute;
    left: -2%;
    background-repeat: no-repeat;
    top: 40%;
  }
  #textBody h2::after, #newsBody h2::after {
    content: '';
    width: 100%;
    height: 1px;
    position: absolute;
    background-color: #b20000;
    left: 0%;
    bottom: 10%;
  }
  #textBody h4 {
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
  }
  #textBody p {
    padding-left: 0px;
    padding-right: 0px;
  }
  #textBody .whBox {
    padding: 1.5em;
  }
  #textBody .whBox .clIcon {
    margin-bottom: -3em;
    position: relative;
    left: -1em;
    top: -1em;
  }
  #textBody .whBox .clIcon figure {
    width: 50%;
  }
  /* news event Body */
  .dateBox {
    width: 100%;
  }
  #newsBody .newsTextBox, #newsBody .movTextBox {
    width: 100%;
    padding-top: 0px;
  }
  #newsBody .movTextBox {
    display: flex;
    flex-flow: row;
    width: 100%;
    padding-top: 0px;
  }
  #newsBody .resultBox a {
    padding-left: 1em;
    padding-right: 1em;
  }
  #textBody header.singleBg {
    padding-top: 0px;
  }
  #textBody .singleDateBox {
    width: 100%;
  }
  #textBody .singleTitletBox {
    width: 100%;
  }
  .footerInner {
    width: 100%;
  }
  /* contact  */
  #contactTB, #contactTB, #contactTB tbody, #contactTB tr, #contactTB td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  #contactTB tr {
    margin-bottom: 1em;
  }
  #contactTB .namearea {
    width: 100%;
    font-weight: bold;
    border: none !important;
    padding: 0px;
    margin: 0px;
  }
  #contactTB .inputarea {
    width: 100%;
    padding-bottom: 4px;
    padding-top: 0px;
    padding-left: 0px;
    margin: 0px;
  }
  #contactTB .inputarea input[type="text"], #contactTB .inputarea input[type="email"], #contactTB .inputarea textarea {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
  }
  #contactTB .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
  }
  /*========================================
 .wp-block 
======================================== */
  .wp-block-columns {
    padding-left: 0em;
    padding-right: 0em;
  }
}

/* ==========================================
   スマホ用ヘッダー＆スライドメニュー
========================================== */
/* PCでは非表示 */
.sp-header-bar {
  display: none;
}
.sp-menu-overlay {
  display: none;
}
#spNav {
  display: none;
}
.pcnav {
  width: 28%;
  max-width: 280px;
  z-index: 5;
}
@media screen and (max-width: 767px) {
  /* 既存のPC用ロゴ・タイトル・メニューはスマホでは隠す */
  .topheader-contents > h1, .topheader-contents #sidemenu, .pcnav {
    display: none;
  }
  /* ---- スマホヘッダーバー ---- */
  .sp-header-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 56px;
    padding: 0 15px;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    box-sizing: border-box;
  }
  .sp-logo img {
    height: 36px;
    width: auto;
  }
  /* ---- ハンバーガーボタン ---- */
  .sp-hamburger {
    position: relative;
    width: 32px;
    height: 24px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    z-index: 1100;
  }
  .sp-hamburger span {
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 3px;
    background: #333;
    border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.3s ease, top 0.3s ease;
  }
  .sp-hamburger span:nth-child(1) {
    top: 0;
  }
  .sp-hamburger span:nth-child(2) {
    top: 10px;
  }
  .sp-hamburger span:nth-child(3) {
    top: 20px;
  }
  /* ボタンが開いた状態(is-active)の時に×印に変形 */
  .sp-hamburger.is-active span:nth-child(1) {
    top: 10px;
    transform: rotate(45deg);
  }
  .sp-hamburger.is-active span:nth-child(2) {
    opacity: 0;
  }
  .sp-hamburger.is-active span:nth-child(3) {
    top: 10px;
    transform: rotate(-45deg);
  }
  /* ---- スライドメニュー本体 ---- */
  #spNav {
    display: block; /* ← 追加：PCのdisplay:noneを上書き */
    position: fixed;
    top: 0;
    right: 0;
    width: 75%;
    max-width: 300px;
    height: 100%;
    background-color: #900;
    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.2);
    z-index: 1050;
    overflow-y: auto;
    padding-top: 56px;
    transform: translateX(100%);
    transition: transform 0.35s ease;
  }
  #spNav.is-open {
    transform: translateX(0);
  }
  #spNav .menutitle {
    text-align: center;
    color: rgba(255, 255, 255, 1.00);
  }
  #spNav ul#spSidemenu {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  #spNav ul#spSidemenu li {
    border-bottom: thin solid rgba(238, 238, 238, 0.22);
  }
  #spNav ul#spSidemenu li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 20px;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 15px;
    box-sizing: border-box;
  }
  /* ---- 各メニュー項目右端の矢印アイコン ---- */
  #spNav ul#spSidemenu li a::after {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    border-top: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
    transform: rotate(45deg);
    flex-shrink: 0;
    margin-left: 10px;
  }
  /* ---- 一番下の「メニューを閉じる」ボタン ---- */
  .sp-menu-close {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 15px 20px;
    margin-top: 10px;
    background: #EFEFEF;
    color: #666;
    border: none;
    border-top: 1px solid #ddd;
    font-size: 14px;
    text-align: center;
    cursor: pointer;
  }
  /* ---- オーバーレイ（メニュー外側の暗い背景） ---- */
  .sp-menu-overlay {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.35s ease;
  }
  .sp-menu-overlay.is-open {
    opacity: 1;
    visibility: visible;
  }
  /* ヘッダーバー分、本文が隠れないよう余白調整 */
  #containerHome {
    padding-top: 56px;
  }
  /* メニュー表示中は背景スクロールを止める */
  body.menu-open {
    overflow: hidden;
  }
  /* page.php側（#containerPage）でもヘッダー分の余白を確保 */
  #containerHome, #containerPage, #containerCategory {
    padding-top: 56px;
    background-image: none;
  }
  /* ==========================================
     サブページメニュー（#subPageMenu）アコーディオン化
  ========================================== */
  #subPageMenu {
    height: auto;
    width: auto;
    text-align: left;
    background-image: none;
    padding-top: 0;
    margin: 10px auto;
    min-height: inherit;
  }
  #subPageMenu .spm-nav {
    z-index: 0;
  }
  /* ---- トグルボタン ---- */
  .spm-toggle {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 15px;
    background-color: #900;
    color: #FFF;
    border: none;
    font-size: 14px;
    text-align: left;
    cursor: pointer;
  }
  .spm-toggle .spm-arrow {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-right: 2px solid #FFF;
    border-bottom: 2px solid #FFF;
    transform: rotate(45deg);
    transition: transform 0.3s ease;
  }
  .spm-toggle.is-open .spm-arrow {
    transform: rotate(-135deg);
  }
  /* ---- 開閉するリスト部分 ---- */
  #subPageMenu ul.spm-list {
    float: none;
    width: auto;
    text-align: center;
    padding-top: 0;
    margin-right: 0;
    max-height: 0;
    overflow: hidden;
    background-color: #EFEFEF;
    transition: max-height 0.35s ease;
  }
  #subPageMenu ul.spm-list.is-open {
    max-height: 500px; /* 項目数に応じて十分な値を設定 */
  }
  #subPageMenu li {
    display: block;
    border-left: none;
    border-bottom: 1px solid rgba(221, 221, 221, 0.28);
    padding: 1em;
    background-image: linear-gradient(209deg, rgba(36, 0, 1, 1), rgba(153, 0, 0, 1));
  }
  #subPageMenu li a {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: relative;
  }
  /* ---- 各メニュー項目右端の矢印アイコン ---- */
  #subPageMenu li a::after {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    border-top: 2px solid #C60000;
    border-right: 2px solid #C60000;
    transform: rotate(45deg);
    flex-shrink: 0;
    margin-left: 10px;
  }
  #subPageMenu li a:link, #subPageMenu li a:visited {
    color: #FFFFFF;
    text-decoration: none;
  }
  #subPageMenu li a:hover {
    color: #900;
  }
}