@charset "UTF-8"; @-webkit-keyframes load {0%,80%,100% {-webkit-box-shadow: 0 2.5em 0 -1.3em;box-shadow: 0 2.5em 0 -1.3em;}40% {-webkit-box-shadow: 0 2.5em 0 0;box-shadow: 0 2.5em 0 0;}} @keyframes load {0%,80%,100% {-webkit-box-shadow: 0 2.5em 0 -1.3em;box-shadow: 0 2.5em 0 -1.3em;}40% {-webkit-box-shadow: 0 2.5em 0 0;box-shadow: 0 2.5em 0 0;}} :root {--livable-navy: #124A7B;--livable-gold: #BB8E00;--livable-yellow: #FCC800;--livable-gray: #9FA0A0;--livable-red: #C7000A;--livable-orange: #E56800;--livable-green: #006030;--livable-lightgreen: #48A63F;--professional-blue: #5081A5;--innovative-blue: #00AEEF;--nursing-red: #D14B2B;} body::after {content: "";display: block;padding-bottom: 105px;} #loader {position: fixed;width: 100%;height: 100%;z-index: -1;} #loader span, #loader span:before, #loader span:after { display: block;border-radius: 50%;width: 10px;height: 10px;-webkit-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation: load 1.8s infinite ease-in-out;animation: load 1.8s infinite ease-in-out;} #loader span {color: #db5d49;position: absolute;top: 150px;left: 50%;text-indent: -9999em;-webkit-transform: translateZ(0);transform: translateZ(0);-webkit-animation-delay: -0.16s;animation-delay: -0.16s;} #loader span:before, #loader span:after {content: "";position: absolute;top: 0;} #loader span:before {color: #003d71;left: -2.5em;-webkit-animation-delay: -0.32s;animation-delay: -0.32s;} #loader span:after {color: #cc9d42;left: 2.5em;} #pagetop a {opacity: 0;z-index: -1;transition: opacity ease 500ms, z-index ease 1ms 500ms;display: block;position: fixed;bottom: 220px;right: 1em;} #pagetop a::before {content: "";position: absolute;top: -0.75em;right: -0.75em;bottom: -0.75em;left: -0.75em;background-color: #000;opacity: 0.1;z-index: -1;mix-blend-mode: multiply;} #pagetop a::after {content: "";position: absolute;top: 2%;left: 2%;right: 2%;bottom: 2%;background-color: #fff;border-radius: 50%;z-index: -1;} #pagetop a:nth-child(1) {margin-bottom: 5.5em;} #pagetop a:nth-child(1) svg {display: block;width: 4em;height: 4em;filter: invert(22%) sepia(100%) saturate(644%) hue-rotate(172deg) brightness(90%) contrast(95%);} #pagetop a:nth-child(1)::before {border-radius: 100% 100% 0 0;} #pagetop a:nth-child(2) svg {display: block;width: 4em;height: 4em;filter: invert(53%) sepia(51%) saturate(543%) hue-rotate(67deg) brightness(93%) contrast(93%);} #pagetop a:nth-child(2)::before {border-radius: 0 0 100% 100%;} #pagetop.standby a {opacity: 1;z-index: 11;transition: opacity ease 500ms 1ms, z-index ease 1ms;} #conversion .container {position: fixed;left: 0;bottom: -105px;z-index: 10;width: 100%;background-color: var(--professional-blue);transition: bottom ease 500ms;} #conversion .container > div {width: calc(100% - 2em);max-width: 1126px;margin: 0 auto;display: flex;justify-content: space-between;align-items: end;} #conversion .container .tel {display: flex;align-items: center;font-family: "Noto Sans JP", sans-serif;} #conversion .container .tel span {display: block;margin-right: 0.5em;font-size: 150%;font-weight: 500;/*line-height: 4.375;*/letter-spacing: 0.05em;color: #fff;} #conversion .container .tel a {font-size: 262.25%;font-weight: 700;line-height: 2.5;letter-spacing: 0.08em;color: #fff;} #conversion .container .tel .s-area-link {font-size: medium;display: block;font-weight: normal;line-height: 1.2;margin: 10px 0 -30px;text-decoration: underline;} #conversion .container .online a {display: block;background-color: var(--livable-red);border-radius: 0.83em 0.83em 0 0;width: 18em;height: 3.5em;font-size: 150%;font-weight: 700;text-align: center;line-height: 3.5;color: #fff;} #conversion.standby .container {bottom: 0;} #senior-salon {opacity: 0;position: relative;padding-bottom: 100px;margin: 0 auto;min-width: 1200px;overflow-x: hidden;background-color: #fff;font-family: "Noto Sans JP", sans-serif;font-weight: 400;font-feature-settings: 'palt' on;color: #1A1A1C;letter-spacing: 0.05em;transition: opacity ease 500ms;} #senior-salon.staging {opacity: 1;} #senior-salon h1, #senior-salon h2, #senior-salon h3, #senior-salon h4, #senior-salon h5, #senior-salon h6, #senior-salon ul, #senior-salon ol, #senior-salon dl, #senior-salon li, #senior-salon dt, #senior-salon dd {font-size: 100%;} #senior-salon figure {margin: 0;} #senior-salon img {max-width: 100%;height: auto;display: block;} #senior-salon .btn {display: block;text-decoration: none;} #senior-salon .category-title {font-size: 212.5%;font-weight: 700;line-height: 1.58824;} #senior-salon .title-01 {font-size: 187.5%;font-weight: 700;letter-spacing: 0.05em;}/* 見出し1　30PX */ #senior-salon .title-02 {font-size: 150%;font-weight: 500;line-height: 1.67;letter-spacing: 0.05em;}/* 見出し　24PX */ #senior-salon .title-03 {font-size: 150%;font-weight: 700;line-height: 1.42;}/* 見出しbold */ #senior-salon .title-04 {font-size: 262.5%;font-weight: 700;line-height: 1.785;letter-spacing: 0.08em;}/* 大タイトル　42PX */ #senior-salon .text-01 {font-size: 125%;font-weight: 500;line-height: 1.8;letter-spacing: 0.05em;}/* 本文　20PX */ #senior-salon .text-02 {font-size: 125%;font-weight: 700;line-height: 1.8;letter-spacing: 0.05em;}/* 本文bold */ #senior-salon .text-03 {font-size: 125%;font-weight: 500;line-height: 1.5;letter-spacing: 0.03em;}/* 本文　20PX　タイト */ #senior-salon .caption-01 {font-size: 93.75%;font-weight: 400;} #senior-salon .button-01 {background-color: var(--professional-blue);border-radius: 5em;} #senior-salon .button-01 a {position: relative;height: 6.25em;background-color: #fff;border: 2px solid var(--professional-blue);border-radius: 5em;color: var(--professional-blue);transform: translateY(-0.625em);} #senior-salon .button-01 a span {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);font-size: 150%;font-weight: 500;text-align: center;line-height: 1.5;white-space: nowrap;} #senior-salon .button-01 a::after {content: "→";position: absolute;top: 50%;right: 1em;transform: translateY(-50%);font-size: 150%;} #senior-salon .appear.observe {opacity: 0;transform: translateY(10px);-webkit-backface-visibility: hidden;backface-visibility: hidden;will-change: transform;} #senior-salon .appear.append {opacity: 1;transform: translateY(0);transition: transform ease-in-out 1000ms 200ms,opacity ease-out 600ms 200ms;} #senior-salon .appears.observe {transform: translateY(10px);-webkit-backface-visibility: hidden;backface-visibility: hidden;will-change: transform;} #senior-salon .appears.append {transform: translateY(0);transition: transform ease-in-out 1000ms 200ms;} #senior-salon .appears.observe > * {opacity: 0;-webkit-backface-visibility: hidden;backface-visibility: hidden;will-change: transform;} #senior-salon .appears.append > *:nth-child(1) {opacity: 1;transition: opacity ease-out 600ms 200ms;} #senior-salon .appears.append > *:nth-child(2) {opacity: 1;transition: opacity ease-out 800ms 400ms;} #senior-salon .appears.append > *:nth-child(3) {opacity: 1;transition: opacity ease-out 1000ms 600ms;} #senior-salon .appears.append > *:nth-child(4) {opacity: 1;transition: opacity ease-out 1200ms 800ms;} #senior-salon .appears.append > *:nth-child(5) {opacity: 1;transition: opacity ease-out 1400ms 1000ms;} #senior-salon .appears.append > *:nth-child(6) {opacity: 1;transition: opacity ease-out 1600ms 1200ms;} #senior-salon .column-list {display: flex;} #senior-salon .block-common-01 .faq {max-width: 930px;margin: 13.125em auto 18.4375em;border-radius: 1.25em;background-color: var(--professional-blue);} #senior-salon .block-common-01 .faq a {position: relative;height: 12.5em;background-color: #fff;border-radius: 1.25em;border: 5px solid var(--professional-blue);transition: transform ease 200ms;transform: translateY(-0.625em);color: rgba(26, 26, 28, 1);} #senior-salon .block-common-01 .faq a::before {content: "";position: absolute;top: 0;left: 0;right: 0;bottom: -0.5em;background: transparent url("/assets/images/original/senior-salon-common-bg-01.png") no-repeat 100% 100% / auto 100%;} #senior-salon .block-common-01 .faq a::after {content: "";position: absolute;top: 0;left: 0;right: 0;bottom: -0.5em;background: transparent url("/assets/images/original/senior-salon-common-bg-02.png") no-repeat 0 100% / auto 100%;} #senior-salon .block-common-01 .faq a span {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);font-size: 262.5%;font-weight: 700;text-align: center;line-height: 1.78;letter-spacing: 0.08em;} #senior-salon .block-common-01 .faq a span svg {margin-left: 0.5em;} #senior-salon .block-common-01 .faq a span small {display: block;font-size: 57.14%;line-height: 1;} #senior-salon .block-common-02 {background-color: var(--professional-blue);border-radius: 6.25em 6.25em 0 0;max-width: 1366px;margin: 0 auto;} #senior-salon .block-common-02 figure {transform: translateY(-50%);} #senior-salon .block-common-02 figure img {margin: 0 auto;} #senior-salon .block-common-02 h2 {margin: -2em 0 2.35em;text-align: center;color: #fff;} #senior-salon .block-common-02 section {background-color: #fff;border-radius: 2.5em;padding: 3.125em;margin: 0 auto;max-width: 1126px;} #senior-salon .block-common-02 section h3 {margin-bottom: 1em;text-align: center;} #senior-salon .block-common-02 section h3 + p {margin-bottom: 0.5em;text-align: center;} #senior-salon .block-common-02 section .tel {display: flex;justify-content: center;align-items: center;} #senior-salon .block-common-02 section .tel span {display: block;padding-right: 2em;font-size: 150%;line-height: 1.33;} #senior-salon .block-common-02 section .tel a {font-size: 510%;font-weight: 700;color: #1A1A1C;} #senior-salon .block-common-02 section .caps {margin-top: 1.5em;font-size: 125%;font-weight: 400;line-height: 1.63;letter-spacing: 0.05em;text-align: center;color: #1A1A1C;} #senior-salon .block-common-02 section .s-other {/*background: #eee;*/padding: 0.6em;border-radius: 1em;max-width: 860px;margin: 1em auto 0; font-size: 140%;line-height: 1.67;letter-spacing: 0.05em;text-align: center;border: 3px solid var(--professional-blue);} #senior-salon .block-common-02 section .s-other + .caps {margin-top: 0.8em;} #senior-salon .block-common-02 section .s-other .s-tellink {font-weight: 700;color: #1A1A1C;padding: 0 0.2em;} #senior-salon .block-common-02 section .button-01 {max-width: 28.125em;margin: 0 auto;} #senior-salon .block-common-02 section .button-01 a {color: #1A1A1C;} #senior-salon .block-common-02 section + section {margin-top: 4.67em;} #senior-salon .block-common-02 section + section h3 + p {margin: -0.75em 0 1.25em;} #senior-salon .block-common-02 .salon h3 {margin: 3.25em 0 1.5em;text-align: center;color: #fff;} #senior-salon .block-common-02 .salon h3 + p {line-height: 1.5;text-align: center;color: #fff;} #senior-salon .block-common-02 .salon .tel span {display: block;margin: 1.75em 0 0.5em;font-size: 150%;line-height: 1.33;letter-spacing: 0.05em;text-align: center;color: #fff;} #senior-salon .block-common-02 .salon .tel a {display: block;font-size: 510%;font-weight: 700;text-align: center;color: #fff;} #senior-salon .block-common-02 .salon .caps {margin-top: 1.5em;font-size: 125%;font-weight: 400;line-height: 1.63;letter-spacing: 0.05em;text-align: center;color: #fff;} #senior-salon .block-common-02 .salon .s-other {background: #426a88;padding: 0.6em;border-radius: 1em;max-width: 860px;margin: 1em auto 0; font-size: 140%;color: #fff;line-height: 1.67;letter-spacing: 0.05em;text-align: center;border: 3px solid #fff;} #senior-salon .block-common-02 .salon .s-other + .caps {margin-top: 0.8em;} #senior-salon .block-common-02 .salon .s-other .s-tellink {font-weight: 700;color: #fff;padding: 0 0.2em;} #senior-salon .block-common-02 .salon ul {display: flex;flex-wrap: wrap;justify-content: space-between;margin: 0 auto;max-width: 1126px;} #senior-salon .block-common-02 .salon ul li {width: 31.25em;padding-bottom: 5em;} #senior-salon .block-common-02 .salon ul li span {color: #fff;} #senior-salon .block-common-02 .salon ul li small {display: block;margin-top: 0.5em;font-size: 83%;line-height: 1.5;letter-spacing: 0;} #senior-salon .block-common-02 .salon ul li small a {color: #fff;text-decoration: underline;} #senior-salon .block-common-02 .salon ul li::before {content: "";display: block;padding-top: 60%;margin-bottom: 1.5em;border-radius: 1.25em;} #senior-salon .block-common-02 .salon ul li:nth-child(1)::before {background: transparent url("/assets/images/original/senior-salon-common-02.jpg") no-repeat 0 0 / cover;} #senior-salon .block-common-02 .salon ul li:nth-child(2)::before {background: transparent url("/assets/images/original/senior-salon-common-03.jpg") no-repeat 0 0 / cover;} #senior-salon .block-common-02 .salon ul li:nth-child(3)::before {background: transparent url("/assets/images/original/senior-salon-common-04.jpg") no-repeat 0 0 / cover;} /* #senior-salon .block-common-02 .salon ul li:nth-child(4)::before {background: transparent url("/assets/images/original/senior-salon-common-05.jpg") no-repeat 0 0 / cover;} */ #senior-salon .block-common-02 .salon ul li:nth-child(4)::before {background: transparent url("/assets/images/object/senior-salon-common-05_260122.jpg") no-repeat 0 0 / cover;} #senior-salon .block-common-03 {margin: 4.375em 0;} #senior-salon .block-common-03 h2 img {margin: 0 auto;} #senior-salon .block-common-03 h3 {margin: 1.25em 0;font-size: 200%;font-weight: 700;text-align: center;color: var(--professional-blue);} #senior-salon .block-common-03 h3 + p {max-width: 31em;margin: 0 auto;text-align: center;} #senior-salon .block-common-03 ul {display: flex;flex-wrap: wrap;max-width: 1164px;margin: 0 auto;} #senior-salon .block-common-03 ul li {width: calc(50% - 2em);margin: 1.5em 1em;background-color: var(--professional-blue);border-radius: 1.25em;} #senior-salon .block-common-03 ul li a {position: relative;padding: 5% calc(90% - 18em) 5% 5%;border-radius: 1.25em;border: 3px solid var(--professional-blue);background: #fff none no-repeat 100% 50% / contain;transition: transform ease 200ms;transform: translateY(-0.625em);color: #1A1A1C;} #senior-salon .block-common-03 ul li a svg {position: absolute;right: 0;bottom: 0;margin: 1em;filter: invert(22%) sepia(100%) saturate(644%) hue-rotate(172deg) brightness(90%) contrast(95%);} #senior-salon .block-common-03 ul li a strong {display: block;padding-bottom: 0.25em;margin-bottom: 1em;border-bottom: 2px solid var(--professional-blue);} #senior-salon .block-common-03 ul li a span {display: block;min-height: 5.4em;} #senior-salon .block-common-03 ul li:nth-child(1) a {background-image: url("/assets/images/original/senior-salon-common-06.png");} #senior-salon .block-common-03 ul li:nth-child(2) a {background-image: url("/assets/images/original/senior-salon-common-07.png");} #senior-salon .block-common-03 ul li:nth-child(3) a {background-image: url("/assets/images/original/senior-salon-common-08.png");} #senior-salon .block-common-03 ul li:nth-child(4) a {background-image: url("/assets/images/original/senior-salon-common-09.png");} #senior-salon .block-common-04 {position: relative;max-width: 1000px;margin: 0 auto;padding-bottom: 8em;} #senior-salon .block-common-04::before {content: "ポイント";display: block;border-radius: 1.25em 1.25em 0 0;max-width: 10em;font-size: 150%;font-weight: 500;text-align: center;line-height: 2.5;letter-spacing: 0.05em;color: #fff;} #senior-salon .block-common-04 > figure {position: absolute;bottom: 0;right: 0;} #senior-salon .block-common-04 > div {border-radius: 0 2.5em 2.5em 2.5em;padding: 3.5em 4.75em 3.5em 4.75em;margin-right: 2.5em;} #senior-salon .block-common-05 .column-list {justify-content: center;} #senior-salon .block-common-05 .column-list > div {position: relative;border-style: solid;border-radius: 1em;border-width: 4px;margin: 0 1.5em;padding: 1.5em;width: 100%;} #senior-salon .block-common-05 .column-list > div + div::after {content: "";position: absolute;top: 50%;right: 100%;transform: translate(0, -50%);border-width: 0.5em 1em;border-style: solid;border-top-color: transparent;border-right-color: transparent;border-bottom-color: transparent;} #senior-salon .block-common-05 .column-list > div figure {position: relative;padding-top: 80%;} #senior-salon .block-common-05 .column-list > div figure img {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);} #senior-salon .block-common-05 .column-list > div figure::before {content: "";position: absolute;top: -1.5em;left: -1.5em;transform: translate(-50%, -50%);background-position: 0 0;background-repeat: no-repeat;} #senior-salon .block-common-05 .column-list > div h4 {position: relative;height: 4em;} #senior-salon .block-common-05 .column-list > div h4 span {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);text-align: center;white-space: nowrap;} /* Only PC ============================================== */ #conversion.pc a[href^="tel:"] {pointer-events: none;} #conversion.pc .online a {transition: background-color ease 200ms;} #conversion.pc .online a:hover {background-color: var(--nursing-red);} #senior-salon.pc a[href^="tel:"] {pointer-events: none;} #senior-salon.pc .button-01 a:hover {transform: translateY(0);background-color: var(--professional-blue);color: #fff;} #senior-salon.pc .block-common-01 .faq a:hover {transform: translateY(0);color: var(--professional-blue);} #senior-salon.pc .block-common-01 .faq a:hover span svg {filter: invert(47%) sepia(74%) saturate(284%) hue-rotate(162deg) brightness(87%) contrast(88%);} #senior-salon.pc .block-common-03 ul li a:hover {transform: translateY(0);color: var(--professional-blue);} @media screen and (max-width: 1090px) { #conversion .container > div {justify-content: space-around;} #conversion .container .tel {display: block;padding: 1.22em 1em;} #conversion .container .tel span {line-height: 1;} #conversion .container .tel a {line-height: 1;margin-top: 0.25em;} #conversion .container .tel .s-area-link {margin: 8px 0 12px;} } @media screen and (max-width: 860px) { #conversion .container > div {justify-content: space-between;} #conversion .container .online {padding: 0 1em;} #conversion .container .online a {width: 14em;} } @media screen and (min-width: 769px) { #senior-salon br.sp {display: none;} #senior-salon .block-common-05.s-241203data .column-list > div {margin: 0 0.5em;} #senior-salon .block-common-05.s-241203data .column-list > div::before {left: 0.5em;} #senior-salon .block-common-05.s-241203data .column-list > div + div::after {right: 84%; border-width: 1em 1.5em;} } @media screen and (max-width: 768px) { body::after {padding-bottom: 11.2em;font-size: 3vw;} #pagetop a {bottom: 20em;font-size: 3vw;} #pagetop a svg {width: 5em;height: 5em;} #conversion {font-size: 3vw;} #conversion .container {bottom: -11.2em;} #conversion .container > div {display: block;} #conversion .container .tel {text-align: center;padding: 1em;} #conversion .container .tel a {display: block;font-size: 256%;} #conversion .container .online {padding: 0;} #conversion .container .online a {width: 100%;height: 3em;line-height: 3;} #senior-salon {font-size: 3vw;min-width: auto;min-width: initial;} #senior-salon br.pc {display: none;} #senior-salon .category-title {font-size: 187.5%;} #senior-salon .title-01 {font-size: 175%;} #senior-salon .column-list {display: block;} #senior-salon .block-common-01 .faq {margin: 3em 1.5em 9em;} #senior-salon .block-common-01 .faq a {height: 22em;} #senior-salon .block-common-01 .faq a span {top: 0.5em;transform: translate(-50%, 0);white-space: nowrap;} #senior-salon .block-common-01 .faq a::before, #senior-salon .block-common-01 .faq a::after {bottom: -0.8em;background-size: auto 70%;} #senior-salon .block-common-02 figure {overflow: hidden;} #senior-salon .block-common-02 figure img {margin: 0 -5%;width: 110%;max-width: initial;} #senior-salon .block-common-02 section {margin: 0 1.5em;padding: 2em;} #senior-salon .block-common-02 section .tel {display: block;text-align: center;} #senior-salon .block-common-02 section .tel span {padding-right: 0;} #senior-salon .block-common-02 section .tel a {font-size: 390%;white-space: nowrap;} #senior-salon .block-common-02 section .caps {text-indent: 1em;} #senior-salon .block-common-02 section + section {margin-top: 1.5em;} #senior-salon .block-common-02 .salon .tel span {text-indent: 1em;} #senior-salon .block-common-02 .salon .tel a {font-size: 390%;white-space: nowrap;} #senior-salon .block-common-02 .salon .caps {text-indent: 1em;} #senior-salon .block-common-02 .salon .s-other {margin: 1em 1.5em 0;} #senior-salon .block-common-02 .salon ul {display: block;padding-bottom: 3em;} #senior-salon .block-common-02 .salon ul li {width: calc(100% - 3em);margin: 1.5em auto;padding-bottom: 2em;} #senior-salon .block-common-03 h2 {margin: 0 8em;} #senior-salon .block-common-03 ul {display: block;} #senior-salon .block-common-03 ul li {width: calc(100% - 2em);} #senior-salon .block-common-03 ul li a {background-size: auto 80%;} #senior-salon .block-common-04 {padding-bottom: 3em;} #senior-salon .block-common-04::before {border-top-left-radius: 0;} #senior-salon .block-common-04 > div {border-bottom-left-radius: 0;padding: 2em 4em 4em 2em;} #senior-salon .block-common-04 > figure {width: 36%;right: -1em;} #senior-salon .block-common-05 .column-list > div {width: calc(100% - 3em)!important;margin: 1em auto;} #senior-salon .block-common-05 .column-list > div figure {padding-top: 50%;} #senior-salon .block-common-05 .column-list > div figure::before {top: 100%;left: 0;transform: none;background-size: auto 3em;} #senior-salon .block-common-05 .column-list > div h4 span {transform: translateY(-50%);text-align: left;} #senior-salon .block-common-05 .column-list > div + div::after {top: 0.5em;right: calc(50% - 1em);transform: rotate(90deg) scale(2);} #senior-salon .ss-floating {bottom: -120px;} #chatbot-toggle_button { right: 3px !important; bottom: 160px !important;} }