@charset"UTF-8";

/*=============
フォント
=============*/
/* サイト全体のフォント指定 */
body {
font-family: "Arial", "メイリオ"; 
}
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@700;900&family=Manrope&family=Noto+Sans+JP:wght@300;700&family=Roboto&display=swap');


/*=============
共通CSS
=============*/
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
body{
    color: #040404;
    font-size: 1.0em;
    background-color: #fff;
}

img{
    max-width: 100%;
}

h2,h3,h4{
    font-size: 1.5em;
    font-family: 'Manrope', sans-serif;
    color: #C07CB4;
}
a{
    color: #707070;
    font-family: 'Manrope', sans-serif;
    text-decoration: none;
}
a:hover{
    color: #B77FB2;
}
ul li{
    list-style: none;
}
.inner{
    width: 90vw;
    margin: 0 auto;
}
.pink{
    color: #C07CB4;
	text-shadow: 2px 2px 10px #ffffff ,
-2px 2px 10px #ffffff ,
2px -2px 10px #ffffff ,
-2px -2px 10px #ffffff;
	font-size: 1.5em;
}

.small{
    font-size: 60%;
}

.sp{
    display: none;
}
.fade{
  opacity : 0;
  transition: opacity 5s;
}
 
.fade.view{
  opacity: 1;
}
.tutor-wrap{
	 background-image: url(../img/premiunlesson_bg.jpg);
	background-size: cover;
	padding-top:30px;
	padding-bottom:30px;
}
.tutor-course-details-header{

	background-color:rgba(255,255,255,0);
}
/*=================
ページトップボタン
===================*/

.pagetop {
    display: none;
    position: fixed;
    bottom: 70px;
    right: 15px;
    z-index: 999;
}
.pagetop a {
    display: block;
    background-color: #B67FB1;
    text-align: center;
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    width: 70px;
    height: 70px;
    line-height: 70px;
    border-radius: 50%;
    opacity: 0.8;
}
.pagetop a:hover {
    opacity: 0.5;
}

/*=============
ヘッダー
=============*/

header{
    background-color: rgba(255,255,255,.7);
}
header .inner{
    width: 90vw;
}
.flex_box{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}
.flex_box h1{
    width: 30vw;
    margin-bottom: 0;
}

/*グローバルナビ*/
#menu-menu-1{
    display: flex;
    justify-content:end;
    width: 70vw;;
}
.menu-item{
    width: 10vw;
    padding-bottom: 10px;
    text-align: center;
}
.menu-item a{
    font-size: 1.2em;
    font-weight: 500;
}

/* ドロップダウンメニュー*/

#menu-item-54{
  position: relative;
  text-align: center;
}

.sub-menu{
    /*絶対配置で位置を指定*/
  position: absolute;
  top: 32px;
  z-index: 4;
    /*形状を指定*/
  width:100%;
    /*はじめは非表示*/
  visibility: hidden;
  opacity: 0;
    /*アニメーション設定*/
  transition: all .3s;
  width: 100%;
}
/*.menu-item-45{
    padding: 10px;
    border-bottom: #fff solid 1px;
    width: 100%;
}*/
/*hoverしたら表示*/
#menu-item-54:hover > ul,
#menu-item-54 ul li:hover > ul,
#menu-item-54:active > ul,
#menu-item-54 ul li:active > ul{
  visibility: visible;
  opacity: 1;
}


.sub-menu li{
    margin-bottom: 1px;
    background:rgba(255,240,245,.7);
    padding:10px;
    width: 100%;
}
.sub-menu li a{
    font-size: 1em;
    padding:5px;
}
/*=============
キービジュアル
=============*/

#key_visual{
    height: 100vh;
    background-size: cover;
}
#video-area{
    position: fixed;
    z-index: -1;/*最背面に設定*/
    top: 0;
    right:0;
    left:0;
    bottom:0;
    overflow: hidden;
}

#video {
    /*天地中央配置*/
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*縦横幅指定*/
    width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
}

.main_image img{
    width: 100%;
    height: auto;
}


/*------------
スクロールダウン
-------------*/
.scroll{
    position: relative;
}
.scrolldown1{
    /*描画位置※位置は適宜調整してください*/
  position:absolute;
  right:10%;
 bottom:50px;
    /*全体の高さ*/
  height:50px;
}

/*Scrollテキストの描写*/
.scrolldown1 span{
    /*描画位置*/
  position: absolute;
  left:-15px;
  top: -15px;
    /*テキストの形状*/
  color: #000;
  font-size: 0.7rem;
  letter-spacing: 0.05em;
}

/* 線の描写 */
.scrolldown1::after{
  content: "";
    /*描画位置*/
  position: absolute;
  top: 0;
    /*線の形状*/
  width: 1px;
  height: 30px;
  background: #000;
    /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 1.4s ease-in-out infinite;
  opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
  0%{
    height:0;
    top:0;
    opacity: 0;
  }
  30%{
    height:30px;
    opacity: 1;
  }
  100%{
    height:0;
    top:50px;
    opacity: 0;
  }
}

/*=============
リード文
=============*/
#lead{
    /*background-color: #E7CBE6;*/
	background-image: url(../img/lead_bg.jpg);
	background-size:cover;
    width: 100%;
    text-align: center;
    height: 10vw;
    display: table;
}

#lead div{
    display: table-cell;
    vertical-align: middle;
    line-height: 2.8em;
	    padding: 50px 0;
}
.lead h2{
    color: #626262;
    font-size: 2.5em;
    font-family: 'Manrope', sans-serif;
	margin-bottom: 0.5em;
}
.lead p{
    font-size: 1.5em;
    font-weight: 600;
    color: #626262
}

/*===================
インフォメーション
===================*/

#info{
    padding: 50px 0;
    background-color: #fff;
}
#info .inner, #online_lesson .inner{
	max-width:1400px;
	padding-top:50px;
	padding-bottom:50px;
}
.info_content{
    display: flex;
    justify-content:space-between;
    align-items: center;
}
.info_inner{
    width: 50%;
    text-align: center;
    
}
.left h4{
    margin-bottom: 10px;
}
.info_inner h3{
    color: #C07CB4;
    width: 72%;
    font-size: 1.45em;
    line-height: 1.2em;
    margin: 20px auto;
}
.info_inner p{
    width: 85%;
    font-size: 1.1em;
    text-align: left;
    line-height: 1.3em;
    margin: 0 auto 20px;
}
.right h4{
    font-family: 'Lato', sans-serif;
    font-size: 2em;
    color: #000;
}
/*===================
ビデオエリア
===================*/

#video_2{
    position: relative;
    z-index: -99;
    background-color: #fff;
    background-size: cover;
    height: 100vh;
    
}
.pl{
   
    
    background-color: #C07CB4;
    background-size: cover;
    width: 100vw;
    height: 100vh;
}


/*===================
Online Yoga Course
===================*/

#online_lesson{
    background-image: url(../img/online_bg2.jpeg);
    background-size: cover;
    padding: 50px 0 70px;
    background-color:rgba(255,255,255,0.5);
background-blend-mode:lighten;
}

.lesson{
    text-align: center;
}
#online_lesson .inner{
    width: 80vw;
}
.lesson h2{
    font-family: 'Manrope', sans-serif;
    font-size: 2.5em;
    border-bottom :dashed 5px #C07CB4;
    display: inline-block;
    margin: 0 auto;
    padding-bottom: 30px;
    padding-left: 50px;
    position: relative;
    margin-bottom: 50px;
}
.lesson h2:before{
    content: url(../img/yoga_icon.png);
    display: inline-block;
    vertical-align: bottom;
    transform: scale(0.4);
    position: absolute;
    top: -120px;
    left: -3em;
}
.course-lead{
	font-size:1.5em;
	position: relative;
	padding: 0.5em 0;/*アイコン分のスペース*/
  line-height: 1.6;/*行高*/
  color: #C07CB4;/*文字色*/
  border-top: dotted 1px gray;
  border-bottom: dotted 1px gray;
  background-color:#fff;
}

.flex_card{
    display: flex;
    /*grid-template-columns: 27vw 27vw 27vw;*/
	justify-content: space-between;
}
.card{
    margin: 0 20px;
    position: relative;
	width: 30%;
}
.card h3{
    color: #000;
    font-size: 1.8em;
    border: 1px solid #000;
    display: inline-block;
    padding: 0.3em 1em;
    margin-bottom: 20px;
    white-space: nowrap;
}
.card h4{
   color: #3E3E3E;
    font-size: 2.0em;
    font-weight: 900;
    position: absolute;
    z-index: 4;
    top: 10%;
    left: 50%;
    transform: translate(-50%,0);
    white-space: nowrap;
}


.card_content{
    background-color: #fff;
    padding: 10px 10px 50px 10px;
    box-shadow: 2px 2px 4px grey;
    margin: 20px auto;
    position: relative;
	padding: 30px;
    font-size: 1.2em;
    line-height: 1.5;
	text-align:left;
}
.card_content p{
    padding: 30px;
    font-size: 1.1em;
    line-height: 1.5;
    text-align: left;
}
.card_content img{
	display:block;
}
/*カードボタン*/

.card_btn{
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translate(-50%,0);
    height: 40px;
    width: 90%;
    margin-top: 20px;
	text-align: center;
}
.btn,
a.btn,
button.btn {
  font-size: 0.9em;
  font-weight: 700;
  line-height: 1.0;
  position: relative;
  display: inline-block;
  padding: 1em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #fff;
  border-radius: 0.5rem;
}

a.btn-border-shadow--radius {
  border-radius: 100vh;
}
a.btn-border-shadow {
  padding: calc(1.5rem - 12px) 3rem 1.5rem;

  background: #ffa3a3;
}
.card_btn a{
	font-size:1.1em;
}

a.btn-border-shadow:before {
  position: absolute;
  top: -6px;
  left: -6px;
  width: 100%;
  height: 100%;
  content: "";
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  border: 1.5px solid #DA70D6;
  border-radius: 0.5rem;
}

a.btn-border-shadow--radius:before {
  border-radius: 100vh;
}

a.btn-border-shadow:hover {
  padding: calc(1.5rem - 6px) 3rem;
}

a.btn-border-shadow:hover:before {
  top: 0;
  left: 0;
}
/*スライダー*/
.slide-content{
	width: 60%;
    margin: 30px auto 50px;
}

/*===================
プレミアムレッスン
===================*/
#premium_lesson{
    background-image: url(../img/premiunlesson_bg.jpg);
    background-size: cover;
	padding-top:100px;
}
.premium-lead{
font-size: 1.5em;
    padding: 0.5em 0;
    line-height: 1.6;
    color: #C07CB4;
    border-top: dotted 1px gray;
    border-bottom: dotted 1px gray;
    /* background-color: #fff; */
    width: 80%;
    margin: 0 auto 100px;
}
.premium_first_content{
    display: flex;
    justify-content:space-between;
    align-items: center;
}
.flower_1{
    width: 30%;
}
.instructor{
    width: 65%;
    background-color: rgba(255,255,255,0.6);
    padding:30px;
    position: relative;
}
.premium h3{
    position: absolute;
    font-size: 2em;
    top: -20px;
    left: 50%;
    transform: translate(-50%,0);
    white-space: nowrap;
}
.instructor_content{
    display: flex;
    align-items: center;
}
.instructor_inner{
    text-align: left;
    margin-left: 20px;
}
.instructor_inner h4{
    margin-bottom: 30px;
}
.instructor_inner p{
    width: 70%;
    color: #AE8BB2;
    font-size: 1.2em;
    line-height: 1.3;
}
.premium_second_content{
    display: flex;
    align-items: center;
    margin-top: 20px;
}
.flower_2{
    width: 30%;
    margin-left: 3vw;
}
.premium_six{
     width: 65%;
    background-color: rgba(255,255,255,0.6);
    padding:30px;
    position: relative;
    margin-top: 30px;
}
.premium_six h3{
    position: absolute;
    font-size: 2em;
    top: -20px;
    left: 50%;
    transform: translate(-50%,0);
    white-space: nowrap;
}
.premium_six p{
    width: 70%;
    color: #AE8BB2;
    font-size: 1.2em;
    line-height: 1.3;
    margin-left: 25%;
    padding: 20px;
    text-align: left;
    margin-bottom: 50px;
    margin-top: 30px;
}

/*ボタン*/
.about_btn{
    margin-top: 1vw;
}
.about_btn a{
    padding: 0.8em 2em;
    font-size: 1.2em;
    line-height: 1.5;
}
a.btn-border {
  border-radius: 100vh;
  background: #C07CB4;
  -webkit-box-shadow: 8px 8px 0 #F5D1D4;
  box-shadow: 8px 8px 0 #F5D1D4;
  width: 350px;
}

a.btn-border:hover,
a.btn-border:active{
  box-shadow: none;
}
.has-child2{
    position: relative;
}

.coupon{
    /*絶対配置で位置を指定*/
  position: absolute;
  left:20.5vw;
  top:90px;
  z-index: 1;
    /*形状を指定*/
  width:20vw;
    /*はじめは非表示*/
  visibility: hidden;
  opacity: 0;
    /*アニメーション設定*/
  transition: all .3s;
}
.coupon li{
    border-bottom: 1px solid #fff;
    padding: 1em 0;
    font-weight: 900;
    background-color: #F5D1D4;
    width: 100%;
}
.coupon li a{
     color: #fff;
     padding: 1em 0;
}
/*hoverしたら表示*/
.has-child2:hover > ul,
.has-child2 ul li:hover > ul,
.has-child2:active > ul,
.has-child2 ul li:active > ul{
  visibility: visible;
  opacity: 1;
}
.has-child2 ul li a:hover,
.has-child2 ul li a:active{
 color: #000;
}
/*===================
SNS
===================*/
#sns{
    background-color: #fff;
    padding: 50px 0;
    text-align: center;
}

#sns h3{
    width: 30%;
    margin: 30px auto;
    background-color: #EEEEEE;
    padding: 20px 0;
    color: #000;
}
.balloon1 {
  position: relative;
  display: inline-block;
  margin: 1.5em 0 0.8em;
  padding: 10px 15px;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  background: #FFF;
  border: solid 3px #555;
  box-sizing: border-box;
  font-family: 'Lato', sans-serif;
}

.balloon1:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}

.balloon1:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #555;
  z-index: 1;
}

.balloon1 p {
  margin: 0;
  padding: 0;
}
.insta_icon {
    width: 100px;
    margin: 0 auto;
}
.insta_icon a:hover{
    opacity: 0.7;
}


/*===================
フッター
===================*/

footer{
    width: 100vw;
    height:3em;
    background-color: #C07CB4;
    text-align: center;
    font-family: 'Lato', sans-serif;
    color: #fff;
    line-height: 3em;
}


/*==============
レスポンシブ
==============*/
@media (min-width: 765px) and (max-width: 1103px) {
	 .sub-menu{
        width: 150px;
        top:55px;
}
}
	
@media (min-width: 765px) and (max-width: 1000px) {
   
    .flex_box h1{
        width: 30vw;
    }
    #menu-menu-1{
        width: 70vw;
        justify-content:space-between;
    }
    .sub-menu{
        width: 150px;
        top:55px;
    }
    .sub-menu a{
        font-size: 1em;
    }
    .sub-menu .menu-item{
        text-align: left;
    }
    .flex_card {
    display: block;
    }
   .card h4{ 
       font-size: 2.0em;
       top: 70px;
       }
    .card_content{
        width: 28vw;
    }
    .card h3{
        font-size: 1.8em;
    }
    
    .flex_card{
        display: block;
    }
    .card {
        width: 95%;
        height: auto;
        margin: 30px auto 50px;
    }
    .card_content{
        width: auto;
       max-height: 185vw;
    }
    .card_content p {
    padding: 30px;
    font-size: 1.5em;
    line-height: 1.6;
    text-align: left;
    }
}

@media screen and (max-width:1250px){
	.flex_card{
		display:block;
	}
	.card{
		width:80%;
		margin: 0 auto 100px;
	}
	.card_content {
		height: 100% !important;
    margin-bottom: 50px;
}
}


@media screen and (max-width:764px){

    body{
        margin-top: 0 !important
    }
    
    .sp{
        display: block;
    }
    .pc{
        display: none;
    }
    /*ページトップボタン*/
    .pagetop {
    bottom: 50px;
    right: 0;
}
.pagetop a {
    display: block;
    background-color: #B67FB1;
    text-align: center;
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50%;
    opacity: 0.8;
}

    /*------
    ヘッダー
    -------*/
     header{
        height: 150px;
    }
    
header .inner{
    width: 100vw;
}
    .flex_box{
        display: block;
    }
    .flex_box h1 {
    width: 100vw;
    text-align: center;
    margin-top: 5px;
    }
    #menu-menu-1{
        width: 100vw;
    }
    .menu-item{
        padding-bottom: 0;
    }
    .sub-menu{
        top:40px;
        width: 100vw;
        left: -250%;
    }
    .sub-menu li a{
        font-size: 1em;
    }
    .header-Nav_Items{
        padding: 10px;
        justify-content: space-around;
        width: 100vw;
    }
    .header-Nav_Items li{
        margin-left: 10px;
        width:90%;
    }
    .header-Nav_Items li:last-child{
        /*margin-right: 50px;*/
    }
    .header-Nav_Items li a{
        font-size: 0.8em;
    }
    .header-Nav_Items li.has-child ul{
      width:250%;
      transform: translate(-25%,10px);
     
    }
    .header-Nav_Items li.has-child ul li{
        border-bottom: #fff solid 1px;
    }
    
    /*------------
    キービジュアル
    -------------*/
    
   #key_visual{
    width: 100vw;
    height: auto;
    background-image: none;
    }
    .main_image{
        width: 100%;
        height: auto;
        background-color: #E7CBE6;
    }
    video{
        width: 100%;
        height: auto;
    }

    
    /*------
    リード文
    -------*/
    
    #lead{
        padding: 1em;
    }
    .lead h2{
        font-size: 1.8em;
        line-height: 1em;
        margin-bottom: 0.5em;
    }
    .lead p{
        font-size: 1em;
        line-height: 1.5em;
    }
    
    /*------------------
    インフォーメーション
    -------------------*/
    
   .info_content{
        flex-direction: column; 
    }
    .info_inner{
        width: 100%;
    }
    .info_inner h3 {
        width: 100%;
        font-size: 1.5em;
        line-height: 1.2em;
        margin: 0 auto 15px;
    }
    .info_inner h4 {
        margin-bottom: 15px;
    }
    .info_inner p {
        width: 90%;
        margin-bottom: 20px;
    }
   .second_info .info_content{
         flex-direction:column-reverse;
         margin-top: 30px;
   }
   
    /*------------------
    Online Yoga Course
    -------------------*/
    #online_lesson{
        background-size: 1200px;
		padding: 50px 0 0px;
    }
    
    .lesson h2 {
        padding-bottom: 15px;
        padding-left: 25px;
        margin-bottom: 0;
        font-size: 2em;
    }
    .lesson h2:before {
        top: -120px;
        left: -120px;
        transform: scale(0.3);
    }
    .flex_card{
        display: block;
    }
    .card {
        width: 95%;
        height: auto;
        margin: 30px auto 50px;
    }
    .card_content{
        width: auto;
      /* min-height: 200vw;
       max-height: 250vw;*/
    }
    .card h4{
        font-size: 1.8em;
        top: 80px;
    }
	.course-lead, .premium-lead{
		margin-top:50px;
		text-align:left;
	}
	/*.card_btn {
		bottom:80px;
	}*/
	.card_btn a {
    font-size: 1.0em;
}
	
	/*スライダー*/
		
	
	.slide-content{
		width:90%;
	}
     /*------------------
    プレムアムレッスン
    -------------------*/
    
    #premium_lesson{
        padding-top: 30px;
    }
    .premium_first_content,.instructor_content {
        display: block;
    }
    .flower_1,.flower_2{
        display: none;
    }
    .instructor{
        width: 100%;
        padding: 30px;
        margin-top: 10px;
    }
    .instructor_photo img{
        max-width: 80%;
    }
    .premium h3 {
        position: relative;
        font-size: 1.5em;
        white-space: nowrap;
        margin-top: 10px;
    }
    .instructor_inner{
        width: 100%;
        margin: 0;
    }
    .instructor_inner h4 {
        margin-bottom: 30px;
        text-align: center;
    }
    .instructor_inner p{
        width: 100%;
        margin: 0 auto 20px;
    }
    
    .premium_second_content {
        display: block;
    }
    .premium_six {
        width: 100%;
        background-color: rgba(255,255,255,0); 
        position: static;
    }
    .premium_six h3 {
         position: relative;
         font-size: 1.5em;
         white-space: nowrap;
         margin-top: 10px;
    }
    .premium_six p{
        width: 100%;
        margin:0;
    }
    .coupon{
        width: 100%;
        left: 0;
        top: 75px;
    }
    .coupon li{
        width: 100%;
    }
    .about_btn a {
        white-space: nowrap;
    }
    a.btn-border{
        width: 90%;
        margin: 0 auto;
    }
    .has-child2 a{
        font-size: 1em;;
    }
    
    .coupon li a{
        white-space: normal;
        font-size:1em;
        padding: 0 !important;
    }

}
  
/*===================
aboutページ
===================*/

/*トップビジュアル*/

#about_top{
    background-image: url(../img/s_top.jpg);
    background-size: cover;
    background-position: right 20% bottom 50%;
    width: 100vw;
    height: 100vh;
    position:relative;
}
.about_top_inner{
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    left: 0;
    width: 50%;
}
.about_top_inner h2{
    padding: 1.5vw 10vw;
    background-color: rgba(255,255,255,.6);
    display: inline-block;
    font-size: 3.5vw;
    margin-bottom: 5vh;
}
.about_inner_logo{
    width:50%;
    margin:0 auto;
}

/*aboutoリード文*/

#about_lead{
    text-align:center;
    padding:5%;
}
#about_lead h2{
    font-size: 3.5vw;
    line-height: 0.9;
    margin-bottom: 30px;
}
#about_lead p{
    text-align: left;
    font-size: 1.1em;
    line-height: 1.6;
}

/*インストラクター紹介*/

#instructor_info{
    width:90%;
    background-image: url(../img/instoructor_bg.jpg);
    background-size: cover;
    background-position:center center;
    margin: 0 auto;
    padding: 2% 5%;
}
#instructor_info p,#instructor_info h3{
    color:#fff;
}
#instructor_info p{
    margin-top:3vw;
    text-shadow: 1px 2px 3px #808080;
}
.license{
    margin-top:30vw !important;
    line-height:1.5;
}

/*==============
レスポンシブ
==============*/

/*about*/
@media screen and (max-width:764px){
    .about_top_inner {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 80%;
        background-color:rgba(255,255,255,0.5);
    }
    .about_top_inner h2{
    font-size: 6vw;
    margin-bottom: 2vh;
    text-align: center;
    background-color:rgba(255,255,255,0);
    }
    
    #about_lead h2 {
    font-size: 8vw;
    }
    #about_lead p {
    font-size: 1em;
}
    #instructor_info {
    width: 100%;
    background-position: left 20% center;
    padding: 5% !important;
    }
}

/*===================
リクルート
===================*/

#recuruit_top{
    width: 100vw;
    padding: 5vw 3vw 5vw 3vw;
    background-image: url(../img/recruit_header.jpg);
    background-size:cover;
    background-position: right center;
}
#recuruit_top h2{
    display: inline-block;
    color: #fff;
    text-align: center;
    font-size:3em;
    margin-left: 10vw;
}

#staff_recruit{
    width: 100vw;
   margin-top:30px;
}
.bg1{
     background-image: url(../img/recruit_bg_1.png);
     background-size: cover;
}
.bg2{
     background-image: url(../img/recruit_bg_2.jpg);
     background-size: cover;
}
.recruit_wrap{
    display: flex;
    justify-content:center;
    align-items: center;
}
.recruit_inner{
    width: 100%;
    text-align: center;
}
.recruit_inner h2{
    font-size:1.8em;
    margin-bottom: 50px;
}
.recruit_inner p{
    width: 70%;
    margin: 0 auto 50px;
    line-height: 1.5;
}
.recruit_inner h3{
    font-size:1.5em;
    margin-top: 80px;
    margin-bottom: 50px;
    color: #606060;
}
.recruit_inner img{
    width: 100%;
    height: auto;
}

.toform{
    text-align: right;
    margin-top: 100px !important;
    font-weight: 900;
    color: #606060;
    position: relative;
    transform: translateX(-50px);
}
.toform a:hover{
   opacity: 0.7;
}
.toform a::after{
    position: absolute;
    content: "→";
    font-size: 25px;
    font-weight: 900;
    color: #ffffff;
    text-align: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #C07CB4;
    transform: translate(10px,-10px);
}

/*==============
レスポンシブ
==============*/

/*recruit*/
@media screen and (max-width:764px){
    .recruit_wrap{
        display: block;
        padding-bottom: 0;
    }
    .recruit_inner h2{
        margin-top: 50px;
        margin-bottom: 30px;
    }
    .recruit_inner p {
        text-align: left;
        margin: 0 auto;
    }
    .recruit_inner h3{
        margin-top: 30px;
        margin-bottom: 20px;
    }
    .bg2{
        display: flex;
        flex-direction:column-reverse
    }
    .recruit_inner img {
    transform: translateY(10px);
    }
    .toform {
        margin-top: 50px !important;
        margin-bottom: 30px !important;
        transform: translateX(10%);
    }
    
}

/*================
 コンタクトページ
==================*/
.wpcf7-list-item input{
	margin-right:5px;
}

#contact_page{
    width: 100vw;
    border-top: #C07CB4 solid 60px;
}
#contact_inner{
    width: 90vw;
    margin: 0 auto;
}
#contact_inner h2{
    color: #050505;
    font-family: 'Lato', sans-serif;
    margin: 80px 0 60px;
}
.contact_lead{
    margin-bottom: 60px;
}
.check p{
    margin-bottom: 5px;
    padding-left: 1em;
  margin-right: 1em;
}

.check{
    margin-bottom: 50px;
}
form p{
    font-family: 'Lato', sans-serif;
    margin-bottom: 10px;
}
.form_column{
    width: 90%;
    font-weight: 800;
}
.free input{
    height: 50px;
    padding-left: 10px;
}
.max_width{
    width: 50%;
}
#form_btn{
    text-align: center;
    margin: 50px 0;
}
.form_button{
  display       : inline-block;
  border-radius : 100vh;          /* 角丸       */
  font-size     : 16pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 20px 80px;   /* 余白       */
  background    : #C07CB4;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
  border: none;
}
.free input{
    padding-left: 10px;
    border: 1px solid #999;
}

.form_button:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  background    : #E68885;    /* 文字色     */
}

#post-149{
    border-top: #C07CB4 solid 60px;
}
#post-149 .content-Body{
    width: 90vw;
    margin: 0 auto;
}

.wpcf7-list-item{
    margin-top: 0.5em;
}
.page-id-16 #sns{
    display: none;
}

.wpcf7-list-item input {
    border:1px solid #666;
}
/*==============
レスポンシブ
==============*/

/*contact*/
@media screen and (max-width:764px){
    #contact_inner h2{
        text-align: center;
        margin-bottom: 50px;
        margin-top: 50px;
    }
    .max_width{
    width: 90%;
    }
    button, input, optgroup, select, textarea{
        font-size: 0.9em;
    }
    .contact_lead{
        margin-bottom: 30px;;
    }
    .form_button{
        display: block;
        margin: 0 auto;
    }
    .wpcf7-list-item input {
        margin-right: 10px;
    }
	input[type=checkbox] {
transform: scale(1.2);
}
}

/*================
 ショップページ
==================*/

#shop_top{
    width: 100vw;
    padding: 30px 0;
    background-image: url(../img/shop_header.jpg);
    text-align: center;
    background-size: cover;
    background-position: center center;
}
#shop_top h2{
    display: inline-block;
    font-family: 'Manrope', sans-serif;
    color: #B67FB1;
    text-align: center;
    font-size:3em;
    line-height: 1.2;
    margin: 30px auto;
    background-color: rgba(255,255,255,0.6);
    padding: 3% 10%;
}
#shop_page{
    padding-top: 30px;
    width: 90vw;
    margin: 0 auto;
    text-align: center;
    font-family: 'Manrope', sans-serif;
}
#shop_page h2{
    font-weight: 900;
    font-size: 2.5em;
}
.shop_title{
    background-color: #E68885;
    color: #fff;
    display: inline-block;
    padding: 10px 50px;
    margin: 30px 0;
    box-shadow: 10px 10px 0 #FDD1CE;
}
.shop_lead{
    margin-bottom: 30px;
    line-height: 1.8;
}
.shop_wrap{
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr;
    border-bottom:dashed 3px #D2A8A6;
    padding-bottom: 10px;
}
.shop_wrap:last-child{
    border:none;
}

.shop_content{
    margin:30px 10px;
}
.shop_content img{
    width: 100%;
}
.video_title{
    color: #4D4C4D !important;
    text-align: left;
    font-size: 1.3em;
    margin: 10px 0;
}
.shop_contentinner{
    text-align: left;
    margin-bottom: 30px;
}
.price{
    text-align: right;
    color: #E68885;
    margin-bottom: 30px;
}
.shop_button a{
    background: #E68885;
    background: -webkit-gradient(linear, left top, left bottom, from(#E68885), to(#FDD1CE));
    background: -webkit-linear-gradient(top, #E68885 0%, #FDD1CE 100%);
    background: linear-gradient(to bottom,#E68885 0%, #FDD1CE 100%);
    border-radius: 100vh;
    padding:10px 40px;
    color: #fff;
    box-shadow: 6px 6px 3px #999;
    font-weight: 900;
}
.shop_button a:hover {
     /*background: -webkit-linear-gradient(bottom, #FDD1CE 0%, #E68885 100%);
     background: -moz-linear-gradient(bottom, #FDD1CE 0%, #E68885 100%);
     background: -o-linear-gradient(bottom, #FDD1CE 0%, #E68885 100%);
     background: linear-gradient(to top, #E68885 0%, #FDD1CE 100%);*/
     background:#E68885;;
    box-shadow: none;
}

/*商品一覧ページ*/
#post-344, #post-0{
		background-color:#eee;
}
#post-344 .content-Body{
	padding-top:30px;
	width:80vw;
	margin:0 auto;
}
#post-344 .content-Body h2, #post-0 .content-Body h2{
	text-align:center;
}
#post-0 .content-Body{
	padding-top:30px;
	width:80vw;
	margin:0 auto;
}


/*==============
レスポンシブ
==============*/

/*SHOP*/
@media screen and (max-width:764px){
    .shop_wrap{
    display: block;
    }
    .shop_wrap{
        border:none;
    }
    .shop_content{
        border-bottom:dashed 3px #D2A8A6;
        padding: 0 0 50px 0;
    }
    .shop_lead{
        text-align: left;
        line-height: 1.5;
    }
	#shop_top h2{
		font-size:1.5em;
	}
	#shop_page h2{
    font-size: 1.8em;
}
}

/*================
 商品ページ
==================*/

#product_page{
    width: 100vw;
    border-top: #C07CB4 solid 60px;
}
#product_inner{
    width: 90vw;
    margin: 50px auto;
}
#product_inner h2{
    color: #000000;
    margin-bottom: 30px;
}
.product_content{
    display: flex;
    justify-content:space-between;
    align-items: center;
    margin-bottom: 50px;
}
.product_img{
    width: 35%;
}
.product_img img{
    width: 100%;
}
.product_explanation{
    width: 65%;
    padding-left: 50px;
}
.product_price{
    color:#A577A3;
    font-family: 'Roboto', sans-serif;
    font-size:1.5em;
    margin-bottom: 30px;
}
.explanation{
    line-height: 1.5;
    margin-bottom: 30px;
    width: 80%;
}

.purchase_btn{
    border-radius: 100vh;
    font-size: 16pt;
    text-align: center;
    cursor: pointer;
    padding: 20px 20px;
    background: #C07CB4;
    color: #ffffff;
    line-height: 1em;
    transition: .3s;
    box-shadow: 5px 5px 0 #666666;
    width: 200px;
    margin: 50px 0;
}
.purchase_btn a{
    color: #fff;
    
}
.purchase_btn:hover {
  box-shadow    : none;      
  background    : #E68885;  
}
.attention p{
    margin-bottom: 20px;
}
.attention ul li{
    list-style: disc;
    padding-bottom: 10px;
}
/*==============
レスポンシブ
==============*/

/*商品ページ*/

@media screen and (max-width:764px){
    .product_content{
        display: block;
        text-align: center;
    }
    .product_img {
        width: 100%;
        margin-bottom: 30px;
    }
    .product_explanation {
        width: 100%;
        margin: 0 auto;
        padding-left: 0;
    }
    .explanation {
        width: 100%;
        text-align: left;
    }
    .purchase_btn {
    display: inline-block;
    margin: 0;
    }
    .attention{
        width: 90%;
        margin: 0 auto;
    }
}

/*==============
固定ページ
==============*/
.page{
    width:100vw;
    margin: 0 auto;
}
.content-Title{
    margin-bottom: 20px;
}

/*=============
投稿ページ
==============*/

/*=============
登録form
==============*/

#post-78{
    width:60%;
    margin-top: 50px;
}
#post-78 .content-Body{
    margin: 50px auto;
    text-align: center;
}
.tutor-form-group{
    text-align: left;
}
#post-78::before{
    content: "下記フォームにご入力後、登録ボタンを押してください";
    color: var(--tutor-color-primary);
    font-weight:900;
}
@media screen and (max-width:764px){
    #post-78{
        width:90%;
        margin-top: 20px;}
    }

/*=============
ダッシュボード
==============*/

.tutor-dashboard-header-avatar {
    display: none !important;
}
/*.tutor-course-card .tutor-course-name a{
	color: var(--tutor-body-color) !important;
}*/

.tutor-course-card .tutor-course-name{
	background-color: var(--tutor-body-color) !important;
	padding:10px;
}
.tutor-course-card .tutor-course-name a:hover{
	opacity:0.7;
}


/*=============
妊活ヨガページ
==============*/

.product{
    background-color: #ffffff;
    text-align: center;
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
    box-shadow: 5px 8px 5px 1px rgba(253,209,206,.8);
}
.woocommerce ul.products li.product a img{
    margin-bottom: 0;
    padding: 0 10px;
}
.woocommerce a.button{
    margin-top: 10px !important;
    margin-bottom: 10px !important;
    background-color: #E68885 !important;
    color: #fff;
    border-radius: 100vh;
}
.woocommerce-loop-product__title{
    font-size:1.5em !important;
    padding: 15px !important;
    background-color:#C07CB4;
    color: #fff;
}
.woocommerce ul.products li.product .price{
    color: #C07CB4;
    font-size: 1.5em;
    margin-top: 10px;
    text-align: center;
    margin-bottom: 0 !important;
}
.products li:hover{
    transform: scale(1.03);
    animation-duration: 1s;
}
.woocommerce-LoopProduct-link　.price{
	text-align:center !important;
} 
.add_to_cart_button:hover{
    color: #fff;
    background-color: #C07CB4;
}
@media screen and (max-width:764px){
    .woocommerce-loop-product__title{
        font-size:1.0em !important;
        white-space: nowrap;
    }
    .woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
        box-shadow: 1px 1px 1px 1px rgba(253,209,206,.8);
    }
}
/*=============
お買い物かご
==============*/
#post-108 .content-Body{
    width: 80%;
    margin: 0 auto;
}

/*=============
商品ページ
==============*/
#product_inner h2 {
    color: #C07CB4 !important;
	font-size: 2em !important;
   text-align:left;
}
.woocommerce-product-gallery{
	border:2px #ccc solid;
}
.entry-summary{
	text-align:left;
	margin-top:30px;
}
.price{
	text-align:left !important;
	color: #C07CB4 !important;
	font-size: 2em !important;
}
.quantity{
	display:none !important;
}
.type-product{
	width:60vw;
	margin:0 auto;
}
.woocommerce-Tabs-panel h2{
	display:none;
}
.related{
	display:none !important;
}
.woocommerce-loop-product__link .price{
	text-align:center !important;
}


/*=============
カート
==============*/

.cart-empty{
	margin-top:50px !important;
}
.tutor-d-flex{
display: block !important;
}
.tutor-form-check {
	display:block !important;
	margin-top:10px;
}
@media screen and (max-width:764px){
	.tutor-btn-link{
		display:block;
	}
}

/*=============
支払い
==============*/
#post-109 .content-Body{
	width:80vw;
	margin:0 auto;
	padding-top:50px;
}
/*=============
プライバシーポリシー
==============*/

#post-3{
	width:80vw;
	margin:0 auto;
}
#post-3 .content-Body h2{
	margin-bottom:1em;
}
#post-3 .content-Body h3{
	font-size:1.0em;
	color:#333;
}
#post-3 .content-Body p{
	margin-bottom:1em;
}
#post-3 .content-Body ol{
	margin-bottom:1em;
	margin-left:2em;
}
/*================
妊活ヨガコース（新）
==================*/

#post-587 .content-Body p{
	width:80%;
	margin:0 auto;
	line-height:1.5;
}
.elementor-587 .elementor-element.elementor-element-219fe25 .elementor-tab-title {
    -webkit-text-stroke-color: #000;
    stroke: #000;
    background-color: #eee;
    border: 1px solid #ffffff;
    text-align: center;
}

#elementor-tab-content-3521 p{
	margin-top:0.5em !important;
	margin-bottom:0.5em !important;
}
#elementor-tab-content-3522 p{
	margin-top:0.5em !important;
	margin-bottom:0.5em !important;
}
#elementor-tab-content-3523 p{
	margin-top:0.5em !important;
	margin-bottom:0.5em !important;
}
#elementor-tab-content-3524 p{
	margin-top:0.5em !important;
	margin-bottom:0.5em !important;
}
.elementor-widget-container ul li{
	list-style:disc;
	margin:5px 0 5px 5em;
	text-decoration:underline;
}
.elementor-heading-title{
	border-bottom:dashed #C07CB4 2px;
	border-top:dashed #C07CB4 2px;
	font-size:2.5em !important;
	padding:0.5em !important;
	margin: 0 atuo;
}
.tutor-course-details-title{
	border-bottom:2px dashed #C07CB4;
	text-align:center;
	display:inline-block;
	padding:0 1em;
	margin:0 auto;
}
.tutor-wrap img{
	margin :10px;
}
.tutor-course-details-page .tutor-course-thumbnail img {
    border: 3px solid;
    border-radius: 10px;
}
.tutor-col-xl-8{
	background-color:#fff;
	margin-bottom: 30px;
   padding-bottom: 30px;
}

.tutor-mb-44 {
    margin-bottom: 20px !important;
	text-align: center;
}
.tutor-mb-12{
	border-left: 5px solid #C07CB4;
    margin-left: 10px;
    padding: 10px;
	background-color:#FDF0FD;
	display:inline-block;
}
.tutor-dashboard-menu-question-answer, .tutor-dashboard-menu-my-quiz-attempts{
	display:none;
}
.tutor-login-wrap {
	background-color: #efefef;
}
#post-551 .content-Body{
	width:80%;
	margin:0 auto;
}
#post-551 .content-Body h4{
	margin:1em 0;
} 
#post-551 .content-Body ol{
	margin:1em 0;
}
#post-551 .content-Body ol li{
	margin-left:2em;
}
.elementor-tab-desktop-title:hover{
	opacity:.7 !important;
}
@media screen and (max-width:764px){
	.elementor-heading-title{
		font-size: 1.5em !important;
    	text-align: center;
    	line-height: 1.2 !important;
	}
	.elementor-button span {
    font-size: 0.9em;
    line-height: 1.2;
	}
	
}