@charset "utf-8";
/* CSS Document */

/*** reset ***************************************************/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
	word-break:break-all;
    border:0;
    outline:0;
    vertical-align:baseline;
    background:transparent;
	font-style:normal;
}
button, input, select, textarea {
	background-color:transparent;
	border-style:none;
}

* {
	-webkit-box-sizing: border-box;
	-mos-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {  display:block; }
ul,
ul li{ list-style:none; }
img{ vertical-align:bottom; border-radius:8px; }

a:link, a:visited { text-decoration:none; }
a:active, a:hover { text-decoration:none; }

body { width:100%; min-width:1200px; line-height:1; background:#F5F3EB; font-size:1rem; color:#3b3632; font-family:"Noto Sans JP", sans-serif; font-style:normal; letter-spacing:0.1rem; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; color:#3b3632; outline:none; }
section { margin:2rem auto; padding:2rem 0; }
@media screen and (min-width: 768px) {
.sp-only { display: none !important; }
}
@media screen and (max-width: 769px) {
.pc-only { display: none !important; }
}
/*** splash ***************************************************/
#splash {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999;
  background:#f0dc55;
  text-align:center;
  color:#fff;
}
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#splash_logo img {
  width:260px;
}

/*** hamburger_menu ***************************************************/

@keyframes bugfix {
  from {
    padding: 0;
  }
  to {
    padding: 0;
  }
}
@-webkit-keyframes bugfix {
  from {
    padding: 0;
  }
  to {
    padding: 0;
  }
}
#overlay-button {
  position:fixed;
  right: 2rem;
  top: 2rem;
  padding: 26px 11px;
  z-index: 6;
  cursor: pointer;
  user-select: none;
}
#overlay-button span {
  height: 4px;
  width: 35px;
  border-radius: 2px;
  background-color: #000;
  position: relative;
  display: block;
  transition: all .2s ease-in-out;
}
#overlay-button span:before {
  top: -10px;
  visibility: visible;
}
#overlay-button span:after {
  top: 10px;
}
#overlay-button span:before, #overlay-button span:after {
  height: 4px;
  width: 35px;
  border-radius: 2px;
  background-color: #000;
  position: absolute;
  content: "";
  transition: all .2s ease-in-out;
}
#overlay-button:hover span, #overlay-button:hover span:before, #overlay-button:hover span:after {
  background: #000;
}
input[type=checkbox] {
  display: none;  
}
input[type=checkbox]:checked ~ #overlay {
  visibility: visible; 
}
input[type=checkbox]:checked ~ #overlay-button:hover span, input[type=checkbox]:checked ~ #overlay-button span {
  background: transparent;
}
input[type=checkbox]:checked ~ #overlay-button span:before {
  transform: rotate(45deg) translate(7px, 7px);
}
input[type=checkbox]:checked ~ #overlay-button span:after {
  transform: rotate(-45deg) translate(7px, -7px);
}
#overlay {
  height: 100vh;
  width: 50vw;
  background: #F8F6F1;
  z-index: 5;
  visibility: hidden;
  position: fixed;
  left:50%;
}
#overlay.active {
}
#overlay ul {
  display: flex;
  flex-direction: column;
  height: 50vh;
  padding:12%;
  list-style-type: none;
}
#overlay ul li {
  padding: 1em;
}
#overlay ul li a {
  font-family:"Noto Sans JP", sans-serif;
  text-decoration: none;
  font-size: 1.3rem;
  font-weight:700;
}
#overlay ul li a:hover {
  color: #b77373!important;
}

/*** animation ***************************************************/

.anim-slidein {
	 opacity: 0;
  }

.slideIn {
	animation-name:slideInAnime;
	animation-duration:3s;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
	opacity: 0;
}
 
@keyframes slideInAnime {
  0% {
	opacity: 0;
    transform: translateY(300px);
  }
  100% {
    opacity: 1;	  
    transform: translateY(0);
　}
}

.anim-slideRt {
	 opacity: 0;
  }

.slideRt {
	animation-name:slideRtAnime;
	animation-duration:3s;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
	opacity: 0;
}
 
@keyframes slideRtAnime {
  0% {
	opacity: 0;
    transform: translateX(300px);
  }
  100% {
    opacity: 1;	  
    transform: translateX(0);
　}
}

.anim-slideLf {
	 opacity: 0;
  }

.slideLf {
	animation-name:slideLfAnime;
	animation-duration:3s;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
	opacity: 0;
}
 
@keyframes slideLfAnime {
  0% {
	opacity: 0;
    transform: translateX(-300px);
  }
  100% {
    opacity: 1;	  
    transform: translateX(0);
　}
}

.delay-time02 {
	animation-delay: 0.2s;
}
.delay-time04 {
	animation-delay: 0.4s;
}
.delay-time06 {
	animation-delay: 0.6s;
}
.delay-time08 {
	animation-delay: 0.8s;
}
.delay-time10 {
	animation-delay: 1.0s;
}

.smooth {
  clip-path: inset(0 100% 0 0);
  display: inline-block;
  font-size: 36px;
  font-weight: bold;
  transition: 5s cubic-bezier(0.37, 0, 0.63, 1);
  transition-property: clip-path;
  margin-top: 15px;
}
.smooth.is-animated {
  clip-path: inset(0);
}

.hoverAnime a img { transition:transform .4s ease-in-out; }

/**** basic ***************************************************/
#page-top { position:fixed; bottom:3rem; right:2vw; z-index:9999; }
#page-top .pagetop-img { width:120px; height:120px; }

.ft-xs { font-size:0.7rem; }
.ft-ss { font-size:0.8rem; }
.ft-s { font-size:0.95rem; line-height:1.8; }
.ft-m { font-size:1.2rem; line-height:1.8; }
.ft-l { font-size:1.4rem; line-height:2.2; font-weight:700; }

.cont-flex { display:-webkit-flex; display:-ms-flexbox; display:flex; }
.all-flex { display:-webkit-flex; display:-ms-flexbox; display:flex; }
.cont-even { -webkit-justify-content:space-evenly; -ms-flex-pack:justify; justify-content:space-evenly; } 
.cont-between { -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; } 
.spot-row { flex-direction:row-reverse !important; }
.wrap { padding-top:120px; }
.base-wrap { max-width:1200px !important; margin:0 auto; }
.narrow-wrap { width:980px; margin:0 auto 5rem; }
.narrow-wrap .pic-frame { width:405px; height:100%; }
.narrow-wrap .detail-inner { width:450px; }

.mb1 { margin-bottom:1rem; }
.mb3 { margin-bottom:3rem; }
.mb5 { margin-bottom:5rem; }
.mb8 { margin-bottom:8rem !important; }

.bg-set-w { width:100%; padding:2rem; background:#FFF; }
.bg-set { width:100%; padding:2rem; background:#F5F3EB; }
.cont-bg-set { background:url(../img/common/cont-bg.jpg) no-repeat; background-size:cover; background-position:center; background-attachment:fixed; padding:2rem 0; }
.sec-heading { font-size:2rem; font-weight:400; text-align:center; line-height:1; margin-bottom:4rem; }
.heading-sub { display:block; font-size:1rem; font-weight:500; line-height:1.8; margin-top:1rem; letter-spacing:0.7rem; }
.sec-heading .tit { width:400px; height:auto; }

.cont-tit { font-size:1.4rem; line-height:2.6; font-weight:700; }
.cont-cet { text-align:center; }

.page-top { position:fixed; bottom:1rem; right:0.5rem; }
.page-top img { width:90px; }

/**** pre ***************************************************/
.pre-area { text-align:center; margin:8rem auto; }

/**** header ***************************************************/
.site-head { width:100%; height:120px; position:fixed; z-index:4; }
.h-inner { height:100px; background:rgba(255,255,255,0.8); border-radius:0 0 16px 16px; }
.h-logo { width:360px; height:150px; padding:2rem 2rem 1.8rem; background:#f0dc55; border-radius:0 0 16px 16px; margin-left:2rem; }
.h-logo .h-salonnm { line-height:1.3; padding:1.5rem 0.4rem; }
.h-logo .logo-pic, .f-logo .logo-pic { width:150px; }
.h-nav { width:600px; margin-top:2.8rem; font-weight:700; }
.btn-yoyaku__inner { position:fixed; top:7rem; right:0; border-radius:8px 0 0 8px; background:#4bbaa7; padding:1.5rem 1rem; z-index:8; }
.b-yoyaku { color:#FFF; text-align:center; line-height:1.1; }
.b-yoyaku .icon-pic { width:22px; height:22px; margin-bottom:0.7rem; }

/**** 共通 ***************************************************/
.outer-mv, .outer-head, .wel-b { position:relative; }
.h-main, .h-sub { display:block; }
.short-news, .point-list__dt, .ft-weit { font-weight:700; }
news-detail__dd, .access-dd, .acc-item, .cnd-fl .cnd-fl__dd, .p-newslist .entry-meta { font-size:0.85rem; }
.btn-more { float:right; }
.b-rad { overflow:hidden; }
.omoi-wk__dd, .concept-inner, point-dd, .narrow-wrap .detail-inner, prof-dd { line-height:2; }

/**** home-mv ***************************************************/
.mv01 .mv-dc img { width:220px; position:absolute; right:0; bottom:60px; z-index:2; }
.outer-mv .pt-pic { width:220px; margin-bottom:0.5rem; }
.mv-pt-item { width:920px; margin:1rem auto 3rem; }
.mv-pt-item .cont-tit { font-size:1.3rem; text-align:center; }

/**** home-point ***************************************************/
.point-list { width:300px; height:282px; padding:4.5rem 4rem 2rem 3rem; }
.point01 { background:url(../img/home/mv-pt01.png) no-repeat; background-size:contain; }
.point02 { background:url(../img/home/mv-pt02.png) no-repeat; background-size:contain; }
.point03 { background:url(../img/home/mv-pt03.png) no-repeat; background-size:contain; }
.point-list__dt { font-size:0.98rem; font-weight:700; line-height:1.35; }
.point-list__dd { font-size:0.9rem; line-height:1.3; font-weight:500; } 

/**** home-topics ***************************************************/
.topics-news { width:400px; position:absolute; top:60%; z-index:2; }
.topics-news .pk-news__tit { display:inline-block; padding:1rem; background:#F87076; color:#FFF; font-weight:700; border-radius:8px 8px 0 0; }
.pk-news { background:#FFF; border-radius:0 12px 12px 12px; padding:1.3rem; }
.pk-news .pk-news__img a img { width:160px; margin-right:1rem; }
.pk-news .pk-news__dd { width:100%; font-weight:700; padding:3rem 0.5rem 1rem; line-height:1.8; }

.animation_txt {
  animation: fadeIn 5s ease infinite;
}
 
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/**** home-omoi ***************************************************/
.bg-deco { background:url(../img/home/welcome-bg.png) no-repeat; background-position:right bottom; background-size:280px; margin-top:3.5rem; }
.tit-head { position:absolute; top:-6rem; font-size:7.5rem !important; color:#F5F3EB !important; z-index:3; }
.omoi-b { margin-top:3rem; }
.omoi-b .pic-frame img { width:360px; height:360px; }

/**** home-news ***************************************************/
.h-news-list { width:280px; background:#FFF; padding:1rem 1rem 1.3rem; border-radius:8px; }
.h-news-list:after { display:block; clear:both; content:""; }
.h-news-list .pic-frame img { width:240px; height:160px; object-fit:cover; margin-bottom:2rem; }
.h-news-list .cont-tit { font-size:1.06rem; line-height:1.4; }
.h-news-list .news-detail__dd { font-size:0.85rem; line-height:1.6; }

/**** home-btn ***************************************************/
.section_btn a { width:300px; height:68px; font-size:0.95rem; font-weight:700; text-align:center; border-radius:120px; box-shadow:4px 4px 8px rgb(0 0 0 / 15%); }
.btn-more a, .p-newslist .link-more a { display:block; width:120px; background:#BFA06B; color:#FFF; font-size:0.8rem; text-align:center; border-radius:5px; padding:0.5rem 0; font-weight:700; } 
.btn-link a { display:block; background:#F87076; color:#FFF; padding:1.3rem 0; margin:5rem auto 1rem; } 
.btn-contact a { display:block; width:280px; background:#575757; color:#FFF; font-size:0.8rem; font-weight:700; text-align:center; border-radius:5px; padding:1rem 0; margin:2rem auto 0; } 

/**** home-course ***************************************************/
.course-inner { width:450px; }
.price-flame { width:700px; margin:3.5rem auto 1rem; padding:4rem 5rem; border:1px solid #c7c7c7; border-radius:8px; }
.price-flame .price-fl { font-size:1.1rem; font-weight:700; line-height:2.2; }
.price-flame .price-fl__dt, .price-flame .price-fl__dd { width:50%; }
.price-flame .p-list { border-bottom:1px solid #949494; }
.price-flame .p-area { margin-top:3.5rem; }

/**** home-contact ***************************************************/
.contact-outer { width:40%; background:#FFF; text-align:center; padding:3rem; border-radius:8px; }
.line a { background:#8ac74e; }
.inst a { background:#e86b8c; }

/**** page-salon ***************************************************/
#page { opacity: 0; -webkit-transition:3s cubic-bezier(.25,.1,.25,1); transition:3s cubic-bezier(.25,.1,.25,1); }
#page.page-act { opacity:1; background:#FFF; }

.outer-head { height:270px; margin-top:-120px; }
.p-salon { background:url(../img/salon/head-page.jpg) no-repeat center; background-size:cover; }
.p-salon:before { content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(147,147,118,.5); z-index:0; }
.page-heading { position:absolute; top:75%; left:50%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); color:#FFF; text-align:center; z-index:1; }
.h-main { font-size:1.8rem; line-height:1.5; }
.h-sub { font-size:1rem; font-weight:400; letter-spacing:0.3rem; }

.breadcrumbs { margin-top:1rem; }
.breadcrumbs .breadcrumbs-wrap { justify-content:flex-start; margin:0; }
.breadcrumbs .breadcrumbs-list a { display:block; margin-right:12px; text-decoration:underline; }
.arrow-right:before { content: ""; display:block; width:0.3rem; height:0.3rem; border-top:1px solid #000; border-right:1px solid #000; transform: rotate(45deg); margin:0.3rem 1rem 0 0; }

.salon-space { width:1000px; margin:0 auto 3rem; }
.salon-space .pic-frame { width:1000px; }

.concept-inner { background:#FFF; padding:6rem 8rem; border-radius:10px; }
.flm-inner { border:1px solid #ededed; border-radius:10px; padding:4rem 3rem; }
.flm-inner .pic-frame { width:300px; }
.flm-inner .prof-main { }

/**** page-course ***************************************************/
.cnd-wrap { padding:4rem 2rem 6rem; }
.cnd-wrap .cont-tit { text-align:center; }
.cnd-list { width:230px; height:240px; background:#FFF; border-radius:58% 70% 68% 60% / 55% 75% 43% 55%; -webkit-border-radius:58% 70% 68% 60% / 55% 75% 43% 55%; transform: rotate(-30deg); }
.cnd-list:nth-of-type(2), .cnd-list:nth-of-type(3) { margin-top:4rem; }
.cnd-inner { width:220px; height:230px; position:relative; }
.ft-alex { font-size:2.2rem; color:#ccc; font-family: "Alex Brush", serif; font-weight:400; font-style:normal; letter-spacing:-0.01rem; transform:rotate(-10deg); -moz-transform: rotate(-10deg); -webkit-transform: rotate(-10deg); }
.cnd-list .cnd-dc { position:absolute; top:2rem; right:0; width:160px; }
.cnd-list .ft-weit { padding:5rem 0 0 0; font-size:1.03rem; margin-bottom:0.5rem; }

.pnt-detail { width:45%; position:relative; padding:3.5rem 3rem; background:#ddeed5; border-radius:5px; text-align:center; }
.pnt-detail .cnd-dc { font-size:2.8rem; position:absolute; top:-4%; left:50%; -webkit-transform:translate(-50%,-4%); transform:translate(-50%,-4%); }
.pnt-detail .cont-tit { margin:1.8rem 0; }
.pnt-detail .pnt-fl__dd { text-align:left; }

/**** page-news ***************************************************/
.p-newslist article { padding-bottom:1.5rem; margin-bottom:0.6rem; border-bottom:1px solid #9c9c9c; }
.p-newslist .entry-header { margin-bottom:0.6rem; }
.p-newslist .category-news, .p-newslist .category-blog { font-size:0.95rem; margin-bottom:1.2rem; }
.entry-header .updated, .entry-header .byline, .edit-link { display:none; }
.entry-summary { height:150px; }
.entry-summary:after { content:''; display:block; clear:both; }
.entry-summary p { line-height:1.5; }
.entry-title { font-size:1.2rem; line-height:1.6; }
.post-thumbnail a img { width:200px; height:auto; margin-right:2rem; float:left; }
.entry-summary .link-more { float:right; margin-top:1.5rem; }

.news-area .entry-header .entry-title { font-size:1.2rem; line-height:2.2; }
.p-news .entry-header { margin-bottom:3rem; padding-bottom:0.6rem; border-bottom:1px solid #9c9c9c; }
.p-news .entry-content p { margin:2rem 0; }

/**** footer ***************************************************/
.fnav-wrap { width:650px; margin:0 auto; }
.nav-list:not(:first-child):before { content:"|"; margin-right:1.6rem; margin-left:1.6rem; }
.f-salon-info { line-height:1.8; margin-bottom:3rem; }
footer .copyright { text-align:center; font-size:0.6rem; padding:0.8rem 0; }

@media screen and (max-width: 1024px) {
body { min-width:100%; }
img { width:100%; height:auto; }
.h-nav { display:none; }
.outer-pagehead { height:7rem; }
.inner-pagehead .page-heading { font-size:34px; line-height:1.8; padding-top:2.4rem; }
.breadcrumbs { font-size:0.68rem; margin:1rem 0 0 1.5rem; }
.base-wrap { max-width:100% !important; }
.mv01 .mv-dc img { width:160px; right:0; bottom:10rem; }
.slide-area { width:92%; max-width:100% !important; padding:0 !important; }
.mv-pt-item, .narrow-wrap { width:100%; }
.page-act .narrow-wrap { width:90%; }
.narrow-wrap .pic-frame, .narrow-wrap .detail-inner { width:49%; }
.h-news-list { width:24%; }
.omoi-b .pic-frame img, .h-news-list .pic-frame img { width:100%; }
}

@media screen and (max-width: 767px) {
body { min-width:100%; }
.sp-w90 { width:90% !important; margin:0 auto; }
.cont-flex { display:block; }
.site-head { height:100px; }
.btn-yoyaku__inner { top:12rem; }
.wrap { padding-top:100px; }
.bg-set { padding:4rem 2rem; }
.sp-img, img { width:100%; height:auto; }
.sp-mb3 { margin-bottom:3rem; }
.sp-mb8 { margin-bottom:8rem; }
.breadcrumbs .breadcrumbs-list { font-size:small; }
.pk-news .pk-news__img a img { width:120px; }
.point-list, .cnd-list { margin:0 auto 3rem; }
.point-list { padding:3rem 4rem 2rem 3rem; }
.bg-deco { background-size:180px; }
.ft-alex { top:-39rem; left:1rem; font-size:10rem !important; }
.price-flame { padding:5rem 4rem; }
.price-flame .price-fl__dt { margin-bottom:2rem; }
.section_btn a { font-size:medium; }
.btn-link a, .btn-contact a { padding:2.5rem 0 2rem; }
.btn-more a, .p-newslist .link-more a, .btn-contact a { font-size:medium; }
.narrow-wrap { width:100%; margin:0 auto 5rem; }
.concept-b .narrow-wrap { width:100%; }
.concept-inner { padding:6rem 4rem; }
.page-top { bottom:2rem; right:1rem; }
.page-top img { width:60px; }
.sec-heading .tit { width:320px; }
.h-news-list { padding:2rem; margin-bottom:3rem; }
.h-news-list .pic-frame img { width:100%; height:auto; }
.price-flame .price-fl__dt, .price-flame .price-fl__dd, .price-flame .price-fl__dt, .price-flame .price-fl__dd { width:100%; }
.p-newslist article, .p-news article { width:90%; margin:0 auto 3rem; }
.p-newslist .entry-meta { font-size:small; }
.entry-title { font-size:2.4rem; line-height:2.2; } 
.post-thumbnail a img { width:100%; margin:0 auto 2rem; float:none; }
.entry-summary { height:auto; }
.entry-summary p { font-size:1.8rem !important; line-height:2 !important; }
.cnd-list { width:290px; height:300px; }
.cnd-inner { width:260px; height:290px; }
.cnd-list .cnd-dc { width:auto; }
.cnd-inner .ft-alex { top:1rem; left:1rem; font-size:4rem !important; }
.cnd-list .cnd-fl { width:250px; height:300px; padding:5rem 0 0 3.5rem; }
.pnt-detail { margin-top:5rem !important; }
.pnt-detail .cnd-dc { top:-4rem; }
.pnt-detail .ft-alex { font-size:5rem !important; } 
.nav-list:not(:first-child):before { content:"-"; }

}

@media screen and (max-width: 766px) {
.ft-ss { font-size:1.5rem; }
.ft-s { font-size:1.8rem !important; line-height:2.2 !important; }
.ft-m { font-size:2rem !important; line-height:2.2 !important; }
.ft-l { font-size:2.2rem !important; line-height:2.2 !important; }
#overlay ul li a { font-size:2rem; line-height:2; font-weight:700; }
.h-inner { height:80px; }
.h-logo { width:63%; height:90px; }
.h-logo .logo-pic { width:100px; }
.h-logo .h-salonnm { font-size:1.4rem; line-height:1.6; padding:1.5rem 0.4rem 0; }
.mv01 .mv-dc img { bottom:40%; }
.topics-news { position:unset; }
.pk-news .pk-news__dd { font-size:1.8rem; line-height:1.8; }
.point-list { width:300px; height:281px; padding:7rem 8.9rem 2rem 5rem;  }
.point-list .point-list__dt { font-size:2.2rem !important; line-height:1.4 !important; }
.point-list .point-list__dd { font-size:1.9rem !important; line-height:1.8 !important; }
.arrow-right:before { width:0.9rem; height:0.9rem; margin:1.1rem 1.3rem 0 0; }

}