@charset "EUC-JP";
a, abbr, address, article, aside, audio, blockquote, body, canvas, caption, cite, code, dd, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, iframe, img, ins, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, section, small, span, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, ul, video {
  border: 0;
  margin: 0;
  padding: 0;
  vertical-align: baseline
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
  display: block
}
address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal
}
table {
  border-collapse: collapse;
  border-spacing: 0
}
caption, td, th {
  text-align: left
}
q:after, q:before {
  content: ""
}
embed, object {
  vertical-align: top
}
abbr, acronym, fieldset, img {
  border: 0
}
button, input, select, textarea {
  font: inherit
}
ol[class] > li, ul[class] > li {
  list-style-type: none
}
a, button, label {
  cursor: pointer
}
button {
  background: none;
  border: none;
  margin: 0;
  padding: 0
}
button-moz-focus-inner, input-moz-focus-inner {
  border: 0;
  padding: 0
}
* {
  background-repeat: no-repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}
html {
  scroll-behavior: smooth
}
body, html {
  height: 100%;
  width: 100%
}
body {
  color: #000;
  font-family: ¥Ò¥é¥®¥Î³Ñ¥´ Pro W3, Hiragino Kaku Gothic Pro, ¥á¥¤¥ê¥ª, Osaka, Verdana, £Í£Ó £Ð¥´¥·¥Ã¥¯, sans-serif;
  font-size: 1rem;
  font-size: var(--font-size);
  letter-spacing: -.06em;
  line-height: 1.3;
  text-align: center;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  --font-size: 1rem;
  --sp-view-size: 640
}
@media screen and (min-width:641px) {
  body {
    --font-size: 0.75rem;
    --pc-view-size: 880;
    --pc-design-size: 1000;
    letter-spacing: -.04em;
    line-height: 1.44
  }
}
img {
  display: block;
  height: auto;
  max-width: 100%
}
sup {
  font-size: .75rem;
  vertical-align: text-top
}
@media screen and (min-width:641px) {
  sup {
    font-size: .5rem
  }
}
.sp-only {
  display: inline-block
}
@media screen and (min-width:641px) {
  .sp-only {
    display: none
  }
}
#header_wrapper {
  padding: 0 20px;
  width: 640px
}
@media screen and (min-width:641px) {
  #header_wrapper {
    margin-left: auto;
    margin-right: auto;
    width: min(840px, 100%)
  }
}
#footer_wrapper {
  margin: 0 auto;
  width: auto
}
@media screen and (min-width:641px) {
  #footer_wrapper {
    margin-left: auto;
    margin-right: auto;
    width: min(840px, 100%)
  }
}
select option {
  padding: 0 .5em
}
form label {
  cursor: pointer
}
ul {
  list-style: none outside
}
a {
  outline: none
}
a:active, a:link, a:visited {
  color: #039
}
a:hover {
  color: #36c
}
a:focus {
  outline: none
}
.wrapper {
  min-width: 640px;
  overflow: hidden
}
@media screen and (min-width:641px) {
  .wrapper {
    margin: 0 auto;
    max-width: 880px;
    padding: 0 0 30px;
    width: 100%
  }
}
.kv-container {
  display: -ms-grid;
  display: grid;
  justify-items: center;
  position: relative
}
.kv-heading-img {
  width: 100%
}
.kv-order {
  bottom: 14px;
  display: -ms-grid;
  display: grid;
  justify-items: center;
  padding-left: 10px;
  padding-right: 10px;
  position: absolute
}
@media screen and (min-width:641px) {
  .kv-order {
    bottom: -8.2%;
    padding-left: 0px;
    padding-right: 0px;
    /* padding-left: min(20px, 20/var(--pc-view-size) * 100vw); */
    /* padding-right: min(20px, 20/var(--pc-view-size) * 100vw) */
  }
}
.kv-order-img {
  width: 100%
}
.kv-order-anchor {
  bottom: 25px;
  position: absolute;
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease
}
@media screen and (min-width:641px) {
  .kv-order-anchor {
    bottom: min(55px, 55/var(--pc-view-size) * 100vw);
    width: min(762px, 762/var(--pc-view-size) * 100vw)
  }
}
.kv-order-anchor:focus {
  opacity: .8
}
@media (hover:hover) and (pointer:fine) {
  .kv-order-anchor:hover {
    opacity: .8
  }
}
.is-ie .kv-order-anchor:hover {
  opacity: .8
}
.kv-notes {
  padding-left: calc(28px + 1rem);
  padding-right: 20px;
  text-align: left
}
@media screen and (min-width:641px) {
  .kv-notes {
    margin-top: 7%;
    padding-left: calc(min(20px, 20 / var(--pc-view-size) * 100vw) + .75rem);
    padding-right: min(20px, 20/var(--pc-view-size) * 100vw)
  }
}
.kv-notes-item {
  text-indent: -1rem
}
@media screen and (min-width:641px) {
  .kv-notes-item {
    text-indent: -.75rem
  }
}
.kv-notes-item > span {
  display: block
}
.kv-notes-item > span.note-red {
    display: inline;
    padding-left: 0;
    color: #e90000;
    font-size: 120%;
    font-weight: bold;
  }

@media screen and (min-width:641px) {
  .kv-notes-item > span {
    display: inline;
    padding-left: min(10px, 10/var(--pc-view-size) * 100vw)
  }
  .kv-notes-item > span.note-red {
    display: inline;
    padding-left: 0;
    color: #e90000;
    font-size: 120%;
    font-weight: bold;
  }
}
.kodawari {
  margin-top: 44px
}

.kodawari img {
  /* width: 100% */
}
@media screen and (min-width:641px) {
  .kodawari-wrap{
    position: relative;
  }
  .kodawari {
    margin-top: min(26px, 26/var(--pc-view-size) * 100vw)
  }
  .kodawari-dekiru {
    bottom: 5px;
    display: -ms-grid;
    display: grid;
    justify-items: center;
    /* padding-left: 17px; */
    /* padding-right: 17px; */
    position: absolute
  }
}
.kodawari-wrap{
    position: relative;
  }
.kodawari-dekiru {
  bottom: 5px;
  display: -ms-grid;
  display: grid;
  justify-items: center;
  /* padding-left: 17px; */
  /* padding-right: 17px; */
  position: absolute
}
.kodawari-dekiru img{
  width: 100%;
}
.kodawari03-img {
  padding-left: 20px;
  padding-right: 20px
}
@media screen and (min-width:641px) {
  .kodawari03-img {
    padding-top: 5%;
    padding-left: min(10px, 10/var(--pc-view-size) * 100vw);
    padding-right: min(10px, 10/var(--pc-view-size) * 100vw)
  }
}
.farmer {
  
}
.farmer img {
  width: 100%
}
@media screen and (min-width:641px) {
  .farmer {
    
  }
}
.farmer-title {
  bottom: -10px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
  width: 100%
}
@media screen and (min-width:641px) {
  .farmer-title {
    bottom: -8px;
    padding-left: 0;
    padding-right: 0
  }
}
.cv2 {
  background: #ffebf0;
  /* margin-top: 60px; */
  padding: 32px 14px 28px 12px
}
@media screen and (min-width:641px) {
  .cv2 {
    margin-top: min(0px, 0/var(--pc-view-size) * 100vw);
    padding: min(16px, 16/var(--pc-view-size) * 100vw) min(35px, 35/var(--pc-view-size) * 100vw) min(32px, 32/var(--pc-view-size) * 100vw) min(13px, 13/var(--pc-view-size) * 100vw)
  }
}
.cv2-container {
  display: -ms-grid;
  display: grid;
  justify-items: center;
  position: relative
}
.cv2-img {
  width: 100%
}
.cv2-anchor {
  bottom: 23px;
  display: block;
  padding-left: 10px;
  position: absolute;
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  width: 580px
}
@media screen and (min-width:641px) {
  .cv2-anchor {
    bottom: min(23px, 23/var(--pc-view-size) * 100vw);
    padding-left: min(22px, 22/var(--pc-view-size) * 100vw);
    width: min(784px, 784/var(--pc-view-size) * 100vw)
  }
}
.cv2-anchor:focus {
  opacity: .8
}
@media (hover:hover) and (pointer:fine) {
  .cv2-anchor:hover {
    opacity: .8
  }
}
.is-ie .cv2-anchor:hover {
  opacity: .8
}
.cv2-list {
  letter-spacing: -.06em;
  margin-top: 12px;
  padding-left: calc(10px + 1rem);
  text-align: left
}
@media screen and (min-width:641px) {
  .cv2-list {
    margin-top: min(8px, 8/var(--pc-view-size) * 100vw);
    padding-left: calc(min(22px, 22 / var(--pc-view-size) * 100vw) + .75rem);
    padding-right: 0
  }
}
.cv2-item {
  text-indent: -1rem
}
@media screen and (min-width:641px) {
  .cv2-item {
    text-indent: -.75rem
  }
}
.voice {
  margin-top: 50px;
  padding-left: 20px;
  padding-right: 20px
}
.voice img {
  width: 100%
}
@media screen and (min-width:641px) {
  .voice {
    margin-top: min(43px, 43/var(--pc-view-size) * 100vw);
    padding-left: min(20px, 20/var(--pc-view-size) * 100vw);
    padding-right: min(20px, 20/var(--pc-view-size) * 100vw)
  }
}
.voice-title {
  /* bottom: -10px; */
  position: relative
}
.voice-heading, .voice-title-img {
  width: 100%
}
.voice-item:nth-child(2) {
  position: relative
}
.voice-item:nth-child(2):before {
  background-image: url(../images/voice_can_sp.png);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: block;
  height: 302px;
  left: 37px;
  position: absolute;
  top: -48px;
  width: 180px
}
@media screen and (min-width:641px) {
  .voice-item:nth-child(2):before {
    background-image: url(../images/voice_can.png);
    height: min(247px, 247/var(--pc-view-size) * 100vw);
    left: min(34px, 34/var(--pc-view-size) * 100vw);
    top: min(-5px, -5/var(--pc-view-size) * 100vw);
    width: min(160px, 160/var(--pc-view-size) * 100vw);
    background-size: cover;
  }
}
.voice-img {
  width: 100%
}
.recipe {
  margin-top: 40px;
  position: relative;
}
@media screen and (min-width:641px) {
  .recipe {
    margin-top: min(64px, 64/var(--pc-view-size) * 100vw);
    padding-bottom: min(29px, 29/var(--pc-view-size) * 100vw);
    background: #ffebf0;
    position: relative;
  }
}
/*
.recipe-title {
    bottom: 14px;
    display: -ms-grid;
    display: grid;
    justify-items: center;
    position: absolute

}
*/
.recipe-title {
    width: 84.4%;
    top: 22px;
    left: 50%;
    display: -ms-grid;
    display: grid;
    justify-items: center;
    /* padding-left: 17px; */
    /* padding-right: 17px; */
    position: absolute;
    z-index: 1;
    transform: translateX(-50%);
  }
@media screen and (min-width:641px) {
  .recipe-title {
    width: 84.4%;
    top: 36px;
    left: 50%;
    display: -ms-grid;
    display: grid;
    justify-items: center;
    /* padding-left: 17px; */
    /* padding-right: 17px; */
    position: absolute;
    z-index: 1;
    transform: translateX(-50%);
  }
}
.recipe-img {
  width: 100%
}
.recipe-container {
  background-color: #ffebf0;
  padding: 195px 20px 40px;
  position: relative
}
@media screen and (min-width:641px) {
  .recipe-container {
    padding: min(179px, 179/var(--pc-view-size) * 100vw) min(20px, 20/var(--pc-view-size) * 100vw) min(19px, 19/var(--pc-view-size) * 100vw);
    position: relative
  }
}
.recipe-txt-01 {
  left: 50px;
  position: absolute;
  top: 308px;
  width: 290px
}
@media screen and (min-width:641px) {
  .recipe-txt-01 {
    left: min(62px, 62/var(--pc-view-size) * 100vw);
    top: min(295px, 295/var(--pc-view-size) * 100vw);
    width: min(410px, 410/var(--pc-view-size) * 100vw)
  }
}
.special {
  /* margin-top: 60px */
}
@media screen and (min-width:641px) {
  .special {
    margin-top: 0
  }
  .special:after {
    background-image: url(../images/special-bottom_bg.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 72px
  }
}
.special-price-img, .special-title-img {
  width: 100%
}
.special-container {
  background-image: url(../images/special_bg_sp.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  height: 441px;
  position: relative
}
@media screen and (min-width:641px) {
  .special-container {
    background: none;
    height: auto
  }
}
.special-order {
  padding: 5px 35px 35px
}
@media screen and (min-width:641px) {
  .special-order {
    background-image: url(../images/special-order_bg.jpg);
    background-repeat: repeat-y;
    background-size: contain;
    padding: min(15px, 15/var(--pc-view-size) * 100vw) min(170px, 170/var(--pc-view-size) * 100vw) min(26px, 26/var(--pc-view-size) * 100vw)
  }
}
.special-order-anchor {
  display: block;
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease
}
.special-order-anchor:focus {
  opacity: .8
}
@media (hover:hover) and (pointer:fine) {
  .special-order-anchor:hover {
    opacity: .8
  }
}
.is-ie .special-order-anchor:hover {
  opacity: .8
}
@media screen and (min-width:641px) {
  .special-box {
    background-image: url(../images/special-line_bg.jpg);
    background-repeat: repeat-y;
    background-size: contain
  }
}
.special-notes {
  line-height: 1.3;
  margin-left: 40px;
  margin-right: 40px;
  padding-left: 1rem
}
@media screen and (min-width:641px) {
  .special-notes {
    letter-spacing: -.06em;
    line-height: 1.43;
    margin-left: min(40px, 40/var(--pc-view-size) * 100vw);
    margin-right: min(35px, 35/var(--pc-view-size) * 100vw);
    padding-left: .75rem
  }
  .special-notes-item > span.note-red {
    display: inline;
    padding-left: 0;
    color: #e90000;
    font-size: 120%;
    font-weight: bold;
  }
}
.special-notes-item {
  text-align: left;
  text-indent: -1rem
}
.special-notes-item > span.note-red {
    display: inline;
    padding-left: 0;
    color: #e90000;
    font-size: 120%;
    font-weight: bold;
  }
.special-notes-item > span {
  display: block
}
@media screen and (min-width:641px) {
  .special-notes-item > span {
    display: inline
  }
}
.popup {
  cursor: pointer;
  margin-left: auto;
  margin-right: auto;
  margin-top: 24px;
  padding-left: 24px;
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  width: 406px
}
@media screen and (min-width:641px) {
  .popup {
    margin-top: min(22px, 22/var(--pc-view-size) * 100vw);
    padding-bottom: min(20px, 20/var(--pc-view-size) * 100vw);
    padding-left: 0;
    width: min(308px, 308/var(--pc-view-size) * 100vw)
  }
}
.popup:focus {
  opacity: .8
}
@media (hover:hover) and (pointer:fine) {
  .popup:hover {
    opacity: .8
  }
}
.is-ie .popup:hover {
  opacity: .8
}
.modal {
  background-color: rgba(53, 53, 53, .5);
  bottom: 0;
  cursor: pointer;
  display: none;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 100
}
.rspbody {
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  height: 100%;
  justify-content: center
}
.rspimg {
  padding-left: 15px;
  padding-right: 15px;
  width: 100%
}
@media screen and (min-width:641px) {
  .rspimg {
    padding-left: min(15px, 15/var(--pc-view-size) * 100vw);
    padding-right: min(15px, 15/var(--pc-view-size) * 100vw);
    width: min(990px, 990/var(--pc-view-size) * 100vw)
  }
}
.shun {
  display: -ms-grid;
  display: grid;
  justify-items: center;
  margin: 30px 20px 108px;
  position: relative
}
@media screen and (min-width:641px) {
  .shun {
    margin: min(13px, 13/var(--pc-view-size) * 100vw) 0 min(70px, 70/var(--pc-view-size) * 100vw)
  }
}
.shun-img {
  width: 100%
}
.shun-btn {
  bottom: 55px;
  display: block;
  position: absolute;
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease
}
@media screen and (min-width:641px) {
  .shun-btn {
    bottom: 8%;
    width: min(686px, 686/var(--pc-view-size) * 100vw)
  }
}
.shun-btn:focus {
  opacity: .8
}
@media (hover:hover) and (pointer:fine) {
  .shun-btn:hover {
    opacity: .8
  }
}
.is-ie .shun-btn:hover {
  opacity: .8
}