@charset "UTF-8";

.top-campaign{margin: 0 auto;width: 88%;}
.top-campaign img{width: 100%;}

.top-about{background: url(../images/top-about-bg.png) top -3vw right no-repeat;background-size: 50%;margin: 0 auto;padding: 14vw 0 0;margin-bottom: 14vw;}
.top-about-content{width: 88%;margin: 0 auto;}
.top-about-ttl{margin-bottom: 8vw;letter-spacing: 0.08em;}
.top-about-ttl img{width: 221px;margin-bottom: 30px;}
.top-about-ttl .jp{display: block;font-size: 6vw;font-weight: bold;margin-bottom: 3vw;letter-spacing: 0.04em;}
.top-about-ttl .en{font-family: "Jost", sans-serif;font-size: 3.6vw;letter-spacing: 0.1em;}
.top-about-text{text-align: justify;text-justify: inter-ideograph;font-feature-settings: "palt";line-height: 1.8;letter-spacing: 0.04em;margin-bottom: 4vw;}

.top-reasons {background: #111;padding: 2vw 0 18vw;color: #fff;}
.top-reasons-head {background: url(../images/top-reason-bg.jpg) top center no-repeat;padding: 30vw 0 0 0;height: 56vw;background-size: cover;margin-bottom: 8vw;}
.top-reasons-title {padding: 7vw 0 4vw 6vw;width: 64vw;background: #111;color: #fff;border-radius: 0 30px 0 0;}
.top-reasons-title .en {font-size: 10vw;margin-bottom: 0vw;display: block;font-family: "Jost", sans-serif;letter-spacing: 0.08em;line-height: 1.4;}
.top-reasons-title .jp {font-size: 3.5vw;}
.top-reasons-text{text-align: justify;text-justify: inter-ideograph;font-feature-settings: "palt";line-height: 1.8;letter-spacing: 0.04em;width: 88%;margin: 0 auto 6vw;}

.top-reasons-items {width: 94%;margin: 0 0 0 auto;}
.top-reasons-items .prev,.top-reasons-items .next{width: 12vw;height: 12vw;font-size: 4.2vw;background: #111;-moz-border-radius: 50%;-webkit-border-radius: 50%;border-radius: 50%;z-index: 2;cursor: pointer;position: absolute;top: -45vw;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;color: #fff;}
.top-reasons-items .prev {left: 65vw;}
.top-reasons-items .next {left: 79vw;}

.top-reasons-item {width: 79vw;position: relative;margin-right: 7vw;}
.top-reasons-item img {width: 100%;margin: 0 auto 6vw;}
.top-reasons-item-text {width: 80vw;}
.top-reasons-item-title {font-size: 5.8vw;line-height: 1.4;text-align: justify;text-justify: inter-ideograph;font-feature-settings: "palt";line-height: 1.4;letter-spacing: 0.04em;margin-bottom: 1vw;font-family: "Jost", sans-serif;}
.top-reasons-item-title span{position: relative;margin-right: 6vw;}
.top-reasons-item-title span:after{content: "";width: 14px;height: 1px;margin-right: 10px;background: #fff;position: absolute;bottom: 4px;right: -7vw;}
.top-reasons-item-comment p {text-align: justify;text-justify: inter-ideograph;font-feature-settings: "palt";line-height: 1.8;letter-spacing: 0.04em;color: #c3c3c3;}

.top-menu{background: url(../images/top-menu-bg.jpg)top center no-repeat;background-size: 100%;position: relative;padding: 23vw 0 25vw;margin-bottom: 10vw;}
.top-menu-ens { width: 100%; position: absolute; bottom: -2vw; left: 0; }
.top-menu-en-title {color: #fff;font-size: 15vw;letter-spacing: 0.08em;font-family: "Jost", sans-serif;font-weight: 500;margin-right: 2vw;}
.top-menu-title{text-align: center;margin-top: 1vw;}
.top-menu-title span{background: #fff;font-weight: bold;font-size: 4.4vw;padding: 0.5% 1%;}

.top-case{margin-bottom: 26vw;}
.top-case .more01{margin: 0 auto;}
.top-case-items {width: 100%;padding-bottom: 8vw;margin-bottom: 6vw;}
.top-case-item { width: 80vw; margin: 0 2.5vw; }
.top-case-item-image { width: 100%; }

.top-salon {margin-bottom: 14vw;background: #f0f2f4;padding: 10vw 6vw 0;}
.top-salon img{width: 100%;margin: -20vw auto 6vw;}
.top-salon-text {text-align: justify;text-justify: inter-ideograph;font-feature-settings: "palt";line-height: 1.8;letter-spacing: .04em;text-align: center;position: relative;}
.top-salon-name{font-size: 5.6vw;font-weight: bold;margin-bottom: 2vw;}
.top-salon-address {line-height: 1.8;letter-spacing: .02em;margin-bottom: 3vw;}
.top-salon-tel {margin: 0 auto;font-size: 8vw;letter-spacing:.04em;display: table;line-height: 1.5;font-family: "Jost", sans-serif;color: var(--gold);}
.top-salon-tel:before {content: 'TEL.';font-size: 65%;display: inline-block;font-weight: 500;}
.top-salon-open {margin-bottom: 6vw;line-height: normal;letter-spacing: .02em;}
.top-salon-map {height: 60vw;width: 100%;margin: 0 auto;margin-top: 10vw;}
.top-salon .more01{margin: 0 auto;text-align: left;}

.top-pickup {width: 88%;margin: 0 auto;}
.top-pickup-items {margin: 0 auto 14vw;display: -webkit-flex;display: flex;-webkit-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: flex-start;align-items: flex-start;}
.top-pickup-items li {width: 46%;margin-bottom: 10vw;}
.top-pickup-items li:nth-child(3){margin: 0 auto;}
.top-pickup-item-image { width: 100%; margin-bottom: 4vw; position: relative; }
.top-pickup-item-image img { width: 100%; }
.top-pickup-item-image span {font-size: 3.4vw;letter-spacing: 0.08em;z-index: 1;position: absolute;right: 2vw;bottom: 1.7vw;font-family: "Jost", sans-serif;color: #333;}
.top-pickup-item-title { text-align: center; }
.top-pickup-item-title .en {margin-bottom: 1.5vw;font-size: 5.8vw;letter-spacing: 0.06em;display: block;font-family: "Jost", sans-serif;}
.top-pickup-item-title .jp {display: block;color: #777;font-size: 3.3vw;}

.top-column {padding: 16vw 0;background: #f2f0ec;}
.top-column-content { width: 90vw; margin: auto; }
.top-column-items {width: 100%;margin: auto;display: -webkit-box;display: -moz-box;display: -webkit-flex;display: box;display: flex;justify-content: flex-start;-webkit-justify-content: flex-start;align-items: flex-start;-webkit-align-items: flex-start;flex-wrap: wrap;-webkit-flex-wrap: wrap;gap: 6vw 4vw;}
.top-column-items li { width: 100%; }
.top-column-item-image {width: 100%; margin-bottom: 4vw; position: relative;overflow: hidden;padding-top: 56.25%;border: 1px solid #eee;}
.top-column-item-image img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
.top-column-item-time {margin-bottom: 2.6vw;font-size: 4vw;font-family: "Jost", sans-serif;color: var(--gold);letter-spacing: .04em;display: table;}
.top-column-item-title {margin-bottom: 1vw;line-height: 1.4;font-size: 4.6vw;font-weight: bold;}
.top-column-item-comment p { font-size: 3.29vw; text-align: justify; text-justify: inter-ideograph; font-feature-settings: "palt"; line-height: 1.8; letter-spacing: 0.04em;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}


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


.top-campaign{margin: 0 auto;width: 88%;}
.top-campaign img{width: 100%;}

.top-about{background: url(../images/top-about-bg.png) top 0px right no-repeat;background-size: 50%;padding: 80px 0 0;margin-bottom: 100px;}
.top-about-content{width: 88%;margin: 0 auto;}
.top-about-ttl{margin-bottom: 50px;}
.top-about-ttl img{width: 210px;margin-bottom: 30px;}
.top-about-ttl .jp{font-size: 30px;margin-bottom: 16px;}
.top-about-ttl .en{font-size: 18px;}
.top-about-text{margin-bottom: 30px;font-size: 16px;line-height: 1.9;}

.top-reasons {padding: 15px 0 100px;}
.top-reasons-head {background: url(../images/top-reason-bg.jpg) top center no-repeat;padding: 170px 0 0 0;height: 290px;background-size: 100%;margin-bottom: 40px;}
.top-reasons-title {padding: 26px 0 30px 40px;width: 370px;}
.top-reasons-title .en {font-size: 55px;}
.top-reasons-title .jp {font-size: 16px;}
.top-reasons-text{width: 88%;margin: 0 auto 40px;}

.top-reasons-item {width: 450px;margin-right: 30px;}
.top-reasons-items .slick-list {width: 530px;margin: 0 0 0 auto;}
.top-reasons-items .prev,.top-reasons-items .next{width: 60px;height: 60px;font-size: 20px;top: -230px;}
.top-reasons-items .prev {left: auto;right: 90px;}
.top-reasons-items .next {left: auto;right: 20px;}

.top-reasons-item img {margin: 0 auto 24px;}
.top-reasons-item-text {width: 450px;}
.top-reasons-item-title {font-size: 24px;margin-bottom: 8px;}
.top-reasons-item-title span{margin-right: 20px;}
.top-reasons-item-title span:after{right: -27px;}

.top-menu{background: url(../images/top-menu-bg.jpg)top center no-repeat;background-size: 100%;position: relative;padding: 140px 0 150px;margin-bottom: 60px;}
.top-menu-en-title {font-size: 70px;margin-right: 14px;}
.top-menu-title span{font-size: 20px;padding: 5px 10px;}

.top-case{margin-bottom: 180px;}
.top-case-items {padding-bottom: 44px;margin-bottom: 50px;}
.top-case-item {width: 450px;margin: 0 15px;}

.top-salon {margin-bottom: 80px;padding: 100px 40px 90px;}
.top-salon img{margin: -180px auto 50px;}
.top-salon-name{font-size: 26px;margin-bottom: 10px;}
.top-salon-address {margin-bottom: 14px;}
.top-salon-tel {font-size: 40px;}
.top-salon-open {margin-bottom: 30px;}
.top-salon-map {height: 310px;margin-top: 60px;}

.top-pickup {width: 88%;margin: 0 auto;}
.top-pickup-items {margin: 0 auto 70px;}
.top-pickup-items li {width: 46%;margin-bottom: 60px;}
.top-pickup-item-image {margin-bottom: 30px;}
.top-pickup-item-image span {font-size: 18px;right: 10px;bottom: 10px;}
.top-pickup-item-title .en {margin-bottom: 10px;font-size: 32px;}
.top-pickup-item-title .jp {font-size: 16px;}

.top-column { padding: 100px 0; }
.top-column-content {width: 95%;max-width: 1200px;}
.top-column-items {gap: 50px 20px;}
.top-column-items li {width: 48%;}
.top-column-item-image {margin-bottom: 14px;}
.top-column-item-time {font-size: 15px;letter-spacing: 1px;margin-bottom: 10px;}
.top-column-item-title {margin-bottom: 0;font-size: 16px;}
.top-column-item-comment p { font-size: 14px; line-height: 1.8; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; }
.top-column-items li:nth-child(2){display:block;}

}

/* =============================================
retina用
================================================*/
@media screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 736px) and (min-resolution: 2dppx) {
.top-about{background-image: url(../images/top-about-bg@2x.png);}
.top-reasons-head {background-image: url(../images/top-reason-bg@2x.jpg) ;}
.top-menu{background-image: url(../images/top-menu-bg@2x.jpg);}

}
