@charset "utf-8";
/*
Theme Name: vs01r
Description: 動画ブログ用のシンプルなテーマvs01のスマホ対策バージョン
Version: 1.0
Author: Toshiharu Sakamoto
Author URI: http://dougaryoku.com/
*/


/*-------------------------------------------------------------------------------------------*/
/* 0. リセット */
/*-------------------------------------------------------------------------------------------*/

body, html  { height: 100%; }
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }/* tables still need 'cellspacing="0"' in the markup */

.fix{clear: both;height: 1px;margin: -1px 0 0;overflow: hidden;}

html body * span.clear,
html body * div.clear,
html body * li.clear,
html body * dd.clear
{
	background: none;
	border: 0;
	clear: both;
	display: block;
	float: none;
	font-size: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/*-------------------------------------------------------------------------------------------*/
/* 1. 基本セットアップ */
/*-------------------------------------------------------------------------------------------*/

/* 1.1 デフォルト */

body {
	height: auto !important;
	height: 1px;
	margin: 0 auto;
	padding: 0;
	font-size: 14px/1.5em !important;
	font-size:90%;
	line-height: 1.6em !important;
	text-align: center;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #555555;
	background: #eee;
}

h1  {font-size: 1.8em; color:#1a1a1a;} h2  {font-size: 1.6em; color:#1a1a1a;} h3  {font-size: 1.4em;} h4  {font-size: 1.2em;} h5  {font-size: 1em;} h6  {font-size: 0.8em;}

hr { background-color: #e6e6e6;	border:0; height: 1px; margin-bottom: 20px; }

input, textarea { padding: 5px; border-color: #ccc #efefef #efefef #ccc; border-width:1px; border-style:solid; margin-bottom:10px;}

.hide { display: none; }

img.alignleft {float: left; margin:0 15px 0 0 !important;}
img.alignright {float: right; margin:0 0 0 15px !important;}
img.aligncenter {margin:10px auto ;}

/* 1.2 ハイパーリンク */

a:link, a:visited  { color: #3088ff; text-decoration:none;}
a:hover {text-decoration:underline; color:red; }

/*-------------------------------------------------------------------------------------------*/
/* 2. コンテナー全体 */
/*-------------------------------------------------------------------------------------------*/

/* 2.1背景差し込み画像 */
#container {
	background:url(http://www.ngsa-web.com/j/img/background.jpg) no-repeat top center;
}

/*-------------------------------------------------------------------------------------------*/
/* 3. ヘッダーエリア */
/*-------------------------------------------------------------------------------------------*/

/* 3.1 ヘッダー全体 */

#header {
	margin:0;
	padding:5px 0;
	clear:both;
	height:71px;
	position:relative; 
	border-top:4px solid #000;
}
#header-inside{
	width:960px; 
	margin:0 auto; 
}

/* 3.2 ロゴ */

#logo  { 
	float:left; 
	padding:3px 0 0 0;
}


/* 3.3 ヘッダー右 */

#adbox {
	float:right; 
	width:548px; 
	text-align:right;
	margin:25px 3px 2px;
}
#adbox a:hover img {
	filter:alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}


/*-------------------------------------------------------------------------------------------*/
/* 4. グローバルナビエリア */
/*-------------------------------------------------------------------------------------------*/

/* 4.1 ナビ全体 */

#navigation {
	background:054996;
	clear:both;
	margin:0 0 16px 0; 
	height: 48px;
}
#navigation-inside {
	width:960px; 
	margin:0 auto; 	
}

ul#nav, div.menu ul{
	top:100px;
	height: 48px;
	font-weight:bold;
	font-size:90%;
	border-left:1px solid #ddd;
}


/* 4.2 ナビ メニュー */

ul#nav li, div.menu ul li{
	float: left;
	position: relative;
	border-right:1px solid #ddd;
}
ul#nav li > a, div.menu ul li > a{
	color: #fff;
	padding:14px 18px 11px;
	text-decoration:none;
	display: block;
}
ul#nav li:hover > a,
ul#nav > li.current_page_item > a,
ul#nav > li.current_page_ancestor > a,
ul#nav > li.current-menu-item > a,
ul#nav > li.current-category-ancestor > a,
div.menu ul li:hover > a,
div.menu ul > li.current_page_item a,
div.menu ul > li.current_page_ancestor > a,
div.menu ul > li.current-menu-item > a,
div.menu ul > li.current-category-ancestor > a{

 /* Webkit */
background: -webkit-gradient(linear, left top, left bottom,
	from(rgba(0,0,0,0.1)),
	to(rgba(0,0,0,0.4)),
	color-stop(1.0,#333333));
					
 /* FF */
background: -moz-linear-gradient(rgba(
	0, 0, 0, 0.1),
	rgba(0, 0, 0, 0.4));
					
/* IE */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#10000000,endColorstr=#40000000);
	zoom:1;
}


/* 4.3 ナビ 子メニュー */

ul#nav ul, div.menu ul ul{
	display: none;
	position: absolute;
	top: 44px;	
	left: 0;
	float: left;
	width: 200px;
	z-index: 99999;
}
ul#nav ul li, div.menu ul ul li { 
	width: 200px;
	border-bottom:1px solid #ccc;
	border-right:none;
	text-align:left;
}
ul#nav ul li ul, div.menu ul ul li ul {
	left: 100%; 
	top: 0; 
}
ul#nav ul li a, div.menu ul ul li a {
	padding:5px 6px; 
	background: #ddd; 
	color:#555;
}
ul#nav ul li:hover > a, div.menu ul ul li:hover {
	background: #eee; 
}
ul#nav li:hover > ul, div.menu ul li:hover > ul{
	display: block;
}

/*-------------------------------------------------------------------------------------------*/
/* 5. コンテンツエリア */
/*-------------------------------------------------------------------------------------------*/

/* 5.1 コンテンツ全体 */

#content {
	minimum-height:600px; 
}

#content-inside {
	width:960px;
	margin:280px auto 30px;
	padding:0;

}
#content-inside a:hover img {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}


/* 5.2 トップ画像エリア */

#catchbox{
	width:960px; 
	margin:0 auto;
	padding:0;
}
#catchbox a:hover img {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

/*-------------------------------------------------------------------------------------------*/
/* 6. 投稿エリア */
/*-------------------------------------------------------------------------------------------*/

/* 6.1 メインエリア全体 */	
#main{
	width:695px;
	float:left;
	margin:0;
	padding:0;
}
.nav-below{
	text-align:center; 
	margin: 25px auto 0;
	overflow:auto; 
	font-size: 85%;
}
.c-title{
	width:100%;
	background:#ddd;
	padding:10px 0 8px;
	margin: 0 0 10px; 
}
.c-title h1{
	font-size:90%;
	color:#444;
}

/* 6.2 投稿エリア */	

.post {
	margin:0 auto 15px;
	padding:15px 20px;
        border:8px solid #ddd;
	background:#fff;
	text-align:left;
	background: #fff;
}	

.post h1 {
	border-bottom: 1px dashed #555; 
	margin:0 0 0.6em 0; 
	line-height:1.5em; 
}
.post h2, .post h3, .post h4, .post h5, .post h6{
	margin:0 0 0.3em; 
	line-height:1.5em; 
}
.post p  {
	margin-bottom: 1.2em; 
}
img.attachment-post-thumbnail {
	float: left; 
	padding:5px; 
	border: 1px solid #ddd; 
	margin:0 15px 0 0 !important;
}
.post strong {
	font-weight: bold; 
	color: #000000;
}
.post y {
	background-color: #FFFF00;
}
.post r {color: #d40000; 
	font-weight:bold;
}
.post blockquote{
	border:1px solid #ddd;
	background: #efefef;
	padding: 10px 10px 0;
	margin:20px 0;
	clear:both;
	}
.blog_info p{
	font-size:85%; 
	line-height:1.0em; 
	margin-bottom: 1.1em; 
}
.blog_info_below p{
	font-size:85%; 
	line-height:1.0em; 
	margin:40px 0 0; 
	clear:both;
}
.nav-below-single {
	text-align:center; 
	width:100%;
	margin: 15px auto 0;
	overflow:auto; 
	font-size: 85%;
}

.more {
	text-align: right; 
	font-weight:bold;
}
.more p{
	margin-bottom: 0; }


/* 6.3 固定ページ（1カラム）の投稿エリア */	

.post-lp {
	margin:0 auto 15px;
	padding:15px 30px 20px;
        border:8px solid #ddd;
	background:#fff;
	text-align:left;
	background: #fff;
}	

.post-lp h1 {
	border-bottom: 1px dashed #555; 
	margin:0 0 0.6em 0; 
	line-height:1.5em; 
}

.post-lp h2, .post-lp h3, .post-lp h4, .post-lp h5, .post-lp h6{ 
	margin:0 0 0.3em; 
	line-height:1.5em; 
}
.post-lp p  { margin-bottom: 1.2em; }

.post-sl {
	margin:0 auto 15px;
	padding:15px 30px 20px;
        width:680px;
	border:8px solid #ddd;
	background:#fff;
	text-align:left;
	background: #fff;
}	

.post-sl p  { margin-bottom: 1.2em; }
.post-sl h1 {
	border-bottom: 1px dashed #555; 
	margin:0 0 0.6em 0; 
	line-height:1.5em; 
}

.post-sl h2, .post-sl h3, .post-sl h4, .post-sl h5, .post-sl h6{ 
	margin:0.5em 0 0.5em; 
	line-height:1.5em; 
	color:#1a1a1a;
}

/*-------------------------------------------------------------------------------------------*/
/* 7. サイドバーエリア */
/*-------------------------------------------------------------------------------------------*/

/* 7.1 サイドバー全体 */
#side {
	width:240px;
	float:right;
	margin:0 ;
	padding:0;
	background:#eee; opacity: 0.9;
filter: alpha(opacity=90);/*IE7*/;
}

/* 7.2 ウィジェット */
.widget-container ul li{
	list-style: url(images/arrow_list.png);
	margin-left:20px;
	}

/* 7.3 サイドバーウィジェット */
#side h3 {
	font-size:90%;
	color:#fff;
	padding:3px 3px 3px 5px;
	margin-bottom: 10px;
	background:#054996;
}
#side .widget-container{
	margin:0 0 15px;
	padding:0 0 5px;
	text-align:left;
}
#side a {
	font-size:90%;
}

/*-------------------------------------------------------------------------------------------*/
/* 8. フッターエリア */
/*-------------------------------------------------------------------------------------------*/


/* 8.1 フッター全体 */
#footer {
	padding: 20px 0;
	border-top: 4px solid #000; 
	color:#fff; 
	background:#1a1a1a;
}
#footer-inside{
	width:960px; 
	margin:0 auto;
}

/* 8.2 フッターウィジェット */
#footer .widget-area{
	width:290px;
	margin-left:35px;
	margin-bottom: 20px;
	text-align:left;
	float: left;
	}
#footer .widget-area:first-child{margin-left:0;}
#footer .widget-area h3{
	font-size:95%;
	color: #eee;
	border-bottom: 2px solid #ccc;
	margin-bottom:10px;
}

/* 8.3 フッター下部 */

p.copy{
	clear: both;
	font-size:85%;
	text-align:center;
	padding:10px 0 0;
	color: #666;
	border-top: 1px solid #333;
	}
p.credit{
	font-size:75%;
	text-align:center;
	padding:0;
	color: #666;
	}
p.credit a{color: #666;}
p.credit a:hover{color: #ccc;}



/*-------------------------------------------------------------------------------------------*/
/* 9. コメントエリア */
/*-------------------------------------------------------------------------------------------*/

.commentbox {
	border: 1px solid #ddd;
	background: #fff;
	padding:20px;
	text-align: left;
		clear: both;
}
h3#comments{
	padding: 10px 0 10px 10px;
	clear: both;
	margin-top:10px;
	border-top:1px solid #ddd;
	}
	
.commentlist{margin-bottom:30px;}
	.commentlist li {
		border-top:1px solid #ddd;
		padding:15px 0 0 55px;
		position:relative;
		}
	.commentlist .avatar {
		background:#fff;
		border:1px solid #ddd;
		left:0;
		margin:0 16px 0 0;
		padding:3px;
		position:absolute;
		top:15px;
		}
	.commentlist .comment-meta{margin-bottom:10px;}
		.commentlist .comment-meta a{
			color: #999;
			font-size:85%;
			text-decoration:none;
			}
			.commentlist .comment-meta a:hover{color: #ccc;}
	.commentlist p{margin-bottom:15px;}
	.commentlist .reply a{
		position: absolute;
		top: 15px;
		right: 0;
		padding: 2px 10px;
		background: #ddd;
		font-size: 85%;
		color: #333;
		text-decoration: none;
		}
		.commentlist .reply a:hover {color: #999}
		
/* 9.2 コメントフォーム */
#respond{margin-top:20px;}
#respond h3{
	border-bottom:1px solid #ddd;
	border-top:1px solid #ddd;
	padding:10px 0 10px 10px;
	}

#commentform{margin-top:20px;}
	#commentform p{clear: both}
	#commentform label{margin: 10px 5px;font-size:85%;}
	*:first-child+html #commentform label{ position:relative\9; top: -15px\9; } /* IE7 */
	#commentform input[type="text"], #commentform textarea{
		margin: 5px 0 10px;
		}
		#commentform input[type="text"]:focus, #commentform textarea:focus{
			border:1px solid #06c;
			}

/*-------------------------------------------------------------------------------------------*/
/* 10. フォーム */
/*-------------------------------------------------------------------------------------------*/

input[type="text"], textarea{
	border:1px solid #ccc;
	padding: 5px;
	color: #666;
	
	/* Webkit */
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#eee),
		to(#fff)
		);
	
	/* FF */
	background: -moz-linear-gradient(
		top,
		#eee,
		#fff
		);
		
	/* IE */
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffeeeeee,endColorstr=#ffffffff);
	zoom: 1;
	}
	
input[type="submit"]{
	border:1px solid #ccc;
	padding: 4px 10px;
	color: #666;
	cursor: pointer;

	/* Webkit */
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#eee),
		to(#ccc)
		);
	
	/* FF */
	background: -moz-linear-gradient(
		top,
		#eee,
		#ccc
		);
		
	/* IE */
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffeeeeee,endColorstr=#ffcccccc);
	zoom: 1;
	}


/*-------------------------------------------------------------------------------------------*/
/* カスタムＣＳＳを書いてください。*/
/*-------------------------------------------------------------------------------------------*/

.videobox560{
	margin: 6px auto; 
	width:420px; 
	background: #1a1a1a; 
	padding:20px 50px; 
        margin-bottom:30px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border: 2px #ccc solid;
	}
.videobox853{
	margin: 6px auto; 
	width:853px; 
	background: #1a1a1a; 
	padding:20px 20px 10px; 
        margin-bottom:30px;
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border: 2px #ccc solid;
	}
.border {margin-bottom:20px; padding :15px; background-color: #fff; border :1px solid #ddd;}
.border640 {margin: 0px; padding :0px 0px 15px 10px; border:0px solid #ddd;width:620px;float:left;}
.box230 {margin-top:10px; padding :10px; background: f9f9f9; border:1px solid #ddd;width:230px;float:right;}

.box230 p {
font-size: 11px;
}

.bluebox{
margin:20px 10px 0px 10px;
background: #2a4878;
height:294px;
}
.videoleft{
width:420px;
margin:20px 5px 20px 15px;
padding:5px;
background:#1a1a1a;
float:left;
}
.videoright{
width:400px;
float: right;
padding:10px;
margin:10px 5px 10px 5px;
}
.videoright h2{
color:#fff;
}
.videoright p {
font-color:#fff;
}
.box800 {margin:0px auto 10px; padding :40px 20px 15px 20px; border:0px solid #ddd;width:800px;}
.kaiinbox {width:300px;height:200px;}
.kaiinleft {float:left; width:340px; border:1px solid #ddd; padding:20px 20px 0 20px}
.kaiinright {float:right; border:1px solid #ddd; width:340px;padding:20px 20px 0 20px;}
.box760 {margin:20px 0; padding :20px; border:1px solid #ddd;width:760px;}
.b {color:#000; font-weight:bold;}
.by {color:#000; font-weight:bold; background: #FFFF00;;}
.borderblack {margin-bottom:20px; padding :15px; background-color: #fff; border :1px solid #333;}
.f24 {font-size:24px;}
.bg-white {
    background-color: #fff;
    font-size: 12px;
    border: 1px solid #ccc;
    margin: 20px 0;
    padding: 15px 15px 0;
}
.bg-gray {
    background-color: #f9f9f9;
    font-size: 12px;
    border: 1px solid #ccc;
    margin: 10px 0;
    padding: 10px 10px 0;
}