html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%
}

html {
  font-size: 62.5%;
  scroll-behavior: smooth
}

body {
  line-height: 1.6;
  font-size: 1.6rem;
  font-family: -apple-system-body, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
  font-weight: 300;
  color: #000
}

_:lang(x)::-ms-backdrop, .selector {
  font-family: "Segoe UI", Meiryo, sans-serif
}

_:-ms-lang(x)::-ms-backdrop, body {
  overflow-x: hidden
}

h1 {
  font-size: 2.6rem;
  color: #fff;
  font-weight: 400;
  background-color: #FF7F00;
  padding: 15px 20px;
  margin-bottom: 50px
}

h2 {
  font-size: 3.2rem;
  font-weight: 400;
  margin-bottom: 35px;
  text-align: center
}

h3 {
  font-size: 3.6rem;
  margin-bottom: 30px;
  text-align: center
}

h3 span {
  display: block;
  font-size: 1.6rem;
  font-weight: 400;
  color: #777
}

h4 {
  font-size: 2.4rem;
  margin-bottom: 25px;
  padding-bottom: 5px;
  border-bottom: #FF7F00 solid 2px
}

h5 {
  font-size: 2.0rem;
  margin-bottom: 15px;
  padding-left: 15px;
  border-left: #FF7F00 solid 10px
}

a {
  color: #000;
  text-decoration: none;
  transition: opacity 0.5s, background-color 0.5s, color 0.5s
}

a:hover, .link:hover {
  opacity: 0.7;
  transition: opacity 0.5s, background-color 1s, color 0.5s;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  zoom: 1
}

a:hover img {
  opacity: 0.7;
  transition: opacity 0.5s;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  zoom: 1
}

a i {
  color: #ccc
}

ol, ul {
  list-style: none
}

table {
  width: 100%;
  border-collapse: collapse;
  background-color: #FFFFFF;
  word-wrap: break-word
}

th {
  background-color: #FAFAFA
}

th, td {
  border: 1px solid #eee;
  padding: 10px;
  box-sizing: border-box
}

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

.sp {
  display: none
}

p.anchor {
  padding-top: 210px;
  margin-top: -210px;
  display: block;
  position: relative;
  z-index: -1
}

.edit time {
  display: block;
  font-size: 1.4rem;
  color: #666;
  margin-bottom: 10px
}

.edit h2 {
  font-size: 3.0rem;
  font-weight: 700;
  color: #666;
  margin-bottom: 70px;
  position: relative
}

.edit h2::after {
  content: "";
  display: block;
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: 250px;
  height: 3px;
  background-color: #777
}

.edit h3 {
  font-size: 2.8rem
}

.edit h4 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #666;
  margin-bottom: 30px;
  padding: 5px 15px;
  background-color: #F4F4F4;
  position: relative;
  border: #ccc solid 2px
}

.edit a {
  color: #089ED5;
  text-decoration: underline
}

.edit ul, .edit ol {
  text-align: justify;
  text-justify: inter-character
}

.edit ul {
  padding-left: 2em;
  list-style-type: disc
}

.edit ol {
  padding-left: 2em;
  list-style-type: decimal
}

.edit blockquote {
  background-color: #eee;
  padding: 10px;
  margin: 5px 10px;
  border-radius: 10px
}

.edit strong {
  font-weight: 700
}

.edit a[target="_blank"]::after {
  display: inline-block;
  content: "\f08e";
  font-family: FontAwesome;
  margin-left: 5px;
  color: #ccc
}

.edit a[href$=".pdf"]::after {
  display: inline-block;
  content: "\f1c1";
  font-family: FontAwesome;
  margin-left: 5px;
  color: #ccc
}

.edit a[href$=".doc"]::after, .edit a[href$=".docx"]::after, .edit a[href$=".xls"]::after, .edit a[href$=".xlsx"]::after, .edit a[href$=".txt"]::after {
  display: inline-block;
  content: "\f0f6";
  font-family: FontAwesome;
  margin-left: 5px;
  color: #ccc
}

.edit a[href^="mailto:"]::after {
  display: inline-block;
  content: "\f003";
  font-family: FontAwesome;
  margin-left: 5px;
  color: #ccc
}

#tophead {
  position: fixed;
  width: 100%;
  z-index: 9999
}

.home #tophead {
  position: relative
}

header {
  position: relative
}

header#head {
  padding: 30px 0 100px;
  width: 100%;
  z-index: 9999;
  background-color: #EBEBEB;
  position: absolute
}

.home header#head {
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%)
}

header#navi {
  padding: 12px 0;
  width: 100%;
  z-index: 9999;
  background-color: #fff;
  border-bottom: #DBDBDB solid 2px
}

.home header#navi {
  background-color: rgba(255, 255, 255, 0.8);
  border-bottom: none;
  position: absolute;
  bottom: 50px
}

header nav:after {
  content: '';
  display: block;
  clear: both
}

header nav>ul {
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: space-between
}

header nav li {
  margin: 0;
  padding: 5px;
  position: relative;
  font-size: 1.8rem;
  font-weight: 700
}

header nav li span {
  display: block;
  font-size: 1.1rem;
  color: #777;
  font-weight: 300
}

header nav>ul>li:nth-last-child(-n+1) {
  display: none
}

header nav a {
  text-align: center;
  display: block;
  padding: 0.25em
}

header nav>ul ul {
  transition: opacity .2s ease-in;
  opacity: 0;
  width: 200px;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  padding-top: 14px;
  position: absolute;
  box-sizing: border-box;
  height: 0;
  overflow: hidden
}

.home header nav>ul ul {
  padding-top: 12px
}

header nav>ul>li:hover ul {
  opacity: 1;
  height: auto
}

header nav>ul ul li {
  display: block;
  padding: 5px 10px;
  font-size: 1.6rem;
  font-weight: 300;
  border-left: #DBDBDB solid 2px;
  border-right: #DBDBDB solid 2px;
  border-bottom: #DBDBDB solid 1px;
  background-color: #fff
}

header nav>ul ul li:last-child {
  border-bottom: #DBDBDB solid 2px
}

header nav>ul ul li a {
  text-align: left
}

header nav a:hover {
  color: #777;
  opacity: 1
}

header nav>ul>li::after {
  width: 90%;
  height: 0;
  background: #ccc;
  content: '';
  position: absolute;
  top: 75%;
  left: 5%;
  opacity: 0;
  transition: all 0.3s ease-out;
  margin: auto
}

header nav>ul>li:hover::after, header nav>ul>li.current::after {
  opacity: 1.0;
  top: 100%;
  height: 4px
}

#logo {
  position: absolute;
  top: 25px;
  left: 30px;
  z-index: 9999;
  font-size: 2.4rem;
  font-weight: 700
}

#logo span {
  font-size: 1.8rem;
  vertical-align: middle
}

#lang {
  position: absolute;
  top: 30px;
  right: 160px;
  z-index: 9999;
  font-size: 1.6rem
}

#logo a, #lang a {
  color: #000
}

footer {
  background-color: #EEEEEE;
  padding: 40px 0 0;
  font-size: 1.4rem
}

footer .add {
width: 55%;
}

footer .add img {
    float: left;
}

footer .add p:nth-child(2) {
  font-size: 1.8rem;
  margin-bottom: 10px;
  font-weight: 700
}

footer nav p:nth-child(n+2)::before {
  content: "｜"
}

footer .copy {
  margin-top: 50px;
  padding: 15px 0;
  text-align: center;
  color: #fff;
  background-color: #666
}

.wrap {
  max-width: 1000px;
  padding: 0px 15px;
  margin: 0 auto
}

.wrap::after {
  content: '';
  display: block;
  clear: both
}

#main {
  background-color: #fff;
  padding-top: 181px
}

.home #main {
  padding-top: 0
}

#main .wrap {
  padding-top: 60px;
  padding-bottom: 80px
}

#content {
  max-width: 1050px;
  min-height: 400px;
  padding: 60px 15px;
  margin: 0 auto
}

.wrapping01 {
  background-color: #F4F4F4
}

section+section {
  margin-top: 80px
}

article+article {
  margin-top: 40px
}

section::after, article::after {
  content: '';
  display: block;
  clear: both
}

#topimg {
  z-index: 0;
  position: relative;
  overflow: hidden
}

#topimg p {
  display: inline-block;
  position: absolute;
  color: #fff;
  font-size: 5.0rem;
  font-weight: 500;
  line-height: 2;
  text-align: center;
  white-space: nowrap;
  top: 55%;
  left: 50%;
  z-index: 100;
  transform: translate(-50%, -50%);
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3)
}

#topimg p span {
  display: inline-block;
  position: relative
}

#topimg p span::after {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: -40px;
  width: calc(100% + 80px);
  height: 55px;
  background-color: rgba(255, 255, 255, 0.4)
}

.clouds {
  width: 1000%;
  height: 100%;
  background: transparent url("img/clouds.png") repeat;
  background-size: 1000px 1000px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 10;
  -moz-animation: move-background 50s linear infinite;
  -ms-animation: move-background 50s linear infinite;
  -o-animation: move-background 50s linear infinite;
  -webkit-animation: move-background 50s linear infinite;
  animation: move-background 50s linear infinite
}

@keyframes move-background {
  from {
    -webkit-transform: translate3d(0px, 0px, 0px)
  }
  to {
    -webkit-transform: translate3d(1000px, 0px, 0px)
  }
}

@-webkit-keyframes move-background {
  from {
    -webkit-transform: translate3d(0px, 0px, 0px)
  }
  to {
    -webkit-transform: translate3d(1000px, 0px, 0px)
  }
}

@-moz-keyframes move-background {
  from {
    -webkit-transform: translate3d(0px, 0px, 0px)
  }
  to {
    -webkit-transform: translate3d(1000px, 0px, 0px)
  }
}

@-webkit-keyframes move-background {
  from {
    -webkit-transform: translate3d(0px, 0px, 0px)
  }
  to {
    -webkit-transform: translate3d(1000px, 0px, 0px)
  }
}

@keyframes zoomUp {
  0% {
    transform: scale(1.2);
    filter: blur(10px)
  }
  15% {
    filter: blur(0)
  }
  100% {
    transform: scale(1)
  }
}

.swiper-slide-active .slide-img, .swiper-slide-duplicate-active .slide-img, .swiper-slide-prev .slide-img {
  animation: zoomUp 6s linear 0s 1 normal both
}

.slide-img img {
  display: block;
  min-height: 800px;
  object-fit: cover
}

#subimg {
  z-index: 0;
  position: relative;
  overflow: hidden;
  height: 90px
}

#topimg img, #subimg img {
  width: 100%
}

#summary.wrap {
  max-width: 1390px
}

#summary .flex div {
  width: 49%;
  margin-bottom: 25px;
  position: relative;
  overflow: hidden
}

#summary .flex div p+p {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  font-size: 3.6rem;
  font-weight: 500;
  text-align: center;
  color: #fff;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3)
}

#summary .flex div p+p span {
  display: block;
  font-size: 1.8rem
}

#summary img {
  transition: 2s all
}

#summary img:hover {
  transform: scale(1.2, 1.2);
  transition: 2s all
}

#recipe.wrap {
  max-width: 1410px;
  padding-bottom: 50px
}

#recipe .flex div {
  width: 24.8%
}

#recipe .flex div:nth-child(n+5) {
  margin-top: 3px
}

#recipe .flex div time {
  position: absolute;
  display: block;
  padding: 2px 10px;
  background-color: #FF7F00;
  color: #fff;
  font-size: 1.2rem;
  font-weight: 700;
  z-index: 999
}

.recipelist a {
  display: block;
  width: 280px;
  margin: 40px auto 0;
  padding: 15px 0;
  text-align: center;
  font-size: 2.0rem;
  font-weight: 500;
  background-color: #fff;
  border-radius: 35px;
  border: #555 solid 2px
}

#qa {
  position: relative;
  margin: 50px auto 120px;
  overflow: hidden
}

#wp #konjac-link div {
  width: calc(33.3% - 1px);
  margin: 0 0 2px;
  box-sizing: border-box
}

#wp #konjac-link div a {
  color: #fff;
  font-size: 1.8rem;
  font-weight: 500;
  display: block;
  padding: 30px;
  background-color: #007FFF
}

#wp #konjac-link div:nth-child(n+4) a {
  background-color: #51A8FF
}

#wp #konjac-link div a span {
  font-size: 4.4rem
}

nav#konjac-link {
  max-width: 1000px;
  margin: 0 auto
}

#qa p+p {
  min-width: 300px;
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  font-size: 2.5rem;
  font-weight: 500;
  text-align: center;
  color: #fff;
  padding: 15px;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
  background-color: rgba(0, 0, 0, 0.3)
}

#qa img {
  transition: 2s all
}

#qa img:hover {
  transform: scale(1.1, 1.1);
  transition: 2s all
}

.boxwrap {
  max-height: 260px;
  overflow-y: auto;
  margin: 0 auto;
  color: #444;
  font-size: 1.4rem;
  border-top: #BABABA solid 1px
}

.boxwrap ul {
  display: flex;
  font-size: 1.4rem;
  padding-bottom: 20px;
  margin-top: 20px;
  border-bottom: #BABABA solid 1px
}

.boxwrap .day {
  display: inline-block;
  min-width: 100px
}

.boxwrap .title {
  display: inline-block
}

.boxwrap+div a {
  display: block;
  width: 280px;
  margin: 40px auto 0;
  padding: 15px 0;
  text-align: center;
  font-size: 2.0rem;
  font-weight: 500;
  background-color: #fff;
  border-radius: 35px;
  border: #555 solid 2px
}

#wp.wrap article+article {
  margin-top: 100px
}

#wp .flex div {
  width: 49%;
  background-color: #EEE
}

#wp .flex div p {
  padding: 10px;
  text-align: center;
  border-top: #fff solid 5px;
  font-weight: 700
}

.link {
  cursor: pointer
}

nav.know {
  margin: 90px auto 0;
  border: #ddd solid 2px;
  justify-content: center
}

nav.know .anchor a {
  display: block;
  padding: 10px 20px;
  color: #4CA5FF;
  text-decoration: none
}

.recipearea nav {
  margin: 0 auto 60px;
  max-width: max-content;
  justify-content: center
}

.recipearea nav .anchor a {
  display: block;
  padding: 0 10px;
  color: #000;
  text-align: center;
  font-weight: 700
}

.recipearea nav .anchor a::before {
  content: "";
  display: block;
  margin-bottom: 5px;
  width: 85px;
  height: 85px
}

.recipearea nav .anchor a.recipe-meat::before {
  background-image: url("img/recipe-meat.jpg")
}

.recipearea nav .anchor a.recipe-fish::before {
  background-image: url("img/recipe-fish.jpg")
}

.recipearea nav .anchor a.recipe-vege::before {
  background-image: url("img/recipe-vege.jpg")
}

.recipearea nav .anchor a.recipe-main::before {
  background-image: url("img/recipe-main.jpg")
}

.recipearea nav .anchor a.recipe-sweets::before {
  background-image: url("img/recipe-sweets.jpg")
}

.recipearea nav .anchor a.recipe-other::before {
  background-image: url("img/recipe-other.jpg")
}

.recipebox+.recipebox {
  margin-top: 80px
}

.recipebox .flex {
  justify-content: flex-start
}

.recipebox .flex a {
  color: #000;
  text-decoration: none
}

.recipebox .flex div {
  width: 23.5%;
  margin-right: 2%
}

.recipebox .flex div:nth-child(4n) {
  margin-right: 0
}

.recipebox .flex div:nth-child(n+5) {
  margin-top: 25px
}

.recipebox .flex div p+p {
  margin-top: 10px
}

.recipebox .flex div p {
  position: relative
}

.recipebox .flex div p time {
  position: absolute;
  display: block;
  padding: 2px 10px;
  background-color: #FF7F00;
  color: #fff;
  font-size: 1.2rem;
  font-weight: 700;
  z-index: 999
}

.recipebox h4 {
  font-size: 2.2rem;
  color: #666;
  font-weight: 700;
  background-color: inherit;
  border: none;
  padding: 0
}

.recipebox h4::before {
  content: "";
  display: inline-block;
  margin-right: 15px;
  width: 85px;
  height: 85px;
  vertical-align: middle
}

.recipebox h4.recipe-meat::before {
  background-image: url("img/recipe-meat.jpg")
}

.recipeinfo span {
  background-color: #f08336 !important
}

.recipeinfo span.recipe-meat {
  background-color: #f08336
}

.recipebox h4.recipe-fish::before {
  background-image: url("img/recipe-fish.jpg")
}

.recipeinfo span.recipe-fish {
  background-color: #58bdec
}

.recipebox h4.recipe-vege::before {
  background-image: url("img/recipe-vege.jpg")
}

.recipeinfo span.recipe-vege {
  background-color: #abc10b
}

.recipebox h4.recipe-main::before {
  background-image: url("img/recipe-main.jpg")
}

.recipeinfo span.recipe-main {
  background-color: #f5a100
}

.recipebox h4.recipe-sweets::before {
  background-image: url("img/recipe-sweets.jpg")
}

.recipeinfo span.recipe-sweets {
  background-color: #ef8995
}

.recipebox h4.recipe-other::before {
  background-image: url("img/recipe-other.jpg")
}

.recipeinfo span.recipe-other {
  background-color: #8f90ac
}

.recipeinfo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 50px;
  padding-bottom: 5px;
  border-bottom: #D6D6D6 solid 2px
}

.recipeinfo div {
  margin-top: 30px
}

.recipeinfo div:first-child {
  font-size: 2.0rem;
  color: #FF7F00;
  font-weight: 700;
  margin-right: auto;
  margin-top: 0
}

.recipeinfo div:nth-child(2) span {
  padding: 5px 15px;
  color: #fff;
  background-color: #ccc;
  border-radius: 3px
}

.recipeinfo div:nth-child(3) {
  margin-left: 5px
}

.recipeinfo h3 {
  color: #666;
  text-align: left;
  font-size: 3.0rem;
  font-weight: 700;
  margin-bottom: 0
}

.recipeinfo+section article .flex>div {
  width: 55%
}

.recipeinfo+section article .flex>div+div {
  width: 40%
}

.recipeinfo+section article .flex>div+div h6 {
  font-size: 2.0rem;
  padding: 5px 10px;
  border-bottom: #eee solid 1px
}

.recipeinfo+section article .flex>div+div h6 span {
  font-weight: 500
}

.recipeinfo+section article .flex>div+div table {
  height: auto !important
}

.recipeinfo+section article .flex>div+div tr, .recipeinfo+section article .flex>div+div th, .recipeinfo+section article .flex>div+div td {
  width: auto !important;
  height: auto !important
}

.recipeinfo+section article .flex>div+div th {
  font-size: 1.5rem;
  text-align: center;
  border: none;
  border-bottom: #ccc dotted 1px !important
}

.recipeinfo+section article .flex>div+div td {
  font-size: 1.5rem;
  border: none;
  border-bottom: #ccc dotted 1px !important
}

.recipeinfo+section article .flex>div+div tr td[rowspan] {
  text-align: center;
  font-weight: 700;
  background-color: #eee
}

.recipeinfo+section article .flex>div+div tr:first-child td {
  color: #FF7F00;
  font-weight: 700
}

.recipeinfo+section article .flex>div+div tr td+td:last-child {
  text-align: right
}

.recipeinfo+section article.point {
  border: #ddd solid 3px;
  padding: 20px
}

.recipeinfo+section article.point h4 {
  font-size: 2.0rem;
  color: #FF7F00;
  border: none;
  background-color: inherit;
  padding: 0;
  margin-bottom: 15px
}

.single-recipe .recipebox {
  border-top: #eee solid 2px;
  padding-top: 60px
}

#breadcrumb li {
  float: left;
  margin-right: 5px
}

#pagetop {
  position: fixed;
  z-index: 1;
  bottom: 220px;
  right: 20px;
  z-index: 9999
}

#pagetop a {
  position: relative
}

#pagetop a span {
  display: block;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.2rem;
  text-align: center;
  width: 120%
}

.wp-admin #glt-translate-trigger {
  display: none
}

#glt-translate-trigger {
  font-weight: 500;
  background: inherit !important;
  border-radius: 3px;
  box-shadow: none;
  padding: 5px 15px 4px;
  top: 25px !important;
  text-shadow: none
}

.home #glt-translate-trigger {
  position: absolute
}

.tool-container.tool-top.toolbar-primary {
  top: 65px !important
}

.home .tool-container.tool-top.toolbar-primary {
  top: 65px !important;
  position: absolute !important
}

.translated-ltr body {
  top: 40px !important
}

.translated-ltr body #glt-translate-trigger {
  top: 63px !important
}

.translated-ltr body.home #glt-translate-trigger {
  top: 25px !important
}

.translated-ltr body .tool-container.tool-top.toolbar-primary {
  top: 105px !important
}

.translated-ltr body.home .tool-container.tool-top.toolbar-primary {
  top: 65px !important
}

.admin-bar .goog-te-banner-frame {
  top: 32px
}

.admin-bar #glt-translate-trigger {
  top: 57px !important
}

.home.admin-bar #glt-translate-trigger {
  top: 25px !important
}

.admin-bar .tool-container.tool-top.toolbar-primary {
  top: 97px !important
}

.home.admin-bar .tool-container.tool-top.toolbar-primary {
  top: 62px !important
}

.translated-ltr .admin-bar #glt-translate-trigger {
  top: 97px !important
}

.translated-ltr .admin-bar .tool-container.tool-top.toolbar-primary {
  top: 137px !important
}

@media screen and (max-width: 1030px) {
  #glt-translate-trigger {
    top: 14px !important;
    right: 40px;
    font-size: 1.2rem;
    position: fixed !important
  }
  .tool-container.tool-top.toolbar-primary {
    top: 60px !important;
    position: fixed !important
  }
  .translated-ltr body.admin-bar #glt-translate-trigger, .translated-ltr body.home.admin-bar #glt-translate-trigger {
    top: 98px !important
  }
  .translated-ltr body #glt-translate-trigger, .translated-ltr body.home #glt-translate-trigger {
    top: 54px !important
  }
  .translated-ltr body .tool-container.tool-top.toolbar-primary {
    top: 140px !important
  }
  .home.admin-bar #glt-translate-trigger, .admin-bar #glt-translate-trigger {
    top: 60px !important
  }
  .home.admin-bar .tool-container.tool-top.toolbar-primary {
    top: 62px !important
  }
  .admin-bar .tool-container.tool-top.toolbar-primary {
    top: 109px !important
  }
}

@media screen and (max-width: 782px) {
  .admin-bar .goog-te-banner-frame {
    top: 46px
  }
}

.print-page {
  margin-bottom: 80px
}

.print-off {
  display: none
}

.print-btn {
  cursor: pointer;
  padding: 5px 10px;
  border: #ccc solid 2px;
  text-align: center
}

.print-btn:hover {
  opacity: 0.7
}

@media print {
  .print-btn, .print-all {
    display: none
  }
  #print ul {
    padding-left: 1.6em;
    list-style-type: disc
  }
  #print ol {
    padding-left: 2.4em;
    list-style-type: decimal
  }
}

.clearfix:after {
  content: '';
  display: block;
  clear: both
}

.clearfix {
  zoom: 1
}

.flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between
}

nav.page-navi {
  margin-top: 30px
}

nav.page-navi li.prev {
  float: left
}

nav.page-navi li.next {
  float: right
}

img.centered {
  display: block;
  margin-left: auto;
  margin-right: auto
}

img.alignright {
  margin: 0 0 20px 40px;
  display: inline-block
}

img.alignleft {
  margin: 0 40px 20px 0;
  display: inline-block
}

.aligncenter {
  display: block;
  margin: 0 auto;
  max-width: max-content
}

.alignright {
  float: right;
  margin: 0.5em 0 2.5em 2.5em
}

.alignleft {
  float: left;
  margin: 0.5em 2.5em 2.5em 0
}

.size-auto, .size-full, .size-large, .size-medium, .size-thumbnail {
  max-width: 100%;
  height: auto
}

.wp-pagenavi {
  margin: 60px 0;
  text-align: center
}

.wp-caption-text {
  font-size: 1.4rem;
  margin-top: 10px
}

img[class*="wp-image-"], img[class*="attachment-"] {
  max-width: 100%;
  height: auto
}

.edit ul, #tinymce ul {
  padding-left: 1.6em;
  list-style-type: disc;
  display: inline-block
}

.edit ol, #tinymce ol {
  padding-left: 2.4em;
  list-style-type: decimal;
  display: inline-block
}

.edit a, #tinymce a {
  color: #4CA5FF;
  text-decoration: none
}

.edit {
  position: relative;
  text-align: justify;
  text-justify: inter-character
}

.edit blockquote, #tinymce blockquote {
  background-color: #eee;
  padding: 10px;
  margin: 5px 10px;
  border-radius: 10px
}

#fancybox-outer {
  box-shadow: 0 0 20px #aaa !important
}

.wpcf7 {
  max-width: 850px;
  margin: 0 auto
}

.wpcf7 p {
  margin-bottom: 20px;
  line-height: 2
}

.wpcf7 span {
  color: #f00;
  font-size: 1.4rem
}

.wpcf7 .wpcf7-not-valid-tip {
  font-weight: bold;
  margin-top: 5px
}

.wpcf7 .wpcf7-not-valid-tip::before {
  content: "\f071";
  font-family: FontAwesome;
  margin-right: 5px;
  font-weight: normal
}

.wpcf7 .ajax-loader {
  display: none
}

input, select, textarea {
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 10px;
  width: 100%;
  box-sizing: border-box;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif
}

input:focus, textarea:focus {
  border: 1px solid #999;
  outline: none
}

input[type="checkbox"], input[type="image"], input[type="radio"] {
  width: auto
}

::-moz-placeholder {
  color: #777;
  opacity: 1
}

::-webkit-input-placeholder {
  color: #777
}

button, input[type="button"], input[type="reset"], input[type="submit"], .button {
  background-color: #FF7F00;
  border: 0;
  color: #fff;
  cursor: pointer;
  font-weight: 700;
  padding: 10px 30px;
  width: auto;
  display: inline-block;
  margin: 0 10px;
  font-size: 1.8rem
}

input[type="button"] {
  background-color: #666
}

button:hover, input:hover[type="button"], input:hover[type="reset"], input:hover[type="submit"], .button:hover, button:focus, input:focus[type="button"], input:focus[type="reset"], input:focus[type="submit"], .button:focus {
  background-color: #FF6666;
  color: #fff
}

.wpcf7c-conf {
  color: #fff
}

.mailform {
  margin-bottom: 30px
}

.mailform th {
  width: 30%;
  background-color: #F6F6F6
}

.mailform span {
  color: #f00;
  font-size: 1.2rem
}

.pum-close {
  display: none
}

div.wpcf7-response-output {
  border-color: #f00 !important;
  background-color: #FF3B3B;
  color: #FFFFFF;
  text-align: center
}

.nocomments {
  display: none
}

#commentform p {
  margin: 0px 0px 10px
}

#commentform input[type="text"] {
  width: 40%
}

#commentform textarea {
  width: 98%
}

#commentform input[type="submit"] {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
  padding: 15px 0;
  background: #C59D62;
  border: 0;
  color: #fff;
  text-align: center;
  width: 240px
}

#commentform input[type="submit"]:hover {
  cursor: pointer;
  background: #DBC19B
}

#comping h3 {
  clear: both;
  margin-top: 40px
}

#comping p {
  margin-bottom: 15px
}

#comping p.wait {
  margin: 5px;
  color: red
}

#comping .comment-meta, #comping .comment-meta a {
  margin-bottom: 10px;
  color: #999;
  font-size: 85%
}

#comping .comment-meta a:hover {
  color: #ccc
}

.commentlist {
  margin-bottom: 30px
}

.commentlist li {
  padding: 15px 0 0 55px;
  position: relative;
  border-bottom: 1px dotted #D6D6D6
}

.commentlist li li {
  border-bottom: none
}

.commentlist li ul.children li {
  border-top: 1px dotted #D6D6D6
}

.commentlist .avatar {
  background: #fff;
  border: 1px solid #ddd;
  left: 0;
  margin: 0 16px 0 0;
  padding: 3px;
  position: absolute;
  top: 15px
}

.commentlist .reply a {
  position: absolute;
  top: 12px;
  right: 0;
  padding: 2px 20px;
  font-size: 80%;
  color: #fff;
  text-decoration: none;
  background: #D6D6D6
}

.commentlist .reply a:hover {
  color: #999
}

#commentnav {
  text-align: center;
  margin-bottom: 20px
}

#commentnav span a {
  text-decoration: underline;
  font-weight: bold
}

#commentnav span {
  float: left
}

#commentnav span+span {
  float: right
}

.pinglist {
  margin-bottom: 30px
}

.pinglist li {
  padding: 15px 0 0 10px;
  position: relative
}

@media screen and (max-width: 1030px) {
  header#head, header#navi {
    display: none
  }
  header nav li:last-child {
    display: inherit
  }
  #topimg {
    padding-top: 57px
  }
  #subimg {
    display: none
  }
  #main {
    padding-top: 57px
  }
  body.home #main {
    padding-top: 0
  }
  p.anchor {
    padding-top: 100px;
    margin-top: -100px
  }
}

@media screen and (max-width: 950px) {
  #topimg p {
    font-size: 4rem
  }
  footer .add {
    order: 1;
    width: 100%;
    margin-top: 30px
  }
  footer nav {
    width: 100%
  }
  footer nav p:nth-child(n+2)::before {
    display: none
  }
  footer nav p a::before {
    content: "▶ "
  }
  .slide-img img {
    min-height: inherit
  }
}

@media screen and (max-width: 700px) {
  #topimg p {
    font-size: 2.6rem;
    top: 50%
  }
  #summary h2 span::before, #summary h2 span::after {
    display: none
  }
  #summary .flex div {
    width: 100%
  }
  #summary .flex div+div {
    width: 100%;
    margin-top: 30px
  }
  #summary .flex+.flex div {
    order: 0
  }
  #summary .flex+.flex div+div {
    order: 1
  }
}

@media screen and (max-width: 480px) {
  h2, .edit h2 {
    font-size: 2.6rem
  }
  h3, .edit h3 {
    font-size: 2.4rem
  }
  h4, .edit h4 {
    font-size: 2rem
  }
  .edit {
    font-size: 1.5rem
  }
  .pc {
    display: none
  }
  .sp {
    display: inherit
  }
  #topimg p {
    font-size: 2rem
  }
  #topimg p span::after {
    left: -10px;
    width: calc(100% + 20px);
    height: 25px;
    background-color: rgba(255, 255, 255, 0.4)
  }
  #recipe .flex div {
    width: 48%
  }
  #recipe .flex div:nth-child(n+3) {
    margin-top: 15px
  }
  #wp .flex div {
    width: 100%
  }
  #wp .flex div+div {
    margin-top: 20px
  }
  .aligncenter {
    width: auto !important
  }
  .alignright, .alignleft {
    float: none;
    margin: 0 0 1.5em;
    max-width: 100% !important;
    display: block !important
  }
  .recipeinfo {
    flex-wrap: wrap
  }
  .recipeinfo div {
    margin-top: 0
  }
  .recipeinfo div:first-child {
    width: 100%;
    margin-top: 10px;
    order: 2
  }
  .recipeinfo+section article .flex>div {
    width: 100%;
    margin-bottom: 30px
  }
  .recipeinfo+section article .flex>div+div {
    width: 100%
  }
  .recipebox .flex div {
    width: 30%;
    margin-right: 5%
  }
  .recipebox .flex div:nth-child(4n) {
    margin-right: 5%
  }
  .recipebox .flex div:nth-child(3n) {
    margin-right: 0
  }
  .recipebox .flex div:nth-child(n+4) {
    margin-top: 25px
  }
  #wp #konjac-link div {
    width: 100%
  }
  #summary h2 span {
    font-size: 2.2rem
  }
  .recipeinfo div:first-child {
    font-size: 1.5rem
  }

  footer .add img {
    float: none;
  }



}