@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&display=swap');
html{font-family:'游ゴシック体', 'Yu Gothic', YuGothic, sans-serif;color: #322b2b;background: #fefdfa;}
.font-en{font-family: 'Zen Old Mincho', serif;}
@media all and (-ms-high-contrast:none){html{font-family: 'メイリオ', 'Meiryo', sans-serif;}}

body{font-family:'游ゴシック体', 'Yu Gothic', YuGothic, sans-serif;color: #322b2b;background: #fefdfa;opacity: 0;animation: bodyAppear .3s .3s forwards;}
@keyframes bodyAppear {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
body a{transition:0.2s;color: #322b2b}
body a:hover{text-decoration: none;color: #322b2b}
.container {padding-right: 0px!important;padding-left: 0px!important;}
.row {margin-right: 0px!important;margin-left: 0px!important;}
.row.ft_sns_row {margin: 0 auto 0 auto!important;}
.row.ft_row {margin: 0 auto 0 auto!important;}
p{margin-bottom: 0!important;}
.tategaki{writing-mode: vertical-rl;-ms-writing-mode: tb-rl;-webkit-writing-mode:vertical-rl;}

/*共通
----------------------------------------------------------------*/
.flex-btw {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap; -webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}
.flex-nml {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.item-cen {align-items: center;}
.mt10 {margin-top: 10px;}
.mt15 {margin-top: 15px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}
.mt50 {margin-top: 50px;}
.mt80 {margin-top: 80px;}
.mt100 {margin-top: 100px;}
.mt130 {margin-top: 130px;}
.w100 {max-width: 100%;min-height: auto!important;}
.inner {max-width: 1280px;margin: 0 auto;padding: 0 2%;position: relative;}
.max__inner {max-width: 1920px;margin: 0 auto;padding: 0 2%;}
.sp{display: none!important;}
.pc{display: block!important;}
.font-en {font-family:'Amiri', serif;}
.font-jp {font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}

.btn01 {display: block;}
.btn01 a {position: relative;max-width: 200px;width: 100%;height: fit-content;display: block;transition: .5s;}
.btn01 a::before {position: absolute;content: "";top: 50%;right: 0%;background: #322b2b;width: 40px;height: 1px;transition: .3s;}
.btn01 a:hover::before {right: -5%;}
.btn01_txt {background: #f5e9a7;padding: 15px 30px 10px;max-width: 180px;width: 100%;font-size: 15px;text-align: center;letter-spacing: 0.1em;font-weight: 600;}

.btn02 {display: block;}
.btn02 a {width: 100%;max-width: 210px;background: url(../images/arow.png) no-repeat center right 15% / 100px;display: block;cursor: pointer;transition: .5s;text-align: left;margin: 50px 0 0 auto;}
.btn02 a:hover {background: url(../images/arow.png) no-repeat center right 8% / 100px;}
.btn02_txt {font-size: 18px;font-weight: 500;color: #322b2b;}

.ttlbox {z-index: 0;position: relative;margin: 0 auto 100px;}
.ttl01 {position: relative;font-size: 36px;font-weight: 400;text-align: center;margin: 0 auto;font-style: italic;letter-spacing: 0.1em;}
.txt01 {margin-top: 5px;text-align: center;font-size: 18px;font-weight: 500;}
.ttlbox::after {content: '';position: absolute;top: -30%;left: 50%;transform: translate(-50%) rotate(30deg);width: 1px;height: 130px;background-color: #a88b45;z-index: -1;}

.btn-ctp {position: absolute;content: '';top:71%;right: 50%;transform: translate(-50%);z-index: 100;}
.btn-ctp a {display: inline-block;}
.btn-ctp a img {max-width: 35px;width: 100%;height: 150px;}
.main {position: relative;}
.btn-pagetop a {display: inline-block;}

@media screen and (max-width: 1224px) {
    .btn-ctp a img {height: 120px;}
}
@media screen and (max-width: 900px) {
    .btn-ctp a img {height: 90px;}
}
@media screen and (max-width: 768px) {
    .mt30 {margin-top: 20px;}
    .mt50 {margin-top: 30px;}
    .mt80 {margin-top: 40px;}
    .mt100 {margin-top: 50px;}
    .mt130 {margin-top: 80px;}
    .sp{display: block!important;}
    .pc{display: none!important;}
    .btn-ctp a img {height: 85px;}
}
@media screen and (max-width: 480px) {
    .btn-ctp {top:69%;}
    .btn-ctp a img {height: 70px;}
}
@media screen and (max-width: 414px) {
    .btn01 a{padding: 10px 10px;}
    .btn01_txt {font-size: 16px;}
    .btn02 a {padding: 10px 10px;}
}
@media screen and (max-width: 376px) {
    .btn-ctp {display: none;}
}

/*header
----------------------------------------------------------------*/
.head_inner {max-width: 1720px;min-height: auto !important;margin: 0 auto;padding:15px;}
.head_flex {justify-content: flex-end;}
.head_left {width: 13%;}
.head_left a {display: inline-block;}
.head_left img {max-width: 197px;}
.head_cen01 {width: 60%;display: block;}
.head_cen02 {display: none;}
.hd_nav_flex {}
.hd_nav_item {width: 7%;}
.hd_nav_item:nth-child(2) {width: 6%;}
.hd_nav_item:nth-child(3) {width: 12%;}
.hd_nav_item:nth-child(4) {width: 16%;}
.hd_nav_item:nth-child(5) {width: 8%;}
.hd_nav_item:nth-child(6) {width: 8%;}
.hd_nav_item:nth-child(7) {width: 14%;}
.hd_nav_item:nth-child(8) {width: 8%;}
.hd_nav_item a {text-align: center;position: relative;}
.hd_nav_item a .hover {height: 25px;width: 100%;text-align: center;position: relative;}
.hd_nav_item a:hover .hover::before {content: '';position: absolute;top: 0%;left: 50%;transform: translate(-50%) rotate(30deg);width: 2px;height: 20px;background-color: #a88b45;}
.hd_nav_ttl {font-size: 12px;letter-spacing: 0.15em;}
.hd_nav_txt {letter-spacing: 0.15em; font-size:12px;}
.head_right {width: 22%;}
.head_right_item01 {justify-content: flex-start;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: justify;-ms-flex-pack: justify;align-items: center;}
.head_right_line {margin-left: 30px;}
.head_right_tel a {display: inline-block;}
.head_right_tel p {font-size: 20px;letter-spacing: 0.15em;}
.head_right_item02 {margin: 8px 0 0;justify-content: flex-start;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: justify;-ms-flex-pack: justify;align-items: center;}
.head_right_contact {width: 170px;margin-right: 10px;}
.head_right_contact a {display: inline-block;}
.head_right_form {width: 170px;}
.head_right_form a {display: inline-block;}

@media screen and (max-width: 1716px) {
}
@media screen and (max-width: 1682px) {
    .head_flex {align-items: center;}
    .head_left img {max-width: 170px;}
    .head_cen01 {width: 62%;}
    .head_right {width: 23%;}
    .head_right_contact {width: 165px;}
    .head_right_form {width: 165px;}
}
@media screen and (max-width: 1550px) {
    .head_flex {justify-content: space-between;}
    .head_left img {max-width: 197px;}
    .head_cen01 {display: none;}
    .head_cen02 {display: block;width: 100%;}
    .head_left {width: 18%;}
    .head_right {width: 35%;}
    .head_right_contact {width: 180px;}
    .head_right_form {width: 180px;}
}
/* @media screen and (max-width: 1549px) {
    .head_cen01 {width: 53%;}
    .hd_nav_item:nth-child(2) {width: 22%;}
    .head_right {width: 28%;}
} */

@media screen and (max-width: 1115px) {
    .head_right {width: 38%;}
}
@media screen and (max-width: 1029px) {
    .head_right {width: 43%;}
}
@media screen and (max-width: 950px) {
    .head_cen02 {display: none;}
    .head_right {display: none;}
    .sp_nav_flex {text-align: center;}
    .sp_nav_item {padding: 10px 0;position: relative;}
    .sp_nav_item::after {position: absolute;width: 30px;height: 1px;background: #a88b45;bottom: 0;left: 50%;transform: translate(-50%);content: "";}
}
@media screen and (max-width: 913px) {
    .head_right {width: 50%;}
}
@media screen and (max-width: 789px) {
    .head_right {width: 53%;}
}


/*top_concept
----------------------------------------------------------------*/
.top_concept {padding: 100px 0;position: relative;z-index: 0;}
.top_concept::after {content: "";position: absolute;width: 86%;height: 67%;background: #fff;top: 32%;right: 0;z-index: -1;}
.concept_left {width: 48%;margin-top: 100px;}
.ttl02 {font-size: 30px;font-weight: 400;line-height: 1.8;letter-spacing: 0.15em;}
.concept_txt {margin-top: 50px;font-size: 15px;line-height: 1.8;letter-spacing: 0.15em;}
.concept_right {width: 67%;margin-right: calc(50% - 45vw);}
.top_concept .btn01 {margin-top: 50px;}

@media screen and (max-width: 1798px) {
    .concept_right {width: 60%;}
    .top_concept::after {width: 89%;}
}
@media screen and (max-width: 1620px) {
    .concept_right {width: 55%;}
    .top_concept::after {width: 93%;}
}
@media screen and (max-width: 1491px) {
    .concept_right {width: 48%;margin-right:0;}
    .top_concept::after {width: 95%;}
}
@media screen and (max-width: 1400px) {
    .top_concept::after {width: 97%;}
}
@media screen and (max-width: 1320px) {
    .top_concept::after {width: 100%;}
}
@media screen and (max-width: 1080px) {
    .top_concept {padding: 80px 0;}
    .concept_left {width: 100%;margin-top: 0;}
    .concept_right {width: 100%;margin: 60px auto 0 0;text-align: right;}
    .top_concept::after {top: 17%;height: 63%;}
}
@media screen and (max-width: 768px) {
    .top_concept::after {height: 68%;}
}
@media screen and (max-width: 414px) {
    .ttl02 {font-size: 26px;}
    .concept_txt {margin-top: 30px;}
    .top_concept .btn01 {margin-top: 30px;}
    .top_concept::after {top: 18%;}
    .top_concept {padding: 60px 0;}
}

/*top_menu
----------------------------------------------------------------*/
.top_menu {padding: 200px 0 180px;position: relative;z-index: 0;}
.top_menu::before {content: "";position: absolute;width: 86%;height: 68%;background: url(../images/menu_bg.jpg);top: 7%;left: 0;z-index: -1;background-repeat: no-repeat;}
.top_menu::after {content: "";position: absolute;width: 86%;height: 67%;background: #fcf5eb;top: 32%;right: 0;z-index: -2;}
.menu_flex {align-items: center;}
.menu_left {width: 250px;}
.menu_right {width: calc(100% - 250px);}
.menu_item a {display: inline-block;}
.top_menu .btn01 a {margin: 80px 0 0 auto;}
.top_menu .ttlbox {margin: 0;}

@media screen and (max-width: 1798px) {
    .top_menu::before {width: 90%;height: 63%;top: 10%;}
}
@media screen and (max-width: 1620px) {
    .top_menu::before {width: 94%;height: 58%;top: 15%;}
}
@media screen and (max-width: 1491px) {
    .top_menu::before {width: 96%;}
}
@media screen and (max-width: 1400px) {
    .top_menu::before {width: 98%;}
}
@media screen and (max-width: 1320px) {
    .top_menu::before {width: 100%;}
}
@media screen and (max-width: 1224px) {
    .top_menu::after {height: 60%;}
}
@media screen and (max-width: 1198px) {
    .menu_right {gap: 30px;}
    .menu_item {width: calc((100% - 30px * 2) / 3);}
}
@media screen and (max-width: 1080px) {
    .top_menu {padding: 100px 0;}
    .menu_left {width: 100%;}
    .menu_right {width: 100%;margin: 80px auto 0;text-align: center;}
    .top_menu::before {height: 77%;background-size: cover;top: 6%;}
    .top_menu::after {height: 65%;}
}
@media screen and (max-width: 768px) {
    .top_menu {padding: 80px 0;}
    .top_menu::before {height: 77%;}
    .top_menu .btn01 a {margin: 50px 0 0 auto;}
}
@media screen and (max-width: 414px) {
    .top_menu {padding: 60px 0;}
    .top_menu::before {height: 92%;top: 0%;}
    .menu_item {width: 100%;}
}

/*top_gallery
----------------------------------------------------------------*/
.top_gallery {padding: 100px 0 200px;position: relative;z-index: 0;}
.top_gallery::before {content: "";position: absolute;width: 63%;height: 80%;background: #fff;top: 9%;right: 0;z-index: -2;}
.top_gallery::after {content: "";position: absolute;width: 70%;height: 85%;background: #f9f6f3;top: 17%;left: 0;z-index: -3;}
.gallery_flex {align-items: center;}
.gallery_left {margin-left: calc(50% - 45vw);position: absolute;content: "";top: -45%;z-index: -1;}
.gallery_right {width: 50%;margin: 0 0 0 auto;}
.gallery_txt {max-width: 450px;margin: 0 auto;line-height: 1.8;font-size: 15px;letter-spacing: 0.15em;}
.top_gallery .btn01 a {margin: 80px auto 0;}

@media screen and (max-width: 1660px) {
    .gallery_left {margin-left: calc(50% - 50vw);}
}
@media screen and (max-width: 1491px) {
    .top_gallery::before {height: 70%;}
    .top_gallery::after {top: 17%;}
    .gallery_left {max-width: 650px;width: 100%;}
}
@media screen and (max-width: 1224px) {
    .top_gallery {padding: 80px 0 100px;}
    .top_gallery::before {height: 85%;}
    .top_gallery::after {width: 74%;height: 85%;}
    .gallery_left {max-width: 550px;}
}
@media screen and (max-width: 1080px) {
    .top_gallery::before {height: 60%;width: 90%;top: 38%;}
    .top_gallery::after {width: 70%;height: 65%;top: 41%;}
    .gallery_left {max-width: 100%;position: relative;margin-left:0;}
    .gallery_right {width: 100%;margin: 80px 0 0 auto;}
}
@media screen and (max-width: 768px) {
    .top_gallery {padding: 80px 0;}
    .top_gallery .btn01 a {margin: 50px auto 0;}
    .top_gallery .ttlbox {margin: 0 auto 60px;}
}
@media screen and (max-width: 600px) {
    .top_gallery::before {width: 100%;}
}
@media screen and (max-width: 414px) {
    .top_gallery {padding: 60px 0;}
    .top_gallery::before {height: 67%;top: 30%;}
    .top_gallery::after {height: 63%;}
    .gallery_right {margin: 60px 0 0 auto;}
    .top_gallery .btn01 a {margin: 30px auto 0;}
}

/*top_hairdonation
----------------------------------------------------------------*/
.top_hairdonation {padding: 150px 0 100px;}
.hair_flex {align-items: center;}
.hair_left {width: 48%;}
.top_hairdonation .ttlbox {max-width: 285px;width: 100%;margin: 0 auto 100px 0;}
.hair_txt {font-size: 15px;line-height: 1.8;letter-spacing: 0.15em;max-width: 500px;}
.hair_right {width: 65%;margin-right: calc(50% - 45vw);}
.top_hairdonation .btn01 {margin-top: 70px;}

@media screen and (max-width: 1696px) {
    .hair_right {width: 60%;}
}
@media screen and (max-width: 1568px) {
    .hair_right {width: 50%;margin-right: 0;}
}
@media screen and (max-width: 1080px) {
    .hair_left {width: 100%;}
    .hair_right {width: 100%;margin: 80px 0 0 auto;text-align: right;}
}
@media screen and (max-width: 768px) {
    .top_hairdonation .ttlbox {margin: 0 auto 60px 0;}
    .hair_right {text-align: center;}
    .top_hairdonation .btn01 {margin-top: 50px;}
}
@media screen and (max-width: 414px) {
    .top_hairdonation {padding: 100px 0 80px;}
    .hair_right {margin: 60px 0 0 auto;}
}

/*top_shopinfo
----------------------------------------------------------------*/
.top_shopinfo {padding: 100px 0 100px;position: relative;z-index: 0;}
.top_shopinfo::before {content: "";position: absolute;width: 53%;height: 68.5%;background: #f9f6f3;top: 17%;left: 50%;transform: translate(-50%);z-index: -1;}
.access_flex {align-items: center;}
.access_left {width: 48%;}
.access_left iframe {border: none;max-width: 100%;width: 100%;}
.access_right {width: 48%;}
.access_col {margin-bottom: 30px;}
.access_col:last-child {margin-bottom: 0px;}
.access_ttl {font-size: 18px;font-weight: 600;}
.access_txt {font-size: 16px;margin-top: 10px;}
.top_shopinfo .btn01 a {margin: 80px auto 0;}

@media screen and (max-width: 1491px) {
    .top_shopinfo::before {width: 65%;}
}
@media screen and (max-width: 1224px) {
    .top_shopinfo::before {width: 75%;}
}
@media screen and (max-width: 1080px) {
    .top_shopinfo {padding: 80px 0;}
    .top_shopinfo::before {width: 100%;height: 81.5%;top: 10%;}
    .top_shopinfo .ttlbox {margin: 0 auto 80px;}
    .access_flex {flex-direction: column-reverse;}
    .access_left {width: 100%;margin-top: 60px;}
    .access_right {width: 100%;}
}
@media screen and (max-width: 768px) {
    .top_shopinfo::before {width: 100%;height: 81.5%;top: 10%;}
}

/*top_news
----------------------------------------------------------------*/
.top_news {padding: 100px 0;}
.news_flex {align-items: center;}
.news_left {width: 95px;}
.news_right {width: calc(100% - 300px);}

@media screen and (max-width: 768px) {
    .top_shopinfo {padding: 60px 0;}
    .news_left {width: 100%;}
    .news_right {width: 100%;}
}
@media screen and (max-width: 414px) {
    .top_news {padding: 35px 0;}
}

/*footer
----------------------------------------------------------------*/
.footer {padding: 50px 0;background: #f0e8dc;}
.ft_flex {align-items: center;justify-content: center;}
.ft_left {align-items: center;width: 60%;justify-content: flex-end;}
.ft_logo {width: 200px;}
.ft_logo a {display: inline-block;}
.ft_location {width: calc(100% - 400px);margin-left: 50px;}
.ft_loca_txt {font-size: 18px;line-height: 1.8;}
.tel_flex {justify-content: flex-start;align-items: baseline;margin-top: 10px;}
.tel_subtxt {font-size: 16px;padding-right: 5px;}
.tel_txt {font-size: 21px;font-weight: 500;letter-spacing: 0.15em;}
.ft_right {width:40%;align-items: center;}
.ft_line {width: 40px;}
.ft_line a {display: inline-block;}
.ft_contact {width: calc(100% - 90px);}
.ft_contact a {display: inline-block;}
.ft_nav {margin-top: 80px;text-align: center;line-height: 3;}
.copywriter {text-align: center;font-size: 13px;margin-top: 50px;font-weight: 500;}

@media screen and (max-width: 1080px) {
    .ft_flex {max-width: 500px;width: 100%;margin: 0 auto;}
    .ft_left {width: 100%;justify-content: space-between;}
    .ft_location {width: calc(100% - 250px);margin-left: 0px;}
    .ft_right {width: 100%;margin-top: 35px;margin: 35px auto 0;text-align: center;justify-content: center;}
    .ft_contact {width: auto;margin-left: 30px;}
    .ft_nav {margin-top: 60px;}
    .copywriter {margin-top: 35px;}
}
@media screen and (max-width: 482px) {
    .ft_logo {width: 100%;text-align: center;}
    .ft_location {width: 100%;text-align: center;margin-top: 30px;}
    .ft_nav {display: none;}
    .tel_flex {justify-content: center;}
}
@media screen and (max-width: 400px) {
    .ft_right {display: none;}
}
