@charset "UTF-8";

.about__container {
    position: relative;
    z-index: 0;
}

.about__container::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    background:
    radial-gradient(300px 300px at 90% 98%,
      rgba(99,183,167,.16), rgba(99,183,167,0) 80%),
    radial-gradient(400px 400px at 80% 18%,
      rgba(243,201,211,.28), rgba(243,201,211,0) 80%),
    radial-gradient(400px 400px at 90% 50%,
      rgba(99,183,167,.16), rgba(99,183,167,0) 72%),
    radial-gradient(300px 300px at 22% 78%,
      rgba(255,214,160,.26), rgba(255,214,160,0) 72%);

    filter: blur(10px);
}

/* PC */
@media screen and (min-width: 769px) {
    .about__container {
        position: relative;
        z-index: 0;
    }

    .about__container::before {
        content: '';
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: -1;
        background:
        radial-gradient(400px 400px at 95% 95%,
        rgba(99,183,167,.16), rgba(99,183,167,0) 80%),
        radial-gradient(550px 550px at 80% 20%,
        rgba(243,201,211,.28), rgba(243,201,211,0) 80%),
        radial-gradient(400px 400px at 90% 50%,
        rgba(99,183,167,.16), rgba(99,183,167,0) 72%),
        radial-gradient(600px 600px at 22% 78%,
        rgba(255,214,160,.26), rgba(255,214,160,0) 72%);

        filter: blur(10px);
    }


}


/*====================
FV
=====================*/
.about__header {
    padding: 68px 9.6% 68px;
    text-align: left;
    background-image: url(../images/about-fv-SP.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: 1;
}

.common__title h2 {
    color: var(--primary-lightgreen);
    font-family: Montserrat;
    font-size: 1.4rem;
    font-style: normal;
    letter-spacing: 0.36px;
}

.common__title p {
    color: var(--primary-green);
    font-family: "Shippori Mincho";
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.6px;
    margin-top: 6px;
}


/* fv PC */
@media screen and (min-width: 769px) {
    .about__header {
        padding: 100px 0 110px 100px;
        text-align: left;
        background-image: url(../images/about-fv-PC.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .common__title h2 {
        font-size: 2rem;
        letter-spacing: 0.6px;
    }

    .common__title p {
        font-size: 4.2rem;
        line-height: 1.2;
        letter-spacing: 0.6px;
        margin-top: 6px;
    }

}
/* fv PC */


/*====================
当院について
=====================*/
.section--about {
    padding: 36px 5.6% 60px;
}

.about--policy {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.7rem;
    line-height: normal;
    letter-spacing: 1.19px;
    font-weight: 500;
    position: relative;
    padding-left: calc(90px + 9px);
    width: 333px;
}

.about--policy::before {
    position: absolute;
    content: "";
    width: 90px;         
    height: 0.5px;         
    background: var(--primary-black);   
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
}

.value__inner h4 {
    color: var(--primary-green);
    font-family: "Shippori Mincho";
    font-size: 2rem;
    line-height: 1.6;
    font-weight: 500;
    letter-spacing: 1.26px;
    margin-top: 33px;
    width: 333px;
}

.value__list {
    margin-top: 21px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.value__list img {
    width: 35px;
    height: 35px;
}

.value__item {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.4rem;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: 0.42px;
}

/* 院長メッセージ */

.PCbr {
    display: none;
}

.messsage__container {
    margin-top: 54px;
}

.about--message {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.7rem;
    line-height: normal;
    letter-spacing: 1.19px;
    font-weight: 500;
    position: relative;
    padding-left: calc(90px + 9px);
    width: 333px;
}

.about--message::before {
    position: absolute;
    content: "";
    width: 90px;         
    height: 1px;         
    background: var(--primary-black);   
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
}

.firsthalfimg {
    max-width: 100%;
    height: auto;
    margin-top: 33px;
}

.firsthalf h4 {
    color: var(--primary-green);
    font-family: "Shippori Mincho";
    font-size: 2rem;
    line-height: 1.5;
    font-weight: 600;
    letter-spacing: 1.4px;
    margin-top: 21px;
}

.firsthalf p {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.7;
    letter-spacing: 0.8px;
}

.firsthalf p:first-of-type {
    margin-top: 12px;
}

.firsthalf p:nth-last-child(2) {
    margin-top: 6px;
}

.firsthalf p:last-of-type {
    margin-top: 6px;
}

.secondfalf__img--SP {
    margin-top: 27px;
    max-width: 100%;
}

.secondfalf__PC img {
    display: none;
}

.secondfalf__img--PC {
    display: none;
}

.secondfalf p {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.7;
    letter-spacing: 0.8px;
}

.secondfalf p:first-of-type {
    margin-top: 27px;
}

.secondhalf p:nth-last-child(2) {
    margin-top: 6px;
}

.secondhalf p:last-of-type {
    margin-top: 6px;
}

.mood-visual--PC {
    display: none;
}

.mood-visual--SP {
    display: block;
    width: 90%;
    margin-left: auto;
}

/* 当院について　PC */
@media screen and (min-width: 769px) {
    .section--about {
        max-width: 1157px;
        margin: 0 auto;
        padding: 160px 0 204px;
    }

    .about--policy {
        font-size: 3rem;
        letter-spacing: 2.1px;
        position: relative;
        padding-left: calc(210px + 18px);
        width: 1157px;
        display: block;
    }

    .about--policy::before {
        position: absolute;
        content: "";
        display: block;
        width: 210px;         
        height: 1px;         
        background: var(--primary-black);   
        left: 0px;
        top: 50%;
        transform: translateY(-50%);
    }

    .value__inner h4 {
        color: var(--primary-green);
        font-family: "Shippori Mincho";
        font-size: 2.8rem;
        line-height: 1.6;
        font-weight: 500;
        letter-spacing: 1.96px;
        margin-top: 0;
        margin-top: 77px;
        width: 450px;
    }
    
    .value__list {
        margin-top: 0;
        display: flex;
        align-items: center;
        gap: 27px;
        margin-top: 54px;
        width: 659px;
    }

    .value__list img {
        width: 55px;
        height: 55px;
    }

    .value__item {
        color: var(--primary-black);
        font-family: "Zen Kaku Gothic New";
        font-size: 2rem;
        line-height: 1.6;
        font-weight: 400;
        letter-spacing: 0.9px;
    }

    .PCbr {
        display: block;
    }

    .value__inner {
        max-width: 559px;
        margin: 0 auto;
    }

/* 院長メッセージ */

    .messsage__container {
        margin-top:0px;
        margin-top: 237px;
    }

    .about--message {
        font-size: 3rem;
        letter-spacing: 2.1px;
        position: relative;
        padding-left: calc(210px + 18px);
        width: 1157px;
    }

    .about--message::before {
        position: absolute;
        content: "";
        width: 210px;         
        height: 0.5px;         
        background: var(--primary-black);   
        left: 0px;
        top: 50%;
        transform: translateY(-50%);
    }

    .firsthalfimg {
        width: 560px;
        max-width: 100%;
        object-fit: cover;
        margin-top: 0;
        margin: 0;
        order: 2;
        flex: 1;
    }

    .firsthalf h4 {
        font-size: 3rem;
        letter-spacing: 2.1px;
        margin-top: 0;
    }

    .firsthalf p {
        font-size: 1.6rem;
        line-height: 2;
        letter-spacing: 0.48px;
        width: 500px;
    }

    .firsthalf__PC {
        max-width: 1157px;
        display: flex;
        gap: 109px;
    }

    .message__inner {
        margin-top: 83px;
        position: relative;
    }

    .firsthalf p:first-of-type {
        margin-top: 33px;
    }

    .firsthalf p:nth-last-child(2) {
        margin-top: 9px;
    }

    .firsthalf p:last-of-type {
        margin-top: 9px;
    }

    .secondfalf__img--SP {
        display: none;
    }

    .secondfalf__img--PC {
        display: block;
        position: absolute;
        width: 317px;
        max-width: 100%;
        object-fit: cover;
        top: 690px;
        right: 79px;
    }

    .secondfalf__PC img {
        display: block;
        width: 463px;
        max-width: 100%;
        object-fit: cover;
    }

    .secondfalf__PC {
        display: block;
        display: flex;
        max-width: 1157px;
        margin: 0 auto;
        gap: 115px;
        align-items: flex-end;
        margin-top: 289px;
    }

    .secondfalf p {
        font-size: 1.6rem;
        line-height: 2;
        letter-spacing: 0.48px;
        width: 500px;
    }

    .secondfalf p:first-of-type {
        margin-top: 0px;
    }

    .secondhalf p:nth-last-child(2) {
        margin-top: 9px;
    }

    .secondhalf p:last-of-type {
        margin-top: 9px;
    }

    .mood-visual--PC {
        display: block;
        width: 80%;
        height: auto;
        margin-left: auto;
    }

    .mood-visual--SP {
        display: none;
    }
}
/* 当院について　PC */


/*====================
院長紹介
=====================*/
.section--message {
    padding: 90px 15.2% 90px;
}

.profile__container img {
    width: 100%;
}

.profile__inner {
    margin-top: 15px;
}

.name p:first-of-type {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.4rem;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 1.4px;
}

.name p:last-of-type {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.8rem;
    font-weight: 500;
    line-height: normal;
    margin-top: 4px;
}

.name p:last-of-type span {
    color: #919191;
    font-family: Montserrat;
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.8; 
    letter-spacing: 0.77px;
}

.history {
    margin-top: 12px;
}

.history ul li {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.4rem;
    font-weight: 400;
    margin-top: 6px;
}

.member ul li {
    color: var(--primary-black);
    font-family: "Zen Kaku Gothic New";
    font-size: 1.4rem;
    font-weight: 400;
    margin-top: 6px;
}

.member {
    margin-top: 12px;
}

/* 院長紹介　PC */
@media screen and (min-width: 769px) {
    .section--message {
        max-width: 758px;
        margin: 0 auto;
        padding: 150px 0 150px;
    }

    .profile__container img {
        width: 409px;
        max-width: 100%;
        object-fit: cover;
    }

    .profile__container {
        display: flex;
        width: 758px;
        margin: 0 auto;
        gap: 33px;
        
    }

    .profile__inner {
        margin-top: 0;
    }

    .name p:first-of-type {
    font-size: 1.5rem;
    letter-spacing: 1.5px;
}

    .name p:last-of-type {
        font-size: 2.1rem;
        margin-top: 4px;
    }

    .name p:last-of-type span {
        font-size: 1.3rem; 
        letter-spacing: 0.91px;
    }

    .history {
        margin-top: 18px;
    }

    .history ul li {
        font-size: 1.5rem;
    }

    .member ul li {
        font-size: 1.5rem;
    }

    .member {
        margin-top: 18px;
    }


}
/* 院長紹介　PC */

.fadein{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.2s ease, transform 1.2s ease;
}

.fadein.is-show{
  opacity: 1;
  transform: translateY(0);
}

/* 遅延クラス（順番制御） */
.delay-1{ transition-delay: 0.00s; }
.delay-2{ transition-delay: 0.15s; }
.delay-3{ transition-delay: 0.30s; }
.delay-4{ transition-delay: 0.45s; }
.delay-5{ transition-delay: 0.60s; }

