@charset "UTF-8";
/*
Author: あそびラボ
*/

/*=======================================================
MV
=======================================================*/
.bl_lower_mv_ttl::before{
	background: url(../images/expertise/mv_img01.png) top left / contain no-repeat;
	width: 82px;
	height: 82px;
	top: -8px;
	left: -42px;
}
.bl_lower_mv_ttl::after{
	background: url(../images/expertise/mv_img02.png) top right / contain no-repeat;
	width: 80px;
	height: 92px;
	top: -15px;
	right: -33px;
}
@media screen and (max-width : 750px){
	.bl_lower_mv_ttl::before{
		width: 128px;
		height: 128px;
		top: -16px;
		left: -56px;
	}
	.bl_lower_mv_ttl::after{
		width: 120px;
		height: 139px;
		top: -24px;
		right: -56px;
	}
}
/*=======================================================
記事一覧
=======================================================*/
main{
	background: #FCFBF7;
}
.bl_catLabel{
	color: #6A3BFF;
}
.bl_expPosts_list{
	width: 672px;
}
.bl_expPosts_item{
	width: 672px;
	border: 1px solid #76B9FF;
	background: #fff;
	padding: 12px;
	position: relative;
}
.bl_expPosts_item + .bl_expPosts_item{
	margin-top: 24px;
}
.bl_expPosts_item > a{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.bl_exp_imgWrapper{
	width: 192px;
}
.bl_expPosts_body{
	width: 420px;
}
.bl_expPosts_header{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: 17px;
}
.bl_expPosts_date{
	color: #525252;
	letter-spacing: 0.78px;
	font-size: 13px;
	padding-left: 20px;
	margin-right: 8px;
	position: relative;
}
.bl_expPosts_date::before{
	content: '';
	position: absolute;
	background: url(../images/expertise/icon_timeside.svg) top left / contain no-repeat;
	width: 15px;
	height: 15px;
	top: 2px;
	left: 0;
}
.bl_expPosts_header .bl_catLabel{
	letter-spacing: 0px;
	font-size: 12px;
	padding: 0 9px 3px;
	font-weight: normal;
	margin: 0 8px 0 0;
}
.bl_expPosts_ttl{
	letter-spacing: 0.72px;
	color: #222222;
	font-size: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bl_expPosts_item:hover::before {
	content: "";
	position: absolute;
	height: 0;
	display: block;
	top: -1px;
	right: -1px;
	border-top: solid 24px #fff;
	border-left: solid 24px transparent;
}
.bl_expPosts_item:hover::after {
	content: "";
	position: absolute;
	height: 0;
	display: block;
	top: -1px;
	right: -1px;
	border-bottom: solid 24px #76B9FF;
	border-right: solid 24px transparent;
}
/* サイドバーの検索フォーム */
.bl_asideSearch {
	margin-bottom: 32px;
}
.bl_asideSearch .bl_searchForm{
	display: flex;
	justify-content: flex-start;
	border: 1px solid #707070;
	border-radius: 4px;
	width: 100%;
	height: 32px;
	background: #fff;
}
.bl_asideSearch .bl_searchForm_input{
	width: 256px;
	padding-left: 10px;
	background: #fff;
}
.bl_asideSearch .bl_searchForm_submit{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 32px;
	border-radius: 0 4px 4px 0;
	background: #707070;
}
.bl_asideSearch .bl_searchForm_submit img{
	width: 16px;
	height: 16px;
}

@media screen and (max-width : 750px){
	.bl_expPosts_list{
		width: 100%;
	}
	.bl_expPosts_item{
		width: 670px;
		border: 2px solid #76B9FF;
		padding: 40px 40px 48px;
	}
	.bl_expPosts_item + .bl_expPosts_item{
		margin-top: 48px;
	}
/* 	.bl_expPosts_item > a{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	} */
	.bl_exp_imgWrapper{
		width: 590px;
		margin-bottom: 32px;
	}
	.bl_expPosts_body{
		width: 100%;
	}
	.bl_expPosts_header{
		margin-bottom: 32px;
	}
	.bl_expPosts_date{
		letter-spacing: 1.32px;
		font-size: 22px;
		padding-left: 40px;
		margin-right: 32px;
	}
	.bl_expPosts_date::before{
		width: 32px;
		height: 32px;
		top: 0px;
	}
	.bl_expPosts_header .bl_catLabel{
		letter-spacing: 0.88px;
		font-size: 22px;
		padding: 0 16px 3px;
		line-height: 1.45;
		margin: 0 8px 0 0;
	}
	.bl_expPosts_ttl{
		letter-spacing: 1.68px;
		font-size: 28px;
		-webkit-line-clamp: 3;
	}
	.bl_expPosts_item:hover::before {
		top: -2px;
		right: -2px;
		border-top: solid 48px #fff;
		border-left: solid 48px transparent;
	}
	.bl_expPosts_item:hover::after {
		top: -2px;
		right: -2px;
		border-bottom: solid 48px #76B9FF;
		border-right: solid 48px transparent;
	}

	/* サイドバーの検索フォーム */
	.bl_asideSearch .bl_searchForm{
		height: 82px;
		border-radius: 8px;
	}
	.bl_asideSearch ::placeholder{
		font-size: 34px;
	}
	.bl_asideSearch .bl_searchForm_input{
		width: 553px;
		height: 82px;
		border-radius: 8px 0 0 8px;
		border: 4px solid #707070;
		padding-left: 32px;
		font-size: 32px!important;
	}
	.bl_asideSearch .bl_searchForm_submit{
		width: 120px;
		height: 82px;
		border-radius: 0 8px 8px 0;
	}
	.bl_asideSearch .bl_searchForm_submit img{
		width: 48px;
		height: 48px;
	}
}



/**Mac,iPad Safari**/
@media only screen and (min-device-width:768px){
	_::-webkit-full-page-media, _:future, :root {

	}
}