:root{
    --selected:#63bfdf;
    --default:#63bfdf;
    --sub:#000;
    --targerWidth:1160px;
    --modalSelected:#63bfdf;
    --modalSelectedBg:#fff;
    --modalBorder:#000;
    --modalSearchBorder:transparent;
    --modalBg:#f6f6f1;
    --modalBg-sp:#f6f6f1;
  }

/* ui-color */

.ly-oatmilkTop .c-button .c-button_inner{
    border-color: var(--sub);
}

.ly-oatmilkTop .c-button_inner:hover{
    background:var(--selected);
    border-color: var(--selected);
    color: #fff;
}

/* MV */

.ly-oatmilkTop .sec-mv_title{
    width: calc((560 / var(--pc))*100vw);
    top: calc((-216 / var(--pc))*100vw);
    left: calc(50% + min(calc((12 / var(--pc))*100vw),12px));
    transform: translateX(-50%);
}

@media all and (max-width:960px) {
    .ly-oatmilkTop .sec-mv_title {
        width: calc((300 / var(--sp))*100vw);
        top: calc((-135 / var(--sp))*100vw);
        left: 50%;
    }
}

/* bg */

.ly-oatmilkTop .c-main{
    background: url(../../img/brand/oatmilk/top/bg-main.png) repeat;
    background-size: 100%;
}

.ly-oatmilkTop .c-wrapper{
    background: none;
}

.ly-oatmilkTop .sec-related{
    background: none;
}

.ly-oatmilkTop .c-ranking{
    background: none;
}

.ly-oatmilkTop .sec-pickup{
    background: center / cover no-repeat url(../../img/brand/oatmilk/top/bg-sub.png);
}

.ly-oatmilkTop .sec-search{
    background: #f6f6f1;
}

.ly-oatmilkTop .sec-result{
    background: #f6f6f1;
}

@media all and (max-width:960px){
    .ly-oatmilkTop .sec-pickup{
        background: center / 100% 100% no-repeat url(../../img/brand/oatmilk/top/bg-sub_sp.png);
    }
  }

/* New */

.ly-oatmilkTop .i-star::before{
    background: var(--sub);
}

@media all and (min-width:961px){
    .newSwiper .swiper-button_wrapper {
        top: min(calc((100 / var(--pc))*100vw),30px);
    }
  }
  
  @media all and (min-width:1120px){
    .newSwiper .swiper-button_wrapper {
        top: min(calc((100 / var(--pc))*100vw),45px);
    }
  }
  
  @media all and (min-width:1200px){
    .newSwiper .swiper-button_wrapper {
        top: min(calc((100 / var(--pc))*100vw),50px);
    }
  }
  
  @media all and (min-width:1300px){
    .newSwiper .swiper-button_wrapper {
        top: min(calc((100 / var(--pc))*100vw),70px);
    }
  }
  
  @media all and (min-width:1366px){
    .newSwiper .swiper-button_wrapper {
        top: min(calc((100 / var(--pc))*100vw),80px);
    }
  }
  
  @media all and (min-width:700px) {
    .newSwiper .swiper-wrapper{
      height: calc((165 / var(--sp))*100vw)
    }
  }
  @media all and (min-width:800px) {
    .newSwiper .swiper-wrapper{
      height: calc((155 / var(--sp))*100vw)
    }
  }
  @media all and (min-width: 961px) {
    .newSwiper .swiper-wrapper{
      height: min(calc((330 / var(--pc))*100vw),330px);
    }
  }
  
/* swiper */

.ly-oatmilkTop .swiper-button-prev, .ly-oatmilkTop .swiper-button-next{
    background-color: var(--selected);
    outline: 1px solid var(--selected);
}

.ly-oatmilkTop .swiper-button-prev:after, .ly-oatmilkTop .swiper-button-next:after{
    background: #fff;
}

.ly-oatmilkTop .swiper-button-prev:hover::after, .ly-oatmilkTop .swiper-button-next:hover::after {
    background-color: var(--selected);
}

@media all and (min-width:961px) {
    .ly-oatmilkTop .c-ranking .swiper{
      padding-left: min(calc((57 / var(--pc))*100vw),57px);
    }
  }
  
@media all and (min-width:1366px) {
    .ly-oatmilkTop .c-ranking .swiper{
      padding-left :calc((100% - var(--targerWidth)) / 2);
      padding-right :calc((100% - var(--targerWidth)) / 2);
    }
}

/* about */

.ly-oatmilkTop .about{
    text-align: center;
    margin-top: 36px;
}

.ly-oatmilkTop .about img{
    max-width: 522px;
}

@media all and (max-width:960px) {

    .ly-oatmilkTop .about{
        margin: 0 min(calc((32 / var(--sp))*100vw),32px);
        margin-top: 36px;
    }
    
    .ly-oatmilkTop .about img{
        width: 100%;
        height: auto;
    }
}

/* sec-search */

.ly-oatmilkTop .sec-search,.ly-oatmilkTop .sec-result{
    border-radius: 30px;
    position: relative;
    padding: min(calc((87 / var(--pc))*100vw),87px) 0 min(calc((87 / var(--pc))*100vw),87px);
    z-index: 1;
}
.ly-oatmilkTop .sec-result_tags{
    z-index: 10;
}

@media all and (max-width:960px){
    .ly-oatmilkTop .sec-search,.ly-oatmilkTop .sec-result{
        border-radius: 15px;
    }
    .ly-oatmilkTop .sec-search{
        padding: min(calc((33 / var(--sp))*100vw),33px) 0;
    }
    .ly-oatmilkTop .sec-result{
        padding: min(calc((29 / var(--sp))*100vw),29px) 0 min(calc((33 / var(--sp))*100vw),33px);
    }
}

@media all and (max-width:960px) and (min-width:640px) {
    .ly-oatmilkTop .sec-search h2{
      padding-top: 8px;
    }
    .ly-oatmilkTop .sec-result h2{
      padding-top: 8px;
    }
  }

.ly-oatmilkTop .i-check::before,.ly-oatmilkTop .c-category_list-item_label::before{
    background: #000;
}

.ly-oatmilkTop .c-category_list-item_label {
    border: 1px solid var(--sub);
    background-color: #fff;
}

.ly-oatmilkTop .i-fav[data-fav="off"]::after,.i-fav[data-fav="on"]::after,
.ly-oatmilkTop .c-category_list-item_check:checked + .c-category_list-item_label::before{
    background: var(--selected);
}

.ly-oatmilkTop .c-category_list-item_check:checked + .c-category_list-item_label::after{
    border: 3px solid var(--selected);
    width: calc(100% + 3px);
    height: calc(100% + 3px);
}

.ly-oatmilkTop .c-category_list-item_check:checked + .c-category_list-item_label{
    color: var(--selected);
}

.ly-oatmilkTop .sec-search_fillter .c-button_inner,
.ly-oatmilkTop .sec-search_clear .c-button_inner{
    border: 2px solid var(--selected);
}

.ly-oatmilkTop .sec-search_recipe .c-button_inner{
    background: var(--selected);
    color: #fff;
    border: 2px solid var(--selected);
}

.ly-oatmilkTop .sec-search_fillter .c-button_inner:hover,
.ly-oatmilkTop .sec-search_clear .c-button_inner:hover{
    background: var(--selected);
    color: #fff;
}

.ly-oatmilkTop .sec-search_recipe .c-button_inner:hover{
    background: #fff;
    color: var(--selected);
}

.ly-oatmilkTop .sec-search_recipe .c-button_inner:hover::before{
    background: var(--selected);
}

.ly-oatmilkTop .sec-result_card{
    margin-top: 0;
    padding-top: 22px;
    z-index: 10;
    position: relative;
}

@media all and (max-width:640px){
    .ly-oatmilkTop .sec-result_card{
        background-color: #f6f6f1;
    }
}

.ly-oatmilkTop .sec-search h2::before{
    content: "";
    width: calc(100% - 120px);
    height: 16px;
    background: url(../../img/brand/oatmilk/detail/border-top.png) repeat-x;
    position: absolute;
    top: 26px;
    left: 60px;
  }
  
  .ly-oatmilkTop .sec-search_title::after {
  content: "";
  width: 45px;
  height: 45px;
  background: url(../../img/brand/oatmilk/detail/border-right-top.png) no-repeat;
  position: absolute;
  top: 26px;
  right: 15px;
  }
  
  .ly-oatmilkTop .sec-search_title::before{
  content: "";
  width: 45px;
  height: 45px;
  background: url(../../img/brand/oatmilk/detail/border-left-top.png) no-repeat;
  position: absolute;
  top: 27px;
  left: 19px;
  z-index: 1;
  }
  
  .ly-oatmilkTop .sec-search::before {
    content: "";
    width: 16px;
    height: calc(100% - 134px);
    background: url(../../img/brand/oatmilk/detail/border-left.png) repeat-y;
    position: absolute;
    top: 68px;
    left: 19px;
    }
  
  .ly-oatmilkTop .sec-search::after{
  content: "";
  width: 16px;
  height: calc(100% - 134px);
  background: url(../../img/brand/oatmilk/detail/border-right.png) repeat-y;
  position: absolute;
  top: 68px;
  right: 19px;
  z-index: 1;
  }
  
  .ly-oatmilkTop .sec-search_buttons::before{
  content: "";
  width: 41px;
  height: 42px;
  background: url(../../img/brand/oatmilk/detail/border-left-bottom.png) no-repeat;
  position: absolute;
  bottom: 24px;
  left: 19px;
  }
  
  .ly-oatmilkTop .sec-search_buttons::after{
  content: "";
  width: 41px;
  height: 42px;
  background: url(../../img/brand/oatmilk/detail/border-right-bottom.png) no-repeat;
  position: absolute;
  bottom: 27px;
  right: 22px;
  }
  
  .ly-oatmilkTop .sec-search_recipe::before{
  content: "";
  width: calc(100% - 120px);
  height: 14px;
  background: url(../../img/brand/oatmilk/detail//border-bottom.png) repeat-x;
  position: absolute;
  left: 60px;
  bottom: 24px;
  z-index: 1;
  }
  
  @media all and (max-width:960px){
      .ly-oatmilkTop .sec-search h2::before{
        content: "";
        width: calc(100% - 50px);
        height: 6px;
        background: url(../../img/brand/oatmilk/detail/border-top.png) repeat-x;
        background-size: auto 100%;
        top: 9px;
        left: 24px;
      }
    
      .ly-oatmilkTop .sec-search_title::before {
      content: "";
      width: 22px;
      height: 22px;
      background: url(../../img/brand/oatmilk/detail/border-left-top.png) no-repeat;
      background-size: 100% 100%;
      top: 9px;
      left: 4px;
    }
    
    .ly-oatmilkTop .sec-search_title::after {
      content: "";
      width: 22px;
      height: 22px;
      background: url(../../img/brand/oatmilk/detail/border-right-top.png) no-repeat;
      background-size: 100% 100%;
      top: 8px;
      right: 4px;
    }
    
    .ly-oatmilkTop .sec-search::before{
      content: "";
      width: 6px;
      height: calc(100% - 60px);
      background: url(../../img/brand/oatmilk/detail/border-left.png) repeat-y;
      background-size: 6px auto;
      top: 30px;
      left: 4px;
      z-index: 1;
    }
    
    .ly-oatmilkTop .sec-search::after{
      content: "";
      width: 6px;
      height: calc(100% - 60px);
      background: url(../../img/brand/oatmilk/detail/border-right.png) repeat-y;
      background-size: 6px auto;
      top: 30px;
      right: 4px;
      z-index: 1;
    }
    
    .ly-oatmilkTop .sec-search_buttons::before{
      content: "";
      width: 22px;
      height: 22px;
      background: url(../../img/brand/oatmilk/detail/border-left-bottom.png) no-repeat;
      background-size: 100% 100%;
      bottom: 9px;
      left: 3px;
    }
    
    .ly-oatmilkTop .sec-search_buttons::after{
      content: "";
      width: 22px;
      height: 22px;
      background: url(../../img/brand/oatmilk/detail/border-right-bottom.png) no-repeat;
      background-size: 100% 100%;
      bottom: 9px;
      right: 3px;
    }
    .ly-oatmilkTop .sec-search_recipe::before{
      width: calc(100% - 50px);
      height: 6px;
      background: url(../../img/brand/oatmilk/detail/border-bottom.png) repeat-x;
      background-size: auto 100%;
      bottom: 9px;
      left: 24px;
    }
  }

/* sec-result */

.ly-oatmilkTop .i-light::before{
    background: var(--sub);
}

.ly-oatmilkTop .c-result_sort_button[data-sort="on"]{
    color: var(--default);
}

.ly-oatmilkTop .c-button_fav_inner::before{
    background: var(--selected);
}

.ly-oatmilkTop .c-button_fav_inner:hover{
    background: var(--selected);
    border-color: var(--selected);
}

.ly-oatmilkTop .c-button_fav_inner:hover::before{
    background: #fff;
}

.ly-oatmilkTop .dropbox-select{
    color: var(--selected);
}

.ly-oatmilkTop .search-sort-list__item.is-active .search-sort-list__label{
    color: var(--selected);
}

.ly-oatmilkTop .dropbox::after{
    background: var(--selected);
}

.ly-oatmilkTop .sec-result h2::before{
    content: "";
    width: calc(100% - 120px);
    height: 16px;
    background: url(../../img/brand/oatmilk/detail/border-top.png) repeat-x;
    position: absolute;
    top: 26px;
    left: 60px;
  }
  
  .ly-oatmilkTop .sec-result_title::after {
  content: "";
  width: 45px;
  height: 45px;
  background: url(../../img/brand/oatmilk/detail/border-right-top.png) no-repeat;
  position: absolute;
  top: 26px;
  right: 15px;
  }
  
  .ly-oatmilkTop .sec-result_title::before{
  content: "";
  width: 16px;
  height: calc(100% - 134px);
  background: url(../../img/brand/oatmilk/detail/border-left.png) repeat-y;
  position: absolute;
  top: 68px;
  left: 19px;
  z-index: 1;
  }
  
  .ly-oatmilkTop .sec-result::before {
    content: "";
    width: 45px;
    height: 45px;
    background: url(../../img/brand/oatmilk/detail/border-left-top.png) no-repeat;
    position: absolute;
    top: 27px;
    left: 19px;
    }
  
  .ly-oatmilkTop .sec-result::after{
  content: "";
  width: 16px;
  height: calc(100% - 134px);
  background: url(../../img/brand/oatmilk/detail/border-right.png) repeat-y;
  position: absolute;
  top: 68px;
  right: 19px;
  z-index: 1;
  }
  
  .ly-oatmilkTop .sec-result_card>ul::before{
  content: "";
  width: 41px;
  height: 42px;
  background: url(../../img/brand/oatmilk/detail/border-left-bottom.png) no-repeat;
  position: absolute;
  bottom: max(calc((-57 / var(--pc))*100vw),-57px);
  left: max(calc((-38 / var(--pc))*100vw),-38px);
  }
  
  .ly-oatmilkTop .sec-result_card>ul::after{
  content: "";
  width: 41px;
  height: 42px;
  background: url(../../img/brand/oatmilk/detail/border-right-bottom.png) no-repeat;
  position: absolute;
  bottom: max(calc((-57 / var(--pc))*100vw),-57px);
  right: max(calc((-35 / var(--pc))*100vw),-35px);
  }
  
  .ly-oatmilkTop .sec-result_card::before{
  content: "";
  width: calc(100% - 120px);
  height: 16px;
  background: url(../../img/brand/oatmilk/detail//border-bottom.png) repeat-x;
  position: absolute;
  left: 60px;
  bottom: -60px;
  z-index: 1;
  }
  
  @media all and (max-width:1200px){
    .ly-oatmilkTop .sec-result_card>ul::before{
      bottom: max(calc((-51 / var(--pc))*100vw),-51px);
      left: max(calc((-29 / var(--pc))*100vw),-29px);
      }
      
      .ly-oatmilkTop .sec-result_card>ul::after{
        bottom: max(calc((-51 / var(--pc))*100vw),-51px);
        right: max(calc((-33 / var(--pc))*100vw),-33px);
      }

      .ly-oatmilkTop .sec-result_card::before{
        bottom: max(calc((-55 / var(--pc))* 100vw), -55px);
      }
  }
  
  @media all and (max-width:1050px){
    .ly-oatmilkTop .sec-result_card>ul::before{
      bottom: max(calc((-47 / var(--pc))*100vw),-47px);
      left: max(calc((-25 / var(--pc))*100vw),-25px);
      }
    .ly-oatmilkTop .sec-result_card>ul::after{
      bottom: max(calc((-47 / var(--pc))*100vw),-47px);
      right: max(calc((-32 / var(--pc))*100vw),-32px);
    }
    .ly-oatmilkTop .sec-result_card::before{
      bottom: max(calc((-51 / var(--pc))*100vw),-51px);
    }
  }
  
  @media all and (max-width:960px){
    .ly-oatmilkTop .sec-result h2::before{
        content: "";
        width: calc(100% - 50px);
        height: 6px;
        background: url(../../img/brand/oatmilk/detail/border-top.png) repeat-x;
        background-size: auto 100%;
        top: 9px;
        left: 24px;
    }
  
  .ly-oatmilkTop .sec-result_title::before {
    content: "";
    width: 22px;
    height: 22px;
    background: url(../../img/brand/oatmilk/detail/border-left-top.png) no-repeat;
    background-size: 100% 100%;
    top: 9px;
    left: 4px;
  }

  .ly-oatmilkTop .sec-result_title::after {
    content: "";
    width: 22px;
    height: 22px;
    background: url(../../img/brand/oatmilk/detail/border-right-top.png) no-repeat;
    background-size: 100% 100%;
    top: 8px;
    right: 4px;
}
  
  .ly-oatmilkTop .sec-result::before{
    content: "";
    width: 6px;
    height: calc(100% - 60px);
    background: url(../../img/brand/oatmilk/detail/border-left.png) repeat-y;
    background-size: 6px auto;
    top: 30px;
    left: 4px;
    z-index: 1;
  }
  
  .ly-oatmilkTop .sec-result::after{
    content: "";
    width: 6px;
    height: calc(100% - 60px);
    background: url(../../img/brand/oatmilk/detail/border-right.png) repeat-y;
    background-size: 6px auto;
    top: 30px;
    right: 4px;
    z-index: 1;
  }
  
  .ly-oatmilkTop .sec-result_card>ul::before{
    content: "";
    position: absolute;
    width: 22px;
    height: 22px;
    background: url(../../img/brand/oatmilk/detail/border-left-bottom.png) no-repeat;
    background-size: 100% 100%;
    bottom: max(calc((-24 / var(--sp))*100vw),-24px);
    left: max(calc((-30 / var(--sp))*100vw),-30px);
  }
  
  .ly-oatmilkTop .sec-result_card>ul::after{
    content: "";
    position: absolute;
    width: 22px;
    height: 22px;
    background: url(../../img/brand/oatmilk/detail/border-right-bottom.png) no-repeat;
    background-size: 100% 100%;
    bottom: max(calc((-24 / var(--sp))*100vw),-24px);
    right: max(calc((-30 / var(--sp))*100vw),-30px);
  }
  .ly-oatmilkTop .sec-result_card::before{
    width: calc(100% - 50px);
    height: 6px;
    background: url(../../img/brand/oatmilk/detail/border-bottom.png) repeat-x;
    background-size: auto 100%;
    bottom: 9px;
    left: 24px;
  }
  .ly-oatmilkTop .sec-result_card::before{
    bottom: max(calc((-36 / var(--pc))*100vw),-36px);
  }
  }
  
  @media all and (max-width:640px){
    .ly-oatmilkTop .sec-result_card>ul::before{
      bottom: -17px;
      left: 3px;
    }
    
    .ly-oatmilkTop .sec-result_card>ul::after{
      bottom: -17px;
      right: 3px;
    }

    .ly-oatmilkTop .sec-result_card::before{
      bottom: -17px;
    }
  }
  
  @media all and (max-width:320px){
    .ly-oatmilkTop .sec-result_card>ul::before{
      bottom: max(calc((-24 / var(--sp))*100vw),-24px);
      left: max(calc((-4 / var(--sp))*100vw),-4px);
    }
    
    .ly-oatmilkTop .sec-result_card>ul::after{
      bottom: max(calc((-24 / var(--sp))*100vw),-24px);
      right: max(calc((-4 / var(--sp))*100vw),-4px);
    }

    .ly-oatmilkTop .sec-result_card::before{
      bottom: max(calc((-80 / var(--pc))* 100vw), -80px);
    }
  }

/* c-rank */

.ly-oatmilkTop .i-crown::after{
    background: var(--sub);
}

.ly-oatmilkTop .c-rank_flag{
    background-color: var(--selected);
}

.ly-oatmilkTop .c-rank_flag::before{
    border-top: 8px solid var(--selected);
}

.ly-oatmilkTop .c-rank_flag::after{
    border-top: 8px solid var(--selected);
}

.ly-oatmilkTop .c-ranking .swiper-button_wrapper{
    top: min(calc((8 / var(--pc))*100vw),8px);
}

/* related */

.ly-oatmilkTop .sec-related{
    padding-top: 0;
}

.ly-oatmilkTop .sec-related_return .c-button_inner:hover::before{
    background:#fff;
}


/* about-modal */

#modal2 .c-modal-wrap{
    background-image: url(../../img/brand/oatmilk/top/modal-bg.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    box-sizing: border-box;
    padding: min(90px, calc((90/ var(--pc)) * 100vw)) min(90px, calc((90 / var(--pc)) * 100vw)) min(108px, calc((108/ var(--pc)) * 100vw));
}

#modal2 .c-modal-wrap::before{
    content: "";
    position: absolute;
    top: min(32px, calc((32/ var(--pc)) * 100vw));
    left: min(32px, calc((32/ var(--pc)) * 100vw));
    width: calc(100% - min(64px, calc((64/ var(--pc)) * 100vw)));
    height: calc(100% - min(64px, calc((64/ var(--pc)) * 100vw)));
    border: 36px solid transparent;
    border-image-slice: 36;
    border-image-source: url(../../img/brand/oatmilk/top/modal-frame.png);
    box-sizing: border-box;
}

#modal2 .c-modal_button-mini-close{
    top: min(calc((90 / var(--pc))*100vw),90px);
    right: min(calc((90 / var(--pc))*100vw),90px);
}

#modal2 .modal-content_area{
    z-index: 10;
}

#modal2 .about-oatmilk_column{
    margin-top: 44px;
}

#modal2 .about-oatmilk_contents{
    text-align: center;
}

#modal2 .about_title img{
    max-width: 860px;
}

#modal2 .about-oatmilk_text{
    margin-top: 34px;
    padding-right: min(76px, calc((76/ var(--pc)) * 100vw));
    padding-left: min(76px, calc((76/ var(--pc)) * 100vw));
}

#modal2 .about-oatmilk_button{
    margin-top: 44px;
}

#modal2 .c-modal_button::before{
    content: none;
}

#modal2 .c-modal_button{
    background: #fff;
    color: #000;
    border-color: #000;
    border-width: 1px;
    font-size: 16px;
    max-width: 300px;
}

#modal2 .c-modal_button::after{
    background: #000;
}

#modal2 .c-modal_button:hover{
    background: #000;
    color: #fff;
}

#modal2 .c-modal_button:hover::after{
    background: #fff;
}

@media all and (max-width:960px){
    #modal2 .c-modal-wrap{
        background-image: url(../../img/brand/oatmilk/top/modal-bg_sp.png);
        padding: min(40px, calc((40/ var(--sp)) * 100vw)) min(30px, calc((30 / var(--sp)) * 100vw)) min(56px, calc((56/ var(--sp)) * 100vw));
    }
    #modal2 .c-modal-wrap::before{
        top: min(10px, calc((10/ var(--sp)) * 100vw));
        left: min(10px, calc((10/ var(--sp)) * 100vw));
        width: calc(100% -  min(20px, calc((20/ var(--sp)) * 100vw)));
        height: calc(100% -  min(20px, calc((20/ var(--sp)) * 100vw)));
        border: 15px solid transparent;
        border-image-slice: 30;
        border-image-source: url(../../img/brand/oatmilk/top/modal-frame_sp.png);
    }
    
    #modal2 .c-modal_button-mini-close{
        top: min(calc((30 / var(--sp))*100vw),30px);
        right: min(calc((30 / var(--sp))*100vw),30px);
    }
    #modal2 .about_title{
        padding: 0 min(calc((9 / var(--sp))*100vw),9px);
        display: block;
    }
    #modal2 .about_title img{
        max-width: 100%;
    }
    #modal2 .about-oatmilk_column{
        margin-top: 29px;
    }
    #modal2 .about-oatmilk_text{
        padding: 0;
    }
    #modal2 .about-oatmilk_button{
        margin-top: 36px;
    }
    #modal2 .c-modal_button{
        font-size: 12px;
        max-width: 200px;
        height: 45px;
      }
}

/* muuri */
.ly-oatmilkTop .muuri .item[data-new="on"] .c-card_list-item_upper::before{
  content: "";
  position: absolute;
  width: 76px;
  height: 38px;
  top: 0;
  left: 0;
  background-size: contain;
  z-index: 10;
  background: url(../../img/brand/oatmilk/new.svg) no-repeat top left;
}
@media all and (max-width:960px) {
  .ly-oatmilkTop .muuri .item[data-new="on"] .c-card_list-item_upper::before {
      width: 42px;
      height: 21px;
      background-size: contain;
  }
}

@media all and (min-width:768px) {
  .ly-oatmilkTop .sec-related {
      padding-bottom: 240px;
  }
  .gfooter__inner {
      margin-top: 0;
  }
}

@media all and (max-width:767px) {
  .mc-breadcrumb {
      margin-top: -70px;
  }
  .ly-oatmilkTop .sec-related {
      padding-bottom: 40px;
  }
}