@charset "UTF-8";
/* CSS Document */
html{
	overflow: scroll;
}
body{
	overflow: hidden;
}
main section {
  padding: 0;
  margin-bottom: 0rem;
}
.balloon1 span,.balloon2 span,.balloon3 span,.balloon4 span,.balloon5 span{	
		    font-size: 14px!important;
	display: block;
    line-height: 1.7;
	}
	
.instructor .contents-wide {
    padding: 0 0rem;
}
.acowrap{
	display: flex;
    flex-wrap: wrap;
/*	    padding: 0 2rem;*/
	    justify-content: center;
}
.bac{
	background: #f5f5f5;
	justify-content: center;
}

/*====================================================================
header
====================================================================*/

.relax{
  background-image: url(https://www.noa-yoga.com/genle-img/genre_a_s.jpg);
}
.cond,.conditioning{
  background-image: url(https://www.noa-yoga.com/genle-img/genre_b_s.jpg);
}
.diet{
  background-image: url(https://www.noa-yoga.com/genle-img/genre_c_s.jpg);
}
.inst-visual {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  text-align: left;
  height: 40rem;
  padding-left: 2rem;
  flex-direction: column;
}	
.ttl-genru,.ttl-genre{
  text-transform: uppercase;
}
.yoga-genre-desc{
    padding: 2.4em 1.4em;
    border-top: solid 2px #dbdbdb;
    font-size: 15px;
    width: 100%;
    line-height: 2;
    padding-bottom: 2em;
    text-align: justify;
    text-align-last: left;
    color: #4f4f5e;
	    margin: 2.4em auto 0;
}	
.yoga-genre-desc p{
    line-height: 1.8;
}		
.mainVisual {
    height: auto;
}
.genre-wrap:nth-of-type(2n){
  background: #fff;
}

.mv_inner {
  height: 60vh;
}
	
/*====================================================================
.instructor
====================================================================*/
.genre-inst-ttl {
    display: flex;
    font-size: 25px;
    margin-bottom: 0.3em;
    color: #32323c;
    font-weight: normal;

    text-align: center;
    letter-spacing: 6px;
    position: relative;
    padding-bottom: 3rem;
    justify-content: center;
    font-family: 'century gothic','Josefin Sans',sans-serif;
}
.genre-inst-ttl span {
    height: 1px;
    width: 7.8rem;
    display: block;
    background: #32323c;
    margin: 1.2rem 1.7rem 0;
}
.genre-inst-detail {
    background-color: rgba(88, 177, 198, 0.6);
}	
	
.genre-inst-list2 {
    padding: 0 1.4rem 0;
}	
.genre-inst-box::after {
    border-bottom: 15px solid #58b1c6;
}		
.sub_categories li a {
    font-size: 14.5px;
    padding: 0 1em;
    border-right: 1px dashed #999;
    color: #58b1c6;
}	

	
	
	
/*====================================================================
.s_06 .accordion_one
====================================================================*/
.s_06 .accordion_one {
  margin: 1%;
  width: 100%;
  box-shadow: 0 10px 25px 0 rgb(0 0 0 / 7%);
}
.s_06{
	width: 48%;
	margin: 1%;
}

.s_06 .accordion_one .accordion_header {
    color: #000;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    position: relative;
    z-index: +1;
    transition-duration: 0.2s;
    width: 100%;
    padding: 2em .4em 0;
    border-radius: .7em;
    height: 14vh;
    cursor: pointer;
    background: #fff;
   
}
	.btm122{
		padding-top: 1rem;
    display: block;
	}
.s_06 .accordion_one .accordion_header .i_box {
    display: flex;
    position: absolute;
     top: 66%;
    right: 47%;
    opacity: 0.6;
    /* width: 40px; */
    height: 40px;
    border-right: solid 2px #5bafca;
    border-bottom: solid 2px #5bafca;
    /* border-bottom: 1px solid #000; */
    margin-top: -20px;
    box-sizing: border-box;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transform-origin: center center;
    transition-duration: 0.2s;
}
.s_06 .accordion_one .accordion_header.open .i_box {
  -webkit-transform: rotate(-360deg);
  transform: rotate(-360deg);
	display: none;
}
.open{
	border-bottom-left-radius: 0px!important;
border-bottom-right-radius: 0px!important;
		padding-bottom: 4%!important;
}
.s_06 .accordion_one .accordion_header .i_box .one_i:before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
.s_06 .accordion_one .accordion_header.open .i_box .one_i:before {
  content: none;
}
.s_06 .accordion_one .accordion_header.open .i_box .one_i:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.s_06 .accordion_one .accordion_inner {
  display: none;
  padding: 0px 1em 2.2em;
  background: #fff;
  box-sizing: border-box;
  font-size: 1.1rem;
    text-align: left;
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
}
.s_06 .accordion_one .accordion_inner p.txt_a_ac {
  margin: 0;
}
.box_one .long {
  display: none;
}
.s_06 .accordion_one .accordion_inner .closeArea {
  margin: 0 auto;
}
.s_06 .accordion_one .accordion_inner .closeArea .close_box a.close_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0px 15px 15px 20px;
    text-decoration: none;
    line-height: 1.3;
    margin-top: 10%;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    position: relative;
    cursor: pointer;
    transition-duration: 0.2s;
}
.s_06 .accordion_one:nth-of-type(2) .accordion_inner .closeArea .close_box a.close_btn {
    background-color: #ff9a05;
}
.s_06 .accordion_one:nth-of-type(3) .accordion_inner .closeArea .close_box a.close_btn {
    background-color: #1c85d8;
}
.s_06 .accordion_one .accordion_inner .closeArea .close_box a.close_btn:hover {
  opacity: .8;
}
.s_06 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box {
display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 130%;
    left: 44%;
    border-left: solid 2px #5bafca;
    border-bottom: solid 2px #5bafca;
    width: 16px;
    height: 16px;
    transform: rotate(135deg);
    margin-top: -15px;
	opacity: 0.6;
}
.s_06 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box .one_i {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 18px;
  height: 18px;
}
.s_06 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box .one_i:before, .s_06 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box .one_i:after {
  content: '';
  background-color: #fff;
  border-radius: 10px;
  width: 18px;
  height: 4px;
  position: absolute;
  top: 7px;
  left: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(45deg);
  transform-origin: center center;
    text-align-last: center;
	font-size: 13px;

}
.s_06 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box .one_i:before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
.txt_a_ac a{
    display: block;
    text-align: center;
    padding-top: 21%;
    color: #5bafca;
    opacity: 0.8;
	text-align-last: center;
}

.s_06 .accordion_one .accordion_header .i_box {
  width: 1.3em;
  height: 1.3em;
  margin-top: 0;
}
.s_06 .accordion_one .accordion_inner .closeArea .close_box a.close_btn {
  font-size: 15px;
}

#app {
  width: 100%;
  height: 60vh;
  background-color: #000000;
  background-position: center;
  background-size: cover;
  transition: background-image 1.3s;
  position: relative;
  margin-bottom: 0;
}
.bg1 {
  background-image: url(https://www.noa-yoga.com/genle-img/category_a_p.jpg);
}
.bg2 {
  background-image: url(https://www.noa-yoga.com/genle-img/category_b_p.jpg);
}
.bg3 {
  background-image: url(https://www.noa-yoga.com/genle-img/category_c_p.jpg);
}


.list {
        display: flex;
        justify-content: center;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: auto;
 }
.list-item {
            margin: 0 10px;
	    text-align: center;
 }
.list-item > a{
  display: block;
  color: #fff;
  /* font-size: 2rem; */
  padding: 3rem 0;
  width: 28rem;
  background-color: transparent;
  transition: background-color 0.3s;
  border-radius: 7px;
  border: solid #fff 1px;
}
.list-item > a:hover,
.sub_gnere_box a:hover{
  background-color: rgba(255, 255, 255, 0.1);
  border: solid transparent 1px;
}
.catrgo22{
position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    padding: 1.8rem;
    border: solid;
    width: 21rem;
    border: solid 1px;
    border-radius: 7px;
}
.slick-next:before{
	display: none;
}
.progressbar{
 position: relative;
 width: 100%;
 height: 7px;
 margin-top: 10px;
 background: #ccc;
 border-radius: 7px;
 overflow: hidden; }
.progressbar span{
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  transform-origin: left center;;
  background: #fbca5a;
  border-radius: 7px;
  transform: scaleX(0);
  transition-timing-function: linear;
 }
.back-white{
  width: 100%;
  margin: auto;
  color: #fff;
  text-align: center;
  display: block;
  position: relative;
}
.back-white::after{
  position: absolute;
  background: #fff;
  color: #000;
}


.genre_box_inner{
  padding: 20% 6%;
}
.clippa{
	padding: 2rem;
}
.b-photo-clip2022-1:hover + .feat-ls-detail{
 display: none;
}

.button, .result{
  width: 200px;
  height: 100px;
  padding: 20px 0;
  box-sizing: border-box;
  text-align: center;
  color: #fff;
  background: #66b6d5;
  border-radius: 10px;
  margin-bottom: 10px;
}

.button:hover + .result{
  background: #E72458;
}
.b-photo-clip2022-1 {
	background-position: bottom;
	background-size: cover;        
	background-image: url(https://www.noa-yoga.com/genle-img/category_a_s.jpg);
	  overflow: hidden;
  position: relative;
  z-index: 1;
    }
.b-photo-clip2022-2{
	background-position: bottom;
	background-size: cover;
        background-image: url(https://www.noa-yoga.com/genle-img/category_b_s.jpg);
    }
.b-photo-clip2022-3 {
	background-position: bottom;
	background-size: cover;
        background-image: url(https://www.noa-yoga.com/genle-img/category_c_s.jpg);
    }

/* .genre_box h3{
font-size: 2rem;
} */
.genre_box p:nth-of-type(2){
padding: 3%;		

}
.top_genre_block{
  padding: 3rem 0 0;
}
.genre_box_inner img{
  width: 100%;
}


/*====================================================================
.s_06 .accordion_one
====================================================================*/
.acowrap {
    display: flex;
    flex-wrap: wrap;
    padding: 3rem 0rem 0;
    justify-content: center;
}
.catettl{
   font-size: 2.5rem;
    font-weight: 300;
	text-transform: uppercase;
    line-height: 1.2;
    letter-spacing: .1em;
    margin: 0 0 3 Rem;
    font-family: 'century gothic','Josefin Sans',"游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
    text-align: center;
}
	.catettls{
    font-size: 1.5rem;
    display: block;
    padding-bottom: 4rem;
    margin-top: 0.8em;
    text-align: center;
	}
.acowrap {
    display: flex;
    flex-wrap: wrap;
    padding: 0rem 0rem 0;
   justify-content: flex-start;
}
.bac {
    background: #f5f5f5;
    justify-content: center;
    padding: 3rem 1.4rem 3rem;
}
	.sec_bloc{
    padding: 4rem 0 5rem;
  }
.studio-block {
  margin: 2em auto 1em;
}
	.btm22{
		    display: block;
    padding-bottom: 2rem;
	}
/* .genre_box h3 {
  font-size: 3.2rem;
  font-family: 'century gothic','Josefin Sans',"游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
  font-weight: 300;
  letter-spacing: .1em;
} */
	.back-white:first-of-type{
		    font-size: 1.6rem;
    font-weight: bold;
	}
.back-white p:nth-of-type(2) {
  padding: 8% 0;
  font-size: 1.6rem;
  line-height: 1.7;
  font-weight: bold;
}
.osusumebox2{
  padding-bottom: 3rem;
}


.about2209{
  padding: 2rem;
}	

.about2209 h2{
  font-size: 1.8rem;
}
.about2209 p{
  font-size: 1.1rem;
    text-align: left;
    padding-top: 1.3rem;
      line-height: 1.8;
}

.bordertopx{
      background: #e1e1e1;
  height: 2px;
  width: 90%;
  margin: 1rem auto;
}
.genre_box figure {
  border-radius: 0.3rem;
  overflow: hidden;
}

/* TOP PAGE NEWS SLIDER ========= */
.branch-photo-list2{
 opacity: 0;
} 
.branch-photo-list2.slick-initialized{
  opacity: 1;
  transition: opacity .5s;
}
.top_mv_news_slider{
  padding: 2em 2em;
}

@media (min-width: 960px){
  .mv_wrap{
    position: relative;
  }
  .top_mv_news_slider{
    position: absolute;
    top: 46rem;
    left: 7rem;
    width: 30rem;
    padding: 0;
  }
}/* 960 */

.sub_gnere_box{
  color: #fff;
  background-color: rgba(255, 255, 255, 0.15);
  padding: 1em 0;
  border-radius: 0.4em;
}
.genre_box_inner .sub_gnere_ul{
  display: none;
  margin: .5em auto .3em;
  text-align: center;
}
.sub_gnere_ttl{
  font-family: 'century gothic','Josefin Sans',"游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
  font-weight: 200;
  font-size: 1.4rem;
  padding: .6em 0;
  position: relative;
}
.genre_box_inner .sub_gnere_ttl::after{
  content: "";
  display: block;
  width: .7rem;
  height: .7rem;
  border-left: .15rem solid #fff;
  border-bottom: .15rem solid #fff;
  position: absolute;
  right: 1em;
  top: 0;
  bottom: 0.3em;
  margin: auto;
  transform: rotateZ(-45deg);
  transition: transform .3s , bottom .3s ;
}
.genre_box_inner .sub_gnere_ttl.on::after{
  bottom: -0.4em;
  transform: rotateZ(-225deg);
}
.list-item .sub_gnere_ttl{
  font-size: 1.2rem;
  margin-bottom: 0.5em;
}
.sub_gnere_ul a{
  display: block;
  font-size: 1.3rem;
  font-weight: 600;
  padding: .5em;
}

.w54{
  width: 59%!important;
}
.blue23{
 background: rgb(88, 177, 198,0.6);
}
.red23{
	 background: rgb(238, 123, 114,0.6);
}
.green23{
	 background: rgb(0, 90, 73,0.6);
}



  .catesl{
  display: flex;
  flex-wrap: wrap;
justify-content: center;
  text-align: -webkit-right;
    padding: 2rem 0 2rem;
}
.catesl li{
    width: 40%;
  display: block;
}
.catesl a{
background: #eeeeed;
font-size: 14px;
  padding: 6% 0%;
  margin: 3%;
  border-radius: 34px;
  color: #484b44;
  display: block;
  text-align: center;
}

.glbtn{
  
  text-align: center;
  display: block;
  background: #005a49;
  color: #fff;
  width: 53%;
  margin: auto;
  padding: 1.3rem;
  font-weight: bold;
}

.gl22-sliderbk{
    box-shadow: 0 10px 15px 5px rgb(0 0 0 / 10%);
  width: 97%;
  margin: auto;
padding-bottom: 3rem;
  margin: 0 1rem 3rem;
  background: #fff;
}
	
.slick-slider{
		overflow: hidden!important;
	}

.slick-dots {
  position: initial;

}

.glwp{
      padding: 3rem 0 1rem;
}
#top_about{
  margin: 0 0 2rem;
}
#top_news {
  padding: 1rem 0 6rem;
}

    .catesl3 a{
  margin: 2.7%;
}

      .catesl2 a{
  margin: 4%;
}



.flex-detail{
	display: flex;
    justify-content: center;
    /* padding-left: 29rem; */
    width: 90%;
    margin: auto;
}


.flex-detail li{
	    width: 30%;
    padding: 1.2rem;
    display: block;
}
.flex-detail img{
	padding-bottom: 1rem;
}
.flex-detail a{
	font-weight: bold;
}
.allicon{
	    display: flex;
    justify-content: space-around;
    padding-bottom: 3rem;
}
.detail1,.detail2,.detail3{
	width: 26%;
    display: block;
    text-align: center;
}
.allicon{
	    padding-top: 1rem;
    font-size: 1.1rem;
}
.detail1 h3,.detail2 h3,.detail3 h3{
	    width: 100%;
    font-size: 1rem;
    padding-top: 1rem;
    align-items: center;
    margin: auto;
    text-align: center;
	    text-align-last: initial;
}
.red{
	color: #ee7b72;
}
.blue{
	color: #58b1c6;
}
.green{
	color: #005a49;
}
.don{
	display: block;
}


@media (min-width: 960px){

  .detail1, .detail2, .detail3 {
    width: 10%;
    display: block;
    text-align: center;
    margin: 0 3rem;
  }

  .don2{
    display: none;
  }

  .detail1 h3,.detail2 h3,.detail3 h3{
    font-size: 1.2rem;
    }
  .allicon {
    justify-content: center;
  }
  .mv_inner_top .store-photo{
    width:30rem;
  }
  .about2209 {
    padding: 6rem 0;
    text-align: left;
    padding-left: 18rem;
  }

  .gl22-sliderbk{
        width: 26%;
  }

  .glgp22{
        display: flex;
    justify-content: center;
  }

  .catesl3 a{
    margin: 2.5%;
  }

  .catesl2 a{
    margin: 4%;
  }

  #top_news {
    padding: 5rem 0 6rem;
  }

  .glwp {
    padding: 6rem 0 5rem;
  }
  .flex-detail{
    display: flex;
    justify-content: space-evenly;
    /* padding-left: 29rem; */
    width: 40%;
    margin: auto;
  }
  .flex-detail li{
        width: 25%;
    padding: 1rem;
    display: block;
  }
	
}

@media (min-width: 960px){

  .relax{
    background-image: url(https://www.noa-yoga.com/genle-img/genre_a_p.jpg);
  }
  .cond,.conditioning{
    background-image: url(https://www.noa-yoga.com/genle-img/genre_b_p.jpg);
  }
  .diet{
    background-image: url(https://www.noa-yoga.com/genle-img/genre_c_p.jpg);
  }
  .s_06{
    width: 24%;
    margin: 0.5%;
  }
  .acowrap {
    max-width: 1280px;
    margin: auto;
    justify-content: flex-start;
  }
  #app .catettls {
    padding-bottom: 6rem;
  }
  .branch-box .catettls {
    padding-bottom: 0;
  }
  .list-item .sub_gnere_ttl {
    font-size: 1.8rem;
    margin-bottom: 0.25em;
    padding: 0;
  }
  .list-item .sub_gnere_ttl span {
    display: block;
    font-size: 1rem;
    margin-top: 0.6em;
  }
  .genre-up-sec2 {
    /* margin: 2em 10em 3em; */
    position: relative;
    max-width: 1200px;
    margin: 3em auto 5em;
  }
  .yoga-genre-desc {
    padding: 2.4em 1.4em;
    border-top: solid 2px #dbdbdb;
    font-size: 17px;
    width: 100%;
    /* padding: 0 2rem; */
    line-height: 2;
    padding-bottom: 2em;
    text-align: justify;
    text-align-last: left;
    color: #4f4f5e;
    margin: 2.4em auto 0;
  }
  .yoga-genre-desc p {
    line-height: 1.8;
    padding: 0 20rem 0;
  }
  .list h3{
    font-size: 2.45rem;
    font-family: 'century gothic','Josefin Sans',sans-serif;
    font-weight: 300;
    letter-spacing: .1em;
    padding: 0.4em 0 2.8rem;
  }
  .list-item{
    width: 31%;
    margin: 0 1em;
    position: relative;
  }
  .list-inner {
    width: 100% !important;
    padding: 3rem !important;
  }
  .list-item h3 span {
    font-size: 1.3rem;
    font-weight: 400;
    letter-spacing: .2em;
    display: block;
  }
  .list-item p{
    /* padding: 8% 10% 0; */
    font-size: 1.3rem;
    letter-spacing: .05em;
    line-height: 1.7;
    font-weight: 500;
    text-align: justify;
  }

  .list-item .sub_gnere_box{
    width: 100%;
    padding: 1.5em .5em;
    background-color: transparent;
    display: none;

    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    background-color: rgba(160,170,170,.95);
  }
  .list-item .sub_gnere_box._condition{
    background-color: rgba(128,181,182,.95);
  }
  .list-item .sub_gnere_box._relax{
    background-color: rgba(12,90,75,.95);
  }
  .list-item .sub_gnere_box._diet{
    background-color: rgba(218,132,125,.95);
  }

  .list-item .sub_gnere_ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .list-item .sub_gnere_ul li{
    display: flex;
    align-items: center;
    width: 50%;
    height: auto;
  }
  .list-item .sub_gnere_ul a{
    width: 100%;
    font-size: 1.1rem;
    border: none;
    padding: .4em;
  }

  .app::after{
    background-color: rgba(255, 255, 255, 0.9);
  }
  .ttl-genre {
    font-size: 3.4rem;
    letter-spacing: 1.6rem;
  }
  .inst-visual {
    /* display: flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left; */
    height: 50rem;
    padding-left: 10rem;
  }
  .bac {
    background: #f5f5f5;
    justify-content: center;
        padding: 5rem 12rem 5rem;
  }

  /*====================================================================
  .s_06 .accordion_one
  ====================================================================*/
  #app .catettl{
    color: #fff;
  }

  #app {
    width: 100%;
        height: auto;
    color: #fff;
    background-color: #fff;
    background-position: center;
    background-size: cover;
    transition: background-image 1.3s;
    position: relative;
    margin-bottom: 0;
    padding: 8rem 0 8rem;
	  z-index: 2;
  }
    
  .list {
    display: flex;
    justify-content: center;
    position: static;
    transform: none;
    width: auto;
    max-width: 1280px;
    padding: 0 3rem;
    margin: auto;
  }	
  .osusumebox2{
        margin-bottom: 4rem;
  }	


  /*     
  .mv_inner_top .mv_bottom_link_lower {
    bottom: 7.64rem;
  }	 */
  .ttl_sub {
    bottom: -4.9rem;
  padding: 0;
  }

  section.store-photo.pc{
    padding-top: 4rem;
  }

  /* .mv_inner_top {
    padding: 30vh 0 0 8rem;
  } */

    .catesl a{
    font-size: 11px;
  }
	
}

@media (min-width: 1200px){
	.brge{
		display: none;
	}
	.s_06 .accordion_one .accordion_header {
    color: #000;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    position: relative;
    z-index: +1;
    transition-duration: 0.2s;
    padding: 38px 15px 0px;
    height: 16vh;
}
	.btm122{
		padding-top: 0;
	}	
  /* section.store-photo.pc{
		padding-top: 80px;
	} */
	.catesl a{
		font-size: 13px;
	}
}

@media (min-width: 1500px){
  .catesl a{
		font-size: 15px;
	}
}


/*====================================================================
 トップカテゴリー3種 トップページ
====================================================================*/

/* HEADER ================= */
.mv_inner_cat_top{
  height: 60vh;
}
.top_relax{
  background-image: url(https://www.noa-yoga.com/genle-img/category_a_s.jpg);
  background-size: cover;
background-position: center;
}
.top_conditioning{
  background-image: url(https://www.noa-yoga.com/genle-img/category_hucho_top_s.jpg);
  background-size: cover;
  background-position: center;
}	
.top_diet{
  background-image: url(https://www.noa-yoga.com/genle-img/category_c_s.jpg);
  background-size: cover;
  background-position: center;
}
.mv_inner_cat_top .subgenre_subttl{
  display: none;
}
.mv_inner_cat_top .ttl-genre {
  font-weight: 100;
  font-size: 3.0rem;
  line-height: 1.3em;
  letter-spacing: 0.15em;
  margin-bottom: 0.2em;
}
.mv_inner_cat_top .ttl-genre .ja {
  padding-top: 0;
  font-size: .45em;
  letter-spacing: .5rem;
}
@media (min-width:960px){
  .mv_inner_cat_top .ttl-genre{
    font-size: 4.2rem;
    letter-spacing: 0.3em;
  }
  .mv_inner_cat_top {
    height: 70.8vw;
    padding: 30rem 0 0 10rem;
    max-height: 768px;
  }
  .top_relax{
    background-image: url(https://www.noa-yoga.com/genle-img/category_a_p.jpg);
  }
  .top_conditioning{
    background-image: url(https://www.noa-yoga.com/genle-img/category_b_p.jpg);
  }	
  .top_diet{
    background-image: url(https://www.noa-yoga.com/genle-img/category_c_p.jpg);
  }

}/*  */

/* ヘッダー下 ================= */
.top_category_wrap h2 {
  font-size: 2.2rem;
    font-weight: 300;
    margin-bottom: 1em;
        line-height: 1.4;
    letter-spacing: .1em;
    margin: 0 0 3 Rem;
    font-family: 'century gothic','Josefin Sans',"游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
}
.top_category_block{
  padding: 4em 0 0em;
  position: relative;
}
.top_category_block_inner{
  padding: 0 1.5em;
}
.top_category_block .top_category_wrap h2 {
	font-size: 1.8rem;
	font-weight: bold;
}
.top_category_block .yoga-genre-desc{
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}
@media (min-width:960px){
  .top_category_wrap{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 4em;
  }
  .top_category_block .top_category_wrap h2{
    font-size: 1.95rem;
    font-weight: bold;
    line-height: 1.7;
    text-align: left;
  }
  .top_category_wrap .cont1{
    width: 60%;
  }
  .top_category_wrap .sec1-img{
    width: 35%;
  }
  .top_category_block .yoga-genre-desc{
    font-size: 14.5px;
    padding: 0;
  }

}/*  */


/* SLIDER ================= */
.ww22{
  padding: 0 0 2em;
}
.ww22 button p{
	font-size: 2rem;
}
button {
  /* margin: 0 auto; */
  color: #58b1c6;
  background: none;
  font-weight: 300;
  border: none;
  font-size: 24px;
  line-height: 1.4;
}
.balloon{
  position: relative;
  width: 95%;
  font-size: 1.3em !important;
  font-family: 'century gothic', 'Josefin Sans', sans-serif;
  text-align: left;
  line-height: 1.7;
  padding: 1.5em;
  margin: auto;
  border-radius: 1em;
  color: #fff;
  background: #58b1c6;
  -webkit-filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.2));
}
.balloon::before {
  content: "";
  display: block;
  position: absolute;
  top: -1.7rem;
  left: 0;
  right: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 1rem 1.8rem 1rem;
  border-color: transparent transparent #58b1c6 transparent;
}

/* slick 矢印
===================================*/
.slick-arrow {
  display: block;
  position: absolute;
  top: 3.2rem;
  padding: 0;
  color: transparent;
  z-index: 1;
  transition: opacity 0.5s;
  z-index: 1;
}
.slick-arrow:hover {
  opacity: 0.7;
}

/* 共通設定 */
.slick-prev, .slick-next{
  width: 2rem;
  height: 2rem;
}
.slick-next::before,
.slick-next::after,
.slick-prev::before,
.slick-prev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}
.slick-next::after,
.slick-prev::after {
  border-top: 1px solid #a8a8a8;
  border-right: 1px solid #a8a8a8;
}
/* prev */
.slick-prev {
  left: 1rem;
}
.slick-prev::after {
  transform: rotate(-135deg);
  transform-origin: center;
}
/* next */
.slick-next {
  right: 1rem;
}
.slick-next::after {
  transform: rotate(45deg);
  transform-origin: center;
}

@media (min-width:960px){
  .border {
    height: 1px;
    background: #dbdbdb;
    width: 90%;
    margin: 0 auto 6rem;
  }

  .wrap-tab {
  overflow: hidden;
  margin: auto;
  }
  .tab-radio{
  display: none;
  }
  .list-tab-label{
    display: flex;
    justify-content: center;
  }
  .list-tab-label > li{
    width: 15%;
    text-align: center;
  }
  .tab-label{
    display: block;
    padding: 0.5em 1em;
    color: #32323b;
    box-sizing: border-box;
    cursor: pointer;
  }
  .tab-label span:first-of-type{
    font-size: 2rem;
    font-weight: 300;
  }
  .tab-label span:last-of-type{
    display: block;
    font-weight: bold;
    font-size: 1rem;
    margin: 0.2em 0;
  }

  #tab-radio1:checked ~ .list-tab-label #tab-label1,
  #tab-radio2:checked ~ .list-tab-label #tab-label2,
  #tab-radio3:checked ~ .list-tab-label #tab-label3,
  #tab-radio5:checked ~ .list-tab-label #tab-label5,
  #tab-radio4:checked ~ .list-tab-label #tab-label4
  {
  color: #6ca8b7;
  }
  .wrap-tab-content p{
    padding: 2.5%;
    font-size: 14.5px;
    text-align: left;
    line-height: 1.8;
  }
  .wrap-tab-content span{
    display: block;
    font-size: 1.7em;
    padding-bottom: 2%;
    text-align: center;
  }
  .tab-content{
    display: none;
    border-radius: 0.5em;
    padding: 1em;
    color: #fff;
    background: #58b1c6;
    width: 85%;
    margin: 2rem auto;
  }
  #tab-radio1:checked ~ .wrap-tab-content #tab-content1,
  #tab-radio2:checked ~ .wrap-tab-content #tab-content2,
  #tab-radio3:checked ~ .wrap-tab-content #tab-content3,
  #tab-radio4:checked ~ .wrap-tab-content #tab-content4,
  #tab-radio5:checked ~ .wrap-tab-content #tab-content5{
    display: block;
    position: relative;
    transition: opacity 3s;
  }
  .wrap-tab-content {
    position: relative;
  }
  .tab-content::before {
    content: "";
    display: block;
    position: absolute;
    top: -1.5rem;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 1rem 2rem 1rem;
    border-color: transparent transparent #58b1c6 transparent;
    transition: opacity 3s;

    left: 0;
    right: 0;
    margin: auto;
  }
  
  #tab-content1::before {
    left: -70.5%;
  }
  #tab-content2::before {
    left: -35.5%;
  }
  /* #tab-content3::before {
    left: 0;
    right: 0;
    margin: auto;
  } */
  #tab-content4::before {
    left: 35.5%;
  }
  #tab-content5::before {
    left: 70.5%;
  }


}/*  */


/* こんなかたにおすすめ ================= */
.osusume_wrap{
  padding:2em 0;
}
.osusume_block{
  padding: 2em;
}
.osusumettl {
  font-size: 2.4rem;
  font-weight: 300;
  text-align: center;
  padding: 1rem 0;
  margin: 0.8em 0;
  border-top: solid 1px #58b1c6;
  border-bottom: solid 1px #58b1c6;
}
.osusumebox{
  text-align: left;
  padding: 1rem;
}
.osusumebox li{
  font-size: 1.4em;
  padding: .5em 0;
}
.osusumebox li::before{
  content: "□";
  padding-right: 0.5rem;
}
@media (min-width:960px){
  .osusume_wrap{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5rem 10rem 7rem;
  }
  .osususmeimg {
    width: 50%;
  }
  .osususmeimg img {
    border-radius: .6rem;
  }
  .osusume_block{
    width: 46%;
    padding: 0 0 0 4rem;
  }
  .osusumettl{
    margin: 0 0 .3em;
  }
  .osusumebox li {
    font-size: 1.3em;
    padding: 0.3em 0;
  }
  .osusumebox{
    padding-bottom: 0;
  }

}/*  */

