@charset "utf-8";
/* CSS Document */



/* : index
----------------------------------------------- */


/*
===== category =====
*/


.column-top-category{
	margin-bottom:20px;
	background:#ffff;
}

.column-top-category ul{
    display:flex;
    flex-wrap:wrap;
	border-left:1px solid #e9e9e9;
	border-top:1px solid #e9e9e9;

}
.column-top-category li{
	width:20%;
	border-right:1px solid #e9e9e9;
	border-bottom:1px solid #e9e9e9;
}

@media only screen and (max-width: 768px) {

.column-top-category li{
	width:50%;
}

}


.column-top-category li a{
	display:block;
	padding:10px 10px 10px 30px;
	position:relative;
	text-decoration:none;
	height:100%;
}
.column-top-category li a:before{
	border:5px solid transparent;
	border-left:7px solid #2589ba;

	content:"";
	position:absolute;
	left:15px;
	top:20px;

}

/*
===== list =====
*/


.column-index-list{
    display:flex;
    flex-wrap:wrap;
	column-gap: 20px;

}
.column-index-list .item{
	width:calc( (100% - 40px) / 3);
	margin-bottom:20px;
}

@media only screen and (max-width: 768px) {

.column-index-list .item{
	width:100%;
}

}


.column-index-list .item a{
	display:block;
	text-decoration:none;
	position:relative;
	border:1px solid #bdb9b6;
}

.column-index-list .item .img{
	margin-bottom:25px;
}

.column-index-list .item .img span{
	background-position:center;
	background-size:cover;
	display:block;
	height:210px;

}

.column-index-list .item .cat{
	position:absolute;
	left:-10px;
	top:10px;
}
.column-index-list .item .cat span{
	color:#fff;
	background:#218dbb;
	padding:1px 5px;
	font-weight:bold;
	display:inline-block;
	margin-right:5px;
	font-size:14px;
}


.column-index-list .item .body{
	margin:8px;
}
.column-index-list .item .title{
	border-top:2px solid #218dbb;
	padding-top:10px;
	font-weight:bold;
	margin:0 10px 5px 10px;
	color:#218dbb;
	font-size:18px;
}

.column-index-list .item .exp{
	margin:0 10px 15px 10px;
	font-size:14px;
}


.column-index-list .item .author{
	background:#e6e2e1;
	position:relative;
	padding:17px 15px 17px 80px;
	height:60px;
}
.column-index-list .item .author .a-img{
	position:absolute;
	
	left:0;
	top:0;
	height:100%;
	width:60px;
	background-position:center;
	background-size:cover;

}


.column-index-list .item .author .a-name{
	font-size:14px;
}






/* : detail
----------------------------------------------- */


.column-detail .meta{
	margin-bottom:10px;
    display:flex;
    flex-wrap:wrap;
	align-items:center;

}

.column-detail .meta .cat a{
	color:#fff;
	background:#218dbb;
	padding:0 10px;
	font-weight:bold;
	display:inline-block;
	margin-right:10px;
	text-decoration:none;
}
.column-detail .meta .date{
	font-size:15px;
}



.column-detail .column-title{
	color:#0096c8;
	font-size:30px;
	margin-bottom:40px;
	border-bottom:3px solid #0096c8;
	padding-bottom:10px;
}


@media only screen and (max-width: 768px) {

.column-detail .column-title{
	font-size:26px;
}

}

/* author */


.column-detail .author{
	width:840px;
	margin:0 auto 50px auto;
	border:1px solid #e0dcdb;
	padding:8px;
}

.column-detail .author .title{
	text-align:center;
	font-weight:bold;
	color:#fff;
	background:#0096c8;
	padding:10px;
	margin-bottom:30px;
}

.column-detail .author .body{
    display:flex;
    flex-wrap:wrap;
	column-gap: 30px;
	padding-bottom:30px;
	width:730px;
	margin:0 auto;

}

.column-detail .author .img{
}
.column-detail .author .text{
	flex:1;
}

.column-detail .author .data{
	font-weight:bold;
	font-size:15px;
	margin-bottom:20px;
}
.column-detail .author .profile{
	font-size:13px;
}

.column-detail .author .profile hr{
	border:0;
	background:#bbb;
	height:1px;
	margin:10px 0;
}

.column-detail .author dt{
	font-weight:bold;
}
.column-detail .author dd{
	margin-bottom:10px;
}



@media only screen and (max-width: 768px) {

.column-detail .author .title{
	margin-bottom:15px;
}

.column-detail .author .body{
	display:block;
	padding-bottom:15px;
}
.column-detail .author .img{
	float:right;
	width:130px;
	margin:0 0 15px 15px;
}




}


/*
===== entry-body =====
*/

.entry-body h2{
	color:#0096c8;
	font-size:30px;
	margin-bottom:20px;
	border-bottom:3px solid #0096c8;
	padding-bottom:10px;
	margin-top:40px;
}


.entry-body h3{
	color:#fff;
	padding:5px 15px 5px 30px;
	background:#0096c8;
	border-radius: 25px;
	margin-top:40px;
	margin-bottom:20px;
	font-size:20px;

}

.entry-body .inner{
	margin-left:35px;
}

@media only screen and (max-width: 768px) {

.entry-body h2{
	font-size:24px;
}
.entry-body h3{
	font-size:18px;
}
.entry-body .inner{
	margin-left:15px;
}



}

.marker-y,
.entry-body strong{
	background:#fff99a;
	font-weight:bold;
	font-style:normal;
}
.marker-r,
.entry-body em{
	background:#f5b2aa;
	font-weight:bold;
	font-style:normal;
}

.entry-body img{
	height:auto;
}


.entry-body .tel-banner{
	text-align:center;
	margin:40px 0 50px 0;
}






/*
===== mokuji =====
*/

#toc_container{
	border:1px solid #d6d5d5;
	margin-bottom:40px!important;
	width:100%!important;
	padding:0!important;
}
#toc_container .toc_title{
	background:#e6e6e6;
	padding:10px!important;
	text-align:center;
	font-weight:bold;
	font-size:120%;
	margin:0;
}
.toc_list{
	padding:20px 40px!important;
	
}

.toc_list li{
	margin-bottom:5px!important;
}

.toc_list ul{
	margin-top:5px!important;
}

/*
.mokuji .body li ul{
	padding-left:25px;
	margin-top:5px;
}

.mokuji .body li{
	margin-bottom:5px;
}

@media only screen and (max-width: 768px) {


.mokuji .body{
	padding:15px 15px;
}

.mokuji .body li ul{
	padding-left:20px;
}
.mokuji .body li{
	margin-bottom:10px;
}


}

*/





/*
===== column-check =====
*/


.column-check{
	background:url(../img/tsukaikomi/gray-bg.jpg) ;
	background-size:12px 15px;
	padding:20px;
	margin-bottom:20px;
}
.column-check .title{
	color:#fff;
	background:#ea5404;
	border-radius: 20px;
	padding:3px 25px;
	font-weight:bold;
	font-size:20px;
	margin-bottom:5px;
	display:inline-block;

}


@media only screen and (max-width: 768px) {

.column-check{
	padding:15px;
}


.column-check .title{
	padding:3px 15px;
	font-size:18px;
}

}




.column-check dt{
	position:relative;
	padding:10px 0 10px 40px;
	font-weight:bold;
	font-size:18px;
}
.column-check dt strong{
	color:#ea5404;
	background:none!important;
}

.column-check dt:before{
	background: url(../img/home/support/check.png) center no-repeat;
	background-size:contain;
	width:29px;
	height:28px;
	content:"";
	vertical-align:middle;
	display:inline-block;
	position:absolute;
	left:0;
	top:12px;

}

.column-check dd{
	padding-left:40px;
	margin-bottom:20px;
}

@media only screen and (max-width: 768px) {

.column-check dt{
	padding:7px 0 7px 30px;
}

.column-check dt:before{
	width:20px;
	height:20px;
	margin-top:-0px;
}

}










