@charset "utf-8";
/*--京common.css--*/
/* ##########PC########## */
.page_content{
	width:980px;
	margin:1.5em auto 0 auto;
}

	/*お知らせ一覧*/
	.news_list_box > .box_header ul{
		display:flex;
		justify-content:center;
	}
	
		.news_list_box > .box_header ul li{
			width:25%;
			padding-bottom:11px;
			position:relative;
		}
		
			.news_list_box > .box_header ul li span{
				position:relative;
				display:flex;
				justify-content:center;
				align-items:center;
				border:1px solid #8e8e8e;
				border-right:none;
				height:54px;
				font-size:1.1em;
				letter-spacing:0.1em;
				padding-left:0.1em;
				cursor:pointer;
				transition:.3s all ease;
			}
			
			.news_list_box > .box_header ul li:last-child span{
				border-right:1px solid #8e8e8e;
			}
			
			.news_list_box > .box_header ul li span:hover{
				background:rgba(0,110,240,0.1);
			}

			
			.news_list_box > .box_header ul li:after{
				content:"";
				display:inline-block;
				position:absolute;
				bottom:0;
				left:0;
				right:0;
				margin:auto;
				width: 0;
				height: 0;
				border-style: solid;
				border-width: 11px 9px 0 9px;
				border-color: #006ef0 transparent transparent transparent;
				opacity:0;
			}
		
			.news_list_box > .box_header ul li.active span{
				background:#006ef0;
				border:1px solid #006ef0;
				color:#fff;
			}
			
			.news_list_box > .box_header ul li.active:after{
				opacity:1;
			}
			
			/*お知らせ*/
			.news_list_box > .box_header ul li.cat1 span:hover{
				background:rgba(104,154,100,0.1);
			}
			
			.news_list_box > .box_header ul li.cat1.active span{
				background:#689A64;
				border:1px solid #689A64;
			}
			
			.news_list_box > .box_header ul li.cat1:after{
				border-color: #689A64 transparent transparent transparent;
			}
			
			/*トピックス*/
			.news_list_box > .box_header ul li.cat2 span:hover{
				background:rgba(183,100,143,0.1);
			}
			
			.news_list_box > .box_header ul li.cat2.active span{
				background:#B7648F;
				border:1px solid #B7648F;
			}
			
			.news_list_box > .box_header ul li.cat2:after{
				border-color: #B7648F transparent transparent transparent;
			}
			
			/*製品・サービス*/
			.news_list_box > .box_header ul li.cat3 span:hover{
				background:rgba(76,128,144,0.1);
			}
			
			.news_list_box > .box_header ul li.cat3.active span{
				background:#4C8090;
				border:1px solid #4C8090;
			}
			
			.news_list_box > .box_header ul li.cat3:after{
				border-color: #4C8090 transparent transparent transparent;
			}

		.news_list_box .box_inner{
			margin-top:1.5em;
		}
		
			.news_list_box .box_inner ul li{
				display: flex;
				border-bottom: 1px solid #bababa;
				padding: 1em;
				line-height: 1.4;
				display:none;
			}
			
			.news_list_box .box_inner ul li.active{
				display: flex;
			}

			.news_list_box .box_inner ul li.important_news{
				position: relative;
			}

			.news_list_box .box_inner ul li.important_news::before{
				content:"";
				width: 1.9rem;
				aspect-ratio: 1 / 1;
				background: url(../../shared/important_news_icon.gif) no-repeat;
				background-size: contain;
				position: absolute;
				top: calc(50% - 0.95rem);
				left: -2.2rem;
			}
	
				.news_list_box .box_inner ul li .entry_date{
					width: 7em;
				}
	
				.news_list_box .box_inner ul li .entry_category{
					width: 130px;
					position:relative;
				}
	
					.news_list_box .box_inner ul li .entry_category span{
						display: flex;
						width: 110px;
						height: 20px;
						border-radius: 10px;
						justify-content: center;
						align-items: center;
						font-size: 0.8em;
						color: #fff;
					}
	
					.news_list_box .box_inner ul .cat1 .entry_category span{
						background: #689A64;
					}
	
					.news_list_box .box_inner ul .cat1 .entry_category span:before{
						content:"お知らせ";
					}
	
					.news_list_box .box_inner ul .cat2 .entry_category span{
						background:#B7648F;
					}
	
					.news_list_box .box_inner ul .cat2 .entry_category span:before{
						content:"トピックス";
					}
	
					.news_list_box .box_inner ul .cat3 .entry_category span{
						background:#4C8090;
					}
	
					.news_list_box .box_inner ul .cat3 .entry_category span:before{
						content:"製品・サービス";
					}
	
				.news_list_box .box_inner ul li .entry_title{
					width: calc(100% - 7em - 130px);
				}
	
					.news_list_box .box_inner ul li .entry_title a{
						color: #333;
						text-decoration: none;
					}
	
					.news_list_box .box_inner ul li .entry_title a:hover{
						color:#00197D;
						text-decoration:underline;
					}
				
	/*お知らせ詳細*/
	.entry_detail_box{
		
	}
		
		.entry_detail_box .box_header{
			margin-bottom:3em;
		}
		
			.entry_detail_box .box_header h3{
				font-size: 1.4em;
				line-height: 1.4;
				color: #333;
				margin-bottom: 0.5em;
				padding: 0 0 0.5em 1.3em;
				border-bottom: 1px dotted #aaa;
				position: relative;
			}
		
				.entry_detail_box .box_header h3:before{
					content: "";
					display: block;
					background:#005096;
					width: 0.8em;
					height: 0.8em;
					border-radius: 4px;
					position: absolute;
					top: 0.25em;
					left: 0;
				}
		
			.entry_detail_box .box_header .entry_date{
				text-align:right;
				font-size:1.1em;
			}
		
				.entry_detail_box .box_header .entry_date span{
					margin-right: 1.3em;
					display: inline-block;
					width: 110px;
					height: 20px;
					line-height:20px;
					border-radius: 10px;
					text-align:center;
					font-size: 0.8em;
					color: #fff;
				}
		
				.entry_detail_box .box_header .entry_date .lbl_cat.cat1{
					background: #689A64;
				}
		
				.entry_detail_box .box_header .entry_date .lbl_cat.cat2{
					background:#B7648F;
				}
		
				.entry_detail_box .box_header .entry_date .lbl_cat.cat3{
					background:#4C8090;
				}
		
		.entry_detail_box .box_inner{
			width:900px;
			margin:0 auto;
			font-size:1.05em;
			line-height:1.8;
		}
		
			.entry_detail_box .box_inner a{
				color: #1e4682;
			}
		
			.entry_detail_box .box_inner a:hover{
				text-decoration:underline;
			}
		
			.entry_detail_box .box_inner p{
				margin-bottom:1em;
			}
			
			.entry_detail_box > .box_inner > ul{
				margin:2em 1em;
			}
			
				.entry_detail_box > .box_inner > ul li{
					margin-bottom:0.3em;
					padding-left:1em;
					position:relative;
				}
				
				.entry_detail_box > .box_inner > ul li:last-child{
					margin-bottom:0;
				}
				
					.entry_detail_box > .box_inner > ul li:before{
						font-family: FontAwesome;
						content:"\f105";
						position:absolute;
						top:0;
						left:0;
						color:#aaa;
					}
		
			.entry_detail_box .box_inner .imgs_box{
				margin-top:2em;
			}
		
				.entry_detail_box .box_inner .imgs_box ul li img{
					display:block;
					text-align:center;
					margin:0 auto;
				}
		
		.entry_detail_box .box_footer{
			margin-top:3em;
			padding-top:1em;
			text-align: center;
			font-size:1.2em;
			border-top: 1px dotted #aaa;
		}
		
			.entry_detail_box .box_footer a{
				display: inline-block;
				color: #333;
				padding: 0.8em 2em;
				border: 1px solid #ccc;
				text-decoration: none;
			}
		
			.entry_detail_box .box_footer a:hover{
				text-decoration:underline;
			}
	
	
/*20200428追加分*/
	/*20130404お知らせ*/
	.catalog_box{
		width:600px;
	}
	
	.catalog_box > table,
	.catalog_box > table thead th,
	.catalog_box > table tbody th,
	.catalog_box > table tbody td{
		border:1px solid #666;
	}
	
	.catalog_box > table thead th{
		text-align:center;
	}
	
	.catalog_box > table thead th,
	.catalog_box > table tbody th,
	.catalog_box > table tbody td{
		padding:0.5em;
	}
	
	.catalog_box > table tbody th{
		width:30%;
	}
	
	.catalog_box > table tbody td{
		width:10%;
		text-align:center;
	}
	
	.catalog_box > table tbody th .sp_br{
		display:none;
	}
	
	/*バルク貯槽ガス回収システム・研修会*/
	.kenshu_box{}
	
	.kenshu_box > .box_header{
		margin-bottom: 3em;
	}
	
	.kenshu_box .box_header h3{
		font-size: 1.4em;
		line-height: 1.4;
		color: #333;
		margin-bottom: 0.5em;
		padding: 0 0 0.5em 1.3em;
		border-bottom: 1px dotted #aaa;
		position: relative;
	}
	
	.kenshu_box .box_header h3:before{
		content: "";
		display: block;
		background: #005096;
		width: 0.8em;
		height: 0.8em;
		border-radius: 4px;
		position: absolute;
		top: 0.25em;
		left: 0;
	}
	
	.kenshu_box .box_header .date{
		text-align: right;
		font-size: 1.1em;
	}
	
	.kenshu_box .box_inner{
		font-size:1.05em;
		line-height: 1.5;
	}
	
	.kenshu_box > .box_inner > dl{
		width:600px;
		margin:0 auto 2em auto;
		padding:1.5em;
		border:1px solid #666;
	}
	
	.kenshu_box > .box_inner > dl dt{
		text-align:center;
		margin-bottom:0.5em;
	}
	
	.kenshu_box > .box_inner > dl dd{
		margin-bottom:1em;
	}
	
	.kenshu_box > .box_inner > dl dd:last-child{
		margin-bottom:0;
	}
	
	.kenshu_photo_list_box .box_header{
		font-size:1.2em;
		margin-bottom:3em;
	}
	
	.kenshu_photo_list_box .box_header p{
		text-align:center;
	}
	
	.kenshu_photo_list_box .box_inner ul{
		display: flex;
		flex-wrap: wrap;
	}
	
	.kenshu_photo_list_box .box_inner ul li{
		width: 50%;
		text-align: center;
		margin-bottom:2em;
	}
	
	.kenshu_photo_list_box .box_inner ul li:nth-child(3),
	.kenshu_photo_list_box .box_inner ul li:nth-child(8){
		width:100%;
	}
	
	.kenshu_photo_list_box .box_inner ul li .kenshu_photo ul li{
		margin-bottom:0;
	}
	
	.kenshu_photo_list_box .box_inner ul li .kenshu_desc{
		margin-top:1em;
	}
	
	.kenshu_photo_list_box .box_inner ul li .kenshu_desc .details{
		width: 80%;
		text-align: left;
		margin: 0.5em auto 0 auto;
	}
	
	.kenshu_photo_list_box .box_inner ul li .kenshu_desc .details dl dd{
		margin:0 0 0.5em 2em;
	}
	
	.kenshu_photo_list_box .box_inner ul li .kenshu_desc .details dl dd:last-child{
		margin:0 0 0 2em;
	}
	
	/*「セーバープロスマート保安点検調査システム」の紹介・説明ビデオ*/
	
	.video_box,
	.bulk_box,
	.sps_new_box,
	.sp2_newver_box{
		margin-bottom:5em;
	}
	
	.video_box .box_header,
	.bulk_box .box_header,
	.sps_new_box .box_header,
	.sp2_newver_box .box_header,
	.new_function_box .box_header{
		margin-bottom: 3em;
	}
	
	.video_box .box_header h3,
	.bulk_box .box_header h3,
	.sps_new_box .box_header h3,
	.sp2_newver_box .box_header h3,
	.new_function_box .box_header h3{
		font-size: 1.4em;
		line-height: 1.4;
		color: #333;
		margin-bottom: 0.5em;
		padding: 0 0 0.5em 1.3em;
		border-bottom: 1px dotted #aaa;
		position: relative;
	}
	
	.video_box .box_header h3:before,
	.bulk_box .box_header h3:before,
	.sps_new_box .box_header h3:before,
	.sp2_newver_box .box_header h3:before,
	.new_function_box .box_header h3:before{
		content: "";
		display: block;
		background: #005096;
		width: 0.8em;
		height: 0.8em;
		border-radius: 4px;
		position: absolute;
		top: 0.25em;
		left: 0;
	}
	
	.video_box .box_inner ul li{
		text-align:center;
		margin-bottom:3em;
	}
	
	.video_box .box_inner ul li a,
	.video_box .box_inner ul li a span{
		display:block;
	}
	
	.video_box .box_inner ul li a{
		width: 50%;
		margin:0 auto;
		padding:1em;
		box-sizing: border-box;
		text-decoration:none;
	}
	
	.video_box .box_inner ul li a:hover{
		background-color:#eaf7fc;
	}
	
	.video_box .box_inner ul li a span.info_desc,
	.video_box .box_inner ul li a span.info_photo{
		margin-bottom:1em;
	}
	
	.video_box .box_inner ul li a span.info_desc,
	.video_box .box_inner ul li a span.info_link{
		color:#000000;
		text-decoration:none;
	}
	
	.video_box .box_inner ul li a span.info_desc{
		font-size: 1.2em;
	}
	
	.bulk_box .box_inner{
		text-align:center;
	}
	
	.bulk_box .box_inner .education_video{
		margin-bottom:1em;
	}
	
	.bulk_box .box_inner ul{
		list-style: disc;
		line-height: 1.5;
		width: 22%;
		margin: 0 auto;
		text-align: left;
	}
	
	.sps_new_box .box_inner > .sps_list{
		margin-bottom:1em;
	}
	
	.sps_new_box .box_inner > .sps_list > ul{
		display: flex;
		justify-content: center;
	}
	
	.sps_new_box .box_inner > .sps_list > ul li{
		margin-right:2em;
	}
	
	.sps_new_box .box_inner > .sps_list > ul li:last-child{
		margin-right:0;
	}
	
	.sps_new_box .box_inner > .sps_list > ul li .sps_desc{
		text-align:center;
	}
	
	.catalog_list ul{
		display: flex;
		justify-content: center;
	}
	
	.catalog_list ul li{
		margin-right: 15em;
	}
	
	.catalog_list ul li:last-child{
		margin-right:0;
	}
	
	.catalog_list ul li{
		text-align:center;
		line-height: 1.5;
	}
	
	.catalog_list ul li a,
	.catalog_list ul li a span{
		display:block;
	}
	
	.catalog_list ul li a span.sps_desc{
		margin-top:0.5em;
	}
	
	.sp2_newver_box .box_inner .sp2_box{
		text-align:center;
		margin-bottom:1em;
	}
	
	.sp2_newver_box .box_inner .sp2_box .info_desc{
		margin:0.8em 0 1em 0;
		line-height:1.6;
	}
	
	.sp2_newver_box .box_inner .char_box{
		width: 61%;
		margin:0 auto;
	}
	
	.sp2_newver_box .box_inner .char_box ul{
		list-style:disc;
		line-height:1.5;
	}
	
	.sp2_newver_box .box_inner .char_box ul li{
		margin-bottom:0.5em;
	}
	
	.sp2_newver_box .box_inner .char_box ul li:last-child{
		margin-bottom:0;
	}
	
	.new_function_box .box_inner{
		width: 900px;
		margin: 0 auto;
	}
	
	.new_function_box .box_inner p{
		line-height:1.5;
	}
	
	





/* ##########SP########## */
@media screen and (max-width:479px) {

	
	.page_content{
		width: 100%;
		margin: 0 0 7vw 0;
	}
		/*お知らせ一覧*/
		.news_list_box > .box_header{
			margin-bottom:3vw;
		}
			
			.news_list_box > .box_header ul{
				display:flex;
				justify-content:center;
				padding:0 2vw;
			}
			
				.news_list_box > .box_header ul li{
					width:23%;
					padding-bottom:11px;
					position:relative;
				}
				
				.news_list_box > .box_header ul li.cat3{
					width:31%;
				}
				
					.news_list_box > .box_header ul li span{
						height:10vw;
						font-size:3.2vw;
						letter-spacing:0;
						padding-left:0;
					}
		
		.news_list_box > .box_inner{
			margin-bottom:5vw;
			padding:0 2vw;
		}

		.news_list_box > .box_inner ul{
			padding: 0 2em;
		}
			
			.news_list_box > .box_inner ul li{
				padding:0.8em 0.5em;
				line-height:1.4;
				flex-wrap:wrap;
			}

			.news_list_box > .box_inner ul li.important_news::before{
				content: "";
				width: 2em;
				aspect-ratio: 1 / 1;
				background: url(../../shared/important_news_icon.gif) no-repeat;
				background-size: contain;
				position: absolute;
				top: calc(50% - 1em + 0.8em);
				left: -2em;
			}

				.news_list_box > .box_inner ul li .entry_date{
					width:auto;
					margin-right:1em;
				}
				
				.news_list_box > .box_inner ul li .entry_category{
					width:auto;
				}
				
					.news_list_box > .box_inner ul li .entry_category span{
						width:26vw;
						height:4.4vw;
						box-sizing:border-box;
						padding-top:0.4vw;
					}
					
				.news_list_box > .box_inner ul li .entry_title{
					width:100%;
					padding-top:0.5em;
				}
				
		/*お知らせ詳細*/
		.entry_detail_box{
			padding: 0 2vw;
			margin:0 2vw;
		}
			
			.entry_detail_box .box_header{
				margin-bottom:5vw;
			}
			
				.entry_detail_box .box_header h3{
					font-size:4vw;
				}
			
					.entry_detail_box .box_header h3:before{
						
					}
			
				.entry_detail_box .box_header .entry_date{
					
				}
			
					.entry_detail_box .box_header .entry_date span{
						width: 26vw;
						height: 4.4vw;
						box-sizing: border-box;
						padding-top: 0.4vw;
						line-height: 4.4vw;
						margin-right:2vw;
					}
			
			.entry_detail_box .box_inner{
				width:100%;
				line-height:1.6;
			}
			
				.entry_detail_box .box_inner p{
					font-size:1em;
				}
		
				.entry_detail_box .box_inner .imgs_box{
					margin-top:3vw;
				}
				
					.entry_detail_box .box_inner .imgs_box ul li img{
						max-width:100%;
					}
			
			.entry_detail_box .box_footer{
				margin-top:5vh;
				padding-top:3vh;
				font-size:3vw;
			}
			
				.entry_detail_box .box_footer a{
					
				}
			
				.entry_detail_box .box_footer a:hover{
					
				}

/*20200428追加分*/
	/*20130404お知らせ*/
	.catalog_box > table thead th,
	.catalog_box > table tbody th,
	.catalog_box > table tbody td{
		padding:1vw;
	}
	
	.catalog_box > table tbody th{
		width:37%;
	}
	
	.catalog_box > table tbody td{
		text-align:center;
	}
	
	.catalog_box > table tbody th .sp_br{
		display:block;
	}
	
	/*バルク貯槽ガス回収システム・研修会*/
	.kenshu_box > .box_inner > dl{
		width:90%;
		box-sizing: border-box;
	}
	
	.kenshu_box > .box_inner > dl dt{
		
	}
	
	.kenshu_box > .box_inner > dl dd{
		
	}
	
	.kenshu_box > .box_inner > dl dd:before{
		
	}
	
	.kenshu_photo_list_box .box_inner ul{
		display:block;
	}
	
	.kenshu_photo_list_box .box_inner ul li{
		width:90%;
		margin:0 auto 5vw auto;
	}
	
	.kenshu_photo_list_box .box_inner ul li .kenshu_photo img{
		max-width:100%;
	}
	
	.kenshu_photo_list_box .box_inner ul li .kenshu_photo ul li{
		margin-bottom:2vw;
	}
	
	/*「セーバープロスマート保安点検調査システム」の紹介・説明ビデオ*/
	.video_box,
	.bulk_box,
	.sps_new_box,
	.sp2_newver_box,
	.new_function_box{
		padding:0 3vw;
	}
	
		.new_function_box .box_inner{
			width:100%;
		}
	
		.video_box img,
		.bulk_box img,
		.sps_new_box img,
		.sp2_newver_box img,
		.new_function_box img{
			max-width:100%;
			height:auto;
		}
		
		.video_box .box_inner ul li a{
			width:100%;
		}
		
		.bulk_box .box_inner ul,
		.sp2_newver_box .box_inner .char_box ul{
			width:calc(100% - 4em);
			box-sizing:border-box;
			padding:0 0 0 1em;
			margin:0 auto;
		}
		
		.catalog_list ul li{
			margin-right:2em;
		}
		
		.sp2_newver_box .box_inner .char_box{
			width:100%;
		}
	
	
	
	
	
	
	
	
	
	
	
	
	

}

/* ##########印刷用########## */
@media print{

}