﻿@charset "utf-8";

.clr_box {
	zoom: 100%;
}

	.clr_box:after {
		content: "";
		clear: both;
		height: 0;
		display: block;
		visibility: hidden;
	}


#con_wrap {
	border-top: 1px solid #F0F0F0;
	background: url(/-/Media/com/contact/promotion/201603/products/common/images/bg01.gif) repeat left top;
	max-width: 940px;
	width: 940px;
	margin: 0 auto;
	padding: 0 0 28px 0;
}

#fvr_main {
	background: #fff;
	max-width: 840px;
	width: 840px;
	margin: 18px auto 0 auto;
}

	#fvr_main a {
		display: block;
		height: 420px;
		background-image: url(/-/Media/com/contact/promotion/202305/fresh-view-rm/main_fvr.png);
		background-repeat: no-repeat;
		background-position: center center;
		font-size: 20%;
		text-indent: -940px;
		overflow: hidden;
	}

#con_body {
	background: #fff;
	max-width: 840px;
	width: 840px;
	box-sizing: border-box;
	padding: 28px 0;
	margin: 0 auto 0 auto;
	color: #343426;
}

.pc_only {
	display: block;
}

@media screen and (max-width:768px) {
	#con_wrap {
		padding: 0 0 20px 0;
		width: auto;
	}

	#fvr_main {
		width: auto;
	}

		#fvr_main a {
			height: 0;
			padding: 0 0 50% 0;
			background-size: 100% 100%;
		}

	#con_body {
		padding: 20px 4.7%;
		width: auto;
	}

	.pc_only {
		display: none;
	}
}

#fvr_concept {
	margin: 0 38px 34px 38px;
}

	#fvr_concept h2 {
		margin-bottom: 10px;
		height: 0;
		padding-bottom: 5%;
		font-size: 20%;
		text-indent: -940px;
		overflow: hidden;
		background: url(/-/Media/com/contact/promotion/201806/fresh-view-rm/txt_01.png) no-repeat center center;
		background-size:contain
	}

	#fvr_concept p {
		font-size: 1.5rem;
		line-height: 1.8;
	}

		#fvr_concept p b {
			color: #004C9F;
		}



@media screen and (max-width:768px) {
	#fvr_concept {
		margin: 0 0 28px 0;
	}


}

@media screen and (max-width:480px) {
	#fvr_concept h2 {
		margin-bottom: 6px;
		padding-bottom: 16.8%;
		background: url(/-/Media/com/contact/promotion/201806/fresh-view-rm/txtsp_01.png) no-repeat center center;
		background-size: contain
	}

	#fvr_concept p {
		font-size: 1.4rem;
		line-height: 1.6;
	}
}

.fvr_exbox {
	margin: 0 38px 28px 38px;
}

	.fvr_exbox h3 {
		color: #ffffff;
		background: #004C9F;
		padding: 6px 0 4px 16px;
		font-size: 1.8rem;
		line-height: 1.2;
		margin-bottom: 0.75em;
		border-radius: 16px;
		-webkit-border-radius: 16px;
		-moz-border-radius: 16px;
	}

	.fvr_exbox h4 {
		font-size: 1.6rem;
		line-height: 1.2;
		color: #004C9F;
		font-weight: bold;
		padding: 14px 0 0.5em 22px;
		background: url(/-/Media/com/contact/promotion/201806/fresh-view-rm/pic01) no-repeat left top;
		background-size: auto 36px;
	}

	.fvr_exbox p {
		margin-left: 22px;
		line-height:1.8;
	}

		.fvr_exbox p + p {
			margin-top: 0.5em;
		}

		.fvr_exbox p b {
			color: #004C9F;
		}

	.fvr_exbox img {
		max-width:340px;
		float: right;
		margin: 0 0 1.5em 1em;
	}


p.fvr_lead {
	font-size: 1.5rem;
	line-height: 1.8;
}

.fvr_chap {
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.3;
}

.fvr_exbox p + p.fvr_chap {
	margin-top: 0.75em;
}

.f_left {
	width:48%;
	float:left;
	box-sizing:border-box;
}

.f_right {
	width:50%;
	float:right;
	box-sizing:border-box;
	border:1px solid #ccc;
	padding:0.7em 1.5em;
}

	.f_right h5 {
		font-size: 1.5rem;
		line-height: 1;
		margin: 0 0 0.4em 0;
		font-weight: bold;
		color: #004C9F;
		text-align:center;
		position:relative;
	}

	.f_right h5 span{
		display:inline-block;
		padding:0 1em;
		background:#fff;
		position:relative;
	}

		.f_right h5:before {
			content: "";
			display: block;
			width: 100%;
			height: 2px;
			background: #004C9F;
			position:absolute;
			margin:auto;
			top:0;
			bottom:0;
			left:0;
		}

	.f_right ul {
		margin: 0 -5px;
		zoom: 100%;
	}

		.f_right ul:after {
			content: "";
			clear: both;
			height: 0;
			display: block;
			visibility: hidden;
		}

		.f_right ul li {
			width:50%;
			box-sizing:border-box;
			padding:0 5px;
			float:left;
		}

			.f_right ul li dt {
				background: #004C9F;
				line-height:1;
				padding:4px;
				color:#fff;
				text-align:center;
				font-size:1.3rem;
				margin:0 0 0.4em 0;
				border-radius:10px;
			}

			.f_right ul li dd {
				font-size:1.3rem;
				line-height:1.4;
			}



@media screen and (max-width:768px) {
	.fvr_exbox {
		margin: 0 0 28px 0;
	}

		.fvr_exbox img {
			max-width: 45%;
		}

	.f_right ul {
		margin: 0;
		zoom: 100%;
	}

		.f_right ul li {
			width: auto;
			padding: 0;
			float: none;
		}
}

@media screen and (max-width:480px) {
	.fvr_exbox {
		margin: 0 0 20px 0;
	}

		.fvr_exbox h3 {
			font-size: 1.6rem;
		}

		.fvr_exbox h4 {
			font-size: 1.5rem;
		}

		.fvr_exbox img {
			float: none;
			margin: 0 auto 0.8em auto;
			max-width: 90%;
		}

		.fvr_exbox p {
			line-height: 1.6;
		}

	p.fvr_lead {
		font-size: 1.4rem;
		line-height: 1.6;
	}

	.fvr_chap {
		font-size: 1.1rem;
	}

	.f_left {
		width: auto;
		float: none;
		margin: 0 0 0.8em 0;
	}

	.f_right {
		width: auto;
		float: none;
		padding: 0.75em;
		margin-left: 22px;
	}

		.f_right h5 {
			font-size: 1.4rem;
		}

		.f_right ul li:first-child {
			margin-bottom:0.5em;
		}

		.f_right ul li dt {
			padding: 3px;
			font-size: 1.2rem;
			border-radius: 9px;
		}

		.f_right ul li dd {
			font-size: 1.2rem;
		}
}



#img01 {
	max-width: 250px;
}


#img02 {
	max-width:220px;
	margin-bottom:0;
}

#img02box {
	margin-bottom: 0;
}

@media screen and (max-width:768px) {
	#img01,
	#img02{
		max-width: 35%;
	}
}

@media screen and (max-width:480px) {
	#img01,
	#img02 {
		margin: 0 auto 0.8em auto;
		max-width: 90%;
	}

	#img02box {
		margin-bottom: 20px;
	}
}



#chu_iryokiki {
	border: 1px solid #ccc;
	background-color: #fff;
	padding: 18px 24px;
	box-sizing: border-box;
	max-width: 840px;
	margin: 28px auto 0 auto;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}

	#chu_iryokiki h4 {
		margin: 0 0 0.5em 0;
		line-height: 120%;
	}

	#chu_iryokiki p {
		font-size: 12px;
		font-size: 1.2rem;
		line-height: 1.3;
		margin: 0;
	}

@media screen and (max-width:768px) {
	#chu_iryokiki {
		padding: 3%;
		margin: 20px 4.7% 0 4.7%;
	}
}