@charset "UTF-8";

/**************************************************************************************************
    Media ALL (共通)
***************************************************************************************************/

    #purin_daihuku {
        color: #333333;
        font-family: "Source Han Serif JP", "Noto Serif CJK JP", "游明朝体", "Yu Mincho", YuMincho, serif;
        font-weight: 600;
    }

    #purin-topic6 h4 {
        color: #333333;
        font-family: "Noto Sans JP", sans-serif;
        font-weight: 600;
    }

    #purin_daihuku a {
        color: #000;
        text-decoration: none;
        transition: 0.4s;
    }

    #purin_daihuku a:hover {
        opacity: 0.6;
    }

    #purin_daihuku {
        font-size: 20px;
        font-weight: 500;
        margin: 0;
        padding: 0;
        line-height: 1.5;
        overflow-wrap: break-word;
        word-break: break-all;
    }

    #purin_daihuku h1,
    #purin_daihuku h2,
    #purin_daihuku h3,
    #purin_daihuku h4,
    #purin_daihuku h5 {
        margin: 0;
        padding: 0;
    }

    #purin_daihuku ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #purin_daihuku img {
        width: 100%;
    }

    #purin_daihuku .edoya-inner {
        padding: 0;
    }

    #purin_daihuku .purin_daihuku-shop-link {
        text-align: center;
        margin: min(10vw, 50px);
    }

    #purin_daihuku .purin_daihuku-shop-link a {
        display: inline-block;
        font-size: 23px;
        padding: 1em 1.5em;
        background: #CA2A1E;
        color: #fff;
        border-radius: 100vw;
    }

    #purin_daihuku .appeal {
        color: #CA2D1E;
    }

    #purin_daihuku header .purin-header__box {
        width: min(100%, 1175px);
        margin: 20px auto;
        color: #fff;
        position: relative;
    }

    #purin_daihuku header .purin-header__box h1 {
        font-size: 50px;
        position: absolute;
        top: 90px;
        right: 170px;
    }

    #purin_daihuku header .purin-header__box p {
        font-size: 30px;
        font-family: 'ten-mincho', serif;
        position: absolute;
        top: 300px;
        right: 70px;
    }

    #purin-topic6 {
        background: #F5EDE2;
        padding: 50px 0;
    }

    #purin-topic6 .edoya-inner {
        width: 50%;
    }

    #purin-topic6 h4 {
        font-size: 25px;
        line-height: 1.5;
        margin-bottom: 1em;
    }

    #purin-topic6 .purin-topic6__youtube {
        position: relative;
        width: 100%;
        padding-top: 56.25%;
    }

    #purin-topic6 .purin-topic6__youtube iframe {
        position: absolute;
        top: 0;
        right: 0;
        width: 100% !important;
        height: 100% !important;
    }

    #purin-topic1 {
        background: linear-gradient(#fff, #FAE7E3, #fff);
        text-align: center;
    }

    #purin-topic1 .point1 {
        line-height: 2.5;
        font-size: 23px;
        width: 70%;
        margin: 0 auto;
    }

    #purin-topic1 .point1 .point1-img {
        position: relative;
        text-align: left;
        margin: 50px 20px;
    }

    #purin-topic1 .point1 .point1-img img:nth-child(1) {
        width: 400px;
    }

    #purin-topic1 .point1 .point1-img img:nth-child(2) {
        width: 172px;
        position: absolute;
        top: 0;
        left: 50%;
    }

    #purin-topic1 .point1 .point1-img img:nth-child(3) {
        width: 172px;
        position: absolute;
        top: 30%;
        left: 70%;
    }

    #purin-topic1 .point1 .point1-img img:nth-child(4) {
        width: 172px;
        position: absolute;
        bottom: 0;
        left: 50%;
    }

    #purin-topic1 .point2 h3 {
        font-size: 30px;
        padding: 25px 0;
        line-height: 1.5;
    }

    #purin-topic1 .point2 p {
        font-size: 20px;
        padding: 25px 0;
        line-height: 2.0;
    }

    #purin-topic1 .point2 p a {
        color: #DAA343;
        text-decoration: underline;
    }

    #purin-topic2 {
        margin-top: 100px;
    }

    #purin-topic2 .edoya-inner {
        background: url(../img/purin_daihuku/p_bg.webp) center top no-repeat;
        padding: 50px 90px 100px;
    }

    #purin-topic2 .review h2 {
        font-family: 'ten-mincho', serif;
        text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
        font-size: 60px;
        margin-bottom: 50px;
    }

    #purin-topic2 .review ul {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
    }

    #purin-topic2 .review ul li {
        background: #fff url(../img/purin_daihuku/bg_voice.webp) center top no-repeat;
        width: 48%;
        display: inline-block;
        padding: 2em;
        vertical-align: top;
        height: auto;
    }

    #purin-topic2 .review ul li h4 {
        font-size: 40px;
        color: #CA2D1E;
        margin-bottom: 0.5em;
    }

    #purin-topic2 .review ul li p {
        font-size: 20px;
    }

    #purin-topic3 .scene {
        text-align: center;
        padding: 100px 100px 20px;
    }

    #purin-topic3 .scene h2,
    #purin-topic4 .howtoeat h2,
    #purin-topic5 h2 {
        text-align: center;
        font-size: 35px;
        position: relative;
        z-index: 0;
        line-height: 1.3;
    }

    #purin-topic3 .scene h2::before,
    #purin-topic4 .howtoeat h2::before,
    #purin-topic5 h2::before {
        background: #FEF2B6;
        content: "";
        z-index: -1;
        filter: blur(10px);
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }

    #purin-topic3 .scene ul {
        display: flex;
        justify-content: space-between;
    }

    #purin-topic3 .scene ul li {
        width: min(32%, 370px);
        text-align: left;
    }

    #purin-topic3 .scene ul li h4 {
        font-size: 30px;
        color: #CA2D1E;
        margin: 1.5em 0 0.5em;
    }

    #purin-topic3 .scene ul li p {
        font-size: 20px;
        line-height: 1.8;
        margin-top: 0.5em;
    }

    #purin-topic4 .howtoeat {
        text-align: center;
        padding: 100px 100px 20px;
    }

    #purin-topic4 .howtoeat ul {
        display: flex;
        justify-content: space-between;
    }

    #purin-topic4 .howtoeat ul li {
        width: min(32%, 370px);
        text-align: left;
    }

    #purin-topic4 .howtoeat ul li h4 {
        font-size: 25px;
        color: #CA2D1E;
        margin: 1.5em 0 0.5em;
    }

    #purin-topic4 .howtoeat ul li p {
        font-size: 20px;
        line-height: 1.8;
        margin-top: 0.5em;
    }

    #purin-topic5 .edoya-inner {
        padding: 100px 100px 0;
    }

    #purin-topic5 .cartin1 {
        text-align: center;
        font-size: 22px;
        margin: 40px 0;
    }

    #purin-topic5 .cart-text {
        max-width: 700px;
        margin: auto;
    }

    #purin-topic5 .cart-text p {
        font-size: 18px;
    }

    #purin-topic5 .cart-text p span {
        font-size: 18px;
        color: #3c8ef2;
    }





/**************************************************************************************************
    Media Query (横幅1366px以下)
***************************************************************************************************/
@media (max-width: 1366px) {

    #purin_daihuku header .purin-header__box h1 {
        font-size: min(4vw, 50px);
    }

    #purin_daihuku header .purin-header__box p {
        font-size: min(2.5vw, 30px);
    }

    #purin-topic6 h4 {
        font-size: min(2vw, 25px);
    }

    #purin-topic1 .point1 {
        font-size: min(1.7vw, 23px);
    }

    #purin-topic1 .point1 .point1-img img:nth-child(1) {
        width: min(30vw, 400px);
    }

    #purin-topic1 .point1 .point1-img img:nth-child(2) {
        width: min(13vw, 172px);
    }

    #purin-topic1 .point1 .point1-img img:nth-child(3) {
        width: min(13vw, 172px);
    }

    #purin-topic1 .point1 .point1-img img:nth-child(4) {
        width: min(13vw, 172px);
    }

    #purin-topic1 .point2 h3 {
        font-size: min(2.5vw, 30px);
    }

    #purin-topic1 .point2 p {
        font-size: min(1.7vw, 20px);
    }

    #purin_daihuku #purin-topic2 .review h2 {
        font-size: min(5vw, 60px);
    }

    #purin-topic2 .review ul li h4 {
        font-size: min(2.8vw, 40px);
    }

    #purin-topic2 .review ul li p {
        font-size: min(1.7vw, 20px);
    }

    #purin-topic3 .scene h2,
    #purin-topic4 .howtoeat h2,
    #purin-topic5 h2 {
        font-size: min(2.6vw, 35px);
    }

    #purin-topic3 .scene ul li h4 {
        font-size: min(2vw, 30px);
    }

    #purin-topic3 .scene ul li p {
        font-size: min(1.5vw, 20px);
    }

    #purin-topic4 .howtoeat ul li h4 {
        font-size: min(2vw, 25px);
    }

    #purin-topic4 .howtoeat ul li p {
        font-size: min(1.5vw, 20px);
    }

    #purin-topic5 .cartin1 {
        font-size: min(1.7vw, 22px);
    }

}



/**************************************************************************************************
    Media Query (横幅1280px以下)
***************************************************************************************************/
@media (max-width: 1280px) {

}



/**************************************************************************************************
    Media Query (横幅1024px以下)
***************************************************************************************************/
@media (max-width: 1024px) {

    #purin_daihuku .purin_daihuku-shop-link a {
        font-size: clamp(13px, 3vw, 23px);
    }

    #purin_daihuku header .purin-header__box h1 {
        top: 8vw;
        right: 18vw;
    }

    #purin_daihuku header .purin-header__box p {
        top: 26vw;
        right: 8.5vw;
    }

    #purin-topic6 .edoya-inner {
        width: 60%;
    }

    #purin-topic6 h4 {
        font-size: clamp(16px, 3vw, 20px);
    }

    #purin-topic1 .point1 {
        font-size: clamp(11px, 3vw, 18px);
    }

    #purin-topic1 .point2 h3 {
        font-size: clamp(20px, 4vw, 30px);
    }

    #purin-topic1 .point2 p {
        font-size: clamp(11px, 3vw, 18px);
    }

    #purin-topic2 .review ul li {
        width: 100%;
    }

    #purin-topic2 .review ul li p {
        font-size: 16px;
    }

    #purin-topic3 .scene {
        padding: 7vw 2vw 5vw;
    }

    #purin-topic3 .scene h2,
    #purin-topic4 .howtoeat h2,
    #purin-topic5 h2 {
        font-size: clamp(16px, 3vw, 26px);
        margin-bottom: 0.5em;
    }

    #purin-topic3 .scene ul li h4 {
        font-size: clamp(13px, 3vw, 20px);
        height: 2em;
        text-align: center
    }

    #purin-topic3 .scene ul li:nth-child(1) h4,
    #purin-topic3 .scene ul li:nth-child(2) h4 {
        line-height: 2em;
    }

    #purin-topic3 .scene ul li p {
        font-size: clamp(9px, 2vw, 15px);
    }

    #purin-topic4 .howtoeat {
        padding: 7vw 2vw 5vw;
    }

    #purin-topic4 .howtoeat ul li h4 {
        font-size: clamp(10px, 2vw, 20px);
    }

    #purin-topic4 .howtoeat ul li p {
        font-size: clamp(9px, 2vw, 15px);
    }

    #purin-topic5 .edoya-inner {
        padding: 7vw 2vw 5vw;
    }

    #purin-topic5 .cartin1 {
        font-size: clamp(12px, 3vw, 18px);
    }

}



/**************************************************************************************************
    Media Query (横幅768px以下)
***************************************************************************************************/
@media (max-width: 768px) {

    #purin_daihuku header .purin-header__box h1 {
        top: 7vw;
        right: 6vw;
        font-size: clamp(22px, 6vw, 45px);
        line-height: 1.3;
    }

    #purin_daihuku header .purin-header__box p {
        display: none;
    }

    #purin-topic6 .edoya-inner {
        width: 90%;
    }

    #purin-topic1 .point1 {
        width: 100%;
    }

    #purin-topic1 .point1 .point1-img img:nth-child(1) {
        width: min(42vw, 400px);
    }

    #purin-topic1 .point1 .point1-img img:nth-child(2) {
        width: min(24vw, 172px);
        top: -10%;
    }

    #purin-topic1 .point1 .point1-img img:nth-child(3) {
        width: min(24vw, 172px);
        top: 25%;
        left: 76%;
    }

    #purin-topic1 .point1 .point1-img img:nth-child(4) {
        width: min(24vw, 172px);
        bottom: -10%;
    }

    #purin-topic2 .edoya-inner {
        background: url(../img/purin_daihuku/sp_p_bg.webp) center top / 100% no-repeat;
        padding: 7vw;
    }

    #purin_daihuku #purin-topic2 .review h2 {
        font-size: clamp(27px, 8vw, 40px);
        margin-bottom: 7vw;
    }

    #purin-topic2 .review ul li {
        padding: 1em;
    }

    #purin-topic2 .review ul li h4 {
        font-size: clamp(20px, 3vw, 28px);
    }

    #purin-topic2 .review ul li p {
        font-size: clamp(12px, 2vw, 16px);
    }

    #purin-topic5 .cart-text p,
    #purin-topic5 .cart-text p span {
        font-size: 14px;
    }

}