@charset "UTF-8";
@import url("../../../common_sp/css/style_efo.css");
@import url("../../../common_sp/css/style_base.css");

#landing{
	max-width:640px;
	margin:0 auto;
}
#main{
	max-width:640px;
	margin:0 auto;
	background:#fcfcfc;
}
img{
	max-width:100%;
	height:auto;
}
p{
	color:#5b0500;
	letter-spacing:1.4;
}

/* content*/
.point{
	background:#ba1b11;
}
.icon{
	padding:23px 0 0;
	width:20%;
	margin:auto;
}
.point .point-txt-s, .point .point-txt-t{
	margin:auto;
	text-align:center;
	color:#fff;
}
.point .point-txt-s{
	font-size:12px;
	padding:12px 0 0;
}
.point .point-txt-t{
	font-size:17px;
	padding:0 0 12px;
}

/* ofrArea */
.ofrArea{
	background-color: #ba1b11;
	padding: 10px;
}
.ofrCont{
	background-color: #fff;
	border-radius: 6px;
	padding: 20px 10px 10px;
	margin-bottom: 10px;
}
.indent01{
	color: #333;
	text-indent: -1em;
	padding-left: 1em;
	margin: 10px 6px 0;
	font-size: 0.8em;
}

/* wrntArea */
.wrntArea{
	background-color: #f7d579;
	padding: 30px 0;
}
.wrntCont{
	background-color: #fff;
	width: 82%;
	margin: 0 auto;
	padding: 20px 18px 30px;
	text-align: center;
}
.wrntTtl01{
	background-color: #ba1b11;
	color: #fcfcfc;
	padding: 10px 18px;
	width: 38%;
	margin: 0 auto;
}
.wrntTtl02{
	font-size: 1.4em;
	margin-top: 10px;
}
.wrntTxt01{
	margin-top: 14px;
}
.wrntTxt01 span{
	color: #ba1b11;	
}
.wrntTxt02{
	margin-top: 10px;
	text-align: left;
	font-size: 0.8em;
}

/* cmArea */
#cmArea{
	padding-top: 30px;
}
#cmArea img{
	width: 54%;
	height: auto;
}
#cmArea iframe{
	margin: 20px 0;
	height: 180px;
}

/* minibtn */
.minibtn{
	width:95%;
	margin:auto;
	padding:12px 0;
}

/* experiment */
.experiment p{
	padding:5px 0;
	font-size:12px;
	text-align:center;
}
.experiment .orange-txt{
	color:#ff3000;
	font-size:15px;
}
.experiment .large-txt{
	font-size:15px;
}
.movie{
	text-align:center;
	margin:10px;
}

/* secret */
.secret{
	background:#ba1b11;
}
.icon{
	padding:23px 0 0;
	width:20%;
	margin:auto;
}
.secret .ttl{
	width:92%;
	margin:auto;
}

/* use */
.use p{
	color:#fff;
}
.use-image{
	margin:auto;
	width:93%;
}
.use1 .use-txt-box ,.use2 .use-txt-box{
	margin:auto;
	width:92%;
	font-size:13px;
}
.use3 .use-txt-box ,.use4 .use-txt-box{
	font-size:13px;
}
.use-minitxt{
	margin:auto;
	width:93%;
	font-size:9px;
}
.use-txt1{
	background: url("../images/flavorstone_sp_icon02.png") 3% 0.8em no-repeat;
	background-size:73px auto;
	padding:20px 0 18px 93px;
}
.use-txt2{
	background: url("../images/flavorstone_sp_icon03.png") 1% 0.8em no-repeat;
	background-size:73px auto;
	padding:20px 0 18px 93px;
}
.use-txt-s{
	font-size:12px;
	color:#fff;
}
.use-txt-t{
	font-size:27px;
	color:#fff;
	text-decoration: underline;
}
.use1{
	background:#f38079;
}
.use2{
	background:#ba1b11;
}
.use3{
	background:#f38079;
	padding:0 3%;
}
.use3-box, .use4-box{
	background:#fff;
	padding:0 2%;
}
.use3-box p, .use4-box p{
	color:#5b0500;
	text-align:center;
	font-size:12px;
}
.use3-box p .large-txt, .use4-box p .large-txt{
	font-size:16px;
}
.use3-box dt, .use4-box dt{
	background:#ba1b11;
	padding:5px 10px;
	text-align:center;
	color:#fff;
	font-size:11px;
}
.use3-box dt .large-txt, .use4-box dt .large-txt{
	font-size:18px;
}
.use4{
	background:#ba1b11;
	padding:0 3%;
}

/* clear50 */
.clear50{
	background:#5b0500;
	text-align:center;
}
.clear50 p{
	color:#fff;
	font-size:16px;
}
.clear50 .clear50-txt{
	font-size:34px;
}
.clear50 .large-txt{
	color:#fff;
	font-size:37px;
}
.clear50 .small-txt{
	font-size:9px;
}

.clear50 .txt-box{
	width:94%;
	margin:0 auto 5px;
	text-align:left;
}
.clear50 .test-detail p{
	font-size:12px !important;
	width:90%;
	margin:0 auto;
	color:#fff;
	text-align:left;
}
.clear50 .indent{
	text-indent: -1em;
    padding: 0px 0px 0px 10px;
}
.clear50 .small-txt{
	width:94%;
	margin:0 auto;
}
.clear50 .yellow-txt{
	color: #ffea71;
}


/* voice1 */
.voice1{
	padding:0 4%;
	background:url("../images/user_bg.png") center 20px ;
}
.voice-box{
	background:#fff;
	border:solid #ececec 1px;
	width:84%;
	margin:auto;
	padding:20px 20px 40px;
}
.voice-ttl{
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size:18px;
	color:#000;
	font-weight:bold;
	line-height:1.6;
}
.voice-member{
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size:8px;
	color:#3f2525;
}
.voice-txt{
	color:#180202;
	font-size:12px;
	line-height:1.8;
}
.voice-txt .txt-line{
	background:#fffaaa;
}
.voice1 .txt-r{
	color:#444;
	font-size:9px;
}
.usability p:first-child{
	width:90%;
	margin:auto;
}
.usability p:nth-child(2){
	padding:0 0 0 10%;
}

/* correspond */
.correspond{
	background:#ffcccb;
	padding:20px 0 20px;
}
.correspond-txt{
	background:#fff;
	padding:10px 0;
	text-align:center;
	font-size:13px;
	width: 96%;
	margin: 0 auto;
}
.correspond-icon{
	text-align:center;
	padding:10px 10% 0;
}

/* chefArea */
.chefArea{
	background-color: #fff;
	width: 90%;
	border: 1px solid #666;
	margin: 20px auto;
}
.chefTtl{
	text-align: center;
	background-color: #ba1b11;
	padding: 14px 10px;
	margin-bottom: 16px;
}
.chefCont{
	padding: 0 20px 30px;
	overflow: hidden;
}
.chefCont span,
.chefCont dt{
	color: #ba1b11;
}
.chefCont dt{
	font-size: 1.2em;
	margin-bottom: 6px;
}
.chefCont .fl{
	float: left;
}
.chefCont .fr{
	float: right;
	width: 48%;
}

/*recipe*/
.recipeCont{
	margin: 20px auto;
	text-align: center;
	width: 90%;
}

/* color */
.color-box{
	background:#5b0500;
	padding:20px;
}
.color p{
	color:#fff;
	text-align:center;
	font-size:20px;
}
.color .large-txt{
	font-size:33px;
}

/* spec */
#spec{
	margin: 0 auto;
	margin-bottom: 40px;
	margin-top: 40px;
	width: 100%;
}
#spec .specTtl{
	color: #333;
	font-weight: bold;
	padding: 5px 6px;
}
#spec table{
	border-bottom: 1px solid #999999;
	font-size: 0.8em;
	line-height: 1.2em;
	margin: 0 auto 10px;
	width: 100%;
}
#spec table th{
	border-top: 1px solid #999999;
	padding: 4px 10px;
	width: 25%;
	text-align: left;
	font-weight: normal;
}
#spec table td{
	border-top: 1px solid #999999;
	padding: 4px 0;
	text-align: left;
}

/* color */
.color{
	background-color: #fff;
}
	
/* 汎用クラス */
.mt0 { margin-top: 0px !important;}
.mb0 { margin-bottom: 0px !important;}
.pt0 { padding-top: 0px !important;}
.pb0 { padding-bottom: 0px !important;}
.mt5 { margin-top: 5px !important;}
.mb5 { margin-bottom: 5px !important;}
.pt5 { padding-top: 5px !important;}
.pb5 { padding-bottom: 5px !important;}
.mt10 { margin-top: 10px !important;}
.mb10 { margin-bottom: 10px !important;}
.pt10 { padding-top: 10px !important;}
.pb10 { padding-bottom: 10px !important;}
.mt15 { margin-top: 15px !important;}
.mb15 { margin-bottom: 15px !important;}
.pt15 { padding-top: 15px !important;}
.pb15 { padding-bottom: 15px !important;}
.mt20 { margin-top: 20px !important;}
.mb20 { margin-bottom: 20px !important;}
.pt20 { padding-top: 20px !important;}
.pb20 { padding-bottom: 20px !important;}
.mt25 { margin-top: 25px !important;}
.mb25 { margin-bottom: 25px !important;}
.pt25 { padding-top: 25px !important;}
.pb25 { padding-bottom: 25px !important;}
.mt30 { margin-top: 30px !important;}
.mb30 { margin-bottom: 30px !important;}
.pt30 { padding-top: 30px !important;}
.pb30 { padding-bottom: 30px !important;}
.mt35 { margin-top: 35px !important;}
.mb35 { margin-bottom: 35px !important;}
.pt35 { padding-top: 35px !important;}
.pb35 { padding-bottom: 35px !important;}
.mt40 { margin-top: 40px !important;}
.mb40 { margin-bottom: 40px !important;}
.pt40 { padding-top: 40px !important;}
.pb40 { padding-bottom: 40px !important;}