@charset "utf-8";

/**
 * 共通設定
 */
#page-main .font-cyan {
    color: var(--color-theme);
}
#page-main .font-orange {
    color: var(--color-accent);
}
#page-main .align-center {
    text-align: center;
}
#page-main .align-right{
    text-align: right;
}
#page-main .font-bold {
    font-weight: 700;
}


/**
 * スマホ用設定
 */
@media ( width < 768px ) {

    #page-main .padding-40 {
        padding: 6.0vw;
    }
    #page-main .font-big {
        font-size: 4.8vw;
    }
    #page-main .font-24 {
        font-size: 4.0vw;
    }
    #page-main .align-center.sp-align-left {
        text-align: left;
    }

    #mv {
        margin: 72px auto 0;
        margin: 0 auto;
        padding: 2.0vw 0;
        width: 100%;
        height: auto;
        aspect-ratio: 375 / 200;
        background: var(--color-theme);
    }
    #mv .breadcrumbs {
        margin: 0 auto;
        padding: 0;
        width: var(--content-width-sp);
        color: #fff;
        font-size: 2.8vw;
        text-align: left;
        line-height: calc( 26 / 14 );
    }
    #mv .breadcrumbs a {
        color: #fff8;
    }
    #mv .breadcrumbs li{
      display:inline-block;
      list-style:none;
    }
    #mv .breadcrumbs li:not(:last-child):after{
      content:"/";
      display:inline-block;
      margin:0 .8em;
    }
    #mv .breadcrumbs li:last-child a{
      color:#fff;
      cursor:default;
    }
    #mv .en-title {
        position: absolute;
        top: 50%;
        left: 5%;
        translate: 0 -50%;
        width: var(--content-width-sp);
        color: #329DFD;
        font-size: 16.0vw;
        font-weight: 500;
        font-family: var(--font-alphabet);
        font-style: italic;
        text-align: right;
    }
    #mv .ja-title {
        position: absolute;
        top: 50%;
        left: 5%;
        translate: 0 -50%;
        width: var(--content-width-sp);
        color: #fff;
        font-size: 6.0vw;
        font-weight: 700;
        text-align: left;
    }
    #mv .ja-title span {
        display: block;
        font-size: 3.75vw;
    }

    #mv-btm {
        margin: 0 auto;
        padding: 12.0vw 0 0;
        width: 100%;
    }
    #mv-btm p {
        margin: 0 auto;
        width: var(--content-width-sp);
        font-size: 3.75vw;
        font-weight: 700;
        line-height: calc( 40 / 20 );
        text-align: left;
    }

    main {
        margin: 0 auto;
        padding: 64px 0 120px;
        width: 100%;
    }

    .contents-wrap {
        margin: 0 auto;
        padding: 0;
        width: var(--content-width-sp);
    }
    .contents-wrap .sidebar-contents {
        display: none;
    }
    .contents-wrap .main-contents {
        margin: 0;
        padding: 0 0 12.0vw;
        width: 100%;
    }

    #page-main {
    }
    #page-main .common-h2 {
        position: relative;
        margin: 20.0vw auto 0;
        padding: 1.0em 0;
        color: var(--color-theme);
        font-size: 6.4vw;
        font-weight: 700;
        line-height: calc( 60 / 40 );
        text-align: left;
    }
    #page-main .common-h2:first-of-type {
        margin-top: 0;
    }
    #page-main .common-h2::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: 100%;
        height: 4px;
        background: linear-gradient( to right, var(--color-theme) 40px, var(--color-accent) 40px, var(--color-accent) 80px, #ddd 80px );
    }
    #page-main .common-h3 {
        position: relative;
        margin: 1.5em auto 1.0em;
        padding: 0 0 0 0.5em;
        font-size: 5.2vw;
        font-weight: 700;
        line-height: calc( 48 / 32 );
        text-align: left;
    }
    #page-main .common-h3::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: 4px;
        height: 100%;
        background: linear-gradient( to bottom, var(--color-theme) 50%, var(--color-accent) 50% );
    }
    #page-main .common-h4 {
        margin: 1.5em auto 1.0em;
        padding: 0;
        font-size: 4.0vw;
        font-weight: 700;
        line-height: calc( 36 / 24 );
        text-align: left;
    }
    #page-main .common-h5 {
        margin: 0.5em auto;
        padding: 0;
        font-size: 3.75vw;
        font-weight: 700;
        line-height: calc( 30 / 20 );
        text-align: left;
    }
    #page-main .common-h5:first-child {
        margin-top: 0;
    }
    #page-main .cyan-box {
        /*margin: 4.0vw auto 0;*/
        padding: 3.0vw;
        width: 100%;
        font-size: 3.75vw;
        line-height: calc( 51.2 / 32 );
        background: #f5faff;
        border-radius: 2.0vw;
        &.large{
          /*font-size: 5vw;*/
          font-size: 20px;
        }
    }
    #page-main .border-box {
        margin: 8.0vw auto 0;
        padding: 5vw;
        width: 100%;
        font-size: 3.75vw;
        line-height: calc( 51.2 / 32 );
        border: 1px solid #dcdcdc;
        border-radius: 2.0vw;
    }
    #page-main :is(.cyan-box,.border-box) + :is(.cyan-box,.border-box) {
        margin-top: 2.0vw;
    }
    #page-main .cyan-box:is(.icon-male,.icon-female,.icon-square) {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 0 4.0vw;
        font-weight: 700;
    }
    #page-main .cyan-box.icon-male::before {
        display: block;
        content: "";
        margin: 0;
        max-width: 56px;
        height: auto;
        aspect-ratio: 1 / 1;
        flex: 0 0 15vw;
        background: url(../images/icon-male.svg) no-repeat center / 61% 70%, #fff;
        border: 1px solid #eee;
        border-radius: 2.0vw;
    }
    #page-main .cyan-box.icon-female::before {
        display: block;
        content: "";
        margin: 0;
        max-width: 56px;
        height: auto;
        aspect-ratio: 1 / 1;
        flex: 0 0 15vw;
        background: url(../images/icon-female.svg) no-repeat center / 52% 70%, #fff;
        border: 1px solid #eee;
        border-radius: 2.0vw;
    }
    #page-main .cyan-box.icon-square::before {
        display: block;
        content: "";
        margin: 0;
        max-width: 56px;
        height: auto;
        aspect-ratio: 1 / 1;
        flex: 0 0 15vw;
        background: url(../images/logo-square.svg) no-repeat center / 50% 50%, #fff;
        border: 1px solid #eee;
        border-radius: 2.0vw;
    }
    #page-main :is(.cyan-box,.border-box) + p {
        margin-top: 6.0vw;
    }
    #page-main p {
        margin: 0;
        font-size: 3.75vw;
        font-weight: 400;
        line-height: 2.0;
    }
    #page-main ul {
        margin: 1.0em auto 1.0em 1.0em;
        font-size: 3.75vw;
    }
    #page-main ul li {
        margin: 0.5em auto;
        font-size: 3.75vw;
        font-weight: 400;
        line-height: 2.0;
    }
    #page-main .pic {
        width: 100%;
        height: auto;
    }
    #page-main .pic:not(:first-child) {
        margin: 4.0vw auto 0;
    }
    #page-main .pic img {
        width: 100%;
        height: auto;
    }
    #page-main .pic.sp-wide {
        padding-bottom: 20px;
        overflow-x: auto;
    }
    #page-main .pic.sp-wide img {
        width: 180%;
        max-width: 180%;
        height: auto;
    }
    #page-main .hide {
        display: none;
    }

    #page-main .about-philosophy.cyan-box,
    #page-main .about-guidline.cyan-box{
        text-align:left;
    }

    #page-main .about-policy.cyan-box{
      font-size:5vw;
      text-align:center;
      .font-big {
          font-size: 1.2em;
      }
    }

    #page-main .about-greeting {
        margin: 8.0vw 0 0;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4.0vw 0;
    }
    #page-main .about-greeting .pic {
        margin: 0;
        width: 100%;
        height: auto;
        aspect-ratio: 343 / 243;
    }
    #page-main .about-greeting .pic img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 2.0vw;
    }
    #page-main .about-greeting .info {
        margin: 0;
        padding: 0;
        width: 100%;
    }


    #page-main .common-table {
        margin: 8.0vw auto 0;
        padding: 0;
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        border-top: 1px solid #ddd;
    }
    #page-main .common-table > dt {
        margin: 0;
        padding: 4.0vw 0 1.0vw;
        width: 100%;
        font-size: 3.75vw;
        font-weight: 700;
        line-height: calc( 25.6 / 16 );
    }
    #page-main .common-table > dd {
        margin: 0;
        padding: 1.0vw 0 4.0vw;
        width: 100%;
        font-size: 3.75vw;
        font-weight: 400;
        line-height: calc( 25.6 / 16 );
        border-bottom: 1px solid #ddd;
    }
    #page-main .common-table > dd ul {
        margin: 0 0 0 1.5em;
    }
    #page-main .common-table > dd ul li:first-child {
        margin-top: 0;
    }
    #page-main .common-table > dd ul li:last-child {
        margin-bottom: 0;
    }
    #page-main .common-table > dd p + p {
        margin-top: 1.5em;
    }

    #page-main .common-steps {
        margin: 8.0vw auto 0;
        padding: 0;
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        gap: 4.0vw 0;
    }
    #page-main .common-steps .common-step {
        position: relative;
        margin: 0;
        padding: 4.0vw 4.0vw 4.0vw 20.0vw;
        width: 100%;
        min-height: 20.0vw;
        font-size: 4.2vw;
        font-weight: 500;
        background: #f5faff;
        border-radius: 2.0vw;
        display: flex;
        align-items: center;
    }
    #page-main .common-steps .common-step::before {
        position: absolute;
        content: "STEP";
        top: 0;
        left: 0;
        width: 16.0vw;
        height: 100%;
        display: block;
        margin: 0;
        padding: 6.0vw 0 0;
        color: #fff;
        font-size: 3.75vw;
        font-weight: 700;
        text-align: center;
        line-height: 1.0;
        background: var(--color-theme);
        border-radius: 2.0vw 0 0 2.0vw;
    }
    #page-main .common-steps .common-step::after {
        position: absolute;
        content: attr(data-no);
        top: 50%;
        left: 0;
        width: 16.0vw;
        display: block;
        margin: 0;
        padding: 0;
        color: #fff;
        font-size: 4.8vw;
        font-weight: 700;
        text-align: center;
        line-height: 1.0;
    }

    #page-main .google-map {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 1.0vw 0 0;
        padding: 2.0vw;
        width: 40.0vw;
        height: auto;
        aspect-ratio: 200 / 52;
        font-size: 3.75vw;
        font-weight: 700;
        line-height: calc( 19.6 / 16 );
        background: var(--color-theme);
        border: 1px solid var(--color-theme);
        border-radius: 2.0vw;
    }
    #page-main .google-map::after {
        content: "";
        display: block;
        width: 1.0em;
        height: 1.5em;
        aspect-ratio: 14 / 20;
        background: #fff;
        -webkit-mask-image: url(../images/icon-gps.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-gps.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }

    #page-main .open-more {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0 10.0vw;
        margin: 8.0vw auto 0;
        padding: 0.4em 3.0em 1.0em 0;
        color: var(--color-accent);
        font-size: 3.75vw;
        font-weight: 700;
        font-family: inherit;
        line-height: 1.0;
        background: transparent;
        border: 0;
        border-bottom: 2px solid var(--color-accent);
        border-radius: 2.0vw 2.0vw 0 0;
        cursor: pointer;
        overflow: hidden;
    }
    #page-main .open-more::before {
        position: absolute;
        display: block;
        content: "";
        top: calc( -100% + 50% - 0.5em - 0.2em );
        right: 0.5em;
        margin: 0;
        width: 0.6em;
        height: 0.6em;
        border-right: 2px solid var(--color-accent);
        border-bottom: 2px solid var(--color-accent);
        rotate: 45deg;
        transition: top 0.3s ease-out;
    }        
    #page-main .open-more::after {
        position: absolute;
        display: block;
        content: "";
        top: calc( 0% + 50% - 0.5em - 0.2em );
        right: 0.5em;
        margin: 0;
        width: 0.6em;
        height: 0.6em;
        border-right: 2px solid var(--color-accent);
        border-bottom: 2px solid var(--color-accent);
        rotate: 45deg;
        transition: top 0.3s ease-out;
    }
    #page-main .hide {
        display: none;
    }
    @media ( hover: hover ) {
        #page-main .open-more:hover::before {
            top: calc( 0% + 50% - 0.5em - 0.2em );
        }        
        #page-main .open-more:hover::after {
            top: calc( 100% + 50% - 0.5em - 0.2em );
        }        
    }

    #page-main .reason-contents .cyan-box{
      font-size: 4.2vw;
    }

    #reason-hint {
        margin: 0 auto;
        padding: 12.0vw 0;
        width: 100%;
        height: auto;
        background: #f5faff;
    }
    #reason-hint .reason-bg {
        position: relative;
        margin: 0 auto;
        padding: 0;
        width: var(--content-width-sp);
        height: auto;
        aspect-ratio: 2 / 1;
        border-radius: 2.0vw;
        overflow: hidden;
        z-index: 1;
    }
    #reason-hint .reason-bg figure {
        position: relative;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
    }
    #reason-hint .reason-bg figure img {
        width: 100%;
        height: 100%;
        object-position: 50% 35%;
        object-fit: cover;
        filter: blur(2px);
    }
    #reason-hint .reason-bg figure::after {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #073f8f9a;
    }
    #reason-hint .reason-box {
        position: absolute;
        top: 50%;
        left: 5%;
        translate: 0 -50%;
        margin: 0;
        padding: 0;
        width: var(--content-width-sp);
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: column;
        gap: 4.0vw 0;
        z-index: 3;
    }
    #reason-hint .reason-box .txt {
        margin: 0;
        width: 100%;
        color: #fff;
        font-size: 4.8vw;
        font-weight: 700;
        text-align: center;
        line-height: calc( 60 / 40 );
    }
    #reason-hint .reason-box .reason-btn {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0;
        padding: 0 4.0vw;
        width: 80%;
        height: auto;
        aspect-ratio: 280 / 64;
        font-size: 3.75vw;
        font-weight: 700;
        border-radius: 2.0vw;
        transition: color 0.3s ease-out, border 0.3s ease-out, background 0.3s ease-out;
    }
    #reason-hint .reason-box .reason-btn::after {
        position: absolute;
        content: "";
        display: block;
        top: calc( 50% - 0.5em );
        right: 1.5em;
        width: 1.2em;
        height: 1.0em;
        aspect-ratio: 20 / 18;
        background: var(--color-theme);
        -webkit-mask-image: url(../images/icon-arrow-white.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-arrow-white.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }

    #hint-list {
        margin: 0 auto;
        padding: 0;
        width: 100%;
        background: #fff;
    }
    #hint-list > .hint-grid {
        margin: 0 auto;
        width: var(--content-width-sp);
        display: grid;
        grid-template-columns: 1fr;
        gap: 8.0vw 0;
    }
    #hint-list > .hint-grid .hint-item {
        margin: 0;
        padding: 0;
        width: 100%;
        transition: color 0.2s ease-out, opacity 0.2s ease-out;
    }
    @media ( hover: hover ) {
        #hint-list > .hint-grid .hint-item:hover {
            opacity: 0.6;
        }
    }
    #hint-list > .hint-grid .hint-item.disabled{
      cursor: default;
      pointer-events: none;
    }
    #hint-list > .hint-grid .hint-item .pic {
        margin: 0 auto;
        width: 100%;
        height: auto;
        aspect-ratio: 720 / 444;
    }
    #hint-list > .hint-grid .hint-item .pic img {
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 2.0vw;
    }
    #hint-list > .hint-grid .hint-item h3 {
        margin: 0.8em 0 0;
        font-size: 4.0vw;
        font-weight: 700;
        text-align: left;
    }
    #hint-list > .hint-grid .hint-item h3::after {
        content: "";
        display: inline-block;
        width: 1.5em;
        height: 0.8em;
        background: url(../images/icon-window.svg) no-repeat center / contain;
    }
    #hint-list > .hint-btn {
        position: relative;
        display: grid;
        place-items: center;
        margin: 0;
        padding: 0 1.5em;
        margin: 8.0vw auto 0;
        width: var(--content-width-sp);
        height: auto;
        aspect-ratio: 440 / 77;
        font-size: 4.0vw;
        font-weight: 700;
        border-radius: 2.0vw;
    }
    #hint-list > .hint-btn::after {
        position: absolute;
        content: "";
        display: block;
        top: calc( 50% - 0.5em );
        right: 1.5em;
        width: 1.2em;
        height: 1.0em;
        aspect-ratio: 20 / 18;
        background: #fff;
        -webkit-mask-image: url(../images/icon-arrow-white.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-arrow-white.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }

    #news-list {
        margin: 0 auto;
        padding: 0;
        width: 100%;
    }
    #news-list > .news-items {
        margin: 0 auto;
        width: var(--content-width-sp);
    }
    #news-list > .news-items .news-item {
        display: block;
        margin: 0;
        padding: 4.0vw 0;
        width: 100%;
        border-bottom: 1px solid #d2dbea;
    }
    #news-list > .news-items .news-item .date {
        margin: 0;
        padding: 0;
        width: 100%;
        font-size: 3.75vw;
        font-weight: 500;
        font-family: var(--font-alphabet);
        text-align: left;
    }
    #news-list > .news-items .news-item .title {
        margin: 0;
        padding: 0;
        width: 100%;
        font-size: 3.75vw;
        font-weight: 500;
        text-align: left;
    }
    #news-list > .news-items .news-item .title a{
      text-decoration: underline;
    }
    #news-list > .news-items .news-item:first-child {
        border-top: 1px solid #d2dbea;
    }
    #news-list > .news-btn {
        position: relative;
        display: grid;
        place-items: center;
        margin: 0 auto;
        padding: 0 1.5em;
        margin: 8.0vw auto 0;
        width: var(--content-width-sp);
        height: auto;
        aspect-ratio: 440 / 77;
        font-size: 4.0vw;
        font-weight: 700;
        border-radius: 2.0vw;
    }
    #news-list > .news-btn::after {
        position: absolute;
        content: "";
        display: block;
        top: calc( 50% - 0.5em );
        right: 1.5em;
        width: 1.2em;
        height: 1.0em;
        aspect-ratio: 20 / 18;
        background: #fff;
        -webkit-mask-image: url(../images/icon-arrow-white.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-arrow-white.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }

    .btn-cyan.btn-link{
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin: 4px 0 0;
      padding: 1em;
      max-width: 220px;
      height: auto;
      aspect-ratio: 220 / 60;
      font-size: 3.75vw;
      font-weight: 700;
      line-height: calc( 19.6 / 16 );
      background: var(--color-theme);
      border: 1px solid var(--color-theme);
      border-radius: 8px;
    }
    .btn-cyan.btn-link::after {
        content: "";
        display: block;
        width: 1.0em;
        height: 1.5em;
        aspect-ratio: 14 / 20;
        background: #fff;
        -webkit-mask-image: url(../images/icon-arrow-white.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-arrow-white.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }
    dl{
        font-size: 3.75vw;
        font-weight: 400;
        line-height: 2.0;
        dt{
          font-weight:bold;
        }
        dd:not(:last-child){
          margin:0 0 1em;
        }
    }
    ol{
        padding: 0 0 0 1.2em;
        font-size: 3.75vw;
        font-weight: 400;
        line-height: 1.5;
        li:not(:last-child){
          margin:0 0 .5em;
        }
    }

    #page-main{
          .common-h2 + .common-h3{
            margin-top:.5em;
        }
    }

    #page-main .corporate-goals-contents{
      p:not(:last-child){
        margin:0 0 1em;
      }
      small{
        display:block;
        line-height:1.5em;
      }
      nav{
        margin:4em 0 0;
      }
      .btn-cyan{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 4px 0 0;
        padding: 1em;
        max-width: 220px;
        height: auto;
        aspect-ratio: 220 / 60;
        font-size: 3.75vw;
        font-weight: 700;
        line-height: calc( 19.6 / 16 );
        background: var(--color-theme);
        border: 1px solid var(--color-theme);
        border-radius: 8px;
      }
      .btn-cyan::after {
          content: "";
          display: block;
          width: 1.0em;
          height: 1.5em;
          aspect-ratio: 14 / 20;
          background: #fff;
          -webkit-mask-image: url(../images/icon-pdf.svg);
          -webkit-mask-repeat: no-repeat;
          -webkit-mask-size: contain;
          -webkit-mask-position: center;
          mask-image: url(../images/icon-pdf.svg);
          mask-repeat: no-repeat;
          mask-size: contain;
          mask-position: center;
          transition: background 0.3s ease-out;
      }
    }

    #page-main .health-contents{
      .border-box {
        padding: 1vw 0;
      }
      .flex .pic{
        width:70%;
        margin:2em auto 0;
        border:solid 1px #ddd;
      }
    }

    #page-main .privacy-contents{
      p:not(:last-child){
        margin:0 0 2em;
      }
      .date{
        margin:4em 0 0;
      }
      .security-isms{
        max-width:140px;
      }
    }

    #page-main .notfound-contents{
      .common-h2{
        font-size: 4.4vw;
        padding: 0 0 1em;
        color: var(--fg-color);
      }
      .common-h2:before{
        display:none;
      }
      nav{
        margin:2em 0 0;
      }
    }

}

/**
 * PC用設定
 */
@media ( width >= 768px ) {

    #page-main .padding-40 {
        padding: calc( 100vw * 40 / 1440 );
    }
    #page-main .font-big {
        font-size: calc( 100vw * 32 / 1440 );
    }
    #page-main .font-24 {
        font-size: calc( 100vw * 24 / 1440 );
    }

    #mv {
        margin: calc( 100vw * 88 / 1440 ) auto 0;
        margin: 0 auto;
        padding: calc( 100vw * 16 / 1440 ) 0;
        width: 100%;
        height: auto;
        aspect-ratio: 1440 / 320;
        background: var(--color-theme);
    }
    #mv .breadcrumbs {
        margin: 0 auto;
        padding: 0;
        width: var(--content-width-pc);
        color: #fff;
        font-size: calc( 100vw * 14 / 1440 );
        text-align: left;
        line-height: calc( 26 / 14 );
    }
    #mv .breadcrumbs a {
        color: #fff8;
    }
    #mv .breadcrumbs li{
      display:inline-block;
      list-style:none;
    }
    #mv .breadcrumbs li:not(:last-child):after{
      content:"/";
      display:inline-block;
      margin:0 .8em;
    }
    #mv .breadcrumbs li:last-child a{
      color:#fff;
      cursor:default;
    }
    #mv .en-title {
        position: absolute;
        top: 50%;
        left: 50%;
        translate: -50% -50%;
        width: var(--content-width-pc);
        color: #329DFD;
        font-size: calc( 100vw * 160 / 1440 );
        font-weight: 500;
        font-family: var(--font-alphabet);
        font-style: italic;
        text-align: right;
    }
    #mv .ja-title {
        position: absolute;
        top: 50%;
        left: 50%;
        translate: -50% -50%;
        width: var(--content-width-pc);
        color: #fff;
        font-size: calc( 100vw * 48 / 1440 );
        font-weight: 700;
        text-align: left;
    }
    #mv .ja-title span {
        display: block;
        font-size: calc( 100vw * 24 / 1440 );
    }

    #mv-btm {
        margin: 0 auto;
        padding: calc( 100vw * 96 / 1440 ) 0 0;
        width: 100%;
    }
    #mv-btm p {
        margin: 0 auto;
        width: var(--content-width-pc);
        font-size: calc( 100vw * 20 / 1440 );
        font-weight: 700;
        line-height: 2.0;
        text-align: center;
    }

    main {
        margin: 0 auto;
        padding: calc( 100vw * 120 / 1440 ) 0;
        width: 100%;
    }

    .contents-wrap {
        margin: 0 auto;
        padding: 0;
        width: var(--content-width-pc);
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }
    .contents-wrap .sidebar-contents {
        position: sticky;
        top: calc( 100vw * 128 / 1440 );
        margin: 0;
        padding: 0 0 calc( 100vw * 80 / 1440 );
        width: calc( 100vw * 272 / 1440 );
    }
    .contents-wrap .main-contents {
        margin: 0;
        padding: 0 0 calc( 100vw * 80 / 1440 );
        width: calc( 100% - ( 100vw * 272 / 1440 ) );
    }

    .sidebar-contents > div {
    }
    .sidebar-contents > div a {
        display: inline-block;
        margin: 0;
        width: max-content;
        max-width: calc( 100vw * 200 / 1440 );
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 400;
        text-align: left;
        line-height: calc( 25.6 / 16 );
        text-decoration-color: transparent;
        text-decoration-thickness: 2px;
        text-decoration-line: underline;
        text-decoration-style: solid;
        text-underline-offset: 0.3em;
        transition: color 0.3s ease-out, text-decoration-color 0.3s ease-out;
    }
    .sidebar-contents > div a.active,
    .sidebar-contents > div a:hover {
        color: var(--color-theme);
        text-decoration-color: var(--color-theme);
    }
    .sidebar-contents > div + div {
        margin-top: calc( 100vw * 24 / 1440 );
    }

    #page-main {
    }
    #page-main .common-h2 {
        position: relative;
        margin: calc( 100vw * 160 / 1440 ) auto calc( 100vw * 40 / 1440 );
        padding: 1.0em 0;
        color: var(--color-theme);
        font-size: calc( 100vw * 40 / 1440 );
        font-weight: 700;
        line-height: calc( 60 / 40 );
        text-align: left;
    }
    #page-main .common-h2:first-of-type {
        margin-top: 0;
    }
    #page-main .common-h2::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: 100%;
        height: calc( 100vw * 4 / 1440 );
        background: linear-gradient( to right, var(--color-theme) calc( 100vw * 80 / 1440 ), var(--color-accent) calc( 100vw * 80 / 1440 ), var(--color-accent) calc( 100vw * 160 / 1440 ), #ddd calc( 100vw * 160 / 1440 ) );
    }
    #page-main .common-h3 {
        position: relative;
        margin: 1.5em auto 1.0em;
        padding: 0 0 0 0.5em;
        font-size: calc( 100vw * 32 / 1440 );
        font-weight: 700;
        line-height: calc( 48 / 32 );
        text-align: left;
    }
    #page-main .common-h3::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: calc( 100vw * 4 / 1440 );
        height: 100%;
        background: linear-gradient( to bottom, var(--color-theme) 50%, var(--color-accent) 50% );
    }
    #page-main .common-h4 {
        margin: 1.5em auto 1.0em;
        padding: 0;
        font-size: calc( 100vw * 24 / 1440 );
        font-weight: 700;
        line-height: calc( 36 / 24 );
        text-align: left;
    }
    #page-main .common-h5 {
        margin: 0.5em auto;
        padding: 0;
        font-size: calc( 100vw * 20 / 1440 );
        font-weight: 700;
        line-height: calc( 30 / 20 );
        text-align: left;
    }
    #page-main .common-h5:first-child {
        margin-top: 0;
    }
    #page-main .cyan-box {
        margin: calc( 100vw * 30 / 1440 ) auto 0;
        padding: calc( 100vw * 24 / 1440 );
        width: 100%;
        font-size: calc( 100vw * 20 / 1440 );
        line-height: calc( 51.2 / 32 );
        background: #f5faff;
        border-radius: calc( 100vw * 8 / 1440 );
        &.large{
          font-size: calc( 100vw * 32 / 1440 );
        }
    }
    #page-main .border-box {
        margin: calc( 100vw * 30 / 1440 ) auto 0;
        padding: calc( 100vw * 24 / 1440 );
        width: 100%;
        font-size: calc( 100vw * 20 / 1440 );
        line-height: calc( 51.2 / 32 );
        border: 1px solid #dcdcdc;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #page-main :is(.cyan-box,.border-box) + :is(.cyan-box,.border-box) {
        margin-top: calc( 100vw * 16 / 1440 );
    }
    #page-main .cyan-box:is(.icon-male,.icon-female,.icon-square) {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 0 calc( 100vw * 24 / 1440 );
        font-weight: 700;
    }
    #page-main .cyan-box.icon-male::before {
        display: block;
        content: "";
        margin: 0;
        width: calc( 100vw * 96 / 1440 );
        height: auto;
        aspect-ratio: 1 / 1;
        flex: 0 0 calc( 100vw * 96 / 1440 );
        background: url(../images/icon-male.svg) no-repeat center / 61% 70%, #fff;
        border: 1px solid #eee;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #page-main .cyan-box.icon-female::before {
        display: block;
        content: "";
        margin: 0;
        width: calc( 100vw * 96 / 1440 );
        height: auto;
        aspect-ratio: 1 / 1;
        flex: 0 0 calc( 100vw * 96 / 1440 );
        background: url(../images/icon-female.svg) no-repeat center / 52% 70%, #fff;
        border: 1px solid #eee;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #page-main .cyan-box.icon-square::before {
        display: block;
        content: "";
        margin: 0;
        width: calc( 100vw * 96 / 1440 );
        height: auto;
        aspect-ratio: 1 / 1;
        flex: 0 0 calc( 100vw * 96 / 1440 );
        background: url(../images/logo-square.svg) no-repeat center / 50% 50%, #fff;
        border: 1px solid #eee;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #page-main :is(.cyan-box,.border-box) + p {
        margin-top: calc( 100vw * 34 / 1440 );
    }
    #page-main p {
        margin: 0;
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 400;
        line-height: 2.0;
    }
    #page-main ul {
        margin: 1.0em auto 1.0em 1.0em;
        font-size: calc( 100vw * 16 / 1440 );
    }
    #page-main ul li {
        margin: 0.5em auto;
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 400;
        line-height: 2.0;
    }
    #page-main .pic {
        width: 100%;
        height: auto;
    }
    #page-main .pic:not(:first-child) {
        margin: calc( 100vw * 20 / 1440 ) auto 0;
    }
    #page-main .pic img {
        width: 100%;
        height: auto;
    }
    #page-main .hide {
        display: none;
    }

    #page-main .about-greeting {
        margin: calc( 100vw * 40 / 1440 ) 0 0;
        width: 100%;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }
    #page-main .about-greeting .pic {
        margin: 0;
        width: 30%;
        height: auto;
        aspect-ratio: 280 / 396;
    }
    #page-main .about-greeting .pic img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #page-main .about-greeting .info {
        margin: 0;
        padding: 0;
        width: calc( 70% - ( 100vw * 40 / 1440 ) );
    }

    #page-main .common-table {
        margin: calc( 100vw * 40 / 1440 ) auto 0;
        padding: 0;
        width: 100%;
        display: grid;
        grid-template-columns: calc( 100vw * 184 / 1440 ) 1fr;
        border-top: 1px solid #ddd;
    }
    #page-main .common-table > dt {
        margin: 0;
        padding: calc( 100vw * 24 / 1440 ) 0;
        width: 100%;
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 700;
        line-height: 25.6 / 16;
        border-bottom: 1px solid #ddd;
    }
    #page-main .common-table > dd {
        margin: 0;
        padding: calc( 100vw * 24 / 1440 ) 0;
        width: 100%;
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 400;
        line-height: 25.6 / 16;
        border-bottom: 1px solid #ddd;
    }
    #page-main .common-table > dd ul {
        margin-top: 0;
        margin-bottom: 0;
    }
    #page-main .common-table > dd ul li:first-child {
        margin-top: 0;
    }
    #page-main .common-table > dd ul li:last-child {
        margin-bottom: 0;
    }
    #page-main .common-table > dd p + p {
        margin-top: 1.5em;
    }
    #page-main .common-table a{
        text-decoration:underline;
    }

    #page-main .about-organization.cyan-box{
        padding: calc( 100vw * 40 / 1440 ) calc( 100vw * 64 / 1440 );
    }

    #page-main .common-steps {
        margin: calc( 100vw * 40 / 1440 ) auto 0;
        padding: 0;
        width: 100%;
        display: grid;
        grid-template-columns: repeat( 3, 1fr );
        gap: 0 calc( 100vw * 20 / 1440 );
    }
    #page-main .common-steps .common-step {
        position: relative;
        margin: 0;
        padding: calc( 100vw * 60 / 1440 ) calc( 100vw * 20 / 1440 ) calc( 100vw * 20 / 1440 );
        width: 100%;
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 500;
        background: #f5faff;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #page-main .common-steps .common-step::before {
        position: absolute;
        content: "STEP";
        top: 0;
        left: 0;
        width: 100%;
        display: block;
        margin: 0;
        padding: calc( 100vw * 16 / 1440 ) calc( 100vw * 30 / 1440 ) calc( 100vw * 16 / 1440 ) 0;
        color: #fff;
        font-size: calc( 100vw * 20 / 1440 );
        font-weight: 700;
        text-align: center;
        line-height: 1.0;
        background: var(--color-theme);
        border-radius: calc( 100vw * 8 / 1440 ) calc( 100vw * 8 / 1440 ) 0 0;
    }
    #page-main .common-steps .common-step::after {
        position: absolute;
        content: attr(data-no);
        top: calc( 100vw * 13 / 1440 );
        left: calc( 50% + ( 100vw * 16 / 1440 ) );
        display: block;
        margin: 0;
        padding: 0;
        color: #fff;
        font-size: calc( 100vw * 24 / 1440 );
        font-weight: 700;
        text-align: left;
        line-height: 1.0;
    }

    #page-main .google-map {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: calc( 100vw * 4 / 1440 ) 0 0;
        padding: calc( 100vw * 16 / 1440 );
        width: calc( 100vw * 200 / 1440 );
        height: auto;
        aspect-ratio: 200 / 52;
        font-size: calc( 100vw * 14 / 1440 );
        font-weight: 700;
        line-height: calc( 19.6 / 16 );
        background: var(--color-theme);
        border: 1px solid var(--color-theme);
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #page-main .google-map::after {
        content: "";
        display: block;
        width: 1.0em;
        height: 1.5em;
        aspect-ratio: 14 / 20;
        background: #fff;
        -webkit-mask-image: url(../images/icon-gps.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-gps.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }

    #page-main .open-more {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0 calc( 100vw * 60 / 1440 );
        margin: calc( 100vw * 40 / 1440 ) auto 0;
        padding: 0.4em 3.0em 1.0em 0;
        color: var(--color-accent);
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 700;
        font-family: inherit;
        line-height: 1.0;
        background: transparent;
        border: 0;
        border-bottom: 2px solid var(--color-accent);
        border-radius: calc( 100vw * 8 / 1440 ) calc( 100vw * 8 / 1440 ) 0 0;
        cursor: pointer;
        overflow: hidden;
    }
    #page-main .open-more::before {
        position: absolute;
        display: block;
        content: "";
        top: calc( -100% + 50% - 0.5em - 0.2em );
        right: 0.5em;
        margin: 0;
        width: 0.6em;
        height: 0.6em;
        border-right: 2px solid var(--color-accent);
        border-bottom: 2px solid var(--color-accent);
        rotate: 45deg;
        transition: top 0.3s ease-out;
    }        
    #page-main .open-more::after {
        position: absolute;
        display: block;
        content: "";
        top: calc( 0% + 50% - 0.5em - 0.2em );
        right: 0.5em;
        margin: 0;
        width: 0.6em;
        height: 0.6em;
        border-right: 2px solid var(--color-accent);
        border-bottom: 2px solid var(--color-accent);
        rotate: 45deg;
        transition: top 0.3s ease-out;
    }
    #page-main .hide {
        display: none;
    }
    @media ( hover: hover ) {
        #page-main .open-more:hover::before {
            top: calc( 0% + 50% - 0.5em - 0.2em );
        }        
        #page-main .open-more:hover::after {
            top: calc( 100% + 50% - 0.5em - 0.2em );
        }        
    }

    #reason-hint {
        margin: 0 auto;
        padding: calc( 100vw * 120 / 1440 ) 0;
        width: 100%;
        height: auto;
        background: #f5faff;
    }
    #reason-hint .reason-bg {
        position: relative;
        margin: 0 auto;
        padding: 0;
        width: var(--content-width-pc);
        height: auto;
        aspect-ratio: 1160 / 358;
        border-radius: calc( 100vw * 8 / 1440 );
        overflow: hidden;
        z-index: 1;
    }
    #reason-hint .reason-bg figure {
        position: relative;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
    }
    #reason-hint .reason-bg figure img {
        width: 100%;
        height: 100%;
        object-position: 50% 35%;
        object-fit: cover;
        filter: blur(2px);
    }
    #reason-hint .reason-bg figure::after {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #073f8f9a;
    }
    #reason-hint .reason-box {
        position: absolute;
        top: 50%;
        left: 5%;
        translate: 0 -50%;
        margin: 0;
        padding: 0;
        width: var(--content-width-pc);
        height: auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        z-index: 3;
    }
    #reason-hint .reason-box .txt {
        margin: 0;
        color: #fff;
        font-size: calc( 100vw * 40 / 1440 );
        font-weight: 700;
        text-align: left;
        line-height: calc( 60 / 40 );
    }
    #reason-hint .reason-box .reason-btn {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0;
        padding: 0 calc( 100vw * 24 / 1440 );
        width: calc( 100vw * 280 / 1440 );
        height: auto;
        aspect-ratio: 280 / 64;
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 700;
        border-radius: calc( 100vw * 8 / 1440 );
        transition: color 0.3s ease-out, border 0.3s ease-out, background 0.3s ease-out;
    }
    #reason-hint .reason-box .reason-btn::after {
        position: absolute;
        content: "";
        display: block;
        top: calc( 50% - 0.5em );
        right: 1.5em;
        width: 1.2em;
        height: 1.0em;
        aspect-ratio: 20 / 18;
        background: var(--color-theme);
        -webkit-mask-image: url(../images/icon-arrow-white.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-arrow-white.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }

    #hint-list {
        margin: 0 auto;
        padding: 0;
        width: 100%;
        background: #fff;
    }
    #hint-list > .hint-grid {
        margin: 0 auto;
        width: var(--content-width-pc);
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: calc( 100vw * 56 / 1440 ) calc( 100vw * 40 / 1440 );
    }
    #hint-list > .hint-grid .hint-item {
        margin: 0;
        padding: 0;
        width: 100%;
        transition: color 0.2s ease-out, opacity 0.2s ease-out;
    }
    @media ( hover: hover ) {
        #hint-list > .hint-grid .hint-item:hover {
            opacity: 0.6;
        }
    }
    #hint-list > .hint-grid .hint-item.disabled{
      cursor: default;
      pointer-events: none;
    }
    #hint-list > .hint-grid .hint-item .pic {
        margin: 0 auto;
        width: 100%;
        height: auto;
        aspect-ratio: 720 / 444;
    }
    #hint-list > .hint-grid .hint-item .pic img {
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #hint-list > .hint-grid .hint-item h3 {
        margin: 0.8em 0 0;
        font-size: calc( 100vw * 20 / 1440 );
        font-weight: 700;
        text-align: left;
    }
    #hint-list > .hint-grid .hint-item h3::after {
        content: "";
        display: inline-block;
        width: 1.5em;
        height: 0.8em;
        background: url(../images/icon-window.svg) no-repeat center / contain;
    }
    #hint-list > #hint-list-slider {
        display: none;
    }
    #hint-list > .hint-btn {
        position: relative;
        display: grid;
        place-items: center;
        margin: 0 calc( 100vw * 20 / 1440 );
        padding: 0 1.5em;
        margin: calc( 100vw * 60 / 1440 ) auto 0;
        width: var(--content-width-pc);
        max-width: calc( 100vw * 440 / 1440 );
        height: auto;
        aspect-ratio: 440 / 77;
        font-size: calc( 100vw * 20 / 1440 );
        font-weight: 700;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #hint-list > .hint-btn::after {
        position: absolute;
        content: "";
        display: block;
        top: calc( 50% - 0.5em );
        right: 1.5em;
        width: 1.2em;
        height: 1.0em;
        aspect-ratio: 20 / 18;
        background: #fff;
        -webkit-mask-image: url(../images/icon-arrow-white.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-arrow-white.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }

    #news-list {
        margin: 0 auto;
        padding: 0;
        width: 100%;
    }
    #news-list > .news-items {
        margin: 0 auto;
        width: var(--content-width-pc);
    }
    #news-list > .news-items .news-item {
        display: block;
        margin: 0;
        padding: calc( 100vw * 30 / 1440 ) 0;
        width: 100%;
        border-bottom: 1px solid #d2dbea;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    #news-list > .news-items .news-item .date {
        margin: 0;
        padding: 0;
        width: calc( 100vw * 80 / 1440 );
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 500;
        font-family: var(--font-alphabet);
        text-align: left;
    }
    #news-list > .news-items .news-item .title {
        margin: 0;
        padding: 0;
        width: calc( 100% - ( 100vw * 80 / 1440 ) );
        font-size: calc( 100vw * 16 / 1440 );
        font-weight: 500;
        text-align: left;
    }
    #news-list > .news-items .news-item .title a{
      text-decoration: underline;
    }
    #news-list > .news-items .news-item:first-child {
        border-top: 1px solid #d2dbea;
    }
    #news-list > .common-btn {
        margin: calc( 100vw * 40 / 1440 ) 5.0vw 0 auto;
    }
    #news-list > .news-btn {
        position: relative;
        display: grid;
        place-items: center;
        margin: 0 calc( 100vw * 20 / 1440 );
        padding: 0 1.5em;
        margin: calc( 100vw * 60 / 1440 ) auto 0;
        width: var(--content-width-pc);
        max-width: calc( 100vw * 440 / 1440 );
        height: auto;
        aspect-ratio: 440 / 77;
        font-size: calc( 100vw * 20 / 1440 );
        font-weight: 700;
        border-radius: calc( 100vw * 8 / 1440 );
    }
    #news-list > .news-btn::after {
        position: absolute;
        content: "";
        display: block;
        top: calc( 50% - 0.5em );
        right: 1.5em;
        width: 1.2em;
        height: 1.0em;
        aspect-ratio: 20 / 18;
        background: #fff;
        -webkit-mask-image: url(../images/icon-arrow-white.svg);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        -webkit-mask-position: center;
        mask-image: url(../images/icon-arrow-white.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
        mask-position: center;
        transition: background 0.3s ease-out;
    }

      .btn-cyan.btn-link{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 4px 0 0;
        padding: 1em;
        max-width: 280px;
        height: auto;
        aspect-ratio: 280 / 64;
        font-size: .9em;
        font-weight: 700;
        line-height: calc( 19.6 / 16 );
        background: var(--color-theme);
        border: 1px solid var(--color-theme);
        border-radius: 8px;
      }
      .btn-cyan.btn-link::after {
          content: "";
          display: block;
          width: 1.0em;
          height: 1.5em;
          aspect-ratio: 14 / 20;
          background: #fff;
          -webkit-mask-image: url(../images/icon-arrow-white.svg);
          -webkit-mask-repeat: no-repeat;
          -webkit-mask-size: contain;
          -webkit-mask-position: center;
          mask-image: url(../images/icon-arrow-white.svg);
          mask-repeat: no-repeat;
          mask-size: contain;
          mask-position: center;
          transition: background 0.3s ease-out;
      }
    dl{
        font-size: calc(100vw * 16 / 1440);
        font-weight: 400;
        line-height: 2.0;
        dt{
          font-weight:bold;
        }
        dd:not(:last-child){
          margin:0 0 1em;
        }
    }
    ol{
        padding: 0 0 0 1.2em;
        font-size: calc(100vw * 16 / 1440);
        font-weight: 400;
        line-height: 1.5;
        li:not(:last-child){
          margin:0 0 .5em;
        }
    }

    #page-main .corporate-goals-contents{
      p:not(:last-child){
        margin:0 0 1em;
      }
      small{
        display:block;
        line-height:1.5em;
      }
      nav{
        margin:4em 0 0;
      }
      .btn-cyan{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 4px 0 0;
        padding: 1em;
        max-width: 280px;
        height: auto;
        aspect-ratio: 280 / 64;
        font-size: .9em;
        font-weight: 700;
        line-height: calc( 19.6 / 16 );
        background: var(--color-theme);
        border: 1px solid var(--color-theme);
        border-radius: 8px;
      }
      .btn-cyan::after {
          content: "";
          display: block;
          width: 1.0em;
          height: 1.5em;
          aspect-ratio: 14 / 20;
          background: #fff;
          -webkit-mask-image: url(../images/icon-pdf.svg);
          -webkit-mask-repeat: no-repeat;
          -webkit-mask-size: contain;
          -webkit-mask-position: center;
          mask-image: url(../images/icon-pdf.svg);
          mask-repeat: no-repeat;
          mask-size: contain;
          mask-position: center;
          transition: background 0.3s ease-out;
      }
    }

    #page-main .service-contents{
      .service-operation-list li{
          font-size: 1.2em;
      }
    }

    #page-main .health-contents{
      .flex{
        display:flex;
        gap:3em;
      }
      .flex .pic{
        width:23%;
        flex-shrink:0;
        margin:0;
        border:solid 1px #ddd;
      }
    }

    #page-main .privacy-contents{
      p:not(:last-child){
        margin:0 0 2em;
      }
      .date{
        margin:4em 0 0;
      }
      .security-isms{
        max-width:200px;
      }
    }

    #page-main .notfound-contents{
      .common-h2{
        padding: 0;
        color:var(--fg-color);
      }
      .common-h2:before{
        display:none;
      }
      nav{
        margin:2em 0 0;
      }
    }

}