@charset "utf-8";

#visual{
	padding: 16px 0 43px;
	background: url(../../img/title_bar.png) left 0 bottom 20px repeat-x;
	position: relative;
}
#visual:before{
	content: '';
	display: block;
	position: fixed;
	top: -1px;
	left: 0;
	width: 100%;
	height: 311px;
	background: url(../img/bg.jpg) center top no-repeat;
	background-size: cover;
	z-index: -1;
}
#visual p{
	line-height: 0;
	text-align: center;
}
#visual p.icn{
	position: absolute;
	bottom: -12px;
	left: 0;
	width: 100%;
	text-align: center;
}

.about{
	margin: 0 auto 110px;
}
.about .img{
	float: left;
	line-height: 0;
	margin-top: 50px;
}
.about>table{
	width: 700px !important;
	float: right;
	margin: 0 10px 0 auto;
}
.about>table>tbody>tr{
	background: url(../img/bar.png) left bottom repeat-x;
}
.about>table th{
	font-size: 1.5rem;
	line-height: 25px;
	padding: 26px 0 13px;
	width: 120px;
	font-weight: normal;
	text-align: left;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	vertical-align: top;
}
.about>table td{
	font-size: 1.8rem;
	line-height: 25px;
	padding: 24px 20px 10px 0;
	text-align: left;
	vertical-align: top;
	position: relative;
}
.about table td small{
	font-size: 1.5rem;
}
.about table td a{
	color: #000;
}
.about>table td a.map{
	position: absolute;
	top: 10px;
	right: 0;
	padding-top: 2px;
}
.about>table td a.map:hover{
	padding-top: 0;
}
.about>table td>table th{
	padding: 0;
	line-height: 32px;
	width: 196px;
}
.about>table td>table td{
	padding: 0;
	line-height: 30px;
}

.company-Map{
	margin-bottom: 65px;
	padding-bottom: 12px;
	position: relative;
}
.company-Map::before{
	content: '';
	width: 100%;
	background: url("../img/map_bg3.png") repeat center top;
	display: block;
	position: absolute;
	left: 0;
	top: 180px;
	bottom: 0;
}
.company-Map_Row{
	width: 1380px;
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
	margin-inline: auto;
	padding-inline: 20px;
	position: relative;
	z-index: 10;
}
.company-Map_Row + .company-Map_Row{
	margin-top: 55px;
}
.company-Map_Row::before{
	content: '';
	width: 100%;
	background-color: #3c82b4;
	display: block;
	position: absolute;
	left: 0;
	top: 180px;
	bottom: 25px;
	opacity: .4;
}
.company-Map_Item{
	width: 660px;
	text-align: left;
	position: relative;
	z-index: 10;
}
.company-Map_Title{
	position: absolute;
	top: -50px;
	z-index: 10;
}
.company-Map_Item:nth-of-type(1) .company-Map_Title{
	left: 120px;
}
.company-Map_Item:nth-of-type(2) .company-Map_Title{
	right: 120px;
}
.company-Map_Content{
	height: 400px;
	overflow: hidden;
}
.company-Map_Iframe{
	transform: translateY(-150px);
	vertical-align: bottom;
}
.company-Map_Text{
	font-size: 1.3rem;
	line-height: 20px;
	text-align: center;
	margin-top: 25px;
}
.company-Map_Text a{
	color: #323232;
}

#map{
	background: url(../img/map_bg.png) left bottom repeat-x;
	margin: 0 auto 65px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
#map:after{
	content: '';
	position: absolute;
	bottom: 40px;
	left: 0;
	background: url(../img/map_bg2.png) center top no-repeat;
	width: 100%;
	height: 240px;
}
#map #map1,
#map #map2{
	float: left;
	width: 660px;
	position: relative;
	padding: 45px 0 0;
	z-index: 1;
}
#map #map1 h3{
	line-height: 0;
	position: absolute;
	top: 0;
	left: 120px;
}
#map #map2 h3{
	line-height: 0;
	position: absolute;
	top: 0;
	right: 120px;
}
#map #maps1,
#map #maps2{
	width: 100%;
	height: 400px;
}
#map #map1{
	margin-left: -120px;
}
#map #map2{
	float: right;
	margin-right: -120px;
}
#map #map1 p,
#map #map2 p{
	font-size: 1.3rem;
	line-height: 20px;
	text-align: center;
	margin: 35px auto 12px;
}
#map #map1 p a,
#map #map2 p a{
	color: #323232;
}


.story{
	margin: 0 auto 147px;
	position: relative;
}
.story h3{
	margin: 0 auto 5px;
	text-align: center;
}
.story h3>span{
	display: inline-block;
	width: 140px;
	line-height: 54px;
	border: 2px solid #82C0DA;
	font-size: 2.5rem;
	font-weight: normal;
}
.story .left{
	width: 740px;
	float: left;
	margin: 5px auto 0 40px;
}
.story table{
	margin: 0 auto 80px;
}
.story table tr{
	background: url(../img/bar.png) left bottom repeat-x;
}
.story table th,
.story table td{
	font-size: 1.3rem;
	line-height: 20px;
	text-align: left;
	font-weight: normal;
	padding: 21px 0 9px;
	vertical-align: top;
}
.story table th{
	width: 120px;
}
.story table th span{
	display: inline-block;
	vertical-align: top;
	width: 2.5em;
	text-align: right;
}
.story .img{
	line-height: 0;
	float: right;
	margin-right: 10px;
}
.story .img2{
	line-height: 0;
	margin-left: -30px;
	text-align: left;
}
.story .img3{
	position: absolute;
	bottom: 0;
	right: 320px;
	line-height: 0;
}

.relation{
	background: url("../img/bg2.png");
	padding-bottom: 60px;
	margin: 0 auto 53px;
	position: relative;
}
.relation h3{
	width: 1100px;
	margin: 0 auto 5px;
	text-align: center;
	position: relative;
	top: -30px;
}
.relation h3>span{
	display: inline-block;
	width: 180px;
	line-height: 54px;
	background: #fff;
	border: 2px solid #82C0DA;
	font-size: 2.5rem;
	font-weight: normal;
}
.relation .inner{
	width: 760px;
	display: flex;
	flex-direction: row-reverse;
	column-gap: 80px;
	margin: 12px auto 0;
}
.relation .inner .text, 
.relation .inner .image{
	flex: 1;
}
.relation .inner .text h4{
	font-size: 1.8rem;
	font-weight: normal;
	line-height: 20px;
	text-align: left;
}
.relation .inner .text p{
	font-size: 1.5rem;
	line-height: 25px;
	text-align: left;
	margin-top: 10px;
}
.relation .inner .text table{
	margin-top: 23px;
}
.relation .inner .text table tr{
	background: url(../img/bar2.png) left bottom repeat-x;
}
.relation .inner .text table tr:first-child{
	background: url(../img/bar2.png) left bottom repeat-x, url(../img/bar2.png) left top repeat-x;
}
.relation .inner .text table tr:first-child th,
.relation .inner .text table tr:first-child td{
	padding-top: 25px;
}
.relation .inner .text table th,
.relation .inner .text table td{
	font-size: 1.3rem;
	line-height: 20px;
	font-weight: normal;
	text-align: left;
	box-sizing: border-box;
	vertical-align: top;
}
.relation .inner .text table th{
	width: 100px;
	padding: 21px 0 9px 20px;
}
.relation .inner .text table td{
	padding: 21px 0 9px;
}
.relation .inner .text table a{
	color: #323232;
}
.relation .inner .text table a:hover{
	text-decoration: underline;
	opacity: .7;
}
.relation .inner .image img{
	border: 1px solid #323232;
}