@charset "UTF-8";
/* Scss Document */
@import url(reset.css);
/*=======================================================
    css
========================================================*/
/*-------------- ブレークポイント作成 ここから ----------------*/
/*-------------- ブレークポイント作成 ここまで ----------------*/
/*-------------- calc mixin ここから ----------------*/
/*-------------- calc mixin ここまで ----------------*/
@font-face {
  font-family: "HiraginoCustom";
  font-weight: 100;
  src: local("HiraginoSans-W1"), local("Hiragino Sans");
}
@font-face {
  font-family: "HiraginoCustom";
  font-weight: 300;
  src: local("HiraginoSans-W3"), local("Hiragino Sans");
}
@font-face {
  font-family: "HiraginoCustom";
  font-weight: 600;
  src: local("HiraginoSans-W6"), local("Hiragino Sans");
}
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 16px;
  line-height: 1.5;
  color: #604C3F;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}

main {
  display: block;
}

a {
  text-decoration: none;
}
a:hover {
  cursor: pointer;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
  opacity: 0.75;
}
a:visited, a:link {
  color: #604C3F;
}

img {
  max-width: 100%;
  vertical-align: middle;
}

.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

.inner {
  max-width: 1000px;
  width: calc(100% - 40px);
  margin: 0px auto;
}

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

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

p {
  font-size: 1.7rem;
}
@media screen and (max-width: 768px) {
  p {
    font-size: 1.5rem;
  }
}

.txt-center {
  text-align: center;
}

/*=======================================================

     header

========================================================*/
.header {
  width: 100%;
  min-height: 71px;
  position: fixed;
  top: 0;
  -webkit-transition: all 0.3s ease-in;
  -o-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  z-index: 100;
}
@media screen and (max-width: 768px) {
  .header {
    background-color: #FFE36A;
  }
}
.header_spMenu {
  display: none;
}
@media screen and (max-width: 768px) {
  .header_spMenu {
    display: block;
    position: absolute;
    top: 25px;
    right: 5%;
    width: 30px;
    height: 22px;
    background: #604C3F;
    border-top: 10px solid #FFE36A;
    border-bottom: 10px solid #FFE36A;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
  }
  .header_spMenu::before {
    content: "";
    position: absolute;
    width: 30px;
    height: 2px;
    background: #604C3F;
    top: -9px;
    right: 0;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
  }
  .header_spMenu::after {
    content: "";
    position: absolute;
    width: 30px;
    height: 2px;
    background: #604C3F;
    bottom: -9px;
    right: 0;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
  }
  .header_spMenu.active {
    background-color: #FFE36A;
  }
  .header_spMenu.active::before {
    -webkit-transform: rotate(-135deg);
        -ms-transform: rotate(-135deg);
            transform: rotate(-135deg);
    top: 0;
    right: 0;
  }
  .header_spMenu.active::after {
    -webkit-transform: rotate(135deg);
        -ms-transform: rotate(135deg);
            transform: rotate(135deg);
    bottom: 0;
    right: 0;
  }
}
.header #gNav {
  line-height: 1;
  display: block;
}
@media screen and (max-width: 768px) {
  .header #gNav ul {
    display: none;
    position: absolute;
    top: 65px;
    left: 0;
    width: 100%;
    border-top: 1px solid #fff;
    z-index: 100;
  }
}
.header #gNav ul li {
  width: 16.6666%;
  min-height: 71px;
  background-color: rgba(255, 227, 106, 0.8);
}
.header #gNav ul li:hover {
  background-color: #F39800;
  opacity: 1;
}
.header #gNav ul li:hover > a {
  color: #fff;
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .header #gNav ul li {
    background-color: #FFE36A;
    clear: both;
    width: 100%;
    min-height: auto;
    z-index: 100;
  }
}
.header #gNav ul li a {
  display: block;
  padding: 20px 0;
  text-align: center;
  font-size: 2.1rem;
  line-height: 1.5;
}
@media screen and (max-width: 991px) {
  .header #gNav ul li a {
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 768px) {
  .header #gNav ul li a {
    display: block;
    width: 100%;
    background-color: #FFE36A;
    color: #604C3F;
    padding: 20px;
    font-size: 1.6rem;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    position: relative;
    text-align: center;
    border-bottom: 1px solid #fff;
    z-index: 100;
  }
  .header #gNav ul li a:hover {
    background-color: #F39800;
  }
}
.header #gNav ul li a span.newLine {
  display: inline-block;
  font-size: inherit;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  .header #gNav ul li a span.newLine {
    font-size: inherit;
  }
}

.is-fixed {
  opacity: 1;
  background-color: #FFE36A;
  z-index: 200;
}

/*=======================================================

     footer

========================================================*/
.footer {
  text-align: center;
  border-top: 3px solid #604C3F;
  padding: 50px 0 20px;
  font-size: 1.4rem;
}
@media screen and (max-width: 768px) {
  .footer {
    padding: 30px 5px 10px;
    font-size: 1.2rem;
  }
}
.footer .footer_logo {
  text-align: center;
  padding: 0 0 13px 0;
}
.footer .footer_logo a img {
  width: 231px;
}

/*=======================================================

     共通パーツ

========================================================*/
/*---------- トップ・下層共通パーツ ----------*/
#pageTop {
  position: fixed;
  width: 52px;
  right: 40px;
  bottom: 40px;
}
@media screen and (max-width: 768px) {
  #pageTop {
    width: 40px;
    right: 20px;
    bottom: 0px;
  }
}
#pageTop:hover {
  opacity: 0.7;
}

.list {
  padding-left: 1em;
}
.list li {
  position: relative;
  padding-left: 0.4em;
}
.list li::before {
  position: absolute;
  top: 0;
  left: -1em;
}
.list li:nth-child(n+2) {
  margin-top: 5px;
}
.list-note li::before {
  content: "※";
}
.list-desc li::before {
  content: "・";
}
.list-doubleCircle li::before {
  content: "◎";
}

@media screen and (min-width: 769px) {
  .layout {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

.title-bdr {
  font-size: 3.4rem;
  text-align: center;
  font-weight: 600;
  background: url(../img/common/h1_bg_line.png) repeat-x bottom;
  padding-bottom: 20px;
  letter-spacing: 0.075em;
}
@media screen and (max-width: 768px) {
  .title-bdr {
    font-size: 2.55rem;
    padding-bottom: 10px;
    letter-spacing: 0.05em;
  }
}

.text-bold {
  font-weight: bold;
}
.text-tel {
  display: block;
  word-break: break-all;
  line-height: 1.1;
}
@media screen and (min-width: 769px) {
  .text-tel {
    pointer-events: none;
  }
}
.text-tel span {
  position: relative;
  padding-left: 65px;
}
@media screen and (max-width: 768px) {
  .text-tel span {
    padding-left: 50px;
  }
}
.text-tel span::before {
  content: "";
  display: block;
  float: left;
  background: url(../img/common/ico_tel.png) no-repeat center center;
  background-size: contain;
  width: 48px;
  height: 32px;
  position: absolute;
  top: 10px;
  left: 0;
}
@media screen and (max-width: 768px) {
  .text-tel span::before {
    width: 40px;
    height: 26.66px;
    top: 5px;
  }
}
.text-tel a {
  color: inherit;
}

.underlayer .inner {
  padding: 236px 0 70px 0;
}
@media screen and (max-width: 1160px) {
  .underlayer .inner {
    padding: 165px 0 70px 0;
  }
}
@media screen and (max-width: 768px) {
  .underlayer .inner {
    padding: 50px 0;
  }
}

/*=======================================================

     トップページ #top

========================================================*/
#top .title {
  color: #7D534F;
}
#top p {
  line-height: 1.9;
}
@media screen and (max-width: 991px) {
  #top p {
    font-size: 1.55rem;
    line-height: 1.8;
  }
}
@media screen and (min-width: 769px) {
  #top .contBox-left {
    float: left;
    width: 50%;
  }
}
@media screen and (min-width: 769px) {
  #top .contBox-right {
    float: right;
    width: 50%;
  }
}
@media screen and (max-width: 768px) {
  #top .contBox-right {
    margin-top: 25px;
  }
}
#top .title-shiitake {
  font-size: 3.4rem;
  text-align: center;
  font-weight: 600;
  background: url(../img/common/h1_bg_line.png) repeat-x bottom;
  padding-bottom: 20px;
  letter-spacing: 0.075em;
}
@media screen and (max-width: 768px) {
  #top .title-shiitake {
    font-size: 2.3rem;
  }
}
#top .title-shiitake::before {
  content: "";
  display: block;
  background: url(../img/top/ico_shiitake.png) no-repeat center top;
  width: 107px;
  height: 118px;
  margin: 0 auto;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  #top .title-shiitake::before {
    width: 53.5px;
    height: 59px;
  }
}
#top .title-orange {
  color: #F39800;
  border-bottom: 1px solid #604C3F;
  font-family: "HiraginoCustom";
  font-size: 5.6rem;
  font-weight: 100;
  text-align: center;
  padding: 20px 0;
  background-image: none;
}
@media screen and (max-width: 768px) {
  #top .title-orange {
    font-size: 3rem;
    padding: 10px 0;
  }
}
#top .title-orange span {
  font-weight: inherit;
}
@media screen and (max-width: 768px) {
  #top .title-orange span {
    display: inline-block;
  }
}
#top .title-leftBorder {
  font-size: 2.8rem;
  font-weight: 600;
  border-left: 5px solid #F39800;
  padding-left: 20px;
  color: #7D534F;
}
@media screen and (max-width: 768px) {
  #top .title-leftBorder {
    font-size: 2.1rem;
  }
}
#top .title-circle {
  font-size: 2.4rem;
  position: relative;
  margin-left: 1em;
  padding-left: 5px;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}
#top .title-circle::before {
  content: "●";
  color: #F39800;
  position: absolute;
  left: -1em;
  top: 0;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}
@media screen and (max-width: 768px) {
  #top .title-circle {
    font-size: 1.8rem;
  }
}
#top .title-square {
  font-size: 2.1rem;
  position: relative;
  margin-left: 1em;
}
#top .title-square::before {
  content: "■";
  position: absolute;
  left: -1em;
  top: 0;
}
@media screen and (max-width: 768px) {
  #top .title-square {
    font-size: 1.7rem;
  }
}
#top .title-dashedBorder {
  text-align: center;
  font-size: 2.4rem;
  letter-spacing: 0.022em;
  border-bottom: 1px dashed #7D534F;
  padding-bottom: 5px;
}
@media screen and (max-width: 768px) {
  #top .title-dashedBorder {
    font-size: 1.8rem;
  }
}
#top .text-red {
  color: #B94100;
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
}
#top .text-red .small {
  font-size: 2rem;
}
#top .text-bold {
  font-weight: bold;
}
#top .text-gochic {
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}
#top .text-circle {
  color: #fff;
  background-color: #F39800;
  padding: 0;
  margin: 0;
  width: 65px;
  height: 65px;
  line-height: 65px;
  text-align: center;
  display: inline-block;
  border-radius: 50%;
}
#top .text-redBack {
  background-color: #B94100;
  color: #fff;
  text-align: center;
}
#top .text-doubleBorder {
  border: 3px double #604C3F;
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  text-align: center;
  padding: 5px;
}
#top .text-doubleBorder span {
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  display: block;
  font-weight: 600;
}
#top .text-border {
  border: 1px solid #604C3F;
  text-align: center;
  font-weight: 600;
}
#top .text-border span {
  font-weight: inherit;
}
#top .text-center {
  text-align: center;
}
#top .main_img {
  width: 100%;
  position: relative;
}
@media screen and (max-width: 1160px) {
  #top .main_img {
    margin-top: 102px;
  }
}
@media screen and (max-width: 991px) {
  #top .main_img {
    margin-top: 94px;
  }
}
@media screen and (max-width: 768px) {
  #top .main_img {
    margin-top: 71px;
    padding-top: 110px;
  }
}
#top .main_img img {
  width: 100%;
}
#top .main_imgBtn {
  z-index: 50;
}
@media screen and (min-width: 769px) {
  #top .main_imgBtn {
    position: fixed;
  }
}
@media screen and (max-width: 768px) {
  #top .main_imgBtn {
    position: absolute;
  }
}
#top .main_imgBtn a {
  width: 100%;
  display: block;
}
#top .main_imgBtn-right {
  top: 90px;
  right: 50px;
  background-color: #F08300;
  border: 1px solid #fff;
  border-radius: 7px;
  -webkit-box-shadow: 3px 3px 4px 3px rgba(0, 0, 0, 0.2);
          box-shadow: 3px 3px 4px 3px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 1400px) {
  #top .main_imgBtn-right {
    right: 10px;
  }
}
@media screen and (max-width: 1374px) {
  #top .main_imgBtn-right {
    top: 110px;
  }
}
@media screen and (max-width: 768px) {
  #top .main_imgBtn-right {
    top: 90px;
  }
}
#top .main_imgBtn-right a {
  display: block;
  color: #fff;
  padding: 8.5px 6px;
}
#top .main_imgBtn-right a p {
  font-size: 1.4rem;
  line-height: 1.28;
  text-align: center;
}
#top .main_imgBtn-right a p span {
  display: block;
  color: #F08300;
  font-weight: bold;
  background-color: #fff;
  padding: 5.5px 5px;
  margin-top: 5px;
}
#top .main_imgBtn-right a p span::after {
  content: ">";
  display: inline-block;
  padding-left: 5px;
}
#top .main_imgBtn-left {
  width: 174px;
  top: 81px;
  left: 41px;
}
@media screen and (max-width: 1374px) {
  #top .main_imgBtn-left {
    top: 101px;
  }
}
@media screen and (max-width: 1400px) {
  #top .main_imgBtn-left {
    left: 1px;
  }
}
@media screen and (max-width: 768px) {
  #top .main_imgBtn-left {
    top: 10px;
    width: 130px;
  }
}
#top .main_imgBtn-left2 {
  width: 300px;
  top: 81px;
  left: 216px;
}
@media screen and (max-width: 1374px) {
  #top .main_imgBtn-left2 {
    top: 101px;
  }
}
@media screen and (max-width: 1400px) {
  #top .main_imgBtn-left2 {
    left: 160px;
  }
}
@media screen and (max-width: 768px) {
  #top .main_imgBtn-left2 {
    top: 10px;
    left: 123px;
    width: 228px;
  }
}
#top #about .btn {
  bottom: 138px;
  background-color: #F08300;
  border: 1px solid #fff;
  border-radius: 7px;
  -webkit-box-shadow: 1.8px 1.8px 1.8px 1.5px rgba(0, 0, 0, 0.2);
          box-shadow: 1.8px 1.8px 1.8px 1.5px rgba(0, 0, 0, 0.2);
}
@media screen and (min-width: 1251px) {
  #top #about .btn {
    right: 355px;
  }
}
@media screen and (max-width: 1250px) {
  #top #about .btn {
    left: 55.5%;
    bottom: 12%;
  }
}
@media screen and (min-width: 769px) {
  #top #about .btn {
    position: absolute;
  }
}
@media screen and (max-width: 768px) {
  #top #about .btn {
    max-width: 285px;
  }
}
#top #about .btn a {
  display: block;
  text-align: right;
  color: #fff;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 7px 5px 5px 26px;
  letter-spacing: -0.04em;
}
@media screen and (max-width: 1090px) {
  #top #about .btn a {
    font-size: 1.3rem;
    padding: 7px 5px 5px 15px;
  }
}
@media screen and (max-width: 880px) {
  #top #about .btn a {
    padding: 4px 4px 4px 9px;
  }
}
@media screen and (max-width: 768px) {
  #top #about .btn a {
    text-align: center;
    font-size: 1.5rem;
    font-weight: 600;
    padding: 6.5px 10px;
    letter-spacing: normal;
  }
}
#top #about .btn a span {
  position: relative;
  font-size: inherit;
  font-weight: inherit;
}
@media screen and (max-width: 768px) {
  #top #about .btn a span {
    display: block;
  }
}
#top #about .btn a span::after {
  content: "＞";
  padding-left: 20px;
  font-weight: normal;
}
@media screen and (max-width: 1090px) {
  #top #about .btn a span::after {
    padding-left: 10px;
  }
}
@media screen and (max-width: 880px) {
  #top #about .btn a span::after {
    padding-left: 4px;
  }
}
@media screen and (max-width: 768px) {
  #top #about .btn a span::after {
    position: absolute;
    right: 0;
  }
}
#top #about .content {
  padding: 70px 0;
}
@media screen and (max-width: 768px) {
  #top #about .content {
    padding: 35px 0 45px;
  }
}
@media screen and (max-width: 768px) {
  #top #about .content .title-shiitake {
    font-size: 2.3rem;
  }
}
#top #about .content-01.inner {
  max-width: 1160px;
  padding: 0;
}
#top #about .content-01 .contBox-left {
  margin-top: 39px;
}
@media screen and (min-width: 769px) {
  #top #about .content-01 .contBox-left {
    width: 60%;
    margin-top: 80px;
  }
}
#top #about .content-01 .contBox-right {
  padding-bottom: 30px;
}
@media screen and (min-width: 769px) {
  #top #about .content-01 .contBox-right {
    width: 38%;
    margin-top: 52px;
    padding-bottom: 0;
  }
}
#top #about .content-01 .contBox-right p {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  margin-top: 25px;
}
@media screen and (max-width: 768px) {
  #top #about .content-01 .contBox-right p {
    margin-top: 15px;
  }
}
#top #about .content-01 .contBox-right p span {
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}
#top #about .content-02 {
  background-color: #FFF0B9;
  height: 585px;
  padding: 90px 0 0 0;
  word-break: break-all;
  margin-top: 220px;
}
@media screen and (max-width: 991px) {
  #top #about .content-02 {
    margin-top: 170px;
    padding-top: 60px;
  }
}
@media screen and (max-width: 768px) {
  #top #about .content-02 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(90%, #FFF0B9), color-stop(10%, #fff));
    background: -o-linear-gradient(top, #FFF0B9 90%, #fff 10%);
    background: linear-gradient(to bottom, #FFF0B9 90%, #fff 10%);
    padding-top: 30px;
    margin-top: 0;
    height: auto;
  }
}
@media screen and (min-width: 769px) {
  #top #about .content-02 .inner {
    max-width: 1100px;
    width: calc(100% - 40px);
  }
}
#top #about .content-02 .contBox {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
}
@media screen and (min-width: 769px) {
  #top #about .content-02 .contBox {
    width: 31%;
    float: left;
  }
}
@media screen and (min-width: 769px) {
  #top #about .content-02 .contBox-right {
    width: 30%;
  }
}
@media screen and (min-width: 769px) {
  #top #about .content-02 .contBox-right .title-circle {
    margin-left: -1em;
  }
}
#top #about .content-02 .contBox-center {
  display: block;
  width: 39%;
  margin-top: -350px;
  padding-bottom: 50px;
}
@media screen and (max-width: 991px) {
  #top #about .content-02 .contBox-center {
    margin-top: -25%;
    padding-bottom: 25px;
  }
}
@media screen and (max-width: 768px) {
  #top #about .content-02 .contBox-center {
    width: 70%;
    margin: 0 auto;
    margin-top: 20px;
  }
}
#top #about .content-02 .contBox p {
  margin-top: 4%;
}
@media screen and (max-width: 768px) {
  #top #about .content-02 .contBox p {
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  #top #about .content-02 .contBox img {
    width: 100%;
  }
}
#top #about .content-02 .contBox .text-gochic {
  font-size: 1.4rem;
  margin-top: 2%;
}
@media screen and (max-width: 768px) {
  #top #about .content-02 .contBox .text-gochic {
    font-size: 1.2rem;
    margin-top: 10px;
  }
}
#top #about .content-03 .cont-top h3 {
  text-align: center;
}
#top #about .content-03 .cont-top .contBox-left {
  margin-top: 10px;
}
@media screen and (min-width: 769px) {
  #top #about .content-03 .cont-top .contBox-left {
    margin-top: 20px;
  }
}
#top #about .content-03 .cont-top .contBox-left p {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  font-size: 1.9rem;
  line-height: 2;
}
@media screen and (max-width: 768px) {
  #top #about .content-03 .cont-top .contBox-left p {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  #top #about .content-03 .cont-top .contBox-left p br {
    display: none;
  }
}
@media screen and (min-width: 769px) {
  #top #about .content-03 .cont-top .contBox-right {
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  #top #about .content-03 .cont-top .contBox-right {
    text-align: center;
  }
}
#top #about .content-03 .cont-bottom {
  position: relative;
  max-width: 1250px;
  width: calc(100% - 40px);
}
@media screen and (max-width: 768px) {
  #top #about .content-03 .cont-bottom {
    margin-top: 15px;
  }
}
#top #about .content-03 .cont-bottom .contBox {
  background-color: #FAEDE3;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 25px 10px 20px 20px;
  margin-bottom: 10px;
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
}
#top #about .content-03 .cont-bottom .contBox:last-child {
  margin-bottom: 0;
}
#top #about .content-03 .cont-bottom .contBoxWrap {
  max-width: 1000px;
  margin: 0 auto;
  width: 100%;
}
#top #about .content-03 .cont-bottom .contBox p {
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  #top #about .content-03 .cont-bottom .contBox p {
    margin-top: 15px;
  }
}
#top #about .content-03 .cont-bottom .contBox-img {
  text-align: center;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  #top #about .content-03 .cont-bottom .contBox-img {
    margin: 20px auto 0;
  }
}
#top #about .content-03 .cont-bottom .contBox .title-circle::before {
  color: #B94100;
}
#top #about .content-03 .cont-bottom .contBox-01 .contBox-img {
  width: 162px;
}
#top #about .content-03 .cont-bottom .contBox-02 .contBox-img {
  width: 102px;
}
#top #about .content-03 .cont-bottom .contBox-03 .contBox-img {
  width: 131px;
}
#top #about .content-03 .cont-bottom .contBox-04 .contBox-img {
  width: 160px;
}
#top #order {
  background-color: #FFF8DE;
  padding: 3% 0 4% 0;
}
@media screen and (max-width: 768px) {
  #top #order {
    padding-top: 5%;
  }
}
#top #order .content {
  max-width: 1480px;
  width: calc(100% - 40px);
  margin: 60px auto;
  border: 1px solid #7D534F;
}
#top #order .content-left {
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 10px;
  padding: 3% 2% 4% 2%;
}
@media screen and (min-width: 769px) {
  #top #order .content-left {
    width: 44%;
    float: left;
    padding-top: 1%;
  }
}
#top #order .content-left .title-square {
  text-align: left;
}
#top #order .content-left .title-square span {
  font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
  #top #order .content-left .title-square span {
    font-size: 1.3rem;
  }
}
#top #order .content-left .text-red {
  font-size: 4.9rem;
  line-height: 1;
  margin: 5px 0 0 0.5em;
  text-align: left;
  display: inline-block;
}
@media screen and (max-width: 768px) {
  #top #order .content-left .text-red {
    margin: 0;
    text-align: center;
  }
}
#top #order .content-left .text-red span {
  font-size: 3rem;
  line-height: inherit;
}
#top #order .content-left .text-red.small {
  display: inline-block;
  font-size: 1.9rem;
}
@media screen and (max-width: 768px) {
  #top #order .content-left .text-red.small {
    display: block;
  }
}
#top #order .content-left .text-redBg {
  margin-top: 10px;
  font-size: 1.9rem;
  display: inline-block;
  padding: 0 30px;
}
@media screen and (max-width: 768px) {
  #top #order .content-left .text-redBg {
    font-size: 1.6rem;
  }
}
#top #order .content-left .contBoxChild {
  text-align: center;
}
#top #order .content-left .contBoxChild:first-child {
  padding: 3% 0 7% 0;
}
#top #order .content-left .contBoxChild-border {
  width: 90%;
  margin-left: 3%;
  padding: 2.8% 0 3% 5%;
  background: url(../img/top/bg_top_01.png) no-repeat left top;
}
#top #order .content-left .contBoxChild:last-child {
  width: 90%;
  margin: 0 auto;
}
@media screen and (min-width: 769px) {
  #top #order .content-right {
    width: 53%;
    float: right;
  }
}
@media screen and (max-width: 768px) {
  #top #order .content-right {
    margin-top: 20px;
  }
}
#top #order .content-right .inner {
  max-width: 1350px;
  width: calc(100% - 40px);
  margin: 60px auto;
}
#top #order .content-right .text-tel {
  font-size: 5.1rem;
  line-height: 1.1;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .text-tel {
    font-size: 3.4rem;
  }
}
#top #order .content-right .title-dashedBorder {
  text-align: left;
  background: url(../img/top/ico_top_arrow.png) no-repeat right 10px center;
  padding-left: 10px;
}
#top #order .content-right .btn {
  text-align: center;
  position: relative;
}
@media screen and (min-width: 769px) {
  #top #order .content-right .btn {
    width: 40%;
    float: right;
  }
}
@media screen and (max-width: 768px) {
  #top #order .content-right .btn {
    margin-top: 20px;
  }
}
#top #order .content-right .btn-pdf span {
  position: relative;
  display: inline-block;
  text-align: left;
  padding-left: 35px;
}
#top #order .content-right .btn-pdf span::before {
  content: "";
  position: absolute;
  background: url(../img/top/ico_top_pdf.png) no-repeat center right;
  width: 25px;
  height: 25px;
  left: 0;
  background-size: contain;
}
#top #order .content-right .btn a {
  display: block;
  width: 100%;
  font-size: 1.6rem;
  display: block;
  padding: 3px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .btn a {
    font-size: 1.3rem;
    padding: 15px 0;
  }
}
#top #order .content-right .contBox:nth-child(n+2) {
  background-color: rgba(255, 255, 255, 0.8);
  padding: 25px 0 25px 90px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox:nth-child(n+2) {
    padding: 20px 0 20px 15px;
  }
}
#top #order .content-right .contBox:nth-child(n+2)::before {
  position: absolute;
  color: #fff;
  display: block;
  width: 76px;
  height: 76px;
  line-height: 76px;
  background-color: #F39800;
  top: -10px;
  left: 10px;
  border-radius: 50%;
  text-align: center;
  font-size: 1.9rem;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox:nth-child(n+2)::before {
    font-size: 1.6rem;
    width: 60px;
    height: 60px;
    line-height: 60px;
  }
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox:nth-child(n+2) .title-dashedBorder {
    padding-left: 70px;
    padding-bottom: 7px;
  }
}
@media screen and (min-width: 769px) {
  #top #order .content-right .contBox_text-left {
    width: 57%;
    float: left;
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox_text-left {
    font-size: 1.3rem;
  }
}
#top #order .content-right .contBox-bottom {
  padding: 1.5% 1.5% 0 0;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox-bottom {
    padding: 10px 15px 0 5px;
  }
}
#top #order .content-right .contBox-01 {
  background-color: inherit;
  margin-bottom: 8%;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox-01 {
    margin-bottom: 25px;
  }
}
#top #order .content-right .contBox-01 p {
  font-size: 2.9rem;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox-01 p {
    font-size: 2rem;
  }
}
#top #order .content-right .contBox-01 p .text-circle {
  font-size: 1.6rem;
  margin-right: 8px;
}
#top #order .content-right .contBox-02, #top #order .content-right .contBox-03 {
  margin-bottom: 2.5%;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox-02, #top #order .content-right .contBox-03 {
    margin-bottom: 15px;
  }
}
#top #order .content-right .contBox-02::before {
  content: "お電話";
}
#top #order .content-right .contBox-02 .text-tel {
  margin: 2% 0;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox-02 ul li {
    font-size: 1.3rem;
  }
}
#top #order .content-right .contBox-03::before {
  content: "FAX";
}
#top #order .content-right .contBox-03 .text-tel {
  margin: 1.5% 0 0 0;
}
@media screen and (max-width: 768px) {
  #top #order .content-right .contBox-03 .text-tel {
    margin-top: 15px;
  }
}
#top #order .content-right .contBox-04::before {
  content: "メール";
}
#top #order .inner {
  max-width: 1350px;
  width: calc(100% - 40px);
  margin: 60px auto;
}
@media screen and (max-width: 768px) {
  #top #order .inner {
    width: calc(100% - 20px);
    margin: 30px auto;
  }
}
#top #order .title-bdr {
  background-image: none;
  border-bottom: 1px solid #7D534F;
  margin-top: 20px;
  letter-spacing: 0.42em;
  padding-bottom: 15px;
}
#top #attention {
  background-color: #F39800;
  padding: 60px 0;
}
@media screen and (max-width: 768px) {
  #top #attention {
    padding: 30px 0;
  }
}
#top #attention .content {
  max-width: 1480px;
  width: calc(100% - 40px);
  background-color: #fff;
  margin: 0 auto;
}
#top #attention .inner {
  max-width: 1100px;
  padding: 55px 0 70px;
}
@media screen and (max-width: 768px) {
  #top #attention .inner {
    padding: 25px 0 35px;
  }
}
#top #attention .title {
  margin: 0;
}
#top #attention .title-bg {
  margin-bottom: 22px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #top #attention .title-bg {
    margin-bottom: 15px;
  }
}
#top #attention .title-bg .title_inner {
  background-color: #b94100;
  color: #fff;
  font-size: 4.1rem;
  font-weight: bold;
  letter-spacing: 0.14em;
  padding: 2px 0;
  margin-top: 25px;
}
@media screen and (max-width: 768px) {
  #top #attention .title-bg .title_inner {
    font-size: 2rem;
    padding: 10px 0;
    margin-top: 10px;
    line-height: 1.2;
  }
}
#top #attention .title-bg span {
  display: block;
}
@media screen and (max-width: 768px) {
  #top #attention .title-bg span img {
    width: 50px;
  }
}
#top #attention .title-02 {
  border-top: 3px solid #7D534F;
  border-bottom: 1px solid #7D534F;
  color: #b94100;
  font-size: 2.2rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  padding: 2px 0;
}
@media screen and (max-width: 768px) {
  #top #attention .title-02 {
    font-size: 1.8rem;
    padding: 5px 0;
  }
}
#top #attention .list {
  margin-top: 15px;
}
#top #attention .list li {
  font-size: 2.2rem;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  #top #attention .list li {
    font-size: 1.6rem;
  }
}
#top #attention .list li span {
  color: #B94100;
  font-weight: 500;
}
#top #attention .contBox_text p {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
}
@media screen and (min-width: 769px) {
  #top #attention .contBox_text p {
    font-size: 2rem;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  #top #attention .contBox_text p {
    font-size: 1.6rem;
  }
}
#top #attention .contBox_text p span {
  color: #B94100;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  font-weight: 500;
}
#top #attention .contBox_text p .text-bold {
  font-weight: 800;
}
@media screen and (max-width: 768px) {
  #top #attention .contBox_text p br {
    display: none;
  }
}
#top #attention .contBox-02 {
  margin-top: 45px;
}
@media screen and (max-width: 768px) {
  #top #attention .contBox-02 {
    margin-top: 20px;
  }
}
#top #attention .contBox-03 {
  background-color: #f8ece5;
  border-radius: 13px;
  margin-top: 40px;
  padding: 30px 0;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #top #attention .contBox-03 {
    border-radius: 10px;
    margin-top: 20px;
    padding: 20px 10px;
  }
}
#top #attention .contBox-03 .layout {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#top #attention .contBox-03 .text-01 {
  font-size: 2.3rem;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  #top #attention .contBox-03 .text-01 {
    font-size: 1.5rem;
    margin-bottom: 10px;
  }
}
#top #attention .contBox-03 .text-01 span {
  color: #B94100;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  font-weight: 500;
}
@media screen and (min-width: 769px) {
  #top #attention .contBox-03 .text-02 {
    font-size: 2rem;
    margin-right: 20px;
  }
}
@media screen and (max-width: 768px) {
  #top #attention .contBox-03 .text-02 {
    font-size: 1.6rem;
  }
}
#top #attention .contBox-03 .text-03 {
  font-size: 5.3rem;
}
@media screen and (max-width: 768px) {
  #top #attention .contBox-03 .text-03 {
    font-size: 3.4rem;
  }
}
#top .overview .content {
  padding: 90px 0;
}
@media screen and (max-width: 768px) {
  #top .overview .content {
    padding: 45px 0;
  }
}
#top .overview .contBox_wrap {
  margin-top: 65px;
}
@media screen and (max-width: 768px) {
  #top .overview .contBox_wrap {
    margin-top: 30px;
  }
}
#top .overview .contBox-left {
  text-align: center;
}
@media screen and (min-width: 769px) {
  #top .overview .contBox-left {
    width: 28%;
  }
}
#top .overview .contBox-left p {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  text-align: center;
}
#top .overview .contBox-left p.companyName {
  font-size: 1.7rem;
  line-height: 1.5;
  margin-top: 30px;
}
@media screen and (max-width: 768px) {
  #top .overview .contBox-left p.companyName {
    font-size: 1.5rem;
    margin-top: 15px;
  }
}
#top .overview .contBox-left p.role {
  font-size: 1.5rem;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  #top .overview .contBox-left p.role {
    font-size: 1.3rem;
  }
}
#top .overview .contBox-left p.name {
  font-size: 2.6rem;
}
@media screen and (max-width: 768px) {
  #top .overview .contBox-left p.name {
    font-size: 2rem;
  }
}
@media screen and (min-width: 769px) {
  #top .overview .contBox-right {
    width: 70%;
  }
}
@media screen and (max-width: 768px) {
  #top .overview .contBox-right {
    margin-top: 15px;
  }
}
#top .overview .contBox-right p {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
}
#top .overview .inner {
  max-width: 780px;
  margin-top: 90px;
}
@media screen and (max-width: 768px) {
  #top .overview .inner {
    margin-top: 30px;
  }
}
#top .overview .logo {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  #top .overview .logo {
    width: 250px;
  }
}
#top .overview .title-bdr {
  border-bottom: 2px solid #604C3F;
  background-image: none;
  letter-spacing: 0.28em;
}
#top .overview table:not(.tableChild) {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  margin: 80px auto 0;
  table-layout: fixed;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) {
    width: 100%;
    margin-top: 40px;
  }
}
#top .overview table:not(.tableChild) th, #top .overview table:not(.tableChild) td {
  padding: 2%;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) th, #top .overview table:not(.tableChild) td {
    padding: 1.5% 2%;
  }
}
#top .overview table:not(.tableChild) th {
  width: 20%;
  text-align: left;
  border-bottom: 1px solid #604C3F;
  letter-spacing: 0.5em;
  font-size: 1.7rem;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) th {
    width: 100%;
    display: block;
    font-weight: 600;
    font-size: 1.5rem;
    border-bottom: 1px dashed #604C3F;
  }
}
#top .overview table:not(.tableChild) th.first {
  border-top: 2px solid #604C3F;
  border-bottom: 1px solid #604C3F;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) th.first {
    border-bottom: none;
    border-bottom: 1px dashed #604C3F;
  }
}
#top .overview table:not(.tableChild) td {
  border-bottom: 1px solid #604C3F;
  line-height: 2;
  font-size: 1.7rem;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) td {
    width: 100%;
    display: block;
    font-size: 1.5rem;
  }
}
#top .overview table:not(.tableChild) td.first {
  border-top: 2px solid #604C3F;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) td.first {
    border-width: 1px;
    border-top: none;
  }
}
#top .overview table:not(.tableChild) td.td-03 {
  padding-bottom: 0;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) td.td-03 {
    padding: 0 2%;
  }
}
#top .overview table:not(.tableChild) td span {
  display: block;
  font-size: 1.6rem;
  margin-top: 5px;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) td span {
    font-size: 1.4rem;
    margin-top: 2px;
  }
}
#top .overview table:not(.tableChild) td ul li::before {
  content: "◎" !important;
}
@media screen and (max-width: 768px) {
  #top .overview table:not(.tableChild) td ul li br {
    display: none;
  }
}
#top .overview table .tableChild {
  width: 100%;
}
#top .overview table .tableChild th, #top .overview table .tableChild td {
  border: none;
}
#top .overview table .tableChild th {
  width: 25%;
  padding: 0;
  letter-spacing: normal;
}
@media screen and (max-width: 768px) {
  #top .overview table .tableChild th {
    width: 100%;
    display: block;
    font-size: 1.45rem;
    border-bottom: none;
  }
}
#top .overview table .tableChild th.last {
  border-bottom: none;
}
@media screen and (max-width: 768px) {
  #top .overview table .tableChild th.last {
    border-bottom: none;
  }
}
#top .overview table .tableChild td {
  padding: 0;
}
@media screen and (max-width: 768px) {
  #top .overview table .tableChild td {
    width: 100%;
    display: block;
  }
}
@media screen and (max-width: 768px) {
  #top .overview table .tableChild td.name {
    border-bottom: none;
  }
}
#top .overview table .tableChild td:last-of-type {
  width: 60%;
  font-size: 1.5rem;
  line-height: 1.25;
}
@media screen and (max-width: 768px) {
  #top .overview table .tableChild td:last-of-type {
    width: 100%;
    display: block;
    font-size: 1.3rem;
  }
}
#top .overview table .tableChild td.last {
  border-bottom: none;
  padding-bottom: 2%;
}

/*=======================================================

     レシピ #recipee

========================================================*/
#recipe .title-lg {
  color: #7D534F;
  border-top: 3px solid #604C3F;
  border-bottom: 1px solid #604C3F;
  font-family: "HiraginoCustom";
  font-size: 4.4rem;
  font-weight: 300;
  letter-spacing: 0.16em;
  text-align: center;
  padding: 7px 0 0;
  background-image: none;
}
@media screen and (max-width: 768px) {
  #recipe .title-lg {
    font-size: 3rem;
    line-height: 1.2;
    padding: 10px 0;
  }
}
#recipe .title-lg .reg {
  font-family: "HiraginoCustom";
  font-size: inherit;
  font-weight: inherit;
  vertical-align: sub;
}
@supports (-ms-ime-align: auto) {
  #recipe .title-lg .reg {
    font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  }
}
#recipe .title-lg .title_text {
  display: inline-block;
}
#recipe .common_btn {
  position: fixed;
  top: 90px;
  right: 50px;
  background-color: #F08300;
  border: 1px solid #fff;
  border-radius: 7px;
  -webkit-box-shadow: 3px 3px 4px 3px rgba(0, 0, 0, 0.2);
          box-shadow: 3px 3px 4px 3px rgba(0, 0, 0, 0.2);
  z-index: 100;
}
@media screen and (max-width: 1400px) {
  #recipe .common_btn {
    top: 110px;
    right: 10px;
  }
}
#recipe .common_btn a {
  display: block;
  color: #fff;
  padding: 8.5px 6px 8.5px;
}
#recipe .common_btn a p {
  font-size: 1.4rem;
  line-height: 1.28;
  text-align: center;
}
#recipe .common_btn a p span {
  display: block;
  color: #F08300;
  font-weight: bold;
  background-color: #fff;
  padding: 5.5px 5px;
  margin-top: 5px;
}
#recipe .common_btn a p span::after {
  content: ">";
  display: inline-block;
  padding-left: 5px;
}
#recipe .desc {
  max-width: 1150px;
  width: calc(100% - 40px);
  padding-top: 140px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  #recipe .desc {
    padding-top: 25px;
  }
}
#recipe .desc .logo_img {
  padding-bottom: 42px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #recipe .desc .logo_img {
    width: 142px;
    margin: 0 auto;
    padding-bottom: 15px;
  }
}
#recipe .desc_text {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  font-size: 1.9rem;
  line-height: 2;
  letter-spacing: 0.1em;
  text-align: center;
  padding: 30px 0;
}
@media screen and (max-width: 768px) {
  #recipe .desc_text {
    font-size: 1.6rem;
    line-height: 1.75;
    text-align: left;
    padding: 25px 0;
  }
}
@media screen and (max-width: 768px) {
  #recipe .desc_text br {
    display: none;
  }
}
#recipe .menu {
  padding-bottom: 100px;
}
@media screen and (max-width: 768px) {
  #recipe .menu {
    padding-bottom: 80px;
  }
}
@media screen and (min-width: 769px) {
  #recipe .menu_content {
    padding: 44px 0 35px;
  }
}
@media screen and (min-width: 769px) {
  #recipe .menu_content-01, #recipe .menu_content-03 {
    background-color: #f9f0eb;
  }
}
#recipe .menu_content > ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 auto;
}
@media screen and (min-width: 769px) {
  #recipe .menu_content > ul {
    max-width: 1150px;
    width: calc(100% - 40px);
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
#recipe .menu_content > ul li {
  width: 30.52%;
}
@media screen and (max-width: 768px) {
  #recipe .menu_content > ul li {
    width: 50%;
    padding: 20px 5px 2%;
  }
}
@media screen and (max-width: 768px) {
  #recipe .menu_content > ul li:nth-child(1), #recipe .menu_content > ul li:nth-child(2), #recipe .menu_content > ul li:nth-child(5), #recipe .menu_content > ul li:nth-child(6), #recipe .menu_content > ul li:nth-child(9), #recipe .menu_content > ul li:nth-child(10) {
    background-color: #f9f0eb;
  }
}
@media screen and (max-width: 768px) {
  #recipe .menu_content > ul li:nth-child(2n) {
    padding-right: 10px;
  }
}
@media screen and (max-width: 768px) {
  #recipe .menu_content > ul li:nth-child(odd) {
    padding-left: 10px;
  }
}
@media screen and (max-width: 768px) {
  #recipe .menu_content > ul li img {
    width: 100%;
  }
}
#recipe .menu_content > ul li p {
  font-size: 2.2rem;
  text-align: center;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  #recipe .menu_content > ul li p {
    font-size: 1.4rem;
    margin-top: 8px;
  }
}
#recipe .menu_btn {
  text-align: center;
  margin-top: 50px;
}
@media screen and (max-width: 768px) {
  #recipe .menu_btn {
    margin-top: 30px;
  }
}
#recipe .menu_btn a {
  color: #fff;
  background-color: #b94100;
}
@media screen and (min-width: 769px) {
  #recipe .menu_btn a {
    padding: 22px 62.5px;
    display: inline-block;
  }
}
@media screen and (max-width: 768px) {
  #recipe .menu_btn a {
    max-width: 570px;
    width: calc(100% - 40px);
    display: block;
    margin: 0 auto;
    padding: 14px 0;
  }
}
#recipe .menu_btn a span {
  position: relative;
  font-family: "HiraginoCustom";
  font-size: 2.5rem;
  line-height: 1;
  letter-spacing: 0.1em;
  padding-left: 60px;
}
@media screen and (max-width: 768px) {
  #recipe .menu_btn a span {
    font-size: 1.6rem;
    letter-spacing: 0.05em;
    padding-left: 40px;
  }
}
#recipe .menu_btn a span::before {
  content: "";
  position: absolute;
  left: 0;
  display: inline-block;
  background: url(../img/recipe/ico_pdf.png) no-repeat bottom left;
  background-size: contain;
}
@media screen and (min-width: 769px) {
  #recipe .menu_btn a span::before {
    width: 43px;
    height: 43px;
    bottom: -10px;
  }
}
@media screen and (max-width: 768px) {
  #recipe .menu_btn a span::before {
    width: 25px;
    height: 25px;
    bottom: -5px;
  }
}

/*=======================================================

     ご注文フォーム #form

========================================================*/
input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  vertical-align: bottom;
  line-height: 1;
  text-indent: 0.01px;
  -o-text-overflow: "";
     text-overflow: "";
}

input, button, textarea {
  font-family: inherit;
  font-size: 100%;
}

input[type=radio] {
  display: none;
}

input[type=checkbox] {
  display: none;
}

select::-ms-expand {
  display: none;
}

select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #828c9a;
}

:-moz-placeholder-shown {
  color: rgba(96, 76, 63, 0.5);
}

:-ms-input-placeholder {
  color: rgba(96, 76, 63, 0.5);
}

:placeholder-shown {
  color: rgba(96, 76, 63, 0.5);
}

/* Google Chrome, Safari, Opera 15+, Android, iOS */
::-webkit-input-placeholder {
  color: rgba(96, 76, 63, 0.5);
  position: relative;
}
@media screen and (max-width: 768px) {
  ::-webkit-input-placeholder {
    top: 0.2em;
  }
}

/* Firefox 18- */
:-moz-placeholder {
  color: rgba(96, 76, 63, 0.5);
  position: relative;
}
@media screen and (max-width: 768px) {
  :-moz-placeholder {
    top: 0.2em;
  }
}

/* Firefox 19+ */
::-moz-placeholder {
  color: rgba(96, 76, 63, 0.5);
  position: relative;
}
@media screen and (max-width: 768px) {
  ::-moz-placeholder {
    top: 0.2em;
  }
}

/* IE 10+ */
:-ms-input-placeholder {
  color: rgba(96, 76, 63, 0.5);
  position: relative;
}
@media screen and (max-width: 768px) {
  :-ms-input-placeholder {
    top: 0.2em;
  }
}

#form .txt-center {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  #form .txt-center {
    margin-top: 10px;
  }
}
#form .form {
  max-width: 1000px;
  margin: 40px auto 0;
  text-align: left;
}
#form .formInner {
  max-width: 750px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  #form .form {
    margin: 20px auto 0;
  }
}
#form .form input[type=radio]:checked + .checkbox::before {
  opacity: 1;
}
#form .form input[type=checkbox]:checked + .checkbox::before {
  opacity: 1;
}
#form .form .checkbox {
  -webkit-transition: background-color 0.2s linear;
  -o-transition: background-color 0.2s linear;
  transition: background-color 0.2s linear;
  position: relative;
  display: inline-block;
  padding: 0 0 0 30px;
  border-radius: 8px;
  vertical-align: middle;
  cursor: pointer;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 2.2rem;
}
@media screen and (max-width: 768px) {
  #form .form .checkbox {
    font-size: 1.9rem;
  }
}
#form .form .checkbox::before {
  content: "";
  -webkit-transition: opacity 0.2s linear;
  -o-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;
  left: 5px;
  display: block;
  margin-top: -8px;
  width: 6px;
  height: 10px;
  border-right: 3px solid #604C3F;
  border-bottom: 3px solid #604C3F;
  opacity: 0;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
@media screen and (max-width: 768px) {
  #form .form .checkbox::before {
    left: 6px;
    margin-top: -9px;
    width: 7px;
    height: 11px;
    border-right: 3px solid #604C3F;
    border-bottom: 3px solid #604C3F;
  }
}
#form .form .checkbox::after {
  content: "";
  -webkit-transition: border-color 0.2s linear;
  -o-transition: border-color 0.2s linear;
  transition: border-color 0.2s linear;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  left: 0px;
  display: block;
  width: 16px;
  height: 16px;
  border: 1px solid #604C3F;
}
@media screen and (max-width: 768px) {
  #form .form .checkbox::after {
    width: 20px;
    height: 20px;
  }
}
#form .form table {
  width: 100%;
  border-collapse: collapse;
}
#form .form table .formError {
  color: #B94100;
  font-size: 1.5rem;
}
@media screen and (max-width: 768px) {
  #form .form table .formError {
    font-size: 1.3rem;
  }
}
#form .form table .required {
  color: #B94100;
  line-height: 1;
  margin-left: 2px;
  display: inline-block;
}
@media screen and (max-width: 768px) {
  #form .form table .required {
    float: none;
    margin-left: 5px;
  }
}
@media screen and (max-width: 768px) {
  #form .form table tr {
    display: block;
    width: 100%;
    border-width: 1px;
  }
}
#form .form table tr .form-textBox {
  font-size: 2rem;
  line-height: 2rem;
  padding: 0 8px;
  border: 1px solid #604C3F;
  border-radius: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  height: 33px;
}
#form .form table tr .form-textBox.error {
  background-color: #fce5e7;
}
@media screen and (max-width: 768px) {
  #form .form table tr .form-textBox {
    font-size: 1.7rem;
    line-height: 1.7rem;
    padding: 0 8px;
  }
}
#form .form table th {
  width: 165px;
  vertical-align: top;
  padding: 30px 10px 15px 0;
  line-height: 1;
  word-wrap: break-word;
  letter-spacing: 0.09em;
  font-size: 1.7rem;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  #form .form table th {
    width: 100%;
    display: block;
    padding: 5px 0;
    font-size: 1.5rem;
  }
}
#form .form table th span:not(.required) {
  display: block;
  margin-top: 5px;
}
#form .form table td {
  padding: 20px 0 20px 4%;
  font-size: 2.2rem;
}
@media screen and (max-width: 768px) {
  #form .form table td {
    width: 100%;
    display: block;
    padding: 10px 0 15px 0;
    font-size: 1.6rem;
  }
}
#form .form table .tr_01 td .price {
  font-size: 2.2rem;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_01 td .price {
    font-size: 1.8rem;
  }
}
#form .form table .tr_01 td .charge {
  font-size: 1.5rem;
  letter-spacing: normal;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_01 td .charge {
    font-size: 1.4rem;
  }
}
#form .form table .tr_01 td .contBox:first-of-type {
  margin-bottom: 15px;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_01 td .contBox:first-of-type {
    margin-bottom: 20px;
  }
}
#form .form table .tr_01 td .contBox .contactBox {
  color: #B94100;
  text-align: center;
  border: 1px solid #B94100;
  padding: 2% 3.5%;
  margin-top: 15px;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_01 td .contBox .contactBox {
    text-align: left;
  }
}
#form .form table .tr_01 td .contBox .contactBox p {
  font-size: 1.9rem;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_01 td .contBox .contactBox p {
    font-size: 1.6rem;
  }
}
#form .form table .tr_01 td .contBox .contactBox p span {
  margin-right: 10px;
}
#form .form table .tr_01 td .contBox .contactBox p:not(.text-tel) {
  margin-left: 1em;
  position: relative;
  display: inline-block;
}
#form .form table .tr_01 td .contBox .contactBox p:not(.text-tel)::before {
  content: "※";
  position: absolute;
  left: -1.2em;
}
#form .form table .tr_01 td .contBox .contactBox .text-tel {
  font-size: 3rem;
  margin-top: 4px;
  letter-spacing: 0.02em;
  display: inline-block;
}
#form .form table .tr_01 td .contBox .contactBox .text-tel span::before {
  content: "";
  display: inline-block;
  background: url(../img/form/ico_tel.png) no-repeat;
  width: 30px;
  height: 20px;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_01 td .contBox .contactBox .text-tel span::before {
    width: 24px;
    height: 16px;
    background-size: contain;
    top: 7px;
  }
}
@media screen and (max-width: 768px) {
  #form .form table .tr_01 td .contBox .contactBox .text-tel {
    font-size: 2.1rem;
    display: block;
  }
}
#form .form table .tr_01 td .contBox .contactBox .text-time {
  font-size: 1.5rem;
  margin-top: 4px;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_01 td .contBox .contactBox .text-time {
    font-size: 1.3rem;
  }
}
#form .form table .tr_01 td .form-textBox {
  width: 110px;
}
#form .form table .tr_02 td > div:not(.errorTime) {
  display: inline-block;
}
#form .form table .tr_02 .checkbox {
  width: 180px;
  padding: 5px 10px 5px 30px;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_02 .checkbox {
    width: 170px;
    margin-right: 10px;
  }
}
#form .form table .tr_03 td .form-textBox {
  width: 35%;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_03 td .form-textBox {
    width: 100%;
  }
}
@media screen and (min-width: 769px) {
  #form .form table .tr_03 td .form-textBox {
    margin-left: 1em;
  }
}
@media screen and (min-width: 769px) {
  #form .form table .tr_03 td .form-textBox:first-of-type {
    margin-right: 5%;
  }
}
#form .form table .tr_04 td .form-textBox {
  width: 35%;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_04 td .form-textBox {
    width: 100%;
  }
}
@media screen and (min-width: 769px) {
  #form .form table .tr_04 td .form-textBox:first-of-type {
    margin-right: 4.5%;
  }
}
#form .form table .tr_05 td p {
  margin: 15px 0 5px;
  font-size: 1.5rem;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_05 td p {
    font-size: 1.3rem;
  }
}
#form .form table .tr_05 td .form-textBox {
  width: 100%;
}
#form .form table .tr_06 td .form-textBox {
  width: 30%;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_06 td .form-textBox {
    width: 29%;
  }
}
#form .form table .tr_07 td .form-textBox:first-of-type {
  width: 30%;
}
#form .form table .tr_07 td .form-textBox:nth-of-type(2) {
  width: 40%;
}
#form .form table .tr_08 td p {
  margin-bottom: 5px;
}
#form .form table .tr_08 td .selectBox {
  width: 30%;
  margin-bottom: 10px;
  border: 1px solid #604C3F;
  padding: 0 10px;
  height: 33px;
  background: url(../img/form/bg_ico_triangle.png) no-repeat right 6px center;
  font-size: 1.5rem;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_08 td .selectBox {
    width: 50%;
    margin-bottom: 10px;
    font-size: 1.3rem;
  }
}
#form .form table .tr_08 td .form-textBox {
  width: 100%;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_08 td .form-textBox {
    margin-bottom: 5px;
  }
}
#form .form table .tr_08 td .form-textBox:first-of-type {
  width: 64.5%;
  margin-left: 4%;
}
@media screen and (max-width: 768px) {
  #form .form table .tr_08 td .form-textBox:first-of-type {
    width: 100%;
    margin: 0 0 5px 0;
  }
}
#form .form table textarea {
  width: 100%;
  min-height: 135px;
  padding: 5px;
  border: 1px solid #604C3F;
  overflow: auto;
  resize: vertical;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  #form .form table textarea {
    min-height: 100px;
  }
}
#form .form .consent {
  text-align: center;
  margin-top: 70px;
}
@media screen and (max-width: 768px) {
  #form .form .consent {
    margin-top: 35px;
  }
}
#form .form .consent .checkbox {
  font-size: 2.5rem;
  font-weight: 600;
  display: inline-block;
  text-align: left;
  letter-spacing: 0.08em;
  padding-left: 45px;
}
@media screen and (max-width: 768px) {
  #form .form .consent .checkbox {
    font-size: 1.875rem;
    letter-spacing: 0.05em;
    padding-left: 35px;
  }
}
#form .form .consent .checkbox::before {
  left: 7px;
  margin-top: -13px;
  width: 10px;
  height: 15px;
  border-right: 4px solid #604C3F;
  border-bottom: 4px solid #604C3F;
}
@media screen and (max-width: 768px) {
  #form .form .consent .checkbox::before {
    left: 6px;
    margin-top: -9px;
    width: 7px;
    height: 11px;
    border-right: 3px solid #604C3F;
    border-bottom: 3px solid #604C3F;
  }
}
#form .form .consent .checkbox::after {
  width: 25px;
  height: 25px;
}
@media screen and (max-width: 768px) {
  #form .form .consent .checkbox::after {
    width: 20px;
    height: 20px;
  }
}
@media screen and (max-width: 768px) {
  #form .form .consent_txt {
    display: inline-block;
    text-align: left;
  }
}

/*=======================================================

     ご注文/確認/完了画面 共通

========================================================*/
.form_button {
  text-align: center;
  margin-top: 60px;
}
@media screen and (max-width: 768px) {
  .form_button {
    margin-top: 30px;
  }
}
.form_button a {
  display: inline-block;
  color: #fff;
  background: #604C3F url(../img/form/bg_ico_arrow.png) no-repeat right 13px center;
  border-radius: 10px;
  padding: 10px 110px;
  font-size: 2.2rem;
  letter-spacing: 0.16em;
}
@media screen and (max-width: 768px) {
  .form_button a {
    display: block;
    padding: 15px;
    font-size: 1.7rem;
    border-radius: 5px;
    letter-spacing: 0.03em;
  }
}
.form_button a:hover {
  opacity: 0.7;
}
.form_button #submit[disabled=disabled] {
  background-color: #BDAFA4;
  cursor: default;
  pointer-events: none; /* this is enough for non-IE browsers */
}
.form_button #submit[disabled=disabled]:hover {
  opacity: 1;
}
.form_button .btn_return {
  margin-right: 2%;
  background: #BDAFA4 url(../img/form/bg_ico_arrow_left.png) no-repeat left 13px center;
}
@media screen and (max-width: 768px) {
  .form_button .btn_return {
    margin: 0 0 20px 0;
  }
}

.form_textList {
  margin: 20px auto 0;
  float: right;
  padding-left: 1em;
}
.form_textList li {
  margin-bottom: 5px;
  display: block;
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  font-size: 1.7rem;
  line-height: 1.9;
  position: relative;
  padding-left: 0.4em;
}
.form_textList li::before {
  content: "◎";
  display: block;
  position: absolute;
  top: 0;
  left: -1em;
}
@media screen and (max-width: 768px) {
  .form_textList li {
    font-size: 1.5rem;
    line-height: 1.7;
  }
}
.form_textList li.em {
  color: #B94100;
  font-family: inherit;
  font-size: 2.1rem;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .form_textList li.em {
    font-size: 1.65rem;
  }
}
.form_textList li.em::before {
  color: #604C3F;
  font-size: 1.7rem;
  top: 3px;
}
@media screen and (max-width: 768px) {
  .form_textList li.em::before {
    font-size: 1.5rem;
  }
}

/*=======================================================

     確認画面

========================================================*/
.confirm .confirmBox {
  max-width: 710px;
  margin: 30px auto 0;
  padding: 3%;
  text-align: center;
  border: 1px solid #F39800;
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .confirm .confirmBox {
    margin: 15px auto 0;
  }
}
.confirm .confirmBox h3 {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .confirm .confirmBox h3 {
    font-size: 1.7rem;
    margin-bottom: 5px;
  }
}
.confirm .confirmBox p {
  display: inline-block;
  text-align: left;
  line-height: 1.75;
}
@media screen and (max-width: 768px) {
  .confirm .confirmBox p {
    font-size: 1.45rem;
  }
}
.confirm .confirmBox .formInner {
  border: 1px solid #604C3F;
}

/*=======================================================

     完了画面

========================================================*/
#thanks .txt-center {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  margin-top: 90px;
  font-size: 3.7rem;
}
@media screen and (max-width: 768px) {
  #thanks .txt-center {
    margin-top: 30px;
    font-size: 2.5rem;
  }
}
#thanks .inner {
  padding: 165px 0 70px 0;
}
@media screen and (max-width: 768px) {
  #thanks .inner {
    padding: 50px 0;
  }
}
#thanks .form_textList {
  max-width: 860px;
  margin: 50px auto 0;
  float: none;
}
@media screen and (max-width: 768px) {
  #thanks .form_textList {
    margin-top: 25px;
  }
}
#thanks .form_button a {
  background-image: none;
}
#thanks .contactBox {
  background-color: #FFF8DE;
  margin-top: 40px;
  padding: 40px 0;
}
@media screen and (max-width: 768px) {
  #thanks .contactBox {
    margin-top: 20px;
    padding: 25px 0;
  }
}
#thanks .contactBoxInner {
  max-width: 820px;
  width: 95%;
  margin: 0 auto;
}
#thanks .contactBoxInner_text {
  font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
  margin-bottom: 20px;
  font-size: 1.9rem;
}
@media screen and (max-width: 768px) {
  #thanks .contactBoxInner_text {
    font-size: 1.6rem;
    margin-bottom: 20px;
  }
}
#thanks .contactBoxInner-left {
  font-size: 1.5rem;
}
@media screen and (min-width: 769px) {
  #thanks .contactBoxInner-left {
    width: 48%;
    float: left;
    font-size: 1.7rem;
  }
}
@media screen and (max-width: 768px) {
  #thanks .contactBoxInner-left {
    margin-bottom: 15px;
  }
}
#thanks .contactBoxInner-left .text-tel {
  font-size: 5.1rem;
}
@media screen and (max-width: 768px) {
  #thanks .contactBoxInner-left .text-tel {
    font-size: 3.7rem;
  }
}
#thanks .contactBoxInner-left .text-tel span::before {
  top: 20px;
}
@media screen and (max-width: 768px) {
  #thanks .contactBoxInner-left .text-tel span::before {
    top: 15px;
  }
}
@media screen and (min-width: 769px) {
  #thanks .contactBoxInner-right {
    width: 51%;
    float: right;
  }
}
#thanks .contactBoxInner-right ul {
  padding-left: 1em;
}
#thanks .contactBoxInner-right ul li {
  position: relative;
  padding-left: 0.4em;
  font-size: 1.5rem;
}
#thanks .contactBoxInner-right ul li::before {
  content: "※";
  position: absolute;
  top: 0;
  left: -1em;
}
#thanks .contactBoxInner-right ul li:first-child {
  margin-bottom: 5px;
}