@charset "utf-8";

/*
link
リンク集
*/

/* #Sec01
-----------------------------------------------------------------*/
.link #Sec01{
}
.link .inner{
	max-width: 960px;
	margin: 0 auto;
	padding: 0 80px;
}
.link h2.ttl{
	margin-top: 40px;
}
.link .link_box{
}

.link .link_box ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 60px;
}

.link .link_box ul li{
	max-width: 222px;
	background: #949494;
	text-align: center;
	height: 48px;
	line-height: 1.5;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.link .link_box ul li a{
	color: #fff;
	display: block;
	width: 222px;
	height: 48px;
	line-height: 48px;
}

.link .link_ttl{
	background: #BEBECB;
	height: 72px;
	line-height: 72px;
	font-size: 2.0rem;
	margin-top: 50px;
	margin-bottom: 50px;
}

.link .link_area{
	display: flex;
	margin-top: 30px;
	flex-wrap: wrap;
	justify-content: space-between;
}
.link .link_area:after{
	content: "";
	width: 30%;
	max-width: 289px;
}
.link .link_area .link{
	width: 30%;
	max-width: 289px;
	display: block;
}

.link .link_area .link a{
	width: 100%;
	height: 224px;
	vertical-align: middle;
	border: 5px solid #000033;
	margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.link .link_area .link:nth-of-type(3n){
	margin-right: 0px;
}

.link .link_list:nth-of-type(2) .link:nth-of-type(even) a,
.link .link_list:nth-of-type(4) .link:nth-of-type(even) a{
	background: #E4E4E4;
}

.link .link_list:nth-of-type(3) .link:nth-of-type(odd) a,
.link .link_list:nth-of-type(5) .link:nth-of-type(odd) a{
	background: #E4E4E4;
}

.link .link_area .link {
	text-align: center;
}

.link .link_area .link h4{
	font-size: 2.4rem;
}

.link .link_area .link p{
	font-size: 1.6rem;
	margin: 0 20px;
}

@media screen and (max-width: 1050px) {
/* 1020pxまでの幅の場合に適応される */
.link .link_box ul li{
	max-width: 49%;
	width: 49%;
	margin-bottom: 10px;
}

.link .link_box ul li a{
	max-width: 100%;
	width: 100%;
}

/* 1020pxまでの幅の場合に適応される */
}

@media screen and (max-width: 767px) {
/* 767pxまでの幅の場合に適応される */

/* #Sec01
-----------------------------------------------------------------*/
.link #Sec01{
}
.link .inner{
	max-width: 100%;
	padding: 0 50px;
}

.link .link_box{
    justify-content: center;
    display: flex;
}

.link .link_box ul{
	display: block;
	width: 100%;
}

.link .link_box ul li{
	margin-bottom: 10px;
	width: 100%;
	max-width: 100%;
}

.link .link_ttl{
	height: auto;
	line-height: 24px;
	padding: 10px 0;
}

.link .link_area .link{
	max-width: 100%;
	width: 100%;
	margin-right: 0px;
	word-break: break-all;
}


/* 767pxまでの幅の場合に適応される */
}

@media screen and (max-width: 640px) {
/* 640pxまでの幅の場合に適応される */


/* 640pxまでの幅の場合に適応される */
}