@charset "utf-8";
/* CSS Document */
.sticky{margin-bottom:50px; position: sticky !important;position: -webkit-sticky !important;top: 200px;}
.section-gi{width:100%; padding:0; margin:0;}
/*-- 汎用 --*/
.idt{text-indent: 1em; line-height:1.4em;}
.idtD{padding-left: 1em;text-indent: -1em;}
.txt2{font-size:0.85em;line-height:1.2em;letter-space:-0.5;}
.linkFrame{margin-bottom:15px;background:#fff;border-radius:50px !important;border:1px #ddd solid;box-shadow: 0 0 5px rgb(0 0 0 / 30%);padding:10px 20px;line-height:2;}
.linkFrame:hover{background:#d6edf9;border:1px solid #3399ff;}
.accordionBox{padding:50px 0;font-size:0.85em;}
img.shadow:hover {box-shadow: 0 4px 10px #cfd6d6 !important;}
.opnDoc {display: block;font-size: 1.8rem;font-weight: 700;color: #0864c8;padding-left: 10px;transition: all 200ms ease;margin: 30px 0 15px 0 !important;}
.opnDoc.active {color: #0564c8;}
.opnDoc:after {opacity: 1;background: url(../../../common/images/accordion-gr.svg) center center / 14px 10px no-repeat;}
.opnDoc.hover {color: #0564c8;text-decoration: underline;}
.opnDoc.hover:after {background: url(../../../common/images/accordion-bl.svg) center center / 14px 10px no-repeat;}
.opnDoc.active:after {background: url(../../../common/images/accordion-bl.svg) center center / 14px 10px no-repeat;}
.imgRt{width: 380px!important; height:auto !important; float:right !important;margin:0 0 5px 12px !important;}
.imgLt{width: 30% !important; height:auto!important; float:left !important;margin:0 30px 10px 0 !important;}
.border{border:#ddd 1px solid;}
.cap{display:block;font-size:12px;font-weight: bold;padding-top:10px;margin-bottom:10px;text-align:center;}
.ls03{letter-spacing:-0.03em !important;}
.fs11{font-size:11px !important;}
.fs14{font-size:14px !important;}
.fs15{font-size:15px !important;}
.pdtop10{padding-top:10px !important;}
.mt0{margin-top:0 !important;}
.mt15{margin-top:15px !important;}
.mt30{margin-top:30px !important;}
.ml10{margin-left:10px !important;}
.mr20{margin-right:20px;}
.mr40{margin-right:40px;}
.pl10{padding-left:10px !important;}
.pl20{padding-left:20px !important;}
.pl40{padding-left:40px !important;}
.pl60{padding-left:60px !important;}
.pl80{padding-left:80px !important;}
.left{text-align:left !important;}
p.att{font-size:0.85em !important;color:red;margin:-4px 10px 10px !important;padding-right:30px !important;text-align:right;}
hr.dash2{border:#666 dashed 1px;width: 98%;margin:15px auto;align:center !important;}
.imgIconZ{ display: inline-block; width: 20px; height: 20px; vertical-align: top; margin-left: 6px; }
.imgBox75{width:75%;text-align:center !important;margin:10px auto 0;}
.imgBox80{width:75%;text-align:left !important;margin:10px 0 0;}
.txtBox2{display: block !important;font-size:1em; line-height: 1.2em;border: #666 dashed 1px;color: #444;padding: 2% !important;margin:3px 0;}
.txtBox2 p{margin:0 !important;padding:0;padding-left:1em;text-indent:-1em;}
.txtBox3{display: block !important;font-size:1em; line-height: 1.6em;border: #666 dashed 1px;color: #444;padding: 2% !important;margin:20px 0;}
.txtBox3 p{margin:0 !important;padding-left:1em;font-size:0.9em;}
.txtFrmgr{background:#ddd;font-weight:600;border-radius:30px;line-height:30px;padding:5px 20px;}
.BlueFrm02{display:block !important;font-size:0.9em;font-weight:600 ;color:#0564c8;padding:8px 8px 8px 0;border:#0564c8 2px solid;margin:10px 10px 10px 0 !important;padding-left:1.5em;text-indent:-1em;}
.BlueFrm03{width:100%;display:block !important;font-size:1.1em;font-weight:600 ;color:#fff;padding:8px;background:#0096e6;margin:10px 0 !important;padding-left:1.5em;text-indent:-1em;}
.grayFrm2{display:block !important;font-weight:600 ;font-size:0.9em;padding:3px 8px !important;background-color:#ddd !important;margin:10px auto!important;}
.grayFrm3{display:inline-block !important;font-weight:600 ;font-size:0.9em;padding:3px 20px !important;background-color:#ddd !important;margin:10px auto!important;border-radius:20px;}
.infoTitle{font-weight:600; color:#0564c8; margin:50px 0 10px 10px !important}
#aside .asideList .asideTxtSS {border-left:#f5f5f5 10px solid;border-right:#f5f5f5 10px solid;background:#fff;display: block;padding: 8px 28px 8px 5px;position: relative;font-size:0.85em !important;letter-spacing:-0.03em;}
.bdrBtm10{border-bottom:#f5f5f5 10px solid;}
.bdrTop10{border-top:#f5f5f5 10px solid;}
.radius{padding:2px 20px;margin:0 10px;border:1px #444 solid;font-size:16px;font-weight:500;border-radius:20px;}
h3.accordionToggle {border-bottom: 1px solid #dee3e3;adding-bottom: 10px !important;}
h4.centerInfo {position: relative;display: inline-block;margin: 1rem 0 1rem -10px;padding: 1rem 3rem;color: #fff;border-radius: 0 100vh 100vh 0;background: #0075a9;
  -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);}
h4.centerInfo:before {position: absolute;bottom: -10px;left: 0;width: 0;height: 0;content: '';border-top: 10px solid #005276;border-left: 10px solid transparent;}
.infoBoxC {padding-top:10px;padding-bottom:20px;margin: 20px 2px;background-color: #f4f5f5;}
.officeName {
	display: block;
	font-size: 1.8rem;
    font-weight: 700;
    color: #0864c8;
    padding-left: 10px;
	transition: all 200ms ease;
	margin: 30px 0 15px 0 !important;
}
.officeName.active {color: #0564c8;}
.officeName:after {
	opacity: 1;
	background: url(../../../common/images/accordion-gr.svg) center center / 14px 10px no-repeat;
}
.officeListHO {
	display: -webkit-flex;
    display: flex;
    padding: 0;
	margin:0 auto;
	width: 100vw;
    margin-left: -20px;
}
.officeList {
    padding: 0;
	margin:0 auto;
	width: 100vw;
    margin-left: -20px;
}
.officeBox {
	padding: 0;
	padding-bottom: 0;
	/*background-color: #f1fafc;　薄いブルー色　*/
	margin-bottom: 20px;
	overflow: hidden;
}

.officeBoxInner {
	display: flex;
	flex-wrap: wrap;
	background-color: #fff;
	margin-bottom: 20px;
}

.officeBoxInner li {
	display: flex;
	font-size: 1.2rem;
	color: #787e8a;
    padding: 5px 0;
}

.officeBoxInner li {
	padding: 12px 10px;
	border-bottom: 1px solid #dee3e3;
}
.officeBoxInner li:last-of-type {
	border-bottom: none;
}

.officeBoxInner .officeBoxLink {
	display: block;
}

.officeBoxInner .officeBoxLink:not(:first-of-type) {
	margin-top: 5px;
}

.officeBoxInner .officeBoxLink .txtLink {
	color: inherit;
}


/*----------------------------HOVER*/

.officeName.hover {
	color: #0564c8;
	text-decoration: underline;
}

.officeName.hover:after {
	background: url(../../../common/images/accordion-bl.svg) center center / 14px 10px no-repeat;
}

.officeName.active:after {
	background: url(../../../common/images/accordion-bl.svg) center center / 14px 10px no-repeat;
}

.ContactListInnerBox{float:left !important;padding:3%;}
.ContactListInnerIn{background-color: #f1fafc;padding:3%;}

/*--------------------------------------------------------------------------- NEWS */
#news {
	width: 100%;
	padding-bottom: 60px;
	margin-bottom:50px;
}

#news .newsList {
	padding: 0 20px;
	margin-top: -20px;
}

#news .newsList li {
	border-bottom: 1px solid #dee3e3;
}

#news .newsList li a {
	display: block;
	padding: 20px 32px 20px 0;
	position: relative;
}

#news .newsList li a:after {
    content: "";
    display: block;
    width: 10px;
    height: 14px;
    background: url(../../../common/images/link-gr.svg) center center / 10px 14px no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 12px;
    margin: auto;
}

#news .newsList li a.external:after {
	content: "";
    display: block;
    width: 20px;
    height: 20px;
    background: url(../../../common/images/external-icon-gr.svg) center center / 20px 20px no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
}

#news .newsList li .date {
	display: block;
	font-size: 1.2rem;
	position: relative;
	padding-left: 18px;
	margin-bottom: 10px;
}

#news .newsList li .date:before {
	content: "";
    display: block;
    width: 14px;
    height: 12px;
    background: url("../../../common/images/calender-icon.svg") center center / 14px 12px no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}

#news .newsList li .newsTxt {
	line-height: 1.5;
}

#news .btnList {
	margin-top: 40px;
}

/*----------------------------DISABLE*/

#news .newsList li a.disable {
	pointer-events: none;
}

#news .newsList li a.disable:after {
	content: none;
}

#news .newsList li a.disable .imgIcon {
	display: none;
}


/*----------------------------HOVER*/

#news .newsList li a .newsTxt {
	transition: all 200ms ease;
}

#news .newsList li a.hover .newsTxt {
	color: #0564c8;
	text-decoration: underline;
}

#news .newsList li a:after {
	transition: all 200ms ease;
}

#news .newsList li a.hover:after {
	background: url(../../../common/images/link-bl.svg) center center / 10px 14px no-repeat;
	transform: translate(3px,0);
}

#news .newsList li a.external.hover:after {
	background: url(../../../common/images/external-icon-bl.svg) center center / 20px 20px no-repeat;
	transform: none;
}


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

以下 TAB 用

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

@media (min-width: 481px) and (max-width: 768px) { 
	
	#news .newsList {
    	padding: 0 12%;
	}
}


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

以下 PC 用

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

@media print, screen and (min-width: 769px) {

/*--------------------------------------------------------------------------- NEWS */
	
	#news {
		padding-bottom: 0;
	}
	
	#news .newsInner {
		width: 1000px;
		margin: 0 auto;
	}
	
	#news .newsList {
    	padding: 0;
    	margin-top: -30px;
	}
}
/*--------------------------------------------------------------------------- RECOMMEND */
#recommend {padding-top: 100px;}
#recommend .recommendInner {width: 1000px;margin: 0 auto;}
#recommend .recommendList {padding: 0;margin-top: 40px;margin-bottom: -20px;}
#recommend .recommendList li {width: 235px;margin-right: 20px;margin-bottom: 20px;}
#recommend .recommendList li:nth-child(2n+1) {margin-right: 20px;}
#recommend .recommendList li:nth-child(4n) {margin-right: 0;}
#recommend .recommendList li .recommendTxt {padding: 20px 10px;}
#recommend .recommendList li a {
	display: block;
	width: 100%;
    height: 100%;
	border: 1px solid #dee3e3;
	border-radius: 10px;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
#recommend .recommendList li img {display: block;width: 100%;}
#recommend .recommendList li .recommendTxt {
	display: block;
    font-weight: 700;
	text-align: center;
    color: #0096e6;
    padding: 15px 10px;
}
/*----------------------------HOVER*/

#recommend .recommendList li a {transition: box-shadow 200ms ease;}
#recommend .recommendList li a.hover {box-shadow: 0 4px 10px #cfd6d6;}
#recommend .recommendList li .recommendTxt {transition: color 200ms ease;}
#recommend .recommendList li a.hover .recommendTxt {color: #0564c8;}


/*--------------------------------------------------------------------------- LINK-LIST */

.linkTtl a{text-decoration:none !important;}
.linkTtl a.hover{color: #0564c8;text-decoration: underline;}

.LtLine {
	font-size:0.9em !important;
	padding-left:20px;
	line-height:1.2em;
	border-left: 1px solid #1e283c;
	margin-top: 0;	
}

/*--------------------------------------------------------------------------- LINK-LIST2 */

.linkListTech {
	margin-left:25px;
}

.linkListTech li {
	margin-top:10px;
	border-bottom: 1px solid #dee3e3;
}

.linkListTech li a {
	display: block;
    padding: 10px 30px 15px 0;
    background-color: #fff;
    position: relative;
}

.linkListTech li a:after {
	content: "";
    display: block;
    width: 10px;
    height: 14px;
    background: url(../../../common/images/link-gr.svg) center center / 10px 14px no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 12px;
    margin: auto;
}

.linkListTech li a.external:after {
	content: "";
    display: block;
    width: 20px;
    height: 20px;
    background: url(../../../common/images/external-icon-gr.svg) center center / 20px 20px no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
}

.linkListTechTitle {
	font-size: 1.6rem;
    font-weight: 700;
	border-left: 4px solid #1e283c;
    padding-left: 10px;
	margin-bottom: 25px;
}
.linkListTechTitle + .linkListTech {
	padding-left: 14px;
	border-left: 1px solid #1e283c;
	margin-top: 0;	
}

.linkListTechTitle  + .linkListTech li:first-child {
	border-top: 1px solid #dee3e3;
}

/*----------------------------HOVER*/

.linkListTech a {
	transition: color 200ms ease;
}

.linkListTech  a.hover {
	color: #0564c8;
	text-decoration: underline;
}

.linkListTech  li a:after {
    transition: all 200ms ease;
    background: url(../../../images/link-gr.svg) center center / 10px 14px no-repeat;
}

.linkListTech  li a.hover:after {
    background: url(../../../images/link-bl.svg) center center / 10px 14px no-repeat;
	transform: translate(3px,0);
}

.linkListTech  li a.external.hover:after {
    background: url(../../../images/external-icon-bl.svg) center center / 20px 20px no-repeat;
	transform: none;
}

/*  Tables */
table {border-collapse: collapse;border-spacing: 0;}
table.tech01 {
width:100%;
margin: 3px auto 5px !important;
padding:0;
border-collapse: separate;
border-spacing: 0;
}
table.tech01 th,
table.tech01 td {vertical-align:middle !important; padding: 1.5% !important;margin:0 auto !important;}
table.tech01 th {
background: #c9eafb;
width:32% !important;
color:#1e283c;
vertical-align: middle;
overflow: visible;
position: relative;
font-size:19px !important;
font-weight: 700;
padding:5px;
border:1px #c9eafb solid;
}
table.tech01 td {
background: #fff;
letter-spacing:-0.04em;
padding:5px 8px;
border:1px #c9eafb solid;
}
table.tech01 td.non{border-left: 3px #fff solid;}
table.tech01 ul{list-style-position: outside;margin:20px -10px;}
table.tech01 th.bgbl01{border-left:14px solid #c9eafb;background:#eaf7fd;padding:5px 0;border-bottom:1px solid #c9eafb}

.techContBox {
	padding: 5px;
	background-color: #ddd;
	margin: 8px auto 50px !important;
	overflow: hidden;
}

/*  Tables */
table.tech02 {
width:100%;
margin: 3px auto 5px !important;
padding:0;
border-collapse : collapse;
border-spacing: 0;
}
table.tech02 th,
table.tech02 td {height:55px!important;padding: 5px auto 0 !important;margin:0 auto !important;}

table.tech02 th {
background: #c9eafb;
color:#1e283c;
vertical-align: middle;
overflow: visible;
position: relative;
padding:5px;
border:1px #444 solid;
}
table.tech02 td {
background: #fff;
letter-spacing:-0.04em;
padding:5px 8px;
border:1px #444 solid;
}
table.tech02 ul{list-style-position: outside;margin:20px -10px;}

table.boxList{margin:10px !important;border-collapse:collapse;border-spacing: 0;}
table.boxList th,
table.boxList td{vertical-align: top;padding:10px;border-bottom:#f4f5f5 10px solid;background-color:#fff !important;}
table.boxList th{width:35% !important;}

table.boxList2{border-collapse: collapse;width: 100%;margin:0 auto 30px !important;}
.boxList2 th,
.boxList2 td{padding: 5px; border: solid 1px #ccc;text-align:center;box-sizing:border-box;}
.boxList2 th {background: #f4f5f5;color: #444;}
.boxList2 th.item1{width:18% !important;}
.boxList2 th.item2{width:48% !important;}
.boxList2 th.item3{width:17% !important;}
.boxList2 th.item4{width:17% !important;}

@media screen and (max-width: 480px) {
.boxList2 tr.thead{display:none !important;}
.boxList2 {width: 100%;}
.boxList2 td, .boxList2 th{display: block;width: 100%;border-bottom:none;}
.boxList2 td{padding: 0px 12px 0 0;display: block;width: 100%;line-height: 1.8em;text-align:left;}
.boxList2 td:before{
    content: attr(data-label);
	width:25%;
    font-weight: bold;
    padding: 0px 5px;
    display: inline;
    background-color: #f4f5f5;
    margin-right: 10px;
    float: left;
  }
.boxList2 td.spth{text-align:center;font-weight:700;font-size:1.2em;color:#fff;background-color:#999;}
.boxList2  tr:last-child{border-bottom: solid 1px #ccc;}
}


/*-------------------------------------------- 
技術開発実験センター用
/*--------------------------------------------- */
.Tile01 .centerlist{
	margin:0 0 0 0;
}

.Tile01 li.center{
	width:100%;
	margin-right:0;
}

.Tile01 li.center{
	display: flex;
	justify-content: space-between;
	height:180px;
	padding:0;
}

.Tile01 li.center .phbox{
	width:40%;
	height:auto;
	overflow: hidden;
}

.Tile01 li.center .phbox img{
	object-fit:cover;
}

.Tile01 li.center .txbox{
	text-align:left;
	font-size:0.9em !important;
	padding-left:1%;
	width:60%;
	height:auto;
}
.Tile01 li.center .txbox span.b{
	padding:3px 10px;border:1px #ddd solid;border-radius:10px;margin:3px 10px;font-size:14px !important;
}
/*----------
以下 PC 用
-----------*/
@media print, screen and (min-width: 769px) {
/*--------------------------------------------- */
.spDisp{display:none !important;}
}

/*sp*/
@media screen and (max-width:768px) {
ul.news_list li a p{
	font-size:14px;
}
	
.Tile01 li {
		margin: 0 auto 20px !important;
	}
	
.Tile01 li.center{
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	height:auto;
	padding:0;
}

.Tile01 li.center .phbox{
	width:100%;
	overflow: hidden;
	height:auto;
}

.Tile01 li.center .phbox img{
	object-fit: cover;
}

.Tile01 li.center .txbox{
	width:100%;
	height:auto;
	padding:0 0 20px 0;
}
}
/*-------------------------------------------- 
以下 mobile 用
/*--------------------------------------------- */
@media print, screen and (max-width: 480px) {
/*--------------------------------------------- */
.spBK,.radius{display:block;clear:both;}
.pcDisp{display:none !important;}
.imgRt{display:block !important;margin:10px auto !important;width: 98%!important;}
#techMainImg h1#hd01{
position: absolute;
top: 2%;
left:2%;
font-size:1.6vw;
background: url(../../../common/images/drop-bl.svg) left center / 24px 36px no-repeat;
}
#techMainImg p#hd02{
position: absolute;
top: 5%;
left:2%;
letter-spacing: -0.05em;
font-size: 1.1vw;
}
#newsFrame .newsList {line-height: 1.2em;}
table.tech01 th,
table.tech01 td,
table.boxList th,
table.boxList td {
	height:auto !important;
   	display: block !important;
   	width: 100% !important;
	padding: 1em !important;
  }
table.tech01 th.bgbl01{border-left:none !important;}
}
