@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);


/* 레이아웃 공통 */
#wrap{width:100%; height:auto; position:relative;}
#header_wrap{width:100%; min-height:100px; max-height:400px; z-index:9999; background:rgba(0,0,0,0.7);}
#content_wrap{width:100%; height:auto; overflow:hidden; position:relative; }
#footer_wrap{width:100%; height:180px; position:relative; background:#5f5f5f;}

#header_320 {display:none;}
.m_content_bot {display:none;}
.m_content {display:none;}
.m_img03 {display:none;}
.m_img04 {display:none;}

#header{width:1200px;  position:relative; margin:0 auto;  }
.header{position:relative; width:1200px; height:107px; margin:0 auto; }
.header ul{ position:absolute; top: 45px; left:485px; }
.header ul li{float:left; width:142px;  padding-top:12px; font-size:18px; color:#fff; text-align:center; }
.header li a:link,.header li a:visited{color:#fff;}
.header li a:hover,.header li a:active{color:yellow; }


/* header */
h1.logo { position:absolute; left:32px; top:20px; z-index:10; }

.nav {position:relative;}
.top_nav {position:absolute; top:0; right:60px; line-height:40px; text-align:right; color:#a8a8a8; font-size:15px;}
.top_nav a{color:#a8a8a8;}

.sild-menu{display:none; width: 100%; height: 170px;  box-sizing: border-box; position: absolute; z-index: 9999; top: 1px; left: 0; background-color: #fff; border-bottom: 1px solid #e4e4e4; }
.sild-menu-inner{box-sizing: border-box; width: 1200px; margin: 0 auto; padding: 30px 0 0 246px; overflow: hidden;}
.sild-menu dl{float: left; width: 159px; height: 170px; }
.sild-menu dl:first-child{border-left: none;}
.sild-menu dl dd{text-align: center; margin: 0; line-height:35px; font-size: 15px; color: #242424; font-weight: normal; border-left:1px solid #dadada;}
.sild-menu dl dd a:link,.sild-menu dl dd a:visited{color:#242424;}
.sild-menu dl dd a:hover,.sild-menu dl dd a:active{color:#da2028;}

.con01 {width:100%; height:647px; background:url("../images/main_top01.jpg") no-repeat center center;}
.con01_01 {width:100%; height:647px; background:url("../images/main_top02.jpg") no-repeat center center;}
.con01_02 {width:100%; height:647px; background:url("../images/main_top03.jpg") no-repeat center center;}

.con02_bg {width:100%; height:338px; margin:0 auto; padding-top:48px; background:#f6f6f6;}
.con02 {width:1200px; height:338px; margin:0 auto;  position:relative;}

.box01 {float:left; width:317px; height:53px; padding-top:236px; text-align:center; background:url("../images/box01.jpg") no-repeat center center; margin-right:17px;}
.box02 {float:left; width:317px; height:289px;  text-align:center;}
.app {width:600px; height:315px; float:left; padding-top:40px; }

.calculator {float:left; width:600px; height:303px; margin-top:40px;  padding-top:47px; background:url("../images/calculator_h.jpg") no-repeat center center; position:relative; background-size:100% 100%;}
.calculator p {width:470px;  margin-top:15px; margin-left:130px;}

.intro_top {width:100%; height:397px; background:url("../images/intro_top.jpg") no-repeat center center;}
.office_top {width:100%; height:397px; background:url("../images/office_top.jpg") no-repeat center center;}
.customer_top {width:100%; height:397px; background:url("../images/customer_top.jpg") no-repeat center center;}
.factory_top {width:100%; height:397px; background:url("../images/factory_top.jpg") no-repeat center center;}
.business_top {width:100%; height:397px; background:url("../images/business_top.jpg") no-repeat center center;}

.content {width:1200px; margin:0 auto; }

.intro_tab {width:100%; border-bottom:1px solid #cbcbcb;}
.intro_tab ul {width:1200px; margin:0 auto; position:relative;}
.intro_tab ul li {float:left; width:33%; text-align:center; color:#424242; font-size:22px; line-height:60px; font-weight:400;}



.tab {  background:#fff; overflow:hidden; }
.tab li { float:left; width:50%; text-align:center; box-sizing:border-box; }
.tab li { display:inline-block; cursor:pointer; }
.tab li.on { color:#424242; border-bottom:4px solid #29b6f7;}
.tab_con { clear:both; }
.tab_con div { display:none; line-height:100px; text-align:center; }





.realtime_main {width:508px; height:257px; padding:15px 10px; float:left; margin-right:15px; background:#fff; border:1px solid #d6d6d6;  }
.realtime_main p {height:45px; color:#3c3d3f; font-size:25px; text-align:center;}
.tt { width:508px; height:40px; line-height:40px; text-align:center; color:#062426; border-top:1px solid #dadada; border-bottom:1px solid #dadada;  display:block;}
.tt ul {width:100%; height:40px;  line-height:40px; }

.tt li.tt01 {width:25%; float:left;  color:#062426; font-size:14px;}
.tt li.tt02 {width:12%;  float:left; color:#062426; font-size:14px;}
.tt li.tt03 {width:16%; float:left; color:#062426; font-size:14px;}
.tt li.tt04 {width:25%; float:left; color:#062426; font-size:14px;}
.tt li.tt05 {width:22%; float:left; color:#062426; font-size:14px;}

.realtime_main ul {width:508px; }
.realtime_main ul li {font-size:14px; line-height:34px;  text-align:center; color:#696969; text-align:center; height:34px;}
.realtime_main ul li.li01 {width:25%; float:left; }
.realtime_main ul li.li02 {width:12%; float:left; }
.realtime_main ul li.li03 {width:16%; float:left; }
.realtime_main ul li.li04 {width:25%; float:left; }
.realtime_main ul li.li05 {width:22%; float:left; vertical-align:middle;}

.img03 {width:1200px; margin:0 auto; }
.img04_bg {width:100%; height:308px; padding-top:40px; background:#f6f6f6;}
.img04 {width:1200px; margin:0 auto;}


.footer01 {width:1200px; height:48px; line-height:48px; margin:0 auto; text-align:left; color:#aeaeae; font-size:14px;}
.footer01 span {padding:0 40px 0 0; }
.footer01 span.end {padding:0 0 0 0;}
.footer01 a {color:#aeaeae;}

.footer02 {width:1200px; padding-top:45px; line-height:28px; margin:0 auto; text-align:center; color:#999999; font-size:14px; border-top:1px solid #7f7f7f;}
.footer02 span {padding:0 20px 0 0;}
.footer02 a {color:#999999;}


.member_div {width:850px; margin:0 auto; position:relative;  padding-bottom:70px;}

.member_div table {width:93%; margin:20px auto 0; }
.member_div table tr {font-size:30px; font-size:15px; font-weight:400; color:#666; text-align:left; line-height:25px; margin-bottom:20px;}
.member_div table tr td {text-align:left; padding:5px 10px; }
.member_div table tr td.ttt {text-align:center; font-size:45px; color:#424242; font-weight:400; line-height:100px; padding-top:20px;}
.member_div table tr td.txt {padding:30px 0 0 30px;}
.member_div table tr td span {color:#444; font-weight:500;}

.input_join { background:#f4f4f4; color:#6b6b6b; font-size:16px;  line-height:50px; height:50px;}
.textarea {background:#f4f4f4; color:#6b6b6b; font-size:16px; line-height:30px;}
.checkbox { color:#6b6b6b; font-size:16px; line-height:30px; height:40px;}

.btn04 { text-align:center; margin-top:50px;}

@media screen and (max-width:719px){
  #header_wrap {display:none;}
	#header_320 { width:100%; display:block; margin:0 auto; position:relative; z-index:9999; background:rgba(0,0,0,0.7);}
  #footer_wrap{width:100%; height:170px; margin-bottom:80px;  position:relative; background:#5f5f5f;}

.content {display:none;}
.img03 {display:none;}
.img04 {display:none;}
  .m_content_bot {display:block; width:100%; overflow:hidden; z-index:1000;}




.top_gnb {  width:100%; height:90px; text-align:center; position:relative; }
h1.logo { position:relative; left:0; top:20px; z-index:10; }


.m_menu {position:absolute; top:20px; right:0; z-index:10;}
.m_close{display:none; position:absolute; top:20px; right:0; z-index:10; }
.call {position:absolute; left:0; top:35px; z-index:10;}




.mm_gnb {width:100%;  position:relative; padding:10px 0; overflow:hidden; background:rgba(64,148,202,0.8);}
.mm_gnb ul li {color:#fff; width:32.5%; text-align:center; font-size:17px; line-height:18px; display:inline-block;}
.mm_gnb ul li span {color:yellow;}
.mm_gnb ul li a {color:#fff;}
.mm_gnb ul li a:hover,.mm_gnb li a:active{color:yellow;}


.footer01 {width:100%; height:auto; line-height:48px; margin:0 auto; text-align:center; color:#aeaeae; font-size:14px;}
.footer01 span {padding:0 15px 0 15px; }
.footer01 span.end {padding:0 0 0 20px;}
.footer01 a {color:#aeaeae;}

.footer02 {width:100%; padding:15px 0; line-height:24px; margin:0 auto; text-align:center; color:#999999; font-size:13px; border-top:1px solid #7f7f7f;}
.footer02 span {display:block;}
.footer02 a {color:#999999;}





.con01 {width:100%; height:370px; background:url("../images/m_main_top01.jpg") no-repeat center center; background-size:100% 100%;}
.con01_01 {width:100%; height:370px; background:url("../images/m_main_top02.jpg") no-repeat center center; background-size:100% 100%;}
.con01_02 {width:100%; height:370px; background:url("../images/m_main_top03.jpg") no-repeat center center; background-size:100% 100%;}

.con02_bg {width:100%; height:300px; margin:0 auto; padding-top:10px; background:#f6f6f6;}
.con02 {width:100%; height:280px; margin:0 auto;  position:relative;}
.box01 {display:none;}
.box02 {display:none;}


.realtime_main {width:95%; height:250px; margin:10px; padding:10px 0;   border:1px solid #d6d6d6; }
.realtime_main p {width:100%;height:45px; color:#3c3d3f; font-size:23px; text-align:center;}
.tt {width:95%; height:33px; line-height:33px; text-align:center; margin:0 auto;  color:#062426; border-top:1px solid #dadada; border-bottom:1px solid #dadada; }
.tt ul {width:98%; margin-top:0; }

.tt li.tt01 {width:25%; float:left;  color:#062426; font-size:14px;}
.tt li.tt02 {width:15%;  float:left; color:#062426; font-size:14px;}
.tt li.tt03 {width:13%; float:left; color:#062426; font-size:14px;}
.tt li.tt04 {width:25%; float:left; color:#062426; font-size:14px;}
.tt li.tt05 {width:22%; float:left; color:#062426; font-size:14px;}


.realtime_main ul {width:98%; margin:7px auto 0; overflow:hidden;}
.realtime_main ul li {font-size:12px; line-height:26px;  text-align:center; color:#696969; text-align:center; height:26px; }
.realtime_main ul li.li01 {width:25%; float:left; }
.realtime_main ul li.li02 {width:15%; float:left; }
.realtime_main ul li.li03 {width:13%; float:left; }
.realtime_main ul li.li04 {width:25%; float:left; }
.realtime_main ul li.li05 {width:22%; float:left; vertical-align:middle;}

.m_img03 {display:block; width:100%; margin:0 auto;}

.img04_bg {width:100%; height:210px; padding-top:20px; background:#f6f6f6;}
.m_img04 {display:block; width:100%; margin:0 auto;}
.m_img04 span {width:33%; float:left;}

.m_content {width:100%; display:block;}
.office_top {width:100%; height:320px; background:url("../images/m_office_top.jpg") no-repeat center center; background-size:100% 100%;}
.customer_top {width:100%; height:320px; background:url("../images/m_customer_top.jpg") no-repeat center center; background-size:100% 100%;}
.factory_top {width:100%; height:320px; background:url("../images/m_factory_top.jpg") no-repeat center center; background-size:100% 100%;}
.business_top {width:100%; height:320px; background:url("../images/m_business_top.jpg") no-repeat center center; background-size:100% 100%;}



.member_div {width:100%; margin:0 auto; position:relative;  padding-bottom:20px;}
.member_div table {width:98%; margin:20px auto 0; }
.member_div table tr {font-size:30px; font-size:15px; font-weight:400; color:#666; text-align:left; line-height:25px; margin-bottom:20px;}
.member_div table tr td {text-align:left; padding:5px 10px; }
.member_div table tr td.ttt {text-align:center; font-size:45px; color:#424242; font-weight:400; line-height:100px; padding-top:20px;}
.member_div table tr td.txt {padding:10px 0 0 10px;}
.member_div table tr td span {color:#444; font-weight:500;}

.input_join { background:#f4f4f4; color:#6b6b6b; font-size:16px;  line-height:50px; height:50px;}
.textarea {background:#f4f4f4; color:#6b6b6b; font-size:16px; line-height:30px;}
.checkbox { color:#6b6b6b; font-size:16px; line-height:30px; height:40px;}

.btn04 { text-align:center; margin-top:50px;}

}
