﻿@charset "UTF-8";

/* eyecare detail style
-------------------------------------*/
#main {	
	background: url("/~/Media/coco/common/image/eyecare_bg.png") repeat scroll left top;
	background-size: 30px auto;
	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;
		}

.quote {
	border: 4px solid #adcbe7;
	margin: 0 auto 40px;
	padding: 40px 30px;
	}		
	.quote_box {
		overflow: hidden;
		width: 100%;
		}		
		.quote .quote_img {
			width: 46%;
			margin-right: 4%;
			float: left;
			}
		.quote .quote_img_t25 {
			width: 25%;
			margin-right: 4%;
			float: left;
			}	
	.quote_txt {
		overflow: hidden;
		margin-bottom: 30px;
		display: block;
		font-size: 16px;
		}		
			
					
		
	.quote_txt_l {
		overflow: hidden;
		margin-bottom: 30px;
		float: left;
		width: 70%;
		margin-right: 5%;
		}		
	.quote_txt_r {
		overflow: hidden;
		margin-bottom: 30px;
		float: right;
		width: 70%;
		margin-left: 5%;
		}		
		
		.quote .quote_img02 {
			width: 25%;
			float: left;
			}
		.quote .quote_img02_r {
			width: 25%;
			float: right;
			}
			
			
		.quote .quote_img02.w_60 > img {
			width: 60%;
			margin: 0 15%;
			}
		.quote .quote_img02.w_90 > img {
			width: 90%;
			margin: 0 5%;
			}
			
.red {color: #cc0000;}	
.p_txt {
	font-size: 16px;
	}
.s_title {
	font-size: 16px;
	margin-bottom: 10px;
	}	
	
.quoted {
    color: #8c8985;
    font-size: 16px;
    }
.quoted::before { content: "ー";}	
.quoted a {
    color: #8c8985;
    text-decoration: underline;
    }
    
.midashi_n {
    font-size: 20px;
    margin-bottom: 10px;
	}
	
/* ▼▼▼ 1000px
=====================================*/
@media screen and (max-width: 1000px) {


}	


/* ▼▼▼ 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;
		}
				
				
.quote {
	border: 2px solid #adcbe7;
	margin: 0 auto 40px;
	padding: 30px 20px;
	}		
	.quote_box {
		overflow: hidden;
		margin-bottom: 20px;
		width: 100%;
		}		
		.quote .quote_img {
			width: 100%;
			margin: 0 0 10px 0;
			float: none;
			}
		.quote .quote_img_t25 {
			width: 100%;
			margin: 0 0 10px 0;
			float: none;
			}	
	.quote_txt {
		overflow: hidden;
		margin-bottom: 0;
		display: block;
		font-size: 4.37vw;
		}		
	.quote_txt_l {
		overflow: hidden;
		margin-bottom: 10px;
		float: none;
		width: 100%;
		margin-right: 0;
		}		
	.quote_txt_r {
		overflow: hidden;
		margin-bottom: 10px;
		float: none;
		width: 100%;
		margin-left: 0;
		}		
		
		.quote .quote_img02 {
			width: 100%;
			float: none;
			text-align: center;
			}
		.quote .quote_img02_r {
			width: 100%;
			float: none;
			text-align: center;
			}
		.quote .quote_img02 > img,
		.quote .quote_img02_r > img {
			width: 70%;
			margin: 0 15%;
		}
			
			
		.quote .quote_img02.w_60 > img {
			width: 40%;
			margin: 0 30%;
			}
		.quote .quote_img02.w_90 > img {
			width: 50%;
			margin: 0 25%;
			}
		
.p_txt {
	font-size: 4.37vw;
	}
.s_title {
	font-size: 4.37vw;
	margin-bottom: 10px;
	}	
	
.quoted {
    color: #8c8985;
	font-size: 4.37vw;
    }
.quoted::before { content: "ー";}	
.quoted a {
    color: #8c8985;
    text-decoration: underline;
    }
    
.midashi_n {
    font-size: 4.37vw;
    margin-bottom: 10px;
	}

			

}









		