﻿
@import url("about.css");
.history >li{
	display:flex;
	flex-wrap:wrap;
}
.history h4{
	font-weight:300;
	position:relative;
	font-size:1.176em;
}

.history >li:last-of-type h4{
	align-self: flex-start;
	padding-bottom:0;
}
.history >li:last-of-type .cont{
	margin-bottom:0;
}
.history h4:after{
	content:"";
	display:block;
	width:11px;
	height:11px;
	background:#000000;
	border-radius:50%;
	position:absolute;
	top:0.5em;
	margin:auto;
}
.history .cont{
	font-size:0.824em;
	padding-top:0.5em;
}
/*PC
----------------------------------------------------*/
@media screen and (min-width:1081px),print{
/*	.tleStyle1{
		margin-bottom:60px;
	}*/
	.history h4{
		padding-bottom:50px;
	}
	.history .cont{
		width:897px;
		margin-bottom:40px;
	}
	.history figure{
		margin-top:25px;
	}



}
/*PC and Tablet
----------------------------------------------------*/
@media screen and (min-width:751px),print{
	.history h4{
		width:140px;
	}
	.history >li:first-of-type h4:before{
		transform: translateY(0.5em);
	}
	.history >li:last-of-type h4:before{
		transform: translateY(-0.5em);
	}
	.history h4:before{
		content:"";
		display:block;
		width:1px;
		height:100%;
		background:#000000;
		position:absolute;
		top:0;
		right:50px;
		bottom:0;
		margin:auto;
	}
	.history h4:after{
		right:45px;
	}
}
/*Tablet
----------------------------------------------------*/
@media screen and (min-width:751px) and (max-width:1080px){
	.history .cont{
		width:calc(100% - 140px);
	}
}
/*Tablet und Phone
----------------------------------------------------*/
@media screen and (max-width:1080px){
/*	.tleStyle1{
		margin-bottom:5%;
	}*/
	.history{
		padding-bottom:5%;
	}
	.history .cont{
		margin-bottom:5%;
	}
}
/*Phone
----------------------------------------------------*/
@media screen and (max-width:750px){
	.history li{
		position:relative;
	}
	.history li:before{
		content:"";
		display:block;
		width:1px;
		height:100%;
		background:#000000;
		position:absolute;
		left:0;
		top:0;
		bottom:0;
	}
	.history li:first-child:before{
		bottom:auto;
		top:1em;
	}
	.history li:last-child:before{
		height:1em;
		bottom:auto;
	}
	.history h4{
		width:4em;
		padding-left:1em;
		box-sizing:border-box;
	}
	.history h4:after{
		left:-5px;
	}
	.history .cont{
		padding-left:1em;
		width:calc(100% - 7em);
	}
	.history figure{
		margin-top:3%;
	}
}