@charset "utf-8";
/*나눔고딕*/
@import url(./fonts/NanumGothic/NanumGothic.css);

/*본고딕 포토샵용*/
@import url(./fonts/NotoSans/NotoSansKR.css);

/* base */
html{overflow-y:scroll; overflow-x:hidden;font-family:"Nanum Gothic";}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset,input,figure,figcaption{margin:0;padding:0;font-family:"Nanum Gothic";}
h1, h2, h3, h4, h5, h6{font-weight:normal;font-size:100%;font-family:"Nanum Gothic";}
a{text-decoration:none;}
ul, ol, li{list-style:none;}
img{border:none; vertical-align:middle;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary{display:block;}
table, td, tr{font-family:"Nanum Gothic"; font-size:13px; color:#333; font-weight:400;}

/* div위치조절 */
#wrap{width:100%; overflow:hidden; text-align:left; min-width:1100px; position:relative; background-color:#fff;}
#top_wrap{width:100%; height:120px; background:green;}
#middle_wrap{width:100%; overflow:hidden; position:relative;}
#bottom_wrap{width:100%; height:130px; overflow-x:hidden; background-color:#eaeaea;}

/* top div위치조절 */
#top_total{margin:0 auto; width:1100px; height:115px; position:relative;}
#top_total_a{margin:0 auto; width:1100px; height:115px;} 
#top_a{margin:0 auto; width:1100px; line-height:20px;}

/* 로그인 */
#login{float:right; width:300px; height:20px;}
#login ul {list-style-type:none;}
#login li {float:right; list-style-type:none;}
#login li a{display:block; padding:0 10px 0;  height:40px; font-family:"Nanum Gothic"; font-size:12px; line-height:40px; color:#c3cfe6; font-weight:600;}
#login li a:hover{color:#fff; font-weight:600; }

/* logo */
#top_logo_nav{float:left; width:250px; height:60px; position:relative; margin-top:25px;}
#logo{float:left; margin-left:-150px; width:250px; height:60px;margin-top: -25px;}
#logo img{height: 120px;}


/* top_nav */
div#commonGnb{float:right;width: 815px;height: 50px;margin-top: 40px;}
div#commonGnb div.gnbWrap{width:100%;height: 55px;}
div#commonGnb div.gnbWrap ul.gnbLayer{margin:0 auto;width: 850px;height: 50px;text-align:center;}
div#commonGnb div.gnbWrap ul.gnbLayer li{float:left; width:160px; position:relative; z-index:999;  zoom:1;}
div#commonGnb ul.gnbLayer li{position:relative;}
div#commonGnb ul.gnbLayer li a{display:block; width:160px; height:70px; padding:0px 10px; font-family:"Nanum Gothic"; font-size:16px; line-height:65px; color:#fff; font-weight:600; letter-spacing:-0.5px;}
div#commonGnb ul.gnbLayer li a:hover{color:#fff; font-weight:600;}
div#commonGnb ul.gnbLayer li dl {position:absolute;left:-10px;top: 60px;width:190px;display:none;}
div#commonGnb ul.gnbLayer li dd {display:block; background:green;opacity: .8;}
div#commonGnb ul.gnbLayer li dd a {display:block; width:190px !important; height:40px; padding:0; font-size:13px; line-height:40px; color:#fff; font-weight:500; border-bottom:1px solid green; letter-spacing:-0.5px;}
div#commonGnb ul.gnbLayer li dd a:hover {background:green; font-weight:600; color:#FFF; letter-spacing:-0.5px;text-decoration: underline;}



/* main */
#top_main_wrap{margin:0 auto; width:100%; overflow:hidden; }


/*main_banner*/
#main_banner_total{margin:0 auto; width:100%; height:560px;   }

/*main_banner*/
#main_banner{position:relative; width:100%; overflow:hidden; background:url('../images/m_bg.jpg') no-repeat top; }
.main_text{ position:absolute; z-index:100; left:50%; top:34%; margin-left:-600px; width:600px;}



/* ---------------------------- index.php (main div위치조절) ---------------------------- */

#main_middle_total{margin:0 auto; width:100%; overflow:hidden; background:url('../images/middle_bg.jpg') repeat-x top;}
#main_con{margin:40px auto; width:1100px; height:155px; margin-bottom:65px;}


/*공지사항*/
.main_a{float:left; width:250px; height:155px; margin-right:40px; }
.main_a_title_wrap{position:relative; width:250px; height:40px; border-bottom:1px solid #cccccc;}
.main_a_title{float:left; width:120px; height:40px;}
.main_a_more{position:absolute; right:5px; top:10px; width:30px; height:15px;}
.main_a_con_wrap{width:250px; height:115px;}
.main_a_con{ padding-top:15px; width:250px; height:100px;}


/* 퀵메뉴*/
#main_quick_total{float:left; width:430px; height:155px; margin-right:40px;}
#main_quick_wrap{float:left;width:430px; height:155px;}
#main_quick{float:left; width:430px;}
#main_quick_title{ float:left; width:430px; height:40px;border-bottom:1px solid #cccccc; }
#main_quick_a_wrap{float:left; position:relative; width:430px; height:115px;}
.main_quick_a{margin:0 auto; width:430px; height:100px; padding-top:15px;}
.main_quick_a li{float:left;}
.main_quick_a li a{display:block; height:220px; background:url('../images/main_quick.png') center center;}
.main_quick_a li.qmb01 a{width:100px; height:100px; margin-right:10px; background-position:0 top;}
.main_quick_a li.qmb02 a{width:100px; height:100px; margin-right:10px; background-position:-110px top;}
.main_quick_a li.qmb03 a{width:100px; height:100px; margin-right:10px; background-position:-220px top;}
.main_quick_a li.qmb04 a{width:100px; height:100px; background-position:-330px top;}

.main_quick_a li.qmb01 a:hover{width:100px; height:100px; margin-right:10px; background-position:0 bottom;}
.main_quick_a li.qmb02 a:hover{width:100px; height:100px; margin-right:10px; background-position:-110px bottom;}
.main_quick_a li.qmb03 a:hover{width:100px; height:100px; margin-right:10px; background-position:-220px bottom;}
.main_quick_a li.qmb04 a:hover{width:100px; height:100px; background-position:-330px bottom;}


/*고객센터*/
.main_d{float:left; width:340px; height:155px;}
.main_d_title_wrap{width:340px; height:40px;}
.main_d_title{float:left; width:340px; height:40px;}
.main_d_con_wrap{width:340px; height:115px;}
.main_d_con{width:340px; height:115px;}


/*서브페이지_ 코딩--------------------------------------------------------------------------------------------------*/

#middle_total{margin:0 auto; padding-top:50px; width:1100px; overflow:hidden;}

/*서브이미지*/
#con_sub{position:relative; margin:0 auto; width:100%; height:240px;}
#con_sub_img{position:absolute; left:21%; width:1100px; height:240px;}
#con_sub_img img{width: 100%;}
#con_sub_copy{position:absolute; left:0%; margin-left:350px; bottom:0px; width:1200px; height:240px;}

/* --left_nav.php -- */
#left_total{float:left; width:235px; min-height:500px;  margin-bottom:20px;}/*overflow:hidden;*/

#left_title_wrap{float:left; width:235px; height:100px; background:url('../images/left_menu_top_bg.jpg') no-repeat;}
#left_title{width:235px; color:#fefefe; font-family:"Nanum Gothic"; font-size:22px; text-align:center; font-weight:600; letter-spacing:-0.5px; margin-top:30px;}
#left_title_eng{margin-top:5px; width:235px; color:#fefefe; font-family:"Nanum Gothic"; font-size:11px; line-height:15px; text-align:center; font-weight:500; letter-spacing:-0.5px;}
#left_customer{float:left; width:235px; height:215px; margin-top:10px; margin-bottom:100px;}

/* 좌메뉴 over */
#left_nav{float:left; width:235px;}/*overflow:hidden;*/
.leftMenu {float:left; width:235px; }/*overflow:hidden;*/
.leftMenu > li > a{display:block; padding-left:17px; width:218px; height:40px; font-family:"Nanum Gothic"; font-size:14px; line-height:40px; font-weight:600; color:#666; background:#fff;}
.leftMenu > .menu01{list-style:none; border-bottom:1px solid #ddd;}
.leftMenu > li{list-style:none; border-bottom:1px solid #ddd; width:235px;}
.leftMenu > li.last{border-top:0px}
.leftMenu > li > a:hover{color:#444444; font-weight:600; background:#f3f3f3 url('../images/left_menu_arrow.png') no-repeat 215px center;}
.leftMenu > li.on > a{color:#ffffff; font-weight:600; background:#444444 url('../images/left_menu_arrow.png') no-repeat 215px center;}
/* 좌메뉴 over */

/* --- } left_nav 사용시 --- */

/* 내용전체 */
#con_total{float:right; width:1000px; overflow:hidden;}
#con_title{float:right; width:1000px; height:100px; padding: 0;}

/* 타이틀_코딩 */
#title_a_wrap{
    float: left;
    height: 44px;
    margin-top: 55px;
    font-family:"Nanum Gothic";
    font-size: 25px;
    line-height: 24px;
    font-weight: 400;
    color: #333;
    border-bottom: solid 1px #333
}

#title_a_sub{float:left; margin-top:5px; width:550px; font-family:"Nanum Gothic"; font-size:13px; color:#555; line-height:15px; text-align:left; font-weight:500; letter-spacing:-0.5px;}
#title_b_wrap{float:right; margin-top:60px; width:400px;}/*width:770px;*/
#title_b{float:right; font-family:"Nanum Gothic"; font-size:13px; color:#b3b3b3; line-height:14px; text-align:right; font-weight:500; letter-spacing:-0.5px}


.title_text_sub{float:left; margin-top:15px; margin-left:10px; font-family:"Nanum Gothic"; font-size:14px; line-height:14px; color:#666; font-weight:500; letter-spacing:-0.5px}
.title_text{font-family:"Nanum Gothic"; font-size:16px; line-height:16px; color:#191818; font-weight:600; letter-spacing:-0.5px}


/* 내용*/
#con{float:left; margin:50px auto; width:1000px; overflow:hidden; padding:0;}



/* ---------------------------- tab_nav.php ---------------------------- */
#bottom_wrap{
position:relative;
width:100%;
height:480px;
background-repeat:no-repeat;
background-position:center top;
background-size:1920px 480px;
overflow:hidden;
}

#bottom_wrap .footer_inner{
position:relative;
width:1920px;
height:480px;
margin:0 auto;
color:#fff;
}

#bottom_wrap .footer_info{
position:absolute;
left:465px;
top:49px;
width:1110px;
}

#bottom_wrap .footer_info p{
margin:0 0 16px 0;
font-size:25.6px;
line-height:1;
font-weight:600;
color:#fff;
letter-spacing:-0.04em;
}

#bottom_wrap .footer_copy{
position:absolute;
left:0;
bottom:24px;
width:100%;
text-align:center;
font-size:14px;
line-height:1;
font-weight:400;
color:#fff;
letter-spacing:-0.04em;
}

#bottom_wrap .footer_copy a{
font-size:14px;
line-height:1;
font-weight:400;
color:#fff;
text-decoration:none;
}

#bottom_wrap .footer_copy span{
display:inline-block;
margin:0 16px;
color:#fff;
}
/* tail.php */
#bottom_total_wrap{margin:0 auto; width:1200px; height:130px; }
#copy_logo_wrap{float:left; width:180px;}
#copy_logo{float:left; margin-top:35px; width:180px; height:55px;}
#bottom_total{float:left; width:1200px; height:130px;}
#copy_nav_wrap{float:left; width:920px; position:relative;}
#copy_nav{margin:0px auto 0px;  height:40px;}
#copy_nav ul {list-style-type:none;}
#copy_nav ul li{float:left; margin-top:15px;}
#copy_nav ul li a{display:block; height:15px; padding:0 10px; font-family:"Nanum Gothic"; font-size:13px; line-height:10px; color:#666666; font-weight:600; letter-spacing:-0.5px;}
#copy_nav ul li a:hover{color:#da1f3d;}
#copy_nav ul li.first a{padding-left:0px;}
#copy_nav ul li.last a{border-right:0px;}
.privacy{color:#09538a;}

#copy_txt_wrap{float:left; width:915px; margin:20px 0 0 40px;}
#copy_txt{margin:20px auto 0; width:915px; font-family:"Nanum Gothic"; font-size:12px; line-height:20px; color:#666; letter-spacing:-0.5px;}

#banner{position:relative;width:100%;height:550px;overflow:hidden;background:#fff;}
#banner .banner_slide{position:absolute;left:0;top:0;width:100%;height:550px;opacity:0;z-index:1;transition:opacity .8s ease;}
#banner .banner_slide.active{opacity:1;z-index:2;}
#banner .banner_slide img{position:absolute;left:50%;top:0;transform:translateX(-50%);height:550px;width:auto;max-width:none;}

#banner .d_prev,
#banner .d_next{position:absolute;top:240px;width:70px;height:70px;cursor:pointer;z-index:10;text-indent:0;}
#banner .d_prev{left:100px;}
#banner .d_next{right:100px;}
#banner .d_prev img,
#banner .d_next img{display:block;width:70px;height:70px;}

#banner .banner_dots{position:absolute;left:0;bottom:25px;width:100%;height:12px;margin:0;padding:0;list-style:none;text-align:center;z-index:20;}
#banner .banner_dots li{display:inline-block;width:10px;height:10px;margin:0 4px;border-radius:50%;background:rgba(255,255,255,.6);cursor:pointer;}
#banner .banner_dots li.active{background:orange;}

#main_product{
position:relative;
width:100%;
height:616px;
overflow:hidden;
background:url('../images/features-background.webp') no-repeat center top;
background-size:cover;
box-sizing:border-box;
}

#main_product .main_product_bg{
display:none;
}

#main_product .main_product_inner{
position:relative;
width:1200px;
height:616px;
margin:0 auto;
padding-top:50px;
box-sizing:border-box;
z-index:2;
}

#main_product .main_product_list{
display:flex;
justify-content:space-between;
width:100%;
height:462px;
}

#main_product .main_product_item{
width:366px;
height:462px;
background:#fff;
border:1px solid #ddd;
box-sizing:border-box;
text-align:center;
overflow:hidden;
}

#main_product .main_product_item a{
display:block;
width:100%;
height:100%;
text-decoration:none;
color:#000;
}

#main_product .main_product_img{
width:366px;
height:206px;
overflow:hidden;
}

#main_product .main_product_img img{
display:block;
width:366px;
height:206px;
object-fit:cover;
border:0;
}

#main_product .main_product_txt{
width:364px;
height:254px;
padding:30px 20px 0;
box-sizing:border-box;
text-align:center;
}

#main_product .main_product_txt h3{
margin:0 0 30px 0;
font-size:30px;
line-height:1.15;
font-weight:600;
color:#000;
letter-spacing:-0.04em;
}

#main_product .main_product_txt p{
margin:0 0 30px 0;
font-size:16px;
line-height:1.5;
font-weight:400;
color:#000;
letter-spacing:-0.04em;
}

#main_product .main_product_txt span{
display:block;
width:186px;
height:38px;
line-height:34px;
margin:0 auto;
border:2px solid #1aa707;
box-sizing:border-box;
background:transparent;
font-size:16px;
font-weight:700;
color:#1aa707;
text-align:center;
}

#main_product .main_product_item a:hover .main_product_txt span{
color:rgba(255,174,0,.996);
}


#ma_youtube{
width:100%;
height:584px;
padding-top:47px;
box-sizing:border-box;
overflow:hidden;
}

#ma_youtube .youtube_wrap{
width:1290px;
margin:0 auto;
display:flex;
justify-content:space-between;
}

#ma_youtube .youtube_item{
display:block;
width:640px;
height:480px;
overflow:hidden;
}

#ma_youtube .youtube_item img{
display:block;
width:640px;
height:480px;
}