@charset "utf-8";

body {line-height:1.5}
img {max-width: 100%;}
.bg-gray {background-color: #f9f9f9 !important;}
.text-body { color: #000 !important;}
.text-red { color: #D92A50 !important;}
.text-gray {color: #666;}
.text-light { color: #666 !important; font-size: 0.875em;}
.text-bull {font-size:0.875em;}
.fw700 { font-weight: 700 !important;}


.display-1 {font-size:3.25rem;}
.display-2 { font-size: 1.77em;letter-spacing: -0.05em;}

.swiper-pagination-bullet {
    position: relative;
    width:18px;
    height:18px;
    opacity: 1;
    background: none;
    border-radius: 0;
    margin: 0 !important;
}

.swiper-pagination-bullet::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background: #8f8f8f;
    border-radius: 50%;
}

.swiper-pagination-bullet-active {
    width:32px;
}

.swiper-pagination-bullet-active::after {
    width: 24px;
    background: #000;
    border-radius:50px;
}

/* 250710 수정 */
.cont-1 .display-1 {margin-bottom:60px}
h6 {position: relative; font-size: 1.11em; margin-bottom:50px}
.cont-1 .text-gray {
    margin-top: 16px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.2;
    color: #666;
}

.cntr {
    max-width: 1412px;
}

.cont-1 h2 {
    text-align: center;
    font-size: 52px;
}

.cont-1 .head-eyebrow {
    font-size: 24px;
    margin-bottom: 8px;
}

.cont-1 img {
    border-radius: 28px;
}

@media screen and (max-width: 1024px) {
    .cont-1 .text-gray {
        margin-top: 8px;
        font-size: 12px;
    }

    .cont-1 h2 {
        font-size: 30px;
        margin-bottom: 24px !important;
    }

    .cont-1 .head-eyebrow {
        font-size: 20px;
    }

    .cont-1 img {
        border-radius: 0;
    }
}
/* // 250710 수정 */

/* cont-2 */
.cont-2 .display-2 {margin-bottom:2em}
.cont-2 .bx-wrp {position: relative; text-align: center;transition:all 0.3s;}
.bx-label {display:inline-block; min-width: 190px; padding:10px 20px; background:#D92A50; border-radius:10px 10px 0 0; color: #fff; font-weight:500;}
.bx-red {height:617px; padding:40px 20px 20px; margin:0 auto; border:3px solid #D92A50;border-radius:10px;text-align:center;}
.bx-red .text-red {position: relative; margin-bottom:1.5em; font-weight:700;}
.wall-wrp {display: flex; flex-wrap: wrap; justify-content: space-between;}
.wall {flex:0 0 49%; margin-bottom:3rem}
.wall p { margin-top:10px;letter-spacing: -0.05em; font-size:0.857em; line-height: 1.25;}

/* cont-3 */
.cont-3 .text-left {display: inline-block; margin-top:1.5em; text-align:left;} 
.bg-gray {padding:50px 0;margin-top:3.5em}
.bg-gray .tit { display: flex; align-items: center; margin-bottom:1rem; font-weight:700; }
.bg-gray p { margin-top:1rem; margin-bottom:1.5em }
.red-label {display: inline-block; padding:6px 15px; margin-right:1rem; background: #D92A50;border-radius:0 15px 15px 0;color: #fff;font-size:1.5rem; font-weight:500; box-shadow: 0px 5px 8px rgba(0,0,0,0.2);}
.cont-3 .swiper-button-disabled{opacity:.4}
.cont-3 .swiper-button-prev{width:70px;height:80px;background:url(../images/tvs-oled-evo-install-guide/swp_prev.png) no-repeat;background-size:100% auto}
.cont-3 .swiper-button-next{width:70px;height:80px;background:url(../images/tvs-oled-evo-install-guide/swp_next.png) no-repeat;background-size:100% auto}


/* cont-4 */

.cont-4 .tit {text-align:center; line-height:2}
.cont-4 .tit .display-2 {position: relative; margin-bottom:150px}
.cont-4 .tit .display-2::after {content: ""; width:8%;min-width:50px; height:2px;background: #aaa;position: absolute;bottom:-45px;left:50%;transform: translateX(-50%);}
.cont-4 .tit p {font-size:1.33em;font-weight:700;}
.cont-4 .tit img {margin-right:5px}
.cont-4 .btn-wrp {margin-top:2.05em; text-align: center}
.cont-4 .btn-wrp a {min-width:165px;padding:6px 31px; margin:0 1.5em;background: #fff;border:2px solid #222;color: #222; transition: all 0.3s; }
.cont-4 .btn-wrp a:hover {background-color:#D92A50; border:2px solid #D92A50;color: #fff;}
.cont-4 .btn-wrp a:focus-visible {outline: 3px solid #EA1917; outline-offset: -3px;}
.prdt-link {margin:8em auto 150px}

/* 0930 추가 */
.cont-1 .list-bull {font-size: 0.85em; line-height: 1,5; color:#666; margin-top: 2%;}

/* Web Accessibility */
.video__container {position: relative;}
.video__container .cap-section {display: none;}

.video__container video {max-width: unset; width: 100%;}

.video__container .controller-wrap {bottom: 26px;}

@media screen and (min-width: 768px){ 
    .story-page [class^=cont-] {padding-bottom: 0 !important}

    /* 250715 수정 */
    .story-page .cont-4 {
        padding-bottom: 150px !important;
    }
    /* // 250715 수정 */

    .cont-2 {padding-top:80px !important}
    .cont-2 .swiper-slide {transform: scale(0.8)}
    .cont-2 .swiper-slide-active {transform: scale(1)}
    .cont-2 .swiper-slide:first-child .wall-wrp:first-child { padding-top:54px }
    .cont-2 .swiper-slide:last-child .bx-red {padding-top:60px}
    .bx-red {max-width:980px;}
    .bx-red .text-gray {text-align: left; padding-left:4%}
    .bx-red .d-md-felx {display: flex; flex-wrap: wrap;}
    .wall-wrp {flex-basis:50%; -moz-box-flex:0 0 50%;-webkit-box-flex: 0 0 50%; padding:0 1em}
    .bg-gray .swiper-slide { font-size:1.77em }
    .prdt-link .info {line-height: 2;}
    .prdt-link .info div {font-size:0.8em}

}

@media screen and (max-width: 767px){ 
    .display-1 {font-size:2.42rem;}
    .display-2 { font-size: 1.2rem}

    .cont-1 {padding-bottom:30px !important}
    .cont-1 .cntr.img {padding-left:0;padding-right:0;}
    .cont-1 .display-1, h6 {padding-left:16px;padding-right:16px}
    .cont-1 .text-gray {padding: 0 1.4em;}
    /* cont-2 */
    .cont-2 {padding-bottom:35px !important}
    .cont-2 .display-2 {padding-left:16px;padding-right:16px;font-size:1.14rem;}
    .bx-wrp {width: 90%;margin:0 auto}
    .bx-label {min-width: 155px}
    .bx-red {height:670px; padding:37px 10px}
    .bx-red .text-red {margin-top:3rem} 
    .wall-wrp+.wall-wrp {margin-top:2rem}
    .wall {margin-bottom:1rem}
    .wall img {width:74px;}

    /* cont-3 */
    .cont-3 {padding-bottom:35px !important}
    .cont-3 .display-2 {font-size:1.12rem;}
    .cont-3 .text-gray {margin:1em 0} 
    .red-label {padding:3px 8px; margin-right:0.5rem; font-size:1rem} 
    .bg-gray .d-block>div+div { margin-top:45px}  
    .bg-gray .d-block>div { font-size:1.14em }

    /* 250715 수정  */
    .story-page .cont-4 {
        padding-bottom: 70px;
    }
    /* // 250715 수정  */

    .cont-4 .tit .display-2 {margin-bottom:60px}
    .cont-4 .tit .display-2::after {bottom:-30px}
    .cont-4 .btn-wrp a {display: block; width:55%; margin:10px auto}
    .prdt-link-wrp {margin:70px 0 0}
    /* .prdt-link .img-inline {display: flex;justify-content: center; align-items: center; padding:10px 0}
    .prdt-link>.img-inline>img {width: 70%; position: relative; left:0; transform: inherit;}
    .prdt-link {margin:5rem auto 50px} */
}