@charset "utf-8";

/*--------------------------------------------------------------
/healthy/mamalula/
--------------------------------------------------------------*/


html {
	height: 100%;font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;font-size: 62.5%;
}
#mainBg {position: fixed;background: url(../img/bg.jpg);background-size: cover;background-repeat: no-repeat;width: 100%;height: 100%;z-index: -1; background-position: center bottom;}
#wrapper {background: #fff;width: 100%;height: 100%;max-width: 750px;margin: 0 auto;overflow: hidden; padding-top: 79px;}

@media screen and (min-width: 611px) {#wrapper {box-shadow: 6px 0px 5px -5px #b4b4b4, -6px 0px 5px -5px #b4b4b4;}
}
#wrapper img {width: 100%;vertical-align: bottom;}

body { margin: 0;}
.pc { display: block!important; }
.sp { display: none!important; }

@media only screen and (max-width: 750px) {
h1 {margin: 0;}
.pc { display: none!important;}
.sp { display: block!important;}
}

/* =-=-=-=-=-=-=-=-=
	header
=-=-=-=-=-=-=-=-= */

header .fvBlock {position: relative;}
header .fvImg .partsIcon01 {position: absolute;width: 30.39%;left: 1.6%;bottom:6.11%;z-index: 10;}
header .fvImg .partsIcon02 {position: absolute;width: 30.39%;left: 20.66%;bottom:-3%;}
header .fvImg .partsIcon03 {position: absolute;width: 30.39%;right: 25.86%;bottom:0.12%;}
header .fvImg .partsIcon04 {position: absolute;width: 30.39%;right: 1.6%;bottom:6.11%;}

header .fixedMenu {position:fixed; top:0; left:0; z-index:700; width:100%; background:#bcaaa4; padding:10px 0 13px;}
header .fixedMenu ul {margin:0 auto; width:750px; display:table; border-collapse:separate; border-spacing:6px 0;}
header .fixedMenu ul li {display:table-cell;}
header .fixedMenu ul li img { border-radius:10px;-webkit-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.35);-moz-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.35);box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.35);}

.fixedMenu {
	transition: .5s;
}
.fixedMenu.hide{
    transform: translateY(-100%);
}
/* =-=-=-=-=-=-=-=-=
	cv
=-=-=-=-=-=-=-=-= */
input[type="image"] {width: 100%;}


/* =-=-=-=-=-=-=-=-=
	floatingBarBlock
=-=-=-=-=-=-=-=-= */

.floatingBarBlock nav {position: fixed;bottom: 0;left: 0;z-index: 700;display: none;width: 100%; background:#eeeeee;}
.floatingBarBlock nav ul {display: table; margin: 0 auto; padding: 0;}
.floatingBarBlock nav ul li { display: table-cell;}

/* PC */
@media screen and (min-width: 751px) {
#floating ul { width: 750px;}
}

/* SP */
@media screen and (max-width: 750px) {
#floating ul { width: 100%;}
}


/* =-=-=-=-=-=-=-=-=
	brandBlock
=-=-=-=-=-=-=-=-= */

#brandBlock .brandImagebox {position: relative;}
#brandBlock .brandImagebox .img06_txt {position: absolute;bottom:26%;width: 87.33%;left: 7%;}
#brandBlock .brandImagebox .brand_img06_txt {position: absolute;bottom:24%;width: 88.33%;height: 5.3%;left: 6.5%;z-index: 10;}
#brandBlock .brandImagebox .brand_img06_txt .txt_line {width: 100%;overflow: hidden;height: 100%;}
#brandBlock .brandImagebox .brand_img06_txt .txt_line {width: 0%;} /* moveCSS */
#brandBlock .brandImagebox .brand_img06_txt .txt_line img {width: auto;height: 100%;}


/* =-=-=-=-=-=-=-=-=
	voiceBlock
=-=-=-=-=-=-=-=-= */


/* =-=-=-=-=-=-=-=-=
	nutrientsBlock
=-=-=-=-=-=-=-=-= */

#nutrientsBlock .nutrientsMoth {position: relative;}
#nutrientsBlock .nutrientsTxt {position: absolute;width: 30%;left: 35%;top: 28%;opacity: 0; }/* top: 20%;left: 12%; width: 75.45%; */
#nutrientsBlock .nutrientsBecora {position: absolute;bottom: 34%;left: 18%; width: 64.8%; }
#nutrientsBlock .nutrientsImage {position: relative;}
#nutrientsBlock .nutrientstxtBox {position: absolute;width: 30.66%;height: 70.47%; left: 2.4%;top: 5%; z-index: 10;}
#nutrientsBlock .nutrientstxtBox .nutrientstxtImg {position: relative;height: 100%;}
#nutrientsBlock .nutrientstxtBox .nutrientstxtImg .nutrients_img02_txt {width: 76.08%;position: absolute;left: 18%;}
#nutrientsBlock .nutrientstxtBox .nutrientstxtImg .nutrients_img02_becora {width: 100%;position: absolute;top: 20%;}
#nutrientsBlock .nutrientstxtBox02 {position: absolute;width: 34.4%;height: 46.39%;right: 4%;top: 12%;}
#nutrientsBlock .nutrientstxtBox02 .nutrientstxtImg {position: relative;height: 100%;}
#nutrientsBlock .nutrientstxtBox02 .nutrientstxtImg .nutrients_img07_txt {width: 72.30%;position: absolute;right: 7%;}
#nutrientsBlock .nutrientstxtBox02 .nutrientstxtImg .nutrients_img07_becora {width: 100%;position: absolute;top: 12%;}
#nutrientsBlock .nutrientsImage .meal {width: 45.6%;height: 26.96%;position: absolute;bottom: 5%;left: 6.4%;}
#nutrientsBlock .nutrientsImage .meal .mealImg {width: 100%;height: 100%;overflow: hidden;}
#nutrientsBlock .nutrientsImage .meal .mealImg {width: 0%;} /* moveCSS */
#nutrientsBlock .nutrientsImage .meal .mealImg img {width:  auto; height: 100%;}
#nutrientsBlock .nutrientsImage .supple {width: 44.1%;height: 31.46%;position:absolute;bottom: 5%;right: 4%;}
#nutrientsBlock .nutrientsImage .supple {opacity: 0;right: 6%;} /* moveCSS */
#nutrientsBlock .nutrientsImage .supple .suppleImg {width: 100%;height: 100%;}
#nutrientsBlock .nutrientsImage .supple .suppleImg img {width: auto; height: 100%;}


/* =-=-=-=-=-=-=-=-=
	approachBlock
=-=-=-=-=-=-=-=-= */


/* =-=-=-=-=-=-=-=-=
	commitmentBlock
=-=-=-=-=-=-=-=-= */
#commitmentBlock .commitmentMoth {position: relative;}
#commitmentBlock .commitmentBecora {position: absolute;bottom: 20%;left: 19%; width: 60.26%; }


/* =-=-=-=-=-=-=-=-=
	qaBlock
=-=-=-=-=-=-=-=-= */

#qaBlock {font-size: 1.5rem;line-height: 1.2;color: #3e3e3e; position: relative;margin-bottom: 10%;}
#qaBlock h1 {position: relative;padding-top: 4%;;margin-bottom: 5.3333%;background: #f9f3ef;}
#qaBlock .accordion {width:92%;margin: 0 auto;}
#qaBlock .accordion dl {margin-bottom: 2%;}
#qaBlock .accordion dt {cursor: pointer;padding: 3% 10% 3% 4%;background:url(../img/accordion_icon_off.png) no-repeat 96% center #f2f2f2;background-size: auto 10px;margin-top: 0;text-align: left;box-shadow: none;margin-bottom: 0;display: flex;justify-content: flex-start;align-items: center;}
#qaBlock .accordion dt .qIcon {margin-right: 4%;font-size: 2.5rem;color: #3e3e3e;}
#qaBlock .accordion dt.open {background:url(../img/accordion_icon.png) no-repeat 96% center #f2f2f2;background-size:auto 10px;}
#qaBlock .accordion dl:last-child {box-shadow: none;}
#qaBlock .accordion dt .box01 {width:22.16%;margin:0 auto;}
#qaBlock .accordion dt .box02 {width:56.83%;margin:0 auto;}
#qaBlock .accordion dt img {width:100%;height:auto;}
#qaBlock .accordion dd {background:#fff;display:none;text-align:left;padding: 4% 4% 5% 4%;line-height: 160%;font-size: 80%;font-feature-settings: "palt";}
#qaBlock .accordion dd .aBox {display: flex;justify-content: flex-start;}
#qaBlock .accordion dd .aIcon {margin-right: 5%;font-size: 2.5rem;color: #f48f96;}
#qaBlock .accordion dd p {margin-top:0.6em;}
#qaBlock .accordion dd p span {font-weight:bold;display:block;}
#qaBlock .accordion dd p.indent1 {padding-left: 1.5em;text-indent: -1.5em;margin-top:0.2em;line-height:1.5;}
#qaBlock .accordion dd p.indent2 {padding-left: 2em;text-indent: -2em;margin-top:0.6em;}
#qaBlock .accordion dd .teikiImg01 {width: 85.1910%;display: block;margin: 0 auto;margin-top: 5%;}

@media screen and (min-width: 621px) {
#qaBlock .accordion dt {font-size: 130%;}
#qaBlock .accordion dd {font-size: 120%;line-height: 160%;}
}

/* =-=-=-=-=-=-=-=-=
	teikiBlock
=-=-=-=-=-=-=-=-= */
#teikiBlock .itemInfo {display:table; margin:16px auto 10px; width:100%;}
#teikiBlock .img {display:table-cell; width:38.7%;}
#teikiBlock .itemChild {display:table-cell; padding-left:3px;vertical-align:middle; font-size:390%; line-height:1.5;}
#teikiBlock .itemChild .price span {font-weight:bold; font-size:160%;}
#teikiBlock .btnDetail {clear:both; margin:0 auto 20px; width:94.6%; display:table; background:#ffeedf;}
#teikiBlock .btnDetail .txt {display:table-cell; width:46.2%;}
#teikiBlock .btnDetail .txt img {width:100%;}
#teikiBlock .btnDetail .btn {display:table-cell;vertical-align:middle; text-align:left; padding-right:4.2%;}
#teikiBlock .btnDetail .btn a {display:inline-block; position:relative; line-height:1; font-size:4rem; width:100%; padding:25px 0; text-align:center; font-weight:700; border:1px solid #b5babf; border-radius:5px; background:#fff; background-image:-webkit-linear-gradient(top,#fff 0,#e4e6e7 100%); background-image:linear-gradient(180deg,#fff 0,#e4e6e7 100%); color:#333; text-decoration:none !important;}
#teikiBlock .btnDetail .btn a:hover {opacity:0.7}
#teikiBlock .btnDetail .btn a::after {display:inline-block; width:0; height:0; border:10px solid transparent; content:" "; border-right:0 solid transparent; border-left:10px solid #46484b; position:absolute; top:0; bottom:0; margin-top:auto; margin-bottom:auto; right:0; margin-right:20px;}

/*2307定期_追加*/
#teikiBlock p.note {font-size:16px; width: 94.6%; margin:15px auto; padding-left:1em; text-indent:-1em;}

/* =-=-=-=-=-=-=-=-=
	footer
=-=-=-=-=-=-=-=-= */
.m-footerC_commonLink_list {
	font-family:"Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック",  "MS PGothic", "Arial ", sans-serif;
	font-size:1.1rem;
	color:#000;
	line-height:1.4;
}

.m-footerC_commonLink_list a:link {
	text-decoration:none;
}

.m-footerC_commonLink_list a:visited {
	text-decoration:none;
}

.lp-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background-color: #004ea2;
  padding: 34px 24px;
  font-family: "Noto Sans JP", sans-serif;
}
.lp-footer a {
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  text-decoration: none;
  -webkit-transition: 0.2s all ease-out;
  transition: 0.2s all ease-out;
  position: relative;
  display: block;
}
.lp-footer a.link01 {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.lp-footer a.link01::after {
  content: "";
  width: 12px;
  height: 20px;
  background-image: url("/fre/oyakotetsu/img/arr.svg");
  background-size: contain;
  background-position: 0 0;
  background-repeat: no-repeat;
  display: inline-block;
  margin-left: 10px;
}
@media (hover: hover) {
  .lp-footer a:hover {
    text-decoration: underline;
  }
}
@media screen and (max-width: 750px) {
  .lp-footer {
    padding: 4.5333333333vw 3.2vw;
  }
  .lp-footer a {
    font-size: 2.9333333333vw;
  }
  .lp-footer a.link01::after {
    width: 1.6vw;
    height: 2.6666666667vw;
    margin-left: 1.3333333333vw;
  }
}

#js-pageTop {
  display: none!important
}
.m-pageTop {
  display: block;
  margin: 0 auto;
  max-width: 1200px;
  width: 100%;
  height: 1px;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 100
}
.m-pageTop.fixed {
  position: fixed;
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0 auto
}
.m-pageTop_btn {
  display: block;
  width: 50px;
  height: 50px;
  background-image: -webkit-linear-gradient(top,rgba(103,110,113,.5) 0,rgba(63,66,67,.5) 100%);
  background-image: linear-gradient(180deg,rgba(103,110,113,.5) 0,rgba(63,66,67,.5) 100%);
  border-radius: 6px;
  position: absolute;
  top: 0;
  right: 0;
  margin-right: -90px;
  color: #fff;
  border: 1px solid #fff
}
@media screen and (max-width:1400px) {
  .m-pageTop_btn {
    margin-right: 10px
  }
}
.m-pageTop_btn:hover {
  background-image: -webkit-linear-gradient(top,#676e71 0,#3f4243 100%);
  background-image: linear-gradient(180deg,#676e71 0,#3f4243 100%)
}
.m-pageTop_btn a {
  color: #fff;
  display: block;
  padding: 30px 0 0;
  width: 50px;
  height: 50px;
  text-align: center;
  position: relative
}
.m-pageTop_btn a::before {
  content: "";
  display: inline-block;
  display: inline-block;
  width: 0;
  height: 0;
  border: 9px solid transparent;
  content: " ";
  border-top: 0 solid transparent;
  border-bottom: 9px solid #fff;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: 20px auto 0
}
.m-pageTop.fixed .m-pageTop_btn {
  position: absolute;
  top: auto;
  right: 0;
  bottom: 0;
  margin: 0 -90px 10px 0
}
@media screen and (max-width:1400px) {
  .m-pageTop.fixed .m-pageTop_btn {
    margin-right: 10px
  }
}
.m-pageTop.fadeIn .m-pageTop_btn {
  opacity: 1;
  -webkit-transition: all .3s 0s ease;
  transition: all .3s 0s ease
}
.m-pageTop.fadeOut .m-pageTop_btn {
  opacity: 0;
  -webkit-transition: all .3s 0s ease;
  transition: all .3s 0s ease
}
.m-pageTop_atxt {
  font-size: 11px;
  font-size: .6875rem;
  font-weight: 700;
  display: none
}