@charset "utf-8";

/* contents menu */
.contents .inner .contentsMenu .menuicon.selected::before {
	content: '';
	display: block;
	position: absolute;
	width: 16px;
	height: 20px;
	top: 14px;
	left: -24px;
	background: url("../images/common/icon_arrow.png") no-repeat top center;
}

/* contents area */
/* -> dc/lens */
.contents .inner .contentsleft .contentsArea .yeartab {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	width: 100%;
	height: 50px;
	border-bottom: solid 2px #00040c;
	padding: 0 105px;
}
.contents .inner .contentsleft .contentsArea .yeartab .year {
	display: block;
	width: 240px;
	height: 48px;
	font-size: 20px;
	color: #00040c;
	text-align: center;
	line-height: 48px;
	background-color: #fff;
	cursor: pointer;
}
.contents .inner .contentsleft .contentsArea .yeartab .year.selected {
	color: #fff;
	background-color: #00040c;
	cursor: auto;
}
.contents .inner .contentsleft .contentsArea .yeartab .year:hover {
	color: #fff;
	background-color: #00040c;
}
.contents .inner .contentsleft .contentsArea .description {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-top: 30px;
}
.contents .inner .contentsleft .contentsArea .description .txt {
	width: 630px;
	padding-left: 100px;
}
.contents .inner .contentsleft .contentsArea .description a {display: block; box-sizing: border-box;}
.contents .inner .contentsleft .contentsArea .description a:hover {background-color: #ccc;}
.contents .inner .contentsleft .contentsArea .description .makers {width: 566px;}
.contents .inner .contentsleft .contentsArea .pdfbox {
	position: relative;
	height: 50px;
	line-height: 48px;
	background-color: #fff;
	border: solid 1px #00040c;
	padding: 0 0 0 50px;
}
.contents .inner .contentsleft .contentsArea .pdfbox::before {
	content: '';
	display: block;
	position: absolute;
	width: 32px;
	height: 32px;
	top: 8px;
	left: 8px;
	background: url("../images/common/pdf_icon.png") no-repeat top center;
}
.contents .inner .contentsleft .contentsArea .movie {
	position: relative;
	height: 80px;
	line-height: 32px;
	background-color: #fff;
	border: solid 1px #00040c;
	padding: 0 0 0 50px;
}
.contents .inner .contentsleft .contentsArea .movie::before {
	content: '';
	display: block;
	position: absolute;
	width: 16px;
	height: 16px;
	top: 16px;
	left: 16px;
	background: url("../images/common/mov_icon.png") no-repeat top center;
}
.contents .inner .contentsleft .contentsArea .montharea {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	width: 1200px;
	margin-top: 30px;
}
.contents .inner .contentsleft .contentsArea .montharea a {display: block; box-sizing: border-box;}
.contents .inner .contentsleft .contentsArea .montharea a:hover {background-color: #ccc;}
.contents .inner .contentsleft .contentsArea .montharea div {width: 190px;}
.contents .inner .contentsleft .contentsArea .montharea .month {
	width: 190px;
	margin-bottom: 10px;
}
.contents .inner .contentsleft .contentsArea .montharea .monthsum {
	width: 240px;
	margin-bottom: 10px;
}
.contents .inner .contentsleft .contentsArea .attention {margin-top: 30px;}

/* -> report */
.contents .inner .contentsleft .contentsArea .items {}
.contents .inner .contentsleft .contentsArea .items a {display: block; box-sizing: border-box;}
.contents .inner .contentsleft .contentsArea .items a:hover {background-color: #ccc;}
.contents .inner .contentsleft .contentsArea .items .item {width: 720px; margin: 12px 0;}
.contents .inner .contentsleft .contentsArea .items .thumb {
	display: flex;
	width: 720px;
	height: 96px;
	margin: 12px 0;
}
.contents .inner .contentsleft .contentsArea .items .thumb .movThumb {width: 160px; margin: 12px 12px 0 0;}

/* -> history */
.contents .inner .contentsleft .contentsArea .yearbtns {
	display: flex;
	flex-flow: row wrap;
	width: 1252px;
	margin: 0 auto;
	padding: 20px;
	border: solid 1px #ccc;
}
.contents .inner .contentsleft .contentsArea .yearbtns .yearbtn {
	margin: 8px;
	padding: 8px;
	border: solid 1px #ccc;
}
.contents .inner .contentsleft .contentsArea h2 {border-bottom: solid 1px #666;}

.update_list {list-style: none;}
.update_list .date {display: block;}

/* ---------- @media settings ---------- */
@media only screen and (max-width: 1600px) {

/* contents area */
/* -> dc/lens */
.contents .inner .contentsleft .contentsArea .yeartab {padding: 0 55px;}
.contents .inner .contentsleft .contentsArea .yeartab .year {width: 160px;}
.contents .inner .contentsleft .contentsArea .montharea {
	width: 900px;
	margin-top: 30px;
}
.contents .inner .contentsleft .contentsArea .montharea .sp {display: none;}
.contents .inner .contentsleft .contentsArea .description .txt {
	width: 500px;
	padding-left: 20px;
}
.contents .inner .contentsleft .contentsArea .description .makers {width: 566px;}
	
/* -> history */
.contents .inner .contentsleft .contentsArea .yearbtns {width: 952px;}

} /* ---@media max1600--- */

@media only screen and (max-width: 1299px) {

.contents .inner .contentsleft .contentsArea .yeartab .year {font-size: 14px;}
.contents .inner .contentsleft .contentsArea .movie {height: 50px;}

/* -> report */
.contents .inner .contentsleft .contentsArea .items .thumb {height: 108px;}

} /* ---@media max1299--- */

@media only screen and (max-width: 1024px) {

/* contents area */
/* -> dc/lens */
.contents .inner .contentsleft .contentsArea .yeartab {
	width: 100%;
	height: 8.4vw;
	padding: 0 4vw;
}
.contents .inner .contentsleft .contentsArea .yeartab .year {
	width: 20vw;
	height: 8vw;
	font-size: 3.6vw;
	line-height: 8vw;
}
.contents .inner .contentsleft .contentsArea .yeartab .year.selected {
	color: #fff;
	background-color: #00040c;
	cursor: auto;
}
.contents .inner .contentsleft .contentsArea .yeartab .year:hover {
	color: #00040c;
	background-color: #fff;
}
.contents .inner .contentsleft .contentsArea .description {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-top: 2vw;
}
.contents .inner .contentsleft .contentsArea .description .txt {
	width: 100%;
	margin-bottom: 2vw;
	padding-left: 0;
}
.contents .inner .contentsleft .contentsArea .description .makers {width: 100vw;}
.contents .inner .contentsleft .contentsArea .pdfbox {
	height: 8vw;
	line-height: 8vw;
	padding: 0 0 0 10vw;
}
.contents .inner .contentsleft .contentsArea .pdfbox::before {
	width: 6vw;
	height: 6vw;
	top: 1vw;
	left: 1vw;
	background: url("../images/common/pdf_icon.png") no-repeat top center;
	background-size: cover;
}
.contents .inner .contentsleft .contentsArea .movie {
	height: 12vw;
	line-height: 1.2;
	padding: 1vw 0 0 10vw;
}
.contents .inner .contentsleft .contentsArea .movie::before {
	width: 4vw;
	height: 4vw;
	top: 1vw;
	left: 1vw;
	background: url("../images/common/mov_icon.png") no-repeat top center;
	background-size: cover;
}
.contents .inner .contentsleft .contentsArea .montharea {
	justify-content: center;
	width: 92vw;
	margin: 4vw auto;
}
.contents .inner .contentsleft .contentsArea .montharea div {width: 55vw;}
.contents .inner .contentsleft .contentsArea .montharea .month {
	width: 55vw;
	margin-bottom: 2vw;
}
.contents .inner .contentsleft .contentsArea .montharea .monthsum {
	width: 55vw;
	margin-bottom: 2vw;
}
.contents .inner .contentsleft .contentsArea .attention {margin-top: 4vw;}

/* -> report */
.contents .inner .contentsleft .contentsArea .items .item {width: 90vw; margin: 2vw 0;}
.contents .inner .contentsleft .contentsArea .items .item.pdfbox {
	height: 10vw;
	line-height: 1.2;
	padding: 1.5vw 0 0 10vw;
}
.contents .inner .contentsleft .contentsArea .items .thumb {
	width: 86vw;
	height: 16vw;
	margin: 2vw 2vw;
}
.contents .inner .contentsleft .contentsArea .items .thumb .movThumb {margin: 2vw 2vw 0 0;}

/* -> history */
.contents .inner .contentsleft .contentsArea .yearbtns {
	width: 92vw;
	margin: 0 auto;
	padding: 2vw;
}
.contents .inner .contentsleft .contentsArea .yearbtns .yearbtn {
	margin: 1vw;
	padding: 1vw;
}

} /* ---@media max1024--- */
