@keyframes fadeSmallAnime {
  0% {
    opacity: 0;
    transform: scale(1.5); }
  100% {
    opacity: 1;
    transform: scale(1); } }
#top .header {
  aspect-ratio: 8 / 5; }
  @media only screen and (max-width: 767px) {
    #top .header {
      aspect-ratio: auto;
      height: 100vh; } }
  #top .header:after {
    content: "";
    background: url("../../img/fig_main.jpg") no-repeat 50% 50%;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    animation-name: fadeSmallAnime;
    animation-fill-mode: forwards;
    animation-duration: 1s;
    animation-delay: 4s;
    opacity: 0; }
    @media only screen and (max-width: 767px) {
      #top .header:after {
        background-image: url("../../img/fig_main_sp.jpg"); } }
  @media only screen and (max-width: 767px) {
    #top .header-figure {
      display: none; } }
  #top .header-figure > div {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1; }
    #top .header-figure > div.start {
      animation-name: fadeDownAnime;
      animation-fill-mode: forwards;
      animation-duration: 1s; }
      #top .header-figure > div.start.fig1 {
        animation-delay: 4.5s; }
      #top .header-figure > div.start.fig2 {
        animation-delay: 5s; }
      #top .header-figure > div.start.fig3 {
        animation-delay: 5.5s; }
      #top .header-figure > div.start.fig4 {
        animation-delay: 6s; }
      #top .header-figure > div.start.fig5 {
        animation-delay: 6.5s; }
      #top .header-figure > div.start.fig6 {
        animation-delay: 7s; }
      #top .header-figure > div.start.fig7 {
        animation-delay: 7.5s; }
      #top .header-figure > div.start.fig8 {
        animation-delay: 8s; }
      #top .header-figure > div.start.fig9 {
        animation-delay: 8.5s; }
      #top .header-figure > div.start.fig10 {
        animation-delay: 9s; }
      #top .header-figure > div.start.fig11 {
        animation-delay: 9.5s; }
      #top .header-figure > div.start.fig12 {
        animation-delay: 10s; }
      #top .header-figure > div.start.fig13 {
        animation-delay: 10.5s; }
  #top .header-logo.fade {
    animation-name: fadeDownAnime;
    animation-fill-mode: forwards;
    animation-duration: 1s;
    animation-delay: 4s; }
  #top .header-contact.fade {
    animation-delay: 4s; }
  #top .header-menu.fade {
    animation-delay: 4s; }
  #top .header-nav.fade {
    animation-delay: 4s; }

@keyframes fadeInOutAnime {
  0% {
    opacity: 0;
    transform: translateY(100px); }
  30% {
    opacity: 1;
    transform: translateY(0); }
  70% {
    opacity: 1;
    transform: translateY(0); }
  100% {
    opacity: 0;
    transform: translateY(-100px); } }
.header-main {
  width: 100vw; }
  @media only screen and (max-width: 767px) {
    .header-main {
      height: 100%;
      display: flex;
      flex-direction: column; } }
  .header-main:after {
    content: "";
    background: url("../../img/logo_candch.png") no-repeat;
    background-size: 100% 100%;
    width: 7.4rem;
    height: 7.5rem;
    position: absolute;
    right: 2rem;
    bottom: 2rem;
    opacity: 0;
    animation-name: show;
    animation-fill-mode: forwards;
    animation-duration: 1s;
    animation-delay: 4s;
    z-index: 2; }
    @media only screen and (max-width: 767px) {
      .header-main:after {
        width: 5.5rem;
        height: 5.5rem;
        right: .8rem;
        bottom: .8rem; } }
  .header-main-first {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; }
    .header-main-first p {
      font-size: 2.6rem;
      font-weight: 700;
      padding: .3rem 0; }
      .header-main-first p.fade {
        animation-name: fadeInOutAnime;
        animation-fill-mode: forwards;
        animation-duration: 4s; }
      .header-main-first p.mes1.fade {
        animation-delay: .5s; }
      .header-main-first p.mes2.fade {
        animation-delay: 1s; }
      @media only screen and (max-width: 767px) {
        .header-main-first p {
          font-size: 1.6rem; } }
      .header-main-first p strong {
        font-size: 6.4rem;
        font-weight: 900; }
        @media only screen and (max-width: 767px) {
          .header-main-first p strong {
            font-size: 2.6rem; } }
  .header-main-message {
    position: absolute;
    left: 0;
    bottom: 3rem;
    background: rgba(2, 76, 142, 0.8);
    color: #fff;
    border-radius: 0 25rem 25rem 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: flex-start;
    padding: 6rem;
    z-index: 2; }
    @media only screen and (max-width: 767px) {
      .header-main-message {
        position: static;
        padding: 2.5rem 3rem 2.5rem 2rem;
        margin-right: auto; } }
    .header-main-message p {
      font-size: 1.8rem;
      font-weight: 700;
      padding: .3rem 0; }
      @media only screen and (max-width: 767px) {
        .header-main-message p {
          font-size: 1.6rem; } }
      .header-main-message p strong {
        font-size: 4rem;
        font-weight: 900; }
        @media only screen and (max-width: 767px) {
          .header-main-message p strong {
            font-size: 2.6rem; } }
    .header-main-message.fade {
      animation-name: show;
      animation-fill-mode: forwards;
      animation-duration: 2s;
      animation-delay: 4s; }
  .header-main-catch {
    display: flex;
    flex-direction: row-reverse;
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2; }
    @media only screen and (max-width: 767px) {
      .header-main-catch {
        position: static;
        margin-top: 1.5rem;
        margin-bottom: 3rem;
        margin-right: 2rem;
        margin-left: auto;
        transform: none; } }
    .header-main-catch mark {
      background: rgba(34, 177, 207, 0.8);
      font-size: 3.2rem;
      font-weight: 700;
      padding: 1.5rem .8rem;
      letter-spacing: .3rem;
      margin: 0 .5rem;
      color: #fff;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      margin-bottom: auto; }
      @media only screen and (max-width: 767px) {
        .header-main-catch mark {
          font-size: 2.4rem;
          padding: 1rem .4rem; } }
      .header-main-catch mark.fade {
        animation-name: fadeUpAnime;
        animation-fill-mode: forwards;
        animation-duration: 2s; }
      .header-main-catch mark.catch1.fade {
        animation-delay: 5.2s; }
      .header-main-catch mark.catch2.fade {
        animation-delay: 5.7s; }

.container.fade {
  animation-name: show;
  animation-fill-mode: forwards;
  animation-duration: 2s;
  animation-delay: 4.5s; }

.section-about {
  position: relative;
  z-index: 1;
  padding: 9rem 0;
  overflow: hidden; }
  @media only screen and (max-width: 767px) {
    .section-about {
      padding: 5rem 0; } }
  .section-about:before, .section-about:after {
    content: "";
    width: 80rem;
    height: 80rem;
    border-radius: 50%;
    background: rgba(34, 177, 207, 0.08);
    left: 50%;
    top: 50%;
    position: absolute;
    z-index: -1;
    margin-left: -40rem;
    margin-top: -40rem; }
    @media only screen and (max-width: 767px) {
      .section-about:before, .section-about:after {
        width: 40rem;
        height: 40rem;
        margin-left: -20rem;
        margin-top: -20rem; } }
  .section-about:before {
    margin-left: -39rem;
    margin-top: -41rem; }
    @media only screen and (max-width: 767px) {
      .section-about:before {
        margin-left: -19.5rem;
        margin-top: -20.5rem; } }
  .section-about-header {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding-bottom: 4rem; }
    @media only screen and (max-width: 767px) {
      .section-about-header {
        padding-bottom: 2rem; } }
    .section-about-header-en {
      font-size: 1.4rem;
      font-weight: 600;
      color: #22b1cf; }
      @media only screen and (max-width: 767px) {
        .section-about-header-en {
          font-size: 1.2rem; } }
    .section-about-header-ttl {
      font-size: 3.2rem;
      line-height: 1.2; }
      @media only screen and (max-width: 767px) {
        .section-about-header-ttl {
          font-size: 2.2rem; } }
  .section-about-txt {
    text-align: center; }
    .section-about-txt p {
      font-size: 1.8rem;
      line-height: 2.2;
      font-weight: 500; }
      @media only screen and (max-width: 767px) {
        .section-about-txt p {
          font-size: 1.5rem;
          line-height: 1.8; } }
      .section-about-txt p mark {
        background: #f6dd04;
        color: #024c8e;
        font-weight: 600; }
      .section-about-txt p strong {
        font-size: 2.4rem;
        border-bottom: 0.4rem solid #22b1cf; }
        @media only screen and (max-width: 767px) {
          .section-about-txt p strong {
            font-size: 2rem;
            border-width: .3rem; } }
.section-message {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  z-index: 1;
  padding: 8rem 0 10rem; }
  @media only screen and (max-width: 767px) {
    .section-message {
      padding: 4rem 1.5rem; } }
  .section-message:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    opacity: 0.7; }
  .section-message#hospital {
    background-image: url("../../img/bg_hosptal.jpg"); }
    .section-message#hospital:after {
      background: #024c8e; }
    .section-message#hospital .section-message-header-ttl {
      color: #fff; }
    .section-message#hospital .section-message-inner {
      flex-direction: row-reverse; }
      .section-message#hospital .section-message-inner:before {
        left: 1.5rem; }
  .section-message#clinic {
    background-image: url("../../img/bg_clinic.jpg"); }
    .section-message#clinic:after {
      background: #fff; }
    .section-message#clinic .section-message-header-en {
      color: #22b1cf; }
    .section-message#clinic .section-message-inner:before {
      right: 1.5rem; }
  .section-message-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 5rem; }
    @media only screen and (max-width: 767px) {
      .section-message-header {
        padding-bottom: 3rem; } }
    .section-message-header-en {
      font-size: 1.4rem;
      line-height: 1.3;
      font-weight: 700; }
      @media only screen and (max-width: 767px) {
        .section-message-header-en {
          font-size: 1.2rem; } }
    .section-message-header-ttl {
      font-size: 3.2rem;
      line-height: 1.3; }
      @media only screen and (max-width: 767px) {
        .section-message-header-ttl {
          font-size: 2.7rem; } }
  .section-message-inner {
    max-width: 72rem;
    margin: 0 auto;
    background: #fff;
    border-radius: .5rem;
    padding: 2rem 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative; }
    @media only screen and (max-width: 767px) {
      .section-message-inner {
        align-items: flex-start;
        padding: 2rem 1rem; } }
    .section-message-inner-txt {
      margin-right: auto;
      padding: 0 4rem; }
      @media only screen and (max-width: 767px) {
        .section-message-inner-txt {
          padding: 0 .5rem; } }
    .section-message-inner p {
      font-size: 2.2rem;
      line-height: 1.9;
      font-weight: 700;
      text-align: left; }
      @media only screen and (max-width: 767px) {
        .section-message-inner p {
          font-size: 1.6rem; } }
    .section-message-inner figure {
      display: flex;
      flex-direction: column;
      align-items: center;
      flex-shrink: 0;
      padding: 0 4rem; }
      @media only screen and (max-width: 767px) {
        .section-message-inner figure {
          padding: 0 1rem;
          margin-top: -3rem; } }
      .section-message-inner figure img {
        width: 14.3rem;
        margin: 0 auto 1rem; }
        @media only screen and (max-width: 767px) {
          .section-message-inner figure img {
            width: 13.2rem; } }
      .section-message-inner figure figcaption {
        font-size: 1.4rem;
        line-height: 1.2;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        font-weight: 700; }
        @media only screen and (max-width: 767px) {
          .section-message-inner figure figcaption {
            font-size: 1rem; } }
        .section-message-inner figure figcaption strong {
          font-size: 2.8rem; }
          @media only screen and (max-width: 767px) {
            .section-message-inner figure figcaption strong {
              font-size: 2rem; } }
    .section-message-inner:before {
      content: "MESSAGE";
      position: absolute;
      font-size: 2.8rem;
      line-height: 1;
      top: -1em;
      color: #22b1cf; }
      @media only screen and (max-width: 767px) {
        .section-message-inner:before {
          font-size: 2rem; } }
  .section-message-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding-top: 2rem; }
    @media only screen and (max-width: 767px) {
      .section-message-list {
        padding-top: 1rem; } }
    .section-message-list li {
      margin: 0 .5rem; }
      @media only screen and (max-width: 767px) {
        .section-message-list li {
          margin: .4rem; } }
      .section-message-list li a {
        background: #fff;
        font-size: 1.6rem;
        font-weight: 600;
        height: 5rem;
        border-radius: 5rem;
        padding: 0 2rem;
        color: #024c8e;
        display: flex;
        justify-content: center;
        align-items: center; }
        @media only screen and (max-width: 767px) {
          .section-message-list li a {
            height: 3.6rem;
            font-size: 1.4rem;
            padding: 0 1rem; } }
        .section-message-list li a:hover {
          background: #22b1cf;
          color: #fff; }
.section-news {
  position: relative;
  z-index: 1;
  padding: 9rem 0;
  overflow: hidden;
  background: rgba(238, 238, 238, 0.5); }
  @media only screen and (max-width: 767px) {
    .section-news {
      padding: 4rem 0; } }
  .section-news-header {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding-bottom: 6rem; }
    @media only screen and (max-width: 767px) {
      .section-news-header {
        padding-bottom: 5rem; } }
    .section-news-header-en {
      font-size: 6.4rem;
      line-height: 1;
      font-weight: 600;
      color: #22b1cf; }
      @media only screen and (max-width: 767px) {
        .section-news-header-en {
          font-size: 5rem; } }
    .section-news-header-ttl {
      font-size: 1.6rem;
      line-height: 1.2; }
      @media only screen and (max-width: 767px) {
        .section-news-header-ttl {
          font-size: 1.3rem; } }
  .section-news-inner {
    max-width: 117rem;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap; }
    @media only screen and (max-width: 1024px) {
      .section-news-inner {
        max-width: 105rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .section-news-inner {
      max-width: 32rem;
      margin: 0 auto; } }

    @media only screen and (max-width: 767px) {
      .section-news-inner .article-news:nth-of-type(4), .section-news-inner .article-news:nth-of-type(5), .section-news-inner .article-news:nth-of-type(6) {
        display: none; } }
  .section-news-btn {
    display: flex;
    justify-content: center;
    padding-top: 2rem; }
    @media only screen and (max-width: 767px) {
      .section-news-btn {
        padding-top: 0; } }
    .section-news-btn a {
      width: 24rem;
      height: 5rem;
      font-size: 1.6rem;
      font-weight: 500;
      background: #fff;
      border-radius: 5rem;
      display: flex;
      justify-content: center;
      align-items: center; }
      @media only screen and (max-width: 767px) {
        .section-news-btn a {
          width: 12rem;
          height: 3.6rem;
          font-size: 1.4rem; } }
      .section-news-btn a:hover {
        background: #22b1cf;
        color: #fff; }
.section-result {
  position: relative;
  z-index: 1;
  padding: 15rem 0 9rem 0;
  overflow: hidden;
  background: url("../../img/bg_result.jpg") no-repeat 50% 50%;
  background-size: cover; }
  @media only screen and (max-width: 767px) {
    .section-result {
      padding: 8rem 1rem 4rem; } }
  .section-result:after {
    content: "";
    width: 100%;
    height: 6rem;
    background: url("../../img/bg_curve.svg") no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1; }
    @media only screen and (max-width: 767px) {
      .section-result:after {
        height: 3rem; } }
  .section-result-header {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding-bottom: 6rem; }
    @media only screen and (max-width: 767px) {
      .section-result-header {
        padding-bottom: 3rem; } }
    .section-result-header-en {
      font-size: 6.4rem;
      line-height: 1;
      font-weight: 600;
      color: #22b1cf; }
      @media only screen and (max-width: 767px) {
        .section-result-header-en {
          font-size: 5rem; } }
    .section-result-header-ttl {
      font-size: 1.6rem;
      line-height: 1.2; }
      @media only screen and (max-width: 767px) {
        .section-result-header-ttl {
          font-size: 1.4rem; } }
  .section-result-inner {
    max-width: 90rem;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap; }
    .section-result-inner > div {
      width: 33%;
      margin-bottom: 4rem; }
      @media only screen and (max-width: 767px) {
        .section-result-inner > div {
          width: 50%; } }
      .section-result-inner > div dt {
        text-align: center;
        font-size: 1.6rem;
        line-height: 1.3; }
        .section-result-inner > div dt figure {
          width: 15rem;
          height: 10rem;
          background: url("../../img/bg_fig_result.png") no-repeat;
          background-size: cover;
          display: flex;
          justify-content: center;
          align-items: center;
          margin: 0 auto 1.5rem; }
          @media only screen and (max-width: 767px) {
            .section-result-inner > div dt figure {
              margin-bottom: 1rem; } }
        @media only screen and (max-width: 767px) {
          .section-result-inner > div dt {
            font-size: 1.4rem; } }
      .section-result-inner > div dd {
        font-size: 2.4rem;
        line-height: 1.1;
        text-align: center;
        font-weight: 700; }
        @media only screen and (max-width: 767px) {
          .section-result-inner > div dd {
            font-size: 1.5rem; } }
        .section-result-inner > div dd strong {
          font-size: 4.8rem; }
          @media only screen and (max-width: 767px) {
            .section-result-inner > div dd strong {
              font-size: 3rem; } }
        .section-result-inner > div dd span {
          font-size: 1.6rem; }
          @media only screen and (max-width: 767px) {
            .section-result-inner > div dd span {
              font-size: 1.2rem; } }
  .section-result-txt {
    text-align: center;
    font-size: 1.2rem; }
    @media only screen and (max-width: 767px) {
      .section-result-txt {
        font-size: 1rem; } }

.article-news {
  width: 36rem;
  margin: 0 1.5rem 5rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative; }
  @media only screen and (max-width: 1024px) {
    .article-news {
      width: 32rem; } }
  @media only screen and (max-width: 1024px) and (max-width: 767px) {
    .article-news {
      margin: 0 0 4rem; } }

  .article-news > a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10; }
  .article-news:hover figure img {
    transform: scale(1.05); }
  .article-news-tag {
    display: flex;
    justify-content: flex-start;
    position: absolute;
    left: 1rem;
    top: -1.7rem;
    z-index: 100; }
    .article-news-tag li {
      margin-left: .5rem; }
      .article-news-tag li a {
        height: 3.5rem;
        padding: 0 1.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: 600;
        background: rgba(2, 76, 142, 0.1); }
        .article-news-tag li a:hover {
          opacity: 0.7; }
        .article-news-tag li a.magazine {
          background: #f6dd04; }
        .article-news-tag li a.health {
          background: #22b1cf;
          color: #fff; }
        .article-news-tag li a.qanda {
          background: #024c8e;
          color: #fff; }
  .article-news-fig {
    aspect-ratio: 9 / 5;
    margin-bottom: 1rem; }
    .article-news-fig img {
      transition: all .5s; }
  .article-news-time {
    font-size: 1.4rem;
    line-height: 1.3;
    color: #22b1cf;
    font-weight: 700;
    padding: 0 1.5rem; }
    @media only screen and (max-width: 767px) {
      .article-news-time {
        font-size: 1.2rem; } }
  .article-news-ttl {
    font-size: 1.6rem;
    line-height: 1.3;
    padding: .5rem 1.5rem; }
    @media only screen and (max-width: 767px) {
      .article-news-ttl {
        font-size: 1.4rem; } }

.div-bnr {
  max-width: 128rem;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  padding: 4.5rem .7rem; }
  @media only screen and (max-width: 767px) {
    .div-bnr {
      padding: 3rem 0; } }
  .div-bnr-item {
    width: 25%;
    padding: 0 .7rem; }
    .div-bnr-item a:hover {
      opacity: 0.8; }
    @media only screen and (max-width: 767px) {
      .div-bnr-item {
        width: 28rem;
        padding: 0 0.8rem; } }
