@charset "utf-8";

/***************************************************************************
*
* COMPANY STYLE
*
***************************************************************************/

#main .mainPhoto img {
	aspect-ratio: 4320 / 960;
	object-fit: cover;
}
#content {
	margin-top: 65px;
}

/*areaIntro*/
.areaIntro {
	padding: 82px 0 82px;
	text-align: center;
	margin-bottom: 64px;
}
.areaIntro.company {
	background: url(../images/company/vision-ttl-01.png) no-repeat left top/296px,
				url(../images/company/vision-ttl-02.png) no-repeat right bottom/261px;
}
.areaIntro .introSub {
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 2px;
}
/*areaIntro*/

/*areaOverview*/
.areaOverview {
	
}
.areaOverview .overViewTable {
	background-image: linear-gradient(to right, #33547C, #3E9ED8);
	padding: 80px 0;
}
.areaOverview .areaTitle {
	margin-bottom: 52px;
}

.areaOverview .overViewMap #map {
	width: 100%;
	height: 521px;
}
.areaOverview .overViewMap .diagram {
	background: url(../images/company/overview-diagram-background.png) no-repeat center center/cover;
}
.areaOverview .overViewMap .diagram .photo {
	position: relative;
	width: 819px;
	margin: 0 auto;
	z-index: -1;
}
/*areaOverview*/

/*tableArea*/
.tableArea {
	/*background: #fff;*/
	box-shadow: 20px 20px 0 0 rgba(255,255,255,0.2);
}
.tableArea .tableRow {
	display: table;
	width: 100%;
	font-size: 20px;
	line-height: 32px;
	border-bottom: 1px solid #CDD6E0;
}
.tableArea .tableRow:first-child .rowName {
	padding: 37px 0 31.5px 87px;
}
.tableArea .tableRow:first-child .rowInfo {
	padding: 37px 0 31.5px 108px;
}
.tableArea .tableRow .rowName {
	display: table-cell;
	vertical-align: middle;
	width: 256px;
	color: #33547c;
	background: #D6E2EF;
	font-weight: bold;
	padding: 32px 0 32px 87px;
	letter-spacing: 2px;
}
.tableArea .tableRow .rowInfo {
	display: table-cell;
	vertical-align: middle;
	padding: 32px 0 32px 108px;
	letter-spacing: 2px;
	background: #fff;
}
/*tableArea*/

/*.areaFactory*/
.areaFactory {
	padding: 80px 0 127px;
	background: url(../images/company/factory-background.jpg) no-repeat top center/cover;
}
.areaFactory .areaTitle {
	margin-bottom: 47px;
}
.areaFactory .areaTitle:after {
	border-color: #597797;
}
.areaFactory .areaTitle .jp  {
	letter-spacing: 0;
}
.areaFactory .areaTitle .en {
	color: rgba(255,255,255,0.25);
}
.areaFactory .factoryGallery {
	background: #fff;
	box-shadow: 20px 20px 0 0 rgba(172,197,224,0.8);
	padding: 48px 44px;
}
.areaFactory .factoryGallery .gallery {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	margin-bottom: 40px;
}
.areaFactory .factoryGallery .gallery:last-child {
	margin-bottom: 0;
}
.areaFactory .factoryGallery .gallery li {
	width: 480px;
}
.areaFactory .factoryGallery .gallery li img {
	aspect-ratio: 480 / 320;
}
/*areaFactory*/

/*areaHistory*/
.areaHistory {
	background-image: linear-gradient(to right, #33547C, #3E9ED8);
	padding: 80px 0 100px;
}
.areaHistory .areaTitle {
	margin-bottom: 49px;
}
.areaHistory .areaTitle .jp  {
	letter-spacing: 0;
}
.areaHistory .tableArea .tableRow .rowName {
	width: 312px;
    padding: 42px 0 43px 87px;
	letter-spacing: 1px;
}
.areaHistory .tableArea .tableRow .rowInfo {
	padding: 42px 0 43px 54px;
}
.areaHistory .tableArea .tableRow:first-child .rowName {
    padding: 49px 0 41.5px 87px;
}
.areaHistory .tableArea .tableRow:first-child .rowInfo {
	padding: 49px 0 41.5px 54px;
}
/*areaHistory*/


/*SP STYLE*/
@media (max-width: 768px) {
	#main .mainPhoto img {
		aspect-ratio: 2250 / 672;
		object-fit: cover;
	}
	#content {
		margin-top: 27px;
	}
	/*areaIntro*/
	.areaIntro {
	    padding: 0;
	    margin-bottom: 25px;
	}
	
	.areaIntro.company {
	   	background: transparent;
	}
	.areaIntro.company .areaTitle .en {
	    max-width: 57%;
	}
	.areaIntro .introSub {
	    line-height: 24px;
	    text-align: justify;
	    letter-spacing: 0;
	}
	/*areaIntro*/

	

	/*areaOverview*/
	.areaOverview {

	}
	.areaOverview .areaTitle {
	    margin-bottom: 26px;
	}
	.areaOverview .areaTitle .en {
		max-width: 50%;
	}
	.areaOverview .overViewTable {
	    background-image: linear-gradient(to right, #33547C, #3E9ED8);
	    padding: 39px 0 24px;
	}
	.areaOverview .overViewMap #map {
	    width: 100%;
	    height: 260px;
	}
	.areaOverview .overViewMap #map iframe {
		height: 100%;
	}
	.areaOverview .overViewMap .diagram {
	    background: transparent;
	}
	.areaOverview .overViewMap .diagram .photo {
	    width: 100%;
	}
	/*areaOverview*/

	/*tableArea*/
	.tableArea {
		box-shadow: none;
	}
	.tableArea .tableRow {
	    font-size: 16px;
	    line-height: 24px;
	    border-bottom: none;
	}
	.tableArea .tableRow .rowName {
	    display: block;
	    width: 100%;
	    text-align: center;
	    padding: 10px 0;
	}
	.tableArea .tableRow:first-child .rowName {
	    padding: 10px 0;
	}
	.tableArea .tableRow:first-child .rowInfo {
	    padding: 10px 0;
	}
	.tableArea .tableRow .rowInfo {
	    display: block;
	    width: 100%;
	  	text-align: center;
	    padding: 10px;
	    letter-spacing: 1.5px;
	}
	.tableArea .tableRow .rowInfo.rowPd {
		text-align: justify;
		letter-spacing: -1px;
	}
	/*tableArea*/

	/*areaFactory*/
	.areaFactory {
		background: url(../images/company/factory-background-sp.jpg) no-repeat top center/cover;
		padding: 30.5px 0 25px;
	}
	.areaFactory .areaTitle {
		padding-bottom: 50px;
		margin-bottom: 24px;
	}
	.areaFactory .areaTitle .en {
		line-height: 0.9;
	}
	.areaFactory .areaTitle .en {
	    /*top: -21px;*/
	    max-width: 65%;
	}
	.areaFactory .factoryGallery {
	    box-shadow: none;
	    padding: 20px 19px;
	}
	.areaFactory .factoryGallery .gallery {
		flex-direction: column;
		margin-bottom: 12px;
	}
	.areaFactory .factoryGallery .gallery:last-child {
		margin-bottom: 0;
	}
	.areaFactory .factoryGallery .gallery li {
	    width: 100%;
	}
	.areaFactory .factoryGallery .gallery li + li {
		margin-top: 12px;
	}
	.areaFactory .factoryGallery .gallery li img {
		aspect-ratio: unset;
	}
	/*areaFactory*/

	/*areaHistory*/
	.areaHistory {
	}
	.areaHistory {
	    padding: 42px 0 24px;
	}
	.areaHistory .areaTitle {
	    margin-bottom: 25px;
	}
	.areaHistory .areaTitle .en {
		max-width: 42%;
	}
	.areaHistory .tableArea .tableRow .rowName {
		width: 100%;
	    padding: 10px 0;
	}
	.areaHistory .tableArea .tableRow .rowInfo {
		text-align: justify;
		padding: 10px 12px;
		letter-spacing: -0.5px;
	}
	.areaHistory .tableArea .tableRow:first-child .rowName {
	    padding: 10px 0;
	}
	.areaHistory .tableArea .tableRow:first-child .rowInfo {
	    padding: 10px 12px;
	}
	/*areaHistory*/

}