@charset "utf-8";
/* 共通 */
#contents{
  margin-bottom: 70px;
}
.contentInner{
  max-width: 960px;
  margin: 0 auto;
}
p{
  margin: 0;
  padding: 0;
}

/* 共通：レスポンシブ */
@media screen and (max-width:960px) {
  .contentInner{
    width: auto;
    padding: 0 20px;
  }
}
@media screen and (max-width:768px) {
  #contentMain{
    padding-bottom:8.625%;
  }
}
/* 共通：レスポンシブ */
/* 共通 */

/* mv箇所ここから */
.mv{
  background:url(../images/img_top_pc.png), url(../images/bg_top_pc.jpg);
  background-color: #f8d900;
  background-position: 50% 0%, 50% 0%;
  background-repeat: no-repeat, repeat-y;
}
.mv .mv__container{
  position: relative;
  max-width: 960px;
  margin: 0 auto;
  padding: 0;
}
.mv .mv__content{
  margin: 0 auto;
}
.mv .mv__limit{
  position: absolute;
  top: 0;
  left:36.66667%;
  width:13.4375%;
  padding:1.9% 0 0;
}
.mv .mv__logo{
  position: absolute;
  top: 0;
  left:6.25%;
  width:33.75%;
  padding:14.58% 0 0;
}
.mv .mv__text{
  position: absolute;
  display: block;
  width: 16.6667%;
  top:0;
  right:0;
  padding:5.72% 0 0;
}
.mv .mv__item{
  display: block;
  width: 38.645833334%;
  margin-left:55.3125%;
  padding:3.8% 0 0;
}
.mv .mv__caution{
  position: absolute;
  width: 39.375%;
  bottom: 4.605263%;
  left: 6.5%;
}

/* mvレスポンシブ */
@media screen and (max-width:1440px) {
  .mv{
    background-size: auto;
  }
}

@media screen and (max-width:1000px) {
  .mv{
    -webkit-background-size: auto 100%;
    background-size: auto 100%;
  }
  .mv .mv__container{
    margin: 0 20px;
  }
}
@media screen and (max-width:768px) {
  .contentInner{
    padding: 0;
  }
  .mv{
    position: relative;
    background:url(../images/img_top_sp.jpg) no-repeat;
    background-size: auto 90%;
    background-position: left bottom;
    background-position-y: -5vw;
    background-position-x: -5vw;
  }
  .mv img{
    width: 100%;
  }
  .mv .mv__limit{
    position: absolute;
    top: 0;
    left: auto;
    right:1.666667%;
    padding:2.1% 0 0 0;
    width:19.5%;
  }
  .mv .mv__logo{
    width: 55.66666666666667%;
    left: 20.83333333333333%;
    padding: 8.6% 0 0;
  }
  .mv .mv__text{
    width:24%;
    right:6.3%;
    left: auto;
    padding:49.83% 0 0;
  }
  .mv .mv__item{
    display: block;
    width: 64%;
    margin-left: 16%;
    padding: 52% 0 0;
  }
  .mv .mv__caution{
    width: 4.21875vw;
    left: auto;
    right: -2%;
    bottom: 4.96875vw;
  }
}
/* mvレスポンシブ */
/* mv箇所ここまで */

/* mv下リード文ここから */
.lead{
  background:url(../images/bg1_pc.jpg) repeat-y center top #f5c500;
}
.lead .lead__container{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px 0;
}
.lead__text{
  max-width: 53.2291667%;
}

/* リード文レスポンシブ */
@media screen and (max-width:768px) {
  .lead{
    background:url(../images/bg1_sp.jpg) repeat-y center top;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }
  .lead .lead__container{
    padding: 6% 0;
  }
  .lead .lead__text{
    width: 90.46%;
    max-width: 100%;
    margin: 0 auto;
  }
}
/* リード文レスポンシブ */
/* mv下リード文ここまで */

/* 超芳醇に使用するのはセクションここから */
.used{
  background:url(../images/bg2_2_pc.png),url(../images/bg2_pc.jpg);
  background-color: #fff299;
  background-position: 50% 0%, 50% 0%;
  background-repeat: no-repeat, repeat-y;
}
.used{
  padding: 30px 0;
  text-align: center;
}
.used img{
  margin: 0 auto;
}
.used .used__content{
  padding-top: 45px;
  padding-bottom: 36px;
}
.used .used__content h3{
  margin: 0 0 40px;
}
.used .used__content h3 img{
  width: 60.625%;
}
.used .used__content p img{
  width: 50.20833333333333%;
}

/* 超芳醇に使用するのはセクションレスポンシブ */
@media screen and (max-width:768px) {
  .used{
    padding: 0 0 14.0625vw;
    background:url(../images/bg2_sp.jpg) repeat-y center top;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }
  .used .contentInner{
    padding:14% 0 0;
    background:url(../images/bg2_2_sp.png) no-repeat center top;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }
  .used .used__content{
    padding-top: 0;
    padding-bottom: 0;
  }
  .used .used__content h3{
    padding-bottom: 7.03125vw;
    margin: 0 auto;
  }
  .used .used__content h3 img{
    width: 68.75vw;
    margin: 0 auto;
  }
  .used .used__content p img{
    width: 94.0625vw;
    margin: 0 auto;
  }
}
/* 超芳醇に使用するのはセクションレスポンシブ */
/* 超芳醇に使用するのはセクションここまで */


/* 一番搾りだからできました。セクションここから */
.able{
  background:url(../images/bg3_pc.jpg) repeat-y center top #f7df09;
}
.able .able__container{
  width: 100%;
  padding-top: 60px;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.able .able__container h3{
  width: 44.79166666666667%;
}

.able .able__inner{
  display: flex;
  width: 100%;
}

.able .able__content{
  display: table-cell;
  padding: 60px 0 0 0;
  text-align: left;
  white-space: normal;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: middle;
}
.able .able__left{
  display: inline-block;
  padding: 60px 6.25% 60px 8.333334%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.able .able__leftimg{
  width: 49.8958333%;
}
.able .able__right{
  display: flex;
  flex-direction: column;
  margin-right: 8.3333334%;
}
.able .able__right .able__photo{
  max-width: 260px;
  width: 100%;
  margin-top: 10px;
  margin-left: 0;
}

.able .able__right .able__name{
  max-width: 229px;
  width: 88.076923%;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
}

/* 一番搾りだからできました。レスポンシブ */
@media screen and (max-width:768px) {

  .able{
    padding: 9.375vw 0;
    background:url(../images/bg3_sp.jpg) repeat-y center top;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }
  .able .contentInner{
    padding: 0;
  }
  .able .able__container{
    flex-direction: column;
    padding-top: 0;
  }
  .able .able__container h3{
    max-width: none;
    width: 74.53125vw;
    margin-bottom: 5.46875vw;
  }
  .able .able__container h3 img{
    width: 100%;
  }
  .able .able__inner{
    flex-direction: column;
    width: 100%;
  }
  .able .able__content{
    margin:0 auto 7.5%;
  }
  .able .able__content h3 img{
    width:68.90625%;
    margin: 0 auto;
  }
  .able .able__left{
    width: 100%;
    padding: 0;
    margin-bottom: 0;
  }
  .able .able__left p img{
    width: 88.90625vw;
    padding: 0 0 5.625vw;
    margin: 0 auto;
  }
  .able .able__right{
    padding: 0;
    width: 100%;
    margin-bottom: 0;
    flex-direction: column;
  }

  .able .able__photo{
    max-width: none !important;
    width: 42.1875% !important;
    margin: 0 auto !important;
  }

  .able .able__photo img{
    width: 100%;
  }

  .able .able__name{
    margin-top: 4.6875vw !important;
    max-width: none !important;
    width: 76.25% !important;
  }

  .able .able__right .able__name img{
    width: 100%;
  }
}
/* 一番搾りだからできました。レスポンシブ */
/* 一番搾りだからできました。セクションここまで */

/* 一番搾り®︎製法とはセクションここから */
.method{
  background:url(../images/bg4_pc.jpg) repeat-y center top #dcbb65;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
}
.method .method__container{
  display: table;
  width: 100%;
  text-align: left;
  overflow: hidden;
}
.method .method__container .method__content{
  display: table-cell;
  padding: 36px 0;
  text-align: left;
  white-space: normal;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: middle;
}
.method .method__container .method__left h3{
  margin: 0 0 40px;
}

/* 一番搾り®︎製法とはレスポンシブ */
@media screen and (max-width:768px) {

  .method{
    padding: 9.375vw 0;
    background:url(../images/bg4_sp.jpg) no-repeat center top;
    -webkit-background-size: cover;
    background-size: cover;
  }
  .method .method__container{
    display: table;
    width: 100%;
    text-align: left;
    overflow: hidden;
  }
  .method .method__container .method__content{
    display: block;
  }
  .method .method__container .method__left {
    padding-top: 0;
    padding-bottom: 7.8125vw;
    text-align: left;
  }
  .method .method__container .method__left h3{
    display: flex;
    justify-content: center;
    margin-bottom: 0;
    padding: 0 0 5.625vw;
  }
  .method .method__container .method__left h3 img{
    width: 53.125vw;
  }
  .method .method__container .method__left p{
    display: flex;
    justify-content: center;
  }
  .method .method__container .method__left p img{
    width: 75.625vw;
    display: block;
    margin: 0 auto;
  }
  .method .method__container .method__right{
    display: block;
    padding: 0;
  }
  .method .method__container .method__right p{
    display: flex;
    justify-content: center;
  }
  .method .method__container .method__right img{
    width:81.25%;
  }
}

@media screen and (min-width:769px) {
  .method .method__container .method__left{
    padding-top: 70px;
    padding-bottom: 70px;
  }
  .method .method__container .method__left h3 img{
    width: 70.41%;
  }
  .method .method__container .method__right{
    padding-top: 70px;
    padding-left: 1.1%;
    padding-bottom: 70px;
  }
}
/* 一番搾り®︎製法とはレスポンシブ */
/* 一番搾り®︎製法とはセクションここまで */


/* 商品概要ここから */
.product{
  background:url(../images/bg2_pc.jpg) repeat-y center top #fff299;
}
.product .product__container{
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
}
.product .product__content{
  display: table-cell;
  padding: 36px 0;
  text-align: left;
  white-space: normal;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: middle;
}

@media screen and (max-width:768px) {
  .product{
    padding: 9.375vw 0;
    background:url(../images/bg2_sp.jpg) repeat-y center top;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
  }
  .product .product__container .product__left{
    display: inline-block;
    width:58.4375%;
    padding: 0 4.38% 0 4%;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .product .product__container .product__left h4{
    padding: 0 0 6.875%;
  }
  .product .product__container .product__left h4 img{
    width:42.81%;
    margin-left: 0;
  }
  .product .product__container .product__left p{
    padding: 0;
  }
  .product .product__container .product__left p img{
    width:100%;
    margin-left: 0;
  }
  .product .product__container .product__right{
    display: inline-block;
    width: 40%;
    padding-right: 3.8%;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 0;
    padding-bottom: 0;
  }
  .product .product__container .product__right img{
    width:100%;
  }
}

@media screen and (min-width:769px) {
  .product .product__container{
    display: block;
    margin: 0 auto;
    text-align: center;
  }
  .product .product__container .product__left{
    display: inline-block;
    /* width: 39.47166667%; */
    width: 44.79166666666667%;
    padding-right:5.20833334%;
  }
  .product .product__container .product__left h4{
    width:31.78%;
    margin-bottom: 28px;
  }
  .product .product__container .product__right{
    display: inline-block;
    width: 25.9375%;
    padding: 36px 0;
  }
}

/* 商品概要ここまで */
/* END */