@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
*{margin:0; padding:0; box-sizing:border-box; letter-spacing:-0.03em;}
img {border:0;vertical-align:top;}
a {border:0; text-decoration:none; color:inherit;}
ul, li {list-style:none;}
body {font-family: 'Nanum Gothic', sans-serif;color:#444;}
div {display:block;}
h1,h2,h3 {font-family: 'Nanum Gothic', sans-serif;}
h1 {font-size:36px;}
h2 {font-size:30px;}
h3 {font-size:24px;}
/* °øÅë */
.container {width:100%; min-width: 1200px;}
.container_fix {width:1200px; margin:0 auto;}
.clearfix:after {content:""; clear:both; display:block;}
.float {float:left;}
.float_r {float:right;}
.hide {
    display: inline-block;
    position: absolute;
    z-index: -10;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    filter: alpha(opacity=0);
    -ms-filter: 'alpha(opacity=0)';
    font-size: medium;
    line-height: normal;
    word-break: break-all;
}
#wrap {width:100%; min-width:1200px; text-align:center; margin:auto; }
/*
#header {width:100%; min-width:1200px;}
#header #header_area {width:1200px;margin:0 auto 0;text-align:center;display:inline-block;}
#header #header_area .logo {margin-top:45px;float:left;}
#header #header_area #gnb {float:right;margin-top:40px;}
#header #header_area #gnb > ul > li {float:left;font-size:19px;padding-left:60px;}
#header #header_area #gnb > ul > li p {line-height:77px;margin-top:-25px;}
#header #gnb .subnav {
 background-color:#fff; 
 clear:both;
 display: blcok;
 position: absolute;
 text-align:left;
  z-index:10;
  font-size:13px;
  color:#666;  
  top:85px;
 height:180px;
 
 }
#header #header_area #gnb > ul > li > .subnav {border-bottom:3px solid #000; background-color:red;}
#header #header_area #gnb > ul > li:hover > .subnav {display:block;}
#header #gnb dl {padding:0;}
#header #gnb dd {line-height:13px;line-height:36px;height:36px;padding:0;}
#header #gnb .subnav a {display:block;}
#header #gnb .subnav a:hover {color:#fe8500;}
#snb5 {margin-left:-130px;}
*/


/*header*/
header .header_wrapper {background-color:#fff;}
header .header_wrapper .header_content {width:100%; margin:0 auto;}
nav .nav_wrap {display:block; width:1200px; margin:0 auto;}
nav .nav_logo {float:left; margin-bottom:18px; padding-top:30px;}
nav .call {text-align:right; margin-bottom:5px;}
nav .nav_menu {float:right;}
nav .nav_menu ul.dep01 { margin:0 auto;}
nav .nav_menu ul li {
 float:left;
 position: relative;
}
nav .nav_menu ul:after {content:""; display:block; clear:both;}
nav .nav_menu ul li a {padding:40px 0 35px 80px; color:#303030; font-weight:600; box-sizing:border-box; display:block; font-size:17px;}
nav .nav_menu ul li a:hover {color:#0091d2;}
nav .nav_menu ul li ul {
   display:none;
 position:absolute;
 top:53px;
 background:rgba(51,51,51,0.9);
 padding:0;
 z-index:10;
}
nav .nav_menu ul li ul li { 
  float:none;
  line-height:2.0;
  width:165px;
  border-bottom:1px solid #666;
}
nav .nav_menu ul ul li a {
 line-height:2.0;
 width:165px;
 color:#fff;
 padding:15px 0;
 padding-left:20px;
 font-size:14px;
 }
nav .nav_menu ul li ul li:hover { background:rgba(51,51,51,0.9); }
nav .nav_menu ul li:hover > ul {
  display: block;
}
/*³×ºñ°ÔÀÌ¼Ç ÆîÄ¡±â */
#snb01 {width:100%; height:175px;display:none; position:absolute; top:90px; background:#fff;  z-index:999;   border-bottom:3px solid #0091d2;}
.dep02 {width:1200px; background-color:#fff;  position:relative; margin:0 auto; left:440px;}
.dep02_inner {display:block; right:-80px; background:#fff;}
.dep02 ul {float:left; padding-bottom:10px;}
.dep02 ul li {
 text-align:left;
  line-height:2.0;
  width:142px;
}
.dep02 ul.sub3 li {width:165px;}
.dep02 ul li a{
line-height:2.0;
 color:#000;
 padding:15px 0;
 padding-right:40px;
 font-size:14px;
}
.dep02 ul.sub2 li {margin-right:56px;}
.dep02 ul.sub3 li {margin-right:54px;}
.dep02 ul li:hover a {
text-decoration: underline;}
.dep02:after {content:""; display:block; clear:both;}



/* ¸ÞÀÎ ÄÁÅ×ÀÌ³Ê */
#main {width:100%; min-width:1200px;margin:auto;display:inline-block; background:#fff;}
.flexslider {height:500px;}
.flexslider img {display:block;}
#main .icon_wrap {width:1200px; margin:0 auto; position:relative;}
#main .slide_icon {width:100%;margin:auto; position:absolute; z-index:1;margin-top:-500px;}
#main .slide_icon ul {width:213px;height:500px;background:rgba(0,25,87,0.8);float:right;}
#main .slide_icon ul li {height:167px; border-top:1px #3f4e76 solid;padding-top:60px;}
#main .slide_icon ul li a {padding:60px 10px;}
#main .slide_icon ul li:first-child {border-top:0;}
#main .slide_icon ul li:hover {background:rgba(227,163,69,1);}


.main_content {width:1200px;margin:auto; padding:40px 0;}
.main_content .left .map {border:1px solid #c4c4c4; margin-right:22px;}
.main_content .right .card {float:left; border:1px solid #c4c4c4; height:300px;}
.main_content .right .card_mg {margin-left:17px; padding-bottom:10px;}
.card, .cards>.card {
    max-width: 100%;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 213px;
    min-height: 0;
    background: #FFF;
    padding: 0;
   /* box-shadow: 0 1px 3px 0 #D4D4D5, 0 0 0 1px #D4D4D5; */
    z-index: '';
}
.main_content .right .card .image {overflow:hidden;}
.card>.image, .cards>.card>.image {
    position: relative;
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 0;
    background: rgba(0,0,0,.05);
}
.card>.image>img, .cards>.card>.image>img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: inherit;
}
.main_content .right .card .content {padding:17px 15px 10px; min-height:90px;}
.main_content .right .card .content p {font-size:17px; margin-bottom:5px;}
.main_content .right .card .content span {font-size:13px; color:#a8a8a8; letter-spacing:-0.07em;}
.main_content .right .card .box_btn {width:120px;font-weight:bold; border:1px solid #c4c4c4;margin:0 auto; font-size:14px; padding:3px 18px;
-webkit-transition: all 1s; /* Safari */
    transition: all 1s;
}
.main_content .right .card .box_btn:hover {background-color:#eee; color:#0091d2;}
.main_content .right .card .box_btn span {font-size:13px; color:#0091d2; font-weight:bold; vertical-align:1px;}
.main_content > ul > li {float:left;}
.main_content > ul > li.output {width:240px;border-left:1px #e0e0e0 solid;height:236px;}
.main_content > ul > li.output .top {width:100%;height:54px;border-bottom:1px #e0e0e0 solid;line-height:54px;padding:0 21px;}
.main_content > ul > li.output .top span {font-size:18px;font-weight:bold;}
.main_content > ul > li.output .top span.title {float:left;color:#3a3a3a;}
.main_content > ul > li.output .top span.more {float:right;color:#d21414;}
.main_content > ul > li.output .inner {width:100%;padding:18px 21px;text-align:left;}
.banner {background:#dbdbdb;}
.banner .ban_inner {width:1200px; margin:0 auto; height:77px; line-height:77px; }
.banner h3 {position:absolute; float:left; font-size:18px; letter-spacing:-0.08em; padding-left:50px;}
#footer {width:1200px; margin:0 auto;display:inline-block;position:relative; }
.f_logo {padding-top:25px;}
.footer_txt {font-size:18px;margin:20px auto;display:inline-block;text-align:left;font-size:11px;color:#acacac;line-height:185%;}
.footer_txt span {padding-right:10px;}


/* ¼­ºê */
#sub {width:100%; min-width:1200px;margin:auto;border-bottom:1px #d0d0d0 solid; display:inline-block;}
#sub_top {width:100%; min-width:1200px;height:170px;}
#sub_top .sub_top1 {width:100%; background:url(/base/img/pc/images/sub_top.png) center;height:170px;}
#sub_top .sub_top2 {width:100%; background:url(/base/img/pc/images/sub_top2.jpg) center;height:135px;}


#sub_content {width:1200px;display:inline-block;margin:0 auto 80px;position:relative;z-index:10; padding-top:40px;}
#sub_content .left {width:240px;float:left;text-align:justify;}
#sub_content .left .snb_title {width:100%;height:117px;background:url(/base/img/pc/images/sub_title.png);}
#sub #sub_content .left .snb_title h2 {font-size:28px;color:#fff;padding:55px 0 10px 22px; text-align:left;}
#sub #sub_content .left .snb_title h2.sub2 {padding-top:25px; line-height:1.3;}
#sub_content .left .snb_title span {color:#e18989; font-size:15px;padding-left:22px;}
#sub_content .left .snb {width:100%;line-height:46px;font-size:15px;color:#444;margin:2px auto;}
#sub_content .left .snb li {border-bottom:1px #d0d0d0 solid;width:100%;font-size:15px;}
#sub_content .left .snb a {display:block;padding-left:20px;}
#sub_content .left .snb li > a.on, #sub_content .left .snb li > a:hover {background:url(/base/img/pc/images/snb_on.png) #0091d2 200px center no-repeat; color:#fff; font-weight:bold;}
#sub_content .left .snb dd {border-bottom:1px #e0e0e0 solid;width:100%;font-size:15px;font-size:14px}
#sub_content .left .snb dd a {padding-left:30px;}
#sub_content .left .snb dd a.on,#sub_content .left .snb dd a:hover {font-weight:bold;color:#d21414;}



/* ¼­ºê ¿ìÃø */
#sub_content .right {float:right;width:900px; }
#sub_content .right h1 {font-size:35px;text-align:justify;padding:55px 0 20px; float:left;}
#sub_content .right p {float:right;font-size:12px;font-weight:normal;margin-top:15px;color:#aaaaaa; padding-top:60px;}


#sub_content .right #content {width:100%;text-align:justify; margin-bottom:40px;}
#sub_content .right .line {width:100%;height:1px; background:#c4c4c4; margin-bottom:40px;}


#sub_content .right #content .table_gr {margin-bottom:50px;}
#sub_content .right #content .table {border-top:3px #0091d2 solid;font-size:17px;}
#sub_content .right #content .table1 {border-bottom:1px #0091d2 solid;}


#sub_content .right #content .table th,#sub_content .right #content .table td {border-bottom:1px #e0e0e0 solid;padding:13px 11px; line-height:1.3;}
#sub_content .right #content .table th {color:#666; text-align:justify;}
#sub_content .right #content .table td.td1 {font-weight:bold; color:#0091d2;}
#sub_content .right #content .table td.td2 {font-weight:bold; text-align:center; line-height:1.7;}
#sub_content .right #content .table2 {text-align:center;}
#sub_content .right #content .table2 th {text-align:center; color:#0091d2;}
#sub_content .right #content .table2 td {line-height:1.4;}
#sub_content .right #content .table2 td:nth-child(4) {text-align:justify;}
#sub_content .right #content h3 {margin-bottom:10px;}


#sub_content .right #content .table-sm th, #sub_content .right #content .table-sm td {padding:13px 0px;}


#sub_content img.patent {margin-left:7px; width:935px; height:auto;}
p.certi_tit {font-size:22px; text-align:center; padding-bottom:20px;}
ul.certificate {width:100%;}
ul.certificate li {float:left;margin:10px 7px;border:1px #e0e0e0 solid;}


h3 span {color:#4996cf;}


/*±³À°*/
.panel_txt {margin-bottom:30px; padding-left:10px;}
.panel_txt h3 span {color:#4996cf;}
.panel_txt ul li {font-size:17px; line-height:1.6;}
.panel_txt ul li ul {text-indent:20px;}
#sub_content .right .panel_txt p {font-size:17px; line-height:1.6; float:none; margin:0; padding:0; color:#444;}
.panel_txt img {display:block; margin:0 auto;}


/*±³Àç½Åû*/
.book_info {width:510px;}
#sub_content .right .book_info p {font-size:17px; line-height:1.6; float:none; margin:0; padding:0; color:#444;}
.book_info ul li {font-size:17px; line-height:1.6;}
.book_info ul li ul {text-indent:20px;}
.book_info h4 {color:#4996cf; font-size:18px; margin-top:20px; margin-bottom:5px; border-top:1px solid #e5e5e5;padding-top:15px;}
.book_thumb {width:258px; margin-right:63px;margin-bottom:25px;}
.book_thumb:nth-child(3n) {margin-right:0px;}
.book_thumb .txt {margin-top:15px; font-weight:bold; line-height:1.5;} 


/* ±³Àç½Åû */
#sub #sub_content .cont_left {margin-right:40px;}
#sub #sub_content .cont_right .btn_apply {display:block; text-align:center;
}
#sub #sub_content .cont_right .btn_apply a {
    display: block;
    width: 300px;
    height: 60px;
    padding-top: 20px;
    background-color: #f8b059;
    border-radius: 50px;
    color: #fff;
    font-size: 20px;
    font-weight:bold;
    margin-top:20px;


}


/* ¼­ºêtab */
#sub_content .right #content {width:100%;display:inline-block;}
#sub_content .right #content ul.tabs {width:100%; height:42px; line-height:42px; margin:0 auto;}
#sub_content .right #content ul.tabs li {display:inline-block;float:left; text-align:center; font-size:17px; color:#808080;  letter-spacing:-1px; text-transform:uppercase; background:#f5f5f5;border-top:3px #b9b9b9 solid;margin-right:0.1%;}
#sub_content .right #content ul.tabs li a {display:block;}
#sub_content .right #content ul.tabs li.active, #sub_content .right #content ul.tabs li:hover  {border-top:3px #ff8500 solid;color:#303030;}
#sub_content .right #content ul.tabs.t2 li {width:49.9%;}
#sub_content .right #content ul.tabs.t4 li {width:24.9%;}
#sub_content .right #content ul.tabs.t5 li {width:19.9%;}
#sub_content .right #content ul.tabs li.last {margin-right:0;}
#sub_content .right #content .tab_container {width:100%;display:inline-block; margin-top:20px;}
#sub_content .right #content .tab_content {width:100%;display:inline-block; min-height:280px;}


/*¼­ºê tabtab */
#sub_content .right #content #content1 {width:920px; margin:20px auto 0;}
#sub_content .right #content #content1 ul.tabs1 {width:100%; height:35px; line-height:35px; margin:0 auto;}
#sub_content .right #content #content1 ul.tabs1 li {display:inline-block;float:left; text-align:center; font-size:15px; color:#808080;  letter-spacing:-1px; text-transform:uppercase; background:#f5f5f5;border-top:3px #b9b9b9 solid;margin-right:0.1%;}
#sub_content .right #content #content1 ul.tabs1 li a {display:block;}
#sub_content .right #content #content1 ul.tabs1 li.active, #sub_content .right #content #content1 ul.tabs1 li:hover  {border-top:3px #b07b42 solid;color:#303030;}
#sub_content .right #content ul.t2 li {width:49.9%;}
#sub_content .right #content ul.t3 li {width:33.2%;}
#sub_content .right #content ul.t4 li {width:24.9%;}
#sub_content .right #content ul.t5 li {width:19.9%;}
#sub_content .right #content #content1 .tab_container1 {width:100%;display:inline-block; margin-top:20px;}
#sub_content .right #content #content1 .tab_content1 {width:100%;display:inline-block; min-height:280px;}


#sub_content .right #content #content1 ul.tabs2 {width:100%; height:35px; line-height:35px; margin:0 auto;}
#sub_content .right #content #content1 ul.tabs2 li {display:inline-block;float:left; text-align:center; font-size:15px; color:#808080;  letter-spacing:-1px; text-transform:uppercase; background:#f5f5f5;border-top:3px #b9b9b9 solid;margin-right:0.1%;}
#sub_content .right #content #content1 ul.tabs2 li a {display:block;}
#sub_content .right #content #content1 ul.tabs2 li.active, #sub_content .right #content #content1 ul.tabs2 li:hover  {border-top:3px #b07b42 solid;color:#303030;}
#sub_content .right #content #content1 .tab_container2 {width:100%;display:inline-block; margin-top:20px;}
#sub_content .right #content #content1 .tab_content2 {width:100%;display:inline-block; min-height:280px;}


/* ¾ÆÄÚµð¾ð */
.accordi_wrap {width:750px; margin:0 auto;}
/* Style the buttons that are used to open and close the accordion panel */
button.accordion {
    color: #fff;
    cursor: pointer;
    padding: 20px 0 18px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
position: relative;
margin-bottom:50px;
border-radius:100px;
font-size:24px;
font-weight:bold;
font-family: 'Nanum Gothic', sans-serif;
}
.accordion span {  
    display: inline-block;
    width: 100%;
    text-align: center;
}
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
button.accordion.active, button.accordion:hover {
-moz-box-shadow: inset 0 0 20px rgba(0,0,0,0.35); -webkit-box-shadow: inset 0 0 20px rgba(0,0,0,0.35); box-shadow: inset 0 0 20px rgba(0,0,0,0.35);
}



/* Style the accordion panel. Note: hidden by default */
div.panel {
    padding: 0;
    background-color: white;
    display: none;
}


/* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel content */
div.panel.show {
    display: block;
}


button.accordion:after {
    content: "";
    position: absolute;
    right: 30px;
    top: 25px;
    font-size: 25px;
    font-weight: 200;
    color: #444;
    height: 16px;
    width: 18px;
    background: url('/base/img/pc/images/acodi_arr.png') center center no-repeat;
    background-size: 70%;
}


button.accordion.active:after {
    -webkit-transform: rotate(-180deg); 
    -ms-transform: rotate(-180deg); 
    transform: rotate(-180deg); 
}
.accordion:nth-child(1) {background:/*#104AA8;*/#61b2ed;}
.accordion:nth-child(n+3) {background:/*#104AA8;*/#61b2ed;}
.accordion:nth-child(2n+2) {background:/*#65C8E8;*/#3992d5;}
.accordion:nth-child(3n+3) {background:/*#1069D1;*/#4786ce;}



/* ¼­ºê ¹Ù·Î°¡±â ¹öÆ° */
#sub .btn_go {text-align:center;}
#sub .btn_go a {
    display:inline-block;
    width:336px;
    height:70px;
    padding-top:23px;
    background-color: #fc594c;
    border-radius: 70px;
    color: #fff;
    font-size: 20px;
    margin-right: 20px;
}


#sub .btn_go a.btn1 {background-color:#f8b059;}
#sub .btn_go a.btn2 {background-color:#4dc7b7;}



/* ¾ÆÄÚµð¾ð-Á¤°ü */


#sub #sub_content .right h2 {text-align:center; margin-bottom:40px; padding-top:50px; font-size:26px; font-family: 'Nanum Gothic', sans-serif;
} 
#sub #sub_content .right span.date { 
   width: 100%;
    font-size: 13px;
    text-align: right;
    display: inline-block;
    line-height: 1.4;
    color: #888;
    margin-bottom: 10px;
}
#sub .accordi2_wrap {border:1px solid #c4c4c4;}
button.accordion2 {
    background-color: #f9f9f9;
    border:1px solid #c4c4c4;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
font-size:18px;
font-family: 'Nanum Gothic', sans-serif;
}
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
button.accordion2.active, button.accordion2:hover {
    background-color: #ddd;
}


/* Style the accordion panel. Note: hidden by default */
div.panel2 {
    padding: 25px;
    background-color: white;
    display: none;
    border-bottom:1px solid #c4c4c4;
}
button.accordion2:after {
    content: "";
    position: absolute;
    right: 30px;
    padding-top:15px;
    color: #444;
    height: 8px;
    width: 14px;
    background: url('/base/img/pc/images/acodi2_arr.png') center center no-repeat;
}


button.accordion2.active:after {
    -webkit-transform: rotate(-180deg); 
    -ms-transform: rotate(-180deg); 
    transform: rotate(-180deg); 
}


#sub_content .right .panel2 h5 {margin-bottom:10px;}
#sub_content .right .panel2 p {padding:0; line-height:1.6; float:none; font-size:14px; color:#666; margin-bottom:20px; margin-top:0;}
#sub_content .right .panel2 ul {font-size:14px; /*margin-bottom:20px;*/}
#sub_content .right .panel2 ul li {line-height:1.6;}
#sub_content .right .panel2 ul ul {padding-left:10px;}
/* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel content */
div.panel2.show {
    display: block;
}


#sub_content .right .accordion2 {background:#f9f9f9; border-bottom:1px solid #c4c4c4;}






/* Æû¸ÞÀÏ */
#sub #content textarea[name="description"] {width:97%;}


/*¼­ºê ¿À½Ã´Â±æ*/
#sub_content #content .com_pic {padding-bottom:50px;}


.board {border:0;}
.board td {border:0; }