@charset "UTF-8";

/* ▼▼▼ skincare detail style
=====================================*/
#main {	
	background: url("/~/Media/coco/common/image/skincare_bg.png") repeat scroll left top;
	background-size: 30px;
	overflow: hidden;
	padding-bottom: 50px;
	width: 100%;
	}	
	#main #main_inner {	
		overflow: hidden;
		position: relative;
		background: none;
		width: 100%;
		max-width: 1000px;
		}
#contents {
	width: 70%;
	float: left;
	overflow: hidden;
	}
	#contents_inner {
		width: 100%;
		background-color: #fff;
		padding: 35px;
		}

#contents .dr_info {
	overflow: hidden;
	margin-bottom: 30px;
	} 	
	#contents .dr_info .dr_img {
		float: left;
		width: 11%;
		margin-right: 2.5%;
		}
	#contents .dr_info .dr_name {
		font-size: 17px;
		}
		#contents .dr_info .dr_name span {
			font-size: 16px;
			font-weight: bold;
			}

	#contents .img_side li:last-child {margin-top: 40px;}

/* introduction */		
#contents .introduction {
	overflow: hidden;
	clear: both;
	}
	#contents .i_photo {
		width: 40%;
		margin-right: 4%;
		float: left;
		}
	#contents .txt_box02 {
		display: block;
		overflow: hidden;
		position: relative;
		}
#contents .btn_purchase {
	width: 300px;
	margin: 0 auto 40px;
	}
	
	
/* interview_area */
	#contents .interview_area {
		overflow: hidden;
		clear: both;
		margin-bottom: 50px;
		}	
		#contents .interview_area .interview_photo01 {
			float: left;
			width: 35%;
			margin-right: 5%;
			}
		#contents .interview_area .interview_photo02 {
			float: left;
			width: 35%;
			margin-left: 5%;
			}
			
		#contents .interview_area .interview_read02 {
			float: left;
			width: 60%;
			font-size: 16px;
			line-height: 1.8;
			}
		#contents .interview_area .interview_read {
			font-size: 16px;
			line-height: 1.8;
			}
			


#contents .quote {
    border: 4px solid #adcbe7;
    margin: 0 auto 40px;
    padding: 40px 30px;
    overflow: hidden;
	}
#contents .quote > p:last-child {margin-bottom: 0;}
.img_r {
	float: right;
	margin: 0 0 10px 20px;
	width: 30%;
	}
			
/* アンケート */
.questionnaire {
	overflow: hidden;
	margin-bottom: 10px;
	}		
	.questionnaire dt {
		width: 18%;
		background: #e3f0f1;
		color: #58917c;
		font-weight: bold;
		text-align: center;
		line-height: 1.4;
		padding: 5px 0;
		float: left;
		margin: 0 2% 0 0;
		font-size: 16px;
		}
	.questionnaire dd {
		padding: 5px 0;
		font-size: 16px;
		}
		
		
/* youtube */	
#video {
    padding-top: 56.25%;
    position: relative;
    width: 100%;
    margin: 0 auto 20px;
	}
	#video iframe {
	    height: 100%;
	    position: absolute;
	    right: 0;
	    top: 0;
	    width: 100%;
		}

/*画像表示用*/
.img_pare02{
	margin:0 auto 30px;
	width: 60%;
	letter-spacing: -1em;
	}

.img_pare02 p{
	display: inline-block;
	width: 50%;
	letter-spacing: normal;
	}
.img_pare02 p img{
	width: 100%;
	height: auto;
}


/* ▼▼▼ 768px
=====================================*/
@media screen and (max-width: 768px) {

#main {	
	overflow: hidden;
	padding-bottom: 0;
	width: 100%;
	}	

#main_inner {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	}

#contents {
	width: 100%;
	float: none;
	margin: 20px auto 0;
	overflow: hidden;
	}
#contents_inner {
	width: 90.6vw;
	background-color: #fff;
	padding: 20px;
	margin: 0 auto;
	}
	
#contents .dr_info {
	overflow: hidden;
	margin-bottom: 20px;
	} 	
	#contents .dr_info .dr_img {
		float: left;
		width: 25%;
		margin-right: 3%;
		}
	#contents .dr_info .dr_name {
		font-size: 4.06vw;
		}
		#contents .dr_info .dr_name span {
			font-size: 3.75vw;
			font-weight: bold;
			}
	
/* introduction */		
#contents .introduction {
	overflow: hidden;
	clear: both;
	}
	#contents .i_photo {
		width: 100%;
		margin: 0 0 10px 0;
		float: none;
		}
	#contents .txt_box02 {
		display: block;
		overflow: hidden;
		position: relative;
		}

#contents .btn_purchase {
	width: 90%;
	margin: 0 auto 20px;
	}

/* interview_area */
	#contents .interview_area {
		margin-bottom: 30px;
		}	
		#contents .interview_area .interview_photo01 {
			float: none;
			width: 100%;
			margin: 0 0 10px 0;
			}
		#contents .interview_area .interview_photo02 {
			float: none;
			width: 100%;
			margin: 0;
			}
			
		#contents .interview_area .interview_read02 {
			float: none;
			width: 100%;
			font-size: 4.06vw;
			margin: 0 0 10px 0;
			}
		#contents .interview_area .interview_read {
			font-size: 4.06vw;
			}

#contents .quote {
    border: 2px solid #adcbe7;
    margin: 0 auto 40px;
    padding: 30px 20px;
	}

#contents .quote > p:last-child {margin-bottom: 0;}
.img_r {
	float: none;
	margin: 0 0 10px 0;
	width: 100%;
	}


/* アンケート */
.questionnaire {
	overflow: hidden;
	margin-bottom: 10px;
	}		
	.questionnaire dt {
		width: 100%;
		background: #e3f0f1;
		color: #58917c;
		font-weight: bold;
		text-align: center;
		line-height: 1.4;
		padding: 5px 0;
		float: none;
		margin: 0 2% 0 0;
		font-size: 4.06vw;
		}
	.questionnaire dd {
		padding: 5px 0 0;
		font-size: 4.06vw;
		}

.sp_no {display: none;}
	
	
/*画像表示用*/
.img_pare02{
	margin:0 auto 20px;
	width: 100%;
	letter-spacing: -1em;
	}


}