.sec-common {
    width: 100%;
    padding: 40px 0;
    background: white;

    & p {
        & a {
            color: #2d8cff;
            text-decoration: underline;
        }

        & strong {
            font-weight: bold;
        }

        & em {
            font-style: italic;
        }
    }

    &.sec-common-opt-bggray {
        background: #f7f9fc;
    }

    &.sec-common-opt-bgimage {
        background-size: cover;
        background-position: center;
    }

    & .sec-common-inner {
        width: 1000px;
        margin: 0 auto;

        & .sec-common-header {
            text-align: center;
            font-size: 36px;
            font-weight: bold;
            text-align: center;
            margin-bottom: 40px;

            & .sec-common-subtitle {
                display: block;
                color: #2d8cff;
                font-size: 18px;
                margin: 0 0 15px;
            }

            & .sec-common-title {}
        }

        &>p {
            line-height: 1.6;
            margin: 20px 0 0 0;
        }

        & .sec-common-emphasis {
            text-align: center;
            margin: 20px 0 0 0;

            & span {
                font-size: 22px;
                font-weight: 600;
                box-shadow: 0 -12px 0 #FFD200 inset;
                margin: 0 auto;
                line-height: 2.0;
            }
        }
    }

    &.sec-common-tree-cards {
        & .sec-common-tree-cards-grid {
            display: flex;
            justify-content: center;
            gap: 60px;

            & .sec-common-tree-cards-card {
                width: 100%;
                max-width: 300px;

                & .sec-common-tree-cards-card-image {
                    width: 100%;
                    aspect-ratio: 299 / 186;
                    margin: 0 0 46px;

                    & img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                }

                & .sec-common-tree-cards-card-title {
                    font-size: 2.4rem;
                    text-align: center;
                    margin-top: 46px;
                    font-weight: bold;
                    margin: 0 0 20px;
                    line-height: 1.6;
                }

                & .sec-common-tree-cards-card-text {
                    line-height: 1.6;
                }
            }
        }
    }

    &.sec-common-title-list-image {
        & .sec-common-title-list-image-grid {
            display: flex;
            justify-content: space-between;

            &.sec-common-title-list-image-grid-opt-reverse {
                flex-direction: row-reverse;
            }

            & .sec-common-title-list-image-thumb {
                width: calc(50% - 10px);
            }

            & .sec-common-title-list-image-body {
                width: calc(50% - 10px);

                & h2 {
                    font-size: 2.4rem;
                    font-weight: 700;
                    padding: 40px 0 30px;
                    line-height: 3rem;
                }

                & ul {
                    padding-left: 1em;
                    margin: 0;
                    padding: 0;

                    & li {
                        line-height: 1.6;
                        padding-bottom: 10px;

                        &::before {
                            color: #2d8cff;
                            display: inline-block;
                            font-family: "Material Icons";
                            font-style: normal;
                            font-weight: 400;
                            letter-spacing: normal;
                            white-space: nowrap;
                            text-decoration: none !important;
                            speak: none;
                            content: "\e86c";
                            vertical-align: top;
                            padding: 0 8px 0 0;
                        }

                        & p {
                            display: inline-block;
                        }
                    }
                }
            }
        }
    }

    &.sec-common-title-table-fixed-headers {
        & .sec-common-title-table-fixed-headers-table {
            width: 100%;
            border-collapse: collapse;
            table-layout: fixed;
            background: #ffffff;

            & tr {
                border-bottom: 1px solid #dddddd;
                text-align: left;

                &:nth-of-type(1) {
                    text-align: center;

                    & th {
                        &:nth-of-type(1) {
                            background: #ffffff;
                        }

                        &:nth-of-type(4n + 2) {
                            background: #dbebff;
                        }

                        &:nth-of-type(4n + 3) {
                            background: #daf4f4;
                        }

                        &:nth-of-type(4n + 4) {
                            background: #ffeed8;
                        }

                        &:nth-of-type(4n + 5) {
                            background: #ffdcd8;
                        }
                    }
                }
            }

            & th,
            & td {
                padding: 20px;
                line-height: 1.6;
            }

            & th {
                font-weight: 700;
            }

            & td {
                &:nth-of-type(4n + 1) {
                    background: #eff6ff;
                }

                &:nth-of-type(4n + 2) {
                    background: #eefafa;
                }

                &:nth-of-type(4n + 3) {
                    background: #fff7ed;
                }

                &:nth-of-type(4n + 4) {
                    background: #ffefed;
                }
            }
        }
    }

    &.sec-common-text-button-link {
        & .sec-common-text-button-link-box {
            width: 620px;
            background: #ffffff;
            margin: 0 auto;
            padding: 60px 20px;
            text-align: center;
            line-height: 1.6;

            & p {}

            & a.sec-common-text-button-link-box-button {
                line-height: 1;
                width: 296px;
                display: block;
                padding: 25px 0;
                color: #fff;
                font-size: 2rem;
                font-weight: bold;
                background-color: #fe9c1e;
                box-shadow: 0px 5px 10px 0px rgba(9, 0, 0, 0.3);
                border-radius: 6px;
                margin: 40px auto 0;
            }
        }
    }

    &.sec-common-title-iconlist-text {
        & .sec-common-title-iconlist-text-list {
            width: 944px;
            margin: 0 auto;

            & li {
                padding: 30px 0 26px;
                border-bottom: 1px solid #ccc;

                &:first-of-type {
                    border-top: 1px solid #ccc;
                }

                & .sec-common-title-iconlist-text-list-item-title {
                    display: flex;

                    & img {
                        width: 24px;
                        height: 22px;
                    }

                    & p {
                        line-height: 1.6;
                        padding: 0 0 0 10px;
                        font-size: 1.8rem;
                        font-weight: bold;
                        margin: 0 0 16px;
                    }
                }

                & .sec-common-title-iconlist-text-list-item-body {
                    & p {
                        padding: 0 0 0 34px;
                        line-height: 1.6;
                    }
                }
            }
        }
    }

    &.sec-common-two-text-button-cards {
        & .sec-common-two-text-button-cards-grid {
            display: flex;
            justify-content: center;
            gap: 20px;

            & .sec-common-two-text-button-cards-card {
                background: #ffffff;
                width: 490px;
                border-radius: 15px;
                padding: 78px 27px 55px;
                text-align: center;

                & h2 {
                    font-size: 3.5rem;
                    font-weight: bold;
                    text-align: center;
                }

                & p.sec-common-two-text-button-cards-card-text {
                    line-height: 1.5;
                    margin: 20px 0 0;
                }

                & a.sec-common-two-text-button-cards-card-button {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    width: 380px;
                    height: 96px;
                    line-height: 1;
                    border-radius: 20px;
                    color: #fff;
                    font-size: 2.4rem;
                    background-color: #2CBDBF;
                    margin: 48px auto 0;
                    border-radius: 12px;
                    box-shadow: 0 8px 6px rgba(0, 0, 0, 0.16);
                }
            }
        }
    }

    &.sec-common-text-button-cards {
        & .sec-common-text-button-cards-grid {
            display: flex;
            gap: 24px;

            & .sec-common-text-button-cards-grid-item {
                width: 232px;
                background: #ffffff;
                padding: 30px 10px 33px;
                border: solid 2px #1C7B9C;
                border-radius: 16px;
                color: #1C7B9C;
                text-align: center;

                & p {
                    &:nth-of-type(1) {
                        margin-bottom: 20px;
                        font-size: 16px;
                        font-weight: 400;
                        line-height: 1.5;
                    }

                    &:nth-of-type(2) {
                        margin-bottom: 30px;
                        font-size: 20px;
                        font-weight: bold;
                    }
                }

                & a {
                    display: inline-block;
                    position: relative;
                    font-size: 16px;
                    font-weight: 400;
                }
            }
        }
    }

    &.sec-common-triple-text-4 {
        & .sec-common-triple-text-4-grid {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;

            & .sec-common-triple-text-4-grid-item {
                width: 488px;
                background: #ffffff;
                border-radius: 16px;
                box-shadow: 0 0 8px rgba(58, 56, 77, 0.3);
                overflow: hidden;
                text-align: center;
                padding: 0 0 30px;

                & div {
                    &.sec-common-triple-text-4-grid-item-text1 {
                        padding: 40px 0 36px;
                        background: #008CFF;
                        color: #fff;
                        font-size: 26px;
                        font-weight: 600;
                        text-align: center;
                    }

                    &.sec-common-triple-text-4-grid-item-text2 {
                        margin-bottom: 11px;
                        font-weight: 500;
                        font-size: 34px;
                        text-align: center;
                        padding: 24px 0 5px;
                        color: #008CFF;
                    }

                    &.sec-common-triple-text-4-grid-item-text3 {
                        font-weight: 400;
                        font-size: 18px;
                        text-align: center;
                        color: #008CFF;
                    }
                    & p, & span {
                        font-size: inherit;
                    }
                }
            }
        }
    }

    &.sec-common-image-title-text-2 {
        & .sec-common-image-title-text-2-grid {
            display: flex;
            gap: 20px;
            justify-content: center;
            flex-wrap: wrap;

            & .sec-common-image-title-text-2-item {
                width: 480px;
                padding: 40px 30px 48px;
                background: #ffffff;

                & img {
                    padding: 0 0 25px;
                }

                & h2 {
                    margin-bottom: 18px;
                    font-size: 2.6rem;
                    font-weight: bold;
                    line-height: 1.5;
                }

                & p {
                    line-height: 1.6;
                }
            }
        }
    }

    &.sec-common-number-heading-text-image {
        & .sec-common-number-heading-text-image-grid {
            display: flex;
            gap: 40px;

            & .sec-common-number-heading-text-image-grid-body {
                width: 630px;
                padding: 67px 210px 40px 40px;
                background: #ffffff;

                & .sec-common-number-heading-text-image-grid-body-header {
                    display: flex;
                    align-items: center;
                    margin-bottom: 30px;

                    & .sec-common-number-heading-text-image-grid-body-header-number {
                        display: inline-block;
                        margin-right: 24px;
                        border: 2px solid #2D8CFF;
                        font-family: 'Roboto', sans-serif;
                        font-size: 4.2rem;
                        font-weight: normal;
                        line-height: 1.5;
                        text-align: center;
                        box-sizing: border-box;
                        color: #2D8CFF;
                        padding: 0 12px;
                    }

                    h3 {
                        display: flex;
                        align-items: center;
                        color: #2D8CFF;
                        font-size: 2.8rem;
                        font-weight: bold;
                        line-height: 1.3;
                    }
                }

                & .sec-common-number-heading-text-image-grid-body-text {
                    p {
                        margin-top: 1.6em;
                    }
                }
            }

            & .sec-common-number-heading-text-image-grid-thumb {
                flex: 1;
                position: relative;

                & img {
                    width: 540px;
                    position: absolute;
                    right: 0;
                    top: 40px;
                }
            }

            &.sec-common-number-heading-text-image-grid-opt-reverse {
                flex-direction: row-reverse;

                & .sec-common-number-heading-text-image-grid-body {
                    padding: 67px 40px 40px 210px;
                }

                & .sec-common-number-heading-text-image-grid-thumb {
                    & img {
                        left: 0;
                        right: auto;
                    }
                }
            }

        }
    }

    &.sec-common-text-image-simple {
        & p {
            margin: 0;
        }

        & img {
            margin: 40px 0 0 0;
        }
    }
}


@media screen and (max-width: 768px) {
    .sec-common {
        width: 100%;
        padding: 40px 0;

        & .sec-common-inner {
            width: 100%;
            padding: 0 30px;
            margin: 0 auto;

            & .sec-common-header {
                font-size: 21px;
                margin-bottom: 20px;

                & .sec-common-subtitle {
                    font-size: 12px;
                    margin: 0 0 10px;
                }

                & .sec-common-title {}
            }

            &>p {
                line-height: 1.6;
                margin: 20px 0 0 0;
            }

            & .sec-common-emphasis {
                margin: 20px 0 0 0;

                & span {
                    font-size: 16px;
                    line-height: 2.0;
                }
            }
        }

        &.sec-common-tree-cards {
            & .sec-common-tree-cards-grid {
                flex-wrap: wrap;
                gap: 60px;

                & .sec-common-tree-cards-card {
                    width: 100%;
                    max-width: none;

                    & .sec-common-tree-cards-card-image {
                        width: 100%;
                        margin: 0 0 46px;

                        & img {
                        }
                    }

                    & .sec-common-tree-cards-card-title {
                    }

                    & .sec-common-tree-cards-card-text {
                    }
                }
            }
        }

        &.sec-common-title-list-image {
            & .sec-common-title-list-image-grid {
                flex-wrap: wrap;

                &.sec-common-title-list-image-grid-opt-reverse {
                    flex-direction: row-reverse;
                }

                & .sec-common-title-list-image-thumb {
                    width: 100%;
                }

                & .sec-common-title-list-image-body {
                    width: 100%;

                    & h2 {
                        font-size: 2.4rem;
                        padding: 40px 0 30px;
                        line-height: 3rem;
                    }

                    & ul {
                        & li {
                            padding-bottom: 10px;

                            &::before {
                            }
                        }
                    }
                }
            }
        }

        &.sec-common-title-table-fixed-headers {
            & .sec-common-title-table-fixed-headers-table-wrapper {
                overflow: scroll;
            }
            & .sec-common-title-table-fixed-headers-table {
                width: auto;
                & tr {

                    &:nth-of-type(1) {

                        & th {
                            &:nth-of-type(1) {
                            }

                            &:nth-of-type(4n + 2) {
                            }

                            &:nth-of-type(4n + 3) {
                            }

                            &:nth-of-type(4n + 4) {
                            }

                            &:nth-of-type(4n + 5) {
                            }
                        }
                    }
                }

                & th,
                & td {
                    min-width: 150px;
                }

                & th {
                }

                & td {
                    &:nth-of-type(4n + 1) {
                    }

                    &:nth-of-type(4n + 2) {
                    }

                    &:nth-of-type(4n + 3) {
                    }

                    &:nth-of-type(4n + 4) {
                    }
                }
            }
        }

        &.sec-common-text-button-link {
            & .sec-common-text-button-link-box {
                width: 100%;
                padding: 60px 20px;

                & p {}

                & a {
                    width: 296px;
                    padding: 25px 0;
                    font-size: 2rem;
                    margin: 40px auto 0;
                }
            }
        }

        &.sec-common-title-iconlist-text {
            & .sec-common-title-iconlist-text-list {
                width: 100%;
                margin: 0 auto;

                & li {
                    padding: 30px 0 26px;

                    &:first-of-type {
                    }

                    & .sec-common-title-iconlist-text-list-item-title {

                        & img {
                            width: 24px;
                            height: 22px;
                        }

                        & p {
                            line-height: 1.6;
                            padding: 0 0 0 10px;
                            font-size: 1.8rem;
                            font-weight: bold;
                            margin: 0 0 16px;
                        }
                    }

                    & .sec-common-title-iconlist-text-list-item-body {
                        & p {
                            padding: 0 0 0 34px;
                            line-height: 1.6;
                        }
                    }
                }
            }
        }

        &.sec-common-two-text-button-cards {
            & .sec-common-two-text-button-cards-grid {
                flex-wrap: wrap;
                gap: 20px;

                & .sec-common-two-text-button-cards-card {
                    width: 100%;
                    border-radius: 15px;
                    padding: 40px 12px 25px;

                    & h2 {
                        font-size: 3.5rem;
                        font-weight: bold;
                        text-align: center;
                    }

                    & p {
                        line-height: 1.5;
                        margin: 20px 0 0;
                    }

                    & a.sec-common-two-text-button-cards-card-button {
                        width: auto;
                        height: 60px;
                        border-radius: 20px;
                        font-size: 2.4rem;
                        margin: 48px auto 0;
                        border-radius: 12px;
                        box-shadow: 0 8px 6px rgba(0, 0, 0, 0.16);
                    }
                }
            }
        }

        &.sec-common-text-button-cards {
            & .sec-common-text-button-cards-grid {
                gap: 24px;
                flex-wrap: wrap;

                & .sec-common-text-button-cards-grid-item {
                    width: 100%;
                    padding: 30px 10px 33px;
                    border-radius: 16px;
                    color: #1C7B9C;

                    & p {
                        &:nth-of-type(1) {
                            margin-bottom: 20px;
                            font-size: 16px;
                            font-weight: 400;
                            line-height: 1.5;
                        }

                        &:nth-of-type(2) {
                            margin-bottom: 30px;
                            font-size: 20px;
                            font-weight: bold;
                        }
                    }

                    & a {
                        display: inline-block;
                        position: relative;
                        font-size: 16px;
                        font-weight: 400;
                    }
                }
            }
        }

        &.sec-common-triple-text-4 {
            & .sec-common-triple-text-4-grid {
                gap: 20px;

                & .sec-common-triple-text-4-grid-item {
                    width: 100%;
                    border-radius: 16px;
                    padding: 0 0 30px;

                    & div {
                        &.sec-common-triple-text-4-grid-item-text1 {
                            padding: 40px 0 36px;
                            background: #008CFF;
                            color: #fff;
                            font-size: 26px;
                            font-weight: 600;
                            text-align: center;
                        }

                        &.sec-common-triple-text-4-grid-item-text2 {
                            margin-bottom: 11px;
                            font-weight: 500;
                            font-size: 34px;
                            text-align: center;
                            padding: 24px 0 5px;
                            color: #008CFF;
                        }

                        &.sec-common-triple-text-4-grid-item-text3 {
                            font-weight: 400;
                            font-size: 18px;
                            text-align: center;
                            color: #008CFF;
                        }
                    }

                }
            }
        }

        &.sec-common-image-title-text-2 {
            & .sec-common-image-title-text-2-grid {
                display: flex;
                gap: 20px;
                justify-content: center;
                flex-wrap: wrap;

                & .sec-common-image-title-text-2-item {
                    width: 100%;
                    padding: 40px 30px 48px;
                    background: #ffffff;

                    & img {
                        padding: 0 0 25px;
                    }

                    & h2 {
                        margin-bottom: 18px;
                        font-size: 2.6rem;
                        font-weight: bold;
                        line-height: 1.5;
                    }

                    & p {
                        line-height: 1.6;
                    }
                }
            }
        }

        &.sec-common-number-heading-text-image {
            & .sec-common-number-heading-text-image-grid {
                gap: 40px;
                flex-wrap: wrap;

                & .sec-common-number-heading-text-image-grid-body {
                    width: 100%;
                    padding: 0;
                    background: #ffffff;

                    & .sec-common-number-heading-text-image-grid-body-header {
                        display: flex;
                        align-items: center;
                        margin-bottom: 30px;

                        & .sec-common-number-heading-text-image-grid-body-header-number {
                            display: inline-block;
                            margin-right: 24px;
                            border: 2px solid #2D8CFF;
                            font-family: 'Roboto', sans-serif;
                            font-size: 4.2rem;
                            font-weight: normal;
                            line-height: 1.5;
                            text-align: center;
                            box-sizing: border-box;
                            color: #2D8CFF;
                            padding: 0 12px;
                        }

                        h3 {
                            display: flex;
                            align-items: center;
                            color: #2D8CFF;
                            font-size: 2.8rem;
                            font-weight: bold;
                            line-height: 1.3;
                        }
                    }

                    & .sec-common-number-heading-text-image-grid-body-text {
                        p {
                            margin-top: 1.6em;
                        }
                    }
                }

                & .sec-common-number-heading-text-image-grid-thumb {
                    flex: 1;
                    position: relative;

                    & img {
                        width: 100%;
                        position: relative;
                        right: 0;
                        top: 0;
                    }
                }

                &.sec-common-number-heading-text-image-grid-opt-reverse {
                    flex-direction: row-reverse;

                    & .sec-common-number-heading-text-image-grid-body {
                        padding: 0;
                    }

                    & .sec-common-number-heading-text-image-grid-thumb {
                        & img {
                            left: 0;
                            right: auto;
                        }
                    }
                }

            }
        }

        &.sec-common-text-image-simple {
            & p {
                margin: 0;
            }

            & img {
                margin: 40px 0 0 0;
            }
        }
    }

}