@charset "utf-8";
/*----------------------- common -----------------------*/
#moflin_goods {
    --mori_collection__theme_color: #f29c8d;
    --mofsanpo_collection__theme_color: #8f9c6e;
}
/*------------ font ---------------*/
#moflin_goods :where(h1, h2, h3, h4) {
    line-height: 1.2;
}
#moflin_goods p {
    margin: 0px;
    margin-bottom: 1rem;
    font-size: min(4.8vw, 18px);
}
/*btn*/
#moflin_goods .button:has(.moflin_btn) {
    text-align: center;
}
#moflin_goods .moflin_btn {
    color: #ffffff;
    background-color: var(--moflin_cam_subtheme_color);
    border: solid .15rem var(--moflin_cam_subtheme_color);
    position: relative;
    font-size: 24px;
    font-weight: bold;
    border-radius: .8em;
    padding: 20px;
    width: 450px;
}
/*btn-arrow*/
#moflin_goods .moflin_btn::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 2em;
    display: inline-block;
    width: .8em;
    height: .8em;
    font-size: 1rem;
    min-height: auto;
    margin-top: -2px;
    margin-left: 10px;
    border-top: 2px solid;
    border-right: 2px solid;
    transform: rotate(45deg) translateY(-50%);
}
#moflin_goods .moflin_btn:hover {
    color: var(--moflin_cam_subtheme_color);
    background-color: #ffffff;
    border-color: var(--moflin_cam_subtheme_color);
    transition: all .3s ease-out;
}
#moflin_goods #moflinGoodsTitle h1 {
    font-size: min(8vw, 60px);
    font-weight: bold;
    line-height: 1.2;
    padding: 50px 0 20px 0;
    text-align: center;
    color: #f4b4c9;
    width: 90%;
    margin: 0 auto;
}
/*------------ kv ---------------*/
#kv {
    margin-top: 90px;
}
/*------------ title ---------------*/
/*
.container:has(>.switch-container >#moflingoods_title) {
    position: sticky;
    background: #ffffff;
    z-index: 1;
}
.container:has(>.switch-container >#moflingoods_title.is-active) {
    top: min(20vw, 70px);
    left: 0;
}
*/
/*------------ lead ---------------*/
#lead .page_title {
    font-size: min(10vw, 60px);
    font-weight: bold;
    color: #f4b4c9;
    text-align: center;
    padding: 0;
}
#lead p {
    font-weight: bold;
    font-size: min(4.9vw, 25px);
}
#moflin_goods #lead_inner {
    width: min(90%, 1000px);
    margin: 0px auto 100px;
    text-align: center;
}
#lead_img_grp {
    margin: 50px auto;
}
#lead #lead_img_grp .cmp-image {
    margin-bottom: 30px;
}
#lead #lead_img_grp > .aem-Grid {
    display: flex;
    flex-wrap: wrap;
}
#lead #lead_img_grp > .aem-Grid > .container {
    width: max(calc(94% / 3), 300px);
    margin: 10px;
}
/*link_moflin*/
#linkMoflin {
    margin: 100px auto;
}
/*------------ item ---------------*/
#mori_collection {
    background: #fff0df;
}
#mofsanpo_collection {
    background: #f9fce6;
}
#moflin_goods .item_title {
    font-size: min(5vw, 26px);
    color: #ffffff;
    text-align: center;
    padding: 10px 20px;
}
#moflin_goods .collections_title {
    font-size: min(7vw, 45px);
    font-weight: bold;
    text-align: center;
    padding: 0;
    width: 90%;
    margin: 50px auto;
}
#mori_collection .item_title {
    background: var(--mori_collection__theme_color);
}
#mofsanpo_collection .item_title {
    background: var(--mofsanpo_collection__theme_color);
}
#mori_collection .collections_title {
    color: var(--mori_collection__theme_color);
}
#mofsanpo_collection .collections_title {
    color: var(--mofsanpo_collection__theme_color);
}
#moflin_goods [id$="item_container"] {
    width: min(90%, 1200px);
    margin: 100px auto;
    background: #ffffff;
}
#moflin_goods .item_desc {
    font-weight: bold;
    margin: 0 auto;
    max-width: 600px;
    text-align: center;
}
#moflin_goods .item_desc_title {
    margin-bottom: 10px;
    font-size: 1.7em;
}
#moflin_goods [id$="mainimg"] {
    width: 350px;
    margin: 0 auto;
    border: solid 1px;
}
#mori_collection [id$="mainimg"] {
    border-color: #dd9b8b;
}
#mofsanpo_collection [id$="mainimg"] {
    border-color: #c2c9a7;
}
#moflin_goods [id$="item_area"] {
    width: 90%;
    margin: 50px auto;
}
#moflin_goods [id$="item_grp"] {
    margin: 0 auto;
}
#moflin_goods [id$="item_grp"] .image {
    margin: 5%;
    border: solid 1px;
    width: 90%;
}
#moflin_goods [id$="item_grp"] p {
    text-align: center;
}
#moflin_goods [id$="item_grp"] .item_name {
    font-weight: bold;
    margin-bottom: 0px;
}
#moflin_goods [id$="item_grp"] .item_price {
    font-size: min(3vw, 14px);
    font-weight: normal;
    margin-top: 0px;
    margin-bottom: 10px;
}
#moflin_goods [id$="item_grp"] .item_price span {
    font-size: .8em;
}
#moflin_goods [id$="item_grp"] .item_date {
    font-weight: bold;
}
#moflin_goods [id$="item_grp"] > .aem-Grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0 auto;
}
#moflin_goods [id$="item_grp"] > .aem-Grid > .container {
    width: calc((100% / 3) - 20px);
    margin: 10px 10px 20px;
}
/*------------ コラボレーションモデル ---------------*/
#moflin_goods #nameLand {
    border: solid;
    border-width: 0 5px 5px 5px;
    border-color: var(--moflin_grey_color);
    width: min(90%, 1200px);
    margin: 100px auto 0px;
    background: #ffffff;
}
#moflin_goods #nameLand .collaborationTitle {
    font-size: min(5vw, 30px);
    font-weight: bold;
    text-align: center;
    padding: 10px 0;
    background: var(--moflin_grey_color);
    color: #ffffff;
}
#moflin_goods #nameLand .item_txt {
    font-size: min(4vw, 16px);
    text-align: left;
}
@media (max-width: 767px) {
    #moflin_goods #moflinGoodsTitle h1 {
        padding: 10vw 0 5vw;
    }
    /*------------ item ---------------*/
    #moflin_goods .collections_title {
        margin: 5vw auto;
    }
    #moflin_goods [id$="item_grp"] > .aem-Grid > .container {
        width: calc(50% - 5px);
        margin: 10px 10px 10px 0px;
    }
    #moflin_goods [id$="item_grp"] > .aem-Grid > .container:nth-child(2n) {
        margin-right: 0;
    }
    #moflin_goods [id$="mainimg"] {
        width: 90%;
    }
    #moflin_goods [id$="item_area"] {
        margin: 10vw auto;
    }
    /*------------ link_moflin ---------------*/
    #link_moflin {
        margin: 10vw auto;
    }
    #moflin_goods .moflin_btn {
        width: 80%;
        font-size: 5vw;
        padding: 1vw;
    }
    #moflin_goods #lead_inner {
        margin: 0px auto 10vw;
    }
    #moflin_goods [id$="item_container"] {
        margin: 20vw auto;
    }
}