@charset "UTF-8";

/* =================================
   HOME COMMON
================================= */

body.home [id] {
    scroll-margin-top: 60px;
}


/* =================================
   MAIN VISUAL
================================= */
.renewal-mv {
    padding-left: max(30px, calc((100% - 1186px) / 2));
    width: stretch;
    display: flex;
}

.renewal-mv-left {
    width: 45%;
    max-width: calc(1186px * 0.45);
    flex-shrink: 0;
}

.renewal-mv-right {
    width: auto;
    flex: 1;
    min-width: 0;
}

.renewal-mv-copy-main {
    padding:85px 0 0 0;
    font-size:48px;
    font-weight:700;
    line-height:1.55;
    letter-spacing: 0.06em;
}

span.renewal-mv-highlight {
    font-size:56px;
    font-weight:700;
    color: #0fa36a;
}

.renewal-mv-copy-sub {
    margin:30px auto 0;
    font-size:18px;
    line-height:30px;
}

.renewal-mv-data {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 60px 0 0;
    width: 450px;
}

.renewal-mv-data-item {
    position: relative;
    width: 136px;
    height: 136px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #0fa36a;
    border-radius: 50%;
    color: #0fa36a;
    text-align: center;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 500;
    line-height: 25px;
    letter-spacing: -0.05em;
    aspect-ratio: 1 / 1;
}

.renewal-mv-data-main {
    font-weight: 700;
}

.renewal-mv-data-number {
    display: flex;
    align-items: baseline;
    justify-content: center;
    white-space: nowrap;
    transform: translateY(-10px);
}

.renewal-mv-data-large {
    margin: 0 3px;
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.05em;
}

.renewal-mv-data-patent {
    font-size: 26px;
    transform: translateY(-10px);
}

.renewal-mv-data-research {
    font-size: 22px;
    line-height: 25px;
    transform: translateY(-10px);
}

.renewal-mv-data-text {
    position: absolute;
    left: 0;
    bottom: 30px;
    width: stretch;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
}

.renewal-mv-arrow {
    width: 450px;
    margin-top: 30px;
    margin-bottom: 90px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.renewal-mv-arrow span {
    position: relative;
    width: 48px;
    height: 13.86px;
}

.renewal-mv-arrow span::before,
.renewal-mv-arrow span::after {
    content: "";
    position: absolute;
    top: 0;
    width: 27.5px;
    height: 1px;
    background-color: #0fa36a;
}

.renewal-mv-arrow span::before {
    left: 0;
    transform: rotate(30deg);
    transform-origin: left center;
}

.renewal-mv-arrow span::after {
    right: 0;
    transform: rotate(-30deg);
    transform-origin: right center;
}

.renewal-mv-right img {
    display: block;
    width: stretch;
    height: 100%;
    object-fit: cover;
    border-radius: 20px 0 0 0;
}

.renewal-mv-dot {
    margin: 0 -4px;
}



/* ==============================
   健腸ナビとは
============================== */
.renewal-about {
    position: relative;
    color: #fff;
    padding-left: max(30px, calc((100% - 1186px) / 2));
    padding-right: 0;
    background: #0FA36A;
}

.renewal-about-inner {
    position: relative;
    background: #0FA36A;
    padding: 55px 260px 55px max(30px, calc((100% - 1186px) / 2));
    width: calc(100vw - 15%);
    margin-left: -110px;
    display: flex;
    align-items: center;
    border-radius: 0 20px 20px 0;
    box-sizing: border-box;
    box-shadow: 5px 5px 5px -3px rgba(0, 0, 0, 0.08);
}

.renewal-about::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 20%;
    height: 100%;
    background: #faf8f5;
    z-index: 0;
}

.renewal-about-inner {
    z-index: 1;
}


/* タイトル */
.renewal-about-heading {
    width: 180px;
    flex-shrink: 0;
}

.renewal-about-heading h2 {
    margin: 0;
    color: #fff;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.08em;
}

span.renewal-about-small {
    font-size: 16px;
}


/* 本文 */
.renewal-about-text {
    flex: 1;
    margin: 0 0 0 30px;
    padding: 0 0 0 45px;
    border-left: 1px solid rgba(255, 255, 255, 0.6);
}

.renewal-about-text p {
    margin: 0;
    color: #fff;
    font-size: 17px;
    line-height: 1.8;
    letter-spacing: 0.04em;
    width: 100%;
    max-width: 750px;
}


/* 商品画像 */
.renewal-about-image {
    position: absolute;
    top: 110px;
    right: max(-70px, calc((100% - 1186px) / 2 - 100px));
    width: 330px;
    transform: translateY(-50%);
    z-index: 2;
}

.renewal-about-image img {
    display: block;
    width: stretch;
    height: auto;
}



/* =================================
   MOVIE
================================= */

.renewal-movie {
    position: relative;
    width: stretch;
    padding: 80px 9.5%;
    background-color: #FAF8F5;
    box-sizing: border-box;
}

.renewal-movie-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    box-sizing: border-box;
}

.renewal-movie-heading {
    position: relative;
    width: stretch;
}

.renewal-movie-title {
    margin: 0;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.5;
    color: #0fa36a;
}

.renewal-movie-en {
    position: absolute;
    top: 15px;
    right: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    color: #74cdb0;
}

.renewal-movie-video {
    margin: 0px auto;
    max-width: 700px;
}

.renewal-movie-youtube {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 20px;
    overflow: hidden;
}

.renewal-movie-thumbnail {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}

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

.renewal-movie-youtube iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}



/* =================================
   DIFFERENCE
   「腸活」ブームの検査と、健腸ナビは何が違うのか
================================= */

.renewal-difference {
    position: relative;
    width: stretch;
    padding: 95px 9.5% 80px;
    box-sizing: border-box;
    overflow: hidden;
}

.renewal-difference::after {
    content: "";
    position: absolute;
    top: 135px;
    right: calc((100% - 1440px) / 2 + 15px);
    width: 365px;
    height: 365px;
    background: url("/wp/wp-content/themes/kenchonavi/statics/images/renewal/home/bg_home_difference.png") no-repeat center / contain;
    pointer-events: none;
}

.renewal-difference-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
}


/* Heading
--------------------------------- */
.renewal-difference-heading {
    position: relative;
    z-index: 2;
}

.renewal-difference-title {
    margin: 0;
    color: #0fa36a;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}

.renewal-difference-lead {
    margin: 20px 0 0;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 0;
    max-width: 770px;
}

.renewal-difference-en {
    position: absolute;
    top: 50px;
    right: 0;
    color: #7CCEAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    font-family: "Roboto Condensed", sans-serif;
}


/* Comparison
--------------------------------- */
.renewal-difference-comparison {
    position: relative;
    z-index: 2;
    width: stretch;
    margin-top: 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 40px 0 55px;
}


/* Cards
--------------------------------- */
.renewal-difference-card {
    position: relative;
    box-sizing: border-box;
}


/* Old Card
--------------------------------- */
.renewal-difference-card-old {
    position: relative;
    width: 435px;
    min-height: 455px;
    padding: 35px 40px 35px;
    background-color: #fafafa;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    box-sizing: border-box;
    margin: 15px 0 0;
}

.renewal-difference-badge {
    position: absolute;
    left: -55px;
    top: -40px;
    width: 104px;
    height: 104px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #9E9E9E;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    box-sizing: border-box;
}

.renewal-difference-badge-top {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.renewal-difference-badge-bottom {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
}

.renewal-difference-card-title {
    margin: 0;
    color: #454545;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
}

.renewal-difference-list {
    margin: 15px 0 0;
    padding: 0;
    list-style: none;
}

.renewal-difference-list li {
    position: relative;
    padding: 20px 0 15px 18px;
    border-bottom: 1px dashed #A6A6A6;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
}

.renewal-difference-list li:last-child {
    border-bottom: unset;
}

.renewal-difference-list li::before {
    content: "●";
    position: absolute;
    top: 27px;
    left: 0;
    color: #454545;
    font-size: 9px;
}


/* Middle Arrow
--------------------------------- */
.renewal-difference-arrow {
    position: absolute;
    top: 270px;
    left: 490px;
    width: 145px;
    height: 155px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(
        90deg,
        #78D3B0 0%,
        #55C69A 55%,
        #0FA36A 100%
    );
    clip-path: polygon(
        0 5%,
        78% 5%,
        78% 0,
        100% 50%,
        78% 100%,
        78% 95%,
        0 95%
    );
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    box-sizing: border-box;
    transform: translateY(-50%);
    z-index: 5;
}

.renewal-difference-arrow::before,
.renewal-difference-arrow::after {
    content: none;
}

.renewal-difference-arrow span {
    position: relative;
    left: -5px;
}


/* Kencho Navi Card
--------------------------------- */
.renewal-difference-card-kenchonavi {
    position: relative;
    width: 515px;
    min-height: 455px;
    padding: 40px 35px 35px;
    background-color: #fff;
    background-clip: padding-box;
    border: 10px solid #e5f0e4;
    border-radius: 20px;
    box-sizing: border-box;
}


/* Result Badge
--------------------------------- */
.renewal-difference-badge-result {
    position: absolute;
    top: 15px;
    right: -50px;
    left: auto;
    width: 104px;
    height: 104px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #FA8900;
    border-radius: 50%;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    box-sizing: border-box;
    z-index: 2;
}

.renewal-difference-badge-result-bottom {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
}


/* Kencho Navi Title
--------------------------------- */
.renewal-difference-card-title-kenchonavi {
    margin: 0;
    color: #0FA36A;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
    text-align: center;
}


/* Kencho Navi List
--------------------------------- */
.renewal-difference-list-kenchonavi {
    margin: 25px 0 0;
    padding: 0;
    list-style: none;
}

.renewal-difference-list-kenchonavi li {
    position: relative;
    padding: 12px 0 12px 25px;
    border-bottom: 1px dashed #A6A6A6;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: 0.01em;
}

.renewal-difference-list-kenchonavi li:last-child {
    border-bottom: unset;
}

.renewal-difference-green {
    color: #0FA36A;
    font-weight: 700;
    letter-spacing: -0.03em;
}


/* Check Icon
--------------------------------- */
.renewal-difference-list-kenchonavi li::before {
    content: "";
    position: absolute;
    top: 16px;
    left: 0;
    width: 19px;
    height: 19px;
    background-color: #0FA36A;
    border-radius: 2px;
    box-sizing: border-box;
}
.renewal-difference-list-kenchonavi li::after {
    content: "";
    position: absolute;
    top: 19px;
    left: 4px;
    width: 11px;
    height: 8px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(-45deg);
    box-sizing: border-box;
}


/* Decoration
--------------------------------- */

.renewal-difference-decoration {
    position: absolute;
    top: 35px;
    right: 0;
    z-index: 1;
    pointer-events: none;
}



/* =================================
   MECHANISM
   なぜ、腸内細菌が病気に関わるのか
================================= */
.renewal-mechanism {
    position: relative;
    width: stretch;
    padding: 95px 9.5% 110px;
    background-color: #FAF8F5;
    border-radius: 0 200px 0 200px;
    box-sizing: border-box;
}
.renewal-mechanism-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}
.renewal-mechanism-heading {
    position: relative;
}
.renewal-mechanism-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}
.renewal-mechanism-lead {
    margin: 10px 0 0;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 0;
    max-width: 745px;
}
.renewal-mechanism-en {
    position: absolute;
    top: 55px;
    right: 0;
    color: #7CCEAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    font-family: "Roboto Condensed", sans-serif;
}


/* Cards
--------------------------------- */
.renewal-mechanism-cards {
    width: stretch;
    margin: 115px auto 0 55px;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 20px;
}


/* Card
--------------------------------- */
.renewal-mechanism-card {
    position: relative;
    width: 244px;
    height: auto;
    border-radius: 30px;
    box-sizing: border-box;
    padding:100px 20px 25px;
    letter-spacing: -0.03em;
    min-height: 286px;
}
.renewal-mechanism-card::after {
    content: "";
    position: absolute;
    top: 30px;
    right: -20px;
    width: 20px;
    height: calc(100% - 60px);
    clip-path: polygon(
        0 0,
        100% 50%,
        0 100%
    );
}

.renewal-mechanism-card:last-child::after {
    display: none;
}


/* Card Color
--------------------------------- */

.renewal-mechanism-card-01,
.renewal-mechanism-card-01::after {
    background-color: #E5F0E4;
}

.renewal-mechanism-card-02,
.renewal-mechanism-card-02::after {
    background-color: #EEF0DE;
}

.renewal-mechanism-card-03,
.renewal-mechanism-card-03::after {
    background-color: #F3E6D7;
}

.renewal-mechanism-card-04,
.renewal-mechanism-card-04::after {
    background-color: #FDE4E1;
}


/* Card Image
--------------------------------- */

.renewal-mechanism-card-image {
    position: absolute;
    top: -80px;
    left: 50%;
    width: 160px;
    height: 160px;
    transform: translateX(-50%);
    z-index: 2;
}

.renewal-mechanism-card-image img {
    display: block;
    width: stretch;
    height: auto;
}

.renewal-mechanism-card img {
    width: 160px;
}

.renewal-mechanism-card-title {
    margin: 0;
    width: stretch;
    font-size:17px;
    font-weight: 700;
    line-height: 1.5;
    text-align:center;
}

.renewal-mechanism-card-body {
    position: relative;
    width: stretch;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.renewal-mechanism-card-text {
    margin: 20px 0 0;
    width: stretch;
    color: #454545;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
    text-align: left;
    padding: 0px 10px;
}

.renewal-mechanism-conclusion {
    margin: 30px 0 0px;
    width: stretch;
}

.renewal-mechanism-conclusion-title {
    color:#0FA36A;
    font-size: 24px;
    font-weight: 700;
    text-align: center;
}

.renewal-mechanism-conclusion-text {
    margin: 10px 0 0;
    font-size: 17px;
    max-width:1040px;
    letter-spacing: -0.03em;
}



/* =================================
   SCIENCE
   すべては、高品質な菌叢データから健腸ナビを支える3つの科学的根拠
================================= */

.renewal-science {
    position: relative;
    width: stretch;
    padding: 95px 9.5% 90px;
    background-color: #fff;
    box-sizing: border-box;
}

.renewal-science-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-science-heading {
    position: relative;
}

.renewal-science-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}

.renewal-science-lead {
    margin: 10px 0 0;
    max-width: 770px;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 0;
}

.renewal-science-en {
    position: absolute;
    top: 55px;
    right: 0;
    color: #7CCEAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    font-family: "Roboto Condensed", sans-serif;
}


/* Science Item
--------------------------------- */

.renewal-science-item {
    width: stretch;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
}

.renewal-science-item-01 {
    margin-top: 60px;
    padding:0 60px;
}

.renewal-science-item-02,
.renewal-science-item-03 {
    margin-top: 25px;
    padding:0 60px;
}


/* Visual
--------------------------------- */

.renewal-science-visual {
    position: relative;
    width: 500px;
    flex-shrink: 0;
}

.renewal-science-visual img {
    display: block;
    width: stretch;
    height: auto;
}


/* Number
--------------------------------- */

.renewal-science-number {
    position: absolute;
    top: 0;
    left: 0;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border-radius: 15px;
    color: #fff;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
    z-index: 2;
}


/* Content
--------------------------------- */

.renewal-science-content {
    width: 500px;
    box-sizing: border-box;
    padding:10px 0 0;
}

.renewal-science-item-title {
    margin: 0;
    color: #0FA36A;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}

.renewal-science-item-text {
    margin: 25px 0 0;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.005em;
}

.renewal-science-visual img.renewal-science-image-pc {
    display: block;
}

.renewal-science-visual img.renewal-science-image-sp {
    display: none;
}



/* =================================
   EVIDENCE
   この検査から、わかること
================================= */

.renewal-evidence {
    position: relative;
    width: stretch;
    padding: 95px 9.5% 80px;
    background-color: #FAF8F5;
    border-radius: 0 200px 0 200px;
    box-sizing: border-box;
    overflow: hidden;
}

.renewal-evidence-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-evidence-heading {
    position: relative;
}

.renewal-evidence-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}

.renewal-evidence-lead {
    margin: 10px 0 0;
    max-width: 745px;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 0;
}

.renewal-evidence-en {
    position: absolute;
    top: 25px;
    right: 0;
    color: #7CCFAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    font-family: "Roboto Condensed", sans-serif;
}


/* Slider
--------------------------------- */

.renewal-evidence-slider-wrap {
    position: relative;
    width: stretch;
    margin-top: 40px;
}

.renewal-evidence-slider-viewport {
    max-width: 1186px;
    width: 100%;
    overflow: hidden;
}

.renewal-evidence-slider {
    display: flex;
    align-items: stretch;
    gap: 30px;
    width: max-content;
    transition: transform 0.5s ease;
    will-change: transform;
}


/* Card
--------------------------------- */

.renewal-evidence-card {
    position: relative;
    width: 320px;
    flex: 0 0 320px;
    border-radius: 20px;
    overflow: hidden;
    box-sizing: border-box;
}

.renewal-evidence-card-image {
    position: relative;
    width: stretch;
    overflow: hidden;
}

.renewal-evidence-card-image > img {
    display: block;
    width: stretch;
    height: auto;
}


/* Expand Button
--------------------------------- */

.renewal-evidence-modal-open {
    position: absolute;
    right: 15px;
    top: 175px;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    z-index: 2;
}

.renewal-evidence-modal-open img {
    display: block;
    width: stretch;
    height: auto;
}


/* Report Index
--------------------------------- */

.renewal-evidence-report {
    width: stretch;
    margin-top: 55px;
    padding: 25px 30px;
    background-color: #fff;
    border-radius: 20px;
    box-sizing: border-box;
}

.renewal-evidence-report-title {
    margin: 0;
    color: #0FA36A;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
}

.renewal-evidence-report-list {
    margin: 20px 0 0;
    padding: 0;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 15px;
    list-style: none;
    flex-wrap: wrap;
}

.renewal-evidence-report-list li {
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    list-style: none;
}

.renewal-evidence-report-list li a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
}

.renewal-evidence-report-list li a::after {
    content: "";
    position: absolute;
    left: 32px;
    bottom: -6px;
    width: calc(100% - 32px);
    height: 1px;
    background-color: #0FA36A;
    opacity: 0;
    transform: translateY(-5px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.renewal-evidence-report-list li a:hover::after {
    opacity: 1;
    transform: translateY(0);
}

.renewal-evidence-report-list li a span {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background-color: #0FA36A;
    border-radius: 50%;
    color: #fff;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}

/* Button
--------------------------------- */

.renewal-evidence-button {
    margin-top: 45px;
    text-align: center;
}

.renewal-evidence-button a {
    min-width: 400px;
    min-height: 70px;
    padding: 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border: 1px solid #0FA36A;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-evidence-button a:hover {
    background-color: #fff;
    color: #0FA36A;
}



/* =================================
   EVIDENCE MODAL
================================= */

.renewal-evidence-modal {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    box-sizing: border-box;
    z-index: 100000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.renewal-evidence-modal.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.renewal-evidence-modal-overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

.renewal-evidence-modal-content {
    position: relative;
    width: stretch;
    max-width: 1200px;
    max-height: calc(100vh - 80px);
    background-color: #fff;
    box-sizing: border-box;
    overflow: auto;
    z-index: 1;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    border-radius: 10px;
}

.renewal-evidence-modal.is-open .renewal-evidence-modal-content {
    opacity: 1;
    transform: translateY(0);
}

.renewal-evidence-modal-content picture {
    display: block;
    width: stretch;
}

.renewal-evidence-modal-content picture > img {
    display: block;
    width: stretch;
    height: auto;
}


/* Modal Close
--------------------------------- */

.renewal-evidence-modal-close {
    position: absolute;
    top: 25px;
    right: 25px;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    z-index: 2;
}

.renewal-evidence-modal-close img {
    display: block;
    width: stretch;
    height: auto;
}


/* Slider
--------------------------------- */
.renewal-evidence-slider-prev,
.renewal-evidence-slider-next {
    position: absolute;
    top: 50%;
    width: 48px;
    height: 70px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease;
}

.renewal-evidence-slider-prev:hover,
.renewal-evidence-slider-next:hover {
    background-color: rgba(16, 170, 112, 0.08);
}

.renewal-evidence-slider-prev {
    left: -47px;
}

.renewal-evidence-slider-next {
    right: -47px;
}

.renewal-evidence-slider-prev span,
.renewal-evidence-slider-next span {
    display: block;
    width: 13.86px;
    height: 48px;
    border: 0;
    position: relative;
    flex: 0 0 13.86px;
}

.renewal-evidence-slider-prev span::before,
.renewal-evidence-slider-prev span::after,
.renewal-evidence-slider-next span::before,
.renewal-evidence-slider-next span::after {
    content: "";
    position: absolute;
    left: 50%;
    width: 1px;
    height: 25px;
    background-color: #0FA36A;
}

.renewal-evidence-slider-prev span::before {
    top: -2px;
    transform: rotate(30deg);
    transform-origin: bottom center;
}

.renewal-evidence-slider-prev span::after {
    bottom: 0;
    transform: rotate(-30deg);
    transform-origin: top center;
}

.renewal-evidence-slider-next span::before {
    top: -2px;
    transform: rotate(-30deg);
    transform-origin: bottom center;
}

.renewal-evidence-slider-next span::after {
    bottom: 0;
    transform: rotate(30deg);
    transform-origin: top center;
}



/* =========================================================
   ANALYSIS MODAL
========================================================= */

.renewal-analysis-modal-content {
    width: min(1280px, calc(100% - 80px));
    height: min(780px, calc(100vh - 120px));
    max-height: none;
    padding: 45px 70px 35px;
    overflow: hidden;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

.renewal-analysis-scroll {
    flex: 1;
    min-height: 0;
    padding-right: 10px;
    overflow-y: auto;
    overflow-x: hidden;
}

.renewal-analysis-modal-title {
    margin: 0 0 30px;
    color: #0FA36A;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
}

.renewal-analysis-tables {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    width: stretch;
}

.renewal-analysis-table {
    width: calc(50% - 12px);
}

.renewal-analysis-table-title {
    width: stretch;
    padding: 7px 10px;
    box-sizing: border-box;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
}

.renewal-analysis-table-male .renewal-analysis-table-title {
    background-color: #BAE6F0;
}

.renewal-analysis-table-female .renewal-analysis-table-title {
    background-color: #F1C2BD;
}

.renewal-analysis-table table {
    width: stretch;
    table-layout: fixed;
    border-collapse: collapse;
}

.renewal-analysis-table th,
.renewal-analysis-table td {
    width: 50%;
    padding: 5px;
    box-sizing: border-box;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.35;
    text-align: left;
    vertical-align: middle;
}

.renewal-analysis-table th {
    background-color: #E4E4E4;
    font-weight: 700;
}

.renewal-analysis-table-male th,
.renewal-analysis-table-male td {
    border: 1px solid #BAE6F0;
}

.renewal-analysis-table-female th,
.renewal-analysis-table-female td {
    border: 1px solid #F1C2BD;
}

.renewal-analysis-modal-open {
    position: static;
    top: auto;
    right: auto;
    width: auto;
    min-width: 400px;
    height: auto;
    min-height: 70px;
    padding: 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border: 1px solid #0FA36A;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    box-sizing: border-box;
    cursor: pointer;
    z-index: auto;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-analysis-modal-open:hover {
    background-color: #fff;
    color: #0FA36A;
}

.renewal-analysis-modal-content {
    transform: translateY(30px);
}

.renewal-evidence-modal.is-open .renewal-analysis-modal-content {
    transform: translateY(30px);
}

@media screen and (max-height: 800px) {

    .renewal-analysis-modal-content,
    .renewal-evidence-modal.is-open .renewal-analysis-modal-content {
        transform: translateY(0);
    }

}


/* =================================
   RESEARCH
   大学・臨床研究機関との共同研究
================================= */

.renewal-research {
    position: relative;
    width: stretch;
    padding: 95px 9.5% 80px;
    background-color: #fff;
    box-sizing: border-box;
}

.renewal-research-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-research-heading {
    position: relative;
}

.renewal-research-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}

.renewal-research-lead {
    margin: 10px 0 0;
    max-width: 750px;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 0;
}

.renewal-research-en {
    position: absolute;
    top: 55px;
    right: 0;
    color: #7CCFAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    font-family: "Roboto Condensed", sans-serif;
}


/* Research List
--------------------------------- */

.renewal-research-list {
    width: stretch;
    margin-top: 35px;
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 20px;
}


/* Card
--------------------------------- */

.renewal-research-card {
    width: 240px;
    min-height: 280px;
    padding: 30px 20px 25px;
    background-color: #FAF8F5;
    border-radius: 20px;
    text-align: center;
    box-sizing: border-box;
}

.renewal-research-logo {
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.renewal-research-logo img {
    height: 100%;
}

.renewal-research-card-title {
    height: 55px;
    margin: 10px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #454545;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
}


.renewal-research-card-text {
    min-height: 72px;
    margin: 15px 0 0;
    color: #454545;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
}

.renewal-howto-note {
    margin-top: 25px;
    font-size: 12px;
    line-height: 1.7;
    color: #666;
    text-align:center;
}


/* Button
--------------------------------- */

.renewal-research-button {
    margin-top: 35px;
    text-align: center;
}

.renewal-research-button a {
    min-width: 400px;
    min-height: 70px;
    padding: 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border: 1px solid #0FA36A;
    border-radius: 10px;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-research-button a:hover {
    background-color: #fff;
    color: #0FA36A;
}



/* =================================
   HOW IT WORKS
   検査で終わらない。
   おすすめ食品をヒントに、健康づくりのサイクルへ
================================= */

.renewal-howto {
    position: relative;
    width: stretch;
    padding: 95px 9.5% 80px;
    background-color: #FAF8F5;
    border-radius: 0 200px 0 200px;
    box-sizing: border-box;
}

.renewal-howto-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-howto-heading {
    position: relative;
}

.renewal-howto-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}

.renewal-howto-card:nth-child(3) .renewal-howto-card-title {
    margin-top: 0px;
}

.renewal-howto-en {
    position: absolute;
    top: 55px;
    right: 0;
    color: #7CCFAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    font-family: "Roboto Condensed", sans-serif;
}


/* Steps
--------------------------------- */

.renewal-howto-list {
    margin: 40px auto 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}


/* Card
--------------------------------- */

.renewal-howto-card {
    width: 325px;
    min-height: 285px;
    padding: 15px 20px 25px;
    background-color: #fff;
    border-radius: 20px;
    text-align: center;
    box-sizing: border-box;
}


/* Step
--------------------------------- */

.renewal-howto-step {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: #0FA36A;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
}

.renewal-howto-step-bk {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: #666666;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
}

.renewal-howto-step-note {
    margin-left: 5px;
    font-size: 12px;
    font-weight: 600;
    color: #666666;
}

.renewal-howto-card:nth-child(3) .renewal-howto-step-bk {
    flex-wrap: wrap;
}

.renewal-howto-card:nth-child(3) .renewal-howto-step-note {
    flex-basis: 100%;
    margin: 5px 0 0;
    text-align: center;
}

.renewal-howto-step span {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
}

.renewal-howto-step-bk > span:not(.renewal-howto-step-note) {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #686868;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
}


/* Image
--------------------------------- */

.renewal-howto-image {
    height: 130px;
    margin-top: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.renewal-howto-image img {
    display: block;
    max-height: 120px;
    width: auto;
    height: auto;
}

.renewal-howto-card:nth-child(3) .renewal-howto-image {
    margin-top: -5px;
}


/* Text
--------------------------------- */

.renewal-howto-card-title {
    margin: 15px 0 0;
    color: #0FA36A;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
}

.renewal-howto-card-text {
    margin: 10px 0 0;
    color: #454545;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
    letter-spacing: -0.04em;
}


/* Conclusion
--------------------------------- */

.renewal-howto-conclusion {
    margin: 45px 0 0;
    color: #0FA36A;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    letter-spacing: -0.06em;
}



/* =================================
   AWARDS
   女性の健康への貢献が、
   評価されています
================================= */

.renewal-awards {
    position: relative;
    width: stretch;
    padding: 85px 9.5% 80px;
    background-color: #fff;
    box-sizing: border-box;
}

.renewal-awards-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-awards-heading {
    position: relative;
}

.renewal-awards-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}

.renewal-awards-lead {
    margin: 10px 0 0;
    max-width: 750px;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 2;
    letter-spacing: 0;
}

.renewal-awards-en {
    position: absolute;
    top: 55px;
    right: 0;
    color: #7CCFAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    font-family: "Roboto Condensed", sans-serif;
}


/* Awards List
--------------------------------- */

.renewal-awards-list {
    width: stretch;
    margin-top: 40px;
    display: flex;
    justify-content: center;
    gap: 20px;
}


/* Card
--------------------------------- */

.renewal-awards-card {
    width: 515px;
    min-height: 240px;
    padding: 40px;
    display: flex;
    align-items: flex-start;
    gap: 30px;
    background-color: #FAF8F5;
    border-radius: 20px;
    box-sizing: border-box;
}


/* Image
--------------------------------- */

.renewal-awards-image {
    width: 150px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.renewal-awards-image img {
    display: block;
    max-width: 160px;
    max-height: 160px;
    width: auto;
    height: auto;
}


/* Content
--------------------------------- */

.renewal-awards-content {
    flex: 1;
    min-width: 0;
}

.renewal-awards-year {
    margin: 0;
    color: #454545;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
}

.renewal-awards-card-title {
    margin: 12px 0 0;
    color: #454545;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
}

.renewal-awards-card-text {
    margin: 20px 0 0;
    color: #454545;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
}



/* =================================
   CASE
   導入事例・ご利用者の声
================================= */

.renewal-case {
    position: relative;
    width: stretch;
    padding: 85px 9.5% 80px;
    background-color: #FAF8F5;
    border-radius: 0 200px 0 200px;
    box-sizing: border-box;
}

.renewal-case-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-case-heading {
    position: relative;
    margin-bottom: 40px;
}

.renewal-case-section-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
}

.renewal-case-en {
    position: absolute;
    top: 55px;
    right: 0;
    color: #7CCFAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    font-family: "Roboto Condensed", sans-serif;
}


/* Case Item
--------------------------------- */

.renewal-case-item {
    width: stretch;
    margin-left: 30px;
    padding: 20px 30px 40px;
    background-color: #fff;
    border-radius: 20px;
    box-sizing: border-box;
}

.renewal-case-item + .renewal-case-item {
    margin-top: 40px;
}


/* Head
--------------------------------- */

.renewal-case-head {
    position: relative;
    left: -60px;
    width: calc(100% + 60px);
    display: flex;
    align-items: flex-start;
    gap: 35px;
}


/* Image
--------------------------------- */

.renewal-case-image {
    width: 560px;
    flex-shrink: 0;
    max-width: 560px
}

.renewal-case-image img {
    display: block;
    width: stretch;
    height: auto;
    border-radius: 15px;
}


/* Summary
--------------------------------- */

.renewal-case-summary {
    flex: 1;
    min-width: 0;
    padding-top: 15px;
    max-width: 520px;
    width: stretch;
}

.renewal-case-label {
    margin: 0;
    color: #0FA36A;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}

.renewal-case-label span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin-right: 5px;
    background-color: #0FA36A;
    border-radius: 50%;
    color: #fff;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
}

.renewal-case-title {
    margin: 5px 0 0;
    color: #454545;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
}


/* Points
--------------------------------- */

.renewal-case-points {
    margin-top: 25px;
    display: flex;
    gap: 20px;
    padding: 0 5px;
}

.renewal-case-point {
    padding: 10px 15px;
    border: 1px solid #0FA36A;
    border-radius: 8px;
    text-align: center;
    box-sizing: border-box;
    max-width: 50%;
    width: 175px;
}

.renewal-case-point strong {
    display: block;
    color: #0FA36A;
    font-weight: 700;
    line-height: 1;
    height: 28px;
}

.renewal-case-point-large {
    font-size: 28px;
}

.renewal-case-point-small {
    font-size: 24px;
    letter-spacing: -0.01em;
}

.renewal-case-point strong span {
    font-size: 16px;
    font-weight: 700;
}

.renewal-case-point p {
    margin: 5px 0 0;
    color: #0FA36A;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
}


/* Company
--------------------------------- */

.renewal-case-company {
    display: flex;
    margin-top: 25px;
    padding: 12px 10px 10px;
    display: flex;
    align-items: center;
    gap: 25px;
    border-top: 1px dashed #A6A6A6;
    border-bottom: 1px dashed #A6A6A6;
    color: #454545;
    font-size: 14px;
    font-weight: 700;
}

.renewal-case-company-logo {
    width: 105px;
    flex-shrink: 0;
}

.renewal-case-company-logo img {
    display: block;
    height: 40px;
    margin:0 auto;
}

.renewal-case-company-name {
    flex-shrink: 0;
    color: #454545;
    font-size: 20px;
    font-weight: 700;
}

.renewal-case-company-info {
    display: contents;
    align-items: center;
}

.renewal-case-company-detail {
    flex-shrink: 0;
    color: #454545;
    font-size: 12px;
    font-weight: 700;
}


/* Body
--------------------------------- */

.renewal-case-body {
    width: 800px;
    margin: 45px auto 0;
}

.renewal-case-text {
    margin: 0;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
}


/* Comment
--------------------------------- */

.renewal-case-comment {
    margin-top: 25px;
    padding: 20px 25px;
    background-color: #F2FAF2;
    border-radius: 10px;
    box-sizing: border-box;
    width: 100%;
}

.renewal-case-comment-title {
    margin: 0;
    color: #0FA36A;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
}

.renewal-case-comment-text {
    margin: 8px 0 0;
    color: #454545;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
}


/* Button
--------------------------------- */
.renewal-case-button a {
    min-width: 400px;
    min-height: 50px;
    padding: 22px 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border: 1px solid #0FA36A;
    border-radius: 6px;
    color: #0FA36A;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-case-button a:hover {
    background-color: #0FA36A;
    color: #fff;
}


/* User Voices
--------------------------------- */

.renewal-case-voices {
    width: stretch;
    margin: 45px auto 0;
}

.renewal-case-voices-title {
    margin: 0;
    color: #0FA36A;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
}

.renewal-case-voices-list {
    margin-top: 25px;
    display: flex;
    align-items: stretch;
    gap: 24px;
}

.renewal-case-voice {
    flex: 1;
    min-height: 235px;
    padding: 28px 25px 22px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: #F0F8F3;
    border-radius: 10px;
    box-sizing: border-box;
}

.renewal-case-voice p {
    margin: 0;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}

.renewal-case-voice span {
    display: block;
    margin-top: 10px;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    text-align: right;
}


/* Button
--------------------------------- */

.renewal-case-button {
    margin-top: 45px;
    text-align: center;
}

.renewal-case-button a {
    min-width: 400px;
    min-height: 70px;
    padding: 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border: 1px solid #0FA36A;
    border-radius: 10px;
    color: #0FA36A;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-case-button a:hover {
    background-color: #0FA36A;
    color: #fff;
}



/* =================================
   VOICES
   ご利用者さまの声
================================= */

.renewal-voices {
    position: relative;
    width: stretch;
    padding: 85px 9.5% 80px;
    background-color: #fff;
    box-sizing: border-box;
}

.renewal-voices-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-voices-heading {
    position: relative;
}

.renewal-voices-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
}

.renewal-voices-lead {
    margin: 15px 0 0;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
}

.renewal-voices-en {
    position: absolute;
    top: 55px;
    right: 0;
    color: #7CCFAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    font-family: "Roboto Condensed", sans-serif;
}


/* Voice List
--------------------------------- */

.renewal-voices-list {
    width: stretch;
    margin-top: 75px;
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 25px;
}


/* Card
--------------------------------- */

.renewal-voices-card {
    width: 375px;
    min-height: 355px;
    background-color: #fff;
    border: 1px solid #DCE9DE;
    border-radius: 10px;
    box-sizing: border-box;
}


/* Card Head
--------------------------------- */

.renewal-voices-card-head {
    position: relative;
    height: 130px;
    padding-top: 90px;
    background-color: #E5F0E4;
    border-radius: 10px 10px 0 0;
    text-align: center;
    box-sizing: border-box;
}

.renewal-voices-image {
    position: absolute;
    top: -40px;
    left: 50%;
    width: 120px;
    transform: translateX(-50%);
}

.renewal-voices-image img {
    display: block;
    width: stretch;
    height: auto;
}

.renewal-voices-profile {
    margin: 0;
    color: #454545;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}


/* Card Body
--------------------------------- */

.renewal-voices-card-body {
    padding: 30px 30px 25px;
    box-sizing: border-box;
}

.renewal-voices-text {
    margin: 0;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.9;
}


/* Button
--------------------------------- */

.renewal-voices-button {
    margin-top: 40px;
    text-align: center;
}

.renewal-voices-button a {
    min-width: 400px;
    min-height: 70px;
    padding: 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border: 1px solid #0FA36A;
    border-radius: 10px;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-case-voices-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.renewal-case-voices-title::before,
.renewal-case-voices-title::after {
    content: "";
    width: 2px;
    height: 22px;
    background-color: currentColor;
}

.renewal-case-voices-title::before {
    transform: rotate(-25deg);
}

.renewal-case-voices-title::after {
    transform: rotate(25deg);
}



/* =================================
   FAQ
   よくあるご質問
================================= */

.renewal-faq {
    position: relative;
    width: stretch;
    padding: 95px 9.5% 80px;
    background-color: #FAF8F5;
    border-radius: 0 200px 0 0;
    box-sizing: border-box;
}

.renewal-faq-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-faq-heading {
    position: relative;
}

.renewal-faq-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
}

.renewal-faq-lead {
    margin: 15px 0 0;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
}

.renewal-faq-en {
    position: absolute;
    top: 25px;
    right: 0;
    color: #7CCFAE;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    font-family: "Roboto Condensed", sans-serif;
}


/* Accordion Box
--------------------------------- */

.renewal-faq-box {
    width: stretch;
    margin-top: 40px;
    padding: 65px 85px;
    background-color: #fff;
    border-radius: 15px;
    box-sizing: border-box;
}


/* Item
--------------------------------- */

.renewal-faq-item {
    width: stretch;
    border-top: 1px solid #A6A6A6;
}

.renewal-faq-item:last-child {
    border-bottom: 1px solid #A6A6A6;
    padding: 10px 0;
}


/* Question
--------------------------------- */

.renewal-faq-question {
    position: relative;
    width: stretch;
    min-height: 85px;
    padding: 15px 55px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    cursor: pointer;
}

.renewal-faq-question-inner {
    display: flex;
    align-items: center;
    gap: 30px;
}

.renewal-faq-icon {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #0FA36A;
    border-radius: 50%;
    color: #0FA36A;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
}

.renewal-faq-question-text {
    margin: 0;
    color: #0FA36A;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.7;
}


/* FAQ Plus / Minus
--------------------------------- */

.renewal-faq-toggle {
    display: flex;
    position: relative;
    width: 13px;
    height: 13px;
    flex-shrink: 0;
    cursor: pointer;
}

.renewal-faq-toggle-icon {
    position: relative;
    width: 100%;
    height: 1px;
    margin: auto;
}

.renewal-faq-toggle-icon::before,
.renewal-faq-toggle-icon::after {
    content: "";
    position: absolute;
    display: block;
    width: 13px;
    height: 1px;
    background: #333333;
    transition: transform 0.25s ease-in-out;
}

.renewal-faq-toggle-icon::before {
    transform: rotate(90deg);
}

.renewal-faq-toggle-icon::after {
    transform: rotate(0deg);
}


/* OPEN */
.renewal-faq-toggle.toggled .renewal-faq-toggle-icon::before {
    transform: rotate(0deg);
}


/* Answer
--------------------------------- */

.renewal-faq-answer {
    display: none;
}

.renewal-faq-answer-inner {
    padding: 10px 55px 30px;
    display: flex;
    align-items: flex-start;
    gap: 30px;
    box-sizing: border-box;
}

.renewal-faq-icon-answer {
    background-color: #fff;
    color: #fa8900;
    border-color: #fa8900;
}

.renewal-faq-answer-text {
    margin: 7px 0 0;
    color: #454545;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
}


/* Button
--------------------------------- */

.renewal-faq-button {
    margin-top: 40px;
    text-align: center;
}

.renewal-faq-button a {
    min-width: 400px;
    min-height: 70px;
    padding: 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border: 1px solid #0FA36A;
    border-radius: 10px;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-faq-button a:hover {
    background-color: #fff;
    color: #0FA36A;
}



/* =================================
   CTA
   さあ、「腸活」から「健腸」へ。
================================= */

.renewal-cta {
    position: relative;
    width: stretch;
    background-color: #0FA36A;
    box-sizing: border-box;
    padding-left:9.5%;
}

.renewal-cta-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    min-height: 450px;
    margin: 0 auto;
    padding: 80px 0;
    box-sizing: border-box;
}


/* Content
--------------------------------- */

.renewal-cta-content {
    width: 58%;
}

.renewal-cta-title {
    margin: 0;
    color: #fff;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
}

.renewal-cta-text {
    max-width: 640px;
    margin: 25px 0 0;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
}


/* Button
--------------------------------- */

.renewal-cta-button {
    margin-top: 40px;
}

.renewal-cta-button a {
    width: 400px;
    min-height: 70px;
    padding: 0 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #FF8700;
    border: 1px solid #FF8700;
    border-radius: 7px;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-cta-button a:hover {
    background-color: #fff;
    color: #FF8700;
}


/* Images
--------------------------------- */

.renewal-cta-images {
    position: absolute;
    top: 0;
    right: 0;
    width: 400px;
    height: 100%;
}

.renewal-cta-image {
    position: absolute;
    overflow: hidden;
    border-radius: 10px;
}

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


/* 上側の人物写真 */

.renewal-cta-image-01 {
    top: -22px;
    right: 0;
    width: 300px;
    height: 240px;
}


/* 下側の検査キット */

.renewal-cta-image-02 {
    right: 140px;
    bottom: 30px;
    width: 300px;
    height: 240px;
}



/* =================================
   NEWS
   お知らせ
================================= */

.renewal-news {
    position: relative;
    width: stretch;
    padding: 80px 9.5%;
    background-color: #F0F8F3;
    box-sizing: border-box;
}

.renewal-news-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
    gap: 55px;
}


/* Heading
--------------------------------- */

.renewal-news-heading {
    width: 160px;
    flex-shrink: 0;
    box-sizing: border-box;
}

.renewal-news-list {
    flex: 1;
    min-width: 0;
    padding-left: 50px;
    border-left: 1px solid #cccccc;
    box-sizing: border-box;
}

.renewal-news-heading-main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.renewal-news-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.4;
}

.renewal-news-en {
    margin-top: 15px;
    color: #7CCFAE;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
}


/* List
--------------------------------- */

.renewal-news-list {
    flex: 1;
    min-width: 0;
}


/* Item
--------------------------------- */

.renewal-news-item {
    width: stretch;
    min-height: 55px;
    display: flex;
    align-items: center;
    gap: 35px;
    border-bottom: 1.5px dotted #cccccc;
    box-sizing: border-box;
    padding: 10px 0;
}

.renewal-news-item:first-child {
    padding: 0px 0 10px;
}

.renewal-news-date {
    width: 85px;
    flex-shrink: 0;
    color: #454545;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
}

.renewal-news-item-title {
    flex: 1;
    min-width: 0;
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
}

.renewal-news-item-title a {
    color: #454545;
    text-decoration: none;
    transition: color 0.3s ease;
}

.renewal-news-item-title a:hover {
    color: #0FA36A;
}

.renewal-news-item a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    overflow: visible;
    letter-spacing: -0.03em;
}

.renewal-news-item a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 2px;
    width: 100%;
    height: 1px;
    background-color: currentColor;
    transform: scaleX(0);
    transform-origin: center;
}

.renewal-news-item a:hover {
    color: #454545;
}

.renewal-news-item a:hover::after {
    bottom: -6px;
    transform: scaleX(1);
    transition: bottom 0.3s ease;
}


/* More
--------------------------------- */

.renewal-news-more {
    margin-top: 25px;
    text-align: right;
}

.renewal-news-more a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #454545;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    text-decoration: none;
    transition: color 0.3s ease;
}

.renewal-news-more a:hover {
    color: #0FA36A;
}

.renewal-news-more-arrow {
    width: 7px;
    height: 7px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
    transform: rotate(45deg);
}



/* =================================
   COLUMN
   健腸コラム
================================= */

.renewal-column {
    position: relative;
    width: stretch;
    padding: 80px 9.5% 90px;
    background-color: #fff;
    box-sizing: border-box;
    overflow: hidden;
}

.renewal-column-inner {
    position: relative;
    width: stretch;
    max-width: 1186px;
    margin: 0 auto;
    padding: 0;
}


/* Heading
--------------------------------- */

.renewal-column-heading {
    position: relative;
}

.renewal-column-title {
    margin: 0;
    color: #0FA36A;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.5;
}

.renewal-column-en {
    position: absolute;
    top: 25px;
    right: 0;
    color: #7CCFAE;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
}


/* Main
--------------------------------- */

.renewal-column-main {
    width: stretch;
    margin-top: 35px;
    display: flex;
    align-items: flex-start;
    gap: 35px;
}


/* Left Content
--------------------------------- */

.renewal-column-content {
    width: 325px;
    flex-shrink: 0;
}

.renewal-column-article-title {
    margin: 0;
    color: #454545;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.6;
}

.renewal-column-meta {
    margin-top: 15px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.renewal-column-tag {
    min-width: 70px;
    padding: 5px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border-radius: 20px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    box-sizing: border-box;
}

.renewal-column-date {
    color: #454545;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
}

.renewal-column-text {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    margin-top: 20px;
}

.renewal-column-content-item {
    display: none;
}

.renewal-column-content-item.is-active {
    display: block;
    animation: renewalColumnFade 1.2s ease forwards;
}

@keyframes renewalColumnFade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}


/* Slider
--------------------------------- */

.renewal-column-slider-wrap {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.renewal-column-slider {
    display: flex;
    align-items: flex-end;
    gap: 45px;
    width: max-content;
    transition: transform 0.8s ease;
    will-change: transform;
}

.renewal-column-slide {
    width: 320px;
    flex: 0 0 320px;
}

.renewal-column-slide.is-active {
    width: 370px;
    flex: 0 0 370px;
}

.renewal-column-slide.is-active .renewal-column-slide-image {
    height: 270px;
}

.renewal-column-slide-link {
    display: block;
    width: stretch;
    color: inherit;
    text-decoration: none;
}

.renewal-column-slide-image {
    position: relative;
    width: stretch;
    height: 210px;
    overflow: hidden;
    border-radius: 10px;
}

.renewal-column-slide-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

@media screen and (min-width: 769px) {
    .renewal-column-slide-link:hover .renewal-column-slide-image img {
        transform: scale(1.08) rotate(2deg);
    }
}

.renewal-column-slide-image::before {
    content: "もっと読みたい";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    padding: 10px 30px;
    border: 1px solid #fff;
    border-radius: 12px;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.renewal-column-slide-image::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: opacity 0.3s ease;
}

@media screen and (min-width: 769px) {
    .renewal-column-slide-link:hover .renewal-column-slide-image::before,
    .renewal-column-slide-link:hover .renewal-column-slide-image::after {
        opacity: 1;
    }
}


/* Dots
--------------------------------- */

.renewal-column-dots {
    width: 450px;
    margin-top: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.renewal-column-dot {
    width: 15px;
    height: 15px;
    margin: 0;
    padding: 0;
    background-color: #fff;
    border: 1px solid #CCCCCC;
    border-radius: 50%;
    box-sizing: border-box;
    cursor: pointer;
}

.renewal-column-dot.is-active {
    background-color: #0FA36A;
    border-color: #0FA36A;
}


/* Button
--------------------------------- */

.renewal-column-button {
    width: 400px;
    margin: 35px auto 0;
    text-align: center;
}

.renewal-column-button a {
    min-width: 400px;
    min-height: 70px;
    padding: 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0FA36A;
    border: 1px solid #0FA36A;
    border-radius: 10px;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.renewal-column-button a:hover {
    background-color: #fff;
    color: #0FA36A;
}


/* Banners
--------------------------------- */

.renewal-column-banners {
    width: 600px;
    margin: 75px auto 0;
    display: flex;
    flex-direction: column;
    gap: 35px;
}

.renewal-column-banners a {
    display: block;
    transition: opacity 0.3s ease;
}

.renewal-column-banners a:hover {
    opacity: 0.75;
}

.renewal-column-banners img {
    display: block;
    width: stretch;
    height: auto;
}





/* =========================================================
   SP / 390px BASE
========================================================= */

@media screen and (max-width: 769px) {
    /* =================================
       MAIN VISUAL
    ================================= */

    .renewal-mv {
        padding-left: 0;
        width: 100%;
        display: flex;
        flex-direction: column;
        position: relative;
    }

    .renewal-mv-right {
        order: 1;
        width: calc(100% - 32px);
        margin-left: 32px;
    }

    .renewal-mv-left {
        order: 2;
        width: 100%;
        max-width: none;
        padding: 0 32px 60px;
        box-sizing: border-box;
    }

    .renewal-mv-right img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 20px 0 0 20px;
        max-height: 300px;
    }

    h1.renewal-mv-copy-main {
        padding: 15px 0 0;
        font-size: 24px;
        line-height: 1.45;
    }

    span.renewal-mv-highlight {
        font-size: 32px;
    }

    p.renewal-mv-copy-sub {
        margin: 15px auto 0;
        font-size: 14px;
        line-height: 1.45;
    }

    .renewal-mv-data {
        width: auto;
        margin: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 5px;
        position: absolute;
        right: 30px;
        bottom: 65px;
    }

    .renewal-mv-data-item {
        width: 80px;
        height: 80px;
        background:#ffffff;
        font-size: 9px;
        padding-top: 10px;
    }

    .renewal-mv-data-large {
        font-size: 22px;
    }

    .renewal-mv-data-patent {
        font-size: 16px;
    }

    .renewal-mv-data-text {
        position: absolute;
        left: 0;
        bottom: 20px;
        width: 100%;
        font-size: 9px;
        font-weight: 600;
        line-height: 0.5;
        text-align: center;
    }

    .renewal-mv-data-research {
        font-size: 14px;
        line-height: 16px;
    }

    .renewal-mv-arrow {
        display:none;
    }

    .renewal-mv-data-item:nth-child(3) .renewal-mv-data-text {
        bottom: 15px;
    }

    .renewal-mv-dot {
        margin: 0 -4px;
    }

/* =================================
   健腸ナビとは SP
================================= */

    .renewal-about {
        padding: 55px 32px 55px;
        position: relative;
        z-index: 10;
        box-shadow: 0 5px 5px rgba(0, 0, 0, 0.08);

    }

    .renewal-about::after {
        background: #0FA36A;

    }

    .renewal-about-inner {
        position: relative;
        display: block;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        border-radius: 0;
        box-sizing: border-box;
        box-shadow: unset;
    }

    .renewal-about-heading {
        width: auto;
        margin: 0 0 30px;
    }

    .renewal-about-heading h2 {
        font-size: 24px;
        font-weight: 600;
        line-height: 1.2;
    }

    span.renewal-about-small {
        font-weight: 500;
    }

    .renewal-about-text {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        border-left: 0;
    }



    .renewal-about-text p {
        margin: 0;
        font-size: 14px;
        line-height: 1.6;
        letter-spacing: 0.02em;
    }

    .renewal-about-image {
        top: 5px;
        right: -10px;
        width: 57%;
        max-width:190px;
    }


}



/* =================================
   DIFFERENCE SP
   「腸活」ブームの検査と、
   健腸ナビは何が違うのか
================================= */

@media screen and (max-width: 769px) {

    .renewal-difference {
    padding: 55px 33.5px 50px;
    }

    .renewal-difference-inner {
    width: 100%;
    margin: 0px;
    }


    /* Heading */

    .renewal-difference-heading {
    margin-bottom: 20px;
    }

    .renewal-difference-title {
    font-size: 24px;
    line-height: 1.55;
    text-align: center;
    }

    .renewal-difference-en {
        position: static;
        display: block;
        margin-top: 10px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
        transform: none;
    }

    .renewal-difference-lead {
    margin-top: 30px;
    font-size: 14px;
    line-height: 1.6;
    }

    .renewal-difference-lead br {
    display: none;
    }


    /* Comparison */

    .renewal-difference-comparison {
    width: 100%;
    margin-top: 28px;
    flex-direction: column;
    padding: 0;
    }


    /* Old card */

    .renewal-difference-card-old {
    padding: 25px 20px 14px;
    border-radius: 9px;
    width: calc(100% + 20px);
    min-height: 100%;
    margin: 0;
    }

    .renewal-difference-card-title {
    margin-bottom: 5px;
    padding-left: 25px;
    font-size: 16px;
    line-height: 1.55;
    }


    /* Gray badge */

    .renewal-difference-badge {
    top: -9px;
    left: -13px;
    width: 85px;
    height: 85px;
    }

    .renewal-difference-badge-top {
    font-size: 16px;
    line-height: 1.15;
    }

    .renewal-difference-badge-bottom {
    margin-top: 2px;
    font-size: 12px;
    }


    /* Old list */

    .renewal-difference-list {
    padding-left: 2px;
    }

    .renewal-difference-list li {
    padding: 9px 0 9px 20px;
    font-size: 14px;
    line-height: 1.5;
    }

    .renewal-difference-list li::before {
    top: 15px;
    left: 1px;
    width: 8px;
    height: 8px;
    }


    /* Arrow */

    .renewal-difference-arrow {
        position: relative;
        left: 0;
        top: 40px;
        z-index: 3;
        width: 182px;
        height: 80px;
        margin: 0 auto -25px;
        background: linear-gradient(
            180deg,
            #65d1ad 0%,
            #18b77b 55%,
            #0fa36a 100%
        );
        clip-path: polygon(
            6% 0,
            94% 0,
            94% 60%,
            100% 60%,
            50% 100%,
            0 60%,
            6% 60%
        );
    }

    .renewal-difference-arrow::after {
    position: absolute;
    bottom: -12px;
    left: 0;
    width: 0;
    height: 0;
    border-top: 12px solid #18b77b;
    border-right: 65px solid transparent;
    border-left: 65px solid transparent;
    content: none;
    }

    .renewal-difference-arrow span {
        display: block;
        padding-top: 10px;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
        top: -15px;
    }


    /* Kencho Navi card */

    .renewal-difference-card-kenchonavi {
    padding: 20px 15px 14px;
    border-width: 10px;
    border-radius: 20px;
    width: calc(100% + 20px);
    position: relative;
    z-index: 1;
    margin-top: 0px;
    min-height: 0;
    }

    .renewal-difference-card-title-kenchonavi {
    margin-bottom: 8px;
    font-size: 16px;
    line-height: 1.5;
    }


    /* Orange badge */

    .renewal-difference-badge-result {
    top: -40px;
    right: -24px;
    left: auto;
    width: 85px;
    height: 85px;
    font-size: 16px;
    line-height: 1.2;
    }

    .renewal-difference-badge-result-bottom {
    margin-top: 2px;
    font-size: 12px;
    }


    /* Kencho Navi list */

    .renewal-difference-list-kenchonavi {
    margin: 5px 0 0;
    }

    .renewal-difference-list-kenchonavi li {
    padding: 9px 0 7px 25px;
    font-size: 14px;
    line-height: 1.5;
    }

    .renewal-difference-list-kenchonavi li::before {
    top: 13px;
    width: 16px;
    height: 16px;
    }

    .renewal-difference-list-kenchonavi li::after {
    top: 16px;
    left: 3px;
    width: 10px;
    height: 6px;
    border-bottom-width: 1.5px;
    border-left-width: 1.5px;
    border-bottom: 2px solid #fff;
    border-left: 2px solid #fff;
    }

}



/* =================================
   MECHANISM SP
   なぜ、腸内細菌が病気に関わるのか
================================= */

@media screen and (max-width: 769px) {

    .renewal-mechanism {
        padding: 65px 32px 55px;
        border-radius: 0 48px 0 48px;
    }

    .renewal-mechanism-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-mechanism-heading {
        position: relative;
    }

    .renewal-mechanism-title {
        font-size: 24px;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-mechanism-lead {
        margin-top: 55px;
        font-size: 14px;
        line-height: 1.5;
    }

    .renewal-mechanism-en {
        top: 85px;
        right: auto;
        left: 50%;
        font-size: 10px;
        transform: translateX(-50%);
    }


    /* Cards
    --------------------------------- */

    .renewal-mechanism-cards {
        width: 100%;
        margin: 35px 0 0 0;
        display: block;
    }

    .renewal-mechanism-card {
        position: relative;
        display: flex;
        width: 100%;
        min-height: 145px;
        height: auto;
        margin: 0 0 11px;
        padding: 20px 15px;
        align-items: center;
        gap: 15px;
        border-radius: 10px;
        box-sizing: border-box;
        letter-spacing: 0;
    }

    .renewal-mechanism-card:last-child {
        margin-bottom: 0;
    }


    /* カード下部の矢印
    --------------------------------- */

    .renewal-mechanism-card::after {
        content: "";
        position: absolute;
        top: auto;
        right: 0;
        bottom: -11px;
        left: 0;
        width: auto;
        height: 12px;
        transform: none;
        clip-path: polygon(
            0 0,
            100% 0,
            50% 100%
        );
    }


    /* Card image
    --------------------------------- */

    .renewal-mechanism-card-image {
        position: static;
        width: 110px;
        height: auto;
        flex-shrink: 0;
        transform: none;
    }

    .renewal-mechanism-card-image img,
    .renewal-mechanism-card img {
        display: block;
        width: 110px;
        height: auto;
    }


    /* Card body
    --------------------------------- */

    .renewal-mechanism-card-body {
        position: static;
        width: auto;
        height: auto;
        padding: 0;
        display: block;
        flex: 1;
        min-width: 0;
        box-sizing: border-box;
    }

    .renewal-mechanism-card-title {
        width: 100%;
        margin: 0;
        color: #454545;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.55;
        text-align: left;
    }

    .renewal-mechanism-card-title br {
        display: none;
    }

    .renewal-mechanism-card-text {
        width: 100%;
        margin: 5px 0 0;
        padding: 0;
        color: #454545;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.5;
        text-align: left;
    }



    /* Conclusion
    --------------------------------- */

    .renewal-mechanism-conclusion {
        margin-top: 30px;
    }

    .renewal-mechanism-conclusion-title {
        font-size: 16px;
        line-height: 1.65;
        text-align: center;
    }

    .renewal-mechanism-conclusion-text {
        margin-top: 15px;
        font-size: 14px;
        line-height: 1.5;
    }

}


/* ========================================
   SCIENCE SP
   すべては、高品質な菌叢データから
   「健腸ナビ®」を支える3つの科学的根拠
======================================== */

@media screen and (max-width: 769px) {

    .renewal-science {
        padding: 45px 32px 55px;
    }

    .renewal-science-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-science-heading {
        position: relative;
        margin-bottom: 20px;
    }

    .renewal-science-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-science-en {
    top: 160px;
    right: auto;
    left: 50%;
    width: max-content;
    margin-top: 0;
    font-size: 10px;
    white-space: nowrap;
    transform: translateX(-50%);
    }

    .renewal-science-lead {
        margin: 45px 0 0;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.75;
        text-align: left;
    }


    /* Science item
    --------------------------------- */

    .renewal-science-item {
        position: relative;
        display: flex;
        width: 100%;
        margin-top: 0px;
        padding: 0;
        flex-direction: column;
        gap: 10px;
    }


    /* SPでは01・02・03すべて
       タイトル → 画像 → 本文の順にする */

    .renewal-science-item .renewal-science-content {
        display: contents;
    }

    .renewal-science-item-title {
        position: relative;
        order: 1;
        min-height: 52px;
        margin: 0 0 0px;
        padding: 5px 0 0 70px;
        color: #0fa36a;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.45;
        text-align: left;
    }

    .renewal-science-visual {
        order: 2;
        width: 100%;
        margin: 0 0 10px;
    }

    .renewal-science-visual img {
        display: block;
        width: 100%;
        height: auto;
    }

    .renewal-science-item-text {
        order: 3;
        margin: 0;
        color: #454545;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.5;
        text-align: left;
    }


    /* Number
    --------------------------------- */

    .renewal-science-item-title::before {
        position: absolute;
        top: 0;
        left: 0;
        display: flex;
        width: 56px;
        height: 56px;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background-color: #0fa36a;
        color: #fff;
        font-size: 20px;
        font-weight: 700;
        line-height: 1;
    }

    .renewal-science-item-01 .renewal-science-item-title::before {
        content: "01";
        font-family: "Roboto Condensed", sans-serif;
        font-weight: 100;
        -webkit-text-stroke: 0.3px #fff;
        color: #fff;
        letter-spacing: 0.05em;
    }

    .renewal-science-item-02 .renewal-science-item-title::before {
        content: "02";
        font-family: "Roboto Condensed", sans-serif;
        font-weight: 100;
        -webkit-text-stroke: 0.3px #fff;
        color: #fff;
        letter-spacing: 0.05em;
    }

    .renewal-science-item-03 .renewal-science-item-title::before {
        content: "03";
        font-family: "Roboto Condensed", sans-serif;
        font-weight: 100;
        -webkit-text-stroke: 0.3px #fff;
        color: #fff;
        letter-spacing: 0.05em;
    }


    /* 02 / 03
    --------------------------------- */

    .renewal-science-item-02,
    .renewal-science-item-03 {
        margin-top: 30px;
    }

    .renewal-science-visual img.renewal-science-image-pc {
        display: none;
    }

    .renewal-science-visual img.renewal-science-image-sp {
        display: block;
    }

}


/* ========================================
   EVIDENCE SP
   この検査から、わかること
======================================== */

@media screen and (max-width: 769px) {

    .renewal-evidence {
        padding: 55px 32px 55px;
        border-radius: 0 48px 0 48px;
    }

    .renewal-evidence-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-evidence-heading {
        position: relative;
        margin-bottom: 35px;
    }

    .renewal-evidence-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-evidence-en {
        position: static;
        display: block;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
        transform: none;
    }

    .renewal-evidence-lead {
        margin: 35px 0 0;
        color: #454545;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.75;
        text-align: left;
    }


    /* Slider
    --------------------------------- */

    .renewal-evidence-slider-wrap {
        position: relative;
        width: 100%;
        margin-top: 35px;
    }

    .renewal-evidence-slider-viewport {
        width: 100%;
        overflow: hidden;
        border-radius: 18px;
    }

    .renewal-evidence-slider-prev:hover,
    .renewal-evidence-slider-next:hover {
        background-color: unset;
    }

    .renewal-evidence-slider {
        display: flex;
        width: 100%;
        transition: transform .4s ease;
    }

    .renewal-evidence-card {
        width: 100%;
        min-width: 100%;
        margin: 0;
        flex-shrink: 0;
        border-radius: 18px;
        overflow: hidden;
    }

    .renewal-evidence-card-image {
        position: relative;
        width: 100%;
    }

    .renewal-evidence-card-image > img {
        display: block;
        width: 100%;
        height: auto;
    }


    /* Expand button
    --------------------------------- */

    .renewal-evidence-modal-open {
        cursor: pointer;
    }

    .renewal-evidence-card-image .renewal-evidence-modal-open {
        position: absolute;
        right: 14px;
        bottom: 14px;
        width: 25px;
        height: 25px;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
    }

    .renewal-evidence-card-image .renewal-evidence-modal-open img {
        display: block;
        width: 100%;
        height: auto;
    }


    /* Slider arrows
    --------------------------------- */

    .renewal-evidence-slider-prev,
    .renewal-evidence-slider-next {
        position: absolute;
        top: 50%;
        z-index: 10;
        width: 50px;
        height: 60px;
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 0;
        background: transparent;
        cursor: pointer;
        transform: translateY(-50%);
    }

    .renewal-evidence-slider-prev {
        left: -40px;
    }

    .renewal-evidence-slider-next {
        right: -40px;
    }

    .renewal-evidence-slider-prev span,
    .renewal-evidence-slider-next span {
        position: relative;
        display: block;
        width: 18px;
        height: 54px;
        flex: none;
        border: 0;
        transform: none;
    }

    .renewal-evidence-slider-prev span::before,
    .renewal-evidence-slider-prev span::after,
    .renewal-evidence-slider-next span::before,
    .renewal-evidence-slider-next span::after {
        content: "";
        position: absolute;
        left: 49%;
        display: block;
        width: 1px;
        height: 27px;
        background-color: #0fa36a;
    }


    /* 左矢印 */

    .renewal-evidence-slider-prev span::before {
        top: 0;
        transform: rotate(25deg);
        transform-origin: bottom center;
    }

    .renewal-evidence-slider-prev span::after {
        bottom: 0;
        transform: rotate(-25deg);
        transform-origin: top center;
    }


    /* 右矢印 */

    .renewal-evidence-slider-next span::before {
        top: 0;
        transform: rotate(-18deg);
        transform-origin: bottom center;
    }

    .renewal-evidence-slider-next span::after {
        bottom: 0;
        transform: rotate(18deg);
        transform-origin: top center;
    }

    /* Report
    --------------------------------- */

    .renewal-evidence-report {
        width: 100%;
        margin-top: 30px;
        padding: 25px 28px;
        border-radius: 18px;
        background-color: #fff;
        box-sizing: border-box;
    }

    .renewal-evidence-report-title {
        margin: 0 0 15px;
        color: #0fa36a;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
    }

    .renewal-evidence-report-list {
        margin: 0;
        padding: 0;
        list-style: none;
        flex-direction: column;
        gap: 0;
        max-width: 256px;
        margin: 0 auto 0 10px;
    }

    .renewal-evidence-report-list li {
        margin: 0 0 8px;
        padding: 0;
    }

    .renewal-evidence-report-list li:last-child {
        margin-bottom: 0;
    }

    .renewal-evidence-report-list li a {
        display: flex;
        align-items: center;
        color: #454545;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.5;
        text-decoration: none;
        gap: 0px;
    }

    .renewal-evidence-report-list li a span {
        display: flex;
        width: 20px;
        height: 20px;
        margin-right: 8px;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        border-radius: 50%;
        background-color: #0fa36a;
        color: #fff;
        font-size: 11px;
        font-weight: 700;
        line-height: 1;
    }


    /* Button
    --------------------------------- */

    .renewal-evidence-button {
        width: 100%;
        margin-top: 30px;
    }

    .renewal-evidence-button .renewal-analysis-modal-open {
        display: flex;
        width: 100%;
        min-height: 64px;
        margin: 0;
        padding: 12px 15px;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 14px;
        background-color: #0fa36a;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
        cursor: pointer;
        box-sizing: border-box;
        min-width: 100%;
        letter-spacing: -0.03em;
    }


    .renewal-evidence-modal {
        padding: 40px 10px;
    }


}



/* ========================================
   RESEARCH SP
======================================== */

@media screen and (max-width: 769px) {

    .renewal-research {
        padding: 55px 32px 60px;
    }

    .renewal-research-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-research-heading {
        position: relative;
        margin-bottom: 35px;
    }

    .renewal-research-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-research-en {
        position: static;
        display: block;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
        transform: none;
    }

    .renewal-research-lead {
        margin: 45px 0 0;
        color: #454545;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.75;
        text-align: left;
    }


    /* Research list
    --------------------------------- */

    .renewal-research-list {
        display: block;
        width: 100%;
        margin-top: 35px;
    }


    /* Research card
    --------------------------------- */

    .renewal-research-card {
        display: grid;
        width: 100%;
        min-height: 100px;
        margin: 0 0 10px;
        padding: 10px;
        grid-template-columns: 72px 1fr;
        grid-template-rows: auto auto;
        column-gap: 15px;
        align-items: center;
        border-radius: 10px;
        background-color: #FAF8F5;
        box-sizing: border-box;
    }

    .renewal-research-card:last-child {
        margin-bottom: 0;
    }


    /* Logo
    --------------------------------- */

    .renewal-research-logo {
        display: flex;
        width: 72px;
        height: 72px;
        grid-column: 1;
        grid-row: 1 / 3;
        align-items: center;
        justify-content: center;
    }

    .renewal-research-logo img {
        display: block;
        max-width: 72px;
        max-height: 72px;
        width: auto;
        height: auto;
    }


    /* Card text
    --------------------------------- */

    .renewal-research-card-title {
        align-self: start;
        margin: 5px 0 0px;
        grid-column: 2;
        grid-row: 1;
        color: #454545;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-align: left;
        justify-content: flex-start;
        height: auto;
    }

    .renewal-research-card-text {
        align-self: start;
        margin: 0;
        grid-column: 2;
        grid-row: 2;
        color: #454545;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.6;
        text-align: left;
        min-height: 40px;
    }


    /* SPではPC用brを無効化
    --------------------------------- */

    .renewal-research-card-title br,
    .renewal-research-card-text br {
        display: none;
    }


    /* Button
    --------------------------------- */

    .renewal-research-button {
        width: 100%;
        margin-top: 35px;
    }

    .renewal-research-button a {
        display: flex;
        width: 100%;
        min-height: 65px;
        padding: 10px 15px;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background-color: #0fa36a;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
        text-decoration: none;
        box-sizing: border-box;
        min-width: 0;
    }

}



/* ========================================
   RESEARCH
   大学・臨床研究機関との共同研究
======================================== */

@media screen and (max-width: 769px) {

    .renewal-howto {
        padding: 50px 32px 55px;
        border-radius: 0 48px 0 48px;
    }

    .renewal-howto-inner {
        width: 100%;
        margin: 0;
    }

    .renewal-howto-note {
        margin-top: 20px;
        font-size: 10px;
        line-height: 1.7;
    }


    /* Heading
    --------------------------------- */

    .renewal-howto-heading {
        position: relative;
        margin-bottom: 35px;
    }

    .renewal-howto-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-howto-en {
        position: static;
        display: block;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
        transform: none;
    }


    /* Steps
    --------------------------------- */

    .renewal-howto-list {
        display: block;
        width: 100%;
        margin-top: 35px;
    }


    /* Card
    --------------------------------- */

    .renewal-howto-card {
        position: relative;
        display: grid;
        width: 100%;
        min-height: 120px;
        margin: 0 0 10px;
        padding: 0px 15px 0px 5px;
        grid-template-columns: 95px 1fr;
        grid-template-rows: auto auto auto;
        column-gap: 10px;
        align-items: center;
        border-radius: 10px;
        background-color: #fff;
        box-sizing: border-box;
    }

    .renewal-howto-step-note {
        margin: 0 0 0 5px;
        font-size: 12px;
        font-weight: 600;
        line-height: 1;
        color: #666666;
        white-space: nowrap;
    }

    .renewal-howto-card:last-child {
        margin-bottom: 0;
    }


    /* Image
    --------------------------------- */

    .renewal-howto-image {
        display: flex;
        width: 95px;
        grid-column: 1;
        grid-row: 1 / 4;
        align-items: center;
        justify-content: center;
        margin-top: 0px;
    }

    .renewal-howto-image img {
        display: block;
        width: auto;
        max-width: 90px;
        height: auto;
        max-height: 56px;
    }


    /* Step
    --------------------------------- */

    .renewal-howto-step {
        align-self: end;
        margin: 0;
        grid-column: 2;
        grid-row: 1;
        color: #0fa36a;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.3;
        justify-content: flex-start;
        gap: 2px;
        padding: 0 10px;
    }

    .renewal-howto-step-bk {
        align-self: end;
        margin: 0;
        grid-column: 2;
        grid-row: 1;
        color: #454545;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.3;
        justify-content: flex-start;
        gap: 2px;
        padding: 0 10px;
    }

    .renewal-howto-card:nth-child(3) .renewal-howto-step-bk {
        flex-wrap: nowrap;
    }

    .renewal-howto-card:nth-child(3) .renewal-howto-step-note {
        flex-basis: auto;
        margin: 0 0 0 5px;
        text-align: left;
        white-space: nowrap;
    }

    .renewal-howto-step span {
        display: inline-flex;
        width: 20px;
        height: 20px;
        margin-left: 3px;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background-color: #0fa36a;
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
    }

    .renewal-howto-step-bk > span:not(.renewal-howto-step-note) {
        display: inline-flex;
        width: 20px;
        height: 20px;
        margin-left: 3px;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background-color: #454545;
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
    }


    /* Title
    --------------------------------- */

    .renewal-howto-card-title {
        align-self: center;
        margin: 0;
        grid-column: 2;
        grid-row: 2;
        color: #0fa36a;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-align: left;
        padding: 0 10px;
    }


    /* Text
    --------------------------------- */

    .renewal-howto-card-text {
        align-self: start;
        margin: 0;
        grid-column: 2;
        grid-row: 3;
        color: #454545;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.5;
        text-align: left;
        padding: 0 10px;
    }

    .renewal-howto-card-text br {
        display: none;
    }


    /* Conclusion
    --------------------------------- */

    .renewal-howto-conclusion {
        margin: 25px 0 0;
        color: #0fa36a;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.7;
        text-align: center;
    }

}


/* ========================================
   AWARDS SP
   女性の健康への貢献が、
   評価されています
======================================== */

@media screen and (max-width: 769px) {

    .renewal-awards {
        padding: 50px 32px 60px;
    }

    .renewal-awards-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-awards-heading {
        position: relative;
        margin-bottom: 35px;
    }

    .renewal-awards-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
    }

    .renewal-awards-en {
        position: static;
        display: block;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
        transform: none;
    }

    .renewal-awards-lead {
        margin: 40px 0 0;
        color: #454545;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.75;
        text-align: left;
    }


    /* Awards list
    --------------------------------- */

    .renewal-awards-list {
        display: block;
        width: 100%;
        margin-top: 35px;
    }


    /* Award card
    --------------------------------- */

    .renewal-awards-card {
        display: flex;
        width: 100%;
        min-height: 125px;
        margin: 0 0 10px;
        padding: 10px 10px 20px;
        align-items: center;
        border-radius: 10px;
        background-color: #f8f6f3;
        box-sizing: border-box;
        gap: 0;
    }

    .renewal-awards-card:last-child {
        margin-bottom: 0;
    }


    /* Image
    --------------------------------- */

    .renewal-awards-image {
        display: flex;
        width: 95px;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
    }

    .renewal-awards-image img {
        display: block;
        width: auto;
        max-width: 80px;
        height: auto;
        max-height: 80px;
    }


    /* Content
    --------------------------------- */

    .renewal-awards-content {
        flex: 1;
        padding-left: 10px;
    }

    .renewal-awards-year {
        margin: 0 0 5px;
        color: #666;
        font-size: 10px;
        font-weight: 400;
        line-height: 1.4;
    }

    .renewal-awards-card-title {
        margin: 0;
        color: #454545;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
    }

    .renewal-awards-card-text {
        margin: 8px 0 0;
        color: #454545;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.6;
    }

    .renewal-awards-card-text br {
        display: none;
    }

}


/* ========================================
   CASE STUDY SP
   「健腸ナビ®」は、企業の健康施策として選ばれています
======================================== */

@media screen and (max-width: 769px) {

    .renewal-case {
        padding: 65px 32px 60px;
        border-radius: 0 48px 0 48px;
    }

    .renewal-case-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-case-heading {
        position: relative;
        margin-bottom: 35px;
    }

    .renewal-case-section-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-case-en {
        position: static;
        display: block;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
        transform: none;
    }


    /* Case
    --------------------------------- */

    .renewal-case-item {
        width: 100%;
        margin: 0 0 20px;
        padding: 35px 15px 15px;
        border-radius: 10px;
        background-color: #fff;
        box-sizing: border-box;
    }

    .renewal-case-item:last-child {
        margin-bottom: 0;
    }


    /* SP order
    --------------------------------- */

    .renewal-case-head {
        display: flex;
        flex-direction: column;
        width: 100%;
        left: 0;
        gap: 5px;
    }

    .renewal-case-summary {
        display: contents;
    }

    .renewal-case-label {
        order: 1;
    }

    .renewal-case-title {
        order: 2;
    }

    .renewal-case-points {
        order: 3;
    }

    .renewal-case-company {
        order: 4;
    }

    .renewal-case-image {
        order: 5;
    }


    /* Case label
    --------------------------------- */

    .renewal-case-label {
        margin: 0px;
        color: #0fa36a;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.4;
    }

    .renewal-case-label span {
        display: inline-flex;
        width: 20px;
        height: 20px;
        margin: 0 4px;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background-color: #0fa36a;
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
    }


    /* Title
    --------------------------------- */

    .renewal-case-title {
        margin: 0 0 10px;
        color: #454545;
        font-size: 18px;
        font-weight: 700;
        line-height: 1.6;
        text-align: left;
    }

    .renewal-case-title br {
        display: none;
    }


    /* Points
    --------------------------------- */

    .renewal-case-points {
        display: flex;
        width: 100%;
        margin: 0 0 10px;
        padding: 0;
        gap: 10px;
    }

    .renewal-case-point {
        display: flex;
        width: auto;
        min-width: 0;
        min-height: 65px;
        padding: 5px;
        flex: 1 1 0;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border: 1px solid #0fa36a;
        border-radius: 7px;
        box-sizing: border-box;
        text-align: center;
    }

    .renewal-case-point strong {
        display: block;
        height: auto;
        color: #0fa36a;
        font-weight: 700;
        line-height: 1.2;
    }

    .renewal-case-point-large {
        font-size: 22px;
    }

    .renewal-case-point-large span {
        font-size: 12px;
    }

    .renewal-case-point-small {
        font-size: 19px;
    }

    .renewal-case-point p {
        margin: 3px 0 0;
        color: #0fa36a;
        font-size: 10px;
        font-weight: 500;
        line-height: 1.35;
    }


    /* Company
    --------------------------------- */

    .renewal-case-company {
        display: grid;
        width: 100%;
        margin: 0 0 12px;
        grid-template-columns: 110px 1fr;
        grid-template-rows: auto auto;
        align-items: center;
        column-gap: 10px;
        padding: 10px 5px 8px 0;
        row-gap: 0;
    }

    .renewal-case-company-logo {
        display: flex;
        width: 110px;
        height: 40px;
        grid-column: 1;
        grid-row: 1 / 3;
        align-items: center;
    }

    .renewal-case-company-logo img {
        display: block;
        width: auto;
        max-width: 105px;
        height: auto;
        max-height: 35px;
    }

    .renewal-case-company-name {
        align-self: end;
        grid-column: 2;
        grid-row: 1;
        color: #454545;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.4;
        margin: 0;
    }

    .renewal-case-company-detail {
        align-self: start;
        grid-column: 2;
        grid-row: 2;
        margin-top: 2px;
        color: #666;
        font-size: 10px;
        line-height: 1.4;
        margin: 0;
    }


    /* Main image
    --------------------------------- */

    .renewal-case-image {
        width: 100%;
        margin: 0 0 15px;
    }

    .renewal-case-image img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 5px;
    }


    /* Body
    --------------------------------- */

    .renewal-case-body {
        width: 100%;
        margin: 0;
    }

    .renewal-case-text {
        margin: 0;
        color: #454545;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.6;
        text-align: left;
    }


    /* Comment
    --------------------------------- */

    .renewal-case-comment {
        margin-top: 15px;
        padding: 15px;
        border-radius: 8px;
        box-sizing: border-box;
    }

    .renewal-case-comment-title {
        margin: 0 0 8px;
        color: #0fa36a;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.5;
    }

    .renewal-case-comment-text {
        margin: 0;
        color: #454545;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.7;
    }


    /* Interview button
    --------------------------------- */

    .renewal-case-button {
        width: 100%;
        margin-top: 15px;
    }

    .renewal-case-button a {
        display: flex;
        width: 100%;
        min-height: 55px;
        padding: 8px 15px;
        align-items: center;
        justify-content: center;
        border: 1px solid #0fa36a;
        border-radius: 7px;
        background-color: #fff;
        color: #0fa36a;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.4;
        text-align: center;
        text-decoration: none;
        box-sizing: border-box;
        min-width: 0;
    }


    /* User voices
    --------------------------------- */

    .renewal-case-voices {
        width: 100%;
        margin-top: 20px;
    }

    .renewal-case-voices-title {
        margin: 0 auto 12px;
        color: #0fa36a;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
        width: 80%;
    }

    .renewal-case-voices-title::before, .renewal-case-voices-title::after {
    height: 36px;
    }

    .renewal-case-voices-list {
        display: block;
    }

    .renewal-case-voice {
        margin-bottom: 8px;
        padding: 15px;
        border-radius: 8px;
        box-sizing: border-box;
        min-height: 0;
    }

    .renewal-case-voice:last-child {
        margin-bottom: 0;
    }

    .renewal-case-voice p {
        margin: 0;
        color: #454545;
        font-size: 14px;
        line-height: 1.6;
    }

    .renewal-case-voice span {
        display: block;
        margin-top: 8px;
        color: #454545;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-align: right;
    }

}


/* ========================================
   VOICES SP
   ご利用者さまの声
======================================== */

@media screen and (max-width: 769px) {

    .renewal-voices {
        padding: 55px 32px 55px;
    }

    .renewal-voices-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-voices-heading {
        position: relative;
        margin-bottom: 25px;
    }

    .renewal-voices-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-voices-en {
        position: static;
        display: block;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
        transform: none;
    }

    .renewal-voices-lead {
        margin: 35px 0 0;
        color: #454545;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.5;
        text-align: left;
    }


    /* Voice list
    --------------------------------- */

    .renewal-voices-list {
        display: block;
        width: 100%;
        margin-top: 35px;
    }


    /* Voice card
    --------------------------------- */

    .renewal-voices-card {
        position: relative;
        width: 100%;
        margin: 0 0 10px;
        border: 1px solid #dce8dd;
        border-radius: 9px;
        background-color: #fff;
        box-sizing: border-box;
        overflow: visible;
        min-height: 0;
    }

    .renewal-voices-card:last-child {
        margin-bottom: 0;
    }


    /* Card head
    --------------------------------- */

    .renewal-voices-card-head {
        position: relative;
        display: flex;
        height: 60px;
        padding: 0 15px;
        align-items: center;
        border-radius: 8px 8px 0 0;
        background-color: #E5F0E4;
        box-sizing: border-box;
    }

    .renewal-voices-profile {
        margin: 0;
        color: #454545;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.5;
    }


    /* Illustration
    --------------------------------- */

    .renewal-voices-image {
        position: absolute;
        right: 10px;
        bottom: 0;
        z-index: 2;
        width: 80px;
        left: auto;
        top: auto;
        transform: unset;
    }

    .renewal-voices-image img {
        display: block;
        width: 100%;
        height: auto;
        right: 5px;
        position: relative;
    }


    /* Card body
    --------------------------------- */

    .renewal-voices-card-body {
        padding: 18px 15px 13px;
        background-color: #fff;
        border-radius: 0 0 8px 8px;
        box-sizing: border-box;
    }

    .renewal-voices-text {
        margin: 0;
        color: #454545;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.5;
        text-align: left;
    }


    /* Button
    --------------------------------- */

    .renewal-voices-button {
        width: 100%;
        margin-top: 35px;
    }

    .renewal-voices-button a {
        display: flex;
        width: 100%;
        min-height: 65px;
        padding: 10px 15px;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background-color: #0fa36a;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
        text-decoration: none;
        box-sizing: border-box;
        min-width: 0;
    }

}




/* ========================================
   FAQ SP
   よくあるご質問
======================================== */

@media screen and (max-width: 769px) {

    .renewal-faq {
        padding: 55px 32px 60px;
        border-radius: 0 48px 0 0;
    }

    .renewal-faq-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-faq-heading {
        position: relative;
    }

    .renewal-faq-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-faq-en {
        position: static;
        display: block;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
    }

    .renewal-faq-lead {
        margin: 35px 0 0;
        color: #454545;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.75;
        text-align: left;
    }


    /* Accordion Box
    --------------------------------- */

    .renewal-faq-box {
        width: 100%;
        margin-top: 35px;
        padding: 20px 15px;
        border-radius: 10px;
    }


    /* Item
    --------------------------------- */

    .renewal-faq-item {
        width: 100%;
    }

    .renewal-faq-item:last-child {
        padding: 0;
    }


    /* Question
    --------------------------------- */

    .renewal-faq-question {
        width: 100%;
        min-height: 75px;
        padding: 15px 10px 20px;
        gap: 15px;
    }

    .renewal-faq-question-inner {
        min-width: 0;
        align-items: center;
        gap: 12px;
    }

    .renewal-faq-icon {
        width: 34px;
        height: 34px;
        font-size: 14px;
    }

    .renewal-faq-question-text {
        flex: 1;
        margin: 4px 0 0;
        font-size: 14px;
        line-height: 1.6;
    }


    /* Plus / Minus
    --------------------------------- */

    .renewal-faq-toggle {
        width: 13px;
        height: 13px;
        margin-top: 10px;
    }


    /* Answer
    --------------------------------- */

    .renewal-faq-answer-inner {
        padding: 5px 10px 25px;
        align-items: flex-start;
        gap: 12px;
    }

    .renewal-faq-answer-text {
        flex: 1;
        margin: 3px 0 0;
        font-size: 13px;
        line-height: 1.75;
    }


    /* Button
    --------------------------------- */

    .renewal-faq-button {
        width: 100%;
        margin-top: 35px;
    }

    .renewal-faq-button a {
        display: flex;
        width: 100%;
        min-width: 0;
        min-height: 65px;
        padding: 10px 15px;
        border-radius: 14px;
        font-size: 14px;
        line-height: 1.5;
    }

}





/* ========================================
   CTA SP
   さあ、「腸活」から「健腸」へ。
======================================== */

@media screen and (max-width: 769px) {

    .renewal-cta {
        padding: 55px 32px 55px;
        background-color: #0fa36a;
    }

    .renewal-cta-inner {
        display: flex;
        flex-direction: column;
        padding: 0;
    }




    /* Images
    --------------------------------- */

    .renewal-cta-images {
        order: 1;
        width: 100%;
        margin: 0 0 25px;
        position: relative;
    }

    .renewal-cta-image {
        width: 100%;
    }

    .renewal-cta-image img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 10px;
    }

    .renewal-cta-image-01 {
        display: none;
    }

    .renewal-cta-image-02 {
        position: relative;
        right: unset;
        bottom: unset;
        height: auto;
    }


    /* Content
    --------------------------------- */

    .renewal-cta-content {
        order: 2;
        width: 100%;
        margin: 0;
    }

    .renewal-cta-title {
        margin: 0;
        color: #fff;
        font-size: 22px;
        font-weight: 700;
        line-height: 1.65;
        text-align: center;
    }

    .renewal-cta-text {
        margin: 30px 0 0;
        color: #fff;
        font-size: 13px;
        font-weight: 500;
        line-height: 1.8;
        text-align: left;
    }


    /* Button
    --------------------------------- */

    .renewal-cta-button {
        width: 100%;
        margin-top: 30px;
    }

    .renewal-cta-button a {
        display: flex;
        width: 100%;
        min-height: 65px;
        padding: 10px 15px;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background-color: #ff8500;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
        text-decoration: none;
        box-sizing: border-box;
    }

}



/* ========================================
   NEWS SP
   お知らせ
======================================== */

@media screen and (max-width: 769px) {

    .renewal-news {
        padding: 55px 32px 60px;
        background-color: #F2FAF2;
    }

    .renewal-news-inner {
        display: block;
        width: 100%;
        margin: 0;
    }

    /* Heading
    --------------------------------- */

    .renewal-news-heading {
        margin-bottom: 35px;
        width: 100%;
    }

    .renewal-news-heading-main {
        align-items: center;
    }

    .renewal-news-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
    }

    .renewal-news-en {
        display: block;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
    }


    /* News List
    --------------------------------- */

    .renewal-news-list {
        width: 100%;
        border: unset;
        padding-left: 0px;
    }

    .renewal-news-item {
        display: block;
        width: 100%;
    }

    .renewal-news-item + .renewal-news-item {
        padding: 15px 0;
    }


    /* Date
    --------------------------------- */

    .renewal-news-date {
        display: block;
        margin: 0 0 8px;
        font-size: 14px;
    }


    /* Title
    --------------------------------- */

    .renewal-news-item-title {
        margin: 0;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.75;
    }

    .renewal-news-item-title {
        display: block;
        width: 100%;
        margin: 0;
    }


    /* More
    --------------------------------- */

    .renewal-news-more {
        margin-top: 10px;
        text-align: right;
    }

    .renewal-news-more a {
        display: inline-flex;
        align-items: center;
        color: #454545;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.5;
        text-decoration: none;
    }

    .renewal-news-more-arrow {
        display: block;
        width: 9px;
        height: 9px;
        margin: 2px 0 0 0px;
        border-top: 1px solid #454545;
        border-right: 1px solid #454545;
        transform: rotate(45deg);
    }

}


/* ========================================
   COLUMN SP
   健腸コラム
======================================== */

@media screen and (max-width: 769px) {

    .renewal-column {
        padding: 55px 32px 60px 32px;
        background-color: #FAF8F5;
    }

    .renewal-column-inner {
        width: 100%;
        margin: 0;
    }


    /* Heading
    --------------------------------- */

    .renewal-column-heading {
        position: relative;
        margin-bottom: 35px;
        text-align: center;
    }

    .renewal-column-title {
        margin: 0;
        color: #0fa36a;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.55;
        text-align: center;
    }

    .renewal-column-en {
        position: static;
        top: auto;
        right: auto;
        display: block;
        width: stretch;
        margin-top: 7px;
        color: #7cceae;
        font-family: "Roboto Condensed", sans-serif;
        font-size: 10px;
        font-weight: 500;
        line-height: 1;
        text-align: center;
        transform: none;
    }


    /* Main card
    --------------------------------- */

    .renewal-column-main {
    position: relative;
    left: 0;
    width: 100%;
    }


    /* Content内の要素を並べ替え可能にする
    --------------------------------- */

    .renewal-column-content {
        display: none;
    }


    /* Slide card
    --------------------------------- */

    .renewal-column-slide {
        overflow: hidden;
        border-radius: 14px;
        background-color: #fff;
    }

    .renewal-column-slide-link {
        display: block;
        color: inherit;
        text-decoration: none;
    }

    .renewal-column-slide-content {
        background-color: #fff;
    }



    /* Slider image
    --------------------------------- */

    .renewal-column-slider-wrap {
        order: 1;
        width: 100%;
        margin: 0;
        overflow: visible;
    }

    .renewal-column-slider {
        width: max-content;
        gap: 12px;
    }

    .renewal-column-slide {
        width: calc(100vw - 120px);
        flex: 0 0 calc(100vw - 120px);
    }

    .renewal-column-slide-image {
        width: 100%;
        height: 232px;
        overflow: hidden;
        border-radius: 10px 10px 0 0;
    }

    .renewal-column-slide-image img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }


    /* Tag and date
    --------------------------------- */

    .renewal-column-meta {
        order: 2;
        margin: 0;
        padding: 18px 18px 0;
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
        box-sizing: border-box;
    }

    .renewal-column-tag {
        padding: 5px 20px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 20px;
        background-color: #0fa36a;
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.2;
    }

    .renewal-column-date {
        color: #454545;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.4;
        letter-spacing: 0.08em;
    }


    /* Article title
    --------------------------------- */

    .renewal-column-article-title {
        order: 3;
        margin: 5px 0 0;
        padding: 0 18px 30px;
        color: #454545;
        font-size: 18px;
        font-weight: 700;
        line-height: 1.7;
        text-align: left;
        box-sizing: border-box;
    }


    /* SPでは概要文を非表示
    --------------------------------- */

    .renewal-column-text {
        display: none;
    }


    /* SPではスライダードットを非表示
    --------------------------------- */

    .renewal-column-dots {
        display: none;
    }


    /* Button
    --------------------------------- */

    .renewal-column-button {
        width: 100%;
        margin-top: 35px;
    }

    .renewal-column-button a {
        display: flex;
        width: 100%;
        min-width: 0;
        min-height: 65px;
        padding: 10px 15px;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background-color: #0fa36a;
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
        text-decoration: none;
        box-sizing: border-box;
    }


    /* Banners
    --------------------------------- */

    .renewal-column-banners {
        display: flex;
        width: 100%;
        margin-top: 55px;
        flex-direction: column;
        gap: 30px;
    }

    .renewal-column-banners a {
        display: block;
        width: 100%;
    }

    .renewal-column-banners img {
        display: block;
        width: 100%;
        height: auto;
    }

}




/* ================================= 
   TABLET 
================================= */ 
@media screen and (min-width: 770px) and (max-width: 1300px) { 
 
/* HOME タブレット調整 */ 

/* ================================= 
   MAIN VISUAL 
================================= */ 

.renewal-mv { 
    padding-left: 2%; 
} 
 
.renewal-mv-left { 
    padding-right: 1%; 
} 
 
.renewal-mv-copy-main { 
    font-size: 40px; 
} 
 
span.renewal-mv-highlight { 
    font-size: 52px; 
} 
 
.renewal-mv-copy-sub { 
    font-size: 16px; 
} 
 
.renewal-mv-data { 
    font-size: 16px; 
} 
 
.renewal-mv-data {
    max-width: 430px;
    margin: 60px auto 0;
    gap: unset;
    justify-content: space-around;
}

.renewal-mv-data-item {
    max-width: 125px;
    max-height: 125px;
}


/* =================================
    健腸ナビとは
================================= */
.renewal-about {
    padding-left:0;
}

.renewal-about::after {
    width: 25%;
}

.renewal-about-inner {
    margin-left: 0;
    width: 100%;
    border-radius: 0;
}

.renewal-about-image {
    right: 0;
    max-width: 285px;
}

.renewal-about-text p {
    font-size: 16px;
}



/* =================================
    「腸活」ブームの検査と、健腸ナビ
================================= */
.renewal-difference {
    padding:45px 2% 45px;
}

.renewal-difference-title {
    font-size: 36px;
}

.renewal-difference-badge-top {
    font-size: 18px;
}

.renewal-difference-badge-bottom {
    font-size: 14px;
}

.renewal-difference-card-title {
    font-size: 18px;
}

.renewal-difference-list li {
    font-size: 14px;
}

.renewal-difference-card-old {
    padding: 30px 20px 30px;
    width: 355px;
}

.renewal-difference-comparison {
    justify-content: center;
}

.renewal-difference-arrow {
    font-size: 15px;
    left: 410px;
    height: 125px;
    width: 125px;
    position: unset;
}

.renewal-difference-card-kenchonavi {
    width: 450px;
}

.renewal-difference-badge-result {
    font-size: 18px;
    top: -10px;
}

.renewal-difference-badge-result-bottom {
    font-size: 14px;
}

.renewal-difference-card-title-kenchonavi {
    font-size: 22px;
}

.renewal-difference-list-kenchonavi li {
    font-size: 14px;
}



/* =================================
    なぜ、腸内細菌が病気に関わるのか
================================= */
.renewal-mechanism {
    padding:45px 2% 45px;
    border-radius: 0 48px 0 48px;
}

.renewal-mechanism-title {
    font-size: 36px;
}

.renewal-mechanism-card-title {
    font-size: 15px;
}

.renewal-mechanism-card-text {
    font-size: 13px;
}

.renewal-mechanism-conclusion-title {
    font-size: 22px;
}

.renewal-mechanism-conclusion-text {
    font-size: 15px;
    padding:0 5%;
}



/* =================================
   すべては、高品質な菌叢データから
================================= */
.renewal-science {
    padding:45px 2% 45px;
}

.renewal-science-title {
    font-size: 36px;
}

.renewal-science-item-title {
    font-size: 22px;
}

.renewal-science-item-text {
    font-size: 15px;
}

.renewal-science-visual {
    max-width: 50%;
}


/* =================================
    この検査から、わかること
================================= */
.renewal-evidence {
    padding:45px 2% 45px;
    border-radius: 0 48px 0 48px;
}

.renewal-evidence-title {
    font-size: 36px;
}

.renewal-evidence-slider-viewport {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
}

.renewal-evidence-card {
    width: 300px;
    flex: 0 0 300px;
}

.renewal-evidence-slider-prev {
    left: -35px;
}

.renewal-evidence-slider-next {
    right: -35px;
}

.renewal-evidence-report-title {
    font-size: 15px;
}

.renewal-evidence-report-list li a {
    font-size: 14px;
}

.renewal-evidence-report-list li a span {
    width: 20px;
    height: 20px;
}



/* =================================
    大学・臨床研究機関との共同研究が、
    分析の確かさを支えています
================================= */
.renewal-research {
    padding:45px 2% 45px;
}

.renewal-research-title {
    font-size: 36px;
}



/* =================================
    検査で終わらない。
    おすすめ食品をヒントに、健康づくりのサイクルへ
================================= */
.renewal-howto {
    padding:45px 2% 45px;
    border-radius: 0 48px 0 48px;
}

.renewal-howto-title {
    font-size: 36px;
}

.renewal-howto-card {
    width: 300px;
    padding: 15px 15px 25px;
}

.renewal-howto-card-title {
    font-size: 16px;
}

.renewal-howto-card-text {
    font-size: 13px;
}

.renewal-howto-conclusion {
    font-size: 22px;
}



/* =================================
    女性の健康への貢献が、
    評価されています
================================= */
.renewal-awards {
    padding:45px 2% 45px;
}

.renewal-awards-title {
    font-size: 36px;
}



/* =================================
    「健腸ナビ®」は、企業の健康施策
    選ばれています
================================= */
.renewal-case {
    padding:45px 2% 45px;
    border-radius: 0 48px 0 48px;
}

.renewal-case-section-title {
    font-size: 36px;
}

.renewal-case-label {
    font-size: 14px;
}

.renewal-case-label span {
    width: 22px;
    height: 22px;
    font-size: 14px;
    margin: 0px 2px 0px;
}

.renewal-case-title {
    font-size: 22px;
}

.renewal-case-text {
    font-size: 15px;
}

.renewal-case-company {
    display: grid;
    width: 100%;
    grid-template-columns: 110px 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 10px;
    padding: 10px 5px 8px 0;
    row-gap: 0;
}

.renewal-case-company-logo {
    display: flex;
    width: 110px;
    height: 40px;
    grid-column: 1;
    grid-row: 1 / 3;
    align-items: center;
}

.renewal-case-company-logo img {
    display: block;
    width: auto;
    max-width: 105px;
    height: auto;
    max-height: 35px;
}

.renewal-case-company-name {
    align-self: end;
    grid-column: 2;
    grid-row: 1;
    color: #454545;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0;
}

.renewal-case-company-info {
    flex-direction: column;
    align-items: flex-start;
}

.renewal-case-company-detail {
    align-self: start;
    grid-column: 2;
    grid-row: 2;
    margin-top: 2px;
    color: #666;
    font-size: 10px;
    line-height: 1.4;
    margin: 0;
}

.renewal-case-voices-title {
    font-size: 22px;
}

.renewal-case-voice p {
    font-size: 15px;
}

.renewal-case-voice span {
    font-size: 15px;
}

.renewal-case-points {
    gap: 5px;
}

.renewal-case-image {
    max-width: 450px;
}

/* =================================
    ご利用者さまの声
================================= */
.renewal-voices {
    padding:45px 2% 45px;
}

.renewal-voices-card-head {
    height: 120px;
}

.renewal-voices-profile {
    font-size: 15px;
}

.renewal-voices-text {
    font-size: 15px;
}


/* =================================
     よくあるご質問
================================= */
.renewal-faq {
    padding:45px 2% 45px;
    border-radius: 0 48px 0 0px;
}

.renewal-faq-title {
    font-size: 36px;
}

.renewal-faq-question {
    padding: 15px 20px;
}

.renewal-faq-answer-inner {
    padding: 10px 20px 30px;
}

.renewal-faq-question-text {
    font-size: 15px;
}



/* =================================
    「腸活」から「健腸」へ。
================================= */
.renewal-cta {
    padding:45px 0% 45px 2%;
}

.renewal-cta-title {
    font-size: 36px;
}

.renewal-cta-text {
    max-width: 540px;
    font-size: 15px;
}

.renewal-cta-image-02 {
    right: 20%;
}



/* =================================
    お知らせ
================================= */
.renewal-news {
    padding:45px 2% 45px 2%;
}

.renewal-news-title {
    font-size: 36px;
}

.renewal-news-date {
    font-size: 15px;
}

.renewal-news-item-title {
    font-size: 15px;
}

.renewal-news-more a {
    font-size: 13px;
}



/* =================================
    健腸コラム
================================= */
.renewal-column {
    padding:45px 0% 45px 2%;
}

.renewal-column-title {
    font-size: 36px;
}

.renewal-column-en {
    right: 2%;
}

.renewal-column-dots {
    justify-content: flex-start;
}

/* =================================
    追従バナー
================================= */
.renewal-fixed-purchase {
    width: auto;
    height: 55px;
    left: 0;
    right: 0;
    bottom: 0;
}

.renewal-fixed-purchase-body {
    width: auto;
    height: 55px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #FA8900;
    border-radius: 0;
}

.renewal-fixed-purchase-text {
    position: static;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
}

.renewal-fixed-purchase-text span:first-child {
    display: none;
}

.renewal-fixed-purchase-text span {
    writing-mode: horizontal-tb;
    text-orientation: mixed;
    white-space: nowrap;
}

.renewal-fixed-purchase-text span:last-child {
    display: block;
}

.renewal-fixed-purchase-image {
    display: none;
}


}