/*
   __              __                                             
  /\ \  __        /\ \                                            
  \_\ \/\_\    ___\ \ \/'\     ___ ___      __      ___     ____  
  /'_` \/\ \  /'___\ \ , <   /' __` __`\  /'__`\  /' _ `\  /',__\ 
 /\ \L\ \ \ \/\ \__/\ \ \\`\ /\ \/\ \/\ \/\ \L\.\_/\ \/\ \/\__, `\
 \ \___,_\ \_\ \____\\ \_\ \_\ \_\ \_\ \_\ \__/.\_\ \_\ \_\/\____/
  \/__,_ /\/_/\/____/ \/_/\/_/\/_/\/_/\/_/\/__/\/_/\/_/\/_/\/___/ design.com
  
*/

/* HOME
----------------------------------------------------------------------------- */

.header ul { position: absolute; top: 52px; left: 277px; }
.header ul .hover img,
.header ul a:hover img { filter:alpha(opacity=0); -moz-opacity:.0; opacity:.0; }
.header li { float: left; }

.box2 { height: 395px; width: 980px;}
.box2 img { display: block; }
.box2 li { float: left; }
.box2 .col1 { width: 332px; position: relative; }
.box2 .col1 .flash { left: 25px; top: 61px; position: absolute; }
.box2 .col1 .bt { top: 352px; left: 189px; position: absolute; }
.box2 .col1 p { top: 285px; left: 32px; position: absolute; width: 290px; }
.box2 .col2 { width: 314px; position: relative; }
.box2 .col2 p { top: 268px; left: 15px; position: absolute; width: 290px; }
.box2 .col2 p strong { color: #13F0FF; }
.box2 .col2 h2 { top: 343px; left: 54px; position: absolute; font-size: 22px; text-align: center; text-transform: uppercase; line-height: 19px; }
.box2 .col2 h2 strong { font-size: 18px; display: block; }
.box2 .col3 { width: 334px; position: relative; }
.box2 .col3 .bt { top: 352px; left: 169px; position: absolute; }
.box2 .col3 p { top: 285px; left: 15px; position: absolute; width: 290px;}

.box3 img { display: block; }
.box3 { position: relative; }
.box3 a { position: absolute; top: 239px; left: 662px;}

.box4 { width: 980px; position: relative; height: 811px; }
.box4 .col1 { position: absolute; top: 0px; left: 0px; width: 461px; padding: 31px 0 0 20px; }
.box4 .col1 p { overflow: hidden; height: 121px; padding: 10px 0 0 0; text-align:justify; }
.box4 .col1 .flash { padding: 0 0 20px 1px; }
.box4 .col2 { position: absolute; top: 0px; right: 0px; width: 212px; padding: 31px 22px 0 0; }
.box4 .col2 p { overflow: hidden; height: 123px; padding: 10px 0 0 0; text-align:justify; }
.box4 .col2 span { display: block; text-align: center; padding: 6px 0 13px 0; }
.box4 .col2 span a { color: #F7FF3C; font-weight: bold; text-decoration: underline; }

.box5 img { display: block; }
.box5 .console { width: 940px; margin: 0 auto; }
.box5 h3{ height:66px; padding:0 0 0 20px; color:#07F6FF; font-size:36px; text-transform:uppercase; line-height:1.8em;}
.box5 h3 strong{ color:#D0D314; font-size:24px;}
.box5 .console .col1 { width: 714px; overflow: hidden; float: left; }
.box5 .console .col1 ul { width: 730px; }
.box5 .console .col1 li { float: left; padding: 0 5px 5px 0; }
.box5 .console .col2 { width: 220px; float: right; }
.box5 .console .col2 .p { background: #183645; margin: 5px 0 0 0; padding: 14px; overflow: hidden; height: 278px; }
.box5 .console .col2 .p h2 { display: block; font-size: 13px; padding: 0 0 10px 0; }

.box6 { height: 166px; }
.box6 img { display: block; }
.box6 li { float: left; }
.box6 .col1 { width: 322px; position: relative; }
.box6 .col2 { width: 320px; position: relative; }
.box6 .col3 { width: 318px; position: relative; }
.box6 .col3 .p,
.box6 .col2 .p,
.box6 .col1 .p { position: absolute; left: 143px; top: 39px; width: 170px; }
.box6 .col3 .p { left: 133px; width: 180px; }
.box6 .col3 .p h2,
.box6 .col2 .p h2,
.box6 .col1 .p h2 { color: #F7FF3C; display: block; font-size: 18px; line-height: 19px; }

.box7 { position: relative; }
.box7 .bt1 { position: absolute; top: 188px; left: 577px; } 
.box7 .bt2 { position: absolute; top: 225px; left: 577px; } 
.box7 img { display: block; }
.box7 ul {position: absolute; top: 326px; left: 273px;  }
.box7 ul .hover img,
.box7 ul a:hover img { filter:alpha(opacity=0); -moz-opacity:.0; opacity:.0; }
.box7 li { float: left; }