/* CSS Document */

@charset "utf-8";

/* CSS Info =================================
File name: layout.css
Description: 
Editor: Eri Takatsuki/Showak
Date: 2013/11/4
updated:2014/06/02
Table of contents:
============================================*/

@import url(reset.css);
@import url(navi.css);
@import url(tables.css);


body{ margin:0;
	padding:0;
	font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	background-image:url(../images/fig/bk.png);
	background-position:top;
	background-repeat:repeat-x;
	}

.clear{clear:both; margin:0; }
br.clear{clear:both; margin-top:10px;}

a{ text-decoration:none; color:#3399ff;}
a:hover { text-decoration:underline; }
a:hover img{
			filter: alpha(opacity=80);
			-moz-opacity:0.80;
			opacity:0.80;
			}

.left{float:left;
	  padding:0 10px 10px 0;
	  }
.right{float:right;
		padding:0 0 10px 10px;
		}
.center { display:block;
		margin:0 auto 0;
		}

.bold { font-weight:bolder }

.pink { color:#FF00FF }
.blue { color:#6F95C2 }
.red {color:#dc143c; }

hr.style1 {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.50), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.50), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.50), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.50), rgba(0,0,0,0));
}

/* ---------- Wrapper ---------- */

div.wrapper{
	display:block;
	width:100%;
	text-align:left;
	}

h1 { font-size:12px;
	margin:0 0 10px 0;
	padding:0;
	}

	
h2 {
	margin:20px 0 0 0;
	font-weight:normal;
	color:#6F95C2;
	}	

h2 span { font-size:0.7em;
		color:#666;
		}	
		
h2 .date { float:right;	}

h2 a { color:#6F95C2;}	

				
h3 { color:#333;
	padding:4px 0;
	font-size:0.875em;
	font-weight:bolder;
	}
	
	
h4 {
	margin:10px 0;
	padding-left:14px;
	font-size:16px;
	font-weight:normal;
	display:block;
	background-image:url(../images/fig/bk_dot2.png);
	background-repeat:no-repeat;
	background-position:left;
	color:#555;
	}	
	
h6 {
	margin:0 0 10px 0;
	padding:0;
	font-size:12px;
	font-weight:normal;
	display:block;
	background-image:url(../images/fig/bk_dot.png);
	color:#666666;
	}
	
h6 span { background-color:#FFFFFF;
		padding: 0 4px 0 0;
		}
				

.col1{	color:#666; 
		}
.col2 { clear:both;
		}
.col2 a{ background-color:#191919;}

.col3{ margin:1px 0; 
		background-color:fff;
		color:#333;
		}
.col4{ color:#FFFF; 
		background-color:#232323;
		}
.col5{ color:#999; 
		background-color:#333;
		}
		
/*  ---------- Generalise ---------- */

#header, #breadcrumb, #featured_slide, .container, #hpage_cats, #adblock, #socialise, #footer, #copyright {
	position:relative;
	margin:0 auto 0;
	display:block;
	width:960px;
	}
p { margin:0; 
	padding:0;
	font-size:0.85em;
	line-height:1.6em;
	}


/*  ---------- Header ---------- */

#header{
	padding:5px 0 0 0;
	z-index:1000;
	}

#header h1, #header p, #header ul{
	margin:0;
	padding:0;
	list-style:none;
	line-height:normal;
	}
#header h1 span{ visibility:hidden; }

#header #logo{
	display:block;
	float:left;
	overflow:hidden;
	}

#header #logo p{
	text-align:left;
	font-size:0.7em;
	color:#666;
	}

/* サーチ */

div#search { position:absolute;
			top:40px;
			left:758px;
			}
#searchform4 {
	width: 202px;
	background: url(../images/fig/input4.png) left top no-repeat; 
	display: block;
	height: 27px;
	position: relative;
}
#keywords4	{
	width: 156px;
	position: absolute;
	top: 4px;
	left: 12px;
	background-color:transparent;
	border:none;
}
#searchBtn4	{
	position: absolute;
	top: 4px;
	left: 174px;
} 


/* ---------- BreadCrumb ---------- */

#breadcrumb{
  overflow: hidden;
  font-size:12px;
}
 
#breadcrumb li{
  float: left;
}
 
#breadcrumb a{
  padding: .5em 1em .5em 2em;
  float: left;
  text-decoration: none;
  color: #444;
  position: relative;
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
  background-color: #efefef;
  background-image: linear-gradient(to right, #ddd, #efefef);
}
 
#breadcrumb li:first-child a{
  padding-left: 1em;
  border-radius: 5px 0 0 5px;
}
 
#breadcrumb a:hover{
  background: #fff;
}
 
#breadcrumb a::after,
#breadcrumb a::before{
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -1.5em;
  border-top: 1.5em solid transparent;
  border-bottom: 1.5em solid transparent;
  border-left: 1em solid;
  right: -1em;
}
 
#breadcrumb a::after{
  z-index: 2;
  border-left-color: #efefef;
}
 
#breadcrumb a::before{
  border-left-color: #fff;
  right: -1.1em;
  z-index: 1;
}
 
#breadcrumb a:hover::after{
  border-left-color: #fff;
}
 
#breadcrumb .current,
#breadcrumb .current:hover{
  font-weight: bold;
  background: none;
}
 
#breadcrumb .current::after,
#breadcrumb .current::before{
  content: normal;
}

/* ---------- slide ---------- */

#featured_slide {
	height:405px;
	background:#3f3f3f;
	}

#featured_slide h3{
	margin:0 0 0 660px;
	padding-left:10px;
	padding-top:15px;
	line-height:1.6em;
	font-size:1em;
	font-family:"ヒラギノ角ゴ Pro W3",'Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,Osaka,'ＭＳ Ｐゴシック', Verdana, Helvetica, sans-serif ;
	color:#fff;
	}

#featured_slide h3 span {
		font-size:10px;
		color:#ccc;
		font-family:"Century Gothic", sans-serif;
		margin-bottom:4px;
		}

.featured_box{
	display:block;
	width:940px;
	height:375px;
	line-height:1.6em;
	}

.featured_box img{
	width:660px;
	height:375px;
	float:left;
	margin:15px;
	padding:0;
	-moz-box-shadow: 2px 2px 2px #232323;    /* firefox　*/
	-webkit-box-shadow: 2px 2px 2px #232323;
	box-shadow: 2px 2px 2px #232323;
	}

#featured_slide p {
		margin-left:660px;
		padding:0 0 0 10px;
		color:#ccc;
		font-size:0.875em;
		line-height:1.6 em;
		}


#featured_slide a{
	color:#3399FF;
	background:#3f3f3f;
	}
	
#featured_slide a:hover{
	text-decoration:underline;
	}

/*  ---------- Content ---------- */

.container{
	padding:20px 0 30px 0;
	}

#content{
	margin:0 0 20px 0;
	display:block;
	float:left;
	width:670px;
	}

#content p { padding:20px 0 }

.topbar {
	width:100%;
	}

.tags { clear:both;
		float:right;
		font-size:0.7em;
		}
		
ol { list-style:disc;
	font-size:0.85em;
	margin-left:40px;
	 }

ol li { padding:4px }

.left_40 {
	display:block;
	padding:10px 40px; }
	
.bk_gray { 	background-color:#ececec; 
			padding:0 10px;
			margin-bottom:10px;
			}

/*  ---------- Content ---------- */
div.post-content{
		clear:both;
		padding: 10px 0;
		line-height:1.6em;
		font-size:0.85em;
		border-bottom: 1px dotted #999;
		}

/*  ---------- Tab Menu ---------- */

ul.tab {
	list-style-type:none;
	margin:0;
	padding:0;
	font-family:Verdana, sans-serif;
}


ul.tab li{
			float:left;
			padding:4px 10px 4px 12px;
			cursor:pointer;
			background:#fff;
			background-image:url(../images/fig/bk_dot2.png);
			background-repeat:repeat-y;
			background-position:left;
			border:1px solid #999;
			border-radius: 2px;        /* CSS3草案 */  
    -webkit-border-radius: 2px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 2px;   /* Firefox用 */ 
			margin-right:1px;
			position:relative;
			top:1px;
			font-size:0.8em;
			}

ul.tab li.selected {
			border-bottom:1px solid #eee;
			background: #f0f8ff
			}
			
ul.tab li a { text-decoration:none;
			font-family:Verdana, sans-serif;
			color:#333333;
			}
			
ul.tab li a:hover { color:#3399FF
					}
ul.panel { margin:-1px 0 0 0;
		padding:0;
		list-style:none;
		width:670px;
		}
		
		
ul.panel li {
			clear:both;
			background:#f0f8ff;
			border-top:1px solid #999;
			padding: 10px
			}

/*						
ul.panel li div.post-content { padding:8px 0 4px 0;
				line-height:1.4em;
				border-bottom: 1px dotted #999;
				padding-bottom:8px;
				font-family:"ヒラギノ角ゴ Pro W3",'Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,Osaka,'ＭＳ Ｐゴシック', Verdana, Helvetica, sans-serif ;
				font-size:0.8em;
				color:#333;
					} */
					
ul.panel li a { text-decoration:none;
				}

div.panel li a:hover { text-decoration:underline;
					padding-bottom:1px; }


ul.panel li .author { color:#666;
					font-size:0.75em;
					float:left;
					}


div.tabbody iframe { display: block;
					margin-left:auto;
					margin-right:auto;
					margin-bottom:10px
					}

/* -------新着トピックス　ナビゲーション----- */	
	
.oldpage { float:left;
		font-size:0.7em;
		padding:16px 0;
		}
		
.newpage { float:right;
		font-size:0.7em;
		padding:16px 0;
		}
		
		
/* ---------- Column トップページ右サイドバー---------- */


.column {
	display:block;
	width:270px;
	margin-bottom:20px;
	padding-left:10px;
	float:right;
	}
	
.column h4 { 
	margin:10px 0;
	padding:4px;
	font-size:16px;
	font-weight:normal;
	display:block;
	background-image:url(../images/fig/bk_dot2.png);
	background-repeat:repeat-x;
	color:#444;
	}
	


/* Sponsors Block */

.tvwrap { float:right;
		margin-bottom:10px;
		}

	
.jsbox{ display:block; 
		width:270px;
		margin-bottom:10px;
		}
.jsbox img{ display:block; 
			float:left; 
			margin:0 4px 4px 0; 
			width:80px; 
			height:80px;
			}
.jsboxwrap { display:block;
			width:252px;
			 float:right;
			 }

#sponsorlink{
	display:block;
	width:270px;
	margin:20px 0;
	}
	
#sponsorlink ul, #sponsorlink li{
	display:block;
	width:100%;
	margin:0;
	padding:0;
	list-style:none;
	}

#sponsorlink li{
	margin:0 0 5px 0;
	padding:0 0 5px 0;
	}

#sponsorlink div.imgholder{
	display:block;
	float:left;
	width:80px;
	height:80px;
	margin:0;
	padding:4px;
	border:1px solid #ccc;
	}
	
#sponsorlink div.imgholder img {
	width:80px;
	height:80px;
	}	
	
#sponsorlink div.sponsortxt{
	display:block;
	float:right;
	width:170px;
	margin:0;
	padding:0;
	}

#sponsorlink p { font-size:0.8em;
				line-height:1.4em;
				padding-top:20px;
				}
#sponsorlink p a { color:#444; }


/*  ---------- Banner area ---------- */

.bannerarea { 	
	margin: 10px 0;
	background-color:#fff;
	padding:10px 0;
	width:670px
}

/*  ---------- インデント ---------- */

.ind_wrap { padding-left:2em
			 }

.ind_em2 { text-indent: -2em;
			padding-left: 2em;
			}

/*  ----------登録ボタン ---------- */
a.order {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fefefe;
	padding: 4px 10px;
	background: -moz-linear-gradient(
		top,
		#a3a3a3 0%,
		#232323);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#a3a3a3),
		to(#232323));
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-moz-box-shadow:
		0px 1px 3px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.6);
	-webkit-box-shadow:
		0px 1px 3px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.6);
	box-shadow:
		0px 1px 3px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.6);
	text-shadow:
		0px -1px 0px rgba(000,000,000,1),
		0px 1px 0px rgba(255,255,255,0.2);
}

/*  ---------- Footer ---------- */

#footer{
	padding:20px 0;
	}

#footer ul{
	margin:0;
	padding:0;
	list-style:none;
	}

#footer h3 {
	margin:0 0 15px 0;
	padding:0 0 8px 0;
	font-size:18px;
	color:#CCCCCC;
	background-color:#000000;
	border-bottom:1px dotted #CCCCCC;
	}

#footer .box{
	display:block;
	float:right;
	width:250px;
	margin:0 0 0 25px;
	padding:0;
	}

#footer .box1{
	display:block;
	float:left;
	width:400px;
	line-height:1.6em;
	}

#footer .box1 .imgl{border:1px solid #CCCCCC; padding:5px; color:#FFFFFF; background-color:#000000;}

#footer .contactdetails li{
	margin:0 0 8px 0;
	}



/* フッター内のボックス */

.col_w220 {
	float: left;
	width: 220px;
	margin-right: 20px;
	padding-top:20px
}

h5 { font-size: 14px; 
	margin: 0 0 10px 0; 
	padding: 0; 
	color:#999
	 }

.tmo_list { margin: 10px 0 10px 10px; 
			padding: 0; 
			list-style: none;
			 }
.tmo_list li { background: transparent;
				padding-bottom:4px; }

.tmo_list li a { color: #fff; 
				font-size:0.8em;
				background-color:#232323;
				}

.tmo_list li a:hover { color:#3399FF;
					text-decoration:underline; }

/* social */

#social_box {
	clear: both;
	margin: 20px 0;
	padding: 0;
	list-style: none;
}

#social_box li {
	display: block;
	float: left;
	padding: 0;
	margin: 0;
}

#social_box li a {
	width: 24px;
	height: 24px;
	margin: 0 5px 5px 0;
	text-decoration: none;
	border: none;
}


/*  ---------- Copyright ---------- */

#copyright{
	padding:10px 0;
	}

#copyright p{
	margin:0;
	padding:0;
	font-size:0.7em;
	}