@charset "utf-8";

/* -----------------------------------------------------------------------------

	カテゴリートップ

----------------------------------------------------------------------------- */
.categoryTop.technology .mv:before {
	background-image: url(../technology/img/bg_mv.jpg);
}
.categoryTop h3.ttl01 {
	font-size: 220%;
	position: relative;
	padding: 9px 10px 9px 12px;
	margin-bottom: 30px;
}
.categoryTop h3.ttl01 span {
	border-left: 5px solid #009de4;
	display: block;
	padding: 4px 0 0 10px;
	line-height: 1;
}
.categoryTop h3.ttl01:before {
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	background: #ccc;
	bottom: 0;
	left: 0;
}
.categoryTop h3.ttl01:after {
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	background: #ccc;
	top: 0;
	left: 0;
}
.categoryTop main ul.large li div p span {
	padding: 0 120px;
}
.categoryTop main ul li div p span {
	padding: 0 10px;
}
.categoryTop section.newsContent article {
	clear: both;
}
.categoryTop section.newsContent .btn {
	width: 140px;
	margin: 0 auto 25px;
	text-align: center;
	float: right;
}
.categoryTop section.newsContent .btn a {
	display: block;
	width: 100%;
	height: 36px;
	padding: 0;
	background: #e6e6e6 url(/c/common/img/icon_arrow02.png) no-repeat 90% center;
	color: #666;
	border-radius: 2px;
}
div.decoration {
	display: block;
	width: 80%;
	margin-bottom: 20px;
	padding: 15px 25px;
	background: #e5f5fc;
	border: 2px solid #009ce7;
}
div.decoration dt,
div.decoration dd,
div.decoration p {
	color: #009ce7;
}
div.decoration dd {
	font-size: 100%;
}
div.decoration dt {
	font-size: 140%;
	font-weight: bold;
}
div.decoration p {
	margin-bottom: 0;
}
/* -----------------------------------------------------------------------------

技術韓発本部長のあいさつ

----------------------------------------------------------------------------- */
.message .mv {
	position: relative;
}
.message .mv span {
	position: absolute;
	top: 120px;
	left: 18px;
	color: #fff;
	font-size: 120%;
}
.message div.detail {
	display: block;
	margin-bottom: 30px;
	overflow: hidden;
}
.message div.detail img {
	float: left;
	width: 250px;
	margin-right: 20px;
}
.message div.detail p {

}
.message p {
	margin-bottom: 30px;
}
.technology.massege div:nth-child(2n) {
	margin-bottom: 60px;
}

/* -----------------------------------------------------------------------------

方針

----------------------------------------------------------------------------- */
.policy p {
	margin-bottom: 20px;
}
.policy p.image img {
	display: block;
	margin: 0 auto 40px;
}
.policy p.image a {
	display: block;
}
.policy p.image a:hover {
	opacity: 0.7;
}
.policy p.btn {
	margin-top: 10px;
}
.policy p.btn a {
	font-size: 100%;
	color: #333;
	padding-left: 30px;
	text-decoration: none;
	background: url(/c/common/img/icon_pdf.png) 5px 2px no-repeat;
}
.policy p.btn a span {
	background: #009ce7;
	color: #fff;
	font-size: 90%;
	font-weight: normal;
	padding: 2px 6px 1px 7px;
	border-radius: 3px;
	margin-left: 10px;
}

/* -----------------------------------------------------------------------------

体制

----------------------------------------------------------------------------- */
.system div.description p {
	margin-bottom: 10px;
}
.system h3 {
	clear: both;
}
.system p.image {
	float: left;
	margin-right: 30px;
}
.system p {
	margin-bottom: 30px;
}
/* -----------------------------------------------------------------------------

	コア技術・注力分野　共通

----------------------------------------------------------------------------- */
h3.title{
	margin-bottom: 40px;
	text-align: center;
	color: #009ce7;
	font-size: 220%;
	line-height: 1.6;
	font-weight: normal;
}
.core p {
	margin-bottom: 40px;
	line-height: 2;
}
.infrastructureBox {
	display: inline-block;
	position: relative;
	width: 627px;
	border: 2px solid #e6e6e6;
	margin: 40px 0 89px;
	padding: 50px 40px 40px;
}
.infrastructureBox:before {
	position: absolute;
	bottom: -37px;
	left: 329px;
	content: "";
	width: 52px;
	height: 35px;
	background-color: #e6e6e6;
}
.infrastructureBox:after {
	position: absolute;
	bottom: -112px;
	left: 313px;
	content: "";
	border: 42px solid transparent;
	border-top: 33px solid #e6e6e6;
}
.infrastructureBox h4,
.sub .coreBox h4 {
	position: absolute;
	top: -21px;
	left: 260px;
	width: 180px;
	padding: 5px 0 3px;
	font-weight: normal;
	font-size: 200%;
	color: #fff;
	text-align: center;
	border-radius: 5px;
}
.infrastructureBox h4.ttl01 {
	background: #009ce7;
}
.infrastructureBox p {
	float: left;
	text-align: center;
	width: 287px;
	padding: 5px 0;
	color: #009de4;
	border-radius: 5px;
	background: #e5f5fc;
}
.infrastructureBox p:nth-child(3) {
	float: right;
}
.infrastructureBox p:nth-child(4) {
	clear: both;
	text-align: center;
	margin: 0 auto;
	float: none;
}
.coreBox {
	display: inline-block;
	position: relative;
	margin-bottom: 89px;
	padding: 50px 28px 40px;
	border: 2px solid #e6e6e6;
}
.coreBox h4.ttl02 {
	background: #fbb03b;
	overflow: inherit;
}
.coreBox ul li {
	position: relative;
	float: left;
	width: 149px;
	margin: 0 18px 10px 0;
}
.coreBox ul li:nth-child(4n) {
	margin-right: 0;
}
.coreBox ul li a {
	display: block;
	text-align: center;
	color: #333;
}
.coreBox > ul > li > a {
	text-decoration: none;
}
.coreBox ul li a:hover,
.coreBox ul li a:hover span {
	opacity: 1;
	text-decoration: none;
}
.coreBox ul li .tooltip,
.tabBox dd ul li .tooltip {
	display: none;
	position: absolute;
	width: 500px;
	margin-top: -10px;
	z-index: 100;
	border: 2px solid #009fe8;
	background-color: #e5f5fc;
}
.coreBox ul li .tooltip {
	top: 120%;
}
.tabBox dd ul li .tooltip {
	top: 103%;
}
.coreBox ul li .tooltip:after,
.tabBox dd ul li .tooltip:after {
	content: ' ';
	width:0;
	height: 0;
	position:absolute;
	border: 18px solid transparent;
	border-bottom: 21px solid #009fe8;
	bottom:100%;
}
.coreBox ul li .tooltip,
.tabBox dd ul li .tooltip {
	padding: 20px 20px;
}
.coreBox ul li .tooltip img,
.tabBox dd ul li .tooltip img {
	float: left;
	width: 149px;
	margin: 0 15px 0 0;
}
.coreBox ul li .tooltip span {
	color: #009fe8;
	font-size: 110%;
	margin-bottom: 15px;
	overflow: hidden;
}
.coreBox ul li .tooltip p {
	font-size: 100%;
	line-height: 2;
	overflow: hidden;
}
.coreBox ul li:nth-child(4n-3) .tooltip,
.tabBox dd ul li:nth-child(4n-3) .tooltip {
	left: 0;
}
.coreBox ul li:nth-child(4n-3) .tooltip:after,
.tabBox dd ul li:nth-child(4n-3) .tooltip:after {
		left:50px;
	}
.coreBox ul li:nth-child(4n-2) .tooltip,
.tabBox dd ul li:nth-child(4n-2) .tooltip {
	left: -162px;
}
.coreBox ul li:nth-child(4n-2) .tooltip:after,
.tabBox dd ul li:nth-child(4n-2) .tooltip:after {
		left: 200px;
	}
.coreBox ul li:nth-child(4n-1) .tooltip,
.tabBox dd ul li:nth-child(4n-1) .tooltip {
	right: -162px;
}
.coreBox ul li:nth-child(4n-1) .tooltip:after,
.tabBox dd ul li:nth-child(4n-1) .tooltip:after {
		right: 200px;
	}
.coreBox ul li:nth-child(4n) .tooltip,
.tabBox dd ul li:nth-child(4n) .tooltip {
	right: 0;
}
.coreBox ul li:nth-child(4n) .tooltip:after,
.tabBox dd ul li:nth-child(4n) .tooltip:after {
		right: 50px;
	}
.coreBox ul li:hover .tooltip,
.tabBox dd ul li:hover .tooltip {
	display: block;
}

/* -----------------------------------------------------------------------------
	タブ
----------------------------------------------------------------------------- */
.technology .tab {
	border-top: 1px solid #009de4;
	border-bottom: 1px solid #009de4;
	display: block;
	margin: 0 0 25px;
	width: 100%;
}
.technology .tab li {
	display: inline-table;
	float: left;
	width: 50%;
	position: relative;
	text-align: center;
	color: #009de4;
	line-height: 75px;
	font-size: 160%;
	border-right: 1px solid #009de4;
	background: url(/c/common/img/icon_arrow_down01.png) no-repeat center 64px;
}
.technology .tab li:first-child {
	border-left: 1px solid #009de4;
	width: 352px;
}
.tab li:hover,
.tab li.active {
	background: #009de4;
	color: #fff;
	cursor: pointer;
}
.technology .tab li.active:after {
	content: "";
	display: block;
	width: 22px;
	height: 9px;
	background: url(/c/common/img/bg_tab_arrow01.png) no-repeat;
	position: absolute;
	top: 100%;
	left: 50%;
	margin: 0 0 0 -11px;
}
.technology .tab li:hover,
.technology .tab li.active {
	color: #fff;
	background: #009ce7;
}

.technology .tab li span {
	display: table-cell;
	height: 75px;
	text-align: center;
	vertical-align: middle;
	font-size: 110%;
}

.sub main > p > a {
	font-size: 110%;
	display: inline-block;
	padding: 8px 30px 5px 15px;
	text-decoration: none;
	color: #fff;
	background: #b3b3b3 url(/c/common/img/icon_arrow_anchor.png) 180px center no-repeat;
}
.sub main > p > a:hover {
	opacity: 0.8;
}
/* tabBox */
.technology .tabBox {
	display: none;
	margin-bottom: 50px;
}
.technology .tabBox:nth-of-type(1) {
	display: block;
}
.technology .tabBox p span > span {
	display: inline-block;
	font-size: 70%;
	border: none;
}
.tabBox .central dd ul li .tooltip > div {
	display: inline-block;
	font-size: 70%;
	color: #fff;
	background: #009fe8;
	padding: 1px 4px;
	margin-bottom: 8px;
}
.tabBox dd ul li .tooltip > span {
	font-size: 80%;
	color: #009ce7;
	display: block;
}
.tabBox .central dd ul li .tooltip p {
	font-size: 70%;
	overflow: hidden;
	margin-bottom: 0;
}
.tabBox .central dd ul li .tooltip p b {
	display: inline-block;
	font-size: 80%;
	color: #009fe8;
	border: 1px solid #009fe8;
	padding: 1px 4px;
	margin-top: 10px;
}
.tabBox .central dd ul li .tooltip p a {
	position: relative;
	font-size: 90%;
}
.tabBox .central dd ul li .tooltip p a:after {
	display: inline-block;
	width: 15px;
	padding: 10px 0;
	content: "";
	background: url(/c/common/img/icon_arrow05.png) no-repeat 8px 12px;
}
.tabBox .central dd ul li .tooltip p span {
	display: block;
	font-size: 90%;
}
.technology .central {
	border-bottom: 1px solid #ccc;
	margin: 0 0 20px;
	padding: 25px;
	border: 2px solid #009ce7;
}
.technology .central dl dt p {
	margin-bottom: 10px;
	font-size: 130%;
	color: #009ce7;
}
.technology .central dl dt ul {
	overflow: hidden;
	margin-bottom: 25px;
}
.technology .central dl dt ul li {
	display: inline-block;
	margin: 0 5px 10px 0;;
	text-decoration: none;
	padding: 6px 10px 3px 26px;
	font-size: 90%;
	background: #e6e6e6 url(/c/common/img/icon_arrow06.png) no-repeat 8% center;
	color: #333;
	cursor: pointer;
}
.technology .central dl dt ul li.ac {
	color: #fff;
	background: #009ce7 url(/c/common/img/icon_arrow06.png) no-repeat 8% center;
}
.technology .central dl dd ul li {
	position: relative;
	float: left;
	width: 149px;
	margin: 0 18px 20px 0;
}
.technology .central dl dd ul {
	margin-right: -12px;
}
.technology .central dl dd ul li {
	position: relative;
	float: left;
	width: 149px;
	margin: 0 18px 10px 0;
}
.technology .central dl dd ul li.show {
	display: block !important;
}
.technology .central dl dd ul li a {
	display: block;
	text-align: left;
	color: #333;
	font-size: 70%;
}
.technology .central dl dd ul li a:hover,
.technology .central dl dd ul li a:hover span {
	opacity: 1;
	text-decoration: none;
}
.technology .central dl dd ul li a span:after  {
	display: inline-block;
	width: 15px;
	padding: 10px 0;
	content: "";
	background: url(/c/common/img/icon_arrow05.png) no-repeat 8px 12px;
}
.technology .central > dl > dd > ul > li > a {
	text-decoration: none;
}
.technology .central > dl > dd > ul > li > a span:after {
	background: none;
}
.technology p.contact {
	display: block;
	margin: 50px auto 0;
	text-align: center;
}
.technology p.contact a {
	position: relative;
	display: inline-block;
	padding: 15px 34px 15px;
	border-radius: 3px;
	color: #fff;
	background: #009ce7 url(/c/common/img/icon_arrow01.png) no-repeat 96% center;
}
.technology p.contact a:before {
	position: absolute;
	top: 10px;
	left: 0;
	width: 21px;
	height: 17px;
	content: "";
	font-size: 60%;
	margin-left: 50px;
}
.technology p.contact a span {
	padding-left: 30px;
	background: url(/c/common/img/icon_contact01.png) no-repeat 0 center;
}
.technology p.contact a span.text {
	font-size: 150%;
	padding-left: 30px;
}
/* -----------------------------------------------------------------------------

イチオシ技術

----------------------------------------------------------------------------- */
.focus .mv {
	position: relative;
}
.focus .mv p {
	position: absolute;
	top: 122px;
	left: 32px;
	color: #fff;
	font-size: 300%;
	line-height: 0.8;
}
.focus .mv p span {
	font-size: 45%;
}
.focus p {
	margin-bottom: 20px;
}
div.technologyBox {
	font-size: 100%;
	border: 2px solid #009ce7;
	overflow: hidden;
	margin-bottom: 30px;
	padding: 5px 20px 20px;
	position: relative;
}
div.technologyBox img {
	float: left;
	margin: 40px 20px 0 -8px;
}
div.technologyBox span.category {
	position: absolute;
	top: 0px;
	left: 0px;
	display: inline-block;
	width: 240px;
	padding: 2px;
	text-align: center;
	font-size: 150%;
	font-weight: bold;
	background: #ccc;
}
div.technologyBox p {
	display: block;
	overflow: hidden;
}
div.technologyBox p.title {
	font-size: 160%;
	font-weight: bold;
	line-height: 1.8;
	margin: 0;
}
div.technologyBox p.btn {
	float: right;
	margin: 20px 0 0;
}
div.technologyBox p.btn + p.btn {
	margin: 20px 10px 0 0;
}
div.technologyBox p.btn a {
	width: 100px;
	font-size: 100%;
	color: #333;
	text-decoration: none;
}
div.technologyBox p.btn a span {
	background: #009ce7;
	color: #fff;
	font-size: 90%;
	font-weight: normal;
	padding: 2px 6px 1px 7px;
	border-radius: 3px;
}
div.technologyBox p.btn.link a span {
	background: #fff;
	border: 1px solid #009ce7;
	padding: 1px 6px 0px 7px;
	color: #009ce7;
}
/* -----------------------------------------------------------------------------

综合研究所

----------------------------------------------------------------------------- */
.rdCenter p,
.rdCenter ol,
.rdCenter ul {
	margin-bottom: 15px;
}
.rdCenter ul {
	width: 100%;
}
.rdCenter ol li {
	margin-bottom: 10px;
}
.rdCenter ol li:last-child {
	margin-bottom: 0;
}
.rdCenter ul.genealogy li {
	width: 100%;
	padding: 10px 0;
	border-bottom: 1px dotted #ccc;
}
.rdCenter ul.genealogy li span {
	display: block;
	float: left;
	width: 100px;
}
.rdCenter ul.genealogy li div {
	margin-left: 100px;
}
.rdCenter p.decoration {
	display: block;
	width: 26%;
	margin-bottom: 20px;
	padding: 15px 25px;
	color: #009ce7;
	background: #e5f5fc;
	border: 2px solid #009ce7;
}
.rdCenter table td {
	padding-right: 0;
}
.rdCenter table td dt {
	color: #009de4;
	margin-bottom: 6px;
	font-size: 100%;
}
.rdCenter table td dd + dt {
	margin-top: 20px;
}
.rdCenter table td dd {
	font-size: 100%;
}
p.print {
	display: block;
	float: right;
}
p.print a {
	display: block;
	padding: 2px 20px 2px 33px;
	height: 36px;
	line-height: 36px;
	color: #666;
	background: #e6e6e6 url(/c/common/img/icon_pdf.png) 10px 12px no-repeat;
	border-radius: 2px;
	text-decoration: none;
}
.rdCenter #map_canvas1,
.rdCenter #map_canvas2 {
	width: 100%;
	height: 240px;
	margin: 20px 0 30px;
}
.rdCenter dl {
	display: table;
	margin-bottom: 20px;
	text-align: left;
	width: 50%;
}
.rdCenter dl.train {
	float: left;
}
.rdCenter dl.car {
	float: right;
}
.rdCenter .map {
	text-align: center;
}
.rdCenter h4 {
	margin-bottom: 15px;
	font-size: 200%;
}


/* -----------------------------------------------------------------------------

研究・技術開発関連ニュース

----------------------------------------------------------------------------- */
.newsContent + .newsContent {
	padding-top: 0;
}
.newsContent h2 {
	margin: -15px 0 0;
}
.newsContent article {
	border-bottom: 1px dotted #cdcdcd;
	line-height: 1.3;
}
.newsContent article div {
	display: block;
	padding: 20px 0;
	overflow: hidden;
}
.newsContent h3 + article {
	margin-top: -20px;
}
.newsContent article a {
	display: block;
}
.newsContent article a:hover {
	background: #f7f7f7;
	opacity: 1;
}
.newsContent article time {
	float: left;
	width: 115px;
	font-size: 120%;
	padding: 2px 0 0;
	color: #009de4;
	letter-spacing: 1px;
}
.newsContent article .icon {
	float: left;
	width: 80px;
	height: 20px;
	line-height: 20px;
	background: #ccc;
	color: #fff;
	font-size: 120%;
	text-align: center;
	margin: 0 18px 0 0;
}
.newsContent article h4 {
	float: right;
	width: 87%;
	padding: 2px 0 0;
	font-size: 140%;
	font-weight: normal;
}
.newsContent article h4 a {
	text-decoration: underline;
	color: #333;
}
.newsContent article h4 a:hover {
	text-decoration: none;
	background: #fff;
}
.newsContent article h4 a.blank {
	display: inline-block;
	padding-right: 15px;
	background: url(/c/common/img/icon_blank.png) no-repeat center right;
}
.newsContent.lower article h4 {
	width: 82%;
}
.newsContent article a h4 {
	color: #333;
	text-decoration: underline;
}
.newsContent article a:hover h4 {
	text-decoration: none;
}
.newsContent .btn {
	width: 140px;
	margin: 25px auto 0;
	text-align: center;
}
.newsContent .btn a {
	display: block;
	width: 100%;
	height: 36px;
	line-height: 36px;
	background: #e6e6e6 url(/c/common/img/icon_arrow02.png) no-repeat 120px center;
	color: #666;
	border-radius: 2px;
}
/* boxPagenation */
.boxPagenation {
	margin: 40px auto 0;
	overflow: hidden;
	text-align: center;
}
.boxPagenation li {
	display: inline-block;
	vertical-align: top;
	margin-left: 10px;
	text-align: center;
	width: 28px;
	height: 28px;
	border: 1px solid #d7d7d7;
}
.boxPagenation li:first-child {
	margin-left: 0;
}
.boxPagenation li a {
	display: block;
}
.boxPagenation li a,
.boxPagenation .current {
	line-height: 2.2;
	text-decoration: none;
}
.boxPagenation li a:hover,
.boxPagenation .current {
	color: #fff;
	background: #009ce7;
}
.boxPagenation .prev,
.boxPagenation .next {
	border: none;
	color: #fff;
	text-indent: 305px;
}
.boxPagenation .prev a {
	position: relative;
	display: block;
	width: 30px;
	height: 30px;
	padding: 0;
	background: #e6e6e6;
}
.boxPagenation .prev a:after {
	position: absolute;
	top: 10px;
	left: 11px;
	width: 8px;
	height: 10px;
	content:"";
	background: url(/c/common/img/icon_arrow09.png) no-repeat;
	background-size: 8px 10px;
}
.boxPagenation .next a {
	position: relative;
	display: block;
	width: 30px;
	height: 30px;
	padding: 0;
	background: #e6e6e6;
}
.boxPagenation .next a:after {
	position: absolute;
	top: 10px;
	left: 11px;
	width: 8px;
	height: 10px;
	content:"";
	background: url(/c/common/img/icon_arrow02.png) no-repeat;
	background-size: 8px 10px;
}
.boxPagenation .prev a:hover,
.boxPagenation .next a:hover {
	opacity: 0.7;
	background: #e6e6e6;
}