@charset "UTF-8";

/* Information
==================================================
livedoor Blog CSS
 Name   : Journal *black
 Layout : 3カラム リキッド

 Update : 2009.12.16
==================================================
*/

/* Reset */
html{color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
li{list-style:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
abbr,acronym{border:0;font-variant:normal;}
legend{color:#000;}

/* =============================================== */
/** 01. Text - フォント・リンク */
/* ----------------------------------------------- */

body,
textarea {
    font-family: 'Trebuchet MS',Verdana,sans-serif;
    font-size:13px;
    }
a {
    color: #4169E1;
    text-decoration:none;
    }
a:hover {
    text-decoration:underline;
    }

/* =============================================== */
/** 02. Layout - レイアウト（全体の枠組み） */
/* ----------------------------------------------- */

body {
    position:relative;
    background-color:white;
    }
div#container {
    position:relative;
   margin:0 auto;
    width:1080px;
   
    }
div#content {
    float:left;
    width:100%;
    margin-right:-451px;
    padding-bottom:35px;
    overflow: hidden;
   border-right:1px solid #e4e4e4;
    }
div#main {
    margin-right:350px;
    color:#565656;
    border:1px solid #e4e4e4;
    }
div#aside {
    float:right;
    width:320px;
    padding-bottom:100px;
    margin-top:-98px;
    font-size:13px;
    background:url(http://parts.blog.livedoor.jp/img/usr/journal/container_bg.png) right top repeat-y;
    }


div#sub ,
div#extra {
    float: left;
    width:320px;
    padding-top:5px;
    overflow: hidden;
	}
div#sub {
    border-right:1px solid #e4e4e4;
    }
div#extra {
    
    margin-left: -1px;
    }

/* ----------------------------------------------- */
/** clearfix */

body:after,
div#container:after,
div#content:after,
ul.article-navigator:after,
ul.archives-navigator:after,
div.article-body:after,
div.article-body div.article-body-more:after,
div#trackback-form ul:after {
    content: " ";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
    }

body,
div#container,
div.blog-title-outer,
div.article-outer,
h2.archives-title,
div.article-body,
div.article-footer,
h2.article-title,
div.pager,
ul,
div.index-navigator-outer {
    height: 1%;
    }

div.article-option li dl,
div#trackback-form,
div#trackbacks-list,
div#comments-list,
div#comment-form {
    height: 1%;
    }

/* =============================================== */
/** 03. Title - ブログタイトルエリア */
/* ----------------------------------------------- */
div#blog-title-outer{
    height:98px;
    color:#fff;
    }
div#blog-title-outer a{
    color:#fff;
    }
div#blog-title-outer #blog-owner-photo{
    float:left;
    margin:19px 21px;
    display:inline;
    }
div#blog-title-outer #blog-title {
    padding: 20px 30px 0 115px;
    font-size: 24px;
    font-weight: bold;
    }
div#blog-title-outer #blog-description {
    padding: 10px 30px 20px 115px;
    line-height: 1.35;
    }

.blog-header {
    height:98px;
 background-color:#000; 
    }
.blog-footer {
    height:98px;
 background-color:#696969; 
    }

/* =============================================== */
/** 04. SubTitle - アーカイブタイトルエリア */
/* ----------------------------------------------- */
.archives-title {
    font-size:16px;
    font-weight:bold;
    margin:20px 20px 5px 20px;
    padding:0 4px;
    background-color:#fff;
    }


/* =============================================== */
/** 05. Pager - ページャ */
/* ----------------------------------------------- */

ul.index-navigator li ,
ol.paging-number ,
ol.paging-number li {
    }
div.pager {
    padding:0 15px 0 110px;
    }
ul.index-navigator li.paging-number ol.paging-number li.current {
    background:#00acdc;
    color:#fff;
    font-weight:bold;
    padding:2px 8px;
    margin:0 2px;
    }

/* ----------------------------------------------- */
/** IndexNavigator - トップページ */

ul.index-navigator li{
    margin:0 2px;
    line-height:21px;
    *line-height:19px;
    zoom:1;
    }
ul.index-navigator li.paging-next{
    margin:0;
    }
ul.index-navigator li a {
    color:#fff;
    padding:2px 8px;
    margin:0;
    background:url(http://parts.blog.livedoor.jp/img/usr/journal/pager_bg.png) left top no-repeat #000;
    _background:#000;
    }
ul.index-navigator li a:hover{
    background:#00acdc;
    text-decoration:none;
    color:#fff;
    }


/* ----------------------------------------------- */
/** ArchivesPager - アーカイブページ */

ul.archives-pager {
    list-style-type: none;
    text-align:right;
    }
ul.archives-pager li {
    padding: 2px 5px;
    }
ul.archives-pager li a {
    padding: 0 5px;
    }
ul.archives-pager li.both {
    border:none;
    }
.pager archives-pager-type2 {
    }


/* ----------------------------------------------- */
/** ArticlePager - 個別記事ページ */

ul.article-pager {
    padding:0 15px 0 110px;
    }
ul.article-pager li {
    float: left;
    width: 49%;
    line-height: 1.25;
    }

/* = special tech ... borderの高さを揃えるため */
ul.article-pager {
    overflow: hidden;
    }
ul.article-pager li {
    padding-top: 1px;/* 1px余白（上部） */
    padding-bottom: 32768px;
    margin-bottom: -32767px;/* 1px余白（下部） */
    }
ul.article-pager li.prev {
    text-align: left;
    }
ul.article-pager li.next {
    text-align: right;
    }
ul.article-pager li.both {
    }

/* =============================================== */
/** 06. Main - 記事エリア */
/* ----------------------------------------------- */

div.article-outer {
    position:relative;
    margin:20px 20px 30px 20px;
    }

/* ----------------------------------------------- */
/** 記事ヘッダー */

div.article-header {
    font-size:12px;
    margin-bottom:20px;
    }
div.article-header .article-title {
    padding: 5px 0;
    font-size: 24px;
    font-weight: bold;
    border-bottom:3px solid #66CDAA;
    color:#000;
    }
div.article-header .article-title a {
    color: #003DDD;
    }




.article-date {
    color:#000;
    font-weight:bold;
    display:inline;
    }
dl.article-category {
    padding:0 10px;
    display:inline;
    }
dl.article-category dt {
    display:none;
    }
dl.article-category dd {
    display: inline;
    background:url(http://parts.blog.livedoor.jp/img/usr/journal/folder.png) left center no-repeat;
    padding:1px 1px 1px 20px;
    margin:0 10px 0 0;
    }

/*** カテゴリアーカイブページではカテゴリを非表示にする */
body.category dd.article-category {
    display: none;
    }


/* ----------------------------------------------- */
/** 記事本文 */

div.article-body {
	width: 100%;
    overflow: hidden;
    line-height: 1.5;
    margin:2em 0;
    color:#000;
    }


div.article-body div.article-body-more,
div.article-body div.article-body-private {
    clear: both;
    margin-top: 1em;
    }




/*** img */
div.article-body img.pict{
margin-bottom: 10px;
	padding: 2px;
	background: #fff;
	position: relative;
	box-shadow: 0 1px 10px rgba(0,0,0,0.3);
	max-width: 630px;
    }

/*** 見出し */
div.article-body h3 {
    font-size:14px;
    font-weight:bold;
    border-bottom:1px solid #d9d9d9;
    }
div.article-body h4 {
    font-weight:bold;
    }

/*** 段落 */
div.article-body p {
    margin:1em 0;
    }

/*** リスト */
div.article-body dl{
    margin:2em 0;
    }
div.article-body dl dt{
    font-weight:bold;
    }
div.article-body dl dd{
    margin-left:1em;
    }
div.article-body ol,
div.article-body ul{
    margin:0.5em 2em;
    }
div.article-body ol li{
    list-style:decimal;
    }
div.article-body ul li{
    list-style:disc;
    }

/*** テーブル */
div.article-body table {
    border-collapse:collapse;
    width:90%;
    margin:4px auto;
    }
div.article-body table td {
    padding:3px 3px;
    }
.article-footer table td {
    padding:3px 3px;
    }
div.article-body table th {
    border:1px solid #ccc;
    background-color:#666;
    color:#fff;
    padding:3px 6px;
    font-weight:bold;
    text-align:center;
    }

/*** 共通テーマ */
dl.common-theme {
    margin: 0 10px 25px;
    }

/*** 記事タグ */
div.article-body dl.article-tags {
    margin: 2em 0;
    }
div.article-body dl.article-tags dt{
    display:none;
    }
div.article-body dl.article-tags dd{
    background:url(http://parts.blog.livedoor.jp/img/usr/journal/tag.png) left center no-repeat;
    padding-left:20px;
    margin:0 10px 0 0;
    }


/*** プライベートモード */
div.private-mode-announcement {
    line-height: 1.5;
    margin:1em 0;
    }

/* ----------------------------------------------- */
/** 記事フッター */

div.article-footer {
    margin:1em 0;
    text-align: right;
    }

ul.article-post {
    padding-top:2px;
    text-align: right;
    }
ul.article-post a {
    color:#565656;
    }
ul.article-post a:hover {
    text-decoration:underline;
    }

ul.article-post li {
    font-size:11px;
    padding:2px 0;
    }
ul.article-post li.article-comment-count {
    padding-left:16px;
    background:url(http://parts.blog.livedoor.jp/img/usr/journal/balloon.png) left top no-repeat;
    }
ul.article-post li.article-trackback-count {
    padding-left:16px;
    background:url(http://parts.blog.livedoor.jp/img/usr/journal/trackback.png) left top no-repeat;
    }
ul.article-post li.article-tool-box * {
    vertical-align:middle;
    }
ul.article-post li.article-tool-box {
    padding-left:4px;
    }



/* =============================================== */
/** 07. Option - トラックバック＆コメントエリア */
/* ----------------------------------------------- */

div#article-options h3{
    font-size:14px;
    font-weight:bold;
    }

/* ----------------------------------------------- */
/** コメント一覧 */

div#article-options #comments-list ol{
  width:675px; 
  height:500px;
  overflow-y:scroll;
    border-top:1px solid #ccc;
 margin-left: -50px;
    }
div#article-options #comments-list li {
    position:relative;
    border-bottom:1px dotted #ccc;
    padding:10px 0;
    zoom:1;
    
    }
div#article-options #comments-list li dl{
    color:#565656;
    }
div#article-options #comments-list li dl dt.comment-author{
    margin-bottom:10px;
    position:relative;
    z-index:10;
    font-weight:bold;
    color: green;
    }
div#article-options #comments-list li dl dt.comment-number{
    font:italic bold 56px Georgia,serif;
    position:absolute;
    top:0;
    right:0;
    color:#e0e0e0;
    z-index:0;
    line-height:1;
    
    }
div#article-options #comments-list li dl dt span.comment-date{
    padding-left:10px;
    color: #808080;
    }
div#article-options #comments-list li dl dd{
    position:relative;
    z-index:10;
    margin:0 0 10px 15px;
    font-size: 16px;
    color: black;
    margin: 0 0 10px 15px;
    }

div#article-options #trackbacks-list li {
    }
div#article-options #trackbacks-list li p{
    text-align:right;
    }
div#article-options #trackbacks-list li p span.ping-date{
    font:italic normal 11px Georgia,serif;
    }

div.article-option {
    padding: 15px 60px;
    }


div.article-option h3 {
    margin: 10px 0;
    font-weight:bold;
    }
div.article-option h3.takecommenthead {
    display:none;
    }

/** コメントフォーム */

div#comment-form{
    padding: 15px 0;
    }

div#comment-form-body * {
    vertical-align:middle;
    }

div#comment-form-body table {
    line-height: 25px;
    width:100%;
    }

div#comment-form-body table th {
    width: 52px;
    padding-right: 8px;
    text-align: right;
    font-weight: normal;
    }
div#comment-form-body td {
    padding-right:66px;
    }

input#author {
    width: 75%;
    }

input#email {
    width: 75%;
    }

input#url {
    width: 100%;
    }

input#bake {
    margin: 0 0 0 5px;
    }

textarea#text {
    width: 100%;
    height: 180px;
    }

input.button {
    margin-top: 10px;
    width: 80px;
    }

div#comment-form-body table tr.input-etc td {
    padding-top: 6px;
    }

label.input-rating {
    margin-left:  20px;
    }

label.input-rating select {
    margin-left: 3px;
    }

label.input-rating-face {
    margin-left: 5px;
    }

div#comment-form-body table tr.submit td {
    text-align: right;
    }

/*** コメント認証 */
div.comment-auth-announcement {
    margin: 10px 0;
    border-color: #484848;
    font-size: 90%;
    }

div.comment-auth-announcement p a {
    margin: 0 3px;
    }

div#trackback-form ul li.trackback-form-url span input,
input#author,
input#email,
input#url,
textarea#text {
    border-radius:2px;
    -moz-border-radius:2px;
    -webkit-border-radius: 2px;
    border:1px solid #ccc;
    background-color:#fafafa;
    padding:1px 2px;
    }
div#trackback-form ul li.trackback-form-url span input:focus,
input#author:focus,
input#email:focus,
input#url:focus,
textarea#text:focus {
    background-color:#fff;
    }


/* =============================================== */
/** 08. Sub & Extra - プラグインエリア */
/* ----------------------------------------------- */
div.sidetitle {
    font-weight: bold;
    margin:15px;
   background-color: black;
    color: white;
    font-size:14px;
position: relative;
	padding: .5em .75em;
	border: 1px solid #ccc;
	border-radius: 4px;

    }



div.sidetop,
div.sidebottom {
    display: none;
    }
div.side {
    margin: 0 20px 20px;
    text-align: center;
    }
div.sidebody {
    background:url(http://livedoor.blogimg.jp/yasuko1984ja-oku/imgs/a/7/a71131a6.gif) left 2px no-repeat;
    padding-left: 18px;
    margin:8px 0;
    text-align: left;
    line-height:1.4;
    color: #000000;
　width: 300px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

    }
div.sidebody a{
    color:#000000;
    }
div.sidebody a:hover{
    color:#00acdd;
    }

/* ----------------------------------------------- */
/** 検索 */
.side input.sf {
    width:128px;
    }

/* ----------------------------------------------- */
/** Calendar */
div.calendarheadbody div.calendarhead {
    margin: 15px;
    padding: 0 20px;
    text-align: center;
    font-weight: bold;
    }
.calendarhead {
    position:relative;
    width:180px;
    }
.calendarpre {
    position:absolute;
    left:30px;
    }
.calendarnext {
    position:absolute;
    right:30px;
    }
div.calendarheadbody div.calendarhead a {
    color: #565656;
    }
div.calendarheadbody div.calendarhead a:hover {
    color: #00acdd;
    }
div.caltop,
div.calbottom {
    display: none;
    }
table.caltbl {
    width: 180px;
    margin: 0 auto;
    border: 0;
    }
div.calbody table.calendartable {}
td.caltblwkbg {}
td.calendarwd {}
td table.caltblwk td {
    font-weight: bold;
    height: 20px;
    }
td table.caltblwk td.weekday {}
td table.caltblwk td.sat {}
td table.caltblwk td.sun {}
td table.caltblwk td span.calendarweek {}
td.caltbldaybg {}
td table.caltblday {
    margin: 0 auto 25px;
    width: 180px;
    color: #565656;
    }
td table.caltblday td {
    width: 20px;
    height: 24px;
    padding:0 3px 0 4px;
    text-align: center;
    }

td table.caltblday td.caloff {}
td table.caltblday td.calendard {}
td table.caltblday td.calon {
    }
td table.caltblday td.calon a {
    text-decoration:underline;
    }
td table.caltblday td.calendardbg {}
td table.caltblday td span.calendar {}

/* ----------------------------------------------- */
/** Plugins */
.nickname {
    font-weight: bold;
    margin: 10px 0;
    }
.message {
    text-align: left;
    line-height: 125%;
    }
ul.tagcloud a {
    color:#565656;
    }
ul.tagcloud a:hover {
    color:#00acdd;
    }

/** グラフカウンター */
ul.type_graph li dl.graph {
    display:inline;
}
ul.type_graph li {
    line-height:normal !important;
    margin-bottom:0 !important;
    text-align:left;
}
ul.type_graph li dl.graph dd.count_image,
ul.type_graph li dl.graph dd.count_value {
    float:none !important;
    display:inline;
}


/* ----------------------------------------------- */
/** LDServices */

ul#ld-services {
    padding-top: 20px;
    }

/* =============================================== */
/** 09. Header & Footer - ヘッダー・フッター */
/* ----------------------------------------------- */
/** Header */

table#header {
    font-size: 12px;
    background-color:#fff;
    color:#767676;
    }
table#header a {
    color:#767676;
    }



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

div#footer-outer {
    clear:both;
    position:absolute;
    bottom:34px;
    right:0;
    width:451px;
    text-align:center;
    line-height:1.6;
    color:#777;
    }


/* =============================================== */
/** 10. Others - ADエリア etc. */
/* ----------------------------------------------- */
/** ADエリア */

div#ad {
    overflow: hidden;
    text-align: center;
    }

div#ad iframe {
    margin: 10px auto;
    }

div.gAdsense {
    padding: 10px 0!important;
    margin:10px 0!important;
    }

body.ad {
    text-align: left;
    }

a.adtitle {
    color: #000 !important;
    font-weight: bold;
    }

a.adtitle span {
    font-size: 14px!important;
    }

a.addescription {
    color: #797979 !important;
    }

a.addescription span {
    font-size: 12px!important;
    }

a.adurl {
    color: #0066ab !important;
    text-decoration: none;
    }

a.adurl span {
    font-size: 12px !important;
    }
a.adld {
    color: #565656 !important;
    font-size: 14px;
    font-weight:bold;
    line-height:2;
    margin:0 -15px 5px;
    }
.adhover {
    background-color:#fff !important;
    border:1px solid #fff !important;
    }
.adhover a.addescription {
    color: #000!important;
    }

.adbox,
.adhover {
    margin:0 !important;
    padding:2px 0;
    }

body.article .adbox,
body.article .adhover {
    margin:0 42px !important;
    }

/* 記事下ソーシャルボタン */
.article-social-btn {
  margin:8px 0;
  padding:0;
  text-align:right;
}
.article-social-btn > a,
.article-social-btn > span,
.article-social-btn > div,
.article-social-btn > iframe {
  margin: 4px 0;
}

/* メッセージボード */
.message-board {
  background: rgba(0,0,0,0.1);
  border-radius: 6px;
  font-size: 90%;
  margin: 20px 30px 20px 115px;
  padding: 15px;
}


.blogroll-wrapper{
	width:100%;
	overflow-y: hidden;
        height: 260px;
　　　　overflow-x: hidden;
  overflow-y: scroll;
border-top: solid 1px #999;
border-bottom: solid 1px #999;
　　}
.blogroll-column{
	float:left;
	width:50%;
} 


.blogroll-wrapper a:link{
color: black;}




img {
  transition: 0.5s;
}
img:hover {
  opacity: 0.6;
  transition: 0.5s;
}

#foot{
	width:100%;
	margin:10px auto;
	position: relative;
background-color: #696969;
    clear: both;
}

.left-box-1
{
      float : left ;
      width : 380px ;
      height : auto ;
padding: 50px 10px 10px 80px;
background-color: #696969;
color: white;
font-weight: bold;
      }

.left-box-2
{
      float : left ;
      width : 310px ;
      height : auto ;
padding: 48px 10px 10px 50px;
background-color: #696969;
color: white;
font-weight: bold;
      }

.left-box-3
{
      float : left ;
      width: 150px  
      height : auto ;
padding: 45px 0 10px ;
background-color: #696969;
font-weight: bold;
color: white;
      }

.left-box-4
{
      float : left ;
      width: 150px  
      height : auto ;
padding: 45px 0 10px ;
background-color: #696969;
font-weight: bold;
color: white;
      }

.clr-block{
      clear : both ;
      padding : 5px 0;
     color: white;
font-weight: bold;
text-align: center;
      }

.left-box-4 a,
.left-box-3 a{/*リンクされた文字*/
   color: white;
}

.border {
	padding-bottom: .5em;
	border-bottom: 3px double #ccc;
        width: 150px;
}




div.obi2{
    position: relative;
    font-size: 1.143em;
    font-weight: bold;
    margin: 0 0 1.5em;
    padding: 0.5em 0.5em 0.5em 2.0em;
    border-bottom: 2px solid #B92A2C;
}
 
div.obi2:before{
    content: "□";
    font-size: 200%;
    position: absolute;
    color: #ff6b6e;
    top: -0.8em;
    left: 0.3em;
    height: 12px;
    width: 12px;
}
 
div.obi2:after{
    content: "□";
    font-size: 200%;
    position: absolute;
    color: #B92A2C;
    top: -0.5em;
    left: 0;
    height: 12px;
    width: 12px;
}


div.obi3{
    position: relative;
    color: #111;
    font-size: 1.143em;
    font-weight: bold;
    margin-top: 10px;
    padding: 0.5em 0.5em 0.5em 1.7em;
    border-bottom: 3px solid black;
}
 

.ssImg{
    height: 140px !important;
    width: 200px !important;
    padding: 0;
}
.ssTitle{
    font-size: 120%;
    font-weight: bold;
}
.ssPanel{
    border-top: 1px solid rgb(228, 228, 228) !important;
    border-bottom: none !important;
    width: 49% !important;
    height: 100px !important;
    float: left !important;
    margin-right: 1% !important;
}
.ssLimitedContainerHeader > div > div > div{
     color: #ffffff ;
     background: #202f55;
     font-size: 16px;
     padding: 10px 5px 0 5px !important;
     margin-top: 15px;
}


/* サイドナビゲーション */
div.side-navi {
	position:fixed;
	right:5px;
	bottom:50px;
	z-index:100;
}
div.side-navi ul{
	margin:0;padding:0;
	list-style:none;
}
div.side-navi ul li{
	margin:0;padding:0;
	line-height:40px;
	text-align:center;
}
div.side-navi ul li a{
	margin:0;padding:0;
	display:block;
	width:45px;
	height:45px;
	font-size:10px;
	color:#ffffff;
	text-decoration:none;
	background:#000000;
	border:solid #f0f0f0;
	border-width:0 1px 1px 1px;
	filter: alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
}
div.side-navi ul li a:hover{
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
}
div.side-navi ul li:first-child a{}
div.side-navi ul li:last-child a{}
div.side-navi ul li.sn-prev a,
div.side-navi ul li.sn-next a,
div.side-navi ul li.sn-top a{
	height:35px;
	padding-top:10px;
}
div.side-navi ul li.sn-comment{
	line-height:15px;
}
div.side-navi ul li.sn-comment a{
	height:37px;
	padding-top:8px;
}
div.side-navi ul li.sn-prev a{
	background:#000000 url(http://parts.blog.livedoor.jp/img/usr/ver06_hr_colormosaic_2c/navi_prev.gif) no-repeat 50% 25%;
}
div.side-navi ul li.sn-next a{
	background:#000000 url(http://parts.blog.livedoor.jp/img/usr/ver06_hr_colormosaic_2c/navi_next.gif) no-repeat 50% 25%;
}
div.side-navi ul li.sn-top a{
	background:#000000 url(http://parts.blog.livedoor.jp/img/usr/ver06_hr_colormosaic_2c/navi_top.gif) no-repeat 50% 25%;
}

#mypopup {
display: none;
position: absolute;
border:1px solid #bbb;
padding:5px 8px 8px;
font-size:12px;
color:#111;
background-color:#ffc;
list-style-type:none;
line-height:1.2;
text-align:left;
max-width:750px;
min-width:250px;
box-shadow: 3px 3px 3px #ccc;
-moz-box-shadow: 3px 3px 3px #ccc;
-webkit-box-shadow: 3px 3px 3px #ccc;
}

#mypopup li.comment-date, #mypopup li.comment-author{
display: inline;
color:#666;
}
blockquote{
    background-color: #f5f5f5;
    padding: 1.5em 1em 0.5em !important;
    position: relative;
    border: 3px solid #d7d7d7;
    margin: 0 1em 1.5em;
}
 
blockquote:before{
    content: "“";
    font-size: 400%;
    line-height: 1em;
    font-family: "ＭＳ Ｐゴシック",sans-serif;
    color: #999;
    position: absolute;
    left: 0;
    top: 0;
}
 
blockquote:after{
    content: "”";
    font-size: 400%;
    line-height: 0em;
    font-family: "ＭＳ Ｐゴシック",sans-serif;
    color: #999;
    position: absolute;
    right: 0;
    bottom: 0;
}



/* 05.アメリカンな(?)吹き出し */
div.reac{
	position:relative;
	padding:5px 20px;
	font:bold 15px/1.6 Arial, Helvetica, sans-serif;
	color:#333;
	background:#fff;
	text-shadow:
		1px 1px 0 #fff,
		2px 2px 0 #999;
	border-top:#333 solid 2px;
	border-bottom:#333 solid 2px;
    background-image: -webkit-gradient(linear, left top, right bottom,
			from(			rgba(255, 255, 255, 0.0)), 
			color-stop(0.4, rgba(255, 255, 255, 0.0)), 
			color-stop(0.4, rgba(0, 0, 0, 0.1)), 
			color-stop(0.6, rgba(0, 0, 0, 0.1)), 
			color-stop(0.6, rgba(255, 255, 255, 0.0)),
			to(				rgba(255, 255, 255, 0.0))
			);
	background-image: -webkit-linear-gradient(top -45deg,
			transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
			);
	background-image: -moz-linear-gradient(top -45deg,
			transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
			);
	background-image: -o-linear-gradient(top -45deg,
			transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
			);
	background-image: linear-gradient(to bottom -45deg,
			transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
			);
	background-size:4px 4px;
}
div.reac:before{
	content:" ";
	position:absolute;
	top:100%;
	left:24px;
	width:0;
	height:0;
	border-width:12px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#333;
}
div.reac:after{
	content:" ";
	position:absolute;
	top:100%;
	left:28px;
	width:0;
	height:0;
	border-width:8px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#f0f0f0;
	z-index:1;
}




* {
	margin: 0;
	padding: 0;
}

.boxWrap{
  display: flex;
  display: -moz-flex;
  display: -o-flex;
  display: -webkit-flex;
  display: -ms-flex;
  flex-direction: row;
  -moz-flex-direction: row;
  -o-flex-direction: row;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
}

.rsample2{
    position:relative;
    width:220px;
margin-left: 5px;
height: 200px;
}
.rsample2 span{
    position:absolute;
  bottom: 5px;
    left:0px;
    width:220px;
    text-align:center;
    color:#fff;
    line-height:250%;
    background-color:#000;
    filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}
.rsample2 img{
    width:220px;
    height: 200px;
}

.rsample{
    position: relative;
    width: 220px;
    margin-left: 5px;
    height: 200px;
    overflow: hidden;
    margin-bottom: 5px;
}
.rsample span{
position: absolute;
    bottom: 0;
    left: 0px;
    width: 220px;
    text-align: center;
    color: #fff;
    line-height: 250%;
    background-color: #000;
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}
.rsample img{
    width:255px;
    height: 200px;
}

/* ----------------------------------------------- */
/*

      BlogRoll css

*/
/* ----------------------------------------------- */

.blogroll-channel,
.blogroll-channel * {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    text-align: left;

}
.blogroll-channel {
    height: 300px;
    margin-bottom: 10px;
    padding: 10px;
    
    background: #fff;
  
}

.blogroll-channel .blogroll-list-wrap {
    margin-bottom: 5px;
}

.blogroll-channel .blogroll-list {
    list-style-type: none;
    margin-bottom: 2px;
   margin-top: 2px;
    font-size: 14px;
}

.blogroll-channel .blogroll-list img {
    vertical-align: middle;
}

.blogroll-channel img.blogroll-icon,
.blogroll-channel img.blogroll-favicon {
    margin: 0 5px 0 0;
}

.blogroll-channel img.blogroll-favicon {
	width: 16px;
	height: 16px;
}

.blogroll-channel a {
    padding: 0 .3em;
	transition: all .3s;
   color: black;
    }

.blogroll-channel a:hover {
	color: #fff;
	background-color: black;
}


.blogroll-channel .blogroll-ad-img {
}

.blogroll-channel .blogroll-ad-text {
    display: block;
    margin-top: 5px;
    color: #666;
    font-size: 12px;
}

@import url(https://fonts.googleapis.com/css?family=Raleway:400,500,800);
.snip1217 {
  font-family: 'Raleway', Arial, sans-serif;
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
}
.snip1217 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.snip1217 li {
  display: inline-block;
  list-style: outside none none;
  margin: 0.5em 1.5em;
  padding: 0;
}
.snip1217 a {
  padding: 0.3em 0;
  color: ;
  position: relative;black;
  text-decoration: none;
  display: inline-block;
}
.snip1217 a:before,
.snip1217 a:after {
  height: 3px;
  position: absolute;
  content: '';
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  background-color: black;
  width: 0;
}
.snip1217 a:before {
  top: 0;
  left: 0;
}
.snip1217 a:after {
  bottom: 0;
  right: 0;
}
.snip1217 a:hover,
.snip1217 .current a {
  color: black;
}
.snip1217 a:hover:before,
.snip1217 .current a:before,
.snip1217 a:hover:after,
.snip1217 .current a:after {
  width: 100%;
}

/* 続きを読むボタン */
.entry-see-more {
  display: block;
  height: 40px;
  line-height: 40px;
  text-align: center;
  text-decoration: none;
  font-weight:bold;
  position: relative;
  color: #fff;
  background:#333;
  border: 2px solid #333;
  z-index:2;
  overflow: hidden;
  transition: 0.2s;
}

.entry-see-more:hover {
  color:#333;
}

.entry-see-more:after {
  position:absolute;
  content:'';
  width:100%;
  height:100%;
  top:-100%;
  left:0;
  z-index:-1;
  transition: 0.2s;
}

.entry-see-more:hover:after {
  top:0;
  background:#fff;
}

/** ---------- Google AdSense ---------- **/
.google-user-ad { margin:10px; }
.google-user-ad-b { margin:20px 10px 30px; }
.google-user-ad-728 { margin:0px auto; }
.google-user-ad-side { margin:0px; }
.google-user-ad-side1 { margin:0 0 30px; }
.ad-center { text-align:center; }

div.google-2ad {
 margin:20px; 
 height:280px;
}
div.g-ad1 {
 float:left;
 margin-left:0px; 
}
div.g-ad2 {
 float:left;
 margin-left:20px; 
}

.popular-articles{
width: 365px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.popular-articles a{
   color: black;
}
.popular-articles a:hover {
    text-decoration:underline;
     color: #4169E1;
    }
/*記事がよかったら、いいねPC*/
.p-entry__push {
    margin-bottom: 20px;
    display: table;
    table-layout: fix;
    width: 100%;
    background-color: #2b2b2b;
    color: #fff;
}
.p-entry__pushThumb {
    display: table-cell;
    min-width: 240px;
    background-position: center;
background-size:cover;
}
.p-entry__pushLike {
    display: table-cell;
    padding: 20px;
    text-align: center;
    vertical-align: middle;
    line-height: 1.4;
    font-size: 20px;
}
.p-entry__pushButton {
    margin-top: 15px;
    display: inline-block;
    width: 200px;
    height: 40px;
    line-height: 40px;
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}
.p-entry__pushButtonLike {
    line-height: 1;
}
.p-entry__note {
    margin-top: 15px;
    font-size: 12px;
    color: #999;
}
.p-entry__tw-follow {
    margin-bottom: 10px;
    background: #f4f4f4;
    width: 100%;
    padding: 15px 0;
    overflow: hidden;
}
.p-entry__tw-follow__cont {
    text-align: center;
    font-size: 15px;
    color: #252525;
}
.p-entry__tw-follow__item {
    display: inline-block;
    vertical-align: middle;
    margin: 0 15px;
}

.blogroll-channel5,
.blogroll-channel5 * {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    text-align: left;
}
.blogroll-channel5 {
    height: 250px;
    margin-bottom: 10px;
    padding: 5px;
   overflow-y:hidden;
    background: #fff;
}

.blogroll-channel5 .blogroll-list-wrap {
    margin-bottom: 10px;
}

.blogroll-channel5 .blogroll-list {
    list-style-type: none;
    margin-bottom: 3px;
   margin-top: 5px;
    font-size: 18px;
}

.blogroll-channel5 .blogroll-list img {
    vertical-align: middle;
}

.blogroll-channel5 img.blogroll-icon,
.blogroll-channel5 img.blogroll-favicon {
    margin: 0 5px 0 0;
}

.blogroll-channel5 img.blogroll-favicon {
	width: 16px;
	height: 16px;
}

.blogroll-channel5 a {
    padding: 0 .3em;
	transition: all .3s;
   color: black;
    }

.blogroll-channel5 a:hover {
	color: #fff;
	background-color: black;
}


.blogroll-channel5 .blogroll-ad-img {
}

.blogroll-channel5 .blogroll-ad-text {
    display: block;
    margin-top: 5px;
    color: #666;
    font-size: 12px;}

.blogroll-channel3,
.blogroll-channel3 * {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    text-align: left;

}
.blogroll-channel3 {
    height: 285px;
    margin-bottom: 0;
    padding: 5px;
   overflow-y:hidden;
    background: #fff;
border-top: solid 1px #999;
}

.blogroll-channel3 .blogroll-list-wrap {
    margin-bottom: 100px;
}

.blogroll-channel3 .blogroll-list {
    list-style-type: none;
    margin-bottom: 3px;
   margin-top: 5px;
    font-size: 16px;
}

.blogroll-channel3 .blogroll-list img {
    vertical-align: middle;
}

.blogroll-channel3 img.blogroll-icon,
.blogroll-channel3 img.blogroll-favicon {
    margin: 0 5px 0 0;
}

.blogroll-channel3 img.blogroll-favicon {
	width: 16px;
	height: 16px;
}

.blogroll-channel3 a {
    padding: 0 .3em;
	transition: all .3s;
   color: black;
    }

.blogroll-channel3 a:hover {
	color: #fff;
	background-color: black;
}


.blogroll-channel3 .blogroll-ad-img {
}

.blogroll-channel3 .blogroll-ad-text {
    display: block;
    margin-top: 5px;
    color: #666３
    font-size: 12px;}

.obi4 {
background: #c2edff;/*背景色*/
padding: 0.5em;/*文字まわり（上下左右）の余白*/
}

.left2 {
float:left;
margin: 15px 0;
}





.pcNone {
display: none;
}