@charset "UTF-8";
/* CSS Document */
/* レスポンシブ共通設定*/
html
{
	font-size: 62.5%;
}
body
{
    color: #272727;
    font-family:
    "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
    width: 100%;
}
/*ハイライトの枠線を消す*/
a {
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  cursor:pointer;
}
*:focus {
  outline: none;
}
article
{

}
section
{

}
#contents
{
    margin: 0 auto;
}
main img
{
    width: 100%;
}
#mvArea
{
	background-color: #0090a8;
}
#mv
{
    position: relative;
}
h2 img
{
    width: 100%;
}
#btnContent
{
    position: relative;
}
/* ボタンアニーメーションの設定　Start */
#btnContent .btn_move,#privilege #btn_privilege
{
	position:absolute;
	width: 95%;
/* アニメーションの名前 */
    animation-name: shiver;
    /* アニメーションの１回分の長さ */
    animation-duration: 1.5s;
    /* アニメーションの回数 */
    animation-iteration-count: infinite;
    /* アニメーションの進行具合 */
    animation-timing-function: ease-in-out;
    /* アニメーション再生の向き */
    animation-direction: alternate;
    /* アニメーション再生の待機時間 */
    animation-delay: 2s;
}
/* アニメーションの設定（#reseveBtn） */
@keyframes shiver
{
    0% {transform: translate(0, 0);}
	5% {transform: translate(-5px, -0);}
	10% {transform: translate(5px, 0);}
	15% {transform: translate(-5px, -0);}
	20% {transform: translate(5px, 0);}
	25% {transform: translate(-5px, -0);}
	30% {transform: translate(0, 0);}
	100% {transform: translate(0, 0);}
}
/* ボタンアニーメーションの設定　End */

/* カウントダウンエリアの設定　Start */
#countDownArea
{
    background-color: #0090a8;
    color: #fff;
    text-align: center;
	font-weight: 500;
}
/* カウントダウンエリアの設定　End */

/* キャンペーン参加方法　Start */
#entryProcess img
    {
        width: 100%;
    }

/* キャンペーン参加方法内のLINEボタンの設定　Start */
	#entryProcess .Menu-Item-Content #btn_line
	{
		position: absolute;
    	top: 7%;
   		left: 3%;
    	width: 95%;
	}
/* キャンペーン参加方法内のLINEボタンの設定　End */

/* キャンペーン参加方法の設定　End */

/* キャンペーン参加方法のアコーディオン　Start */
#entryProcess .AcordionMenu
{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
#entryProcess .Menu
{
    width: 100%;
    background-color: #fff;
}
#entryProcess .Menu-Item
{
    margin-bottom: 1px;
    width: 100%;
}
#entryProcess .Menu-Item__Inner
{
    overflow: hidden;
    width: 100%;
    height: 0;
    transition: all 0.5s; /*アニメーション用*/
	position: relative;
}
#entryProcess .Menu-Item-Content
{
    width: 100%;
    background-color: #fff;
	
}
#entryProcess .Menu-Item-Content .btn_line
{
	position:absolute;
}
/* キャンペーン参加方法のアコーディオン　End */

/* コースアップキャンペーン限定特典　Start */
#privilege
{
	position: relative;
}
#privilege #btn_privilege
{
	position: absolute;
}

/* コースアップキャンペーン限定特典　End */

/* よくあるご質問のアコーディオン　Start */
#faq .AcordionMenu
{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 800px;
}

#faq .Menu
{
    width: 100%;
    background-color: #fff;
}

#faq .Menu-Item
{
    margin: 0 auto 5px;
    width: 87%;
    background-color: #fff;
}

#faq .Menu-Item-Label
{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #515457;
	border: solid 3px #e85298;
    cursor: pointer;
	position: relative;
}

#faq .Menu-Item__Inner
{
    overflow: hidden;
    width: 100%;
    height: 0;
    transition: all 0.5s;
	text-align: justify;
}

#faq .Menu-Item-Content
{
    width: 87%;
    padding: 20px;
    background-color: #fff;
    line-height: 2;
    padding-left:1em;
	text-indent:-1em;
	color: #515457;
	margin: 0 auto;
	line-height: 1.5;
	letter-spacing: -0.2;
}

.Menu-Item-Content a
{
	text-decoration: underline;
}
#right
{
	text-align: right;
	width: 87%;
	color: #515457;
	margin: 0 auto;
}
.Menu-Item-Content .red
{
	color: #ff0000;
}
/* よくあるご質問のアコーディオン　End */

/* アコーディオンの開閉トグル設定　Start */
#faq .toggle
{
	display: none;
}
#faq .Label
{
	display: block;
	color: #515457;
	text-align: justify;
	letter-spacing: -0.4;
}
#faq .Label::before
{
	content:"";
	width: 10px;
    height: 10px;
    border-top: 2.5px solid #e85298;
    border-right: 2.5px solid #e85298;
	transform: rotate(135deg);
	position: absolute;
	top:calc(45% - 3px);
    left: 93%;
}
#faq.Label,#faq.Content
{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}
#faq .toggle:checked + .Label + .content 
{
	height: auto;
	padding:20px ;
	transition: all .3s;
}
#faq .toggle:checked + .Label::before 
{
	transform: rotate(-45deg) !important;
}
/* アコーディオンの開閉トグル設定　End */
#rules
{
	position: relative;
}
#rules .yoga_img
{
	position: absolute;
	top: 0;
	right: 0;
}

#catch_ttl
{
	position: absolute;
	bottom: 0;
}
/*モバイル用（0px 〜 834px） Start*/
@media (max-width: 834px)
{
    #contents
    {
        position: relative;
        width: 100%;
    }
	img
    {
        width: 100%;
		vertical-align: bottom;
    }
    #mv
    {
        position: relative;
    }
	#mvArea .content img
	{
		margin-top: -3px;
	}
	#btnMv
    {
     position: relative;
    }
    #btnMv #freefull_btn
    {
     position: absolute;
    top: 57%;
    left: 30px;
    width: 84%;
    }
    #btnContent .btn_move
    {
        display: block;
        position: absolute;
    	top: 13%;
    	left: 4%;
    	width: 95%;
	}
	
	#entryProcess
	{
   		margin-top: -24px;
		width: 100%;
	}
	#entryProcess h2
	{
		margin-bottom: 3rem;
	}
    #entryProcess img
    {
        width: 100%;
    }
	#step1 .title01,#step2 .title01,#step3 .title01
	{
		margin-bottom: 2rem;
	}

	/* コースアップキャンペーン限定特典　End */
	
	/* よくあるご質問　Start */
	#faq h2 
	{
		margin-bottom: 2rem;
	}
	/* よくあるご質問　End */
	
	/* よくあるご質問のアコーディオン　Start */
	#faq .Menu-Item-Label
	{
		font-size: 1.5rem;
	}
	#faq .Menu-Item-Label
	{
		padding: 12px 50px 12px 20px;
		position: relative;
	}
	#faq .Menu-Item-Content 
	{
		font-size: 1.5rem;
		padding: 10px;
	}
	#faq .AcordionMenu .Menu
	{
		margin-bottom: 4rem;
	}
	#faq .Label::before
	{
		
	}
	#right
	{
		font-size: 1.5rem;
	}
	/* よくあるご質問のアコーディオン　End */
	#rules .yoga_img
	{
		width: 13%;
    	top: -3.5%;
    	right: 1%;
	}
	
}
/*モバイル用（0px 〜 834px） End*/
/*PC用（835px 〜） Start*/
@media (min-width: 835px)
{
    #contents
    {
        width: 750px;
    }
	#mv
    {
		height: 648px;
    }
	#btnMv
    {
     	position: relative;
    }
    #btnMv #freefull_btn
    {
		position: absolute;
		top: 57%;
		left: 60px;
		width: 84%;
    }
    #btnContent .btn_move
    {
        display: block;
		position: absolute;
        top: 90px;
		left: 35px;
    }
	#entryProcess
    {
/*        margin-top: -400px;*/
    }
	#entryProcess h2
	{
		margin-bottom: 7rem;
	}
	#step1 .title01,#step2 .title01,#step3 .title01
	{
		margin-bottom: 64px;
	}
	
	/* よくあるご質問　Start */
	#faq h2 
	{
		margin-bottom: 4rem;
	}
	/* よくあるご質問　End */
	
	/* よくあるご質問のアコーディオン　Start */
	#faq .Menu-Item-Label,#faq .Menu-Item-Content 
	{
		font-size: 3rem;
	}
	#faq .Menu-Item-Label
	{
		padding: 25px 75px 25px 20px;
	}
	#faq .AcordionMenu .Menu
	{
		margin-bottom: 8rem;
	}
	#faq .Label
	{
		position: relative;
	}
	#faq .Label::before
	{
		
	}
	#rules .yoga_img
	{
		position: absolute;
		top: -3.6%;
		right: 2%;
	}
	#right
	{
		font-size: 3rem;
	}
	/* よくあるご質問のアコーディオン　End */
	
}
/*PC用（835px 〜） End*/
