@charset "UTF-8";
/* CSS Document */
/* Scss Document */
/* Scss Document */
#contents { position: relative; padding: 0% 0% 21.33% 0%; background: linear-gradient(315deg, #52B1CC 0%, #0095BF 100%); color: #fff; }
#contents .mainimg { position: absolute; left: 0; top: 0; }

/*-----タイトル-----*/
#salon-ttl { padding: 0% 0% 16% 0%; background: url("/saito/img/newsalon/mainimg.png") center bottom/cover no-repeat; }
#salon-ttl .salon-ttl__logo { width: 86%; max-width: 800px; margin: auto; padding: 32% 0% 16% 0%; }
#salon-ttl .salon-ttl__copy { margin-bottom: 20px; font-size: 2rem; }
@media (min-width: 375px) { #salon-ttl .salon-ttl__copy { font-size: calc( 2rem + ( 1vw - 3.75px ) * 1.4906832298 ); } }
@media (min-width: 1180px) { #salon-ttl .salon-ttl__copy { font-size: 3.2rem; } }
#salon-ttl .salon-ttl__txt { text-align: center; }

/*-----フロアマップ-----*/
#floor .floor__map { position: relative; padding: 18% 0px 26%; }
#floor .floor__img { position: absolute; width: 48%; }
#floor .floor__img--01 { top: 0; right: 0; }
#floor .floor__img--02 { left: 0; bottom: 0; }

/*-----流れ-----*/
#flow { margin: 0% 0% 21.33% 0%; }
#flow .flow__ttl { padding: 5px 0; margin: 0% 0% 8% 0%; border-top: 1px solid; border-bottom: 1px solid; font-size: 1.8rem; }
@media (min-width: 375px) { #flow .flow__ttl { font-size: calc( 1.8rem + ( 1vw - 3.75px ) * 0.7453416149 ); } }
@media (min-width: 1180px) { #flow .flow__ttl { font-size: 2.4rem; } }
#flow .flow__list li { position: relative; padding: 15px; margin-bottom: 20px; box-sizing: border-box; background: #d7ebf3; border-radius: 10px; color: #03779e; line-height: 1.3; }
#flow .flow__list li .flow__list-inner { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; justify-content: flex-start; align-items: center; }
#flow .flow__list li .flow__icon { width: 20%; margin-right: 4%; }
#flow .flow__list li .flow__icon img { display: block; margin: auto; width: auto; height: 30px; }
#flow .flow__list li .flow__txt { width: 76%; }
#flow .flow__list li:not(:last-child):after { position: absolute; left: 0; right: 0; bottom: -7px; transform: translateY(100%); width: 0; height: 0; display: block; border: 6px solid transparent; border-top-color: #d7ebf3; margin: auto; content: ''; }

/*-----共通-----*/
.rn-box { margin: 0% 0% 16% 0%; }
.rn-box .rn-box__mainimg { position: relative; }
.rn-box .rn-box__mainimg img { box-shadow: 10px 10px 0 rgba(255, 255, 255, 0.25); }
.rn-box .rn-box__mainimg .rn-box__deco { position: absolute; left: 0; top: 0; z-index: 1; transform: translateY(-70%); opacity: .15; font-size: 3.8rem; color: #fff; line-height: 1; }
.rn-box .rn-box__txt { margin-bottom: 15px; }
.rn-box .rn-box__ttl { padding-bottom: 5px; margin-bottom: 10px; border-bottom: 1px solid #fff; line-height: 1.2; }
.rn-box .rn-box__ttl .rn-box__num { display: inline-block; position: relative; z-index: 1; margin-top: -3rem; font-family: DINNextLTPro-Condensed,Arial, Helvetica, "sans-serif"; font-size: 1.3rem; text-align: center; line-height: 1; }
@media (min-width: 375px) { .rn-box .rn-box__ttl .rn-box__num { font-size: calc( 1.3rem + ( 1vw - 3.75px ) * 0.4968944099 ); } }
@media (min-width: 1180px) { .rn-box .rn-box__ttl .rn-box__num { font-size: 1.7rem; } }
.rn-box .rn-box__ttl .rn-box__num .ll-txt { display: block; font-family: DINNextLTPro-Bold,Arial, Helvetica, "sans-serif"; font-weight: bold; font-size: 430%; letter-spacing: normal; }
.rn-box .rn-box__ttl .rn-box__copy { font-size: 1.4rem; }
@media (min-width: 375px) { .rn-box .rn-box__ttl .rn-box__copy { font-size: calc( 1.4rem + ( 1vw - 3.75px ) * 0.4968944099 ); } }
@media (min-width: 1180px) { .rn-box .rn-box__ttl .rn-box__copy { font-size: 1.8rem; } }
.rn-box .rn-box__ttl .rn-box__ttl-txt { font-size: 2.7rem; text-align: left; }
@media (min-width: 375px) { .rn-box .rn-box__ttl .rn-box__ttl-txt { font-size: calc( 2.7rem + ( 1vw - 3.75px ) * 1.1180124224 ); } }
@media (min-width: 1180px) { .rn-box .rn-box__ttl .rn-box__ttl-txt { font-size: 3.6rem; } }
.rn-box .rn-box__img { margin-bottom: 30px; }
.rn-box .rn-box__img figure { display: block; width: 70%; margin: auto; }
.rn-box .rn-box__img figure img { box-shadow: 10px 10px 0 rgba(255, 255, 255, 0.25); }
.rn-box .rn-box__img.half { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; justify-content: center; }
.rn-box .rn-box__img.half figure { width: 40% !important; margin: 0 2%; }
.rn-box .rn-box__img:last-child { margin-bottom: 0; }
.rn-box .rn-box__img .rn-box__imgs-txt { margin-top: 15px; }
.rn-box .rn-box__img .rn-box__imgs-txt .rn-box__imgs-ttl { margin-bottom: 5px; font-weight: normal; font-size: 1.5rem; text-align: center; letter-spacing: 0.2em; }
.rn-box:last-child { margin-bottom: 0; }

#rn-03 .rn-box__img--01 { text-align: center; }

/*------------------------------
		769px以上
------------------------------*/
@media screen and (min-width: 769px) { #salon-ttl .salon-ttl__logo { width: 66%; padding: 22% 0% 6% 0%; }
  /*-----フロアマップ-----*/
  #floor .floor__map { padding: 10% 0px 8%; }
  #floor .floor__img { width: 33%; }
  #floor .floor__img--02 { left: auto; right: 4%; }
  /*-----流れ-----*/
  #flow { margin-bottom: 140px; }
  #flow .flow__ttl { margin-bottom: 30px; }
  #flow .flow__list { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; }
  #flow .flow__list li { width: 18%; padding: 20px; margin-bottom: 0; border-radius: 50%; }
  #flow .flow__list li .flow__list-inner { flex-direction: column; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; margin: auto; }
  #flow .flow__list li .flow__icon { width: 100%; display: block; margin: 0 auto 10px; }
  #flow .flow__list li .flow__icon img { height: 50px; }
  #flow .flow__list li .flow__txt { width: 100%; text-align: center; font-size: 1.2rem; letter-spacing: normal; } }
@media screen and (min-width: 769px) and (min-width: 769px) { #flow .flow__list li .flow__txt { font-size: calc( 1.2rem + ( 1vw - 7.69px ) * 0.7299270073 ); } }
@media screen and (min-width: 769px) and (min-width: 1180px) { #flow .flow__list li .flow__txt { font-size: 1.5rem; } }
@media screen and (min-width: 769px) { #flow .flow__list li:not(:last-child):after { left: auto; right: -5%; bottom: 50%; border: 10px solid transparent; border-top-color: #d7ebf3; transform: translate(100%, 50%) rotate(-90deg); }
  #flow .flow__list li:before { display: block; padding-top: 100%; content: ''; }
  /*-----共通-----*/
  .rn-box { margin-bottom: 140px; }
  .rn-box .rn-box__inner { position: relative; }
  .rn-box .rn-box__wrap { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; }
  .rn-box .rn-box__mainimg .rn-box__deco { width: 50vw; font-size: 4rem; } }
@media screen and (min-width: 769px) and (min-width: 769px) { .rn-box .rn-box__mainimg .rn-box__deco { font-size: calc( 4rem + ( 1vw - 7.69px ) * 9.7323600973 ); } }
@media screen and (min-width: 769px) and (min-width: 1180px) { .rn-box .rn-box__mainimg .rn-box__deco { font-size: 8rem; } }
@media screen and (min-width: 769px) { .rn-box .rn-box__mainimg { position: static; width: 40%; }
  .rn-box .rn-box__txt { width: 60%; }
  .rn-box .rn-box__ttl .rn-box__num { margin-top: 0; }
  .rn-box .rn-box__img { position: absolute; margin-bottom: 0; }
  .rn-box .rn-box__img .rn-box__imgs-txt .rn-box__imgs-ttl { font-size: 1.5rem; text-align: left; } }
@media screen and (min-width: 769px) and (min-width: 769px) { .rn-box .rn-box__img .rn-box__imgs-txt .rn-box__imgs-ttl { font-size: calc( 1.5rem + ( 1vw - 7.69px ) * 1.2165450122 ); } }
@media screen and (min-width: 769px) and (min-width: 1180px) { .rn-box .rn-box__img .rn-box__imgs-txt .rn-box__imgs-ttl { font-size: 2rem; } }
@media screen and (min-width: 769px) { .rn-box .rn-box__img figure { width: 100%; }
  .rn-box:nth-of-type(odd) .rn-box__ttl { padding-left: 10%; }
  .rn-box:nth-of-type(odd) .rn-box__read { padding-left: 10%; }
  .rn-box:nth-of-type(even) .rn-box__wrap { flex-flow: row-reverse wrap; }
  .rn-box:nth-of-type(even) .rn-box__mainimg .rn-box__deco { left: auto; right: 0; text-align: right; }
  .rn-box:nth-of-type(even) .rn-box__ttl { padding-right: 10%; }
  .rn-box:nth-of-type(even) .rn-box__read { padding-right: 10%; }
  #rn-01 .rn-box__inner { padding-bottom: 10%; }
  #rn-01 .rn-box__img--01 { left: 18%; bottom: 0; width: 25%; }
  #rn-02 .rn-box__inner, #rn-04 .rn-box__inner { padding-bottom: 25%; }
  #rn-02 .rn-box__img--01, #rn-04 .rn-box__img--01 { left: 20%; bottom: 10%; width: 22%; }
  #rn-02 .rn-box__img--02, #rn-04 .rn-box__img--02 { left: 47%; bottom: 12%; width: 25%; }
  #rn-02 .rn-box__img--03, #rn-04 .rn-box__img--03 { left: 70%; bottom: 0; width: 20%; }
  #rn-03 .rn-box__imgs { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; }
  #rn-03 .rn-box__img { width: 46%; position: static; margin-bottom: 20px; }
  #rn-03 .rn-box__img figure { width: 70%; }
  #rn-03 .rn-box__img:nth-of-type(even) { transform: translateY(30px); } }
/*------------------------------
		961px以上
------------------------------*/
@media screen and (min-width: 961px) { #salon-ttl { padding-bottom: 100px; }
  #floor .floor__map { padding: 60px 0px; max-width: 800px; margin: auto; }
  #floor .floor__img { max-width: 200px; }
  #floor .rn-btn a .st9, #floor .rn-btn a .st8 { transition: .3s; }
  #floor .rn-btn a:hover { opacity: 1; }
  #floor .rn-btn a:hover .st9 { fill: #fff; }
  #floor .rn-btn a:hover .st8 { fill: #0E98C0; }
  #floor .rn-btn a:hover > g .st8 { fill: #fff; }
  .rn-box .rn-box__wrap { align-items: center; }
  .rn-box .rn-box__ttl { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; align-items: center; }
  .rn-box .rn-box__ttl .rn-box__num { position: relative; width: 100px; }
  .rn-box .rn-box__ttl .rn-box__num:after { display: block; position: absolute; right: -10px; top: 50%; z-index: 1; transform: translateY(-50%) rotate(35deg); width: 1px; height: 90%; background: #fff; content: ''; }
  .rn-box .rn-box__ttl .rn-box__copy { padding-left: 20px; }
  .rn-box .rn-box__ttl .rn-box__ttl-wrap { width: calc(96% - 100px); }
  #rn-01 .rn-box__inner { padding-bottom: 160px; }
  #rn-01 .rn-box__img--01 { left: 35%; }
  #rn-03 .rn-box__inner { padding-bottom: 80%; }
  #rn-03 .rn-box__img { position: absolute; }
  #rn-03 .rn-box__img figure { width: 100%; }
  #rn-03 .rn-box__img--01 { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; flex-flow: row-reverse wrap; align-items: flex-end; width: 38%; left: 18%; top: 21%; text-align: left; }
  #rn-03 .rn-box__img--01 figure { width: 50%; margin: 0; }
  #rn-03 .rn-box__img--01 .rn-box__imgs-txt { width: 50%; }
  #rn-03 .rn-box__img--01 .rn-box__imgs-txt .rn-box__imgs-ttl { text-align: left; }
  #rn-03 .rn-box__img--02 { width: 25%; right: 4%; top: 24%; }
  #rn-03 .rn-box__img--03 { display: flex; flex-flow: row wrap; align-content: flex-start; justify-content: space-between; flex-flow: row-reverse wrap; top: 53%; left: 2%; width: 52%; }
  #rn-03 .rn-box__img--03 figure { width: 58%; margin: 0; }
  #rn-03 .rn-box__img--03 .rn-box__imgs-txt { width: 38%; }
  #rn-03 .rn-box__img--04 { flex-flow: row-reverse wrap; top: 68%; left: 30%; width: 38%; }
  #rn-03 .rn-box__img--04 .rn-box__imgs-txt { margin-top: -80px; margin-left: auto; width: 50%; margin-right: -4%; }
  #rn-03 .rn-box__img--04 .rn-box__imgs-txt .rn-box__imgs-ttl { text-align: left; }
  #rn-03 .rn-box__img--04 figure { margin: 0 4%; }
  #rn-03 .rn-box__img--04 figure:nth-of-type(2) { margin-top: 100px; }
  #rn-03 .rn-box__img--05 { display: block; width: 18%; left: 8%; top: 76%; }
  #rn-02 .rn-box__inner, #rn-04 .rn-box__inner { padding-bottom: 280px; }
  #rn-02 .rn-box__img--01, #rn-04 .rn-box__img--01 { left: 10%; bottom: 8%; }
  #rn-02 .rn-box__img--02, #rn-04 .rn-box__img--02 { left: 40%; bottom: 21%; }
  #rn-02 .rn-box__img--03, #rn-04 .rn-box__img--03 { left: 62%; } }
/*------------------------------
		1181px以上
------------------------------*/
@media screen and (min-width: 1181px) { #contents { padding-bottom: 120px; }
  #rn-03 .rn-box__inner { padding-bottom: 900px; } }

/*# sourceMappingURL=style.css.map */
