/* CSS Document */

/*初期設定
---------------------------------------------------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	color: #393B46
}
 
 
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
	display:block;
}

nav ul {
	list-style:none;
}


blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}


table {
	border-collapse:collapse;
	border-spacing:0;
}


img {
	vertical-align: top;
	font-size:0;
	line-height: 0;
}


/*box
---------------------------------------------------------------------------*/
#box {
	width:950px;
	height:auto;
	background-color:#EFE6DD;
	margin:0 auto;
}


/*リンク全般
---------------------------------------------------------------------------*/
a {
	text-decoration: none;
	color: #393B46;
 }

a:link {
	color: #393B46;
 }

a:visited {
	color: #393B46;
 }

a:hover {
	color: #393B46;
 }


/*header
---------------------------------------------------------------------------*/
header {
	width:930px;
	height:200px;
}

h1 {
	font-size: 150px;
	margin-left:10px;

}

h2 {
	font-size: 40px;
	margin-left:15px;
	line-height:10px;

}

h3 {
	text-align: center;
}

#h {
	float:left;

}


/*header-info
---------------------------------------------------------------------------*/
#div {
	width:380px;
	height:80px;
	border:1px dashed #FFF8E2;
	margin: auto;
	margin-top:10px;
	text-align: center;
}

#div pre {
	color: #FFF8E2;
	letter-spacing:2px;
}

.info {		
	margin-left:255px;
	margin-top:50px;
	float:left;
	display:block;
	overflow: visible;
	-webkit-perspective: 1000px;
	perspective: 1000px;
}

.info li {
	position: absolute;
}

.info img,
.info dl {
	-webkit-transition: opacity 0.6s, -webkit-transform 0.6s;
	transition: opacity 0.6s, transform 0.6s;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
 
.info:hover img {
	-webkit-transform: rotateX(180deg);
	transform: rotateX(180deg);
}
 
.info dl {
	width:400px;
	height:100px;
	background-color: #CD5C5C;
	-webkit-transform: rotateX(-180deg);
	transform: rotateX(-180deg);
	position: absolute;
	top: 0;
}

.info:hover dl {
	-webkit-transform: rotateX(0);
	transform: rotateX(0);
}


/*sextion
---------------------------------------------------------------------------*/
section {	
	width:930px;
	height:auto;
}


/*article-index
---------------------------------------------------------------------------*/
#topimg {
}

#img {  
	text-align: center;
	font-size:20px;
	font-weight:bold;
        width:910px;
	margin:0 auto;
}



/*article-about
---------------------------------------------------------------------------*/
#profile {
	float:left;
	margin-right:20px;

}

.profile {
	font-weight:bold;

}


/*article-gallery
---------------------------------------------------------------------------*/
#gallery {
	margin-left:10px;
}


/*article-works
---------------------------------------------------------------------------*/
#works {
	margin-top:20px;
}


/*article-booth
---------------------------------------------------------------------------*/
article {
	width:930px;
	height:auto;
	margin-left:20px;
	margin-top:30px;
	letter-spacing:1px;
}

h4, h5, h6 {
	margin-top:50px;
	width:450px;
	border-bottom:double 4px;
	padding-bottom:5px;
	letter-spacing:2px;
	font-size:17px;
}

h6 {
	margin-top:80px;
}

#shop {	
	margin-top:25px;
}

#shop img {
	margin-right:20px;
}

.title {
	margin-top:30px;
	font-weight:bold;
}

pre {
	margin-top:10px;
	line-height:20px;

}

pre a:hover {
	color: #808080;
	border-bottom:dashed 1px;
	padding-bottom:2px;
}


/*article-contact
---------------------------------------------------------------------------*/
#mail {
	color:#B22222;
}


/*nav1
---------------------------------------------------------------------------*/
#nav1 {
	width:930px;
	height:35px;

	margin:0px 10px 10px 0px;
	color:#393B46;
	text-align: right;
}

#nav1 ul {
	display: inline-block;
}

#nav1 ul li {
	float:left;
	border-top:dashed 1px;
	border-bottom:dashed 1px;
	border-left:dashed 1px;
}

#nav1 ul li a {
	width:70px;
	height:20px;
	line-height:20px;
	display:block;
	font-size:14px;
	text-align:center;
	text-decoration:none;
	color:#393B46;
	letter-spacing:1px;
}

#li1 {
	border-right:dashed 1px;
}

#nav1 a:hover {
	background-color:#DED8D2;
	color: #393B46;
 }
/*nav2
---------------------------------------------------------------------------*/
#nav2 {
	width:930px;
	height:50px;
	border-radius:10px;
	background-color:#7D9694;
	font-weight:bold;
	margin:0 10px 10px 10px;
	color:#393B46;
	text-align: center;
}

#nav2 ul {
	display: inline-block;
}

#nav2 ul li {
	float:left;
	border-right:dashed 1px;
}

#nav2 ul li a {
	width:100px;
	height:50px;
	line-height:50px;
	display:block;
	letter-spacing:2px;
	text-align:center;
	text-decoration:none;
	color:#393B46;
}

#li2 {
	border-left:dashed 1px;
}

#nav2 a:hover {
	background-color:#A5BFBC;
	color: #393B46;
 }

/*footer
---------------------------------------------------------------------------*/
footer {
	width:950px;
	height:40px;
	margin-top:25px;
	padding-top:20px;
	background-color:#393B46;
	text-align:center;
	color: #FFFFFF;
}



/*footer
---------------------------------------------------------------------------*/