/*
Template:twentyseventeen
Theme Name:twentyseventeen_child
*/

.sticky{
	margin-bottom: -10000px;
	position: -webkit-sticky;
	position: sticky;
	top: 10px;
}

@media screen and (min-width: 500px){
	.wrap {
		max-width: 100%;
		//min-width: 870px;
		padding-left: 2em;
		padding-right: 5em;
	}
	.site-header {
		max-width: 100%;
		min-width: 1000px;
	}

	.navigation-top .wrap {
		max-width: 1120px;
	}
	.navigation-top {
		background: #fff;// 背景色設定
		color: #ff0;// 文字色設定
	}

	.header-menu {
		max-width: 100%;
		min-width: 1000px;
		background-color: aquamarine;
		height: 50px;
	}
	.header-menu ul {
		//padding-left: 100px;
	}
	.header-menu li {
		display: inline-block;
		max-width: 100%;
		//background-color: #ffcc66;
		height: 50px;
		border-right: #fff 1px solid;
		//border-left: #fff 1px solid;
		//border-right-color: #99ff00;
	}
	.header-menu li a{
		font-size: 1.2em;
		display: block;
		height: 50px;
		//padding-top: 13px;
		padding: 13px 10px;
	}
	.header-menu a:hover{
		background-color: mediumspringgreen;
	}

	p {
		//font-size: 1.0em;
	}

	.site-content {
		//background-color: gray;
		padding-top: 0; /* トップメニューとサイドバー&コンテンツの間の余白   */
	}

	.site-content .wrap {
		min-width: 1000px; /* これでブラウザを縮小しても左サイドバーが下に落ちない*/
		//background-color: #99ff00;
		//background-color: bisque;
	}

	.site-main {
		background-color: white;
		padding-top: 5px; 
		/* min-width: 750px;  必要*/
		//margin-left: -30px;
	}

	.entry-title,
	.entry-content {
		padding-left: 15px; 
		padding-right: 25px; 
	}

	.has-sidebar:not(.error404) #primary {
		//float: right;               
		width: 75%;
		/* min-width: 650px;  これでブラウザを縮小してもitem-homeが２つ維持される*/
		/* max-width: 700px; これをすると幅固定されるが、サイドバーとの間が伸びる */
		//background-color: #cccccc;
		//margin-right: 15px;
	}
	.has-sidebar #secondary {
		//float: left;
		width: 20%;
                margin-top: 100px;
		//top: 0px;
		//background-color: #ffcc66;
		//margin-left: -25px;
		//padding: 5px 5px;
	}


	/* ----------- home,archiveのページリンク  ----------- */
	.home-pagination,
	.archive-pagination {
		clear: both;
		text-align: center;
		//padding-top: 10px;
		//padding-bottom: 10px;
		color: #33aa88;
		//background-color: bisque;
		font-size: 1.2em;
		height: 200px;
	}
	.home-pagination .pagination-body,
	.archive-pagination .pagination-body {
		padding-top: 20px;  /* PC側はなぜかmarginではできない */
	}
	.my-page-numbers {  /* カレント */
		padding: 0 0.75em;
		background-color: #eee8aa;
		border: solid 3px #eee8aa;
		border-radius: 20px;
		margin-left: 5px;
		font-size: 1.2em;
	}
	a.my-page-numbers { /* カレント以外 */
		padding: 0 0.75em;
		background-color: #ffd700;
		border: solid 3px #ffd700;
		border-radius: 20px;
		margin-left: 5px;
		font-size: 1.2em;
	}
	.prev.my-page-numbers,
	.next.my-page-numbers {
		color: black;
		background-color: #ffd700;
		-webkit-border-radius: 2px;
		border-radius: 5px;
		display: inline-block;
		font-size: 1.0em;
		line-height: 1;
		padding: 0.5em 0.5em 0.4em;
	}
	.prev.my-page-numbers {
		float: left;
	}
	.next.my-page-numbers {
		float: right;
	}

	/* フッター2列を1列にする */
	.site-footer .widget-column.footer-widget-1 {
		clear: both;
		width: auto;
	}

	.site-footer {
		margin-top: 0em; // 必要
		//background-color: tan;
		background-color: bisque;
		text-align: center;
	}

	.site-footer .wrap {
		padding-top: 0em;
		margin-top: 0em;
		padding-left: 10em;
		padding-right: 8em;
		text-align: center;
	}

	.site-footer .site-info a {
		margin: 0;
		padding: 0;
	}


	/* サイドバーメニュー*/
	ul.side-menu  {
		margin: 0;  /*必要*/
	}
	ul.side-menu li {
		display: block;
		line-height: 40px;
		text-indent: 10px;
		font-weight: bold;
		background-color: gold;
		margin: 0;
		padding: 0;
	}
	ul.side-menu a {
		display: block;
		border-style: none;
		border-color: #00ced1;
	}
	ul.side-menu li a:hover {
		background-color: coral;
		color: white;
		text-decoration: none;
	}

	span.child a {
		margin-left: 20px;
	}

	/* 項目 */
	.item-home,
	.item-archive, 
	.item-search {
		position: relative;
		background-color: #ffffcc;
		padding: 15px 10px;
		margin-top: 10px;
		margin-bottom: 10px;
		margin-left: 20px;
		height: 200px;
		width: 90%;
		//float: left;
	}
	.item-home a,
	.item-archive a,
	.item-search a {
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		height: 200px;
		width: 100%;
		text-decoration: none;
		//font-weight: bold;
		font-size: 1.0em;
		background-color: #ffffcc;
	}
	.item-home a:hover,
	.item-archive a:hover,
	.item-search a:hover {
		background-color: #ffcc66;
	}

	.item-home-title {
		padding-top: 10px;
		padding-left: 10px;
		font-weight: bold;
		font-size: 1.1em;
	}
	.item-home-excerpt {
		float: right;
		width: 65%;
		height: 70%;
		padding-top: 10px;
		margin-right: 20px;
		//background-color: red;
	}
	.item-home-img {
	 	width: 30%;
	 	height: 80%;
		padding-top: 5px;
		padding-left: 5px;
		//background-color: green;
	}
	img.img-home,
	img.img-archive, 
	img.img-search {
		//position: absolute;
		//top: 10px;
		//left: 0;
		//margin: 10px 15px;
		width: 100%;
		height: 100%;
		//transform: rotate( -90deg );
	}

	.item-home span,
	.item-archive span,
	.item-search span {
		padding: 10px 10px;
		text-decoration: underline;
		background-color: #ccff99;
	}

	.btn-takuhai {	
		margin-left: 170px;
	}

	/* 正方形のリンクボタン*/
	.btn-square {
		font-size: 1.2em;
	}
	.btn-square a {
		text-align: center;
		color: white;
		width: 150px;
		height: 150px;
		font-size: 1.2em;
		background-color: #f4a460;
		border: solid 10px #f4a460;
		border-radius: 10px;
	}
	.btn-square a:hover {
                color: #0066ff;
		background-color: #ffd700;
		border: solid 10px #ffd700;
		border-radius: 10px;
	}

	/* afiリンクスタイル */
	.afi-box {
		text-align:left;
		//padding-bottom:10px;
		font-size:small;
		zoom: 1;
		overflow: hidden;
		//	background-color: #c20004;
		background-color: #fafad2;
	}
	.afi-image {
		float:left;
		margin:10px 20px 5px 20px;
		width:30%;
	}
	.afi-info  {
		margin-top: 10px ;
		padding-right: 20px;
		line-height:120%;
		zoom: 1;
		overflow: hidden;
	}
	.afi-name {
		margin-top: 20px;
		font-size:20px;
		font-weight: bold;
		margin-bottom: 20px;
	}
	.afi-name a {
		margin-bottom:0px;
		line-height: 150%;
		font-size:16px;
	}
	.afi-link {
		//margin-top: 50px;
	}
	.afi-link a {		
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		border-radius:5px;
		display:inline-block;
		margin:5px 2px 0 0;
		padding:10px 1px;
		text-align:center;
		//float:left;
		text-decoration:none !important;
		font-weight:800;
		//text-shadow:1px 1px 1px #dcdcdc;
		font-size:14px;
		color: #fff !important;
	}
	.afi-link-amazon {
		float:left;
		width:50%;
		margin-bottom:10px;
	}
	.afi-link-amazon a {
		width:90%;
		color:#000 !important;
		border: 1px solid #FF9901 !important;
		background-color: #FF9901 !important;
		}
	.afi-link-rakuten {
		float:right;
		width:50%;
	}
	.afi-link-rakuten a {
		width:90%;
		color:#fff !important;
		border: 1px solid #c20004 !important;
		background-color: #c20004 !important;
		}
	
	.afi-link-p { 
		float: left;
		font-size: 1.2em; 
		font-weight: bold; 
	}
	.afi-link-rentalsrv a {
	    width: 90%;
	    border: 1px solid orange;
		background-color: orange;
		margin-bottom: 20px;
	}
	.afi-link-rentalsrv a:hover {
	    border: 1px solid lightcoral;
		background-color: lightcoral;
	}

	.afi-link-first {
		float:left;
		width:50%;
		//margin-bottom:10px;
	}
	.afi-link-first a {
		width:90%;
		color:#000 !important;
		border: 1px solid #FF9901 !important;
		background-color: #FF9901 !important;
	}
	.afi-link-second {
		float:right;
		width:50%;
	}	
	.afi-link-second a {
		width:90%;
		color:#fff !important;
		border: 1px solid #c20004 !important;
		background-color: #c20004 !important;
	}

	/* 関連記事スタイル */
	.related-kiji {
		margin: 5px 0 0;
		padding: 10px;
		height: 400px;
		background-color: #ffe4b5;
		//display: inline-block;
	}
	.related-kiji h4 {
		font-size: 1.25em;
		padding: 3px 5px;
		border-bottom: solid 1px #999;
	}
	.related-item {
		margin: 5px 5px;
		padding: 10px;
		width: 300px;
		height: 120px;
		float: left;
		position: relative;
	}
	.related-item a {
		margin: 5px 0 0;
		padding: 10px;
		width: 300px;
		height: 120px;
		background-color: white;
		display: inline-block;
	}
	.related-item img {
		height: 100px;
		width: 100px;
		object-fit: cover;
		float: left;
		margin-right: 10px;
	}
	.related-item .text {
		position: absolute;
		top: 30px;
		left: 125px;
		font-size: 16px;
		font-weight: bold;
		background-color: lightgreen;
	}
	.related-item .p {
		position: absolute;
		top: 30px;
		left: 125px;
		font-size: 16px;
		font-weight: bold;
		background-color: lightgreen;
	}

}