/*
Theme Name: WING-AFFINGER5 Child
Template: affinger5
Description: ver20180831以上対応
Version: 20180831
*/



/*media Queries スマートフォンとタブレットサイズ（959px以下）で適応したいCSS - スマホ・タブレット
---------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 959px) {


	/*-- ここまで --*/
}
	
/*media Queries タブレットサイズ（600px～959px）のみで適応したいCSS -タブレットのみ
---------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 600px) and (max-width: 959px) {


	/*-- ここまで --*/
}	
	
/*media Queries タブレット（600px）以上で適応したいCSS -タブレット・PC
---------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 600px) {


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

/*media Queries PCサイズ（960px）以上で適応したいCSS - PCのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (min-width: 960px) {


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

/*media Queries スマホサイズ（599px）以下で適応したいCSS - スマホのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (max-width: 599px) {

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


/*アプリーチ ※iphoneアプリやandroidアプリのダウンロードリンク用*/


.appreach {
  text-align: left;
  padding: 10px;
  border: 1px solid #7C7C7C;
  overflow: hidden;
}
.appreach:after {
  content: "";
  display: block;
  clear: both;
}
.appreach p {
  margin: 0;
}
.appreach a:after {
  display: none;
}
.appreach__icon {
  float: left;
  border-radius: 10%;
  overflow: hidden;
  margin: 0 3% 0 0 !important;
  width: 25% !important;
  height: auto !important;
  max-width: 120px !important;
}
.appreach__detail {
  display: inline-block;
  font-size: 20px;
  line-height: 1.5;
  width: 72%;
  max-width: 72%;
}
.appreach__detail:after {
  content: "";
  display: block;
  clear: both;
}
.appreach__name {
  font-size: 16px;
  line-height: 1.5em !important;
  max-height: 3em;
  overflow: hidden;
}
.appreach__info {
  font-size: 12px !important;
}
.appreach__developper, .appreach__price {
  margin-right: 0.5em;
}
.appreach__posted a {
  margin-left: 0.5em;
}
.appreach__links {
  float: left;
  height: 40px;
  margin-top: 8px;
  white-space: nowrap;
}
.appreach__aslink img {
  margin-right: 10px;
  height: 40px;
  width: 135px;
}
.appreach__gplink img {
  height: 40px;
  width: 134.5px;
}

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


/*★Rinkerの設定　ここからhttps://monogrow.com/rinker-affinger/★*/

ul.yyi-rinker-links {
padding: 0!important;
}

div.yyi-rinker-contents img{
max-width:100px;
}

div.yyi-rinker-contents {
margin: 0 0 1.5em;/*外側上の余白を削除*/
border: none;/*外側の枠線を削除（余計な部分）*/
box-shadow: none;/*影を削除*/
}
div.yyi-rinker-contents div.yyi-rinker-box{
border:4px double #CCC;/*二重枠線*/
}
/* 商品タイトル　リンク色変更 */
div.yyi-rinker-title a {
color: #1a62af!important;/*通常時の色*/
font-weight: bold;
}
div.yyi-rinker-title a:hover {/*ホバーした時の色*/
color: #e16d15!important;
}
div.yyi-rinker-contents ul.yyi-rinker-links {
margin-bottom: 0!important;
}
/* rinker ボタン高さを44pxに */
div.yyi-rinker-contents ul.yyi-rinker-links li {
font-size: .9em;
letter-spacing: .1em;
margin: 6px 10px 6px 0px;
padding: 0;
}
div.yyi-rinker-contents ul.yyi-rinker-links li a{
height:44px;
line-height:44px;
}
div.yyi-rinker-contents ul.yyi-rinker-links li a:hover {
color: white!important;
opacity: 1;
}
div.yyi-rinker-contents ul.yyi-rinker-links li:hover {
opacity:0.9;
}
/* ボタン色変更 */
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink { /* Amazon */
background: #ffb745; /* 背景色 */
}
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink { /* 楽天 */
background: #d35c53; /* 背景色 */
}
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink { /* Yahoo */
background: #65adf3; /* 背景色 */
}
/* rinker サムネイル幅を230pxに */
div.yyi-rinker-contents div.yyi-rinker-image {
width: 100px;
min-width: 100px;
padding: 0;
margin-right: 10px;
}
div.yyi-rinker-contents img.yyi-rinker-main-img {
width: auto;
}
/*商品タイトル・詳細・ボタン*/
div.yyi-rinker-contents div.yyi-rinker-info {
width: 100%;
}

/* スマホサイズのみ適用 */
@media screen and (max-width:767px) {
div.yyi-rinker-contents div.yyi-rinker-box{
display:block;
}
/* 画像を中央そろえ */
div.yyi-rinker-contents div.yyi-rinker-image{
margin-left:auto;
margin-right:auto
}
div.yyi-rinker-contents ul.yyi-rinker-links li{
text-align:center;
width: 100%;
margin: 6px 0px;
}
/* rinker 商品詳細（文字とボタン部分）幅を広げる */
div.yyi-rinker-contents div.yyi-rinker-box div.yyi-rinker-info {
width: 95%;
margin: 0 auto;
text-align: center;
}
/*メーカー名・価格・日付部分*/
div.yyi-rinker-contents div.yyi-rinker-detail {
padding-left: 0;/*余計な余白を削除*/
}
div.yyi-rinker-contents div.yyi-rinker-detail　div.price-box {
font-size: .5em;
}
/*値段部分*/
div.yyi-rinker-contents div.yyi-rinker-detail　div.price-box .price {
font-size: 2em;
margin: 5px;
display: block;
}
div.yyi-rinker-contents div.yyi-rinker-image {
width: 230px;
min-width: 140px;
}}

/*スマホボタン表示中央*/
@media (max-width: 420px) and (min-width: 321px){
body div.yyi-rinker-contents ul.yyi-rinker-links li a {
padding: 0;
}}

/*★Rinkerの設定　ここまで★*/



/*★ヘッダー固定、スクロールヒントを表示させるテーブル　https://ponhiro.com/fixed-scroll-table/ ここから★*/

/************************************
** 横長テーブル
************************************/
.p-sticky-table{
	white-space: nowrap;
	line-height:1.6;
}
.p-sticky-table table{
	border:none;
	border: 1px solid #dedede;
	border-bottom: none;
	border-collapse: collapse;
	word-break: break-all;
	table-layout: fixed;
	display:block;
	overflow:scroll;
	max-height: 80vh;
}
.p-sticky-table thead th:first-child {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	left: 0;
	z-index: 3;
}
.p-sticky-table thead th {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 2;
	text-align:center;
}
.p-sticky-table tbody th:first-child{
	position: -webkit-sticky;
	position: sticky;
	left: 0;
	z-index: 1;
	border:none;
	white-space: normal;
	min-width: 130px;
}
.p-sticky-table th, .p-sticky-table td {
	min-width: 50px;
	text-align: left;
	font-size: 16px !important;
	position: relative;
	padding: 13px !important;
	color: #333;
	border: none !important;
	z-index: 0;
	vertical-align:middle !important;
	background:#fff;
}
.p-sticky-table th{
	background:#f0f9ff !important;
	letter-spacing: 1px;
	font-weight: 500 !important;
	color: #555 !important;
}
.p-sticky-table tr{
	border-bottom:none !important;
}
.p-sticky-table img{
	margin: 10px auto;
	display: block;
	padding: 0;
	max-width: 80% !important;
}
.p-sticky-table table th::before, .p-sticky-table table td::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	border-right: 1px solid #dedede;
	border-bottom: 1px solid #dedede;
	z-index: -1;
}
/* スマホ */
@media screen and (max-width: 560px) {
	.p-sticky-table table {
		max-height: 60vh;
  	}
	.p-sticky-table thead th:first-child, .p-sticky-table tbody th:first-child {
    		min-width: 25vw;
  	}
 	.p-sticky-table th, .p-sticky-table td {
    		font-size: 12px !important;
    		padding: 7px !important;
  	}
}
/* 中央寄せ */
.pst-center td {
	text-align: center;
}


/*★ヘッダー固定、スクロールヒントを表示させるテーブル　https://ponhiro.com/fixed-scroll-table/ ここまで★*/




/*★TwitterをPCでは横並びにする https://hebochans.com/twitter-side-by-side/ ※「mtpro-wrapper」がtweetまとめツールProのオブジェクト名です。　ここから★*/
.mtpro-wrapper {
	display: flex; /* これで横並びになる */
	flex-wrap: wrap; /* 折り返す */
}
.twitter-tweet {
	max-width: 300px!important;
	padding: 5px; /* 1つのツイートの周りに5pxの余白をつける */
	margin: 10px auto; /* ツイートを中央寄せにする */
}

/* 画面サイズ960px以下ではTwitterを縦並びに変える */
@media (max-width: 960px) {
.flex1 {
	display: block; /* 横並びを解除 */
}
.twitter-tweet {
	padding: 0; /* 縦並びでは余白なし */
}
}

/*★TwitterをPCでは横並びにする https://hebochans.com/twitter-side-by-side/ ※「mtpro-wrapper」がtweetまとめツールProのオブジェクト名です。　ここまで★*/

