@charset "utf-8";
@import url("/css/pages.css");
/* general_construction.css */
/*PC first*/
/*##### PC #####*/
.content_title .content_title_img{
	background: url(/shared/content_title/customer_voice_img.jpg) no-repeat left top;
}

.mainContentsBox{
	width:920px;
	margin:0 auto;
}

	.mainContentsBox .listBox{
		padding: 0 0 0;
	}
	
		.mainContentsBox .listBox > .box_header{
			margin-bottom:40px;
		}
		
			.mainContentsBox .listBox > .box_header p{
				width:100%;
				padding:18px 0;
				text-align:center;
				border-top:1px dotted #000;
				border-bottom:1px dotted #000;
			}
			
		.mainContentsBox .listBox > .box_inner{
			
		}
		
			.mainContentsBox .listBox > .box_inner ul li{
				padding:10px 0 10px 0;
				border-bottom:1px dotted #999999;
			}
			
			.mainContentsBox .listBox > .box_inner ul li:first-child{
				border-top:1px dotted #999999;
			}
			
			.mainContentsBox .listBox > .box_inner ul li:last-child{
				margin-bottom:0;
			}
			
				.mainContentsBox .listBox > .box_inner ul li a{
					display:flex;
					color:#000000;
					padding:20px;
					
				}
				
				.mainContentsBox .listBox > .box_inner ul li a:hover{
					background-color:#fff9e5;
				}
				
			.mainContentsBox .listBox > .box_inner ul li a span{
				display:block;
			}
				
				.mainContentsBox .listBox > .box_inner ul li a span.voice_img{
					
				}
				
					.mainContentsBox .listBox > .box_inner ul li a span.voice_img img{
						display: block;
						width:280px;
					}
				
				.mainContentsBox .listBox > .box_inner ul li a span.voice_text{
					box-sizing: border-box;
					width: calc(100% - 280px);
					padding:1em 0 0 50px;
				}
					
					.mainContentsBox .listBox > .box_inner ul li a span.voice_title{
						font-size: 1.5em;
						line-height: 1.5;
						margin-bottom:0.8em;
					}
					
					.mainContentsBox .listBox > .box_inner ul li a span.voice_keywords{
						display:flex;
						margin-bottom:1em;
						font-size: 1.1em;
						line-height: 1.2;
					}
					
						.mainContentsBox .listBox > .box_inner ul li a span.tag{
							background: #ffe699;
							padding: 0.4em 1em 0.4em 1em;
							border-radius: 4px;
							margin-right: 0.5em;
						}
						
						.mainContentsBox .listBox > .box_inner ul li a span.tag:last-child{
							margin-right:0;
						}
						
					.mainContentsBox .listBox > .box_inner ul li a span.voice_customer_name{
						font-size:1.1em;
						line-height: 1.1;
						text-align:right;
					}
					
						.mainContentsBox .listBox > .box_inner ul li a span.voice_customer_name:before{
							content:"（";
						}
						
						.mainContentsBox .listBox > .box_inner ul li a span.voice_customer_name:after{
							content:"）";
						}
						
						

@media screen and (max-width:480px){
/*##### SP #####*/
	.content_title .content_title_img{
		background-size:contain;
		background-position:left center;
	}
	
	.mainContentsBox{
		width:auto;
	}
	
	.mainContentsBox .listBox > .box_inner ul li{
		padding:3vw 0 3vw 0;
	}
	
	.mainContentsBox .listBox > .box_inner ul li a{
		display:block;
		padding: 3vw;
	}
	
	.mainContentsBox .listBox > .box_inner ul li a span.voice_img{
		margin-bottom:3vw;
	}
	
	.mainContentsBox .listBox > .box_inner ul li a span.voice_img img{
		max-width:75%;
		height:auto;
		margin: 0 auto;
	}
	
	.mainContentsBox .listBox > .box_inner ul li a span.voice_text{
		width:100%;
		padding-left:0;
	}
	
	.mainContentsBox .listBox > .box_inner ul li a span.voice_title{
		font-size:4.3vw;
		margin-bottom:2vw;
	}
	
	.mainContentsBox .listBox > .box_inner ul li a span.voice_keywords{
		font-size:3.5vw;
		margin-bottom:2vw;
	}
	
	.mainContentsBox .listBox > .box_inner ul li a span.tag{
		padding:2vw 3vw 2vw 3vw;
	}
	
	.mainContentsBox .listBox > .box_inner ul li a span.voice_customer_name{
		font-size:3.3vw;
	}

}