@charset "UTF-8";

/* studio
----------------------------------------------- */

.tab {margin: 0 auto 8%;padding: 10% 5% 0;display:-webkit-box;display:-moz-box;display:box;display:-webkit-flex;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;text-align: center; gap: 0 2%;}
.tab li {width: 49%;margin: 0 0 2% 0;background:#6e5132;line-height: 1;border-radius: 5px;}
.tab a{color:#fff;font-weight:bold;padding: 8%;border-radius:6px;position:relative;font-size: 3.6vw;}
.tab a:after{content: "\f105";font-family: icon;position:absolute;right: 6%;color: #fff;}
.tab a:hover{color:#6e5132;opacity:1}
.tab li:hover{background: #e8ddd1;}

.intro{position: relative;padding: 0 0 10vw;}
.intro img.img01{width: 86%;margin-left: 0;}
.intro img.img02{margin: 4vw 0 0 auto;width: 80%;}
.intro .text{margin: -17vw auto 0;width: 90%;}
.intro .text dl{padding: 5vw 0;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;}
.intro .text dt{display: inline-block;margin-right: 3vw;position: relative;top: -3.5vw;}
.intro .text dd{display: inline-block;}
.intro .sub{font-family: var(--font_marcellus);font-size: 8vw;letter-spacing: .07em;margin-bottom: 2vw;color: #136c3c;line-height: 1.2;}
.intro .read{font-size: 4.4vw;margin-bottom: 3vw;font-family: var(--font_mincho);text-align: justify;}
.intro p{margin-bottom: 6vw;}

.semi-personal{background: #f1f8e9;padding: 0 6% 6%;}
.semi-personal .flex{margin-bottom: 8vw;}
.semi-personal .flex img{position: relative;top: -6vw;}
.semi-personal .flex .text{margin-top: -4vw;}
.semi-personal .flex .text dt{margin-bottom: 2vw;}
.semi-personal .flex .text dt .sub{font-weight: 600;display: block;font-size: 3.8vw;line-height: 1.3;color: #136c3c;margin-bottom: 1vw;}
.semi-personal .flex .text dt .read{font-family: var(--font_mincho);font-size: 5vw;line-height: 1.2;}
.semi-personal .flex .text dd p{line-height: 1.7;font-feature-settings: "palt";letter-spacing: .04em;text-align: justify;margin-bottom:0;}

.tbl {width:100%;margin: 0 auto;position:relative;font-size: 3.4vw;}
.tbl:before {content:"";width: 100px;position:absolute;background:#136c3c;height:2px;top:0px;}
.tbl th,.tbl td {vertical-align:middle;line-height: 1.6;letter-spacing: 0.02em;text-align: justify;display: inline-block;padding: 3vw;}
.tbl td {width: 70%;}
.tbl th {text-align:center;width: 30%;display: inline-block;color: #136c3c;}
.tbl tr:first-child {border-top: 2px solid #d0d0d0;}
.tbl tr{border-bottom: 1px solid #d0d0d0;}
.tbl tr:last-child { border-bottom: none;}
.tbl td .tel , .tbl td .fax{color: #136c3c;font-size: 5.8vw;letter-spacing: .08em;display: inline-block;font-weight: 400;font-family: var(--font_marcellus);margin-bottom: 0;}
.tbl td .tel span:before {margin-right:5px;font-family:icon;content:'\f095';color: #136c3c;font-size: 80%;}
.tbl td .fax span:before{margin-right:5px;font-family:icon;content:'\e954';color: #136c3c;font-size: 80%;}
.tbl td li span {height: 18px;width: 18px;border-radius:50%;display: inline-block;text-align:center;background: #eee;color: #28282d;font-size: 80%;margin-right: 5px;padding-top: 1px;padding-left: 0;text-indent: 0;  }
.tbl td li {margin-bottom: 2%;font-size: 3.2vw;font-feature-settings: "palt";letter-spacing: .03em;padding-left: 2em;text-indent: -2em; text-align:justify; text-justify:auto;}

.intro .text dl.yoga-type01 dt{top: 0;}
.intro .text dl.yoga-type02{/* padding-top: 0; */border-top: none;}

/* event */
.event{width: 90%;margin: 0 auto 12vw;}
.event ul {margin: 0 auto 4vw;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;}
.event ul li {width: 48%;position: relative;margin: 0 auto;}
.event li a:after {content: ''; display: inline-block; width: 24px; height: 24px; background-image: url("../../images/access/zoom.jpg"); background-size: contain; vertical-align: middle; position: absolute; right:0; bottom:0;}
.event ul li img {width:100%;}
.event p{text-align: center;}


/* =============================================
pc-size 
================================================*/
@media screen and (min-width: 736px) {

.tab {width: 960px;margin:0 auto 40px;padding: 100px 0 0;justify-content: center;}
.tab li{width: 280px;text-align:center;}
.tab a{font-size:16px;padding: 16px;}
.tab a:hover{background:#bb9e7a;}
    
.intro{padding: 0;margin: 0 auto;width: 900px;}
.intro.mb0{padding: 0 0 100px;}
.second-content{min-height: auto;}
.intro .img-flex{display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-justify-content: flex-start;-ms-flex-pack: start;justify-content: flex-start;-webkit-align-items: center;-ms-flex-align: center;align-items: center;margin-bottom: 60px;}
.intro img.img01{position: initial;width: auto;margin-left: 0;}
.intro img.img02{margin: 0;position: relative;right: -40px;width: auto;top: 60px;}
.intro.hula .img-flex{margin-bottom: 20px;}
.intro.hula img.img02{top: 100px;}
.intro .text{width: 900px;margin: -20px auto 0;}
.intro .text dl{padding: 20px 0;width: 420px;}
.intro .text dt{margin-right: 20px;top: -16px;}
.intro .sub{font-size: 36px;margin-bottom: 6px;}
.intro .read{font-size: 26px;margin-bottom: 24px;line-height: 1.7;}
.intro p{margin-bottom: 24px;}

.semi-personal{padding: 46px 40px 40px;}
.semi-personal .flex{margin-bottom: 40px;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;}
.semi-personal .flex img{position: inherit;top: 0;height: 100%;order: 2;width: 440px;}
.semi-personal .flex .text{margin-top: 0;}
.semi-personal .flex .text dt{margin-bottom: 20px;}
.semi-personal .flex .text dt .sub{font-size: 18px;margin-bottom: 0px;}
.semi-personal .flex .text dt .read{font-size: 26px;}

.tbl {font-size: 14px;margin: 0 auto;}
.tbl:before {width: 200px;}
.tbl th,.tbl td {padding: 13px;}
.tbl td {width: 77%;}
.tbl th {text-align:center;width: 22%;}
.tbl td .tel , .tbl td .fax{ font-size: 22px; }
.tbl td li {font-size: 14px;}
.tbl td li span {padding-top:0;}

/* event */
.event{width: 900px;margin: 0 auto 80px;}
.event ul{margin-bottom: 20px;}
}