@charset "UTF-8";

:root {
--black:#191d1e;
--gray_dark:#292f30;
--gray_light:#383f42;
--gray_pale:#606568;
--white:#FFF;
--gold:#cab266;
--gold_light:#eeda78;
--yellow:#ffea87;
}



/* COMMON */
article {
padding-top: 45px;
background: #000;
}
.bg_gray_dark {
background-color: var(--gray_dark);
}
.bg_gray_light {
background-color: var(--gray_light);
}
.bg_black {
background: #252829;
}

.t_gold {color: var(--gold);}
.t_yellow {color: var(--yellow);}
.t_min {
font-family: var(--font-family-min);
font-weight: 400;
}

.title_corner {
margin-bottom: 2rem;
text-align: center;
font-size: var(--19px);
font-weight: 400;
line-height: 1.6;
font-family: var(--font-family-min);
}
.title_corner .en {
display: block;
margin-bottom: 1rem;
text-align: center;
color: var(--gold);
font-weight: 200;
font-size: 240%;
font-family: var(--font-family-en);
}
.title_corner:after {
content: "";
display: block;
margin: 3rem auto 0;
width: 80px;
height: 1px;
background:var(--gold);
}
.title_corner > .caption {
display: block;
text-align: center;
font-size: 50%;
margin-top: 1rem;
}


.spec-title {
margin-bottom:1rem;
font-family: var(--font-family-min);
font-size:var(--19px);
font-weight: 400;
color: var(--gold);
line-height: 1.6;
}

.sub-title-30,.sub-title-22,.sub-title-20 {
font-family: var(--font-family-min);
font-weight: 400;
}
.sub-title-30 {
font-size: var(--26px);
}
.sub-title-22 {
font-size: var(--19px);
margin-bottom: 2rem;
}
.sub-title-20 {
font-size: var(--18px);
}
.t13 {font-size: var(--13px);}
.t15 {font-size: var(--15px);}
.t16 {font-size: var(--16px);}
.t17 {font-size: var(--17px);}
.t18 {font-size: var(--18px);}



/* button/link */
a.btn_regular{
display: block;
padding: 2rem 1rem;
background: var(--gold_light);
border-radius: 5px;
color:var(--black);
font-size: var(--19px);
/*font-family: var(--font-family-min);*/
font-weight: 400;
text-align: center;
}
.btn_simple,
.btn_simple:visited {
display: block;
padding: 2rem 1rem;
border: 1px solid var(--gold_light);
border-radius: 5px;
color:var(--gold_light);
font-size: var(--19px);
/*font-family: var(--font-family-min);*/
font-weight: 400;
text-align: center;
}

/* hr */
hr {
height: 1px;
border: none;
border-top: 1px var(--gold) solid;
margin: 1em auto;
width: calc(100% - 30px);
}
hr.hr-dot {
border-top:1px #666 dotted;
margin:2em auto;
}


.anchor {
display: block;
margin-top:-50px;
padding-top:50px;
}



@media screen and (max-width:768px) {
.t15_sp {font-size: var(--15px);}
.t16_sp {font-size: var(--16px);}
.t17_sp {font-size: var(--17px);}
.t18_sp {font-size: var(--18px);}
.t19_sp {font-size: var(--19px);}
.t20_sp {font-size: var(--20px);}

.text-left_sp {text-align: left;}
.text-center_sp {text-align: center;}
}/* max-width:768px */




@media screen and (min-width:768px) {
article {
padding-top: 70px;
}
.title_corner {
font-size: var(--22px);
}
.title_corner .en {
font-size: 260%;
}
.title_corner:after {
margin: 4rem auto 0;
}
.spec-title {
font-size:var(--22px);
}
.sub-title-30 {
font-size: var(--30px);
}
.sub-title-22 {
font-size: var(--22px);
}
.sub-title-20 {
font-size: var(--20px);
}

a.btn_regular,
.btn_simple,
.btn_simple:visited {
font-size: var(--22px);
}



/* hr */
hr {
width: calc(100% - 60px);
}
.hr-dot {
margin:4em auto!important;
}
.text-center_tb {
text-align: center;
}

.anchor {
display: block;
margin-top:-80px;
padding-top:80px;
}


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





/* header */
.header {
position: fixed;
background: var(--black);
width:100% ;
height: 45px;
z-index: 100;
padding-top: 7px;
box-sizing: border-box;
}
.header .header_logo {
padding: 0 0 0 15px;
}

/* hamburger menu */
.hmenu-wrapper{
position:fixed;
top:5px;
right:5px;
padding: 0;
z-index: 999;
}
.hmenu{
width: 40px;
height:30px;
position:relative;
cursor:pointer;
display: inline-block;
float:right;
}
.hmenu1,.hmenu2,.hmenu3{
position:absolute;
left:6px;
display: inline-block;
width: 30px;
background-color: #fff;
height: 2px;
transition: all 0.3s ease-out;
}
.hmenu1{top:8px;}
.hmenu2{top:16px;}
.hmenu3{top:24px;}

.hmenuclick1{
top:16px;
transform: rotate(45deg);
}
.hmenuclick2{
opacity:0;
}
.hmenuclick3{
top:16px;
transform: rotate(-45deg);
}
.hmenu-back{
display: none;
position: absolute;
background-color: #000;
opacity: .9;
z-index: 997;
width: 100%;
height: 100%;
top:45px;
left:0;
}
.hmenu-nav{
display: none;
position: fixed;
background-color: #333;
z-index: 998;
width: 100%;
box-sizing: border-box;
top:45px;
}
.hmenu-nav ul{
}
.hmenu-nav li{
border-top: #000 1px solid;
display: block;
box-sizing: border-box;
font-size: 126%;
}
.hmenu-nav li:last-child{
border-bottom: #000 1px solid;
}
.hmenu-nav li:hover{
background-color: #222;
}
.hmenu-nav li a{
display: block;
color:#FFF;
height:100%;
padding: 1.5rem;
font-size: var(--16px);
}
.hmenu-nav li a:hover{
opacity: 1;
}
.hmenu-nav li a > strong {
display: inline-block;
font-size: 120%;
font-family: var(--font-family-en);
margin-right: 10px;
}

@media screen and (min-width:768px) {
.hmenu-wrapper{
display: none;
}
.header {
height: 70px;
padding-top: 10px;
}
.header .header_logo {
padding:0 0 0 30px;
}
.header .gnav {
display: flex;
justify-content: flex-end;
align-items: center;
}
.header .gnav a {
display: block;
padding: 0 15px;
text-align: center;
font-size: var(--14px);
font-weight: 500;
}
.header .gnav strong {
display: block;
text-align: center;
font-size: 106%;
font-family: var(--font-family-en);
}

}/* min-width:768px */


@media screen and (min-width:1200px) {
.header .gnav a {
padding: 0 30px;
}
}/* min-width:1200px */





/* footer */
.footer {
padding:2rem 0 0;
font-size: 1.2rem;
}
.footer .col,
.footer .col5,
.footer .col6 {
/* padding:0 0 0 15px; */
padding:0 15px;
}
.footer .footer_logo strong {
display: inline-block;
font-family: var(--font-family-en);
font-size: var(--24px);
font-weight: 700;
}
.footer .footer_logo small {
margin-top: .5rem;
}

.footer hr {
/* margin: 15px 0; */
margin: 15px auto;
border-top-color: var(--gray_dark);
}
.footer .footer_nav a {
display: inline-block;
}
.footer .footer_nav a:after {
content: "";
display: inline-block;
margin: 0 10px;
width: 1px;
height: 12px;
background: var(--gray_pale);
transform: translateY(2px);
}
.footer .footer_nav a:last-child:after {
display: none;
}
.footer .copyright {
padding: 5px 0 2rem 15px;
font-family: var(--font-family-en);
font-weight: 700;
}
.footer .corporate {
padding:2rem 0 70px;
background: var(--white);
}
.footer .corporate img {
display: block;
margin: 0 10px;
}
.footer .footer_line {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-around;
background: var(--gray_pale);
/* width: calc(100% - 30px); */
padding: 1rem 1.5rem;
margin: 15px auto 0;
box-sizing: border-box;
border-radius: 10px;
}
.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: var(--22px);
font-family: var(--font-family-en);
font-weight: 600;
}



@media screen and (min-width:768px) {
.footer .col,
.footer .col5,
.footer .col6 {
padding:0 30px;
}
.footer .col6 {
padding-bottom: 20px;
}
.footer .col5 {
padding-right: 130px;
}
.footer .col6.copyright {
text-align: right;
padding-right: 130px;
}
.footer .footer_logo {
margin-bottom: 0;
padding-right: 0;
/* font-size: 133%; */
}

.footer .footer_logo strong {
margin-right: 1rem;
}
.footer .footer_logo small {
margin-top: 0;
}

.footer .corporate {
padding:2rem 0;
}
.footer hr {
width: calc(100% - 60px);
max-width: 1260px;
margin: 20px auto;
}

}/* min-width:768px */




/* modal movie */
.movie-hd {
width: 100%;
position: relative;
padding-bottom: 56.25%;
}
.modal_movie {
height: 100vh;
position: fixed;
top: 0;
width: 100%;
background: rgba(0,0,0,0.8);
z-index: 1001;
display:none;
}
.btn-modal-close {
width: 40px;
height: 40px;
position: absolute;
right:5px;
top:40px;
color: #FFF;
cursor: pointer;
transition: all .2s;
}
.btn-modal-close:hover {
opacity: .7;
}
.btn-modal-close:before,
.btn-modal-close:after {
position: absolute;
top:20px;
right:0;
content: "";
display: block;
width: 40px;
height: 1px;
background:#FFF;
transform: rotate(45deg);
}
.btn-modal-close:after {
transform: rotate(-45deg);
}
.modal_movie .modal_content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 90%;
z-index: 9999;
}
.movie_hd {
width: 100%;
position: relative;
padding-bottom: 56.25%;
}
.fv_button{
cursor:pointer;
}


@media screen and (min-width:768px) {
.btn-modal-close {
right:15px;
top:10px;
}
.modal_movie .modal_content {
width: 70%;
}

}/* modal movie min-width:768px */




/* トップに戻る */
div#pageTop {
z-index: 2;
position: fixed;
bottom: 4px;
right: 15px;
display: none;
}

/* ask */
#ask {
padding:5rem 0;
color: #FFF;
/* background: #292f30; */
}
@media screen and (min-width:768px) {
#ask {
padding:7rem 0;
}

}/* min-width:768px */







/* fv */
.fv {
background: #000;
}
.fv > div {
margin: 0 auto;
}
.slider-inner {
position: relative;
width: 100%;
}
.slider-item {
position: absolute;
top:0;
left:50%;
transform: translateX(-50%);
width: 100%;
}
.slider-item.fade {
z-index: 2;
animation: slider 12s infinite ease;
}
.fv .fv_image {
position: relative;
}
.fv .fv_image h2 {
position: absolute;
left:0;
z-index: 91;
}
.fv .fv_image h2 {
top:10px;
width: 75%;
max-width: 455px;
}
.fv .wrapper.wrap_fv_award {
/* align-items: flex-end; */
justify-content: flex-start;
position: relative;
flex-flow: column-reverse;
/* transform: translateY(-30vh);
margin-bottom: -30vh;
padding-bottom: 15px; */
z-index: 90;
}

.fv .wrapper.wrap_fv_award .banner {
/* padding-top: 36px;
padding-bottom: 36px; */
padding-top: 18px;
padding-bottom: 20px;
}
.fv .wrap_awardlabel {
position: relative;
order: 1;
}
.fv .wrap_awardlabel > em {
position: absolute;
top:-140px;
right:15px;
width: 34%;
max-width: 155px;
}
.fv .wrap_btn {
text-align: center;
order: 2;
}
.fv .wrap_anchorbtn {
text-align: right;
display: flex;
flex-wrap: wrap;
align-items: flex-end;
justify-content: space-between;
max-width: 326px; 
}
.fv .wrap_anchorbtn > p {
width: calc(33.3% - 8px);
}
.fv .wrapper.wrap_fv_award .banner {
order: 3;
}


@keyframes slider {
0% {opacity: 1;}
25% {opacity: 1;}
50% {opacity: 0;}
75% {opacity: 0;}
100% {opacity: 1;}
}


@media screen and (min-width:768px) {
.fv .fv_image h2 {
width: 45%;
}
.fv .wrapper.wrap_fv_award {
  flex-flow: unset;
justify-content: space-between;
align-items: center;
transform: translateY(-140px);
margin-bottom: -140px;
padding-bottom: 30px;
max-width: 920px;
}
.fv .wrapper.wrap_fv_award h1 {
order: 1;
}
.fv .wrap_btn {
order: 2;
}
.fv .wrap_btn > a {
display: block;
max-width: 300px;
}
.fv .wrap_awardlabel {
text-align: right;
max-width:var(--col7);
margin: 0;
order: 3;
}
.fv .wrap_awardlabel > em {
top:-160px;
right:30px;
}
.fv .wrapper.wrap_fv_award .banner {
order: 4;
}
.fv .wrap_anchorbtn {
bottom:0;
justify-content: flex-end;
max-width: 100%;
}
.fv .wrap_anchorbtn > p {
width: calc(33.3% - 20px);
max-width: 144px;
margin-left: 20px;
}
.fv .wrap_anchorbtn > p:first-child {
max-width: 133px;
}



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





@media screen and (min-width:1080px) {
.fv > div {
max-width: 1260px;
height: 640px;
margin: 0 auto;
}
.fv .fv_image h2 {
width: 100%;
max-width: 920px;
left:50%;
transform: translateX(-50%);
}
.fv .fv_image h2 {
top:20px;
}
.fv .wrapper.wrap_fv_award {
align-items: flex-end;
transform: translateY(-200px);
margin-bottom: -360px;
}
.fv .wrapper.wrap_fv_award h1 {
position: relative;
/* transform: translateY(50px);
margin-bottom: -50px; */
}
.fv .wrap_awardlabel {
padding-left: 0;
padding-top: 0;
max-width:var(--col8);
}
.fv .wrap_anchorbtn {
bottom:30px;
}

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








/* award */
#award {
padding: 3rem 0 5rem;
background:url(../images/award_bg.jpg) no-repeat center top;
background-size: auto 100%;
color: var(--white);
}
#award .flex {
justify-content: space-between;
align-items: center;
}
#award .flex > figure {
width: 30%;
text-align: center;
}
#award .flex > div {
width: calc(70% - 10px);
font-size: var(--18px);
font-weight: 600;
}
#award .caption {
position: relative;
padding-left: 1rem;
font-size: var(--10px);
font-weight: normal;
}
#award .caption:before {
position: absolute;
top:0;
left: 0;
content: "※";
}



@media screen and (min-width:768px) {
/* award */
#award {
background-size: cover;
padding: 4rem 0 7rem;
}
#award .flex > figure {
width: 100%;
}
#award .flex > div {
margin-top: 1rem;
width: 100%;
font-size: var(--19px);
text-align: center;
}
#award .caption {
display: inline-block;
margin: 1rem auto 0;
text-align: center;
}
}/* award min-width:768px */




/* bestitem */
#bestitem {
position: relative;
background: url(../images/award_bestitem_bg_sp.jpg) no-repeat center center;
background-size: cover;
}
#bestitem:before {
position: absolute;
top: 0;
left:0;
content: "";
display: block;
width: 100%;
height: 100%;
background: rgba(23, 19, 19, .7);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
}
#bestitem h2 {
margin-bottom: 1rem;
font-size: var(--32px);
color:var(--gold_light);
font-weight: 600;
}


@media screen and (min-width:768px) {
/* bestitem */
#bestitem {
background-image: url(../images/award_bestitem_bg.jpg);
}
#bestitem h2 {
margin-bottom: 1.5rem;
font-size: var(--36px);
}
}/* bestitem min-width:768px */


@media screen and (min-width:1080px) {
#bestitem .col6 {
padding-right:calc(17% - 30px);
}
}/* bestitem min-width:1080px */

















/* trouble */
#trouble .title_corner {
position: relative;
margin-bottom: 4rem;
font-size: var(--24px);
}
#trouble .title_corner:before,
#trouble .title_corner:after {
content: "";
position: absolute;
bottom:0;
left:50%;
transform: translateX(-50%);
}
#trouble .title_corner:before {
width: 65%;
height: 1px;
background: var(--gold);
}
#trouble .title_corner:after {
bottom:-8px;
width: 17px;
height: 17px;
border-bottom: 1px solid var(--gold);
border-right: 1px solid var(--gold);
background: var(--gray_dark);
transform: translateX(-50%) rotate(45deg);
}

#trouble dl {
font-family: var(--font-family-min);
}
#trouble dl .strong {
font-weight: 500;
}

#trouble dt {
display: flex;
justify-content: center;
align-items: center;
}
#trouble dt > img {
display: block;
width: 120px;
}
#trouble dt > span {
display: block;
padding-left:20px;
}
#trouble dd {
position: relative;
padding: 2rem;
background: var(--gray_light);
border-radius: 10px;
font-size: var(--16px);
line-height: 2;
max-width: 75%;
margin: 0 auto;
}
#trouble dd:before {
position: absolute;
top:-8px;
left:50%;
content: "";
width: 16px;
height: 16px;
background: var(--gray_light);
transform:  translateX(-50%) rotate(-45deg);
}
#trouble dd strong {
border-bottom: 2px solid var(--gold);
}
#trouble .result {
font-size: var(--20px);
font-family: var(--font-family-min);
color: var(--gold);
}



@media screen and (min-width:768px) {
#trouble .title_corner {
font-size: var(--36px);
margin-bottom: 6rem;
}
#trouble .title_corner:before {
width: 40%;
}
#trouble dl {
display: flex;
flex-wrap: wrap;
}
#trouble dt > img {
width: 60%;
max-width: 200px;
}
#trouble dt > span {
padding-left: 0;
}
#trouble dd {
margin-top: 2rem;
padding:3rem 3rem 3.5rem;
min-height: 300px;
max-width: 100%;
box-sizing: border-box;
font-size: var(--17px);
}
#trouble .col4:nth-of-type(even) > dl {
flex-wrap: wrap-reverse;
}

#trouble .col4:nth-of-type(even) > dl dd {
margin-top: 0;
margin-bottom: 2rem;
}
#trouble .col4:nth-of-type(even) > dl dd:before {
top:auto;
bottom:-8px;
}

#trouble .result {
margin-top: 2rem;
text-align: center;
font-size: var(--30px);
}






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


@media screen and (min-width:1080px) {
#trouble dd {
min-height: 160px;
}

}











/* report */
#report .detail {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-content: flex-start;
padding:3.5rem 3rem;
box-sizing: border-box;
background: var(--gray_dark);
border-radius: 10px;
}
#report .detail > figure {
width: 35%;
}
#report .detail .head {
padding-right: 5%;
width: 60%;
font-family: var(--font-family-min);
color:var(--gold_light);
font-size: var(--18px);
font-weight: 400;
line-height: 1.5;
}
#report .detail .head > .name {
display: block;
margin-top: 1rem;
font-size: var(--14px);
color: #FFF;
}
#report .detail > dl,
#report .detail > p {
width: 100%;
margin-top: 2rem;
padding-top: 2rem;
border-top: 1px solid var(--gray_pale);
}
#report .detail > dl dt {
margin-bottom: .5rem;
color: var(--gold);
}
#report .detail > dl dd {
font-size: var(--16px);
}
#report .detail > dl dd + dt {
margin-top: 2rem;
}
#report .detail .btn_simple {
display: inline-block;
margin-top: 1rem;
padding: 1rem 3rem;
font-size: var(--17px);
}



@media screen and (min-width:768px) {
#report .detail {
padding: 6rem 4rem;
height: 100%;
border-radius: 20px;
}
#report .detail > figure {
width: 160px
}
#report .detail .head {
padding-right: 30px;
width: calc(100% - 190px);
font-size: var(--20px);
}
#report .detail .head > .name {
margin-top: 3rem;
}
#report .detail > dl,
#report .detail > p {
margin-top: 3rem;
padding-top: 3rem;
}

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






/* feature */
#feature .hr-dot {
margin:3rem auto 2rem;
}
.arrow_title {
font-size: var(--26px);
text-align: center;
font-family: var(--font-family-min);
}
.arrow_title::after {
content: "";
display: block;
margin: 1rem auto;
width: 25px;
height: 25px;
border-right: 1px solid #FFF;
border-bottom: 1px solid #FFF;
transform: rotate(45deg);
}
.point_title {
position: relative;
margin-top: 5rem;
padding: 10px 0;
text-align: center;
border-top: 2px solid var(--gray_pale);
border-bottom: 1px solid var(--gray_pale);
font-size: var(--31px);
letter-spacing: 0.1em;
font-family: var(--font-family-min);
color: var(--gold);
}
.point_title:before {
position: absolute;
top:-2px;
left: 50%;
transform: translateX(-50%);
content: "";
display: block;
width: 40%;
height: 2px;
background: var(--gold);
}
.point_title > span {
display: block;
text-align: center;
font-size: 50%;
font-weight: 300;
letter-spacing: normal;
font-family: var(--font-family-en);
}
.point_title > span > strong {
display: inline-block;
margin-left: 5px;
font-size: 160%;
font-weight: 400;
}
.wrap_probe_link li > a {
display: block;
text-align: center;
padding: 5px 0;
border:1px solid #606568;
}
.wrap_probe_link {
padding: 0 10px;
}
.wrap_probe_link .col3 {
padding:15px 5px;
}
.box_graph {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
background-color:#41494D;
padding:10px;
box-sizing: border-box;
border-radius: 10px;
}
.box_graph > div,
.box_graph > h2 {
padding: 15px 10px;
}
.box_graph .sub-title-22 {
margin-bottom: 10px;
}





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

#feature .hr-dot {
margin:5rem auto 4rem!important;
}
.arrow_title {
font-size: var(--36px);
letter-spacing: normal;
}
.arrow_title::after {
margin: 1.5rem auto;
width: 35px;
height: 35px;
}
.point_title {
margin-top: 10rem;
padding: 15px 0 20px;
font-size: var(--36px);
}
.wrap_probe_link {
padding: 0;
}
.wrap_probe_link .col3 {
padding:30px
}
.wrap_probe_link li > a {
padding: 20px 0 10px;
}
.box_graph {
padding:20px 6% 30px;
border-radius: 20px;
}
.box_graph > div,
.box_graph > h2 {
padding: 30px;
}



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



/* interval */
#interval > div {
padding:210px 0 3rem 0;
background: #292f30 url(../images/interval_back_sp.jpg) no-repeat center top;
background-size: 100%;
}
#interval .title_corner {
margin-top:1rem;
margin-bottom:2rem;
font-size: var(--26px);
}
#interval .title_corner:after {
display: none;
}

@media screen and (min-width:768px) {
#interval > div {
padding:8rem 0;
background-color:#191317 ;
background-image: url(../images/interval_back_pc.jpg);
background-position: left center;
background-size: auto 100%;
}
#interval .title_corner {
margin-bottom:4rem;
font-size: var(--36px);
}

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




/* course */
#course .col2{
border: 1px solid #fff;
padding: 10px 0;
margin-bottom: 40px;
}
#course section:nth-of-type(1) h1.col3,
#course section:nth-of-type(1) p.col9{
text-align: left;
}
#course section:nth-of-type(1) h1 span{
font-weight: 600;
font-size: 120%;
}
#course .cleansing p{
background:#4d5256;
padding: 10px 0;
text-align: center;
} 
#course em{
display: inline-block;
margin-right: 8px;
font-family: var(--font-family-en);
font-size: 140%;
font-weight: 400;
vertical-align: middle;
line-height: 1;
transform: translateY(-2px);
}
#course .col4{
padding-bottom: 25px;
margin-top: 1rem;
}
#course .col4 h1{
background-color:var(--black);
padding:2px 0;
margin-bottom: 10px;
text-align: center;
font-weight: 500;
font-family: var(--font-family-min);
color: var(--gold);
}
#course .col4 h2 {
text-align: center;
}
#course .col4 h2 span{
font-size: 80%;
font-weight: 600;
margin-left: 5px;
display: inline-block;
}
#course .cleansing p:after{
content:"";
width: 20px;
height:20px;
border-right: 1px #fff solid;
border-bottom: 1px #fff solid;
display: inline-block;
position: absolute;
right: 0;
left: 0;
bottom: -5px;
margin: auto;
transform: rotate(45deg) ;
}





@media screen and (min-width:768px){
#course section:nth-of-type(1) h1{
border-right: 1px solid #666;
}
#course section .h4 h1:after{
content:"";
width: 20px;
height:20px;
border-right: 1px #fff solid;
border-bottom: 1px #fff solid;
display: inline-block;
position: absolute;
right:0px;
transform: translateY(-90px) rotate(-45deg) ;
}
#course section:last-of-type h1:after{
border:none;
}
#course .cleansing p:after{
left: 17%;
right: auto;
}
#course .col4{
padding-bottom: 20px;
margin-top: 0;
}

}


@media screen and (max-width:767px){
#course .col4:after{
content:"";
width: 20px;
height:20px;
border-right: 1px #fff solid;
border-bottom: 1px #fff solid;
display: inline-block;
position: absolute;
right: 0;
left: 0;
bottom: 4px;
margin: auto;
transform: rotate(45deg) ;
z-index: 1000;
}
#course .col4:last-of-type:after{
border:none;
}
}/* max-width:767px */




/* option */
.course-menu {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
box-sizing: border-box;
margin: 2rem 0 0;
padding-bottom: 1rem;
width: 100%;
border-bottom: 1px solid var(--gold);
}
.course-menu span {
display: block;
margin-bottom: 8px;
width: 49%;
}
.course-menu span:nth-child(n + 5) {
width: 32%;
}

.course-menu span a {
display: block;
padding: .5rem;
background: var(--gray_light);
text-align: center;
font-weight: 500;
font-size: var(--16px);
font-family: var(--font-family-min);
border-radius: 5px;
}
.course-menu span:last-child a {
margin-right: 0;
}
.course-menu span a.selected {
background: var(--gold);
color: #292F30;
}
.course-title {
padding-top: 0;
}
.course-title h3 {
display: flex;
justify-content: center;
align-items: center;
padding: 0 0 1rem;
font-size: var(--18px);
font-weight: 400;
font-family: var(--font-family-min);
line-height: 1.4;
border-bottom: 1px dotted var(--gray_pale);
}
.course-title h3 > span {
display: block;
text-align: center;
}
.course-title h3 > span:first-child {
margin-right: 10px;
}
.course-title h3 > span:nth-child(2),
.course-title h3 > span:nth-child(3) {
width: 28%;
max-width: 160px;
padding-left: 5px;
}

.course-title p {
padding: .3rem 0;
text-align: center;
border-bottom: 1px dotted var(--gray_pale);
font-size: var(--14px);
}
.wrap-course {
display: flex;
flex-wrap: wrap;
justify-content: center;
width: 100%;
padding-bottom: 3rem;
}
.wrap-course .col {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 0;
}
.wrap-course .col > figure {
width: 32%;
}
.wrap-course .col > p {
width: 68%;
padding-left: 15px;
font-size: var(--16px);
box-sizing: border-box;
}
.wrap-course .wrap_detail {
padding:0;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}


@media screen and (min-width:768px) {
.course-menu {
flex-wrap: nowrap;
}
.course-menu span,
.course-menu span:nth-child(n + 5) {
width: 100%;
padding:0 5px;
display: flex;
}
.course-menu span a {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 100%;
padding: .8rem;
line-height: 1.4;
}
.course-title::before {
width: calc(100% - 60px);
}
.course-title h3 {
position: relative;
padding-bottom: 25px;
font-size: var(--26px);
}

.course-title h3 > span:first-child {
margin-right: 30px;
}
.course-title h3 > span:nth-child(2),
.course-title h3 > span:nth-child(3){
padding-left: 10px;
}
.course-title p {
font-size: var(--15px);
}
.wrap-course .col {
width: var(--col6);
padding: 30px;
}
.wrap-course .col > figure {
width: 30%;
}
.wrap-course .col > p {
width: 70%;
padding-left: 30px;
}


}/* min-width:768px */



/* faq */
.wrap_faq:after {
content: "";
display: block;
width: 100%;
height: 1px;
background:var(--gray_pale);
}
.wrap_faq .q,
.wrap_faq .a {
position: relative;
}
.wrap_faq .q {
padding: 1.5rem 3rem 1.5rem 2.5rem;
font-family: var(--font-family-min);
color: var(--white);
font-size: var(--18px);
border-top:1px solid var(--gray_pale);
cursor: pointer;
transition: all .2s;
}
.wrap_faq .q:hover {
opacity: .7;
}
.wrap_faq .q:after {
content: "";
position: absolute;
top:35%;
right:10px;
width: 12px;
height: 12px;
border-bottom: 1px solid var(--gray_pale);
border-right: 1px solid var(--gray_pale);
transform: rotate(45deg);
}
.wrap_faq .q.current:after {
top:40%;
transform: rotate(-135deg);
}
.wrap_faq .a {
display: none;
padding: 2rem 0 2rem 2.5rem;
}
.wrap_faq .q:before,
.wrap_faq .a:before {
position: absolute;
top:10px;
left:0;
content: "Q";
color: var(--gold);
font-size: 20px;
font-family: var(--font-family-en);
font-weight: 300;
}
.wrap_faq .a:before {
content: "A";
color: #FFF;
top:15px;
}
.wrap_faq .a a {
border-bottom: 1px solid var(--gray_pale);
}


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

.wrap_faq .q {
padding: 1.5rem 3rem 1.5rem 4rem;
font-size: var(--20px);
}
.wrap_faq .a {
padding: 1.5rem 0 1.5rem 4rem;
}
.wrap_faq .q:before,
.wrap_faq .a:before {
font-size: 24px;
}
.wrap_faq .a:before {
top:13px;
}

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








/* cosme */
#cosme .list_free {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#cosme .list_free > li {
width: 48%;
margin-top: 5px;
padding:5px;
box-sizing: border-box;
text-align: center;
background: #EFE8D0;
font-weight: 600;
font-size: 80%;
color: var(--black);
border-radius: 5px;
}
#cosme .flex > figure {
width: 30%;
max-width: 200px;
}
#cosme .flex > div {
width: 70%;
box-sizing: border-box;
}
#cosme .flex > div p {
font-size: var(--15px);
}
#cosme .wrap_set {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
justify-content: center;
padding:1.5rem;
/* background: var(--gray_dark); */
background: var(--gray_light);
box-sizing: border-box;
}
#cosme .wrap_set .list_set > li {
margin-left: 2rem;
list-style-type: circle;
font-size: var(--14px);
}
#cosme .wrap_set .salonprice {
/* background: var(--gray_light); */
background: var(--gray_dark);
}



@media screen and (min-width:768px) {
#cosme .list_free > li {
width: 32%;
margin-top: 10px;
}
#cosme .flex > div {
padding-left: 0;
}

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




/* information */
.spec-list dl {
border-top:1px solid #383f42;
padding: .8em 0;
font-size: 93.3%;
letter-spacing: -0.5em;
}
.spec-list dt,
.spec-list dd {
display: inline-block;
vertical-align: top;
letter-spacing: normal;
text-align: left;
}
.spec-list dl:last-of-type {
border-bottom:1px solid #383f42;
margin-bottom: 1em;
}
.spec-list dt {
width: 26%;
font-weight: 600;
}
.spec-list dd {
width: 74%;
}
.wrap_warranty {
margin-top: 3rem;
margin-bottom: 6rem;
padding: 1.5rem 1rem 2rem;
text-align: center;
border: 1px solid #cab266;
border-radius: 10px;
}
.wrap_warranty p,
.wrap_warranty dl {
display: inline-block;
vertical-align: top;
box-sizing: border-box;
}
.wrap_warranty p {
text-align: right;
width: 25%;
padding-top: 10px;
padding-right: 10px;
}
.wrap_warranty dl {
width: 70%;
font-size: 86.6%;
}
.wrap_warranty dt {
margin-bottom: .5rem;
color: #cab266;
font-weight: 600;
font-size: 146%;
}
.wrap_warranty dt,
.wrap_warranty dd {
text-align: left;
}
.price strong {
font-size: 129%;
font-weight: 600;
}
.salonprice {
display: inline-block;
padding: .3rem 1rem .1rem;
/* background: var(--gray_dark); */
background: var(--gray_light);
font-size: var(--14px);
text-align: center;
}
.box_icon {
display: inline-block;
padding: 0 1rem;
margin-right: 1rem;
border: 1px solid #FFF;
}



@media screen and (min-width:768px) {
.wrap_warranty {
margin-top: 3rem;
margin-bottom: 10rem;
padding: 3rem 1rem;
}
.wrap_warranty p,
.wrap_warranty dl {
vertical-align: middle;
}
.wrap_warranty p {
padding-top: 0;
padding-right: 40px;
}
.wrap_warranty dl {
width: 68%;
}

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




/* yaman_concept */
.yaman_concept {
padding-top: 3rem;
padding-bottom: 3rem;
}
.yaman_concept p {
text-align: left;
}
.box_checklist {
position: relative;
margin-top: 3rem;
border: 1px solid #cab266;
padding: 1rem 2rem;
box-sizing: border-box;
color: #cab266;
}
.box_checklist dt {
display: inline-block;
background:#383f42;
padding: 0 2rem;
transform: translateY(-20px);
margin-bottom: -20px;
font-size: 133%;
font-weight: 600;
}
.box_checklist li {
padding: 0 0 15px 25px;
background: url(../images/icon_check.svg) no-repeat 0 2px;
background-size: 15px;
text-align: left;
font-size: 120%;
}

@media screen and (min-width:768px) {
.box_checklist {
margin-top: 5rem;
padding: 2rem 3rem 3rem;
}
.box_checklist dt {
transform: translateY(-36px);
margin-bottom: -36px;
font-size: 146%;
}
.box_checklist ul {
display: inline-block;
}
.box_checklist li {
padding: 0 0 20px 30px;
background-size: 20px;
background-position: 0 8px;
}

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




/* loan */
#loan {
/* background: #161b1c; */
}
#loan h2 {
font-size: var(--24px);
text-align: center;
}

@media screen and (min-width:768px) {
#loan h2 {
font-size: var(--30px);
}
}/* loan min-width:768px */




/* rental */
/* 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: #e4d8b2;
}
#rental .flow_rental li figure {
width: 45%;
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: 50%;
}

.list_default li {
position: relative;
padding-left: 1rem;
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-around;
}
#rental .flow_rental li {
display: block;
width: 100%;
max-width: 280px;
}
#rental .flow_rental li + li {
margin-top: 0;
}
#rental .flow_rental li .num {
font-size: 45px;
}
#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 */