@charset "utf-8"; /*文字コード指定*/

/* ----- css reset(各ブラウザで指定されているスタイルを初期化)と全体設定 ----- */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, textarea, p, th, td, img {
	margin: 0; /*ボックス外側の余白(値1つは上下左右をまとめて指定)*/
	padding: 0; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
	border: 0; /*境界線指定*/
}

body {
		width: 100%; /*幅指定*/
		float: center;
     background-image: url(../images/photos/carbon.gif);	/*BK背景画像*/
	 background-position: center center; /*BK背景中央に*/
	border:1px solid #424242; /*境界線指定*/
	line-height: 2;	/*行の高さ指定(数値のみの場合はfont-sizeの倍数)*/
	font-family:'Lucida Grande',
 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',
 Meiryo, メイリオ, sans-serif;/*フォントの種類指定(左から優先順位)*/
	font-size: 100%; /* フォントサイズ指定(%はブラウザに設定した標準文字サイズ(通常16px)に対する値)*/
	color: #fff; /*文字色指定*/
}

ol, ul {
	list-style: none; /*リストマーカーの種類指定(noneはなし)*/
}

a { /*リンクの文字設定(マウスをのせる前)*/
	color: #fff; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
	text-decoration: underline; /*テキストの装飾指定(下線、上線など)(underlineは下線を引く)*/
}

a:hover { /*リンクの文字設定(マウスをのせた時)*/
	color: #fff; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
}

.color1 {
	color: #ffd900; /*文字色指定*/
}

/* ----- ヘッダー(ページの一番上の部分) ----- */

#header {
	width: 800px; /*幅指定*/
	margin: 10px auto; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
		float: center;
}

/* ----- ロゴ ----- */

#logo {
	margin: 30px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
	font-family:'Lucida Grande',
 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',
 Meiryo, メイリオ, sans-serif;;
	font-size: 2em; /* フォントサイズ指定(emはフォントの高さを１とした相対指定)*/

	text-align: center; /*行の水平方向の揃え方(centerは中央揃え)*/
}

#logo a {
	color: #fff5e2; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
}

#logo a:hover {
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
}

/* ----- メニュー ----- */


.mainmenu a,{
background-color: #FACC2E; /*文字色指定*/
}

.mainmenu ul, .submenu ul {
	line-height: 30px; /*行の高さ指定*/
	text-align: center; /*行の水平方向の揃え方(centerは中央揃え)*/
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	
	font-size: 2em; /* フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
}




.mainmenu li, .submenu li {
	display:inline; /*要素の表示形式指定（inlineはインラインボックスを指定）*/
	padding: 0 10px; /*ボックス内側の余白(値2つは左から上下,左右の値)*/
}

.mainmenu a, .submenu a {
	color: #FFFFFF; /*文字色指定*/
	text-decoration: none; /*テキストの装飾指定(下線、上線など)(noneはなし)*/
}

.mainmenu a:hover, .mainmenu a.active, .submenu a:hover, .submenu a.active {
	color: #FACC2E; /*文字色指定*/
}

/* ----- レイアウト ----- */

#topcontainer { /*container(入れ物、容器)の中に各要素(ボックス)を配置*/
	width: 1100px; /*幅指定*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/
}

#topcontent {
	margin: 20px 40px; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
	text-align: center; /*行の水平方向の揃え方(centerは中央揃え)*/
}	



#copy { /*container(入れ物、容器)の中に各要素(ボックス)を配置*/
	width: 560px; /*幅指定*/
	text-align: left; /*行の水平方向の揃え方(centerは中央揃え)*/
	margin: 0 left; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/	
	line-height: 1.2;	/*行の高さ指定(数値のみの場合はfont-sizeの倍数)*/
	color: #424242; /*文字色指定*/
	font-size: 1em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
}




#item-container2 { /*container(入れ物、容器)の中に各要素(ボックス)を配置*/
	width: 1000px; /*幅指定*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/
	height: 1000px; /*領域の高さ指定*/
	
	
}
#container { /*container(入れ物、容器)の中に各要素(ボックス)を配置*/
	width: 1100px; /*幅指定*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/
}

#container2 { /*container(入れ物、容器)の中に各要素(ボックス)を配置*/
	width: 1000px; /*幅指定*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/
}


#content {
	margin: 50px 30px; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
	text-align: left; /*行の水平方向の揃え方(leftは左揃え)*/
}


#content2 {
	width: 600px; /*幅指定*/
	margin: 50px 30px; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
	text-align: left; /*行の水平方向の揃え方(leftは左揃え)*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/
}


/* ----- フッター(ページの一番下の部分) ----- */


#footer {
	height: 300px; /*領域の高さ指定*/
	width: 100%; /*幅指定(100%は画面横幅いっぱいに表示)*/
	background:url(../images/h_img22.jpg) repeat-x top center #000;/*フッター全体の背景色を指定*/
}

#footer p {
	margin-top: 10px; /*ボックス外側上の余白*/
	text-align: center; /*行の水平方向の揃え方(centerは中央揃え)*/
	font-size: 0.75em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	color: #FFFFFF; /*文字色指定*/
}

/* ----- コンテンツ ----- */

#topcontent h1 {
	color: #fff5e2; /*文字色指定*/
	font-weight: normal; /*フォントの太さ指定(normalは標準)*/
	font-size: 2.2em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
}

#topcontent h2 {
	color: #f3e1af; /*文字色指定*/
	font-size: 1.5em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	font-weight: normal; /*フォントの太さ指定(normalは標準)*/
	margin: 10px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
}

#topcontent ul {
	margin-bottom: 20px; /*ボックス外側下の余白*/
}

#topcontent ul li {
	padding: 10px 0; /*ボックス内側の余白(値2つは左から上下,左右の値)*/
	font-size: 1.2em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
}

#content2 h1 {
	color: #FACC2E; /*文字色指定*/
	font-weight: strong; /*フォントの太さ指定(normalは標準)*/
	font-size: 2em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	text-align: center; /*行の水平方向の揃え方(centerは中央揃え)*/
}

#content h1 {
	color: #FACC2E; /*文字色指定*/
	font-weight: strong; /*フォントの太さ指定(normalは標準)*/
	font-size: 2.2em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	text-align: center; /*行の水平方向の揃え方(centerは中央揃え)*/
}

#content h2 {
	color: #ffcc99; /*文字色指定*/
	font-size: 1.5em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	font-weight: strong; /*フォントの太さ指定(normalは標準)*/
	margin: 1px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
}

#content2 h2 {
	color: #ffcc99; /*文字色指定*/
	font-size: 1.3em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	font-weight: strong; /*フォントの太さ指定(normalは標準)*/
	margin: 1px 0; /*ボックス外側の余白(値2つは左から上下,左右の値)*/
}

#content ul {
	margin-bottom: 20px; /*ボックス外側下の余白*/
}

#content ul li {
	padding: 10px 0; /*ボックス内側の余白(値2つは左から上下,左右の値)*/
	font-size: 1.2em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
}
#content ol li {
	margin-left: 40px; /*ボックス外側左の余白*/
	font-size: 1.2em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	list-style-type: decimal; /*リスト先頭文字種類指定（decimalは算用数字）*/
}
/* ----- テーブル設定 ----- */

.ta {
	width: 900px; /*幅指定*/
	margin: 0 auto; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/
	margin-bottom: 50px; /*ボックス外側下の余白*/
	border-collapse: collapse; /*境界線の表示指定(collapseは重ねて表示)*/
}

.ta th, td {
	border: none; /*境界線の一括指定(noneはなし)*/
	padding: 0 10px; /*ボックス内側の余白(値2つは左から上下,左右の値)*/
	font-size: 1.2em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
	font-weight: normal; /*フォントの太さ指定(normalは標準)*/
	text-align: left; /*行の水平方向の揃え方(leftは左揃え)*/
}

.ta img {
	padding: 0 5px; /*ボックス内側の余白(値2つは左から上下,左右の値)*/
}

.left {
	padding-left: 20px; /*ボックス内側左の余白*/
}



#parts .box1 {
	float: left;
	height: 220px;	/*ボックスの高さ*/
	width: 210px;	/*ボックスの幅*/
	margin-bottom: 1em;	/*ボックスの下にとるスペース*/
	border: 1px solid #333333;	/*枠線の幅、線種、色*/
	display: inline;
	margin-left: 15px;
	padding: 12px;		/*ボックス内の余白*/
	font-size: 11px;	/*文字サイズ*/
	line-height: 1.5;	/*行間*/
	background: url(../images/bg2.gif) repeat right bottom;	/*背景画像*/
	overflow: hidden;
		text-align: left; /*行の水平方向の揃え方(centerは中央揃え)*/
}

/*menubox内のh3タグ設定*/
#parts .box1 h3 {
	font-size: 100%;
	color: #FACC2E;	/*文字色*/
	margin-top: 3px;
		text-align: center; /*行の水平方向の揃え方(centerは中央揃え)*/
}
/*menubox内の段落タグ設定*/
#parts .box1 p {
	padding: 0px;
}

hr.line {
height: 2px;
border: none;
border-top: 2px #424242 ;
}

hr.line2 {
height: 2px;
border: none;
border-top: 2px #A4A4A4 dotted;
}


.image img{
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}



#toi { /*container(入れ物、容器)の中に各要素(ボックス)を配置*/
	float: center;
	width: 990px; /*幅指定*/
	text-align: center; /*行の水平方向の揃え方(centerは中央揃え)*/
	margin: 0 center; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/	
	line-height: 1.4;	/*行の高さ指定(数値のみの場合はfont-sizeの倍数)*/
	color: #000000; /*文字色指定*/
	font-size: 1em; /*フォントサイズ指定(emはフォントの高さを１とした相対指定)*/
}



.box1{
	float: left;
	width:480px;
	height:830px;
	padding: 12px;	
}
.box2{
	float: left;
	width:440px;
	height:830px;
	padding: 12px;	
}


.box3{
	float: left;
	width:480px;
	height:360px;
	padding: 12px;	
}
.box4{
	float: left;
	width:440px;
	height:360px;
	padding: 12px;	
}

.box5{
	float: left;
	width:490px;
	height:300px;
	padding: 10px;	
}
.box6{
	float: left;
	width:490px;
	height:300px;
	padding: 10px;	
}


.box7{
	float: left;
	width:480px;
	height:460px;
	padding: 12px;	
}
.box8{
	float: left;
	width:480px;
	height:460px;
	padding: 12px;	
}


	
	.ta1 {
	width: 1000px;
	float: center;
	border-radius: 10px;
	margin: 0 center; /*ボックス外側の余白(値2つは左から上下,左右の値(左右autoで中央配置))*/	
		background-color: #333333;	/*背景色*/

		
}
	
	.mb1em {
	margin-bottom:4em;
	border: 1px solid #b9b9b9;
		float: center;
}



.c {
	text-align: center;

}

.ws {
	width: 70%;
}


.ta1, .ta1 td, .ta1 th{
	border: 1px solid #333238;	/*枠線の幅、線種、色*/
	line-height: 2;
}
/*テーブル内の右側*/
.ta1 td{
	width: 300px;
	padding: 15px;
		border: 1px solid #555555;	/*枠線の幅、線種、色*/
}
/*テーブル内の左側の見出し部分*/
.ta1 th{
	width: 100px;
	padding: 10px;
	text-align: center;
	background-color: #444;	/*背景色*/
	color: #FFF;	/*文字色*/
}
/*thタグにリンクを設定した場合のテキスト色*/
.ta1 th a {
	color: #FFF;
}
/*テーブル１行目に入った見出し部分*/
.ta1 th.tamidashi{
	width: auto;
	text-align: left;
	background-color: #444;	/*背景色*/
}

.btn {
	font-size: 16px;
	webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */  
}


h4{
    position: relative;
		text-align: left;
    color: #FFF;
    font-size: 1.143em;
    font-weight: bold;
    margin: 6 0 6em;
    padding: 0.5em 6em 0.5em 2.5em;
    border-bottom: 2px solid #cc9900;
}
 
h4:before{
    content: "";
    position: absolute;
    background: #ffcc00;
    top: 0;
    left: 0.4em;
    height: 12px;
    width: 12px;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}
 
h4:after{
    content: "";
    position: absolute;
    background:#cc9900;
    top: 1.0em;
    left: 0;
    height: 8px;
    width: 8px;
    transform: rotate(15deg);
    -moz-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    -o-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
}


.grad3 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.50, #666), color-stop(0.50, #111));
    background: -webkit-linear-gradient(#666, #111);
    background: -moz-linear-gradient(#666, #111);
    background: -o-linear-gradient(#666, #111);
    background: -ms-linear-gradient(#666, #111);
    background: linear-gradient(#666, #111);
	width: 100%; /*幅指定*/
	

	
}
.rad1 {
    border-radius: 10px;

}
ul.menu3 {
    background-color:#000;
    box-shadow: 0px 1px 1px #666;
    height:30px;
}
ul.menu3 li {
    float:center;
    border-left:1px solid #666;
    padding: 2px 0px;
	   font-size: 0.8em;
	   
}
ul.menu3 li:first-child
{
    border-center:none;
}
ul.menu3 li a {
    color:white;
    text-decoration:none;
    padding: 3px 5px;
	
}
ul.menu3 li a:hover {
    text-shadow: 1px 1px 2px #fff;
    font-weight:nomal;
    text-decoration:none;
    background-color:#666;
	text-align: center;
}



/*ギャラリー全体のコンテナー*/
#stage {
    position: relative;
    width: 999px;
    height: 700px;
    margin: 0 auto;
    overflow: hidden;
}
/*全サムネイルのコンテナー*/
#thumbs {
	position: absolute;
	width: 999px;
	top: 399px;
	left: 10px;
}
/*サムネイルのマウスオーバーでポインターを手のひらに*/
#thumbs label img {
    cursor: pointer;
}
/*初期画面*/
#screen {
    position: absolute;
    left: 1px;
    top: 1px;
    width: 999px;
    height: 360px;
    background-color: #000;
}
/*初期画面上の文字*/
#screen span {
    position:absolute;
    top:150px;
    left:40px;
    font-size:30px;
}
/*ラジオボタンを非表示に*/
#r1, #r2, #r3, #r4, #r5,#r6,#r7 {
    display: none;
}
/*表示写真の初期配置（全部画面右に透明配置）とtransition設定*/
#photo1, #photo2, #photo3, #photo4, #photo5, #photo6, #photo7 {
    position: absolute;
    left: 100px;
    top: 10px;
    opacity:0;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}
/*チェックされたサムネイルに相当する写真だけを画面中央に移動・FadeIn*/
#r1:checked ~ #photo1, #r2:checked ~ #photo2, #r3:checked ~ #photo3, #r4:checked ~ #photo4, #r5:checked ~ #photo5 , #r6:checked ~ #photo6, #r7:checked ~ #photo7{
    //position:absolute;
    left:30px;
    opacity:1;
}
/*どれかがチェックされたらスクリーン上の文字を非表示に*/
#r1:checked ~ #screen span, #r2:checked ~ #screen span, #r3:checked ~ #screen span, #r4:checked ~ #screen span, #r5:checked ~ #screen span , #r6:checked ~ #screen span, #r7:checked ~ #screen span{
    opacity: 0;
}
/*画面右側のstage部を隠すためのカバー*/
#cover {
    position:absolute;
    left:730px;
    width:30px;
    height:348px;
    background-color:#000;
}



.left {float: left;margin-right:10px;}







table.type12 {
	border-collapse: separate;
	border-spacing: 2px;
	text-align: left;
	line-height: 1;
	font-size: 80%; 
	font-weight: nomal;
}
table.type12 th {
	width: 120px;
	padding: 4px;
	font-weight: strong;
	vertical-align: top;
	color: #999;
	background: #999;
	font-size: 120%; 
}
table.type12 td {
	width: 120px;
	padding: 3px 10px;
	vertical-align: top;
	background: #000;
	font-size: 90%; 
}
table.type12 th.col01 {background-image: url(../images/photos/carbon.gif);	/*BK背景画像*/;
           color: #fff5e2; /*文字色指定*/
	font-size: 110%; 
	font-weight: strong;

}


a img:hover {
         opacity: 0.6;
         filter: alpha(opacity=60);
}