@charset "utf-8";
@import url("animate.css");
/* ------------------------------------------------------------------------------------- PARTS */
.animated{
	opacity: 0;
}
.chronologySec.kubota h2{
		background-color: rgba(78,152,126,1.00);
	}
	.chronologySec.panasonic h2{
		background-color: rgba(85,140,169,1.00);
	}
	.chronologySec.kmew h2{
		background-color: #036994;
	}
	.chronologySec.kubota h3{
		color: rgba(78,152,126,1.00);
	}
	.chronologySec.panasonic h3{
		color: rgba(85,140,169,1.00);
	}
	.chronologySec.kmew h3{
		color: #000000;
	}
@media print, screen and (min-width:751px) {
	#historyHead{
		margin: 0 auto;
		width: 79.06%;
    max-width: 1080px;
	}
	#historyHead .main{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 34px;
		font-weight: 700;
		line-height: 1.47;
	}
	#historyHead .sub{
		margin-top: 30px;
	}
	
	#historyContents{
		margin: 0 auto;
    width: 79.06%;
    max-width: 1080px;
	}
	#chronology1{
		display: flex;
		justify-content: space-between;
	}
	#chronology1 > .chronologySec{
		position: relative;
		padding-bottom: 58px;
		width: 44.2%;
	}
	#chronology2{
		margin: 0 auto;
		width: 48.1%;
		position: relative;
	}
	#chronology1 > .chronologySec:before,
	#chronology2 > .chronologySec:before,
	#chronology2 > .chronologySec:after{
		background-color: #BCBCBC;
		content: "";
		position: absolute;
		z-index: -1;
	}
	#chronology1 > .chronologySec:before,
	#chronology2 > .chronologySec:before{
		height: 100%;
		width: 9px;
		top: 0;
		left: 50%;
		-webkit-transform: translateX(-50%); /* Safari用 */
		transform: translateX(-50%);
	}
	#chronology2 > .chronologySec:after{
		height: 9px;
		width: 100%;
		top: 0;
		left: 0;
	}
	#chronology2{
		margin: -9px auto 0;
		width: 56.73%;
		position: relative;
	}
	#chronology2 > .chronologySec{
		margin: -9px auto 0;
		padding-top: 65px;
		width: 84.74%;
	}
	
	.chronologySec h2{
		border-radius: 5px;
		color: #FFF;
		font-size: 20px;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		text-align: center;
		padding: 15px;
	}
	.chronologySec h2 > span{
		font-size: 16px;
	}
	
	
	.chronologySec .chronology > li{
		margin-top: 10px;
	}
	.chronologySec .chronology > .item{
		background-color: #FFF;
		border-radius: 5px;
		border: 1px solid #D8D8D8;
		padding: 15px 10px 15px;
		text-align: center;
	}
	.chronologySec .chronology > .item > h3{
		font-size: 28px;
		font-family: 'Roboto', sans-serif;
		font-weight: 700;
		line-height: 1.14;
	}
	.chronologySec .chronology > .item > p{
		font-size: 16px;
		margin-top: 2px;
	}
	
	.chronology > .item .imageList{
		text-align: center;
		font-size: 0;
		margin: 20px 20px 0;
	}
	.chronology > .item .imageList > dl{
		display: inline-block;
		font-size: 0;
		width: 45.5%;
	}
	.chronology > .item .imageList > dl:nth-child(2n){
		margin-left: 9%;
	}
	.chronology > .item .imageList > dl > dt img{
		height: auto;
		width: 100%;
	}
	.chronology > .item .imageList > dl > dd{
		margin-top: 10px;
		font-size: 13px;
	}
	.chronology > .item > p > a{
		background: url("../../common_site/img/ic_arrow_brack.webp") left center no-repeat;
		background-size: 18px auto;
		color: #000;
		padding: 0.3em 0 0.3em 25px;
	}
	.chronology > .item .imageList > dl > dd > a{
		background: url("../../common_site/img/ic_arrow_brack.webp") left center no-repeat;
		background-size: 13px auto;
		color: #000;
		padding-left: 20px;
	}
	
	
	.kubota .chronology > li:nth-child(2){
		margin-top: 135px
	}
	.kubota .chronology > li:nth-child(3){
		margin-top: 130px
	}
	.kubota .chronology > li:nth-child(5){
		margin-top: 250px
	}
	.kubota .chronology > li:nth-child(8){
		margin-top: 115px
	}
	.kubota .chronology > li:nth-child(9){
		margin-top: 290px
	}

	
	
	.panasonic .chronology > li:nth-child(1){
		margin-top: 80px
	}
	.panasonic .chronology > li:nth-child(2){
		margin-top: 20px
	}
	.panasonic .chronology > li:nth-child(3){
		margin-top: 50px
	}
	.panasonic .chronology > li:nth-child(4){
		margin-top: 260px
	}
	.panasonic .chronology > li:nth-child(5){
		margin-top: 20px
	}
	.panasonic .chronology > li:nth-child(6){
		margin-top: 220px
	}
	.panasonic .chronology > li:nth-child(8){
		margin-top: 130px
	}
	.panasonic .chronology > li:nth-child(9){
		margin-top: 20px
	}
	.panasonic .chronology > li:nth-child(10){
		margin-top: 20px
	}
	
	
	
	.kmew .chronology > li:nth-child(1),
	.kmew .chronology > li:nth-child(4),
	.kmew .chronology > li:nth-child(13){
		border: 1px solid #444444;
		background-color: #444444;
		color: #FFF;
	}
	.kmew .chronology > li:nth-child(1) h3,
	.kmew .chronology > li:nth-child(4) h3,
	.kmew .chronology > li:nth-child(13) h3{
		color: #FFF;
	}
	.kmew .chronology > li:nth-child(1) p,
	.kmew .chronology > li:nth-child(4) p,
	.kmew .chronology > li:nth-child(13) p{
		font-size: 20px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    text-align: center;
	}
	.kmew .chronology > li:nth-child(2){
		margin-top: 30px;
	}
	.kmew .chronology > li:nth-child(3){
		margin-top: 20px;
	}
	.kmew .chronology > li:nth-child(9){
		margin-top: 20px;
	}
	.kmew .chronology > li:nth-child(12){
		margin-top: 20px;
	}
	.kmew .chronology > li:nth-child(13){
		margin-top: 20px;
		padding-bottom: 25px;
	}
	.kmewcorp{
		margin-top: 40px;
	}
	
	.img_logo1 {
		background-color: #fff;
		border-radius: 5px;
		margin: 16px 20px 0;
		padding: 12px 0 0;
		text-align: center;
	}
	.img_logo1 img {
		max-width: 374px;
		vertical-align: bottom;
		width: 100%;
	}
	
}
@media print, screen and (min-width:1025px) {

}
@media screen and (max-width: 1024px) and (min-width: 751px) {

}
@media screen and (max-width: 750px) {
	#historyHead{
		margin: 0 20px;
	}
	#historyHead .main{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 17px;
		font-weight: 700;
		line-height: 1.47;
	}
	#historyHead .sub{
		margin-top: 20px;
	}
	
	#historyContents{
		margin: 0 20px;
	}
	#chronology1{
		display: flex;
		justify-content: space-between;
	}
	#chronology1 > .chronologySec{
		position: relative;
		padding-bottom: 35px;
		width: 47.8%;
	}
	#chronology2{
		position: relative;
	}
	#chronology1 > .chronologySec:before,
	#chronology2 > .chronologySec:before,
	#chronology2 > .chronologySec:after{
		background-color: #BCBCBC;
		content: "";
		position: absolute;
		z-index: -1;
	}
	#chronology1 > .chronologySec:before,
	#chronology2 > .chronologySec:before{
		height: 100%;
		width: 9px;
		top: 0;
		left: 50%;
		-webkit-transform: translateX(-50%); /* Safari用 */
		transform: translateX(-50%);
	}
	#chronology2 > .chronologySec:after{
		height: 9px;
		width: 53.22%;
		top: 0;
		left: 50%;
		-webkit-transform: translateX(-50%); /* Safari用 */
		transform: translateX(-50%);
	}
	#chronology2 > .chronologySec{
		margin: -9px 0 0;
		padding-top: 55px;
	}
	
	.chronologySec h2{
		border-radius: 5px;
		color: #FFF;
		display: flex;
		font-size: 16px;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 700;
		line-height: 1.375;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		height: 60px;
		width: 100%;
	}
	.chronologySec h2 > span{
		font-size: 14px;
		display: block;
	}
	
	
	.chronologySec .chronology > li{
		margin-top: 10px;
	}
	.chronologySec .chronology > .item{
		background-color: #FFF;
		border-radius: 5px;
		border: 1px solid #D8D8D8;
		padding: 15px 5px 15px;
		text-align: center;
	}
	.chronologySec .chronology > .item > h3{
		font-size: 22px;
		font-family: 'Roboto', sans-serif;
		font-weight: 700;
		line-height: 1.14;
	}
	.chronologySec .chronology > .item > p{
		font-size: 13px;
		margin-top: 2px;
		line-height: 1.54;
	}
	
	.chronology > .item .imageList{
		text-align: center;
		font-size: 0;
		margin: 0 20px;
	}
	.chronology > .item .imageList > dl{
		margin: 20px auto 0;
		font-size: 0;
		width: 64.51%;
	}
	.chronology > .item .imageList > dl > dt img{
		height: auto;
		width: 100%;
	}
	.chronology > .item .imageList > dl > dd{
		margin-top: 10px;
		font-size: 13px;
	}
	.chronology > .item > p > a{
		background: url("../../common_site/img/ic_arrow_brack.webp") left center no-repeat;
		background-size: 15px auto;
		color: #000;
		padding: 0.3em 0 0.3em 20px;
	}
	.chronology > .item .imageList > dl > dd > a{
		background: url("../../common_site/img/ic_arrow_brack.webp") left center no-repeat;
		background-size: 13px auto;
		color: #000;
		padding-left: 20px;
	}
	
	
	.kubota .chronology > li:nth-child(2){
		margin-top: 135px
	}
	.kubota .chronology > li:nth-child(3){
		margin-top: 130px
	}
	.kubota .chronology > li:nth-child(5){
		margin-top: 250px
	}
	.kubota .chronology > li:nth-child(8){
		margin-top: 115px
	}
	.kubota .chronology > li:nth-child(9){
		margin-top: 285px
	}

	
	
	.panasonic .chronology > li:nth-child(1){
		margin-top: 80px
	}
	.panasonic .chronology > li:nth-child(2){
		margin-top: 20px
	}
	.panasonic .chronology > li:nth-child(3){
		margin-top: 50px
	}
	.panasonic .chronology > li:nth-child(4){
		margin-top: 260px
	}
	.panasonic .chronology > li:nth-child(5){
		margin-top: 20px
	}
	.panasonic .chronology > li:nth-child(6){
		margin-top: 225px
	}
	.panasonic .chronology > li:nth-child(8){
		margin-top: 130px
	}
	.panasonic .chronology > li:nth-child(9){
		margin-top: 20px
	}
	.panasonic .chronology > li:nth-child(10){
		margin-top: 20px
	}
	
	
	.kmew .chronology > li:nth-child(1),
	.kmew .chronology > li:nth-child(4),
	.kmew .chronology > li:nth-child(13){
		border: 1px solid #444444;
		background-color: #444444;
		color: #FFF;
	}
	.kmew .chronology > li:nth-child(1) h3,
	.kmew .chronology > li:nth-child(4) h3,
	.kmew .chronology > li:nth-child(13) h3{
		color: #FFF;
	}
	.kmew .chronology > li:nth-child(1) p,
	.kmew .chronology > li:nth-child(4) p,
	.kmew .chronology > li:nth-child(13) p{
		font-size: 14px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    text-align: center;
	}
	.kmew .chronology > li:nth-child(2){
		margin-top: 30px;
	}
	.kmew .chronology > li:nth-child(3){
		margin-top: 20px;
	}
	.kmew .chronology > li:nth-child(9){
		margin-top: 20px;
	}
	.kmew .chronology > li:nth-child(12){
		margin-top: 20px;
	}
	.kmew .chronology > li:nth-child(13){
		margin-top: 20px;
		padding-bottom: 20px;
	}
	.kmewcorp{
		margin-top: 40px;
	}
	
	.img_logo1 {
		background-color: #fff;
		border-radius: 5px;
		margin: 16px 15px 0;
		padding: 2.6% 0 0;
		text-align: center;
	}
	.img_logo1 img {
		max-width: 374px;
		vertical-align: bottom;
		width: 100%;
	}
}