@charset "utf-8";

/*=====================================================================================*/
@media screen and (max-width:940px) {
.inner{padding:30px;}
}

/*=====================================================================================*/
@media screen and (max-width:768px) {
#menu h2,
#menu_pricelist h2,
#cocoloya h2{font-size: 3rem;}
}

/*=====================================================================================*/

@media screen and (max-width:960px) {
.header-area h1{font-size:4rem;}
.header-area h2{font-size:2rem;}
.header-area h3{font-size:2rem;}
.header-area p{font-size:0.8rem; whitewhite-space:no}
.header-area p br{display: block;}
}

/*=====================================================================================*/
@media screen and (max-width:1060px) {
#lead .lead-img{width:30%;}
#lead .lead-area{width:68%;}
}

@media screen and (max-width:768px) {
#lead{flex-direction: column-reverse;}
#lead .lead-img,
#lead .lead-area{width:100%;}
#lead .lead-img{min-height: 250px;}
#lead .lead-area{margin: 0 0 18px 0; min-height: 20em; justify-content: center;}
}

@media screen and (max-width:1300px) {
#lead .lead-area h2{line-height:2;}
#lead .lead-area p{line-height: 2.3;}
}

@media screen and (max-width:768px) {
#lead .lead-area .lead-btn{width:100%; top: 50px; text-align: center;}
#lead .btn04{width:300px; padding:18px 0;}

#lead .lead-area h2,
#lead .lead-area p{width:auto;}

#lead .lead-area h2{margin:0 0 0 20px; line-height: 2.2;}
#lead .lead-area p{line-height: 2;}
#lead .lead-area .lead-btn a{

-ms-writing-mode: lr-tb;
-webkit-writing-mode: horizontal-tb;
writing-mode: horizontal-tb;

}

}

@media screen and (max-width:470px) {
#lead .lead-area h2{line-height: 1.8;}
#lead .lead-area p{text-align: left; padding: 18px; /*height: 23em;*/}

_:-ms-lang(x)::-ms-backdrop, #lead .lead-area p{width:8em;}
#lead .lead-area p br{display: none;}
}


@media screen and (max-width:350px) {
#lead .lead-area h2{line-height: 1.6;}
#lead .lead-area p {line-height: 1.8;}
}


/*=====================================================================================*/
@media screen and (max-width:768px) {
#menu .btn04{width:300px; padding:18px 0;}
}

/*=====================================================================================*/
@media screen and (max-width:768px) {
#news h6{text-align: left;}
#news p{text-align: left;}
}

/*=====================================================================================*/
@media screen and (max-width:1190px) { /* #contact .contact-img{width:60%;} #contact .contact-area{width:35%;} */}
@media screen and (max-width:768px) {
#menu_pricelist-sub .contact-img,
#menu_pricelist-sub .contact-area{width:100%;}
#menu_pricelist-sub .contact-img{margin:0 0 50px 0; width:100%; min-height: 250px;}
}

@media screen and (max-width:480px) {
#menu_pricelist-sub .contact-img,
#menu_pricelist-sub .contact-area{width:100%;}
#menu_pricelist-sub .contact-img{margin:0 0 50px 0; width:100%; min-height: 250px;}
}

/*=====================================================================================*/
@media screen and (max-width:1190px) { /* #contact .contact-img{width:60%;} #contact .contact-area{width:35%;} */}
@media screen and (max-width:768px) {
#contact .contact-img,
#contact .contact-area{width:100%;}
#contact .contact-img{margin:0 0 50px 0; width:100%; min-height: 220px;}
}

@media screen and (max-width:480px) {
#contact .contact-img,
#contact .contact-area{width:100%;}
#contact .contact-img{margin:0 0 50px 0; width:100%; min-height: 200px;}
}


/*=====================================================================================*/
@media screen and (max-width:1190px) {/* #contact-salon .contact-img{width:35%;} #contact-salon .contact-area{width:65%;} */ }
@media screen and (max-width:768px) {
#contact-salon .contact-img,
#contact-salon .contact-area{width:100%;}
#contact-salon .contact-img{margin:0 0 50px 0; width:100%; min-height: 220px;}
}

@media screen and (max-width:480px) {
#contact-salon .contact-img,
#contact-salon .contact-area{width:100%;}
#contact-salon .contact-img{margin:0 0 50px 0; width:100%; min-height: 200px;}
}


/*=====================================================================================*/
@media screen and (max-width:1300px) {
    .cocoloya-area figure p{font-size: 1.2rem;}
    .cocoloya-area figure p span{font-size: 0.8rem; display: block;}
    .cocoloya-area h3{margin: 8px auto 0; font-size:0.8rem;}
    .cocoloya-area .cap p {margin:0 0 4px 0; font-size:0.8rem;}

}
@media screen and (max-width:820px){

    .cocoloya-area article:nth-of-type(1){width:48%; margin: 0 1%;}
    .cocoloya-area article:nth-of-type(2){width:48%; margin: 0 1%;}
    .cocoloya-area article:nth-of-type(3){width:48%; margin: 8px auto;}
}

@media screen and (max-width:520px) {.cocoloya-area figure p{font-size: 1rem;} }
@media screen and (max-width:480px){
    .cocoloya-area article:nth-of-type(1){width:100%; margin: 0 auto 8px;}
    .cocoloya-area article:nth-of-type(2){width:100%; margin: 0 auto 8px;}
    .cocoloya-area article:nth-of-type(3){width:100%; margin: 0 auto 0;}
}

@media screen and (max-width:450px){
  .cocoloya-area h3{font-size:0.9rem;}
  .cocoloya-area p{display: none;}
}


@media screen and (max-width:820px) {
.cocoloya-area img{width:100%; height:auto;} 
}
  
@media screen and (max-width:450px){
.cocoloya-area img{width:100%; height:auto;}
}
/*=====================================================================================*/
@media screen and (max-width:1081px) {
    #footer dl,
    #footer .footer-list,
    #footer small{width:100%; text-align: center;}
    #footer dl{margin: 50px 0;}
}
@media screen and (max-width:768px) { #footer dl dd{font-size: 1.5rem;} }


/*=====================================================================================*/
/* footer ***************************************/
@media screen and (min-width:400px) {
#footer dl dt br{display: none;}
}

@media screen and (max-width: 399px) {
#footer dl dt br{display: block;}
}
/*=====================================================================================*/
/* menu_pricelist***************************************/
@media screen and (min-width:1025px) {
#menu_pricelist {padding:70px 0; margin: 0 auto;}
.menu_pricelist-area{display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto 80px;}
.menu_pricelist-menu-box{width:50%;  margin: 0 auto 80px; padding: 0 2%;}
}

@media screen and (min-width:940px) and (max-width:1024px) {
#menu_pricelist {padding:60px 18px; margin: 0 auto;}
.menu_pricelist-area{display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto;}
.menu_pricelist-menu-box{width:100%;  margin: 0 auto 80px; padding: 0;}
}

@media screen and (min-width:600px) and (max-width:939px) {
#menu_pricelist {padding:50px 18px; margin: 0 auto;}
.menu_pricelist-area{display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto;}
.menu_pricelist-menu-box{width:100%;  margin: 0 auto 80px; padding: 0;}
}

@media screen and (max-width: 599px) {
#menu_pricelist {padding:40px 18px; margin: 0 auto;}
#menu_pricelist p{margin: 0 auto;}
.menu_pricelist-area{display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto;}
.menu_pricelist-menu-box{width:100%;  margin: 0 auto 80px; padding: 0;}
}


/*=====================================================================================*/
/**--table_price ---------------------------------------------**/
@media screen and (min-width:940px) and (max-width:1025px) {
.table_price{width: 100%; margin:0 auto 18px; border-collapse: collapse; letter-spacing: 0.1em;}
.table_price th{text-align: left; font-size: 1rem; font-weight: normal; padding:8px; border-bottom: 1px solid #d4c7b5; line-height:1.8;}
.table_price td{text-align: right; color:#746456; font-size: 1rem; font-weight: normal; padding:8px; border-bottom: 1px solid #d4c7b5;}
.table_price th span{display: block; font-size: 0.8rem;}
.table_price td span{/*display: block;*/ font-size: 0.8rem; margin-right:18px;}
.table_price th.nor {white-space: nowrap;}
.table_price td.nor {white-space: nowrap;}
.table_price thead th{padding:0; background-color: #ffffff; border-bottom: 1px solid #ebefe2;}
.table_price p{margin:0 auto; padding:0;}
}

@media screen and (max-width:940px) {
.table_price{width: 100%;}
.table_price thead{display: none;}
.table_price tr{display: block; margin: 22px auto 0; width: 100%;}
.table_price th{display:list-item; border-bottom: 1px solid #d4c7b5;}
.table_price td{display:list-item; border-bottom: 1px solid #d4c7b5;}
.table_price th{background-color:#FCFBF5; list-style-type: none;}
.table_price td{background-color:#FCFBF5; margin: 0 auto 4px; padding:2px 8px; list-style-type: none;}
}