.container
{position:relative;}

.prd-top
{padding:100px 0; background:#f4f4f4}
.prd-top h2
{font-family:'Noto Sans Kr'; font-size:36px; font-weight:600; color:#1b1b1b; word-break:keep-all;}
.prd-top p
{margin-top:20px; font-size:19px; color:#666; line-height:1.5; word-break:keep-all;}
.prd-top p span
{color:#094090; font-weight:600;}

.prd-padding
{padding:70px 0;}
.prd-padding-b
{padding: 0 0 70px 0 }

.prd-contents .sub-tit
{margin-bottom:20px;}
.prd-contents .sub-tit p
{font-size:16px; font-weight:400; margin-top:10px;}


.prd-check-box ul
{display:flex; flex-wrap:wrap;}
.prd-check-box ul li
{width:33%; padding:0 60px; height:45px; line-height:45px; font-size:17px; color:#333333; font-weight:500;}
.prd-check-box ul li i
{font-size:30px; margin-right:10px; font-weight:900; color:#094090;}

.con-box
{display:flex; flex-wrap:wrap;}
.con-box .txt-box
{padding-left:3%;}
.con-box .patent-box
{border:1px solid #ddd; background:#f4f4f4; padding:30px; border-radius:15px;}
.con-box .patent-box li
{font-size:17px; margin-bottom:15px; color:#666666;}
.con-box .patent-box li strong
{width:100%; font-weight:500; display:inline-block; margin-bottom:7px; color:#1b1b1b;}
.con-box .patent-box li span
{width:100%; display:inline-block;}
.con-box .patent-box li:last-child
{margin-bottom:0px}
.con-box .txt-box .size-img
{margin-top:30px; text-align:center;}

.prd-contents .sub-tit
{margin:0 0 20px; text-align:left;}
.prd-contents .sub-tit h4
{position:relative; font-size:23px; color:#1b1b1b; font-weight:500; padding-left:10px; word-break:keep-all;}
.prd-contents .sub-tit h4:before
{content:''; position:absolute; left:0; top:0; width:5px; height:100%; background:#094090;}
.prd-contents .sub-tit h4:after
{content:''; position:absolute; left:0; top:0; width:5px; height:33%; background:#d10000}

.prd-detail-img
{margin-bottom:30px; width:60%; display:inline-block;}
.prd-detail-img.floating
{position:absolute; top:0; right:0; width:35%;}
.prd-4-col ul
{display:flex;}
.prd-4-col ul li
{padding-right:3%; }

.info-box
{padding:30px; background:#f4f4f4; border:1px solid #ddd; border-radius:10px;}
.info-box li
{position:relative; font-size:16px; color:#1b1b1b; line-height:1.5; padding-left:15px; word-break:keep-all; margin-bottom:10px;}
.info-box li::before
{content:''; position:absolute; width:4px; height:4px; background:#094090; left:0; top:7px; border-radius:50px;}

.prd-img-con .img-box
{border:1px solid #ddd; padding:20px; text-align:center;}

.detail-compare ul
{display:flex; flex-wrap:wrap;}
.detail-compare ul > li
{width:50%;}
.detail-compare .compare-prd
{padding:0 20px;}
.detail-compare .compare-prd .tit
{font-size:21px; font-weight:500;}
.detail-compare .compare-prd .txt
{font-size:16px; font-weight:400; color:#666; margin:10px 0; line-height:1.3; word-break:keep-all;}
.detail-compare .compare-prd .img-box
{padding:20px; text-align:center;}


.prd-2-col
{display:flex; flex-wrap:wrap; justify-content:space-between;}
.prd-2-col video
{display:inline-block; width:50%;}
.prd-2-col .img-box
{width:46%; text-align:center; margin:20px}
.prd-info-con .video
{width:47%; display:inline-block;  margin:10px; height:300px;}
.prd-info-con .video video
{width:100%;}

.prd-4-col
{display:flex; flex-wrap:wrap; justify-content:space-between;}
.prd-4-col .img-box
{width:25%;}
.prd-4-col .img-box img
{ width:100%; }


@media screen and (max-width:1200px){
    #main-hero
    {height:60vh; margin:0 10px;}
    #main-hero .slick-slide .slide-caption .caption-inner
    {padding-top:7%; }
    #main-hero .slick-slide .slide-caption .slide-txt-box
    {width:100%; padding:30px 20px; background:rgba(0,0,0,0.4);}
    .goto-sec > li
    {width:33.33%;}
    .goto-cont img
    {width:100%; min-height:287px;}

    .goto-cont .txt-wrap
    {padding:65px 0;}


    .con-box .img-box
    {width:40%;}
    .con-box .img-box img
    {width:100%; height:100%;}
    .con-box .txt-box
    {width:60%; display:inline-block;}


}

@media screen and (max-width:1023px){
    
    .goto-cont .txt-wrap
    {padding:40px 0px; min-height:230px;}
    .goto-cont img
    {min-height:230px;}


    .prd-padding
    {padding:60px 0;}
    .prd-padding-b
    {padding-bottom:35px;}
    .prd-check-box ul li
    {padding:0 15px;}
    .con-box .img-box
    {width:100%; height:350px;}
    .con-box .txt-box
    {padding:3%; width:100%;}

    .prd-detail-img
    {width:100%;}
    .prd-detail-img.floating
    {position:relative; width:100%;}


}

@media screen and (max-width:991px){
    #header .btn-open-nav > span
    {background-color:#000}
    #header .logo a img.logo-light
    {max-height:45px;}
}

@media screen and (max-width:811px){
    .goto-cont img
    {min-height:auto; height:180px;}
    .goto-cont .txt-wrap
    {min-height:auto; height:180px; max-height:none;;}
}


@media screen and (max-width:767px){
    .prd-info-con .video
    {width:100%; margin:10px 0;}
    .prd-info-con .video
    {height:240px;}
}


@media screen and (max-width:640px){
    #main-hero
    {margin-top:70px; height:400px;}
    .main-about-section .sub-tit
    {line-height:1.5}
    .article-list .board_output_1_tr>td:nth-child(3)
    {text-align:left; margin-top:10px; color:#666; padding-left:15px;}
    

    .dropdown-nav-section .dropdown-wrap > a:after
    {right:10px;}

    .goto-sec > li
    {width:100%;}
    .goto-cont .txt-wrap .tit
    {font-size:21px;}
    .goto-cont .txt-wrap .subtit, .goto-cont .txt-wrap .eng
    {font-size:16px;}
    .goto-cont img
    {height:280px;}

    .sub-section
    {padding:40px 0px;}

    .prd-top h2
    {font-size:32px;}

    .prd-check-box ul li
    {padding:0; width:50%; letter-spacing:-1px; font-size:15px;}
    .prd-check-box ul li i
    {font-size:18px; margin-right:5px; }
    .prd-4-col > div
    {margin:10px 0;}
    .prd-img-con .img-box img
    {width:100%;}

    .prd-img-box
    {text-align:center;}

    .con-box .txt-box
    {padding:10px 0 0;}
    .detail-compare ul > li
    {width:100%;}
    .detail-compare .compare-prd
    {padding:0;}
    .detail-compare .compare-prd .img-box img
    {width:100%}

    .prd-2-col .img-box
    {width:100%; margin:20px 0;}
    .prd-2-col .img-box > img
    {width:100%;}
    .prd-2-col .img-box .prd-img-list img
    {width:100%;}

    .prd-4-col .img-box
    {width:50%;}

    section .dropdown-wrap.dropdown-01,
    section .dropdown-wrap.dropdown-02
    {width:100%}
    .dropdown-nav-section .dropdown-wrap + .dropdown-wrap > a
    {border-left:none;}
}

@media screen and (max-width:420px){
    #main-hero
    {height:380px;}
    #main-hero .slide-item
    {background-position:10% 100%;}
}