@import "style.css";

/************************************** title start ***************************************************/
.title{
	position:relative;
}
.title:before{
	position:absolute;
	content:"";
	display:block;
	right:0;
	bottom:0;
	width:92.5%;
	height:2px;
	background:currentColor;
	margin-bottom:1.2em;
}
/************************************** title end ***************************************************/


/************************************** main start ***************************************************/
main{
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
	margin:3% 0 8%;
	font-size:1.15em;
}
main .info{
	width:26.87%;
	font-size:1.125em;
	line-height:2em;
	margin-left:7.5%;
}
main ul{
	width:49.37%;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
main ul li{
	width:46%;
	line-height:2em;
}
main ul li:nth-child(2n){
	width:50%;
}
main ul li:nth-child(n+3){
	margin-top:8%;
}
main ul li h4{
	font-size:1.25em;
}
main ul li a:hover{
	text-decoration:underline;
}
/************************************** main end ***************************************************/


@media screen and (max-width:1023px){
	
	/************************************** title start ***************************************************/
	.title:before{
		width:calc(100% - 5em);
		margin-bottom:0.8em;
	}
	/************************************** title end ***************************************************/
	
	/************************************** main start ***************************************************/
	main{
		display:block;
		margin:5% 0;
	}
	main .info{
		width:auto;
		margin-left:0;
	}
	main ul{
		margin-top:8%;
		width:auto;
		display:block;
	}
	main ul li,
	main ul li:nth-child(2n){
		width:auto;
	}
	main ul li+li{
		margin-top:8%;
	}
	/************************************** main end ***************************************************/
	
}