/* CSS Document */

.flex-box{
	display: flex;
	justify-content: space-between;
}

.flex-box > section{
	width: 50%;
}

h3{
	font-size: 1.8rem;
	font-weight: normal;
	border-bottom: 1px solid #b8b8b8;
	padding-bottom: 6px;
}

h3 span{
	font-size: 1.4rem;
}

h3 span > span.num{
	font-size: 2.4rem;
	font-style: italic;
	color: #8fc31f;
}

.casestudy-company{
	border-bottom: 1px solid #b8b8b8;
	padding: 15px;
	margin-bottom: 15px;
	font-size: 2.1rem;
}

.casestudy-company span{
	font-size: 1.4rem;
	display: block;
}

.tag{
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.tag li{
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 2px 20px;
	font-size: 1.4rem;
}

.tag li.b-tag{
	border: 1px solid #333333;
}

.tag li.r-tag{
	border: 1px solid #8fc31f;
}

.casestudy-comment{
	background: #f1f7f9;
	padding: 20px;
	margin: 30px auto 0;
}

.sliderArea {
	max-width: 100%;
	margin: 0 auto;
	padding: 0 0 0 2%;
}
.sliderArea {
	width: 50%;
	margin-top: 47px;
}

.slick-slide {
	margin: 0 5px;
	transition: all ease-in-out .3s;
}
.slick-slide img {
	width: 100%;
	height: auto;
}

.slick-prev, .slick-next {
	z-index: 1;
}

.slick-prev{
	left: 15px;
	width: 37px;
	height: 37px;
}

.slick-next{
	right: 15px;
	width: 37px;
	height: 37px;
}

.slick-prev::before{
	content: "";
	background: url("../img/casestudy-arrow01.png") no-repeat;
	width: 37px;
	height: 37px;
	display: inline-block;
}
.slick-next::before{
	content: "";
	background: url("../img/casestudy-arrow02.png") no-repeat;
	width: 37px;
	height: 37px;
	display: inline-block;
}

.slick-prev:before, .slick-next:before {
	color: #000;
}

.slick-dots > li:first-child:last-child {
	display: none;
}

.slick-dots li{
	margin: 0;
}

.slick-dots li button::before{
	font-size: 10px;
}

.slick-dots li.slick-active button::before{
	color: #079cd0;
}


.casestudy-linkarea{
	margin: 47px auto;
}

.casestudy-linkarea ul{
	display: flex;
	margin: 0 auto;
}

.casestudy-linkarea ul li{
	max-width: 270px;
	width: 24%;
	margin-right: 2%;
	margin-bottom: 2%;
}
.casestudy-linkarea ul li:last-child{
	margin-right: 0;
}

.casestudy-linkarea ul li a span{
	display: block;
	margin-top: 7px;
	line-height: 1.4;
}

.casestudy-linkarea ul li a .zoom_area{
	border: none;
}

.casestudy-linkarea ul li a span:after{
	content: "\f105";
	font-family: 'FontAwesome';
	color: #079cd0;
	display: inline-block;
	margin-left: 10px;
	font-size: 1.8rem;
	font-weight: bold;
}

@media screen and (max-width: 600px){
	.flex-box{
		display: block;
	}
	
	.flex-box > section{
		width: 100%;
	}
	
	.tag li.b-tag{
		border: 2px solid #333
	}
	.tag li.r-tag{
		border: 2px solid #8fc31f;
	}
	
	.casestudy-company{
		padding: 15px 0;
	}
	
	.sliderArea{
		width: 100%;
		padding: 0;
		margin-top: 40px;
	}
	
	.casestudy-linkarea ul{
		display: block;
	}
	
	.casestudy-linkarea ul li{
		margin: 0;
		max-width: 100%;
		width: 100%;
		border-bottom: 2px solid #b8b8b8;
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
	
	.casestudy-linkarea ul li a{
		display: flex;
		align-items: center;
	}
	
	.casestudy-linkarea ul li a .zoom_area{
		width: 40%;
		margin-right: 5%;
	}
	
	.casestudy-linkarea ul li a span{
		width: 55%;
	}
}