/* ****************************************************************************
			スタジオ宙	stylesheet
			www.studio-myu.com
		Copyright 2014 Studio MYU Architects Co. Ltd.,

	2016.02.01	「English 日本語」の色をブログに合わせる
	2014.01.29	サブナビの上部に padding を15px 入れてスキマを空ける（3箇所）
	2013.02.06	「建築の事例」キーワードのインデント調整
	2013.02.03	「建築の事例」レイアウト変更
	2012.12.28	「建築の事例」＞「キーワードで探す」リンク文字を左寄せに
	2012.12.14	「建築の事例」＞「キーワードで探す」の横罫線を消去
	2012.12.07	背景色を白に変更
	2012.05.07	問合せフォームに対応
	2011.08.27	びおハウス、House1200 のサムネイルを追加
	2011.05.26	グローバルナビのボーダーとテキストの距離を 9->8px に変更。clearfix 追加
	2011.01.06	設計事例のページタイトルを本文にh2入れる。キャッチはpとする。
	2010.10.07	キーワードリストを背景：白、ボーダー#cccにする。
	2010.10.07	sub-navi3を追加
	2010.07.28	「お問合せ」ページの id class を追加
	2010.07.28	「設計事例」キーワードページの id class を追加
	2010.07.20	「設計事例」トップページの事例を分ける縦罫を追加。
				キャッチを絶対座標にする。
				「建築作品カテゴリーページ」paginateを追加
	2010.07.06	「仕事の進め方」用のサブナビの幅を137pxに
	2010.07.03	「仕事の進め方」用の.centerを追加
	2010.07.01	「仕事の進め方」用のサブナビを追加
**************************************************************************** */

/* +++++++++++++++++++++ ベース設定 +++++++++++++++++++++ */
*	{
	margin: 0;
	padding: 0;
	}

body	{
	text-align: justify;
	text-justify: inter-ideograph;
	font-family: Arial;
	background-color: #ffffff;
	}

img	{
	border: 0;
	}

#wrapper {
	width: 828px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 10px;
	background-color: transparent;
	}

/* ++++++ clearfix http://codezine.jp/article/detail/4939?p=3 ++++++ */
.clearfix:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	line-height:0;
	visibility:hidden;
	}
.clearfix {
	display: inline-block; /* for IE 7 */
	}
/* Hides from Mac IE \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from Mac IE */

/* +++++++++++++++++++++ ヘッダー（全体、バナー部分）+++++++++++++++++++++ */
#header	{
	width: 828px;
	padding: 0px 0px;
	background-color: transparent;
	}

#banner	{
	float: left;
	padding: 0px 0px 0px 0px;
	}

/* +++++++++++++++++++ ヘッダー（コントロール部分） +++++++++++++++++++ */
#header-ctrl	{
	float: right;
	width: 580px;
	padding: 3px 0px 0px 0px;
	}

#header-ctrl ul {
	margin: 0px 0px 0px 10px;
	padding: 0;
	list-style-type: none;
	}

#header-ctrl ul li {
	float: right;
	margin: 0;
	padding: 0px 0px 0px 10px;
	font: normal normal bold 9pt /1 Arial,sans-serif;
	}

#header-ctrl ul li a			{text-decoration: none;}
#header-ctrl ul li a:link		{color: #365587;}
#header-ctrl ul li a:visited	{color: #6F8AB7;}
#header-ctrl ul li a:hover		{text-decoration: underline;}

/* +++++++++++++++++++ ヘッダー（グローバルナビ部分） +++++++++++++++++++ */
#global-navi	{
	float: right;
	padding-top: 15px;
	}

#global-navi ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#global-navi ul li {
	float: left;
	margin: 0;
	padding: 0;
	font: normal normal bold 9pt /1 Arial,sans-serif;
	}

#global-navi a	{
	display: block;
	color: #666666;
	text-decoration: none;
	padding: 3px 8px 3px 8px;
	border-left: solid 1.5px #999999;
	}

#global-navi li.last a	{
	border-right: solid 1.5px #999999;
	}

#global-navi li.current a {
	color: #ff9a00;
	}

#global-navi a:hover, #global-navi li.current a:hover	{
	color: #ff9a00;
	}

/* +++++++++++++++++++ ヘッダー（サブナビ 設計事例） +++++++++++++++++++ */

#sub-navi	{
	clear: both;
	float: left;
	margin: 0px 0px 0px 0px;
	padding-top: 15px;
	}

#sub-navi ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#sub-navi ul li {
	float: left;
	margin: 0;
	padding: 0;
	font: normal normal bold 10pt /1 Arial,sans-serif;
	}

#sub-navi a	{
	display: block;
	width: 94px;
	padding: 10px 0 12px 0;
	text-align: center;
	color: #666666;
	text-decoration: none;
	background-color: #cccccc;
	border-left: solid 1px #ffffff;
	}

#sub-navi li.last a	{
	width: 162px;
	border-left: solid 1px #ffffff;
	}

#sub-navi li.first a	{
	border-left: solid 1px #cccccc;
	}

#sub-navi li.current a {
	color: #ff9a00;
	}

#sub-navi a:hover, #sub-navi li.current a:hover	{
	color: #ff9a00;
	}

/* +++++++++++++++++++ ヘッダー（サブナビ 2 仕事の進め方） +++++++++++++++++++ */

#sub-navi2	{
	clear: both;
	float: left;
	margin: 0px 0px 0px 0px;
	padding-top: 15px;
	}

#sub-navi2 ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#sub-navi2 ul li {
	float: left;
	margin: 0;
	padding: 0;
	font: normal normal bold 10pt /1 Arial,sans-serif;
	}

#sub-navi2 a	{
	display: block;
	width: 137px;
	padding: 10px 0 12px 0;
	text-align: center;
	color: #666666;
	text-decoration: none;
	background-color: #cccccc;
	border-left: solid 1px #ffffff;
	}

#sub-navi2 li.last a	{
	width: 137px;
	border-left: solid 1px #ffffff;
	}

#sub-navi2 li.first a	{
	border-left: solid 1px #cccccc;
	}

#sub-navi2 li.current a {
	color: #ff9a00;
	}

#sub-navi2 a:hover, #sub-navi li.current a:hover	{
	color: #ff9a00;
	}

/* +++++++++++++++++++ ヘッダー（サブナビ 3 スタジオ宙について） +++++++++++++++++++ */

#sub-navi3	{
	clear: both;
	float: left;
	margin: 0px 0px 0px 0px;
	padding-top: 15px;
	}

#sub-navi3 ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#sub-navi3 ul li {
	float: left;
	margin: 0;
	padding: 0;
	font: normal normal bold 10pt /1 Arial,sans-serif;
	}

#sub-navi3 a	{
	display: block;
	width: 102px;
	padding: 10px 0 12px 0;
	text-align: center;
	color: #666666;
	text-decoration: none;
	background-color: #cccccc;
	border-left: solid 1px #ffffff;
	}

#sub-navi3 li.first a	{
	width: 104px;
	border-left: none;
	}

#sub-navi3 li.last a	{
	width: 105px;
	border-left: solid 1px #ffffff;
	}

#sub-navi3 li.current a {
	color: #ff9a00;
	}

#sub-navi3 a:hover, #sub-navi li.current a:hover	{
	color: #ff9a00;
	}

/* +++++++++++++++++++ フッター部分のデザイン +++++++++++++++++++ */
#footer p,#footer address{
	clear: both;
	width: 822px;
	padding: 5px 10px 0px 3px;
	font: normal normal normal 9pt /1.3 Arial,sans-serif;
	color: #666666;
	text-align: right;
	}


/* +++++++++++++++++++ コンテンツ部分のデザイン +++++++++++++++++++ */

#top-image{		/* トップイメージ用 */
	clear: both;
	width: 828px;
	height: 416px;
	margin: 0px;
	}

#top-image img{		/* トップイメージ用 */
	width: 828px;
	height: 416px;
	}

#content-home{		/* トップページ用 */
	clear: both;
	width: 826px;
	margin: 0px 0px 0px 0px;
	border-left: solid 1px #cccccc;
	border-right: solid 1px #cccccc;
	border-bottom: solid 1px #cccccc;
	background-color: #ffffff;
	}

#content{
	clear: both;
	width: 826px;
	margin: 0px 0px 0px 0px;
	border: solid 1px #cccccc;
	background-color: #ffffff;
	}

.entry{
	clear: both;
	padding: 0px 8px 0px 8px;
	}

.center	{text-align: center;}	/* 仕事の内容の矢印用 */

.back	{background-color: #cccccc;}	/* 背景をグレーにする */

.org1	{background-color: #f8d583;}	/* 背景を薄いオレンジにする */
.org2	{background-color: #ffbc3a;}	/* 背景をオレンジにする */

/* .gray1	{background-color: #f6f6f6;}	 背景をかなり薄いグレーにする */
.gray2	{background-color: #e0e0e0;}	/* 背景を薄いグレーにする */

/* ++++++ カラム ++++++ */
.one-column	{clear: both; width: 792px; padding: 0px 9px;}
.one-column img	{width: 792px;}


.small-column		{float:left; width: 252px; padding: 0px 9px;}
.small-column img	{width: 252px;}


.medium-column		{float:left; width: 387px; padding: 0px 9px;}
.medium-column img	{width: 387px;}


.large-column		{float:left; width: 522px; padding: 0px 9px;}
.large-column img	{width: 522px;}

.two-fifth-column	{float:left; width: 306px; padding: 18px 9px 5px 9px;}
.two-fifth-column img	{width: 306px;}

.three-fifth-column	{float:left; width: 468px; padding: 18px 9px 5px 9px;}
.three-fifth-column img	{width: 468px;}

.tx-in-column		{padding: 9px;}

/* ++++++ トップページ びおハウス、House1200 用 ++++++ */

.h1200-column	{float:left; width: 135px; padding: 9px 18px 5px 30px;}
.h1200-column img	{width: 135px;}


/* ++++++ 日本語プロフィールページ用 ++++++ */
/*  サムネイルジ用  */
.profile	{float:left; width: 150px; padding: 26px 9px 9px 17px;}
.profile img	{width: 150px;}

.profile-tx	{float:left; width: 201px; padding: 26px 9px 9px 9px;}

/*  個人プロフィール用  */
.quarter-column		{float:left; width: 180px; padding: 26px 9px 0px 18px;}
.quarter-column img	{width: 180px;}

.three-quarters-column		{float:left; width: 520px; padding: 26px 9px 0px 18px;}
.three-quarters-column img	{width: 520px;}
.three-quarters-column table tr td  	{line-height: 1.5; color: #555555;}


/* ++++++ 建築作品ルートページ用 ++++++ */
#root-content	{
	clear: both;
	width: 827px;
	border-left: solid 1px #ffffff;
	margin: 0px 0px 12px 0px;
	background-color: #ffffff;
	}

#root-key	{	/* キーワードのリストアップ */
	float:right;
	width: 161px;
	padding: 0;
	margin: 0;
	/* border-left: solid 1px #cccccc;*/
	}

#root-key ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#root-key ul li {
	margin: 0;
	padding: 0;
	font: normal normal bold 10pt /1 Arial,sans-serif;
	}

#root-key a	{
	display: block;
	padding: 10px 0 12px 21px;
	text-align: left;
	color: #666666;
	text-decoration: none;
	background-color: #ffffff;
	/*border-bottom: solid 1px #cccccc;*/
	}

#root-key li.current a {
	color: #ff9a00;
	}

#root-key a:hover, #sub-navi li.current a:hover	{
	color: #ff9a00;
	}

.root-list	{	/* カテゴリーのサムネイルリストアップ */
	float:left;
	padding: 0;
	}

.root-list-image	{
	float:left;
	width: 94px;
	height: 500px;
	border-right: solid 1px #ffffff;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	padding: 0;
	}

.root-list-image.last	{
	border-right: none;
	}

.root-list-image img	{
	width: 94px;
	padding: 0;
	}

#root-catch{	/* キャッチ */
	clear: both;
	height: 0;
	position: relative;
	top: -300px; right: 0px; bottom: 0px; left: 45px;
	}

/* ++++++ 建築作品カテゴリーページ用 ++++++ */
#paginate	{
	float:left;
	padding: 9px 0px 0px 12px;
	}

#paginate p	{
	color: #ff9a00;
	line-height: 1.5;
	padding-bottom: 0;
	font-weight: bold;
	}

.ditto_page, .ditto_currentpage	{
	letter-spacing: 0.5em;
	}

#category-title{
	float: left;
	padding: 18px 0 20px 18px;
	width: 165px;
	}

#category-title h2{
	color: #676767;
	line-height: 1.8;
	font-weight: normal;
	}

#category-catch{
	float:right;
	width: 588px;
	padding: 30px 0px 20px 0px;
	}

#category-catch h4, #keyword-catch h4{
	color: #333333;
	line-height: 1.5;
	padding-bottom: 24px;
	}

#category-catch p, #keyword-catch p{
	color: #676767;
	}

.list	{
	clear: both;
	padding: 10px 17px;
	}

.list-image	{
	float:left;
	width: 198px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	padding: 0px 0;
	}

.list-image img	{width: 120px;}

/* ++++++ 建築作品キーワード用 ++++++ */
#keyword-catch{
	float:left;
	width: 480px;
	padding: 30px 0px 0px 0px;
	}

.keyword-list	{
	float:left;
	width: 620px;
	padding: 36px 16px 10px 17px;
	}

.keyword-list-image	{
	float:left;
	width: 198px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	padding: 0px 0;
	}

.keyword-list-image img	{width: 120px;}


/* ++++++ 建築作品個別ページ用 ++++++ */
#permalink-keyword{
	clear: both;
	float: right;
	margin: 0;
	padding: 0;
	}

#permalink-keyword ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#permalink-keyword ul li {
	float: left;
	margin: 0;
	color: #666666;
	padding: 5px 6px 5px 3px;
	font: normal normal bold 10pt /1 Arial,sans-serif;
	}

#permalink-keyword a	{
	display: block;
	color: #ff9a00;
	text-decoration: none;
	}

#permalink-title{padding: 9px 17px 6px 17px;}

.arch-text	{float:left; width: 260px; padding: 0px 9px;}

.arch-image	{float:left; width: 514px; text-align: center; padding: 0px 9px;}
.arch-image img	{height: 300px;}

.thumbnail	{float:left; padding: 0px 9px;}
.thumbnail img	{height: 50px; padding: 0px 9px 9px 0px;}


/* ++++++ 【お問合せ】 ページ用 ++++++ */
.contact {
	padding: 0px 5px 5px 5px;
	}

#contactForm	{	}

.eform fieldset, .thankyou{
	margin: 10px 13px;
	padding: 15px;
	border: solid 1px #cccccc;
	background-color: #efefef;
	}

.eform legend{
	padding-top: 35px;
	}

div.errors{
	padding: 10px 10px;
	color: #990033;
	font-size: 9pt;
	}

div.thankyou {	}

.eform input#submit {	width: 24%;}

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


/* ################# コンテンツの文字設定 ################# */

/* +++++++++ ハイパーリンクの設定 +++++++++ */
a	{text-decoration: underline;}
	
a:link	{color: #365587;}

a:visited {color: #365587;}

a:hover {color: #D06440;}

a:hover img{
	filter: alpha(opacity= 70);
	opacity:0.7;
	background: #fff;
	}

/* +++++++++ 見出し（ページタイトル級） +++++++++ */
h1	{
	color: #333333;
	line-height: 1.5;
	}

/* +++++++++ 見出し（レベル２） +++++++++ */
h2	{
	color: #333333;
	line-height: 1.5;
	}


/* +++++++++ 見出し（レベル３） +++++++++ */
h3	{
	color: #333333;
	line-height: 1.5;
	}

/* +++++++++ サブコンテンツ説明文 +++++++++ 
h4	{
	color: #676767;
	line-height: 1.8;
	padding-top: 24px;
	font-weight: normal;
	}
*/

/* +++++++++ 本文 +++++++++ */
p	{
	color: #444444;
	line-height: 1.8;
	padding-bottom: 1em;
	}

/* +++++ 画像配置用 +++++ */
p.photo	{
	line-height: 1;
	padding-bottom: 0px;
	}

/* +++++ 画像キャプション用 +++++ */
p.cap	{
	color: #666666;
	line-height: 1.8;
	padding-bottom: 1em;
	text-align: right;
	}

/* +++++ トップ画像キャプション用 +++++ */
p.cap-top	{
	color: #666666;
	line-height: 1.8;
	padding: 0 0.7em 0 0;
	text-align: right;
	}

/* +++++++++ リストの設定 +++++++++ */
ul	{
	padding-left: 1em;
	padding-bottom: 1em;
	}

ul li	{
	color: #444444;
	margin-left: 10px;
	list-style-image: url("dogu-list.png");
	line-height: 1.5;
	}

ol	{
	padding-left: 2em;
	padding-bottom: 1em;
	}

ol li	{
	color: #444444;
	list-style-type: decimal;
	line-height: 1.5;
	}

dl {
	overflow: auto;
	padding-bottom: 2em;
	display: block;
	}

dl dt {
	color: #666666;
	font-weight: bold;
	float: left;
	clear: left;
	width: 15em;
	padding: 0.5em;
	display: block;
	line-height: 1.5;
	}

dl dd {
	margin: 0 0 0 16em;
	padding: 0.5em;
	padding-bottom: 2em;
	display: block;
	line-height: 1.5;
	}

/* +++++++++ テーブルの設定 +++++++++ */

table,tr,th,td  {
	border-spacing: 0px;
	border-collapse: 0px;
	}

th  {
	font-style: normal;
	font-weight: bold;
	line-height: 1.5;
	padding: 9px;
	color: #556677;
	border-left: solid 1px #f6f6f6;
	border-bottom: solid 1px #f6f6f6;
	}

th.item-1a	{width: 100px;}
th.item-1b	{width: 320px;}
th.item-1c	{width: 260px;}
th.item-1d	{width: 40px;}

th.item-2a	{width: 250px;}
th.item-2b	{width: 320px;}
th.item-2c	{width: 150px;}

th.item-3a	{width: 320px;}
th.item-3b	{width: 230px;}
th.item-3c	{width: 110px;}
th.item-3d	{width: 60px;}


td  {
	font-style: normal;
	font-weight: normal;
	line-height: 1.5;
	padding: 9px;
	color: #555555;
	border-left: solid 1px #f6f6f6;
	border-bottom: solid 1px #f6f6f6;
	}

td.tx-top	{vertical-align: top;}
td.tx-bottom	{vertical-align: bottom;}

/* +++++++++ 引用、整形済みテキストの設定 +++++++++ */
pre	{
	overflow: scroll;
	margin: 0 0 1em 0;
	padding: 0.8em 0.8em 0 0.8em;
	border: solid 1px #cccccc;
	background-color: #f6f6f6;
	}

code	{

	}

blockquote	{
	margin: 0 0 1em 0;
	padding: 0.8em 0.8em 0 0.8em;
	border: solid 1px #cccccc;
	background-color: #f6f6f6;
	}