@charset "utf-8";
/* *******************************************************
 * filename : history.css
 * description : 연혁 관련 CSS
 * date : 2020-03-06
******************************************************** */

/*  ****************** 회사소개 :: BEST 연혁 01 ********************** */
/* History :: Layout */
.company-history {position:relative;}
.company-history-wrapper {position:relative; padding-bottom:50px; *zoom:1;}
.company-history-wrapper:after{clear:both; display:block; content:"";}
.company-history-wrapper:before{position:absolute; top:3px; height:100%; width:1px; left:50%; background-color:#e5e5e5; content:"";}
.company-history-wrapper:last-child:before{display:none;}
.company-history-info-box {position:relative; width:50%; }
.company-history-info-box::after{ position:absolute; top:3px; width:9px; height:9px; background-color:#fff; border: 3px solid #3686ff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; content:""; }
/* History :: 정보 */
.company-history-info .history-item{position:relative; font-size:18px; letter-spacing: -0.25px; line-height:1.6; font-weight:300; color:#444; margin-bottom:25px; word-break:keep-all;}
.company-history-info .history-month{position:absolute; top:1px; color:#000; font-weight:700; }
.company-history-info .history-txt{position:relative; display:inline-block; font-size:16px; color: #888; font-family:'Noto Sans KR'}
.company-history-year {position:absolute; top:-5px; text-align:center; font-size:32px; letter-spacing: -0.5px; color:#333; font-weight: 600; }
/* History :: 이미지 */
.company-history-img-box{width:50%; margin-top:50px; }
.company-history-img-box span{display:inline-block; max-width:400px; box-shadow:15px 15px 20px rgb(0,0,0,0.24);}
.company-history-img-box span img{max-width:100%;}
.ie-browser .company-history-img-box span img{width:100%;}
@media all and (min-width:801px){
	/* History :: 왼쪽 */
	.history-left .company-history-info-box{float:left;}
	.history-left .company-history-info-box::before,
	.history-left .company-history-info-box::after {left:100%; transform:translatex(-50%)}
	.history-left .company-history-info {text-align:right; padding-right: 40px;}
	.history-left .company-history-info .history-item{padding-right: 30px; }
	.history-left .company-history-info .history-month{right:0;}
	.history-left .company-history-info .history-txt{padding-right:15px; }
	.history-left .company-history-info .history-txt::before{right:0;}
	.history-left .company-history-year {left:100%; padding-left:55px;}
	.history-left .company-history-year:before{left:0}
	.history-left .company-history-img-box{float:right; text-align:right;}
	.history-left .company-history-img-box span{margin-left:55px}
	/* History :: 오른쪽 */
	.history-right .company-history-info-box{float:right; }
	.history-right .company-history-info-box::before,
	.history-right .company-history-info-box::after {right:100%; transform:translatex(50%)}
	.history-right .company-history-info {padding-left: 40px;}
	.history-right .company-history-info .history-item{padding-left: 22px;}
	.history-right .company-history-info .history-month{left:0;}
	.history-right .company-history-info .history-txt{padding-left:15px; }
	.history-right .company-history-info .history-txt::before{left:0;}
	.history-right .company-history-list-wrap .company-history-year {right:100%; padding-right:55px;}
	.history-right .company-history-list-wrap .company-history-year:before{right:0}
	.history-right .company-history-img-box{float:left; }
	.history-right .company-history-img-box span{margin-right:55px}
}
@media all and (max-width:800px){
	/* History :: Layout */
	.company-history-wrapper:before{left:10px;}
	.company-history {padding:0 15px 0 0;}
	.company-history-info-box{width:auto; padding-left:100px}
	.company-history-info-box::before{top:-3px; left:0; width:15px; height:15px; border-width:3px;}
	.company-history-info-box::after{top:4px;left:7px; width:5px; height:5px; border-width:1px; }
	/* History :: 정보 */
	.company-history-info .history-item{font-size:13px; padding-left:25px;}
	.company-history-info .history-month{left:0;}
	.company-history-info .history-txt {font-size:13px;}
	.company-history-year{top:0px;font-size:18px; padding-left:20px; left:10px;}
	.company-history-year::before{width:20px; left:0; }
	/* History :: 이미지 */
	.company-history-img-box{width:auto; margin-top:20px}
	.company-history-img-box span{margin-left:100px;}
}