@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(/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;
}
/* .d-products
---------------------------------------------*/
.d-products{
	margin: -50px auto 80px;
	padding: 60px 0 50px;
	background: #E3F4FC;
}
.d-products .column{
	margin: 0 auto;
}
.d-products .column:last-child{
	margin-bottom: 0;
}
.d-products .column>ul{
	display: block;
	letter-spacing: -0.4em;
	line-height: 0;
}
.d-products .column>ul>li{
	display: inline-block;
	letter-spacing: normal;
	width: 230px;
	margin: 0 26px 26px 0;
	vertical-align: top;
}
.d-products .column>ul>li:nth-child(4n){
	margin-right: 0;
}
.d-products .column>ul>li.last{
	width: 486px;
	margin-right: 0;
}
.d-products .column>ul>li>a{
	display: block;
	line-height: 0;
	position: relative;
	overflow: hidden;
}
.d-products .column>ul>li>a:hover{
	opacity: 1;
}
.d-products .column>ul>li p.img{
	line-height: 0;
	margin: 0 auto;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.d-products .column>ul>li p.img img{
	width: 100%;
	height: auto;
}
.d-products .column>ul>li p.img:hover{
	opacity: 0;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
.d-products .column>ul>li h3{
	font-size: 170%;
	color: #009de4;
	margin: 10px auto;
	text-align: center;
	font-weight: normal;
	line-height: 130%;
	font-weight: bold;
}
.d-products .column>ul>li a[target="_blank"] h3{
	background: url(/common/img/icon_blank.png) right 0 top 2px no-repeat;
}
.d-products .column>ul>li p.txt{
	font-size: 140%;
	text-align: left;
	margin: 0 auto;
	color: #333;
	line-height: 160%;
}


.ttl-d-products {
	text-align: center;
	line-height: 1;
	font-size: 100%;
	margin: 0 0 45px;
}
.ttl-d-products b {
	display: inline-block;
	padding: 0 0 8px;
	border-bottom: 3px solid #009de4;
	font-size: 340%;
	font-weight: normal;
}
.ttl-d-products span{
	padding: 10px 0 0;
	display: block;
	font-size: 150%;
	color: #009de4;
	font-weight: normal;
}



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

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

----------------------------------------------------------------------------- */
.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 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(/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 span {
	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 .tooltip p a {
	display: inline-block;
}
.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(/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(/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(/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%;
	display: block;
}
.tabBox .central dd ul li .tooltip p a:after {
	display: inline-block;
	width: 15px;
	padding: 10px 0;
	content: "";
	background: url(/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(/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(/common/img/icon_arrow06.png) no-repeat 8% center;
}
.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 > span {
	font-size: 70%;
	display: inline-block;
	margin-top: 5px;
}
.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(/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(/common/img/icon_contact01.png) no-repeat 0 center;
}
.technology p.contact a span.text {
	font-size: 150%;
	padding-left: 30px;
}
/* -----------------------------------------------------------------------------

開発品の紹介

----------------------------------------------------------------------------- */
.d-products-cont {
	margin: 20px auto 20px;
	padding: 30px 15px 0px;
	background: #E3F4FC;
}
.d-products-cont .column{
	margin: 0 auto;
}
.d-products-cont .column>p{
		font-size: 10%;
	}
.d-products-cont .column:last-child{
	margin-bottom: 0;
}
.d-products-cont .column>ul{
	display: block;
	letter-spacing: -0.4em;
	line-height: 0;
}
.d-products-cont .column>ul>li{
	display: inline-block;
	letter-spacing: normal;
	width: 32%;
	margin: 0 2% 30px 0;
	vertical-align: top;
}
.d-products-cont .column>ul>li:nth-child(3n){
		margin-right: 0;
	}
.d-products-cont .column>ul>li.last{
		width: 100%;
		margin-right: 0;
	}
.d-products-cont .column>ul>li>a{
	display: block;
	line-height: 0;
	position: relative;
	overflow: hidden;
	text-decoration: none;
}
.d-products-cont .column>ul>li>a:hover{
	opacity: 1;
}
.d-products-cont .column>ul>li p.img{
	line-height: 0;
	margin: 0 auto 10px;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.d-products-cont .column>ul>li p.img img{
	width: 100%;
	height: auto;
}
.d-products-cont .column>ul>li p.img:hover{
	opacity: 0;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
.d-products-cont .column>ul>li div{
		position: static;
		padding: 0;
		background: none;
		height: auto;
	}	
.d-products-cont .column>ul>li h3{
	font-size: 120%;
	color: #009de4;
	margin: 15px auto;
	text-align: center;
	font-weight: normal;
		line-height: 120%;
	font-weight: bold;
}
.d-products-cont .column>ul>li a[target="_blank"] h3{
	background: url(/common/img/icon_blank.png) right 0 top 2px no-repeat;
}
.d-products-cont .column>ul>li p.txt{
	font-size: 100%;
	text-align: left;
	margin: 0 auto;
	color: #333;
	line-height: 140%;
}


.d-products__video {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  margin-bottom: 2em;
}


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

イチオシ技術

----------------------------------------------------------------------------- */
.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;
	overflow: visible;
}
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.rdCenter-description {
	font-size: 190%;
	text-align: center;
	margin-bottom: 30px;
}
.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(/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%;
}
.gmap-wrap {
height: 0;
overflow: hidden;
padding-bottom: 70%;
position: relative;
margin-bottom: 30px;
}
.gmap-wrap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}


.rdCenter p.btn-d-products {
	display: block;
	margin: 0 auto;
	text-align: center;
	}
.rdCenter p.btn-d-products a {
	display: inline-block;
	padding: 15px 34px 15px;
	border-radius: 3px;
	color: #fff;
	background: #019CE4;
	font-size: 110%;
	text-decoration: none;
}



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

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

----------------------------------------------------------------------------- */
.newsContent + .newsContent {
	padding-top: 0;
}
.newsContent h2 {
	margin: -15px 0 0;
}
.newsContent article {
	border-bottom: 1px dotted #cdcdcd;
	line-height: 1.3;
	margin-top: -15px;
}
.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(../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(/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(/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(/common/img/icon_arrow02.png) no-repeat;
	background-size: 8px 10px;
}
.boxPagenation .prev a:hover,
.boxPagenation .next a:hover {
	opacity: 0.7;
	background: #e6e6e6;
}

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

拡張

----------------------------------------------------------------------------- */
.sub main.dev p,
.sub main.dev li,
.sub main.dev dt,
.sub main.dev dd,
.sub main.dev th,
.sub main.dev td {
	font-size: inherit;
}

.dev{
	font-size: 15px;
}
.dev *,
.dev *::before,
.dev *::after{
	box-sizing: border-box;
}
.dev sub,
.dev sup{
	position: relative;
	font-size: .75em;
	line-height: 0;
	vertical-align: baseline
}
.dev sub{
	bottom:-.25em
}
.dev sup{
	top:-.6em
}
.dev img{
	max-width: 100%;
	height: auto;
}
.dev figcaption{
	padding: 8px 0 0;
	font-size: 13px !important;
}
.dev table{
	border-collapse: collapse;
	font-size: 13px;
}
.dev th,
.dev td{
	padding: 5px 5px;
	text-align: center;
	vertical-align: middle;
	border: 1px #d4d4d4 solid;
}
.dev th{
	background-color: #dff0f7;
	font-weight: bold;
}
.dev th.u-text-left{
	text-align: left !important;
}
.dev th span.text-vertical{
	line-height: 1;
	white-space: nowrap;
	min-width: 1em;
}


.flex{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.flex--nowrap{
	display: flex;
	justify-content: space-between;
}
.gap-10{ --u-gap: 10px; }
.gap-20{ --u-gap: 20px; }
.gap-25{ --u-gap: 25px; }
.gap-40{ --u-gap: 40px; }
.gap-50{ --u-gap: 50px; }
.gap-60{ --u-gap: 60px; }
.gap-70{ --u-gap: 70px; }

.flex > :not([class*="w-"]),
.w-1-2{ width: calc((100% - var(--u-gap, 0px)) / 2);}
.w-1-3{ width: calc((100% - var(--u-gap, 0px) * 2) / 3);}
.w-1-4{ width: calc((100% - var(--u-gap, 0px) * 3 ) / 4);}

.flex > :not([class*="w-"]):nth-child(n + 3),
.w-1-2:nth-child(n + 3),
.w-1-3:nth-child(n + 4),
.w-1-4:nth-child(n + 5){ margin-top: var(--u-gap, 0px); }

.w-1-3:nth-child(3n + 2):nth-last-child(1){
	margin-right: auto;
	margin-left: var(--u-gap, 0px);
}
.w-1-4:nth-child(4n + 2):nth-last-child(2){
	margin-left: var(--u-gap, 0px);
}
.w-1-4:nth-child(4n + 3):nth-last-child(1){
	margin-right: auto;
	margin-left: var(--u-gap, 0px);
}

.mb-5{ margin-bottom: 5px; }
.mb-10{ margin-bottom: 10px; }
.mb-15{ margin-bottom: 15px; }
.mb-20{ margin-bottom: 20px; }
.mb-25{ margin-bottom: 25px; }
.mb-30{ margin-bottom: 30px; }
.mb-35{ margin-bottom: 35px; }
.mb-40{ margin-bottom: 40px; }
.mb-45{ margin-bottom: 45px; }
.mb-50{ margin-bottom: 50px; }
.mb-60{ margin-bottom: 60px; }
.mb-70{ margin-bottom: 70px; }
.mb-80{ margin-bottom: 80px; }
.mb-90{ margin-bottom: 90px; }

.mt-5{ margin-bottom: 5px; }
.mt-10{ margin-bottom: 10px; }
.mt-15{ margin-bottom: 15px; }
.mt-20{ margin-bottom: 20px; }
.mt-25{ margin-bottom: 25px; }
.mt-30{ margin-bottom: 30px; }
.mt-35{ margin-bottom: 35px; }
.mt-40{ margin-bottom: 40px; }
.mt-45{ margin-bottom: 45px; }
.mt-50{ margin-bottom: 50px; }


/* .u-mr-30{ margin-right: 30px; } */

.wh-nowrap{ white-space: nowrap; }
.wh-normal{ white-space: normal; }
.wh-pre{ white-space: pre; }

.layout-fixed{ table-layout: fixed; }
.layout-auto{ table-layout: auto}

.text-vertical{
	writing-mode: vertical-rl;
	text-orientation: upright;
}
.color-red{
	color: #c40018;
}
.text-left{ text-align: left; }
.text-center{ text-align: center; }

/* サイドメニュー
---------------------------------------------*/
/*#side > ul > li:nth-child(5) > a{
	background: url(/common/img/icon_arrow_down01.png) 15px center no-repeat #fff;
	background-size: 14px auto;
}
#side > ul > li:nth-child(5) > a:hover{
	background-color: #e5f5fc;
	background-size: 14px auto;
}
#side > ul > li:nth-child(5) > a.active:hover {
	background-color: #e5f5fc;
	background-size: 14px auto;
}
.develop-top #side > ul > li:nth-child(5) > a{
	background-color:#e5f5fc;
	background-size: 14px auto;
	
}*/
#side > ul > li:nth-child(3) > a{
	background: url(/common/img/icon_arrow_down01.png) 15px center no-repeat #fff;
	background-size: 14px auto;
}
#side > ul > li:nth-child(3) > a:hover{
	background-color: #e5f5fc;
	background-size: 14px auto;
}
#side > ul > li:nth-child(3) > a.active:hover {
	background-color: #e5f5fc;
	background-size: 14px auto;
}
.develop-top #side > ul > li:nth-child(3) > a{
	background-color:#e5f5fc;
	background-size: 14px auto;
	
}
/* タイトル
---------------------------------------------*/
.dev{
	background: url(/technology/development_product/img/bg.jpg) 0 0 / 355px 355px no-repeat;
}
.dev-header{
	position: relative;
	height: 110px;
	margin-bottom: 30px;

	text-align: center;
}
.dev-header__thumb{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.dev-header__copy{
	position: relative;
	padding: 5px 0 10px;
	font-weight: 600;
}
.dev-header__copy::after{
	position: absolute;
	content: '';
	display: block;
	width: 100%;
	height: 4px;
	bottom: 0;
	background: linear-gradient(to right, #213487 0%,#213487 10%,#ffffff 100%);
}
.dev-header__title{
	padding: 5px 0 5px;
	font-size: 30px !important;
	font-weight: 600;
	line-height: 1.333;
}

.dev__lead{
	margin-bottom: 20px;

	font-size: 22px !important;
	font-weight: 600;
	color: #21348b;
}
.dev__desc{
	margin-bottom: 60px;

	line-height: 1.6;
	text-align: justify;
    text-justify: inter-ideograph;
}

/* ブロック
---------------------------------------------*/
.dev-blk,
.dev-blk--m{
	width: auto;
}
.dev-blk--m{
	max-width: 510px;
}
.dev-blk-title{
	margin-bottom: 20px;
	padding: 0 0 0 10px;
	border-left: 5px solid #009de4;

	font-size: 18px;
	font-weight: bold;
	line-height: 1.25;
	color: #009de4;
}
.dev-blk-title-sub{
	margin-bottom: 20px;

	font-size: 16px;
	font-weight: bold;
	line-height: 1.25;
}
.dev-blk-title-sub2{
	margin-bottom: 20px;

	font-size: 14px;
	font-weight: bold;
	line-height: 1.25;
}
/* 
---------------------------------------------*/
.dev-note,
.dev-note--r{
	font-size: 12px !important;
}
.dev-note--r{
	text-align: right;
}
/* リスト
---------------------------------------------*/
.dev-lists li{
	text-indent: -1em;
	padding-left: 1em;
}
.dev-lists li:not(:last-child){
	margin-bottom: .5em;
}
.dev-lists span{
	font-size: 106.666%;
	color: #029de4;
}
.dev-lists small{
	font-size: 80%;
}

/* 例外
---------------------------------------------*/
.dp01-ex1{
	padding-top: 90px;
}
.dp01-ex2{
	display: flex;
	justify-content: space-between;
	max-width: 584px;
}
.dp01-ex2 > p{
	margin-top: 10px;
}
/* 例外
---------------------------------------------*/
.dp02-ex1{
	display: flex;
}
.dp02-ex1 figure:nth-child(1){
	margin-top: 62px;
	margin-right: -56px;
}
.dp02-ex2{
	display: flex;
}
.dp02-ex2 figure:nth-child(1){
	margin-right: 30px;
}
.dp02-ex2 figure:nth-child(2){
	margin-right: 30px;
}
.dp02-ex2 figure:nth-child(3){
	margin-right: 10px;
}
.dp02-ex2 figure:nth-child(4) figcaption{
	display: none;
}
/* 例外
---------------------------------------------*/
.dp03-ex1{
	display: flex;
	justify-content: space-between;
}
.dp03-ex2{
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: 20px;
}
.dp03-ex3{
	display: grid;
	grid-template-columns: 343fr 227fr;
	align-items: end;
	gap: 20px;
	max-width: 662px;
	margin: -30px auto 0;
}
.dp03-ex4 .dev-blk-title-sub{
	color: #009de4;
}
/* 例外
---------------------------------------------*/
.dp04-ex3{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	max-width: 584px;
}
.dp04-ex3 > div{
	padding-right: 1em;
	margin-bottom: 1em;
}
.dp04-ex3 > p{
	flex: 0 0 auto;
}
.dp04-ex4{
	display: flex;
	flex-wrap: wrap;
}
.dp04-ex4 dt{
	width: 6.5em;
}
.dp04-ex4 dd{
	width: calc(100% - 6.5em);
}
/* 例外
---------------------------------------------*/
.dp05-ex1{
	margin-bottom: 15px;

	font-size: 20px !important;
	font-weight: 600;
	text-align: center;
}
.dp05-ex1 span{
	color: #bd0018;
}
.dp05-ex2{
	position: relative;
	text-align: center;
}
.dp05-ex2 img{
	max-width: 156px;
	margin-bottom: 5px;
}
.dp05-ex2 p:nth-of-type(1){
	margin-bottom: 20px;

	font-size: 25px !important;
	font-weight: 600;
	color: #21348b;
}
.dp05-ex2 p:nth-of-type(2){
	line-height: 2.2;
}
.dp05-ex3{
	position: absolute;
	width: 100px;
	height: 100px;
	top: 30px;
	left: calc(100% - 50px + 10px);
	transform: rotate(45deg);
}
.dp05-ex3 span{
	position: absolute;
	display: block;
	width: 4px;
	height: 100%;
	background-color: #21348b;
	left: calc(50% - 2px);
}
.dp05-ex3 span:nth-child(2){
	transform: rotate(90deg);
}
.dp05-ex4{
	display: flex;
	flex-wrap: wrap;
}
.dp05-ex4 li{
	text-indent: -2em;
	padding-left: 2em;
	padding-right: 1em;

	font-size: 12px !important;
	line-height: 1.75;
}
/* 例外
---------------------------------------------*/
.dp06-ex1 li{
	white-space: nowrap;
}
.dp06-ex1 figure{
	max-width: 670px;
	margin: 0 auto;
}
/* 例外
---------------------------------------------*/
.dp07-ex1{
	text-align: center;
	padding-left: calc(42 / 330 * 100%);
	padding-right: calc(10 / 330 * 100%);
}
.dp07-ex1 p:nth-child(1){
	padding: 5px 0;
	border-bottom: 2px solid #0299e0;
	font-size: 16px !important;
	font-weight: bold;
}
.dp07-ex1 p:nth-child(2){
	padding: 5px 0 0;
}
/* 例外
---------------------------------------------*/
.dp13-ex1{
	display: grid;
	grid-template-columns: 328fr 292fr;
	place-items: center;
	max-width: 620px;
	margin: 0 auto;
}
.dp13-ex1 div{
	width: 100%;
}
.dp13-ex1 p{
	padding-top: .1em;
	padding-left: 10px;
	border-top: 2px solid #0C318E;

	font-size: 18px !important;
	font-weight: 600;
}
.dp13-ex1 p:last-child{
	border-bottom: 2px solid #0C318E;
}
.dp13-ex1 p span{
	font-size: 14px !important;
}

.dp13-ex2{
	padding-left: 7%;
	font-size: 11px !important;
	font-weight: 600;
}
.dp13-ex2 p:nth-child(1){
	font-size: 13px !important;
}
.dp13-ex2 p:nth-child(3){
	text-align: right;
}

.dp13-ex3{
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: 20px;
}
.dp13-ex-red{
	color: #d00;
}
/* 例外
---------------------------------------------*/
.dev-download{
	background: #009de4;
	color: #fff !important;
	text-decoration: none !important;
	padding: 8px 16px 6px 23px;
	display: inline-block;
	border-radius: 3px;
	min-width: 280px;
    text-align: center;
}
.dev-download span{
	background: url(/common/img/icon_arrow01.png) right center no-repeat;
	padding-right: 23px;
	background-size: 8px auto;
}



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

知的財産について

----------------------------------------------------------------------------- */
.technology.intellectual-property ul.anchor {
	margin-bottom: 50px;
}
.technology.intellectual-property ol {
	margin-bottom: 20px;
	margin-top: 20px;
	margin: 1em 0;
	padding-left: 20px;
	list-style-type: decimal;
}
.technology.intellectual-property ol li {
	margin-bottom: 10px;
}
.technology.intellectual-property ol li h5 {
	margin-bottom: 3px;
	font-size: 105%;
}

.intellectual-property-btn{
	text-align: center;
	margin-bottom: 70px;
}
.intellectual-property-btn a{
	background: #009de4;
	color: #fff !important;
	text-decoration: none !important;
	padding: 10px 16px 8px 23px;
	display: inline-block;
	border-radius: 3px;
	min-width: 90%;
    text-align: center;
	font-size: 180% !important;
}
.intellectual-property-btn a span{
	background: url(/common/img/icon_arrow01.png) right center no-repeat;
	padding-right: 23px;
	background-size: 8px auto;
	font-size: 100%;
}