@charset "UTF-8";

.art { padding:20px 0; text-align: left;}
	.art h3 { display: block; padding:10px 0; font-size:18px; text-align: left; border-bottom: 1px solid #999;}
		.art h3 span { white-space: nowrap; font-size:16px; font-weight: normal;}
			.art h3 span::before { content:"（";}
			.art h3 span::after { content:"）";}
	.arttext { padding: 10px 0; font-size:16px;}
	.artphoto { padding: 0;}
		.artphoto ul { display: flex; flex-wrap: wrap; justify-content: space-between; padding:0 0 5px 0; list-style: none;}
			.artphoto ul::after { display: block; content:""; width: 32%; height: 1px; overflow: hidden;}
			.artphoto li { width:32%; box-sizing: border-box; padding:10px 0; font-size:14px; align-self: center;}
				.artphoto li a { text-decoration: none; opacity:1; }
					.artphoto li a:hover { color:#7C191E; opacity:.6; }
				.artphoto li a span { display: block; width: 100%; height:320px; margin-bottom: 5px; background: no-repeat center center; background-size: cover; opacity: 1;}
					.artphoto li a:hover span {  opacity:.6; }
	.download ul { padding:.250px 0; margin:0; list-style:none;}
		.download li { display:block; padding: 5px 0 5px 30px; font-size:14px; }
			.download li a {color:#000; text-decoration:underline;}
			.download li a:hover { color:#7C191E; text-decoration:none;}
			.download li:before { display: block; width: 30px; height:28px; content:""; margin-left:-30px; float:left; background-position: left; background-repeat: no-repeat;background-size: contain;}
			li.pdf:before { background-image:url(../images/fileicons/pdf.png); }
			li.doc:before { background-image:url(../images/fileicons/doc.png);}
			li.xls:before { background-image:url(../images/fileicons/xls.png);}
			li.txt:before { background-image:url(../images/fileicons/txt.png);}
			li.jpg:before { background-image:url(../images/fileicons/jpg.png);}
			li.ppt:before { background-image:url(../images/fileicons/ppt.png);}

	.newslist h2 { padding: 10px 0; font-size: 22px; text-align: center; }
		.newslist h2::after { display: block; content:"What's New"; text-align: center; font-size: 12px; font-weight: normal;}
	.newslist ul { width: 100%; padding: 20px 0; margin: 0 auto;}
	.newslist li { text-align:left; color:#000;}
		.newslist li a {color:#000; text-decoration: none;}
			.newslist li a:hover{ color:#7C191E; text-decoration: underline;}
		.newslist li span { display: block; width: 100%; padding: 10px 0 0 0; align-self: flex-end; font-size: 12px;}
			.newslist li span::before {content: "（";}
			.newslist li span::after {content: "）";}
	.newslist p { display: block; padding: 0; text-align: center; font-size: 16px;}
		.newslist p a { color:#000; text-decoration: none;}
		.newslist p a:hover { color:#7C191E; text-decoration: underline;}

@media all and (min-width:320px) {
	/* 320px+ settings */
	.art th { display: block; padding: 20px 10px 0 10px; }
	.art td { display: block; padding: 5px 10px 20px 10px; border-bottom: 1px solid #CCC; }
	.newslist ul { display: block;}
	.newslist li { display:block; border-bottom: 1px dashed #004747; padding: 10px 0; }
	  .newslist li:first-of-type {border-top: 1px dashed #004747; }
}

@media all and (min-width:640px) {
	/* 640px+ settings */
}

@media all and (min-width:960px) {
	/* 960px+ settings */
	.art th, .art td { display: table-cell; padding:40px 20px; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; }
	.newslist ul { display: flex;}
	.newslist li { display:flex; flex-wrap:wrap; width:20%; padding:10px 25px; border-right: 1px solid #004747; border-bottom: none;}
	  .newslist li:first-of-type {border-left: 1px solid #004747;border-top: none;}
}

@media all and (min-width:1200px) {
	/* 1200px+ settings */
}