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


/*----------------------------------------------
↓↓↓作品事例↓↓↓
-----------------------------------------------*/

.works_culumn{
	max-width: 1240px;
	display: flex;
	flex-wrap:wrap;
	padding: 0 20px;
	margin: 0 auto;
	box-sizing: border-box;
}

.works_box{
	width: 260px;
	margin: 20px;
	position: relative;
	box-sizing: border-box;
}

.works_images{
	width: 100%;
	height:260px;
	overflow: hidden;
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	display: flex;
	justify-content:center;
	align-items:center;
}


.works_images img{
  display: block;
  width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top:0;
	object-fit: cover;
	z-index: 2;
}

.works_box p{
	margin-top: 10px;
}

.works_box .workscaption{
	margin-top: 10px;
	font-size: 90%;
	color:#666;
}

.works_detail{
	max-width: 700px;
	margin: 20px auto;
}


/*----------------------------------------------
↓↓↓会社概要↓↓↓
-----------------------------------------------*/

.company_table{
	border-bottom: dotted thin #ccc;
}


.company_table td{
	border-top: dotted thin #ccc;
	vertical-align: top;
}

.company_table td:first-child{
	width:150px;
}

.company_table td:last-child{
	width:calc(100% - 150px);
}


.achieve_table td{
	width:calc(33% - 20px);
	padding-right: 20px;
	vertical-align: top;
}


.achieve_table td:last-child{
	width:33%;
	padding-right: 0px;
}





/*----------------------------------------------
↓↓↓料金表↓↓↓
-----------------------------------------------*/

.thumb_img_box{
	width: 300px;
	margin: 0 auto;
	height:100px;
	overflow: hidden;
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	display: flex;
	justify-content:center;
	align-items:center;
}


.thumb_img_box img{
  display: block;
  width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top:0;
	object-fit: cover;
	z-index: 2;
}


.price_table{
	border-bottom: dotted thin #ccc;
}


.price_table td{
	border-top: dotted thin #ccc;
	vertical-align: top;
}

.price_table td:first-child{
	width:calc(100% - 200px);
}

.price_table td:last-child{
	width:200px;
}



/*----------------------------------------------
↓↓↓404エラー↓↓↓
-----------------------------------------------*/

.error404{
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin: 100px 0;
}









@media (max-width: 960px) {
  
/*----------------------------------------------
↓↓↓作品事例↓↓↓
-----------------------------------------------*/
	
.works_box{
	width: calc(33.33% - 40px);
}

.works_images{
	height:240px;
}
	
	
	
	
	
	
}



@media (max-width: 640px) {


/*----------------------------------------------
↓↓↓作品事例↓↓↓
-----------------------------------------------*/
	
.works_box{
	width: calc(50% - 40px);
}

.works_images{
	height:240px;
}

	


/*----------------------------------------------
↓↓↓会社概要↓↓↓
-----------------------------------------------*/

.company_table{
	border-bottom: dotted thin #ccc;
}



.company_table td:first-child{
	display: block;
	width:100%;
	padding: 15px 0 10px 0;
	border-top: dotted thin #ccc;
	margin: 0;
	line-height: 1.0em;
}

.company_table td:last-child{
	display: block;
	width:100%;
	padding: 0 0 15px 0;
	margin: 0;
	line-height: 1.0em;
	border: none;
}
	
.achieve_table td{
	width:100%;
	padding-right: 0;
}


.achieve_table td:last-child{
	width:100%;
	padding-right: 0px;
}

	
	
}