hr { display: block; height: 1px; border: 0; background-color: var(--sub3color); }
.has-bbtm { margin-bottom: 4rem; padding-bottom: 1rem; border-bottom: 1px solid var(--gray); }
.order1 { order: 1; }
.order2 { order: 2; }
@keyframes pulse {
    0% {
      -moz-box-shadow: 0 0 0 0 rgba(17, 71, 135, 0.4);
      box-shadow: 0 0 0 0 rgba(17, 71, 135, 0.4);
    }
    70% {
        -moz-box-shadow: 0 0 0 15px rgba(17, 71, 135, 0);
        box-shadow: 0 0 0 15px rgba(17, 71, 135, 0);
    }
    100% {
        -moz-box-shadow: 0 0 0 0 rgba(17, 71, 135, 0);
        box-shadow: 0 0 0 0 rgba(17, 71, 135, 0);
    }
}

/* 회사소개 */
.cont_box .txt { padding: 0 3.5rem; }
@media (max-width:990px){
    .cont_box .flex-wrap > * { width: 100%; }
    .cont_box .txt { padding: 2.5rem 0; }
}

/* HISTORY */
#historyLine { position: relative; z-index: 5; }
#historyLine li { position: relative; padding-bottom: 8rem; }
#historyLine li::before { position: absolute; content: ''; width: 1px; height: 100%; background-color: var(--sub3color); top: 30%; left: 50%; transform: translate(-30%,-50%); }
#historyLine li:last-child::before { height: 150%; }
#historyLine .img, #historyLine .txt { width: 40%; }
#historyLine .img img { width: 100%; }
#historyLine .txt { padding: 1rem 2rem; }
#historyLine li:nth-child(odd) .txt { text-align: right; }
#historyLine li:nth-child(odd) .txt span:last-child { display: inline-block; text-align: left; width: 45%; }
#historyLine li:nth-child(even) .txt span:last-child { display: inline-block; text-align: left; width: 45%; }
#historyLine li span.ball { position: absolute; width: 1.5rem; height: 1.5rem; background-color: var(--pointcolor); border-radius: 50%; top: 1.75rem; left: 50%; transform: translateX(-50%); }
#historyLine li span.ball::before { position: absolute; content: ''; width: 8rem; height: 1px; border: 1px dashed var(--sub3color); top: 50%; transform: translateY(-50%); }
#historyLine li:nth-child(odd) span.ball::before { left: -8rem; }
#historyLine li:nth-child(even) span.ball::before { right: -8rem; }
#historyLine li:first-child span.ball { animation: pulse 2s infinite; }
@media (max-width:990px){
    #historyLine { margin-top: 4.5rem; margin-bottom: 4.5rem; }
    #historyLine li { padding-bottom: 3.5rem; }
    #historyLine li span.ball { width: 1rem; height: 1rem; }
    #historyLine li span.ball::before { display: none; }
    #historyLine .img, #historyLine .txt { width: 42.5%; }
    #historyLine .txt { padding: .5rem 0; }
    #historyLine .txt span,
    #historyLine li:nth-child(odd) .txt span:last-child { display: block; width: 100%; margin-left: 0; }
    #historyLine li:nth-child(odd) .txt span:last-child { text-align: right; }
    #historyLine li:nth-child(even) .txt span:last-child { display: block; width: 100%; margin-left: 0; }
}

/* 조직도 */
#Organization { letter-spacing: -2px; }
#Organization h4 { padding: .5rem 2rem; border: 1px solid var(--sub3color); }
#Organization ol li { margin-bottom: .25rem; }
#Organization ul { margin: 1rem 0 0 1.5rem; }
#Organization ul li { position: relative; text-align: left; padding-left: 1.25rem; margin-bottom: .25rem; }
#Organization ul li::after { position: absolute; content: '·'; top: 0; left: 0; }
#Organization .depth2, #Organization .depth3, #Organization .depth4
{ margin-top: 4rem; }
#Organization .depth2::before { position: absolute; content: ''; width: 1px; height: 4rem; top: -4rem; left: 50%; transform: translateX(-50%); background-color: var(--sub3color); }
#Organization .depth2 > h4::before { position: absolute; content: ''; width: 1px; height: 2rem; bottom: -2rem; left: 50%; transform: translateX(-50%); background-color: var(--sub3color); }
#Organization .depth3::before { position: absolute; content: ''; width: 85%; height: 1px; top: -2rem; left: 50%; transform: translateX(-50%); background-color: var(--sub3color); }
#Organization .depth3 > * > h4::before { position: absolute; content: ''; width: 1px; height: 2rem; top: -2rem; left: 50%; transform: translateX(-50%); background-color: var(--sub3color); }
#Organization .depth4::before { position: absolute; content: ''; width: 55%; height: 1px; top: -5rem; left: 50%; transform: translateX(-50%); background-color: var(--sub3color); }
#Organization .depth4::after { position: absolute; content: ''; width: 1px; height: 10rem; top: -15rem; left: 50%; transform: translateX(-50%); background-color: var(--sub3color); z-index: -1; }
#Organization .depth4 h4::before { position: absolute; content: ''; width: 1px; height: 5rem; top: -5rem; left: 50%; transform: translateX(-50%); background-color: var(--sub3color); }
@media (max-width:990px){
    #Organization { overflow-x: auto; font-size: 1.25rem; letter-spacing: -1.5px; }
    #Organization h4 { padding: .5rem 1rem; font-size: 1.5rem; }
    #Organization ul { margin: 1rem 0 0 0; }
    #Organization ul li { padding-left: .75rem; }
}

/* Policy */
@media (max-width:990px){
    #Policy .ratio img { aspect-ratio: 5/1.6; }
}

/* 오시는 길 */
#Location .tabs .tab { padding: 1rem 0; border: 1px solid var(--sub3color); cursor: pointer; }
#Location .tabs .tab.active { background-color: var(--pointcolor); color: #fff; font-weight: 700; border-color: var(--pointcolor); }
#Location .tab-cont { display: none; }
#Location .tab-cont.active { display: block; }
#Location .mapBox { width: 100%; min-height: 500px; border: 1px solid var(--sub3color); }
#Location .location li { padding: 2rem .5rem; border-bottom: 1px solid var(--sub3color); }
#Location .location li h4 { min-width: 25%; }
@media (max-width:990px){
    #Location .mapBox { min-height: 250px; }
    #Location .location li { flex-wrap: wrap; padding: 1rem 0; }
    #Location .location li h4 { min-width: 100%; margin-bottom: .75rem; }
    #Location .location li h4 img { width: 10%; height: auto; }
    #Location .location li h4 span { margin-left: 1rem; }
}

/* 제품소개 */
#Top { padding: 100px 0; }
.featureBox { position: relative; }
.featureBox::after { position: absolute; content: url(/img/common/img_logo_mark_w.png); bottom: 0; right: 0; opacity: .05; z-index: 10; }
.featureBox h6 { padding: 2rem 1.5rem 4rem; writing-mode: vertical-rl; text-orientation: mixed; transform: rotate(180deg); opacity: .3; }
.featureBox .featureSwiper { position: relative; margin: 0; }
.featureBox .featureTit { padding-bottom: 1rem; margin-bottom: 2rem; border-bottom: 1px solid #3c679e; }
.featureBox .featureInfo { position: relative; }
.featureBox .featureInfo ul li { position: relative; margin-bottom: .5rem; padding-left: 1.5rem; }
.featureBox .featureInfo ul li::after { position: absolute; content: '·'; top: 0; left: 0; }
.featureBox .swiperButtons { position: absolute; left: 50%; bottom: 4rem; transform: translateX(-50%); z-index: 15; }
.featureBox .swiperButtonPrev, .featureBox .swiperButtonNext {
    width: 3rem; height: auto; background-color: #fff; aspect-ratio: 1/1; border-radius: 50%;
    margin: 0 .75rem; cursor: pointer;
}
.featureBox .swiperPagination { position: absolute; top: calc(100% - 5px); z-index: 10; background: var(--backcolor); height: 5px; }
.featureBox .swiperPagination .swiper-pagination-progressbar-fill { background-color: var(--subcolor); }


@media (max-width:990px){
    .featureBox { display: block; }
    .featureBox > * { width: 100%; }
    .featureBox h6 { writing-mode: initial; text-orientation: initial; transform: rotate(0); padding: 2rem 3rem 1.5rem; }
    .featureBox .swiperButtons { position: relative; bottom: 0; margin-top: 4rem; }
    .featureBox::after { transform: scale(.5); transform-origin: right bottom; }
}

.spec-table { width: 100%; overflow-x: auto; }
.spec-table table { white-space: nowrap; border-spacing: 0; border: 1px solid var(--sub3color); }
.spec-table table thead th, .spec-table table tbody td { padding: .75rem .5rem; border-bottom: 1px solid var(--sub3color); border-left: 1px solid var(--sub3color); }
.spec-table table thead th { background-color: var(--backcolor);  }
.spec-table table thead tr:first-child th:first-child,
.spec-table table tbody tr td:first-child
{border-left: 0; }
.spec-table table tbody tr:last-child td { border-bottom: 0; }

#acting_video { background: url(/img/sub/product/img_product_video_bg.jpg); background-size: 100% auto; background-repeat: no-repeat; }
#acting_video .videoBox { width: 90%; margin: 4rem auto 0; aspect-ratio: 16/9; background-color: #fff; overflow: hidden; }
#acting_video .videoBox iframe { width: 100%; height: 100%; object-fit: cover; }
@media (max-width:990px){
    #acting_video { background-position: center; background-size: cover; }
    #acting_video .videoBox { width: 100%; } 
}

#useCase ul li { padding: 1.25rem; margin-bottom: .75rem; }
#useCase ul li:last-child { margin-bottom: 0; }
#useCase .flexList:nth-child(even) li { background-color: #f0f0f0; }
#useCase .flexList:nth-child(odd) li { background-color: var(--backcolor); }
@media (max-width:990px){
    #useCase .flexList .box.order2 { margin-top: 1rem; margin-bottom: 2rem; }
}

.beaf .thumb .swiper-slide {cursor: pointer;}

@media (max-width:990px){
    .beaf .width20 { width: 100%; margin-bottom: 1rem; }
    .beaf .width35 { width: 47.5%; }
    .beaf .width80 { width: 100%; }
}

/* PromoCenter */
#view .flexList h6, #video .flexList h6 { padding: .7rem 2rem; }
#video .flexList .box { cursor: pointer; }
#video .flexList .img { aspect-ratio: 16/9; overflow: hidden; }
#video .flexList .img img { width: 100%; height: 100%; object-fit: cover; }
#video .flexList h6 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Popup (Modal) */
.Pop { display: none; position: fixed; width: 100vw; height: 100vh; top: 0; left: 0; z-index: 65; }
.Pop.show { display: flex; }
.Pop .PopCover { position: absolute; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .75); z-index: 66; backdrop-filter: blur(2px); }
.Pop .PopVideo { position: relative; min-width: 50%; height: auto; aspect-ratio: 16/9; background-color: #000; z-index: 67; }
.Pop .PopVideo .PopDismiss { position: absolute; color: #fff; width: 5rem; height: 5rem; top: -2.5rem; right: -2.5rem; cursor: pointer; }
.Pop .PopVideo iframe { width: 100%; height: 100%; object-fit: cover; }

@media (max-width:990px){
    .Pop .PopVideo { min-width: 90% }
}