


 


 
 








 @media (min-width:7px){

#top-banner { display : none; background: #fbc714; width:110%; margin-left:-5%;  }
 
 } 

 @media (min-width:467px){

#top-banner { display : none; background: #fbc714; width:110%; margin-left:-5%;  }
#top-banner .grid-setter { overflow: hidden; position: relative; height: 120px; }
 .grid-setter { width: 990px; margin: 0 auto; }
 .top-banner-wrapper { overflow: hidden; width: 800px; height: 120px; }
 .cbanner {  margin-top:0px;  }
 .top-banner-item { width: 800px; height: 120px; font-size: 12px; font-family: µ¸¿ò; }
 .play-control { position: absolute; right:155px; bottom: 19px; }
 }
 @media (min-width:767px){

#top-banner { display : block; background: #fbc714; width:110%; margin-left:-5%;  }
#top-banner .grid-setter { overflow: hidden; position: relative; height: 120px; }
 .grid-setter { width: 767px; margin: 0 auto; }
 .top-banner-wrapper { overflow: hidden; width: 800px; height: 120px; }
 .cbanner {  margin-top:0px;  }
 .top-banner-item { width: 767px; height: 120px; font-size: 12px; font-family: µ¸¿ò; }
 .play-control { position: absolute; right:155px; bottom: 19px; }

 }
 @media (min-width:992px){
#top-banner { display : block; background: #fbc714; width:110%; margin-left:-5%;  }
#top-banner .grid-setter { overflow: hidden; position: relative; height: 120px; }
 .grid-setter { width: 990px; margin: 0 auto; }
 .top-banner-wrapper { overflow: hidden; width: 800px; height: 120px; }
 .cbanner {  margin-top:120px;  }
 .top-banner-item { width: 800px; height: 120px; font-size: 12px; font-family: µ¸¿ò; }
 .play-control { position: absolute; right:155px; bottom: 19px; }
 
 }
 
 @media (min-width:1200px){
#top-banner { display : block; background: #fbc714; width:110%; margin-left:-5%;  }
#top-banner .grid-setter { overflow: hidden; position: relative; height: 120px; }
 .grid-setter { width: 990px; margin: 0 auto; }
 .top-banner-wrapper { overflow: hidden; width: 800px; height: 120px; }
 .cbanner {  margin-top:120px;  }
 .top-banner-item { width: 800px; height: 120px; font-size: 12px; font-family: µ¸¿ò; }
 .play-control { position: absolute; right:155px; bottom: 19px; }
 
 }

/* ÀüÃ¼ ±×¸®µå °áÁ¤ÇÏ´Â ÄÁÅ×ÀÌ³Ê¿ë Å¬·¡½º */
 
 
 
 
#top-banner.top-banner-item { width: 800px; height: 120px; font-size: 12px; font-family: µ¸¿ò; }
.top-banner-item.active { /* display: block; */ }
.top-banner-item strong { color: #D24600; }
.top-banner-item .subst { position: relative; padding-left: 145px; }
.top-banner-item .character { position: absolute; left: 10px; top: 5px; width: 110px; height: 110px; }
.top-banner-item h2 { padding: 20px 0 5px; font-size: 18px; font-weight: 600; }
.not-ie .top-banner-item h2 { font-weight: bold; }
.top-banner-item .link-list { margin-top: 15px; }
.top-banner-item .link-list li { display: inline-block; margin-right: 5px; }
.top-banner-item .link-list li:after { content: ''; display: block; clear: both; }
.top-banner-item .link-list .num { display: block; float: left; padding: 5px 10px 3px; font-weight: bold; background: #fde79a; }
.top-banner-item .link-list a { display: block; float: left; padding: 5px 10px 3px; background: #fcdc6b; }
.top-banner-item .character.a { background: url('../images/character1.png') no-repeat 0 0; }
.top-banner-item .character.b { background: url('../images/character2.png') no-repeat 0 0; }
.top-banner-item .character.c { background: url('../images/character3.png') no-repeat 0 0; }
#top-banner .banner-control { position: absolute; right: 0; top: 30px; }
#top-banner .close-control { position: absolute; right: 0; bottom: 17px; }
.btn-banner-close { width: 20px; height: 20px; margin: 0; padding: 0; border: 0; text-indent: -1000em; background: url('../images/sprite_1.png') no-repeat -472px -168px; }
.banner-control-button { overflow: hidden; padding: 0; width: 28px; height: 28px; border: 0; font-weight: 600; color: #fff; text-align: center; line-height: 28px; background: url('../images/sprite_1.png') no-repeat -436px -168px #616161; }
.not-ie .banner-control-button { font-weight: bold; }
.banner-control-button.active { background-color: #b15a05; }
.banner-control-button span { position: absolute; left: -1000em; }
 


 
 

 
/*2014.07.07 »ó´Ü¹è³Ê ·Ñ¸µ¼öÁ¤*/

.visual_cont .btn_go {position:absolute;top:244px;left:0;}
.visual_cont {height:120px; position:absolute; top:0; left:100%; width:800px; display:none; overflow: hidden; font-size: 12px; font-family: µ¸¿ò;}
.vi1{left:0;display:block;}
.vi2{left:0; top: 120px; }
.vi3{left:0; top: 120px; }
.vi4{left:0; top: 120px; }
.visualWarp{position:relative; }
.btn_ch { position:absolute; top:30px; float:right; }
.btn_ch.ch1{right:96px;}
.btn_ch.ch2{right:64px;}
.btn_ch.ch3{right:32px;}
.btn_ch.ch4{right:0;}
.btn_ch>a { display:block; overflow: hidden; padding: 0; width: 28px; height: 28px; border: 0; font-weight: 600; color: #fff; text-align: center; line-height: 28px; background: url('../images/sprite_1.png') no-repeat -436px -168px #616161; }
.not-ie .btn_ch>a { font-weight: bold; }
.btn_ch>a.on{ background-color: #b15a05; }
.btn_ch>a span{ position: absolute; left: -1000em; }
.subst { position: relative; padding-left: 145px; }
.subst h2 { padding: 20px 0 5px; font-size: 18px; line-height: 1.0em; font-weight: 600; }
.not-ie .subst h2 {font-weight: bold;}
.subst p {margin: 0}
.not-ie .top-banner-item h2 { font-weight: bold; }
.subst .link-list { margin-top: 3px; padding-left: 0;}
.subst .link-list li { display: inline-block; margin-right: 5px; }
.subst .link-list li:after { content: ''; display: block; clear: both; }
.subst .link-list .num { display: block; float: left; padding: 5px 10px 3px; font-weight: bold; background: #fde79a; }
.subst .link-list a { display: block; float: left; padding: 5px 10px 3px; background: #fcdc6b; }
.subst .character { position: absolute; left: 10px; top: 5px; width: 110px; height: 110px; }
.subst .character.a { background: url('../images/character1.png') no-repeat 0 0; }
.subst .character.b { background: url('../images/character2.png') no-repeat 0 0; }
.subst .character.c { background: url('../images/character3.png') no-repeat 0 0; }
.subst strong {color: #D24600; font-weight: bold;}
.style-nanum {font-family: 'Apple SD Gothic Neo', ³ª´®°íµñ, 'Nanum Gothic', 'Malgun Gothic';}


 