.inner { width: 1260px; margin: 0 auto; }

#wrap{ width: 100%; 
       min-width: 1200px; /* 반응형은 하면안됨 */
       overflow: hidden; 
       position: relative; 
     }
@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);

/********************* header ****************************/
#header { height: 139px;  border-bottom: 1px solid rgba(132, 132, 132, 0.24); margin-bottom: 20px; }

#header .top_box { height: 39px; 
                   border-bottom: 1px solid rgba(132, 132, 132, 0.14);
                 }
#header .top_txt { float: right; 
                   margin: 13px; 
                   font-size: 0.75rem;
                   color: #444;
                 }
#header .top_txt a { padding: 10px 8px; font-weight: bold; color: #888; }



/**************** logo ****************/

#logo { float: left; }
#logo a { /* font-size: 2.4rem; */
          padding: 50px 34px 14px;
          display: block;
        }


/************************** nav *************************/

#nav { margin-top: 40px; float: right; width: 58%; color: #3d3d3d;}
#nav .main_menu > li { float: left; 
                       position: relative; 
                       width: calc(100% / 5);
                     }
#nav .main_menu > li > a { display: block;
                           line-height: 3em;
                           font-size: 1.2rem; 
                           font-weight: bold; 
                           margin: 0 4px;
                           text-align: center; 
                         }
#nav .main_menu > li > a:hover { color: #0f0f0f; }

#nav .main_menu > li > a span { padding: 0 10px 18px; }
#nav .main_menu > li:hover span { border-bottom: 2px solid #61c4e1; /*rgba(132, 132, 132, 0.24)*/ }


/* 서브메뉴 */
#nav .main_menu .sub_menu { /* padding-top: 1em; */ 
                     position: absolute; 
                     top: 59px;
                     display: none; 
                     width: calc(100% - 8px); 
                     background-color: #fff; 
                     z-index: 9999; 
                     margin: 0 4px; 
                     /* overflow: hidden; 
                     height: 0; */ 
                     border-radius: 4px; 
                   }

#nav .sub_menu a { font-size: 0.85rem; 
                   line-height: 2.5em;
                   display: block; 
                   width: calc(100% - 36px);
                   padding: 0 14px;
                   margin: 6px 4px;
                   transition:all 0.5s;
                 }

#nav .sub_menu li { font-size: 0.8rem; 
                    line-height: 2em;
                  }
#nav .sub_menu li a:hover { color: #444;
                            font-weight: bold; 
                            background-color: rgba(150, 150, 150, 0.08);
                          }

#nav .sub_menu li:last-child { padding-bottom: 10px; }

/* 서브메뉴 속 부메뉴 */
#nav .sub_menu li ul { position: absolute; 
                       top: 0; left: calc(100% - 8px);
                       width: calc(100% - 8px); 
                       background-color: #fff;
                       transition:all 0.5s; 
                       border-radius: 4px; 
                     }
/********************* section 공통 *************************/
section h3 { text-align: center; line-height: 2.4em; color: #2f2f2f; }
section .line { width: 20px; height: 4px; background-color: orange; margin: 0 auto; margin-bottom: 20px; }

section { padding-bottom: 80px; }


/********************* section1 ****************************/
#sec1 { padding-bottom: 40px; }

#sec1 div > video { display: ; width: 100%; height: 100%; object-fit: cover; margin-bottom: 20px; }

#sec1 .sec1_box1,.sec1_box2 { width: 50%; background-color: #fff; float: left; height: 210px; overflow: hidden; }
#sec1 .sec1_box1 a,.sec1_box2 a { display: block; }

#sec1 .sec1_box1 a { width: calc((100% / 3) - 24px); text-align: center; float: left; padding: 14px 12px 0; }
#sec1 .sec1_box1 a span { display: block; font-weight: bold; color: #2e2e2e; font-size: 1rem; line-height: 2em; }

#sec1 .sec1_box1 a:hover img { opacity: 100%; }

#sec1 .sec1_box1 img { width: 80%; opacity: 90%; }
#sec1 .sec1_box2 img { width: 100%; }


/********************* section2 ****************************/
#sec2 .inner { background-color: #ebf5ff; padding-bottom: 20px; }
#sec2 .fume_ba { height: 340px; overflow: hidden; }
#sec2 .fume_ba img { width: 100%; }

#sec2 article h3 { text-align: left; padding-top: 18px; }
#sec2 article h3 a { display: inline-block; line-height: 2.4em; padding: 0 30px; }
#sec2 article .line { margin: 0 30px 8px; }
#sec2 article { float: left; height: 344px; }
#sec2 div .art1 { width: 50%; }
#sec2 div .art2 { padding-left: 20px; width: calc(50% - 40px); }



/* sec2 미니 슬라이드 */
#sec2 #banner_wrap{position:relative; width: 90%; margin:20px auto; }
#sec2 #slide_banner {text-align: center;}
#sec2 #slide_banner li { height: 240px; }
#sec2 #slide_banner li a { display: block; }
#sec2 #slide_banner li a div { height: 210px; overflow: hidden; background-color: #fff; }
#sec2 #slide_banner img{ height:100%; margin: 0 auto; }
#slide_banner span { font-size: 0.9rem; line-height: 2.1em; font-weight: bold; color: #5e5e5e; display: block; }

#sec2 #prevBtn, #sec2 #nextBtn { color: #2e2e2e; display: block; padding: 0 8px; line-height: 2em; }
#sec2 #prevBtn{position:absolute;left: -30px;top: calc(115px - 16px);}
#sec2 #nextBtn{position:absolute;right: -30px;top: calc((230px / 2) - 16px);}


/********************* section3 ****************************/
#sec3 h3 a { cursor: default; }

#sec3 ul { margin-right: -16px; }
#sec3 ul > li { float: left; width: calc(20% - 16px); padding-right: 16px; }

#sec3 ul li > div { height: 188px; 
                    position: relative; 
                    overflow: hidden; 
                  }

#sec3 ul li div a { display: block; }
#sec3 ul li div > a { height: 186px; overflow: hidden; }
#sec3 ul li div > a img { width: 100%; }
#sec3 .none { display: none; }
#sec3 .none p { position: absolute; 
                top: 0; left: 0; 
                text-align: center; 
                width: calc(100% - 4px); height: calc(100% - 4px);
                font-size: 1.5em; 
                background: rgba(0, 0, 0, 0.8); 
                border: 2px solid #5bc4ee;
              }
#sec3 .none p a { padding: 78px 0; 
                  color: #5bc4ee; 
                  font-weight: bold; 
                }
/***************** section4, section5 ******************/
#sec4 h3 a, #sec5 h3 a { display: inline-block; padding: 0 20px;}

#sec4 ul li > div > a, #sec5 ul li > div > a { display: block; overflow: hidden; margin-bottom: 8px;}
#sec4 p a, #sec5 p a { display: block; margin-bottom: 14px; font-weight: bold; padding-left: 8px; }
#sec4 li > div:hover, #sec5 li div:hover { /* text-shadow: 0px 0px 0.1rem blue; */ /* filter: drop-shadow(0px 0px 8px #000); */ color: orange; }
#sec4 ul li div > a:hover, #sec5 ul li div > a:hover { border: 1px solid orange; }

#sec4 ul, #sec5 ul { margin-right: -20px; }
#sec4 ul > li, #sec5 ul > li { float: left; width: calc(25% - 20px); padding-right: 20px; }
section ul > li > div > a img { width: 100%; }

/* sec4 */
#sec4 { padding-bottom: 40px; }
#sec4 ul > li { overflow: hidden; margin-bottom: 26px; }
#sec4 ul > li > div > a { width: calc(100% - 2px); height: 232px; overflow: hidden; border: 1px solid #fff; }


/* sec5 */
#sec5 ul li:first-child { width: calc(50% - 20px); overflow: hidden; height: 480px; }
#sec5 ul li:first-child div > a { height: 440px; overflow: hidden; }

#sec5 ul li { height: 240px; overflow: hidden; }
#sec5 ul li > div > a { height: 200px; overflow: hidden; border: 1px solid #e0e0e0; }
#sec5 ul li > div > a img { width: 100%; }



/********************* section6 ****************************/
#sec6 { background-color: #f3f9ff; padding: 40px 0; margin-bottom: 40px; width: 100%; }

/* art2 미니 슬라이드 */
#sec6 .bx-wrapper .bx-viewport { height: 400px !important; }
.bxslider > div a { width: 100%; text-align: center; }
.bxslider > div > img {width:100%;} /* 수정 가로 484px 높이 270px */

#sec6 .erem_b { background-color: #fff; margin-bottom: 40px; }


/************************ 이렘 리스트 ****************************/

#sec6 .curri_list { height: 200px; /* 사이즈 고치기 */
                    overflow: hidden; 
                    width: calc(100% + 40px); 
                    margin-left: -20px; 
                  }
#sec6 .curri_list a { display: block; 
                      color: #555; 
                    }
#sec6 .curri_list li { width: calc(20% - 42px); border: 1px solid #e0e0e0;
                       height: 140px; overflow: hidden; 
                       float: left;
                       margin: 25px 20px; 
                       position: relative; 
                     }
#sec6 .curri_list li a > img { width: 100%; padding-bottom: 10px; }
#sec6 .curri_list li p { display: none; 
                         position: absolute; top: 12px; left: 10px;
                         font-weight: bold; 
                         font-size: 1.15rem; 
                         letter-spacing: -0.2px; 
                         line-height: 1.4em; 
                         border-bottom: 3px solid #00a2ab; 
                       }


/* last-child 더 보러 가기 */
#sec6 .curri_list li:last-child { background: url(http://dhscorp.co.kr/weller/images/main/Erem_li_la.png) no-repeat; background-size: cover; background-position: center; position: relative; border: none;}
#sec6 .curri_list li:last-child a { display: none; height: 100%; background-color: rgba(0,0,0,0.68); color: #fff; text-shadow:0px 0px 0.55rem #fff; }
#sec6 .curri_list li:last-child a p { display: block; font-size: 1.2rem; position: absolute; top: calc(55% - 36.5px); left: calc(50% - 50.5px); text-align: center; border: none; }
#sec6 .curri_list li:last-child a p img { width: 35px; display: block; margin: 10px auto; filter: drop-shadow(0px 0px 15px #fff); }


/* 더보기, 줄이기 */

#sec6 .more, #sec6 .less { text-align: center; 
                           padding: 10px;
                           border: 1px solid #e0e0e0; 
                           border-radius: 50%;
                           cursor: pointer;
                           width: 28px;  
                           margin: 40px auto; 
                           background-color: orange; 
                           color: #fff; 
                           font-weight: bold
                         }
#sec6 .more:hover, #sec6 .less:hover { background-color: #2f2f2f; }
#sec6 .less { display: none; }



/************************ section7 ************************/
#sec7 > .inner > h3 { text-align: left; }
#sec7 h3 a { display: inline-block; line-height: 2.4em; padding: 0 60px; }
#sec7 > .inner > .line { margin: 0 60px; background-color: orange; }


/* sec7 미니 슬라이드 */
#sec7 #banner_wrap{position:relative; width: 94%; margin:20px auto; }
#sec7 #slide_banner {text-align: center;}
#sec7 #slide_banner img{ height: 100%; margin: 0 auto;  }
#sec7 #slide_banner li a { display: block; }
#sec7 #slide_banner li div { height: 170px; overflow: hidden; border: 1px solid #e0e0e0; }

#sec7 #slide_banner li a:hover div { border-color: #999; }
#sec7 ul li a:hover span { color: #2e2e2e; }

#sec7 #prevBtn, #sec7 #nextBtn { color: #2e2e2e; display: block; padding: 0 8px; line-height: 2em; }
#sec7 #prevBtn{position:absolute;left: -35px;top: calc((202px - 30px)/2 - 16px); }
#sec7 #nextBtn{position:absolute;right: -35px;top: calc((202px - 30px)/2 - 16px); }




/********************* section8 ****************************/
#sec8 .art2 h3 a { cursor: default; }

#sec8 { margin-bottom: 40px; }
#sec8 article { float: left; height: 340px; overflow: hidden; }
#sec8 .art1 { width: calc(60% + 20px); }
#sec8 .art2 { width: calc(40% - 20px); }
#sec8 .art1 > div { width: 50%; float: left; }


/* art1 */
#sec8 .art1 div h3 a { padding: 0 20px; }
#sec8 .art1 div > a { width: calc(100% - 42px); display: block; margin-right: 20px; height: 268px; overflow: hidden; border: 1px solid #e0e0e0; }
#sec8 article img { width: 100%; transition: 0.5s; }
#sec8 .art1 div > a:hover img { transform: scale(1.08); }


/* art2 미니 슬라이드 */
#sec8 .art2 {  }
#sec8 .bx-wrapper .bx-viewport { height: 270px !important; }
.bxslider > div > img {width:100%;} /* 수정 가로 484px 높이 270px */





/********************* footer ****************************/
#footer { border-top: 1px solid rgba(132, 132, 132, 0.14); 
          padding-top: 8px; padding-bottom: 40px;
          font-size: 0.7rem;
        }
#footer span { font-weight: bold; }
/* left */
.footer_left { float: left; width: 18%; }
.footer_left a { padding: 20px 20px 30px; display: block; width: 75%; }

/* center */
.footer_center { float: left; width: 71%; }
.footer_center p a { font-size: 0.74rem; 
                     font-weight: bold; 
                     line-height: 3em; 
                     padding: 0 10px; 
                     border-right: 1px solid #e0e0e0;
                   }
.footer_center p a:first-child { margin-left: -10px; }
.footer_center p a:last-child { border: none; }
.footer_center p { line-height: 2em; }
.footer_center > div { padding: 4px 0; }

/* right */
.footer_right { float: right; width: 11%; text-align: center; padding-top: 8px;}
.footer_right p { font-size: 0.7rem; color: #444; line-height: 1.8em; text-align: left; }
#site { padding: 2px 8px; border: 1px solid #b2b2b2; font-weight: bold; cursor: pointer; }
#site span { float: right; border-left: 1px solid #b2b2b2; padding-left: 8px; }
#site span.x { transform: rotateX(180deg); }
.footer_right .site { line-height: 1.4em; border: 1px solid #e2e2e2; display: none; padding-top: 4px; }
.footer_right .site > li a { widows: 100%; display: block; line-height: 1.8em;}
.footer_right .site > li:hover { color: black; background-color: #f2f2f2; }

/************************** Quick ***************************/

#q_img { position: fixed; 
         z-index: 99;
         right: 80px; 
         top: 180px; border: 1px solid #fff;
       }

#bt { position: fixed; 
      right: 80px;
      bottom: 80px; 
      z-index: 99;
    }
#bt a { width: 30px;  
        border: 1px solid #e2e2e2;
        background-color: #fff; 
        border-radius: 4px; 
        display: block; 
        text-align: center; 
        line-height: 1.8em; 
    	cursor: pointer;    
      }
#bt a:first-child { margin-bottom: 8px; }

/************************** Popup ***************************/







/*   모바일 버전   */


@media all and (max-width:1580px) {
    #q_img { display: none; }
    #header .top_box { display: none; }
    
