@charset "UTF-8";
/* ----- kimuchinabe all css ----- */
/* --- header --- */
body.scroll01 header {
  position: relative;
}

.header02 {
  width: 100%;
  padding: 17px 0;
  background-color: #fff;
  z-index: 9;
}

body.scroll01 .header02 {
  position: fixed;
  top: 0;
  z-index: 12px;
}

.header02 .page-logo {
  float: left;
}

.header02 .swipe-nav {
  float: right;
}

.header02 .swipe-nav > ul {
  display: table;
}

.header02 .swipe-nav > ul > li {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

.header02 .swipe-nav > ul > li:first-child {
  display: none;
}

.header02 .swipe-nav > ul > li > a {
  display: block;
  padding: 10px 18px;
  font-weight: bold;
  text-decoration: none;
  border-bottom: 3px solid #fff;
}

.header02 .swipe-nav > ul > li.under-link > a {
  border-color: #d2161a;
}

.header02 .swipe-nav > ul > li > a.onclick {
  border-color: #d2161a;
}

.header02 .swipe-nav > ul > li:last-child a {
  padding-right: 0;
}

.header02 .swipe-nav > ul > li {
  position: relative;
}

.header02 .swipe-nav ul.list-second {
  position: absolute;
  display: none;
  top: 37px;
  left: -68px;
  margin: auto;
  z-index: 1;
  min-width: 240px;
  padding-top: 18px;
}

.header02 .swipe-nav ul.list-second:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 12px 8px;
  border-color: transparent transparent #d2161a transparent;
  position: absolute;
  top: 6px;
  left: 0;
  right: 0;
  margin: auto;
}

.header02 .swipe-nav ul.list-second li {
  border: solid 1px #d2161a;
  border-bottom: none;
}

.header02 .swipe-nav ul.list-second li:last-child {
  border-bottom: solid 1px #d2161a;
}

.header02 .swipe-nav ul.list-second li a {
  display: block;
  background: #d2161a url("../../../../shared/img/svg/ar02.svg") no-repeat center right 20px;
  padding: 12px 17px;
  font-size: 15px;
  text-align: left;
  text-decoration: none;
  color: #fff;
}

.header02 .swipe-nav ul.list-second li a:hover {
  background-color: #fff;
  background-image: url("../../../../shared/img/svg/ar01.svg");
  color: #231815;
}

@media only screen and (min-width: 641px) {
  .header02 .swipe-nav > ul > li:hover .list-second {
    display: block;
  }

  .header02 .swipe-nav > ul > li:hover > a {
    border-color: #d2161a;
  }
}
@media only screen and (max-width: 640px) {
  body {
    padding-top: 0;
  }

  .contents-main {
    clear: both;
  }

  .header {
    position: relative;
  }

  .header02 .contents-inner {
    padding: 0;
  }

  .header02 .swipe-nav {
    float: none;
    width: 100%;
    padding: 0 10px;
    border-top: 2px solid #e5e5e5;
    border-bottom: 2px solid #e5e5e5;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    background-color: #fff;
  }

  .header02 .swipe-nav::-webkit-scrollbar {
    display: none;
  }

  .header02 .swipe-nav > ul li:first-child {
    display: table-cell;
  }

  .header02 .swipe-nav > ul li:first-child a {
    background: url("../img/kimuchinabe_logo.svg") no-repeat center;
    width: 130px;
    /*    background-size: 115px 18px;*/
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    height: 46px;
  }

  .header02 .swipe-nav > ul li a {
    padding: 11px 15px;
    font-size: 14px;
    outline: none;
  }

  .header02 .swipe-nav > ul li:last-child a {
    padding-right: 15px;
  }

  .header02.header-scroll {
    position: fixed;
    top: 0;
  }

  .header02.header-scroll .swipe-nav {
    padding: 1px 10px;
  }

  .header02 {
    position: relative;
    padding-top: 0;
    padding-bottom: 0;
    background: #fff;
  }

  .sp-second-menu {
    position: absolute;
    top: 56px;
    width: 100%;
  }

  .sp-second-menu ul {
    display: none;
  }

  .sp-second-menu ul.on {
    display: block;
  }

  .sp-second-menu li {
    width: 100%;
    border: solid 1px #e5e5e5;
    border-bottom: none;
  }

  .sp-second-menu li:last-child {
    border-bottom: solid 1px #e5e5e5;
  }

  .sp-second-menu li a {
    display: block;
    padding: 10px;
    background: #d2161a url("../../../../shared/img/svg/ar02.svg") no-repeat center right 20px;
    color: #fff;
  }
}
/* ----- animation ----- */
body {
  position: relative;
}

.mordal-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 100;
  display: none;
}

.mordal-conts {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 48%;
  display: none;
}

.box-move {
  width: 48%;
  margin: 0 auto;
  z-index: 1001;
  margin-bottom: 15px;
  position: relative;
  width: 100%;
  padding-top: 56.27%;
}

.box-move iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.mordal-conts01,
.mordal-conts02,
.mordal-conts03 {
  display: none;
}

.mordal-conts span {
  display: block;
  width: 38px;
  height: 38px;
  cursor: pointer;
  position: absolute;
  top: -19px;
  right: -19px;
  z-index: 1002;
}

@media only screen and (max-width: 640px) {
  .mordal-conts {
    width: 80%;
  }

  .mordal-conts span {
    width: 20px;
    height: 20px;
    top: -10px;
    right: -10px;
  }
}
#breadcrumb {
  margin-bottom: 0;
  padding-bottom: 15px;
  background-color: #e7e7e7;
}

.return-top {
  padding-top: 15px;
  display: table;
  padding-bottom: 15px;
  width: 100%;
}

.return-top span {
  display: table-cell;
  vertical-align: middle;
  text-align: right;
}

.return-top span a {
  padding-right: 10px;
  background: url("../../../../shared/img/svg/cur02.svg") no-repeat center right;
  background-size: 7px 13px;
  font-weight: bold;
  font-size: 14px;
}

/* ----- contents logo ----- */
/* --- logo --- */
.header02 .page-logo {
  width: 15.83%;
  max-width: 190px;
  height: auto;
  max-height: 38px;
  margin-top: .3%;
}
.header02 .page-logo img[src$=".svg"] {
  width: 100%;
}

.ttl_kimuchinabe {
  background: url("../img/bg_ttl_pc.png") no-repeat 50% 50%;
  text-align: center;
  margin: 3.75% auto 4.33%;
}
@media only screen and (max-width: 640px) {
  .ttl_kimuchinabe {
    margin: 11.09% auto 8.13%;
  }
}
.ttl_kimuchinabe img {
  margin: 0 auto;
}

/* --- link btn --- */
.btn-product, .btn-recipe {
  text-align: center;
  margin: 5.57% auto 7.75%;
  position: relative;
  z-index: 3;
}
.btn-product a, .btn-recipe a {
  text-decoration: none;
  color: #b91c22;
  border: solid 1px #b91c22;
  -webkit-border-radius: 2.6em;
  -moz-border-radius: 2.6em;
  -ms-border-radius: 2.6em;
  -o-border-radius: 2.6em;
  border-radius: 2.6em;
  text-align: center;
  letter-spacing: .05em;
  padding: .6em 3.5em .6em 3em;
  position: relative;
  line-height: 1.6;
  background: #fff;
  -webkit-transform: 0.3s ease-in-out;
  -moz-transform: 0.3s ease-in-out;
  -ms-transform: 0.3s ease-in-out;
  -o-transform: 0.3s ease-in-out;
  transform: 0.3s ease-in-out;
}
@media only screen and (min-width: 641px) {
  .btn-product a, .btn-recipe a {
    font-size: 100%;
    display: inline-block;
  }
}
@media only screen and (max-width: 640px) {
  .btn-product a, .btn-recipe a {
    font-size: 13px;
    padding: 1em 2em 1em 1.5em;
    display: block;
  }
}
.btn-product a:after, .btn-recipe a:after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  width: 10px;
  height: 10px;
  margin: -5px 5px 0 0;
  border-top: solid 2px #b91c22;
  border-right: solid 2px #b91c22;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.btn-product a:hover, .btn-recipe a:hover {
  background: #b91c22;
  color: #fff;
}
.btn-product a:hover:after, .btn-recipe a:hover:after {
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}

.only-tab {
  display: none;
}

@media only screen and (min-width: 641px) and (max-width: 860px) {
  .only-tab {
    display: block;
  }
}
/* --- 下層 page title --- */
.img-main-visual {
  background: url("../../products/img/bg_products_01_pc.png") no-repeat center top;
  background-size: auto 100%;
  position: relative;
}
@media only screen and (max-width: 640px) {
  .img-main-visual {
    background: url("../../products/img/bg_products_01_sp.jpg") no-repeat;
    background-size: contain;
  }
}
.img-main-visual h2 {
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  font-weight: 600;
  color: #fff;
  text-align: center;
  font-size: 40px;
  padding-top: 5.5%;
}
@media only screen and (min-width: 641px) {
  .img-main-visual h2 {
    max-width: 1200px;
  }
}
@media only screen and (max-width: 640px) {
  .img-main-visual h2 {
    font-size: 24px;
  }
}
@media only screen and (max-width: 640px) {
  .img-main-visual h2 {
    padding-top: 16.19%;
  }
}
.img-main-visual h2 span {
  font-size: 24px;
  font-weight: bold;
  display: block;
  margin-bottom: .75%;
}
@media only screen and (max-width: 640px) {
  .img-main-visual h2 span {
    font-size: 16px;
  }
}
.img-main-visual h2:after {
  content: "";
  display: block;
  padding-top: 6.5%;
  padding-bottom: 5.5%;
}
@media only screen and (max-width: 640px) {
  .img-main-visual h2:after {
    padding-top: 16.75%;
  }
}

/* --- 下層 page lead --- */
.txt-lead-01 {
  font-size: 20px;
  text-align: center;
  line-height: 1.4;
  margin-bottom: 2%;
}
@media only screen and (max-width: 640px) {
  .txt-lead-01 {
    font-size: 15px;
    padding: 0 1em;
  }
}