/*
Theme Name: AFFINGER4 Child
Template: affinger4
Version: 20170501
*/

/*カテゴリID別に色を指定できます
例）IDが7の場合
.catname.st-catid7 {
	background:#ff0000;
	color:#fff;
}
*/

/*media Queries タブレットサイズ（960px以下）
----------------------------------------------------*/
@media only screen and (max-width: 960x) {


/*-- ここまで --*/
}

/*media Queries タブレットサイズ（600px以上）
----------------------------------------------------*/
@media only screen and (min-width: 600px) {


/*-- ここまで --*/
}


/*media Queries PCサイズ（960px以上）
----------------------------------------------------*/
@media print, screen and (min-width: 960px) {

/*-- ここまで --*/
}

/*Milliard紹介文非表示　ここから*/
.ssLimitedContainerHeader {
  display:none !important;
}

/*SNS（シェア）ボタン　ここから*/
/*Twitter*/
.sns .fa-twitter {
  border:none;
  padding-right:0;
}
 
/*Facebook*/
.sns .fa-facebook {
  border:none;
  padding-right:0;
}
 
/*Google+1*/
.sns .fa-google-plus {
  border:none;
  padding-right:0;
}
 
/* Pocket */
.sns .fa-get-pocket {
  border:none;
  padding-right:0;
}
 
/*はてぶ*/
.sns .fa-hatena {
  border:none;
  padding-right:0;
}
 
/*LINE*/
.sns .fa-comment {
  border:none;
  padding-right:0;
}
/*RSS*/
.sns .rss a {
  background-color:#f79637;
}
 
.sns .rss a:hover {
  background-color:#de7d1e;
}
/*feedly*/
.sns .feedly a {
  background-color:#87c040;
  background-image:url("/wp-content/themes/affinger4-child/images/feedly-i.png");
  background-repeat:no-repeat;
  background-position:12px 9px;
}
 
.sns .feedly a:hover {
  background-color:#6ea727;
}
 
.sns .feedly .snstext {
  padding-left:22px;
}
/*push7*/
.sns .push7 a {
  background-color:#eeac00;
  background-image:url("/wp-content/themes/affinger4-child/images/push7-i.png");
  background-repeat:no-repeat;
  background-position:12px 9px;
}
 
.sns .push7 a:hover {
  background-color:#d59300;
}
 
.sns .push7 .snstext {
  padding-left:24px;
}
/*タブレット・スマホRSS非表示*/
@media print, screen and (max-width:959px) {
.sns .rss {
  display:none;
}
}
/*media Queries スクリーンサイズ（900px以上）
----------------------------------------------------*/
@media only screen and (min-width: 900px) {
	/*--------------------------------
	wordpress popular postsのデザインカスタム
	---------------------------------*/
	.wpp-img2 {
		position:relative;
		display:block;
		width:280px;
		height:188px;
		margin:0px;
		padding:0;
		background-color:#2e609d;
	}
}
/*media Queries タブレットサイズ（1279px以下）
----------------------------------------------------*/
@media only screen and (max-width: 1279px) {
	/*--------------------------------
	wordpress popular postsのデザインカスタム
	---------------------------------*/
	ul.wpp-list {
		padding: 0;
	}
	.wpp-img2 {
		position:relative;
		display:block;
		width:280px;
		height:188px;
		margin:0px;
		padding:0;
		background-color:#2e609d;
	}
}
/*media Queries iPadとiPhone6Plus横サイズ（900px以下）
----------------------------------------------------*/
@media only screen and (max-width: 900px) {
	/*--------------------------------
	wordpress popular postsのデザインカスタム
	---------------------------------*/
	.wpp-img2 {
		position: relative;
		display: inline-block;
		width: 280px;
		height: 188px;
		margin: 0px;
		padding: 0;
		background-color: #2e609d;
	}
}
/*media Queries スマホ横サイズ（735px以下）
----------------------------------------------------*/
@media only screen and (max-width: 735px) {
	/*--------------------------------
	wordpress popular postsのデザインカスタム
	---------------------------------*/
	.wpp-img2 {
		position: relative;
		display: block;
		width: 280px;
		height: 188px;
		margin: 0 auto;
		padding: 0;
		background-color: #2e609d;
	}
	#side aside {
		clear: both;
		float: none;
		width: auto;
		position: static;
		margin-top: 78px;
	}
}
/*media Queries スマホサイズ（570px以下）
----------------------------------------------------*/
@media only screen and (max-width: 570px) {
	/*--------------------------------
	wordpress popular postsのデザインカスタム
	---------------------------------*/
	.wpp-img2 {
	    position: relative;
	    display: block;
	    max-width: 280px;
	    height: 188px;
	    margin: 0px;
	    padding: 0;
	    background-color: #2e609d;
	}
}
/*--------------------------------
wordpress popular postsのデザインカスタム
---------------------------------*/
.wpp-img2 img {
	z-index:0;
	margin:0;
	padding:0;
}
 
.wpp-img2 a {
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
}
 
.wpp-img2 a:hover {
	color: #4255E9;
}
.wpp-img2 img:hover {
	filter:alpha(opacity=50);
	-moz-opacity: 0.9;
	opacity: 0.9;
}
.img_title {
	position:absolute;
	bottom:0px;
	left:0px;
	z-index:1;
	margin:0;
	padding:5px;
	background-color:rgba(79,129,189,0.7);
	min-width: 270px;
}
.img_title a:hover {
	color:#4255E9;
}
.img_title opa p {
	font-size: 15px;
	margin-bottom: 0px;
}
.wpp-list {
	counter-reset: ranking;
	list-style-type: none;
}
.wpp-list div {
	clear: both;
	position: relative;
	margin-bottom: 15px;
	font-weight: bold;
}
.wpp-list div::before {
	counter-increment: ranking;
	content: counter(ranking);
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.6);
	text-align: center;
	width: 1.7em;
	height: 1.7em;
	color: #fff;
	line-height: 1.7em;
	font-size: 16px;
}
.wpp-list div:nth-child(1)::before {
	background-color: rgba(230,180,34,0.8);
}
.wpp-list div:nth-child(2)::before {
	background-color: rgba(192,192,192,0.8);
}
.wpp-list div:nth-child(3)::before {
	background-color: rgba(196,112,34,0.8);
}
p.view_num {
	width: 80px;
	height: 23px;
	z-index: 1;
	position: absolute;
	top: 8px;
	left: 200px;
	font-size: 10px;
	text-align: center;
	color: red;
	background-color: rgba(255,228,225,0.9);
}
@media only screen and (min-width: 600px) and (max-width: 959px) {
    /*アコーディオンメニューボタン*/
    #s-navi dt.trigger .op,
    #s-navi dt.trigger .op-st,
    #s-navi dt.trigger .op-st2,
    .op-text, .op-text a {
        font-size:20px;
    }
}
@media screen and (max-width: 767px) {
#s-navi dt.trigger .op {
    font-size: 16px;
}
#headbox .fa {
    margin-right: 8px;
}
}

@media screen and (max-width: 460px) {
/*アコーディオンメニューボタン*/
#s-navi dt.trigger .op {
    font-size:12px;
    line-height:25px;
    background:#d6d6d6;
    max-width: initial;
    padding: 10px 8px 5px 10px;
}

/*アコーディオンメニュー追加ボタン*/
#s-navi dt.trigger .op-st,
#s-navi dt.trigger .op-st2  {
    line-height:25px;
    padding: 12px 10px 5px 10px;
}
.op-text, .op-text a {
    line-height: 25px;
}
}
header .smanone ul.menu li{
        width: 221.6px !important;
 
}
.tagcloud,#searchform,#mybox{
background-color: #fff;/*背景を白く*/
padding: 10px;/*余白*/
border-radius: 3px;/*角を丸くする*/
}

/*----------------------------------------------------
関連記事デザイン
-----------------------------------------------------*/
.random {
	width: 100%;
	display: block;
	margin: 0 1% 17px 4%;
	cursor: pointer;
	background: white;
	position: relative;
	overflow: hidden;
	transition-duration: 0.5s;
}

.random .clearfix {
	width: auto;
	height: 240px;
	display: block;
	margin: 0 1.5% 10px 1.5%;
	cursor: pointer;
	background: white;
	float: left;
	position: relative;
	overflow: hidden;
	transition-duration: 0.5s;
}
.random .clearfix:before {
	content: " ";
	position: absolute;
	bottom: -4px;
	left: 0px;
	width: 0;
	height: 0;
	border-width: 0 4px 4px 0px;
	border-style: solid;
	border-color: transparent;
	border-bottom-color: #f0ebeb;
}
.random .clearfix:hover {
	border-bottom-color: #f0ebeb;
	border-right-color: #f0ebeb;
	background: #f1f1f1;
	-moz-transform: translateY(2px);
	-webkit-transform: translateY(2px);
	-o-transform: translateY(2px);
	-ms-transform: translateY(2px);
	transform: translateY(2px);
	box-shadow: none;
}
.random .clearfix a {
	text-decoration: none;
}
.random .thumbnail-and-category {
	width: 80%;
	height: auto;
	float: none;
	margin: 0 20% 0 10%;
	position: relative;
}
.random .thumbnail-and-category .blockcat{
	position: absolute;
	font-size: 9px;
	padding: 5px 6px;
	line-height: 1;
	font-family: Quicksand,sans-serif;
	background: #f0ebeb;
	font-weight: bold;
	color: white;
}
.random .thumbnail-and-category .contact-us {
	background: #668ad8;
}
.random .thumbnail-and-category .gadgets {
	background: #FFD700;
}
.random .thumbnail-and-category .smart-phone {
	background: #FFA500;
}
.random .thumbnail-and-category .sale {
	background: #DC143C;
}
.random .thumbnail-and-category .tablet-type-device {
	background: #7B3CFF;
}
.random .thumbnail-and-category .internet-business {
	background: #EE82EE;
}
.random .thumbnail-and-category .computer {
	background: #B0C4DE;
}
.random .thumbnail-and-category .privacy-policy {
	background: #DC143C;
}
.random .thumbnail-and-category .economical-sim {
	background: #2d30ef;
}
.random .thumbnail-and-category .economical-sim {
	background: #db4416;
}
.random .thumbnail-and-category .overseas-ecsite {
	background: #db4416;
}
.random .thumbnail-and-category img {
	width: 160px;
	height: 110px;
}
.random .clearfix h3 {
	width: 170px;
	height: auto;
	font-size: 14px;
	line-height: 1.6;
	color: black;
	margin: 15px 0 0 0px;
	border: 0;
}
.random .clearfix ul {
	position: absolute;
	top: 110px;
	border-radius: 3px;
	list-style: none;
}
.random .clearfix li {
	line-height: 1;
	vertical-align: baseline;
	font-size: 9px;
	color: #bfbfbf;
	font-weight: bold;
	font-family: 'Quicksand',sans-serif;
	letter-spacing: 0.05em;
	float: left;
	padding-left: 32px;
}

/*関連記事デザイン スマホサイズ（570px以下）
----------------------------------------------------*/
@media only screen and (max-width: 570px) {
	
	.random .clearfix {
		height: 200px;
	}	
	
	.random .thumbnail-and-category {
		margin: 0 10% 0 10%;
	}
	.random .clearfix h3 {
		font-size: 12px;		
		width: 120px;
		margin: 15px 0 0 0px;
	}
	.random .thumbnail-and-category img {
		width: 140px;
		height: 90px;
	}
	.random .clearfix ul {
		top: 90px;
	}
	.random .clearfix li {
		float: left;
		padding-left: 10px;
	}

}