@charset "UTF-8";

.hi-con-fr {
  background: #b8c6d1;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  width:100%;
}
.hi-con-photo-area {
  background: #ffffff;
  border-radius: 3.75rem 3.75rem 0rem 0rem;
  padding: 13rem 22.5rem 17.875rem 21.875rem;
  display: flex;
  flex-direction: row;
  gap: 0.625rem;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.hi-con-photo-area-inner{ width: 250px;display: flex;flex-direction: column;gap: 7.5rem;align-items: flex-end;justify-content: flex-start;flex-shrink: 0;width: 15.625rem;position: relative;padding-top:20px;}
.hi_photo{margin: 20px 70px 20px 0;  align-self: stretch;  flex-shrink: 0;  height: 15.941875rem;  position: relative;  object-fit: cover;  aspect-ratio: 250/255.07;}
.hi_photo img{width: 220px; height: 160px;}/*** <--이 라인 추가 ****/

/*.timeline-box{padding-left: 60px;}*/





.timeline-wrap{position:relative; /*padding:120px 0*/;display: inline-flex;}
.timeline-mini-box{display:flex;padding:0 0 80px 110px;flex-wrap:wrap;align-items:flex-start;}
.timeline-mini-box:last-of-type{padding:0;}
.timeline-mini-box .h4-tit01{width:140px;letter-spacing:-0.023rem;box-sizing:border-box;background:none;padding:0;padding-left:150px;}
.timeline-mini-box .timeline{width:calc(100% - 150px);}
.timeline-mini-box .timeline > ul > li{display:flex;padding:0 0 25px;flex-wrap:wrap;align-items:flex-start;}
.timeline-mini-box .timeline > ul > li:last-of-type{padding:0;}
.timeline-mini-box .timeline > ul > li .date{padding:0 82px 0 0;width:160px;font-size:1.5rem;line-height:2rem;letter-spacing:-0.023rem;text-align:right;box-sizing:border-box;}
.timeline-mini-box .timeline > ul > li .content{padding:0 0 0 170px;width:calc(100% - 20px);font-size:1.125rem;line-height:1.75rem;color:#555;font-weight:200;letter-spacing:-0.029rem;box-sizing:border-box;}
.timeline-mini-box .timeline > ul > li .content li{position:relative;padding:0 0 5px 10px;font-size:1.125rem;line-height:1.625rem;font-weight:200;box-sizing:border-box;}
.timeline-mini-box .timeline > ul > li .content li:before{content:'';display:block;position:absolute;top:12px;left:0;border-radius:50%;width:2px;height:2px;background:#222;}
.timeline-mini-box .timeline > ul > li .content li:last-of-type{padding-bottom:0;}
.scroll-bar-container{position:absolute;top:0;left:800px;width:2px;height:100%;background:#dcdcdc;}
.scroll-bar{position:absolute;top:0;left:0;width:2px;height:10px;background-color:#1E4FC2;transition:all .5s;}
.scroll-bar:after{content:'';display:block;position:absolute;left:50%;bottom:0;transform:translate(-50%,100%);width:14px;height:14px;border-radius:50%;background:#1E4FC2;box-sizing:border-box;}


@media screen and (max-width: 1024.98px) {
	.timeline-mini-box{padding:0 0 60px;}
	.timeline-mini-box .h4-tit01{width:144px;}
	.timeline-mini-box .timeline{width:calc(100% - 144px);}
	.timeline-mini-box .timeline > ul > li .date{padding:0 46px 0 0;width:120px;}
	.timeline-mini-box .timeline > ul > li .content{padding:0 0 0 32px;width:calc(100% - 120px);}
	.scroll-bar-container{left:264px;}
}

@media screen and (max-width: 768px) {
	.timeline-mini-box{padding:0 0 50px;}
	.timeline-mini-box .h4-tit01{width:100%;}
	.timeline-mini-box .timeline{width:100%;}
	.timeline-mini-box .timeline > ul > li{padding:0 0 15px;}
	.timeline-mini-box .timeline > ul > li .date{padding:0 38px 0 0;width:90px;font-size:1.285rem;line-height:1.857rem;}
	.timeline-mini-box .timeline > ul > li .content{padding:0 0 0 20px;width:calc(100% - 90px);font-size:1rem;line-height:1.5rem;}
	.timeline-mini-box .timeline > ul > li .content > li{padding:0 0 2px 8px;font-size:1rem;line-height:1.5rem;}
	.timeline-mini-box .timeline > ul > li .content > li:before{top:10px;}
	.scroll-bar-container{top:0;left:90px;height:100%;}
}