@charset "UTF-8";

/*----------------------------------------

	- coler setting
	+ main
		- tit01
		- slid01
		+ box01
			- box01_01
			- box01_02
			- box01_03
		- box02
		- colorbox custom
		- detail
		- hide

----------------------------------------*/

/*----------------------------------------
	color setting
----------------------------------------*/

.red02 {
	color: #e60012;
}

/*----------------------------------------
	main
----------------------------------------*/

article {
	width: 1200px;
	padding: 0;
}

@media screen and (max-width:1000px) {
	article {
		width: 1000px;
	}
}

article #main {
	padding: 0;
}

/*----------------------------------------
	tit01
----------------------------------------*/

@media screen and (max-width:1000px) {
	#main #tit01 figure img {
		width: 1000px;
		height: auto;
	}
}

#main #tit01 div {
	display: table-cell;
	width: 1200px;
	height: 140px;
	background: url(../img/metallic_tit_bg01.jpg) no-repeat left top;
	text-align: center;
	padding-top: 70px;
}

@media screen and (max-width:1000px) {
	#main #tit01 div {
		width: 1000px;
		height: 125px;
		padding-top: 55px;
		background-size: contain;
	}
}

#main #tit01 div h1 {
	padding-top: 15px;
}

/*----------------------------------------
	slid01
----------------------------------------*/

#main #slid01 {
	position: relative;
	width: 830px;
	padding: 0 55px;
	margin: 0 auto;
}

#main #slid01 div {
	position: relative;
	width: 830px;
	height: 370px;
	overflow: hidden;
}

#main #slid01 div img {
	position: absolute;
	right: 0;
	left: 0;
}

#main #slid01 div + p  {
	position: absolute;
	top: 160px;
	left: 0;
	cursor: pointer;
}

#main #slid01 div + p + p {
	position: absolute;
	top: 160px;
	right: 0;
	cursor: pointer;
}

/*----------------------------------------
	box01
----------------------------------------*/

#main #box01 {
	width: 1200px;
}

@media screen and (max-width:1000px) {
	#main #box01 {
		width: 1000px;
		height: auto;
	}
}

#main #box01 > h1 {
	text-align: center;
}

/*----------------------------------------
	box01_01
----------------------------------------*/

#main #box01_01 #box01_01_01 {
	min-height: 380px;
	padding-bottom: 27px;
	background: url(../img/metallic_p02.jpg) no-repeat left bottom;
}

#main #box01_01 #box01_01_01 div {
	width: 440px;
	padding-left: 635px;
}

#main #box01_01 #box01_01_01 div p span {
	padding-right: 15px;
}

#main #box01_01 #box01_01_01 div h1 span {
	padding-left: 15px;
	vertical-align: bottom;
}

@media screen and (max-width:1000px) {
	#main #box01_01 #box01_01_01 {
		width: 1000px;
		background-position: -100px bottom;
	}
	#main #box01_01 #box01_01_01 div {
		padding-left: 535px;
	}
}

#main #box01_01 #box01_01_02 {
	padding: 45px 130px;
	background: #e1e1e1 url(../img/metallic_bg01.jpg) no-repeat center top;
}

@media screen and (max-width:1000px) {
	#main #box01_01 #box01_01_02 {
		width: 940px;
		padding: 45px 30px;
		background-size: contain;
	}
}

#main #box01_01 #box01_01_02 div #box01_01_02_l {
	float: left;
	width: 435px;
}

#main #box01_01 #box01_01_02 div #box01_01_02_l > ul > li {
	display: inline-block;
	width: 102px;
	padding: 0 9px 12px 0;
	vertical-align: top;
}

#main #box01_01 #box01_01_02 div #box01_01_02_l > ul > li:nth-child(4n) {
	padding-right: 0;
}

#main #box01_01 #box01_01_02 div #box01_01_02_l > ul > li:last-child {
	padding-bottom: 0;
}

#main #box01_01 #box01_01_02 div #box01_01_02_l > ul > li figcaption {
	padding-top: 5px;
}

#main #box01_01 #box01_01_02 div #box01_01_02_r {
	float: right;
	width: 435px;
	padding-top: 30px;
}

#main #box01_01 #box01_01_02 .btn01 {
	text-align: center;
}

#main #box01_01 #box01_01_02 .btn01 p {
	display: inline-block;
	border: solid 2px #b38e5e;
}

#main #box01_01 #box01_01_02 .btn01 p a {
	display: block;
	padding: 20px 100px;
	color: #b38e5e;
	text-decoration: none;
}

/*----------------------------------------
	box01_02
----------------------------------------*/

#main #box01_02 {
	width: 1200px;
	padding-bottom: 50px;
	background: #000000;
}

@media screen and (max-width:1000px) {
	#main #box01_02 {
		width: 1000px;
		height: auto;
	}
}

#main #box01_02 #box01_02_01 {
	min-height: 500px;
	margin: 0 auto;
	padding: 65px 0 0 635px;
	background: url(../img/metallic_p04.jpg) no-repeat center top;
}

@media screen and (max-width:1000px) {
	#main #box01_02 #box01_02_01 {
		width: 435px;
		padding: 65px 0 0 505px;
	}
}

#main #box01_02 #box01_02_01 h1 span {
	padding-left: 15px;
	vertical-align: bottom;
}

#main #box01_02 #box01_02_02 {
	width: 880px;
	margin: 0 auto;
	padding: 30px;
	background: #29292a;
}

#main #box01_02 #box01_02_02 dl {
	float: left;
	width: 430px;
}

#main #box01_02 #box01_02_02 ul {
	float: right;
	width: 430px;
}

#main #box01_02 #box01_02_02 ul li {
	float: left;
	padding-left: 1px;
}

#main #box01_02 .btn01 {
	text-align: center;
}

#main #box01_02 .btn01 p {
	display: inline-block;
	border: solid 2px #b38e5e;
}

#main #box01_02 .btn01 p a {
	display: block;
	padding: 20px 100px;
	color: #b38e5e;
	text-decoration: none;
}

/*----------------------------------------
	box01_03
----------------------------------------*/

#main #box01_03 {
	width: 1200px;
	padding-bottom: 50px;
}

@media screen and (max-width:1000px) {
	#main #box01_03 {
		width: 1000px;
		height: auto;
	}
}

#main #box01_03 > h1 {
	margin: 0 auto;
	padding: 150px 0 385px 140px;
	background: url(../img/metallic_p07.jpg) no-repeat center top;
}

@media screen and (max-width:1000px) {
	#main #box01_03 > h1 {
		width: 960px;
		padding: 150px 0 385px 40px;
	}
}

#main #box01_03 #box01_03_01 h1 {
	text-align: center;
}

#main #box01_03 #box01_03_01 #box01_03_01_01 {
	position: relative;
	width: 1000px;
	margin: 0 auto;
}

#main #box01_03 #box01_03_01 #box01_03_01_01 div {
	position: relative;
	width: 475px;
	padding: 0 0 115px 475px;
}

#main #box01_03 #box01_03_01 #box01_03_01_01 div figure {
	margin-left: -12px;
}

#main #box01_03 #box01_03_01 #box01_03_01_01 div dl dt span {
	padding-right: 15px;
}

#main #box01_03 #box01_03_01 #box01_03_01_01 > figure {
	position: absolute;
	top: 0;
	left: 30px;
}

#main #box01_03 #box01_03_01 #box01_03_01_02 {
	position: relative;
	width: 940px;
	margin: 0 auto;
}

#main #box01_03 #box01_03_01 #box01_03_01_02 div {
	width: 370px;
	padding: 0 0 195px 120px;
}

#main #box01_03 #box01_03_01 #box01_03_01_02 div dl dt span {
	padding-right: 15px;
}

#main #box01_03 #box01_03_01 #box01_03_01_02 > figure {
	position: absolute;
	top: -50px;
	left: 520px;
}

#main #box01_03 #box01_03_01 #box01_03_01_03 {
	position: relative;
	width: 940px;
	margin: 0 auto;
}

#main #box01_03 #box01_03_01 #box01_03_01_03 > div {
	position: relative;
	width: 370px;
	padding: 0 0 130px 425px;
}

#main #box01_03 #box01_03_01 #box01_03_01_03 div dl dt span {
	padding-right: 15px;
}

#main #box01_03 #box01_03_01 #box01_03_01_03 > figure {
	position: absolute;
	top: -80px;
	left: 0;
}

#main #box01_03 #box01_03_01 #box01_03_01_04 {
	position: relative;
	width: 940px;
	margin: 0 auto;
}

#main #box01_03 #box01_03_01 #box01_03_01_04 > div {
	position: relative;
	width: 370px;
	padding: 0 0 215px 120px;
}

#main #box01_03 #box01_03_01 #box01_03_01_04 div dl dt span {
	padding-right: 15px;
}

#main #box01_03 #box01_03_01 #box01_03_01_04 > figure {
	position: absolute;
	top: -50px;
	left: 470px;
}

#main #box01_03 #box01_03_01 #box01_03_01_05 {
	position: relative;
	width: 940px;
	margin: 0 auto;
}

#main #box01_03 #box01_03_01 #box01_03_01_05 > div {
	position: relative;
	width: 370px;
	padding: 0 0 100px 435px;
}

#main #box01_03 #box01_03_01 #box01_03_01_05 div dl dt span {
	padding-right: 15px;
}

#main #box01_03 #box01_03_01 #box01_03_01_05 > figure {
	position: absolute;
	top: -55px;
	left: 0;
}

#main #box01_03 .btn01 {
	text-align: center;
}

#main #box01_03 .btn01 p {
	display: inline-block;
	border: solid 2px #b38e5e;
}

#main #box01_03 .btn01 p a {
	display: block;
	padding: 20px 100px;
	color: #b38e5e;
	text-decoration: none;
}

#main #box01_03 .btn01 p a span {
	padding-left: 15px;
	vertical-align: middle;
}

/*----------------------------------------
	box02
----------------------------------------*/

#main #box02 {
	width: 1200px;
	margin-bottom: 40px;
}

@media screen and (max-width:1000px) {
	#main #box02 {
		width: 1000px;
		height: auto;
	}
}

#main #box02 div {
	display: table;
	width: 940px;
	padding: 26px 130px 25px;
	background: #e7e7e8;
}

@media screen and (max-width:1000px) {
	#main #box02 div {
		padding: 26px 30px 25px;
	}
}

#main #box02 div p {
	display: table-cell;
	width: 590px;
	padding-right: 30px;
	vertical-align: middle;
}

#main #box02 div p + p {
	width: 320px;
	padding-right: 0;
	text-align: center;
}

#main #box02 div p + p a {
	display: block;
	padding: 10px;
	background: #b38e5e;
}

/*----------------------------------------
	colorbox custom
-----------------------------------------*/

#cboxPrevious,
#cboxNext {
    top: 42% !important;
}

/*----------------------------------------
	detail
-----------------------------------------*/

div#detailBox {
	display: none;
}

section.detail {
	background-color: #000000;
}

section.detail div {
	padding: 35px 0 0;
}

section.detail div h1 {
	float: left;
	width: 250px;
}

section.detail div dl {
	float: right;
	width: 450px;
}

section.detail div dl dt {
	float: left;
	width: 125px;
	padding: 7px 10px 7px 0;
	border-bottom: 1px solid #29292a;
}

section.detail div dl dd {
	float: right;
	width: 315px;
	padding: 7px 0;
	border-bottom: 1px solid #29292a;
}

section.detail div dl dd p {
	display: inline-block;
	padding-right: 1px;
}

section.detail div dl .delline {
	border: none;
}

/*----------------------------------------
	hide
-----------------------------------------*/

.hide {
	display: none;
}

/*----------------------------------------
	designBox01
----------------------------------------*/

#main #collectionBox01 {
	width: 940px;
	margin: 0 auto 15px;
}

/*----------------------------------------
	cmnBox01
----------------------------------------*/

#main #cmnBox01 {
	width: 940px;
	margin: 0 auto 10px;
	padding: 30px 0;
}