@charset "UTF-8";

body,html{margin: 0; padding: 0; border:0;}
*{margin:0; padding:0; border:0; outline: 0; list-style: none; text-decoration: none;
 color:#222328;}
.cf:after,.cf::after{content: " "; width: 0; height: 0; clear: both;}

.wrap{width: 1000px; height:650px; margin: auto}
#headBox{float: left; width: 200px; height:650px; background-color: #ddd}
h1{width: 100%; height: 50px; background-color: #f00;}
#gnb{margin: 10px; width:180px; height: auto; background-color: #fff;}
#gnb>ul{width:100%; height: auto;}
#gnb>ul>li{width: 100%; height: auto;}
#gnb dl{width: 100%; height: auto; border: 1px solid #222328;
  box-sizing: border-box; line-height: 40px; text-align: center;}
#gnb dl>dt{width: 100%; height: 40px;}
#gnb dl>dd{display: none; width: 100%; height: 40px;}
#gnb dl a{display:block; width:100%; height: 100%;}
#gnb dl a:hover{background-color: #777;}
#gnb dl a:focus{background-color: #777;}
#conBox{overflow: hidden; width: 800px; height:350px;}
.slide_wrap{width: 300%; height: 100%;}
.slide{float: left; width: 800px; height: 100%;}
.slide_wrap>.s1{background-color: #f00}
.slide_wrap>.s2{background-color: #0f0}
.slide_wrap>.s3{background-color: #00f}
#viewBox{float:right;width: 800px; height:200px; background-color: #eee}

#footBox{float:right;width: 800px; height:100px; background-color: #aaa}