@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);


@font-face {
    font-family: 'NanumGothic';
    src: url('../font/NanumGothic.eot');
    src: url('../font/NanumGothic.eot?#iefix') format('embedded-opentype'),
         url('../font/NanumGothic.woff') format('woff'),
         url('../font/NanumGothic.ttf') format('truetype'),
         url('../font/genericons-regular-webfont.svg#genericonsregular') format('svg');
    font-weight: normal;
    font-style: normal;
}


img { border:0; }

    body {
      -webkit-font-smoothing: antialiased;
      font-family:³ª´®°íµñ, NanumGothic,±¼¸², µ¸¿ò;
      color: #232525;
	  background:#fff;
      padding-top:0px;
    }
	
	
	
	#title {font-size:60px; font-weight:bold; line-height:70px; letter-spacing:-4px; margin: 0 auto; height:100px; width:1100px; padding-left:90px; padding-top:10px;}

    #banner {font-size:44px; font-weight:bold; letter-spacing:-6px; margin: 0 auto; width:1100px; padding-left:100px; padding-bottom:44px; padding:-top:70px;}
   
   #logo {
	 position:absolute;
	 left:50%;
	 top:46px;
	 margin-left:330px;
	 z-index:10000;
	 list-style-type: none;
    }

	#x-button {
	 position:absolute;
	 left:50%;
	 top:678px;
	 margin-left:-179px;
	 z-index:10000;
	 list-style-type: none;
    }
	
	
	
	#x-button li {
	 padding-right:5px;
	 display:block;
	 float:left;
	}
	
	
	#name-button {
	 position:absolute;
	 left:50%;
	 top:778px;
	 margin-left:284px;
	 z-index:10000;
    }
	



    #slides {
	  list-style-type: none;
      display: none;
	  height:790px;
	   background-color:#99bd91;
    }

    #slides .slidesjs-navigation {
     position:absolute;
	 left:50%;
	 margin-left:-320px;
	 z-index:10000;
	 height:83px;
	 width:83px;
     margin-top:30px; margin-bottom:30px;
    }
	
	#slides .slidesjs-next {
	 position:absolute;
	 left:50%;
	 margin-left:-410px;
	 z-index:10000;
	 height:83px;
	 width:83px;
     margin-top:30px; margin-bottom:30px;
    }
	
	
	#slides .slidesjs-previous {
	 position:absolute;
	 left:50%;
	 margin-left:-500px;
	 z-index:10000;
	 height:83px;
	 width:83px;
     margin-top:30px; margin-bottom:30px;
    }
	

	

    a.slidesjs-next,
    a.slidesjs-previous,
    a.slidesjs-play,
    a.slidesjs-stop {
      background-image: url(../images/btns-next-prev.png);
      background-repeat: no-repeat;
      display:block;
      width:83px;
      height:83px;
      overflow: hidden;
      text-indent: -9999px;
      float: left;
      margin-right:5px;
    }

    a.slidesjs-next {
      background-position: -89px 0px;
    }


    a:hover.slidesjs-next {
      background-position: -89px -84px;
    }

    a.slidesjs-previous {
      background-position: 0 0;
    }

    a:hover.slidesjs-previous {
      background-position: 0 -84px;
    }

    a.slidesjs-play {
      width:83px;
      background-position: -178px 0;
    }

    a:hover.slidesjs-play {
      background-position: -178px -84px;
    }

    a.slidesjs-stop {
      width:83px;
      background-position: -264px 0;
    }

    a:hover.slidesjs-stop {
      background-position: -264px -84px;
    }

    .slidesjs-pagination {
      margin: 30px 0 60px;
      float: right;
      list-style: none;
    }

    .slidesjs-pagination li {
      float: left;
      margin: 0 1px;
    }


	
	
	#slides .slidesjs-pagination {
	
	 position:absolute;
	 top: -30px;
	 left:50%;
	 margin-left:-538px;
	 width:1000px;
	 z-index:10000;
    }
	
	
	
    .slidesjs-pagination li a {
      display: block;
      width: 10px;
      height: 0;
      padding-top: 10px;
      background-image: url(../images/pagination.png);
      background-position: 0 0;
      float: left;
      overflow: hidden;
    }

    .slidesjs-pagination li a.active,
    .slidesjs-pagination li a:hover.active {
      background-position: 0 -10px
    }

    .slidesjs-pagination li a:hover {
      background-position: 0 -20px
    }

    #slides a:link,
    #slides a:visited {
      color: #333
    }

    #slides a:hover,
    #slides a:active {
      color: #9e2020
    }

    .navbar {
      overflow: hidden
    }
  </style>
  <!-- End SlidesJS Optional-->

  <!-- SlidesJS Required: These styles are required if you'd like a responsive slideshow -->
  <style>
    #slides {
	   box-shadow: 0px 0px 50px rgba(0,0,0,0.9), inset 0px 0px 3px rgba(0,0,0,0.13); 
    }

    .container {
	  width: 1000px;
      margin: 0px auto
    }

    /* For tablets & smart phones */
    @media (max-width: 1000px) {
      body {
        padding-left: 0px;
        padding-right: 0px;
      }
	  
      .container {
         width: 1000px
      }
    }
	 			
    /* For smartphones */
    @media (max-width: 1000px) {
      .container {
        width: auto
      }
    }

    /* For smaller displays like laptops */
    @media (min-width: 1000px) and (max-width: 1000px) {
      .container {
        width: 1000px
      }
    }

    /* For larger displays */
    @media (min-width: 1000px) {
      .container {
	    width: 1000px
      }
    }