@charset "UTF-8";

:root {
    --ep-color-primary: #D01207;
}

#content {
    padding-bottom: 0;
}

@media screen and (max-width: 767px) {
    .em-mv.em-mv--margin.m365 {
        padding-top: calc(80 / 750 * 100vw);
    }
}
@media screen and (min-width: 768px), print {
    .em-mv.em-mv--margin.m365 {
        padding-top: calc(94 / 1920 * 100vw);
        padding-bottom: calc(60 / 1920 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .em-mv.em-mv--margin.m365 {
        padding-top: 94px;
        padding-bottom: 60px;
    }
}

.em-inner {
    max-width: 1408px;
}
@media screen and (min-width: 768px), print {
    .em-inner {
        width: 100%;
    }
}

@media screen and (min-width: 768px), print {
    .em-mv__inner {
        gap: 40px;
    }
}

@media screen and (min-width: 768px), print {
    .em-mv__right {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: calc(828 / 1920 * 100vw);
        padding-top: calc(10 / 1920 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .em-mv__right {
        width: 828px;
        padding-top: 10px;
    }
}

@media screen and (max-width: 767px) {
    .em-mv__inner.reverse .em-mv__img {
        width: calc(670 / 750 * 100vw);
        margin: calc(40 / 750 * 100vw) auto calc(60 / 750 * 100vw);
    }
}
@media screen and (min-width: 768px), print {
    .em-mv__inner.reverse .em-mv__img {
        width: calc(540 / 1920 * 100vw)
    }
}
@media screen and (min-width: 1920px), print {
    .em-mv__inner.reverse .em-mv__img {
        width: 540px;
    }
}

@media screen and (max-width: 767px) {
    .em-mv.m365 .em-mv__text {
        font-size: calc(50 / 750 * 100vw);
    }
}

@media screen and (min-width: 768px), print {
    .em-mv.m365 .em-mv__text-text {
        font-size: calc(46 / 1920 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .em-mv.m365 .em-mv__text-text {
        font-size: 46px;
    }
}

@media screen and (min-width: 768px), print {
    .em-mv.m365 .em-mv__text-text .large {
        font-size: calc(52 / 1920 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .em-mv.m365 .em-mv__text-text .large {
        font-size: 52px;
    }
}
@media screen and (min-width: 768px), print {
    .em-mv.m365 .em-mv__text-text .small {
        font-size: calc(34 / 1920 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .em-mv.m365 .em-mv__text-text .small {
        font-size: 34px;
    }
}

.em-mv__img img {
    aspect-ratio: auto;
}

@media screen and (max-width: 767px) {
    .em-mv.m365 .em-mv__btn {
        margin-top: 0;
    }
}
@media screen and (min-width: 768px), print {
    .em-mv.m365 .em-mv__btn {
        margin-top: calc(69 / 1920 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .em-mv.m365 .em-mv__btn {
        margin-top: 69px;
    }
}

.em-mv.m365 .em-mv__btn.column a {
    padding: 9px 0;
    border-radius: 100px;
    line-height: calc(28 / 24 * 1em);
}
@media screen and (max-width: 767px) {
    .em-mv.m365 .em-mv__btn.column a {
        padding: calc(13 / 750 * 100vw) 0;
        font-size: calc(24 / 750 * 100vw);
    }
}

@media screen and (max-width: 767px) {
    .em-mv__btn a {
        width: calc(580 / 750 * 100vw);
        margin-top: 0;
    }
}
@media screen and (min-width: 768px), print {
    .em-mv__btn a {
        width: calc(580 / 1920 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .em-mv__btn a {
        width: 580px;
    }
}

@media screen and (min-width: 768px), print {
    .em-mv__btn a::after {
        width: 7px;
        height: 7px;
        border-width: 3px;
    }
}

@media screen and (max-width: 767px) {
    .em-mv__btn a span {
        margin: 0;
        font-size: calc(18 / 750 * 100vw);
    }
}

.em-pc-problem__text {
    margin-bottom: 60px;
    line-height: calc(54 / 36 * 1em);
}
@media screen and (max-width: 767px) {
    .em-pc-problem__text {
        margin-bottom: calc(60 / 750 * 100vw);
        font-size: calc(36 / 750 * 100vw);
    }
}

.em-pc-problem__tooltip {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(500 / 1280 * 100vw);
    height: calc(60 / 1280 * 100vw);
    margin: 0 auto calc(50 / 1280 * 100vw);
    font-size: calc(24 / 1280 * 100vw);
    font-weight: 700;
    color: #fff;
    background-color: #555555;
    border-radius: 100px;
}
.em-pc-problem__tooltip:after {
    content: '';
    position: absolute;
    bottom: calc(-12 / 1280 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-top: calc(14 / 1280 * 100vw) solid #555555;
    border-right: calc(12 / 1280 * 100vw) solid transparent;
    border-left: calc(12 / 1280 * 100vw) solid transparent;
}
@media screen and (max-width: 767px) {
    .em-pc-problem__tooltip {
        width: calc(500 / 750 * 100vw);
        height: calc(60 / 750 * 100vw);
        margin: 0 auto calc(72 / 750 * 100vw);
        font-size: calc(24 / 750 * 100vw);
    }
    .em-pc-problem__tooltip:after {
        bottom: calc(-12 / 750 * 100vw);
        border-top-width: calc(14 / 750 * 100vw);
        border-right-width: calc(12 / 750 * 100vw);
        border-left-width: calc(12 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .em-pc-problem__tooltip {
        width: 500px;
        height: 60px;
        margin: 0 auto 50px;
        font-size: 24px;
    }
    .em-pc-problem__tooltip:after {
        bottom: -12px;
        border-top-width: 14px;
        border-right-width: 12px;
        border-left-width: 12px;
    }
}

.em-pc-problem__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-content: center;
    gap: calc(30 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .em-pc-problem__list {
        display: flex;
        flex-direction: column;
        gap: calc(33 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    gap: 30px;
}

.em-pc-problem__list li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(40 / 1280 * 100vw);
    padding: calc(40 / 1280 * 100vw) calc(38 / 1280 * 100vw) calc(17 / 1280 * 100vw);
    box-sizing: border-box;
    background-color: #F3F3F3;
}
@media screen and (max-width: 767px) {
    .em-pc-problem__list li {
        padding: calc(60 / 750 * 100vw) calc(40 / 750 * 100vw);
        gap: calc(40 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .em-pc-problem__list li {
        gap: 40px;
        padding: 40px 38px 17px;
    }
}

@media screen and (max-width: 767px) {
    .em-pc-problem__list li .problem-icon {
        display: block;
    }
    .em-pc-problem__list li.--1 .problem-icon {
        width: calc(190 / 750 * 100vw);
    }
    .em-pc-problem__list li.--2 .problem-icon {
        width: calc(178 / 750 * 100vw);
    }
    .em-pc-problem__list li.--3 .problem-icon {
        width: calc(271 / 750 * 100vw);
    }

    .em-pc-problem__list li .problem-icon img {
        width: 100%;
    }
}

.em-pc-problem__list li .problem-text {
    font-size: calc(18 / 1280 * 100vw);
    font-weight: 700;
    text-align: center;
    line-height: calc(32 / 18 * 1em);
    color: var(--ep-color-primary);
}
@media screen and (max-width: 767px) {
    .em-pc-problem__list li .problem-text {
        font-size: calc(36 / 750 * 100vw);
        line-height: calc(60 / 36 * 1em);
    }
}
@media screen and (min-width: 1280px), print {
    .em-pc-problem__list li .problem-text {
        font-size: 18px;
    }
}

.secProduct-lead {
    padding: 78px 0 105px;
    background-color: #F3F3F3;
}
@media screen and (max-width: 767px) {
    .secProduct-lead {
        padding: calc(100 / 750 * 100vw) 0;
    }
}

.secProduct__title {
    margin: 0 0 60px;
    font-size: 42px;
    font-weight: 700;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .secProduct__title {
        margin-bottom: calc(50 / 750 * 100vw);
        font-size: calc(48 / 750 * 100vw);
    }
}

.secProduct__title span {
    color: var(--ep-color-primary);
}

.secProduct-lead__title span {
    color: var(--ep-color-primary);
}

.secProduct-lead__img {
    display: block;
    max-width: 1000px;
    width: calc(1000 / 1280 * 100vw);
    margin: 0 auto;
}
@media screen and (max-width: 767px) {
    .secProduct-lead__img {
        width: calc(670 / 750 * 100vw);
    }
}

.secProduct-overview {
    padding: 80px 0;
}
@media screen and (max-width: 767px) {
    .secProduct-overview {
        padding: calc(80 / 750 * 100vw) calc(40 / 750 * 100vw) calc(100 / 750 * 100vw);
    }
}

.secProduct-overview__img {
    display: flex;
    justify-content: center;
    gap: calc(25 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-overview__img {
        flex-direction: column;
        gap: calc(30 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-overview__img {
        gap: 25px;
    }
}

.secProduct-overview__img picture {
    display: block;
}
@media screen and (min-width: 768px), print {
    .secProduct-overview__img picture.secProduct-overview__img-app {
        width: calc(497 / 1280 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-overview__img picture.secProduct-overview__img-app {
        width: 497px;
    }
}
@media screen and (min-width: 768px), print {
    .secProduct-overview__img picture.secProduct-overview__img-log {
        width: calc(683 / 1280 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-overview__img picture.secProduct-overview__img-log {
        width: 683px;
    }
}

.secProduct-feature {
    padding: 100px 0 124px;
    background-color: #F3F3F3;
}
@media screen and (max-width: 767px) {
    .secProduct-feature {
        padding: calc(100 / 750 * 100vw) 0;
    }
}

.secProduct-feature .secProduct__title {
    margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
    .secProduct-feature .secProduct__title {
        margin-bottom: calc(90 / 750 * 100vw);
    }
}

.secProduct-feature__list {
    display: flex;
    flex-direction: column;
    gap: 60px;
}
@media screen and (max-width: 767px) {
    .secProduct-feature__list {
        gap: calc(120 / 750 * 100vw);
    }
}

.secProduct-feature__list li {
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 767px) {
    .secProduct-feature__list li {
        position: relative;
        flex-direction: column-reverse;
    }
}
@media screen and (min-width: 768px), print {
    .secProduct-feature__list li:nth-of-type(even) {
        flex-direction: row-reverse;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-feature__list li {
    }
}

@media screen and (max-width: 767px) {
    .secProduct-feature__list li:before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        width: calc(670 / 750 * 100vw);
        height: 100%;
        background-color: #fff;
        border: 1px solid #DDDDDD;
        transform: translateX(-50%);
    }
}

.secProduct-feature__img {
    display: block;
    width: calc(860 / 1920 * 100vw);
    z-index: 1;
}
@media screen and (max-width: 767px) {
    .secProduct-feature__img {
        width: 100%;
        margin: 0 0 calc(50 / 750 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .secProduct-feature__img {
        width: 860px;
    }
}

.secProduct-feature__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: calc(860 / 1920 * 100vw);
    height: calc(640 / 1920 * 100vw);
    padding: 0 calc(150 / 1920 * 100vw);
    margin-left: calc(-100 / 1920 * 100vw);
    box-sizing: border-box;
}
@media screen and (max-width: 767px) {
    .secProduct-feature__text {
        position: relative;
        width: calc(670 / 750 * 100vw);
        height: auto;
        margin: 0 auto;
        padding: calc(80 / 750 * 100vw) calc(42 / 750 * 100vw) calc(60 / 750 * 100vw);
        box-sizing: border-box;
    }
}
@media screen and (min-width: 768px), print {
    .secProduct-feature__text {
        background-image: url("../images/product/m365/bg_feature.svg");
        background-repeat: no-repeat;
        -webkit-background-size: contain;
        background-size: contain;
    }
}
@media screen and (min-width: 1920px), print {
    .secProduct-feature__text {
        width: 860px;
        height: 640px;
        padding: 0 150px;
        margin-left: -100px;
    }
}
@media screen and (min-width: 768px), print {
    .secProduct-feature__list li:nth-of-type(even) .secProduct-feature__text {
        margin-left: 0;
        margin-right: calc(-100 / 1920 * 100vw);
    }
}
@media screen and (min-width: 1920px), print {
    .secProduct-feature__list li:nth-of-type(even) .secProduct-feature__text {
        margin-right: -100px;
    }
}

.secProduct-feature__text-point {
    width: calc(205 / 1920 * 100vw);
    height: calc(52 / 1920 * 100vw);
    margin: 0 0 calc(30 / 1920 * 100vw);
    font-family: 'Oswald', sans-serif;
    font-size: calc(36 / 1920 * 100vw);
    text-align: center;
    line-height: calc(44 / 36 * 1em);
    color: #fff;
    background-image: url("../images/product/m365/bg_point.svg");
    background-repeat: no-repeat;
    -webkit-background-size: contain;
    background-size: contain;
}
@media screen and (max-width: 767px) {
    .secProduct-feature__text-point {
        position: absolute;
        top: calc(-40 / 750 * 100vw);
        left: 50%;
        transform: translateX(-50%);
        width: calc(304 / 750 * 100vw);
        height: calc(80 / 750 * 100vw);
        font-size: calc(51 / 750 * 100vw);
        line-height: calc(62 / 51 * 1em);
    }
}
@media screen and (min-width: 1920px), print {
    .secProduct-feature__text-point {
        width: 205px;
        height: 52px;
        margin: 0 0 30px;
        font-size: 36px;
    }
}

.secProduct-feature__text-point span {
    display: inline-block;
    margin: 0 calc(4 / 1920 * 100vw) 0 0;
    font-size: calc(20 / 1920 * 100vw);
    line-height: calc(44 / 20 * 1em);
}
@media screen and (max-width: 767px) {
    .secProduct-feature__text-point span {
        margin: 0 calc(6 / 750 * 100vw) 0 ;
        font-size: calc(29 / 750 * 100vw);
        line-height: calc(62 / 29 * 1em);
    }
}
@media screen and (min-width: 1920px), print {
    .secProduct-feature__text-point span {
        margin: 0 4px 0 0;
        font-size: 20px;
    }
}

.secProduct-feature__title {
    margin: 0 0 calc(24 /1920 * 100vw);
    font-size: calc(36 / 1920 * 100vw);
    line-height: calc(58 / 36 * 1em);
    font-weight: 700;
    color: var(--ep-color-primary);
}
@media screen and (max-width: 767px) {
    .secProduct-feature__title {
        margin-bottom: calc(30 / 750 * 100vw);
        font-size: calc(46 / 750 * 100vw);
        line-height: calc(68 / 46 * 1em);
    }
}
@media screen and (min-width: 1920px), print {
    .secProduct-feature__title {
        margin: 0 0 24px;
        font-size: 36px;
    }
}

.secProduct-feature__text-content {
    font-size: calc(18 / 1920 * 100vw);
    line-height: calc(32 / 18 * 1em);
}
.secProduct-feature__text-content + .secProduct-feature__text-content {
    margin: calc(30 / 1920 * 100vw) 0 0;
}
@media screen and (max-width: 767px) {
    .secProduct-feature__text-content {
        font-size: calc(28 / 750 * 100vw);
        line-height: calc(50 / 28 * 1em);
    }
    .secProduct-feature__text-content + .secProduct-feature__text-content {
        margin: calc(10 / 750 * 100vw) 0 0;
    }
}
@media screen and (min-width: 1920px), print {
    .secProduct-feature__text-content {
        font-size: 18px;
    }
    .secProduct-feature__text-content + .secProduct-feature__text-content {
        margin: 30px 0 0;
    }
}

.secProduct-timeline {
    padding: calc(100 / 1280 * 100vw) 0 calc(80 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-timeline {
        padding: calc(80 / 750 * 100vw) 0 0;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-timeline {
        padding: 100px 0 80px;
    }
}

.secProduct-timeline__img {
    display: block;
    max-width: 1200px;
    width: calc(1200 / 1280 * 100vw);
    margin: 0 auto calc(64 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-timeline__img {
        width: calc(670 / 750 * 100vw);
        margin-bottom: calc(50 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-timeline__img {
        margin-bottom: 64px;
    }
}

.secProduct-timeline__example {
    display: flex;
    justify-content: center;
    gap: calc(48 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-timeline__example {
        flex-direction: column;
        gap: calc(20 / 750 * 100vw);
        width: calc(670 / 750 * 100vw);
        margin: 0 auto;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-timeline__example {
        gap: 48px;
    }
}

@media screen and (max-width: 767px) {
    .secProduct-timeline__example li:not(:last-child) {
        background-image: url("../images/product/m365/ico_timeline_arrow.svg");
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: calc(44 / 750 * 100vw);
    }
}

.secProduct-timeline__example__text {
    width: calc(264 / 1280 * 100vw);
    height: calc(132 / 1280 * 100vw);
    margin: 0 0 calc(6 / 1280 * 100vw);
    padding: calc(37 / 1280 * 100vw) calc(15 / 1280 * 100vw) calc(46 / 1280 * 100vw) calc(20 / 1280 * 100vw);
    box-sizing: border-box;
    font-size: calc(17 / 1280 * 100vw);
    font-weight: 700;
    line-height: calc(24 / 17 * 1em);
    background-color: #f3f3f3;
    border-radius: calc(15 / 1280 * 100vw);
}
.secProduct-timeline__example__text.text-red {
    color: var(--ep-color-primary);
}
@media screen and (max-width: 767px) {
    .secProduct-timeline__example__text {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: calc(130 / 750 * 100vw);
        margin: 0 0 calc(20 / 750 * 100vw);
        padding: 0;
        font-size: calc(36 / 750 * 100vw);
        line-height: 1;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-timeline__example__text {
        width: 264px;
        height: 132px;
        margin: 0 0 6px;
        padding: 37px 15px 46px 20px;
        font-size: 17px;
        border-radius: 15px;
    }
}

.secProduct-timeline__example__time {
    font-size: calc(16 / 1280 * 100vw);
    font-weight: 700;
    line-height: calc(16 / 14 * 1em);
}
@media screen and (max-width: 767px) {
    .secProduct-timeline__example__time {
        font-size: calc(28 / 750 * 100vw);
        text-align: right;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-timeline__example__time {
        font-size: 16px;
    }
}

.secProduct-log {
    padding: calc(80 / 1280 * 100vw) 0 calc(100 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-log {
        padding: calc(80 / 750 * 100vw) 0;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-log {
        padding: 80px 0 100px;
    }
}

@media screen and (min-width: 768px), print {
    .secProduct-log .secProduct__title {
        margin-bottom: calc(32 / 1280 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-log .secProduct__title {
        margin-bottom: 32px;
    }
}

.secProduct-log__table-wrapper {
    width: calc(1200 / 1280 * 100vw);
    max-width: 1200px;
    margin: 0 auto;
}

.secProduct-log .logIc {
    text-align: right;
    position: relative;
    width: calc((86/750)*100vw);
    margin: calc((-8/750)*100vw) 0 calc((8/750)*100vw) auto;
    right: calc((27/750)*100vw)
}
@media screen and (max-width: 767px) {
    .secProduct-log .logIc {
        display: none;
    }
}
@media screen and (min-width: 768px), print {
    .secProduct-log .logIc {
        width:calc(131 / 1280 * 100vw);
        margin: 0 0 calc(8 / 1280 * 100vw) auto;
        right: calc(3 / 1280 * 100vw)
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-log .logIc {
        width:131px;
        margin: 0 0 8px auto;
        right: 3px
    }
}

.secProduct-log .logIc img {
    width: 100%;
}

.secProduct-log .logTable {
    border-spacing: 0;
    border-right: solid 1px #F3F3F3;
    width: calc((670/750)*100vw)
}

@media screen and (max-width: 400px), print {
    .secProduct-log .logTable {
        transform:scale(1)
    }
}

@media screen and (max-width: 767px), print {
    .secProduct-log .logTable {
        margin:auto
    }
}

@media screen and (min-width: 768px), print {
    .secProduct-log .logTable {
        width: 100%;
    }
}

.secProduct-log .logTable td {
    font-size: calc((14/750)*100vw);
    letter-spacing: -0.05em
}

@media screen and (max-width: 767px), print {
    .secProduct-log .logTable td {
        font-feature-settings:"palt";
        line-height: 1.2;
        padding: calc((10/750)*100vw)
    }
}

@media screen and (min-width: 768px), print {
    .secProduct-log .logTable td {
        font-size:14px;
        padding: calc(10 / 1280 * 100vw) calc(12 / 1280 * 100vw) calc(19 / 1280 * 100vw) calc(12 / 1280 * 100vw);
        line-height: 1.2;
        border-right-color: #F3F3F3;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-log .logTable td {
        padding: 10px 12px 19px 12px;
    }
}

.secProduct-log .logTable td span {
    display: inline-block;
    background-color: #000000;
    border-radius: 50%;
    width: calc((10/750)*100vw);
    height: calc((10/750)*100vw)
}

@media screen and (max-width: 767px), print {
    .secProduct-log .logTable td span {
        margin:0 calc((5/750)*100vw)
    }
}

@media screen and (min-width: 768px), print {
    .secProduct-log .logTable td span {
        width:12px;
        height: 12px
    }
}

.secProduct-log .logTable td.td01 {
    color: #ffffff;
    background-color: var(--ep-color-primary);
    font-weight: bold;
    border-bottom: solid 1px #ffffff;
    width: calc((80/750)*100vw)
}

@media screen and (max-width: 767px), print {
    .secProduct-log .logTable td.td01 {
        padding: calc(13 / 750 * 100vw) 0 calc(14 / 750 * 100vw);
        font-size: calc(14 / 750 * 100vw);
        text-align: center;
    }
}

@media screen and (min-width: 768px), print {
    .secProduct-log .logTable td.td01 {
        width:11.66%;
        padding: calc(24 / 1280 * 100vw) calc(20 / 1280 * 100vw)
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-log .logTable td.td01 {
        padding: 24px 20px;
    }
}

.secProduct-log .logTable td.td01.ls {
    border-bottom: solid 1px #F3F3F3
}

.secProduct-log .logTable td.td02 {
    background-color: #FDF2F2;
    font-weight: bold;
    border-bottom: solid 1px #F3F3F3;
}

@media screen and (max-width: 767px), print {
    .secProduct-log .logTable td.td02 {
        margin:auto;
        line-height: 1.4;
        width: calc((90/750)*100vw);
        font-size: calc((14/750)*100vw);
        padding: 0 calc((7/750)*100vw);
        border-right-color: #F3F3F3;
    }
}

@media screen and (min-width: 768px), print {
    .secProduct-log .logTable td.td02 {
        width: 17%;
    }
}

.secProduct-log .logTable td.td02.fr {
    border-top: solid 1px #F3F3F3
}

.secProduct-log .logTable td.td02.ls {
    border-bottom: solid 1px #F3F3F3
}

@media screen and (max-width: 767px), print {
    .secProduct-log .logTable td.td02.ls {
        white-space:nowrap
    }
}

.secProduct-log .logTable td.td03 {
    border-bottom: solid 1px #F3F3F3
}

@media screen and (max-width: 767px), print {
    .secProduct-log .logTable td.td03 {
        line-height:1.5;
        padding: calc((10/750)*100vw);
        width: calc((308/750)*100vw);
        font-size: calc(14 / 750 * 100vw);
        border-right-color: #F3F3F3;
    }
}

.secProduct-log .logTable td.td03.fr {
    border-top: solid 1px #F3F3F3
}

.secProduct-log .logTable td.td04 {
    border-bottom: solid 1px #F3F3F3;
    border-left: solid 1px #F3F3F3;
    text-align: center
}

@media screen and (max-width: 767px), print {
    .secProduct-log .logTable td.td04 {
        padding:0;
        font-size: calc((14/750)*100vw);
        border-right-color: #F3F3F3;
    }
}

@media screen and (min-width: 768px), print {
    .secProduct-log .logTable td.td04 {
        width: 2.83%;
        padding: 0 5px
    }
}

.secProduct-log .logTable td.td04.fr {
    border-top: solid 1px #F3F3F3
}

.secProduct-price {
    padding: calc(40 / 1280 * 100vw) 0 calc(47 / 1280 * 100vw);
    background-image: url("../images/product/m365/bg_price.webp");
    background-repeat: no-repeat;
    background-size: cover;
}
@media screen and (max-width: 767px) {
    .secProduct-price {
        padding: calc(80 / 750 * 100vw) 0;
        background-image: url("../images/product/m365/bg_price_sp.webp");
    }
}
@media screen and (min-width: 1280px), print {
    padding: 40px 0 47px;
}

.secProduct-price .secProduct__title {
    margin-bottom: calc(30 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price .secProduct__title {
        margin-bottom: calc(30 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price .secProduct__title {
        margin-bottom: 30px;
    }
}

.secProduct__overview {
    margin: 0 0 calc(40 / 1280 * 100vw);
    font-size: calc(18 / 1280 * 100vw);
    text-align: center;
    line-height: calc(28 / 18 * 1em);
}
@media screen and (max-width: 767px) {
    .secProduct__overview {
        margin: 0 0 calc(60 / 750 * 100vw);
        font-size: calc(28 / 750 * 100vw);
        line-height: calc(50 / 28 * 1em);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct__overview {
        margin: 0 0 40px;
        font-size: 18px;
        line-height: 28px;
    }
}

.secProduct-price__wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(45 / 1280 * 100vw);
    margin: 0 auto calc(50 / 1280 * 100vw)
}
@media screen and (max-width: 767px) {
    .secProduct-price__wrapper {
        flex-direction: column;
        gap: calc(20 / 750 * 100vw);
        margin-bottom: calc(60 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__wrapper {
        gap: 45px;
        margin-bottom: 50px;
    }
}

.secProduct-price__item {
    width: calc(440 / 1280 * 100vw);
    height: calc(331 / 1280 * 100vw);
    background-color: #fff;
    border-radius: calc(5 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price__item {
        width: calc(670 / 750 * 100vw);
        height: calc(504 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item {
        width: 440px;
        height: 331px;
        border-radius: 5px;
    }
}

.secProduct-price__item-title {
    display: flex;
    justify-content: center;
    align-items: center;
    height: calc(70 / 1280 * 100vw);
    font-size: calc(24 / 1280 * 100vw);
    font-weight: 700;
    border-radius: calc(5 / 1280 * 100vw) calc(5 / 1280 * 100vw) 0 0;
}
.secProduct-price__item.--license .secProduct-price__item-title {
    background-color: #E5E5E5;
}
.secProduct-price__item.--option .secProduct-price__item-title {
    color: #fff;
    background-color: var(--ep-color-primary);
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-title {
        height: calc(106 / 750 * 100vw);
        font-size: calc(36 / 750 * 100vw);
        border-radius: calc(5 / 750 * 100vw) calc(5 / 750 * 100vw) 0 0;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-title {
        height: 70px;
        font-size: 24px;
        border-radius: 5px 5px 0 0;
    }
}

.secProduct-price__item-body {
    background-color: #fff;
    border-radius: 0 0 calc(5 / 1280 * 100vw) calc(5 / 1280 * 100vw);
}
.secProduct-price__item.--license .secProduct-price__item-body {
    padding: calc(53 / 1280 * 100vw) calc(10 / 1280 * 100vw) 0;
}
.secProduct-price__item.--option .secProduct-price__item-body {
    padding: calc(24 / 1280 * 100vw) calc(20 / 1280 * 100vw) calc(15 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-body {
        border-radius: 0 0 calc(5 / 750 * 100vw) calc(5 / 750 * 100vw);
    }
    .secProduct-price__item.--license .secProduct-price__item-body {
        padding: calc(81 / 750 * 100vw) calc(16 / 750 * 100vw) 0;
    }
    .secProduct-price__item.--option .secProduct-price__item-body {
        padding: calc(38 / 750 * 100vw) calc(31 / 750 * 100vw) calc(23 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-body {
        border-radius: 0 0 5px 5px;
    }
    .secProduct-price__item.--license .secProduct-price__item-body {
        padding: 53px 10px 0;
    }
    .secProduct-price__item.--option .secProduct-price__item-body {
        padding: 24px 20px 15px;
    }
}

.secProduct-price__item-subTitle {
    font-size: calc(24 / 1280 * 100vw);
    font-weight: 700;
    text-align: center;
}
.secProduct-price__item.--license .secProduct-price__item-subTitle {
    margin: 0 0 calc(40 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-subTitle {
        font-size: calc(36 / 750 * 100vw);
    }
    .secProduct-price__item.--license .secProduct-price__item-subTitle {
        margin: 0 0 calc(63 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-subTitle {
        font-size: 24px;
    }
    .secProduct-price__item.--license .secProduct-price__item-subTitle {
        margin: 0 0 40px;
    }
}

.secProduct-price__item-license {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(5 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-license {
        gap: calc(9 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-license {
        gap: 5px;
    }
}

.secProduct-price__item-license-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(120 / 1280 * 100vw);
    height: calc(60 / 1280 * 100vw);
    font-size: calc(18 / 1280 * 100vw);
    font-weight: 700;
    color: #fff;
    background-color: var(--ep-color-primary);
    border-radius: calc(5 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-license-item {
        width: calc(183 / 750 * 100vw);
        height: calc(91 / 750 * 100vw);
        font-size: calc(27 / 750 * 100vw);
        border-radius: calc(3 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-license-item {
        width: 120px;
        height: 60px;
        font-size: 18px;
        border-radius: 5px;
    }
}

.secProduct-price__item-license-or {
    font-size: calc(16 / 1280 * 100vw);
    font-weight: 700;
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-license-or {
        font-size: calc(24 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-license-or {
        font-size: 16px;
    }
}

@media screen and (max-width: 767px) {
    .secProduct-price__plus {
        width: calc(46 / 750 * 100vw);
    }
}

.secProduct-price__item-price-text {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: calc(8 / 1280 * 100vw);
    margin: calc(-12 / 1280 * 100vw) 0 0;
    color: var(--ep-color-primary);
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-price-text {
        gap: calc(12 / 750 * 100vw);
        margin: calc(-18 / 750 * 100vw) 0 0;
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-price-text {
        gap: 8px;
        margin: -12px 0 0;
    }
}

.secProduct-price__item-price-prefix {
    font-family: 'Oswald', sans-serif;
    font-size: calc(60 / 1280 * 100vw);
    letter-spacing: -.05em;
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-price-prefix {
        font-size: calc(90 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-price-prefix {
        font-size: 60px;
    }
}

.secProduct-price__item-price-body {
    font-family: 'Oswald', sans-serif;
    font-size: calc(80 / 1280 * 100vw);
    letter-spacing: -.05em;
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-price-body {
        font-size: calc(121 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-price-body {
        font-size: 80px;
    }
}

.secProduct-price__item-price-suffix {
    font-size: calc(36 / 1280 * 100vw);
    font-weight: 700;
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-price-suffix {
        font-size: calc(54 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-price-suffix {
        font-size: 36px;
    }
}

.secProduct-price__item-price-notice {
    display: flex;
    justify-content: center;
    align-items: center;
    height: calc(80 / 1280 * 100vw);
    font-size: calc(18 / 1280 * 100vw);
    text-align: center;
    line-height: calc(24 / 18 * 1em);
    background-color: #F3F3F3;
    border-radius: calc(3 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price__item-price-notice {
        height: calc(121 / 750 * 100vw);
        font-size: calc(26 / 750 * 100vw);
        line-height: calc(34 / 26 * 1em);
        border-radius: calc(3 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__item-price-notice {
        height: 80px;
        font-size: 18px;
        line-height: 24px;
        border-radius: 3px;
    }
}

.secProduct-price__item-price-notice .red {
    color: var(--ep-color-primary);
}

.secProduct-price__button-wrapper {
    display: flex;
    justify-content: center;;
    gap: calc(40 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price__button-wrapper {
        flex-direction: column;
        align-items: center;
        gap: calc(30 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__button-wrapper {
        gap: 40px;
    }
}

.secProduct-price__button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(420 / 1280 * 100vw);
    height: calc(60 / 1280 * 100vw);
    font-size: calc(20 / 1280 * 100vw);
    font-weight: 700;
    color: #fff;
    background-color: var(--ep-color-primary);
    background-image: url("../images/common/ico_arrow_right_white.svg");
    background-repeat: no-repeat;
    background-position: right calc(38 / 1280 * 100vw) center;
    background-size: calc(9 / 1280 * 100vw);
    border-radius: 100px;
}
.secProduct-price__button:hover {
    color: #fff;
}
@media screen and (max-width: 767px) {
    .secProduct-price__button {
        width: calc(670 / 750 * 100vw);
        height: calc(100 / 750 * 100vw);
        font-size: calc(32 / 750 * 100vw);
        background-position: right calc(40 / 750 * 100vw) center;
        background-size: calc(14 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__button {
        width: 420px;
        height: 60px;
        font-size: 20px;
        background-position: right 38px center;
        background-size: 9px;
    }
}

.secProduct-price__button.--price span {
    padding: 0 0 0 calc(32 / 1280 * 100vw);
    background-image: url("../images/product/m365/ico_yen.webp");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: calc(22 / 1280 * 100vw);
}
.secProduct-price__button.--estimate span {
    padding: 0 0 0 calc(24 / 1280 * 100vw);
    background-image: url("../images/product/m365/ico_calculator.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: calc(14 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secProduct-price__button.--price span, .secProduct-price__button.--estimate span {
        padding: 0 0 0 calc(46 / 750 * 100vw);
        background-size: calc(36 / 750 * 100vw);
    }
    .secProduct-price__button.--estimate span {
        padding: 0 0 0 calc(36 / 750 * 100vw);
        background-size: calc(26 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secProduct-price__button.--price span {
        padding: 0 0 0 32px;
        background-size: 22px;
    }
    .secProduct-price__button.--estimate span {
        padding: 0 0 0 24px;
        background-size: 14px;
    }
}

.secCta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(40 / 1280 * 100vw);
    height: calc(368 / 1280 * 100vw);
    background-color: #BF241B;
}
@media screen and (max-width: 767px) {
    .secCta {
        position: relative;
        display: block;
        height: auto;
        padding: calc(80 / 750 * 100vw) 0;
    }
}
@media screen and (min-width: 1280px), print {
    .secCta {
        gap: 40px;
        height: 368px;
    }
}

.secCta__img {
    width: calc(409 / 1280 * 100vw);
}
@media screen and (max-width: 767px) {
    .secCta__img {
        position: absolute;
        top: calc(396 / 750 * 100vw);
        left: 50%;
        transform: translateX(-50%);
        width: calc(670 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secCta__img {
        width: 409px;
    }
}

.secCta__inner {
}

.secCta__title {
    margin: 0 0 calc(24 / 1280 * 100vw);
    font-size: calc(32 / 1280 * 100vw);
    font-weight: 700;
    line-height: calc(48 / 32 * 1em);
    color: #fff;
}
@media screen and (max-width: 767px) {
    .secCta__title {
        margin: 0 0 calc(466 / 750 * 100vw);
        font-size: calc(48 / 750 * 100vw);
        text-align: center;
        line-height: calc(68 / 48 * 1em);
    }
}
@media screen and (min-width: 1280px), print {
    .secCta__title {
        margin: 0 0 24px;
        font-size: 32px;
        line-height: 48px;
    }
}

.secCta__button {
    display: block;
    width: calc(580 / 1280 * 100vw);
    padding: calc(11 / 1280 * 100vw) 0;
    color: #BF241B;
    background-color: #fff;
    background-image: url("../images/common/ico_arrow_right_red.svg");
    background-repeat: no-repeat;
    background-position: right calc(38 / 1280 * 100vw) center;
    background-size: calc(10 / 1280 * 100vw);
    border-radius: 100px;
    box-shadow: 0 0 calc(10 / 1280 * 100vw) 0 rgba(0, 0, 0, .08);
}
.secCta__button:hover {
    color: #BF241B;
}
@media screen and (max-width: 767px) {
    .secCta__button {
        width: calc(670 / 750 * 100vw);
        margin: 0 auto;
        padding: calc(18 / 750 * 100vw) 0;
        background-position: right calc(40 / 750 * 100vw) center;
        background-size: calc(14 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secCta__button {
        width: 580px;
        padding: 11px 0;
        background-position: right 38px center;
        background-size: 10px;
        box-shadow: 0 0 10px 0 rgba(0, 0, 0, .08);
    }
}

.secCta__button .secCta__button-text-small {
    display: block;
    font-size: calc(18 / 1280 * 100vw);
    text-align: center;
}
@media screen and (max-width: 767px) {
    .secCta__button .secCta__button-text-small {
        font-size: calc(28 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secCta__button .secCta__button-text-small {
        font-size: 18px;
    }
}

.secCta__button .secCta__button-text-large {
    display: block;
    margin: calc(-3 / 1280 * 100vw);
    font-size: calc(24 / 1280 * 100vw);
    font-weight: 700;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .secCta__button .secCta__button-text-large {
        margin: calc(-6 / 750 * 100vw);
        font-size: calc(36 / 750 * 100vw);
    }
}
@media screen and (min-width: 1280px), print {
    .secCta__button .secCta__button-text-large {
        margin: -3px;
        font-size: 24px;
    }
}