.media__digital {
    padding-top: 20rem;
}

.media__digital__fv {
    display: grid;
    grid-template-areas: "stack";
    width: 136.8rem;
    min-height: 63.4rem;
    overflow: hidden;
}

.media__digital__fv__img {
    grid-area: stack;
    width: 100%;
    height: 63rem;
    z-index: 1;
}

.media__digital__fv__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.media__digital__fv__inner {
    grid-area: stack;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 10rem 0 21rem 17rem;
}

.media__digital__ttl__sub {
    color: #FFF;
    font-family: "Shippori Mincho B1";
    font-size: 3rem;
    font-weight: 500;
}

.media__digital__ttl {
    color: #FFF;
    font-family: "Shippori Mincho B1";
    font-size: 5.6rem;
    font-style: normal;
    font-weight: 400;
    line-height: 8rem;
}

.media__digital__fv__txt {
    font-size: 1.6rem;
    line-height: 3.6rem;
    margin-top: 4rem;
    color: #FFF;
}

.media__digital__cta__wrap {
    padding: 3rem 0 8rem;
}

.media__digital__cta__wrap_inner {
    display: flex;
    justify-content: center;
    gap: 3.6rem;
}

.media__digital__cta__wrap_inner svg {
    width: 2.8rem;
    height: auto;
}

.media__digital__login__btn:hover {
    background-color: #000;
    color: #fff;
}

.media__digital__login__btn {
    display: block;
    font-family: "Shippori Mincho B1";
    font-size: 2.2rem;
    text-align: center;
    width: 38.2rem;
    border: solid 1px #000;
    border-radius: 10rem;
    padding: 1.8rem 6.8rem;
    margin: 0 auto 3rem;
    line-height: 1;
    transition: .3s;
}

.media__digital__cta__btn,
.media__digital__cta__trial__btn {
    border-radius: 8rem;
    width: 38.2rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.media__digital__cta__btn:hover,
.media__digital__cta__trial__btn:hover {
    opacity: .65;
}

.media__digital__cta__btn span,
.media__digital__cta__trial__btn span {
    text-align: center;
    font-family: "Shippori Mincho B1";
    font-size: 2.2rem;
    font-style: normal;
    line-height: 1;
    letter-spacing: 0.154rem;
    color: #FFF;
}

.media__digital__cta__btn {
    background: #E49931;
    padding: 1.8rem 6.8rem;

}

.media__digital__cta__trial__btn {
    background: #87AF79;
    padding: 1.8rem 5rem;
}

.media__digital__recommend__ttl {
    font-family: "Shippori Mincho B1";
    font-size: 4rem;
    font-weight: 500;
    text-align: center;
}

.media__digital__recommend__list {
    display: flex;
    gap: 2rem;
    justify-content: center;
    padding: 5rem 0 17.2rem;
}

.media__digital__recommend__content {
    border-radius: 2rem;
    border: 1px solid #A0A0A0;
    width: 28.5rem;
    height: 26.7rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: 4rem;
}

.media__digital__recommend__content span {
    color: #553F00;
    font-family: "Shippori Mincho B1";
    font-size: 4rem;
    font-weight: 500;
    position: relative;
    margin-bottom: 3rem;
}

.media__digital__recommend__content span::after {
    content: "";
    position: absolute;
    bottom: -1.5rem;
    left: 3rem;
    transform: translateX(-50%) rotate(-22deg);
    width: 10rem;
    height: .1rem;
    background-color: #A0A0A0;
}

.media__digital__recommend__content p {
    font-size: 2rem;
    font-weight: 500;
    line-height: 3.2rem;
    margin: 0;
    text-align: center;
    margin-top: 1.5rem;
}

.media__digital__about {
    display: flex;
    gap: 5rem;
    padding-bottom: 26.8rem;
    position: relative;
}

.media__digital__about__ttl {
    font-family: "Shippori Mincho B1";
    font-size: 4rem;
    font-weight: 500;
    line-height: 1.4;
}

.media__digital__about_txt__wrap {
    padding-left: 24rem;
    margin-top: -9rem;
}

.media__digital__about_txt__wrap p {
    font-size: 1.6rem;
    line-height: 3.6rem;
    padding-top: 5rem;
    width: 47rem;
}

.media__digital__about_img__wrap {
    padding-top: 15rem;
}

.media__digital__about_img__wrap img:first-of-type {
    position: relative;
    width: 76.8rem;
    height: auto;
}

.media__digital__about_img__wrap img:nth-of-type(2),
.media__digital__about_img__wrap img:nth-of-type(3) {
    position: absolute;
}

.media__digital__about_img__wrap img:nth-of-type(2) {
    width: 31.8rem;
    height: 21.2rem;
    left: 16rem;
    bottom: 16rem;
}

.media__digital__about_img__wrap img:nth-of-type(3) {
    width: 25.4em;
    height: 32.5rem;
    bottom: 9.7rem;
    left: 56.8rem;
}


.media__digital__news {
    max-width: 120rem;
    margin: 10rem auto 2rem;
    padding: 5rem 0;
    border-top: .1rem solid #A0A0A0;
    border-bottom: .1rem solid #A0A0A0;
    display: flex;
    align-items: flex-start;
}

.media__digital__news__title {
    color: #000;
    width: 32%;
    font-family: "Shippori Mincho B1";
    font-size: 4rem;
    font-weight: 500;
}

.media__digital__news__list {
    width: 68%;
    list-style: none;
    padding: 0;
    margin: 0;
    min-height: 20rem;
    max-height: 35rem;
    overflow-y: auto;
}

.media__digital__news__item:last-child {
    margin-bottom: 0;
}

.media__digital__news__date {
    width: 19rem;
    flex-shrink: 0;
}

.media__digital__news__content {
    flex: 1;
    line-height: 1.5;
}

.media__digital__point {
    background-image: url(../../img/media/media_digital_tsushin/media__digital__tsushin__point--pc@2x.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    display: flex;
    gap: 8rem;
}

.media__digital__point__title {
    padding-left: 17.2rem;
    color: #FFF;
    font-family: "Shippori Mincho B1";
    font-size: 4rem;
    font-weight: 500;
    line-height: 1.5;
}

.media__digital__point__list {
    padding-bottom: 14.2rem;
    width: 72.2rem;
}

.media__digital__point__title,
.media__digital__point__list {
    padding-top: 14rem;
}

.media__digital__point__item {
    padding: 5.7rem 0 2rem;
    border-bottom: .1rem solid #fff;
}

.media__digital__point__item:first-of-type {
    padding: 0 0 2rem;
}

.media__digital__point__num {
    color: #FFF;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 3.6rem;
    padding-right: 5rem;
}

.media__digital__point__content {
    color: #FFF;
    font-size: 2.6rem;
}

.media__digital__movie__title {
    text-align: center;
    font-family: "Shippori Mincho B1";
    font-size: 4rem;
    font-weight: 500;
    padding: 6.8rem 0 2rem;
    line-height: 1.5;
}

.media__digital__movie {
    text-align: center;
}

.media__digital__movie__wrap {
    margin: 2rem auto 7rem;
    max-width: 80rem;
}

.media__digital__movie__wrap iframe.youtube {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

.media__digital__trial {
    padding-top: 10rem;
    border-bottom: .1rem solid #000;
    padding-bottom: 5.2rem;
}

.media__digital__subscription {
    padding-top: 6.4rem;
}

.media__digital__trial,
.media__digital__subscription {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    max-width: 120rem;
    margin: 0 auto;
}

.media__digital__trial__title__wrap,
.media__digital__subscription__title__wrap {
    flex: 1;
    min-width: 48rem;
}

.media__digital__trial__title,
.media__digital__subscription__title {
    font-family: "Shippori Mincho B1";
    font-size: 4rem;
    font-weight: 500;
    line-height: 1.5;
    padding-bottom: 3.5rem;
}

.media__digital__trial__txt,
.media__digital__subscription__txt__wrap {
    flex: 1.2;
    padding: 5rem 6.5rem 5rem 7rem;

}

.media__digital__trial__txt p {
    position: relative;
    font-size: 2rem;
    line-height: 5rem;
}

.media__digital__trial__txt p::before {
    content: "・";
    position: absolute;
    left: -1rem;
    transform: translateX(-50%);
    top: .6rem;
}

.media__digital__trial__txt span {
    font-size: 2rem;
    font-weight: 500;
    line-height: 6rem;
}

.media__digital__border {
    display: none
}

.media__digital__subscription__price {
    border: .1rem solid #A0A0A0;
    padding: 1rem;
    text-align: center;
    margin-bottom: 1.5rem;
    background-color: transparent;
}

.media__digital__subscription__price__txt {
    margin: 0;
    color: #000;
    font-family: "Zen Kaku Gothic New";
    font-size: 2.2rem;
    font-style: normal;
    font-weight: 500;
    line-height: 3.6rem;
}

.media__digital__subscription__price__attention {
    font-size: 1.6rem;
    line-height: 1;
    margin-bottom: 3rem;
}

.media__digital__subscription__txt {
    color: #553F00;
    font-size: 2.5rem;
    line-height: 4.6rem;
    font-weight: 500;
}

.media__digital__environment {
    width: 100%;
    max-width: 120rem;
    margin: 0 auto;
    padding: 10rem 0;
}

.media__digital__environment__title {
    text-align: center;
    font-family: "Shippori Mincho B1";
    font-size: 4rem;
    font-weight: 500;
    margin-bottom: 3rem;
}

.media__digital__environment__list {
    width: 100%;
}

.media__digital__environment__table,
.media__digital__environment__sp_content {
    width: 100%;
    border-collapse: collapse;
    font-size: 1.6rem;
    line-height: 3.6rem;
}

.media__digital__environment__table th,
.media__digital__environment__table td,
.media__digital__environment__sp_content th,
.media__digital__environment__sp_content td {
    border: .1rem solid #A0A0A0;
    padding: 3rem;
    text-align: center;
    vertical-align: middle;
    box-sizing: border-box;
}

.media__digital__environment__label {
    width: 21rem;
    font-size: 2rem;
    font-weight: 500;
    line-height: 2.8rem;
}

.media__digital__environment__table thead th {
    font-size: 2rem;
    font-weight: 500;
    line-height: 1;
}

.media__digital__environment__th__pc {
    width: 21rem;
}

.media__digital__environment__table.--pc {
    display: table;
}

.media__digital__environment__group.--sp {
    display: none;
}

.media__digital__environment__notes {
    margin-top: 3rem;
    padding: 0;
    text-align: left;
    font-size: 1.4rem;
    line-height: 2.4rem;
}

.media__digital__environment__notes li {
    padding-left: 2.5rem;
    text-indent: -2.8rem;
}

@media screen and (max-width: 768px) {
    .media__digital {
        padding-top: 7rem;
    }

    .media__digital__fv {
        width: 100%;
        min-height: 50rem;
    }

    .media__digital__fv__img {
        height: 70rem;
    }

    .media__digital__fv__inner {
        padding: 5rem 5rem 20rem 3rem;
    }

    .media__digital__ttl__sub {
        font-size: 2rem;
        margin-bottom: 1rem;
    }

    .media__digital__ttl {
        font-size: 4rem;
        line-height: 1.5;
    }

    .media__digital__fv__txt {
        font-size: 1.4rem;
        line-height: 1.8;
        margin-top: 2rem;
        text-align: left;
        display: inline-block;
    }

    .media__digital__cta__wrap {
        padding: 4rem 0 0;
    }

    .media__digital__cta__wrap_inner {
        gap: 2rem;
        flex-direction: column;
        align-items: center;
    }

    .media__digital__login__btn {
        margin-bottom: 2rem;
    }

    .media__digital__login__btn,
    .media__digital__cta__btn,
    .media__digital__cta__trial__btn {
        width: 33.5rem;
    }


    .media__digital__cta__btn span,
    .media__digital__cta__trial__btn span {
        font-size: 2rem;
    }

    .media__digital__cta__btn {
        padding: 1.8rem 6rem;
    }

    .media__digital__cta__trial__btn {
        background: #87AF79;
        padding: 1.8rem 4.5rem;
    }

    .media__digital__recommend__ttl {
        font-size: 3.2rem;
        padding-top: 7rem;
    }

    .media__digital__recommend__list {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
        width: 100%;
        padding: 4.5rem 3.6rem 14rem;
    }

    .media__digital__recommend__content {
        width: 16rem;
        height: 15.6rem;
        padding-top: 2rem;
    }

    .media__digital__recommend__content span {
        font-size: 3.2rem;
    }

    .media__digital__recommend__content span::after {
        bottom: -0.8rem;
        left: 2rem;
        width: 7rem;
        transform: translateX(-50%) rotate(-18deg);
    }

    .media__digital__recommend__content p {
        font-size: 1.2rem;
        line-height: 2rem;
        margin-top: -.5rem;
    }

    .media__digital__about_txt__wrap {
        padding-left: 3.6rem;
        margin-top: 0;
    }

    .media__digital__about {
        flex-direction: column;
        gap: 6rem;
        padding-bottom: 40rem;
    }

    .media__digital__about__ttl {
        margin-top: -7rem;
        font-size: 3.2rem;
        letter-spacing: -0.096rem;
    }

    .media__digital__about_txt__wrap p {
        padding-top: 4rem;
        padding-right: 4rem;
        font-size: 1.4rem;
        line-height: 2.8rem;
        width: 100%;
    }

    .media__digital__about_img__wrap {
        padding-top: 0;
    }

    .media__digital__about_img__wrap img:first-of-type {
        position: relative;
        width: 32.6rem;
        height: 18.8rem;
        margin-left: 8rem;
    }

    .media__digital__about_img__wrap img:nth-of-type(2) {
        width: 15.4rem;
        height: 10.3rem;
        left: 3.6rem;
        bottom: 31rem;
    }

    .media__digital__about_img__wrap img:nth-of-type(3) {
        width: 17.5rem;
        height: 22.3917rem;
        bottom: 5rem;
        left: 19rem;
    }

    .media__digital__news {
        flex-direction: column;
        padding: 4rem 0;
        width: 33rem;
        margin: 8rem auto 0;
    }

    .media__digital__news__title {
        font-size: 3.2rem;
    }

    .media__digital__news__title,
    .media__digital__news__list {
        width: 100%;
    }

    .media__digital__news__list {
        margin-top: 3rem;
    }

    .media__digital__news__item,
    .media__digital__point {
        flex-direction: column;
        align-items: flex-start;
    }

    .media__digital__news__item {
        font-size: 1.6rem;
        line-height: 2.8rem;
        margin-bottom: 3rem;
    }

    .media__digital__news__item:last-of-type {
        margin-bottom: 0;
    }

    .media__digital__point {
        background-image: url(../../img/media/media_digital_tsushin/media__digital__tsushin__point--sp@2x.webp);
        margin-top: 4rem;
        gap: 0;
    }

    .media__digital__point__title {
        padding-left: 3.6rem;
        padding-right: 3.6rem;
    }

    .media__digital__point__title {
        padding-top: 6rem;
        font-size: 3.2rem;
        padding-bottom: 4rem;
    }

    .media__digital__point__item {
        display: flex;
        flex-direction: column;
        font-size: 1.6rem;
        padding: 1.5rem 0 2rem;
    }

    .media__digital__point__list {
        width: 33rem;
        margin: 0 auto;
        border-top: .1rem solid #fff;
        padding-top: 1.5rem;
        padding-bottom: 6rem;
    }

    .media__digital__point__num {
        font-size: 1.4rem;
        line-height: 1;
        padding-bottom: 1.5rem;
    }

    .media__digital__point__content {
        font-size: 1.4rem;
    }

    .media__digital__movie__title {
        font-size: 3.2rem;
        letter-spacing: -0.096rem;
        padding: 6.8rem 0 0;
    }

    .media__digital__movie__wrap {
        margin: 1rem auto 7rem;
        width: 34rem;
    }

    .media__digital__trial {
        padding-top: 7rem;
        border-bottom: none;
    }

    .media__digital__trial__title__wrap,
    .media__digital__subscription__title__wrap {
        padding-left: 3.6rem;
        padding-bottom: 2.5rem;
    }

    .media__digital__trial__title,
    .media__digital__subscription__title {
        font-size: 3.2rem;
        letter-spacing: -0.096rem;
    }

    .media__digital__trial__txt {
        padding: 4rem 3.6rem 2rem 5rem;
    }

    .media__digital__trial__txt p,
    .media__digital__trial__txt span {
        font-size: 1.6rem;
        line-height: 2.8rem;
        margin-bottom: 2rem;
    }

    .media__digital__trial__txt p::before {
        top: 0;
    }

    .media__digital__border {
        display: block;
        border: none;
        border-top: .1rem solid #000;
        width: calc(100% - 6rem);
        margin: 0 auto;
    }

    .media__digital__subscription {
        padding-top: 4rem;
    }

    .media__digital__subscription__txt__wrap {
        padding: 4rem 2.7rem 4rem 3.1rem;
    }

    .media__digital__subscription__price__txt {
        color: #000;
        text-align: center;
        font-family: "Zen Kaku Gothic New";
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 500;
        line-height: 3.6rem;
    }

    .media__digital__subscription__price__attention {
        font-size: 1.2rem;
    }

    .media__digital__subscription__txt {
        font-size: 1.6rem;
        line-height: 3rem;
    }

    .media__digital__environment {
        padding-top: 7rem;
    }

    .media__digital__environment__title {
        font-size: 3.2rem;
        letter-spacing: -0.096rem;
        margin-bottom: 2rem;
    }

    .media__digital__environment__table.--sp thead th {
        font-size: 1.6rem;
    }

    .media__digital__environment__table.--pc {
        display: none !important;
    }

    .media__digital__environment__group.--sp {
        display: block !important;
        padding: 0 3.6rem;
    }

    .media__digital__environment__table,
    .media__digital__environment__sp_content {
        font-size: 1.4rem;
        line-height: 2rem;
        margin-bottom: 2rem;
    }

    .media__digital__environment__table.--sp thead th,
    .media__digital__environment__sp_content thead th {
        font-size: 2rem;
        font-weight: 500;
        padding: 1rem;
    }

    .media__digital__environment__table.--sp tbody th,
    .media__digital__environment__sp_content tbody th {
        width: 35%;
        font-size: 1.6rem;
        padding: 2rem 1rem;
        font-weight: 500;
    }

    .media__digital__environment__table.--sp tbody td,
    .media__digital__environment__sp_content tbody td {
        width: 65%;
        padding: 0;
        height: 8.3rem;
    }

    .media__digital__environment__sp_content tbody th {
        font-weight: 500;
    }

    .media__digital__environment__notes {
        font-size: 1.2rem;
        line-height: 2rem;
        padding: 0 3.6rem;
        margin-top: 1rem;
    }

    .media__digital__environment__notes li {
        padding-left: 2rem;
        text-indent: -2rem;
    }
}

/* rakukei */
.media__digital__subscription.--rakukei .media__digital__subscription__txt__wrap {
    padding: 4.6rem 6.5rem 5.8rem 3.4rem;
}

.media__digital__point.--rakukei {
    background-image: url(../../img/media/media_digital_rakukei/media__digital__rakukei__point--pc@2x.webp);
}

@media screen and (max-width: 768px) {
    .media__digital__subscription.--rakukei .media__digital__subscription__txt__wrap {
        font-size: 1.4rem;
        padding: 4rem 3.6rem;
    }

    .media__digital__point.--rakukei {
        background-image: url(../../img/media/media_digital_rakukei/media__digital__rakukei__point--sp@2x.webp);
    }

    .media__digital__subscription[class*="--rakukei"] .media__digital__subscription__txt {
        font-size: 1.4rem !important;
    }
}