/*
THEME NAME	:	TAU
VERSION		:	1.0
AUTHOR		:	IDE Yuta
AUTHOR URL	:	http://ideyuta.com
LAUNCH		:	2013.2.15
*/


/* SETUP
--------------------------------------------------- */
* { background-position: 0 0; background-repeat: no-repeat; margin: 0; padding: 0; text-align: left; }
body { margin: 0; color: #000; font: 13px/23px "Helvetica", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;  background: #fff; letter-spacing: 1px; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
ul, ol, dl, li, dt, dd { list-style: none; }
a	{ text-decoration: underline; overflow:hidden; border: 0; outline: none; color: #000; }
a:hover	{ text-decoration: none; }
img	{ border: 0; vertical-align: bottom;}

.clear	 { clear: both; }
.clear:after { content: ""; clear: both; display: block; height: 0; visibility: hidden; }


/* LANG */
.mincho  { font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro",'HiraMinProN-W3', "ＭＳ 明朝", "ＭＳ Ｐ明朝", "MS PMincho", serif; }
.shadow  { text-shadow: #fff 0px 1px 0px; }


#log { position: fixed; top:0; left:0; z-index: 9999; color: #000; }


/* BASE
--------------------------------------------------- */
#wrapper { width: 100%; min-width: 1000px; height: auto; position: absolute; top: 0; left: 0; z-index: 0; }
#header { width: 100%; height: 143px; min-width: 1000px; position: fixed; top: 0; left: 0; z-index: 100; overflow: hidden; }
#header_bg { width: 100%; height: 143px; background: #fff; }
#contents { width: 100%; height: auto; }

.works { width: 50%; height: auto; float: left; }

#wall {  width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 100; background: #fff; }
#loading { margin: 0 auto; width: 178px; height: 34px; position: relative; top: 50%; left: 0; }
#loading img { float: left; }


#header #logo { width: 600px; height: 143px; float: left; position: relative; top: 0; left: 0; }
#navigation { width: 400px; height: 143px; float: right; background: #000; cursor: pointer; }
#navigation span { display: block; width: 400px; height: 143px; background: url('../images/global/information.png') no-repeat; }
#navigation span:hover { background: url('../images/global/information_hover.png') no-repeat; }
#nav_btn { width: 50px; height: 143px; background: url('../images/global/nav.gif') no-repeat; position: fixed; top: 0; left: -50px; z-index: 200; cursor: pointer; }
#nav_btn:hover { background: url('../images/global/nav_active.gif') no-repeat; }

#information { clear: both; width: 100%; height: auto; background: #fff; overflow: auto; }
#outline { padding: 40px 20px 0 20px; width: 550px; height: auto; float: left; }
#hosting { padding: 40px 0 0 0; width: 410px; height: auto; float: left; }

#hosting h4 { padding: 60px 0 0 0; }
#hosting li { margin: 8px 0; line-height: 20px; }

#outline h2 { font-size: 19px; }
#outline h2 span { display: block; font-size: 10px; }
#outline ul { padding: 20px 0; }
#outline .date_day { padding: 20px 0 0 0; font-size: 14px; font-weight: bold; }
#outline .place { padding: 40px 0 0 0; font-size: 18px; }




/* GRID CONTENT
--------------------------------------------------- */
.grid-content { background: #fff; }
.grid-content div { width: 150px; height: auto;  background-color: #fff; margin: 8px; padding: 0px; position: absolute; z-index: 10;  }
.grid-content div.small img { width: 150px; height: auto; }
.grid-content div.medium { width: 316px; }
.grid-content div.medium img { width: 316px; height: auto; }
.grid-content div.large { width: 482px; }
.grid-content div.large img { width: 482px; height: auto; }
.grid-content div h3 { line-height: 1.1em; margin: 0; padding: 0; }
.grid-content div p { margin: 0; padding: 0; }



.grid-content div.name { margin: 0; padding: 40px 0 0 0; width: 100%; height: 20px; border-width: 0; background: #fff; font-size: 20px; line-height: 20px; color: #999; letter-spacing: 15px; font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro",'HiraMinProN-W3', "ＭＳ 明朝", "ＭＳ Ｐ明朝", "MS PMincho", serif; }
.name h3 { padding: 5px 10px !important; }
.title p { display: inline; background: #000 !important; color: #fff; padding: 2px 5px !important; }
.concept { padding: 20px !important; line-height: 80px; height: 200px; overflow:  hidden; color: #f4f4f4; }
.concept:hover { color: #000; overflow: auto; letter-spacing: 1px; }