@charset "utf-8";

/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
http://code.google.com/p/html5resetcss/downloads/list
*/

/*---基本設定ここから-----------------------------------------------------------------------------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
	display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

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

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}
th,td{
	text-align: left;
	vertical-align: top;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

article, aside, dialog, figure, footer, header,hgroup, menu, nav, section { display: block; }

img{border: 0; vertical-align: bottom;-ms-interpolation-mode: bicubic; }


/* For modern browsers */
.clearfix:before,.clearfix:after,.cf:before,.cf:after{
	content:"";
	display:table;
}
.clearfix:after,.cf:after{clear:both;}
.clearfix,.cf{zoom:1;}/* For IE 6/7 (trigger hasLayout) */
/*---基本設定ここまで-----------------------------------------------------------------------------------------------------*/


html{
	color: black;
	background: white;
	overflow-y: scroll;	/*ここでスクロールバーを常に表示*/
}
body{
	text-align: center;
	font-size: 16px;
	font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
	/*font-family: 'Hiragino Mincho Pro', 'ヒラギノ明朝 Pro W3', "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;*/
	word-wrap: break-word;
	border-top: solid 10px #e50011;
}


body#iframebody{
	text-align: center;
	font-size: 16px;
	font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
	/*font-family: 'Hiragino Mincho Pro', 'ヒラギノ明朝 Pro W3', "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;*/
	word-wrap: break-word;
	border: none;
}

#box{
	width: 1280px;
	margin: 0 auto;
	background: url(image/box-back.jpg) repeat-y;
	position:relative
}

/*-----------------------------------------------------
@@ ヘッダ
------------------------------------------------------*/
div.page-header{
}

h1.top a{
	display: block;
	width: 300px;
	height: 70px;
	font-size: 0px;
	text-indent:-9988px;	/*文字を飛ばして見えなくする*/
	overflow: hidden;	/*はみ出す場合は消す*/
	outline:none;	/*リンクの点線を無くす*/
	background: url(image/top-logo.png) top left no-repeat;
	position: absolute;
	top: 0;
	left: 0;
}

h1 a:hover{
	opacity: 0.6;
}

div#page-top{
}
/*-----------------------------------------------------
@@ フッタ
------------------------------------------------------*/
div#page-footer{
	width: 100%;
	height: 50px;
	background-color: #e50011;
}

div#page-footer p{
	text-align: center;
	color: white;
	padding-top: 20px;
	font-size: 83%;
}
/*-----------------------------------------------------
@@ メイン
------------------------------------------------------*/
#main{
	width: 1280px;
	text-align: left;
}

/*-----------------------------------------------------
@@ For media queries
レスポンシブ Web デザイン　Responsive Web Design
------------------------------------------------------*/
/* set image max width to 100% */
video,
img, object {
	max-width: 100%;
	height: auto;
	/* ie8.css参照 */
}

.video embed,
.video object,
.video iframe {
	width: 100%;
	height: auto;
}


/*-----------------------------------------------------
@@ index インデックス
------------------------------------------------------*/
/*あなたの元気を本気で応援！*/
h1.anatanogenk{
	margin: 10px 0 0 0;
}


/*こんなお悩みありませんか？*/
h1.konna-onayami{
	margin: 15px 0 0 0;
}

/*お客様からお喜びの声が続々！！*/
h1.koe{
	margin: 15px 0 0 0;
}

/*お客様の声3件*/
div.koe-waku01{
	/*clearfix*/
}

div.koe-waku02{
	float: left;
	width: 303px;
	height: 490px;
	background: url("image/koe-back.jpg") 0 0 no-repeat;
	margin: 0 8px;
}

div.koe-top{
	/*clearfix*/
	width: 303px;
	height: 105px;
	padding: 60px 0 10px 0;
}

div.koe-left{
	float: left;
	width: 185px;
	height: 105px;
	padding: 7px 0 0 10px;
}

div.koe-right{
	float: right;
	width: 100px;
	height: 105px;
	padding: 0 5px 0 0;
}

div.koe-text{
	padding: 0 15px 0 10px;
	text-align: justify;
	text-justify: inter-ideograph;
}

div.koe-text p{
	font-size: 95%;
	line-height: 1.6em;
}

div.koe-text p span{
	font-weight: bold;
}


/*これだけではありません！たくさんのお声が寄せられています！*/
div.koe-title02{
	margin: 20px 0 0 0;
}

div.scroll-waku-koe{
	border: solid 10px #e50011;
	padding: 10px;
}

div.scroll{
	overflow:auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #808080;
}

div.scroll iframe {
	width:100%;
	height:100%;
	display:block;
}

div.scroll{
		height:350px;
	}

div#koe-iframepage{
	width: 95%;
	padding: 10px 8px;
	text-align: left;
	font-size: 75%;
	line-height: 1.4em;
}

div.koe-iframepage-waku{
	padding: 0 0 10px 0;
	border-bottom: dashed 1px #9f9f9f;
}

div.koe-iframepage-neme{
	font-weight: bold;
	margin: 10px 0 8px 0;
}

span.koe-iframepage-star{
	color: #faed00;
}


/*乳酸菌EF-2001が、あなたの「まもる力」を育てます！！*/
h1.rbm-title{
	margin: 60px 0 0 0;
}


/*だから、MIHARUの乳酸菌は、あなたの元気を「育てる」「まもる」乳酸菌*/
div.dakara{
	margin: 40px 0 0 0;
}

div.kaiketu{
	margin: 0 0 60px 0;
}

/*1日の理想は1兆個！！ヨーグルトなら100個分！*/
h1.yogurt100-title{
	margin: 60px 0 0 0;
}


/*高純度の純菌体！キトサン不使用です！！*/
h1.chitosan-title{
	margin: 30px 0 0 0;
}


/*市販の乳酸菌サプリよりお買得です！！*/
h1.shihan-title{
	margin: 30px 0 0 0;
}


/*ベストビューティーアワード受賞！*/
h1.pococe-title{
	margin: 30px 0 0 0;
}

div.pococe-waku{
	/*clearfix*/
}

div.pococe-waku-in01{
	float:left;
	width: 500px;
	margin: 0 0 0 10px;

}

div.pococe-waku-in02{
	float:left;
	width: 430px;
}

div.pococe-01-img{
}
div.pococe-02-img{
}
div.pococe-text{
	font-size: 83%;
	line-height: 1.3em;
	margin: 10px 20px;
}


/*飲み方はとっても簡単！好きな時１包～*/
div#contents-1280{
	margin: 30px 0 0 0;
}

h1.nomikata-title{
	margin: 0 170px 10px 170px;
}

div#contents-1280 p{
	margin: 0 170px 10px 170px;
}

div.nomikata-waku{
	/*clearfix*/
}

div.nomikata-waku-in01{
	float:left;
	width: 500px;
	margin: 0 0 0 90px;

}

div.nomikata-waku-in02{
	float:left;
	width: 600px;
}


/*安心・安全すべての工程が国内生産！*/
h1.anshin-title{
	margin: 30px 0 0 0;
}


div.anshin-waku{
	/*clearfix*/
}

div.anshin-maimtext{
	margin: 10px 0;
}

div.anshin-waku-in01{
	float:left;
	width: 630px;
	margin: 0 30px 0 40px;
}

div.anshin-tokkyo{
	border: solid 1px black;
	margin: 0 5px 10px 5px;

}

div.anshin-tokkyo p{
	color: #404040;
	font-size: 83%;
	line-height: 1.5em;
	padding: 10px 0 10px 10px;
}

div.anshin-tokkyo p span.tokkyo-b{
	font-size: 120%;
	font-weight: bold;
}

div.anshin-01-img{
	/*clearfix*/
	width: 630px;
}

div.anshin-01-img-in{
	float:left;
	width: 200px;
	margin: 10px 5px 0 5px;
}

div.anshin-01-img-in-text{
	text-align: center;
	font-size: 83%;
	margin: 2px 0 0 0;
}

div.anshin-waku-in02{
	float:left;
	width: 200px;
	margin: 25px 20px 0 0;
}



/*FAQ.よくある質問にお答えします。*/
h1.faq-title{
	margin: 60px 0 0 0;
}

div.scroll-waku-faq{
	border: solid 10px #009139;
	padding: 10px;
}

div.scroll{
	overflow:auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #808080;
}

div.scroll iframe {
	width:100%;
	height:100%;
	display:block;
}

div.scroll{
		height:350px;
	}

div#faq-iframepage{
	width: 95%;
	padding: 10px 8px;
	text-align: left;
	font-size: 75%;
	line-height: 1.4em;
}

div.faq-iframepage-waku{
	padding: 0 0 10px 0;
	border-bottom: dashed 1px #9f9f9f;
}

div.faq-iframepage-neme{
	font-weight: bold;
	margin: 10px 0 8px 0;
}


/*その他のご質問は? MIHARUお客様相談センター*/
h1.contact-title{
	display: block;
	width: 960px;
	height: 130px;
	font-size: 0px;
	text-indent:-9988px;	/*文字を飛ばして見えなくする*/
	overflow: hidden;	/*はみ出す場合は消す*/
	text-decoration: none;
	background: url("image/contact-title.jpg") 0 0 no-repeat;
}

h1.contact-title span{
	visibility: hidden;
}

div.contact-waku{
	/*clearfix*/
	margin: 0 15px;
}

div.contact-left{
	float: left;
	width: 460px;
}

div.contact-right{
	float: right;
	width: 460px;
	height: 370px;
	background: url("image/contact-mail-back.jpg") 0 0 no-repeat;
}

div.contact-left01{
	width: 460px;
	height: 200px;
	background: url("image/contact-tel-back.jpg") 0 0 no-repeat;
	margin: 0 0 10px 0;
}

div.contact-left02{
	width: 460px;
	height: 160px;
	background: url("image/contact-fax-back.jpg") 0 0 no-repeat;
}

h2.contact-tel{
	padding: 15px 0 0 90px;
}
h2.contact-fax{
	padding: 15px 0 0 60px;
}

h2.contact-mail{
	padding: 15px 0 0 70px;
}

div.contact-text{
	padding: 20px 0 0 10px;
}

span.contact-text1{
	font-size: 160%;
	font-weight: bold;
	line-height: 1.5em;
}

span.contact-text2{
	font-size: 140%;
	font-weight: bold;
}

span.contact-text3{
	font-size: 90%;
	line-height: 1.3em;
}

div.contact-text-bt{
	margin: 20px 0 20px 10px;
}

div.contact-okigaruni{
	margin: 0 0 30px 0;
}


/*定期コース通常8％OFFが、10％OFFは今だけ！！*/
h1.off-title{
	margin: 30px 0 0 0;
}

div.off-waku{
	/*clearfix*/
}

div.off-waku-in01{
	float:left;
	width: 450px;
	margin: 0 0 0 20px;

}

div.off-waku-in02{
	float:left;
	width: 480px;
}

div.off-03-img{
	margin: 0 0 15px 0;
}

div.off-last-text{
	font-size: 80%;
	line-height: 1.5em;
	margin: 10px 15px 40px 15px;
}


/*シリーズいろいろあなたに合わせたプラスアルファ*/
h1.series-title{
	margin: 30px 0 0 0;
}

div.buy03-waku{
	/*clearfix*/
	margin: 0 0 40px 0;
}

div.buy03-item{
	float:left;
	width: 460px;
	border: solid 5px #e50011;
	margin: 10px 5px 0 5px;
}

div.buy03-bt-small{
	margin: 0 0 0 10px;
}

/*最後   だから、MIHARUの乳酸菌は、あなたの元気を「育てる」「まもる」乳酸菌*/
div.last-sodateru-mamoru{
	margin: 40px 0 30px 0;
}
/*-----------------------------------------------------
@@ 共通
------------------------------------------------------*/
div.contents-960{
	margin: 0 160px;
}

/*p*/
p.main-text{
	line-height: 1.5em;
	margin: 0 10px 0 10px;
}

/*赤太文字*/
span.font-red{
	color: #e50011;
	font-weight: bold;
}

/*---3種類購入欄--------------------*/
div.buy-04-waku{
	margin: 60px 0 70px 0;
}

div.buy-04{
	margin: 20px 0 20px 0;
}

div.buy-04-last{
	margin: 20px 0 10px 0;
}
/*---------------------------------*/




/*-----------------------------------------------------
@@ スマホ版 768px以下の場合
------------------------------------------------------*/
@media screen and (max-width: 768px) {
/* 768px以下の場合 (スマホ等)*/

body{
	border-top: solid 5px #e50011;
}

#box{
	width: 100%;
	margin: 0 auto;
	background: none
}

div.page-header{
	margin: 20px 0 0 0;
}

h1.top a{
	display: block;
	width: 300px;
	height: 35px;
	font-size: 0px;
	text-indent:-9988px;	/*文字を飛ばして見えなくする*/
	overflow: hidden;	/*はみ出す場合は消す*/
	outline:none;	/*リンクの点線を無くす*/
	background: url(image/top-logo.png) top left no-repeat;
	position: static;
	top: 0;
	left: 0;
	background-size:50% auto;
}

#main{
	width: 100%;
	text-align: left;
}

/*お客様の声3件*/
div.koe-waku01{
	/*clearfix*/
}

div.koe-waku02{
	float: none;
	width: 99%;
	height: auto;
	background: none;
	background-color: #ffffcc;
	margin: 0 0 10px 0;
}

div.koe-top{
	/*clearfix*/
	width: 100%;
	height: auto;
	padding: 0 0 10px 0;
}

div.koe-left{
	float: left;
	width: auto;
	height: auto;
	padding: 7px 0 0 10px;
}

div.koe-right{
	float: left;
	width: auto;
	height: auto;
	padding: 0 10px 0 0;
}

div.koe-text{
	padding: 0 10px 15px 10px;
	text-align: justify;
	text-justify: inter-ideograph;
}

div.koe-text p{
	font-size: 83%;
	line-height: 1.5em;
}

div.koe-text p span{
	font-weight: bold;
}

/*これだけではありません！たくさんのお声が寄せられています！*/
div.koe-title02{
	margin: 0 0 0 0;
}

div.scroll-waku-koe{
	border: none;
	padding: 0;
}

div.scroll{
		height:200px;
		padding: 5px;
	}

/*乳酸菌EF-2001が、あなたの「まもる力」を育てます！！*/
h1.rbm-title{
	margin: 40px 0 0 0;
	border-bottom: solid 2px #e50011;
}

/*高純度の純菌体！キトサン不使用です！！*/
h1.chitosan-title{
	margin: 30px 0 0 0;
	border-bottom: solid 2px #e50011;
}

/*市販の乳酸菌サプリよりお買得です！！*/
h1.shihan-title{
	margin: 30px 0 0 0;
	border-bottom: solid 2px #e50011;
}

/*だから、MIHARUの乳酸菌は、あなたの元気を「育てる」「まもる」乳酸菌*/
div.dakara{
	margin: 10px 0 0 0;
}

div.kaiketu{
	margin: 0 0 40px 0;
}

/*1日の理想は1兆個！！ヨーグルトなら100個分！*/
h1.yogurt100-title{
	margin: 40px 0 0 0;
	border-bottom: solid 2px #e50011;
}

/*ベストビューティーアワード受賞！*/
h1.pococe-title{
	margin: 30px 0 0 0;
	border-bottom: solid 2px #e50011;
}

div.pococe-waku-in01{
	float: none;
	width: 100%;
	margin: 0 0 0 0;
}

div.pococe-waku-in02{
	float: none;
	width: 100%;
}

div.pococe-text{
	font-size: 83%;
	line-height: 1.4em;
	margin: 0 5px 10px 5px;
}

/*飲み方はとっても簡単！好きな時１包～*/
div#contents-1280{
	margin: 30px 5px 0 5px;
}

h1.nomikata-title{
	margin: 5px 0 10px 0;
	border-bottom: 2px solid #e50011;
}

div#contents-1280 p{
	margin: 0 5px 10px 5px;
}

div.nomikata-waku-in01{
	float:none;
	width: 100%;
	margin: 0 0 0 0;
}

div.nomikata-waku-in02{
	float: none;
	width: 100%;
	margin: 0 0 0 0;
}

/*安心・安全すべての工程が国内生産！*/
h1.anshin-title{
	margin: 30px 0 0 0;
	border-bottom: 2px solid #e50011;
}

div.anshin-waku-in01{
	float: none;
	width: 100%;
	margin: 0 0 0 0;
}

div.anshin-tokkyo{
	border: solid 1px black;
	margin: 0 5px 10px 5px;
}

div.anshin-tokkyo p{
	color: #404040;
	font-size: 75%;
	line-height: 1.5em;
	padding: 10px 5px 10px 5px;
}

div.anshin-tokkyo p span.tokkyo-b{
	font-size: 120%;
	font-weight: bold;
}

div.anshin-01-img{
	/*clearfix*/
	width: 100%;
}

div.anshin-01-img-in{
	text-align: center;
	float: none;
	width: 100%;
	margin: 10px 0 0 0;
}


div.anshin-waku-in02{
	float: none;
	width: 100%;
	margin: 25px 0 0 0;
	text-align: center;
}

/*FAQ.よくある質問にお答えします。*/
h1.faq-title{
	margin: 30px 0 0 0;
	border-bottom: 2px solid #009139;
}

div.scroll-waku-faq{
	border: none;
	padding: 0x;
}

div.scroll{
		height:200px;
		padding: 5px;
	}

/*その他のご質問は? MIHARUお客様相談センター*/
h1.contact-title{
	display: block;
	width: 100%;
	height: auto;
	font-size: 130%;
	text-indent: 0px;	/*文字を飛ばして見えなくする*/
	overflow: hidden;	/*はみ出す場合は消す*/
	text-decoration: none;
	background: none;
	color: white;
	background-color: #009139;
	margin: 10px 0 5px 0;
}

h1.contact-title span{
	visibility: visible;
	display: block;
	padding: 8px 4px;

}

div.contact-waku{
	/*clearfix*/
	margin: 0 0;
}

div.contact-left{
	float: none;
	width: 100%;
}

div.contact-right{
	float: none;
	width: 100%;
	height: auto;
	background: none;
	margin: 15px 0 0 0;
}

div.contact-left01{
	width: 100%;
	height: auto;
	background: none;
	margin: 0 0 10px 0;
}

div.contact-left02{
	width: 100%;
	height: auto;
	background: none;
}

h2.contact-tel{
	padding: 0;
}

h2.contact-fax{
	padding: 0;
}

h2.contact-mail{
	padding: 0;
}

div.contact-text{
	font-size: 83%;
	padding: 5px 0;
}

span.contact-text1{
	font-size: 100%;
	font-weight: bold;
	line-height: 1.5em;
}

span.contact-text2{
	font-size: 100%;
	font-weight: bold;
	line-height: 1.8em;
}

span.contact-text3{
	font-size: 100%;
	line-height: 1.5em;
}

div.contact-text-bt{
	margin: 10px 0 10px 0;
}

div.contact-okigaruni{
	display: none;
	margin: 20px 0 20px 0;
}

/*定期コース通常8％OFFが、10％OFFは今だけ！！*/
h1.off-title{
	margin: 30px 0 0 0;
	border-bottom: 2px solid #e50011;
}

div.off-waku{
	/*clearfix*/
	width: 100%;
	margin: 10px 0 0 0;
}

div.off-waku-in01{
	float: left;
	width: 45%;
	height: auto;
	margin: 0 0 0 10px;

}

div.off-waku-in02{
	float: left;
	width: 50%;
	height: auto;
}

div.off-last-text{
	font-size: 75%;
	line-height: 1.5em;
	margin: 10px 10px 20px 10px;
}

/*シリーズいろいろあなたに合わせたプラスアルファ*/
h1.series-title{
	margin: 30px 0 0 0;
	border-bottom: 2px solid #e50011;
}

div.buy03-waku{
	/*clearfix*/
	margin: 0 0 0 0;
	text-align: center;
}

div.buy03-item{
	float: none;
	width: 70%;
	border: none;
	margin: 10px 15% 20px 15%;
}

div.buy03-bt-small{
	margin: 0 0 0 0;
}

/*-----------------------------------------------------
@@ 共通
------------------------------------------------------*/
div.contents-960{
	margin: 0 5px;
}

p.main-text{
	font-size: 83%;
	line-height: 1.5em;
	margin: 5px 10px 0 10px;
}

div.interval{
	border-top: 3px dotted #ffff00;
	margin: 20px 0 0 0;
}

/*---3種類購入欄--------------------*/
div.buy-04-waku{
	margin: 30px 0 40px 0;
}

div.buy-04{
	margin: 20px 0 20px 0;
}

div.buy-04-last{
	margin: 20px 0 10px 0;
}
/*---------------------------------*/

/******************/
}/* 768px以下の場合ここまで */










/*------------------------------------------------------
@@ Retina用背景画像
------------------------------------------------------*/
@media 
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {

	div.retinaback {
		background: url(image/aaaaa-2x.jpg); /* 2倍サイズの画像 */
		-webkit-background-size: 100px 100px; /* 表示させるサイズ WebKit */
		background-size: 100px 100px; /* 表示させるサイズ WebKit以外 */
	}

}