@charset "UTF-8";

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

#senior-salon .block-souzoku-02 {background-color: #DAE9E1;height: 34.6875em;}
#senior-salon .block-souzoku-02  h3 {color: var(--livable-green);}
#senior-salon .block-souzoku-02  h4 {margin-top: 1em;color: var(--livable-lightgreen);line-height: 1.5;}
#senior-salon .block-souzoku-02  p {margin-top: auto;}
#senior-salon .block-souzoku-02  figure {position: absolute;top: 40%;right: 0;transform: translateY(-50%);}
#senior-salon .block-souzoku-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-souzoku-03 h3 {margin: 3em 0;text-align: center;color: var(--professional-blue);}
#senior-salon .block-souzoku-03 figure {width: calc(100% - 3em);max-width: 1072px;margin: 0 auto;}

#senior-salon .block-souzoku-04 h3 {border-bottom: 1px dotted #050505;max-width: 14em;margin: 3em auto 1em;padding-bottom: 1em;text-align: center;color: var(--professional-blue);}
#senior-salon .block-souzoku-04 section {background-color: #E8EDE6;border-radius: 1.25em;padding: 1.5em 3em;display: flex;align-items: center;}
#senior-salon .block-souzoku-04 section h4 {width: 50%;}
#senior-salon .block-souzoku-04 section p {width: 50%;font-weight: 700;font-size: 150%;line-height: 1.67;letter-spacing: 0.05em;color: var(--professional-blue);}
#senior-salon .block-souzoku-04 section p strong {display: block;margin-top: 0.5em;border-radius: 0.4em;background-color: var(--livable-green);text-align: center;line-height: 2;color: #fff;}
#senior-salon .block-souzoku-04 section + section {margin-top: 2em;}
#senior-salon .block-souzoku-04 .container {width: calc(100% - 3em);max-width: 1072px;margin: 0 auto;}

#senior-salon .block-souzoku-05 h3 {border-bottom: 1px dotted #050505;max-width: 12em;margin: 3em auto 1em;padding-bottom: 1em;text-align: center;color: var(--professional-blue);}
#senior-salon .block-souzoku-05 h4 {margin-bottom: 1em;color: var(--livable-green);}
#senior-salon .block-souzoku-05 .column-list {width: calc(100% - 3em);max-width: 1164px;margin: 0 auto;flex-wrap: wrap;counter-reset: number 0;}
#senior-salon .block-souzoku-05 .column-list > div {width: 50%;margin: 4em 0 0;padding: 0 0 3.5em 7em;position: relative;background-position: 1em 0;background-repeat: no-repeat;}
#senior-salon .block-souzoku-05 .column-list > div::before {content: "";position: absolute;top: 0;bottom: 0;left: 6em;width: 1px;background-color: var(--livable-green);}
#senior-salon .block-souzoku-05 .column-list > div::after {counter-increment: number 1;content: counter(number)"";position: absolute;top: -0.1em;left: 0;color: #fff;line-height: 1;font-size: 625%;font-family: Helvetica Neue;font-weight: 500;text-shadow: 2px  2px 1px var(--livable-green),-2px  2px 1px var(--livable-green),2px -2px 1px var(--livable-green),-2px -2px 1px var(--livable-green),2px  0px 1px var(--livable-green),0px  2px 1px var(--livable-green),-2px  0px 1px var(--livable-green),0px -2px 1px var(--livable-green);}
#senior-salon .block-souzoku-05 .column-list > div figure {position: absolute;bottom: 0;left: 7em;}

#senior-salon .block-souzoku-06 {width: calc(100% - 3em);max-width: 1164px;margin: 7em auto 5em;padding: 4em 0;background-color: #DDE7EF;}
#senior-salon .block-souzoku-06 h3 {margin: 0 0 1em;text-align: center;line-height: 1.5;color: var(--professional-blue);}
#senior-salon .block-souzoku-06 h4 {margin: 1em 0 0;text-align: center;}
#senior-salon .block-souzoku-06 p {text-align: center;}
#senior-salon .block-souzoku-06 img {margin: 0 auto;}
#senior-salon .block-souzoku-06 .button-01 {width: calc(100% - 3em);max-width: 30em;margin: 2em auto 0;}
#senior-salon .block-souzoku-06 .button-01 a {color: #000;}

#senior-salon .block-souzoku-07 img {margin: 0 auto;}
#senior-salon .block-souzoku-07 p {margin-top: 1.5em;text-align: center;line-height: 1.5;color: var(--livable-green);}

@media screen and (max-width: 768px) {
  #senior-salon .block-souzoku-02 {height: auto;}
  #senior-salon .block-souzoku-02 h3 {font-size: 225%;line-height: 1.5;}
  #senior-salon .block-souzoku-02 h4 {margin: 1em 0;}
  #senior-salon .block-souzoku-02 figure {top: 92%;right: 50%;width: 100%;transform: translate(50%, -50%);z-index: 2;}
  #senior-salon .block-souzoku-02 .container {padding: 4.5em 0 14em;margin-bottom: 7em;}
  #senior-salon .block-souzoku-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-souzoku-03 h3 {margin: 4em 0 1em;}

  #senior-salon .block-souzoku-04 h3 {margin: 1em auto;}
  #senior-salon .block-souzoku-04 section {display: block;}
  #senior-salon .block-souzoku-04 section h4 {width: 100%;}
  #senior-salon .block-souzoku-04 section h4 img {width: auto;margin: 0 auto;}
  #senior-salon .block-souzoku-04 section:nth-child(1) h4 img {height: 8em;}
  #senior-salon .block-souzoku-04 section:nth-child(2) h4 img {height: 6em;}
  #senior-salon .block-souzoku-04 section:nth-child(3) h4 img {height: 7em;}
  #senior-salon .block-souzoku-04 section:nth-child(4) h4 img {height: 6em;}
  #senior-salon .block-souzoku-04 section p {width: 100%;margin-top: 1em;font-size: 125%;text-align: center;}

  #senior-salon .block-souzoku-05 .column-list > div {width: 100%;margin-top: 2em;padding-bottom: 0;}
  #senior-salon .block-souzoku-05 .column-list > div figure {position: relative;bottom: inherit;left: inherit;margin-top: 1em;}
  #senior-salon .block-souzoku-05 .column-list > div::after {left: 0.2em;}

  #senior-salon .block-souzoku-06 img {width: auto;height: 8em;margin: 0 auto;}

  #senior-salon .block-souzoku-07 {display: flex;flex-direction: column-reverse;}
  #senior-salon .block-souzoku-07 figure {margin: 3em 8em 4em;}
}