@charset "UTF-8";
body {
  font-family: 'Noto Sans JP', sans-serif;
  color: #525263;
  transition: z-index 0ms 5.28455ms;
  background: #f6f6f6;
  margin: 0; }

/*
見出し

ページ内で見出しとして機能する要素のスタイル群です。1

sg-wrapper:
<div class="ec-role">
  <sg-wrapper-content/>
</div>

Styleguide 1.1
*/
/*
見出し

商品紹介等で利用される、一般的な見出しのスタイルです。

ex [商品詳細ページ　商品見出し部分](http://demo3.ec-cube.net/products/detail/27)

Markup:
.ec-headingTitle マトリョーシカ

Styleguide 1.1.1
*/
.ec-headingTitle {
  margin: 0 0 8px;
  font-size: 32px;
  font-weight: normal;
  color: #525263; }

/*
ページヘッダ

各種ページで用いられるページヘッダのデザインです。

ex [利用規約ページ　ページヘッダ部](http://demo3.ec-cube.net/help/agreement)

Markup:
.ec-pageHeader
  h1 利用規約

Styleguide 1.1.2
*/
.ec-pageHeader h1 {
  margin: 0 0 8px;
  border-bottom: 1px dotted #ccc;
  border-top: 1px solid #ccc;
  padding: 8px 0 12px;
  font-size: 16px;
  font-weight: bold; }
@media screen and (min-width: 768px) {
  .ec-pageHeader h1 {
    border-top: none;
    border-bottom: 1px solid #ccc;
    margin: 10px 16px 48px;
    padding: 8px;
    font-size: 32px;
    font-weight: bold; } }

/*
サブ見出し

利用規約など、文字主体のページで用いられるサブ見出しです。

ex [利用規約ページ サブ見出し部分](http://demo3.ec-cube.net/help/agreement)

Markup:
.ec-heading 第1条 (会員)

Styleguide 1.1.3
*/
.ec-heading {
  margin: 24px 0; }

/*
サブ見出し(太字)

文字主体のページで用いられるサブ見出しの太字のスタイルです。

ex [プライバシーポリシー サブ見出し部分](http://demo3.ec-cube.net/help/privacy)

Markup:
.ec-heading-bold 個人情報の定義

Styleguide 1.1.4
*/
.ec-heading-bold {
  margin: 16px 0;
  font-size: 16px;
  font-weight: bold; }
@media screen and (min-width: 768px) {
  .ec-heading-bold {
    font-size: 18px; } }

/*
背景付き見出し

マイページ注文履歴等で用いられる背景付きの見出しです。

ex [ご注文履歴詳細　背景付き見出し部分](http://demo3.ec-cube.net/mypage/history/1063)

Markup:
.ec-rectHeading
  h2 配送情報
.ec-rectHeading
  h2 お支払について

Styleguide 1.1.5
*/
.ec-rectHeading h1, .ec-rectHeading h2, .ec-rectHeading h3, .ec-rectHeading h4, .ec-rectHeading h5, .ec-rectHeading h6 {
  padding: 8px 12px;
  font-size: 20px;
  font-weight: bold; }

/*
メッセージ見出し

ユーザが行った操作に対する、完了報告やエラー表示のページで使用される見出しのスタイルです。

ex [注文完了 ログイン後、カートに商品を入れ注文完了まで行う](http://demo3.ec-cube.net/shopping/)

Markup:
.ec-reportHeading
  h2 ご注文ありがとうございました

Styleguide 1.1.6
*/
.ec-reportHeading {
  width: 100%;
  border-top: 1px dotted #ccc;
  margin: 20px 0 30px;
  padding: 0;
  text-align: center;
  font-size: 24px;
  font-weight: bold; }
@media screen and (min-width: 768px) {
  .ec-reportHeading {
    border-top: 0;
    font-size: 32px; } }
.ec-reportHeading h1, .ec-reportHeading h2, .ec-reportHeading h3, .ec-reportHeading h4, .ec-reportHeading h5, .ec-reportHeading h6, .ec-reportHeading p {
  font-weight: bold;
  font-size: 24px; }
@media screen and (min-width: 768px) {
  .ec-reportHeading h1, .ec-reportHeading h2, .ec-reportHeading h3, .ec-reportHeading h4, .ec-reportHeading h5, .ec-reportHeading h6, .ec-reportHeading p {
    font-size: 32px; } }

/*
ヘッダー部分のカスタマイズ
*/
.ec-itemNav__nav li ul li a {
  border-bottom: 1px solid #E8E8E8;
  padding: 16px 22px 16px 16px;
  font-size: 16px;
  font-weight: bold;
  color: white;
  text-align: left;
  background: #8FC31F;
  transition-duration: .3s; }

.ec-itemNav__nav li ul li.childCat a {
  transition-duration: .3s; }
.ec-itemNav__nav li ul li.childCat a:hover {
  background: #8FC31F;
  opacity: .6;
  padding-left: 20px;
  position: relative; }

/*
スマホ位メニュー部分のカスタマイズ
*/
.ec-drawerRole .ec-headerLinkArea {
  background: #8FC31F; }

.ec-drawerRole {
  overflow-y: scroll;
  background: #8FC31F;
  width: 260px;
  height: 100vh;
  transform: translateX(-300px);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  transition: z-index 0ms 1ms; }

/*
検索バー部分のカスタマイズ
*/
.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search {
  position: relative;
  border: 0;
  background: #8FC31F;
  color: #fff; }

/* 
トップページスライダー部分のカスタマイズ
*/
.ec-sliderRole {
  margin-bottom: 24px;
  padding-left: 0 !important;
  padding-right: 0 !important; }
.ec-sliderRole ul {
  padding: 0;
  list-style: none; }

.ec-sliderItemRole {
  margin-bottom: 24px; }
.ec-sliderItemRole ul {
  padding: 0;
  list-style: none; }
.ec-sliderItemRole .item_nav {
  display: none; }
@media screen and (min-width: 768px) {
  .ec-sliderItemRole .item_nav {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-bottom: 0; } }
.ec-sliderItemRole .slideThumb {
  margin-bottom: 25px;
  width: 33%;
  opacity: .8;
  cursor: pointer; }
.ec-sliderItemRole .slideThumb:focus {
  outline: none; }
.ec-sliderItemRole .slideThumb:hover {
  opacity: 1; }
.ec-sliderItemRole .slideThumb img {
  width: 80%; }

/*
フッター部分のカスタマイズ
*/
.fotTopNav {
  padding-top: 30px;
  padding-bottom: 30px;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8fc31f+0,73b501+100 */
  background: #8fc31f;
  /* Old browsers */
  background: -moz-linear-gradient(-45deg, #8fc31f 0%, #73b501 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(-45deg, #8fc31f 0%, #73b501 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, #8fc31f 0%, #73b501 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8fc31f', endColorstr='#73b501',GradientType=1 );
  /* IE6-9 fallback on horizontal gradient */ }
.fotTopNav ul {
  margin-bottom: 0; }

.ec-footerTitle .ec-footerTitle__logo {
  display: block;
  margin-bottom: 30px;
  font-weight: bold; }
.ec-footerTitle .ec-footerTitle__logo img {
  max-width: 160px;
  width: 100%; }

.ec-footerRole {
  border-top: none;
  background: #333; }
@media screen and (min-width: 768px) {
  .ec-footerRole {
    padding-top: 0; } }

.ec-footerNavi .ec-footerNavi__link a {
  display: inline-block;
  border-bottom: none;
  margin: 0 10px;
  padding: 0;
  text-decoration: none; }

.ec-footerNavi {
  padding: 0;
  color: white;
  list-style: none;
  text-align: center; }
.ec-footerNavi li:first-child a {
  border-top: 0; }
.ec-footerNavi li i {
  margin-right: 6px; }
.ec-footerNavi .ec-footerNavi__link {
  display: block; }
@media screen and (min-width: 768px) {
  .ec-footerNavi .ec-footerNavi__link {
    display: inline-block; } }
.ec-footerNavi .ec-footerNavi__link a {
  display: block;
  border-top: 1px dashed #ccc;
  padding: 15px 20px;
  font-size: 14px;
  color: inherit;
  text-decoration: none;
  margin: 0;
  text-align: left;
  position: relative;
  background: #F8F8F8;
  color: #000; }
.ec-footerNavi .ec-footerNavi__link a:after {
  position: absolute;
  right: 20px;
  top: 50%;
  margin-top: -0.5em;
  content: "\f105";
  font-family: "Font Awesome 5 Free";
  font-weight: 900; }
@media screen and (min-width: 768px) {
  .ec-footerNavi .ec-footerNavi__link a:after {
    display: none; } }
@media screen and (min-width: 768px) {
  .ec-footerNavi .ec-footerNavi__link a {
    display: inline-block;
    border-bottom: none;
    margin: 0 10px;
    padding: 0;
    text-decoration: none;
    text-align: center;
    background: none;
    color: #fff;
    border-top: 0; } }
.ec-footerNavi .ec-footerNavi__link:hover a {
  opacity: .8;
  text-decoration: none; }

/*
商品ページ用のCSSです。
/*
見出し

商品紹介等で利用される、一般的な見出しのスタイルです。

ex [商品詳細ページ　商品見出し部分](http://demo3.ec-cube.net/products/detail/27)

Markup:
.ec-headingTitle マトリョーシカ

Styleguide 1.1.1
*/
.ec-productRole__description br + br {
  display: none; }

.detailBox {
  /* detailDeli */ }
.detailBox + br {
  display: none; }
.detailBox .detailTitle {
  color: #709D10;
  font-size: 20px;
  border-bottom: 2px solid #8fc31f;
  margin-bottom: 8px;
  font-weight: bold; }
.detailBox .detailTitle + br {
  display: none; }
.detailBox table {
  width: 100%;
  margin-bottom: 8px; }
.detailBox table + br {
  display: none; }
.detailBox th, .detailBox td {
  text-align: center;
  border: solid 1px #666;
  height: 1.6em; }
.detailBox tr.head th {
  background: #8fc31f;
  color: #fff; }
.detailBox tr th {
  width: 80px; }
.detailBox p.tani {
  text-align: right;
  font-size: 14px; }
.detailBox.detailDeli tr th {
  background: #8fc31f;
  color: #fff;
  width: 30%; }

.ec-productRole__description .commentBox br + br {
    display: block !important; }

/* detailBox */