@charset "utf-8";

/************************************************
 import css
************************************************ */
/* font */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Fjalla+One&display=swap&family=Oswald:wght@200..700&display=swap');
/* scrollbar */
@import url('https://cdn.jsdelivr.net/npm/simplebar@5.3.6/dist/simplebar.min.css');

@import url('/user_data/packages/raku2pc/css/header_pc.css');
@import url('/user_data/packages/raku2pc/css/footer_pc.css');
@import url('/user_data/packages/raku2pc/css/products_pc.css');
@import url('/user_data/packages/raku2pc/css/recipe_pc.css');
@import url('/user_data/packages/raku2pc/css/top_pc.css');
@import url('/user_data/packages/raku2pc/css/freepage_pc.css');
@import url('/user_data/packages/raku2pc/css/defaultpagecustom_pc.css');


html {
  /*　各種レギュレーションの値 */
  /* ***スペーシングレギュレーション*** */
  --spc-h1: 48px; /*・h1見出し下余白 */
  --spc-h2: 24px; /*・h2見出し下余白 */
  --spc-h3: 24px; /*・h3見出し下余白 */
  --spc-h4: 24px; /*・h4見出し下余白 */
  --spc-sect: 80px; /*・各セクション間の余白 */
  --spc-sect-in: 48px;/*・セクション内の余白 */
  --spc-content: 36px;/*・コンテンツ内の余白 */
  --spc-footer: 128px;/*・コンテンツとフッターとの間 */
  --spc-titlenext: 48px;/*・見出し+コンテンツ間 */

  /* ***タイポレギュレーション*** */
  --typ-h1: 48px; /*・h1見出 */
  --typ-h2: 36px;/*・h2見出し */
  --typ-h3: 24px;/*・h3見出し */
  --typ-h4: 20px;/*・h4見出し */
  --typ-text: 16px;/*・本文 */
  
  /* ***コンテナレギュレーション*** */
  --con-large: 1280px;/* ・コンテナ大 1280px */
  --con-mid: 1024px;/* ・コンテナ中 1024px */
  --con-small: 768px;/* ・コンテナ小 768px */
  
  /* *** MYページ用　ランクカラー *** */
  --rank-acerola: #edbeae;
  --rank-cacao: #EFEFEF;
  --rank-acai: #FFF2B0;
}
/* 商品ページの表示価格表示 */
div.raku2_normal_price.normal_price{
display:block !important;
}
html sub {
  vertical-align: baseline;
  font-size: .5em;
}
.frt p a:link,.frt p a:visited {
  text-decoration: none;
  text-underline-offset: 0.3em;
  position: relative;
  display: inline-block;
  border-bottom: 1px solid transparent;
}
.frt p a:link:hover,
.frt p a[href]:hover {
  opacity: 1;
}
.frt p a:before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: -0.05em;
  left: 0;
  right: auto;
  transition: all .5s ease;
  background: var(--main-color);
}
.frt p a:hover:before {
  content: "";
  width: 0%;
  left: auto;
  right: 0;
  background: var(--accent-color);
}

.simplebar-scrollbar.simplebar-visible:before {
  opacity: 1;
  color: #a8a29e;
}
.simplebar-track.simplebar-vertical {
  width: 4px;
  border-radius: 4px;
}

html body {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-feature-settings: 'palt' 1;
  font-size: var(--typ-text);
  font-weight: 500;
}

html #main_column.colnum1 {
  width: 100%;
  margin: 0 auto;
}

.font--fj {
  font-family: "Fjalla One", sans-serif;
  font-weight: normal!important;
  font-style: normal;
}
.font--red {
  color: #ff3300;
  font-weight: bold;
}
.font--small {
  font-size: calc(12 / 16 * 1em);
  
}

.text--center {
  text-align: center;
}


/* レフトnavigation非表示にして1カラム化 */
#leftcolumn {
  display: none!important;
}
#main_column {
  padding: 0!important;
  margin: 0 auto;
  width: 100%!important;
  float: none;
}
html #container {
  padding: 1px 0 0!important;
  width: 100%;
  box-sizing: border-box;
}
/* common style */
.container--large {
  width: 100%;
  max-width: 1280px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.container--middle {
  width: 100%;
  max-width: 1024px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.container--small {
  width: 100%;
  max-width: 768px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}


/* slideritems */

.slider__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: stretch;
  align-items: stretch;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: flex-start;
  max-width: calc(1024px + 32px);
  width: 100%;
  margin: 0 auto;
}
.slider__list .slider__listitem {
  display: block;
  width: calc((100% - (32px * 4) ) / 4);
  max-width: 232px;
  margin: 16px;
}
.slider__list a {
  display: block;
  position: relative;
}
.slider__list .slider__listimage {
  overflow: hidden;
  border-radius: 4px;
  display: block;
  width: 232px;
  height: 232px;
  position: relative;
}
.slider__list .slider__listimage img {
  display: block;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: all .5s ease;
  transform: scale(1);
}
.slider__list a:hover .slider__listimage img {
  transform: scale(1.05);
}
.slider__list .slider__listtitle {
  text-align: center;
}
.slider__list .slider__listtitle > span {
  display: block;
  margin: 0;
}
.slider__listtext {
  font-size: 12px;
  display: block;
  margin: 0;
  text-align: center;
}
.frtslider__box--ranking {
  counter-reset: number 0;
}

.frtslider__box--ranking .slider__listitem {
  counter-increment: number 1;
}
.frtslider__box--ranking .slider__listitem a:before {
  content: attr(data-ranking);
  background: url(/user_data/packages/raku2pc/img/frt_img/ic_ranking_bg.svg) no-repeat top center;
  -webkit-background-size: contain;
  background-size: contain;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 0;
  font-size: 16px;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: bold;
  font-style: normal;  
  border: none;
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
}
.frtslider__box--ranking .slider__listitem a[data-ranking="1"]:before  {
  background: url(/user_data/packages/raku2pc/img/frt_img/ic_ranking_01.svg) no-repeat top center;
  -webkit-background-size: contain;
  background-size: contain;
  width: 50px;
  height: 50px;
  border-radius: 0;
}
.frtslider__box--ranking .slider__listitem a[data-ranking="2"]:before  {
  background: url(/user_data/packages/raku2pc/img/frt_img/ic_ranking_02.svg) no-repeat top center;
  -webkit-background-size: contain;
  background-size: contain;
  width: 50px;
  height: 50px;
  border-radius: 0;
}

.frtslider__box--ranking .slider__listitem a[data-ranking="3"]:before  {
  background: url(/user_data/packages/raku2pc/img/frt_img/ic_ranking_03.svg) no-repeat top center;
  -webkit-background-size: contain;
  background-size: contain;
  width: 50px;
  height: 50px;
  border-radius: 0;
}
.frtslider__box--ranking .slider__listtitle {
  text-align: center;
  padding: 10px 0;
  width: 100%;
  display: block;
}
.frtslider--bx.frtslider__box {
  width: 100%;
  max-width: 1024px;
  padding-bottom: 0;
}
.frtslider--bx .bx-wrapper {
  border: none;
  box-shadow: none;
}
.frtslider--bx .bx-wrapper .bx-pager {
  padding-top: 0px;
  bottom: -28px;
}

.frtslider--bx .slider__list .slider__listitem {
  margin-top: 0;
  margin-bottom: 0;
}
.frtslider--bx  .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  width: 100%;
  text-align: center;
  padding-top: 16px;
  font-size: 8px;
}
.frtslider--bx .bx-wrapper .bx-pager.bx-default-pager a {
  width: 8px;
  height: 8px;
  margin: 0 4px;
  background: #e7e5e4;
}
.frtslider--bx .bx-wrapper .bx-pager.bx-default-pager a.active {
  background: #a8a29e;
}
.frtslider--bx .bx-wrapper .bx-controls-direction .bx-prev {
 left: -32px;
  overflow: hidden;
}
.frtslider--bx .bx-wrapper .bx-controls-direction .bx-next {
 right: -32px;
  overflow: hidden;
}

/* 内部ページ中央寄せ */
.LC_Page_Index #main_column.colnum2.right, .plg_Raku2_LC_Page_Products_List #main_column.colnum2.right, .plg_Raku2_LC_Page_Products_CategoryList, .plg_Raku2_LC_Page_Products_ProductsList #main_column.colnum2.right, .plg_Raku2_LC_Page_Products_Detail #main_column.colnum2.right {
  margin: 0 auto!important;
}

/* cookie */
#cookieMessage {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translate3d(-50%,0,0);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
  box-sizing: border-box;
  padding: var(--typ-text);
  font-size: var(--typ-text);
  width: var(--con-small);
  z-index: 1000;
  background-color: #fff;
  border: 2px solid var(--accent-color);
}
#cookieMessage .cookietext {
  margin: 0;
  width: calc(100% - (5em +  var(--typ-text)));
}
#cookieMessage .cookietext a {
  text-decoration: underline;
  text-underline-offset: .3em;
}
#cookieMessage #cookieChkBtn {
  width: 5em;
  margin-left: var(--typ-text);
  background: #f0f;
  text-align: center;
  box-sizing: border-box;
  cursor: pointer;
  padding: .3em;
  border-radius: 4px;
  color: #fff;
  background: var(--main-color);
  opacity: 1;
}
#cookieMessage #cookieChkBtn:hover {
  opacity: 0.7;
}
/* 商品詳細サムネ用提供css */
div.sub_photo img[style="box-shadow: rgb(255, 140, 0) 0px 0px 4px 2px; border-radius: 3px;"]{
box-shadow: rgb(255, 241, 0) 0px 0px 4px 2px !important;
}
#rankingarea {
  position: relative;
}

/* レビューページ用 */
.plg_Raku2_LC_Page_Products_Review #container {
  max-width: 1028px;
}