section.notice_list {
	width: 100%; height: auto;
	padding-top: 40px;

	display: flex;
    justify-content: center;
}


section.notice_list > div.box {
	width: 100%; height: auto;
	max-width: 1280px; padding: 0px 40px;
}


section.notice_list .notice_item:hover::before {
	content: '';
	position: absolute; top: -1px; left: 0px;
	display: inline-block; width: 100%; height: calc(100% + 1px);
	border: 1px solid #370B89;
	box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
}

section.notice_list .notice_item.no .notice_item_session,
section.notice_list .notice_item.no .notice_item_class,
section.notice_list .notice_item.no .notice_item_date { display: none; }
section.notice_list .notice_item.no .notice_item_title { width: 100%; text-align: center; }


section.notice_list .notice_item {
	width: 100%; height: auto;
	border-bottom: 1px solid #D6D6D6;
	padding: 25px 0px;
	display: flex;
	align-items: center;
	
	cursor: pointer;
}

section.notice_list .notice_item .notice_item_session {
	width: 115px; height: auto; line-height: 1.5;

	color: #808080; text-align: center;
	font-size: 20px; font-weight: 500;
}


section.notice_list .notice_item .notice_item_session::after {
	content: '';
	position: absolute; display: inline-block;
	top: 50%; right: 0px;
	width: 1px; height: 32px;
	margin-top: -16px;
	background-color: #E4E4E7;
}

section.notice_list .notice_item .notice_item_class {
	width: 125px; height: auto; line-height: 1.5;
	color: #808080; text-align: center;
	font-size: 20px; font-weight: 500;
}

section.notice_list .notice_item:hover .notice_item_title { color: #370B89; }
section.notice_list .notice_item.news .notice_item_title { width: calc(100% - 115px - 172px); }
section.notice_list .notice_item .notice_item_title {
	width: calc(100% - 115px - 125px - 172px);
	padding: 0px 35px;
	color: #000;
	font-size: 20px; font-weight: 500;
	word-break: keep-all;
}

section.notice_list .notice_item .notice_item_date {
	width: 172px; height: auto; line-height: 1.5;
	padding-right: 45px;

	color: #808080; text-align: center;
	font-size: 20px; font-weight: 500;
}





section.hub_list {
	width: 100%; height: auto;
	padding-top: 40px;

	display: flex;
    justify-content: center;
}


section.hub_list > div.box {
	width: 100%; height: auto;
	max-width: 1280px; padding: 0px 40px;

	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 30px;
}


section.hub_list .hub_item:hover::before {
	background-color: #370B89;

	opacity: 1;
}

section.hub_list .hub_item::before {
	content: '';
	position: absolute; top: 0px; left: 0px;
	display: inline-block; width: 100%; height: 100%;
	background-color: #370B8900;
	z-index: 1;

	transition: all 300ms ease-in-out;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;

	background-image: url(../images/link_arrow_next.svg);
    background-size: 30px 30px;
    background-position: calc(100% - 30px) calc(100% - 30px);
    background-repeat: no-repeat;
	opacity: 0;
	box-sizing: border-box;
}

section.hub_list .hub_item {
	width: calc(33.333% - 20px); height: auto;

	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;	
	cursor: pointer;
}

section.hub_list .hub_item .hub_item_img,
section.hub_list .hub_item .hub_item_img img {
	width: 100%; height: auto;
}

section.hub_list .hub_item:hover .hub_item_img { opacity: 0; }
section.hub_list .hub_item .hub_item_img {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.60) 60%);
	opacity: 1;
	transition: all 300ms ease-in-out;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;

}


section.hub_list .hub_item:hover .hub_item_title { 
	bottom: 70px;
}

section.hub_list .hub_item .hub_item_title {
	position: absolute; bottom: 30px; left: 0px;
	width: 100%; height: auto; max-height: 3em; line-height: 1.5;
	padding: 0px 30px;

	color: #FFF;
	font-size: 20px; font-weight: 700;

	display: -webkit-box;
	display: -ms-flexbox;
	display: box;
	overflow:hidden;
	vertical-align:top;
	text-overflow: ellipsis;
	word-break:break-all;
	-webkit-box-orient:vertical;
	-webkit-line-clamp: 2;

	opacity: 1;
	transition: all 300ms ease-in-out;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;

	z-index: 1;
}




@media (max-width: 479px){ 
	section.notice_list > div.box { padding: 0px 20px; }

	section.notice_list .notice_item { flex-wrap: wrap; padding: 15px 0px; }
	section.notice_list .notice_item .notice_item_session,
	section.notice_list .notice_item.news .notice_item_title,
	section.notice_list .notice_item .notice_item_date  { font-size: 14px; }

	section.notice_list .notice_item .notice_item_session { width: 50px; }
	section.notice_list .notice_item .notice_item_date { width: 100%; padding-right: 0px; padding-left: 65px; text-align: left; margin-top: 5px; }
	section.notice_list .notice_item.news .notice_item_title { width: calc(100% - 50px); padding: 0px 0px 0px 15px; }




	section.hub_list > div.box { padding: 0px 20px; gap: 10px; }
	section.hub_list .hub_item .hub_item_title { padding: 0px 15px; font-size: 14px; }
	section.hub_list .hub_item::before { 
		background-size: 15px 15px;
	    background-position: calc(100% - 15px) calc(100% - 15px); 
	}
	section.hub_list .hub_item { width: calc(50% - 5px); }
	section.notice_list .notice_item .notice_item_title { font-size: 14px; }

}

@media (max-width: 749px) and (min-width: 480px) { 
	section.notice_list > div.box { padding: 0px 20px; }

	section.notice_list .notice_item { flex-wrap: wrap; padding: 15px 0px; }
	section.notice_list .notice_item .notice_item_session,
	section.notice_list .notice_item.news .notice_item_title,
	section.notice_list .notice_item .notice_item_date  { font-size: 16px; }

	section.notice_list .notice_item .notice_item_session { width: 80px; }
	section.notice_list .notice_item .notice_item_date { width: 100%; padding-right: 0px; padding-left: 100px; text-align: left; margin-top: 5px;  }
	section.notice_list .notice_item.news .notice_item_title { width: calc(100% - 80px); padding: 0px 20px; }





	section.hub_list > div.box { padding: 0px 20px; gap: 20px; }
	section.hub_list .hub_item .hub_item_title { padding: 0px 20px; font-size: 16px; }
	section.hub_list .hub_item::before { 
		background-size: 20px 20px;
	    background-position: calc(100% - 20px) calc(100% - 20px); 
	}
	section.hub_list .hub_item { width: calc(50% - 10px); }
	section.notice_list .notice_item .notice_item_title { font-size: 16px; }

}

@media (max-width: 1023px) and (min-width: 750px) { 
	section.notice_list > div.box { padding: 0px 20px; }

	section.notice_list .notice_item .notice_item_session,
	section.notice_list .notice_item.news .notice_item_title,
	section.notice_list .notice_item .notice_item_date  { font-size: 16px; }

	section.notice_list .notice_item .notice_item_session { width: 80px; }
	section.notice_list .notice_item .notice_item_date { width: 100px; padding-right: 0px; }
	section.notice_list .notice_item.news .notice_item_title { width: calc(100% - 80px - 100px); padding: 0px 20px; }




	section.hub_list > div.box { padding: 0px 20px; gap: 20px; }
	section.hub_list .hub_item .hub_item_title { padding: 0px 20px; font-size: 16px; }
	section.hub_list .hub_item::before { 
		background-size: 20px 20px;
	    background-position: calc(100% - 20px) calc(100% - 20px); 
	}
	section.hub_list .hub_item { width: calc(33.333% - 13.5px); }
	section.notice_list .notice_item .notice_item_title { font-size: 16px; }

}


@media (max-width: 1279px) and (min-width: 1024px) { 
	section.notice_list > div.box { padding: 0px 20px; }
	section.hub_list > div.box { padding: 0px 20px; }
}




/*
	@media (max-width: 479px){ 

	}

	@media (max-width: 749px) and (min-width: 480px) { 

	}

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

	}


	@media (max-width: 1279px) and (min-width: 1024px) { 

	}
*/