@charset "utf-8";

#headline .text {
	margin: 0 0 55px;
	color: #a78237;
	font-size: 24px;
	letter-spacing: .5em;
	text-align: center;
}

#headline {
    font-size: 14px;
    line-height: 2.286;
    text-align: center;
}

.sNav {
	text-align: center;
}
.sNav li {
	display: inline-block;
	margin: 0 0 0 56px;
}
.sNav li:first-child {
	margin: 0;
}
.sNav a,
.sNav strong {
	display: inline-block;
	padding:  15px 24px 30px;
	position: relative;
	font-size: 15px;
	font-weight: normal;
	text-decoration: none;
	line-height: 1;
	transition: 0.5s;
}
.sNav a:hover,
.sNav strong {
	color: #a78237;
}
.sNav a:after,
.sNav strong:after {
	content: '';
	display: block;
	width: 100%;
	height: 2px;
	position: absolute;
	left: 0;
	bottom: 0;
	background: #a78237;
	transform: scaleX(0);
	transition: 1s;
}
.sNav a:hover:after,
.sNav strong:after {
	transform: scaleX(1);
}
#headline .title {
	margin: 100px 0 0;
	padding: 70px 0 0;
	background-image: url(../imgs/quality/bg-headline.jpg);
}
#headline.noimage .title {
	height: auto;
	background: none;
	box-shadow: none;
	margin: 0;
	padding: 0;
}
#headline.safety .title {
	background-image: url(../imgs/safety/bg-headline.jpg);
}
#headline.health .title {
	background-image: url(../imgs/health/bg-headline.jpg);
}
#headline.ecology .title {
	background-image: url(../imgs/ecology/bg-headline.jpg);
}
#headline.future .title {
	background-image: url(../imgs/future/bg-headline.jpg);
}
#headline.trust .title {
	background-image: url(../imgs/trust/bg-headline.jpg);
}
#headline.noimage .title {
	height: auto;
	background: none;
	box-shadow: none;
	margin: 0;
	padding: 0;
}

#original {
	margin-top: 80px;
}

section .wrap {
	padding-top: 100px;
	padding-bottom: 90px;
}
section + section .wrap {
	border-top: 1px solid #d2d2d2;
}

#section02 .kakomi {
	padding: 50px;
}

.panelWrapper + .panelWrapper {
	margin-top: 30px;
}
.panel2 .panel {
	box-sizing: border-box;
	width: 48.5%;
	margin: 0 0 0 3%;
	float: left;
	position: relative;
}
.panel2 .panel.fr {
	float: right;
	margin: 0 0 0 3.2%;
}
.panel3 .panel {
	box-sizing: border-box;
	width: 31.3%;
	margin: 0 0 0 3.05%;
	float: left;
	position: relative;
}
.panel2 .panel:first-child,
.panel2 .panel.fr + .panel,
.panel3 .panel:first-child,
.panel3 .panel.first {
	margin-left: 0;
}
.panel2 .panel a {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 50px 14px 78px;
	color: #666;
	position: relative;
	text-decoration: none;
	transition: 1s;
	text-align: center;
}
.panel2 .panel a:hover {
	background-color: #fafafa;
}
.panel2 .panel .spacer {
	padding: 50px 14px 45px;
	text-align: center;
}
#trustNav .kakomi,
#section03 .kakomi {
	border: 1px solid #e5e5e5;
	transition: border 1s;
}
#trustNav .kakomi:hover,
#section03 .kakomi:hover {
	border: 1px solid #ab882d;
}
#trustNav .kakomi.none:hover,
#section03 .kakomi.none:hover {
	border: 1px solid #e5e5e5;
}


.rMore {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 40px;
	color: #222;
	font-size: 15px;
	text-align: center;
}
.rMore i {
	margin: 0 8px 0 0;
	transition: transform 1s;
}
 a:hover .rMore i {
	transform: translateX(5px);
}
.rMore span {
	position: relative;
	transition: color 1s;
}
a:hover .rMore span {
	color: #a78237;
}
a .rMore span::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 100%;
  height: 2px;
  -webkit-transform: scaleX(0);
  -ms-transform: scaleX(0);
  transform: scaleX(0);
  background-color: #a78237;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}
a:hover .rMore span::after {
  -webkit-transform: scaleX(1);
  -ms-transform: scaleX(1);
  transform: scaleX(1);
}

.kansai:after,
.shuto:after {
	display: inline-block;
	width: 98px;
	border: 1px solid #ddd;
	position: absolute;
	top: 14px;
	right: 14px;
	background: #fff;
	font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HiraMinProN-W3", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-style: 10px;
	line-height: 22px;
	text-align: center;
}
.kansai:after {
	content: '関西圏のみ';
}
.shuto:after {
	content: '首都圏のみ';
}

.sNav.foot {
	border-top: 1px solid #d2d2d2;
	padding-top: 55px;
}

	.sp {
		display: none;
	}

@media screen and (max-width:960px) {
	.sNav li {
		width: 27.586%;
		margin: 6.069% 0 0 4.31%;
	}
	.sNav li:nth-child(3n+1) {
		margin-left: 2.155%;
	}
	.sNav li:nth-child(-n+3) {
		margin-top: 0;
	}
	.sNav a,
	.sNav strong {
		display: block;
		padding: 6.25% 0 calc(6.25% + 10px);
		font-size: 12px;
	}
	.sNav a:hover:after {
		transform: scaleX(1);
	}
	#headline .title {
		margin-top: 60px;
	}
}
@media only screen and (max-width:640px) {
	#headline .wrap {
		padding: 9.375% 4.688% 12.5%;
	}
	#headline.noimage .wrap {
		padding: 0;
	}

	#headline .text {
		margin: 0 0 10.345%;
		font-size: 16px;
	}
	#headline p.none {
		padding-top: 0;
		padding-bottom: 0;
		line-height: 2.286;
	}
	.sNav li {
		width: 27.586%;
		margin: 12.069% 0 0 4.31%;
	}
	.sNav li:nth-child(3n+1) {
		margin-left: 2.155%;
	}
	.sNav li:nth-child(-n+3) {
		margin-top: 0;
	}
	.sNav a,
	.sNav strong {
		display: block;
		padding: 6.25% 0 calc(6.25% + 10px);
		font-size: 12px;
	}
	.sNav a:hover:after {
		transform: scaleX(1);
	}
	#headline .title {
		margin: 0;
		padding: 0;
		background-image: none;
	}
	#pageTitle {
		background-image: url(../imgs/quality/bg-headline.jpg);
		background-position: right;
		box-shadow: inset 0 5px 5px rgba(0,0,0,.2);
		padding: 26.793% 0 0;
	}
	#pageTitle span {
		position: static;
	}
	#headline #pageTitle {
		height: auto;
		margin-bottom: 0px;
	}

	#headline.safety .title,
	#headline.health .title,
	#headline.ecology .title,
	#headline.future .title,
	#headline.trust .title {
		background-image: none;
	}
	#headline.noimage #pageTitle {
		box-shadow: none;
	}
	#headline.safety #pageTitle {
		background-image: url(../imgs/safety/bg-headline.jpg);
	}
	#headline.health #pageTitle {
		background-image: url(../imgs/health/bg-headline.jpg);
	}
	#headline.ecology #pageTitle {
		background-image: url(../imgs/ecology/bg-headline.jpg);
	}
	#headline.future #pageTitle {
		background-image: url(../imgs/future/bg-headline.jpg);
	}
	#headline.trust #pageTitle {
		background-image: url(../imgs/trust/bg-headline.jpg);
	}

	#headline.noimage .wrap {
		padding: 0 4.688%;
	}
	#headline.noimage .title {
		margin: 0;
		padding: 0;
		background-image: none;
	}
	#headline.noimage #pageTitle {
		background-image: none;
	}
	#headline.noimage .title br {
		display: none;
	}

	section {
		padding: 0 4.688%;
	}
	#original {
		padding: 0;
	}
	section .wrap {
		padding: 13.793% 0;
	}
	section .wrap.last {
		padding-bottom: 40px;
	}

	#section02 .kakomi {
		padding: 0;
	}
	#section02 .cap {
		text-align: left !important;
		margin-top: 10px;
	}

	.panelWrapper + .panelWrapper {
		margin-top: 30px;
	}
	.panel2 .panel,
	.panel2 .panel.fr,
	.panel3 .panel {
		width: 100%;
		margin: 30px 0 0;
		float: none;
		position: relative;
	}
	.panel2 .panel:first-child,
	.panel3 .panel:first-child {
		margin-top: 0;
	}
	.panel2 .panel a {
		width: auto;
		height: auto;
		padding: calc(2.069% + 34px) 2.069% 9.655%;
		position: relative;
	}
	.panel2 .panel a:hover {
		background-color: #fff;
	}
	.panel2 .panel .spacer {
		padding: calc(2.069% + 34px) 2.069% 6.897%;
	}

	.rMore {
		margin: 5.172% 0 0;
		position: static;
		font-size: 15px;
	}
	 a:hover .rMore i {
		transform: translateX(0);
	}

	.sNav.foot {
		margin:  0 4.688%;
		padding-top: 16.379%;
	}


	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
}


	.goldBg {
		display: block;
		position: relative;
		background: #6e602c;
	}
	.goldBg .bg {
		transition: 0.5s;
	}
	.goldBg:hover .bg {
		opacity: 0.2;
	}
	#mind li {
		position: relative;
		display: inline-block;
		width: 50%;
		margin-top: -4px;
		border-bottom: solid 1px #fff;
		overflow: hidden;

    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	}
	#mind li:nth-child(2n) {
		border-left: solid 1px #fff;
	}
	#mind li a {
		display: block;
	}
	#mind li img {
		vertical-align: top;
	}
	#mind li span {
		position: absolute;
		top: 20px;
		right: 20px;
	}
	#mind li .bg {
	    backface-visibility: hidden;
	}
	#mind li .text {
		position: absolute;
		/*top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
		    -ms-transform: translate(-50%,-50%);
		        transform: translate(-50%,-50%);*/
		top: 0;
		bottom: 0;
		right: 0;
		left: 0;
		margin: auto;
	}
@media only screen and (max-width:640px) {
	#headline {
		font-size: 12px;
		text-align: left;
	}
	#headline p.none br{
		display: none;
	}
	#mind li {
		position: relative;
		display: block;
		width: 100%;
		max-width: 500px;
		margin-top: 0;
		margin-left: auto;
		margin-right: auto;
	}
	#mind li .text {
		display: block;
	}
	#mind li span {
		position: absolute;
		top: 10px;
		right: 10px;
	}
/*
	#mind li img {
		width: 100%;
	}
*/
}

	.mw400 {
		max-width: 400px;
		margin-left: auto;
		margin-right: auto;
	}
	.mw960 {
		max-width: 960px;
		margin-left: auto;
		margin-right: auto;
	}

	.image img {
		vertical-align: top;
	}

	.bMore {
		max-width: 300px;
		margin-left: auto;
		margin-right: auto;
		font-size: 15px;
		text-align: center;
	}
	.bMore i {
		margin: 0 8px 0 0;
		transition: transform 1s;
	}
	.bMore a:hover i {
		transform: translateX(5px);
	}
	.bMore a {
		position: relative;
		display: block;
		width: 100%;
		padding: 15px 0;
		background: #a78237;
		text-decoration: none;
		color: #fff;
		transition: all 1s;
	}
	.bMore a:hover {
		opacity: 0.6;
	}
	.bMore a span {
		position: relative;
	}
	/*.bMore a span:after {
		content: '';
		width: 100%;
		height: 2px;
		background: #a78237;
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;
		bottom: -8px;
		transition: transform 0.5s ease-in, background 0.5s ease-in;
		-webkit-transform: scale(0);
		-ms-transform: scale(0);
		transform: scale(0);
	}
	.bMore a:hover span:after {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
		background: #fff;
	}*/

	.boxA {
		padding: 39px;
		border: solid 1px #d2d2d2;
	}
	.boxA .inner {
		padding: 20px;
		background: #f5f5f5;
	}

	.boxB {
		padding: 10px;
		background: #f2ebcf;
		font-size: 10px;
		line-height: 12px;
	}
	.boxB .mls {
		letter-spacing: -1px;
	}

	.boxC {
		padding: 8px 5px;
		background: #ededed;
		font-family: serif;
		font-size: 16px;
		color: #434343;
		text-align: center;

    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	}
	table.curcle {
		line-height: 2;
		color: #666;
	}
	table.curcle td {
		vertical-align: top;
	}
@media only screen and (max-width: 640px) {
	.boxA {
		padding: 19px;
	}
	.boxB .mls {
		letter-spacing: 0;
	}
}

	.clmBox {
		overflow: hidden;
	}
	.clmBox > div {
		float: left;
		-webkit-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	.clmBox.clm2 {
		margin-top: -30px;
		margin-left: -2%;
	}
	.clmBox.clm2 > div {
		width: 48%;
		margin-top: 30px;
		margin-left: 2%;
	}

	.clmBox.Lclm2 {
		margin-top: -50px;
		margin-left: -2.5%;
	}
	.clmBox.Lclm2 > div {
		width: 47.5%;
		margin-top: 50px;
		margin-left: 2.5%;
	}

	.clmBox.clm4 {
		margin-top: -30px;
		margin-left: -3%;
	}
	.clmBox.clm4 > div {
		width: 22%;
		margin-top: 30px;
		margin-left: 3%;
	}

	.clmBox.Imt5 {
		margin-top: -5px;
	}
	.clmBox.Imt5 > div {
		margin-top: 5px;
	}

	.clmBox > div.cl {
		clear: left;
	}
@media only screen and (max-width: 960px) {
	.clmBox.Lclm2 {
		margin-left: 0;
	}
	.clmBox.Lclm2 > div {
		float: none;
		width: auto;
		margin-left: 0;
	}
}
@media only screen and (max-width: 640px) {
	.clmBox.clm2 {
		margin-left: 0;
	}
	.clmBox.clm2 > div {
		float: none;
		width: auto;
		margin-left: 0;
	}

	.clmBox.clm4 {
		margin-left: -4%;
	}
	.clmBox.clm4 > div {
		width: 46%;
		margin-left: 4%;
	}

	.clmBox > div.cl {
		clear: none;
	}
	.clmBox > div.clsp {
		clear: left;
	}
}

	.areaA {
		display: table;
		width: 100%;
	}
	.areaA .areaL,
	.areaA .areaR {
		display: table-cell;
		vertical-align: middle;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	}
	.areaA .areaL img,
	.areaA .areaR img {
		vertical-align: top;
	}

	.areaA.num1 .areaL {
		width: 42%;
		text-align: center;
		vertical-align: top;
	}
	.areaA.num1 .areaR {
		width: 55%;
		padding-top: 19px;
		padding-left: 3%;
		vertical-align: top;
	}

	.areaA.num2 .areaL {
		width: 31.3%;
		padding: 20px;
	}
	.areaA.num2 .areaR {
		width: 65.7%;
		padding-left: 3%;
	}

	.ls {
		margin-top: 15px;
		margin-bottom: 10px;
		padding: 8px 0 4px 95px;
		font-size: 18px;
		line-height: 1.4;
		color: #aa8420;
	}
	.ls.Numb1 { background: url(../imgs/future/icn-num1.png) no-repeat 0 0;}
	.ls.Numb2 {	background: url(../imgs/future/icn-num2.png) no-repeat 0 0;}
	.ls.Numb3 {	background: url(../imgs/future/icn-num3.png) no-repeat 0 0;}
	.ls.Numb4 {	background: url(../imgs/future/icn-num4.png) no-repeat 0 0;}
@media only screen and (max-width: 640px) {
	.areaA.num2 .areaL {
		display: block;
		width: auto;
	}
	.areaA.num2 .areaR {
		display: block;
		width: auto;
		margin-top: 30px;
		padding-left: 0;
	}
}
@media only screen and (max-width: 480px) {
	.areaA.num1 .areaL {
		display: block;
		width: auto;
	}
	.areaA.num1 .areaR {
		display: block;
		width: auto;
		margin-top: 20px;
		padding-top: 0;
		padding-left: 0;
	}
}

	.imgBox {
		display: table;
		width: 100%;
	}
	.imgBox .ttlArea,
	.imgBox .txtArea,
	.imgBox .phArea {
		display: table-cell;
		vertical-align: top;
		-webkit-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	.imgBox.num1 .phArea {
		width: 31.33%;
		padding-right: 2%;
		text-align: left;
	}
@media only screen and (max-width: 640px) {
	.imgBox.num1 .txtArea {
		display: block;
		margin-top: 20px;
	}
	.imgBox.num1 .phArea {
		display: block;
		width: auto;
		padding-right: 0;
		text-align: center;
	}
}

	.imgBox.num2 .ttlArea {
		width: 185px;
		padding-left: 10px;
		padding-right: 30px;
		text-align: left;
		vertical-align: middle;
	}
	.imgBox.num2 .txtArea {
		vertical-align: middle;
	}
@media only screen and (max-width: 960px) {
	.imgBox.num2 .ttlArea {
		display: block;
		width: auto;
		padding-right: 0;
		text-align: center;
	}
	.imgBox.num2 .txtArea {
		display: block;
		margin-top: 20px;
	}
}

	.imgBox.num3 .phArea {
		width: 31.33%;
		padding-left: 2%;
		text-align: left;
	}
@media only screen and (max-width: 640px) {
	.imgBox.num3 .txtArea {
		display: block;
	}
	.imgBox.num3 .phArea {
		display: block;
		width: auto;
		margin-top: 20px;
		padding-left: 0;
		text-align: center;
	}
}

	.imgBox.num4 .txtArea {
		padding-right: 30px;
	}
	.imgBox.num4 .phArea {
		width: 313px;
		text-align: left;
	}
@media only screen and (max-width: 640px) {
	.imgBox.num4 .txtArea {
		display: block;
		padding-right: 0;
	}
	.imgBox.num4 .phArea {
		display: block;
		width: auto;
		margin-top: 20px;
		text-align: center;
	}
}

/* アコーディオン周り */
#quality #section02 .sp_img {
	display: none;
}
#quality #section02 .image {
	margin-bottom: 50px;
}
#quality #section02 .title04 {
	margin-bottom: 40px;
}
#quality #section02 .toggleBox + .toggleBox {
	margin-top: 30px;
}
#quality #section02 .parent {
	border: 1px solid #ccc;
	position: relative;
	padding: 20px 0 20px 50px;
	font-size: 15px;
	background: #fff;
	transition: all 0.5s ease-in;
	cursor: pointer;
}
#quality #section02 .parent:hover ,
#quality #section02 .parent.active {
	border: 1px solid #ab882d;
	background: #fafafa;
	color: #aa8420;
}
#quality #section02 .parent .icon,
#quality #section02 .parent .arrow {
	position: absolute;
}
#quality #section02 .parent .icon {
	left: 20px;
}
#quality #section02 .parent .arrow {
	right: 20px;
	font-size: 20px;
	height: 20px;
	top: 0;
	bottom: 0;
	margin: auto;
	transition: transform 0.5s ease-in;
	color: #333;
}
#quality #section02 .parent.active .arrow {
	transform: rotate(180deg);
}
#quality #section02 .parent .arrow i {
	vertical-align: top;
}
#quality #section02 .child {
	padding: 30px 0 50px;
	display: none;
}
#quality #section02 .child .ib {
	letter-spacing: -0.4em;
}
#quality #section02 .child .intro {
	font-size: 14px;
	margin-bottom: 30px;
}
#quality #section02 .child .ib > div {
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 49%;
}
#quality #section02 .child .ib > div + div {
	margin-left: 2%;
}
#quality #section02 .child .ib > div > div {
}
#quality #section02 .child .ib > div .imageBox {
	max-width: 227px;
	width: 100%;
	float: left;
}
#quality #section02 .child .ib > div .imageBox .cap {
	text-align: right;
	padding-top: 0;
}
#quality #section02 .child .ib > div .textBox {
	padding-left: 247px;
}
#quality #section02 .child .ib > div .textBox .titleTxt {
	font-size: 16px;
	line-height: 1.7;
	color: #a7870a;
	margin-bottom: 5px;
}
#quality #section04 p {
	word-break: break-all;
}
@media screen and (max-width:1000px) {
	#quality #section02 .child .ib {
		text-align: center;
	}
	#quality #section02 .child .ib > div {
		/*max-width: 227px;*/
	}
	#quality #section02 .child .ib > div .imageBox {
		max-width: 227px;
		width: 100%;
		float: none;
		margin-bottom: 10px;
	}
	#quality #section02 .child .ib > div .textBox {
		padding-left: 0px;
	}
	#quality #section02 .child .ib > div .textBox {
		text-align: left;
	}

}
@media screen and (max-width:640px) {
	#quality #section02 .sp_img {
		display: inline;
	}
	#quality #section02 .pc_img {
		display: none;
	}
	#quality #section02 .child .ib > div {
		max-width: 227px;
	}
	#quality #section02 .image {
		padding: 10px;
	}
}

#quality #agingfree .clmBox.clm2 > div {
	width: 47.5%;
}
#quality #agingfree .clm2 .Iclm2 > div {
	width: 47.5%;
	margin-bottom: 30px;
	margin-left: 2.5%;
}
#quality #agingfree .clmBox.clm2 .kakomi {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#quality #agingfree .clm2 .Iclm2 > div .image {
	text-align: center;
}
#quality #agingfree .clm2 .Iclm2 > div .image img {
	max-width: 100%;
}
#quality #agingfree .clm2 .Iclm2 > div p {
	line-height: 1.5;
}
.Numb {
	padding-left: 25px;
}
.Numb1 { background: url(../imgs/future/icn-num1_01.png) no-repeat 0 2px;}
.Numb2 { background: url(../imgs/future/icn-num2_01.png) no-repeat 0 2px;}
.Numb3 { background: url(../imgs/future/icn-num3_01.png) no-repeat 0 2px;}
.Numb4 { background: url(../imgs/future/icn-num4_01.png) no-repeat 0 2px;}

@media screen and (max-width:640px) {
	#quality #agingfree .clmBox.clm2 > div {
		width: 100%;
	}
}

#pageTitle img {
    margin: 0 auto 20px;
}
@media screen and (max-width:640px) {
	#section04 .caption.ar {
		text-align: left;
	}
}

.titleBox {
	text-align: center;
	margin-bottom: 10px;
	padding: 15px 0;
	font-size: 16px;
	background: #ededed;
	letter-spacing: 0.1em;
}

.title04.special {
	font-size: 26px;
	background: url(../imgs/future/bg-title01.gif) repeat-x 0 15px;
}
.title04.special span {
	background: #fff;
	padding-right: 20px;
}

@media screen and (max-width:640px) {
.title04.special {
	margin-bottom: 30px;
	font-size: 18px;
	line-height: 1.5;
	background: none;
}
.title04.special span{
	background: none;
	padding-right: 0px;
}



}


/* #original .panelArea {
	letter-spacing: -0.4em;
	display: flex;
	flex-wrap: wrap;
}
#original .panelArea > div.panel {
	width: 32%;
	letter-spacing: normal;
	vertical-align: bottom;
	position: relative;
	margin-bottom: 2%;
}

#original .panelArea .limited {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 5;
	display: inline-block;
}
#original .panelArea > div.panel + .panel {
	margin-left: 2%;
}
#original .panelArea > div.panel:nth-child(3n+1) {
	margin-left: 0%;
}
#original .panelArea > div.panel:nth-last-of-type(1) {
	margin-bottom: 0;
}
#original .panelArea > div.panel img {
	vertical-align: bottom;
}

#original .panelArea > div.panel a .text {
	position: absolute;
	bottom: 0;
	left: 0;
	background: rgba(255,255,255,0.9);
	width: 100%;
	box-sizing: border-box;
	transition: all 0.5s ease-out;
}
#original .panelArea > div.panel a {
	position: relative;
}
#original .panelArea > div.panel a:hover .text {
	background: #33322e;
}
#original .panelArea > div.panel a .text span {
	display: inline-block;
	position: relative;
}
#original .panelArea > div.panel a span.gooddesign {
	width: 10.625%;
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 999;
}
#original .panelArea > div.panel a span.award {
	width: 24.68%;
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 999;
}
#original .panelArea > div.panel a .text > span img {
	transition: opacity 0.5s ease-out;
}
#original .panelArea > div.panel a:hover .text > span img {
	opacity: 0;
}
#original .panelArea > div.panel a:hover span.gooddesign img {
	opacity: 1;
}
#original .panelArea > div.panel a:hover span.gooddesign:before {
	content: none;
}
#original .panelArea > div.panel a:hover span.award img {
	opacity: 1;
}
#original .panelArea > div.panel a:hover span.award:before {
	content: none;
}
#original .panelArea > div.panel a .text > span:before {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity 0.5s ease-out;
}
#original .panelArea > div.panel a:hover .text span:before {
	opacity: 1;
}
#original .panelArea > div.panel01 a .text span:before {
	background: url(../../imgs/txt-original01_ov.png) no-repeat left center;
	background-size: 100% 100%;
}
#original .panelArea > div.panel02 a .text span:before {
	background: url(../../imgs/txt-original02_ov.png) no-repeat left center;
	background-size: 100% 100%;
}
#original .panelArea > div.panel03 a .text span:before {
	background: url(../../imgs/txt-original03_ov.png) no-repeat left center;
	background-size: 100% 100%;
}
#original .panelArea > div.panel04 a .text span:before {
	background: url(../../imgs/txt-original04_ov.png) no-repeat left center;
	background-size: 100% 100%;
}
#original .panelArea > div.panel05 a .text span:before {
	background: url(../../imgs/txt-original05_ov.png) no-repeat left center;
	background-size: 100% 100%;
}
#original .panelArea > div.panel06 a .text span:before {
	background: url(../../imgs/txt-original06_ov.png) no-repeat left center;
	background-size: 100% 100%;
}
#original .panelArea > div.panel07 a .text span:before {
	background: url(../../imgs/txt-original07_ov.png) no-repeat left center;
	background-size: 100% 100%;
}
#original .panelArea > div.panel08 a .text span:before {
	background: url(../../imgs/txt-original08_ov.png) no-repeat left center;
	background-size: 100% 100%;
}
#original .wrap {
	padding: 0 4.688%;
}

@media screen and (max-width:768px) {
	.darkerBg:hover .bg {
		opacity: 1;
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
	#original .panelArea > div.panel a:hover .text {
		background: rgba(255,255,255,0.9);
	}
	#original .panelArea > div.panel a:hover .text span img {
		opacity: 1;
	}
	#original .panelArea > div.panel a .text span:before {
		content: none;
	}
}

@media screen and (max-width:640px) {
	#original .panelArea > div.panel {
		width: 48.5%;
	}
	#original .panelArea > div.panel + .panel {
		margin-left: 3%;
	}
	#original .panelArea > div.panel + .panel:nth-child(2n+1) {
		margin-left: 0;
	}
	#original .panelArea > div.panel a .text span.gooddesign {
		width: 43.214285714%;
		position: absolute;
		top: -37%;
		left: 5px;
		right: auto;
	}
	#original .panelArea .limited {
		width: 41.071428571%;
		position: absolute;
		top: auto;
		bottom: 42%;
		left: 5px;
		z-index: 5;
	}
	#original .panelArea > div.panel {
		margin-bottom: 3%;
	}
} */