@charset "UTF-8";
@media all and (min-width: 768px), print {
    .page-hero__header {
        --txt-w: 399;
    }
    .page-hero__body {
        padding: calc(49 / var(--page-hero-w) * 100%) calc(20 / var(--font-size) * 1em) calc(50 / var(--page-hero-w) * 100%);
    }
    .page-hero__header-title {
        padding-top: calc(52 / var(--txt-w) * 100%);
    }
    .page-hero__header-title__label::before {
        width: calc(50 / var(--txt-w) * 100%);
        padding-top: calc(49 / var(--txt-w) * 100%);
    }
    .l-page-container {
        position: relative;
    }
    .l-page-container::before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background: url("../img/recommend/recommend-bg.png") no-repeat center top / calc(2560 / var(--font-size) * 1em);
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        margin-top: calc(232 / var(--font-size) * 1em);
    }
    #gfooter {
        position: relative;
        z-index: 1;
    }
}
@media all and (max-width: 767px) {
    .page-hero__header-title {
        padding-top: calc(80 / 750 * 100vw);
    }
    .page-hero__header-title__label::before {
        width: calc(68 / 750 * 100vw);
        height: calc(65 / 750 * 100vw);
    }
    .page-heading__label {
        font-size: calc(56 / 750 * 100vw);
        line-height: calc(60 / 56);
    }
}

/* --------------------------------------------------------------------------
  INTRO
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
    .intro-sec {
    }
    .intro-sec__in {
    }
    .intro-sec__body {
        padding-bottom: calc(40 / var(--sec-width) * 100%);
    }
    .intro-read {
        text-align: center;
    }
    .intro-read__in {
        display: inline-block;
        position: relative;
    }
    .intro-read__in::before,
    .intro-read__in::after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
    }
    .intro-read__in::before {
        width: calc(65 / var(--font-size) * 1em);
        padding-top: calc(85 / var(--font-size) * 1em);
        background: url("../img/page/intro-sec-deco-01.png") no-repeat center / contain;
        margin-left: calc(-57 / var(--font-size) * 1em);
    }
    .intro-read__in::after {
        width: calc(54 / var(--font-size) * 1em);
        padding-top: calc(72 / var(--font-size) * 1em);
        background: url("../img/page/intro-sec-deco-02.png") no-repeat center / contain;
        margin-top: calc(125 / var(--font-size) * 1em);
        margin-left: calc(801 / var(--font-size) * 1em);
    }
    .intro-heading {
    }
    .intro-heading__in {
        font-size: calc(32 / var(--font-size) * 1em);
        text-align: center;
    }
    .intro-heading__label--sub {
        color: var(--green-color-10);
        font-size: calc(32 / 32 * 1em);
        font-family: var(--font-josefin);
        font-weight: bold;
        letter-spacing: calc(240 / 1000 * 1em);
        line-height: 1;
    }
    .intro-heading__label {
        color: var(--lightbrown-color);
        font-family: var(--font-zen-maru);
        font-weight: bold;
        letter-spacing: calc(80 / 1000 * 1em);
    }
    .intro-txt {
        margin-top: calc(28 / 720 * 100%);
    }
}
@media all and (min-width: 768px) and (max-width: 1064px) {
    .intro-heading__in {
        font-size: calc(32 / 1064 * 100vw);
    }
}
@media all and (max-width: 767px) {
    .intro-sec {
    }
    .intro-sec__in {
    }
    .intro-sec__body {
        padding-bottom: calc(40 / 750 * 100vw);
    }
    .intro-read {
        text-align: center;
    }
    .intro-read__in {
        display: inline-block;
        position: relative;
    }
    .intro-read__in::before,
    .intro-read__in::after {
        content: "";
        display: block;
        position: absolute;
    }
    .intro-read__in::before {
        width: calc(76 / 750 * 100vw);
        padding-top: calc(100 / 750 * 100vw);
        background: url("../img/page/intro-sec-deco-01.png") no-repeat center / contain;
        margin-top: calc(143 / 750 * 100vw);
        margin-left: calc(-33 / 750 * 100vw);
        top: 0;
        left: 0;
    }
    .intro-read__in::after {
        width: calc(74 / 750 * 100vw);
        padding-top: calc(97 / 750 * 100vw);
        background: url("../img/page/intro-sec-deco-02.png") no-repeat center / contain;
        margin-right: calc(-22 / 750 * 100vw);
        margin-bottom: calc(-16 / 750 * 100vw);
        right: 0;
        bottom: 0;
    }
    .intro-heading {
    }
    .intro-heading__in {
        font-size: calc(48 / 750 * 100vw);
        text-align: center;
    }
    .intro-heading__label--sub {
        color: var(--green-color-10);
        font-size: calc(36 / 48 * 1em);
        font-family: var(--font-josefin);
        font-weight: bold;
        letter-spacing: calc(240 / 1000 * 1em);
        line-height: 1;
    }
    .intro-heading__label {
        color: var(--lightbrown-color);
        font-family: var(--font-zen-maru);
        font-weight: bold;
        letter-spacing: calc(80 / 1000 * 1em);
        line-height: calc(62 / 48);
        margin-top: calc(8 / 750 * 100vw);
    }
    .intro-txt {
        margin-top: calc(28 / 720 * 100%);
    }
}

/* --------------------------------------------------------------------------
  RECOMMEND
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
    .recommend-sec {
        position: relative;
        z-index: 1;
    }
    .recommend-sec__in {
    }
    .recommend-sec__body {
        padding-top: calc(36 / var(--sec-width) * 100%);
    }
    .point-list__container {
        --point-w: 1024;
    }
    .point-list {
    }
    .point-list-item {
    }
    .point-list-item + .point-list-item {
        margin-top: calc(40 / var(--point-w) * 100%);
    }
    .point-card {
        background: var(--pink-color-10);
        border-radius: calc(40 / var(--font-size) * 1em);
    }
    .point-card__in {
        padding: 0 calc(40 / var(--point-w) * 100%);
        --point-in-w: 944;
    }
    .point-card__body {
        display: flex;
        padding: calc(40 / var(--point-in-w) * 100%) 0;
        align-items: start;
        position: relative;
    }
    .point-card__body::after {
        content: "";
        display: block;
        width: calc(452 / var(--point-in-w) * 100%);
        padding-top: calc(240 / var(--point-in-w) * 100%);
    }
    .point-list-item--01 .point-card__body::after {
        margin-left: calc(40 / var(--point-in-w) * 100%);
    }
    .point-list-item--03 .point-card__body::after {
        content: none;
    }
    .point-list-item--02 .point-card__body {
        flex-direction: row-reverse;
    }
    .point-list-item--03 .point-card__body {
        display: block;
    }
    .point-card-read {
        width: calc(450 / var(--point-in-w) * 100%);
    }
    .point-list-item--03 .point-card-read {
        width: auto;
    }
    .point-card-read__in {
    }
    .point-card-read-heading {
    }
    .point-list-item--01 .point-card-read-heading {
        --head-w: 450;
    }
    .point-list-item--02 .point-card-read-heading {
        --head-w: 450;
    }
    .point-list-item--03 .point-card-read-heading {
        --head-w: 944;
    }
    .point-card-read-heading-txt {
        position: relative;
        margin-bottom: calc(20 / var(--head-w) * 100%);
    }
    .point-card-read-heading-txt::before {
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        color: var(--white-color);
        font-size: calc(64 / var(--font-size) * 1em);
        font-family: var(--font-josefin);
        font-weight: bold;
        letter-spacing: calc(80 / 1000 * 1em);
        line-height: 1;
    }
    .point-list-item--01 .point-card-read-heading-txt::before {
        content: "01";
    }
    .point-list-item--02 .point-card-read-heading-txt::before {
        content: "02";
    }
    .point-list-item--03 .point-card-read-heading-txt::before {
        content: "03";
    }
    .point-list-item--01 .point-card-read-heading-txt {
        padding-left: calc(78 / var(--head-w) * 100%);
    }
    .point-list-item--03 .point-card-read-heading-txt {
        padding-left: calc(92 / var(--head-w) * 100%);
    }
    .point-list-item:nth-child(odd) .point-card-read-heading-txt::before {
        left: 0;
    }
    .point-list-item:nth-child(even) .point-card-read-heading-txt {
        padding-right: calc(78 / var(--head-w) * 100%);
    }
    .point-list-item:nth-child(even) .point-card-read-heading-txt::before {
        right: 0;
    }
    .point-card-read-heading-txt__label {
        color: var(--orange-color-500);
        font-size: calc(28 / var(--font-size) * 1em);
        font-family: var(--font-zen-maru);
        font-weight: bold;
        letter-spacing: calc(40 / 1000 * 1em);
        line-height: calc(39.2 / 28);
    }
    .point-card-read-txt {
    }
    .point-card-read-txt .c-txt {
        font-family: var(--font-zen-kaku);
    }
    .point-card-img {
        width: calc(452 / var(--point-in-w) * 100%);
        border-radius: calc(24 / var(--font-size) * 1em);
        overflow: hidden;
        position: absolute;
        top: 0;
        margin-top: calc(40 / var(--point-in-w) * 100%);;
    }
    .point-list-item--01 .point-card-img {
        margin-left: calc(40 / var(--point-in-w) * 100%);
        right: 0;
    }
    .point-list-item--02 .point-card-img {
        margin-right: calc(40 / var(--point-in-w) * 100%);
        left: 0;
    }
    .point-list-item--03 .point-card-img {
        position: static;
        margin-top: calc(24 / var(--point-in-w) * 100%);
        width: auto;
    }
    .nutrition-btn__container {
        width: calc(var(--btn-w) / 450 * 100%);
    }
    .point-card-graph {
        margin-top: calc(24 / var(--font-size) * 1em);
    }
    .point-card-graph__in {
        background: var(--white-color);
        border-radius: calc(24 / var(--font-size) * 1em);
        padding: 0 calc(27 / var(--font-size) * 1em);
    }
    .point-card-graph__body {
        padding: calc(20 / var(--font-size) * 1em) 0;
    }
    .point-card-graph-heading {
        text-align: center;
        margin-bottom: calc(18 / 890 * 100%);
    }
    .point-card-graph-heading__label {
        font-size: calc(20 / var(--font-size) * 1em);
        font-family: var(--font-zen-maru);
        font-weight: bold;
        letter-spacing: calc(40 / 1000 * 1em);
    }
    .point-card-graph-content {
        display: flex;
        align-items: end;
        gap: calc(22 / 890 * 100%);
    }
    .point-card-graph-content-item {
    }
    .point-card-graph-content-item-heading {
        text-align: center;
        margin-bottom: calc(6 / 562 * 100%);
    }
    .point-card-graph-content-item-heading__label {
        font-size: calc(14 / var(--font-size) * 1em);
        font-weight: bold;
        letter-spacing: calc(40 / 1000 * 1em);
        line-height: 1.6;
    }
    .point-card-graph-content-item-img {
    }
    .point-card-graph-content-item--circle {
        width: calc(301 / 890 * 100%);
    }
    .point-card-graph-content-item--table {
        width: calc(562 / 890 * 100%);
    }
    .point-card-graph-read {
        margin-top: calc(18 / var(--font-size) * 1em);
    }
    .point-card-graph-read-note {
    }
    .point-card-graph-read-note .c-note-txt__label {
        font-family: var(--font-zen-kaku);
    }
    .point-card-graph-read-txt {
        text-align: center;
        margin-top: calc(8 / var(--font-size) * 1em);
    }
    .point-card-graph-read-txt__label {
        font-size: calc(12 / var(--font-size) * 1em);
        font-family: var(--font-zen-kaku);
        font-weight: 500;
        letter-spacing: calc(40 / 1000 * 1em);
        line-height: 1.6;
    }
}
@media all and (min-width: 768px) and (max-width: 1064px) {
    .point-card {
        border-radius: calc(40 / 1064 * 100vw);
    }
    .point-card-read-heading-txt::before {
        font-size: calc(64 / 1064 * 100vw);
    }
    .point-card-read-heading-txt__label {
        font-size: calc(28 / 1064 * 100vw);
    }
    .point-card-img {
        border-radius: calc(24 / 1064 * 100vw);
    }
    .point-card-graph-heading__label {
        font-size: calc(20 / 1064 * 100vw);
    }
    .point-card-graph-content-item-heading__label {
        font-size: calc(14 / 1064 * 100vw);
    }
}
@media all and (max-width: 767px) {
    .recommend-sec {
        position: relative;
        z-index: 1;
    }
    .recommend-sec__in {
    }
    .recommend-sec__body {
        padding-top: calc(48 / 750 * 100vw);
    }
    .point-list__container {
        --point-w: 1024;
    }
    .point-list {
    }
    .point-list-item {
    }
    .point-list-item + .point-list-item {
        margin-top: calc(88 / 750 * 100vw);
    }
    .point-card {
        background: var(--pink-color-10);
        border-radius: calc(40 / 750 * 100vw);
    }
    .point-card__in {
        padding: 0 calc(32 / 750 * 100vw);
        --point-in-w: 944;
    }
    .point-card__body {
        padding: calc(40 / 750 * 100vw) 0 calc(80 / 750 * 100vw);
        position: relative;
    }
    .point-list-item--01 .point-card__body::after {
        margin-left: calc(40 / 750 * 100vw);
    }
    .point-list-item--03 .point-card__body::after {
        content: none;
    }
    .point-list-item--02 .point-card__body {
        flex-direction: row-reverse;
    }
    .point-list-item--03 .point-card__body {
        display: block;
    }
    .point-card-read {
    }
    .point-list-item--03 .point-card-read {
        width: auto;
    }
    .point-card-read__in {
    }
    .point-card-read-heading {
    }
    .point-list-item--01 .point-card-read-heading {
        --head-w: 450;
    }
    .point-list-item--02 .point-card-read-heading {
        --head-w: 450;
    }
    .point-list-item--03 .point-card-read-heading {
        --head-w: 944;
    }
    .point-card-read-heading-txt {
        position: relative;
        margin-bottom: calc(40 / 750 * 100vw);
    }
    .point-list-item--03 .point-card-read-heading-txt {
        margin-bottom: calc(28 / 750 * 100vw);
    }
    .point-card-read-heading-txt::before {
        display: block;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        color: var(--white-color);
        font-size: calc(88 / 750 * 100vw);
        font-family: var(--font-josefin);
        font-weight: bold;
        letter-spacing: calc(80 / 1000 * 1em);
        line-height: 1;
    }
    .point-list-item--01 .point-card-read-heading-txt::before {
        content: "01";
    }
    .point-list-item--02 .point-card-read-heading-txt::before {
        content: "02";
    }
    .point-list-item--03 .point-card-read-heading-txt::before {
        content: "03";
    }
    .point-card-read-heading-txt {
        padding-top: calc(88 / 750 * 100vw);
        text-align: center;
    }
    .point-list-item:nth-child(even) .point-card-read-heading-txt::before {
    }
    .point-card-read-heading-txt__label {
        color: var(--orange-color-500);
        font-size: calc(44 / 750 * 100vw);
        font-family: var(--font-zen-maru);
        font-weight: bold;
        letter-spacing: calc(40 / 1000 * 1em);
        line-height: calc(39.2 / 28);
    }
    .point-card-read-txt {
        margin-top: calc(34 / 750 * 100vw);
    }
    .point-card-read-txt .c-txt {
        font-family: var(--font-zen-kaku);
    }
    .point-card-img {
        border-radius: calc(16 / 750 * 100vw);
        margin: 0 auto;
        overflow: hidden;
    }
    .nutrition-btn__container {
        width: calc(var(--btn-w) / 750 * 100vw);
    }
    .point-card-graph {
        margin-top: calc(38 / 750 * 100vw);
    }
    .point-card-graph__in {
        background: var(--white-color);
        border-radius: calc(16 / 750 * 100vw);
        padding: 0 calc(27 / 750 * 100vw);
    }
    .point-card-graph__body {
        padding: calc(48 / 750 * 100vw) 0;
    }
    .point-card-graph-heading {
        text-align: center;
        margin-bottom: calc(32 / 750 * 100vw);
    }
    .point-card-graph-heading__label {
        font-size: calc(32 / 750 * 100vw);
        font-family: var(--font-zen-maru);
        font-weight: bold;
        letter-spacing: calc(40 / 1000 * 1em);
    }
    .point-card-graph-content {
    }
    .point-card-graph-content-item {
    }
    .point-card-graph-content-item-heading {
        text-align: center;
        margin-bottom: calc(18 / 750 * 100vw);
    }
    .point-card-graph-content-item-heading__label {
        font-size: calc(24 / 750 * 100vw);
        font-weight: bold;
        letter-spacing: calc(40 / 1000 * 1em);
        line-height: 1.6;
    }
    .point-card-graph-content-item-img__container {
        position: relative;
        overflow: scroll;
        margin-right: calc(-27 / 750 * 100vw);
    }
    .point-card-graph-content-item-img__container img {
        
    }
    .point-card-graph-content-item-img {
    }
    .point-card-graph-content-item-img--circle {
        width: calc(440 / 750 * 100vw);
        margin: 0 auto;
    }
    .point-card-graph-content-item-img--table {
        width: calc(860 / 750 * 100vw);
        padding-right: calc(27 / 750 * 100vw);
    }
    .point-card-graph-read {
        margin-top: calc(48 / 750 * 100vw);
    }
    .point-card-graph-read-note {
    }
    .point-card-graph-read-note .c-note-txt__label {
        font-family: var(--font-zen-kaku);
        letter-spacing: calc(40 / 1000 * 1em);
    }
    .point-card-graph-read-txt {
        margin-top: calc(16 / 750 * 100vw);
    }
    .point-card-graph-read-txt__label {
        font-size: calc(20 / 750 * 100vw);
        font-family: var(--font-zen-kaku);
        font-weight: 500;
        letter-spacing: calc(40 / 1000 * 1em);
        line-height: 1.6;
    }
}

/* --------------------------------------------------------------------------
  PRODUCT
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
    .products-sec {
        background: var(--yellow-color-100);
    }
    .bg-wave--strong {
        position: relative;
        /* padding-top: calc(566 / var(--font-size) * 1em); */
        /* margin-top: calc(-566 / var(--font-size) * 1em); */
        margin-top: calc(340 / var(--font-size) * 1em);
        margin-bottom: calc(-300 / var(--font-size) * 1em);
        z-index: 0;
    }
    .bg-wave--strong::before {
        content: "";
        display: block;
        width: 100%;
        padding-top: calc(827.5 / var(--font-size) * 1em);
        background: url("../img/common/wave-strong-bg-deco.png") no-repeat center / calc(2560 / var(--font-size) * 1em);
        position: absolute;
        left: 50%;
        top: 0;
        transform: translateX(-50%);
        margin-top: calc(-827.5 / var(--font-size) * 1em);
        z-index: -1;
    }
    .products-sec__in {
        position: relative;
        top: calc(-300 / var(--font-size) * 1em);
        right: 0;
        left: 0;
    }
    .products-sec__body {
        padding-top: 0;
        padding-bottom: calc(160 / 1280 * 100%);
    }
    .products-sec .page-heading {
        margin-bottom: calc(14 / var(--sec-width) * 100%);
    }
    .products-sec .page-heading__in {
        padding-bottom: calc(28 / var(--sec-width) * 100%);
    }
    .products-sec .page-heading__in::before {
        content: "";
        display: block;
        -webkit-mask-image: url("../img/common/sec-ttl-deco.png");
        mask-image: url("../img/common/sec-ttl-deco.png");
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        -webkit-mask-size: contain;
        mask-size: contain;
        background: var(--main-color-100);
        background: var(--green-color-10);
        width: calc(42 / var(--sec-width) * 100%);
        padding-top: calc(8 / var(--sec-width) * 100%);
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
    }
    .products-read-txt {
    }
    .products-list__container {
        --products-list-w: 952;
        max-width: calc(992 / var(--font-size) * 1em);
        padding: 0 calc(20 / var(--font-size) * 1em);
        margin-top: calc(58 / var(--sec-width) * 100%);
    }
    .products-list {
        display: flex;
        gap: calc(48 / var(--products-list-w) * 100%);
    }
    .products-list-item {
        width: calc((100% - (144 / var(--products-list-w) * 100%)) / 4);
    }
    .products-card {
    }
    .products-card__in {
        --card-in-w: 202;
    }
    .products-card-content {
    }
    .products-card-content-img {
        width: calc(125 / var(--card-in-w) * 100%);
        margin: 0 auto;
    }
    .products-card-content-txt {
        text-align: center;
        margin-top: calc(12 / var(--card-in-w) * 100%);
    }
    .products-card-content-txt__label {
        font-size: calc(16 / var(--font-size) * 1em);
        font-weight: 500;
        line-height: calc(24 / 16);
        letter-spacing: 0;
    }
    .products-card-btn__container {
        margin-top: calc(12 / var(--card-in-w) * 100%);
    }
    .products-list-item--yummy .products-card-btn__container,
    .products-list-item--organic .products-card-btn__container {
        margin-top: calc(36 / var(--card-in-w) * 100%);
    }
    .main-container ul.products-card-btn-list {
        --btn-w: 180;
        width: calc(180 / var(--card-in-w) * 100%);
        margin: 0 auto;
    }
    .products-card-btn-list-item {
    }
    .products-card-btn-list-item + .products-card-btn-list-item {
        margin-top: calc(12 / var(--btn-w) * 100%);
    }
    .products-card-btn {
        transition: all .3s ease;
        display: block;
    }
    .products-card-btn:hover {
        transform: scale(.9);
    }
    .products-card-btn__in {
        position: relative;
        background: var(--white-color);
        padding: calc(11 / var(--btn-w) * 100%) calc(24 / var(--btn-w) * 100%);
        border: var(--orange-color-500) solid calc(2 / var(--font-size) * 1em);
        border-radius: 9999px;
    }
    .products-card-btn__in::before {
        content: "";
        display: block;
        width: calc(10 / var(--btn-w) * 100%);
        padding-top: calc(9 / var(--btn-w) * 100%);
        -webkit-mask: url("../img/common/btn-arrow.svg") no-repeat center;
        mask: url("../img/common/btn-arrow.svg") no-repeat center;
        -webkit-mask-size: contain;
        mask-size: contain;
        background: var(--orange-color-500);
        position: absolute;
        top: 50%;
        right: 0;
        margin-right: calc(14 / var(--btn-w) * 100%);
        transform: translateY(-50%);
    }
    .products-card-btn__body {
    }
    .products-card-btn-txt {
        text-align: center;
    }
    .products-card-btn-txt__label {
        color: var(--orange-color-500);
        font-size: calc(14 / var(--font-size) * 1em);
        font-weight: bold;
        letter-spacing: 0;
        line-height: 1;
    }
    .products-sec .page-btn__container {
        --content-w: 1024;
        --btn-mt: 65;
    }
    .allergy-centent {
        margin-top: calc(56 / 1280 * 100%);
    }
    .allergy-centent__in {
        background: var(--white-color);
        border-radius: calc(24 / var(--font-size) * 1em);
        padding: 0 calc(32 / 1280 * 100%);
    }
    .allergy-centent__body {
        --box-w: 972;
        padding: calc(32 / var(--box-w) * 100%) 0;
    }
    .allergy-centent-heading {
        text-align: center;
        margin-bottom: calc(18 / var(--box-w) * 100%);
    }
    .allergy-centent-heading__label {
        color: var(--orange-color-500);
        font-size: calc(18 / var(--font-size) * 1em);
        font-weight: bold;
    }
    .allergy-centent-read {
    }
    .allergy-centent-read-txt {
    }
    .allergy-centent-read-note {
    }
    .allergy-centent-read-txt {
    }
    .allergy-centent-read-note {
    }
    .allergy-centent-read-txt .c-txt,
    .allergy-centent-read-note .c-note-txt {
        letter-spacing: calc(40 / 1000 * 1em);
        font-family: var(--font-zen-kaku);
    }
}
@media all and (min-width: 768px) and (max-width: 992px) {
    .products-card-content-txt__label {
        font-size: calc(16 / 992 * 100vw);
    }
    .products-card-btn-txt__label {
        font-size: calc(14 / 992 * 100vw);
    }
    .page-btn-txt__label {
        font-size: calc(16 / 992 * 100vw);
    }
}
@media all and (min-width: 768px) and (max-width: 1064px) {
    .allergy-centent-heading__label {
        font-size: calc(18 / 1064 * 100vw);
    }
}
@media all and (max-width: 767px) {
    .products-sec {
        background: var(--yellow-color-100);
    }
    .bg-wave--strong {
        position: relative;
        margin-top: calc(-390 / 750 * 100vw);
        z-index: 0;
    }
    .bg-wave--strong::before {
        content: "";
        display: block;
        width: 100%;
        padding-top: calc(483 / 750 * 100vw);
        background: url("../img/common/wave-strong-bg-deco_sp.png") no-repeat center / contain;
        position: absolute;
        left: 50%;
        top: 0;
        transform: translateX(-50%);
        margin-top: calc(-483 / 750 * 100vw);
        z-index: -1;
    }
    .products-sec__in {
        position: relative;
        /* top: calc(-300 / 750 * 100vw); */
        right: 0;
        left: 0;
    }
    .products-sec__body {
        padding-top: calc(370 / 750 * 100vw);
    }
    .products-sec .page-heading {
        margin-bottom: calc(14 / 750 * 100vw);
    }
    .products-sec .page-heading__in {
        padding-top: calc(24 / 750 * 100vw);
        padding-bottom: calc(42 / 750 * 100vw);
        
    }
    .products-sec .page-heading__in::before {
        content: "";
        display: block;
        -webkit-mask-image: url("../img/common/sec-ttl-deco.png");
        mask-image: url("../img/common/sec-ttl-deco.png");
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        -webkit-mask-size: contain;
        mask-size: contain;
        background: var(--main-color-100);
        background: var(--green-color-10);
        width: calc(76 / 750 * 100vw);
        padding-top: calc(15 / 750 * 100vw);
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
    }
    .products-read-txt {
    }
    .products-read-txt .c-txt {
        letter-spacing: calc(40 / 1000 * 1em);
    }
    .products-list__container {
        --products-list-w: 952;
        padding: 0 calc(20 / 750 * 100vw);
        margin-top: calc(58 / 750 * 100vw);
    }
    .products-list {
        display: flex;
        flex-wrap: wrap;
        gap: calc(48 / 750 * 100vw) calc(10 / 750 * 100vw);
    }
    .products-list-item {
        width: calc((100% - (12 / 750 * 100vw)) / 2);
    }
    .products-card {
    }
    .products-card__in {
        --card-in-w: 202;
    }
    .products-card-content {
    }
    .products-card-content-img {
        width: calc(162 / 750 * 100vw);
        margin: 0 auto;
    }
    .products-card-content-txt {
        text-align: center;
        margin-top: calc(12 / 750 * 100vw);
    }
    .products-card-content-txt__label {
        font-size: calc(28 / 750 * 100vw);
        font-weight: 500;
        line-height: 1.4;
        letter-spacing: 0;
    }
    .products-card-btn__container {
        margin-top: calc(12 / 750 * 100vw);
    }
    .products-list-item--yummy .products-card-btn__container,
    .products-list-item--organic .products-card-btn__container {
        margin-top: calc(18 / 750 * 100vw);
    }
    .main-container ul.products-card-btn-list {
        width: calc(280 / 750 * 100vw);
        margin: 0 auto;
    }
    .products-card-btn-list-item {
    }
    .products-card-btn-list-item + .products-card-btn-list-item {
        margin-top: calc(17 / 750 * 100vw);
    }
    .products-card-btn {
        transition: all .3s ease;
        display: block;
    }
    .products-card-btn__in {
        position: relative;
        background: var(--white-color);
        padding: calc(18 / 750 * 100vw) calc(24 / 750 * 100vw);
        border: var(--orange-color-500) solid calc(2 / 750 * 100vw);
        border-radius: 9999px;
    }
    .products-card-btn__in::before {
        content: "";
        display: block;
        width: calc(15 / 750 * 100vw);
        padding-top: calc(15 / 750 * 100vw);
        -webkit-mask: url("../img/common/btn-arrow.svg") no-repeat center;
        mask: url("../img/common/btn-arrow.svg") no-repeat center;
        -webkit-mask-size: contain;
        mask-size: contain;
        background: var(--orange-color-500);
        position: absolute;
        top: 50%;
        right: 0;
        margin-right: calc(14 / 750 * 100vw);
        transform: translateY(-50%);
    }
    .products-card-btn__body {
    }
    .products-card-btn-txt {
        text-align: center;
    }
    .products-card-btn-txt__label {
        color: var(--orange-color-500);
        font-size: calc(24 / 750 * 100vw);
        font-weight: bold;
        letter-spacing: 0;
        line-height: 1;
    }
    .products-sec .page-btn__container {
        --content-w: 1024;
        --btn-mt: 65;
    }
    .allergy-centent {
        margin-top: calc(88 / 750 * 100vw);
    }
    .allergy-centent__in {
        background: var(--white-color);
        border-radius: calc(24 / 750 * 100vw);
        padding: 0 calc(32 / 750 * 100vw);
    }
    .allergy-centent__body {
        --box-w: 972;
        padding: calc(42 / 750 * 100vw) 0;
    }
    .allergy-centent-heading {
        text-align: center;
        margin-bottom: calc(18 / 750 * 100vw);
    }
    .allergy-centent-heading__label {
        color: var(--orange-color-500);
        font-size: calc(28 / 750 * 100vw);
        font-weight: bold;
        letter-spacing: calc(40 / 1000 * 1em);
    }
    .allergy-centent-read {
    }
    .allergy-centent-read-txt {
    }
    .allergy-centent-read-note {
    }
    .allergy-centent-read-txt {
    }
    .allergy-centent-read-note {
    }
    .allergy-centent-read-txt .c-txt,
    .allergy-centent-read-note .c-note-txt {
        font-family: var(--font-zen-kaku);
        letter-spacing: calc(40 / 1000 * 1em);
    }
}

/* --------------------------------------------------------------------------
  SCROLL-BAR
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
    .simplebar-track {
        display: none; /* スクロールバーのトラックを非表示にする */
    }

    .simplebar-content-wrapper {
        overflow: visible !important; /* 通常のスクロールバーを有効にする */
    }
}
@media all and (max-width: 767px) {
    .point-card-graph-content-item-img--table {
        background-color: #ffffff;
        padding-bottom: calc(40 / 750 * 100vw);
        overflow-x: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
      }
      .point-card-graph-content-item-img--table::-webkit-scrollbar {
        /* Chrome, Safari 対応 */
        display: none;
      }
      .simplebar-scrollbar::before {
        background: var(--orange-color-500);
        border-radius: 0;
        height: calc(16 / 750 * 100vw) !important;
        border-radius: 999px;
        margin-top: -2px;
      }
      .simplebar-scrollbar.simplebar-visible::before {
        opacity: 1;
      }
      .simplebar-track {
        background: var(--pink-color-10);
        height: calc(16 / 750 * 100vw) !important;
        border-radius: 999px;
        margin-right: calc(27 / 750 * 100vw);
      }
}
@media all and (max-width: 767px) {
    body {
        background: var(--yellow-color-100);
    }
}