@charset "UTF-8";


/* 
*
*  Maika Kobayashi
*
*  layout
*
*/	



/* ////////////////////////////////     body      ////////////////////////////////////////// */	
html,body {
	text-align: center;
	background: url(../images/common/bg.gif) no-repeat left top;
	height:100%;
	}
	
	#wrapper{width:100%;height: auto;overflow: hidden;}
	#wrapper{display: none}

	#navi {
	float: left;
	padding-bottom: 32767px;
	margin-bottom: -32767px; 
	}
	
	
	.cl {
		display: inline-block;
	}
	.cl:after {
		content: "";
		display: block;
		clear: both;
	}
	
	#container{width:100%;}
	
	
/* ////////////////////////////////     navigation      ////////////////////////////////////////// */	
			
			
#intro .btn_enter{text-align: center;
	width: 100%;background:#ffffff;
	position: absolute;top: 80%;
	padding: 20px;
	z-index: 99999;
	filter:alpha(opacity=85);
     -moz-opacity:0.85;
     -khtml-opacity: 0.85;
     opacity:0.85;
     }

#navi {float: left; width:180px;min-height: 1000px;z-index: 99999;position: relative}
.navi_prop {position: fixed; width:180px;height:400px;padding-top: 20px;background:url(../images/navi/bg_head.png) repeat-x center top;text-align: center;z-index: 99999}
	.navi_prop h1{text-align: center;margin-top:30px}
	.navi_prop p{text-align: center;margin-top:15px}

	.navi_prop #options {position: absolute;top:170px;left: 45px}
	.navi_prop #options li{text-align: center}

	.navi_prop .navi_conts {margin-bottom: 40px}
	.navi_prop .navi_conts li {margin-bottom: 11px}
		/* IE8 */.navi_prop .navi_conts li{margin-bottom:20px\9; }
	.navi_prop #sort-by li {margin-bottom: 1px}
		/* IE8 */.navi_prop #sort-by li {margin-bottom: 8px\9; }
	
	
			
.navi_prop #navi_sns {width:50px;height:15px;position: absolute;top:460px;left:70px}
	.navi_prop #navi_sns li{float: left;margin: 0 2px}
.navi_prop .copyright{position: absolute;top:490px;left:30px}


#navi_sp{display: none}	


/* ////////////////////////////////     body      ////////////////////////////////////////// */	



#conts{z-index: 100;}



.child {width: 100%;height: 100%;z-index: 500;position: absolute;left:0px;top:0;}
.child_container {background: url(../images/common/bg_child.png) repeat left top; margin-left: 180px;height: 100%;padding-top: 50px;}

.child_prop {width: 720px;min-height: 500px;margin: 0 auto;position: relative;}

	.prop_r {float: right}
	.prop_l {float: left}

	h2{background: url(../images/common/line_title.png) no-repeat center 50%;height: 90px;}
	
	.btn_close{position: absolute;top:15px;right:0}


/* ---- */

/* information */
#information{display: none}

 	#information li{margin-bottom: 50px}
 	#information .prop_l {width:100px}
 	#information .prop_r {width:450px}
	#information .new_mark{}
	#information .date{}
	
	#information h3{margin-bottom: 10px;font-weight: bold;font-size: 14px}
	

/* profile */
#profile{display: none}
	#profile h3{margin-bottom: 50px;}
	#profile .prop_l {width:330px}
 	#profile .prop_r {width:335px}
 	
 	
 	
/* exhibition */
#exhibition{display: none}
	#exhibition li{float: left;margin: 0 5px 5px 0}
	#exhibition .exhibition_lists{width: 210px;padding: 10px;background-color: #ffffff}
	#exhibition h3{font-weight: bold}

	#exhibition .type{}
	#exhibition .place{height: 30px}
	
	#exhibition .links{height: 30px;margin-bottom: 10px}
		#exhibition .links li{margin-right: 5px}
	#exhibition .detail{font-size: 9px}

/* links */
#links{display: none}
	#links .prop_r {width: 350px;}
	#links h3{margin-bottom: 15px;}
	#links .links_core{position: relative;margin-bottom: 50px;}
	#links .links_core .img_blog{position: absolute;width: 200px}
		#links .blog_p_road{margin-left: 200px;margin-top: 55px;}
	#links .txt{font-size: 9px;font-style: italic}

#links .btn_launch{position: absolute;right:0;top:20px;}

#gallery{z-index: 10}

/* contact */
#contact{display: none}
	#contact p{margin-bottom: 20px}


/* ////////////////////////////////     home      ////////////////////////////////////////// */	



.element {
	width: 162px;
	height: 162px;
}
.variable-sizes .element.width2 {
	width: 325px;
}
.variable-sizes .element.height2 {
	height: 325px;
}
.element.large, .variable-sizes .element.large, .variable-sizes .element.large.width2.height2 {
	width: 490px;
	height: 700px;
	z-index: 100;
	position:relative;
}
.c1 {
	background:url(images/gallery/c1.png) no-repeat left top;
	width:50px;
	height:50px
}
.c2 {
	background:url(images/gallery/c2.png) no-repeat left top;
	width:50px;
	height:50px
}
.imgL {
	visibility:hidden
}
.element.large .imgL {
	visibility:visible;
}
.imgS {
	visibility:visible
}
.element.large .imgS {
	visibility:hidden;
}
.title {
	z-index:101;
	visibility:hidden
}
.element.large .title {
	color:#000;
	visibility:visible;
	position:absolute;
	left:10px;
	bottom:10px;
}
.number {
	visibility:hidden
}

.element.large,
.variable-sizes .element.large,
	.variable-sizes .element.large.width2.height2 {
  font-size: 3.0em;
  width: 490px;
  height: 650px;
  z-index: 100;
}