@charset "UTF-8";

/* ===================================================================
CSS information
 file name  :  style.css
 style info : LPスタイル
=================================================================== */
body {
    max-width: 780px;
    margin: 0;
    padding: 0;
}

.content {
    background-color: #fff;
    color: #50587f;
    width: 100%;
    max-width: 780px;
    margin: 0 auto;
    font-family: "Zen Kaku Gothic New", 'Noto Sans JP', sans-serif, "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-feature-settings: "palt";
}

.content img {
    max-width: 100%;
    height: auto;
}

.wrapper {
    width: calc(100% - calc(80 / 780* 100vw));
    margin: 0 calc(40 / 780* 100vw);
    box-sizing: border-box;
}

.box_wrap {
    position: relative;
}

h2 {
    margin: 0 auto calc(112 / 780* 100vw);
    font-size: min(calc(60/780 * 100vw), 60px);
    letter-spacing: -0.08em;
    font-weight: 900;
    line-height: 0.82;
}

h2 span.h2_icon {
    font-size: min(calc(75/780 * 100vw), 75px);
    margin-left: calc(8 / 780* 100vw);
}

h2 span.h2_en {
    font-size: calc(24/780 * 100vw);
    font-family: "Oswald", sans-serif;
    letter-spacing: -0.01em;
    font-weight: 400;
}

h3 {
    margin: 0 auto calc(26 / 780* 100vw);
    font-size: min(calc(48/780 * 100vw), 48px);
    letter-spacing: -0.05em;
    font-weight: 900;
    line-height: 0.85;
}

h3.h3_ttl {
    margin: calc(-23 / 780* 100vw) auto calc(20 / 780* 100vw);
    font-size: calc(48/780 * 100vw);
    letter-spacing: -0.05em;
    font-weight: 900;
    line-height: 1.65;
}

@media screen and (min-width: 781px) {
    body {
        max-width: 100%;
        margin: 0 auto;
    }

    .content {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
    }

    .wrapper {
        width: min(calc(900 / 1400* 100vw), 900px);
        margin: 0 auto;
    }

    h2 {
        margin: 0 auto min(calc(112 / 1400* 100vw), 112px);
        font-size: min(calc(60/ 1400 * 100vw), 60px);
        letter-spacing: -0.08em;
        line-height: 0.82;
    }

    h2 span.h2_icon {
        font-size: min(calc(75/ 1400 * 100vw), 75px);
        margin-left: calc(8 / 1400* 100vw);
    }

    h2 span.h2_en {
        font-size: min(calc(24/ 1400 * 100vw), 24px);
        letter-spacing: -0.01em;
    }

    h3 {
        margin: 0 auto min(calc(26 / 1400* 100vw), 26px);
        font-size: min(calc(48/1400 * 100vw), 48px);
        letter-spacing: -0.05em;
        line-height: 0.85;
    }

    h3.h3_ttl {
        margin: min(calc(-23 / 1400* 100vw), -23px) auto min(calc(20 / 1400* 100vw), 20px);
        font-size: min(calc(48/1400 * 100vw), 48px);
        letter-spacing: -0.05em;
        line-height: 1.65;
    }
}

@media screen and (min-width: 1500px) {
    body {
        max-width: 100%;
        margin: 0 auto;
    }

    .content {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
    }
}

@media screen and (min-width: 1500px) {
    .wrapper {
        width: min(calc(1400 / 1400* 100vw), 1400px);
        margin: 0 auto;
    }
}

/* ===================================================================
fv
=================================================================== */
.fv::before {
    position: absolute;
    display: inline-block;
    content: 'FRUCTOSE';
    max-width: calc(780/780 * 100vw);
    width: 100%;
    height: 100%;
    font-size: calc(179/780 * 100vw);
    color: #edecf1;
    font-weight: bold;
    font-family: "Oswald", sans-serif;
    line-height: 0.7;
    letter-spacing: 0.035em;
    margin-left: calc(-8/780 * 100vw);
    overflow: hidden;
    z-index: -1;
}

.fv {
    position: relative;
    background: url(../img/fv_pattern.png) repeat top center/ auto;
    z-index: 1;
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 900;
}

.fv h1 {
    font-size: calc(60/780 * 100vw);
    text-align: center;
    color: #50587f;
    padding: calc(65 / 780* 100vw) 0 0;
    font-weight: 900;
    line-height: 1.18;
    letter-spacing: -0.07em;
    margin-bottom: calc(67 / 780* 100vw);
}

.fv span.fv_big_txt {
    font-size: calc(124/780 * 100vw);
}

.fv span.fv_red_txt {
    color: #ca254f;
    font-size: calc(85/780 * 100vw);
    font-weight: 900;
    letter-spacing: -0.14em;
    line-height: 1.05;
}

.fv span.fv_white_txt {
    position: relative;
    color: #fff;
    letter-spacing: -0.05em;
    margin-right: calc(25/780 * 100vw);
}

.fv span.fv_white_txt::before {
    position: absolute;
    display: block;
    content: '';
    background: #ca254f;
    border-radius: calc(5/780 * 100vw);
    width: calc(186/780 * 100vw);
    height: calc(102/780 * 100vw);
    top: 55%;
    left: 52%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    z-index: -2;
}

.fv_icon {
    font-size: calc(105/780 * 100vw);
    font-style: italic;
}

.fv_pic {
    width: calc(478/780 * 100vw);
    margin: 0 auto;
    text-align: center;
}

.fv_sub {
    font-size: calc(60/780 * 100vw);
    text-align: center;
    font-weight: 900;
    background: #ffeda3;
    padding: calc(90/780 * 100vw) 0 calc(40/780 * 100vw);
    letter-spacing: -0.06em;
    position: relative;
}

.fv_sub_line {
    background: linear-gradient(transparent 70%, #ffffff 70%);
    display: inline;
}


/*Scrollテキストの描写*/
.scroll span {
    color: #323639;
    font-size: calc(24/780 * 100vw);
    font-family: "Oswald", sans-serif;
    margin-top: calc(60/780 * 100vw);
    letter-spacing: 0.01em;
    font-weight: 500;
}

/* 丸の描写 */
.scroll:before {
    content: "";
    /*描画位置*/
    position: absolute;
    bottom: calc(-50/780 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    /*丸の形状*/
    width: calc(10/780 * 100vw);
    height: calc(10/780 * 100vw);
    border-radius: 50%;
    background: #323639;
    /*丸の動き1.6秒かけて透過し、永遠にループ*/
    animation:
        circlemove 1.6s ease-in-out infinite,
        cirlemovehide 1.6s ease-out infinite;
}

/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove {
    0% {
        bottom: calc(15/780 * 100vw);
    }

    100% {
        bottom: calc(-55/780 * 100vw);
    }
}

/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1;
    }

    80% {
        opacity: 0.9;
    }

    100% {
        opacity: 0;
    }
}

/* 線の描写 */
.scroll:after {
    content: "";
    /*描画位置*/
    position: absolute;
    bottom: calc(-50/780 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    /*線の形状*/
    width: calc(2/780 * 100vw);
    height: calc(80/780 * 100vw);
    background: #323639;
}

@media screen and (min-width: 781px) {
    .fv::before {
        width: 100%;
        font-size: min(calc(207/1400 * 100vw), 207px);
        line-height: 0.7;
        letter-spacing: 0.035em;
        margin: 0 auto;
        text-align: center;
        overflow: visible;
        text-align: center;
    }

    .fv h1 {
        font-size: min(calc(60/1400 * 100vw), 60px);
        padding: min(calc(65 / 1400* 100vw), 65px) 0 0;
        line-height: 1.18;
        letter-spacing: -0.07em;
        margin-bottom: min(calc(67 / 1400* 100vw), 67px);
    }

    .fv span.fv_big_txt {
        font-size: min(calc(124/1400 * 100vw), 124px);
    }

    .fv span.fv_red_txt {
        font-size: min(calc(85/1400 * 100vw), 85px);
        letter-spacing: -0.14em;
        line-height: 1.05;
    }

    .fv span.fv_white_txt {
        letter-spacing: -0.05em;
        margin-right: min(calc(25/1400 * 100vw), 25px);
    }

    .fv span.fv_white_txt::before {
        border-radius: min(calc(5/1400 * 100vw), 5px);
        width: min(calc(186/1400 * 100vw), 186px);
        height: min(calc(102/1400 * 100vw), 102px);
        top: 55%;
        left: 52%;
    }

    .fv_icon {
        font-size: min(calc(105/1400 * 100vw), 105px);
    }

    .fv_pic {
        width: calc(478/1400 * 100vw);
    }

    .fv_sub {
        font-size: min(calc(60/1400 * 100vw), 60px);
        padding: min(calc(90/1400 * 100vw), 90px) 0 min(calc(45/1400 * 100vw), 45px);
        letter-spacing: -0.08em;
    }

    .scroll span {
        font-size: min(calc(24/1400 * 100vw), 24px);
        margin-top: min(calc(60/1400 * 100vw), 60px);
    }

    .scroll {
        font-size: min(calc(24/1400 * 100vw), 24px);
        margin-top: min(calc(47/1400 * 100vw), 47px);
        letter-spacing: 0.01em;
    }

    /* 丸の描写 */
    .scroll:before {
        bottom: min(calc(-50/1400 * 100vw), -50px);
        width: min(calc(10/1400 * 100vw), 10px);
        height: min(calc(10/1400 * 100vw), 10px);
    }

    /* 線の描写 */
    .scroll:after {
        bottom: min(calc(-30/1400 * 100vw), -30px);
        width: min(calc(2/1400 * 100vw), 2px);
        height: min(calc(80/1400 * 100vw), 80px);
    }

    @keyframes circlemove {
        0% {
            bottom: min(calc(15/1400 * 100vw), 15px);
        }

        100% {
            bottom: min(calc(-55/1400 * 100vw), -55px);
        }
    }
}

@media screen and (min-width: 1500px) {
    .fv::before {
        font-size: min(calc(321/1400 * 100vw), 321px);
    }
}

/* ===================================================================
about
=================================================================== */

.about {
    background: #edecf1;
    padding: min(calc(118 / 780* 100vw), 118px) 0 min(calc(27 / 780* 100vw), 27px);
    line-height: 1.7;
}

.about_sub_ttl {
    font-size: min(calc(30/780 * 100vw), 30px);
    font-weight: 700;
    margin: 0 auto min(calc(132 / 780* 100vw), 132px);
    letter-spacing: 0.05em;
    line-height: 1.66;
}

.fruit_icon {
    position: absolute;
    left: calc(-15 / 780* 100vw);
    top: calc(-55 / 780* 100vw);
    width: calc(141 / 780* 100vw);
}

.about_pic03,
.about_pic {
    position: relative;
    width: calc(700/780 * 100vw);
    text-align: center;
    margin: 0 auto calc(34/780 * 100vw);
}

.about_pic02 {
    text-align: center;
    margin: 0 auto 0;
}

@media screen and (min-width: 781px) {
    .about {
        background: #edecf1;
        padding: min(calc(128 / 1400* 100vw), 128px) 0 min(calc(10 / 1400* 100vw), 10px);
    }

    .about_sub_ttl {
        font-size: min(calc(30/1400 * 100vw), 30px);
        margin: 0 auto min(calc(104 / 1400* 100vw), 104px);
        letter-spacing: 0.05em;
        line-height: 1.66;
    }

    .about_pic {
        width: min(calc(700/1400 * 100vw), 700px);
        margin: 0 auto min(calc(34/1400 * 100vw), 34px);
    }

    .fruit_icon {
        position: absolute;
        left: min(calc(-15/1400 * 100vw), -15px);
        top: min(calc(-42/1400 * 100vw), -42px);
        width: min(calc(141/1400 * 100vw), 141px);
    }

    .about_pic03 .fruit_icon {
        top: min(calc(-62/1400 * 100vw), -62px);
        left: min(calc(-26/1400 * 100vw), -26px);
    }

    .about_pic02 {
        margin: 0 auto;
    }

    .about_pic03 {
        width: min(calc(700/1400 * 100vw), 700px);
        margin: 0 auto min(calc(35 / 1400* 100vw), 35px);
    }
}

@media screen and (min-width: 1500px) {
    .about {
        padding: min(calc(128 / 1400* 100vw), 128px) 0 min(calc(107 / 1400* 100vw), 107px);
    }

    .about_sub_ttl {
        margin: 0 auto min(calc(204 / 1400* 100vw), 204px);
    }

    .about_pic03 {
        margin: 0 auto min(calc(135 / 1400* 100vw), 135px);
    }

    .about_pic03 .fruit_icon {
        top: min(calc(-42 / 1400* 100vw), -42px);
    }

    .about_pic02 {
        margin: 0 auto min(calc(28 / 1400* 100vw), 28px);
    }

    .about .about_wrap:last-of-type .content_txt:last-child {
        margin-bottom: 0;
    }
}

.content_txt {
    font-size: calc(30/780 * 100vw);
    font-weight: 700;
    margin: 0 auto calc(118 / 780* 100vw);
    letter-spacing: 0.05em;
    line-height: 1.66;
}

.content_txt02 {
    margin: 0 auto calc(94 / 780* 100vw);
}

span.red_bg {
    background: #ca254f;
    color: #fff;
    padding-left: calc(5/780 * 100vw);
}

/* ===================================================================
features
=================================================================== */

.features {
    background: #fff;
    padding: calc(154 / 780* 100vw) 0 calc(170 / 780* 100vw);
    line-height: 1.7;
}

.features h2 {
    margin: 0 auto calc(84 / 780* 100vw);
    font-size: calc(60/ 780 * 100vw);
    letter-spacing: -0.08em;
    line-height: 0.9;
}

.features .content_txt {
    margin: 0 auto calc(140 / 780* 100vw);
}

.features h2 span.h2_icon {
    font-size: calc(75/ 780 * 100vw);
    margin-left: calc(8 / 780* 100vw);
}

.features h2 span.h2_en {
    font-size: calc(24/ 780 * 100vw);
    letter-spacing: -0.01em;
}

.features h3 {
    margin: 0 auto calc(54 / 780* 100vw);
    font-size: calc(48/780 * 100vw);
    letter-spacing: -0.05em;
    line-height: 0.85;
}

.features h3.h3_ttl {
    margin: calc(-23 / 780* 100vw) auto calc(20 / 780* 100vw);
    font-size: calc(48/780 * 100vw);
    letter-spacing: -0.05em;
    line-height: 1.65;
}

.features_pic {
    width: calc(630/780 * 100vw);
    display: block;
    text-align: center;
    margin: 0 auto;
}

.features .calorie_01 {
    width: calc(630/780 * 100vw);
}

.features_pic02 {
    display: flex;
    text-align: center;
    justify-content: space-evenly;
    margin: 0 auto calc(142 / 780* 100vw);
}

.features_pic02 p {
    width: calc(284/780 * 100vw);
}

.fat_01 {
    width: calc(630/780 * 100vw);
    margin: 0 auto calc(135 / 780* 100vw);
}

.features_pic p:first-child {
    margin: calc(32 / 780* 100vw) auto calc(22 / 780* 100vw);
}

.features_pic p:last-child {
    margin: 0 auto calc(55 / 780* 100vw);
}

.features .about_pic {
    margin: 0 auto calc(34/780 * 100vw);
}

.features .about_pic02 {
    margin: 0 auto calc(28/780 * 100vw);
}

.features .about_pic03 {
    margin: 0 auto calc(150 / 780* 100vw);
}

@media screen and (min-width: 781px) {
    .features {
        padding: min(calc(154 / 1400* 100vw), 154px) 0 min(calc(175 / 1400* 100vw), 175px);
        line-height: 1.7;
    }


    .features h2 {
        margin: 0 auto min(calc(92 / 1400* 100vw), 92px);
        font-size: min(calc(60/ 1400 * 100vw), 60px);
        letter-spacing: -0.08em;
        line-height: 0.82;
    }

    .features h2 span.h2_icon {
        font-size: min(calc(75/ 1400 * 100vw), 75px);
        margin-left: calc(8 / 1400* 100vw);
    }

    .features h2 span.h2_en {
        font-size: min(calc(24/ 1400 * 100vw), 24px);
        letter-spacing: -0.01em;
    }

    .features h3 {
        margin: 0 auto min(calc(26 / 1400* 100vw), 26px);
        font-size: min(calc(48/1400 * 100vw), 48px);
        letter-spacing: -0.05em;
        line-height: 0.85;
    }

    .features h3.h3_ttl {
        margin: min(calc(-23 / 1400* 100vw), -23px) auto min(calc(20 / 1400* 100vw), 20px);
        font-size: min(calc(48/1400 * 100vw), 48px);
        letter-spacing: -0.05em;
        line-height: 1.65;
    }

    .features .content_txt {
        margin: 0 auto min(calc(94 / 1400* 100vw), 94px);
    }

    .features_pic {
        display: block;
        width: min(calc(630 / 1400* 100vw), 630px);
        margin: min(calc(64/1400 * 100vw), 64px) auto 0;
    }

    .features .calorie_01 {
        width: min(calc(630 / 1400* 100vw), 630px);
    }

    .features_pic02 p {
        width: min(calc(284 / 1400* 100vw), 284px);
    }

    .fat_01 {
        width: min(calc(630 / 1400* 100vw), 630px);
        margin: min(calc(75 / 1400* 100vw), 75px) auto min(calc(110 / 1400* 100vw), 110px);
    }

    .features_pic p:last-child {
        margin: 0 auto min(calc(52/1400 * 100vw), 52px);
    }

    .features_pic02 {
        width: min(calc(621/1400 * 100vw), 621px);
        justify-content: space-between;
        margin: 0 auto min(calc(110 / 1400* 100vw), 110px);
    }

    .features .about_pic {
        margin: 0 auto min(calc(34/1400 * 100vw), 34px);
    }

    .features .about_pic02 {
        margin: 0 auto min(calc(28/1400 * 100vw), 28px);
    }

    .features .about_pic03 {
        margin: 0 auto min(calc(150 / 1400* 100vw), 150px);
    }

    .features .features_wrap:first-of-type .content_txt:last-child {
        margin: 0 auto min(calc(125 / 1400* 100vw), 125px);
    }
}

@media screen and (min-width: 1500px) {
    .features {
        padding: min(calc(154 / 1400* 100vw), 154px) 0 min(calc(170 / 1400* 100vw), 170px);
    }

    .features .content_txt {
        margin: 0 auto min(calc(136 / 1400* 100vw), 136px);
    }

    .features_pic {
        width: min(calc(1285 / 1400* 100vw), 1285px);
        display: flex;
        justify-content: space-evenly;
    }

    .features .fat_01 {
        margin: min(calc(80 / 1400* 100vw), 80px) auto min(calc(95 / 1400* 100vw), 95px);
    }

    .features h3 {
        margin: 0 auto min(calc(60 / 1400* 100vw), 60px);
    }

    .features_pic p:first-child {
        margin: 0 auto min(calc(70 / 1400* 100vw), 70px);
    }

    .features_pic p:last-child {
        margin: 0 auto min(calc(52 / 1400* 100vw), 52px);
    }

    .features_pic02 {
        width: min(calc(621 / 1400* 100vw), 621px);
        justify-content: space-between;
        margin: 0 auto min(calc(75 / 1400* 100vw), 75px);
    }

    .features .blood_01 {
        margin: min(calc(130 / 1400* 100vw), 130px) auto 0;
    }

    .features .features_wrap:first-of-type .content_txt:last-child {
        margin: 0 auto min(calc(102 / 1400* 100vw), 102px);
    }
}

/* ===================================================================
food
=================================================================== */
.food {
    background: #edecf1;
    padding: calc(140 / 780* 100vw) 0 calc(140 / 780* 100vw);
    line-height: 1.7;
}

.food h2 {
    margin: 0 auto calc(15 / 780* 100vw);
    font-size: calc(60/ 780 * 100vw);
    letter-spacing: -0.08em;
    line-height: 1.5;
    position: relative;
}

.food h2 span.h2_en {
    position: absolute;
    bottom: calc(-40/ 780 * 100vw);
    left: 0;
    font-size: calc(24/ 780 * 100vw);
    letter-spacing: -0.01em;
}

.food h3 {
    margin: 0 auto calc(26 / 780* 100vw);
    font-size: calc(48/780 * 100vw);
    letter-spacing: -0.05em;
    line-height: 0.85;
}

.food h3.h3_ttl {
    margin: calc(-23 / 780* 100vw) auto calc(20 / 780* 100vw);
    font-size: calc(48/780 * 100vw);
    letter-spacing: -0.05em;
    line-height: 1.65;
}

.food_pic {
    width: calc(601/780 * 100vw);
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin: 0 auto;
}

.food_pic_01 {
    width: calc(663/780 * 100vw);
    margin: 0 auto calc(85 / 780* 100vw);
    text-align: center;
}

.food .about_pic {
    margin: 0 auto calc(34/780 * 100vw);
}

.food .about_pic02 {
    margin: 0 auto calc(28/780 * 100vw);
}

.food .about_pic03 {
    margin: 0 auto calc(150 / 780* 100vw);
}

.food_pic p:first-child {
    width: calc(89/780 * 100vw);
}

.food_pic p:nth-child(2) {
    width: calc(68/780 * 100vw);
}

.food_pic p:nth-child(3) {
    width: calc(114/780 * 100vw);
}

.food_pic p:nth-child(4) {
    width: calc(114/780 * 100vw);
}

@media screen and (min-width: 781px) {
    .content_txt {
        font-size: min(calc(30/1400 * 100vw), 30px);
        margin: 0 auto min(calc(130 / 1400* 100vw), 130px);
        letter-spacing: 0.05em;
        line-height: 1.66;
    }

    .content_txt02 {
        margin: 0 auto min(calc(106 / 1400* 100vw), 106px);
    }

    .content_txt span.red_bg {
        padding-left: min(calc(5/1400 * 100vw), 5px);
    }

    .food {
        padding: min(calc(158 / 1400* 100vw), 158px) 0 min(calc(130 / 1400* 100vw), 130px);
        line-height: 1.7;
    }

    .food h2 {
        margin: 0 auto min(calc(80 / 1400* 100vw), 80px);
        font-size: min(calc(60/ 1400 * 100vw), 60px);
        letter-spacing: -0.08em;
        line-height: 0.82;
    }

    .food h2 span.h2_icon {
        font-size: min(calc(75/ 1400 * 100vw), 75px);
        margin-left: calc(8 / 1400* 100vw);
    }

    .food h2 span.h2_en {
        font-size: min(calc(24/ 1400 * 100vw), 24px);
        letter-spacing: -0.01em;
        bottom: min(calc(-40/ 1400 * 100vw), -40px);
    }

    .food h3 {
        margin: 0 auto min(calc(26 / 1400* 100vw), 26px);
        font-size: min(calc(48/1400 * 100vw), 48px);
        letter-spacing: -0.05em;
        line-height: 0.85;
    }

    .food h3.h3_ttl {
        margin: min(calc(-23 / 1400* 100vw), -23px) auto min(calc(20 / 1400* 100vw), 20px);
        font-size: min(calc(48/1400 * 100vw), 48px);
        letter-spacing: -0.05em;
        line-height: 1.65;
    }

    .food_pic {
        margin: min(calc(73 / 1400* 100vw), 73px) auto 0;
        width: min(calc(601 / 1400* 100vw), 601px);
    }

    .food_pic_01 {
        width: min(calc(663 / 1400* 100vw), 663px);
        margin: 0 auto min(calc(135 / 1400* 100vw), 135px);
        text-align: center;
    }

    .food .about_pic {
        margin: 0 auto min(calc(34/1400 * 100vw), 34px);
    }

    .food_pic p:first-child {
        width: min(calc(89/1400 * 100vw), 89px);
    }

    .food_pic p:nth-child(2) {
        width: min(calc(68/1400 * 100vw), 68px);
    }

    .food_pic p:nth-child(3) {
        width: min(calc(114/1400 * 100vw), 114px);
    }

    .food_pic p:nth-child(4) {
        width: min(calc(114/1400 * 100vw), 114px);
    }
}

@media screen and (min-width: 1500px) {
    .food {
        padding: min(calc(208 / 1400* 100vw), 208px) 0 min(calc(158 / 1400* 100vw), 158px);
    }

    .content_txt02 {
        margin: 0 auto min(calc(78 / 1400* 100vw), 78px);
    }

    .food h2 span.h2_en {
        bottom: min(calc(-30 / 1400* 100vw), -30px);
    }

    .food_pic_01 {
        margin: 0 auto min(calc(70 / 1400* 100vw), 70px);
    }

    .food_pic {
        margin: min(calc(85 / 1400* 100vw), 85px) auto 0;
    }
}

/* ===================================================================
safe
=================================================================== */
.safe {
    background: #fff;
    padding: calc(142 / 780* 100vw) 0 0;
    line-height: 1.7;
}

.safe h2 {
    margin: 0 auto calc(110 / 780* 100vw);
    font-size: calc(60/ 780 * 100vw);
    letter-spacing: -0.08em;
    line-height: 1.37;
    position: relative;
}

.safe h2 span.h2_en {
    position: absolute;
    left: 0;
    bottom: calc(-40 / 780* 100vw);
}

.safe h3 {
    margin: 0 auto calc(50 / 780* 100vw);
}

.safe_pic {
    display: flex;
    text-align: center;
    justify-content: space-evenly;
    margin: 0 auto calc(42 / 780* 100vw);
}
.safe_pic p:not(:last-child) {
    margin-right: calc(4 / 780* 100vw);
}

.safe .ice h3 {
    line-height: 1.62;
    margin: 0 auto calc(62 / 780* 100vw);
}

.safe .ice_pic {
    width: 100vw;
    text-align: center;
    margin: 0 calc(50% - 50vw) calc(90 / 780* 100vw);
    overflow: hidden;
}

.ice_pic img{
    max-width: calc(837/780 * 100vw);
    width: 100%;
}
.safe_01 p:first-child {
    width: 100vw;
    margin: 0 calc(50% - 50vw) 0;
    display: block;
    text-align: center;
    overflow: hidden;
}

.safe_01 p:nth-child(2) {
    width: calc(630/780 * 100vw);
    margin: 0 auto calc(70 / 780* 100vw);
}

@media screen and (min-width: 781px) {
    .safe {
        background: #fff;
        padding: min(calc(142 / 1400* 100vw), 142px) 0 min(calc(80 / 1400* 100vw), 80px);
        line-height: 1.7;
    }

    .safe h2 {
        margin: 0 auto min(calc(110 / 1400* 100vw), 110px);
        font-size: min(calc(60/ 1400 * 100vw), 60px);
        letter-spacing: -0.08em;
        line-height: 1.37;
    }

    .safe h2 span.h2_en {
        bottom: min(calc(-40 / 1400* 100vw), -40px);
    }

    .safe h3 {
        margin: 0 auto min(calc(50 / 1400* 100vw), 50px);
    }

    .safe .one_day {
        margin-top: min(calc(138 / 1400* 100vw), 138px);
    }

    .safe_pic {
        margin: 0 auto min(calc(42 / 1400* 100vw), 42px);
        max-width: min(calc(700 / 1400* 100vw), 700px);
    }

    .safe_pic p:not(:last-child) {
        margin-right: min(calc(4 / 1400* 100vw), 4px);
    }

    .safe_01{
        text-align: center;
    }
    .safe_01 p:first-child {
        display: contents;
        width: min(calc(812 / 1400* 100vw), 812px);
        margin: 0 auto 0;
    }

    .safe_01 p:nth-child(2) {
        width: min(calc(630 / 1400* 100vw), 630px);
        margin: 0 auto min(calc(70 / 1400* 100vw), 70px);
    }

    .safe .ice h3 {
        line-height: 1.62;
        margin: 0 auto min(calc(62 / 1400* 100vw), 62px);
    }

    .safe .ice_pic {
        max-width: min(calc(837 / 1400* 100vw), 837px);
        text-align: center;
        margin: 0 auto min(calc(98 / 1400* 100vw), 98px);
    }
}

@media screen and (min-width: 1500px) {
    .safe {
        padding: min(calc(142 / 1400* 100vw), 142px) 0 min(calc(30 / 1400* 100vw), 30px);
    }

    .safe_01 p:first-child {
        display: block;
        width: 60%;
        flex-shrink: 0;
    }

    .safe_01 p:nth-child(2) {
        margin: min(calc(18 / 1400* 100vw), 18px) auto min(calc(70 / 1400* 100vw), 70px) min(calc(-55 / 1400* 100vw), -55px);
        flex-shrink: 0;
    }

    .safe_01 {
        display: flex;
        align-items: center;
        margin: 0 auto min(calc(38 / 1400* 100vw), 38px);
    }

    .safe .safe_wrap:nth-of-type(3) .content_txt:last-child {
        margin: 0 auto min(calc(98 / 1400* 100vw), 98px);
    }

    .safe .ice h3 {
        margin: 0 auto min(calc(72 / 1400* 100vw), 72px);
    }

    .safe .ice_pic {
        margin: 0 78.2% min(calc(90 / 1400* 100vw), 90px) 22.8%;
    }
    .safe h2 span.h2_en {
        bottom: min(calc(-30 / 1400* 100vw), -30px);
    }
}

/* ===================================================================
footer
=================================================================== */
.footer::before {
    position: absolute;
    display: inline-block;
    content: 'CHECK';
    max-width: calc(780/780 * 100vw);
    width: 100%;
    height: 100%;
    font-size: calc(276/780 * 100vw);
    color: #fff;
    font-weight: bold;
    font-family: "Oswald", sans-serif;
    line-height: 0.7;
    letter-spacing: 0.035em;
    margin-left: calc(-8/780 * 100vw);
    overflow: hidden;
    z-index: -1;
}

.footer {
    position: relative;
    background: #edecf1;
    z-index: 1;
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 900;
    padding: 0 0 calc(10/780 * 100vw);
}

.footer h1 {
    font-size: calc(60/780 * 100vw);
    text-align: center;
    color: #50587f;
    padding: calc(144 / 780* 100vw) 0 0;
    font-weight: 900;
    line-height: 1.4;
    letter-spacing: -0.03em;
    margin-bottom: calc(45 / 780* 100vw);
}

.footer h1 span {
    position: relative;
    color: #fff;
    margin-right: calc(10/780 * 100vw);
    padding: 0 calc(10/780 * 100vw);
    letter-spacing: -0.15em;
}

.footer h1 span.red_bg_f::before {
    position: absolute;
    content: '';
    top: 0;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    color: #fff;
    background: #ca254f;
    width: calc(385 / 780* 100vw);
    height: calc(71 / 780* 100vw);

    border-radius: calc(5 / 780* 100vw);
    z-index: -1;
}

.footer_icon {
    font-size: calc(105/780 * 100vw);
    font-style: italic;
}

.footer_pic {
    position: relative;
    text-align: center;
    width: calc(567/780 * 100vw);
    margin: 0 auto calc(105/780 * 100vw);
}

.footer_cite {
    font-size: calc(16/780 * 100vw);
    font-weight: 500;
    color: #50587f;
}

.footer_cite p {
    margin-bottom: calc(5 / 780* 100vw);
}

.footer_cite cite {
    font-weight: 500;
}

.footer_cite a {
    color: #50587f;
}

cite:after,
cite:before {
    display: none;
}

@media screen and (min-width: 781px) {
    .footer {
        padding: 0 0 min(calc(10/1400 * 100vw), 10px);
    }

    .footer::before {
        width: 100%;
        font-size: min(calc(319/1400 * 100vw), 319px);
        line-height: 0.7;
        letter-spacing: 0.035em;
        margin: 0 auto;
        text-align: center;
        overflow: visible;
        text-align: center;
    }

    .footer h1 {
        font-size: min(calc(60/1400 * 100vw), 60px);
        padding: min(calc(153 / 1400* 100vw), 153px) 0 0;
        line-height: 1.3;
        letter-spacing: -0.07em;
        margin-bottom: min(calc(67 / 1400* 100vw), 67px);
    }

    .footer h1 span.red_bg_f::before {
        top: 52%;
        left: 0%;
        width: min(calc(385 / 1400* 100vw), 385px);
        height: min(calc(71 / 1400* 100vw), 71px);
        border-radius: min(calc(5 / 1400* 100vw), 5px);
        z-index: -1;
    }

    .footer_icon {
        font-size: min(calc(105/1400 * 100vw), 105px);
    }

    .footer_pic {
        width: min(calc(567/1400 * 100vw), 567px);
        margin: 0 auto min(calc(105/1400 * 100vw), 105px);
    }

    .footer_cite {
        font-size: min(calc(16/1400 * 100vw), 16px);
    }

    .footer_cite p {
        margin-bottom: min(calc(10/1400 * 100vw), 10px);
    }
}

@media screen and (min-width: 1500px) {
    .footer::before {
        font-size: min(calc(489/1400 * 100vw), 489px);
    }
}

/* ===================================================================
slide
=================================================================== */
.slide-container {
    display: flex;
    align-items: baseline;
    flex-wrap: nowrap;
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    overflow: hidden;
    position: absolute;
    z-index: 1;
    top: calc(670/780 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.slide-container02 {
    position: absolute;
    top: calc(-80/780 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.slide-wrapper {
    min-width: 300vw;
    display: flex;
    align-items: baseline;
    flex-wrap: nowrap;
    justify-content: space-around;
    margin: 0 calc(20/780 * 100vw);
    padding: 0;
    animation: slide-flow 10s infinite linear 0.5s both;
}

.slide {
    width: 100%;
    flex: 0 0 auto;
    animation: dance 1.5s linear infinite 0.5s;
}

.slide:not(:last-child) {
    margin-right: calc(40/780 * 100vw);
}

/* スライドのサイズは固定 */
.slide-wrapper .footer_food_01 {
    width: calc(102/780 * 100vw);
    height: calc(131/780 * 100vw);
}

.slide-wrapper .footer_food_02 {
    width: calc(113/780 * 100vw);
    height: calc(54/780 * 100vw);
}

.slide-wrapper .footer_food_03 {
    width: calc(95/780 * 100vw);
    height: calc(61/780 * 100vw);
}

.slide-wrapper .footer_food_04 {
    width: calc(79/780 * 100vw);
    height: calc(79/780 * 100vw);
}

.slide-wrapper .footer_food_05 {
    width: calc(48/780 * 100vw);
    height: calc(79/780 * 100vw);
}

.slide-wrapper .footer_food_06 {
    width: calc(47/780 * 100vw);
    height: calc(159/780 * 100vw);
}

.slide-wrapper .footer_food_07 {
    width: calc(47/780 * 100vw);
    height: calc(103/780 * 100vw);
}

.slide-wrapper .footer_food_08 {
    width: calc(63/780 * 100vw);
    height: calc(109/780 * 100vw);
}

.slide-wrapper .footer_food_09 {
    width: calc(86/780 * 100vw);
    height: calc(86/780 * 100vw);
}

.slide-wrapper .footer_food_10 {
    width: calc(96/780 * 100vw);
    height: calc(116/780 * 100vw);
}

.slide-wrapper .footer_food_11 {
    width: calc(137/780 * 100vw);
    height: calc(70/780 * 100vw);
}

.slide-wrapper .footer_food_12 {
    width: calc(89/780 * 100vw);
    height: calc(88/780 * 100vw);
}

.slide-wrapper .footer_food_13 {
    width: calc(53/780 * 100vw);
    height: calc(88/780 * 100vw);
}

.slide-wrapper .footer_food_14 {
    width: calc(92/780 * 100vw);
    height: calc(67/780 * 100vw);
}

.slide-wrapper .footer_food_15 {
    width: calc(87/780 * 100vw);
    height: calc(59/780 * 100vw);
}

@keyframes slide-flow {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

@keyframes dance {

    0%,
    100% {
        transform: rotate(10deg);
    }

    50% {
        transform: rotate(-10deg);
    }
}

@media screen and (min-width: 781px) {
    .slide-container {
        top: min(calc(600/1400 * 100vw), 600px);
        align-items: baseline;
    }

    .slide-container02 {
        top: min(calc(-80/1400 * 100vw), -80px);
    }

    .slide-wrapper {
        display: flex;
        min-width: 100vw;
        align-items: baseline;
        justify-content: space-around;
        margin: 0 min(calc(20/1400 * 100vw), 20px);
    }

    .slide {
        flex: 0 0 auto;

    }

    .slide:not(:last-child) {
        margin-right: min(calc(40/1400 * 100vw), 40px);
    }

    .slide-wrapper .footer_food_01 {
        width: min(calc(102/1400 * 100vw), 102px);
        height: min(calc(131/1400 * 100vw), 131px);
    }

    .slide-wrapper .footer_food_02 {
        width: min(calc(113/1400 * 100vw), 113px);
        height: min(calc(54/1400 * 100vw), 54px);
    }

    .slide-wrapper .footer_food_03 {
        width: min(calc(95/1400 * 100vw), 95px);
        height: min(calc(61/1400 * 100vw), 61px);
    }

    .slide-wrapper .footer_food_04 {
        width: min(calc(79/1400 * 100vw), 79px);
        height: min(calc(79/1400 * 100vw), 79px);
    }

    .slide-wrapper .footer_food_05 {
        width: min(calc(48/1400 * 100vw), 48px);
        height: min(calc(79/1400 * 100vw), 79px);
    }

    .slide-wrapper .footer_food_06 {
        width: min(calc(47/1400 * 100vw), 47px);
        height: min(calc(159/1400 * 100vw), 159px);
    }

    .slide-wrapper .footer_food_07 {
        width: min(calc(47/1400 * 100vw), 47px);
        height: min(calc(103/1400 * 100vw), 103px);
    }

    .slide-wrapper .footer_food_08 {
        width: min(calc(63/1400 * 100vw), 63px);
        height: min(calc(109/1400 * 100vw), 109px);
    }

    .slide-wrapper .footer_food_09 {
        width: min(calc(86/1400 * 100vw), 86px);
        height: min(calc(86/1400 * 100vw), 86px);
    }

    .slide-wrapper .footer_food_10 {
        width: min(calc(96/1400 * 100vw), 96px);
        height: min(calc(116/1400 * 100vw), 116px);
    }

    .slide-wrapper .footer_food_11 {
        width: min(calc(137/1400 * 100vw), 137px);
        height: min(calc(70/1400 * 100vw), 70px);
    }

    .slide-wrapper .footer_food_12 {
        width: min(calc(89/1400 * 100vw), 89px);
        height: min(calc(88/1400 * 100vw), 88px);
    }

    .slide-wrapper .footer_food_13 {
        width: min(calc(53/1400 * 100vw), 53px);
        height: min(calc(88/1400 * 100vw), 88px);
    }

    .slide-wrapper .footer_food_14 {
        width: min(calc(92/1400 * 100vw), 92px);
        height: min(calc(67/1400 * 100vw), 67px);
    }

    .slide-wrapper .footer_food_15 {
        width: min(calc(87/1400 * 100vw), 87px);
        height: min(calc(59/1400 * 100vw), 59px);
    }
}

@media screen and (min-width: 1500px) {
    .slide-container {
        top: min(calc(600 / 1400* 100vw), 600px);
    }

    .slide-container02 {
        top: min(calc(-80 / 1400* 100vw), -80px);
    }
}