@charset "utf-8";

/*--- reset */

html {
	overflow-y: scroll; 
	font-size: 62.5%;　/*フォントサイズを10pxに設定*/
}

body,
html {  
    height: 100%;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
textarea,
p,
figure,
blockquote {
	margin: 0;
	padding: 0;
}
	
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
	font-style: normal;}

table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size:100%;
}


caption {text-align: left;}

q:before,
q:after {
	content: '';}

object,
embed {vertical-align: top;}

h1,
h2,
h3,
h4,
h5,
h6 {font-size: 100%;}

img,
abbr,
acronym,
fieldset {border: 0;}

img{
	vertical-align: bottom;
	line-height: 0;
}

li {list-style-type: none;}
li img{vertical-align: bottom;}
p{
	text-justify: inter-ideograph;
}

a {color: #0a337f; text-decoration:none;}
a:hover{opacity:0.7;}
.underline{text-decoration:underline;}

/* clearfix */
.clear:before,
.clear:after {
    content: " ";
    display: table;
}

.clear:after {
    clear: both;
}

/*hr reset*/
hr {
	border: 0;
	height: 0;
	margin: 0;
	padding: 0;
}
.hr01{
	border-bottom:1px #ddd solid;
}

/*font*/
.fp-marker {
	background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #f9e4f5 0%) repeat scroll 0 0;
}
.fb-marker {
	background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #dbdfef 0%) repeat scroll 0 0;
}
.f-center{ text-align:center;}
.f-bold{ font-weight: 800;}
.f-sbold{font-weight: 600;}
.f-normal{font-weight: 400;}

.f-gothic{font-family: 'Noto Sans Japanese', sans-serif;}

.f-letter{letter-spacing: -0.1rem;}
.f-lineheight{line-height: 1.4;}

.fs-14{font-size: 1.4rem;}
.fs-18{font-size: 1.8rem;}
.fs-20{font-size: 2rem;}
.fs-24{font-size: 2.4rem;}
.fs-28{font-size: 2.8rem;}
.fs-30{font-size: 3rem;}
.fs-50{font-size: 5rem;}
.fs-66{font-size: 6.6rem;}
.fs-80{font-size: 8rem;}

.fc-blue{color: #5856ac;}
.fc-purple{color: #a949aa;}
.fc-pink{color: #da577c;}

/*flex*/
.flex-bt, .flex-center, .flex-stand{
	display: -webkit-flex;
    display: flex; 	
}
.flex-bt{
	-webkit-justify-content: space-between;
    justify-content: space-between;
}
.flex-center{
	-webkit-justify-content:center;
    justify-content:center;
}
.flex-stand{
	-webkit-justify-content:start;
    justify-content:start;
}
.flex-chuo{align-items: center;}
.flex-wrap{flex-wrap: wrap;}
.flex-order1{order:1;}
.flex-order2{order:2;}

/*margin*/
.mb20{margin: 0 0 2rem 0;}
.mb40{margin: 0 0 4rem 0;}
.mb60{margin: 0 0 6rem 0;}
.mb80{margin: 0 0 8rem 0;}
.mr40{margin: 0 4rem 0 0;}

/*padding*/
.pd40{padding: 4rem;}/*40px*/
.ptb120{padding: 12rem 0;}/*120px*/
.pt100{padding: 10rem 0 0 0;}
.pt120{padding: 12rem 0 0 0;}

/*img*/
.img-auto{
	width:100%;
	height:auto;
}

/*animation*/
.animated{}
.aniBox{overflow:hidden;}
.invisible {
	transition: opacity 0.5s ease;
	opacity: 0.0;
}
.visible {
	transition: opacity 0.5s ease;
	opacity: 1.0;
}
.fadein {
    opacity : 0;
    transform : translate(0, 50px);
    transition : all 100ms;
}
.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
}
.fade {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}
.css-animate-fade{
	width:100%;
	height:200px;
	background:#F99;
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

/*iphone reset*/
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}

/*====================================
 default 
====================================*/
body {
	background: #fff;
	color: #000;
	font-family: 	YuMincho, 'Yu Mincho', serif;
	font-size:1.8em ; /*bodyの指示はemに。chromeバグ対策 16px*/
	font-weight:200;
	line-height: 2;
	text-align: left;
}
#wrap{
	position:relative;
	height:auto;
}
#wrap:before {
    content: "";
    display: block;
}
.contents{
	width:1120px; /*コンテンツの幅指定*/
	margin:0 auto;
	position:relative;
}
.align-c{
	align-items: center;
}

@media screen and (min-width: 1025px) {
	.pc-none{
		display:none;
	}
	a[href^="tel:"] {
		pointer-events: none;
	}
}
@media screen and (min-width: 769px) {
	.tab-none{
		display: none;
	}
}
@media screen and (max-width: 768px) {
}


/*====================================
 header
====================================*/
header {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1000;
	background:rgba(0, 0, 0, 0);
}
header section{
	width: 96%;
	margin: 4rem 2%;
}
/*====================================
 midashi
====================================*/
.ttl-en{
	font-size: 3rem;
	margin: 0 0 1rem 0;
	color: #a949aa;
	font-family: 'Parisienne', cursive;
	transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
}
/*H2*/
h2{
	font-size:4rem; /*40px*/
	line-height:1.3;
	text-align:center;
	font-weight: 400;
}
h3, h4{
	line-height: 1.3;
	font-weight: 400;
}
.arrow_box {
	display: inline-block;
	position: relative;
	border-bottom: 1px solid #000;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	line-height:0.1;
	padding: 0 2rem 4rem 2rem;
}
.arrow_box:after, .arrow_box:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.arrow_box:after {
	border-color: rgba(136, 183, 213, 0);
	border-top-color: #fff;
	border-width: 15px;
	margin-left: -15px;
}
.arrow_box:before {
	border-color: rgba(0, 0, 0, 0);
	border-top-color: #000;
	border-width: 16px;
	margin-left: -16px;
}
.arrow_box h2{
	font-size: 4rem;
	line-height: 0.1;
}

/*====================================
 contents
====================================*/
/*main*/
@media screen and (min-width: 1025px) {
	.main{
		background:url(https://ymcschool.jp/lp/yoga03_b/images/main-bg.jpg) no-repeat center center;
		background-size: cover;
		position:relative;
		animation: fadeIn 3s ease 0s 1 normal;
		-webkit-animation: fadeIn 3s ease 0s 1 normal;
		height:900px;
	}
	.main .contents{
		width: 90%;
	}
	.main ul{
		margin: 140px 0 40px 0;
		display: inline-block;
	}
	.main h2{
		font-size: 9rem;
		line-height: 1.2;
		font-weight: 600;
		text-align: left;
		color: #a949aa;
	}
	.main h3{
		font-size: 3rem;
	}
}

/*license*/
.license .bg-left{
	background: linear-gradient(to left, #ffffff 0%,#ffffff 65%,#fcf7fb 65%, #fcf7fb 100%);
	padding: 12rem 0;
	position: relative;
}
@media screen and (min-width: 769px) {
}
.license .bg-left::after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
	right:0;
    bottom: 0rem;
	background: url("https://ymcschool.jp/lp/yoga03_b/images/license-bg.png") right bottom no-repeat;
}
.license{
	width: 100%;
}
.license .txt{
	margin: 0 18vw 0 0;
}
.license .txt figure{
	width: 55%;
}
@media screen and (min-width: 1025px) {
	.license .txt{
		margin: 0 8vw 0 0;
	}
}

.license .txt-box{
	padding: 0 0 0 4rem;
	width: calc(45% - 4rem);
}
.license h2{
	text-align: left;
}
.license .cate{
	font-size: 2.4rem;
	padding: 0 1rem;
	margin: 0 0 1rem 0;
	color: #fff;
	background: #a949aa;
	display: inline-block;
}

/*mask*/
.mask-block{
	background: #f7f8f2;
}
.mask h2{
	font-size: 3rem;
}
.mask dl{
	padding: 4rem 2rem;
	background: #fff;
	border-right: 2px solid #ccc;
	border-bottom: 2px solid #ccc;
	box-sizing: border-box;
	width: 32%;
}
.mask dt figure{
	margin: 0 0 2rem 0;
}
.mask dt{
	font-size: 2.4rem;
	line-height: 1.4;
	margin: 0 0 2rem 0;
	color: #a949aa;
	text-align: center;
	font-weight: 600;
}
.mask dd{
	font-size: 1.6rem;
	text-indent: -1rem;
	padding: 0 0 0 1rem;
}
.mask dd .circle{
	font-size: 1rem;
	color: #a949aa;
}

/*fuan*/
.fuan{
	background: url("https://ymcschool.jp/lp/yoga03_b/images/fuan-bg.jpg") repeat;
}
.fuan li{
	width: 32%;
	line-height: 1.4;
	text-align: center;
}
.fuan li:nth-child(even){
	margin: 2rem 0 0 0;
}

/*.alright */
.bg-left{
	background: linear-gradient(to left, #ffffff 0%,#ffffff 55%,#fcf7fb 55%, #fcf7fb 100%);
	padding: 4rem 0;
}
.bg-right{
	background: linear-gradient(to right, #ffffff 0%,#ffffff 55%,#fcf7fb 55%, #fcf7fb 100%);
	padding: 4rem 0;
}
.message .bg-left{
	background: linear-gradient(to left, #ffffff 0%,#ffffff 25%,#fcf7fb 25%, #fcf7fb 100%);
}
.message .bg-right{
	background: linear-gradient(to right, #ffffff 0%,#ffffff 25%,#fcf7fb 25%, #fcf7fb 100%);
}
.alright figure{
	width: 50%;
}
.alright dl{
	width: 46%;
}
.alright dt{
	font-size: 3.6rem;
	margin: 0 0 3rem 0;
	padding: 0 0 3rem 0;
	line-height: 1.4;
	font-weight: 400;
	border-bottom: 1px dotted #000;
}
.alright dt .en{
	font-size: 4.8rem;
	margin: 0 0 4rem -4rem;
	color: #a949aa;
	display: block;
	font-family: 'Parisienne', cursive;
	transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
}
.alright .contents{
	position: relative;
}

@media screen and (min-width: 1025px) {
	.alright .alright01::after {
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left: -120px;
		bottom: -60px;
		background: url("https://ymcschool.jp/lp/yoga03_b/images/alright-bg01.png") left bottom no-repeat;
		background-size: 100px 100px;
	}
	.alright .alright02::after {
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		right:-94px;
		bottom: -70px;
		background: url("https://ymcschool.jp/lp/yoga03_b/images/alright-bg02.png") right bottom no-repeat;
		background-size: 94px 140px;
	}
	.alright .alright03::after {
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left:-234px;
		bottom: -100px;
		background: url("https://ymcschool.jp/lp/yoga03_b/images/alright-bg03.png") left bottom no-repeat;
		background-size: 234px 162px;
	}

}

.message figure{
	position: relative;
	-webkit-box-shadow: #ccc 0px 0px 10px;
	-moz-box-shadow: #ccc 0px 0px 10px;
	box-shadow: #ccc 0px 0px 10px;
}
.message figure .name{
	padding:0  1rem;
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	background: #554e3a;
}
.message dl{
	width: 68%;
}
.message dt{
	font-size: 3rem;
	padding: 0 0 2rem 0;
	margin: 0 0 2rem 0;
	color: #a949aa;
	border-bottom: 1px dotted #000;
}
/*teacher*/
.teacher{
	background: #f7f8f2;
}
@media screen and (min-width: 769px) {
	.teacher .contents{
		width: 90%;
	}
}
.teacher-data{
	padding: 2rem;
	background: #fff;
	border-right: 2px solid #ccc;
	border-bottom: 2px solid #ccc;
	box-sizing: border-box;
	width: 24%;
	font-family: 'Noto Sans Japanese', sans-serif;
}

.teacher p{
	font-weight: 600;
	background: #ccc;
	text-align: center;
	color: #fff;
	margin: 0 0 2rem 0;
}
.teacher h3{
	margin: 2rem 0;
	font-size: 2.4rem;
	text-align: center;
	font-family: 	YuMincho, 'Yu Mincho', serif;
}
.teacher h3 .en{
	margin: 0 0 0 1rem;
	font-size: 1.2rem;
	font-family: 'Noto Sans Japanese', sans-serif;
}

.teacher-data ul{
	padding: 1rem;
	border:1px dashed #333;
}
.teacher li{
	font-size: 1.4rem;
	letter-spacing: -0.05rem;
}
.teacher .secon{text-indent: 1.4rem;}
.teacher .third{text-indent: 2.8rem;}
.teacher .otsuka p{
	background-image: linear-gradient(120deg, #bc68bd 0%, #8c2f8d 100%);
}
.teacher .sato p{
	background-image: linear-gradient(120deg, #7775be 0%, #3b3a90 100%);
}
.teacher .matsuo p{
	background-image: linear-gradient(120deg, #e37697 0%, #ca3b5d 100%);
}
.teacher .kubota p{
	background-image: linear-gradient(120deg, #8e6785 0%, #532f4a 100%);
}

/*media*/
.media{
	background: #fff;
}
.media p{
	margin: 2rem 0 0 0;
}
.media img{
	width: 100%;
	height: auto;
}

/*suppor-point*/
.support{
	background:#f7f8f2;
	position: relative;
}
.support:before{
	content: '';
	position: absolute;
	top: 0;
    width: 100%;
    height: 440px;
    background: url(https://ymcschool.jp/lp/yoga03_b/images/support-bg.jpg) center top / cover no-repeat fixed;
    background-size: cover;
	
}
.suppor-point{
	padding: 4rem 4rem 0 4rem;
	background: #fff;
	-webkit-box-shadow: #ccc 0px 0px 10px;
	-moz-box-shadow: #ccc 0px 0px 10px;
	box-shadow: #ccc 0px 0px 10px;
}
.suppor-point h3{
	color: #fff;
	font-size: 3rem;
	background: #724868;
	padding: 0.5rem 1rem;
}
.suppor-point li{
	border-bottom: 1px dotted #000;
	padding: 0 0 2rem 0;
}
.suppor-point li:last-child{
	border-bottom:none;
	padding: 0;
}
.suppor-point dl{
	margin: 0 0 0 4rem;
}
.suppor-point dt{
	font-size: 2.4rem;
	margin: 0 0 1rem 0;
}
.suppor-point .job{
	border:5px solid #eee;
	box-sizing: border-box;
	padding: 2rem;
}
.suppor-point .job p{
	background: #f5f5f5;
	padding: 1rem;
	text-align: center;
}
.suppor-point .audition p{
	font-size: 3rem;
	line-height: 1.4;
	color: #794979;
	text-align: center;
}

/*case*/
.case li{
	width: calc(100% - 8rem);
	padding: 4rem;
	line-height: 1.4;
}
.case h3{
	margin: -6rem 0 4rem 0;
	font-size: 3rem;
	text-align: center;	
}
.case h3 .cate{
	padding: 0 1rem;
	color: #fff;
}
.case li p{
	font-size: 1.8rem;
	padding: 2rem;
	margin: 0 0 0 4rem;
	width: calc( 54% - 4rem);
	background: #fff;
}
.case .course{
	padding: 4rem;
	background: #fff;
	-webkit-box-shadow: #ccc 0px 0px 10px;
	-moz-box-shadow: #ccc 0px 0px 10px;
	box-shadow: #ccc 0px 0px 10px;
}
.case h4{
	text-align: center;
	font-size: 3rem;
}
.case .course dl{
	padding: 4rem;
	background: #f7f8f2;
}
.case .course dt{
	font-size: 2.4rem;
}
.case .course .price{
	font-size: 1.4rem;
	padding:0  1rem;
	margin: 1rem 0;
	color: #fff;	
	display: inline-block;
}
.case li:nth-child(1){
	background: url("https://ymcschool.jp/lp/yoga03_b/images/case-bg1.jpg") repeat;
}
.case li:nth-child(1) h3 .cate,
.case li:nth-child(1) .course .price{
	background: #da577c;
}
.case li:nth-child(1) .course dt{
	color: #da577c;
}

.case li:nth-child(2){
	background: url("https://ymcschool.jp/lp/yoga03_b/images/case-bg2.jpg") repeat;
}
.case li:nth-child(2) h3 .cate, 
.case li:nth-child(2) .course .price{
	background: #5856ac;
}
.case li:nth-child(2) .course dt{
	color: #5856ac;
}

/*voice*/
.voice{
	background: #f7f8f2;
}
.voice li{
	margin: 0 0 4rem 0;
}
.voice li p {
	width: calc(85% - 4rem);
	padding: 2rem;
	display: inline-block;
	position: relative;
	background: #fff;
	border-radius: 8px;
	border-bottom: 2px solid #ddd;
}
.voice li p:after {
	top: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.voice li p:after {
	border-color: rgba(255, 255, 255, 0);
	border-width: 10px;
	margin-top: -10px;
}
.voice li:nth-child(odd) p{
	margin: 0 0 0 2rem;
	border-right: 2px solid #ddd;
}
.voice li:nth-child(odd) p:after {
	right: 100%;
}
.voice li:nth-child(odd) p:after {
	border-right-color: #fff;
}
.voice li:nth-child(even) p{
	margin: 0 2rem 0 0;
	border-left: 2px solid #ddd;
}
.voice li:nth-child(even) p:after {
	left: 100%;
}
.voice li:nth-child(even) p:after {
	border-left-color: #fff;
}

/*school*/
.school {
    width: 100%;
    height: 320px;
    background: url(https://ymcschool.jp/lp/yoga03_b/images/school-img.jpg) center top / cover no-repeat ;
    background-size: cover;
	
}
.school-data{
	width: 48%;
	margin: 0 0 4rem 0;
	font-family: 'Noto Sans Japanese', sans-serif;
}
.school-data:nth-child(1){
	margin: 0 4% 4rem 0;
}
.school-data dl{
	width: 48%;
}
.school-data dt{
	font-size: 2.4rem;
	font-weight: 600;
	margin: 0 0 1rem 0;
	position: relative;
}
.school-data dt:before{
	content: '－';
	color: #a949aa;
}
.school-data dd{
	font-size: 1.6rem;
	background: #f7f8f2;
	padding: 2rem;
}
.school-data iframe{
	width:100%;
	height:240px;
	border:none;
}
.school-data th{
	padding: 0 2rem 0 0;
	width:20%;
	border-right: 1px solid #ddd;
	vertical-align: top;
}
.school-data td{
	padding: 0 2rem;
}
.btn01 {
	width:70%;
	margin:0 auto;
    background-image: linear-gradient(120deg, #bc68bd 0%, #8c2f8d 100%);
}
.btn01 a {
    display:block;
    padding:2rem;
    color:#FFF;
	font-weight: 600;
    line-height:1.4;
    text-align:center;
}
.btn01 a:after{
    background: url(https://ymcschool.jp/lp/yoga03_b/images/btn-icon-arroww.png) 0 0 no-repeat;
    -webkit-background-size:16px 16px;
    content:"";
    display:inline-block;
    width:16px;
    height:16px;
	margin: 0 0 0 1rem;
	position:relative;
	top:2px;
}


/*cv*/
.cv{
	background: #a949aa;
	padding: 4rem 0;
}
.cv li{
	width: 35%;
	background: linear-gradient(to bottom, #ffffff 0%,#ffffff 50%,#f2f2f2 50%, #f2f2f2 100%);
	box-sizing: border-box;
	border-right: 3px solid #832e84;
	border-bottom: 3px solid #832e84;
	margin: 0 2rem 0 0;
}
.cv li  a {
    display:block;
    padding:3rem;
	font-size: 3.2rem;
	font-weight: 400;
    line-height:3.2rem;
    text-align:center;
    color:#000;
}

.cv li a:before{
    content:"";
    display:inline-block;
	margin: -10px 1rem 0 0;
	position:relative;
	width:42px;
    height:42px;
	top: 10px;
}
.cv li:nth-child(1) a:before{
    background: url(https://ymcschool.jp/lp/yoga03_b/images/btn-icon-shiryo.png) 0 0 no-repeat;
	background-size: cover;
}
.cv li:nth-child(2) a:before{
    background: url(https://ymcschool.jp/lp/yoga03_b/images/btn-icon-taiken.png) 0 0 no-repeat;
    background-size: cover;
}
.cv li a:after{
    content:"";
    display:inline-block;
    width:20px;
    height:20px;
	margin: 0 0 0 1rem;
	position:relative;
	top: -2px;
    background: url(https://ymcschool.jp/lp/yoga03_b/images/btn-icon-arrowP.png) 0 top no-repeat;
    -webkit-background-size:20px 20px;
}



/*====================================
 FOOTER
====================================*/
footer {
	padding: 2rem 0;
	background:#554e3a;
	color:#fff;
}

footer .copy{
	font-size: 1.4rem;
	text-align:center;
}

/*pagescroll*/
#scrollUp {
    bottom:0;
    right: 0;
	opacity:0.9;
}