html {height:100%}
/**
 body {background:url(http://totb.kr/site_k/images/event/img3.jpg) no-repeat;background-size:cover;} 
**/
body{
background: #211e68;
background: -webkit-linear-gradient(top left, #211e68 0%, #000 90%);
background: -moz-linear-gradient(top left, #211e68 0%, #000 90%);
background: -o-linear-gradient(top left, #211e68 0%, #000 90%);
background: linear-gradient(to bottom right, #211e68 0%, #000 90%);
 margin: 0;
  overflow: hidden;
}

.bk span {
  width: 20vmin;
  height: 20vmin;
  border-radius: 20vmin;
  backface-visibility: hidden;
  position: absolute;
  animation-name: move;
  animation-duration: 6s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.bk span:nth-child(1) {
  color: #acc6f1;
  top: 82%;
  left: 31%;
  animation-duration: 12.5s;
  animation-delay: -13.2s;
  transform-origin: -18vw 13vh;
  box-shadow: -40vmin 0 7.129627991vmin currentColor;
}
.bk span:nth-child(2) {
  color: #5a8fe4;
  top: 54%;
  left: 42%;
  animation-duration: 13.1s;
  animation-delay: -0.4s;
  transform-origin: 4vw -13vh;
  box-shadow: -40vmin 0 5.5604771099vmin currentColor;
}
.bk span:nth-child(3) {
  color: #5a8fe4;
  top: 57%;
  left: 8%;
  animation-duration: 15.9s;
  animation-delay: -15.6s;
  transform-origin: 14vw -8vh;
  box-shadow: -40vmin 0 5.1565211563vmin currentColor;
}
.bk span:nth-child(4) {
  color: #5a8fe4;
  top: 4%;
  left: 70%;
  animation-duration: 10.9s;
  animation-delay: -11.6s;
  transform-origin: 13vw 13vh;
  box-shadow: -40vmin 0 6.0949141231vmin currentColor;
}
.bk span:nth-child(5) {
  color: #5a8fe4;
  top: 26%;
  left: 11%;
  animation-duration: 14.7s;
  animation-delay: -10.5s;
  transform-origin: 2vw -5vh;
  box-shadow: -40vmin 0 5.3692187867vmin currentColor;
}
.bk span:nth-child(6) {
  color: #acc6f1;
  top: 32%;
  left: 82%;
  animation-duration: 14.6s;
  animation-delay: -0.3s;
  transform-origin: 19vw -17vh;
  box-shadow: 40vmin 0 11.5749337484vmin currentColor;
}
.bk span:nth-child(7) {
  color: #7b5dad;
  top: 19%;
  left: 33%;
  animation-duration: 12.7s;
  animation-delay: -3.3s;
  transform-origin: -9vw -4vh;
  box-shadow: 40vmin 0 13.8652241186vmin currentColor;
}
.bk span:nth-child(8) {
  color: #7b5dad;
  top: 100%;
  left: 70%;
  animation-duration: 13.8s;
  animation-delay: -15.4s;
  transform-origin: -7vw -1vh;
  box-shadow: -40vmin 0 13.5776696913vmin currentColor;
}
.bk span:nth-child(9) {
  color: #5a8fe4;
  top: 76%;
  left: 6%;
  animation-duration: 15.8s;
  animation-delay: -3.5s;
  transform-origin: -8vw 1vh;
  box-shadow: 40vmin 0 5.5427069394vmin currentColor;
}
.bk span:nth-child(10) {
  color: #7b5dad;
  top: 18%;
  left: 67%;
  animation-duration: 12.7s;
  animation-delay: -0.9s;
  transform-origin: -11vw 17vh;
  box-shadow: -40vmin 0 9.6194313322vmin currentColor;
}
.bk span:nth-child(11) {
  color: #5a8fe4;
  top: 49%;
  left: 54%;
  animation-duration: 12.4s;
  animation-delay: -13.4s;
  transform-origin: -9vw -14vh;
  box-shadow: -40vmin 0 13.0829414283vmin currentColor;
}
.bk span:nth-child(12) {
  color: #7b5dad;
  top: 33%;
  left: 40%;
  animation-duration: 12.7s;
  animation-delay: -10.1s;
  transform-origin: -14vw -13vh;
  box-shadow: 40vmin 0 14.9337201748vmin currentColor;
}
.bk span:nth-child(13) {
  color: #acc6f1;
  top: 76%;
  left: 66%;
  animation-duration: 10.8s;
  animation-delay: -12.9s;
  transform-origin: -23vw 13vh;
  box-shadow: 40vmin 0 9.888156823vmin currentColor;
}
.bk span:nth-child(14) {
  color: #acc6f1;
  top: 59%;
  left: 89%;
  animation-duration: 10.3s;
  animation-delay: -13.1s;
  transform-origin: 9vw 25vh;
  box-shadow: -40vmin 0 10.1612725803vmin currentColor;
}
.bk span:nth-child(15) {
  color: #acc6f1;
  top: 40%;
  left: 16%;
  animation-duration: 15.8s;
  animation-delay: -3.1s;
  transform-origin: 20vw 23vh;
  box-shadow: -40vmin 0 13.1082904685vmin currentColor;
}
.bk span:nth-child(16) {
  color: #7b5dad;
  top: 6%;
  left: 33%;
  animation-duration: 12.3s;
  animation-delay: -8.7s;
  transform-origin: -16vw -23vh;
  box-shadow: -40vmin 0 10.4955347335vmin currentColor;
}
.bk span:nth-child(17) {
  color: #acc6f1;
  top: 77%;
  left: 89%;
  animation-duration: 13s;
  animation-delay: -0.9s;
  transform-origin: -14vw -19vh;
  box-shadow: 40vmin 0 7.8432582422vmin currentColor;
}
.bk span:nth-child(18) {
  color: #7b5dad;
  top: 94%;
  left: 24%;
  animation-duration: 15s;
  animation-delay: -15.1s;
  transform-origin: 0vw -1vh;
  box-shadow: 40vmin 0 14.3306626819vmin currentColor;
}
.bk span:nth-child(19) {
  color: #acc6f1;
  top: 20%;
  left: 42%;
  animation-duration: 11.7s;
  animation-delay: -6.5s;
  transform-origin: 14vw -13vh;
  box-shadow: 40vmin 0 12.4451381947vmin currentColor;
}
.bk span:nth-child(20) {
  color: #5a8fe4;
  top: 76%;
  left: 6%;
  animation-duration: 14.6s;
  animation-delay: -3.7s;
  transform-origin: -2vw -10vh;
  box-shadow: 40vmin 0 6.0921422888vmin currentColor;
}
@keyframes move {
  100% {
    transform: translate3d(0, 0, 1px) rotate(360deg);
  }
}

.import1 {color:#7198d0}

/**body {height:100%;background:url('/site_c/images/back.jpg')no-repeat; background-size:cover;}**/
.wrap {width:1400px;height:800px;margin:auto;position:absolute;
left:50%;top:50%;transform:translate(-50%,-50%);background-color:#fff;box-shadow:10px 20px 20px rgba(0,0,0,0.1)}
.wrap .wrap_inside {position:relative;}
.wrap header {position:relative;}
.wrap .header_box {width:190px;position:absolute;height:800px;top:0px;left:0px;border-right:1px solid #e0e0e0;}
.wrap  #container {padding-left:190px;}

h1 {margin:auto;text-align:center;height:100px;padding-top:25px;display:block;}
h1 a{text-align:center;}
h1 a img{width:55%;}
.logo_ment {font-size:11px;display:block;color:#888;letter-spacing:-0.5px;padding-top:5px}

.gnb:after {clear:both;content:'';display:block;}
.gnb {position:relative;background-color:#aac2e5}
.gnb a {display:block;height:45px;background-color:#7198d0;text-align:center;color:#fff;line-height:45px;font-weight:bold;font-size:14px;width:50%;float:left;}
.gnb a:hover {text-decoration: underline}
.gnb a:last-child {position:absolute;right:-1px;}


.lnb ul {margin-top:15px;padding:0 15px;}
.lnb ul li {padding:8px 15px}
.lnb ul li:last-child {background-color:#ffa200;margin-top:15px}
.lnb ul li:last-child a{color:#fff;font-weight:1000;letter-spacing:-0.5;}
.lnb ul li:last-child a span{color:#f8e4a0;}
.lnb ul li:last-child:hover {background-color:#999;}
.lnb ul li:last-child:hover a{color:#fff;}
.lnb ul li .sub_tit{display:block;font-size:16px;font-weight:1000;color:#333;letter-spacing:-0.5;}
.lnb ul li .sub_tit:hover {color:#7198d0;letter-spacing:-0.5;}
.lnb ul li .sub_tit span {display:block;font-size:10px;font-weight:normal;
letter-spacing:-0.5;color:#bbb;font-family:arial;}
.lnb ul li .sub_tit2{display:block;font-size:16px;font-weight:1000;color:#333;letter-spacing:-0.5;}
.lnb ul li .sub_tit2:hover {color:#7198d0;letter-spacing:-0.5;}
.lnb ul li .sub_tit2 span {display:block;font-size:10px;font-weight:normal;letter-spacing:-0.5;
color:#bbb;font-family:arial;}

.lnb ul li .box {display:none;border-top:1px solid #e0e0e0;padding-top:5px;margin-top:5px;}
.lnb ul li .box a{display:block;color:#929292;font-size:12px;line-height:20px;letter-spacing:-0.5px;}
.lnb ul li .box a:hover {font-weight:1000;color:#7198d0;}

.lnb ul li.active .sub_tit{color:#7198d0;letter-spacing:-0.5;}
.lnb ul li.active .box {display:block}
.lnb ul li.active .sub_tit2{color:#7198d0;letter-spacing:-0.5;}
.lnb ul li .box a.active{font-weight:1000;color:#7198d0;}

.all_icon span{font-size:12px;color:#999;}
.all_icon img {width:16px;}
.etcmenu:after {clear:both;content:'';display:block;}
.etcmenu {text-align:center;margin:10px 0;color:#ccc;}
.etcmenu a{display:inline-block;padding:0 5px}

.footer {font-size:11px;color:#929292;position:absolute;left:0px;bottom:0px;letter-spacing:-0.5px;padding:15px}
.footer strong{color:#666}
.footer p{font-size:11px;color:#bbb;padding-top:5px;letter-spacing:-0.5px;font-family:arial}

#content {overflow-y:auto; height:780px;padding:35px 35px 35px 35px;}

/**메인**/
.main_lbox h3{color:#333;font-weight:1000;font-size:19px;margin-bottom:10px;letter-spacing:-0.5px;}
.main_lbox {padding-right:230px;}
.main_lbox .portfolio_box{background-color:#fff;width:100%;height:230px;bottom:0;
padding:35px 30px;}
.main_lbox .portfolio_box .port_tit {color:#666;font-size:12px;padding-top:5px;display:block;}
.main_lbox .portfolio_box ul:after {clear:both;content:'';display:block;}
.main_lbox .portfolio_box ul li:first-child {margin:0;}
.main_lbox .portfolio_box ul li{float:left;width:20%;padding:0 10px;position:relative;}
.main_lbox .portfolio_box .port_genre{background-color:#7198d0;color:#fff;text-align:center;width:65px;height:25px;position:absolute;font-size:12px;font-weight:1000;padding-top:4px;top:0px;left:10px;}
.main_lbox .main_banner{width:100%;height:570px;}

.main_rbox h3 {font-weight:1000;font-size:19px;margin-bottom:20px;letter-spacing:-0.5px;}
.main_rbox {width:230px;height:100%;border-left:1px solid #e0e0e0;position:absolute;right:0px;top:0px;}
.main_rbox .rbox {padding:30px 25px;border-bottom:1px solid #e0e0e0;height:230px;}
.main_rbox .x2{height:340px;}

.main_rbox .rbox:last-child {border:none;}
.main_rbox .rbox:after {clear:both;content:'';display:block;}
.main_rbox .rbox .more_bt{float:right;}
.main_rbox .rbox .grey_bt{color:#fff;font-size:11px;font-weight:bold;display:inline-block;text-align:center;
background-color:#666;width:70px;padding:7px 0 7px 0;border-radius:5px;margin-top:10px;}
.main_rbox .rbox .blue_bt{color:#fff;font-size:11px;font-weight:bold;display:inline-block;text-align:center; margin:auto;
background-color:#87a7d8;width:70px;padding:7px 0 7px 0;border-radius:5px;margin-top:10px;}

.main_rbox .rbox .marketing_img img{border:1px solid #e0e0e0;width:175px;height:160px;text-align:center;margin:auto;}
.main_rbox .rbox .rbox_ment {font-size:11px;color:#666666;line-height:16px;letter-spacing:-0.5px;margin-top:10px;}
.main_rbox .rbox .rbox_ment:hover {text-decoration:underline;}

.main_rbox .rbox .code {width:100%;height:30px;border:none;color:#a6a6a6;background-color:#f2f2f2;text-align:center;
font-size:11px;border-radius:5px;}
.main_rbox .rbox .domain_seach {font-size:20px;color:#666;text-align:left;margin-bottom:10px;letter-spacing:1.2px;padding-left:5px;font-family:arial;}
.main_rbox .rbox .domain_alert {font-size:11px; color:#ffa200;text-align:center;margin-top:5px;display:block}


.all_menu {display:none;}
.all_menu_list {display:none;}

/** 노트북 **/


@media only screen and (max-width: 1399px) {

.wrap {width:1005px;height:690px;}
.wrap .header_box {height:690px;}

.main_lbox .portfolio_box {height:260px;}
.main_lbox .portfolio_box ul li:nth-child(4) {display:none}
.main_lbox .portfolio_box ul li:nth-child(5) {display:none}
.main_lbox .portfolio_box ul li{width:33.3%;padding:0 5px;}


.main_lbox .main_banner{height:340px;}
.main_rbox h3 {margin-bottom:10px;}
.main_rbox .rbox {padding:25px;border-bottom:1px solid #e0e0e0;height:150px;}
.main_rbox .rbox:last-child {height:auto;}
.main_rbox .x2{height:240px;}

.main_rbox .rbox .rbox_ment {display:none}

.lnb {z-index:1;background-color:#fff;overflow:hidden}
.lnb ul li {padding:7px 15px}
.lnb ul li:last-child {margin-top:0px}
.footer {z-index:-1;}

#content  {height:690px}
}