@charset "utf-8";
/* CSS Document */

.header_wrap {
    width: 100%;
    background-color: #FF0004;
    padding-top: 20px;
}
.wrap_all .header_wrap.clearfix #header_in {
    max-width: 960px;
}

.header_menu   {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.wrap .wrap_all .header {
    display: none;
}

.header_menu ul li {
    float: left;
}
.header_menu ul li a {
    padding-top: 7px;
    padding-right: 7px;
    padding-bottom: 7px;
    padding-left: 7px;
    display: block;
    text-decoration: none;
    color: #FFFFFF;
}
.header_menu ul li a:hover {
    color: #FF0004;
    background-color: #FFFFFF;
    text-shadow: 0px 0px #FF0004;
}



.header_left {
    float: left;
    margin-left: 60%;
}
.wrap_all .header_wrap.clearfix #header_in {
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
}

.header_wrap.clearfix #header_in #header_center {
    float: left;
    width: 45%;
    padding-top: 10px;
}
.header_wrap.clearfix #header_in #header_left {
    float: left;
    width: 30%;
}
.header_wrap.clearfix #header_in #header_right {
    float: right;
    width: 25%;
}

#header_in #header_right p {
    margin-left: auto;
    margin-right: auto;
}
#header_right .r_common.clearfix .r_left {
    width: 48%;
    float: left;
}

#header_right .r_common.clearfix .r_right {
    width: 48%;
    float: right;
}
.contents_box.clearfix .con_right .b_text {
    font-weight: bold;
}




#header_in #header_left h1 {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
}





.clearfix::after {
 content: "";
 display: block;
    clear: both;}
.topimg p img {
    width: 100%;
    height: auto;
}
.wrap .wrap_all .contents_wrap {
    width: 100%;
}

.contents_wrap .bosyu_wrap .bosyu {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.contents_wrap .bosyu_wrap .bosyu {
    margin-bottom: 20px;
}

.bosyu p a img {
    width: 100%;
    height: auto;
}
.contents_wrap .contents_text .contents_box {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 10px;
}
.contents_text .contents_box h2 {
    font-family: "メイリオ";
    line-height: 1.5em;
    font-size: large;
    border-bottom-width: 0;
    text-indent: 1em;
    margin-bottom: 10px;
    color: #FFFFFF;
    background-color: #FF0004;
}
.contents_text .contents_box p {
    font-family: "メイリオ";
    font-size: medium;
}
.contents_text .contents_box.clearfix .con_left {
    width: 30%;
    float: left;
}
.contents_text .contents_box.clearfix .con_right {
    width: 69%;
    float: right;
}
.contents_text .rental_box.clearfix .rent_price {
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    background-color: #FFF500;
}
.rental_box.clearfix .rent_price .bbold {
    text-align: center;
    font-weight: bold;
    font-size: x-large;

}
.rental_box.clearfix .rent_price .rbold {
    color: #FF0004;
    font-weight: bolder;
    font-size: xx-large;
    text-align: center;
}


.contents_box.clearfix .con_right h3 {
    font-weight: bold;
    font-size: xx-large;
    text-indent: 0px;
    line-height: 1.2em;
}



.wrap_all .contents_wrap .member {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.contents_wrap .member h2 {
    font-family: "メイリオ";
    font-size: large;
    font-weight: bold;
    line-height: 2em;
    color: #FFFFFF;
    background-color: #1200FF;
    text-indent: 1em;
    margin-top: 20px;
    margin-bottom: 20px;
    clear: both;
}
.member p img {
    width: 100%;
    height: auto;
}

.member .member_line .m_left {
    float: left;
    max-width: 300px;
    padding-bottom: 20px;
}
.member .member_line .m_center {
    max-width: 300px;
    float: left;
    padding-left: 30px;
}
.member .member_line .m_right {
    float: left;
    max-width: 300px;
    margin-left: 0px;
    padding-left: 30px;
    padding-bottom: 20px;
}
.m_left p .button {
    text-decoration: none;
    background-color: #00B3FF;
    padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 20px;
    padding-left: 30px;
    color: #FFFFFF;
    font-weight: bold;
    font-family: "メイリオ";
    text-align: center;
    display: block;
}

.member_line .m_left p {
    text-align: center;
}
.m_center p .button {
    text-decoration: none;
    background-color: #00B3FF;
    padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 20px;
    padding-left: 30px;
    color: #FFFFFF;
    font-weight: bold;
    font-family: "メイリオ";
    text-align: center;
    display: block;
}
.member_line .m_center p {
    text-align: center;
}
.m_right p .button {
    text-decoration: none;
    background-color: #00B3FF;
    padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 20px;
    padding-left: 30px;
    color: #FFFFFF;
    font-weight: bold;
    font-family: "メイリオ";
    text-align: center;
    display: block;
}
.member_line .m_right p {
    text-align: center;
}
.contents_wrap .member .member_line {
    margin-top: 10px;

}
.member .member_line .m_te {
    max-width: 630px;
    float: left;
    padding-top: 10px;
    padding-left: 30px;
}

.contents_wrap .coach h2 {
    clear: both;
    margin-top: 0px;
}
.wrap_all .contents_wrap .coach {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.contents_wrap .coach h2 {
    font-family: "メイリオ";
    font-size: large;
    font-weight: bold;
    line-height: 2em;
    color: #FFFFFF;
    background-color: #FFCE00;
    text-indent: 1em;
    margin-top: 0px;
    margin-bottom: 20px;
}
.coach p img {
    width: 100%;
    height: auto;
}

.coach .c_line .c_left {
    float: left;
    max-width: 300px;
}
.coach .c_line .c_center {
    max-width: 300px;
    float: left;
    padding-left: 30px;
}
.coach .c_line .c_right {
    float: right;
    max-width: 300px;
    margin-left: 0px;
    padding-left: 18px;
    padding-bottom: 20px;
}
.c_left p .button {
    text-decoration: none;
    background-color: #FF8E00;
    padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 20px;
    padding-left: 30px;
    color: #FFFFFF;
    font-weight: bold;
    font-family: "メイリオ";
    text-align: center;
    display: block;
}

.c_line .c_left p {
    text-align: center;
    margin-top: 0px;
}
.c_center p .button {
    text-decoration: none;
    background-color: #FF8E00;
    padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 20px;
    padding-left: 30px;
    color: #FFFFFF;
    font-weight: bold;
    font-family: "メイリオ";
    text-align: center;
    display: block;
}
.c_line .c_center p {
    text-align: center;
}
.c_right p .button {
    text-decoration: none;
    background-color: #FF8E00;
    padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 20px;
    padding-left: 30px;
    color: #FFFFFF;
    font-weight: bold;
    font-family: "メイリオ";
    text-align: center;
    display: block;
}
.c_line .c_right p {
    text-align: center;
}
.contents_wrap .coach .c_line {
    margin-top: 10px;

}
.contents_wrap .contact_box  {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../img/72ppi/tai_bg.png);
    background-color: #ddd;
    background-size: cover;
    margin-top: 10px;
    padding-top: 10px;
}
.contact_box h2  {
    font-size: xx-large;
    font-weight: bolder;
    color: #FFE500;
    text-align: center;
    line-height: 1.5em;
    background-color: #FF0004;
    margin-top: 10px;
}
.contact_box h3    {
    font-weight: bold;
    line-height: 1.5em;
    font-size: x-large;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
}
.contact_box.clearfix .contact_left  {
    width: 50%;
    float: left;
}
.contact_box.clearfix .contact_left p {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
}
.contact_box.clearfix .contact_right  {
    width: 50%;
    float: right;
}
.contact_box.clearfix .contact_right p {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
}
.wrap_all .contents_wrap .rental_box.clearfix {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../img/72ppi/rent_bg.png);
    background-color: #ddd;
    background-size: cover;
    margin-top: 10px;
    padding-top: 10px;
    margin-bottom: 10px;
}
.contents_wrap .rental_box.clearfix h2 {
    font-size: xx-large;
    font-weight: bolder;
    color: #FFFFFF;
    text-align: center;
    line-height: 1.5em;
    background-color: #000393;
    margin-top: 10px;
}
.contents_wrap .rental_box.clearfix h3 {
    font-weight: bold;
    line-height: 1.5em;
    font-size: x-large;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.contents_text .contents_box .comment {
    padding-top: 10px;
    background-color: #DFDFDF;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}
.rental_box.clearfix .rent_right {
     width: 50%;
    float: right;
}
.rental_box.clearfix .rent_right p {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
}
.rental_box.clearfix .rent_left  {
    width: 50%;
    float: left;
}
.rental_box.clearfix .rent_left p {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
}



.wrap .wrap_all .footer_wrap {
    clear: both;
    width: 100%;
    background-color: #FF0000;
    margin-top: 20px;
    padding-top: 20px;
}
.wrap_all .footer_wrap .footer {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.footer  h2  {
    font-family: "メイリオ";
    color: #FFFFFF;
    font-weight: bold;
    line-height: normal;
    font-size: large;
}
.footer_wrap .footer .add {
    font-family: "メイリオ";
    font-size: small;
    text-align: center;
    color: #FFFFFF;
    clear: both;
    padding-top: 30px;
    padding-bottom: 10px;
}
.footer_wrap .footer .footer_left {
    width: 30%;
    float: left;
}
.footer_wrap .footer .footer_center {
    width: 30%;
    float: left;
    margin-left: 5%;

}
.footer_wrap .footer .footer_right {
    width: 30%;
    float: right;
    margin-left: 5%;
}
.footer p a {
    color: #FFFFFF;
    font-family: "メイリオ";
    text-indent: 1em;
    text-decoration: none;
}
.footer .footer_right p {
    font-family: "メイリオ";
    color: #AFAFAF;
}
.footer p a:hover {
    text-decoration: underline;
}
/*メニューをページ下部に固定*/
#sp-fixed-menu{
   position: fixed;
   width: 100%;
   bottom: 0px;
   font-size: 0;
   opacity: 0.9;
   z-index: 99;
}

/*メニューを横並びにする*/
#sp-fixed-menu ul{
   display: flex;
   list-style: none;
   padding:0;
   margin:0;
   width:100%;
}

#sp-fixed-menu li{
   justify-content: center;
   align-items: center;
   width: 50%;
   padding:0;
   margin:0;
   font-size: 14px;
   border-right: 1px solid #fff;
}
/* 動画を囲うdiv */
.video {
  position: relative;
  width:100%; /* 横幅は100%にしておく(ここを変えたい場合は実装コード2の方法を確認してください) */
  height:0; /* 高さは0にしておく(padding-topで高さを指定するため) */
  padding-top: 56.25%; /* 高さを指定(16:9) */
}

/* YouTube埋め込み用のiframe */
.video iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* 動画を囲うdiv */
.video_full {
  position: relative;
  width:100%; /* 横幅は100%にしておく(ここを変えたい場合は実装コード2の方法を確認してください) */
  height:0; /* 高さは0にしておく(padding-topで高さを指定するため) */
  padding-top: 56.25%; /* 高さを指定(16:9) */
}
.photo_wrap .photo_line  .photo_left {
    width: 49%;
    float: left;

}

.contents_text .contents_box .video_full_wrap {
    margin-top: 20px;
    margin-bottom: 20px;
}


/* YouTube埋め込み用のiframe */
.video_full iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*左側メニューを緑色に*/
#sp-fixed-menu li:first-child{
   background: #38b435;
}

/*左側メニューをオレンジ色に*/
#sp-fixed-menu li:last-child{
   background: #f3a324;
}

/*ボタンを調整*/
#sp-fixed-menu li a{
   color: #fff;
   text-align: center;
   display:block;
   width: 100%;
   padding:20px;
}
.wrap .wrap_all .footer_bosyu_wrap {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.photo_wrap .photo_line.clearfix .photo_right {
    width: 49%;
    float: right;
}
.wrap_all .contents_wrap #contents {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px;
}
.contents_wrap #contents h2 {
    font-family: "メイリオ";
    font-weight: bold;
    font-size: x-large;
    text-indent: 1em;
    border-bottom-width: 2px;
    border-bottom-style: dotted;
}
.contents_wrap #contents table {
    margin-top: 10px;
    margin-left: 5%;
}
tr .naiyou p {
    font-size: large;
    text-indent: 1em;
    color: #000000;
    text-decoration: none;
}
.naiyou p a {
    color: #000000;
    text-decoration: none;
}
.naiyou p a:hover {
    color: #FF0004;
    font-weight: bold;
    text-decoration: underline;
}
.contents_box .com_line .com_left  {
    max-width: 300px;
    float: left;
    width: 30%;
}
.com_line.clearfix .com_right h3 {
    font-weight: bold;
    font-size: large;
}
.contents_box .com_line.clearfix .com_right {
    width: 68%;
    float: right;
}














/*PCの場合にはメニューを表示させない*/
@media (min-width: 768px) {
   .for-sp{
    display: none;
    text-decoration: none;
    }
ul li a {
    text-decoration: none;
    font-weight: bold;
    font-size: large;
}
}

@media screen and (max-width:769px){
    .header_wrap{
        display: none;
    }
    .contents_text{
        width: 98%;
        margin-left: auto;
        margin-right: auto;
    }
   .coach .c_line .c_left {
    float: none;
    max-width: 80%;
       margin-left: auto;
       margin-right: auto;
       margin-top: 20px;
}
.coach .c_line .c_center {
    float: none;
    max-width: 80%;
       margin-left: auto;
       margin-right: auto;
     margin-top: 20px;
     padding-left: 0px;
}
.coach .c_line .c_right {
    float: none;
    max-width: 80%;
       margin-left: auto;
       margin-right: auto;
     margin-top: 20px;
     padding-left: 0px;
}
.resizeimage img { width: 100%; }
     .member .member_line .m_left {
    float: none;
    max-width: 80%;
       margin-left: auto;
       margin-right: auto;
       margin-top: 20px;
}
.member .member_line .m_center {
    float: none;
    max-width: 80%;
       margin-left: auto;
       margin-right: auto;
     margin-top: 20px;
     padding-left: 0px;
}
.member .member_line .m_right {
    float: none;
    max-width: 80%;
       margin-left: auto;
       margin-right: auto;
     margin-top: 20px;
     padding-left: 0px;
 }
.contents_wrap .member .jr {
margin-top: 20px;
    margin-bottom: 20px;
    }
.footer_wrap .footer .add {
    padding-bottom: 80px;
}
.footer_wrap .footer .footer_left {
    width: 80%;
    padding-left: 5%;
    float: none;
}
.footer_wrap .footer .footer_right {
    width: 80%;
    padding-left: 5%;
    margin-top: 20px;
    float: none;
}
    .contents_text .contents_box h2 {
    
    font-size: x-large;
    
    font-weight: bold;
}
.contents_text .contents_box p {
    font-family: "メイリオ";
    font-size: large;
}
    .contents_wrap .coach h2 {
    font-size: x-large;
    font-weight: bold;
    
}
    .c_left p .button {
    font-size: x-large;
}
.c_center p .button {
    font-size: x-large;
}
.c_right p .button {
    font-size: x-large;
}
  .contents_wrap .member h2 {
    font-size: x-large;
    font-weight: bold;
    
}
   .m_left p .button {
    font-size: x-large;
}
.m_center p .button {
    font-size: x-large;
}
.m_right p .button {
    font-size: x-large;
}
    .contents_text .contents_box .kou{
    font-size: x-large;
    font-family: "メイリオ";
    }
.contents_box ul li {
    font-size: x-large;
    font-family: "メイリオ";
}
.video-wrap {
  max-width: 80%; /* ここに動画の横幅を指定 */
}
.photo_wrap .photo_line.clearfix .photo_left {
    width: 100%;
    float: none;
}
.photo_wrap .photo_line.clearfix .photo_right {
    float: none;
    width: 100%;
}

.contents_box .com_line.clearfix .com_left {
    float: none;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
.contents_box .com_line.clearfix .com_right {
    width: 100%;
}
.wrap .wrap_all .header {
}
.wrap_all .top_wrap .topimg {
    padding-top: 52px;

}
    .footer_wrap .footer .footer_left {
    width: 80%;
    float: none;
        margin-left: auto;
        margin-right: auto;
}
.footer_wrap .footer .footer_center {
   width: 80%;
    float: none;
        margin-left: auto;
        margin-right: auto;
    
}
.footer_wrap .footer .footer_right {
    width: 80%;
    float: none;
        margin-left: auto;
        margin-right: auto;
   
}
 
.contact_box h2  {
    font-size: x-large;
    font-weight: bold;
    
}
.contact_box h3    {
    font-weight: bold;
    font-size: large;
}
.contact_box.clearfix .contact_left  {
    width: 80%;
    float: none;
    margin-left: auto;
    margin-right: auto;
}
.contact_box.clearfix .contact_left p {
    margin-top: 10px;
}
.contact_box.clearfix .contact_right  {
    width: 80%;
    float: none;
    margin-left: auto;
    margin-right: auto;
}


.contents_wrap .rental_box.clearfix h2 {
    font-size: xx-large;
    font-weight: bold;
}
.contents_wrap .rental_box.clearfix h3 {
    font-weight: bold;
    font-size: large;
}

.rental_box.clearfix .rent_right {
     width: 80%;
    float: none;
    margin-left: auto;
    margin-right: auto;
}

.rental_box.clearfix .rent_left  {
    width: 80%;
    float: none;
    margin-left: auto;
    margin-right: auto;
}
.contents_wrap .contents_text .contents_box {
    margin-top: 5px;
    margin-bottom: 5px;
}

    .contents_text .contents_box.clearfix .con_left {
    width: 80%;
    float: none;
    margin-left: auto;
    margin-right: auto;
}
.contents_text .contents_box.clearfix .con_right {
     width: 98%;
    float: none;
        margin-left: auto;
    margin-right: auto;
}
  .contents_text .rental_box.clearfix .rent_price {

    background-color: #FFF500;
   
}  
/* Navbar & Navmenu color */
:root {
  --background-navbar: rgba(55, 55, 55, 0.98);
}

.header {
  background: var(--background-navbar);
  position: fixed;
  width: 100%;
  height: 52px;
}

/* Nav items */
.menu {
  list-style: none;
  position: absolute;
  width: 100%;
  height: auto;
  top: 0;
  margin-top: 52px;
  padding: 0 0 10px 0;
  clear: both;
  background: var(--background-navbar);
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
  transform: scale(1, 0);
  transform-origin: top;
}

/* Hamburger menu button */
.menu-btn:checked ~ .menu {
  transform: scale(1, 1);
  transform-origin: top;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

/* Hamburger menbu text */
.menu a {
  text-decoration: none;
  font-weight: 500;
  letter-spacing: 2px;
  font-size: 16px;
  text-transform: capitalize;
  color: #ddd;
  opacity: 0;
  transition: 0.5s;
}

.menu li {
  border-top: 1px solid rgb(75, 75, 75);
  padding: 15px 0;
  margin: 0 54px;
  opacity: 0;
  transition: 0.5s;
}

.menu-btn:checked ~ .menu a,
.menu-btn:checked ~ .menu li {
  opacity: 1;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.2s;
}

.menu-btn {
  display: none;
}

.menu-icon {
  display: inline-block;
  position: relative;
  cursor: pointer;
  padding: 24px 14px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.navicon {
  background: #ddd;
  display: block;
  height: 3px;
  width: 26px;
  position: relative;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

.navicon:before,
.navicon:after {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  background: #ddd;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

.navicon:before {
  top: 9px;
}

.navicon:after {
  bottom: 9px;
}

/* Hamburger Menu Animation Start */
.menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

.menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}

.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before {
  top: 0;
}
.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  bottom: 0;
}

.menu-btn:checked ~ .menu-icon .navicon {
  background: rgba(0, 0, 0, 0);
  transition: 0.2192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}
/* Hamburger Menu Animation End */

/* Navbar Container */
.navtext-container {
  width: 100%;
  height: 52px;
  position: absolute;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Navbar Text */
.navtext {
  position: absolute;
  text-transform: uppercase;
  color: #ddd;
  letter-spacing: 4px;
  font-size: 20px;
}
.wrap .wrap_all .header {
    display: block;
}


}