@charset "utf-8";
/* NanumGothic */
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

/* base */
html{overflow-y:scroll; overflow-x:hidden;}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, input, figure,figcaption{margin:0;padding:0;}
h1, h2, h3, h4, h5, h6{font-weight:normal;font-size:100%;}
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;}
#top_wrap{width:100%; height:140px; background:url('../images/top_bg.jpg') repeat-x center top;}
#middle_wrap{width:100%; overflow:hidden; position:relative;}
#bottom_wrap{width:100%; overflow:hidden; background:#f6f5f5; padding:25px 0; border-top:1px solid #cccccc;}

/* top div위치조절 */

#top_total{ width:1100px; height:140px; margin:0 auto;}
#logo{ float:left; width:220px; height:70px; margin-top:15px; margin-bottom:15px;}
#login{float:right; height:20px; margin-top:50px;}
#login ul li{ float:left; margin-left:15px;}
#login ul li a{font-family:"Nanum Gothic"; font-size:13px; color:#666; font-weight:400;}
#login ul li a:hover{ color:#000;}

#top_nav{ float:left; width:100%; height:40px;}
#top_nav > ul{ width:1100px; height:40px; display:block; border-left:1px solid rgba(255,255,255,0.3);}
#top_nav > ul > li{ float:left; position:relative;}
#top_nav > ul > li > a{display:block; width:219px; height:40px; border-right:1px solid rgba(255,255,255,0.3); text-align:center; font-family:"Nanum Gothic"; font-size:16px; line-height:40px; color:#fff; font-weight:700;}
#top_nav > ul > li:hover > a{ color:#eb7239;}
#top_nav ul li .s_nav{display:none; position:absolute; z-index:100; top:40px; left:0; width:220px; overflow:hidden;}
#top_nav ul li:hover .s_nav{display:block;}
#top_nav ul li .s_nav li{ text-align:center;}
#top_nav ul li .s_nav li a{display:block; width:100%; text-align:center; background:#fefefe; font-family:"Nanum Gothic"; font-size:12px; line-height:40px; color:#333; font-weight:400;}
#top_nav ul li:hover .s_nav li a:hover{color:#777;}





#main_img{margin:0 auto; width:100%; overflow:hidden; margin-top:10px; background:#f6f5f5;}
#sub_img_wrap{position:relative; width:100%; height:280px; padding-top:10px;}
#sub_copy{position:absolute; left:50%; top:auto; margin-left:-560px; width:679px; height:96px; z-index:50;}
#sub_img{position:absolute; left:50%; margin-left:-800px; width:1600px; height:280px;}

#main_banner{position:relative; width:1100px; left:50%; margin-left:-550px; height:500px}
.tinyslide { width: 100%; height: 100%; position: relative; overflow: hidden; }
.tinyslide .navigator { position: absolute; bottom: 2em; left: 50%; margin-left:450px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.tinyslide .navigator ul { padding: 0; }
.tinyslide .navigator ul li { float: left; list-style-type: none; margin: 0 0.5em 0 0; padding: 0; width: 12px; height:12px; border: 1px solid #ddd; border-radius: 100%; -webkit-transition: all 500ms linear; transition: all 500ms linear; background: #fff; }
.tinyslide .navigator ul li span { display: none; }
.tinyslide .navigator ul li:hover { background: #333;}
.tinyslide .navigator ul li.active { background: #333; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.4); }
.tinyslide aside { height: 100%; width: 100%; -webkit-transition: -webkit-transform 800ms cubic-bezier(0.365, 0.84, 0.44, 1); transition: transform 800ms cubic-bezier(0.365, 0.84, 0.44, 1); -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.tinyslide figure {height: 100%; float: left; position: relative; width: 1100px; z-index: 1; }
.tinyslide figure img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }
.tinyslide figure figcaption { position: absolute; font-size: 3em; color: #993333; bottom:200px; left:670px; z-index: 2; opacity: 0; }
.tinyslide figure figcaption.main_copy01{bottom:0px; left:50%; margin-left:-550px;}


.tinyslide figure.active figcaption { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 2s; animation-duration: 2s; }
@-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(100px); transform: translateX(100px); }
  100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } }
@keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(100px); transform: translateX(100px); }
  100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } }
  
/* middle div위치조절 */
#sub_img_201{margin:0 auto 0; width:100%; height:805px; position:relative; overflow:hidden;}
#main_middle{margin:0 auto 0; width:1100px; overflow:hidden;}
.last{margin-right:0 !important;}

#main_bottom_a{margin:20px auto 30px; width:1100px; overflow:hidden;}
.quick_menu{width:100%; overflow:hidden;}
.quick_menu ul li{float:left; margin-right:12px;}
.quick_menu ul li a{display:block; width:210px; height:150px; text-indent:-5000px; background:url('../images/qmenu.jpg');}
.quick_menu ul li.q01 a{background-position:0 0;}
.quick_menu ul li.q02 a{background-position:-223px 0;}
.quick_menu ul li.q03 a{background-position:-445px 0;}
.quick_menu ul li.q04 a{background-position:-668px 0;}
.quick_menu ul li.q05 a{background-position:-890px 0;}
.quick_menu ul li.q01:hover a{background-position:0 -150px;}
.quick_menu ul li.q02:hover a{background-position:-223px -150px;}
.quick_menu ul li.q03:hover a{background-position:-445px -150px;}
.quick_menu ul li.q04:hover a{background-position:-668px -150px;}
.quick_menu ul li.q05:hover a{background-position:-890px -150px;}

.quick_menu ul li.q01{margin-right:13px;}
.quick_menu ul li.q03{margin-right:13px;}
.quick_menu ul li.q05{margin-right:0;}

#main_bottom_b{margin:0px auto 30px; width:1100px; overflow:hidden;}
#main_bottom_b li.con_a{float:left; width:360px; height:200px; position:relative; border-bottom:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #ddd; }
.main_con_b_title_wrap{float:left; width:100%; height:38px; border-top:1px solid #ddd;}
.main_con_b_title{margin:30px 0 0 30px; width:200px; height:15px;}
.more{position:absolute; right:20px; top:30px; width:44px; height:12px;}
.main_con_b_area_wrap{float:left; width:360px; height:150px;}/*background:url('../images/main_con_a_bg.jpg') no-repeat center top; overflow:hidden;*/
.main_con_b_area{margin:30px 0 0 30px; widh:330px; height:130px;}

#main_bottom_b li.con_b{float:left; width:360px; height:200px; margin-left:10px; border-bottom:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #ddd;border-top:1px solid #ddd;}
.main_quick_wrap{margin:0 auto; width:305px; height:170px;}
.main_quick{margin:22px 0 0 30px; width:330px; height:170px;}
.main_quick ul li{float:left;}
.main_quick ul li a{display:block; height:161px; margin-right:0px; background:url('../images/main_quick.png') no-repeat;}
.main_quick ul li.qmb01 a{width:292px; height:80px; background-position:0 top;}
.main_quick ul li.qmb02 a{width:292px; height:81px; background-position:0px -80px;}
.main_quick ul li.qmb01 a:hover{width:292px; height:80px; background-position:0 -170px;}
.main_quick ul li.qmb02 a:hover{width:292px; height:81px; background-position:0px -250px;}

#main_bottom_b li.con_c{float:right; width:355px; height:200px; margin-left:5px; border-bottom:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #ddd;border-top:1px solid #ddd;}
.main_con_c_title_wrap{float:left; width:100%; height:38px;}
.main_con_c_title{margin:30px 0 0 30px; width:330px; height:auto;}
.main_con_c_area_wrap{float:left; width:385px; height:130px;}/*background:url('../images/main_con_a_bg.jpg') no-repeat center top; overflow:hidden;*/
.main_con_c_area{margin:30px 0 0 30px; width:330px; height:115px;}

#main_bottom_c{margin:0px auto 60px; width:1100px; overflow:hidden;}
#main_bottom_c li.con_a{float:left; width:300px; height:160px;}
.main_title_a_wrap{float:left; width:100%; height:40px;}
.main_title_a{margin-top:12px; width:137px; height:16px;}
.main_con_a_wrap{float:left; width:300px; height:110px;}
.main_con_a{margin-top:10px; width:300px; height:110px;}
#main_bottom_c li.con_b{float:right; width:745px; height:160px;}
.main_title_b_wrap{float:left; width:100%; height:40px;}
.main_title_b{margin-top:12px; width:83px; height:15px;}
.main_con_b_wrap{float:left; width:745px; height:130px;}/*background:url('../images/main_con_a_bg.jpg') no-repeat center top; overflow:hidden;*/
.main_con_b_01{float:left; margin-top:10px; width:237px; height:110px;}
.main_con_b_02{float:left; margin-top:10px; margin-left:16px; width:237px; height:110px;}
.main_con_b_03{float:right; margin-top:10px; width:237px; height:110px;}


#middle_total{position:relative; margin:20px auto 20px; width:1100px; overflow:hidden;}

/* ---------------------------- left_nav.php ---------------------------- */
/* --- left_nav 사용시 { --- */
#left_total{float:left; width:220px;}
#left_title_wrap{float:left; width:220px; height:95px; background:url('../images/left_nav_top_bg.jpg') no-repeat center top;}
#left_title{margin-top:35px; font-family:"Nanum Gothic"; font-size:15px; color:#fff; line-height:20px; text-align:center; font-weight:500; letter-spacing:-0.5px}/*background:#0765bc; color:#eee;*/
#left_title b{font-size:22px; font-weight:600;}
#left_nav{float:left; width:220px; overflow:hidden; padding-top:14px;}
#left_nav ul{list-style-type:none;}
#left_nav ul li{margin-top:4px;}/*border-bottom:1px solid #ddd;*/
#left_nav ul li a{display:block; color:#444; width:198px; height:38px; padding:0 0 0 20px; font-family:"Nanum Gothic"; font-size:15px; line-height:38px;  text-align:left; font-weight:500; border:1px solid #ccc}
#left_nav ul li a:hover{color:#fff; background:#eb7239 url('../images/left_nav_arrow.png') no-repeat 190px center; font-weight:600; width:200px; height:40px; border:0px;}
#left_nav ul li.on a{color:#fff; background:#eb7239 url('../images/left_nav_arrow.png') no-repeat 190px center; font-weight:600; width:200px; height:40px; border:0px;}
#left_nav ul li.first{margin-top:0px;}/*border-top:1px solid #ddd;*/
#left_customer_wrap{float:left; width:220px; height:400px; overflow:hidden;}
#left_customer{margin-top:25px; width:220px; height:205px;}
#left_inquiry{margin-top:25px; width:220px; height:80px;}

/* con div위치조절 */
#con_total{float:right; width:820px; overflow:hidden;}
#con_title{margin:0 auto; width:820px; height:95px; border-bottom:2px dotted #85c0e3;}
/* --- } left_nav 사용시 --- */

#title_a_wrap{float:left; margin-top:15px; width:420px; font-family:"Nanum Gothic"; font-size:15px; color:#0765bc; line-height:30px; text-align:left; font-weight:bold; letter-spacing:-0.5px}
#title_a_wrap b{font-size:25px; color:#000; font-weight:600;}

#title_b_wrap{float:left; margin-top:10px; height:40px; width:820px;}/*width:770px;*/
#title_b_left{float:left; width:500px; font-family:"Nanum Gothic"; font-size:14px; color:#444; line-height:15px; text-align:left; font-weight:500; letter-spacing:-0.5px}
#title_b{float:right; width:300px; font-family:"Nanum Gothic"; font-size:14px; color:#444; line-height:14px; text-align:right; font-weight:600; letter-spacing:-0.5px}
#title_b b{font-weight:600;}


#con{float:left; margin:60px auto; width:820px; overflow:hidden; padding:0;}

/* bottom div위치조절 */
#bottom_total{margin:0 auto; width:1100px; overflow:hidden; }
#copy_logo{float:left; width:220px; height:65px;}

#copy_total{float:left; width:880px; overflow:hidden; padding-top:15px;}
#copy_nav{ float:right; width:280px; height:20px; }
#copy_nav ul { float:right; display:table; list-style-type:none;}
#copy_nav ul li{float:left; margin-left:15px;}
#copy_nav ul li a{display:block; font-family:"Nanum Gothic"; font-size:12px; line-height:20px; color:#55555; font-weight:600; border-left:1px solid #fff;}
#copy_nav ul li a:hover{color:#777;}
#copy_nav .copy_nav_first a{border-left:0px;}

#copy_txt{float:left; width:600px; overflow:hidden; font-family:"Nanum Gothic"; font-size:12px; line-height:16px; color:#555555; font-weight:500; letter-spacing:-0.3px;}