@charset "UTF-8";
/* CSS Document */
#main { width:100%; margin:0px auto; }
/*--------------------------------------------------
  reset
--------------------------------------------------*/

#main {
	width: 100%;
	font-size: 14px;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Mayryo','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	color: #333;
	line-height: 1.6em;
	margin: 0 auto;
	padding: 0;
	background: #ffffff;
}
body {margin: 0;
padding:0;}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

table, tr, th, td, caption {
  vertical-align: middle;
  text-align:left;
}

img {
  vertical-align:bottom;
  font-size:0;
  line-height: 0;
	margin: 0 !important;
	padding:0 !important
}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
}
/*--------------------------------------------------
 LP style
--------------------------------------------------*/
#lpbox {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
}
#lpbox img {
  display: block;
  margin-right: auto;
  margin-left: auto;
  max-width: 100%;
  vertical-align: bottom;
  width: 100%;
}
#lpbox section ,
#lpbox div ,
#lpbox h1 ,
#lpbox h2 ,
#lpbox h3 ,
#lpbox dl ,
#lpbox dt ,
#lpbox dd ,
#lpbox ul ,
#lpbox li ,
#lpbox p ,
#lpfooter ul ,
#lpfooter li {
  padding: 0;
  margin: 0 auto;
}
#lpbox .cta-box {
  margin: 0 auto;
  position: relative;
  width: 100%;
}
#lpbox .cta-btn {
  box-sizing: border-box;
  padding: 1.5% 0% 0 3.8%;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
#lpbox .trouble {
  margin: 6% auto 0;
}
#lpbox .reason-ttl {
  position: relative;
  margin: 0 auto;
  background: url(../images/reason_ttl_bg.png) no-repeat bottom center;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  overflow: hidden
}
#lpbox .reason-ttl h2 {
  position: relative;
  z-index: 3;
}
#lpbox .reason-ttl .reason-ttl-img {
  box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 0;
  right: -20%;
  padding: 30% 0% 2% 40%;
  width: 100%;
  z-index: 1;
}









#lpbox .product {
  margin: 0 auto;
  position: relative;
}
#lpbox .product-img {
  display: block;
  position: relative;
  margin: 0 auto;
  z-index: 1;
}
#lpbox .product-box {
  background: #fff;
  box-sizing: border-box;
  position: relative;
  width: 93.75%;
  z-index: 2;
  margin: 0 auto 6%;
}
#lpbox .product-box dt {
  background-color: #e33a4a;
  color: #fff;
  padding: .5em;
  position: relative;
  text-align: center;
}
#lpbox .product-box dd {
  padding: .5em;
  position: relative;
  text-align: center;
}
#lpbox .product-box dd.txt-l {
  text-align: left;
}
#lpbox .product-ingr {
}
#lpbox .product-ingr .product-ingr-ttl {
  text-align: center;
  font-size: 1.3em;
}
#lpbox .product-ingr ul {
  box-sizing: border-box;
  margin: 2% auto 8%;
  padding: 0;
  width: 93.75%;
}
#lpbox .product-ingr li {
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: .5em;
  margin: 0 auto;
  width: 100%;
}
#lpbox .product-ingr li:nth-child(odd) {
  background-color: #b7b7b7;
  color: #fff;
}
#lpbox .product-ingr .product-ingr-name {
  box-sizing: border-box;
  padding-left: 1em;
}
#lpbox .product-ingr .product-ingr-mou {
  box-sizing: border-box;
  width: 50%;
  text-align: center;
}

/*-------------------------------------------
 footer
-----------------------------------------------*/


#lpfooter {
  max-width: 750px;
	width: 100%;
	font-size: 14px;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Mayryo','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	color: #333;
	line-height: 1.6em;
	margin: 0 auto;
	padding: 0;
	background: #ffffff;
}
#lpfooter .footer-link {
  text-align: center;
  margin-top: 3em;
  margin-bottom: 2em;
  font-size: 1.2em;
}
#lpfooter .footer-link li{
  margin-bottom: 1em;
}
#lpfooter .footer-link li a {
  color: #251510;
}
#lpfooter #copy {
  text-align: center;
  font-size: .9em;
  color: #fff;
  background-color: #1d287d;
  box-sizing: border-box;
  padding: 1.2em 0;
}


/*----------------------------*/
@media screen and (min-width:750px){
 #main , #lpfooter {
    font-size: 28px;
    max-width: 750px;
    margin: 0 auto;
  }
}