@charset "UTF-8";

/* CSS Document */
a:hover {
  opacity: 0.7;
}

h2 {
  margin: 0;
  padding: 0;
  border-left: none;
  font-size: 18pt;
  font-weight: bold;
  color: #452323;
}

h4,
h5,
h6 {
  margin-bottom: 0.25em;
}

  {
  text-align: left;
}

.vegetable-juice {
  /* font-size: 150%; */
}

.vegetable-juice div {
  /* width: 100%; */
  box-sizing: border-box;
}

.vegetable-juice img {
  width: 100%;
}

.lead {
  color: #f09c41;
  font-weight: bold;
}

.breadcrumb {
  margin: 0;
}

/* ************************************************ */
/* カート共通 */
/* ************************************************ */
.cartWrapper {
  font-size: 66.666%;
}

.cartWrapper .image {
  width: 75%;
  margin: auto;
}

.cartWrapper .iteminfo {
  text-align: center;
  margin-bottom: 1em;
  font-size: 175%;
  font-weight: bold;
}

.cartWrapper .productPriceArea .normalArea li.priceArea dl .price em,
.cartWrapper .productPriceArea .regularArea div.priceArea dl .price em {
  font-weight: bold;
}

.cartWrapper .productPriceArea .regularArea .regularBtnArea li .course em,
.cartWrapper .productPriceArea .regularArea .regularBtnArea li .course strong {
  font-size: 100%;
}

/* ************************************************ */
/* section01 */
/* ************************************************ */
#section01 h2 {
  width: 100%;
  height: 1.375em;
  margin: 0 0 0;
  padding: 0.5em 0;
  background: url(/html/template/million01/assets/img/vegetable-juice/m03.png) no-repeat center top;
  background-size: 100% auto;
  font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 150%;
  text-align: center;
  line-height: 1;
  letter-spacing: -0.05em;
  box-sizing: content-box;
}

#section01 {
  margin: 0 0 0;
}

#section01 p,
#section02 p {
  font-size: 100%;
  margin-bottom: 1em;
}

#section01 span,
#section02 span {
  color: #060;
  font-weight: bold;
  font-style: normal;
}

#section01 em,
#section01 strong,
#section02 em,
#section02 strong {
  color: #060;
  font-style: normal;
  font-weight: bold;
}

#section01 h2 {
  width: 100%;
  height: 1.375em;
  margin: 0 0 0;
  padding: 1em 0;
  background: url(/html/template/million01/assets/img/vegetable-juice/m03.png) no-repeat center top;
  background-size: 100% 100%;
  font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 166.67%;
  text-align: center;
  line-height: 1;
  letter-spacing: -0.05em;
}

#section01 h3 {
  width: 100%;
  font-size: 125%;
  line-height: 1.2;
  text-align: left;
  font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  background: url(/html/template/million01/assets/img/vegetable-juice/img_sec01r01.png) left center no-repeat;
  background-size: auto 100%;
  padding: 0 0 0 18%;
  margin: 0;
}

#section01 .reason02 h3 {
  background: url(/html/template/million01/assets/img/vegetable-juice/img_sec01r02.png) left center no-repeat;
  background-size: auto 100%;
}

#section01 .reason03 h3 {
  background: url(/html/template/million01/assets/img/vegetable-juice/img_sec01r03.png) left center no-repeat;
  background-size: auto 100%;
}

#section01 .reason01 h3 {
  width: 100%;
  height: 0;
  margin: 0 0 0.5em;
  padding: 61.64383% 0 0;
  position: relative;
  background: url(/html/template/million01/assets/img/vegetable-juice/sp_bg_sec01_01.webp) left top no-repeat;
  background-size: 100% auto;
}

.no-webp #section01 .reason01 h3 {
  background-image: url(/html/template/million01/assets/img/vegetable-juice/sp_bg_sec01_01.jpg);
}

#section01 .reason01 h3 span {
  position: absolute;
  width: 80%;
  height: 100%;
  left: 17.5%;
  top: 4%;
  color: #452323;
  font-size: 106.6666%;
  font-weight: normal;
}

#section01 .reason01 .photo {
  width: 70%;
  margin: 0 auto 0.5em;
}

#section01 .reason01,
#section01 .reason02 {
  margin: 0 0 3em;
}

#section01 .reason03 {
  margin: 0 0 0;
}

#section01 img {
  margin-bottom: 0.5em;
}

/* ************************************************ */
/* section02 */
/* ************************************************ */
#section02 {
  width: 100%;
  margin: 0 0 1em;
  padding: 4% 3%;
  color: #3e2a13;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background: #fef9eb;
  background-repeat: no-repeat, no-repeat;
  background-position: right 30px, left;
  font-size: 100%;
  text-align: left;
}

#section02 h3 {
  padding: 0;
  font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-size: 200%;
  margin: 0;
  line-height: 1;
  text-align: center;
}

#section02 .reason01 {
  width: 100%;
  margin: 0 0 1em;
  padding: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

#section02 .reason02 {
  position: relative;
  width: 100%;
  margin: 0 0 1em;
  padding: 0;
}

#section02 .reason03 {
  width: 100%;
  margin: 0 0 0;
  padding: 1em 0 0;
  background-size: contain;
}

#section02 .reason02 div {
  width: 100%;
}

#section02 .reason03 div {
  width: 100%;
  margin: 0 0 1em;
  padding: 0;
}

#section02 .reason02 ul {
  width: 100%;
  margin: 0;
}

#section02 .reason02 ul li {
  font-size: 66%;
  padding-right: 1em;
}

#section02 img {
  margin: 0 auto 1em;
  display: block;
  width: 70%;
}

p.yj_allow01 {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 0 0 0;
  background: url(/html/template/million01/assets/img/vegetable-juice/mm07.png) center bottom no-repeat;
  text-align: center !important;
  font-size: 3em;
  color: #fff;
  font-family: "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
  text-shadow: #999 0.3px 0.5px 3px;
  font-weight: bold;
  background-size: 141% auto;
}

p.yj_allow02 {
  width: 100%;
  margin: 0 auto 0.5em;
  padding: 0.5em 0 1em;
  background: url(/html/template/million01/assets/img/vegetable-juice/mm07.png) center top no-repeat;
  text-align: center !important;
  font-size: 150%;
  line-height: 1.25;
  color: #060;
  font-family: "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
  font-weight: bold;
  background-size: 120% 100%;
}

.closing {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: calc(50% + 11em) 0 0 0;
  text-align: center !important;
  font-size: 125%;
  color: #333;
  font-family: "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
  font-weight: bold;
  height: 100%;
  background: url(/html/template/million01/assets/img/vegetable-juice/sp_img_cls.webp) center bottom no-repeat;
  background-size: 100% auto;
}

.closing small {
  font-size: 33%;
}

.no-webp .closing {
  background-image: url(/html/template/million01/assets/img/vegetable-juice/sp_img_cls.jpg);
}

.closing div {
  position: absolute;
  left: 0;
  right: 0;
  top: 0%;
  width: 100%;
  height: 80%;
  margin: auto;
}

.closing p {
  line-height: 1.2;
  text-align: center;
  margin: 0.5em 0;
}

.closing em {
  color: #060;
  font-style: normal;
}

.closing p {
  margin-bottom: 0.25em;
  line-height: 1.2;
}

/* ************************************************ */
/* お客様の声 */
/* ************************************************ */
.block_voice_yj {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 2% 5% 2%;
  margin: 0;
  background: url(/html/template/million01/assets/img/vegetable-juice/img_hagaki.webp) center top no-repeat;
  background-size: 100% auto;
  border: double 5px #ccc;
  border-radius: 5px;
  box-sizing: border-box;
}

.no-webp .block_voice_yj {
  background-image: url(/html/template/million01/assets/img/vegetable-juice/img_hagaki.jpg);
}

.block_voice_yj .voice1,
.block_voice_yj .voice2,
.block_voice_yj .voice3,
.block_voice_yj .voice4,
.block_voice_yj .voice5,
.block_voice_yj .voice6 {
  padding: 1.5em 0;
  border-bottom: 2px #ccc dotted;
}

.block_voice_yj .part01 p.message {
  margin: 0 0 0.5em;
  padding: 0;
}

.block_voice .voice {
  margin-bottom: 2em;
  background-color: #ffffe0;
}

.block_voice .voice ul {
  font-weight: bold;
  color: #505050;
}

.block_voice .voice li:nth-child(3) {
  font-weight: normal;
}

.block_voice .message {
  background-color: #fff;
}

.block_voice_yj h2 {
  width: 96%;
  margin: 0.25em 0 0.5em;
  padding: 1em 2%;
  color: #eb5e25;
  font-size: 150%;
  font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  border: none;
  line-height: 1;
  background: url(/html/template/million01/assets/img/vegetable-juice/img_ve_fukidasi.png) center center no-repeat;
  background-size: 100% 100%;
  text-align: center;
}

.block_voice_yj p.message {
  margin: 0 0 0.5em;
  padding: 0.5em 3% 0;
}

.block_voice_yj p.profile {
  margin: 0 0 1em;
  text-align: right;
}

.block_voice_yj em,
.block_voice_yj strong {
  color: #eb5e25;
  font-style: normal;
  font-weight: bold;
}

.block_voice_yj .p_rt {
  position: absolute;
  width: 9em;
  bottom: 0;
  right: 10px;
}

.block_voice_yj .photo01 {
  position: absolute;
  width: 314px;
  height: 316px;
  top: 225px;
  left: 370px;
}

.block_voice_yj .photo02 {
  position: absolute;
  width: 314px;
  height: 316px;
  top: 541px;
  left: 30px;
}

.reviewArea {
  margin: 0;
  padding: 0;
  text-align: left;
  border: none;
}

.reviewArea ul,
ul.voiceBtn {
  height: 8em;
}

.reviewArea .reviewV,
.voiceBtn .reviewV,
.reviewArea .reviewW,
.voiceBtn .reviewW {
  width: 100%;
  height: 4em;
}

.reviewArea .reviewV a,
.voiceBtn .reviewV a {
  padding: 1.5em 0;
}

.reviewArea .reviewW a,
.voiceBtn .reviewW a {
  padding: 1.5em 0;
}

.block_voice {
  margin: 0;
  padding: 2em 0 1em;
  border: none;
}

.recipeArea img,
.regularArea img,
.regularArea p {
  margin: 0;
  width: 100%;
}

.recipeArea p {
  margin: 0;
}

.reviewTitle {
  font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  line-height: 1.25;
  margin-bottom: 0.5em;
}

/* ************************************************ */
/* 続きを見る */
/* ************************************************ */
.block_voice .review-desc {
  display: none;
  width: 100%;
  margin: 0 auto;
  padding: 0.5em 3% 1em;
  background-color: #ffffe0;
}

.readmore {
  position: relative;
  width: 100%;
  margin: 1em auto;
  display: block;
  border: transparent;
  /* background-color: #758f5b; */
  background-color: #aaa;
  color: #fff;
  padding: 1em 0;
  line-height: 1;
  transition: 0.5s;
  -erbkit-transition: 0.5s;
}

.readmore::after {
  content: " ";
  position: absolute;
  width: 20px;
  height: 20px;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  right: 28px;
  top: 15px;
  transition: 0.5s;
  -erbkit-transition: 0.5s;
}

.on-click {
  color: transparent !important;
}

.on-click::after {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  top: 25px;
  left: 0;
  right: 0;
  margin: auto;
}

@media screen and (min-width: 480px) {

  #section01 .reason01 div,
  #section01 .reason02 div,
  #section01 .reason03 div {
    font-size: 87.5%;
  }

  #section01 h2 {
    font-size: 175%;
    padding: 0.3em 0 0;
  }

  #section01 h3 {
    font-size: 137.5%;
  }

  .block_voice_yj h2 {
    padding: 1.5em 2%;
  }

  .reviewTitle {
    font-size: 150%;
  }

  .reviewArea ul,
  ul.voiceBtn {
    height: 3em;
  }

  .reviewArea .reviewV,
  .voiceBtn .reviewV,
  .reviewArea .reviewW,
  .voiceBtn .reviewW {
    float: left;
    width: 49.5%;
    height: 3em;
  }

  .reviewArea .reviewV a,
  .voiceBtn .reviewV a {
    padding: 1em 0;
  }

  .reviewArea .reviewW a,
  .voiceBtn .reviewW a {
    padding: 1em 0;
  }

  p.yj_allow02 {
    margin: 0 auto 0.25em;
    font-size: 200%;
  }
}

@media screen and (min-width: 640px) {
  .yj_zassi {
    font-size: 200%;
  }

  #section01 h2 {
    font-size: 200%;
    padding: 0.5em 0 0;
  }

  #section01 h3 {
    font-size: 175%;
  }

  #section02 h3 {
    font-size: 300%;
  }
}

@media screen and (min-width: 768px) {
  .lead {
    font-size: 150%;
  }

  .vegetable-juice {
    font-size: 100%;
  }

    {
    margin-left: auto;
    margin-right: auto;
  }

  #section01 .reason01 div,
  #section01 .reason02 div,
  #section01 .reason03 div {
    font-size: 100%;
  }

  #section01 h2 {
    height: 1em;
    font-size: 300%;
    padding: 0.75em 0 0.5em;
  }

  #section01 h2 br {
    display: none;
  }

  #section01 p {
    font-size: 125%;
  }

  #section01 h3 {
    width: 100%;
    margin: 0;
    padding: 0.5em 0 0.5em 12%;
    background: url(/html/template/million01/assets/img/vegetable-juice/img_sec01r01.png) left center no-repeat;
    background-size: auto 100%;
    font-size: 225%;
    font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    line-height: 1.2;
    text-align: left;
  }

  #section01 .reason01 h3 span {
    font-size: 100%;
    top: 8%;
  }

  #section01 .reason03 img {
    float: right;
    width: 38%;
    padding: 0 0 0 1em;
  }

  #section01 .reason01 {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: stretch;
    align-items: stretch;
  }

  #section01 .reason01 .photo {
    width: 38%;
    margin: 0;
  }

  #section01 .reason01 .description {
    width: 60%;
    margin: 0;
  }

  #section01 .reason01 .description02 {
    width: 100%;
    margin: 0;
  }

  #section02 {
    background: url(/html/template/million01/assets/img/vegetable-juice/m10.jpg) #fef9eb;
    background-repeat: no-repeat, no-repeat;
    background-position: right 30px, left;
    font-size: 125%;
  }

  #section02 h3 {
    margin-bottom: 0.5em;
    font-size: 250%;
    text-align: left;
  }

  #section02 .reason01 img {
    display: none;
  }

  #section02 .reason01 p {
    width: 66%;
  }

  #section02 .reason01 img {
    display: none;
  }

  #section02 .reason02 img {
    width: 33%;
    float: left;
  }

  #section02 .reason02 div {
    width: 64%;
    float: right;
  }

  #section02 .reason02 ul {
    display: none;
  }

  #section02 .reason03 div {
    width: 78%;
  }

  #section02 .reason03 img {
    width: 30%;
    float: right;
  }

  .closing {
    padding: 40% 0 0 0;
    font-size: 150%;
    background: url(/html/template/million01/assets/img/vegetable-juice/img_cls.webp) center top no-repeat;
    background-size: 100% auto;
  }

  .no-webp .closing {
    background-image: url(/html/template/million01/assets/img/vegetable-juice/img_cls.jpg);
  }

  .cartAreaN3 .normalCart img,
  .cartAreaN3 .regularCartA img,
  .cartAreaN3 .regularCartB img {
    width: 100%;
  }

  .block_voice_yj h2 {
    font-size: 250%;
  }

  .block_voice_yj .block01 {
    width: 100%;
    padding: 0 38.2% 0 0;
    background: url(/html/template/million01/assets/img/vegetable-juice/r_fj.jpg) right top no-repeat;
    background-size: 39.2% auto;
    margin-bottom: 1em;
    border-bottom: 2px #ccc dotted;
  }

  .block_voice_yj .block02 {
    width: 100%;
    padding: 0 0 0 38.2%;
    background: url(/html/template/million01/assets/img/vegetable-juice/m12.jpg) left 1em no-repeat;
    background-size: 35.2% auto;
    border-bottom: 2px #ccc dotted;
  }

  .block_voice_yj .block03 {
    width: 100%;
    padding: 0 38.2% 0 0;
    background: url(/html/template/million01/assets/img/vegetable-juice/m11.jpg) right 1em no-repeat;
    background-size: 35.2% auto;
    border-bottom: 2px #ccc dotted;
  }

  .block_voice_yj .voice1 {
    padding: 1em 0;
    border-bottom: none;
  }

  .block_voice_yj .voice2 {
    padding: 1em 0;
    border-bottom: 2px #ccc dotted;
  }

  .block_voice_yj .voice3 {
    padding: 1em 0;
    border-bottom: 2px #ccc dotted;
  }

  .block_voice_yj .voice4 {
    padding: 1em 0;
    border-bottom: none;
  }

  .block_voice_yj .voice5 {
    padding: 1em 0;
    border-bottom: 2px #ccc dotted;
  }

  .block_voice_yj .voice6 {
    padding: 1em 0;
    border-bottom: none;
  }

  .reviewTitle {
    font-size: 200%;
  }

  .cartWrapper .productPriceArea .regularArea .regularBtnArea li .course em,
  .cartWrapper .productPriceArea .regularArea .regularBtnArea li .course strong {
    font-size: 200%;
  }

  .cartWrapper .productDetail .image {
    margin: 0;
    width: 100%;
  }

  .cartWrapper .productDetail .iteminfo p {
    font-size: 100%;
  }

  .block_voice .voice ul li:nth-child(2) {
    width: 25%;
  }

  .block_voice .voice ul li:nth-child(3) {
    width: 35%;
  }
}

@media screen and (min-width: 1024px) {
    {
    width: 1000px;
  }

  .cartAreaN3 {
    margin-bottom: 6em;
  }

  #section01 .reason01 div,
  #section01 .reason02 div,
  #section01 .reason03 div {
    font-size: 112.5%;
  }

  #section01 h2 {
    font-size: 350%;
  }

  #section01 h3 {
    font-size: 300%;
  }

  .block_voice_yj h2 {
    /* font-size: 300%; */
  }

  .closing {
    padding: 40% 0 0 0;
    font-size: 200%;
  }

  .closing div {
    top: 10%;
  }

  p.yj_allow02 {
    margin: 0 auto 0.25em;
    font-size: 250%;
  }

  .cartWrapper {
    font-size: 100%;
  }

  .block_voice_yj {
    font-size: 125%;
  }
}

/* ************************************************ */
/* 成分表 */
/* ************************************************ */
.nutri {
  background: url(/html/template/million01/assets/img/vegetable-juice/bg_nutrition_sp.png) center top repeat-y;
  background-size: 100% auto;
  padding: 3%;
}

.ttl-nutri {
  padding-bottom: 0.25em;
  border-bottom: 1px solid #e24219;
  color: #e24219;
  font-weight: bold;
  font-size: 125%;
  text-align: center;
}

.img-nutri {
  width: 66%;
  margin: 1em auto;
}

.txt-nutri em {
  text-decoration: underline;
}

.txt-nutri strong {
  font-weight: bold;
}

/* 雑誌に紹介されました */
.zassi202012 {
  margin: 1em 0;
  padding: 8%;
  border: #e24219 solid 5px;
}

.img-zassi-02 {
  width: 100%;
  text-align: center;
}

.img-zassi-02 img {
  width: 70%;
}

.ttl-zassi-01,
.img-zassi-01 {
  margin-bottom: 1em;
}

@media screen and (min-width: 768px) {
  .nutri {
    background: url(/html/template/million01/assets/img/vegetable-juice/bg_nutrition_pc.png) center top repeat-y;
    padding: 3%;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
  }

  .ttl-nutri {
    width: 100%;
    margin-bottom: 1em;
  }

  .img-nutri {
    width: 38%;
    margin: 0;
    order: 2;
  }

  .txt-nutri {
    width: 60%;
    order: 1;
  }

  .zassi202012 {
    padding: 2%;
  }

  .ttl-zassi-01 {
    width: 62%;
    float: right;
  }

  .img-zassi-02 img {
    width: 100%;
  }

  .box-zassi-01 {
    width: 62%;
    margin-bottom: 0;
    float: right;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: stretch;
    align-items: stretch;
  }

  .img-zassi-01 {
    width: 35%;
    margin-bottom: 0;
    float: left;
  }

  .img-zassi-02 {
    width: 25%;
  }

  .txt-zassi-01 {
    width: 72%;
    font-size: 100%;
  }
}

@media screen and (min-width: 1024px) {
  .img-nutri {
    width: 28%;
  }

  .txt-nutri {
    width: 70%;
    font-size: 125%;
  }

  .img-zassi-01 {
    width: 25%;
  }

  .ttl-zassi-01 {
    width: 75%;
    text-align: right;
  }

  .ttl-zassi-01 img {
    width: 75%;
  }

  .box-zassi-01 {
    width: 75%;
  }

  .txt-zassi-01 {
    font-size: 125%;
  }
}

.area-recipe {
  background: url(/html/template/million01/assets/img/vegetable-juice/bg_recipe_01.jpg) center center;
  background-size: 100% auto;
  padding: 5% 0;
}

.ttl-recipe-02 {
  font-size: 100%;
  font-size: 5.34vw;
  font-weight: normal;
  text-align: center;
  margin-bottom: 1em;
}

.ttl-recipe-02 strong {
  font-weight: bold;
  color: #e24219;
}

.ttl-recipe-02 em {
  font-weight: bold;
  color: #037b28;
}

.sec-recipe-01 {
  padding: 0 5%;
  font-size: 125%;
  font-size: 4.8vw;
}

.ttl-recipe-03 {
  margin: 0.5em 0;
  font-size: 125%;
  font-size: 6.4vw;
  font-weight: bold;
  color: #037b28;
  text-align: center;
}

.box-recipe-01 {
  margin: 1em 0;
}

.ttl-recipe-04 {
  padding: 0.25em 0;
  background-color: #e24219;
  text-align: center;
  letter-spacing: 1em;
  color: #fff;
  font-weight: bold;
  font-size: 100%;
}

.box-list-recipe-01 {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: stretch;
  align-items: stretch;
}

.box-list-recipe-01 dt {
  width: calc(100% - 5em);
}

.box-list-recipe-01 dd {
  width: 5em;
  text-align: right;
}

.list-recipe-02 {
  width: 95%;
  width: calc(100% - 1.5em);
  padding-left: 1.5em;
  list-style: inside;
}

.list-recipe-02 li {
  list-style-type: decimal;
}

@media screen and (min-width: 768px) {
  .ttl-recipe-02 {
    font-size: 200%;
    font-size: 4.172vw;
  }

  .ttl-recipe-03 {
    font-size: 200%;
    font-size: 4.17vw;
  }

  .sec-recipe-01 {
    font-size: 125%;
    font-size: 2.608vw;
  }
}

@media screen and (min-width: 1024px) {
  .ttl-recipe-02 {
    font-size: 275%;
  }

  .ttl-recipe-03 {
    font-size: 200%;
  }

  .sec-recipe-01 {
    font-size: 150%;
  }
}

/* ************************************************ */
/* メインビジュアル  */
/* ************************************************ */
.mainVisual {
  width: 100%;
  padding-top: 99%;
  background: url("/html/template/million01/assets/img/vegetable-juice/sp_mv_01.webp");
  no-repeat center top;
  background-size: 100% auto;
}

.no-webp .mainVisual {
  background-image: url("/html/template/million01/assets/img/vegetable-juice/sp_mv_01.jpg");
}

.mainVisual .block01 {
  width: 100%;
  padding: 3%;
  border: 4px solid #006600;
  background-color: #ffffff;
}

.mainVisual .cell01 {
  width: 100%;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center;
}

.mainVisual .block01 .title {
  width: 100%;
  margin-bottom: .5em;
}

.mainVisual .block01 .photo {
  width: 60%;
}

.mainVisual .block01 .btnArea {
  width: 38%;
}

@media screen and (min-width: 768px) {
  .mainVisual {
    width: 100%;
    padding-top: 65%;
    background: url("/html/template/million01/assets/img/vegetable-juice/mv_01.webp") no-repeat center top;
    background-size: 100% auto;
    position: relative;
  }

  .no-webp .mainVisual {
    background-image: url("/html/template/million01/assets/img/vegetable-juice/mv_01.jpg");
  }

  .mainVisual .block01 {
    width: 50%;
    padding: 0;
    border: none;
    position: absolute;
    left: 3%;
    bottom: 3%;
    background: none;
  }

  .mainVisual .cell01 {
    width: 70%;
    padding: 3%;
    border-radius: 15px;
    background: #fff;
  }

  .mainVisual .block01 .title {
    margin-bottom: 0;
  }

  .mainVisual .block01 .photo {
    width: 100%;
  }

  .mainVisual .block01 .btnArea {
    width: 100%;
  }
}