@charset "utf-8";
/*
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

  Last Updated: March 21, 2015

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/

body {
	color: #3e3a3a;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Times New Roman", "游明朝", YuMincho, "メイリオ", Meiryo, serif;
    font-size: 14px;
	background: #d0cece;
}
a {
	color: #333;
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}
img {
	font-size: 0;
	vertical-align: bottom;
}
/* ============================================================
body#index
============================================================ */

#index {
	position:relative;

}

#index > header {
	max-width:755px;
	margin:0 auto;
	padding:40px 0 25px;
}
#index > footer {	
	max-width:755px;
	margin: 0 auto;
	padding:15px 0 5px;
}
#index > footer .inquiry {
	margin-bottom:25px;
	font-family: "ヒラギノ丸ゴ ProN", Hiragino Maru Gothic ProN, Meiryo, "メイリオ", "游ゴシック", YuGothic, sans-serif;
}

#index > footer p small {
	width:100%;
	display:inline-block;
	text-align:right;
}



/* ============================================================
#list
============================================================ */
#list {
	position:relative;
	width:755px;
	height:755px;
	margin:0 auto;
	overflow:hidden;

}
#list h1 {
	position:relative;
	z-index:200;
	line-height:1.6;
	color:#FFFFFF;
	font-size: 90px;
	font-weight:normal;
	font-family: "Lucida Console", "Lucida Sans Typewriter", monaco, "Bitstream Vera Sans Mono", monospace;
}


#list #title {
	position:absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index:9999;
}

/*
#list:hover #title {
	display:none;
	cursor:pointer;
}

#list #title img {
	width:100%;
	height:auto;
}
*/


#list ul {
	position:relative;
	width:911px;
}

/*
#list ul:before {
	display:block;
	position:absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index:9999;
	background-image:url(../images/index/title.png);
}

#list ul:hover:before {
	background-image:url(../images/index/title.png);
	z-index:-1;
}
*/


#list ul li {
	position:absolute;
	z-index:1;
}


#list ul li a {
	display:block;
}

#list ul li a:before {
	display:block;
	position:absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content:"";
	background-color:rgba(0,0,0,0.7);
	background-size: cover;
	z-index:999;
	cursor:pointer;
	
	-webkit-transition: 1.2s ease-in-out;
	-moz-transition: 1.2s ease-in-out;
	-o-transition: 1.2s ease-in-out;
	-ms-transition:3s ease-in-out;
	transition: 1.2s ease-in-out;
}



#list ul li:nth-of-type(5) a:before {
	background-image:url(../images/index/05a.png);
}

#list ul li:nth-of-type(8) a:before {
	background-image:url(../images/index/08a.png);
}


#list ul li:nth-of-type(9) a:before {
	background-image:url(../images/index/09a.png);
}

#list ul li:nth-of-type(10) a:before {
	background-image:url(../images/index/10a.png);
}

#list ul li:nth-of-type(11) a:before {
	background-image:url(../images/index/11a.png);
}

#list ul li:nth-of-type(12) a:before {
	background-image:url(../images/index/12a.png);
}

#list ul li:nth-of-type(13) a:before {
	background-image:url(../images/index/13a.png);
}

#list ul li:nth-of-type(14) a:before {
	background-image:url(../images/index/14a.png);
}

#list ul li:nth-of-type(15) a:before {
	background-image:url(../images/index/15a.png);
}


#list ul li:nth-of-type(16) a:before {
	background-image:url(../images/index/16a.png);
}

#list ul li:nth-of-type(17) a:before {
	background-image:url(../images/index/17a.png);
}

#list ul li:nth-of-type(18) a:before {
	background-image:url(../images/index/18a.png);
}



#list li a:hover:before {
	content:"";
	background-color:rgba(0,0,0,0.0);
	z-index:-1;
}



#list ul li:nth-of-type(1){
	left:0;
	top:0;
}
#list ul li:nth-of-type(2) {
	left:193px;
	top:0;
}
#list ul li:nth-of-type(3) {
	left:387px;
	top:0;
}
#list ul li:nth-of-type(4) {
	left:582px;
	top:0;
}


#list ul li:nth-of-type(5) {
	left:1;
	top:130px;
}
#list ul li:nth-of-type(6) {
	left:287px;
	top:130px;
}
#list ul li:nth-of-type(7) {
	left:484px;
	top:130px;
}


#list ul li:nth-of-type(8) {
	left:0;
	top:258px;
}
#list ul li:nth-of-type(9) {
	left:195px;
	top:258px;
}
#list ul li:nth-of-type(10) {
	left:390px;
	top:258px;
}
#list ul li:nth-of-type(11) {
	left:582px;
	top:258px;
}



#list ul li:nth-of-type(12) {
	left:0;
	top:388px;
}
#list ul li:nth-of-type(13) {
	left:195px;
	top:388px;
}
#list ul li:nth-of-type(14) {
	left:390px;
	top:388px;
}
#list ul li:nth-of-type(15) {
	left:582px;
	top:388px;
}


#list ul li:nth-of-type(16) {
	left:0px;
	top:518px;
}

#list ul li:nth-of-type(17) {
	left:238px;
	top:518px;
}

#list ul li:nth-of-type(18) {
	left:428px;
	top:518px;
}

#list ul li:nth-of-type(19) {
	left:581px;
	top:518px;
}



#list ul li:nth-of-type(20) {
	left:0px;
	top:647px;
}

#list ul li:nth-of-type(21) {
	left:173px;
	top:647px;
}

#list ul li:nth-of-type(22) {
	left:368px;
	top:647px;
}

#list ul li:nth-of-type(23) {
	left:623px;
	top:647px;
}


/*

#list ul li:nth-of-type(1){
	width:24.91767%;
}
#list ul li:nth-of-type(2) {
	width:25.02744%;
}
#list ul li:nth-of-type(3) {
	width:25.13721%;
}
#list ul li:nth-of-type(4) {
	width:24.91767%;
}



#list ul li:nth-of-type(5) {
	width:36.99231%;
}
#list ul li:nth-of-type(6) {
	width:25.46652%;
}
#list ul li:nth-of-type(7) {
	width:37.54116%;
}


#list ul li:nth-of-type(8) {
	width:25.13721%;
}
#list ul li:nth-of-type(9) {
	width:25.13721%;
}
#list ul li:nth-of-type(10) {
	width:24.8079%;
}
#list ul li:nth-of-type(11) {
	width:24.91767%;
}



#list ul li:nth-of-type(12) {
	width:25.13721%;
}
#list ul li:nth-of-type(13) {
	width:25.13721%;
}
#list ul li:nth-of-type(14) {
	width:24.8079%;
}
#list ul li:nth-of-type(15) {
	width:24.91767%;
}



#list ul li:nth-of-type(16) {
	width:30.62568%;
}

#list ul li:nth-of-type(17) {
	width:24.58836%;
}

#list ul li:nth-of-type(18) {
	width:19.7585%;
}

#list ul li:nth-of-type(19) {
	width:25.02744%;
}



#list ul li:nth-of-type(20) {
	width:22.39297%;
}

#list ul li:nth-of-type(21) {
	width:25.13721%;
}

#list ul li:nth-of-type(22) {
	width:32.82107%;
}

#list ul li:nth-of-type(23) {
	width:19.64873%;
}

*/



#list ul li img {
	width:100%;
	height:auto;
}




/*

#list ul li img {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'//www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
	filter: gray;
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
#list ul li:hover img {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	filter: none;
}

*/


/* ============================================================
#cover
============================================================ */
#cover {
	width: 100%;
	height: 300px;
	margin-bottom: 38px;
	position: relative;
	overflow: hidden;/*background: #000 url(../images/home/cover-loader.gif) 50% 50% no-repeat;*/
}
#cover ul {
	position: absolute;
	left: 50%;
	margin-left: -392px;
	display: none;
}
#cover ul li {
	width: 200 px;
	height: 380px;
	padding: 0 5px;
	float: left;
}
/* ------------------------------
Elements are created by home.js
------------------------------ */
#coverPrev, #coverNext {
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}
#coverPrev, #coverNext {
	cursor: pointer;
}
#coverPrev, #coverNext {
	width: 28px;
	height: 33px;
	position: absolute;
	top: 124px;
}
#coverPrev {
	left: 10px;
	background: url(../images/index/slide-arrow-left.png) 0 0 no-repeat;
}
#coverNext {
	right: 10px;
	background: url(../images/index/slide-arrow-right.png) 0 0 no-repeat;
}
/* ============================================================
#detail
============================================================ */

#detail article {
	max-width: 965px;
	margin: 0 auto;
	position: relative;
}
#detail #fixed {
	max-width: 270px;
	padding-left: 696px;
	position: fixed;
	top: 85px;
}
#detail header {
	margin-bottom:78px;
}
#detail header h1 {
	margin-bottom: 20px;
}
#detail header .inquiry a {
	font-family: Meiryo, "メイリオ", Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ ProN W3", "游ゴシック", YuGothic, sans-serif;
	font-size: 12px;
}
#detail nav ul {
	margin-bottom: 68px;
}
#detail nav ul li {
	margin-bottom: 18px;
}
#detail section {
	max-width: 638px;
	padding: 94px 0 58px;
	color:#090909;
}
#detail section .logo {
	margin-bottom:70px;
}
#detail section h2 {
	position: relative;
	left: 10px;
	z-index: 10;
}
#detail section ul {
	margin-top: -80px;
}
#detail section ul li {
	margin-top: 70px;
}
#detail section ul li p {
	margin-top: 30px;
	margin-bottom: -16px;
	padding: 0 20px;
	font-size: 14px;
	line-height:1.8;
}

#detail section ul li img {
	max-width: 638px;
}


#detail .data {
	
}
#detail .data dl {
	padding-bottom:10px;
}
#detail .data dt {
	margin-bottom:15px;
	padding: 13px 8px 10px;
	border-top: #767574 1px solid;
	border-bottom: #767574 1px solid;
	font-size:16px;
}
#detail .data dt span {
	margin:0 15px 0 20px;
	letter-spacing: 0.9em;
}
#detail .data dd {
	padding: 0 0 0 8px;
	font-size:18px;
	line-height:1.4;
}
#detail .data dd span {
	display:block;
	margin-bottom:10px;
	font-size:14px;
}

#detail .data .price {
	padding:14px 8px;
	border-top: #666 1px dashed;
	border-bottom: #666 1px dashed;
}



#detail .data .color {
	padding:17px 0 5px 4px;
	border-bottom: #666 1px dashed;
}

#detail .data li {
	margin-bottom:8px;
	display:table;
}



#detail .data li a{
	text-decoration: none;
}

#detail .data .color li.current, #detail .data .color li:hover a, #detail .data .color li:hover a{
	color: #fff;
}

#detail .data .color li:before {
	display:table-cell;
	width:17px;
	vertical-align:middle;
	content:"●";
	color: #d0cece;
	font-size:10px;
}
#detail .data .color li.current:before, #detail .data .color li:hover:before{
	content:url(../images/detail/dot.png);
	margin-right:7px;
	vertical-align:middle;
}

#detail .data .color li.no_page:before{
	content:"";
	margin-right:7px;
	vertical-align:middle;
}

#detail .data .material {
	padding:15px 0 5px 21px;
	border-bottom: #666 1px dashed;
}

#detail .data li span {
	display:table-cell;
	word-break: break-all;
	vertical-align:middle;
	padding-right:5px;
}

#detail .data .color li span:nth-of-type(1) { width: 4em; }
#detail .data .color li span:nth-of-type(2) { width: 7.5em; }
#detail .data .color li span:nth-of-type(3) { width: 5.5em; }

#detail .data .material li span:nth-of-type(1) { width: 6em; }
#detail .data .material li span:nth-of-type(2) { width: 5.5em; }
#detail .data .material li span:nth-of-type(3) { width: 5.5em; }



#detail footer {
	margin-bottom:75px;
	text-align:center;
}

/* field
------------------------- */
#field1, #field2, #field3, #field4, #field5, #field6 {
	padding: 20px 0;
	width: 100%;
	height: 300px;
	text-align: center;
	border-top: #000 1px solid;
	border-bottom: #000 1px solid;
	overflow: hidden;
}
#field1 {
	background: #fff;
}
#field2 {
	background: #eee;
}
#field3 {
	background: #ddd;
}
#field4 {
	background: #ccc;
}
#field5 {
	background: #bbb;
}
#field6 {
	background: #aaa;
}
section li:nth-of-type(odd) img {
	left: -100px;
	margin: 0 auto;
	display: none;
	position: relative;
}
section li:nth-of-type(even) img {
	right: -100px;
	margin: 0 auto;
	display: none;
	position: relative;
}
/* ============================================================
#inquiry
============================================================ */
#inquiry {
	font-family: "ヒラギノ丸ゴ ProN", "Hiragino Maru Gothic ProN", Meiryo, "メイリオ", "游ゴシック", YuGothic, sans-serif;
	padding-top: 230px;
}
#inquiry header {
	display: none;
}
#inquiry section {
	width: 940px;
	padding: 0 10px;
	margin: 0 auto;
}
#inquiry h3, #inquiry p {
	font-size: 16px;
	font-weight: normal;
	line-height: 2.25;
	margin-bottom: 2.25em;
}
#inquiry .back {
	text-align: right;
	margin-top: 80px;
}
.aColor {
	color: #147e9c;
}