@charset "UTF-8";
/*==========================================*/
/*PC & ALL*/
/*==========================================*/
.article-inner img {
    width: 100%;
}
.content-head {
    position: relative;
    padding: 60px 0;
}
.content-head::before, .content-head::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 54px;
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/header-mayonnaise.svg") repeat-x center / cover;
    left: 0;
}
.content-head::before {
    top: 0;
}
.content-head::after {
    bottom: 0;
}
.content-head-inner {
    height: calc((236 / 1280) * 100vw);
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/bg-mayonnaise_pc.png") no-repeat top left/contain;
    margin-top: 0;
    margin-left: calc((161 / 1280) * 100vw);
}
.content-head-h1 {
    position: relative;
}
.content-head-h1 span {
    position: absolute;
    display: block;
}
.content-head-h1-copy1 {
    width: calc((762 / 1280) * 100vw);
    top: calc((23 / 1280) * 100vw);
    left: calc((25 / 1280) * 100vw);
}
.content-head-h1-copy2 {
    width: calc((837 / 1280) * 100vw);
    top: calc((81 / 1280) * 100vw);
    left: calc((3 / 1280) * 100vw * -1);
}
.content-wrap {
    max-width: 1040px;
    margin: 30px auto 0;
}
.content-history-lead {
    display: flex;
    align-items: center;
    gap: 38px;
}
.content-history-lead-ttl {
    width: 133px;
    flex-shrink: 0;
}
.content-history-lead-txt {
    font-size: 18px;
    font-weight: bold;
}
.content-history-list {
    margin-top: 30px;
    display: flex;
    justify-content: center;
    gap: 26px;
}
.content-history-list-item {
    width: 175px;
    text-align: center;
    position: relative;
}
.content-history-list-item a {
    display: block;
}
.content-history-list-item-year {
    font-size: 28px;
    font-weight: bold;
    color: #e4002b;
}
.content-history-list-item-img {
    width: 175px;
    height: 175px;
    margin-top: 5px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.content-history-list-item:nth-child(odd) .content-history-list-item-img {
    background: #FBD6DD;
}
.content-history-list-item:nth-child(even) .content-history-list-item-img {
    background: #FFEEC9;
}
.content-history-list-item-img::after {
    position: absolute;
    content: "";
    width: 142px;
    height: 71px;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 1;
    right: -100px;
}
.content-history-list-item:nth-child(odd) .content-history-list-item-img::after {
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-arrow03.svg") no-repeat center / contain;
}
.content-history-list-item:nth-child(even) .content-history-list-item-img::after {
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-arrow04.svg") no-repeat center / contain;
}
.content-history-list-item:nth-child(5) .content-history-list-item-img::after {
    width: 236px;
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-arrow02.svg") no-repeat center / contain;
    right: -40px;
    z-index: -2;
}
.content-history-list-item-img figure img {
    width: auto;
    height: 130px;
    position: relative;
    z-index: 2;
}
.content-history-list-item-img .icon {
    position: absolute;
    width: 89px;
    top: -24px;
    left: -34px;
    z-index: 1;
}
.content-history-list-item-note {
    width: 190px;
    margin: 5px auto 0;
    font-weight: bold;
    line-height: 1.5;
    letter-spacing: 0;
}
@media screen and (min-width: 769px), print {
    .content-history-list-item-note {
        margin-left: calc(calc(175px - 190px) / 2);
    }
}
.content-ranking {
    margin-top: 30px;
    padding: 40px 0;
    border: 8px solid #e4002b;
    text-align: center;
}
.content-ranking-ttl {
    font-size: 28px;
    font-weight: bold;
    line-height: 1;
}
.content-ranking-ttl span {
    display: block;
    margin-top: 20px;
    font-size: 36px;
    color: #e4002b;
}
.content-ranking-1st {
    display: inline-block;
    margin-top: 40px;
    padding-left: .5em;
    font-size: 57px;
    font-weight: bold;
    line-height: 1.5;
    background: linear-gradient(transparent 55%, #FFE277 55%);
}
.content-ranking-1st dt {
    display: inline-block;
    margin-right: .5em;
    position: relative;
}
.content-ranking-1st dt::before, .content-ranking-1st dt::after {
    position: absolute;
    content: "";
    width: 65px;
    height: 2px;
    background: #333;
    top: 0;
    bottom: 0;
    margin: auto;
}
.content-ranking-1st dt::before {
    left: -1em;
    transform: rotate(60deg);
}
.content-ranking-1st dt::after {
    right: -1em;
    transform: rotate(-60deg);
}
.content-ranking-1st dd {
    display: inline-block;
}
.content-ranking-others {
    position: relative;
}
.content-ranking-others-inner {
    margin-top: 30px;
    text-align: left;
    display: flex;
    justify-content: center;
    gap: 2em;
}
.content-ranking-rank {
    font-size: 24px;
    font-weight: bold;
    line-height: 1.5;
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
}
.content-ranking-rank.rank10 {
    gap: .8em;
}
.content-ranking-rank:not(:first-of-type) {
    margin-top: 20px;
}
.content-ranking-rank dd span {
    display: block;
    font-size: 18px;
}
.content-ranking-rank.top {
    font-size: 30px;
    gap: 1em;
}
.content-ranking-rank.top dd span {
    font-size: 22px;
}
.content-ranking-note {
    position: absolute;
    right: 1em;
    bottom: 0;
}
.content-ranking-bnr {
    width: 524px;
    margin: 25px auto 0;
}
.content-recommend {
    width: 100vw;
    margin: 60px calc(50% - 50vw) 0;
    padding: 60px 0 80px;
    background: #FFFAEF;
}
.content-recommend-inner {
    text-align: center;
}
.content-recommend-ttl {
    display: inline-block;
    font-size: 36px;
    font-weight: bold;
    position: relative;
}
.content-recommend-ttl::before, .content-recommend-ttl::after {
    position: absolute;
    content: "";
    top: 0;
    bottom: 0;
    margin: auto;
}
.content-recommend-ttl::before {
    width: 182px;
    height: 99px;
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-recipe01.png") no-repeat center / contain;
    left: -212px;
}
.content-recommend-ttl::after {
    width: 140px;
    height: 100px;
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-recipe02.png") no-repeat center / contain;
    right: -170px;
}
.content-recommend-container {
    margin-top: 60px;
    display: flex;
    justify-content: center;
    gap: 20px;
}
.content-recommend-box {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.content-recommend-img img {
    width: auto;
    height: 200px;
}
.content-recommend-name {
    height: calc(2em * 1.4);
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
    color: #e4002b;
    line-height: 1.4;
    letter-spacing: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.content-recommend-list {
    width: 240px;
    margin: 25px auto 0;
    font-size: 14px;
    text-align: left;
    line-height: 1.4;
}
.content-recommend-list-item {
    position: relative;
}
.content-recommend-list-item::before {
    position: absolute;
    content: "・";
    top: .1em;
    left: -.8em;
}
.content-recommend-btn {
    margin-top: auto;
    padding-top: 30px;
}
.content-recommend-btn-link {
    width: 156px;
    height: 36px;
    font-size: 14px;
    color: #fff !important;
    background: rgb(232 186 65 / 1);
    border-radius: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.content-recommend-btn-link::after {
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-arrow01.svg") no-repeat center / contain;
    top: 0;
    bottom: 0;
    right: .5em;
    margin: auto;
}
.content-recommend-others {
    margin-top: 80px;
}
.content-recommend-others-ttl {
    font-size: 30px;
    font-weight: bold;
}
.content-recommend-others-txt {
    font-size: 24px;
    font-weight: bold;
}
.content-recommend-others-list {
    margin-top: 25px;
    display: flex;
    justify-content: center;
    gap: 18px;
}
.content-recommend-others-list-item {
    width: 247px;
    background: #fff;
}
.content-mazemayo {
    width: 1040px;
    margin: 40px auto 0;
    padding: 40px 0;
    border: 3px solid #e4002b;
}
.content-mazemayo-header {
    position: relative;
}
.content-mazemayo-ttl {
    width: 437px;
    margin: 0 auto;
}
.content-mazemayo-copy01 {
    position: absolute;
    width: 171px;
    top: 79px;
    left: 91px;
}
.content-mazemayo-copy02 {
    position: absolute;
    width: 170px;
    top: 52px;
    right: 73px;
}
.content-mazemayo-copy03 {
    position: absolute;
    width: 131px;
    top: 133px;
    right: 122px;
}
.content-mazemayo-lead {
    margin-top: 25px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}
.content-mazemayo-recipe {
    margin-top: 25px;
}
.content-mazemayo-note {
    margin-right: 30px;
    text-align: right !important;
}
.content-mazemayo-note span {
    color: #e4002b;
}
.content-mazemayo-recipe-container {
    margin-top: 30px;
    text-align: center;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 70px 80px;
}
.content-mazemayo-recipe-box {
    position: relative;
}
.content-mazemayo-recipe-box::before {
    position: absolute;
    content: "";
    width: 356px;
    height: 269px;
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/bg-oval.svg") no-repeat center / contain;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: -1;
}
.content-mazemayo-recipe-ttl {
    font-size: 24px;
    font-weight: bold;
    line-height: 1.2;
}
.content-mazemayo-recipe-img img {
    width: auto;
    height: 140px;
}
.item03 .content-mazemayo-recipe-img img, .item04 .content-mazemayo-recipe-img img {
    height: 150px;
}
.content-mazemayo-recipe-btn-link {
    width: 195px;
    height: 36px;
    margin: 15px auto 0;
    font-size: 14px;
    color: #fff !important;
    background: rgb(228 0 43 / 1);
    border-radius: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.content-mazemayo-recipe-btn-link::after {
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-arrow01.svg") no-repeat center / contain;
    top: 0;
    bottom: 0;
    right: .5em;
    margin: auto;
}
.content-mazemayo-recommend {
    margin-top: 80px;
    text-align: center;
}
.content-mazemayo-recommend-ttl {
    display: inline-block;
    font-size: 30px;
    font-weight: bold;
    color: #e4002b;
    position: relative;
}
.content-mazemayo-recommend-ttl::before, .content-mazemayo-recommend-ttl::after {
    position: absolute;
    content: "";
    width: 30px;
    height: 3px;
    background: #e4002b;
    border-radius: 3px;
    top: 0;
    bottom: 0;
    margin: auto;
}
.content-mazemayo-recommend-ttl::before {
    left: -1em;
    transform: rotate(60deg);
}
.content-mazemayo-recommend-ttl::after {
    right: -1em;
    transform: rotate(-60deg);
}
.content-mazemayo-recommend-ttl + .content-mazemayo-note {
    margin-top: 15px;
}
.content-mazemayo-recommend-list {
    margin-top: 60px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 50px 12px;
}
.content-mazemayo-recommend-list-item {
    width: 195px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.content-mazemayo-recommend-list-item-img {
    width: 120px;
}
.content-mazemayo-recommend-list-item-ttl {
    margin-top: 8px;
    font-size: 18px;
    font-weight: bold;
    color: #e4002b;
    letter-spacing: -.08em;
}
.content-mazemayo-recommend-list-item-ttl.size-s {
    font-size: 17px;
}
.content-mazemayo-recommend-list-item-note {
    width: 180px;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.4;
    text-align: left;
}
.content-mazemayo-recommend-list-item-note li {
    position: relative;
    padding-left: 1em;
}
.content-mazemayo-recommend-list-item-note li::before {
    position: absolute;
    content: "・";
    top: .1em;
    left: .2em;
}
.content-mazemayo-recommend-list-item-note a {
    text-decoration: underline;
}
.content-mazemayo-recommend-list-item-note span {
    color: #e4002b;
}
.content-mazemayo-recommend-bnr {
    width: 524px;
    margin: 60px auto 0;
}
.btn-bnr {
    width: 430px;
    margin: 80px auto 0;
}
#foot_text {
    max-width: 1100px;
    margin: 30px auto 0;
    font-size: 13px;
    color: #333;
    text-align: right;
}
@media screen and (min-width: 769px), print {
    .article a, .article a img {
        -webkit-transition: 0.65s ease;
        transition: 0.65s ease;
    }
    a:hover .content-history-list-item-img figure img {
        opacity: .8;
    }
    a:hover.content-ranking-bnr-link, a:hover.content-recommend-others-list-item-link, a:hover.content-mazemayo-recommend-bnr-link, a:hover.btn-bnr-link {
        opacity: .6;
    }
    a:hover.content-recommend-btn-link {
        background: rgb(232 186 65 / .6);
    }
    a:hover.content-mazemayo-recipe-btn-link {
        background: rgb(228 0 43 / .6);
    }
}
/*==========================================*/
/*SP*/
/*==========================================*/
@media screen and (max-width: 768px) {
    .content-head {
        padding: calc((60 / 375) * 100vw) 0;
    }
    .content-head::before, .content-head::after {
        height: calc((54 / 375) * 100vw);
    }
    .content-head-inner {
        height: calc((205 / 375) * 100vw);
        background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/bg-mayonnaise_sp.png") no-repeat top right /contain;
        margin-left: auto;
        margin-right: calc((8 / 375) * 100vw);
    }
    .content-head-h1 span {
        left: 0 !important;
        right: 0 !important;
        margin: auto;
    }
    .content-head-h1-copy1 {
        width: calc((334 / 375) * 100vw);
        top: calc((10 / 375) * 100vw);
    }
    .content-head-h1-copy2 {
        width: calc((328 / 375) * 100vw);
        top: calc((50 / 375) * 100vw);
    }
    .content-wrap {
        margin-top: calc((18 / 375) * 100vw);
    }
    .content-history-lead {
        flex-direction: column;
        gap: calc((20 / 375) * 100vw);
    }
    .content-history-lead-ttl {
        width: calc((133 / 375) * 100vw);
    }
    .content-history-lead-txt {
        width: calc((330 / 375) * 100vw);
        font-size: calc((18 / 375) * 100vw);
        line-height: 1.6;
    }
    .content-history-list {
        width: calc((350 / 375) * 100vw);
        margin: calc((20 / 375) * 100vw) auto 0;
        flex-direction: column;
        gap: calc((24 / 375) * 100vw);
    }
    .content-history-list-item {
        width: 100%;
        text-align: left;
        display: flex;
        align-items: center;
        gap: calc((8 / 375) * 100vw);
    }
    .content-history-list-item-year {
        position: absolute;
        top: calc((10 / 375) * 100vw);
        left: calc((150 / 375) * 100vw);
        font-size: calc((22 / 375) * 100vw);
        line-height: 1;
    }
    .content-history-list-item-img {
        width: calc((140 / 375) * 100vw);
        height: calc((140 / 375) * 100vw);
        margin-top: 0;
        flex-shrink: 0;
    }
    .content-history-list-item-img::after {
        width: calc((72 / 375) * 100vw);
        height: calc((46 / 375) * 100vw);
        top: auto;
        left: 0;
        right: 0;
        bottom: calc((25 / 375) * 100vw * -1);
        z-index: -1;
    }
    .content-history-list-item:nth-child(odd) .content-history-list-item-img::after {
        background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-arrow05.svg") no-repeat center / contain;
    }
    .content-history-list-item:nth-child(even) .content-history-list-item-img::after {
        background: url("/prouse/cat_assets/img/recommend/mayonnaise-100th/icon-arrow06.svg") no-repeat center / contain;
    }
    .content-history-list-item:nth-child(5) .content-history-list-item-img::after {
        display: none;
    }
    .content-history-list-item-img figure img {
        height: calc((120 / 375) * 100vw);
    }
    .content-history-list-item:nth-child(3) .content-history-list-item-img figure img {
        height: calc((110 / 375) * 100vw);
    }
    .content-history-list-item-img .icon {
        width: calc((70 / 375) * 100vw);
        top: calc((49 / 375) * 100vw * -1);
        left: auto;
        right: calc((12 / 375) * 100vw * -1);
    }
    .content-history-list-item-note {
        width: 100%;
        min-height: calc(2em * 1.5);
        margin: 0;
        display: flex;
        align-items: center;
    }
    .content-history-list-item:nth-child(5) .content-history-list-item-note {
        padding-top: calc((20 / 375) * 100vw);
    }
    .content-ranking {
        margin-top: calc((30 / 375) * 100vw);
        padding: calc((40 / 375) * 100vw) 0 calc((30 / 375) * 100vw);
    }
    .content-ranking-ttl {
        font-size: calc((24 / 375) * 100vw);
        line-height: 1.4;
    }
    .content-ranking-ttl span {
        margin-top: calc((20 / 375) * 100vw);
        font-size: calc((28 / 375) * 100vw);
    }
    .content-ranking-1st {
        margin-top: calc((20 / 375) * 100vw);
        padding-left: .5em;
        font-size: calc((25 / 375) * 100vw);
        font-weight: bold;
        line-height: 1.5;
        background: linear-gradient(transparent 55%, #FFE277 55%);
    }
    .content-ranking-1st dt {
        display: inline-block;
        margin-right: .5em;
        position: relative;
    }
    .content-ranking-1st dt::before, .content-ranking-1st dt::after {
        width: calc((30 / 375) * 100vw);
        height: 2px;
    }
    .content-ranking-others-inner {
        margin-top: calc((30 / 375) * 100vw);
        flex-direction: column;
        gap: calc((10 / 375) * 100vw);
    }
    .content-ranking-rank {
        padding-left: 1em;
        font-size: calc((17 / 375) * 100vw);
    }
    .content-ranking-rank:not(:first-of-type) {
        margin-top: calc((10 / 375) * 100vw);
    }
    .content-ranking-rank dd span {
        font-size: calc((14 / 375) * 100vw);
    }
    .content-ranking-rank.top {
        font-size: calc((17 / 375) * 100vw);
        gap: 1em;
    }
    .content-ranking-rank.top dd span {
        font-size: calc((14 / 375) * 100vw);
    }
    .content-ranking-note {
        position: relative;
        margin-top: 1em;
        text-align: right;
    }
    .content-ranking-bnr {
        width: calc((320 / 375) * 100vw);
        margin-top: calc((30 / 375) * 100vw);
    }
    .content-recommend {
        margin-top: calc((30 / 375) * 100vw);
        padding: calc((56 / 375) * 100vw) 0;
    }
    .content-recommend-ttl {
        font-size: calc((28 / 375) * 100vw);
        letter-spacing: 0;
    }
    .content-recommend-ttl::before, .content-recommend-ttl::after {
        display: none;
    }
    .content-recommend-container {
        margin-top: calc((20 / 375) * 100vw);
        flex-wrap: wrap;
        gap: calc((40 / 375) * 100vw) 0;
    }
    .content-recommend-box {
        width: 50vw;
    }
    .content-recommend-img img {
        height: calc((150 / 375) * 100vw);
    }
    .content-recommend-name {
        height: calc((44 / 375) * 100vw);
        margin-top: calc((15 / 375) * 100vw);
        font-size: calc((16 / 375) * 100vw);
    }
    .item02 .content-recommend-name {
        font-size: calc((14 / 375) * 100vw);
        letter-spacing: -.05em;
    }
    .item03 .content-recommend-name {
        font-size: calc((13 / 375) * 100vw);
        letter-spacing: -.05em;
    }
    .content-recommend-list {
        width: 46vw;
        margin-top: calc((15 / 375) * 100vw);
        font-size: calc((14 / 375) * 100vw);
    }
    .content-recommend-list-item {
        margin-left: .6em;
    }
    .content-recommend-btn {
        padding-top: calc((15 / 375) * 100vw);
    }
    .content-recommend-btn-link {
        width: calc((114 / 375) * 100vw);
        height: calc((26 / 375) * 100vw);
        font-size: calc((10 / 375) * 100vw);
        border-radius: calc((13 / 375) * 100vw);
    }
    .content-recommend-btn-link::after {
        width: calc((6 / 375) * 100vw);
        height: calc((6 / 375) * 100vw);
        right: .5em;
    }
    .content-recommend-others {
        margin-top: calc((60 / 375) * 100vw);
    }
    .content-recommend-others-ttl {
        font-size: calc((26 / 375) * 100vw);
    }
    .content-recommend-others-txt {
        font-size: calc((16 / 375) * 100vw);
        letter-spacing: 0;
    }
    .content-recommend-others-list {
        margin-top: calc((15 / 375) * 100vw);
        flex-wrap: wrap;
        gap: calc((13 / 375) * 100vw);
    }
    .content-recommend-others-list-item {
        width: calc((165 / 375) * 100vw);
    }
    .content-mazemayo {
        width: 100vw;
        margin-top: calc((30 / 375) * 100vw);
        padding: 0 0 calc((30 / 375) * 100vw);
        border: 4px solid #e4002b;
    }
    .content-mazemayo-header {
        padding-top: calc((155 / 375) * 100vw);
    }
    .content-mazemayo-ttl {
        width: calc((303 / 375) * 100vw);
    }
    .content-mazemayo-copy01 {
        width: calc((117 / 375) * 100vw);
        top: calc((76 / 375) * 100vw);
        left: calc((20 / 375) * 100vw);
    }
    .content-mazemayo-copy02 {
        width: calc((117 / 375) * 100vw);
        top: calc((76 / 375) * 100vw);
        right: calc((11 / 375) * 100vw);
    }
    .content-mazemayo-copy03 {
        width: calc((86 / 375) * 100vw);
        top: calc((35 / 375) * 100vw);
        left: calc((167 / 375) * 100vw);
    }
    .content-mazemayo-lead {
        margin-top: calc((45 / 375) * 100vw);
        font-size: calc((18 / 375) * 100vw);
        line-height: 1.6;
    }
    .content-mazemayo-recipe {
        margin-top: calc((30 / 375) * 100vw);
    }
    .content-mazemayo-note {
        margin-right: calc((15 / 375) * 100vw);
    }
    .content-mazemayo-recipe-container {
        margin-top: calc((25 / 375) * 100vw);
        flex-direction: column;
        gap: calc((40 / 375) * 100vw);
    }
    .content-mazemayo-recipe-box::before {
        width: calc((273 / 375) * 100vw);
        height: calc((206 / 375) * 100vw);
    }
    .content-mazemayo-recipe-ttl {
        font-size: calc((18 / 375) * 100vw);
    }
    .content-mazemayo-recipe-img img {
        height: calc((108 / 375) * 100vw);
    }
    .item03 .content-mazemayo-recipe-img img, .item04 .content-mazemayo-recipe-img img {
        height: calc((111 / 375) * 100vw);
    }
    .content-mazemayo-recipe-btn-link {
        width: calc((146 / 375) * 100vw);
        height: calc((27 / 375) * 100vw);
        margin-top: calc((10 / 375) * 100vw);
        font-size: calc((10 / 375) * 100vw);
        border-radius: calc((15 / 375) * 100vw);
    }
    .content-mazemayo-recipe-btn-link::after {
        width: calc((6 / 375) * 100vw);
        height: calc((6 / 375) * 100vw);
        right: .5em;
    }
    .content-mazemayo-recommend {
        margin-top: calc((60 / 375) * 100vw);
    }
    .content-mazemayo-recommend-ttl {
        font-size: calc((28 / 375) * 100vw);
        line-height: 1.4;
    }
    .content-mazemayo-recommend-ttl::before, .content-mazemayo-recommend-ttl::after {
        width: calc((60 / 375) * 100vw);
        height: 3px;
    }
    .content-mazemayo-recommend-ttl::before {
        left: -2em;
    }
    .content-mazemayo-recommend-ttl::after {
        right: -2em;
    }
    .content-mazemayo-recommend-ttl + .content-mazemayo-note {
        margin-top: calc((15 / 375) * 100vw);
    }
    .content-mazemayo-recommend-list {
        margin-top: calc((45 / 375) * 100vw);
        gap: calc((10 / 375) * 100vw) 0;
    }
    .content-mazemayo-recommend-list-item {
        width: calc(100% / 3);
    }
    .content-mazemayo-recommend-list-item:last-child {
        margin-right: auto;
    }
    .content-mazemayo-recommend-list-item-img {
        width: calc((66 / 375) * 100vw);
    }
    .content-mazemayo-recommend-list-item-ttl {
        margin-top: calc((5 / 375) * 100vw);
        font-size: calc((10 / 375) * 100vw);
    }
    .content-mazemayo-recommend-list-item-ttl.size-s {
        font-size: calc((10 / 375) * 100vw);
    }
    .content-mazemayo-recommend-list-item-note {
        width: 90%;
        font-size: calc((8 / 375) * 100vw);
        line-height: 1.4;
    }
    .content-mazemayo-recommend-bnr {
        width: calc((320 / 375) * 100vw);
        margin-top: calc((45 / 375) * 100vw);
    }
    .btn-bnr {
        width: calc((313 / 375) * 100vw);
        margin-top: calc((45 / 375) * 100vw);
    }
    #foot_text {
        width: 100%;
        margin-top: 4vw;
        text-align: center;
        font-size: 2.93333vw;
    }
}