/*
Theme Name: Fontdasu
Theme URI: http://www.webcreatormana.com/fontdasu/
Description: Fontdasuのテーマ
Version: 1.1
Author: 只野凡字
Author URI: http://fontdasu.com
*/

@charset "utf-8";

/* 基本設定 */

body {
	font-size: 14px;
	color: #333 !important;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}

#main {
	width:810px;
	margin-bottom:30px;
}


.slides {
	margin:0;
	padding: 0;
	list-style-type: none;
}


article p {
	margin-bottom: 20px;
	font-size: 16px;
	line-height: 170%;
}

#social {
	position: absolute;
	width: 1170px;
	display: flex;
	justify-content: flex-end;
	top: 0px;
}

#sidebar ul{
	margin: 15px 0 0 0;
	padding: 0;
}

#sidebar li {
	list-style-type: none;
	margin-bottom: 8px;
	padding: 0;
	word-wrap: break-word;
}

#sidebar ul > li:last-child {
	margin-bottom: 0;
}


article h2 {
    font-size: 20px;
    margin: 0 0 30px 0;
    display: block;
    font-weight: bold;
}
/* ページャー */
ul.page-nav {
	padding:0;
	color:#fff;
    text-align:center;
    font-weight:bold;
    margin:30px 0;}
ul.page-nav li {display:inline;}
ul.page-nav li a {
    color: #000;
    border: 1px solid #000;}
ul.page-nav li a:hover {
    text-decoration:none;
    color: #fff;
    background: #ffcc33;
    border: 1px solid #ffcc33;}
ul.page-nav li a:active {top:1px;}/*push image*/
ul.page-nav li.current span {/*style of current button*/
    border: 1px solid #000;
    background: #000;}
ul.page-nav li.first span,
ul.page-nav li.previous span,
ul.page-nav li.next span,
ul.page-nav li.last span,
ul.page-nav li.page_nums span {/*no link buttons*/
    border: 1px solid #000;;
    color: #000;}
ul.page-nav li a,
ul.page-nav li.current span,
ul.page-nav li.first span,
ul.page-nav li.previous span,
ul.page-nav li.after span,
ul.page-nav li.next span,
ul.page-nav li.last span,
ul.page-nav li.page_nums span {
    padding: 0.5em 0.8em;
    position:relative;}

h3 {
	color:#000;
    text-shadow:
        0 2px 0 #fff,
        2px 0 0 #fff,
        0 -2px 0 #fff,
        -2px 0 0 #fff,
        -2px -2px 0 #fff,
        2px -2px 0 #fff,
        -2px 2px 0 #fff,
        2px 2px 0 #fff;
	font-size:14px;
    border: 2px solid #000;
    background: url(img/lnavi-bg.png);
	padding:10px;
	margin-bottom:10px;
	display:inline-block;
	margin: 30px 0 10px 0;
	}

#pageTop {
     position: fixed;
     _position:absolute;
     bottom: 20px;
     right: 20px;
}
 
#pageTop a {
     background: #999;
     text-decoration: none;
     color: #fff;
     padding:15px;
     text-align: center;
     display: block;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
 
#pageTop a:hover {
     text-decoration: none;
     background: #ffcc33;
}

a img {
	-webkit-transition: 0.3s ease-in-out;
	   -moz-transition: 0.3s ease-in-out;
	     -o-transition: 0.3s ease-in-out;
	        transition: 0.3s ease-in-out;
}

a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
}

a  {
	-webkit-transition: 0.3s ease-in-out;
	   -moz-transition: 0.3s ease-in-out;
	     -o-transition: 0.3s ease-in-out;
	        transition: 0.3s ease-in-out;
}

article.blog-index .blog-index-wrap {
    display: flex;
	-js-display: flex;
}

article.blog-index img {
	margin:0;
}

article.blog-index .info {
    display: flex;
	-js-display: flex;
}

article .info {
    display: flex;
	-js-display: flex;
	font-size:10px;
}

article.blog-index .category {
    padding-right: 10px;
    font-size: 10px;
}

article .category {
    padding-right: 10px;
    font-size: 10px;
}

article.blog-index .date {
    padding-right: 10px;
    font-size: 10px;
	}


article .date {
    padding-right: 10px;
    font-size: 10px;
	}

article .view{
	margin:0 !important;
    padding-right: 10px;
}

article .rating{
	margin:0 !important;
    padding-right: 10px;
}

.post-ratings p {
	margin:0 !important;
}


article .rating img {

	width:12px !important;
	height:12px !important;
	margin:0 !important;
}



article.blog-index  h2 {
	font-size: 24px;
	padding-bottom: 0;
	font-weight: bold;
	line-height: 130%;
	border-bottom: none;
	margin-bottom:10px;
}

article.blog-index .thumb{
	margin-bottom: 0;
}

article.blog-index .thumb img{
	width: 180px;
}

article.blog-index p {
	margin-bottom: 20px;
	font-size: 16px;
	line-height: 170%;
}

article.blog-index .right-box {
	margin-left:30px;
	}


#contents h1 {
	margin:0 0 15px 0;
	font-size:28px;
	font-weight:bold;
    border-bottom: 3px solid #000;
	padding-bottom:15px;
	line-height:1.3;
}

#contents .category-name {
	margin:0 0 15px 0;
	font-size:28px;
	font-weight:bold;
    border-bottom: 3px solid #000;
	padding-bottom:15px;
	clear:both;

}


.lead {
		font-size:14px;
		margin-bottom:30px;
	}

.lead p {
	margin:0;
}


/*テーブル*/
.font-data-02 {
	border-collapse: collapse
}
.font-data-02 td {
	vertical-align: top;
	text-align: left;
	padding: 14px;
	border: #000 1px solid;
}
.font-data-02 th {
	font-weight: bold;
	background-color: #e7e7e7;
	text-align: left;
	padding: 10px;
	border: #000 1px solid;
}


.header-bg {
	background-color:#FF0;
	width:100%;
	}
	
.header-wrap {
	-js-display: flex;
	display: flex;
    width: 1200px;
    height: 74px;
    margin-left: auto;
    margin-right: auto;
    padding: 0px 15px;
	}
	
.logo {
	padding-top: 20px;
	position: relative;
	z-index: 3;
	}

.logo-title,.logo-description {
	position:absolute;
	clip:rect(1px,1px,1px,1px)
}



.tagline {
    font-size: 11px;
    padding: 12px 0px 0px 20px;
    margin:20px 0 0 0;
 }
	
	
.lnavi-bg {
	width: 100%;
    height: auto;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    background: url(img/lnavi-bg.png);

}

#lnavi {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

#lnavi nav {
	-js-display: flex;
	display: flex;
	padding-left:15px;
	padding-right:15px;
}

#lnavi nav ul {
	-js-display: flex;
	display: flex;
    margin-bottom: 0px;
	padding:0;
}


#lnavi nav li {
    list-style: none;
    border-left: 1px solid #000;
    border-right: 0px;
}


#lnavi nav li a {
    display: block;
    font-weight: bold;
    vertical-align: top;
    text-align: center;
    font-size: 14px;
    background-color: #fff;
    width: 145px;
    padding: 15px;
	color:#000;
	text-decoration:none;

}

#lnavi nav li a:hover {
    background-color: #ffcc33;
	color:#fff;
}


#lnavi nav li.last {
    border-right: 1px solid #000;
	
}

.breadcrumbs {
    width: 1200px;
	padding:15px 15px 0 15px;
	margin:0 auto;
}

.breadcrumbs ul {
	-js-display: flex;
	display: flex;
	margin:0;
	padding:0;
}


.breadcrumbs ul li {
    list-style: none;
	padding-right: 10px;
}



#wrapper {
	-js-display: flex;
	display: flex;
	justify-content: space-between;
	padding: 50px 15px 50px 15px;
    width: 1200px;
	margin:0 auto;
}

#contents{
	width:810px;
}

@media (max-width: 767px){
#contents {
    width: 100%;
}
}

article.index a{
	padding-top:30px;
	padding-bottom:30px;

	
	}

article.index:last-child {
	padding-top:30px;
	padding-bottom:30px;
    border-bottom: 0px;
	
	}


article.blog-index {
	padding-top:20px;
	padding-bottom:20px;
    border-bottom: 1px solid #000;
	
	}

article.blog-index:last-child {
	padding-top:10px;
	padding-bottom:15px;
    border-bottom: 0px;
}


.entry-header h1 {
	margin: 0 0 15px!important;
    border-bottom: 0px!important;
    padding-bottom: 0px!important;
}
.entry-header h1 a {
    font-size: 14px!important;
    margin: 0 0 15px!important;
    font-weight: bold!important;
    line-height: 130%!important;
    padding-bottom: 0px!important;
    border-bottom: 0px!important;
}

article.index h2 {
	font-size: 14px;
	margin: 0 0 15px; 0;
	padding-bottom: 0;
	font-weight: bold;
	line-height: 130%;
	border-bottom: none;
}

article.index img {
	margin-top:0px;
	margin-bottom:30px;
	width: 810px;
}


article img {
	margin-top:15px;
	margin-bottom:30px;
	max-width:810px ;
	height:auto;
}

article .font-data {
	-js-display: flex;
	display: flex;
    flex-wrap: wrap;

}

article .font-data p{
	font-size:10px;
	margin:0;
}

article .font-data .category {
	padding-right:10px;
}

article .font-data .category span{
	background: #999;
	color: #fff;
	font-size: 10px;
	padding: 2px;
	margin-right:4px;
}


article .font-data .license {
	padding-right:10px;
	
}

article .font-data .license span{
	background: #999;
	color: #fff;
	font-size: 10px;
	padding: 2px;
	margin-right:4px;
}


article .font-data .tag{
		padding-right:10px;
}





/*テーブル*/
.font-data-02-tbl {
	border-collapse: collapse;
	width: 390px;
	margin-bottom: 15px;
}
.font-data-02-tbl td {
	vertical-align: top;
	text-align: left;
	padding: 14px;
	border: #000 1px solid;
}
.font-data-02-tbl th {
	width:40%;
	white-space: nowrap;;
	font-weight: bold;
	background-color: #e7e7e7;
	text-align: left;
	padding: 14px;
	border: #000 1px solid;
}


.font-data-02-wrap {
	margin-top:30px;
	display:flex;
	-js-display: flex;

}

.font-data-02 {
	margin-right:15px;

}

.font-download {
	margin-leftt:30px;

}

.font-download img{
	margin-top:10px;
	max-width: 390px;
}

.font-data-02-btn a {
	width:50%;
	margin-left:auto;
	margin-right:auto;
	background-color: #000;
	text-decoration: none;
	text-align:center;
	display: block;
	padding: 15px;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	margin-top:30px;
    -webkit-border-radius: 3px;

    -moz-border-radius: 3px;
    border-radius: 3px;
}

.font-data-02-btn a:hover {
    background-color: #ffcc33;
	color:#fff;
}



#sidebar {
	width: 300px;
}


.google-adsense-01 {
    margin-bottom: 30px;
	width: 300px;
	height: auto;
	}

#font-search {
	background-color:#FF0;
    padding: 20px;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}

.eyecatching {
    width: 100px;
    padding:10px;
    background: #000;
    color: #fff;
    text-align: center;
    display: inline-block;
    position: absolute;
    top: -7px;
    left: -38px;
    text-transform: uppercase;
    transform: rotate(315deg);
	}
	
#font-search h2{
	text-align:center;
	margin:0 0 15px 0;
	font-size:20px;
	font-weight:bold;
    border-bottom: 2px solid #000;
	padding-bottom:15px;
}

#font-submit {
	background-color:#FF0;
    padding:20px;
	margin-bottom: 30px;
    position: relative;
    overflow: hidden;
	}
	
#font-submit h2{
	text-align:center;
	margin:0 0 15px 0;
	font-size:20px;
	font-weight:bold;
    border-bottom: 2px solid #000;
	padding-bottom:15px;
}


.font-submit-btn a {
	width:80%;
	margin-left:auto;
	margin-right:auto;
	background-color: #000;
	text-decoration: none;
	text-align:center;
	display: block;
	padding: 10px;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	margin-top:15px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.font-submit-btn a:hover {
    background-color: #ffcc33;
	color:#fff;
}


#font-install {
	background-color:#FF0;
    padding:20px;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
	}


#font-install h2{
	text-align:center;
	margin:0 0 15px 0;
	font-size:20px;
	font-weight:bold;
    border-bottom: 2px solid #000;
	padding-bottom:15px;
}


.font-install-btn-wrap {
	display:flex;
	-js-display: flex;
	justify-content:center;
	}

.font-install-btn {
	margin-right:10px;
}

.font-install-btn a {
	width:115px;
	background-color: #000;
	text-decoration: none;
	text-align:center;
	display: block;
	padding: 10px;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;

}

.font-install-btn last-child {
	margin-right:0px;
}




.font-install-btn a:hover {
    background-color: #ffcc33;
	color:#fff;
}



#profile {
	background-color:#FF0;
    padding: 20px;
    position: relative;
    overflow: hidden;
	}

#profile h2{
	text-align:center;
	margin:0 0 15px 0;
	font-size:20px;
	font-weight:bold;
    border-bottom: 2px solid #000;
	padding-bottom:15px;
}

#profile .thumb{
    float: left;
	}

#profile .right {
	padding-left: 90px;
}

#profile .name{
	font-weight:bold;
	margin-bottom: 5px;
    line-height: 160%;
	}
	

#profile .position{
    font-size: 10px;
    line-height: 140%;
	}

#profile .text{
    font-size: 12px;
	clear: both;
	}


.profile-btn a {
	width:80%;
	margin-left:auto;
	margin-right:auto;
	background-color: #000;
	text-decoration: none;
	text-align:center;
	display: block;
	padding: 10px;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	margin-top:15px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.profile-btn a:hover {
    background-color: #ffcc33;
	color:#fff;
}



.footer-bg {
	background-color:#FF0;
	width:100%;
	clear:both;
}

.footer-wrap {
	padding: 15px;
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.footer-wrap p{
	margin:0;
}

#copyright {
	text-align:center;
	font-size: 12px;
}

#search {
	display:flex;
	-js-display: flex;
	justify-content:center;
	
	}
	
#search input {
	margin-top:15px;
	vertical-align: top;

}

#s {
	position: relative;
	width: 190px;
	background: #fff;
	border: solid 1px #000;
	padding: 5px;
	height:35px;
}


#s:focus {
	background-color:#ffcc33;
	color:#ffffff;
}



.google-adsense-02 {

	background-color:#ebebe8;
	text-align:center;
	padding:30px;

}

.recommend .box {	
	padding-top:15px;
	padding-bottom:15px;
	position: relative;
	min-height: 100px;
    border-bottom: 1px solid #000;
		}



.recommend .box:last-child {
	padding-top:15px;
	padding-bottom:15px;
    border-bottom: 0px solid #000;
	}

.recommend .box .box-wrap {
    display: flex;
	-js-display: flex;
}


.recommend .box img{

	width: 70px;
	height:auto;
	}

.recommend .box .right-box {
	margin-left: 85px;
	}
	
.recommend .box  h4{
	margin: 0 0 5px 85px;
	font-size: 14px;
	line-height: 150%;
	}
	
.recommend .box p{
		display:none;
		margin:0;
	}	

.recommend .box .thumb {
	display: block;
	position: absolute;
	top: 15px;
	}
	
.recommend .box .date {
	display: block;
    font-size: 10px;
}

.recommend .box .date img{
	width:12px;
	height:12px;
}



#book-selecion {
	justify-content: space-between;
	padding:30px 15px 30px 15px;
    width: 1200px;
	margin:0 auto;
}

#book-selecion .book-selecion-wrap {
	-js-display: flex;
	display: flex;
	margin-top:15px;

}

.book {
	width:20%;
	box-sizing: border-box;
	padding:15px;
	display: block;
	margin-bottom: 5px;
}

.book img{
	width:100%;
	border:solid 1px #000;

}

.book-text{
	padding-top:10px;

}



@media(max-width:767px) {
	body {
		font-size: 13px;
	}
	
	#main {
	width:100%;
	height:auto;

	}

	#main img {
	width:100%;
	height:auto;
	margin-bottom:15px;
	}
	
	.post-ratings img {
		width:32px;
}

.breadcrumbs {
    width: 100%;
	padding:15px 15px 0 15px;
	margin:0 auto;
}

#pageTop {
	display:none !important;
     }
	 
	article.blog-index{	
	position: relative;
	min-height: 100px;
		}

	article.blog-index:last-child {
	padding-top:15px;
	padding-bottom:15px;
    border-bottom: 0px;
	
	}


	article.blog-index .thumb img{

	width: 70px;
	height:auto;
	}

	article.blog-index .right-box {
	margin-left: 85px;
	}

	article.blog-index  h2{
	margin: 0 0 5px 85px;
	font-size: 14px;
	line-height: 150%;
	}
	
	
	#contents .category-name {
	margin:0 0 15px 0;
	font-size:18px;
	font-weight:bold;
    border-bottom: 3px solid #000;
	padding-bottom:10px;

}

	#contents h1 {
	margin:0 0 15px 0;
	font-size:18px;
	font-weight:bold;
    border-bottom: 3px solid #000;
	padding-bottom:10px;

}


	
	article.blog-index p{
		display:none;
	}	

	article.blog-index .thumb {
	display: block;
	position: absolute;
	top: 15px;
	}
	
	article.blog-index .date {
	display: block;
	margin:0;
}
	


	
	.header-wrap {
	width:100%;
	height: 80px;
	flex-wrap: wrap;
	
	}

	.logo{
	width:100%;
	padding-top:15px;
	text-align:center;
	}	
		
	.logo img{
	width:50%;}

	.tagline {
	width:100%;
	text-align:center;
	margin:0;
	padding:0;
	line-height:1.4;
	}

	#header-wrap {
		width:100%;}
		

	
	#lnavi {
		width:100%;}
		
	#lnavi nav {
		flex-wrap: wrap;
	padding: 0 0;
	}


	.lnavi-bg {
		border-top: solid 0px #000;
		border-left: solid 0px #000;
		border-right: solid 0px #000;
		border-bottom: solid 1px #000;		
		background-image:none;
		}

	#lnavi nav ul {
	padding: 0 0;
		width:100%}


	#lnavi nav li {
    width:50%;
	border-top: solid 1px #000;
	border-left: solid 1px #000;
	}

	#lnavi nav li:last-child {
	border-right: solid 1px #000;
	}


	
	#lnavi nav li a {
    display: block;
    font-weight: bold;
    vertical-align: top;
    text-align: center;
    font-size: 10px;
    background-color: #fff;
    width: 100%;
    padding: 10px 3px 10px 3px;
	color:#000;
	text-decoration:none;
	height:auto;

}

	#wrapper {
	flex-wrap: wrap;
	padding: 25px 15px 0 15px;
	width:100%;}

	article.index {
	padding-top: 15px;
	padding-bottom:15px;
	}
	
	article.index img{
	width:100%;
	height:auto;
	
	}
	
	
	article img{
	width:100%;
	height:auto;
	
	}
	
	
	#sidebar {
	width: 100%;
}	

#font-search {
    padding: 15px;
    margin-bottom: 15px;

}



#font-submit {
	background-color:#FF0;
    padding: 15px;
	margin-bottom: 15px;
	}


#font-install h2 br{
	display:none;
}

#font-install {
	background-color:#FF0;
    padding: 15px;
    margin-bottom: 15px;
	}

#profile {
	background-color:#FF0;
    padding: 15px;

	}

.google-adsense-01 {
    margin-bottom: 15px;
    text-align: center;
	width:100%;
}



.google-adsense-02 {
	width:100%;
	background-color:#fff;
	text-align:center;
	padding:15px;

}

.footer-wrap {
    width: 100%;
	padding: 15px;
    margin-left: auto;
    margin-right: auto;
	text-align:center;
}

.google-adsense-02 img{
    width: 100%;
	height:auto;
}

.font-data-02 {
	width: 100%;
}

.font-data-02-tbl {
	border-collapse: collapse;
	width: 405px;
	margin-bottom: 15px;
}

.font-data-02-wrap {
	flex-wrap: wrap;
}

.font-data-02-tbl {
	width: 100%;
	}
	
.font-data-02-tbl th {
	padding:10px;
	width:30%;}

.font-data-02-tbl td {
	padding:10px;}
	
.font-download {
	width:100%;
	margin-leftt:0px;
	text-align:center;
}

.font-download p{
	text-align:left;
}

.font-download img{
	width:100%;


}

.font-data-02-btn a {
	width:95%;
	margin-bottom:30px;
	font-size:16px;
	padding:12px;
}



#book-selecion {
	padding:0px 15px 30px 15px;
    width: 100%;
}

#book-selecion .book-selecion-wrap {
	flex-wrap: wrap;
}

.book {
	width:33%;
	padding:10px;
	}


article.index h2 {
	font-size: 12px;
	margin: 0 0 10px; 0;
}

#breadcrumb {
	width: 100%;}

#social {
	position: static;
	width: 100%;
	justify-content: center;
}

#social .wp_social_bookmarking_light {
	padding:0 !important;

}




}

.similar_posts {	
	padding-top:15px;
	padding-bottom:15px;
	position: relative;
	min-height: 100px;
    border-bottom: 1px solid #000;
		}





.similar_posts:last-child {
	padding-top:15px;
	padding-bottom:15px;
    border-bottom: 0px solid #000;
	}

#contents ul {
	padding:0;}
	
	


.similar_posts_title {
	margin: 0 0 5px 15px!important;
	font-size: 14px;
	line-height: 150%;
	font-weight: bold;
	position:relative;
	}
	
.similar_posts  h4{
	margin: 0 0 5px 85px;
	font-size: 14px;
	line-height: 150%;
	font-weight: bold!important;
	}	
.similar_posts .thumb {
	display: block;
	position: absolute;
	top: 15px;
	}

.similar_posts .thumb img {
	width: 70px;
	height: 70px;
	}

.similar_posts .thumb a{
	width: 70px;
	height: 70px;
	display: block;
	background: url(img/default.png);
	background-size:contain;
	}

	
.similar_posts .box-wrap {
    display: flex;
	-js-display: flex;
}



.similar_posts .right-box {
	margin-left: 85px;
	}