@charset "utf-8";

/* 내용관리 */
.history.container{width:100%; max-width:100%}
#container_title{display:none}
#ctt {background:#fff; padding:30px 0 100px}
.ctt_admin {text-align:right}
#ctt header h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#ctt_con {padding:10px 0;line-height:1.6em}
#ctt_con .boundary{max-width:900px;}
#ctt_con img{max-width:100%;height:auto}
.ctt_img {text-align:center}
.divClear {
    clear: both;
    padding: 40px 0;
}
/* https://codepen.io/brady_wright/pen/NNOvrW */

/*-- GENERAL STYLES ------------------------------*/
.timeline {
	line-height: 1.4em;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;	
}
 .timeline .timeline-item {
	 padding-left: 40px;
	 position: relative;
}
 .timeline .timeline-item:last-child {
	 padding-bottom: 0;
}
 .timeline .timeline-info {
    width: 170px;
    height: 70px;
    line-height: 70px;
	font-weight:300;
    padding-right: 50px;
    text-align: right;
    box-sizing: border-box;
    background: #fff;
	color:#000;
    font-size: 40px;
	 text-transform: uppercase;
	 white-space: nowrap;
}
 .timeline .timeline-marker {
	 position: absolute;
	 top: 0;
	 bottom: 0;
	 left: 0;
	 width: 15px;
}
 .timeline .timeline-marker:before {
	background: #222;
    content: "";
    display: block;
    height: 8px;
    position: absolute;
    top: 30px;
    left: 50%;
    margin-left: -4px;
    width: 8px;
	z-index:1;
}
 .timeline .timeline-marker:after {
	 content: "";
	 width: 1px;
	 background: #ebebeb;
	 display: block;
	 position: absolute;
	 top: 30px;
	 margin:25px 0 0;
	 bottom: 0;
	 left: 50%;
}
.ctt_history  #bg_copy3 > div p{font-weight:300}
 .timeline .timeline-item:last-child .timeline-marker:after {
	 content: none;
}
 .timeline .timeline-content {
	 padding-bottom: 45px;
}
 .timeline .timeline-content p:last-child {
	 margin-bottom: 0;
} 
 .timeline .timeline-title {
	 margin-bottom: 30px;	 
	 color:#191919;
	 font-size:18px;
	 font-weight:300
}
 .timeline .timeline-title span{
	 display: inline-block;
    width: 100px;
	color:#000;
    font-weight: 400;
}
.timeline-split{padding-left:100px}
 @media (min-width: 768px) {
	 .timeline .timeline-split .timeline, .timeline .timeline-centered .timeline {
		 display: table;
	}
	 .timeline .timeline-split .timeline-item, .timeline .timeline-centered .timeline-item {
		 display: table-row;
		 padding: 0;
	}
	 .timeline .timeline-split .timeline-info, .timeline .timeline-centered .timeline-info, .timeline .timeline-split .timeline-marker, .timeline .timeline-centered .timeline-marker, .timeline .timeline-split .timeline-content, .timeline .timeline-centered .timeline-content, .timeline .timeline-split .period .timeline-info, .timeline .timeline-centered .period .timeline-info {
		 display: table-cell;
		 vertical-align: top;
	}
	 .timeline .timeline-split .timeline-marker, .timeline .timeline-centered .timeline-marker {
		 position: relative;
	}
	 .timeline .timeline-split .timeline-content, .timeline .timeline-centered .timeline-content {
		 padding-left: 45px;
		 padding-top:30px
	}
	 .timeline .timeline-split .timeline-info, .timeline .timeline-centered .timeline-info {
		 padding-right: 50px;
	}

}
@media (max-width:768px){
		.timeline-split{padding-left:15px}
		 .timeline .timeline-title span{display:block; margin-bottom:10px}
		.timeline .timeline-info{text-align:left; padding-right:0; margin-bottom:15px}
		.timeline .timeline-title{font-size:14px;}
		.timeline .timeline-item{padding-left:30px}
		.timeline .timeline-info{font-size:30px; height:52px;}
		.timeline .timeline-title span{font-size:16px;}
		.divClear{display:none}
}
 @media (min-width: 992px) {
	 .timeline .timeline-centered, .timeline .timeline-centered .timeline-item, .timeline .timeline-centered .timeline-info, .timeline .timeline-centered .timeline-marker, .timeline .timeline-centered .timeline-content {
		 display: block;
		 margin: 0;
		 padding: 0;
	}
	 .timeline .timeline-centered .timeline-item {
		 padding-bottom: 40px;
		 overflow: hidden;
	}
	 .timeline .timeline-centered .timeline-marker {
		 position: absolute;
		 left: 50%;
		 margin-left: -7.5px;
	}
	 .timeline .timeline-centered .timeline-info, .timeline .timeline-centered .timeline-content {
		 width: 50%;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(odd) .timeline-info {
		 float: left;
		 text-align: right;
		 padding-right: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(odd) .timeline-content {
		 float: right;
		 text-align: left;
		 padding-left: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(even) .timeline-info {
		 float: right;
		 text-align: left;
		 padding-left: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(even) .timeline-content {
		 float: left;
		 text-align: right;
		 padding-right: 30px;
	}

}
 