@charset "utf=8";

#index, #menu, #access, #contact, #staff, #caution {
  font-family: 'Shippori Mincho', serif;
}

.sn {
  clear: both;
}

#index header {
  width: 100%;
  height: auto;
  position: relative;
}

.top-img {
  position: relative;
}

.fade2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.global-nav {
  position: absolute;
  top: 10px;
  right: 5%;
}

.Toggle {
  position: absolute;
  top: 10px;
  right: 5%;
}

.fade1 {
  animation: fadeIn 3s linear 0s 1 normal;
}



  @keyframes fadeIn { /*animation-nameで設定した値を書く*/
  0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
  70% {opacity: 1} /*アニメーション終了時は不透明度100%*/
}

.fade2 {
    animation: fadeIn 3s ease 0s 1 normal;
}

  @keyframes fadeIn { /*animation-nameで設定した値を書く*/
  0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
  100% {opacity: 1} /*アニメーション終了時は不透明度100%*/
}

.global-nav {
  animation: fadeIn 1s ease 0s 1 normal;
}

.Toggle {
  animation: fadeIn 1s ease 0s 1 normal;
}

@keyframes fadeIn { /*animation-nameで設定した値を書く*/
0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
100% {opacity: 1} /*アニメーション終了時は不透明度100%*/
}

body {
  margin: 0;
  padding: 0;
  background-color: #fffafa; /*indexページのみ*/
  color: #715c1f;
  /* body内の文字の大きさと行間 */
  font-size: 15px;
  line-height: 2;
  /*  */
}

#menu, #access, #contact, #staff, #caution body {
  background-color: #fffafa;  /*下層ページの全体背景色*/
}

.global-nav {
  float: right;
  margin-top: 60px;
}

.global-nav li {
  float: left;
  margin: 0 10px;
  font-size: 18px;
  list-style: none;
}

.font00 {
  text-align: center;
  font-size: 14px;
}

.kokoko {
  width: 1920px;
  height: 1080px;
}

@media screen and (min-width: 700px) {
  footer {
    background-color: #ffe1eb;
    font-size: 1.2rem;
    padding: 20px 0 10px 0;
  }

  footer a {
    padding: 0 15px;
  }

  footer p {
    letter-spacing: 3px;
  }

  footer img {
    width: 200px;
    margin: 10px 0 10px 0;
  }
  

}
@media screen and (max-width: 700px) {
  footer {
    background-color: #ffffff;
    padding: 20px;
  }

  footer img {
    width: 150px;
    margin: 10px 0 10px 0;
  }
}

footer {
  clear: both;
  text-align: center;
  color: #613a3a;
}

footer a {
  color: #613a3a;
  text-decoration: none;
}

footer a:hover {
  color: #e90e98;
  text-decoration: underline;
}


/* ハンバーガーメニュー */
img{width:100%;}
 
/*ロゴの大きさを調整*/
#logo img {
  max-width:50%;
}

 
nav{
 position: relative;
 background: #fffafa;
}

/*ナビゲーション部分*/
.global-nav ul li a {
  display:block;
  font-weight:bold;
  padding: 2em;
  color:#333;
  text-decoration:none;
}
 
 
.global-nav ul li a:hover
{background-color:rgba(0,0,0,0.5);
color:orange;}
 

 
/*OPEN時の動き*/
.global-nav .open {
 -webkit-transform: translateX(0%);
 transform: translateX(0%);/*メニューを元の位置へ戻す*/
 
}

/*---ここからPCモニターの記述---*/
@media screen and (min-width: 700px) {
 
/*ロゴの大きさを調整*/
#logo img{
  max-width:250px;
}	

.top-img {
  width: 100%;
  height: 100%;
}

.fade1 img {
  min-width : 100%;
  height: auto;
}

/* ↓08月23日更新ＰＣ用にロゴを小さく↓ */
.fade2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 20%;
}
/* ↑0823更新↑ */

#index .nav-top-name img {
  width: 600px;
  position: absolute;
  top: 5%;
  left: 3%;
}

nav{
  display: flex;
}

.Toggle{
 display: none;
}

.menu{
width: 100%;
font-size:0.9em;
background-color: transparent;
margin:0 10px;
}

.global-nav {
-webkit-transform: translateX(0);
transform: translateX(0);
}

/* ↓shainynailから↓ */

.global-nav li a {
  width: 130px;
  display: block;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  color: #715c1f;
  letter-spacing: 8px;
}

.global-nav li a:hover {
  padding-bottom: 3px;
  border-bottom: solid 1px #000;
  color: #56481b;
  letter-spacing: 12px;
  font-weight: bold;
}
}
/* ↑shainynailから↑ */

/* ↑ハンバーガーメニュー↑ */





/* ↓メインエリア【PC基準】20240319改正↓ */
#index {
  background-color: #fefff8;  
}

#index #wrap {
  background-color: #fefff8; 
}
@media screen and (max-width: 700px) {  
  #index #wrap {
    background-color: #ffe1eb;
  }
}


/* ↓メイントップbg-colorピンクエリア【PC基準】↓ */
#index .top-area {
  background-color: #ffb8d0;
  width: auto;
  margin: auto;
  padding: 30px 50px 50px;
}

#index .top-area .top-p-first {
  font-size: 22px;
  letter-spacing: 5px;
  height: 0.1em;
}

#index .top-area .top-p-second {
  color: #f6ffcc;
  text-shadow: #9e9e9e 1px 0 10px;
  font-size: 30px;
  margin-bottom: 15px;
  padding-bottom: 0;
  letter-spacing: 5px;
  height: 1em;
}

#index .top-area h1 {
  color: #ffffff;
  text-shadow: #ffe1eb 1px 0 10px;
  margin-top: 0;
  padding: 20px auto;
  letter-spacing: 3px;
  font-family: "Kaisei Decol";
  height: auto;
}

#index .top-area h1 .midi {
  font-size: 20px;
  letter-spacing: 0.3em;
}

#index .top-area h1 .large {
  font-size: 40px;
  letter-spacing: 0.2em;
}

#index .top-area h2 {
  color: #63690a;
  font-size: 20px;
}

@media screen and (min-width: 700px) {  
#index .top-area h1 .only-sp {
  display: none;
}
}

/* ↓メイントップbg-colorピンクエリア【スマホ】↓ */
@media screen and (max-width: 700px) {
  #index .top-area {
    padding: 10px;
  }
  
  #index .top-area .top-p-first {
    font-size: 12px;
    margin: 5px auto auto auto;
    padding: auto;
    letter-spacing: 5px;
    height: auto;
    line-height: 1em;
  }
  
  #index .top-area .top-p-second {
    font-size: 12px;
    margin: auto;
    padding: auto;
    letter-spacing: 5px;
    height: auto;
  }
  
  #index .top-area h1 {
    font-size: 30px;
    margin: auto;
    padding: 5px auto;
    line-height: 1em;
  }

  #index .top-area h1 .midi {
    font-size: 15px;
    letter-spacing: 0.6em;
  }
  
  #index .top-area h1 .large {
    font-size: 33px;
    letter-spacing: 0.2em;
  }
  
  
  #index .top-area h2 {
    margin-top: 40px;
    font-size: 11px;
    letter-spacing: 0.1em;
  }
}


/* ↓メニューの説明エリア【PC基準】↓ */
#index .menu-explan-area {
  width: 900px;
  margin: auto;
  padding: 20px 0 100px 0;
  background-color: #ffb8d0;
}

#index .menu-explan-area .intro {
  font-size: 25px;
  text-align: center;
  letter-spacing: 0.7em;
  color: #382a00;
}

#index .menu-explan-area section {
  width: 90%;
  margin: auto;
  text-align: center;
  background-color: #ffffff;
  padding: 50px 0;
}

#index .menu-explan-area .explan-text h2 {
  color: #826202;
  margin: 0;
  padding: 0;
  text-align: center;
}

#index .menu-explan-area section img {
  width: 350px;
  margin: auto;
  padding-left: 10px;
  vertical-align: top;
}

#index .menu-explan-area section .explan-text {
  background-color: #ffffff;
  width: 300px;
  margin: 0 50px;
  text-align: left;
  display: inline-block;
}

/* ↓メニューの説明エリア【スマホ】↓ */
@media screen and (max-width: 700px) {
  #index .menu-explan-area {
    width: auto;
    margin: auto;
    padding: 30px 0;
    background-color: #ffe1eb;
  }
  
  #index .menu-explan-area .intro {
    font-size: 20px;
    text-align: center;
    letter-spacing: 0.3em;
  }
  
  #index .menu-explan-area section {
    width: auto;
    margin: 40px 15px ;
    text-align: center;
    background-color: #ffffff;
    padding: 0;
    border-radius: 15px;
  }
  
  #index .menu-explan-area .explan-text h2 {
    margin: 20px 0 5px 0;
    padding: 0;
    text-align: center;
  }
  
  #index .menu-explan-area section img {
    width: 100%;
    margin: auto;
    vertical-align: top;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    padding-left: 0;
  }
  
  #index .menu-explan-area section .explan-text {
    background-color: #ffffff;
    width: auto;
    margin: 0 15px;
    text-align: left;
    display: inline-block;
    font-size: 12px;
  }

}
/* ↑メニューの説明エリア↑ */

/* ↓リンパドレナージュエリア↓ */
#index .rympa-area {
  width: 900px;
  margin: 150px auto;
  text-align: center;
  background-color: #fefff8;
} 

#index .rympa-area .mdl-pc {
  width: 100%;
  margin: auto;
  text-align: center;
}

@media screen and (min-width: 700px) {
  #index .rympa-area .mdl-sp {
    display: none;
  } 
} 

@media screen and (max-width: 700px) {
  #index .rympa-area {
    width: auto;
    margin: 50px auto 0 auto;
    text-align: center;
  } 
  
  #index .rympa-area .mdl-sp {
    width: 100%;
    margin: auto;
    text-align: center;
  }

  #index .rympa-area .mdl-pc {
    display: none;
  }
}
/* ↑リンパドレナージュエリア↑ */


/* ↓ギフトカードエリア↓ */
#index .giftcard-area {
  background-color: #fefff8;
  width: 900px;
  margin: auto;
  text-align: center;
}

#index .giftcard-area img {
  width: 80%;
  margin: auto;
}

@media screen and (max-width: 700px) {
  #index .giftcard-area {
    background-color: #fefff8;
    width: auto;
  }
    
  #index .giftcard-area img {
    width: 100%;
  }

}
/* ↑ギフトカードエリア↑ */


/* ↓超重要書き換え注意↓ */
.fade1 {
  overflow: hidden;
  width: auto;
  height: 100%;
  position: relative;

}

.fade1 img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: auto;
  height: 100%;
}
/* ↑超重要書き換え注意↑ */



/* ↓ハンバーガーメニュー実使用↓ */
    /* ↓スマホハンバーガーボタン固定↓ */
    @media screen and (max-width: 600px) {
      header #overlay-button {
        position: fixed;
      }
    }
    /* ↑スマホハンバーガーボタン固定↑ */

#index body {
  background: rgba(255, 255, 255, 0.291);
  margin: 0;
  font-family: arial;
  width: 100vw;
  height: 100vh;
  animation: bugfix infinite 1s;
  -webkit-animation: bugfix infinite 1s;
}

@keyframes bugfix {
  from {
    padding: 0;
  }
  to {
    padding: 0;
  }
}
@-webkit-keyframes bugfix {
  from {
    padding: 0;
  }
  to {
    padding: 0;
  }
}
#overlay-button {
  position: absolute;
  right: 2em;
  top: 3em;
  padding: 26px 11px;
  z-index: 5;
  cursor: pointer;
  user-select: none;
}
#overlay-button span {
  height: 4px;
  width: 35px;
  border-radius: 2px;
  background-color: rgb(62, 41, 0);
  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: rgb(62, 41, 0);
  position: absolute;
  content: "";
  transition: all .2s ease-in-out;
}

#overlay-button:hover span, #overlay-button:hover span:before, #overlay-button:hover span:after {
  background: rgb(62, 41, 0);
} 


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: 100vw;
  background: #ff3564b3;
  z-index: 2;
  visibility: hidden;
  position: fixed;
}

#overlay ul {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  height: 100vh;
  padding-left: 0;
  list-style-type: none;
}
#overlay ul li {
  padding: 1em;
}
#overlay ul li a {
  color: #ffffff;
  text-decoration: none;
  font-size: 1.5em;
}
#overlay ul li a:hover {
  color: #000!important;
}

/* ↑ハンバーガーメニュー実使用↑ */

/* ↓ＰＣ or スマホで非表示↓ */
@media screen and (max-width: 1100px) {
  #index #index-pc, #menu #index-pc, #access #index-pc, #contact #index-pc, #sn-kari #index-pc, #staff #index-pc, #caution #index-pc  {
    display: none;
  }
}


@media screen and (min-width: 1100px) {
  #index #index-sp, #menu #index-sp, #access #index-sp, #contact #index-sp, #sn-kari #index-sp, #staff #index-sp, #caution #index-sp {
    display: none;
  }
}
/* ↑ＰＣ or スマホで非表示↑ */



/* ↓snsボタン↓ */
.hr-block {
  width: 100%;
  border: 0;
}


@media screen and (max-width: 700px) {
    #wrap .allstaff-img-area {
    width: 100%;
    margin: 0 auto 100px auto;
  }
 
  #wrap .icon-sns {
    text-align: center;
    margin-top: 60px;
    padding-bottom: 60px;
  }

  #wrap .icon-sns .icon-i {
    width: 15%;
    padding: 5px;
    }

}

@media screen and (min-width: 700px) {
    #wrap .allstaff-img-area {
    width: 800px;
    margin: 50px auto 150px auto;
  }

  .snsbtn img {
    width: 100px;
  }

  .sns-li {
    float: left;
    list-style: none;
    padding-left: 20px;
  }

  .snsbtn {
    text-align: center;
    width: auto;
    margin-top: 70px;
  }

    
  .btn-iti {
    text-align: center;
  }

  .btn-iti p {
    margin: 30px 0;
    padding: 0;
  }

  .btn-iti a {
    margin: 0;
    padding: 0;
  }

  #wrap .icon-sns {
    text-align: center!important;
    margin: auto!important;
    width: 370px!important;
    height: 150px!important;
    padding: 100px;
  }

  #wrap .icon-sns .icon-i {
    width: 100px;
    padding: 10px;
  }
}


/* ↑snsボタン↑ */



/* ↓シャイニーネイルボタン↓ */
.cs-btn a {
  background-color: #df3369;
  color: #fff;
  font-size: 20px;
  width: 185px;
  display: inline-block;
  text-align: center;
  line-height: 50px;
  border-radius: 5px;
  border: 3px solid #df3369;
  text-decoration: none;
}

.cs-btn a:hover {
  text-decoration: none;
  background-color: #ffffff;
  color: #df3369;
}

.hp-btn a {
  background-color: #df3369;
  color: #fff;
  font-size: 20px;
  width: 185px;
  display: inline-block;
  text-align: center;
  line-height: 50px;
  border-radius: 5px;
  border: 3px solid #df3369;
  text-decoration: none;
}

.hp-btn a:hover {
  text-decoration: none;
  background-color: #ffffff;
  color: #df3369;
}

.sn-btn a {
  background-color: #fe5fbe;
  color: #fff;
  font-size: 20px;
  width: 185px;
  display: inline-block;
  text-align: center;
  line-height: 50px;
  border-radius: 5px;
  border: 3px solid #fe5fbe;
  text-decoration: none;
}

.sn-btn a:hover {
  text-decoration: none;
  background-color: #ffffff;
  color: #fe5fbe;
}

.clover-btn a {
  background-color: #246f19;
  color: #fff;
  font-size: 20px;
  width: 185px;
  display: inline-block;
  text-align: center;
  line-height: 50px;
  border-radius: 5px;
  border: 3px solid #246f19;
  text-decoration: none;
}

.clover-btn a:hover {
  text-decoration: none;
  background-color: #ffffff;
  color: #246f19;
}

.informel-btn a {
  background-color: #248bbb;
  color: #fff;
  font-size: 20px;
  width: 185px;
  display: inline-block;
  text-align: center;
  line-height: 50px;
  border-radius: 5px;
  border: 3px solid #248bbb;
  text-decoration: none;
}

.informel-btn a:hover {
  text-decoration: none;
  background-color: #ffffff;
  color: #248bbb;
}


@media screen and (min-width: 700px) {
  .btn-iti .sn-text {
    font-size: 20px;
  }

  .btn-iti .caution {
    font-size: 20px;
    font-weight: bold;
    font-family: 'Shippori Mincho', serif;
  }

}

@media screen and (max-width: 700px) {
  .btn-iti {
    text-align: center;
  }
}

.btn-iti {
  font-family: 'Kiwi Maru', serif;
}

.btn-iti .caution {
  padding: 25px 0 25px 0;
  font-family: 'Shippori Mincho', serif;
}

/* シャイニーネイルボタン */


/* 下層ページ、ヘッダーとリンクボタン・SNSエリアの背景色 */
@media screen and (max-width: 700px) {
  #menu header, #access header, #contact header, #staff header, #caution .header {
    background-color: #ffb8d0;  /*下層ページの全体背景色*/
  }

  #menu .icon, #access .icon, #contact .icon, #staff .icon, #caution .icon {
    background-color: #ffb8d0;  /*下層ページの全体背景色*/
  }

  #menu .link-btn-area, #access .link-btn-area, #contact .link-btn-area, #staff .link-btn-area, #caution .link-btn-area {
    background-color: #ffe1eb;  /*下層ページの全体背景色*/
    margin-top: 100px;
    clear: both;
  }
}


/* ↓メニューページ↓ */
@media screen and (min-width: 700px) {
  #menu header {
    width: 100%;
    height: 150px;
  }

  #menu .content {
    width: 90%;
    margin-left: 100px;
    margin-right: 100px;
  }
 
  #menu #relax-menu {
    margin: 50px auto;
    width: 800px;
  }

  #menu #relax-menu td {
    width: 400px;
    padding: 12px 0 12px 20px;
    border: 1px solid #fffafa3f;
    text-align: left;
    background-color: #ffffff;
  }

  #menu table {
    width: auto;
    margin: auto;
    text-align: center;
  }

  #menu #relax-menu th {
    width: 270px;
    padding: 25px 0 25px 20px;
    text-align: left;
    background-color: #fdc9e7;
  }

  #menu #relax-menu {
    padding-bottom: 30px;
  }

  #menu .therapy-area {
    width: 700px;
    margin: 100px auto;
    padding: 50px 80px;
    background-color: #ffeaf1;
  }

  #menu .therapy-area h2 {
    margin-bottom: 50px;
    letter-spacing: 3px;
  }
  
  #menu .hosi01 {
    text-align: left;
  }

  #menu .hosi02 {
    font-size: 15px;
    text-align: left;
  }

}

@media screen and (max-width: 700px) {
  #menu header {
    width: 100%;
    height: 15px;
  }

  #menu .icon {
    margin: 0;
    padding-bottom: 15px;
  }

  #menu .menu-text {
    margin: 20px;
  }

  #menu .menu-text p {
    font-size: 13px;
  }

  #menu #relax-menu {
    margin-top: 0;
  }
  #menu #relax-menu td {
    width: 400px;
    padding: 12px 5px 12px 10px;
    border: 1px solid #fffafa3f;
    text-align: left;
    background-color: #ffffff;
    font-size: small;
  }
  #menu table {
    width: auto;
    margin: auto;
    text-align: center;
  }
    
  #menu #relax-menu th {
    width: 400px;
    padding: 25px 0 25px 10px;
    text-align: left;
    background-color: #fdc9e7;
    font-size: small;
  }
  
  #menu .therapy-area {
    margin-top: 80px;
    padding: 50px 10px;
    background-color: #f4ecf4;
    color: #5c4d38;
  }

  #menu .therapy-area h2 {
    margin-bottom: 50px;
    letter-spacing: 3px;
  }
  
  #menu .hosi01 {
    text-align: left;
    padding-left: 20px;
  }

  #menu .hosi02 {
    text-align: left;
    margin: 0 10px 20px 10px;
    font-size: 13px;
  }
  
  #menu .link-btn-area {
    margin-top: 0;
    padding-top: 80px;
  }
}  

#menu .content {
  width: auto;
  text-align: center;
}

#menu .menu-news {
  margin: 50px 10px;
}

#menu .menu-news .menu-news-title {
  font-size: 1.5rem;
  font-family: 'kokoro', serif;
  margin: 10px auto;
  letter-spacing: 0.2rem;
}

#menu .menu-news .menu-news-text {
  margin: 5px auto;
}

#menu .menu-news img {
  width: 50%;
  margin: 30px auto;
  border: solid 5px #f0e6f2;
}


#menu #relax-menu .table01 {
  margin-bottom: 80px;
}

#menu h4 {
  text-align: center;
}

#menu .order1 {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}

#menu .order2 {
  margin-top: 0;
  padding-top: 0;
}

#menu .mana .photograph-list li {
  float: left;
  list-style: none;
  margin: 0 10px 15px 5px;
}

#menu .mana .photograph-list li:nth-child(4n){
  margin-right: 0;
}

#menu .mana-hp {
  margin-top: 50px;
}

#menu .hr01 {
  margin: 50px 10px 50px 10px;
  border-top: 1px solid #f5c7e3;
}

#menu .hosi01 {
  font-family: 'Shippori Mincho', serif;
}

#menu .home {
  text-align: center;
  margin-top: 50px;
  margin-bottom: 50px;
}

#menu .menu-text {
  font-family: 'kokoro', serif;
  text-align: center;
  border: 4px double #f5c7e3;
  padding: 10px;
  background-color: #fffafa;
}

#menu .menu-text a {
  color: #917205;
}

#menu .menu-text .link-hpb:hover {
  color: #dd5bdd;
  border: 2px solid #dd5bdd;
  border-radius: 5px;
  padding: 5px 10px 10px 10px;
}

#menu .menu-text .link-insta:hover {
  color: #169cbd;
  border: 2px solid #169cbd;
  border-radius: 5px;
  padding: 5px 10px 10px 10px;
}


/* ↑メニューページ↑ */

/* ↓アクセスページ↓ */
@media screen and (min-width: 700px) {
  #access header {
    width: 100%;
    height: 150px;
  }

  #access .content {
    width: 800px;
    margin: auto;
  }

  #access .main-center {
    text-align: center;
  }  
  
  #access .access-text {
    padding: 10px;
    margin: 30px 0 30px 0;
  }
  
  #access .directions {
    width: auto;
    margin: auto;
    text-align: center;
  }

  #access .directions .car {
    font-size: 18px;
    font-weight: bold;
    margin-top: 50px;

  }

  #access .map img {
    width: 50%;
    margin-top: 20px;
  }

  #access .access iframe {
    width: 100%;
    height: 400px;
    margin: 100px auto;
  }

}

@media screen and (max-width: 700px) {
  #access header {
    width: 100%;
    height: 15px;
  }

  #access .icon {
    margin: 0;
    padding-bottom: 15px;
    font-size: 22px;
  }

  #access .access iframe {
    width: 100%;
    margin: 50px 0 50px 0;
    padding: 5px;
  }

  #access .access th {
    font-size: small;
  }

  #access .map img {
    width: 90%;
  }

  #access .access-text {
    margin: 20px;
  }

  #access .access-text p {
    font-size: 13px;
  }

  #access .directions {
    width: auto;
    margin: 50px 10px;
    text-align: center;
    font-size: 13px;
  }

  #access .directions .car {
    font-size: 15px;
    font-weight: bold;
  }


  #access .directions .map img {
    margin-top: 30px;
  }

  #access .directions .parking {
    margin-top: 50px;
    padding: 5px;
    width: auto;
    font-size: 13px;
    border: solid 1px #000;
  }

}

#access .home {
  text-align: center;
  margin-top: 50px;
  margin-bottom: 50px;
}

#access .access-text {
  font-size: large;
  font-family: 'kokoro', serif;
  border: 4px double #f5c7e3;
  padding: 10px 10px 20px 10px;
  background-color: #fffafa;
}

#access .icon {
  text-align: center;
}

/* ↑アクセスページ↑ */

/* ↓コンタクトページ↓ */
@media screen and (min-width: 700px) {
  #contact header {
    width: 100%;
    height: 150px;
  }
  #contact .content {
    width: 800px;
    margin: auto;
  }

  #contact .content table {
  margin: 50px;
  }
    
}

@media screen and (max-width: 700px) {
  #contact header {
    width: 100%;
    height: 15px;
  }

  #contact .icon {
    margin: 0;
    padding-bottom: 15px;
  }

  #contact .content table {
    margin: 50px 10px 50px 10px;
  }

  #contact .contact-text {
    margin: 20px;
  }

  #contact .contact-text p {
    font-size: 13px;
  }

  #contact .content tr {
    width: 100%;
  }

  #contact .content th {
    white-space: nowrap;
  }
  #contact .content td {
    width: 100%;
  }

}

#contact .content table {
  float: left;
}

#contact .content th {
  text-align: left;
  vertical-align: top;
  line-height: 2.5;
}

#contact .content td {
  text-align: left;
  vertical-align: top;
  line-height: 2.5;
  padding-left: 10px;
}

#contact .home {
  text-align: center;
  margin-top: 50px;
  margin-bottom: 50px;
}

#contact .icon {
  text-align: center;
}

#contact .contact-text {
  font-size: large;
  font-family: 'kokoro', serif;
  text-align: center;
  border: 4px double #f5c7e3;
  padding: 10px;
  background-color: #fffafa;
}

#contact .contact-text a {
  color: #917205;
}

#contact .contact-text .link-hpb:hover {
  color: #dd5bdd;
  border: 2px solid #dd5bdd;
  border-radius: 5px;
  padding: 5px 10px 10px 10px;
}

#contact .contact-text .link-cs:hover {
  color: #fe5fbe;
  border: 2px solid #fe5fbe;
  border-radius: 5px;
  padding: 5px 10px 10px 10px;
} 

#contact .tel-none {
  font-size: small;
}

/* ↑コンタクトページ↑ */



/* ↓スタッフページ↓ */

@media screen and (min-width: 700px) {
  #staff header {
    width: 100%;
    height: 150px;
  }

  #staff .content {
    width: 800px;
    margin: auto;
  }

  #staff #staff-info {
    width: 800px;
    margin: auto;
  }

  #staff #staff-info img {
    width: 250px;
  }

  #staff #staff-info .staff0902 img {
    margin-top: 100px;
    width: 550px;
  }
 
}

@media screen and (max-width: 700px) {
  #staff header {
    width: 100%;
    height: 15px;
  }

  #staff .icon {
    margin: 0;
    padding-bottom: 15px;
  }

  #staff .staff-text1 {
    margin: 20px;
  }

  #staff .staff-text1 p {
    font-size: 13px;
  }


  #staff #staff-info img {
    width: 150px;
  }
 
  #staff .staff-person .staff-text {
    margin: 15px 40px 15px 40px;
    text-align: left;
  }
 
  #staff #staff-info .staff0902 img {
    margin-top: 100px;
    width: 300px;
  }

} 

#staff .staff-text1 {
  font-family: 'kokoro', serif;
  text-align: center;
  border: 4px double #f5c7e3;
  padding: 10px;
  background-color: #fffafa;
}

#staff .content {
  width: auto;
  text-align: center;
  margin-bottom: 200px;
}

#staff .staff-person {
  margin-top: 100px;
}

#staff .staff-person a {
  color: #223d87;
}

#staff .staff-person a:hover {
  color: #223d87;
  border: 2px solid #223d87;
  border-radius: 5px;
  padding: 10px;
}

#staff #staff-info .staff-name {
  padding-top: 10px;
  font-size: large;
}

#staff #staff-info .staff-record {
  font-size: small;
  font-weight: bold;
}

#staff h4 {
  text-align: center;
}

#staff .hr-block {
  margin-top: 100px;
}


#staff .home {
  text-align: center;
  margin-top: 50px;
  margin-bottom: 50px;
}

#staff .skill-nail {
  color: #223d87;
}

#staff .skill-relax {
  color: #872254;
}

/* ↑スタッフページ↑ */


/* ↓cautionページ↓ */

@media screen and (min-width: 700px) {
  #caution header {
    width: 100%;
    height: 150px;
  }

  #caution .content .icon {
    margin-top: 50px;
    width: auto;
    text-align: center;
  }

  #caution .caution-info {
    margin-top: 200px;
  }

  #caution .content {
    width: 800px;
    margin: auto;
  }

  #caution .caution-text1 {
    font-family: 'kokoro', serif;
    border: 4px double #f5c7e3;
    padding: 20px 40px;
    margin: 50px 0;
    background-color: #fffafa;
  }

}

@media screen and (max-width: 700px) {
  #caution header {
    width: 100%;
    height: 90px;
  }

  #caution .content .icon {
    margin-top: 0;
    width: auto;
    text-align: center;
    background-color: #fffafa;
  }
  
  #caution .caution-text1 {
    font-family: 'kokoro', serif;
    border: 4px double #f5c7e3;
    padding: 10px;
    margin: 30px 10px 30px 10px;
    background-color: #fffafa;
  }

}

#caution .hr-block {
  margin-top: 100px;
}

#caution .home {
  text-align: center;
  margin-top: 50px;
  margin-bottom: 50px;
}



/* ↓newsスクロール(レスポンシヴ付き)↓ */


.info {
  -webkit-overflow-scrolling: touch;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  display: -webkit-box;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  max-width: 600px;
  height: 13em;
  margin: 0 15px 0 15px;
  background-color: #ffffff;
  overflow-y: scroll;
  margin-bottom: 50px;
}

@media (min-width:768px) {
  .info {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0 auto;
  }
  #index .top-news {
    background-color: #fefff8;  /*bodyと同じ*/
    padding-top: 5px;
    padding-bottom: 90px;
  }
}

.info dd,
.info dt {
  box-sizing: border-box;
  width: 100%;
  padding-bottom: .5em;
  padding-left: .5em
}

.info dt {
  font-style: normal;
  font-weight: initial
}

@media (min-width:768px) {
  .info dt {
    width: 12.5em;
    margin-bottom: .5em;
    border-bottom: 1px dotted #343a40
  }
}

.info dt:first-of-type {
  padding-top: .5em;
  /* ボーダートップ消した */
}

.info dt time {
  margin-right: .5em
}

.info dt span {
  box-sizing: border-box;
  display: inline-block;
  width: 7em;
  margin-right: .5em;
  padding: 0 .5em;
  background-color: #f5c7e329;
  color: #e90e98;
  font-size: 12px;
  line-height: 1.75;
  text-align: center
}

.info time {
  color: #adb5bd
}

.info dd {
  margin-left: 0;
  margin-bottom: .5em;
  border-bottom: 1px dotted silver;
  text-align: center;
}

@media (min-width:768px) {
  .info dd {
    width: calc(100% - 12.5em)
  }
  .info dd:first-of-type {
    padding-top: .5em;
    /* ボーダートップ消した */
  }
}

.info dd:nth-of-type(-n+3) {
  position: relative
}

@media (max-width:700px) {
  .info dt {
    text-align: left;
  }
  #index .top-news {
    background-color: #fdfff1;
    padding-top: 1px;
    padding-bottom: 20px;
  }
  .info dd {
    font-size: 12px;
  }
}

#index .top-news p {
  text-align: center;
  font-size: 20px;
  text-decoration: underline solid #ffe5f5 2px;
  margin-top: 80px;
  margin-bottom: 30px;
}

#index .top-news .info .news-ticket {
  width: 70%;
  margin: 30px auto;
  border: solid 5px #f0e6f2;
}

#index .top-news .info .news-summer {
  width: 80%;
  margin: 10px auto;
}


/* ↑news↑ */

/* ↓BCCバナー↓ */
@media (min-width:600px) {
  .banner {
    text-align: center;
    margin: 100px auto;
    width: 400px;
  }

  .banner img {
    width: 100%;
  }

  .banner .banner-bcc-text {
    line-height: 15px;
    letter-spacing: 1.7;
    width: 100%;
    margin: auto;
    text-align: center;
    background-color: #701244;
    padding: 1px 0;
    color: #ffffff;
  }
}

@media (max-width:600px) {
  .banner {
    text-align: center;
    margin: 40px 20px;
  }

  .banner img {
    width: 100%;
  }

  .banner .banner-bcc-text {
    line-height: 15px;
    letter-spacing: 1.7;
    width: 100%;
    margin: auto;
    padding: 10px 0;
    background-color: #fffafa;
  }
}

/* ↓バナー広告↓ */

@media (min-width:600px) {
  .wrap-banner-area {
    display: none;  /*とりあえず一旦非表示*/
    width: 80%;
    text-align: center;
    margin: 50px auto;
  }

  .wrap-banner-area .wrap-banner {
    margin-top: 50px;
    margin-bottom: 100px;
  }
  
  .wrap-banner-area .wrap-banner img {
    width: auto;
  }

  .wrap-banner-area p {
    width: 90%;
  }
  
}

@media (max-width:600px) {
  .wrap-banner-area {
    display: none;  /*とりあえず一旦非表示*/
    width: 90%;
    margin: auto;
    text-align: center;
  }
  
  .wrap-banner-area .wrap-banner {
    margin-top: 30px;
    margin-bottom: 120px;
  }

  .wrap-banner-area .wrap-banner img {
    width: 80%;
    margin: auto;
  }

  .wrap-banner-area .wrap-banner p {
    width: 100%;
    margin: auto;
  }
  
}

/* ↓ホームページリンクのバナー↓ */
@media (min-width:700px) {
  .banner-hp-area {
    width: 100%;
    margin: auto auto 100px auto;
    text-align: center;
    float: left;
  }

  .banner-hp-area img {
    width: 400px;
    margin: 15px;
    border-radius: 5px;
  }
}

@media (max-width:700px) {
  .banner-hp-area {
    width: auto;
    margin: auto;
    padding-bottom: 50px;
    text-align: center;
  }

  .banner-hp-area img {
    width: 90%;
    margin: 15px auto;
    border-radius: 10px;
  }
}




/* ↓パソコンフッター用バナー↓ */
@media screen and (min-width: 700px) {
  footer .sp-footer {
    display: none;
  }

  footer .banner-area hr {
    width: 100%;
    border: none;
    margin: 40px 0;
  }

  footer .banner-area {
    margin-top: 50px;
    width: 100%;
    text-align: center;
  }

  footer .banner-area img {
    width: auto;
    margin: auto;
  }

}
/* ↑パソコンフッター用バナー↑ */


/* ↓スマホフッター用バナー↓ */
@media screen and (max-width: 700px) {
  footer .pc-footer {
    display: none;
  }

  footer .banner-area hr {
    width: 100%;
    border: none;
    margin: 40px 0;
  }

  footer .banner-area {
    margin-top: 50px;
    width: 100%;
    text-align: center;
  }

}
/* ↑スマホフッター用バナー↑ */