@charset "UTF-8";
/* CSS Document */

/* contents */
#detail_27830 {
	position: relative;
	width: 100%;
	background: #FFF;
    color: #433836;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    font-size: 18px;
    line-height: 160%;
	text-align: left;
	overflow: hidden;
}

#detail_27830 img {
	display: block;
	margin: 0;
	border: 0;
	vertical-align: top;
}

#detail_27830 div,p {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

#detail_27830 dl,dt,dd,ol,ul,li {
	margin: 0;
	padding: 0;
}

#detail_27830 h2,h3,h4,h5,h6 {
	margin: 0;
	padding: 0;
}

#detail_27830 .italic {
	font-style: italic;
}

#detail_27830 .text-br01 {
	display: block;	
}

#detail_27830 .text-br02 {
	display: none;	
}

/*------ 共通パーツ ------*/
#detail_27830 .annotation {
	font-size: 12px;
	line-height: 160%;
}
#detail_27830 .annotation_small {
	font-size: 12px;
	line-height: 160%;
}
#detail_27830 .marker {
	background: linear-gradient(transparent 55%, #fff286 55%);
}
#detail_27830 .apply-btn {
	width: 90%;
	margin: 0 auto 30px;
}
#detail_27830 .apply-btn img {
	display: block;
	width: 100%;
	height: auto;
}
#detail_27830 .accent_green {
	color: #44815e;
}
#detail_27830 .accent_lime {
	color: #81862a;
}
#detail_27830 .accent_gold {
	color: #a88920;
}
#detail_27830 sup {
  font-size: 0.6em;
  vertical-align: super;
  line-height: 1;
}

/*------ 年齢とともに、体型の変化を感じていませんか？ ------*/
#detail_27830 .worry {
	background: #e6eaec;
}
#detail_27830 .worry-results {
	position: relative;
	width: 90%;
	margin: 20px auto 0;
	padding: 40px 30px 30px;
	border-radius: 10px;
	box-shadow: 0 0 30px 10px rgba(187, 198, 200, 0.3);
	background: #fff;
}
#detail_27830 .worry-results h3 {
	position: absolute;
	top: -20px;
	left: 50%;
	transform: translateX(-50%);
	width: 80%;
	height: auto;
}
#detail_27830 .worry-results .graph {
	margin: 15px auto;
}
#detail_27830 .worry .read {
	margin-top: -20px;
}

/*------ 茶花がすごい！ ------*/
#detail_27830 .chaka {
	margin-top: -80px;
	padding: 120px 30px 30px;
	background-color: #dedad7;
	background-image: url("../img/img_chaka.jpg");
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: center bottom -70px;
}
#detail_27830 .chaka h3 {
	width: 80%;
	height: auto;
	margin-bottom: 10px;
}
#detail_27830 .chaka p {
	width: 70%;
}
#detail_27830 .chaka p.annotation {
	margin-top: 10px;
}

/*------ チャカサポニンの3つの力 ------*/
#detail_27830 .benefits {
	position: relative;
	margin-bottom: 30px;
	padding-bottom: 25px;
	background: #f4f1ea;
}
#detail_27830 .benefits .chaka-illust {
	position: absolute;
	top: -25px;
	left: 70px;
	width: 120px;
	height: auto;
}
#detail_27830 .benefits_info {
	width: 90%;
	margin: 0 auto;
	padding: 30px;
	border-radius: 10px;
	box-shadow: 0 0 30px 10px rgba(218, 209, 186, 0.3);
	background: #fff;
}
#detail_27830 .benefits_info h4 {
	margin-bottom: 10px;
}
#detail_27830 .benefits_info .graph {
	margin: 15px auto 20px;
}
#detail_27830 .benefits_info2-3_wrapper {
	display: flex;
	flex-direction: column;
}
#detail_27830 .benefits_info2-3 {
	width: 100%;
}
#detail_27830 .benefits_info2-3 h4 {
	width: 50%;
}
#detail_27830 .benefits_info2-3 p {
	margin: 0 auto 15px;
}
#detail_27830 .benefits .annotation {
	width: 90%;
	margin: 20px auto 0;
}

/*------ 茶花の7つの働き ------*/
#detail_27830 .chaka-benefits {
	margin-bottom: 30px;
	padding: 30px 0 10px;
	background: url("../img/bg_chaka-benefits.jpg") repeat;
}
#detail_27830 .chaka-benefits h3 img {
	width: 90%;
	height: auto;
	margin: 0 auto;
}
#detail_27830 .chaka-benefits h5 img {
	width: 90%;
	margin: 30px auto 15px;
}
#detail_27830 .chaka-benefits .developer {
	width: 90%;
	margin: 35px auto 40px;
	padding: 30px 30px 0;
	background: #f4f1ea;
}
#detail_27830 .chaka-benefits .developer p {
	margin: 15px auto 10px;
}
#detail_27830 .chaka-benefits .developer .name {
	width: 80%;
}
#detail_27830 .chaka-benefits .developer .ishibashi {
	width: 60%;
	height: auto;
	margin: 0 auto;
}
#detail_27830 .chaka-benefits .annotation {
	width: 90%;
	margin: 0 auto;
	font-size: 22px;
	line-height: 160%;	
}
#detail_27830 .chaka-benefits_info {
	overflow: hidden;
	width: 90%;
	margin: 0 auto 20px;
	padding: 0 0 25px;
	border-radius: 10px;
	box-shadow: 0 0 30px 10px rgba(187, 198, 200, 0.3);
	background: #fff;
}
#detail_27830 .chaka-benefits_info p {
	width: 100%;
	margin: 0 auto;
}
#detail_27830 .chaka-benefits_txt1 {
	padding: 25px 30px 10px;
}
#detail_27830 .chaka-benefits_txt2 {
	padding: 25px 30px 20px;
}
#detail_27830 .chaka-benefits p.annotation1 {
	width: 90%;
	margin: 0 auto 20px;
}
#detail_27830 .chaka-benefits_info p.annotation2 {
	width: 100%;
	margin-bottom: 20px;
	padding: 0 30px;
	font-size: 12px;
	line-height: 160%;
	text-align: right;
}
#detail_27830 .chaka-benefits_info p.annotation3 {
	width: 100%;
	margin: 0 auto;
	padding: 0 30px;
	font-size: 12px;
	line-height: 160%;
}

/*------ スタッフの声 ------*/
#detail_27830 .staff-voice {
	background: #faf6e6;
	padding-bottom: 15px;
}
#detail_27830 .staff-voice_comment {
	display: flex;
  	align-items: center;
  	flex-direction: column;
	gap: 15px;
	width: 90%;
	margin: 0 auto 20px;
	padding: 25px 30px;
	border: 1px solid #433836;
  	box-shadow: 4px 4px 0 #f2eacb;
	background: #fff;
}
#detail_27830 .staff-voice_comment img {
	width: 60%;
	height: auto;
}
#detail_27830 .staff-voice .sp {
  	flex-direction: column-reverse;
}

/*------ お召し上がり方 ------*/
#detail_27830 .howto p {
	width: 85%;
	margin: 20px auto 30px;
}
