@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Raleway);

/*    Reset CSS  */
* { margin:0;  padding:0;}
ol,ul { list-style: none; }
a { outline:0; text-decoration:none;	color:#bbb;}
img { border:0;}

/* 배경 이미지 설정 */
.wrap {position:fixed; width:100%; height:100%; min-width:1024px; min-height:768px; background:url(../img/bg2.jpg) no-repeat center bottom; background-size:cover;}

/* 로고 영역 */
.wrap h1 {position:fixed; width:100%; height:100%; top:10px;  text-align:center; line-height:0.8;}
.wrap h1 strong {font:bold 16px/1.1 verdana; color:#333;}
.wrap h1 img {width:250px; height:80px;}
.wrap h1 span {font:bold 12px/1.6 arial; color:#444; letter-spacing:5px;}

/*슬로건 영역 */
.txt {position:fixed; top:90px; left:880px; font:25px/0.8 Raleway; color:#fff;  letter-spacing:0px;}

/* 웹 아이콘 버튼 모음 */
.sns {position:fixed; top:30px; right:50px; z-index:10;}
.sns li {float:left; margin-left:30px;}
.sns li a {color:#555; font-size:22px;}

/* 섹션 영역 레이아웃 */
section {position:fixed;  top:60px; left:500px; width:100%; height:100%;}
article {position:relative; top:100px; left:100px; width:100%; height:20%; background:url(../img/border.png)
  no-repeat left center; overflow:hidden;}

/* article 제목 */
article h2 {position:absolute; top:100px; left:20px; padding-left:15px; border-left:3px solid #000;
font:bold 20px Raleway; color:#666; z-index:3; transition:all 0.5s;}
article div {position:absolute; left:50px; top:300px; width:100%; height:50%;
background: #000; opacity:0.5; z-index:2; transition:all 0.5s;}

/* article 동영상 */
article video {position:absolute; width:800px; height:auto; margin-top:0px;  opacity:0; z-index:1;}

/* article 숨겨진 콘텐츠 */
article h3 {position:absolute; top:120px; right:-300px; font:30px Raleway; color:#ce7f29; text-align:right; opacity:1; z-index:4;}

/* article 제목 호버 효과 */
article:hover h2 {color:#ccc; border-left:3px solid #ccc;}
article:hover div {top:270px; height:70px;}