/* CSS Document */

#main {
	text-align: left;
}
#main h2 {
	width: 1160px;
	height: 400px;
	margin: 0;
	padding: 0;
	position: relative;
}
#main h2:after {
	width: 100%;
	height: 100px;
	display: block;
    content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	background: url(../common/img/title_btm.png) center bottom no-repeat;
}

.intro {
	width: 980px;
	height: auto;
	margin: 0 auto;
	padding: 20px 0 50px 0;
}
.intro h3 {
	padding: 0 0 40px 0;
}
.intro h3 span {
	float: right;
	padding: 1px 0 0 0;
}
.intro h4 {
	padding: 0 0 30px 0;
	overflow: hidden;
}
.intro h4 img {
	padding: 0 0 5px 0;
}
.intro p {
	padding: 0;
}


.quality {
	width: 100%;
	height: auto;
	padding: 65px 0 60px 0;
	overflow: hidden;
	background: url(../common/img/bg_01.png) left top repeat;
}
.quality div {
	width: 980px;
	height: auto;
	min-height: 491px;
	overflow: hidden;
	margin: 0 auto 40px auto;
	background: url(../common/img/bg_09.png) left top no-repeat #FFF;
	-moz-box-shadow: 0 0 20px rgba(0,0,0,0.1);
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.1);
	box-shadow: 0 0 20px rgba(0,0,0,0.1);
	position: relative;
	z-index: 999;
}
.quality div:after {
	width: 980px;
	height: 30px;
	content: "";
	background: url(../common/img/bg_09_btm.png) left bottom no-repeat #FFF;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 0;
}
#main .quality img.item {
	position: absolute;
	right: 10px;
	top: 10px;
	z-index: 9999;
}
#main .quality h3 {
	margin: 0;
	padding: 70px 0 0 60px;
	text-align: left;
}
#main .quality h3 span {
	display: block;
	padding: 25px 0 0 0;
}
.quality h3:before, .quality h3:after {
	display: none;
}

#main .quality h4 {
	margin: 0;
	padding: 45px 0 30px 50px;
	text-align: left;
}
#main .quality p {
	padding: 0 0 0 60px;
}

#main .quality a.entry.white {
	width: 500px;
	height: 40px;
	display: block;
	text-align: center;
	margin: 0 auto;
	float: none;
	clear: both;
	background: url(../common/img/arrow_07.png) 92% center no-repeat #7A354B;
	box-shadow:rgb(212, 203, 206) 4px 4px 0px 0px;
	-webkit-box-shadow:rgb(212, 203, 206) 4px 4px 0px 0px;
	-moz-box-shadow:rgb(212, 203, 206) 4px 4px 0px 0px;
}
#main .quality a.entry.white:hover {
	background: url(../common/img/arrow_07.png) 92.5% center no-repeat #7A354B;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}
#main .quality a.entry.white img {
	padding: 10px 0;
}

#main .agree {
	width: 100%;
	height: auto;
	padding: 70px 0;
	overflow: hidden;
}
#main .agree h3 {
	width: 100%;
	height: auto;
	text-align: center;
	margin: 0 auto 40px auto;
	position: relative;
	background: url(img/agree_bg.png) center center no-repeat;
}
#main .agree h3 span {
	display: block;
	padding: 25px 0 0 0;
}
#main .agree h3:before, .agree h3:after {
	display: none;
}

#main .agree ul {
	width: 875px;
	height: auto;
	margin: 0 auto 70px auto;
	padding: 0 40px;
	box-sizing: content-box;
	overflow: hidden;
	position: relative;
	background: url(../common/img/bg_08.png) left top no-repeat #FFF;
	-moz-box-shadow: 0 0 20px rgba(0,0,0,0.1);
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.1);
	box-shadow: 0 0 20px rgba(0,0,0,0.1);
	z-index: 0;
}
#main .agree ul:after {
	width: 955px;
	height: 30px;
	content: "";
	display: block;
	background: url(../common/img/bg_08_btm.png) left bottom no-repeat #FFF;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 1;
}
#main .agree ul li {
	width: 50%;
	height: auto;
	margin: 30px 0 0 0;
	padding: 0 0 30px 0;
	overflow: hidden;
	border-right: #D7C2C9 solid 1px;
	float: left;
}
#main .agree ul li:first-child {
	margin: 30px 0 30px -1px;
	background: none;
	float: right;
	border: none;
}
#main .agree ul li:nth-child(2) {
	margin: 30px 0 -30px 0;
	border-bottom: #D7C2C9 solid 1px;
}
#main .agree ul li h4 {
	padding: 40px 38px 20px 0;
	text-align: center;
}
#main .agree ul li:first-child h4 {
	padding: 40px 0 20px 38px;
}
#main .agree ul li h4 img {
	padding: 0;
}
#main .agree ul li p {
	margin: 0 38px 20px 0;
	padding: 0 5px 2px 5px;
	line-height: 40px;
	text-align: left;
	background: url(../common/img/txt_bg4.png) left top repeat;
}
#main .agree ul li:first-child p {
	margin: 0 0 40px 38px;
}
#main .agree ul li span.cap {
    font-size: 10px;
    display: block;
    padding: 0 38px 0 0;
    line-height: 1.8em;
    background: none;
}

#main .agree ul li ol {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0 0 0 38px;
	box-sizing: border-box;
	background: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	counter-reset:number;
}
#main .agree ul li ol:after {
	display: none;
}
#main .agree ul li ol li, #main .agree ul li ol li:first-child, #main .agree ul li ol li:nth-child(2) {
	width: 100%;
	height: auto;
	margin: 0 0 20px 0;
	padding: 15px 20px;
	font-size: 11px;
	line-height: 1.8em;
	box-sizing: border-box;
	border: #D7C2C9 solid 1px;
	position: relative;
	float: none;
	clear: both;
}
ol li:before{
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	counter-increment: number;
	content: counter(number);
	color: #FFF;
	background: #7A354B;
	position: absolute;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
}
#main .agree ul li ol li h5 {
	font-size: 13px;
	padding: 0 0 5px 2em;
	color: #7A354B;
}


#main .agree h3.shop {
	width: 940px;
	height: auto;
	text-align: left;
	margin: 0 auto 30px auto;
	position: relative;
	background: none;
}
#main .agree h3.shop span {
	float: right;
	padding: 1px 0 0 0;
}

#main .agree ul.shop_list {
	width: 915px;
	height: auto;
	margin: 0 auto 40px auto;
	padding: 2% 20px;
}
#main .agree ul.shop_list li {
	width: 20%;
	height: 70px;
	margin: 0 0 0 -1px;
	padding: 42px 0 18px 0;
	overflow: hidden;
	float: left;
	text-align: center;
	background: none;
	border-left: #D7C2C9 solid 1px;
	border-right: none;
	border-bottom: none;
	display: table-cell;
	vertical-align: middle;
}
#main .agree ul.shop_list li:first-child {
	margin: 0;
	padding: 32px 0 7px 0;
	border: none;
}

.last_entry {
	width: 100%;
	height: auto;
	padding: 30px 0;
	min-height: 80px;
	overflow: visible;
	background: url(../common/img/bg_02.png) left top repeat;
}
.last_entry div {
	width: 900px;
	height: auto;
	margin: 0 auto;
	text-align: center;
	overflow: visible;
}
.last_entry p {
	color: #FFF;
	padding: 0 0 10px 0;
}
.last_entry a.entry {
	width: 500px;
	height: 40px;
	margin: 0 auto;
	display: block;
	background: url(../common/img/arrow_07.png) 92% center no-repeat #F6F4F5;
	text-align: center;
	box-shadow:rgb(64, 15, 27) 4px 4px 0px 0px;
	-webkit-box-shadow:rgb(64, 15, 27) 4px 4px 0px 0px;
	-moz-box-shadow:rgb(64, 15, 27) 4px 4px 0px 0px;
}
.last_entry a.entry:hover {
	background: url(../common/img/arrow_07.png) 92.5% center no-repeat #F6F4F5;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}
.last_entry a.entry img {
	padding: 10px 0;
}



/* Media Queries - Tablet */
@media (max-width: 800px) {
	
	#main h2 {
		width: 100%;
		height: auto;
		padding: 0;
	}
	#main h2:after {
		height: 30px;
	}
	#main h2 img {
		margin: 0 0 0 -45%;
	}
	
	.intro {
		width: 90%;
		margin: 0 5%;
	}
	.intro h3 {
		padding: 0 0 40px 0;
	}
	.intro h3 span img {
		width: auto;
		height: 30px;
		padding: 2.5px 0 0 0;
	}
	.intro p {
		padding: 0;
	}
	
	.quality div {
		width: 90%;
		min-height: 100px;
		margin: 0 5% 50px 5%;
		background-size: 100% auto;
	}
	.quality div:after {
		width: 100%;
		height: 50px;
		background-size: 100% auto;
	}
	#main .quality img.item {
		width: auto;
		height: 100%;
		right: -15%;
		top: 0;
	}
	#main .quality h3 {
		margin: 0 0 0 5%;
		padding: 50px 0 0 0;
		position: relative;
		z-index: 999999;
	}
	#main .quality h3 span {
		padding: 10px 0 0 0;
	}
	#main .quality h3 span img {
		height: 25px;
	}
	#main .quality h4 {
		padding: 20px 0 20px 4%;
		position: relative;
		z-index: 999999;
	}
	#main .quality h4 img {
		height: 60px;
	}
	#main .quality p {
		padding: 0 50% 50px 5%;
		position: relative;
		z-index: 999999;
	}
	#main .quality p br {
		display: none;
	}

	#main .quality a.entry {
		width: 90%;
		margin: 0 5% 60px 5%;
	}

	#main .agree {
		padding: 50px 0;
	}

	#main .agree ul {
		width: 90%;
		margin: 0 auto 50px auto;
		background-size: 100% auto;
		box-sizing: border-box;
	}
	#main .agree ul:after {
		width: 100%;
		height: 30px;
		background-size: 100% auto;
	}
	#main .agree ul li:last-child {
		padding: 20px 0 40px 0;
	}
	#main .agree ul li h4 {
		padding: 20px 28px 20px 0;
	}
	#main .agree ul li:first-child h4 {
		padding: 20px 0 20px 28px;
	}

	#main .agree ul li p br {
		display: none;
	}
	#main .agree ul li p {
		margin: 0 30px 20px 0;
	}
	#main .agree ul li:first-child p {
		margin: 0 0 30px 30px;
	}

	#main .agree h3.shop {
		width: 90%;
	}
	#main .agree ul li ol {
		padding: 0 0 0 28px;
	}

	#main .agree ul.shop_list {
		width: 90%;
		margin: 0 auto 20px auto;
		padding: 2%;
		background-size: 100% auto;
	}
	#main .agree ul.shop_list li {
		width: 33%;
		padding: 30px 0;
		border-bottom: #D7C2C9 solid 1px;
	}
	#main .agree ul.shop_list li:first-child {
		padding: 53px 0 7px 0;
		border-bottom: #D7C2C9 solid 1px;
	}
	#main .agree ul.shop_list li:nth-child(4), #main .agree ul.shop_list li:last-child {
		border-left: none;
		border-right: #D7C2C9 solid 1px;
		border-bottom: none;
	}

	.last_entry div {
		width: 90%;
	}
	.last_entry a.entry {
		width: 500px;
	}
	.last_entry a.entry img {
		width: auto;
		max-width: 70%;
	}
	
}

/* Media Queries - Small Tablet & Smartphone */
@media (max-width: 415px) {
	
	#main h2 {
		width: 100%;
		height: auto;
		padding: 0;
	}
	#main h2 img {
		width: 150%;
		left: -30%;
		position: relative;
		margin: 0;
	}
	
	.intro {
		padding: 20px 0 30px 0;
	}
	.intro h3 {
		padding: 0 0 20px 0;
	}
	.intro h3 span {
		display: block;
		padding: 0;
	}
	.intro h3 img {
		width: auto;
		height: 18px;
	}
	.intro h3 span img {
		width: auto;
		height: 17px;
	}
	.intro h4 {
		padding: 10px 0 15px 0;
	}
	.intro h4 img {
		width: auto;
		height: 17px;
	}
	.intro p br.pc {
		display: none;
	}
	
	.quality {
		padding: 40px 0 30px 0;
	}
	.quality div {
		padding: 0 0 50% 0;
		margin: 0 5% 30px 5%;
	}
	#main .quality img.item {
		width: 120%;
		height: auto;
		right: 0;
		top: initital;
		top: auto;
		bottom: -25%;
	}
	#main .quality h3 {
		width: 84%;
		margin: 30px 8% 5px 8%;
		padding: 0;
	}
	#main .quality h3 img {
		width: auto;
		height: 22px;
	}
	#main .quality h3 span {
		padding: 5px 0 0 0;
	}
	#main .quality h3 span img {
		width: auto;
		height: 19px;
	}
	#main .quality h4 {
		padding: 10px 0;
	}
	#main .quality h4 img {
		width: 90%;
		height: auto;
		margin: 0 5%;
	}
	#main .quality p {
		padding: 0 8% 30px 8%;
	}

	#main .quality a.entry.white {
		width: 90%;
		height: auto;
		line-height: 0;
	}
	#main .quality a.entry.white img {
		width: 65%;
		padding: 10px 20% 10px 15%;
	}


	#main .agree {
		padding: 30px 0 0 0;
	}
	#main .agree h3 {
		width: 90%;
		margin: 0 auto;
		background-size: 100% auto;
	}
	#main .agree h3 img {
		width: auto;
		height: 22px;
	}
	#main .agree h3 span {
		padding: 5px 0 20px 0;
	}
	#main .agree h3 span img {
		width: auto;
		height: 17px;
	}
	
	#main .agree ul {
		margin: 0 auto 40px auto;
		padding: 10px 0 0 0;
	}
	#main .agree ul li, #main .agree ul li:first-child, #main .agree ul li:nth-child(2), #main .agree ul li:last-child {
		width: 90%;
		margin: 20px 5% 0 5%;
		padding: 0 0 30px 0;
		border: none;
		border-bottom: #D7C2C9 solid 1px;
	}
	#main .agree ul li h4, #main .agree ul li:first-child h4 {
		margin: 0;
		padding: 10px 0;
	}
	#main .agree ul li h4 img {
		width: auto;
		height: 17px;
	}
	#main .agree ul li p br {
		display: none;
	}
	#main .agree ul li p, #main .agree ul li:first-child p {
		margin: 0 5%;
		padding: 0 5px;
	}
	#main .agree ul li span.cap {
		padding: 0 5%;
	}
	#main .agree ul li ol {
		margin: 10px 0 -15px 0;
		padding: 0 5%;
	}
	#main .agree ul li ol li, #main .agree ul li ol li:first-child, #main .agree ul li ol li:nth-child(2) {
		margin: 0 0 15px 0;
	}

	#main .agree h3.shop {
		margin: 0 auto 20px auto;
	}

	#main .agree ul.shop_list {
		width: 90%;
		padding: 1% 5%;
	}
	#main .agree ul.shop_list li, #main .agree ul.shop_list li:nth-child(4), #main .agree ul.shop_list li:first-child, #main .agree ul.shop_list li:last-child {
		width: 100%;
		height: auto;
		margin: 0 0 0 -1px;
		padding: 30px 0;
		border: none;
		border-bottom: #D7C2C9 solid 1px;
	}
	#main .agree ul.shop_list li br.sp_none {
		display: none;
	}

	.last_entry p {
		text-align: left;
	}
	.last_entry a.entry {
		width: 100%;
		height: auto;
		line-height: 0;
		margin: 0 0 10px 0;
	}
	.last_entry a.entry img {
		width: 65%;
		padding: 10px 20% 10px 15%;
	}
	
}

/* Media Queries - Small Smartphone */
@media (max-width: 320px) {
	
	.intro h4 img {
		height: 16px;
	}
	
}