@charset "utf-8";

/*resetcss*/
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:bottom;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:none}
a{margin:0;padding:0;font-size:100%;vertical-align:bottom;background:transparent;outline:none;}

ins{background-color:#ff9;color:#000;text-decoration:none}
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}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}


/* トップページ用CSS */

/*デバイス共通
------------------------------*/

html{
    height: 100%;
}
body{
	font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	background:url("../img/top/bg_gradation.gif") repeat-x;
	text-align: center;
}

.cf:after {
    content: "";
    clear: both;
    display: block;
}

/* clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/* Youtube */
.movie_box {
	width: 62.222222%; /* 560px */
	margin: 20px auto;
    position: relative;
    padding-bottom: 35.555555%; /* 320px */
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
.movie_box iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.movie_bg .note_txt {
	width: 62.222222%; /* 560px */
	margin: 5px auto 0;
}

/* Youtube 文字 */
.movie_title {}
.movie_title span {
	display: block;
}
.movie_title .big_txt {
	font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-size: 28px;
	line-height: 1.4;
	display: inline-block;
	color: #ea4caf;
	text-align: center;
}
.movie_title .normal_txt {
	font-size: 15px;
	line-height: 2;
	text-align: right;
	width: 460px;
	margin: 0 auto;
}

body.top div.mainArea p,body.top h2,body.top h3,
body.top section.detail5 p{
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	height: 0;
}

section.btn2{
	background-color: #FFF;
	padding:30px 0;
}

div.detail2_02{
	position: relative;
}

div.header_inner h1{
	float: left;
}
div.tel{
	float: right;
}

/* 20240329追記
　★弊社の発酵酵素は「紅麹原料」を一切使用しておりません★ */
#header {
	height: auto;
}
#header h1 {
    display: grid;
	padding-bottom: 18px;
}
#header h1::after {
    display: none;
    content: '★弊社の発酵酵素は「紅麹原料」を一切使用しておりません★';
    font-size: 13px;
    color: #f00;
	background-color: #fff;
	position: absolute;
	bottom: 0;
}
/* ここまで */

/*PC用CSS
------------------------------*/

@media screen and (min-width: 769px) {
/*global*/

body{
  font-size:18px;
  line-height:1.4em;
	/*font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	background:url("../img/top/bg_gradation.gif") repeat-x;
	text-align: center;*/
	min-width: 990px;
}

#contents {
	filter: alpha(opacity=100);
	-moz-opacity:1.0;
	opacity:1.0;
}

body.top #wrapper {
  /*width: 1080px;*/
	padding: 90px 0 0;
  text-align:center;
  margin:0 auto;
  z-index:100;
	background: #ffffff;
}
#wrapper_thanks {
	padding: 65px 0 0;
}
body.top {
	margin-top: -25px;
}
body.top #wrapper {
	padding-top: 0;
	background: none;
}
.cf:after {
    content: "";
    clear: both;
    display: block;
}
.left{
    float:left;
}
.right{
    float:right;
}
.pcdn{
    display: none;
}

body.top .form h2 {
	text-indent: 0;
	white-space: normal;
	/*overflow: auto;*/
	height: auto;
	padding-top: 60px;
}

div.mainArea{
/* background:url(../img/top/main.png) no-repeat center; */
	width:1080px;

height: 834px;
	margin-top: 90px;
	margin-left: auto;
	margin-right: auto;
}

body.top section.mainArea p,body.top h2,body.top h3{
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

section.btn1{
	/* position:relative; */
}

section.btn2 a>img:hover,
section.btn1 a>img:hover {
/*
	-webkit-filter:saturate(110%);
	-webkit-filter:brightness(120%);
	-moz-filter:saturate(110%);
	-moz-filter:brightness(120%);
	filter: saturate(110%);
	filter: brightness(120%);
*/
    opacity: 1;
	cursor: pointer;
}


section.btn1 div{
	/* position:absolute; */
	/* top:-120px; */
	/* left:40px; */
	left: 0;
	right: 0;
}


/*--------------------------------------------------------------Text用「position:relative;」*/
section.detail1{
	margin-top:30px;
	position:relative;
}
/*---------------------------------------------------------------*/
div.detail1_6crown{
	margin-top:60px;
	margin-bottom:50px;
}

div.detail1_02{
	margin-top:30px;
}

div.detail2_01,
div.detail2_04,
div.detail2_05,
div.detail2_06{
	position: relative;
}

img.catch_zakuro{
	position: absolute;
	top: 150px;
	left: 30px;
}
img.catch_lemon{
	position: absolute;
	top: 300px;
	right: 30px;
}
img.catch_budou{
	position: absolute;
	top: 200px;
	left: 40px;
}
img.catch_sanyasou{
	position: absolute;
	top: 100px;
	right: 70px;
}

div.detail3_06,
div.detail3_07{
	position: relative;
	width:880px;
	margin: 0 auto;
}

div.detail3_06 p,
div.detail3_07 p{
	position: absolute;
	top: 80px;
	left: 370px;
	text-align: left;
	width: 420px;
}

img.doc_thumb{
	position: absolute;
	top: 80px;
	left: 100px;
	width: 240px;
}


div.detail4_02{
	width: 880px;
	height: 800px;
	background:url(../img/top/detail4_bg.jpg) no-repeat center;
	margin: 0 auto;
	background-color: #f9f9f9;
}

div.detail4_02_cap1{
	padding:20px 0;
}

div.detail4_03 .remark_box {
	width: 62.222222%;
	margin: 0 auto;
}

div.detail4_03 span{
	font-size:12px;
	line-height: 1.5;
	display: block;
}

div.detail4_03 span.normal_txt {
	font-size: 15px;
	line-height: 2;
	text-align: right;
}

div.detail4_03 span.smalltext_r{
	text-align:right;
}

div.detail4_03{
	width: 880px;
	/* background-color: #f9f9f9; */
	/* padding-bottom: 50px; */
}

div.detail10_3{
	background:url(../img/top/detail10_3.jpg) no-repeat center;
	height: 0;
}

div.detail10_4{
	background:url(../img/top/detail10_4.jpg) no-repeat center;
	height: 0;
}

div.detail10_5{
	background:url(../img/top/detail10_5.jpg) no-repeat center;
	height: 0;
}

div.detail10_6{
	background:url(../img/top/detail10_6.jpg) no-repeat center;
	height: 0;
}

div.detail10_7{
	background:url(../img/top/detail10_7.jpg) no-repeat center;
	height: 0;
}

div.detail10_8{
	background:url(../img/top/detail10_8.jpg) no-repeat center;
	height: 0;
}

section.btn2{
	background-color:#FFF;
	width:880px;
	margin:0 auto;
	padding: 40px 0;
}


section.btn2{
	background-color:#FFF;
	margin:0 auto;
}


/*-----------------------------------------------通常購入用ボタン追加--*/

.dtl5{
	width:880px;
	height: auto;
	margin:0 auto;
	background:#Fff;
}

.dt5a{
	float:left;
	width:420px;
}
.dt5b{
	float:right;
	width:459px;
}
.dt5c{
	width:880px;
	height:auto;
}

dt5{
	position:relative;
}
.dtl5_btn{
	position:relative;
	width:249px;
	height:62px;
	right:40px;
}


section.btn2{
	background-color: #FFF;
	margin:0 auto;
}

/*----------------------------------------------------------------0904つづきここから--text追加分*/

.intext0{
	color:#333;
	font-size:16px;
	letter-spacing:0.03em;
	text-align:left;
	position:absolute;
	z-index:100;
	bottom:920px;
	left:143px;
}
.intext0.onkatsu{
	bottom: 1960px;
}
.intext0 p{
	line-height:1.6em;
}
/* 腎気コラムPC added 190118 ------*/
.intext_jinki{
	color: #333;
	font-size: 16px;
	letter-spacing: 0.03em;
	text-align: left;
	position: absolute;
	z-index: 100;
	bottom: 880px;
	left: 203px;
}
.intext_jinki p{
	line-height:1.6em;
	margin-bottom: 1.5em;
	text-shadow: 2px 2px 0 #fcfcf9,
             -2px 2px 0 #fcfcf9,
             2px -2px 0 #fcfcf9,
             -2px -2px 0 #fcfcf9;
}
/* 190118 added end -------------*/

/* youtube PC added 190201 ------*/
.video {
	position: relative;
}
.video iframe {
	position: absolute;
	top: 0px;
	left: 412px;
	z-index: 100;
}
/* 190201 added end -------------*/

	

.onkajitsu{
z-index:2;
}

.intext1{
	color:#68380D;
	font-size:18.5px;
	letter-spacing:0.03em;
	text-align:left;
	position:absolute;
	z-index:100;
	left:180px;
	bottom:60px;
}
.intext1.onkatsu{
	bottom:45px;
}

.d2_1,
.d2_2,
.d2_3,
.d2_4,
.d2_5{
	z-index:2;
}

.intext2{
	color:#fff;
	font-size:18.5px;
	letter-spacing:0.03em;
	text-align:left;
	position:absolute;
	z-index:100;
	
	top:165px;
	left:500px;
}

.d2_sub{
	font:bold 30px "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	line-height:1.5em;
}

.intext3{
	color:#333;
	font-size:17px;
	letter-spacing:0.03em;
	text-align:left;
	position:absolute;
	z-index:100;
	bottom:115px;
	left:245px;
}

.intext3.onkatsu{
	bottom: 100px;
	left: 205px;
	width: 335px;
}

.intext4{
	color:#2D8E2D;
	font-size:19px;
	text-align:left;
	position:absolute;
	z-index:100;

	left:155px;
	top:320px;
}

.intext5{
	color:#fff;
	font-size:18px;
	letter-spacing:0.02em;
	text-align:left;
	position:absolute;
	z-index:100;

	left:500px;
	top:1405px;
}

.intext6{
	color:#fff;
	font-size:18px;
	text-align:left;
	position:absolute;
	z-index:100;

	left:155px;
	top:360px;
}

.detail3_07_2{
	position:relative;
}
.intext7{
	color:#333;
	line-height:1.5em;
	font-size:18px;
	text-align:left;
	position:absolute;
	z-index:100;

	left:178px;
	bottom:128px;
}

}

/*SP用CSS*/
@media screen and (max-width: 768px) {
/*global*/
body{
    font-size:18px;
    line-height:1.5em;
    font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
    color:#333;
    text-align: center;
}
#wrapper{
    width:100%;
    text-align:center;
    margin:0 auto;
    z-index:100;
    height: 100%;
}
#wrapper_thanks{
    width:100%;
    padding:60px 0 0;
    text-align:center;
    margin:0 auto;
    z-index:100;
    height: 100%;
}

.cf:after {
    content: "";
    clear: both;
    display: block;
}
.left{
    float:left;
}
.right{
    float:right;
}

.spdn{
    display: none !important;
}

.brinl{
    display: inline !important;
}

body.top .form h2 {
	text-indent: 0;
	white-space: normal;
	overflow: auto;
	height: auto;
	padding-top: 10px;
}

div.mainArea {
	margin-top: 60px;
}

div.mainArea img,
section.detail1 div.detail1_01 img,
section.detail1 div.detail1_6crown img,
section.detail1 div.detail1_02 img,
section.detail1 div.detail1_03 img,
section.detail1 div.detail1_04 img,
section.detail1 div.detail1_05 img,
section.detail1 div.detail1_06 img,
section.detail2 img,
section.detail3 img,
section.detail4 img{
	width: 100%;
}

section.detail1 img{
	/* margin-bottom: 20px; */
}

section.detail1{
	margin-top:20px;
}
div.detail1_6crown{
	margin-top: 20px;
	margin-bottom: 20px;
}
div.detail1_02{
	margin-top: 20px;
}

section.detail2{
	width: 100%;
	overflow: hidden;
}

div.detail2_01,
div.detail2_04,
div.detail2_05,
div.detail2_06{
	position: relative;
}

img.catch_zakuro{
	position: absolute;
	width: 50%!important;
	top: 15%;
	left: -30px;
}
img.catch_lemon{
	position: absolute;
	width: 50%!important;
	top: 30%;
	right: -20px;
}
img.catch_budou{
	position: absolute;
	width: 50%!important;
	top: 110px;
	left: 0;
}
img.catch_sanyasou{
	position: absolute;
	width: 50%!important;
	top: 50px;
	right: -20px;
}

div.detail3_06,
div.detail3_07{
	position: relative;
	width:100%;
	margin: 0 auto;
}

div.detail3_06 p,
div.detail3_07 p{
	position: absolute;
	font-size: 10px;
	line-height: 1.3em;
	top: 6%;
	left: 41%;
	text-align: left;
	width: 50%;
}

img.doc_thumb{
	width: 27%!important;
	position: absolute;
	top: 25%;
	left: 10%;
}
section.detail4{
	padding-bottom:20px;
	background-color: #f9f9f9;
}

div.detail4_02{
	width:100%;
	height: auto;
	min-height: 320px;
	background:url(../img/top/detail4_bg.jpg) no-repeat center top;
	background-size: 100% auto;
	margin: 0 auto;
	background-color: #f9f9f9;
}

div.detail4_02_cap1{
	padding:20px 0;
}

div.detail4_03 .remark_box {
	width: 75%;
	margin: 0 auto;
}

div.detail4_03 span{
	font-size:11px;
	line-height: 1.5;
	display: block;
}

div.detail4_03 img.detail4_02_cap2{
	width: 80%;
}

div.detail4_03 span.normal_txt {
	font-size: 15px;
	line-height: 2;
	text-align: right;
	width: 100%;
	margin: 0 auto;
}

div.detail4_03 span.smalltext_r{
	text-align:right;
	width: 100%;
}

div.tel img{
	width: 195px;
	padding: 5px 5px 0 0;
}

section.btn1 img,section.btn2 img{
	width: 100%;
}


/*-----------------------------------------------通常購入用ボタン追加sp--*/
section.detail_st{
	background:url(../img/top/detail5_01.jpg) no-repeat;
	background-size:cover;
	width:100%;
	min-width:320px;
	height:100%;
	min-height:398px;
}

.detail_st p#btn_st{
	position:relative;
	z-index:999;
	top:26%;
	float:right;
}
.detail_st p#btn_st a img{
	width:40%;
	height:auto;
	right:0;
}

.dtl5{
	max-width: 650px;
	width:100%;
	height:auto;
	margin:0 auto;
	background:#Fff;
}
.dtl5 img{
	width:100%;}

.dt5a{
	float:left;
	width:50%;
}
.dt5b,.dtl5_btn{
	float:right;
	width:50%;
}
.dt5c{
	max-width:600px;
	clear:both;
}
.dt5_{
	float:right;
	width:50%;
}
.dtl5_btn{
	width:90%;
	z-index:999;
	margin-top:5%;
	margin-right:5%;
}


/*----------------------------------------------------sp用追加テキスト*/

.d2_1,
.d2_2,
.d2_3,
.d2_4,
.d2_5{
	z-index:2;
}

.d2_sub{
	font:bold 20px "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	line-height:1.5em;
}
.detail2.onkatsu.d2_sub{
	font-size: 18px;
}

	.detail1_06{
	position:relative;
	}

.detail1_06 p{
	font-size:12px;
	line-height:1.3em;
	}
	
.detail2 p{
	font-size:12px;
	line-height:1.3em;
}
.detail1_04{
	position:relative;
}

.detail1_04.onkatsu{
	background: #1b5399;
}

.intext0{
	color:#333;
	letter-spacing:0.03em;
	text-align:left;
	position:absolute;
	z-index:100;
	width:63%;
	bottom:8.8%;
	left:7.55%;
}
.intext0.onkatsu{
	bottom: 57%;
}
.intext0 p{
	font-size:10px;
	line-height:1.2em;
	color:#333;
	text-shadow:2px 2px 5px #FBCED5,
				-2px 2px 5px #FBCED5,
				2px -2px 5px #FBCED5,
				-2px 2px 5px #FBCED5;
}
/* 190118 added 腎気コラム ----------------- */
.intext_jinki {
	color: #333;
	letter-spacing: 0.03em;
	text-align: left;
	position: absolute;
	z-index: 100;
	width: 85%;
	bottom: 2%;
	left: 7.55%;
}
.intext_jinki p{
	font-size: 10px;
	line-height: 1.2em;
	color: #333;
	text-shadow: 2px 2px 0 #fcfcf9,
             -2px 2px 0 #fcfcf9,
             2px -2px 0 #fcfcf9,
             -2px -2px 0 #fcfcf9;
}
/* added end ------------------------------ */

/* youtube SP added 190201 ------*/
.video {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	background-image:url(../img/sp/detail3_03_bubble_bg_sp.jpg);
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 92%;
	height: 92%;
}
/* 190201 added end -------------*/


.intext1{
	color:#A88F66;
	text-align:left;
	position:absolute;
	z-index:100;
	
	width:90%;
	left:5%;
	top:45%;

}
.intext1.onkatsu{
	top:60%;
}

.intext2{
	color:#fff;
	text-align:left;
	position:absolute;
	z-index:100;
	
	width:80%;
	left:10%;
	top:19.5%;
}

.intext3{
	color:#333;
	text-align:left;
	position:absolute;
	z-index:100;
	width:70%;
	left:14%;
	bottom:10%;
}
.intext3 p{
	font-size:10px;
	line-height:1.1em;	
}

.intext4{
	color:#2D8E2D;
	text-align:left;
	position:absolute;
	z-index:100;
	
	width:80%;
	left:12%;
	top:8%;
}


.intext5{
	color:#fff;
	text-align:left;
	position:absolute;
	z-index:100;
	
	width:80%;
	left:12%;
	top:31.5%;
}

.intext6{
	color:#fff;
	text-align:left;
	position:absolute;
	z-index:100;
	
	width:80%;
	left:12%;
	top:38%;
}
.detail3_07_2{
	position:relative;
}

.detail3_07_2 p{
	font-size:12px;
	line-height:1.3em;
}
	
.intext7{
	color:#333;
	text-align:left;
	position:absolute;
	z-index:100;
	
	width:80%;
	left:9%;
	top:48%;
	
}
}