@charset "UTF-8";
/* sp
----------------------------------------------- */
.top-more {width: 70vw;padding: 6vw 0;margin: auto;font-size: 4vw;font-family: "Jost";font-optical-sizing: auto;font-weight: 300;text-align: center;letter-spacing: 0.4vw;background: #d7cbbf;-moz-border-radius: 15vw;-webkit-border-radius: 15vw;border-radius: 15vw;position: relative;}
.top-more:after { content: ''; width: 2vw; height: 2vw; background: var(--red); -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; top: 50%; right: 8vw; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.top-more02 {width: 50vw;padding: 8vw 0;margin: auto;font-size: 4vw;font-family: "Jost";font-optical-sizing: auto;font-weight: 300;letter-spacing: 0.4vw;border-bottom: 1px solid #93968f;position: relative;}

.top-info { padding: 20vw 0; background: #f6f1ef; }
.top-info-title { margin: 0 auto 12vw; text-align: center; position: relative; display: table; }
.top-info-title:before { content: ''; width: 2.8vw; height: 2.8vw; background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; position: absolute; top: -5vw; left: -5vw; }
.top-info-title .en { margin-bottom: 4vw; font-size: 10vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; letter-spacing: 0.6vw; display: block; }
.top-info-title .jp { font-size: 3.68vw; font-family: var(--mincho); display: block; }
.top-info-content { width: 90vw; margin: 0 auto; }
.top-info-text { padding: 6vw; background: var(--white); border-radius: 2vw; box-shadow: 0 2vw 4vw rgba(0, 0, 0, 0.1); }
.top-info-text p { font-size: 3.68vw; text-align: justify; text-justify: inter-ideograph; font-feature-settings: "palt"; line-height: 2; letter-spacing: 0.04em; }
.top-info-text p .sub-title { font-weight: 600; color: var(--red); font-size: 4.2vw; display: block; margin-bottom: 4vw; padding-bottom: 2vw; text-align: center; border-bottom: 2px solid var(--red); }
.top-info-map { margin: 2vw 0; padding: 1vw 0; color: var(--red); text-decoration: underline; font-weight: 600; text-align: center; border: 1px solid var(--red); border-radius: 50px; }

.top-first {padding: 16vw 0 28vw;}
.top-first .parallax-box {width: 70vw;margin: 0 auto 20vw;}
.top-first-image { width: 100%; }
.top-first-text { width: 70vw; margin: 0 auto; }
.top-first-title {padding-left: 8vw;margin-bottom: 12vw;position: relative;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-flex-wrap: wrap;flex-wrap: wrap;-webkit-align-items: baseline;align-items: baseline;}
.top-first-title:before { content: ''; width: 2.8vw; height: 2.8vw; background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; position: absolute; top: -8vw; left: 0; }
.top-first-title .jp { margin-right: 2.5vw; font-size: 7vw; font-family: var(--mincho); }
.top-first-title .en { color: #c5bbb2; font-size: 4vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; }
.top-first-subtitle { margin-bottom: 8vw; font-size: 5vw; font-family: var(--mincho); font-weight: 600; line-height: 1.6; }
.top-first-comment {margin-bottom: 8vw;}
.top-first-comment p { font-size: 3.68vw; text-align: justify; text-justify: inter-ideograph; font-feature-settings: "palt"; line-height: 2; letter-spacing: 0.04em; }
.top-first-comment .jp {margin-bottom: 8vw;}
.top-first-comment .en { font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; text-align: left; }

.top-menu {padding: 1.1vw 0 16vw;background: url(../images/top-menu-bg.jpg) no-repeat top center;background-size: cover;}
.top-menu-gallery-items { width: 100%; margin: -16vw 0 12vw; }
.top-menu-gallery-item { width: 578vw; color: #000; font-size: 18.42vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; letter-spacing: 1vw; }
.top-menu-content { width: 90vw; margin: auto; position: relative; }
.top-menu-head {width: 80vw;padding: 8vw 0 0 32vw;margin: 0 auto 10vw;color: #fff;position: relative;}
.top-menu-title { -ms-writing-mode: tb-rl; writing-mode: tb-rl; position: absolute; top: 0; left: 0; }
.top-menu-title .en { font-size: 3.68vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; letter-spacing: 0.6vw; display: block; }
.top-menu-title .en:before { content: ''; width: 2.8vw; height: 2.8vw; margin-bottom: 2.5vw; background: url(../images/deco01.png) no-repeat center; background-size: 100%; display: inline-block; }
.top-menu-title .jp { height: 36vw; font-size: 6.58vw; font-family: var(--mincho); letter-spacing: 0.4vw; position: absolute; top: 8vw; right: -14vw; }
.top-menu-subtitle { font-size: 3.68vw; text-align: justify; text-justify: inter-ideograph; font-feature-settings: "palt"; line-height: 1.8; letter-spacing: 0.04em; }
.top-menu-subtitle .jp { margin-bottom: 4vw; font-size: 3.6vw; font-family: var(--mincho); display: block; letter-spacing: 0.05rem; }
.top-menu-subtitle .en { font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; text-align: left; letter-spacing: 0.05rem; display: block; }
.top-menu-items {width: 100%;margin: 0 auto 10vw;}
.top-menu-items li { width: 100%; border-bottom: 1px solid #a1a1a1; position: relative; }
.top-menu-items a { padding: 6vw 8vw 6vw 0; color: #fff; background: url(../images/arrow01.png) no-repeat center right 4vw; background-size: 2.8vw; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; align-items: center; }
.top-menu-item-badge { width: 18vw; height: 18vw; margin-right: 6vw; font-size: 3.16vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; text-align: center; line-height: 1.4; letter-spacing: 0.4vw; background: var(--red); -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
.top-menu-item-badge:before { content: ''; width: calc(100% - 4px); height: calc(100% - 4px); border: 1px solid #fff; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; opacity: 0.6; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.top-menu-item-title { flex: 1; }
.top-menu-item-title .en { font-size: 140%; }
.top-menu-item-title .min { padding: 1vw 2vw; margin-bottom: 2vw; font-size: 3.42vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.4vw; border: 1px solid #fff; -moz-border-radius: 10vw; -webkit-border-radius: 10vw; border-radius: 10vw; display: table; }
.top-menu-item-title .title { font-size: 3.95vw; font-family: var(--mincho); font-weight: 600; line-height: 1.4; }
.top-menu-more { color: #fff; background: none; border: 1px solid #fff; }

.top-campaign {padding: 20vw 0;background: url(../images/top-campaign-bg.jpg) no-repeat top center;background-size: cover;}
.top-campaign-title, .top-staff-title, .top-voice-title, .top-salon-title {margin: 0 auto 12vw;text-align: center;position: relative;display: table;}
.top-campaign-title:before, .top-staff-title:before, .top-voice-title:before, .top-salon-title:before { content: ''; width: 2.8vw; height: 2.8vw; background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; position: absolute; top: -5vw; left: -5vw; }
.top-campaign-title .en, .top-staff-title .en, .top-voice-title .en, .top-salon-title .en {margin-bottom: 4vw;font-size: 12vw;font-family: "Cormorant Garamond";font-optical-sizing: auto;font-weight: 500;letter-spacing: 0.05rem;letter-spacing: 0.6vw;display: block;}
.top-campaign-title .jp, .top-staff-title .jp, .top-voice-title .jp, .top-salon-title .jp { font-size: 3.68vw; font-family: var(--mincho); display: block; }
.top-campaign .parallax-box { width: 90%; margin: 0 auto 10vw; }
.top-campaign-image { width: 100%; }
.top-campaign-items { width: 100%; margin: 0 auto 22vw; }
.top-campaign-item { width: 90vw; padding: 4vw 0; margin: 0 4vw; text-align: center; border-right: 1px solid #a1a0a0; }
.top-campaign-item-badge { margin-bottom: 5vw; }
.top-campaign-item-badge .number { margin-bottom: 1vw; color: var(--red); font-size: 3.68vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; line-height: 1.8; letter-spacing: 0.4vw; display: block; }
.top-campaign-item-badge .title { font-size: 5.26vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; display: block; }
.top-campaign-item-title { margin-bottom: 6vw; }
.top-campaign-item-title .min { padding: 1.5vw 2.5vw; margin: 0 auto 4vw; color: var(--white); font-size: 3.4vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.4vw; background: var(--red); -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; display: table; }
.top-campaign-item-title .title { font-size: 4.74vw; font-family: var(--mincho); line-height: 1.4; display: block; }
.top-campaign-item-more { width: 45vw; padding: 4vw 0; margin: auto; font-size: 3.68vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; text-align: center; letter-spacing: 0.4vw; background: url(../images/arrow01.png) no-repeat center right 5vw; background-size: 2vw; border: 1px solid #a9a8a0; -moz-border-radius: 15vw; -webkit-border-radius: 15vw; border-radius: 15vw; position: relative; }

.top-staff {padding: 20vw 0;}
.top-staff-items {width: 100%;margin: 0 auto 20vw;}
.top-staff-items .slick-dots { bottom: -8vw; }
.top-staff-items .slick-dots li.slick-active button { background: #d8cbbf; }
.top-staff-items .slick-dots li button { border-color: #d8cbbf; }
.top-staff-item { width: 80vw;padding: 10vw 12vw 12vw;margin: 0 4vw;background: #f6f1ef;overflow: hidden;position: relative; }
.top-staff-item-badge {color: #d8cbbf;font-size: 14vw;font-family: var(--mincho);font-optical-sizing: auto;font-weight: 500;letter-spacing: 0.05rem;position: absolute;right: 5vw;bottom: -4vw;}
.top-staff-item-image {width: 54vw;margin: 0 auto 5vw;}
.top-staff-item-name {margin-bottom: 4vw;text-align: center;}
.top-staff-item-name .en {margin-bottom: 2vw;font-size: 5.26vw;font-family: "Cormorant Garamond";font-optical-sizing: auto;font-weight: 500;letter-spacing: 0.05rem;letter-spacing: 0.6vw;display: block;}
.top-staff-item-name .jp {font-size: 7vw;font-family: var(--mincho);}
.top-staff-item-comment p { font-size: 4vw; font-family: var(--mincho); font-weight: 600; text-align: center; text-justify: inter-ideograph; font-feature-settings: "palt"; line-height: 1.8; letter-spacing: 0.05rem; }
.top-staff-item-comment.l03 p { font-size: 3.6vw; line-height: 1.3; }

.top-voice { padding: 10vw 0 20vw; }
.top-voice-title { margin-bottom: 2vw; }
.top-voice-items {width: 80vw;margin: 0 auto 0vw;}
.top-voice-items li { width: 100%; padding: 12vw 5vw; border-bottom: 1px solid #b8b6b3; }
.top-voice-items li:last-child { border: none; }
.top-voice-item-badge { margin: 0 auto 8vw; font-size: 13.16vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; text-align: center; letter-spacing: 0.4vw; position: relative; display: table; }
.top-voice-item-badge:before { content: ''; width: 24vw; height: 12vw; background: url(../images/top-voice-item-badge-deco@2x.png) no-repeat center; background-size: 100%; z-index: 1; position: absolute; top: 0; left: -12vw; }
.top-voice-item-title { margin-bottom: 6vw; font-size: 5.26vw; font-family: var(--mincho); text-align: center; line-height: 1.6; }
.top-voice-item-comment p { font-size: 3.68vw; text-align: justify; text-justify: inter-ideograph; font-feature-settings: "palt"; line-height: 1.8; letter-spacing: 0.05rem; }

.top-gallery-items { margin-bottom: 20vw; }
.top-gallery-items li img { width: 70vw; }

.top-salon { padding: 1px 0 25vw; background: url(../images/top-salon-bg.jpg) no-repeat center; background-size: cover; }
.top-salon-text { width: 85vw; padding: 20vw 10vw; margin: -2px 0 0 auto; background: var(--white); }
.top-salon-title { margin: 0 0 12vw 5vw; text-align: left; }
.top-salon-address { margin-bottom: 5vw; }
.top-salon-address .title { width: fit-content; margin: 0 0 2vw; padding: 1.5vw 2.5vw; color: var(--white); font-size: 4vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.04rem; background: var(--red); -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; }
.top-salon-address .address { font-size: 3.68vw; line-height: 1.4; }
.top-salon-tel { margin-bottom: 12vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; }
.top-salon-tel .title { width: fit-content; margin: 0 0 2vw; padding: 1.5vw 2.5vw; color: var(--white); font-size: 4vw; letter-spacing: 0.04rem; background: var(--red); -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;  }
.top-salon-tel .number { font-size: 7vw; text-decoration: underline; letter-spacing: 0.04rem; display: table; }
.top-salon-more { width: 100%; margin-left: 0; }

.top-qa { padding: 20vw 0 15vw; background: url(../images/bg01.jpg) repeat top center; background-size: 250vw; }
.top-qa-title { width: 90%; padding-left: 5vw; margin: 0 auto 12vw; position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: baseline; align-items: baseline; }
.top-qa-title:before { content: ''; width: 2.8vw; height: 2.8vw; background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; position: absolute; top: -6vw; left: 0; }
.top-qa-title .en { margin-right: 2.5vw; font-size: 12vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; }
.top-qa-title .jp { color: #3a505c; font-size: 3.68vw; font-family: var(--mincho); }
.top-qa-items { width: 80vw; margin: 0 auto 10vw; counter-reset: number 0; }
.top-qa-items li { position: relative; }
.top-qa-items li:before { content: "Q"; color: var(--red); font-size: 6vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; position: absolute; top: 5vw; left: 0; }
.top-qa-item-question { padding: 4vw 12vw 4vw 8vw; font-size: 3.95vw; font-family: var(--mincho); line-height: 1.4; border-bottom: 0.5px solid var(--red); cursor: pointer; position: relative; }
.top-qa-item-question.open:after { -moz-transform: translateY(-50%) rotate(180deg); -ms-transform: translateY(-50%) rotate(180deg); -webkit-transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg); }
.top-qa-item-question:after { content: ''; width: 6vw; height: 6vw; background: url(../images/arrow01.png) no-repeat center; background-size: 1.5vw; border: 0.5px solid var(--red); -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; top: 50%; right: 2vw; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); -moz-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
.top-qa-item-answer { padding: 4vw 2vw; font-size: 3.5vw; text-align: justify; line-height: 1.6; display: none; }
.top-qa-more { margin: 0 auto 10vw; }
.top-qa-item-answer a { width: fit-content; font-weight: bold; text-decoration: underline; position: relative; }
.top-qa-item-answer a::after { content: ''; width: 100%; height: 100%; background: url(../images/arrow04.png) no-repeat right; background-size: auto 52%; position: absolute; top: 0; right: -5vw; }
.top-faq-gallery-items { width: 100%; }
.top-faq-gallery-item { width: 435vw; font-size: 21.05vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; letter-spacing: 1vw; opacity: 0.2; }

.top-news { padding: 30vw 0 10vw; }
.top-news-title { margin: 0 auto 12vw; text-align: center; position: relative; display: table; }
.top-news-title:before { content: ''; width: 2.8vw; height: 2.8vw; background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; position: absolute; top: -5vw; left: -5vw; }
.top-news-title .jp { margin-bottom: 4vw; font-size: 8vw; font-family: var(--mincho); display: block; }
.top-news-title .en { color: #c5bbb2; font-size: 4vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; letter-spacing: 0.6vw; display: block; }
.top-news-text { width: 70vw; margin: 0 auto 6vw; font-size: 5vw; font-family: var(--mincho); font-weight: 600; line-height: 1.6; }
.top-news-items { width: 70vw; margin: 0 auto; }
.top-news-items li { width: 100%; margin-bottom: 8vw; }
.top-news-item-image {position: relative;overflow: hidden;padding-top: 56.25%;border: 1px solid #eee; margin-bottom: 5vw;}
.top-news-item-image img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
.top-news-item-time { margin-bottom: 1vw; font-size: 3.68vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.02rem; display: block; }
.top-news-item-title { font-size: 3.95vw; line-height: 1.6; }

/* =============================================
pc
================================================*/

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

.top-more { width: 360px; padding: 28px 0 25px; font-size: 20px; letter-spacing: 2px; }
.top-more:after { width: 10px; height: 10px; right: 35px; }
.top-more02 { width: 190px; padding: 25px 5px; margin: 0; font-size: 20px; letter-spacing: 2px; }
.top-more02:after { width: 10px; height: 10px; right: 20px; }

.top-info { margin-top: 100px; padding: 120px 0; }
.top-info-title { margin-bottom: 60px; }
.top-info-title:before { width: 14px; height: 14px; top: -30px; left: -30px; }
.top-info-title .en { margin-bottom: 20px; font-size: 60px; letter-spacing: 6px; }
.top-info-title .jp { font-size: 16px; }
.top-info-content { width: 900px; margin: 0 auto; }
.top-info-text { padding: 40px; border-radius: 10px; }
.top-info-text p { font-size: 16px; text-align: center; }
.top-info-text p .sub-title { font-size: 18px; margin-bottom: 20px; padding-bottom: 10px; }
.top-info-map { width: fit-content; margin: 10px auto; padding: 4px 40px; }

.top-first { padding: 120px 0 140px; }
.top-first-content { width: 960px; margin: auto; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: flex-start; align-items: flex-start; }
.top-first .parallax-box { width: 440px; margin: 0 auto; order: 1; }
.top-first-text { width: 440px; padding: 30px 0 0 20px; order: 0; }
.top-first-title { padding: 0; margin-bottom: 50px; }
.top-first-title:before { width: 14px; height: 14px; top: -40px; left: -30px; }
.top-first-title .jp { margin-right: 20px; font-size: 30px; }
.top-first-title .en { font-size: 20px; letter-spacing: 2px; }
.top-first-subtitle { margin-bottom: 30px; font-size: 20px; }
.top-first-comment { margin-bottom: 50px; }
.top-first-comment p { font-size: 14px; }
.top-first-comment .jp { margin-bottom: 30px; }
.top-first-more { margin: 0; }

.top-menu {padding-bottom: 120px;background: url(../images/top-menu-bg-pc.jpg) no-repeat top center;background-size: cover;}
.top-menu-gallery-items { width: 100%; height: 90px; margin: -88px 0 120px; overflow: hidden; }
.top-menu-gallery-item { width: 3060px; font-size: 90px; letter-spacing: 10px; }
.top-menu-content { width: 900px; }
.top-menu-head { width: 100%; padding: 0 0 0 250px; margin-bottom: 30px; }
.top-menu-title .en { font-size: 20px; letter-spacing: 4px; }
.top-menu-title .en:before { width: 14px; height: 14px; margin-bottom: 12px; }
.top-menu-title .jp { height: 360px; font-size: 60px; letter-spacing: 6px; top: 60px; right: -140px; }
.top-menu-subtitle .jp { margin-bottom: 25px; font-size: 20px; }
.top-menu-subtitle .en { font-size: 20px; }
.top-menu-items { width: 650px; margin: 0 0 80px auto; }
.top-menu-items a { padding: 40px 60px 40px 20px; background-position: center right 40px; background-size: 10px; }
.top-menu-item-badge { width: 75px; height: 75px; margin-right: 30px; font-size: 14px; letter-spacing: 2px; }
.top-menu-item-title .min { padding: 5px 8px 4px; margin-bottom: 10px; font-size: 12px; letter-spacing: 4px; }
.top-menu-item-title .title { font-size: 18px; }

.top-campaign {padding: 120px 0;background: url(../images/top-campaign-bg-pc.jpg) no-repeat top center;background-size: cover;}
.top-campaign-title, .top-staff-title, .top-voice-title, .top-salon-title { margin-bottom: 60px; }
.top-campaign-title:before, .top-staff-title:before, .top-voice-title:before, .top-salon-title:before { width: 14px; height: 14px; top: -30px; left: -30px; }
.top-campaign-title .en, .top-staff-title .en, .top-voice-title .en, .top-salon-title .en { margin-bottom: 20px; font-size: 60px; letter-spacing: 6px; }
.top-campaign-title .jp, .top-staff-title .jp, .top-voice-title .jp, .top-salon-title .jp { font-size: 16px; }
.top-campaign .parallax-box { width: 560px; margin: 0 auto 60px; }
.top-campaign .top-campaign-image { width: 100%; }
.top-campaign-items { width: 959px; margin-bottom: 160px; }
.top-campaign-items .slick-dots { bottom: -50px; }
.top-campaign-items .slick-dots li { width: 35px; height: 5px; margin: 0 10px; }
.top-campaign-item { width: 320px; padding: 20px 0; margin: 0; }
.top-campaign-item-badge { margin-bottom: 30px; }
.top-campaign-item-badge .number { margin-bottom: 20px; font-size: 14px; letter-spacing: 4px; }
.top-campaign-item-badge .title { font-size: 20px; letter-spacing: 4px; }
.top-campaign-item-title { margin-bottom: 30px; }
.top-campaign-item-title .min {padding: 5px 8px 4px;margin-bottom: 10px;font-size: 14px;letter-spacing: 4px;}
.top-campaign-item-title .title { font-size: 18px; }
.top-campaign-item-title .title small { font-size: 90%; }
.top-campaign-item-more { width: 180px; padding: 16px 0; font-size: 14px; letter-spacing: 2px; background-position: center right 20px; background-size: 8px; }

.top-staff { padding: 120px 0; }
.top-staff-items { width: 960px; margin-bottom: 120px; }
.top-staff-items .slick-dots { bottom: -50px; }
.top-staff-items .slick-dots li { width: 35px; height: 5px; margin: 0 10px; }
.top-staff-item { width: 280px; height: 500px; padding: 30px 30px 50px; margin: 0 15px; }
.top-staff-item-badge {font-size: 60px;right: -4px;bottom: -10px;}
.top-staff-item-image { width: 100%; margin-bottom: 20px; }
.top-staff-item-name .en { margin-bottom: 6px; font-size: 20px; letter-spacing: 2px; }
.top-staff-item-name .jp { font-size: 24px; }
.top-staff-item-name { margin-bottom: 10px; }
.top-staff-item-comment p { font-size: 15px; text-align: center; }
.top-staff-item-comment.l03 p { font-size: 14px; line-height: 1.8; }

.top-voice { padding: 80px 0 120px; }
.top-voice-title { width: 840px; text-align: left; margin-bottom: 40px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: baseline; align-items: baseline; }
.top-voice-title .en { margin: 0 30px 0 0; }
.top-voice-items { width: 900px; margin-bottom: 40px; }
.top-voice-items li { padding: 40px 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; align-items: center; }
.top-voice-item-badge { padding-left: 50px; margin: 0 auto; font-size: 50px; letter-spacing: 2px; }
.top-voice-item-badge:before { width: 96px; height: 44px; left: 0; }
.top-voice-item-text { width: 680px; }
.top-voice-item-title { margin-bottom: 25px; font-size: 20px; text-align: left; }
.top-voice-item-comment p { font-size: 16px; }

.top-gallery-items { margin-bottom: 120px; }
.top-gallery-items li img { width: 400px; }

.top-salon { padding-bottom: 190px; background: url(../images/top-salon-bg-pc.jpg) no-repeat center; background-size: cover; }
.top-salon-content { width: 900px; margin: auto; }
.top-salon-text { width: 750px; padding: 70px 0 100px 140px; z-index: 1; position: relative; }
.top-salon-text:after { content: ''; width: 100vw; height: 100%; background: var(--white); z-index: -1; position: absolute; top: 0; left: 0; }
.top-salon-title { margin: 0 0 60px; }
.top-salon-address { margin-bottom: 25px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: flex-start; align-items: flex-start; }
.top-salon-address .title { width: 130px; margin: 0 20px 0 0; padding: 6px 0; font-size: 16px; text-align: center; line-height: 1.6; letter-spacing: 4px; }
.top-salon-address .address { font-size: 16px; line-height: 1.6; }
.top-salon-tel { margin-bottom: 50px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: flex-start; align-items: flex-start; }
.top-salon-tel .title { width: 130px; margin: 0 20px 0 0; padding: 6px 0; font-size: 16px; text-align: center; line-height: 1.6; letter-spacing: 4px; }
.top-salon-tel .number { font-size: 24px; line-height: 1.6; letter-spacing: 2px; }

.top-qa { padding: 150px 0; background-size: 2000px; }
.top-qa-content { width: 90%; max-width: 940px; margin: auto; position: relative; }
.top-qa-title { padding-left: 30px; margin: 0 auto 40px; }
.top-qa-title:before { width: 14px; height: 14px; top: -30px; left: 0; }
.top-qa-title .en { margin-right: 30px; font-size: 60px; letter-spacing: 4px; }
.top-qa-title .jp { font-size: 16px; }
.top-qa-items { width: 100%; margin-bottom: 60px; }
.top-qa-items li:before {font-size: 28px;top: 36px;left: 20px;}
.top-qa-item-question { padding: 40px 65px 40px 60px; font-size: 20px; }
.top-qa-item-question:after { width: 40px; height: 40px; background-size: 8px; right: 25px; }
.top-qa-item-answer { padding: 30px 0 30px 60px; font-size: 15px; line-height: 1.8; }
.top-qa-more.top-more { z-index: 1; position: absolute; top: -10px; right: 0; }
.top-qa-item-answer a::after { right: -25px; transition: all .6s; }
.top-qa-item-answer a:hover::after { right: -30px; }
.top-faq-gallery-items { height: 180px; margin-bottom: -100px; overflow: hidden; }
.top-faq-gallery-item { width: 2600px; font-size: 180px; letter-spacing: 10px; }

.top-news {padding: 120px 0 60px;}
.top-news-content { width: 900px; margin: auto; position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
.top-news-title { width: 225px; padding-left: 25px; margin: 30px 0 40px; text-align: left; }
.top-news-title:before { width: 14px; height: 14px; top: -30px; left: 0; }
.top-news-title .jp { margin-bottom: 15px; font-size: 30px; }
.top-news-title .en { font-size: 20px; letter-spacing: 2px; }
.top-news-text { width: 225px; margin: 0 auto 30px; font-size: 18px; }
.top-news-items { width: 620px; margin: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
.top-news-items li { width: 280px; margin-bottom: 40px; }
.top-news-item-image { margin-bottom: 20px; }
.top-news-item-time { margin-bottom: 2px; font-size: 14px; letter-spacing: 2px; }
.top-news-item-title { font-size: 20px; }
.top-news-more { position: absolute; top: 240px; left: 0; }
}

/* retina用
----------------------------------------------- */
@media screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 736px) and (min-resolution: 2dppx) {
.top-first-title:before { background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; }
.top-menu { background: url(../images/top-menu-bg-pc@2x.jpg) no-repeat top center; background-size: cover; }
.top-menu-title .en:before { background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; }
.top-menu-items a { background: url(../images/arrow01@2x.png) no-repeat center right 40px; background-size: 10px; }
.top-campaign { background: url(../images/top-campaign-bg-pc@2x.jpg) no-repeat top center; background-size: cover; }
.top-campaign-title:before, .top-staff-title:before, .top-voice-title:before, .top-salon-title:before { background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; }
.top-campaign-item-more { background: url(../images/arrow01@2x.png) no-repeat center right 20px; background-size: 8px; }
.top-voice-item-badge:before { background: url(../images/top-voice-item-badge-deco@2x.png) no-repeat center; background-size: 100%; }
.top-salon { background: url(../images/top-salon-bg-pc@2x.jpg) no-repeat center; background-size: cover; }
.top-faq-title:before { background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; }
.top-news-title:before { background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; }
}
