@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);

body {margin:0; padding:0; word-break: keep-all ;font-family:'Nanum Gothic', 'Dotum', 'Arial'; }
body h1,h2,h3,h4,h5,h6,a,p{font-family:'Nanum Gothic', 'Dotum', 'Arial'; color:#666;}
body a {text-decoration: none; -webkit-transition: 0.25s; transition: 0.25s; }
body a:focus {  color: #417ac2;  text-decoration: none;}
body a:focus { outline: none;}
body p {font-size: 13px; line-height: 1.72222; margin: 0px 0px 0px 0px; word-break: keep-all ; }


.txtL{text-align:left;}
.txtC{text-align:center;}
.txtR{text-align:right;}


.txt12{font-size:12px;}
.txt14{font-size:14px;}
.txt16{font-size:16px;}
.txt18{font-size:18px;}
.txt20{font-size:20px;}
.txt22{font-size:22px;}
.txt24{font-size:24px;}
.txt26{font-size:26px;}
.txt28{font-size:28px;}
.txt30{font-size:30px;}


.pd0{padding:0px;}

.pdt5{padding-top:5px;}
.pdt10{padding-top:10px;}
.pdt15{padding-top:15px;}
.pdt20{padding-top:20px;}
.pdt25{padding-top:25px;}
.pdt30{padding-top:30px;}
.pdt35{padding-top:35px;}
.pdt40{padding-top:40px;}
.pdt45{padding-top:45px;}
.pdt50{padding-top:50px;}
.pdt55{padding-top:55px;}
.pdt60{padding-top:60px;}
.pdt65{padding-top:65px;}
.pdt70{padding-top:70px;}


.pdl5{padding-left:5px;}
.pdl10{padding-left:10px;}
.pdl15{padding-left:15px;}
.pdl20{padding-left:20px;}
.pdl25{padding-left:25px;}
.pdl30{padding-left:30px;}
.pdl35{padding-left:35px;}
.pdl40{padding-left:40px;}
.pdl45{padding-left:45px;}
.pdl50{padding-left:50px;}

.pdr5{padding-right:5px;}
.pdr10{padding-right:10px;}
.pdr15{padding-right:15px;}
.pdr20{padding-right:20px;}
.pdr25{padding-right:25px;}
.pdr30{padding-right:30px;}
.pdr35{padding-right:35px;}
.pdr40{padding-right:40px;}
.pdr45{padding-right:45px;}
.pdr50{padding-right:50px;}

.pdb5{padding-bottom:5px;}
.pdb10{padding-bottom:10px;}
.pdb15{padding-bottom:15px;}
.pdb20{padding-bottom:20px;}
.pdb25{padding-bottom:25px;}
.pdb30{padding-bottom:30px;}
.pdb35{padding-bottom:35px;}
.pdb40{padding-bottom:40px;}
.pdb45{padding-bottom:45px;}
.pdb50{padding-bottom:50px;}
.pdb60{padding-bottom:60px;}
.pdb70{padding-bottom:70px;}


/* ·¹ÀÌ¾î ÆË¾÷ */
@media (max-width: 810px) {
#divpop{position:absolute;left:0%;top:0%; width:100%; max-width:400px; z-index:5000; border-radius:20px; border:0px solid #747474;}
}
@media (min-width: 810px) {
#divpop{position:absolute;left:28%;top:7%; width:400px;height:360px;z-index:5000; border-radius:20px; border:0px solid #747474; box-shadow:5px 5px 20px rgba(0,0,0,0.3); 
}



@media (max-width: 810px) {
#wrapper {margin:0px auto; width:100%;  background:#f2f2f2;}
#wrapper:after {display:block; visibility:hidden; clear:both;content:""}
}
	
@media (min-width: 810px) {
#wrapper {margin:25px auto; width:96%; max-width:1780px; background:#f2f2f2;}
#wrapper:after {display:block; visibility:hidden; clear:both;content:""}
}




#header {width: 100%;  position: relative;}
#header .navbar-toggle { float: right;  padding: 5px 7px;  margin-top: -0px;  margin-bottom: 0;
  color: #666;
  font-size: 18px;
  line-height: 0;
  border-color: transparent;
  background: #444;
  color: #FFF;
}

#header .navbar-toggle:hover {  text-decoration: none;}
#header .navbar-toggle.collapsed {  background-color: transparent;}
#header .navbar-toggle.collapsed:hover,#header .navbar-toggle.collapsed:focus {  background: #222;}
#header #sidebar-toggle.collapsed {  color: #fff;}
#top-bar {
  position: absolute;
  top: 0;
  left: 0;
  padding:12px 25px 0 240px;
  width: 100%;
  height: 76px;
  color: #FFF;
}
#top-bar .nav > li {
  float: left;
  font-size: 12px;
}
#top-bar .nav > li > a {
  color: #204c83;
  line-height:20px;
  font-size:13px;
}
#top-bar .nav > li > a .caret {
  border-top-color: #fff;
  border-bottom-color: #fff;
}
#top-bar .nav > li > a i {
  margin-right: .35em;
}
#top-bar .nav > li > a:hover {
  background-color: #444;
}
#top-bar .nav > li > a:active,
#top-bar .nav > li > a:focus,
#top-bar .nav > li.open > a {
  background-color: #222;
}
#top-bar .nav.pull-right .dropdown-menu {
  left: auto;
  right: 0;
}
#top-bar .nav.pull-right .dropdown-menu::before,
#top-bar .nav.pull-right .dropdown-menu::after {
  left: auto;
  right: 9px;
}
#top-bar .nav.pull-right .dropdown-menu::after {
  left: auto;
  right: 10px;
}
#top-bar .nav .dropdown-menu {
  top: 93%;
  border-radius: 5px;background-color: #222;
}
#top-bar .nav .dropdown-menu::before,
#top-bar .nav .dropdown-menu::after {
  content: '';
  display: inline-block;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #CCC;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  top: -7px;
  left: 9px;
}
#top-bar .nav .dropdown-menu::after {
  border-left-width: 6px;
  border-right-width: 6px;
  border-bottom-width: 6px;
  border-bottom-color: #fff;
  top: -6px;
  left: 10px;
}


#aside {float:right; margin:0px 0px 0px -1px; width:210px; border-left:1px solid #dde4e9; background:#fff}

#container {z-index:4; position:relative; float:left; padding:15px 16px 15px 15px; width:728px; min-height:500px; height:auto !important; height:500px; border-right:1px solid #dde4e9; background:#fff; font-size:1em;zoom:1}
#container:after {display:block; visibility:hidden; clear:both; content:""}



/* »ó´Ü */
.container-fluid {padding-top: 10px; font-weight: bold; outline: none; -moz-box-sizing: border-box;box-sizing: border-box; }



/* ¸Þ´º */
@media (min-width: 810px) {
.nav{padding:0px; }
.nav ul{padding:0px; }
.nav ul li{list-style: none; padding:4px;}
.gnb_1dli{color:#fff; font-size:14px; FONT-WEIGHT: bold; text-align:center; padding:20px 0px 20px 0px;}
.gnb_1dli a{color:#fff; text-decoration: none;}
.gnb_2dli{font-size:13px; padding:4px;}
}

@media screen and (min-width:880px) and (max-width:1280px) {
.nav{padding:0px; }
.nav ul{padding:0px; }
.nav ul li{list-style: none; padding:2px;}
.gnb_1dli{color:#fff; font-size:12px; letter-spacing:-0.05em; FONT-WEIGHT: bold; text-align:center; padding:20px 0px 20px 0px;}
.gnb_1dli a{color:#fff; text-decoration: none;}
.gnb_2dli{font-size:13px; padding:4px;}
}




/* ·Î°í */
@media (max-width: 992px) {
.logo{position:relative;background:#ffffff; padding:15px 0px 5px 0px; text-align:center; margin:0px; height:85px; border: 1px solid #FFF;}
}
	
@media (min-width: 992px) {
.logo{position:relative;background:#ffffff; padding:40px 7px 0px 7px; margin:0px; height:200px; border: 1px solid #FFF;}
}



/* ¸ÞÀÎ WORK */


@media (max-width: 810px) {
.mCon2{background:#FFFFFF;height:100%; padding-bottom:20px; }
.mWork{position:relative;width:92%; margin:0px auto; padding:20px 0px 0px 0px; }
.mWork h2{color:#647284; font-size:34px;	FONT-WEIGHT: bold; }
.mWork_wrap{position:relative;padding:15px 0px 15px 0px; border-bottom: 1px solid #eeeeee;}
.mWork_wrap h3{font-size:20px; color:#222;}
.mWork_wrap .txt{font-size:12px;  line-height:140%; letter-spacing:-0.05em; }
}
	
@media (min-width: 810px) {
.mCon2{background:#FFFFFF;height:100%;  min-height:900px;}
.mWork{position:relative;width:90%; margin:0px auto; padding:50px 0px 0px 0px;}
.mWork h2{color:#647284; font-size:48px;	FONT-WEIGHT: bold;}
.mWork_wrap{position:relative;padding:35px 0px 35px 0px; border-bottom: 1px solid #eeeeee;}
.mWork_wrap h3{font-size:24px; letter-spacing:-0.05em; color:#222;}
.mWork_wrap .txt{font-size:13px;  line-height:150%; letter-spacing:-0.05em; }
}


@media screen and (min-width:992px) and (max-width:1200px) {
.mCon2{background:#FFFFFF;height:100%;  min-height:450px; }
.mWork{position:relative;width:92%; margin:0px auto; padding:50px 0px 0px 0px;}
.mWork h2{color:#647284; font-size:48px;	FONT-WEIGHT: bold;}
.mWork_wrap{position:relative;padding:35px 0px 35px 0px; border-bottom: 1px solid #eeeeee;}
.mWork_wrap h3{font-size:20px; letter-spacing:-0.05em; color:#222;}
.mWork_wrap .txt{font-size:13px;  line-height:150%; letter-spacing:-0.05em; }
.mWork_wrap img{padding-right:15px;}
}





/* ¸ÞÀÎ Introduction */
@media (max-width: 810px) {
.mIntroduction{width:100%;  padding:0px 0px 0px 0px;  background-color:#2a64ad; }
.mIntroduction a{text-decoration:none; color:#fff;  }
.mIntroduction h2{text-align:center; color:#fff; font-size:20px; }
.mIntroduction .txt{color:#c9dcf4; padding:10px 30px 5px 28px; letter-spacing:-0.05em; font-size:12px;}

.mIn{padding:15px 0px 15px 0px;border-right: 1px solid #5176a6; }
.mIn h2{font-size:15px;}
.mMa{padding:15px 0px 15px 0px; border-right: 1px solid #5176a6;}
.mMa h2{font-size:15px;}
.mCo{padding:15px 0px 15px 0px;}
.mCo h2{font-size:15px;}
}
	
@media (min-width: 810px) {
.mIntroduction{position:absolute; width:100%; min-height:290px;  bottom:0px; padding:0px 0px 0px 0px; background-color:#535353; }
/*.mIntroduction{position:absolute; width:100%; min-height:290px;  bottom:-1px; padding:0px 0px 0px 0px; background: url('/images/gray_bg.png') repeat;} */
.mIntroduction a{text-decoration:none; color:#fff; }
.mIntroduction h2{text-align:center; color:#fff;}
.mIntroduction .txt{color:#adaead; padding:10px 30px 5px 30px; letter-spacing:-0.05em; font-size:14px;}

.mIn{padding:30px 0px 30px 0px;border-right: 1px solid #606060;}
.mMa{padding:30px 0px 15px 0px;}
.mCo{padding:30px 0px 30px 0px;border-left: 1px solid #606060;}
}


@media screen and (min-width:992px) and (max-width:1200px) {
.mIntroduction{position:absolute; width:100%; min-height:290px;  bottom:-1px; padding:0px 0px 0px 0px; background-color:#535353; }
/*.mIntroduction{position:absolute; width:100%; min-height:290px;  bottom:-1px; padding:0px 0px 0px 0px; background: url('/images/gray_bg.png') repeat;} */
.mIntroduction a{text-decoration:none; color:#fff; }
.mIntroduction h2{text-align:center; color:#fff;}
.mIntroduction .txt{color:#adaead; padding:10px 30px 5px 30px; letter-spacing:-0.05em; font-size:12px;}

.mIn{padding:30px 0px 30px 0px;border-right: 1px solid #606060;}
.mMa{padding:30px 0px 15px 0px;}
.mCo{padding:30px 0px 30px 0px;border-left: 1px solid #606060;}
}





/* ¸ÞÀÎ Development */

@media (max-width: 810px) {
.mDe{width:90%; margin:0px auto; border-bottom: 0px solid #eeeeee; padding:25px 0px 25px 0px;}
}
	
@media (min-width: 810px) {
.mDe{width:80%; margin:0px auto; border-bottom: 1px solid #eeeeee; padding:25px 0px 25px 0px;}
}


@media screen and (min-width:992px) and (max-width:1200px) {
.mDe{width:92%; margin:0px auto; border-bottom: 1px solid #eeeeee; padding:25px 0px 25px 0px;}
}



/*.mDe{width:80%; margin:0px auto; border-bottom: 1px solid #eeeeee; padding:30px 0px 30px 0px;}*/





/* contents */
@media (max-width: 810px) {
.copyright{width:80%; margin:0px auto;padding:10px 0px 5px 0px; font-size:11px;}
}
	
@media (min-width: 810px) {
.copyright{width:80%; margin:0px auto;padding:10px 0px 5px 0px; font-size:13px;}
}


/* contents */
@media (max-width: 810px) {
.sns{width:80%; margin:0px auto;padding:10px 0px 5px 0px; font-size:11px;}
}
	
@media (min-width: 810px) {
.sns{width:80%; margin:0px auto;padding:10px 0px 5px 0px; font-size:13px;}
}




/* contents */
@media (max-width: 810px) {
.contents{padding:0px 10px 20px 10px;  background-color:#fff; }
}
	
@media (min-width: 810px) {
.contents{min-height:900px; padding:60px 100px 0px 100px;   border-left: 1px solid #eee; border-right: 1px solid #eee;background-color:#fff; }
}


@media screen and (min-width:810px) and (max-width:1200px) {
.contents{min-height:900px; padding:60px 50px 0px 50px;   border-left: 1px solid #eee; border-right: 1px solid #eee;background-color:#fff; }
}




/* contents */
@media (max-width: 810px) {
.contentsM{padding:0px 0px 20px 0px;  background-color:#fff;}
}
	
@media (min-width: 810px) {
.contentsM{min-height:900px; background-color:#fff; }
}

@media screen and (min-width:992px) and (max-width:1200px) {
.contentsM{min-height:750px; background-color:#fff; }
}





/* client */
@media (max-width: 810px) {
.client li{border: 1px solid #eee; height:90px; padding-left:10px;}
.client img{vertical-align:middle;}
.client_1{padding-top:20px;}
.client_2{padding-top:20px;}
.client_3{padding-top:20px;}
.client_4{padding-top:20px;}
.client_5{padding-top:30px;}
.client_6{padding-top:5px;}
}
	
@media (min-width: 810px) {
.client li{border: 1px solid #eee; height:140px;}
.client img{vertical-align:middle;}
.client_1{padding-top:50px;}
.client_2{padding-top:50px;}
.client_3{padding-top:50px;}
.client_4{padding-top:40px;}
.client_5{padding-top:50px;}
.client_6{padding-top:30px;}
}





/* solution */
@media (max-width: 810px) {
.solution li{border: 1px solid #eee; height:170px; padding:15px 0px 0px 0px; }
.solution img{vertical-align:middle;}
}
	
@media (min-width: 810px) {
.solution li{border: 1px solid #eee; height:170px; padding:15px 0px 0px 0px; }
.solution img{vertical-align:middle;}
}



/* Å¸ÀÌÆ² */
@media (max-width: 810px) {
.contents h1{margin:0px 0px 40px 0px; font-size:18px;	padding:10px 0px 10px 0px; text-align:center; FONT-WEIGHT: bold;  background:#417ac2; color:#fff;	}
.tit2{font-size:13px; color:#ddd;}
.tit3{font-size:14px; color:#ddd; FONT-WEIGHT: bold;}
}
	
@media (min-width: 810px) {
.contents h1{margin:0px 0px 40px 0px; font-size:46px;	FONT-WEIGHT: bold; color:#222;}
.tit2{font-size:18px; color:#666;}
.tit3{font-size:26px; color:#666; FONT-WEIGHT: bold;}
}






/* Å¸ÀÌÆ² */
@media (max-width: 992px) {
.menu_bg{background: url('/images/menu_bg2.png') repeat-y;}
}
	
@media (min-width: 992px) {
.menu_bg{background:#417ac2; max-height:900px;}
}






/* ¸ÞÀÎÀÌ¹ÌÁö */
@media (max-width: 810px) {
.mImg{ max-width: 100%;, height: auto; , display: block;}
}
	
@media (min-width: 810px) {
.mImg{min-width:750px; max-width: 100%;, height: auto; , display: block;}
}


@media screen and (min-width:992px) and (max-width:1200px) {
.mImg{min-width:900px; max-width: 100%; height: auto; , display: block;}
}





/* ¸ÞÀÎÀÌ¹ÌÁö */
@media (max-width: 810px) {
.work-wrap{}
.workTxt{padding-top:20px;}
}
	
@media (min-width: 810px) {
.work-wrap{padding-top:50px;}
.workTxt{padding-left:40px; }
}





/* Å×½ºÆ® */
@media (max-width: 768px) {
.test1{	background-color: #036;}
.test2{width:100%; }
}
	
@media (min-width: 769px) {
.test1{float: left; width:20%; 	background-color: #036;}
.test2{width:80%; float: right;}
}

/* ¸ð¹ÙÀÏ ¸Þ´º */
.navbar .navbar-inner {
	position:absolute; margin-top: 25px; right:0px;  z-index:9999999;
} 

.navbar .nav {
	float: right;border: 1px solid #ddd;
	margin-right: 0;background-color: #fff;
}
