/*---------------------------------------
	organic_mist.scss
---------------------------------------*/
/*---------------------------------------
	organic_mist-style.scss
---------------------------------------*/
.mv {
  background: url(/html/user_data/data/organic_mist/img/mv_bg.jpg) no-repeat center center;
  background-size: cover;
  width: 100%;
  max-height: 830px;
  padding: 9% 0 12% 11%;
  position: relative;
}
.mv_title {
  width: 38.54166666666667vw;
}
.mv_cv {
  display: flex;
  align-items: center;
  margin-top: 2.5vw;
  color: #fff;
}
.mv_cv_price {
  font-size: 16px;
  font-size: 0.83333vw;
  line-height: 24px;
  line-height: 1.25vw;
  letter-spacing: 1.5px;
  letter-spacing: 0.07813vw;
}
.mv_cv_quantity {
  display: flex;
  align-items: center;
  margin-left: 2%;
}
.mv_cv_quantity_title {
  font-size: 18px;
  font-size: 0.9375vw;
  letter-spacing: 2px;
  letter-spacing: 0.10417vw;
  margin-right: 0.5vw;
  white-space: nowrap;
}
.mv_cv_quantity_btn input {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.5vw;
  height: 3.2vw;
  border: 0.12vw solid #fff;
  border-radius: 4px;
  padding: 0 20%;
  color: #fff;
  font-size: 20px;
  font-size: 1.04167vw;
  background: rgba(255, 255, 255, 0.05);
}
.mv_cv_btn {
  margin-left: 2%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22vw;
  height: 3.2vw;
  border: 0.12vw solid #fff;
  border-radius: 4px;
  font-size: 20px;
  font-size: 1.04167vw;
  letter-spacing: 2.5px;
  letter-spacing: 0.13021vw;
  background: rgba(255, 255, 255, 0.05);
  position: relative;
}
.mv_cv_btn::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 6%;
  bottom: 0;
  margin: auto;
  border: 0;
  border-top: 0.15vw solid #fff;
  border-right: 0.15vw solid #fff;
  transform: rotate(45deg);
  width: 0.8vw;
  height: 0.8vw;
}
.mv_product {
  position: absolute;
  top: 0;
  right: 6%;
  width: 49.27083333333333vw;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  background: url(/html/user_data/data/organic_mist/img/mv_product_bg.png) no-repeat 0 0;
  background-size: 100% 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mv_product_image {
  width: 50vw;
  position: relative;
  top: -0.5vw;
  left: 2vw;
}
.mv_product_feature {
  width: 15.67708333333333vw;
  position: relative;
  right: 13.5vw;
  bottom: 5.5vw;
}

.concept {
  background: url(/html/user_data/data/organic_mist/img/concept_bg.jpg) no-repeat center top;
  background-size: cover;
  max-height: 830px;
  padding: 12% 0;
}
.concept_title {
  width: 38.59375vw;
  margin: auto;
}
.concept_text {
  width: 34vw;
  margin: 5% auto 0;
}

.trouble {
  background: url(/html/user_data/data/organic_mist/img/trouble_bg.jpg) no-repeat right top;
  background-size: cover;
  max-height: 1328px;
  padding: 3.5% 0 5.5% 0;
}
.trouble_title {
  background: url(/html/user_data/data/organic_mist/img/trouble_title.png) no-repeat left top;
  background-size: 100%;
  width: 53.33333333333333vw;
  height: 5.7vw;
}
.trouble_case {
  width: 39.6875vw;
  margin: 2.5% 0 2.5% 7.5%;
}
.trouble_message {
  background: url(/html/user_data/data/organic_mist/img/trouble_message.png) no-repeat center top;
  background-size: 100%;
  width: 40.10416666666667vw;
  height: 4.6vw;
  margin-left: 7.5%;
}
.trouble_list {
  width: 85%;
  margin: 2.3% auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.trouble_list_item {
  width: 19vw;
}

.about {
  background: url(/html/template/default/img/common/common_bg.jpg) no-repeat center top;
  background-size: cover;
  max-height: 927px;
  position: relative;
  padding: 7% 0;
}
.about::before {
  content: "";
  position: absolute;
  top: -0.2vw;
  right: 0;
  left: 0;
  margin: auto;
  width: 5vw;
  border: 2.5vw solid transparent;
  border-top: 2.0vw solid #dce2e5;
}
.about_title {
  width: 47.13541666666667vw;
  margin: auto;
}
.about_list {
  background: url(/html/user_data/data/organic_mist/img/about_list.png) no-repeat center top;
  background-size: 100%;
  width: 58.75vw;
  height: 25.5vw;
  max-height: 485px;
  margin: 3.8% auto 0;
}

.cta {
  background: url(/html/user_data/data/organic_mist/img/cta_bg.jpg) no-repeat center top;
  background-size: cover;
  max-height: 560px;
  padding: 8% 0 8% 17%;
  position: relative;
  overflow: hidden;
}
.cta_title {
  width: 35vw;
}
.cta_cv {
  width: 35vw;
  display: flex;
  align-items: center;
  margin-top: 2.5vw;
  color: #fff;
}
.cta_cv_price {
  color: #fff;
  font-size: 16px;
  font-size: 0.83333vw;
  line-height: 24px;
  line-height: 1.25vw;
  letter-spacing: 1.5px;
  letter-spacing: 0.07813vw;
}
.cta_cv_quantity {
  display: flex;
  align-items: center;
  margin-right: 2%;
  margin-left: 6%;
}
.cta_cv_quantity_title {
  font-size: 18px;
  font-size: 0.9375vw;
  letter-spacing: 2px;
  letter-spacing: 0.10417vw;
  margin-right: 0.5vw;
  white-space: nowrap;
}
.cta_cv_quantity_btn input {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.5vw;
  height: 3.2vw;
  border: 0.12vw solid #fff;
  border-radius: 4px;
  padding: 0 20%;
  color: #fff;
  font-size: 20px;
  font-size: 1.04167vw;
  background: rgba(255, 255, 255, 0.05);
}
.cta_cv_btn {
  margin-left: 4%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20vw;
  height: 3.2vw;
  border: 0.12vw solid #fff;
  border-radius: 4px;
  font-size: 20px;
  font-size: 1.04167vw;
  letter-spacing: 2.5px;
  letter-spacing: 0.13021vw;
  background: rgba(255, 255, 255, 0.05);
  position: relative;
}
.cta_cv_btn::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 6%;
  bottom: 0;
  margin: auto;
  border: 0;
  border-top: 0.15vw solid #fff;
  border-right: 0.15vw solid #fff;
  transform: rotate(45deg);
  width: 0.8vw;
  height: 0.8vw;
}
.cta_product {
  background: url(/html/user_data/data/organic_mist/img/cta_product_bg.png) no-repeat center top;
  background-size: 100% 100%;
  width: 26.77083333333333vw;
  height: 100%;
  position: absolute;
  top: 0;
  right: 20%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cta_product_image {
  width: 8.8vw;
  position: relative;
  left: -1.5vw;
}

.safety {
  background: url(/html/user_data/data/organic_mist/img/safety_bg.gif) repeat 0 0;
  background-size: 8px 8px;
  padding: 5% 0;
}
.safety_title {
  background: url(/html/user_data/data/organic_mist/img/safety_title.png) no-repeat center top;
  background-size: 100%;
  width: 40.20833333333333vw;
  height: 3.3vw;
  max-height: 63px;
  margin: auto;
}
.safety_lead {
  width: 30vw;
  margin: 3% auto;
}
.safety_example {
  background: url(/html/user_data/data/organic_mist/img/safety_example.png) no-repeat center top;
  background-size: 100%;
  width: 53.33333333333333vw;
  height: 22.5vw;
  max-height: 432px;
  margin: auto;
}
.safety_warning {
  width: 46.45833333333333vw;
  margin: 2.5% auto;
}
.safety_message {
  background: url(/html/user_data/data/organic_mist/img/safety_message.png) no-repeat center top;
  background-size: 100%;
  width: 53.33333333333333vw;
  height: 10.5vw;
  max-height: 238px;
  margin: auto;
}

.component {
  background: url(/html/user_data/data/organic_mist/img/component_bg.jpg) no-repeat 0 0;
  background-size: cover;
  padding: 4.5% 0 8%;
}
.component_title {
  width: 10.625vw;
  margin: auto;
}
.component_list {
  background: url(/html/user_data/data/organic_mist/img/component_list.png) no-repeat center top;
  background-size: 100%;
  width: 80%;
  height: 40.55vw;
  max-height: 790px;
  margin: 3% auto 4%;
}
.component_pickup {
  background: url(/html/user_data/data/organic_mist/img/component_pickup.png) no-repeat center top;
  background-size: 100%;
  width: 80%;
  height: 12.38vw;
  max-height: 240px;
  margin: auto;
}

.voice {
  background: #f2f2f2;
  padding: 3% 0 5%;
}
.voice_title {
  width: 12.39583333333333vw;
  max-width: 238px;
  margin: auto;
}
.voice_list {
  background: url(/html/user_data/data/organic_mist/img/voice_list.png) no-repeat center top;
  background-size: 100%;
  width: 80%;
  height: 26.25vw;
  max-height: 509px;
  margin: 2.5% auto 0;
}

.faq {
  background: #fff;
  padding: 3.5% 0 5%;
}
.faq_title {
  width: 8.28125vw;
  max-width: 159px;
  margin: auto;
}
.faq_list {
  background: url(/html/user_data/data/organic_mist/img/faq_list.png) no-repeat center top;
  background-size: 100%;
  width: 53.33333333333333vw;
  height: 37.9vw;
  max-height: 728px;
  margin: 2.5% auto 0;
}

/*---------------------------------------
	_organic_mist-style-pc.scss
---------------------------------------*/
@media screen and (min-width: 1024px) {
  .mv_cv_quantity_btn input, .cta_cv_quantity_btn input {
    transition: 0.3s;
  }
  .mv_cv_quantity_btn input:hover, .mv_cv_btn a:hover, .cta_cv_quantity_btn input:hover, .cta_cv_btn a:hover {
    background: rgba(255, 255, 255, 0.2);
    transition: 0.1s;
  }
}
/*---------------------------------------
	_organic_mist-style-mb.scss
---------------------------------------*/
@media screen and (max-width: 1023px) {
  .mv {
    background: url(/html/user_data/data/organic_mist/img/mv_bg_mb.jpg) no-repeat center top;
    background-size: cover;
    width: 100%;
    max-height: 1400px;
    padding: 8% 0 15%;
  }
  .mv_title {
    width: 85.04398826979472vw;
    margin: auto;
  }
  .mv_cv {
    justify-content: center;
    position: relative;
    z-index: 1;
    margin-top: -25vw;
  }
  .mv_cv_price {
    position: absolute;
    top: 13vw;
    font-size: 26px;
    font-size: 2.54154vw;
    line-height: 40px;
    line-height: 3.91007vw;
    letter-spacing: 1.5px;
    letter-spacing: 0.14663vw;
  }
  .mv_cv_price br {
    display: none;
  }
  .mv_cv_quantity {
    margin-right: 2%;
    margin-left: 4%;
  }
  .mv_cv_quantity_title {
    font-size: 28px;
    font-size: 2.73705vw;
    letter-spacing: 2px;
    letter-spacing: 0.1955vw;
    margin-right: 0.5vw;
    white-space: nowrap;
  }
  .mv_cv_quantity_btn input {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 13vw;
    height: 10vw;
    border: 1px solid #fff;
    border-radius: 4px;
    padding: 0 20%;
    color: #fff;
    font-size: 28px;
    font-size: 2.73705vw;
    background: rgba(255, 255, 255, 0.05);
  }
  .mv_cv_btn {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 85%;
    height: 11vw;
    border: 1px solid #fff;
    border-radius: 4px;
    font-size: 36px;
    font-size: 3.51906vw;
    letter-spacing: 3px;
    letter-spacing: 0.29326vw;
    background: rgba(255, 255, 255, 0.1);
    position: relative;
  }
  .mv_cv_btn::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 6%;
    bottom: 0;
    margin: auto;
    border: 0;
    border-top: 0.4vw solid #fff;
    border-right: 0.4vw solid #fff;
    transform: rotate(45deg);
    width: 2.0vw;
    height: 2.0vw;
  }
  .mv_product {
    position: relative;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vw;
    background: url(/html/user_data/data/organic_mist/img/mv_product_bg_mb.png) no-repeat center center;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .mv_product_image {
    width: 91vw;
    position: relative;
    left: 0;
    top: -12vw;
  }
  .mv_product_feature {
    width: 32.94232649071359vw;
    position: absolute;
    right: 6vw;
    top: 29vw;
  }

  .concept {
    background-size: cover;
    max-height: 1000px;
    padding: 27% 0;
  }
  .concept_title {
    width: 80.1564027370479vw;
  }
  .concept_text {
    width: 80.1564027370479vw;
    margin-top: 10%;
  }

  .trouble {
    background: none;
    max-height: 100%;
    padding: 0;
  }
  .trouble_title {
    background: url(/html/user_data/data/organic_mist/img/trouble_title_mb.jpg) no-repeat center top;
    background-size: 100%;
    width: 100%;
    height: 45.6vw;
  }
  .trouble_case {
    width: 90%;
    margin: 3% auto 3.8%;
  }
  .trouble_message {
    background: url(/html/user_data/data/organic_mist/img/trouble_message_mb.png) no-repeat center top;
    background-size: cover;
    width: 100%;
    height: 23vw;
    max-height: 229px;
    margin-left: 0;
  }
  .trouble_listWrap {
    background: #f0f0f0;
    padding: 5% 0 7%;
  }
  .trouble_list {
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }
  .trouble_list_item {
    width: 41vw;
  }
  .trouble_list_item:nth-of-type(n+3) {
    margin-top: 3vw;
  }

  .about {
    max-height: 1000px;
    padding: 15% 0;
  }
  .about::before {
    content: "";
    top: 0;
    width: 5vw;
    border: 4vw solid transparent;
    border-top: 3.5vw solid #f0f0f0;
  }
  .about_title {
    width: 85%;
  }
  .about_list {
    background: url(/html/user_data/data/organic_mist/img/about_list_mb.png) no-repeat center top;
    background-size: 100%;
    width: 90%;
    height: 48vw;
    max-height: 490px;
    margin: 10% auto 0;
  }

  .cta {
    background: url(/html/user_data/data/organic_mist/img/cta_bg_mb.jpg) no-repeat center top;
    background-size: cover;
    background-color: red;
    max-height: 700px;
    padding: 18% 0 15% 28%;
    position: relative;
  }
  .cta_title {
    width: 62vw;
    z-index: 1;
    position: relative;
    margin-top: 5vw;
  }
  .cta_product {
    background: url(/html/user_data/data/organic_mist/img/cta_product_bg_mb.png) no-repeat center top;
    background-size: 100%;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 10%;
    right: 0;
    display: block;
    z-index: 0;
  }
  .cta_product_image {
    width: 21vw;
    position: relative;
    top: 3.5vw;
    left: 4.1vw;
  }
  .cta_cv {
    width: 61.9vw;
    margin-top: 11vw;
    position: relative;
    z-index: 1;
  }
  .cta_cv_price {
    /*
    position: absolute;
    top: 11.5vw;
    right: 0;
    */
    font-size: 24px;
    font-size: 2.34604vw;
    line-height: 40px;
    line-height: 3.91007vw;
    letter-spacing: 2px;
    letter-spacing: 0.1955vw;
    /*
    br {
    	display: none;
    }
    */
  }
  .cta_cv_quantity {
    margin-right: 3%;
    margin-left: 0;
  }
  .cta_cv_quantity_title {
    font-size: 28px;
    font-size: 2.73705vw;
    letter-spacing: 2px;
    letter-spacing: 0.1955vw;
    margin-right: 1vw;
    white-space: nowrap;
  }
  .cta_cv_quantity_btn input {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 13vw;
    height: 10vw;
    border: 1px solid #fff;
    border-radius: 4px;
    padding: 0 20%;
    color: #fff;
    font-size: 28px;
    font-size: 2.73705vw;
    background: rgba(255, 255, 255, 0.1);
  }
  .cta_cv_btn {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42vw;
    height: 10vw;
    border: 1px solid #fff;
    border-radius: 4px;
    font-size: 28px;
    font-size: 2.73705vw;
    letter-spacing: 3px;
    letter-spacing: 0.29326vw;
    background: rgba(255, 255, 255, 0.1);
    position: relative;
  }
  .cta_cv_btn::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 6%;
    bottom: 0;
    margin: auto;
    border: 0;
    border-top: 0.4vw solid #fff;
    border-right: 0.4vw solid #fff;
    transform: rotate(45deg);
    width: 2.0vw;
    height: 2.0vw;
  }

  .safety {
    padding: 10% 0;
  }
  .safety_title {
    background: url(/html/user_data/data/organic_mist/img/safety_title_mb.png) no-repeat center top;
    background-size: 100%;
    width: 54.83870967741935vw;
    height: 16.5vw;
    max-height: 164px;
    margin: auto;
  }
  .safety_lead {
    width: 90%;
    margin: 7% auto;
  }
  .safety_example {
    background: url(/html/user_data/data/organic_mist/img/safety_example_mb.png) no-repeat center top;
    background-size: 100%;
    width: 90%;
    height: 90vw;
    max-height: 919px;
    margin: 0 auto;
  }
  .safety_warning {
    width: 90%;
    margin: 4% auto 5%;
  }
  .safety_message {
    background: url(/html/user_data/data/organic_mist/img/safety_message_mb.png) no-repeat center top;
    background-size: 100%;
    width: 90%;
    height: 23vw;
    max-height: 238px;
    margin: auto;
  }

  .component {
    background: url(/html/user_data/data/organic_mist/img/component_bg_mb.jpg) no-repeat 0 0;
    background-size: 100%;
    background-color: #d2dac5;
    padding: 10% 0 8%;
  }
  .component_title {
    width: 29.61876832844575vw;
  }
  .component_list {
    background: url(/html/user_data/data/organic_mist/img/component_list_mb.png) no-repeat center top;
    background-size: 100%;
    width: 90%;
    height: 208vw;
    max-height: 2133px;
    margin: 7% auto 4%;
  }
  .component_pickup {
    background: url(/html/user_data/data/organic_mist/img/component_pickup_mb.png) no-repeat center top;
    background-size: 100%;
    width: 90%;
    height: 51.5vw;
    max-height: 533px;
    margin: 0 auto;
  }

  .voice {
    padding: 6% 0 8%;
  }
  .voice_title {
    width: 38.12316715542522vw;
    max-width: 390px;
    margin: auto;
  }
  .voice_list {
    background: url(/html/user_data/data/organic_mist/img/voice_list_mb.png) no-repeat center top;
    background-size: 100%;
    width: 90%;
    height: 101vw;
    max-height: 1036px;
    margin: 5% auto 0;
  }

  .faq {
    padding: 9% 0 8%;
  }
  .faq_title {
    width: 29.13000977517107vw;
    max-width: 298px;
  }
  .faq_list {
    background: url(/html/user_data/data/organic_mist/img/faq_list_mb.png) no-repeat center top;
    background-size: 100%;
    width: 90%;
    height: 81vw;
    max-height: 828px;
    margin: 6% auto 0;
  }
}
