@charset "UTF-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
*:focus {
  outline: none !important;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
body {
  font-family: 'Noto Sans JP', 'Montserrat', "Helvetica Neue", Helvetica, "Yu Gothic", Arial, Verdana, Roboto, "游ゴシック", 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
@media screen and (min-width: 768px) {
  body {
    font-size: 18px;
  }
}
@media screen and (max-width: 767px) {
  body {
    font-size: 3.75vw;
  }
}
ul, ol {
  list-style: none;
}
section {
  position: relative;
}
.anchor {
  width: 0;
  height: 0;
  position: absolute;
}
@media screen and (min-width: 768px) {
  .anchor {
    top: -50px;
  }
}
@media screen and (max-width: 767px) {
  .anchor {
    top: -92px;
  }
  #anchor-01, #anchor-02, #anchor-03, #anchor-04, #anchor-05, #anchor-06 {
    margin-top: -100px;
    padding-top: 100px;
  }
}
@media screen and (min-width: 768px) {
  .anchor#about {
    top: 0;
  }
}
@media screen and (max-width: 768px) {
  #about_gimmick .container {
    padding-top: 30px;
  }
}
@media (min-width: 768px) {
  .container {
    width: 1004px;
  }
}
@media (min-width: 768px) {
  header .container {
    width: 1004px;
  }
  header nav ul {
    width: 700px;
    display: block;
    float: right;
    text-align: right;
    list-style: none;
    padding: 0;
  }
  header nav ul li {
    margin-top: 0.5em;
  }
  nav ul li {
    display: inline-block;
    vertical-align: middle;
  }
  main {
    padding-top: 110px;
  }
}
@media (max-width: 767px) {
  body {
    width: 100vw;
    overflow-x: hidden;
  }
  body#home {
    width: 100%;
  }
}
header {
  background-color: #6d8b2a;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
  color: white;
  padding-top: 30px;
  height: 110px;
  z-index: 9999;
  position: absolute;
  width: 100%;
}
header h1 img {
  width: 144px;
  height: auto;
}
@media (max-width: 992px) {
  header {
    width: 100%;
    margin: 0 auto;
  }
  header .container {
    width: 100%;
    margin: 0 auto;
  }
  nav.global ul {
    width: 75%;
  }
}
@media (max-width: 767px) {
  header {
    height: 92px;
    padding-top: 20px;
    position: fixed;
    top: 0;
    width: 100%;
  }
}
@media (min-width: 576px) {
  .container {
    max-width: 100%;
  }
}
header a {
  color: white;
}
@media (min-width: 768px) {
  header .flex {
    /* display: -ms-flexbox; display: flex; display: -webkit-flex; flex-basis: 100%; -webkit-flex-basis: 100%; */
    align-items: center;
  }
  header .flex h1 {
    width: 144px;
    float: left;
  }
}
header .btn_menu {
  width: 10.2vw;
  position: absolute;
  top: 30px;
  right: 20px;
}
header .btn_menu img {
  width: 10.2vw;
  height: auto;
}
header .navWrapper {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.4);
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}
header .navWrapper.open {
  display: block;
}
header .navWrapper.open .local_SP {
  right: 0;
}
header .navWrapper .close {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 14vw;
  color: #b5b5b6;
}
header .navWrapper .local_SP {
  display: block;
  background-color: white;
  position: absolute;
  top: 0;
  right: -74vw;
  width: 72.9vw;
  overflow: scroll;
  transition: right 0.4s ease-in 0.1s;
}
header .navWrapper .local_SP ul {
  height: 100vh;
  display: -ms-flexbox;
  display: flex;
  flex-basis: 100%;
  -webkit-flex-direction: column;
  flex-direction: column;
  padding: 0;
  background-color: #fff;
}
header .navWrapper .local_SP ul li {
  height: 8.18vh;
  line-height: 1.2;
  border-bottom: 1px solid #e5e5e5;
  font-weight: 700;
}
header .navWrapper .local_SP ul li.bgGreen, header .navWrapper .local_SP ul li.onlineShop {
  border-bottom: 1px solid white;
  background-repeat: no-repeat;
  background-position: 64vw center;
  background-size: 10%;
}
header .navWrapper .local_SP ul li.bgGreen a, header .navWrapper .local_SP ul li.onlineShop a {
  color: white;
}
header .navWrapper .local_SP ul li.bgGreen {
  background-color: #6d8b2a;
  background-image: url(../images/bg_menu_sp_green.png);
}
header .navWrapper .local_SP ul li.onlineShop {
  background-color: #ff7043;
  background-image: url(../images/bg_menu_sp_shop.png);
}
header .navWrapper .local_SP ul li a {
  color: #6d8b2a;
  display: -ms-flexbox;
  display: flex;
  flex-basis: 100%;
  -webkit-flex-direction: column;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  width: 100%;
  font-size: 4.17vw;
  padding-left: 6.67vw;
  vertical-align: middle;
}
header .navWrapper .local_SP ul li a span {
  letter-spacing: -1px;
}
@media screen and (max-width: 767px) {
  header .btn_menu img {
    width: 70%;
    height: auto;
  }
}
@media screen and (max-width: 420px) {
  header .btn_menu img {
    width: 10.2vw;
    height: auto;
  }
}
.pageTop {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .pageTop {
    width: 97px;
    height: 45px;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: -45px;
  }
}
@media screen and (max-width: 767px) {
  .pageTop {
    width: 17.7vw;
    height: 8.33vw;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: -8.2vw;
  }
  .pageTop img {
    width: 100%;
  }
}
footer {
  text-align: center;
  position: relative;
}
footer #footer {
  background-color: white;
  border-top: 2px solid #6d8b2a;
}
@media screen and (min-width: 768px) {
  footer #footer {
    padding-top: 32px;
  }
}
@media screen and (max-width: 767px) {
  footer #footer {
    padding-top: 5%;
  }
}
footer #footer h1 {
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  footer #footer h1 {
    margin-bottom: 32px;
  }
}
@media screen and (max-width: 767px) {
  footer #footer h1 {
    margin-bottom: 5%;
  }
}
footer #footer nav {
  display: block;
}
@media screen and (max-width: 767px) {
  footer #footer nav ul {
    width: 90%;
    padding-left: 0;
    padding-right: 0;
    margin-left: auto;
    margin-right: auto;
    font-size: 91.66%;
  }
}
@media screen and (min-width: 768px) {
  footer #footer nav ul {
    padding-bottom: 12px;
  }
}
footer #footer nav ul li {
  color: #888888;
  display: inline;
}
@media screen and (max-width: 767px) {
  footer #footer nav ul li:nth-of-type(1) {
    width: 100%;
    display: block;
  }
}
footer #footer nav ul li:after {
  content: " |  ";
}
footer #footer nav ul li:last-child:after {
  content: "";
}
footer #footer nav ul li a {
  color: #888888;
}
@media screen and (min-width: 768px) {
  footer #footer nav ul li a {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  footer #footer nav ul li a {
    font-size: 90%;
  }
}
footer #footer_bottom {
  background-color: #6d8b2a;
  color: white;
  font-size: 14px;
}
@media screen and (min-width: 768px) {
  footer #footer_bottom {
    padding: 18px 0;
  }
}
@media screen and (max-width: 767px) {
  footer #footer_bottom {
    padding: 4% 0;
  }
}
#home {
  background-color: #fbe1d0;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (min-width: 768px) {
  #home {
    background-image: url(http://www.yomogi-bijin.jp/products/yomogi_onzapat/images/top_bg_01.png), url(../images/top_bg_repeat.jpg);
    background-repeat: no-repeat, repeat-x;
    background-position: center 110px, left 0px;
    background-size: auto 530px, 300px;
  }
}
@media (max-width: 767px) {
  #home {
    background-position: center 92px;
    padding-top: 92px;
  }
}
#home main img {
  text-align: center;
  margin: 0 auto;
}
#home main p {
  font-size: 14px;
  margin: 0 0 20px 46px;
}
#home main p.notice {
  font-size: 13px;
  color: #9fa0a0;
  text-align: right;
}
@media screen and (max-width: 767px) {
  #home main p.notice {
    text-align: center;
  }
}
#home main hr {
  border-width: 2px;
  border-color: #9fa0a0;
  margin-bottom: 46px;
}
#use_text {
  padding-top: 10px;
  font-size: 11px;
  text-align: center;
}
#home main .panel {
  background-color: white;
  padding: 47px 0;
  width: 100%;
}
@media screen and (max-width: 767px) {
  #home main .panel {
    padding: 4% 0;
  }
}
#home main .note {
  width: 587px;
  color: #962222;
  text-align: left;
  margin: 1em auto;
}
#home main .contentsWrapper {
  position: relative;
  z-index: 20;
  text-align: center;
}
#home main .cloud {
  position: absolute;
  width: 20%;
  max-width: 237px;
  height: auto;
  z-index: 21;
  transition: all 2s ease-in-out;
  transform: translateY(0) scale(0.5);
  -webkit-transform: translateY(0) scale(0.5);
}
#home main .cloud.move {
  transform: translateY(-200px) scale(1);
  -webkit-transform: translateY(-200px) scale(1);
  opacity: 0;
}
#home main #cloud1 {
  top: 37%;
  right: 4%;
}
#home main #cloud2 {
  top: 52%;
  left: 8%;
}
#home main #cloud3 {
  top: 80%;
  right: 0;
}
#home main #cloud4 {
  top: 90%;
  left: 13%;
}
#home main #cloud5 {
  top: 24%;
  right: 11%;
}
#home main #cloud6 {
  top: 36%;
  left: 8%;
}
#home main #cloud7 {
  top: 48%;
  right: 3%;
}
#home main #cloud8 {
  top: 68%;
  left: 12%;
}
#home main .mainVisual {
  width: 100%;
  text-align: center;
  position: relative;
}
@media (min-width: 768px) {
  #home main .mainVisual {
    max-width: 100%;
    height: 620px;
    margin: 0 auto;
  }
  #home main .mainVisual h1 {
    width: 970px;
    margin: 0 auto;
    display: block;
    position: relative;
    overflow: hidden;
    font-size: 0;
    padding: 0;
    line-height: 0;
    margin-bottom: 0;
  }
}
@media (max-width: 767px) {
  #home main .mainVisual {
    background-position: center top;
    height: auto;
  }
  #home main .mainVisual h1 {
    font-size: 0;
    padding: 0;
    line-height: 0;
    margin-bottom: 0;
  }
}
#home main .mainVisual h1 img {
  width: 100%;
  max-width: 1390px;
}
#home main .mainVisual a.shopList {
  display: block;
  position: absolute;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(242, 126, 99, 0.6);
  background-color: white;
  width: 270px;
  height: 63px;
  padding: 5px;
  top: 150px;
  left: calc(50% + 213px);
}
@media (max-width: 767px) {
  #home main .mainVisual a.shopList {
    width: 41.6vw;
    height: 9.8vw;
    right: 2vw;
    left: auto;
    top: 2vw;
  }
}
#home main nav.local_PC {
  background-color: white;
  color: #70621b;
  overflow: scroll-y;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}
#home main nav.local_PC ul {
  width: 760px;
  margin: 0 auto;
  height: 65px;
  padding: 9px 0;
}
/**/
#home main nav.local_PC ul li {
  width: 188px;
  height: 47px;
  padding: 0;
  text-align: center;
  display: table;
  float: left;
}
/**/
#home main nav.local_PC ul a {
  color: #70621b;
  display: table-cell;
  vertical-align: middle;
  /* display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -webkit-justify-content: center; justify-content: center; width: 188px; height: 47px; padding: 0; text-align: center;
*/
  border-radius: 5px;
  text-decoration: none;
  font-weight: 700;
  font-size: 13px;
}
#home main nav.local_PC ul a:hover {
  color: white;
  background-color: #6c8b28;
}
@media (min-width: 768px) {
  #home main nav.local_PC {
    -webkit-justify-content: center;
    justify-content: center;
    position: absolute;
    z-index: 99999;
    width: 100%;
    top: 640px;
    left: 0;
  }
  #home main nav.local_PC.fixed {
    position: fixed;
    top: 0;
    z-index: 99999;
  }
}
#home main section.about {
  position: relative;
  background: #fbe1d0;
}
@media screen and (min-width: 768px) {
  #home main section h2 {
    text-align: center;
    padding: 0;
  }
  #home .aboutHead h2 {
    text-align: center;
    padding: 0 0 0 12%;
  }
  #home main section.about .aboutHead {
    min-height: 390px;
    padding-top: 90px;
    padding-bottom: 84px;
    background-image: url(http://www.yomogi-bijin.jp/products/yomogi_onzapat/images/about_figure1.png), url(http://www.yomogi-bijin.jp/products/yomogi_onzapat/images/about_figure2.png);
    background-position: 6% 48%, 100% 50%;
    background-repeat: no-repeat;
    background-size: 20%, 24%;
  }
  #home .ybcp {
    max-width: 1140px;
    text-align: center;
    margin: 0 auto 70px;
}  
#home .ybcp img {
  width: 96%;
  transition: .6s;
}
#home .ybcp img:hover {
  opacity: .7;
}

}
@media screen and (max-width: 767px) {

  #home .ybcp {
    max-width: 100%;
    text-align: center;
    margin: 0 auto 70px;
}  
#home .ybcp img {
  width: 100%;
  transition: .6s;
}
#home .ybcp img:hover {
  opacity: .7;
}


  #home main section.about .aboutHead {
    background: url(http://www.yomogi-bijin.jp/products/yomogi_onzapat/images/about_figure_sp.png) no-repeat top right;
  }


}
@media (max-width: 767px) {
  #home main section.about .aboutHead {
    background-size: 100%;
    background-position: 50% top;
  }
  #home main section.about .aboutHead h2 {
    margin-top: 5%;
    margin-bottom: 78vw;
    text-align: center;
  }
  #home main section.about .aboutHead h2 img {
    width: 95%;
  }
  #home main section.about .aboutHead p {
    width: 100vw;
    max-width: 103vw;
  }
}
#home main section.about .aboutHead_lead {
  width: 486px;
  margin: 16px auto 0;
  font-size: 112.5%;
  color: #ea581b;
  line-height: 1.6;
  padding: 0 0 0 3%;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #home main section.about .aboutHead_lead {
    margin-bottom: 6.6%;
  }
  .aboutTextNote {
    bottom: 135vw;
  }
  #home main p.aboutTextNote {
    font-size: 3.125vw;
    white-space: nowrap;
  }
  .aboutTextNote2 {
    bottom: 135vw;
  }
  #home main p.aboutTextNote2 {
    font-size: 3.125vw;
    white-space: nowrap;
  }
}
#home main section.about .aboutBody {
  text-align: center;
}
.aboutTextNote {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.aboutTextNote2 {
  position: absolute;
  left: 50%;
  padding-top: 20px;
  transform: translateX(-50%);
}
#home main p.aboutTextNote {
  line-height: 1.2;
  text-align: left;
}
@media screen and (min-width: 768px) {
  #home main section.about .aboutBody {
    background-image: url(../images/bg_about_top.png), url(http://www.yomogi-bijin.jp/products/yomogi_onzapat/images/product.png), url(../images/bg_about.png);
    background-repeat: no-repeat, no-repeat, repeat;
    background-position: center top, center 370px, center;
    padding-top: 100px;
    padding-bottom: 60px;
    position: relative;
  }
  #home main section.about .aboutBody p {
    width: 100%;
    margin: 0 auto;
    font-size: 2.2vw;
    line-height: 4vw;
    color: #723527;
  }
  #home main section.about .aboutBody p span {
    background: linear-gradient(transparent 20%, #fcd24d 20%);
  }
  .aboutTextNote {
    bottom: 257px;
  }
  #home main p.aboutTextNote {
    font-size: 11px;
  }
}
@media screen and (min-width: 768px) {
  #home main section.about .aboutBody h3 {
    margin-bottom: 450px;
  }
  #home main section.about .aboutBody .productAword {
    margin-top: -82px;
  }
  #home main section.about .aboutBody .aboutText02 {
    margin-top: 32px;
  }
  #home main section.about .aboutBody .aboutText03 {
    margin-top: 32px;
  }
}
@media (max-width: 767px) {
  #home main section.about .aboutBody {
    background-image: url(../images/bg_about_top.png), url(../images/product_sp.png), url(../images/bg_about.png);
    background-repeat: no-repeat, no-repeat, repeat;
    background-position: center top, center 64%, center;
    padding-top: 8%;
    padding-bottom: 60px;
    position: relative;
  }
  #home main section.about .aboutBody p {
    width: 100%;
    margin: 0 auto;
    font-size: 3.8vw;
    line-height: 9vw;
    color: #723527;
  }
  #home main section.about .aboutBody p span {
    background: linear-gradient(transparent 20%, #fcd24d 20%);
  }
  #home main section.about .aboutBody h3 {
    text-align: center;
  }
  #home main section.about .aboutBody h3 img {
    width: 95%;
  }
  #home main section.about .aboutBody p.comment {
    margin-top: 5%;
  }
  #home main section.about .aboutBody .aboutText02 {
    margin-top: 0;
  }
  #home main section.about .aboutBody .aboutText02 img {
    width: 95%;
  }
}
#home main section.nayami {
  background-color: #def6fa;
  padding: 65px 0 30px;
  text-align: center;
}
#home main section.nayami ol {
  padding: 0;
  display: -ms-flexox;
  display: flex;
  flex-basis: 100%;
  align-items: center;
}
#home main section.nayami ol li {
  flex-direction: row;
}
@media (min-width: 768px) {
  #home main section.nayami ol {
    padding: 0;
    display: table;
  }
  #home main section.nayami ol li {
    display: table-cell;
  }
}
@media (max-width: 767px) {
  #home main section.nayami ol {
    -ms-flexbox-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
  }
  #home main section.nayami ol li {
    width: 46vw;
  }
}
#home main section.userReview {
  background-image: url(../images/bg_review.png);
  padding: 42px 0;
  text-align: center;
}
#home main section.userReview .panel .reviewImage {
  margin-top: -53px;
}
#home main section.userReview h3 {
  margin-bottom: 1em;
}
#home main section.userReview ul {
  padding: 0;
  margin-bottom: 2em;
}
#home main section.userReview ul li:nth-of-type(1), ul.row.float li:nth-of-type(1) {
  margin: 0 auto;
  width: 470px;
}
#home main section.userReview ul li:nth-of-type(2), ul.row.float li:nth-of-type(2) {
  display: block;
  width: 470px;
  float: right;
}
@media (max-width: 975px) {
  #home main section.userReview ul li:nth-of-type(2), ul.row.float li:nth-of-type(2) {
    margin: 40px auto 0;
  }
}
#home main section.userReview ul li a, ul.row.float li a {
  display: block;
  width: 470px;
  height: 98px;
  border-radius: 10px;
  box-shadow: 0 10px 0 #dcdddd;
  padding: 20px;
  text-align: left;
}
#home main section.userReview ul li a:hover {
  margin-top: 4px;
  box-shadow: 0 6px 0 #dcdddd;
  margin-bottom: -4px;
}
#home main section.userReview ul li a.insta {
  background-color: #fde1de;
}
#home main section.userReview ul li a.rakuten {
  border: 2px solid #b90000;
}
@media (max-width: 767px) {
  #home main section.userReview {
    padding: 5vw;
  }
  #home main section.userReview .panel {
    border-radius: 10px;
  }
  #home main section.userReview ul li, ul.row.float li {
    width: 50%;
  }
  #home main section.userReview ul li a, ul.row.float li a {
    width: 100%;
    display: block;
  }
}
#home main section.media {
  background-image: url(../images/bg_about.png);
  padding: 40px 0;
  text-align: center;
}
#home main section.media .box {
  border: 3px ridge #d50000;
  padding: 1px;
  margin-top: 40px;
}
#home main section.media .box .innerBox {
  border: 1px solid #d50000;
}
#home main section.media .box .innerBox h2 {
  margin-top: -15px;
}
#home main section.media .box .innerBox ul {
  text-align: left;
  list-style: none;
  padding: 30px;
}
#home main section.media .box .innerBox ul li {
  border-top: 2px solid #f6c8c8;
  padding: 16px 0;
}
#home main section.media .box .innerBox ul li a {
  text-decoration: none;
}
#home main section.media .box .innerBox ul li a .media__title {
  background: url(../images/media_list_icon.png) no-repeat;
  background-size: auto 100%;
  margin: 0;
  color: #ff7043;
  font-weight: bold;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  #home main section.media .box .innerBox ul li a .media__title {
    padding: 0 0 0 48px;
    font-size: 21px;
  }
  #home main section.media .box .innerBox ul li a .media__title:hover {
    color: #962222;
    background: url(../images/media_list_icon_on.png) no-repeat;
    background-size: auto 100%;
  }
}
@media screen and (max-width: 767px) {
  #home main section.media .box .innerBox ul li a .media__title {
    padding: 0 0 0 10%;
    font-size: 131.25%;
  }
}
#home main section.media .box .innerBox ul li a .media__title:active {
  color: #962222;
  background: url(../images/media_list_icon_on.png) no-repeat;
  background-size: auto 100%;
}
#home main section.media .box .innerBox ul li p {
  color: #962222;
  margin: 0;
}
@media screen and (min-width: 768px) {
  #home main section.media .box .innerBox ul li p {
    padding: 0 0 0 48px;
    font-size: 18px;
  }
}
@media screen and (max-width: 767px) {
  #home main section.media .box .innerBox ul li p {
    padding: 0 0 0 10%;
    font-size: 112.5%;
  }
}
#home main section.media .box .innerBox ul li:last-child {
  border-bottom: 2px solid #f6c8c8;
}
@media (max-width: 767px) {
  #home main section.media {
    padding: 5vw;
  }
  #home main section.media .panel {
    border-radius: 5px;
  }
}
#home main section#temperature {
  position: relative;
  background: white;
  text-align: center;
  padding: 20px 0;
}
.i365 {
  position: relative;
  text-align: center;
  left: 50%;
  transform: translateX(-50%);
}
.i365 a {
  display: inline-block;
  width: 470px;
  height: 126px;
  border-radius: 5px;
  box-shadow: 0 10px 0 #dcdddd;
  padding: 0 20px;
  border: 2px solid #ff7043;
  background-color: white;
}
.i365 a:hover {
  margin-top: 4px;
  box-shadow: 0 6px 0 #dcdddd;
  margin-bottom: -4px;
}
#home main section#temperature h2 {
  margin: 0;
}
#home main section#temperature .notice {
  text-align: left;
  width: 587px;
  margin: 1em auto 1.8em;
}
@media screen and (max-width: 767px) {
  #home main p.notice {
    text-align: center;
  }
}
#home main section#temperature ul {
  padding: 0;
  margin-bottom: 2em;
}
#home main section#temperature ul li a {
  display: block;
  width: 470px;
  height: 134px;
  border-radius: 5px;
  box-shadow: 0 10px 0 #dcdddd;
  padding: 0 20px;
  text-align: left;
  border: 2px solid #ff7043;
  background-color: white;
}
#home main section#temperature ul li .snsbtn {
  display: block;
  width: 470px;
  height: 134px;
  border-radius: 5px;
  box-shadow: 0 10px 0 #dcdddd;
  padding: 0 20px;
  text-align: left;
  border: 2px solid #e95374;
  background-color: white;
}
#home main section#temperature ul li a:hover {
  margin-top: 4px;
  box-shadow: 0 6px 0 #dcdddd;
  margin-bottom: -4px;
}
#home main section#temperature ul li a.temperatureSeet {
  background-color: #ff7043;
}
@media (max-width: 1000px) {}
@media (max-width: 767px) {
  #home main section#temperature {
    padding-bottom: 4vw;
  }
  #home main section#temperature p.notice, #home main section#temperature p.note {
    width: 100%;
  }
  #home main section#temperature ul {
    margin-bottom: 0;
  }
  #home main section#temperature ul li {
    margin-bottom: 4vw;
    text-align: center;
  }
  #home main section#temperature ul li a {
    width: 100%;
    height: auto;
    text-align: center;
    box-shadow: 0 1vw 0 #dcdddd;
  }
  #home main section#temperature ul li a img {
    width: 95%;
  }
  #home main section#temperature ul li .snsbtn {
    width: 100%;
    height: auto;
    text-align: center;
    box-shadow: 0 1vw 0 #dcdddd;
  }
  #home main section#temperature ul li .snsbtn img {
    width: 95%;
  }
}
#home main section#thermostat {
  text-align: center;
  background-color: #fde1de;
  padding-bottom: 40px;
}
#home main section#thermostat h2 {
  margin: 0;
}
@media (max-width: 767px) {
  #home main section#thermostat p {
    width: 100%;
  }
}
#home main section#about2 {
  background-image: url(../images/bg_about2_top.png), url(../images/bg_about.png);
  background-repeat: no-repeat, repeat;
  background-position: center top, center;
  padding-top: 100px;
  padding-bottom: 67px;
  text-align: center;
  color: white;
  position: relative;
}
#home main section#about2 p, #home main section#about2 h3, #home main section#about2 dl {
  width: 586px;
  margin: 0 auto;
}
#home main section#about2 p {
  color: white;
  text-align: left;
  margin: 0 auto;
  padding: 0;
}
@media screen and (min-width: 768px) {
  #home main section#about2 h2 {
    padding-bottom: 35px;
  }
  #home main section#about2 h2 + p {
    padding-bottom: 20px;
  }
  #home main section#about2 p.productImgWrap01Txt {
    bottom: 42px;
    font-size: 3.125vw;
    white-space: nowrap;
  }
}
#home main section#about2 h3 {
  border-bottom: 2px solid white;
  font-size: 19.6px;
  text-align: left;
  margin-top: 1em;
  padding-bottom: 8px;
  margin-bottom: 8px;
}
#home main section#about2 dl {
  padding: 0;
  text-align: left;
  margin-bottom: 62px;
}
#home main section#about2 dl dt, #home main section#about2 dl dd {
  display: inline-block;
  font-size: 90%;
}
#home main section#about2 dl dt:after {
  content: " : ";
}
.productImgWrap01 {
  position: relative;
}
#home main section#about2 p.productImgWrap01Txt {
  color: #212529;
  position: absolute;
  font-size: 13px;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  line-height: 1.2;
}
#home main section#about2 .btnAbout2 {
  display: block;
  margin-top: 0;
  border-radius: 10px;
  border: 2px solid #6c8b28;
  background-color: white;
  padding: 27px 23px;
  box-shadow: 0 10px 0 rgba(0, 0, 0, 0.1);
}
#home main section#about2 .btnAbout2:hover {
  box-shadow: 0 6px 0 rgba(0, 0, 0, 0.1);
  transform: translateY(4px);
  -webkit-transform: translateY(4px);
}
#home main section#about2 .prod_caption {
  color: #000;
  display: block;
  margin-top: 8px;
}
@media screen and (min-width: 768px) {
  #home main section#about2 .prod_caption {
    font-size: 13px;
  }
  #home main section#about2 p.productImgWrap01Txt {
    bottom: 42px;
  }
}
@media screen and (max-width: 767px) {
  #home main section#about2 .prod_caption {
    font-size: 81.25%;
  }
  #home main section#about2 p.productImgWrap01Txt {
    padding: 0;
    font-size: 3.125vw;
    bottom: 21vw;
    white-space: nowrap;
  }
}
@media (max-width: 767px) {
  #home main section#about2 p, #home main section#about2 h3, #home main section#about2 dl {
    width: 100%;
  }
}
#home main section#shoplist {
  background-color: white;
}
@media screen and (min-width: 768px) {
  #home main section#shoplist {
    padding: 60px 0;
  }
}
@media screen and (max-width: 767px) {
  #home main section#shoplist {
    padding: 7.29% 0 16.25vw;
  }
}
#home main section#shoplist h2 {
  background-color: #818181;
  background-image: url(../images/bg_graydot.png);
  border-radius: 5px;
  padding-top: 8px;
  padding-left: 17px;
  padding-bottom: 11px;
  line-height: 0;
  margin-bottom: 15px;
}
#home main section#shoplist h2.onlineshop {
  background-image: url(../images/bg_shoplist_h2_orange.png);
}
#home main section#shoplist .listArea {
  border: 2px solid #333;
  border-radius: 5px;
  box-shadow: 0 10px 0 rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  #home main section#shoplist .listArea {
    height: 92px;
    margin-bottom: 60px;
  }
}
@media screen and (max-width: 767px) {
  #home main section#shoplist .listArea {
    height: 16.6vw;
    margin-bottom: 6.24%;
  }
}
#home main section#shoplist .listArea.open {
  height: auto;
}
#home main section#shoplist .listArea button {
  background-color: #e5e5e5;
  margin: 0;
  width: 100%;
  cursor: pointer;
  opacity: 1;
  display: block;
  margin-bottom: 1em;
  border: none;
  outline: none;
}
#home main section#shoplist .listArea2 {
  border: 2px solid #333;
  border-radius: 5px;
  box-shadow: 0 10px 0 rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  #home main section#shoplist .listArea2 {
    height: 92px;
    margin-bottom: 60px;
  }
}
@media screen and (max-width: 767px) {
  #home main section#shoplist .listArea2 {
    height: 16.6vw;
    margin-bottom: 6.24%;
  }
}
#home main section#shoplist .listArea2.open {
  height: auto;
}
#home main section#shoplist .listArea2 button {
  background-color: #e5e5e5;
  margin: 0;
  width: 100%;
  cursor: pointer;
  opacity: 1;
  display: block;
  margin-bottom: 1em;
  border: none;
  outline: none;
}
@media screen and (max-width: 992px) {
  #home main section#shoplist .listArea button img {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  #home main section#shoplist .listArea button {
    width: 100%;
    height: 92px;
    background-image: url(../images/btn_shoplist_on.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: auto 42px;
  }
}
@media screen and (max-width: 767px) {
  #home main section#shoplist .listArea button {
    height: 16.6vw;
    background-image: url(../images/btn_shoplist_sp_on.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: 93%;
  }
}
#home main section#shoplist .listArea.open button img {
  opacity: 0;
}
#home main section#shoplist .listArea button:hover {
  opacity: 0.5;
}
#home main section#shoplist .listArea .list {
  padding: 14px 28px;
}
#home main section#shoplist .listArea .list .description {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #home main section#shoplist .listArea .list .description {
    padding-top: 14px;
    margin-bottom: 28px;
  }
}
@media screen and (max-width: 767px) {
  #home main section#shoplist .listArea .list .description {
    margin-bottom: 8%;
  }
}
#home main section#shoplist .listArea .list .listBody {
  display: -ms-flexbox;
  display: flex;
  flex-basis: 100%;
  align-items: top;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
#home main section#shoplist .listArea .list .listBody ul {
  flex-direction: row;
  list-style-image: url("../images/circle_gray.svg");
}
@media screen and (min-width: 768px) {
  #home main section#shoplist .listArea .list .listBody ul {
    padding-left: 28px;
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  #home main section#shoplist .listArea .list .listBody ul {
    padding-left: 8%;
    line-height: 1.3;
    font-size: 2.6vw;
  }
}
#home main section#shoplist .listArea .list .listBody ul li {
  letter-spacing: -1px;
  line-height: 2em;
}
#home main section#shoplist .onlineList {
  padding: 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;

}
#home main section#shoplist .onlineList li {
  display: block;
  margin-bottom: 30px;
}
#home main section#shoplist .onlineList li a {
  display: block;
  padding-top: 22px;
  padding-left: 20px;
  border-radius: 5px;
  box-shadow: 0 10px 0 rgba(0, 0, 0, 0.1);
  height: 90px;
}
#home main section#shoplist .onlineList li.rakuten a {
  padding-top: 19px;
}
#home main section#shoplist .onlineList li a:hover {
  margin-top: 4px;
  box-shadow: 0 6px 0 rgba(0, 0, 0, 0.1);
  margin-bottom: -4px;
}
#home main section#shoplist .onlineList li.grafico a {
  border: 2px solid #ff7043;
  text-align: center;
}
#home main section#shoplist .onlineList li.rakuten a {
  border: 2px solid #b90000;
  text-align: center;
}

#home main section#shoplist .onlineList li.amazon a {
  border: 2px solid #333333;
  text-align: center;
}

#home main section#shoplist .onlineList li.twitter a, #home main section#shoplist .onlineList li.insta a {
  border: none;
  padding: 0;
  box-shadow: none;
}
@media (min-width: 768px) {
  .sp {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .pc {
    display: none !important;
  }
}
.center {
  text-align: center;
}
/*# sourceMappingURL=main.css.map */
/*ここから山口追記*/
/*media紹介*/
#home main section.media time {
  font-size: 103.125%;
  font-weight: bold;
  padding-bottom: 4%;
  display: inline-block;
}
#home > main > section.media li {
  color: #962222;
}
#home main section.media time + div {
  padding-left: 10%;
  background: url(../images/media_list_icon.png) no-repeat;
  background-size: 7%;
  background-position: 0 0;
}
#home main section.media time + div h3 {
  font-size: 112.5%;
}
#home main section.media time + div h3 a {
  color: #962222;
  font-weight: bold;
}
#home main section.media time + div p {
  font-size: 106.25%;
}
@media (max-width: 767px) {
  #home main section.media .box, #home main section.media .box .innerBox {
    border: none;
  }
  #home main section.media .box .innerBox ul {
    padding: 0;
  }
}
@media (min-width: 768px) {
  #home main section.media time {
    width: 25%;
    font-size: 125%;
    float: left;
  }
  #home main section.media time + div {
    padding-left: 25%;
    background-size: 3.3%;
    background-position: 21% 0;
  }
  #home main section.media time + div h3 {
    font-size: 131.25%;
  }
}
@media (min-width: 1199px) {
  #home main section.media time {
    width: 19%;
  }
  #home main section.media time + div {
    padding-left: 19%;
    background-position: 15% 0;
  }
}
/*
"#home main section.userReview ul li a.rakuten
罫線がpsdと比べて細くなっているようです。
ページ全体で見受けられますのでborder設定ご確認ください"*/
#home main section.userReview ul li a.rakuten {
  border-width: 3px;
}
@media (min-width: 768px) {
  #home main section.userReview ul li a.rakuten {
    border-radius: 10px;
  }
}
/*"#thermostat
パララクス効果のモクモクが表示されていません。"*/
#thermostat {
  position: relative;
}
#thermostat .container h2 img {
  position: relative;
  z-index: 2;
}
#home main #cloud9 {
  /*position: ;*/
  top: 25%;
  right: 8%;
}
#home main #cloud10 {
  /*position: ;*/
  top: 36%;
  left: 4%;
}
#home main #cloud11 {
  /*position: ;*/
  top: 58%;
  right: 0%;
}
#home main #cloud12 {
  /*position: ;*/
  top: 78%;
  left: 0%;
}
/*"#temperature
パララクス効果のモクモクが表示されていません。"*/
#temperature {
  position: relative;
}
#temperature .container h2 img {
  position: relative;
  z-index: 2;
}
#home main #cloud13 {
  /*position: ;*/
  z-index: 3;
  top: 10%;
  right: 8%;
}
#home main #cloud14 {
  /*position: ;*/
  z-index: 1;
  top: 24%;
  left: 4%;
}
#home main #cloud15 {
  /*position: ;*/
  z-index: 1;
  top: 48%;
  right: 0%;
}
#home main #cloud16 {
  /*position: ;*/
  z-index: 1;
  top: 78%;
  left: 0%;
}
@media (max-width: 767px) {
  .container {
    padding-right: 3.624%;
    padding-left: 3.624%;
  }
  .container h2 img {
    width: 100%;
  }
}
/*".container.aboutHead"*/
@media (min-width: 768px) {
  #home main section.about .aboutHead {
    max-width: 1140px;
    margin-top: -80px;
  }
}
/*/images/about_h2.png PC版とレイアウトが違うので画像切り分けてください。*/
@media (max-width: 767px) {
  #home main section.about .aboutHead h2 {
    margin-bottom: 83vw;
  }
}
/*PCとSPで吹き出しの大きさが違うのでサイズを調整*/
@media (max-width: 767px) {
  #home main section.about .aboutBody {
    background-size: 100% auto, 100%, 14px;
  }
}
@media (max-width: 767px) {
  #home main section.nayami ol li {
    width: 43vw;
  }
  #home main section.nayami ol li:last-child {
    width: 86vw;
  }
  #home main section.nayami ol li img {
    width: 100%;
  }
}
/*みんなの声*/
#home main section.userReview .panel .reviewImage {
  margin: 0;
}
/*about1エリア*/
@media (max-width: 767px) {
  #home main section.about .aboutBody .productAword {
    margin: 0;
  }
}
/*about2エリア*/
@media (max-width: 767px) {
  #home main section#about2 {
    background-size: 95% auto, 10%;
  }
}
/*全体的に調整*/
header h1 img {
  height: 43px;
}
/*PCを調整*/
/*SPを調整*/
@media (max-width: 767px) {
  #home main section.about .aboutHead p {
    width: 100%;
    max-width: 100%;
  }
  #home main section.about .aboutBody h3 {
    padding: 0 0 70%;
  }
  #home main section.nayami {
    padding: 10% 0 6%;
  }
  #home main .panel {
    padding: 4% 0;
  }
  #home main p.notice {
    font-size: 75%;
    text-align: center;
  }
  #home main section.userReview ul li a {
    padding: 8%;
    height: auto;
  }
  #home main p {
    font-size: 92%;
margin: 0;
  }
  #home main section#about2 {
    padding: 12% 0 4%;
  }
  #home main section#about2 dl {
    margin-bottom: 3%;
  }
  #home main section#about2 p {
    padding: 5% 0;
  }
  #temperature .row {
    margin-right: -3.624%;
    margin-left: -3.624%;
  }
  #shoplist .container {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
  footer #footer nav a {
    color: #888888;
    font-size: 14px;
  }
  #home main section.userReview ul {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  #home main section.userReview ul li:nth-of-type(1) {
    width: 47.37%;
    padding: 0;
  }
  #home main section.userReview ul li:nth-of-type(1) a {
    box-sizing: border-box;
  }
  #home main section.userReview ul li:nth-of-type(2) {
    width: 47.37%;
    padding: 0;
    margin-left: 5.26%;
  }
  #home main section.userReview ul li:nth-of-type(2) a {
    box-sizing: border-box;
  }
  #home main section#shoplist .listArea .list .listBody {
    display: block;
  }
  #home main section#shoplist .listArea .list .listBody ul:nth-child(odd) {
    width: 50%;
    float: left;
  }
  #home main section#shoplist .listArea .list .listBody ul:nth-child(even) {
    width: 50%;
    float: right;
  }
  #home main section#shoplist h2 {
    width: 62.5%;
    padding-left: 5%;
    padding-right: 20%;
    margin-bottom: 3.12%;
    box-sizing: content-box;
    margin-left: auto;
    margin-right: auto;
  }
  #home main section#shoplist h2:nth-of-type(2) {
    width: 36.45%;
    padding-left: 5%;
    padding-right: 46.05%;
    margin-bottom: 3.12%;
    box-sizing: content-box;
    margin-left: auto;
    margin-right: auto;
  }
  #home main section#shoplist .listArea {
    width: 87.5%;
    margin-left: auto;
    margin-right: auto;
  }
  #home main section#shoplist .onlineList {
    width: 100%;
    margin: 0;
  }
  #home main section#shoplist .onlineList li {
    margin-bottom: 0;
  }
  #home main section#shoplist .onlineList li a {
    border: none !important;
    box-shadow: none;
    height: auto;
    padding: 0;
  }
  #home main section#shoplist .onlineList li.grafico, #home main section#shoplist .onlineList li.rakuten,  #home main section#shoplist .onlineList li.amazon {
    width: 87.5%;
    float: none;
    padding: 0;
    margin: 0 auto 2.29vw !important;
  }
  
#home main section#shoplist .onlineList li.rakuten a {
    padding-top: 0;
}
  
  
  #home main section#shoplist .onlineList li.insta, #home main section#shoplist .onlineList li.twitter {
    width: 87.5%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    clear: both;
  }
  #home main section#shoplist .onlineList li.insta {
    margin-top: 16.25vw;
    margin-bottom: 7.6vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  #home main section#shoplist .onlineList li.insta {
    margin-top: 4.25vw;
    margin-bottom: 2.6vw;
  }
}
.pageTopFix {
  display: none;
  position: fixed;
  right: 2%;
  bottom: 2%;
  z-index: 1000;
}
.pageTopFix.fixed {
  display: block;
}
@media screen and (min-width: 768px) {
  .pageTopFix {
    width: 79px;
  }
  .pageTopFix:hover {
    opacity: .7;
  }
}
@media screen and (max-width: 767px) {
  .pageTopFix {
    width: 12vw;
  }
  .pageTopFix img {
    width: 100%;
  }
}


@media screen and (min-width: 1200px) {
  #home main section.about .aboutBody p {
    width: 100%;
    margin: 0 auto;
    font-size: 24px;
    line-height: 46px;
    color: #723527;
  }
}


/*# sourceMappingURL=main.css.map */