@charset "UTF-8";

/*
Theme Name: YouTube専用テンプレート スカイブルー 10
Description: YouTube キュレーションサイト用テンプレートです。
Theme URI: http://miyawakitomoko.jp/youtube
Description: Tomoko Miyawaki produced template for WordPress
Author: Tomoko Miyawaki 
Author URI: http://miyawakitomoko.jp/
Version: 7.1
*/

/****************************************

          Reset

*****************************************/
* {margin: 0; padding:0;}

a {text-decoration:none;}
ul,ol {list-style:none;}
img {max-width :100%; vertical-align: middle; border: 0;}
a img {border: 0;}
input, select {vertical-align:middle;}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,table,pre { margin-top: 0}

/****************************************

          Normalize

*****************************************/
/*! normalize.css v2.0.1 | MIT License | git.io/normalize.css */
/* HTML5 display definitions */
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary {display: block}
audio,canvas,video {display : inline-block}
audio:not([controls]) { display: none;height: 0}
[hidden] {display: none}
/* Links */
a:focus { outline: thin dotted}
a:hover,a:active { outline : 0}
/* 禁則処理の追加 */
p,li,dt,dd,th,td,pre{-ms-line-break: strict; line-break: strict; -ms-word-break: break-strict; word-break: break-strict}
abbr[title] { border-bottom : 1px dotted}
b, strong { font-weight : bold}
dfn { font-style: italic}
mark { background: #ff0; color: #000}
code, kbd, pre, samp {font-family: monospace, serif; font-size: 1em}
pre {white-space: pre; white-space: pre-wrap; word-wrap: break-word}
q {quotes: “\201C” “\201D” “\2018” “\2019”;}
small {font-size: 80%;}
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline}
sup {top: -0.5em}
sub {bottom: -0.25em}
svg:not(:root) {overflow: hidden}
figure {margin: 0}
/* Forms */
fieldset {border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}
legend {border: 0; padding: 0; }
button, input, select, textarea {font-family: inherit; font-size: 100%; margin: 0; }
button,input {line-height: normal; }
button,
input[type="button"],  
input[type="reset"], 
input[type="submit"] {
-webkit-appearance: button; 
cursor: pointer; }/
}
button[disabled],
input[disabled] {cursor: default}
input[type="checkbox"], input[type="radio"] { box-sizing: border-box;  padding: 0; }
input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box;  box-sizing: content-box;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance: none}
button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0}
textarea {overflow: auto; vertical-align: top; }
/* Tables */
table { border-collapse: collapse; border-spacing: 0;}


/****************************************

          Base Setting

*****************************************/
body {
	font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif;
	line-height:1.5;
    -webkit-text-size-adjust: 100%; 
    -ms-text-size-adjust: 100%;
}

/* Link */
a { color:#333;}

a:hover, a:focus {
	color:#FF5A85;
	text-decoration:underline;
}

/* Fontsize */
p {
	font-size:1em;
	margin-bottom:1em;
	color:#444;
}

h1 {
	font-size: 1.5em;
	line-height:1;
	margin-bottom:0.5em;
}

h2 {
	font-size: 1.063em;
	line-height:1.3333;
}

h3 {
	font-size: 1em;
	line-height:1;
}

/* Image */
img {max-width:100%;}

.aligncenter	{display: block;
	margin-left: auto;
	margin-right: auto}

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

.alignright	{float: right;
	margin-left: 10px;
	margin-bottom: 10px;
	text-align:right}

.wp-caption	{border: solid 1px #aaaaaa;
	text-align: center;
	padding-top: 5px}

/* テーブル */
table {
	font-size: 93%;
	text-align:left;
	width: 100%;
	border-left: #aaa solid 1px;
	border-top: #aaa solid 1px;
	background:#fff;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 0 0 24px;
}

table a {
	color:#0000FF;
}

th, td {
		padding:6px 8px;
		vertical-align:top;
		border-right:#aaa solid 1px;
		border-bottom:#aaa solid 1px;
}

th {
		font-weight:bold;
		background:#E6E6E6;
}

/* clearfix */
.clearfix:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}

.clearfix {
    zoom: 1; /* for IE6/7 */
}

/****************************************

          Mobile　〜767px

*****************************************/
/* * * * * Set * * * * */
body {
	font-size:93.8%;
	-webkit-font-smoothing: subpixel-antialiased; /* 文字アンチエイリアス 強調 */
}

/* Header */
header {
	text-align:center;
	margin:0 auto 0;
}

/* Contents */
#contents {
	width:95.8333333%;/* 920 */
	margin : 0 auto;
	text-align : left;
}

#main, #sidebar {
	background:#FFF;
}

#contents p {
	text-align : left;
}

/* Sidebar */
#sidebar {
	margin-bottom:10px;
}

/* Footer */
footer {
	padding : 30px 0 0;
	color : white;
	text-align : center;
}

/* Address */
address {
	font-style:normal;
	font-size:0.725em;
	margin:0;
	padding:10px 0;
}

address a {
	color:#FFFFFF;
}

/* * * * * Header * * * * */
#head-title {
	padding:24px 0 ;
	margin:0 auto;
	text-align:left;
}

#head-title h1{
	font-size:1.725em;
}

#head-title h1 a:hover {
	color:#FF5A85;
}

#head-title-inner {
	margin:0 auto;
}

#titlearea {
	margin:0 10px;
}

.title-margin {
	margin:5px 0;
}

.title-p-margin {
	margin:0;
	font-size:1em;
}

.heaer-image {
	width:960px;
	margin:0 auto;
}

.header-img p.title-p-margin {
	display:none;
}

/* * * * * TOP Icon * * * * */
#iconmenu	{
	float:left;
	margin-left:10px;
}

#iconmenu ul	{
	margin: 0 auto;
	padding: 3px 5px 0 0;
}

#iconmenu li	{
	display: inline;
}

/* * * * * Breadcrumb * * * * */
.breadcrumb {
	font-size:0.925em;
	overflow: hidden;
	margin: 0px 0px 30px;
}

.breadcrumb ul li {
	display: inline;
	font-size: 0.925em;
	padding: 0 5px 0;
}
.breadcrumb ul li a {
	text-decoration: underline;
}
.breadcrumb ul li a:hover {
	top: 0;
}

/* * * * * Archive & Category Page Title * * * * */
.category-title {
	color: #222;
	font-size: 20px;
	line-height: 1.3;
	text-align: left;
	margin: 0 0 20px ;
	padding: 10px 0 ;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
}

/* * * * * Widget * * * * */
.widget {
	margin: 0 0 40px;
}

.widget span {
	color:#AAA;
}

.widget h3 {
	font-size:1.125em;
	font-family: 'Maven Pro', Helvetica, Arial, sans-serif;
	color: #000;
	background: #FFF;
	border-bottom:solid 1px #333;
   	margin:0 0 10px 0; 
	padding:0px 0 7px;
}

/* List */
.widget ul {
	margin:0;
}

.widget li ul {
	margin:10px 0 0 0;
}

.widget li {
	font-size:0.875em;
	border-bottom:dotted 1px #9A9A9A;
	line-height:1.25em;
	margin:0 0 10px 0; 
	padding:0 0 10px 21px;
	background-image:url(images/list.png);
	background-position:6px 2px;
	background-repeat:no-repeat;
}

.widget li img {
	margin-left:-16px;
	background:#FFFFFF;
}

/* * * * * Pager * * * * */
.pagenation {
	margin:0 0 32px 0;
	font-size:0.725em;
	font-weight:bold;
}

.pagenation span.current, .page-numbers {
	padding:4px 7px;
	margin: 0 4px 0 0;
	color:#555;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
	border-radius: 3px;
}

/* * * * * Pager & Search Color Setting * * * * */
.pagenation span.current, .page-numbers,
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
	/* Btn Design */
	border:solid 1px #BBB;
	color: #333;
	text-shadow:-1px -1px 0px #000;
	text-shadow:1px 1px 0px #FFF;
	background:#EEEEEE;
	background-image: -ms-linear-gradient(top, #EEEEEE 0%, #BBBBBB 100%);	/* IE10 Consumer Preview */ 
	background-image: -moz-linear-gradient(top, #EEEEEE 0%, #BBBBBB 100%);	/* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #EEEEEE 0%, #BBBBBB 100%);	/* Opera */ 
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #EEEEEE), color-stop(1, #BBBBBB));	/* Webkit (Safari/Chrome 10) */ 
	background-image: -webkit-linear-gradient(top, #EEEEEE 0%, #BBBBBB 100%);	/* Webkit (Chrome 11+) */ 
	background-image: linear-gradient(to bottom, #EEEEEE 0%, #BBBBBB 100%);	/* W3C Markup, IE10 Release Preview */ 
}

.pagenation span.current,
.pagenation a:hover,
.pagenation a:hover
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
	text-decoration:none;
	border:solid 1px #666;
	color: #FFF;
	text-shadow:-1px -1px 0px #666;
	background:#AAAAAA;
	background-image: -ms-linear-gradient(top, #AAAAAA 0%, #666666 100%);/* IE10 Consumer Preview */ 
	background-image: -moz-linear-gradient(top, #AAAAAA 0%, #666666 100%);	/* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #AAAAAA 0%, #666666 100%);	/* Opera */ 
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #AAAAAA), color-stop(1, #666666));	/* Webkit (Safari/Chrome 10) */ 
	background-image: -webkit-linear-gradient(top, #AAAAAA 0%, #666666 100%);	/* Webkit (Chrome 11+) */ 
	background-image: linear-gradient(to bottom, #AAAAAA 0%, #666666 100%);	/* W3C Markup, IE10 Release Preview */ 
}

/* single Pager */
#pager {
	margin-bottom:42px;
}

#pager div {
	font-size:0.875em;
	line-height:1.1em;
}

#pager .page-left a {
	float:left;
	text-align:left;
	width:38%;
	height:29px;
	padding:15px 0 0 18px;
	background-image:url(images/ico-old-post.png);
	background-position:left 14px;
	background-repeat:no-repeat;
	overflow:hidden;
}
#pager .page-left a:hover {
	background-position:left -61px;
}

#pager .page-right a {
	float:right;
	text-align:right;
	width:38%;
	height:29px;
	padding:15px 18px 0 0;
	background-image:url(images/ico-new-post.png);
	background-position:right 14px;
	background-repeat:no-repeat;
	overflow:hidden;
}
#pager .page-right a:hover {
	background-position:right -61px;
}

/* * * * * TOP Gallery Setting　* * */
/* box */
#gallery-list {
	margin-bottom:40px;
}

.gallery-list-top {
	width:100%;
	margin-bottom:32px;
}

.gallery-list-top img {
	width:100%;
	overflow:hidden;
}

/* Image */
#gallery-list div a:hover img,
#gallery a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
}

/* Movie Size Set */
.img-item {
	width:100%;
	background:url(img/common/loader2.gif) no-repeat center center; 
	position:relative;
	display:inline-block;
	line-height:0;
	overflow:hidden;
}

/* Text Area */
.titlearea {
	margin:0px;
}

/* Title */
.list-title  {
	overflow:hidden; 
	display:block;
	height:75px;
	padding:8px 0 0;
}

.list-title a {
	text-decoration:none;
	font-size:1.25em;
}

.list-title a:hover {
	text-decoration:underline;
}

/* Movie Info */
.memo {
	font-size:87.5%;
	padding:3px 20px ;
	height:15px;
	overflow:hidden; 
}

/* * * * * Single Gallery Setting * * * * */
/* box-single */
#gallery {
	margin-bottom:24px;
}

#gallery h1{
	font-size:1.725em;
	color:#000000;
	margin-bottom:32px;
}

/* snsボタン */
.sns-btn	{
	text-align:left;
	margin: 0 0 42px;
}
.sns-btn:after {
	clear:both;
}

.sns-btn ul	{
	margin: 24px 0;
	padding:0;
}

.sns-btn li	{
	float:left;
	width:31.8181818%;
	font-size:0.825em;
}

.sns-btn li:nth-child(-n+2) {  /* 先頭から2つのみ */
margin-right:2.2727272%;
}

.sns-btn li a {
	display:block;
	padding:13px 5px 13px 45px;
	border-radius:8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	color:#FFFFFF;
}

.sns-tweet a {
	background:#00acee;
	background-image:url(images/twitter-bg.png);
	background-repeat:no-repeat;
	background-position:left top;
}
.sns-tweet a:hover {
	background-position:left -120px;
}

.sns-facebook a {
	background:#3B5998;
	background-image:url(images/facebook-bg.png);
	background-repeat:no-repeat;
	background-position:left top;
}
.sns-facebook a:hover {
	background-position:left -120px;
}

.sns-hatena a {
	background:#008fde;
	background-image:url(images/hatena-bg.png);
	background-repeat:no-repeat;
	background-position:left top;
}
.sns-hatena a:hover {
	background-position:left -120px;
}

.single-memo {
	clear:both;
	margin-top:20px;
	font-size:0.925em;
}

/* * * * * FB LikeBox * * * * */
.likebox {
	width:95.8333333%;/* 920 */
	margin:0 auto 25px;
}

/* * * * * Top TOP * * * * */
.totop a {
	clear:both;
	font-size:0.75em;
	text-align:right;
	float:right;
	background:#1869C5;
	margin: -20px 0 0;
	padding:3px 15px;
	border-radius:5px 5px 0 0;
	color:#FFFFFF;
	text-decoration:none;
}

.totop a:hover {
	text-decoration:underline;
}


/* * * * * Form All * * * * */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="search"],
textarea {
	margin: 0;
	margin-bottom:5px;
	padding: 6px 4px;
	outline: none;
	border: 1px solid #ddd;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	vertical-align: top;
	font-size:13px;
}

textarea {
	overflow: auto;
}

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
	vertical-align: center;
	display: inline-block;
	margin:0px;
	padding: 4px 15px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	text-decoration: none;
	line-height: normal;
	cursor: pointer;
	font-size:13px;
}

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
	border:solid 1px #666;
	color: #FFF;
	text-shadow:-1px -1px 0px #666;
	background:#AAAAAA;
	background-image: -ms-linear-gradient(top, #AAAAAA 0%, #666666 100%);/* IE10 Consumer Preview */ 
	background-image: -moz-linear-gradient(top, #AAAAAA 0%, #666666 100%);	/* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #AAAAAA 0%, #666666 100%);	/* Opera */ 
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #AAAAAA), color-stop(1, #666666));	/* Webkit (Safari/Chrome 10) */ 
	background-image: -webkit-linear-gradient(top, #AAAAAA 0%, #666666 100%);	/* Webkit (Chrome 11+) */ 
	background-image: linear-gradient(to bottom, #AAAAAA 0%, #666666 100%);	/* W3C Markup, IE10 Release Preview */ 
}

.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
	position: relative;
	top:1px;
}

/* * * * * 404 Link * * * * */
.go_home a {
	color:#0000FF;
	text-decoration:underline;
}

/* * * * * Comment * * * * */
#comment-area {
	font-size:0.938em;
	margin-bottom:50px;
}

#comment-area a {
	color:#006DD9;
	text-decoration:underline;
}

#comment-area h3{
	font-size:1.25em;
	padding:0 0 10px;
}

#comment-area {
	border:solid 2px #ECECEC;
	padding:20px;
	border-radius:10px;
}

.commets-list {
	margin-bottom:40px;
}

.commets-list li {
	border-top: 1px solid #CCC;
	padding: 20px 0 0;
	width: 100%;
	overflow: hidden;
}

.commets-list .avatar {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}

.comment-body p {
	clear: both;
}

.reply {
	text-align: right;
}

.children {
	padding-left: 2em;
}

/* Comment Respond */
#respond {
	background:#F6F6F6;
	border-radius:10px;
	padding:20px;
}

#respond h3 {
	border-bottom: 1px solid #CCC;
	margin-bottom:15px;
}

#respond .required {
	color:red;
}

#respond textarea {
	display:block;
	width:90%;
}

/* Single Set */
.videosize a {
	color:#006DD9;
	text-decoration:underline;
}

.videosize a:hover {
	color:#FF5A85;
}

.videosize ul {
    margin: 0 0 1.5em 1.5em;
    padding: 0;
    list-style-type: disc;
}

.videosize li {
    margin: 0;
    padding: 0;
}

.videosize ol {
    margin: 0 0 1.5em 1.575em;
    padding: 0;
	list-style-type:decimal;
}


/****************************************

          Tablet 2　540px〜768px

*****************************************/
@media screen and (max-width: 768px) {
.related-entry a {
width:30.303030303%;
height: 185px;
}

.related-entry img {
/* height:140px; */
}

.gallery-list-top img {
	height:100%;
}

}


/****************************************

          Tablet　768px〜979px

*****************************************/
@media screen and (min-width : 769px) and (max-width: 979px) {
#contents {
	margin: auto;
}

#contents #main {
	float:left;
	width:100%;
	margin: 0;
	margin-left:-320px;
}

#contents #mainwrap {
	margin-left: 320px;
}

#contents #sidebar {
	float:right;
	width:300px;
}

footer {
	clear:both;
	margin: 0 auto;
}

/* * * * * ヘッダー構成 * * * * */
/* サイトタイトル */
#titlearea {
	float:left;
	width:75%;
	margin-right:10px;
}

#iconmenu	{
	float: right;
	text-align: right;
}

/* * * * * Gallery Setting * * * * */
.gallery-list-top li {
	float:left;
	width:48.4848484%;
}

/* Movie Height */
.gallery-list-top img {
	height:100%;
}

#gallery-list h2 {
	font-size:93.8%;
}

.list-title a {
	padding:8px 0 ;
}

}

/****************************************

          PC　980px〜

*****************************************/
@media screen and (min-width : 980px) {
body {
	font-size:100%;
}

#contents {
	overflow:hidden;
	width:960px;
	text-align:left;
}

#contents #main {
	float:left;
	width:100%;
	margin: 0;
	margin-left:-320px;
}

#contents #mainwrap {
	margin-left: 320px;
}

#contents #sidebar {
	width:300px;
	float:right;
	margin: 0;
}

#global ul {
	width:960px;
	margin: 0 auto;
}

footer {
	clear:both;
	margin: 0 auto;
}

/* LikeBox */
.likebox {
	width:960px;
}

/* * * * * Header Setting * * * * */
/* Site Title */
#head-title-inner {
	width:960px;
}

#titlearea {
	width:760px;
	margin-left:0;
}

.title-margin {
	font-size:1.4em;
}

/* * * * * Gallery Setting * * * * */
.gallery-list-top {
	float:left;
	width:310px;
	height:280px; 
}

.gallery-list-top li {
	float:left;
}

#gallery-list h2 {
	font-size:93.8%;
}

.list-title a {
	padding:8px 0 ;
}

.gallery-list-top:nth-child(2n) {
	margin-left:16px;
}

/* * * * * SNS btn * * * * */
.sns-btn li	{
	width:200px;
}

/* * * * * Facebook Size Setting * * * * */
.videosize {
	width: 640px;
}

/* ページャー */
#pager .page-left a,
#pager .page-right a {
	height:30px;
}
}

/* * * * * Plugin Support * * * * */

/* WordPress Popular Posts  */
/*
Wordpress Popular Posts plugin stylesheet
Developed by Hector Cabrera

Use the following classes to style your popular posts list as you like.
*/

.wpp-list { /* UL element */
}

	.wpp-list li { /* LI - post container */
		overflow:auto;
		display:block;
		float:none;
		clear:both;
	}

		/* title styles */
		.wpp-post-title {
		}
		
		/* thumbnail styles */
		.wpp-thumbnail {
			display:inline;
			float:left;
			margin:0 5px 0 0;
			border:none;
		}
		
		/* excerpt styles */
		.wpp-excerpt {
		}
		
		/* Stats tag styles */
		.post-stats {
			font-size:9px;
			font-weight:bold;
		}
			
			.wpp-comments {
			}
			
			.wpp-views {
			}
			
			.wpp-author {
				font-style:italic;
			}
			
			.wpp-date {
				display:block;
				clear:right;
			}
		
		/* WP-PostRatings styles */
		.wpp-rating {
		}


/*
Newpost Catch StyleSheet

With the version up of the plug-in, so will be overwritten "style.css" file each time,
I think how to directly edit the "style.css" file and how would you or declined.
If you wish to apply a CSS style on its own,
In the "/wp-content/themes/theme directory/css/" as you please create a "newpost-catch.css".
Please the name of the file to create and "newpost-catch.css". The other is the file name, does not apply.

*/

#npcatch li{
	overflow:hidden;
	clear:both;
	margin:0px 0px 0px;
}

#npcatch img{
	float:left;
	padding:10px 10px 0;
}

#npcatch .title{
	width:72%;
	float:left;
	padding:10px 5px 5px 0px;
}

@media screen and (min-width : 769px) {
	#npcatch .title{
	width:195px;
}
}