@charset "utf-8";

/* basic design */
.article,.header,.footer {
background-color: #000;
color:#fff;
width:100%!important;
max-width:100%!important;
font-size: 1.3rem;/*スマホ*/
line-height: 1.7;
}
.footer {
background: #000;
}
a {
transition:opacity .2s;
}
a.underbar {
text-decoration: underline;
}
a:hover {
opacity: .8;
}

body{
overflow-x: hidden;
background-color: #000;
font-family: var(--font-family);
font-weight: 300;
}
.bottom{
background-color:#fff;
min-height:6em;
}

/* background */
.back-dark{
background-color:#000;
padding: 3em 0;
}
.back-light{
background-color:#222;
padding: 3em 0;
}
/* text-color */
.text-yellow { color:#c996df;}
.text-orange { color:#edc19a;}

.movie-hd {
width: 100%;
position: relative;
padding-bottom: 56.25%;
}
.movie-sd {
width: 100%;
position: relative;
padding-bottom: 75%;
}


@media screen and (min-width:768px) {
/* basic design */
.article,.header,.footer {
font-size: 1.5rem;
}
/* background */
.back-dark{
padding: 5em 0;
}
.back-light{
padding: 5em 0;
}

}/* basic design / background  min-width:768px */




@media screen and (min-width:960px) {
/* basic design */
.article,.header,.footer {
font-size: 1.5rem;
}
}/* basic design / background  min-width:960px */






/* title hr btn basic-box 	strong */
.main-title {
position: relative;
padding: 1em 0 .7em;
font-size: 163%;
line-height: 1.4;
text-align: center;
border-top: 2px solid #000;
border-bottom: 1px solid #000;
font-family: var(--font-family-min);
}
.main-title span {
display: block;
text-align: center;
font-size: 60%;
font-weight: 600;
color: #FFF;
margin-bottom: .5em;
}
.main-title:after {
content: "";
position: absolute;
display: block;
top:-2px;
left:0;
right:0;
margin: auto;
height: 2px;
width: 65%;
background: #c996df;
}
.sub-title-l {
font-size: 133%;
font-family: var(--font-family-min);
}
.sub-title-s {
font-size: 135%;
font-weight: 600;
color: #c996df;
font-family: var(--font-family-min);
}
.treatment-title,
.top-border-title {
border-top: 2px solid #c996df;
padding-top: 1em;
text-align: center;
font-size:153%;
font-weight: 600;
font-family: var(--font-family-min);
}
.top-line-box {
border-top: 1px solid #666;
padding-top: 1.5em;
text-align: center;
}

.t18 {font-size: 106%;}


hr {/*colに入れて使うもの*/
height: 1px;
border: none;
border-top: 1px #808080 solid;
margin:1em auto;
}
hr.hr100 {
height: 1px;
border: none;
border-top: 1px #808080 solid;
margin:1em auto;
width:95.8318%;
}

/*link button*/
.link-btn a {
display: block;
padding: .5em;
background: #c996df;
border-radius: 10px;
text-align: center;
color: #000;
font-size: 135%;
font-weight: 600;
box-shadow: 0 6px #111;
}
.link-btn a span,
.link-btn a img {
display: inline-block;
vertical-align: middle;
margin:0 .3em;
}
.link-btn a img {
width: 30px;
}



@media screen and (min-width:768px) {
/* title hr btn basic-box 	strong */
.main-title{
margin-bottom: 1.3em;
font-size: 220%;
}
.sub-title-l {
font-size: 153%;
}
.treatment-title,
.top-border-title {
font-size:160%;
}
.top-line-box {
padding-top: 2em;
}
.point-title {
font-size: 155%;
}
.point-title h1{
font-size:145%;
}
.point-title h1:after{
width: 100px;
height: 60px;
background-size: auto 50px;
}

/*link button*/
.link-btn a {
font-size: 166%;
padding: .8em .5em;
}
.link-btn a img {
width: auto;
}

}/* min-width:768px */





/*footer*/
.footer{
font-size: 75%;
max-width:100%;
background:#222;
}
.footer .footer-logo {
font-size: 1.8rem;
}
.footer-link-bottom {
font-size: 75%;
}
.footer-link-bottom hr {
margin-top: 0;
margin-bottom: 0;
}
.footer-link-bottom .col6 span{
display: block;
}
.footer-link-bottom .col6 a{
margin: 0 1em;
}
.footer-link-bottom .col6 a:first-child{
margin-left:0;
}
.footer-link-bottom .col5{
text-align: left;
}
.footer .btn-pagetop{
display: none;
}

/* Social Button */
.footer-social {
text-align: center;
}
.social-button {
margin-top: 1em;
display: inline-block;
}
.social-button li {
margin-left:7px;
padding: 0;
display: inline-block;
vertical-align: middle;
}
.social-button li:first-child {
margin-left:0;
position: relative;
bottom: 3px;
}
.social-button li.fb {
position: relative;
top:-3px;
}

.social-button li div {
display: inline;
}
.social-button:before, .social-button:after {
content: " ";
display: table;
}
.social-button:after {
clear: both;
}
.social-button {
*zoom: 1;
}
.social-button iframe.twitter-share-button {
width: 90px !important;
}
.social-button li.tw {
width:72px;
}
.social-button li.gg {
overflow:hidden;
width:55px;
}

.footer .footer_line {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-around;
background-color:#4b4b4b;
padding: 1rem 1.5rem;
box-sizing: border-box;
border-radius: 10px;
font-size: 12px;
}
.footer .footer_line > p {
width: 64%;
}

.footer .footer_line > a {
display: block;
width: 34%;
max-width: 120px;
}
.footer .footer_line > p > strong {
display: block;
font-size: 18px;
font-weight: 600;
}



@media screen and (min-width:768px) {
/*footer*/
.footer .footer-logo {
text-align: left;
}
.footer-top-btn{
display: inline-block;
}
.footer .col8 span{
display: inline-block;
margin-top: 1em;
}
.footer-social{
text-align: right!important;
margin-top: .2em;
}
.footer-info .footer-tel{
font-size: 1.5em;
}
.footer-link-bottom .col5{
text-align: right;
}
.footer .btn-pagetop{
display: inline-block;
}

.footer-social {
margin-top: 15px;
}
.social-button li.fb {
top:-5px;
}

}/* footer min-width:768px */



@media screen and (min-width:960px) {
.footer .footer-logo {
font-size: 1.6rem;
}
}/* footer min-width:960px; */





/* fv */
.fv {
text-align: center;
}
.fv .col12 {
position: relative;
margin: 0;
width: 100%;
}
.fv .fv-image {
padding-bottom:10px;
}
.fv-logo {
display: inline-block;
position: absolute;
top:5px;
left:10px;
width: 100px;
z-index: 1000;
}
.fv .wrap_anchorbtn {
position: absolute;
right:15px;
top:200px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 43%;
}
.fv .wrap_anchorbtn > p {
width: calc(50% - 5px);
max-width: 144px;
}
.fv .fv_banner {
position: absolute;
right:15px;
bottom:20px;
width: calc(100% - 30px);
}
.fv .fv_banner .caution {
color:#fff;
padding-top:1rem;
}






@media screen and (min-width:768px) {
/* fv */
.fv {
background-color:#000;
}
.fv-logo {
top:20px;
left: 0;
width: 126px;
}
.fv .fv-image {
position: relative;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
/* padding: 140px 0 100px; */
padding: 10rem 0 0;
background-color:transparent;
}
.fv .fv-image > figure,
.fv .fv-image > div {
padding: 0 20px;
width: 50%;
box-sizing: border-box;
}
.fv .wrap_anchorbtn {
position: static;
width: 100%;
margin-top: 3rem;
}
.fv .wrap_anchorbtn > p {
width: calc(33.3% - 10px);
max-width: 144px;
}
.fv .wrap_anchorbtn > p > img {
width: 100%;
}
.fv .wrap_anchorbtn > p:first-child {
max-width: 133px;
}
.fv .fv_banner {
position: static;
width: calc(100% - 40px);
margin: 0 auto;
padding: 8rem 0;
text-align: center;
}

}/* fv min-width:768px */



@media screen and (min-width:960px) {
}/* fv min-width:960px; */





/* gnavi */
.gnav {
display: none;
padding: 1.2em 0;
background-color: #000;
}
.gnav li {
display: inline-block;
/* width: 11.4%; */
width: 11.4%;
margin-right: 0.5%;
letter-spacing: normal;

align-content: center;
align-items: center;
}
.gnav li.contact {
margin-right: 0;
margin-left: 1.2%;
}
.gnav li a {
display: block;
padding: 1.5rem 0;
background: #333;
border-radius: 6px;
text-align: center;
font-size: 14px;
font-weight: 600;
box-sizing: border-box;
}
.gnav li a.thin {
letter-spacing:-0.1em;
}
.gnav li.contact a {
background: #c996df;
color: #292F30;
}


@media screen and (min-width:768px) {
/* gnavi */
.gnav {
display: block;
}
.gnav .wrapper {
display: flex;
justify-content: space-around;
padding: 0 15px;
box-sizing: border-box;
}
}


@media screen and (min-width:960px) {
.gnav li a {
/* font-size: 1.1em; */
}
}/* min-width:960px; */








/* intro */
.intro.back-light {
padding-top: 0;
}
/*
.intro .wrapper:before {
content: "";
display: block;
background: #c996df;
height: 3px;
margin-left: 2.08%;
margin-right: 2.08%;
width:95.8318%;
}
*/
.intro .wrapper + .wrapper:before {
display: none;
}


.intro h1 {
padding: 1.5rem 0 0;
margin-top:4rem;
font-size: 160%;
text-align: center;
border-top: 2px solid #c996df;
font-family: var(--font-family-min);
}
.intro h1 span {
display: block;
padding-bottom: 1.5rem;
margin-bottom: 2rem;
text-align: center;
color: #c996df;
font-size: 80%;
font-weight: 600;
border-bottom: 1px solid #967d99;
}
.intro .col9 p {
position: relative;
}
.intro .col9 p img {
position: relative;
top:-10px;
}
.intro h2 {
font-size: 140%;
font-weight: 600;
text-align: center;
font-family: var(--font-family-min);
}
.intro dt {
text-align: center;
font-size: 130%;
margin-bottom: 1em;
}
.intro dt,
.intro dd p {text-align: center;}


/* award */
.intro .award .head_award {
padding: 1.5rem 0;
font-weight: bold;
font-size: 200%;
line-height: 1;
letter-spacing: 0.06em;
text-align: left;
}
.intro .award .head_award > span {
display: inline-block;
margin-bottom: 1rem;
color: #FFF;
border:1px solid #FFF;
padding: .4rem 1rem .5rem;
font-size: 60%;
}
.intro .award .t18 {
font-size: 100%;
line-height: 1.4;
}






@media screen and (min-width:768px) {

/* intro */
.intro h1 {font-size:240%;margin-top: 5rem;}
.intro dd p {text-align: left;}
.intro h2 {font-size: 180%;}


/* award */
.intro .award .head_award,
.intro .award .t18 {
text-align: left;
}
.intro .award .head_award {
padding: 2rem 0 3rem;
}

.intro .award .head_award > span {
margin-right: 10px;
margin-bottom: 0;
padding: .8rem 1rem;
transform: translateY(-5px);
}
.intro .award .t18 {
font-size: 106%;
}
.wrap_award_text {display: none;}


}/* intro min-width:768px */











/* point-title */
.point-title {
padding: 2em 0 0;
font-size: 140%;
border-top: #c996df 4px solid;
font-family: var(--font-family-min);
}
.point-title .col12 {
margin-bottom: .5em;
margin-top:0;
}
.point-title h1{
font-size:115%;
color: #c996df;
text-align: center;
line-height: 1.4;
}
.point-title h1:after{
content: "";
display: block;
margin: 0 auto;
width: 90px;
height: 40px;
background: url(../images/point-arrow.svg) no-repeat 50% 50%;
background-size: auto 20px;
}


/* howto */
.course-menu {
display: table;
table-layout: fixed;
width: 100%;
border-collapse: separate;
box-sizing: border-box;
}
.course-menu span {
display: table-cell;
}
.course-menu span a {
display: block;
padding: 1rem .5rem;
margin-right: 10px;
background: #6A6E6F;
text-align: center;
font-weight: 600;
border-radius: 5px;
font-size: 95%;
}
.course-menu span:last-child a {
margin-right: 0;
}
.course-menu span a.selected {
background: #c996df;
color: #292F30;
}
.course-title {
border-top:4px solid #c996df;
}
.course-title h3 {
padding: .4em;
font-size: 173%;
font-weight: 600;
text-align: center;
border-bottom: 1px dotted #6A6E6F;
}
.course-title p {
padding: .2em;
text-align: center;
border-bottom: 1px dotted #6A6E6F;
}
.wrap-course {
text-align: center;
}
.wrap-course .col4 {
vertical-align: top;
}
.wrap-course .col4 p {
text-align: center;
margin-bottom: .6em;
background: #F5F0D9;
}
.wrap-course .col4 dt {
background: #ebbdf2;
padding: .2em;
margin-bottom: .4em;
color: #343A3B;
font-size: 113%;
font-weight: 600;
text-align: center;
}
.wrap-course .col4 dt span {
display: inline-block;
margin-right: .5em;
background: #FFF;
width: 1.5em;
text-align: center;
line-height: 1.5;
}
.wrap-course .col4 dd {
font-size: 93.3%;
}
.wrap-course h4.movie-title{
text-align: center;
margin-top: 1em;
font-weight: 600;
font-size: 113%;
}


/* feature */
.feature-title {
color: #c996df;
font-size: 106%;
font-weight: 600;
line-height: 1.2;
display: flex;
align-items: center;
}
.feature-title strong {
font-size: 180%;
font-family: var(--font-family-en);
}
.feature-title span.round {
font-size: 80%;
line-height: 1.2;
text-align: center;
display: inline-block;
height: 60px;
width: 60px;
border: 1px solid #c996df;
border-radius: 60px;
padding: 15px 0 0;
margin: 0 10px 5px 0;
box-sizing: border-box;
}
#feature .level {
display: inline-block;
margin: 1em 0;
padding: .2em 1em;
border: 1px solid #FFF;
font-size: 86.6%;
font-weight: 600;
}

/* treatment */
#treatment .thumb {
margin-bottom: 1em;
}
#treatment .thumb img,
#treatment .thumb span {
display: inline-block;
vertical-align: middle;
}
#treatment .thumb img {
margin-right: .5em;
}
#treatment hr {
border: none;
border-top: #666 1px solid;
margin: 20px;
display: block;
}




/* faq */
.faq-list{
display: table;
width: 100%;
box-sizing: border-box;
}
.faq-list li{
display: table-row;
}
.faq-list li strong,
.faq-list li  span {
display: table-cell;
border-top:1px solid #ccc;
font-size: 106%;
vertical-align: top;
}
.faq-list li strong {
padding: .5em .5em .5em 0;
font-weight: 600;
font-size: 213%;
line-height: 1.0;
font-family: var(--font-family-en);
}
.faq-list li  span {
padding: 1.3em 0;
}
.faq-list li:nth-child(odd) {
font-weight: 600;
}
.faq-list li:nth-child(even) strong,
.faq-list li:nth-child(even) span {
border-top:none;
}
.faq-list li:nth-child(odd) strong,
.faq-list li:nth-child(odd) span {
border-bottom:1px solid #333;
}
.faq-list li:nth-child(odd) strong {
color: #c996df;
}



/* spec */
.spec-title {
margin-bottom: .5em;
font-size: 200%;
font-weight: 600;
color: #c996df;
line-height: 1.2;
font-family: var(--font-family-min);
}
.spec-title .for {
display: inline-block;
padding: .3rem 1rem;
font-size: 40%;
color: #FFF;
border:1px solid #FFF;
}

.spec-list dl {
border-top:1px solid #888C8E;
padding: .5em 0;
font-size: 93.3%;
}
.spec-list dl:last-of-type {
border-bottom:1px solid #888C8E;
margin-bottom: 1em;
}
.spec-list dt {
font-weight: 600;
}
.spec-list dd p {
display: table;
width: 100%;
}
.spec-list dd p span {
display: table-cell;
}
.spec-list dd p span:first-child {
width: 10rem;
}
#spec .price strong {
font-size: 173%;
font-weight: 600;
}
.salonprice {
padding: .2em 1em;
background: #C3C5C6;
font-size: 80%;
font-weight: 600;
color:#383F42;
text-align: center;
}
.box_icon {
display: inline-block;
padding: 0 1rem;
margin-right: 1rem;
border:1px solid #FFF;
}

#spec h3.sub-title-s {
font-size: 120%;
}



/* freetrial */
#freetrial .top-line-box .col8 {
margin-right: 0;
}
#freetrial .top-line-box .col4 {
margin-left: 0;
}

.product-btn a {
display: block;
padding: 1em .5em;
background: #4B5256;
text-align: center;
min-height: 22em;
}
.product-btn .sub-title-s {
font-size: 100%;
text-align: center;
min-height: 4em;
line-height: 1.3;
}
.product-btn a p {
text-align: center;
}
.product-btn a p strong {
font-size: 113%;
font-weight: 600;
line-height: 1.3;
}



/* recommend */
.recommend-title {
margin-bottom: .5em;
font-size: 180%;
font-weight: 600;
color: #c996df;
line-height: 1.2;
}
.recommend-title .for {
display: inline-block;
padding: .3rem 1rem;
vertical-align: middle;
font-size: 40%;
color: #FFF;
border:1px solid #FFF;
}
#recommend .icon img {
display: inline-block;
width: 32px;
}




@media screen and (min-width:768px) {

/* feature */
.feature-title strong {
font-size: 213%;
}
#feature .col12 {
padding-left: 0;
padding-right: 0;
}
.top-line-box .col8 {
width: 68.7%;
margin-left: 0;
margin-top: 0;
vertical-align: top;
}
.top-line-box .col4 {
width: 26.5%;
margin-right: 0;
margin-top: 0;
vertical-align: top;
}
.course-menu span a {
padding: 1.5rem .5rem;
font-size: 113%;
}


/* spec */
.spec-list dl {
letter-spacing: -0.4em;
}
.spec-list dt,
.spec-list dd {
display: inline-block;
vertical-align: top;
letter-spacing: normal;
}
.spec-list dt {
width: 20%;
}
.spec-list dd {
width: 80%;
}
.spec-list dd p span:first-child {
width: 12rem;
}



/* freetrial */
#freetrial .top-line-box .col8 {
margin-right: 2.08%;
}
#freetrial .top-line-box .col4 {
margin-left: 2.08%;
}

.product-btn .sub-title-s,
.product-btn a p strong {
font-size: 120%;
line-height: 1.6;
}
.product-btn a {
min-height: 23em;
}
.product-btn a p strong {
font-size: 120%;
}



/*recommend*/
/* recommend */
.recommend-title {
font-size: 226%;
}
#recommend .icon img {
width: 42px;
}

}/* min-width:768px; */









/* loan */
#loan {
background: #000;
padding: 3em 0;
}
#loan h2 {
font-size: 165%;
text-align: center;
font-family: var(--font-family-min);
}


@media screen and (min-width:768px) {
#loan {
padding: 5em 0;
}
#loan h2 {
font-size: 194%;
}
}/* loan min-width:768px */



/* rental */
#rental .flow_rental li {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
}
#rental .flow_rental li + li {
margin-top: 20px;
}
#rental .flow_rental li .num {
position: absolute;
top:10px;
left:10px;
font-family: var(--font-family-en);
font-weight: 400;
font-size: 28px;
line-height: 1;
color: #c996df;
}
#rental .flow_rental li figure {
width: 50%;
padding: 25px 10px 10px;
box-sizing: border-box;
background: #FFF;
border-radius: 10px;
text-align: center;
}
#rental .flow_rental li figure img {
width: 70px;
}
#rental .flow_rental li p {
width: 45%;
}
.list_default li {
position: relative;
padding-left: 1.5rem;
margin-bottom: .3rem;
}
.list_default li:before {
position: absolute;
top:0;
left:0;
content: "・";
display: inline-block;

}





@media screen and (min-width:768px) {
#rental .flow_rental {
display: flex;
justify-content: space-between;
}
#rental .flow_rental li {
display: block;
/* width: calc(33.3% - 30px); */
width: calc(25% - 20px);
}
#rental .flow_rental li + li {
margin-top: 0;
}
#rental .flow_rental li .num {
font-size: 35px;
}
#rental .flow_rental li figure,
#rental .flow_rental li p {
width: 100%;
}
#rental .flow_rental li figure {
padding:35px 30px 30px;
}
#rental .flow_rental li figure img {
width: 100px;
}
#rental .flow_rental li p {
margin-top: 2rem;
}

}/* rental min-width:768px */
























/* 

@media all and (-webkit-min-device-pixel-ratio: 1.5),only screen and (min-device-pixel-ratio: 1.5),only screen and (min-resolution: 1.5dppx) {

}
@media all and (-webkit-min-device-pixel-ratio: 1.5),only screen and (min-device-pixel-ratio: 1.5),only screen and (min-resolution: 1.5dppx) and (min-width:768px) {

}

 */
