﻿/* リクル－ト
---------------------------------------------- */
.recruit-wrapper {
  position: relative;
  background-color:#fff;
  color: #092939;
}
/* 
---------------------------------------------- */
.salon-wrap {
  position: relative;
  padding:10px 10px 60px;
}
/* ロゴ
---------------------------------------------------------------*/
.logo {
  position: relative;
  display:block;
  width:50vw;
  max-width:300px;
  margin: 0 auto 60px ;
  height:100%;
  left:calc(0% + 0px);
  aspect-ratio:3.2 / 1;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(../images/salon/logo.svg);
  pointer-events:auto;
display:none;
}

@media screen and (min-width: 600px) {
.logo {
  max-width:400px;
}
}
/*
---------------------------------------------------------------*/
.salon-box {
  position: relative;
  margin: 0 auto 10px;
  padding:30px 10px;
  background-color:#f8f8f8;
  text-align:center;
  border-radius:10px;
}
.salon-box:last-child{
  margin-bottom:0px;
}
/*トップアクセス
----------------------------------- */
.top-acces-box {
 position: relative;
 display:inline-block;
 margin-bottom:20px;
}
/*
----------------------------------- */
.top-salon-address {
  position: relative;
  margin-bottom:10px;
  line-height: 1.0;
  font-size: 0rem;
  letter-spacing: -10rem;
  color:#293133;
}
.top-salon-address .smoll {
  position: relative;
  display:inline-block;
  display:block;
  vertical-align: bottom;
  letter-spacing: 0rem;
  font-size: 1.4rem;
  padding:5px 0 0;
}

/*店名
----------------------------------- */
.top-salon-name-image {
  position: relative;
  width: 100px;
  display:inline-block;
  vertical-align: bottom;
  aspect-ratio:3.2 / 1;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(../images/salon/logo.svg);
  margin-right:5px;
}
.top-salon-name {
  position: relative;
  display:inline-block;
  vertical-align: bottom;
  margin:0px 0 0px;
  font-size: 2.6rem;
  letter-spacing: 0.1rem;
  font-family:'Hiragino Maru Gothic Pro';
  font-weight:bold;
}
/*
----------------------------------- */
a.top-salon-addressInner,.top-salon-addressInner {
  position: relative;
  display:inline-block;
  vertical-align: bottom;
  font-size: 1.1rem;
  line-height: 1.0;
  letter-spacing: 0.08rem;
  padding:5px 0 0;
  color:#293133;
}
/*
----------------------------------- */
a.top-salon-addressInner.link  {
  border-bottom:1px solid #293133;
}
/*
----------------------------------- */
a.top-salon-addressInner.add  {
 padding-top:10px;
 font-size: 1.4rem;
}
/*
----------------------------------- */
a.top-salon-addressInner.salon-tel{
  cursor: not-allowed;
  padding-left:40px;
  font-size: 2.6rem;
  font-family: 'Roboto';
  font-weight: 500;
  background-repeat: no-repeat;
  background-position: left 0px center;
  background-size: auto 100%;
  background-image: url(../images/salon/tel.svg);
}
/*
----------------------------------- */
.top-salon-addressInner.time {
  font-size: 2.0rem;
  font-family: 'Roboto';
  font-weight: 500;
}
/*
-------------------------------------------------------------------------*/
a.link-hp{
  position: relative;
  display:block;
  display:inline-block;
  vertical-align: middle;
  width: 210px;
  aspect-ratio:5 / 1;
  background-color:#FADF00;
  background-repeat: no-repeat;
  background-position: right 20px center;
  background-size:auto 30%;
  background-image: url(../images/salon/yajirushi.svg);
  border-radius:40px;
}
a.link-hp::after{
  position: absolute;
  content:"ホームページを見る";
  width:100%;
  top:50%;
  left:0;
  transform: translate(0,-50%);
  font-size: 1.4rem;
  letter-spacing: 0rem;
  font-family:'Hiragino Maru Gothic Pro';
  font-weight:bold;
  text-align:left;
  padding-left:20px;
}

/*▽スライドショー
--------------------------------------------- */
.top-box-inner-image {
  position: relative;
  overflow: hidden;
  min-height:280px;
  border-radius:60px;
  margin-bottom:30px;
}
.splide__slide  {
  position: relative;
}
/* 
--------------------------------------------- */
.top-box-salon-image {
  position: relative;
  aspect-ratio:1 / 1;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
