@charset "Shift_JIS";
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, footer, header, menu, nav, section {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
footer,header,section { 
	display:block;
}
img a {
border:none;
}
ul,
li{
list-style-type: none;
}
.clears{clear:both;} 
/*---------------------*/
html{font-size: 62.5%;}
body{
font-family:"Hiragino Kaku Gothic ProN","MS PGothic",sans-serif;
font-size:12px;font-size:1.2rem;
line-height:1;
color:#666;
}
a:link,a:visited,a:active{
color:#00f;
text-decoration:none;
}
a:hover{
color:#f00;
text-decoration:underline;
}
/*---------------------*/
#wrap {
max-width:800px;
min-width: 300px;  
margin:0px auto;
}
/*---------------------*/
h1{
color:#999;
margin:0 0 3px 10px;
font-size:10px;font-size:1rem;
font-family:"Yu Gothic","Meiryo UI";
}
.h_me1 {
margin:0 5%;
color:#f39;
padding:3px 0;
border-top:1px solid #99a;
border-bottom:1px solid #99a;
}
.h_me1 li{
float:left;
padding-left:11px;
margin:4px 0 4px 16px;
}
.f_me1 li,
.h_me1 li,
.h_me2 li{
	position: relative;
}
.f_me1 li::after,
.h_me1 li::after,
.h_me2 li::after{
	display: block;
	content: '';
	position: absolute;
	top:3px;
	left:0px;
	width: 5px;
	height: 5px;
background: linear-gradient(145deg, #0bf, #fff); 
	border: 1px solid #0af;
}
.h_me2 {
display: none;
}
/*---------------------*/
.bar {
display: block;
width:50%;
box-sizing: border-box;
padding:0 4px;
float:left;
overflow:hidden;
color: #f90; 
} 
h4{
margin:5px 0 5px 15px;
font-size:12px;font-size:1.2rem;
width:200px; 
padding:4px 0 3px 18px;
background-color:#ddd;
color: #000;
	position: relative;
}
h4::after{
	display: block;
	content: '';
	position: absolute;
	top:7px;
	left:7px;
	width: 5px;
	height: 5px;
background: linear-gradient(145deg, #000, #ff0); 
	border: 1px groove #444;
}
.blogroll-channel{
min-height:700px;
}
.blogroll-list{
color:#f00;
font-family:Verdana;
font-size:12px;font-size:1.2rem;
line-height:1.4;
padding-left:6px;
white-space: nowrap;
overflow:hidden;
text-overflow:ellipsis;
-webkit-text-overflow:ellipsis;
-o-text-overflow: ellipsis;
	position: relative;
}
.blogroll-list::after {
	display: block;
	content: '';
	position: absolute;
	top:8px;
	left:0px;
	width: 3px;
	height: 3px;
	background-color: #f00;
}
.blogroll-list a:link,
.blogroll-list a:visited,
.blogroll-list a:active{
color:#03b;
font-family:"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
}
.blogroll-list a:hover{
color:#f00;
}
.blogroll-link-time {
color: #090;
font-size:12px;font-size:1.2rem;
font-family:SimSun;
margin-left:-4px;
white-space:nowrap;
}
.bar .blogroll-list a:focus{
background-color:#ff6;
}
.blogroll-ad-img img{
	width: 182px;
	height: 71px;
opacity:0.8;
margin-top:12px;
}
.blogroll-ad-default a:link,
.blogroll-ad-default a:visited,
.blogroll-ad-default a:active{
color:#777;
font-size:12px;
font-family:"MS UI Gothic";
}
.noba .blogroll-ad-img{
	width: 0px;
	height: 0px;
display:none !important;
}
.noba .blogroll-ad-img img{
	width: 0px;
	height: 0px;
display:none !important;
}
.noba .blogroll-ad-default a:link,
.noba .blogroll-ad-default a:visited,
.noba .blogroll-ad-default a:active{
font-size:0px;
display:none !important;
}
.sp_tx{
font-weight: bold;
font-size:24px;font-size:2.4rem;
color:#f00;
line-height:1.6;
padding:100px 10%;
}
.gg,
.gg2{
text-align:center;
color: #000; 
}
.gg{
margin-top:16px;
}
.gg2{
display: none;
}
.dmm  {
text-align:center;
color: #000; 
}
.dmm img {
width:100%;
max-width:300px;
height:auto;
}
/*---------------*/
#footer{
clear:both;
}
.f_me1 {
margin-top:22px;
}
.f_me1 li{
float:left;
padding-left:10px;
margin:0 8px 5px;
}
.f_me3{
padding:8px 0 10px 8px;
border-top:1px solid #999;
border-bottom:1px solid #999;
}
.f_me3 li{
float:left;
line-height:1;
padding-right:14px;
margin:6px 0 2px 10px;
border-right:1px solid #000;
}
.f_me2,
.f_me{
display: none;
}
.pgu {
display: none;
position: fixed;
bottom: 50px;
right:3px;
}
.pgu img{
width:55px;
height:45px;
}
.pgu a {
display: block;
opacity: 0.4;
}
.pgu a:hover {
opacity:0.8;
}
#f_cr {
text-align:center;
padding:5px 0 12px 0;
line-height:1.9;
color:#999;
font-size:12px;
}
#f_cr a:hover {
color:#d00;
}
.f_lnk1{
font-family:"Meiryo UI";
margin-bottom:6px;
}
.f_lnk1 span{
font-size:80%;
color:#696;
}
.f_lnk1 a{
color:#000;
}
/*---------------------------------------*/
@media screen and (max-width:700px){
body{
font-size:15px;font-size:1.5rem;
}
h1{
margin:1px 0 -2px 6%;
}
.bar {
float:none;
width:auto;
padding:0 5px;
} 
.blogroll-list{
font-size:15px;font-size:1.5rem;
line-height:1.7;
} 
.blogroll-list::after {
	top:14px;
}
.it-bn,
.blogroll-ad-default,
.blogroll-ad-img {
margin:0 8px;
}
.blogroll-ad-default{
padding-right:25px;
}
.it-bn {
margin:20px 8px;
}
h4{
margin:5px 20px;
width:auto; 
border-right:80px solid #9cf;
}
.h_me2 {
display: block;
margin:0 5%;
padding:8px 0;
border-top:1px solid #999;
border-bottom:1px solid #999;
}
.h_me2 span {
color:#f00;
background-color:#ff0;
text-shadow: 0 0 1px #f90;
}
.h_me2 li{
float:left;
padding-left:11px;
margin:5px 0 5px 16px;
}
.h_me2 li::after{
	top:5px;
}
.h_me1,
.f_me1,
.f_me3{
display: none;
}
.gg,
.gg2{
display: block;
margin:10px;
}
.f_me {
margin:6px 5% 0;
}
.f_me2 {
display: block;
margin-top:12px;
}
.f_me2 li span,
.f_me2 li a:link,.f_me2 li a:visited,.f_me2 li a:active {
display:block;
padding:12px 0 9px 18px;
margin-bottom:1px;
font-size:16px;font-size:1.6rem;
}
.f_me2 li a:link,.f_me2 li a:visited,.f_me2 li a:active {
background-color:#def;
}
.f_me2 li a:hover{
background-color:#ff0;
text-decoration:none;
}
.f_me2 li span {
background-color:#ddd;
color:#666;
}
.f_me2 span,
.f_me2 a {
	position: relative;
}
.f_me2 span::after,
.f_me2 span::before,
.f_me2 a::after,
.f_me2 a::before {
	display: block;
	content: '';
	position: absolute;
}
.f_me2 span::after,
.f_me2 a::after {
	top: 12px;
	right: 17px;
	width: 12px;
	height: 12px;
	border-right: 3px solid #5bf;
	border-bottom: 3px solid #5af;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.f_me2 span::before,
.f_me2 a::before {
	top: 11px;
	left: 9px;
	width: 4px;
	height: 16px;
	background-color: #f09;
}
.f_me{
display:block;
margin:6px 3% 0 3%;
border-top:2px solid #abc;
border-bottom:2px solid #abc;
padding:8px 0px;
} 
.f_me li{
float:left;
margin:6px 0;
padding:0 8px;
border-right: 1px solid #c66;
} 
.f_me span{
color:#f00;
background-color: #ff9;
} 
}
/*-------------------*/
@media screen and (max-width:500px){
.bar {
padding:0;
} 
.blogroll-list{
white-space:normal;
overflow:visible;
word-wrap: break-word;
word-break: break-all;
line-height:1.2;
padding:6px 2px 6px 12px;
}
.blogroll-list::after {
	left:6px;
}
.blogroll-list:nth-child(odd){
 background: #f0f0f0; 
}
}