@charset "utf-8";
.title-since {
	margin-bottom: 50px;
}
.since {
	font-size: 2.9rem;
}
.title-year {
	font-size: 3.6rem;
	color: #e72e35;
	position: relative;
}
.title-year::after {
	content: "";
	position: absolute;
	left: 90px;
	width: 950px;
	top: 29px;
	border-top: 1px solid #e72e35;
}
.img-list li {
	margin-bottom: 37px;
}
.chronology .area {
	width: 1100px;
	margin: 0 auto;
}
.chronology .left {
	width: 260px;
	float: left;
}
.chronology .right {
	width: 800px;
	float: right;
}
.ad {
	color: #e72e35;
	font-size: 2.4rem;
}
.year dt, .year dd {
	display: inline-block;
	margin-bottom: 37px;
	min-width:160px;
}
.year {
	position: relative;
	border-left: 1px solid #e72e35;
	padding-left: 50px;
}
.year dt::before {
	content: "";
	position: absolute;
	left: 0;
	width: 50px;
	top: 20px;
	border-top: 1px solid #e72e35;
}
.year dt::after {
	color: #e72e35;
	font-size: 5px;
	content: "●";
	position: absolute;
	left: -5px;
	width: 50px;
	top: 12px;
}
/*ie,edge 交点がずれるので、非表示*/
_:-ms-lang(x), .year dt::after {
  display: none;
}


.year:first-of-type {
	padding-top: 100px;
}
.year:first-of-type dt::before {
	top: 120px;
}
.year:first-of-type dt::after {
	top: 112px;
}
dd:nth-child(n + 3) {
	margin-left: 165px;
}
.deco-img {
	margin-top: 118px;
}

@media screen and (max-width: 768px) {
.title-since {
	padding: 5%;
}

.chronology .area {
	width: 100%;
}
.chronology .contents {
		display: flex;
flex-flow: row wrap;
	}	
.chronology .left {
	width: 100%;
	order: 2;
}
.chronology .right {
	width: 90%;
	padding: 5%;
	order: 1;
}
.title-year::after {
	content: "";
	position: absolute;
	left: 110%;
	width: 70vw;
	top: 5vh;
	border-top: 1px solid #e72e35;
}
.flexbox {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	height: 220vw; /* ビューポート(幅)を基準に表示高を指定 */
}
.item {
	width: 50%;
}
.img-list li {
	margin-bottom: 0;
}
.year dd {
	display: inline-block;
	margin-bottom: 2rem;
}
dd:nth-child(n + 3) {
	display: inline-block;
	margin-left: 0;
}
.year:first-of-type {
	padding-top: 0;
}
.year:first-of-type dt::before {
	top: 20px;
}
.year:first-of-type dt::after {
	top: 12px;
}
.deco-img {
	margin-top: 40px;
}
	/*端末によって交点がずれるので非表示にする*/	
.year dt::after {
  display: none;
}
}
