@charset "UTF-8";
.pd-t0 {
  padding-top: 0 !important; }

.mg-t0 {
  margin-top: 0 !important; }

@media only screen and (min-width: 768px), print {
  .sp-only {
    display: none !important; } }

@media only screen and (max-width: 767px) {
  .pc-only {
    display: none !important; } }

.pd-t0 {
  padding-top: 0 !important; }

.mg-t0 {
  margin-top: 0 !important; }

@media only screen and (min-width: 768px), print {
  .sp-only {
    display: none !important; } }

@media only screen and (max-width: 767px) {
  .pc-only {
    display: none !important; } }

.sec_products_txt .box .item._img img, .wrap_itemSlider img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: auto; }

.index_mainimg {
  background-image: url("../img/index_mainimg.jpg"); }

.page-menu {
  position: relative;
  background: url("../../aboutshop/img/menu-line.png") top no-repeat, url("../../aboutshop/img/menu-line.png") bottom no-repeat;
  background-size: auto 2px,auto 2px;
  padding: 25px 0;
  margin-bottom: 115px; }
  @media only screen and (max-width: 767px) {
    .page-menu {
      background-size: 100% 2px,100% 2px;
      padding: 20px 0 5px 0;
      margin-bottom: 40px; } }

.page-menu ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 18px;
  font-size: 1.8rem; }
  @media only screen and (max-width: 575px) {
    .page-menu ul {
      font-size: 14px;
      font-size: 1.4rem; } }

.page-menu li {
  margin: 0 30px; }
  @media only screen and (max-width: 767px) {
    .page-menu li {
      margin: 0 0 15px 0;
      width: 33%;
      text-align: center; } }

.page-menu a {
  color: #6C2C2F;
  position: relative;
  display: inline-block;
  padding-left: 15px; }

.page-menu a:before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 1px solid #6C2C2F;
  border-right: 1px solid #6C2C2F;
  transform: rotate(135deg);
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -6px; }

.page-menu .online a:before {
  border: 0;
  background: url("../img/icon_window.png") center no-repeat;
  width: 10px;
  height: 8px;
  margin-top: -4px;
  background-size: contain;
  transform: rotate(0deg); }

/* product_cat */
.product_cat {
  width: 980px;
  margin: 0 auto 60px auto;
  padding-bottom: 60px;
  border-bottom: 1px solid #d4d4d4; }
  .product_cat img {
    max-width: 100%; }
  @media only screen and (max-width: 767px) {
    .product_cat {
      width: auto;
      margin: 0 15px 40px 15px;
      padding-bottom: 40px; } }
  .product_cat:last-child {
    border-bottom: 0;
    padding-bottom: 0; }
  .product_cat img {
    max-width: 100%; }
  .product_cat .intro {
    display: flex;
    justify-content: space-between;
    margin-bottom: 35px; }
    @media only screen and (max-width: 767px) {
      .product_cat .intro {
        display: block; } }
    .product_cat .intro .slide {
      width: 434px; }
      @media only screen and (max-width: 767px) {
        .product_cat .intro .slide {
          margin: 0 auto 15px auto;
          width: auto; } }
      .product_cat .intro .slide .img {
        margin-bottom: 10px; }
      .product_cat .intro .slide ul {
        display: flex; }
      .product_cat .intro .slide li {
        width: 82px;
        margin-right: 6px;
        cursor: pointer; }
        .product_cat .intro .slide li:last-child {
          margin-right: 0; }
    .product_cat .intro .text {
      width: 492px;
      padding-top: 30px; }
      @media only screen and (max-width: 767px) {
        .product_cat .intro .text {
          width: auto;
          padding-top: 0; } }
      .product_cat .intro .text h2 {
        font-size: 23px;
        font-size: 2.3rem;
        line-height: 1.4;
        margin-bottom: 15px;
        font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; }
        @media only screen and (max-width: 575px) {
          .product_cat .intro .text h2 {
            font-size: 18px;
            font-size: 1.8rem; } }
      .product_cat .intro .text p {
        font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; }
      .product_cat .intro .text dt {
        margin-top: 45px;
        font-weight: bold; }
        @media only screen and (max-width: 767px) {
          .product_cat .intro .text dt {
            margin-top: 30px; } }
  .product_cat .lineup {
    background: #f5f5f5;
    padding: 30px 35px; }
    @media only screen and (max-width: 767px) {
      .product_cat .lineup {
        padding: 15px; } }
    .product_cat .lineup .head {
      position: relative;
      margin-bottom: 20px; }
      .product_cat .lineup .head h3 .label {
        display: inline-block;
        font-size: 13px;
        font-size: 1.3rem;
        color: #6c2c2f;
        font-weight: bold;
        position: relative;
        padding-left: 25px; }
        @media only screen and (max-width: 575px) {
          .product_cat .lineup .head h3 .label {
            font-size: 14px;
            font-size: 1.4rem; } }
        .product_cat .lineup .head h3 .label:before {
          background: url("../img/shop-icon.png") center no-repeat;
          content: "";
          background-size: contain;
          width: 19px;
          height: 19px;
          display: inline-block;
          position: absolute;
          vertical-align: middle;
          left: 0; }
      .product_cat .lineup .head h3 .cat {
        font-size: 16px;
        font-size: 1.6rem;
        font-weight: bold;
        margin-left: 15px; }
        @media only screen and (max-width: 575px) {
          .product_cat .lineup .head h3 .cat {
            font-size: 14px;
            font-size: 1.4rem; } }
        @media only screen and (max-width: 767px) {
          .product_cat .lineup .head h3 .cat {
            display: block;
            margin-bottom: 10px;
            margin-left: 25px; } }
      .product_cat .lineup .head .link {
        position: absolute;
        right: 0;
        top: -4px; }
        @media only screen and (max-width: 767px) {
          .product_cat .lineup .head .link {
            position: static;
            text-align: right;
            margin-bottom: 10px; } }
        .product_cat .lineup .head .link a {
          display: block;
          background: #fff;
          position: relative;
          border: 1px solid #6c2c2f;
          color: #6c2c2f;
          padding: 2px 26px 2px 13px;
          font-weight: bold; }
          @media only screen and (max-width: 767px) {
            .product_cat .lineup .head .link a {
              display: inline-block; } }
          .product_cat .lineup .head .link a:after {
            content: "";
            display: inline-block;
            width: 8px;
            height: 8px;
            border-top: 1px solid #6C2C2F;
            border-right: 1px solid #6C2C2F;
            transform: rotate(45deg);
            position: absolute;
            right: 10px;
            top: 50%;
            margin-top: -5px; }
    .product_cat .lineup ul {
      display: flex; }
      @media only screen and (max-width: 767px) {
        .product_cat .lineup ul {
          flex-wrap: wrap;
          justify-content: space-between; } }
    .product_cat .lineup li {
      margin-right: 17px;
      text-align: center;
      width: 168px; }
      @media only screen and (max-width: 767px) {
        .product_cat .lineup li {
          margin-right: 0;
          margin-bottom: 15px;
          width: 48%; } }
      .product_cat .lineup li:last-child {
        margin-right: 0; }
      .product_cat .lineup li .name {
        margin-top: 12px;
        line-height: 1.4;
        font-size: 13px;
        font-size: 1.3rem; }
        @media only screen and (max-width: 575px) {
          .product_cat .lineup li .name {
            font-size: 14px;
            font-size: 1.4rem; } }
      .product_cat .lineup li > a {
        display: block; }
      .product_cat .lineup li a {
        color: #474747; }

.wrap_ttl_recipe_name {
  margin-bottom: 2em; }
  .wrap_ttl_recipe_name .qs_header__entry {
    margin-bottom: 10px; }
  .wrap_ttl_recipe_name .list_sns_button {
    -js-display: flex;
    display: flex;
    justify-content: flex-end;
    margin-top: 10px; }
    .wrap_ttl_recipe_name .list_sns_button li + li {
      margin-left: 10px; }
    .wrap_ttl_recipe_name .list_sns_button .fb_iframe_widget {
      line-height: 1; }

.sec_products_txt .desc_products {
  text-align: justify;
  text-justify: inter-ideograph; }
.sec_products_txt .box {
  -js-display: flex;
  display: flex;
  flex-direction: column; }
  @media only screen and (min-width: 768px), print {
    .sec_products_txt .box {
      flex-direction: row; } }
  .sec_products_txt .box .item._txt {
    order: 2;
    margin-top: 2em; }
    @media only screen and (min-width: 768px), print {
      .sec_products_txt .box .item._txt {
        width: 40%;
        margin-top: 0;
        padding-left: 40px; } }
  .sec_products_txt .box .item._img {
    order: 1; }
    @media only screen and (min-width: 768px), print {
      .sec_products_txt .box .item._img {
        width: 60%; } }
    @media only screen and (min-width: 768px), print {
      .sec_products_txt .box .item._img .wrap_img {
        position: sticky;
        top: 100px; } }

.wrap_itemSlider {
  overflow: hidden;
  margin: -7px; }

#itemSlider {
  min-width: 100%;
  width: 0;
  padding: 7px; }
  #itemSlider .slick-list {
    background-color: #f8f8f8; }
  #itemSlider > .item:not(:first-child) {
    display: none !important; }
  #itemSlider .item {
    vertical-align: bottom; }

#itemSliderNav {
  min-width: 100%;
  width: 0; }
  #itemSliderNav .slick-track {
    margin: 0; }
  #itemSliderNav .slick-current .item:after {
    content: "";
    display: block;
    position: absolute;
    top: 7px;
    right: 7px;
    bottom: 7px;
    left: 7px;
    border: 2px solid #7faa12; }
  #itemSliderNav > .item {
    display: none !important; }
  #itemSliderNav .item {
    position: relative;
    padding: 7px;
    cursor: pointer;
    vertical-align: bottom; }

.btn_back_list {
  margin-top: 30px;
  text-align: center; }
  @media only screen and (min-width: 576px), print {
    .btn_back_list {
      margin-top: 35px; } }
  @media only screen and (min-width: 768px), print {
    .btn_back_list {
      margin-top: 50px; } }
  .btn_back_list a {
    transition-property: all;
    transition-duration: 0.5s;
    transition-timing-function: ease;
    display: inline-block;
    padding: 8px 15px;
    border: 1px solid #7faa12;
    border-radius: 3px;
    color: #7faa12; }
    @media only screen and (min-width: 768px), print {
      .btn_back_list a {
        padding: 8px 45px; } }
    .btn_back_list a:hover {
      background-color: #7faa12;
      color: #fff;
      text-decoration: none; }
