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

/*------------------------------------------------------------------------------------------------
    feature2
--------------------------------------------------------------------------------------------------*/
.article-wrap{
	line-height: 2.5;
}

.article-wrap + .article-wrap {
	margin-top: 100px;
}

.flex-box.fb1 {
	margin-bottom: 80px
}
.flex-box.fb1 .box{
	width:48%
}

.table-wrap{
	margin-bottom: 40px
}
table.tbl-1 .cel4{
	text-align: right
}
table.tbl-1 .cel2,
table.tbl-1 .cel3{
	text-align: left
}




.image-wrap > div{
	width:calc((100% - 60px)/4)
}


.flex-box.fb2 .box{
	width:48%
}
.flex-box.fb2 .note-txt{
	padding: 0
}

.flex-box.fb2-in{
	position: relative
}
.flex-box.fb2-in img{
	width:45%
}
.flex-box.fb2-in::after{
	position: absolute;
	content:'';
	  width: 0;
	  height: 0;
	  border-style: solid;
	  border-top: 20px solid transparent;
	  border-bottom: 20px solid transparent;
	  border-left: 20px solid #0078A3;
	  border-right: 0;
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin: auto
}

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


}
@media screen and (max-width: 768px) {
	.article-wrap{
		line-height: 2;
	}

	.article-wrap + .article-wrap {
		margin-top: 10vw;
	}

	.flex-box.fb1 {
		margin-bottom: 2vw;
		flex-direction: column-reverse
	}
	.flex-box.fb1 .box{
		width:100%;
		margin-bottom: 4vw
	}

	
	.table-wrap{
		overflow-x:scroll
	}
	table.tbl-1{
		width:180vw
	}
	table.tbl-1 .cel3{
		width:90vw
	}
	
	.image-wrap > div{
		width:calc((100% - 4vw)/2)
	}

	.flex-box.fb2 .box{
		width:100%
	}
	.flex-box.fb2-in{
		margin-top: 4vw
	}

}