@charset "utf-8";


/* 共通
----------------------------------------------------------------------------------*/

@media print,screen and (min-width: 737px) { /* PCのみの設定 */
#yogalesson,#oterayoga,#yogaschool,#yogaschool,#fasting,#yogainstructors,#company{}
#yogalesson .mainImg,#oterayoga .mainImg,#yogaschool .mainImg,#yogaschool .mainImg,#fasting .mainImg,#yogainstructors .mainImg,#company .mainImg{ width:100%; height:156px; margin:0 auto 40px;
overflow: hidden; text-indent: 100%; white-space: nowrap;}

.tit{ position:relative; font-weight:800 ; 
display:inline-block; /display:inline; /zoom:1; vertical-align:middle;}
.tit:before{ content:""; background:url(../img/introPh01.png) no-repeat; background-size:100% auto; width:100%; height:0; padding-top:76.29%; display:block; position:absolute; right:calc(100% + 4%);}

.price{ font-size:18px; position:relative;
display:inline-block; /display:inline; /zoom:1; vertical-align:top;}
.price,.price i{ font-weight:600;}
i{ font-style:normal; font-size:80%;}

.grdLine{ position:relative; padding:0 5px;}
.grdLine:after{ content:""; position:absolute; top:calc(100% ); width:100%; height:5px; left:0; right:0; margin:auto;
background: -webkit-linear-gradient(0deg, rgba(238,177,219,1), rgba(239,217,148,1));}


ul.ph{ }
ul.ph li{ width:48%; margin-right:4%;}
ul.ph li img{ overflow:hidden;
-moz-border-radius:12px; -webkit-border-radius:12px;border-radius:12px;}
.baloon{ font-size:16px; font-weight:600; color:#fff; position:relative; padding:2px 30px; margin-bottom:32px; text-align:center;
display:inline-block; /display:inline; /zoom:1;
background: -webkit-linear-gradient(0deg, rgba(238,177,219,1), rgba(239,217,148,1));
-moz-border-radius:30px; -webkit-border-radius:30px;border-radius:30px;}
.baloon:after{ content:""; position:absolute; top:100%; left:0; right:0; margin:auto; display:block; height:12px; width:15px;
background: linear-gradient(to top right, rgba(255,255,255,0) 50%, #eec5b8 50.5%) no-repeat top left/50% 100%, 
linear-gradient(to top left, rgba(255,255,255,0) 50%, #efc6b6 50.5%) no-repeat top right/50% 100%;}
ul.check{}
ul.check li{ background:url(../img/cmn_img/iconCheck.png) no-repeat left center; font-size:21px; font-weight:600; padding-left:36px; margin-right:40px; letter-spacing:0.0em;}
.title{ font-size:30px; font-weight:800; line-height:1.6; margin:0 auto 30px;
display:inline-block; /display:inline; /zoom:1;}

ol.dot{}
ol.dot li{ padding-left:20px; background:url(../img/cmn_img/iconDot.png) no-repeat left center; background-size:14px 14px; font-size:16px; font-weight:500;}
}


@media screen and (max-width: 736px) { /* スマホのみの設定 */
#yogalesson,#oterayoga,#yogaschool,#yogaschool,#fasting,#yogainstructors,#company{}
#yogalesson .mainImg,#oterayoga .mainImg,#yogaschool .mainImg,#yogaschool .mainImg,#fasting .mainImg,#yogainstructors .mainImg,#company .mainImg{ width:100%; height:0; padding-top:39.06%; margin:0 auto 20px; background-size:100% auto !important;
overflow: hidden; text-indent: 100%; white-space: nowrap;}

.tit{ position:relative; font-weight:800 ; 
display:inline-block; /display:inline; /zoom:1; vertical-align:middle;}
.tit:before{ content:""; background:url(../img/introPh01.png) no-repeat; background-size:100% auto; width:100%; height:0; display:block; position:absolute; left:0; right:0; margin:auto; bottom:calc(100% - 20px);}

.price{ font-size:18px; position:relative;
display:inline-block; /display:inline; /zoom:1; vertical-align:top;}
.price,.price i{ font-weight:600;}
i{ font-style:normal; font-size:80%;}

.grdLine{ position:relative; padding:0 0px 6px;}
.grdLine:after{ content:""; position:absolute; top:calc(100% ); width:100%; height:5px; left:0; right:0; margin:auto;
background: -webkit-linear-gradient(0deg, rgba(238,177,219,1), rgba(239,217,148,1));}


ul.ph{ width:90%; margin:0 auto;}
ul.ph li{ display:block; margin-bottom:20px;}
ul.ph li img{ overflow:hidden;
-moz-border-radius:12px; -webkit-border-radius:12px;border-radius:12px;}
.baloon{ font-size:16px; font-weight:600; color:#fff; position:relative; padding:2px 30px; margin:0 auto 24px; text-align:center; display:block; width:100%; box-sizing:border-box;
background: -webkit-linear-gradient(0deg, rgba(238,177,219,1), rgba(239,217,148,1));
-moz-border-radius:30px; -webkit-border-radius:30px;border-radius:30px;}
.baloon:after{ content:""; position:absolute; top:100%; left:0; right:0; margin:auto; display:block; height:12px; width:15px;
background: linear-gradient(to top right, rgba(255,255,255,0) 50%, #eec5b8 50.5%) no-repeat top left/50% 100%, 
linear-gradient(to top left, rgba(255,255,255,0) 50%, #efc6b6 50.5%) no-repeat top right/50% 100%;}
.recommend{ width:90%; margin:auto;}
ul.check{ width:100%; margin:auto; text-align:left;}
ul.check li{ background:url(../img/cmn_img/iconCheck.png) no-repeat left top 4px; font-size:16px; font-weight:600; padding-left:26px; letter-spacing:0.0em; background-size:auto 16px; display:block; margin-bottom:6px;}
.title{ font-size:21px; font-weight:800; line-height:1.6; margin:0 auto 20px;
display:inline-block; /display:inline; /zoom:1;}

ol.dot{}
ol.dot li{ padding-left:20px; background:url(../img/cmn_img/iconDot.png) no-repeat left center; background-size:14px 14px; font-size:16px; font-weight:500;}
}



/* 会社概要
----------------------------------------------------------------------------------*/

@media print,screen and (min-width: 737px) { /* PCのみの設定 */
#company{}
#company .mainImg{ background: url(../img/companyMainimg.jpg) no-repeat top center;}
#company h1 + p{ font-size:16px; margin:0 auto 40px;}
#company .companyList{ width:820px; margin:0 auto 100px !important;}
#company .companyList table{ width:100%;}
#company .companyList table td{ text-align:left; padding:10px 10px; box-sizing:border-box;}
#company .companyList table tr{ border-bottom:1px dotted rgba(0,0,0,0.2);}
#company .companyList table td:first-child{ width:180px; padding-left:20px; background:url(../img/cmn_img/iconDot.png) no-repeat left center; background-size:14px 14px; vertical-align:middle;}
}


@media screen and (max-width: 736px) { /* スマホのみの設定 */
#company{}
#company .mainImg{ background: url(../img/companyMainimgSp.jpg) no-repeat top center;}
#company h1 + p{ margin:0 auto 30px; width:90%;}
#company .companyList{ width:90%; margin:0 auto 60px !important;}
#company .companyList table{ width:100%;}
#company .companyList table td{ text-align:left; padding:10px 0px; box-sizing:border-box;
display:block;}
#company .companyList table tr{ border-bottom:1px dotted rgba(0,0,0,0.2);}
#company .companyList table td:first-child{ padding-left:20px; background:url(../img/cmn_img/iconDot.png) no-repeat left top 15px; background-size:14px 14px; vertical-align:middle; padding-bottom:0; }
}


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

@media print,screen and (min-width: 737px) { /* PCのみの設定 */
#yogainstructors{}
#yogainstructors .mainImg{ background: url(../img/yogainstructorsMainimg.jpg) no-repeat top center;}
#yogainstructors h1 + p{ font-size:16px; margin:0 auto 40px;}

#yogainstructors .instructor{ position:relative; margin:0 auto 40px !important; padding-bottom:60px; overflow:hidden;}
#yogainstructors .instructor:after{ content:""; background:url(../img/cmn_img/sdw.png) no-repeat; background-size:100% 100%; width:80%; height:10px; display:block; opacity:0.8;
position:absolute; top:calc(100% - 10px); left:0; right:0; margin:auto;}
#yogainstructors .instructor:nth-last-of-type(1){ padding-bottom:0;}
#yogainstructors .instructor:nth-last-of-type(1):after{ content:none !important;}
#yogainstructors .instructor .ph{ width:240px; height:240px; overflow:hidden; float:left;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%;}
#yogainstructors .profile{ width:calc(100% - 265px); float:right; text-align:left; overflow:hidden; padding-top:10px;}
#yogainstructors .profile h2{ font-size:24px; font-weight:600; line-height:1.6;}
#yogainstructors .profile h2 span{ font-weight:600 !important; margin-left:10px;}
/*#yogainstructors .profile h2 ruby{ margin-left:10px;}
#yogainstructors .profile h2 ruby rt{ font-size:11px; line-height:1.6;}
#yogainstructors .profile h2 ruby rt,#yogainstructors .profile h2 ruby rp{ display:none;}*/
[data-ruby]{ position:relative;}
[data-ruby]::before{ content: attr(data-ruby); position:absolute; left:0; right:0; margin:auto; font-size:11px; line-height:1.6; display:block; top:-15px; letter-spacing:0.25em;
color: #d7458c; font-family: 'Noto Serif SC', serif; text-align:center;
background: -webkit-linear-gradient(0deg, rgba(225,124,193,1), rgba(235,196,77,1));
-webkit-background-clip: text; 
-webkit-text-fill-color: transparent;}

#yogainstructors .profile h2 + p{ font-size:16px; font-weight:600; padding-left:20px;}
#yogainstructors .profile h2/*,#yogainstructors .profile h2 ruby*/,#yogainstructors .profile h2 + p{ display:inline-block; /display:inline; /zoom:1; vertical-align: text-bottom;}
#yogainstructors .profile .textWrap{ overflow:hidden; border-top:1px dotted rgba(0,0,0,0.2); padding-top:15px; margin:5px auto 0;}
#yogainstructors .profile .especialtyYoga{ width:220px; float:left; margin-top:5px; }
#yogainstructors .profile .especialtyYoga .baloon{ width:100%; box-sizing:border-box; margin:0 auto 20px;}
#yogainstructors .profile .especialtyYoga p,#yogainstructors .profile .especialtyYoga ul li{ font-size:13px; line-height:1.6; letter-spacing:0;}
#yogainstructors .profile .especialtyYoga p,#yogainstructors .profile .especialtyYoga ul{ padding:10px 10px;
-moz-border-radius:6px; -webkit-border-radius:6px;border-radius:6px;
background: -webkit-linear-gradient(0deg, rgba(238,177,219,0.2), rgba(239,217,148,0.2));}
#yogainstructors .profile .especialtyYoga ul li{ display:list-item; list-style-type:disc; margin-left:15px;}
#yogainstructors .profile .text{ float:right; width:calc(100% - 245px); }
#yogainstructors .profile .text p{ line-height:1.8; letter-spacing:0.025em;}
#yogainstructors .profile .text ul.link{ margin-top:15px;}
#yogainstructors .profile .text ul.link li{ margin-right:30px; font-size:13px;
display:inline-block; /display:inline; /zoom:1; vertical-align:top;}
#yogainstructors .profile .text ul.link li:before{ margin-right:10px;
display:inline-block; /display:inline; /zoom:1; vertical-align: middle;}
#yogainstructors .profile .text ul.link li.web:before{ content:"WEB";}
#yogainstructors .profile .text ul.link li.insta:before{ content:""; background:url(../img/cmn_img/iconInsta.png) no-repeat; background-size:contain; width:16px; height:16px;}
#yogainstructors .profile .text ul.link li.blog:before{ content:"BLOG";}
#yogainstructors .profile .text ul.link li.web:before,#yogainstructors .profile .text ul.link li.blog:before{ font-size:10px; padding:4px 2px 2px; border-bottom:1px dotted rgba(0,0,0,0.2);}
}


@media screen and (max-width: 736px) { /* スマホのみの設定 */
#yogainstructors{}
#yogainstructors .mainImg{ background: url(../img/yogainstructorsMainimgSp.jpg) no-repeat top center;}
#yogainstructors h1 + p{ margin:0 auto 20px; width:90%; text-align:left;}

#yogainstructors .instructor{ position:relative; margin:0 auto 36px !important; padding-bottom:60px; overflow:hidden; width:90%;}
#yogainstructors .instructor:after{ content:""; background:url(../img/cmn_img/sdw.png) no-repeat; background-size:100% 100%; width:100%; height:10px; display:block; opacity:0.8;
position:absolute; top:calc(100% - 18px); left:0; right:0; margin:auto;}
#yogainstructors .instructor:nth-last-of-type(1){ padding-bottom:0;}
#yogainstructors .instructor:nth-last-of-type(1):after{ content:none !important;}
#yogainstructors .instructor .ph{ width:220px; height:220px; overflow:hidden; display:block;
 margin:0 auto 20px;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%;}
#yogainstructors .profile{ width:100%; text-align:left;}
#yogainstructors .profile h2{ font-size:24px; font-weight:600; text-align:center;}
#yogainstructors .profile h2 span{ font-weight:600 !important; margin-left:10px;}
/*#yogainstructors .profile h2 ruby{}
#yogainstructors .profile h2 ruby rt{ font-size:11px; line-height:1.6;}*/
[data-ruby]{ position:relative;}
[data-ruby]::before{ content: attr(data-ruby); position:absolute; left:0; right:0; margin:auto; font-size:11px; line-height:1.6; display:block; top:-15px; letter-spacing:0.25em;
color: #d7458c; font-family: 'Noto Serif SC', serif; text-align:center;
background: -webkit-linear-gradient(0deg, rgba(225,124,193,1), rgba(235,196,77,1));
-webkit-background-clip: text; 
-webkit-text-fill-color: transparent;}

#yogainstructors .profile h2 + p{ font-size:16px; font-weight:600; text-align:center;}
#yogainstructors .profile h2/*,#yogainstructors .profile h2 ruby*/,#yogainstructors .profile h2 + p{ display:block;}
#yogainstructors .profile .textWrap{ border-top:1px dotted rgba(0,0,0,0.2); padding-top:20px; margin:15px auto 0;}
#yogainstructors .profile .especialtyYoga{ margin:5px auto 20px; }
#yogainstructors .profile .especialtyYoga .baloon{ width:100%; box-sizing:border-box; margin:0 auto 20px;}
#yogainstructors .profile .especialtyYoga p,#yogainstructors .profile .especialtyYoga ul li{ font-size:14px; }
#yogainstructors .profile .especialtyYoga p,#yogainstructors .profile .especialtyYoga ul{ padding:15px 15px;
-moz-border-radius:6px; -webkit-border-radius:6px;border-radius:6px;
background: -webkit-linear-gradient(0deg, rgba(238,177,219,0.2), rgba(239,217,148,0.2));}
#yogainstructors .profile .especialtyYoga ul li{ display:list-item; list-style-type:disc; margin-left:20px;}
#yogainstructors .profile .text{ width:100%; }
#yogainstructors .profile .text p{ line-height:1.8; letter-spacing:0.025em;}
#yogainstructors .profile .text ul.link{ margin-top:20px;}
#yogainstructors .profile .text ul.link li{ margin-bottom:6px; font-size:13px;
display:inline-block; /display:inline; /zoom:1; vertical-align:top;}
#yogainstructors .profile .text ul.link li:before{ margin-right:10px; width:30px;
display:inline-block; /display:inline; /zoom:1; vertical-align: middle;}
#yogainstructors .profile .text ul.link li.web:before{ content:"WEB";}
#yogainstructors .profile .text ul.link li.insta:before{ content:""; background:url(../img/cmn_img/iconInsta.png) no-repeat center; background-size:16px 16px; height:16px;}
#yogainstructors .profile .text ul.link li.blog:before{ content:"BLOG";}
#yogainstructors .profile .text ul.link li.web:before,#yogainstructors .profile .text ul.link li.blog:before{ font-size:10px; padding:4px 2px 2px; border-bottom:1px dotted rgba(0,0,0,0.2);}
}



/* ファスティング
----------------------------------------------------------------------------------*/
@media print,screen and (min-width: 737px) { /* PCのみの設定 */
#fasting{}
#fasting .mainImg{ background: url(../img/fastingMainimg.jpg) no-repeat top center;}
#fasting .title + p{ margin:0 auto 40px;}
#fasting .intro{ position:relative;}
#fasting .ph{ position:absolute; top:0; left:0; width:100%;}
#fasting .ph li{ width:222px; height:222px; position:absolute;}
#fasting .ph li img{ overflow:hidden;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%;}
#fasting .ph li:nth-of-type(1){ top:0px; left:0;}
#fasting .ph li:nth-of-type(2){ top:40px; right:0;}
#fasting .recommend{ margin:0 auto 50px !important;}
#fasting .baloon2{ font-size:18px; font-weight:600; background:#fff7fc; border:3px solid #d7458c; padding:15px 36px; position:relative; margin:0 auto 50px;
-moz-border-radius:10px; -webkit-border-radius:10px;border-radius:10px;
display:inline-block; /display:inline; /zoom:1;}
#fasting .baloon2:before{ height:17px; width:17px; z-index:1;
background: linear-gradient(to top right, rgba(255,255,255,0) 50%, #fff7fc 50.5%) no-repeat top left/50% 100%, 
linear-gradient(to top left, rgba(255,255,255,0) 50%, #fff7fc 50.5%) no-repeat top right/50% 100%;}
#fasting .baloon2:after{ height:23px; width:23px; z-index:0;
background: linear-gradient(to top right, rgba(255,255,255,0) 50%, #d7458c 50.5%) no-repeat top left/50% 100%, 
linear-gradient(to top left, rgba(255,255,255,0) 50%, #d7458c 50.5%) no-repeat top right/50% 100%;}
#fasting .baloon2:before,
#fasting .baloon2:after{ content:""; position:absolute; top:100%; left:0; right:0; margin:auto; display:block; }
#fasting .cource h2{ font-size:24px; font-weight:600; margin:0 auto 50px;
display:inline-block; /display:inline; /zoom:1; }
#fasting .cource h2 strong{ color:#d7458c;}
#fasting .cource h2,#fasting .cource h2 strong{ font-weight:600;}
#fasting .cource ul{ margin:0 auto 60px;}
#fasting .cource ul > li{ width:30%; margin-right:4.7%; text-align:left;}
#fasting .cource ul > li .tit{ font-size:24px; line-height:1.4; padding-left:56px; font-weight:900; height:87px; padding-top:15px; box-sizing:border-box;}
#fasting .cource ul > li .tit:before{ width:46px; left:0; right:auto; }
#fasting .cource ul > li:nth-of-type(3) .tit{ padding-top:0;}
#fasting .cource ul > li:nth-of-type(3) .tit:before{ margin-top:15px;}
#fasting .cource ul > li .tit + p{ font-size:18px; font-weight:600; line-height:1.8; margin-bottom:10px;}
#fasting .cource ul > li ol.dot{}
#fasting .cource ul > li ol.dot li{ line-height:1.6;}
#fasting .cource ul > li ol.dot li em{/* width:185px;*/ padding-right:10px;}
#fasting .cource ul > li ol.dot li span{/* width:calc(100% - 185px);*/}
#fasting .cource ul > li ol.dot li em,
#fasting .cource ul > li ol.dot li span{ font-size:14px; line-height:1.8; display:inline-block; /display:inline; /zoom:1; vertical-align:top;}
#fasting .cource ul + p{ font-size:21px; font-weight:600;}
}


@media screen and (max-width: 736px) { /* スマホのみの設定 */
#fasting{}
#fasting .mainImg{ background: url(../img/fastingMainimgSp.jpg) no-repeat top center;}
#fasting .title + p{ margin:0 auto 30px; width:90%; text-align:left;}
#fasting .intro{ position:relative;}
#fasting .ph{ margin:0 auto 30px;}
#fasting .ph li{ width:48%; margin-right:4%;
display:inline-block; /display:inline; /zoom:1;}
#fasting .ph li:nth-of-type(2){ margin-right:0;}
/*#fasting .ph{ position:absolute; top:0; left:0; width:100%;}
#fasting .ph li{ width:222px; height:222px; position:absolute;}
#fasting .ph li img{ overflow:hidden;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%;}
#fasting .ph li:nth-of-type(1){ top:0px; left:0;}
#fasting .ph li:nth-of-type(2){ top:40px; right:0;}*/
#fasting .recommend{ margin:0 auto 50px !important;}
#fasting .baloon2{ font-size:16px; font-weight:600; background:#fff7fc; border:3px solid #d7458c; padding:15px 15px; position:relative; margin:0 auto 30px; text-align:left; width:100%;
-moz-border-radius:10px; -webkit-border-radius:10px;border-radius:10px;
display:inline-block; /display:inline; /zoom:1;}
#fasting .baloon2:before{ height:17px; width:17px; z-index:1;
background: linear-gradient(to top right, rgba(255,255,255,0) 50%, #fff7fc 50.5%) no-repeat top left/50% 100%, 
linear-gradient(to top left, rgba(255,255,255,0) 50%, #fff7fc 50.5%) no-repeat top right/50% 100%;}
#fasting .baloon2:after{ height:23px; width:23px; z-index:0;
background: linear-gradient(to top right, rgba(255,255,255,0) 50%, #d7458c 50.5%) no-repeat top left/50% 100%, 
linear-gradient(to top left, rgba(255,255,255,0) 50%, #d7458c 50.5%) no-repeat top right/50% 100%;}
#fasting .baloon2:before,
#fasting .baloon2:after{ content:""; position:absolute; top:100%; left:0; right:0; margin:auto; display:block; }
#fasting .cource{ width:90%; margin:auto;}
#fasting .cource h2{ font-size:21px; font-weight:600; margin:0 auto 20px;
display:inline-block; /display:inline; /zoom:1; }
#fasting .cource h2 strong{ color:#d7458c;}
#fasting .cource h2,#fasting .cource h2 strong{ font-weight:600;}
#fasting .cource ul{ margin:0 auto 40px; text-align:center;}
#fasting .cource ul > li{ display:block; margin-bottom:20px; position: relative;}
#fasting .cource ul > li:after{ content:""; background:url(../img/cmn_img/sdw.png) no-repeat; background-size:100% 100%; width:100%; height:10px; display:block; margin:30px auto 0; opacity:0.8;}
#fasting .cource ul > li .tit{ font-size:26px; margin-top:56px; font-weight:900; margin-bottom:5px;}
#fasting .cource ul > li .tit:before{ width:46px; padding-top:58px; left:0; right:0; bottom:calc(100% - 15px);}
#fasting .cource ul > li .tit + p{ font-size:18px; font-weight:600; line-height:1.8; margin-bottom:10px;}
#fasting .cource ul > li ol.dot{
display:inline-block; /display:inline; /zoom:1;}
#fasting .cource ul > li ol.dot li{ line-height:1.6; display:block; text-align:left;}
#fasting .cource ul > li ol.dot li em{/* width:185px;*/ padding-right:10px;}
#fasting .cource ul > li ol.dot li span{/* width:calc(100% - 185px);*/}
#fasting .cource ul > li ol.dot li em,
#fasting .cource ul > li ol.dot li span{ font-size:14px; line-height:1.8; display:inline-block; /display:inline; /zoom:1; vertical-align:top;}
#fasting .cource ul + p{ font-size:18px; font-weight:600; text-align:left;}
}


/* ヨガクリエイター養成塾
----------------------------------------------------------------------------------*/
@media print,screen and (min-width: 737px) { /* PCのみの設定 */
#yogaschool{}
#yogaschool .mainImg{ background:url(../img/yogaschoolMainimg.jpg) no-repeat top center;}
#yogaschool .title + p{ margin:0 auto 30px;}
#yogaschool .price{ margin:0 auto 50px;}
#yogaschool .ph{ margin:0 auto 50px;}
#yogaschool ul.check{}
#yogaschool ul.check li:nth-of-type(2){ margin-right:0;}
}


@media screen and (max-width: 736px) { /* スマホのみの設定 */
#yogaschool{}
#yogaschool .mainImg{ background:url(../img/yogaschoolMainimgSp.jpg) no-repeat top center;}
#yogaschool .title + p{ margin:0 auto 30px; width:90%; text-align:left;}
#yogaschool .price{ margin:0 auto 30px; width:90%; display:block;}
#yogaschool .ph{ margin:0 auto 50px;}
#yogaschool ul.check{}
#yogaschool ul.check li:nth-of-type(2){ margin-right:0;}
}




/* お寺ヨガ
----------------------------------------------------------------------------------*/
@media print,screen and (min-width: 737px) { /* PCのみの設定 */
#oterayoga{}
#oterayoga .mainImg{ background: url(../img/oterayogaMainimg.jpg) no-repeat top center;}
#oterayoga .title{}
#oterayoga .title + p{ font-size:16px; margin:0 auto 50px;}
#oterayoga .ph{ margin:0 auto 50px;}

#oterayoga .schedule{ margin:0 auto 80px !important;}
#oterayoga .oteraList{ margin:0 auto 40px;}
#oterayoga .oteraList > li{ width:22.5%; margin-right:2.5%; text-align:left;}
#oterayoga .oteraList > li .tit{ font-size:26px; padding-left:56px; font-weight:900;}
#oterayoga .oteraList > li .tit:before{ width:46px; left:0; right:auto; top:5px;}
#oterayoga .oteraList > li .tit + p{ font-size:13px;}
#oterayoga .oteraList > li .tit + p a{ color:#d7458c;}
#oterayoga .oteraList > li p.date{ font-size:18px; font-weight:600; text-indent:-0.5em;}
#oterayoga .oteraList > li ol.dot{}
#oterayoga .oteraList > li ol.dot li{}

#oterayoga .detail{}
#oterayoga .detail li{ width:48%; margin-right:4%; text-align:left; font-size:0;}
#oterayoga .detail li h5{ width:100px; height:100px; border:1px solid #d7458c; position:relative; text-align:center; box-sizing:border-box; margin-right:20px;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%; }
#oterayoga .detail li h5 span{ color:#d7458c; font-size:18px; display:block; left:0; right:0; margin:auto;
 position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}
#oterayoga .detail li h5,#oterayoga .detail li h5 + p{ display:inline-block; /display:inline; /zoom:1; vertical-align:middle;}
#oterayoga .detail li h5 + p{ width:calc(100% - 120px); font-size:14px;}

#oterayoga .movie{ margin:0 auto 80px !important;}
#oterayoga .movie h2{ font-size:24px; font-weight:600; letter-spacing:0.1em; margin:0 auto 30px;
display:inline-block; /display:inline; /zoom:1;}


#oterayoga .oterayogaLink{}
#oterayoga .oterayogaLink h2{ width:178px; margin:0 auto 30px;}
#oterayoga .oterayogaLink h2 + p{ width:33.3%; margin:0 auto; text-align:left; font-size:13px;}
}


@media screen and (max-width: 736px) { /* スマホのみの設定 */
#oterayoga{}
#oterayoga .mainImg{ background: url(../img/oterayogaMainimgSp.jpg) no-repeat top center;}
#oterayoga .title{}
#oterayoga .title + p{ font-size:16px; margin:0 auto 36px; width:90%; text-align:left;}
#oterayoga .ph{ margin:0 auto 50px;}

#oterayoga .schedule{ margin:0 auto 80px !important; width:90%;}
#oterayoga .oteraList{ margin:0 auto 40px; text-align:center;}
#oterayoga .oteraList > li{ display:block; margin-bottom:20px; position: relative;}
#oterayoga .oteraList > li:after{ content:""; background:url(../img/cmn_img/sdw.png) no-repeat; background-size:100% 100%; width:100%; height:10px; display:block; margin:30px auto 0; opacity:0.8;}
#oterayoga .oteraList > li .tit{ font-size:26px; margin-top:56px; font-weight:900;}
#oterayoga .oteraList > li .tit:before{ width:46px; padding-top:58px; left:0; right:0; bottom:calc(100% - 15px);}
#oterayoga .oteraList > li .tit + p{ font-size:13px;}
#oterayoga .oteraList > li .tit + p a{ color:#d7458c;}
#oterayoga .oteraList > li p.date{ font-size:18px; font-weight:600;}
#oterayoga .oteraList > li ol.dot{ 
display:inline-block; /display:inline; /zoom:1;}
#oterayoga .oteraList > li ol.dot li{ display:block; text-align:left;}

#oterayoga .detail{ }
#oterayoga .detail li{ display:block; text-align:left; font-size:0; margin-bottom:30px;}
#oterayoga .detail li h5{ width:100px; height:100px; border:1px solid #d7458c; position:relative; text-align:center; box-sizing:border-box; margin:0 auto 10px;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%; }
#oterayoga .detail li h5 span{ color:#d7458c; font-size:18px; display:block; left:0; right:0; margin:auto;
 position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}
#oterayoga .detail li h5,#oterayoga .detail li h5 + p{ display:block;}
#oterayoga .detail li h5 + p{ font-size:14px;}

#oterayoga .movie{ margin:0 auto 60px !important; width:90%;}
#oterayoga .movie h2{ font-size:21px; font-weight:600; letter-spacing:0.1em; margin:0 auto 20px;
display:block;}
#oterayoga .movie h2 + p{ text-align:left;}


#oterayoga .oterayogaLink{ padding-bottom:20px;}
#oterayoga .oterayogaLink h2{ width:178px; margin:0 auto 30px;}
#oterayoga .oterayogaLink h2 + p{ width:70%; margin:0 auto; text-align:left; font-size:13px;}
}


/* ヨガレッスン
----------------------------------------------------------------------------------*/
@media print,screen and (min-width: 737px) { /* PCのみの設定 */
#yogalesson{}
#yogalesson .mainImg{ background:url(../img/yogalessonMainimg.jpg) no-repeat top center;}
#yogalesson h1 + p{ font-size:14px; margin:0 auto 80px;}
#yogalesson .forSchool{ position:relative; margin:0 auto 40px !important;}
#yogalesson .forSchool:after{ content:""; background:url(../img/cmn_img/sdw.png) no-repeat; background-size:100% 100%; width:80%; height:10px; display:block; margin:60px auto 0; opacity:0.8;}
#yogalesson .tit{ font-size:30px; margin:0 auto 15px;}
#yogalesson .tit:before{ width:57px;}
#yogalesson .tit + p{ margin:0 auto 20px;}
#yogalesson .price{ margin:0 auto 40px;}
#yogalesson ul.ph{ margin:0 auto 50px;}
}


@media screen and (max-width: 736px) { /* スマホのみの設定 */
#yogalesson{}
#yogalesson .mainImg{ background:url(../img/yogalessonMainimgSp.jpg) no-repeat top center;}
#yogalesson h1 + p{ font-size:14px; margin:0 auto 40px; width:90%; text-align:left;}
#yogalesson .forSchool{ position:relative; margin:0 auto 40px !important;}
#yogalesson .forSchool:after{ content:""; background:url(../img/cmn_img/sdw.png) no-repeat; background-size:100% 100%; width:80%; height:10px; display:block; margin:40px auto 0; opacity:0.8;}
#yogalesson .tit{ font-size:21px; margin:40px auto 15px;}
#yogalesson .tit:before{ width:57px; padding-top:72px;}
#yogalesson .tit + p{ margin:0 auto 20px; width:90%; text-align:left;}
#yogalesson .price{ margin:0 auto 30px; width:90%;}
#yogalesson ul.ph{ margin:0 auto 50px;}
}



/* トップページ
----------------------------------------------------------------------------------*/
@media print,screen and (min-width: 737px) { /* PCのみの設定 */
#home{}
#home #header{ position: relative; height:auto;}
#home #header h1{ position:absolute; top:13px; left:0; right:0; margin:auto;}
#home .mainImg{ width:100%; height:769px; background:url(../img/mainImg.jpg) no-repeat top center; margin:0 auto 30px;
overflow: hidden; text-indent: 100%; white-space: nowrap;}

#home .intro{ margin:0 auto 60px; width:1100px; position:relative;}
#home .intro h2{ font-size:24px; font-weight:500; letter-spacing:0.1em; margin:0 auto 20px;
display:inline-block; /display:inline; /zoom:1; vertical-align:top;}
#home .intro:before{ content:""; background:url(../img/introPh01.png) no-repeat; width:134px; height:169px; position:absolute; top:10px; left:20px;}
/*#home .intro:after{ content:""; background:url(../img/introPh02.jpg) no-repeat; width:211px; height:119px; position:absolute; top:10px; right:0;}*/
#home .intro:after{ content:""; background:url(../img/introPh01-2.png) no-repeat; width:134px; height:169px; position:absolute; top:10px; right:20px;}


#home .pageList{ width:1100px; margin:0 auto;}
#home .pageList ul{}
#home .pageList ul li{ width:30%; margin-right:5%; padding:0 25px; margin-bottom:60px;}
#home .pageList ul li:nth-of-type(3n){ margin-right:0;}
#home .pageList ul li .flexImg{ margin:0 auto 10px; width:180px; height:180px; overflow:hidden; position:relative;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%;}
#home .pageList ul li .flexImg a:hover{ opacity:0.6;}
#home .pageList ul li h3{ font-size:21px;}
#home .pageList ul li h3 + p{ font-size:13px; margin:0 auto 20px; text-align:left;}


#home .pageList ul li.uc{ position:relative;}
#home .pageList ul li.uc .flexImg,#home .pageList ul li.uc h3,#home .pageList ul li.uc h3 + p,#home .pageList ul li.uc .btn{ opacity:0.3; pointer-events:none;}
#home .pageList ul li.uc:after{ content:"COMING SOON"; position:absolute; top:85px; left:0; right:0; font-size:16px; font-weight:600;}
}


@media screen and (max-width: 736px) { /* スマホのみの設定 */
#home{}
#home #header{ position: relative; height:auto;}
#home #header h1{ position:absolute; top:3px; left:0; right:0; margin:auto;}
#home .mainImg{ width:100%; height:0px; padding-top:100%; background:url(../img/mainImgSp.jpg) no-repeat top center; margin:0 auto 30px; background-size:100% auto;
overflow: hidden; text-indent: 100%; white-space: nowrap;}

#home .intro{ margin:0 auto 60px !important; position:relative;}
#home .intro h2{ font-size:24px; font-weight:500; letter-spacing:0.1em; margin:0 auto 20px;
display:inline-block; /display:inline; /zoom:1; vertical-align:top;}
#home .intro:before{ content:""; background:url(../img/introPh01.png) no-repeat; width:100px; height:126px; position:absolute; bottom:calc(100% - 40px); left:0; right:0; margin:auto; background-size:100% auto;}
/*#home .intro:after{ content:""; background:url(../img/introPh02.jpg) no-repeat; width:211px; height:119px; position:absolute; top:10px; right:0;}*/
/*#home .intro:after{ content:""; background:url(../img/introPh01-2.png) no-repeat; width:134px; height:169px; position:absolute; top:10px; right:20px;}*/
#home .intro h2 + p{ width:90%; margin:0 auto; text-align:left;}


#home .pageList{ width:90%; margin:0 auto;}
#home .pageList ul{}
#home .pageList ul li{ width:100%; display:block; padding:0 25px; margin:0 auto 40px;}
#home .pageList ul li .flexImg{ margin:0 auto 10px; width:180px; height:180px; overflow:hidden; position:relative;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%;}
#home .pageList ul li .flexImg a:hover{ opacity:0.6;}
#home .pageList ul li h3{ font-size:18px;}
#home .pageList ul li h3 + p{ font-size:13px; margin:0 auto 20px; text-align:left;}


#home .pageList ul li.uc{ position:relative;}
#home .pageList ul li.uc .flexImg,#home .pageList ul li.uc h3,#home .pageList ul li.uc h3 + p,#home .pageList ul li.uc .btn{ opacity:0.3; pointer-events:none;}
#home .pageList ul li.uc:after{ content:"COMING SOON"; position:absolute; top:85px; left:0; right:0; font-size:16px; font-weight:600;}
}


/*
display:inline-block; /display:inline; /zoom:1; vertical-align:top;
overflow: hidden; text-indent: 100%; white-space: nowrap;
-moz-border-radius:10px; -webkit-border-radius:10px;border-radius:10px;
-moz-border-radius:50%; -webkit-border-radius:50%;border-radius:50%;
-moz-border-radius:6px; -webkit-border-radius:6px;border-radius:6px;
text-shadow:0px 0px 3px rgba(0,0,0,0.8),0px 0px 3px rgba(0,0,0,0.8);
-webkit-transition: 0.5s; -moz-transition: 0.5s; transition: 0.5s;

:nth-of-type()
:first-child
:last-child


・可変要素の上下センター
#sample{ position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}

・疑似要素にfontawesome
#sample{ content:"\f1b9"; font-family:"fontawesome";}

・画像レスポンシブ
#sample{ width:120px; height:120px; overflow:hidden; position:relative;}
#sample img{ width:100%; height:100%; object-fit:cover;}

・矢印
#sample:before{ content:""; position:absolute; top:5px; left:0px; width:6px; height:6px; border-top:1px solid rgba(255,255,255,1); border-right:1px solid rgba(255,255,255,1); -webkit-transform:rotate(45deg); transform:rotate(45deg);}

■文字色
・　
#
rgba(,1);

■ボーダー
・
#
rgba(,0.5);

■背景
・
#
rgba(,1);

font-family: 'Noto Sans JP', sans-serif;
font-family: 'EB Garamond', serif;
font-family :"Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;
font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', 'Roboto', sans-serif;
*/