﻿
body{  font-size:15px;}


.wrap-index { overflow: hidden;}

.dark-green { color: #4c5b52; }

.light-green { color: #00853e; }

.mb-50 { margin-bottom: 50px;}

/*slider*/

.slider { float: left; }
.slider .jquery-reslider .slider-block {width: 100%; height: 800px; position: absolute; z-index: 1; background-position: center top; background-repeat: no-repeat; background-size: cover; opacity: 0; animation:sunday 7s 2s infinite alternate; -webkit-animation:sunday 7s infinite alternate; -moz-animation:sunday 7s infinite alternate; -o-animation:sunday 7s infinite alternate; -ms-animation:sunday 7s infinite alternate;} 
@keyframes sunday{ 10%{background-size:100%;} /*50%{background-size:105%;}*/  100%{background-size:105%;} }
.slider .jquery-reslider .slider-direction { position: absolute; top: 350px; z-index: 5000 !important; cursor: pointer; font-size:60px; color:#fff; opacity:0.6; } 
.slider .jquery-reslider .slider-direction.slider-direction-prev {left: 20px; /*background: url('../Images/main/prev.png') no-repeat; */ }
.slider .jquery-reslider .slider-direction.slider-direction-next {right: 20px; /*background: url('../Images/main/next.png') no-repeat*/ }
.slider .jquery-reslider .slider-direction:hover{ opacity:0.8; }
.slider .jquery-reslider .slider-dots {position: absolute; width: 100%; text-align: center; top: 730px; }
.slider .jquery-reslider .slider-dots li {width: 15px; height: 15px; border-radius: 100px; display: inline-block; margin: 10px; border: 1px solid #ffffff; cursor: pointer; }
.slider .jquery-reslider .slider-dots li.active {background-color: #ffffff; }


/*a{ transition-duration: 0.9s, 0s;}*/
.clicker_div_main{ /*background:transparent url('/Clicker/Users/Baul/Images/main/mainImg.png') no-repeat center top;*/}
/*TOP---------------------------------- ***************************************************************************************************************************************/
/*a{transition-duration: 0.9s, 0s;}*/
a:hover, a:focus { color: #007fb6;  }
#skipnavi{ display:none;}
.kor-hide{ display:none !important;}
.container {  padding-left:0px; padding-right:0px; width: 1300px; margin:0 auto;  }   
#sponge-header{ z-index:1000;height:88px;}
.clicker-wrap-body #sponge-header{ border-bottom:1px solid #ddd;}
.navbar-header{float:left; }
.navbar-header h1{ margin:23px 0;}
.navbar-header h1 a{ background:transparent url('/Clicker/Users/Baul/kbaulib_clicker_user_logo-white.png') no-repeat center top; width:225px; height:43px; display:block; transition-duration: 0.9s, 0s;}
.clicker-wrap-body .navbar-header h1 a{ background-image: url('/Clicker/Users/Baul/kbaulib_clicker_user_logo.png');}
.navbar-clicker h1{ margin-top:10px; }

/* menu */
.sponge-header-nav { margin-bottom:0px; border-radius:0px; border:0px;  }
.sponge-header-nav .navbar-toggle{display: none;}

/* logo */
.navbar > .container .sponge-navbar-brand, .navbar > .container-fluid .sponge-navbar-brand{ margin-left:0px; }
.sponge-navbar-brand { height: auto; padding:0 0; margin:0px; position:absolute; z-index:2000;}
.sponge-navbar-brand img{ height: auto; } 
 
/* infoBox */  
.infoBox{ margin-right:0px; text-align:right; margin-top:26px; position:relative; transition-duration: 0.9s, 0s; border-radius:30px;
          background-color:rgba(255, 255, 255, 0.09); border:1px solid rgba(255, 255, 255, 0.24); z-index:300;}
.infoBox > li{ display:inline-block; color:#555; float:none; vertical-align:top; position:relative; }

.infoBox > li:last-child{ margin-right:0px; padding-right:0;}
.infoBox > li > a, .infoBox > li > strong, .navbar div > ul.infoBox a, .nav a{ display:inline-block;  padding:8px 15px; margin:0 0px; color:rgba(255, 255, 255, 0.43); vertical-align:top;  }
.infoBox > li > strong > span{font-weight:normal;}
.infoBox > li::before{ content:'|'; position:absolute; top:6px; right:0; color:rgba(255, 255, 255, 0.43); }
.infoBox > li:last-child::before{ display:none;  }
.infoBox > li > a:hover, .infoBox > li > a:focus{ background-color:transparent; color:#00448f;}        

.infoBox > li > a > i.home{ background-image: url('/Clicker/Users/Baul/Images/home.png'); opacity:0.48; display:inline-block; width:13px; height:14px; vertical-align:middle; }

:last-child.navbar-right.navbar-nav.infoBox{ margin-right:0px; padding-right:0;}

.clicker-wrap-body .infoBox{ background-color:rgba(0, 0, 0, 0.09); border:1px solid rgba(0, 0, 0, 0.24); }

.clicker-wrap-body .infoBox > li > a, .clicker-wrap-body .infoBox > li > strong, .clicker-wrap-body .navbar div > ul.infoBox a, .clicker-wrap-body .nav a{ color:rgba(0, 0, 0, 0.43); }

.clicker-wrap-body .infoBox > li::before{ color:rgba(0, 0, 0, 0.43); }
      

.clicker-wrap-body .infoBox > li > a > i.home{ background-image: url('/Clicker/Users/Baul/Images/home_block.png');}



/*.sponge-layout-wrap{ padding-top:100px; }*/



.main-star{position:absolute; height:100vh; width:100%; text-align:center; }
.main-star > p{ position:absolute; top:25%; left:50%; width:200px; height:200px; border-radius:50%; background-color:rgba(255, 255, 255, 0.5);opacity:0.4; /*box-shadow:0rem 0rem 10px rgba(255,255,255, 1)!important;*/ 
                animation:star 3s 2s infinite alternate; -webkit-animation:star 3s infinite alternate; -moz-animation:star 3s infinite alternate; -o-animation:star 3s infinite alternate; -ms-animation:star 3s infinite alternate;}
@keyframes star{ 0%{ opacity:0;} /*50%{background-size:105%;}*/  100%{ opacity:0.4;} }

.sponge-main-text{position:absolute;  text-align:center; z-index:1000; color:#fff; width:100%; top:15%; animation-duration: 5s;  animation-name: slidein; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);}
.sponge-main-text > p{ font-size:200%; margin:0.2em 0; }
.sponge-main-text > p:nth-child(1){ font-size:500%; font-weight:600; }



@keyframes slidein {
  from {
    opacity:0;
  
  }

  to {
    opacity:1;
  }
}
@keyframes slidein2 {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

@keyframes slidein3 {
  from { bottom: -200px; opacity:0; }
  to   { bottom: 100px; opacity:1; }
}


@keyframes top
{
from {top:-300px; opacity:0;}
to   {top:500px;opacity:1; }
}
.sponge-main-btn{ position:absolute;top:500px; z-index:300;  width:100%; text-align:center; min-width:1720px; animation-name:top; animation-duration:2s; -webkit-animation-name:top; -webkit-animation-duration:2s; }


.sponge-main-btn > li{ min-width:200px; max-width:250px; width:17%; display:inline-block; }
.sponge-main-btn > li > a{ width:156px; height:156px; background-color:rgba(0, 0, 0, 0.45); color:#fff; font-size:130%; font-weight:600; position:relative; padding-top:20px; text-decoration:none; display:block; 
border-radius:20px; vertical-align:top; text-align:center; margin:0 auto;transition-duration: 0.9s, 0s; }
.sponge-main-btn > li > a:hover{ background-color:rgba(255, 255, 255, 1.0); color:#000; }
.sponge-main-btn > li > a > span { opacity:0.5; font-size:70%; }
.sponge-main-btn > li > a > i.icon { float:none; margin:0 auto 15px auto; height:68px; width:52px; display:block; text-align:center; background:url('/Clicker/Users/Baul/Images/main.png') no-repeat left top; animation: 0.5s linear 1s slidein2; }
/*.sponge-main-btn > li:nth-child(3) > a > i{ top:20%;}*/

.sponge-main-btn > li > a > i.icon01{ background-position-x:0px;}
.sponge-main-btn > li > a > i.icon02{ background-position-x:-100px; width:79px; }
.sponge-main-btn > li > a > i.icon03{ background-position-x:-200px; width:64px; }
.sponge-main-btn > li > a > i.icon04{ background-position-x:-300px; width:70px; }
.sponge-main-btn > li > a > i.icon05{ background-position-x:-400px; width:70px; }
.sponge-main-btn > li > a > i.icon06{ background-position-x:-500px; width:65px; }
.sponge-main-btn > li > a > i.icon07{ background-position-x:-600px; width:63px; }
.sponge-main-btn > li > a > i.icon08{ background-position-x:-700px; width:57px; }


.sponge-main-btn > li:hover > a > i.icon{  background-position-y:-100px;}
.sponge-main-btn > li:nth-child(1) > a > i.icon{ animation-delay:1.25s;}
.sponge-main-btn > li:nth-child(2) > a > i.icon{ animation-delay:1.5s;}
.sponge-main-btn > li:nth-child(3) > a > i.icon{ animation-delay:1.75s;}
.sponge-main-btn > li:nth-child(4) > a > i.icon{ animation-delay:2s;}
.sponge-main-btn > li:nth-child(5) > a > i.icon{ animation-delay:2.25s;}
.sponge-main-btn > li:nth-child(6) > a > i.icon{ animation-delay:2.5s;}
.sponge-main-btn > li:nth-child(7) > a > i.icon{ animation-delay:2.75s;}
.sponge-main-btn > li:nth-child(8) > a > i.icon{ animation-delay:3.0s;}




.sponge-main-btn > li > a:hover > i.icon{
animation: 0.5s linear 0s in;

}

@keyframes in
{
from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@-webkit-keyframes in /* Safari and Chrome */
{
from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@keyframes out
{
from { transform: scaleX(1); }
  to   { transform: scaleX(0); }
}
@-webkit-keyframes out /* Safari and Chrome */
{
from { transform: scaleX(1); }
  to   { transform: scaleX(0); }
}

#footArea{ width:100%; }
#footArea > div.fixed-bottom{ z-index:500; }
.makerlibrary-sub-layout #footArea > div { background-color:rgba(0, 0, 0, 0.5); text-align:center;}

#footArea > div > address{ color:#fff; }
.makerlibrary-sub-layout #footArea > div > address{ margin:0 auto; width:100%; }






/* ----------content "퀵메뉴 quick" to center the layout-------- */	 
#sponge-layout-content-container-quick{float:right; display:inline; position:fixed; top:380px; width:auto; padding-left:10px; z-index:0; right:20px;}	
#quickMenu{width:auto; padding-top:10px;}
.sponge-top-btn{border:1px solid #bebebe; font-weight:600;border-radius:3px; width:auto; height:18px; padding:0 3px; display:block; color:#3f3f3f; text-align:center;
                text-shadow: 3px 3px 3px #fff; background-color:#fff; background:#fff linear-gradient(#fff 40%, #ddd ) !important; line-height:5px; line-height:-1.5px; -webkit-text-size-adjust:none !important; font-size:11pt !important; margin:1px 0; }



#footArea { position:absolute; bottom:0; display:none; }
#clicker_div_masterpage_footer{ display:none;}

.clicker_div_guide_logo{background: url('/clicker/users/Baul/Images/logo_opacity.png') no-repeat center center; }


.UserSeatKioskMain{background: url('/clicker/users/Baul/Images/mainImgMain.jpg') no-repeat center center; }


.clicker-kiosk2019-left-logo { background: url("/Clicker/Users/Baul/images/logo_opacity.png") no-repeat center center; }

.clicker-kiosk2019-right > div { margin-bottom: 15px; }
.clicker-kiosk2019-right > div:first-child a.btn { font-size: 15px; padding: 10px 60px 10px 10px !important; text-align: left; position: relative; }
.clicker-kiosk2019-right > div:first-child a.btn br { display: none; }
.clicker-kiosk2019-right .btn span.nolist { font-weight: 600; margin-left: 5px; color: #105ca9; float: right; position: absolute; right: 10px; top: 20px; min-width: 50px; text-align: center; }
.clicker-kiosk2019-right .btn.active span.nolist { color: #fffd8b; }


.UserSeatKioskMain .floor-guide > div > .floor-list .box > li.title_h3{ margin:22px 0 10px 0;}
.UserSeatKioskMain .floor-guide > div > .floor-list .box > li.title_h3 > h3{ font-size:38px;}

.UserSeatKioskMain .floor-guide > div > .floor-list .box > li > a{ padding:3px 10px;  font-size:16px; margin-bottom:5px; }


.sponge-page-guide-clicker-Baul{width:50%; right:0; position:absolute;}


.maincontent{ position:absolute; top:800px; width:100%; }
.maincontent > div{ width:1340px; margin:0 auto;}

        .maincontent h2, h2.maincontent_title{ color:#000; font-weight:600;  height: 40px;  clear: left;  margin-top: 30px; font-size:24px;}
        .clicker-content-top{background: url("/Clicker/Users/Bcul/images/clicker_Header_bg.png") no-repeat 0px 0; height: 462px; position: relative; }
        .clicker_k_banner{ float: right; display: inline; padding-top:45px; height:404px;  }
        .clicker_k_banner h3{ display:none;}
        .clicker_k_banner ul{ margin:0 0 0 5px; width:85px; height:352px; display: inline; float: right; }
        .clicker_k_banner ul li{display: inline; float: left; width: 90px; height: 85px;}        
        .clicker_k_banner ul li a{width: 90px;  display: block;  color:#fff; text-align:center; vertical-align:top; letter-spacing:-0.5px; }
        .clicker_k_banner ul li a span{  font-size:35px; display: block; text-align:center; color:#fff !important; margin:0 auto;}
        .clicker_k_banner ul li a i.ho1{  font-size:35px; color:#fff !important; z-index:2;}
        .clicker_k_banner ul li a i.ho2{  font-size:25px; color:#ddd !important; margin-left:-10px; z-index:1;}
        .clicker_k_banner ul li a div{ clear:both; text-align:center; height:30px; width:40px; margin:0 auto; color:#f8b901 !important;}
        .clicker_k_banner ul li a div i.fa-spin{color:#eee !important;}
        .clicker_k_banner ul li a p{  font-size:14px; font-weight:600; line-height:15px; clear:both; margin:7px 0 10px 0;}
        .clicker_k_banner ul li a:hover, .clicker_k_banner ul li a:focus{ opacity: 0.7; text-decoration:none; color:#fff;}
        .fa-stack-1x, .fa-stack-2x{ left:auto; width:auto; }
        
        /*.clicker_k_banner{ float: right; display: inline; padding-top:25px; height:397px;  }
        .clicker_k_banner h3{ display:none;}
        .clicker_k_banner ul{ margin:0 0 0 10px; width:87px; height:352px; display: inline; float: right; }
        .clicker_k_banner ul li{display: inline; float: left; width: 87px; height: 95px;}        
        .clicker_k_banner ul li a{width: 87px; height: 93px; display: block; padding-top:14px; background: url(/Clicker/images/k_menu_back_black02.png) no-repeat left -95px; color:#000; text-align:center; vertical-align:top; letter-spacing:-1px;}
        .clicker_k_banner ul li a span{  font-size:35px; display: block; width: 87px; height:30px; text-align:center; padding-left:2px;}
        .clicker_k_banner ul li a div{ clear:both; text-align:center; height:30px; width:40px; margin:0 auto;}
        .clicker_k_banner ul li a p{  font-size:12px; font-weight:600; line-height:12px; clear:both;}
        .clicker_k_banner ul li a:hover{ background: url(/Clicker/images/k_menu_back_black02.png) no-repeat left top; color:#fff !important;}
        .fa-stack-1x, .fa-stack-2x{ left:auto; width:auto; }*/
       
        
        .board_clicker{clear:both; width: 100%; letter-spacing:-0.5px;}
        .board_clicker p{ margin:0px; font-size:20px; text-shadow:1px 1px 1px #000 !important; color:#fff; font-weight:600; padding-top:12px;  }
        .board_clicker div.board_main{ padding-top:17px;}     
        .board_clicker h3{ float: left; display: inline; margin:0; padding-top:3px;}       
        .board_clicker h3 a{ color:#000; font-size:16px; padding:3px 7px; background-color:#fff; width:auto; border:0px !important; }      
        .board_clicker ul{ float: left; display: inline; padding-top:2px; }
        .board_clicker ul li { padding-left:30px; margin:0;}
        .board_clicker ul li a{ color:#fff; font-size:14px; line-height:14px;}
        .board_clicker ul li a:hover{ color:#ffd728 !important;}

        /*배너 */

        .slides_container {float: left; display: inline; height:20px; overflow:hidden; margin:0; background: url("/Clicker/Users/Bcul/images/boardUlbg.png") no-repeat 0px 10px; }               
        #slides { float: left; display: inline; width: 80%; }
        /*Next/prev buttons */
        #slides .next, #slides .prev{ position: absolute; top: 107px; left: -39px; width: 24px; height: 43px; display:none; z-index: 101; }
        #slides .next{left: 585px; display:none; visibility:hidden; }
        /* Pagination */
        #slides .pagination { float:right; text-align:right; padding:5px 0 0 0; margin:0; width:264px; height:20px; display:none; }
        #slides .pagination li {float: right; margin: 0 1px; display:inline; width:10px;}
        #slides .pagination li a {  display:block; float: right; width: 10px; height: 0; padding-top: 10px; background-image: url(/users/gcml/k/images/img/pagination.png); background-position: 0 0; overflow: hidden; margin:0 auto; }
        #slides .pagination li.current a { background-position: 0 -12px; width: 10px; height: 0; padding-top: 10px;}

        /*.clicker_for_study_room h2 { margin-top: 20px; margin-bottom: 5px; font-weight:600; color: #207dd0; font-size:10pt;}
       .clicker_for_readig_seat h2 { margin-top: 20px; margin-bottom: 5px; font-weight:600; color: #207dd0; font-size:10pt;}*/        
        
        /*.clicker-box-to-in {visibility: hidden; }
        .clicker-box-to-out  {visibility: hidden; }*/       
        
        .partition  { background: url("/Clicker/Images/partition.png") repeat 0px 0px; /*width: 943px;*/ height: 3px; margin-top:2px; }
        
        
        .languageLine{float: right; padding-left:5px; padding-top:13px;}
        .languageLine h2{ display:none;}



/*서비스 상세내역*/
.LendGuide{ line-height:25px; margin:0 auto; width:730px; font-size:large;}
.LendGuide h4{ margin:1px; color:#0c92be; padding:5px; font-size:xx-large; font-weight:600; margin:30px 0; text-align:center;}
.LendGuide h5{ background-color:#0c92be; color:#fff; padding:5px; font-weight:600; margin:20px 0; font-size:large;}
.LendGuide h6{ font-weight:600; margin:30px auto 15px auto; clear:left; font-size:large; width:612px; line-height:25px;}
.LendGuide ul{ margin-left:30px;}
.LendGuide li{line-height:22px; padding-left:10px; }
.LendGuide p{margin:10px auto; width:612px;}
.LendGuide .imgcs img{ border:1px solid #eee; background-color:#fff; padding:3px; text-align:center;}
