@charset "utf-8";

/* 共通 */
.sp4{
	padding-left: 4rem;
}
.mb1em{
	margin-bottom: 1em;
}

ul.disc > li{
	list-style-type: disc;
	list-style-position: inside;
}

#content_link{
  display: flex;
  justify-content: center;
  margin: 0 0 50px 0;
}

#content_link li:last-child{
  margin-right: 0;
}
 
/* アユールトップ・シャンプー・オイルのページ */
.top-title{
	font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	border-left: 20px solid #eee7dc;
	font-size: 37px;
	padding-left: 26px;
	margin-bottom: 45px;
}

.ayuru-image{
	margin-bottom: 80px;
}

.content .content-inner{
	padding: 0 50px;
}

.content .content-title{
	font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	font-size: 37px;
	line-height: 1.5;
}

.content .content-title-sub{
	font-size: 22px;
	margin-bottom: 80px;
}

.content .title02{
	font-size: 34px;
	text-align: center;
	margin-bottom: 20px;
}

.content .title02.ribbon{
	background-image: url(/product/ayuru/images/ribbon.png);
	background-repeat: no-repeat;
	background-position: center bottom 0px;
	padding-bottom: 10px;
}

.content .title02-sub{
	font-size: 18px;
	text-align: center;
	margin-bottom: 24px;
}

.content.howto-use{
	margin-top: 93px;
}

.content.howto-use .howto-use-title{
	font-size: 34px;
	text-align: center;
}

.content.howto-use .sub-title{
	font-size: 18px;
	text-align: center;
	margin-bottom: 32px;
}

.content.howto-use .inner{
	background-color: #cfe8e5;
	padding: 50px 29px;
}

.content.howto-use.howto-use-oil .inner{
	background-color: #e8efc1;
}

.content.howto-use .inner .movie{
	margin-bottom: 50px;
}

/* .content.howto-use .inner .movie .movie-title{
	font-size: 24px;
	text-align: center;
} */

.content.howto-use .inner .movie .movie-frame{
	float: left;
	margin: 0 auto;
}

.content.howto-use .inner .movie .movie-frame iframe{
	display: block;
	margin: 0 auto;
}

.content.howto-use .inner .movie .bottole-set{
	float: right;
	width: 303px;
	/* height: 254px; */
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 110px auto;
	padding-top: 150px;
	margin-right: 20px;
}

.content.howto-use .inner .movie .bottole-set.shampoo{
	background-image: url(/product/ayuru/shampoo/images/bottole-set.png);
}

.content.howto-use .inner .movie .bottole-set.oil{
	background-image: url(/product/ayuru/oil/images/oil-series.png);	
}

 .content.howto-use .inner .movie .bottole-set .bottole-set-title{
	font-size: 22px;
	margin-bottom: 20px;
} 

.content.howto-use .inner .movie .bottole-set .bottole-set-capacity{
	font-size: 11px;
	margin-bottom: 20px;
}

.content.howto-use .inner .movie .bottole-set .bottole-set-text{
	 font-size: 14px; 
	 /*width: 254px;*/ 
}

.content.howto-use .inner .use-when{
	margin-top: 40px;
}

.content.howto-use .inner .use-when h5{
	font-size: 18px;
	line-height: 2;
}

.content.howto-use .inner .use-when .use-when-block{
	float: left;
	width: 50%;
}

.content.howto-use .inner .use-when ol,
.content.howto-use .inner .use-when ul{
	font-size: 16px;
	margin-bottom: 1.2em;
}

.content.howto-use .inner .use-when ul{
	margin-left: 1em;

}

.content.howto-use .inner .use-when ul > li{
	text-indent: -1.2em;
}

.content.howto-use .inner .use-when ol > li,
.content.howto-use .inner .use-when ul > li{
	line-height: 1.5;
}

.procuct-information{
	margin-bottom: 85px;
}

.procuct-information .procuct-information-title{
	text-align: center;
	font-size: 22px;
}

.procuct-information .prod-item{
	font-size: 29px;
	text-align: center;
	margin-bottom: 20px;
}

.procuct-information .prod-item:before{
	content: '';
	display: inline-block;
	background-image: url(/product/ayuru/images/icon.png);
	background-repeat: no-repeat;
	background-position: 0 center;
	width: 38px;
	height: 34px;
	margin-right: 10px;
}

.procuct-information .product-information-content{
	box-sizing: border-box;
	width: 50%;
	float: left;
	padding: 0 8px;
}

.procuct-information .product-information-content .product-information-content-inner{
	box-sizing: border-box;
	width: 404px;
	background-color: #eee7db;
	padding: 22px 28px 10px;
	margin-left: auto;
	margin-right: auto;

}

.procuct-information .product-information-content img.left{
	float: left;
}

.procuct-information .product-information-content .info-text{
	padding-left: 100px;
	margin-bottom: 20px;
}

.procuct-information .product-information-content .prod-title-sub{
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 10px;
}
.procuct-information .product-information-content .prod-title{
	font-size: 15px;
}

.procuct-information.oil .product-information-content .prod-title{
	font-size: 20px;
	margin-bottom: 24px;
}

.procuct-information.oil .product-information-content .oil-price{
	font-size: 16px;
}

.procuct-information .product-information-content iframe{
	margin-bottom: 20px;
}

.ayuru-price{
	margin-top: 10px;
}

.ayuru-price dt,
.ayuru-price dd{
	float: left;
}

.ayuru-price dt{
	width: 95px;
}

.button-list li:first-child{
	margin-bottom: 10px;
}

.description{
	background-repeat: no-repeat;
	margin-top: 55px;
}

.description.herb-description{
	background-image: url(/product/ayuru/images/description-bg.jpg);
}

.description.shampoo-description{
	background-image: url(/product/ayuru/shampoo/images/description-bg.png);
}

.description.oil-description{
	background-image: url(/product/ayuru/oil/images/description-bg.png);
}

.description .description-inner{
	font-size: 17px;
	line-height: 2.0;
	width: 428px;
	margin-left: 10px;
}

.content.content02{
	border: 4px solid #c7b088;
	margin-top: 40px;
}
.content.content02 > .inner{
	background-color: #eee7db;
	padding-top: 40px;
	margin: 14px 9px;
}

.content.content02 .content02-title{
	font-size: 29px;
	text-align: center;
	margin-bottom: 25px;
}

.content.content02 .herb-list{
	width: 906px;
	background-image: url(/product/ayuru/images/ayuru-herb-list-bg.jpg);
	background-repeat: no-repeat;
	background-position: center bottom 20px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 120px;
}

.content.content02 .herb-list ul{
	float: left;
	width: 50%;
}

.content.content02 .herb-list li{
	font-size: 13px;
	line-height: 2.0;
}

.content.content03{
	margin-top: 100px;
}

.content.content03 .series-frame{
	position: relative;
	background-image: url(/product/ayuru/images/series-frame-bg.png);
	height: 418px;
	background-repeat: no-repeat;
}
.content.content03 .series-frame ul{
	position: absolute;
	top: 40px;
	left: 80px;
	/* padding: 40px 0 10px 80px; */
}

.content.content03 .series-frame ul li{
	background-image: url(/product/ayuru/images/icon.png);
	background-repeat: no-repeat;
	font-size: 29px;
	padding-left: 2em;
	margin-bottom: 36px;
}

.content.content03 .series-frame li > p{
	font-size: 13px;
}

.content.content04{
	width: 848px;
	margin: 0 auto 67px;
	/*margin-top: 53px;*/
}

.content.content04 .title02{
	margin: 50px 0 0 0;
}

.content.content04 ul{
	/* width: 848px; */
	background-image: url(/product/ayuru/images/content04-bg.png);
	background-repeat: no-repeat;
	background-position: center top;
	padding: 20px 0 35px;
	margin: 0 auto;
}

.content.content04 ul li{
	box-sizing: border-box;
	float: left;
	border-radius: 10px;
	color: #ffffff;
	background-color: #c7b088;
	text-align: center;
	font-size: 24px;
	line-height: 2.0;
	width: 404px;
	padding: 0 10px;
	margin-bottom: 20px;
	/* margin: 0 3% 20px; */
}

.content.content04 ul li:nth-child(2n){
	float: right;
}

.content.content04 ul li:nth-child(n+3){
	margin-bottom: 0;
}

.content.content04 .customer-voice{
	/* width: 848px; */
	margin: 34px auto 0;
}

.content.content04 .customer-voice dl{
	float: left;
	width: 45%;
	margin-right: 5%;
}

.content.content04 .customer-voice dt{
	font-size: 18px;
	margin-bottom: 16px;	
}

.content.content04 .customer-voice .age-gender{
	font-size: 14px;
}

.content.content04 .customer-voice .rate{
	color: #ffcc33;
}

.content.content04 .customer-voice .use-type{
	font-size: 10px;
}

.content.content04 .customer-voice .voice{
	font-size: 14px;
}

.content.content04 .contact-information{
	text-align: right;
	margin-top: 55px;
}

.content.content04 .contact-information a{
	font-size: 13px;
}

.content.content04 .contact-information a:first-child{
	margin-right: 42px;
}

.content.content04 .contact-information a:after{
	content: '';
	background-image: url(/product/images/icon_qa_navi.gif);
	background-repeat: no-repeat;
	background-position: right 0.2em;
	display: inline-block;
	width: 10px;
	height: 14px;
}

.content.content04 .contact-information a:hover{
	color: #60b3a4;
}

.content.content05{
	background-color: #eee7db;
	padding: 46px 0;
	margin-bottom: 60px;
}

.content.content05 .procuct-information{
	margin-bottom: 0;
}

.shampoo-items{
	margin-bottom: 89px;
}

.shampoo-item{
	float: left;
	box-sizing: border-box;
	width: 32%;
}

.shampoo-item:nth-child(2){
	margin: 0 2%;
}

.shampoo-item .item-frame{
	padding: 20px 15px;
	margin-bottom: 12px;
}

.shampoo-item .item-frame img{
	margin: 0 auto 33px;
}

.shampoo-item .item-frame.light{
	background-color: #d7ebdd;
}

.shampoo-item .item-frame.normal{
	background-color: #f0e8c7;
}

.shampoo-item .item-frame.mildly{
	background-color: #f7e4e3;
}

.shampoo-item .shampoo-title{
	text-align: center;
	font-size: 33px;
	margin-bottom: 24px;
}

.shampoo-item .sub-title{
	text-align: center;
	font-size: 25px;
	margin-bottom: 20px;
}
.shampoo-item .text{
	font-size: 15px;
	text-align: justify;
}

/* よくある質問(Q&A) */
#qa_list dt:first-child {
	margin-top: 0;
}
#qa_list dt {
	cursor: pointer;
	margin-top: 45px;
}

#qa_list dt:hover{
	color: #60b3a4;
}

#qa_list dd {
	display: none;
	margin-bottom: 0;
}

#qa_list dd p{
	margin-bottom: 1em;
}

#qa_block .title,
#voice_block .title {
	font-size: 20px;
	font-weight: bold;
	line-height: 60px;
	padding-left: 50px;
	background-repeat: no-repeat;
	background-position: 0 center;
	margin-bottom: 50px;
}

#voice_block .title{
	margin-left: -50px;
}

#qa_block #shampoo.title,
#voice_block #shampoo.title {
	background-image: url(/product/ayuru/qa/images/h3_shampoo.gif);
}

#qa_block #oil.title,
#voice_block #oil.title{
	background-image: url(/product/ayuru/qa/images/h3_oil.gif);
}

#ayuru .qa .link,
#ayuru .voice .link{
	position: relative;
	text-align: right;
	margin: 45px 0 60px;
}

/* ie対応 */
#footer{
	margin-top: 50px;
}