@charset "utf-8";

/* ****************************************************

staff.css
-----------------------------------
1: for PC
2: for Smartphone
-----------------------------------
3: print for PC
-----------------------------------
ex: clearfix

***************************************************** */

/*=================================

	1: PARTS for PC

================================ */

#contents.news .newsWrap,
#contents.news .h-newsListType01,
#contents.news .h-newsListType02,
#contents.news .newsWrap > .heading,
#contents .newsDetails #contentsSearch .inputField {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
}

/* newsWrap parts
================================ */
#contents.news .newsWrap {
	position: relative;
	width: 100%;
	max-width: 1100px;
	margin-top: 48px !important;
	margin-bottom: 48px !important;
	margin: 0 auto;
	border: 1px solid #dcdcdc;
	border-left: none;
	border-bottom: none;
	z-index: 0;
}
#contents.news .newsWrap .newsBlock > .heading {
	overflow: hidden;
	position: relative;
	width: 21%;
	margin-top: 0 !important;
	border: 1px solid #dcdcdc;
	border-top: none;
	background: #dcedff;
	z-index: 10;
}
#contents.news .newsWrap .newsBlock > .heading a {
	display: block;
	padding: 12px 10px 12px 30px;
	text-decoration: none;
}
#contents.news .newsWrap .newsBlock > .heading.on,
#contents.news .newsWrap .newsBlock > .heading:hover {
	background: #fcfdff;
	border-right: 1px solid #fcfdff;
	transition: background-color 0.2s linear 0s;
	-webkit-transition-property: background-color 0.2s linear 0s;
		-moz-transition-property: background-color 0.2s linear 0s;
			-o-transition-property: background-color 0.2s linear 0s;
				-ms-transition-property: background-color 0.2s linear 0s;
}
#contents.news .newsWrap .newsBlock > .heading.on a,
#contents.news .newsWrap .newsBlock > .heading:hover a {
	color: #484848;
}
#contents.news .h-newsListType01,
#contents.news .h-newsListType02 {
	display: none;
	position: absolute;
	top: 0;
	right: 0px;
	width: 79%;
	margin-top: 0 !important;
	padding: 50px 40px 20px 41px;
	border: 1px solid #dcdcdc;
	border-top: none;
	border-right: none;
	border-bottom: none;
	z-index: 1;
}
#contents .h-newsListType01 .topic,
#contents .h-newsListType02 .topic {
	margin-top: 0 !important;
}
#contents .listBtn {
	padding-left: 16px;
	background: url(/common/images/com_ic10.png) no-repeat 0 50%;
}
#contents .addBorder {
	border-bottom: 1px solid #dcdcdc !important;
}

#contents .newsDetails #contentsSearch {
	text-align: center;
}
#contents .newsDetails #contentsSearch .inputField {
	width: 392px;
	height: 42px;
	padding: 12px 10px 10px 15px;
	background: #ededed;
	border: none;
	border-radius: 0;
	color: #7b7b7b;
}
#contents .newsDetails #contentsSearch .submitBtn {
	overflow: hidden;
	width: 45px;
	height: 42px;
	background: url(/news/images/index_bg01.gif) no-repeat 0 0;
	border: none;
	border-radius: 0;
	color: #7b7b7b;
	text-indent: -9999px;
	outline: none;
	cursor: pointer;
}

#contents .h-newsListType01 {
	position: relative;
	margin-top: 10px;
}
#contents .h-newsListType01 .heading,
#contents .h-newsListType02 .heading {
	padding: 20px 3em 0 0;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
}
#contents .h-newsListType01 .topic {
	display: table;
	width: 100%;
	margin-top: 10px;
}
#contents .h-newsListType01 .topic .topicData {
	width: 9.79em;
}
#contents .h-newsListType01 .topic .topicData .date {
	display: inline-block;
	margin-top: 0;
}
#contents .h-newsListType01 .topic .topicData,
#contents .h-newsListType01 .topic .topicDetail {
	display: table-cell;
	padding: 12px 0;
	border-top: 1px solid #dddddd;
	vertical-align: top;
}
#contents .h-newsListType01 .topic:last-of-type .topicData,
#contents .h-newsListType01 .topic:last-of-type .topicDetail {
	border-bottom: 1px solid #dddddd;
}
#contents .h-newsListType01 .topic .topicData .newsType {
	background: #546e7a;
	display: inline-block;
	margin: 0 6px 0 0;
	padding: 0 12px;
	color: #ffffff;
	font-size: 12px;
	font-size: 1.2rem;
}

#contents .newsListType02 .topic .topicDetail .categoryArea {
	display: table;
}

#contents .categoryArea p[class^="categoryIcon"] {
	display: inline-block;
	margin: 0 6px 0 0;
	padding: 0 12px;
	color: #ffffff;
	font-size: 12px;
	font-size: 1.2rem;
}

.categoryIcon01 {
	background: #9a9a9a;
}
.categoryIcon02 {
	background: #b9b257;
}
.categoryIcon03 {
	background: #f19149;
}
.categoryIcon04 {
	background: #ae5da1;
}
.categoryIcon05 {
	background: #e5004f;
}
.categoryIcon06 {
	background: #ea68a2;
}
.categoryIcon07 {
	background: #80c269;
}
.categoryIcon08 {
	background: #002e73;
}
.categoryIcon09 {
	background: #0068b7;
}
.categoryIcon10 {
	background: #00a0e9;
}
.categoryIcon11 {
	background: #00d4d4;
}
.categoryIcon12 {
	background: #a6937c;
}
.categoryIcon13 {
	background: #a40035;
}
.categoryIcon14 {
	background: #f29c9f;
}
.categoryIcon15 {
	background: #009944;
}

@media only screen and (max-width: 768px) {

/*=================================

	2: PARTS for Smartphone

================================ */

/* newsWrap parts
================================ */
#contents.news .newsWrap {
	width: 104.68%;
	margin: 0 -2.34%;
	margin-top: 26px !important;
	border: none;
	border-top: 1px solid #dcdcdc;
}
#contents.news .newsWrap .newsBlock > .heading,
#contents.news .newsWrap .newsBlock > .heading:hover {
	width: 100%;
	margin: 0;
	border: 1px solid #dcdcdc;
	border-top: none;
	background: #dcedff url(/common/images/com_ic11.png) no-repeat 96% 50%;
}
#contents.news .newsWrap .newsBlock > .heading a,
#contents.news .newsWrap .newsBlock > .heading a:hover {
	display: block;
	padding: 10px 8% 8px 20px;
	color: #0b5dce;
}
#contents.news .newsWrap .newsBlock > .heading.on {
	background: #fcfdff url(/common/images/com_ic11_2.png) no-repeat 96% 50%;
	border-right: 1px solid #dcdcdc;
}
#contents.news .h-newsListType01,
#contents.news .h-newsListType02 {
	display: none;
	position: static;
	top: auto;
	right: auto;
	width: 100%;
	padding: 0 15px 20px;
	border: 1px solid #dcdcdc;
	border-top: none;
	z-index: 1;
}
#contents .h-newsListType01 .topic,
#contents .h-newsListType02 .topic {
	margin-top: 0 !important;
}
#contents .h-newsListType01 .topic:first-child .topicData,
#contents .h-newsListType02 .topic:first-child .topicData {
	border-top: none;
}
#contents .listBtn {
	background: url(/common/images/com_ic10.png) no-repeat 0 50%;
	background-size: 6px;
}

#contents .newsDetails #contentsSearch .inputField {
	width: 89%;
	height: 29px;
	padding: 8px 7px 6px 7px;
	font-size: 11px;
}
#contents .newsDetails #contentsSearch .submitBtn {
	overflow: hidden;
	width: 32px;
	height: 29px;
	background: url(/news/images/index_bg01.gif) no-repeat 0 0;
	background-size: 32px;
}
#contents .newsBlock > .h-newsListType02 .topic:first-child {
	border-top: none;
}
	
#contents .h-newsListType01 .heading,
#contents .h-newsListType02 .heading {
	padding-top: 10px;
}
#contents .h-newsListType01 .topic {
	display: block;
	padding-bottom: 5px;
}
#contents .h-newsListType01 .topic .topicData {
	width: 100%;
}
#contents .h-newsListType01 .topic .topicData .date {
	display: block;
	margin-top: 10px;
}
#contents .h-newsListType01 .topic .topicData {
	display: block;
	padding: 6px 0 0;
}
#contents .h-newsListType01 .topic .topicDetail {
	display: block;
	padding: 5px 0 0;
	border: none;
}
#contents .h-newsListType01 .topic .topicDetail .topicTitle {
	margin-top: 10px;
}

#contents .h-newsListType01 .topic:last-of-type {
	padding-bottom: 0;
}
#contents .h-newsListType01 .topic:last-of-type .topicData {
	border-bottom: none;
}
#contents .h-newsListType01 .topic:last-of-type .topicDetail {
	padding-bottom: 12px;
}

}


@media print {

/*=================================

	3: print for PC

================================ */

}


/*=================================

	clearfix

=================================*/
.characterBox .spWrap:after {
	content: "";
	display: block;
	clear: both;
}
.characterBox .spWrap {
	zoom: 1;
}