@charset "UTF-8";

#pagetop a:nth-child(1)::before {display: none;}
#pagetop a:nth-child(1) {margin-bottom: 0;}
#pagetop a:nth-child(2) {display: none;}

#senior-salon .block-top-01 figure img {margin: 0 auto;}

#senior-salon .block-top-02 p {margin-top: 3.5em;margin-bottom: 2em;font-size: 150%;font-weight: bold;text-align: center;line-height: 2.08;}
#senior-salon .block-top-02 figure img {margin: 0 auto;}

#senior-salon .block-top-03 h2 {margin: 3.5em 0 1.25em;text-align: center;color: var(--professional-blue);}
#senior-salon .block-top-03 section {border-radius: 4em;max-width: 1366px;margin: 0 auto;padding: 2.75em;}
#senior-salon .block-top-03 section .container {margin: 0 auto;max-width: 1200px;display: flex;align-items: center;}
#senior-salon .block-top-03 section .container > div:nth-child(1) {width: calc(100% - 40em);}
#senior-salon .block-top-03 section .container > div:nth-child(2) {width: 40em;}
#senior-salon .block-top-03 section header {position: relative;padding-left: 11em;}
#senior-salon .block-top-03 section header h3 {margin-bottom: 0.85em;}
#senior-salon .block-top-03 section header::before {content: "";position: absolute;top: 50%;left: 0;background: transparent none no-repeat 0 0 / contain;width: 9.375em;height: 9.375em;transform: translateY(-50%);}
#senior-salon .block-top-03 section ul {display: flex;flex-wrap: wrap;}
#senior-salon .block-top-03 section ul li {width: calc(50% - 2em);margin: 1.5em 1em;border-radius: 1.25em;}
#senior-salon .block-top-03 section ul li a {position: relative;padding: 5%;border-radius: 1.25em;border: 3px solid transparent;background: #fff none no-repeat 50% / contain;transition: transform ease 200ms;transform: translateY(-0.625em);}
#senior-salon .block-top-03 section ul li a span {position: absolute;left: 0;bottom: 0;margin: 0.5em 1em;font-size: 125%;font-weight: 700;line-height: 1.4;white-space: nowrap;}
#senior-salon .block-top-03 section ul li a svg {position: absolute;right: 0;bottom: 0;margin: 1em;}
#senior-salon .block-top-03 section header + .more {margin-top: 4em;max-width: 28em;}

#senior-salon .block-top-03 section:nth-of-type(1) {background-color: rgba(18, 74, 123, 0.07);}
#senior-salon .block-top-03 section:nth-of-type(1) header::before {background-image: url("/assets/images/original/senior-salon-top-03.png");}
#senior-salon .block-top-03 section:nth-of-type(1) header h3,
#senior-salon .block-top-03 section:nth-of-type(1) header h3 + p {color: var(--livable-navy);}
#senior-salon .block-top-03 section:nth-of-type(1) ul li {background-color: var(--livable-navy);}
#senior-salon .block-top-03 section:nth-of-type(1) ul li a {border-color: var(--livable-navy);color: var(--livable-navy);}

#senior-salon .block-top-03 section:nth-of-type(2) {background-color: rgba(187, 142, 0, 0.07);}
#senior-salon .block-top-03 section:nth-of-type(2) header::before {background-image: url("/assets/images/original/senior-salon-top-04.png");}
#senior-salon .block-top-03 section:nth-of-type(2) header h3,
#senior-salon .block-top-03 section:nth-of-type(2) header h3 + p {color: var(--livable-gold);}
#senior-salon .block-top-03 section:nth-of-type(2) ul li {background-color: var(--livable-gold);}
#senior-salon .block-top-03 section:nth-of-type(2) ul li a {border-color: var(--livable-gold);color: var(--livable-gold);}

#senior-salon .block-top-03 section:nth-of-type(3) {background-color: rgba(199, 0, 10, 0.07);}
#senior-salon .block-top-03 section:nth-of-type(3) header::before {background-image: url("/assets/images/original/senior-salon-top-05.png");}
#senior-salon .block-top-03 section:nth-of-type(3) header h3,
#senior-salon .block-top-03 section:nth-of-type(3) header h3 + p {color: var(--nursing-red);}
#senior-salon .block-top-03 section:nth-of-type(3) ul li {background-color: var(--nursing-red);}
#senior-salon .block-top-03 section:nth-of-type(3) ul li a {border-color: var(--nursing-red);color: var(--nursing-red);}

#senior-salon .block-top-03 section:nth-of-type(4) {background-color: rgba(0, 96, 48, 0.07);}
#senior-salon .block-top-03 section:nth-of-type(4) header::before {background-image: url("/assets/images/original/senior-salon-top-06.png");}
#senior-salon .block-top-03 section:nth-of-type(4) header h3,
#senior-salon .block-top-03 section:nth-of-type(4) header h3 + p {color: var(--livable-green);}
#senior-salon .block-top-03 section:nth-of-type(4) ul li {background-color: var(--livable-green);}
#senior-salon .block-top-03 section:nth-of-type(4) ul li a {border-color: var(--livable-green);color: var(--livable-green);}

#senior-salon.pc .block-top-03 section ul li a:hover {transform: translateY(0);}
#senior-salon.pc .block-top-03 section:nth-of-type(1) ul li a:hover svg{filter: invert(23%) sepia(35%) saturate(2139%) hue-rotate(181deg) brightness(94%) contrast(95%);}
#senior-salon.pc .block-top-03 section:nth-of-type(2) ul li a:hover svg{filter: invert(46%) sepia(99%) saturate(1232%) hue-rotate(22deg) brightness(96%) contrast(101%);}
#senior-salon.pc .block-top-03 section:nth-of-type(3) ul li a:hover svg{filter: invert(9%) sepia(100%) saturate(6475%) hue-rotate(20deg) brightness(89%) contrast(124%);}
#senior-salon.pc .block-top-03 section:nth-of-type(4) ul li a:hover svg{filter: invert(25%) sepia(64%) saturate(811%) hue-rotate(107deg) brightness(98%) contrast(105%);}

@media screen and (max-width: 768px) {
  #senior-salon .block-top-03 section {padding: 3em 1.5em;border-radius: 0;}
  #senior-salon .block-top-03 section header + .more {margin: 4em auto 0;}
  #senior-salon .block-top-03 section .container {display: block;}
  #senior-salon .block-top-03 section .container > div:nth-child(1) {width: 100%;}
  #senior-salon .block-top-03 section .container > div:nth-child(2) {width: 100%;}
  #senior-salon .block-top-03 section ul {margin: 3em -0.5em 0;}
  #senior-salon .block-top-03 section ul li {width: calc(50% - 1em);margin: 1em 0.5em;}
  #senior-salon .block-top-03 section ul li a span {right: 0;text-align: center;}
  #senior-salon .block-top-03 section ul li a svg {display: none;}
}
