@charset "UTF-8";

#senior-salon .block-hikkoshi-01 h2 {display: flex;padding: 3em 0 3.5em;justify-content: center;align-items: center;color: var(--livable-green);}
#senior-salon .block-hikkoshi-01 h2 span {display: block;margin-left: 1em;}

#senior-salon .block-hikkoshi-02 {background-color: #DAE9E1;height: 34.6875em;}
#senior-salon .block-hikkoshi-02  h3 {color: var(--livable-green);}
#senior-salon .block-hikkoshi-02  h4 {margin-top: 3.5em;color: var(--livable-lightgreen);line-height: 1.5;}
#senior-salon .block-hikkoshi-02  p {margin-top: auto;}
#senior-salon .block-hikkoshi-02  figure {position: absolute;top: 50%;right: 0;transform: translateY(-50%);}
#senior-salon .block-hikkoshi-02 .container {position: relative;width: calc(100% - 3em);height: 100%;display: flex;flex-direction: column;max-width: 1120px;padding: 1.5em 0;margin: 0 auto;}

#senior-salon .block-hikkoshi-03 h3 {border-bottom: 1px dotted #050505;max-width: 24em;margin: 2.5em auto;padding-bottom: 0.75em;line-height: 1.5;text-align: center;color: var(--professional-blue);}
#senior-salon .block-hikkoshi-03 .container {width: calc(100% - 3em);max-width: 966px;margin: 0 auto;}
#senior-salon .block-hikkoshi-03 .container > figure {margin: 7em 0 3em;}

#senior-salon .block-hikkoshi-04 h3 {border-bottom: 1px dotted #050505;max-width: 25em;margin: 4.5em auto 2.5em;padding-bottom: 0.75em;line-height: 1.5;text-align: center;color: var(--professional-blue);}
#senior-salon .block-hikkoshi-04 .container {width: calc(100% - 3em);max-width: 966px;margin: 0 auto;}
#senior-salon .block-hikkoshi-04 .container > figure {margin: 3em 0 0;}
#senior-salon .block-hikkoshi-04 .container > figure a {pointer-events: none;}
#senior-salon .block-hikkoshi-04 .case {background: #DDE7EF;margin: 3em 0;padding: 2em 0 3em;}
#senior-salon .block-hikkoshi-04 .case p {margin-bottom: 0.75em;text-align: center;color: var(--professional-blue);}
#senior-salon .block-hikkoshi-04 .case ul {display: flex;flex-wrap: wrap;width: calc(100% - 3em);max-width: 46em;margin: 0 auto;}
#senior-salon .block-hikkoshi-04 .case ul li {width: 50%;}
#senior-salon .block-hikkoshi-04 .case ul li::before {content: "・";margin-right: 0.5em;font-weight: 700;}

#senior-salon .service {display: flex;justify-content: space-between;}
#senior-salon .service > div {width: calc(50% - 1em);}
#senior-salon .service h4 {color: var(--livable-green);}
#senior-salon .service h5 {margin: 1.5em 0;}

@media screen and (max-width: 768px) {
  #senior-salon .block-hikkoshi-02 {height: auto;}
  #senior-salon .block-hikkoshi-02 h3 {font-size: 225%;line-height: 1.5;}
  #senior-salon .block-hikkoshi-02 h4 {margin: 1em 0;}
  #senior-salon .block-hikkoshi-02 figure {top: 100%;right: 50%;width: 70%;transform: translate(50%, -50%);z-index: 2;}
  #senior-salon .block-hikkoshi-02 .container {padding: 4.5em 0 14em;margin-bottom: 15em;}
  #senior-salon .block-hikkoshi-02 .container::after {content: "";position: absolute;bottom: 0;left: -1.5em;right: -1.5em;height: 20%;background-color: #fff;transform: translate3d(0, 50%, 0) skewY(-15deg);}

  #senior-salon .block-hikkoshi-03 h3 {margin: 5em 0 1em;}
  #senior-salon .block-hikkoshi-03 .container > figure {margin: 3em 0 1em;}

  #senior-salon .block-hikkoshi-04 h3 {max-width: 14em;margin: 2.5em 0 1em;}
  #senior-salon .block-hikkoshi-04 .case ul li {margin: 0 auto;width: calc(100% - 3em);}
  #senior-salon .block-hikkoshi-04 .container > figure {margin-bottom: 4.5em;}
  #senior-salon .block-hikkoshi-04 .container > figure a {pointer-events: auto;}

  #senior-salon .service {flex-direction: column-reverse;}
  #senior-salon .service > div {width: 100%;margin-top: 2em;}
  #senior-salon .service h4 {text-align: center;}
  #senior-salon .service h5 img {margin: 0 auto;}
}