@charset "UTF-8";
/* mixin css */
/* ------------------------------------------------------------------------
   MEDIAQUERY
------------------------------------------------------------------------ */
/*  COMMON
-------------------------------------------------- */
.pcOnly {
  display: none !important;
}

html, body {
  min-width: 0;
}

#choitashi {
  /*  ANDROID
  -------------------------------------------------- */
}
#choitashi #header-bulgaria {
  box-shadow: 0 0.5em 0.5em rgba(0, 0, 0, 0.2);
}
#choitashi .sp_mega_menu .mega_tab_box ul li a,
#choitashi .menubar .menubar_box li.sub a,
#choitashi .sp_mega_menu section.recipe h2,
#choitashi .searchs_box .searchs_box_inner .narrowing_box .tbl_box p {
  font-size: 2.4rem;
}
#choitashi .searchs_box .searchs_box_inner ul.select_type li a,
#choitashi .searchs_box .searchs_box_inner .recipe_white_btn a {
  font-size: 2.6rem;
}
#choitashi .menubar .menubar_box li a,
#choitashi .recipe_detail_text,
#choitashi .searchs_box .searchs_box_inner p input {
  font-size: 2.8rem;
}
#choitashi #choitashi_wrap {
  overflow: hidden;
  color: #303030;
  font-size: 28px;
  font-size: 2.8rem;
  font-size: 4.375vw;
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#choitashi #choitashi_wrap section {
  font-family: "メイリオ", Meiryo, "MS ゴシック", sans-serif;
}
#choitashi #choitashi_wrap a {
  text-decoration: none;
  cursor: pointer;
  transition: 0.2s;
}
#choitashi #choitashi_wrap img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
#choitashi #choitashi_wrap #kv {
  margin-top: 18.75%;
  padding-bottom: 130.46875%;
  position: relative;
  height: 0;
  overflow: hidden;
  background: url(/pc/special/choitashi/images/kv-sp.jpg) no-repeat;
  background-size: contain;
}
#choitashi #choitashi_wrap #kv h1 {
  margin-top: 0;
  position: relative;
}
#choitashi #choitashi_wrap #topic_path {
  display: none;
}
#choitashi #choitashi_wrap .whats {
  padding: 18.75% 0;
  position: relative;
  color: #331c12;
}
#choitashi #choitashi_wrap .whats h3 {
  margin-bottom: 1.75em;
}
#choitashi #choitashi_wrap .whats p {
  padding: 0 4.6875%;
  line-height: 1.5714285714;
  text-align: left;
}
#choitashi #choitashi_wrap .whats p + p {
  margin-top: 1.5em;
}
#choitashi #choitashi_wrap .whats .whats-bgi {
  position: absolute;
  top: 0;
}
#choitashi #choitashi_wrap .add-a-little {
  margin-top: 6.25%;
  padding: 0 3.125%;
  position: relative;
}
#choitashi #choitashi_wrap .add-a-little .add-a-little-yogurt, #choitashi #choitashi_wrap .add-a-little .add-a-little-foodstuff {
  position: absolute;
}
#choitashi #choitashi_wrap .add-a-little .add-a-little-yogurt {
  margin-top: 31.25%;
  top: 0;
}
#choitashi #choitashi_wrap .add-a-little .add-a-little-foodstuff {
  margin-bottom: 3.125%;
  bottom: 0;
}
#choitashi #choitashi_wrap #recommended .choitashi_bgi {
  padding: 12.5% 0 27.34375%;
  text-align: left;
}
#choitashi #choitashi_wrap #recommended .read {
  padding-bottom: 4.6875%;
  text-align: center;
  font-size: 26px;
  font-size: 2.6rem;
  font-size: 4.0625vw;
}
#choitashi #choitashi_wrap #recommended ul {
  padding: 0px 9.375%;
}
#choitashi #choitashi_wrap #recommended li div {
  line-height: 1.5714285714;
}
#choitashi #choitashi_wrap #recommended li div.img-div {
  padding: 0 0 7.6923076923% 0;
}
#choitashi #choitashi_wrap #recommended li div.title-div {
  padding-bottom: 7.6923076923%;
}
#choitashi #choitashi_wrap #recommended li div.border-div {
  position: relative;
  height: 6em;
  line-height: 2.1;
  text-align: left;
  font-size: 24px;
  font-size: 2.4rem;
  font-size: 3.75vw;
}
#choitashi #choitashi_wrap #recommended li div.border-div img {
  position: absolute;
}
#choitashi #choitashi_wrap #recommended li div:last-child {
  padding: 11.5384615385% 16.3461538462% 0px 16.3461538462%;
}
#choitashi #choitashi_wrap #recommended li + li {
  margin-top: 15.3846153846%;
}
#choitashi #choitashi_wrap #recommended a {
  color: #000;
}
#choitashi #choitashi_wrap .slide_wrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}
#choitashi #choitashi_wrap .slide_wrap .slide_item img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media only screen and (min-height: 200vw) {
  #choitashi #choitashi_wrap .slide_wrap .slide_item img {
    width: auto;
    max-width: none;
    height: 100%;
  }
}
#choitashi #choitashi_wrap .choitashi_bgi {
  background: url(/pc/special/choitashi/images/section-bgi-sp.png);
  background-size: contain;
  text-align: center;
}
#choitashi #choitashi_wrap .main_visual {
  padding-bottom: 78.125%;
  position: relative;
  height: 0;
  background: transparent;
}
#choitashi #choitashi_wrap .main_visual h2 {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 800;
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
}
#choitashi #choitashi_wrap .fadeIn {
  animation: 2s fadeIn 1s forwards;
  opacity: 0;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
#choitashi #choitashi_wrap .js_fadeInUp {
  opacity: 0;
}
#choitashi #choitashi_wrap .fadeInUp {
  animation: fadeInUp 3s 0s forwards;
}
@keyframes fadeInUp {
  0%, from {
    transform: translateY(3%);
    opacity: 0;
  }
  100%, to {
    transform: translateY(0);
    opacity: 1;
  }
}
@media (orientation: landscape) {
  #choitashi #choitashi_wrap #kv {
    margin-top: 8.59375%;
  }
}
/* pc-small
-------------------------------------------------- */
/* tablet
-------------------------------------------------- */
/* sp-side
-------------------------------------------------- */
@media only screen and (max-width: 640px) {
  html {
    font-size: 62.5%;
  }
}
/* iPhone5-side
-------------------------------------------------- */
@media only screen and (max-width: 568px) {
  html {
    font-size: 55.46875%;
  }
}
/* android-w
-------------------------------------------------- */
@media only screen and (max-width: 540px) {
  html {
    font-size: 52.734375%;
  }
}
/* android-m
-------------------------------------------------- */
@media only screen and (max-width: 480px) {
  html {
    font-size: 46.875%;
  }
}
/* iphone6plus
-------------------------------------------------- */
@media only screen and (max-width: 414px) {
  html {
    font-size: 40.4296875%;
  }
}
/* iphone6
-------------------------------------------------- */
@media only screen and (max-width: 375px) {
  html {
    font-size: 36.62109375%;
  }
  .priceTable .yen span {
    letter-spacing: -0.025em;
  }
}
/* android
-------------------------------------------------- */
@media only screen and (max-width: 360px) {
  html {
    font-size: 35.15625%;
  }
}
/* iphone5, android-s
-------------------------------------------------- */
@media only screen and (max-width: 320px) {
  html {
    font-size: 31.25%;
  }
}