.text_red {color: #C30D23}

.greetings {margin-bottom: -120px;}
.greetings_title {padding: 0 0 60px;}
.greetings_title h2 {line-height: 1.4em; color:#222}
.greetings_title strong {color:#1898c8; font-weight:800}
.greetings_title p {line-height: 1.3em; word-break: keep-all;}
.greetings_desc {padding: 70px 0 80px; position: relative;}
.greetings_desc::after {content: ""; display: inline-block; width: 100vw; height: 100%; background: #f5f6f6; position: absolute; left: 50%; top: 0; transform: translateX(-50%); z-index: 0;}
.greetings_desc .container {display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap;}
.greetings_desc .left {width: 63%; padding-right:60px; z-index: 1;}
.greetings_desc .sub_content_box {display: flex; flex-direction: column; row-gap: 40px;}
.greetings_desc p {color: #666; line-height: 1.8em; letter-spacing: -0.03em; font-weight: 300;}
.greetings_desc .right {width: 37%; z-index: 1;}
.greetings_desc .right .img_box {margin-top: -150px; border-radius: 15px; border-top-left-radius: 60px; border-bottom-right-radius: 60px; overflow: hidden; box-shadow: 0 0 1px rgba(0,0,0,0.2);}
.greetings_desc .right .img_box img {width: 100%;}

/*연혁*/
.history {width: 95%; margin: 0 auto;}
.history h2{padding-bottom:50px}
.history .history_wrap{ position:relative}
.history .history_wrap:after {content:"";clear:both;display:table}
.history .history_wrap .history_img_holder{position:absolute; width:23.25%; left:22%; top:-3px}
.history .history_wrap .history_img_holder.right_holder{left:auto; right:22%}
.history .history_wrap.last_wrap{padding-bottom:0}
.history .history_wrap .history_inner {min-height:1px; width:50%; position:relative; float:left;}
.history .history_wrap .history_inner > div { position:relative;padding-bottom: 70px;  }
.history .history_wrap .history_inner > div.last{padding-bottom:0}
.history .history_wrap .history_inner > div h3{font-size:36px; color:#C30D23; font-weight:800; padding-bottom:25px; position:relative}
.history .history_wrap .history_inner > div p{font-size:17px; font-weight:400; color:#222; position:relative}
.history .history_wrap .history_inner > div p + p{margin-top:15px}
.history .history_wrap .history_inner > div p.no_dot:before{display:none}
.history .history_wrap .history_inner.right > div{padding-left:40px}
.history .history_wrap .history_inner.right > div:before{content:''; width:1px; height:100%; background:#eee; position:absolute; left:0; top:0}
.history .history_wrap .history_inner.right > div h3 .donut {width:27px; height:27px; background: 26px; height: 26px; border-radius: 999px; border: 2px solid #c30d23; background: #fff; position:absolute; top:3px; left:-53px; z-index: 10; }
.history .history_wrap .history_inner.right > div h3 .donut::after {content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 999px; background: #c30d23; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.history .history_wrap .history_inner.right > div p:before{content: '';  position: absolute;  width: 5px;   height: 5px;  background: #C30D23;  border-radius: 100%;  left: -42px;  bottom: auto; top: 0.5em;  z-index: 1;}
.history .history_wrap .history_inner.left > div{text-align:right; padding-right:40px}
.history .history_wrap .history_inner.left > div:before{content:''; width:1px; height:100%; background:#eee; position:absolute; right:-1px; top:0}
.history .history_wrap .history_inner.left > div h3 .donut {width:27px; height:27px; background: 26px; height: 26px; border-radius: 999px; border: 2px solid #c30d23; background: #fff; width:26px; height:26px; position:absolute; top:3px; right:-53px; z-index: 10;}
.history .history_wrap .history_inner.left > div h3 .donut::before {content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 999px; background: #c30d23; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.history .history_wrap .history_inner.left > div p:before{content:''; position:absolute; width:5px; height:5px; background:#C30D23; border-radius:100%; right:-43px; bottom:5px; z-index:1}
.history .history_wrap .history_inner.right > div p.hide_line:after{content:''; width:1px; height:100%; background:#fff; position:absolute; left:-40px; top:0}
.history .history_wrap .history_inner.left > div p.hide_line:after{content:''; width:1px; height:100%; background:#fff; position:absolute; right:-40px; top:0}
.history .history_wrap .history_under_bar {width: 100%;  height: 1px;  background: #ddd;   position: relative;   margin-bottom: 25px;}
.history .history_wrap .history_under_bar:after {content:"";width:110px; height:2px; background: #FFD3D9; position:absolute; bottom:0}
.history .history_wrap .history_inner.right .history_under_bar:after {left:0}
.history .history_wrap .history_inner.left .history_under_bar:after {right:0}
.history .history_wrap .date {font-weight: 600;  color: #C30D23;   display: inline-block; min-width: 30px;}
.history .history_wrap .history_inner.right .date {padding-right:5px}
.history .history_wrap .history_inner.left .date {padding-left:5px}
.history .history_wrap .history_inner >  div p.small_txt {font-size: 16px; margin-top: 8px; padding-right: 35px;}
.history .history_wrap .history_inner.right >  div p.small_txt {padding-left: 35px;}
.history .history_wrap .history_inner >  div p.pdl_long {padding-left: 53px;}
.history .history_wrap.last .history_inner.right > div:before {content:none;}
.history .history_wrap.last .history_inner > div {padding-bottom:0}
.history .history_wrap.last .history_inner.left > div:before {height:95%;}

@media (max-width: 1024px) {
    .greetings_desc p br {display: none;}

    /*연혁*/
    .history .history_wrap .history_inner > div h3 {font-size: 4vw;}
    .history .history_wrap .history_inner > div p {display: flex; align-items: baseline; font-size: 2vw; line-height: 1.5em;}
    .history .history_wrap .history_inner > div p.small_txt {font-size: 2vw}
    .history .history_wrap .history_inner.left > div p {justify-content: flex-end;}
    .history .history_wrap .history_inner.left >  div p.small_txt {padding-right: 0; padding-left: 35px;}
    .history .history_wrap .history_inner.right >  div p.small_txt {padding-left: 35px; padding-right: 0;}
    .history .history_wrap .date {max-width: unset; flex-shrink: 0;}

}

@media (max-width: 767px) {
    .greetings {margin-bottom: -80px;} 
    .greetings_desc .container {flex-direction: column-reverse; row-gap: 40px;}
    .greetings_desc .right, .greetings_desc .left {width: 100%;}
    .greetings_desc .left {padding-right: 0;}
    .greetings_desc .right .img_box {margin-top: 0; width: 55%;}
    .greetings_desc .right .img_box img {}
}

@media (max-width: 480px) {
    .greetings {margin-bottom: -50px;} 
    .greetings_title {padding-bottom: 40px;}
    .greetings_desc {padding: 50px 0 60px;}
    .greetings_desc .container {row-gap: 25px;}
    .greetings_desc .right .img_box {width: 100%;}

    /*연혁*/
    .history .history_wrap .history_inner > div p {  font-size: 3.3vw;}
    .history .history_wrap .history_inner {width: 100%;}
    .history .history_wrap .history_inner.right > div {  padding-left: 20px;}
    .history .history_wrap .history_inner > div {padding-bottom: 40px;}
    .history .history_wrap .history_inner > div h3 {   font-size: 6vw;   padding-bottom: 15px;}
    .history .history_wrap .history_inner.right > div h3 .donut {width: 20px;   height: 20px;top: 3px;   left: -30px;}
    .history .history_wrap .history_inner.left > div h3 .donut {width: 20px;   height: 20px;top: 3px;  right:auto;  left: -30px;}
    .history .history_wrap .history_under_bar {margin-bottom: 15px;}
    .history .history_wrap .history_inner > div p + p {  margin-top: 8px;}
    .history .history_wrap .history_inner.left > div p {display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end;}
    .history .history_wrap .history_inner.left .date {padding-left: 0; padding-right: 5px;}
    .history .history_wrap .history_inner > div p:before {top: 0.5em;}
    .history .history_wrap .history_inner.right > div p:before {left: -22px;}
    .history .history_wrap .history_inner.left > div p:before {right:auto; left: -22px;}
    .history .history_wrap .history_inner.left > div {  text-align: left;  padding-right: 0;  padding-left: 20px;}
    .history .history_wrap .history_inner.left .history_under_bar:after {  right: auto;  left: 0;}
    .history .history_wrap .history_inner.left > div:before {right: auto;   left: 0;}
    .history .history_wrap.reverse {display: flex;  flex-direction: column-reverse;}
    .history .history_wrap .history_inner > div p.small_txt {font-size: 3.3vw;}
    .history .history_wrap .history_inner.left >  div p.small_txt {padding-left: 30px;}
    .history .history_wrap .history_inner.right >  div p.small_txt {padding-left: 30px;}
    .history .history_wrap.last .history_inner.right > div {padding-top:20px}
    .history .history_wrap .history_inner > div p.pdl_long {  padding-left: 0;}
}