/* Basic jQuery Slider essential styles */

ul.bjqs{position:relative; list-style:none;padding:0;margin:0;overflow:hidden; display:none;}
li.bjqs-slide {
    position: absolute;
    display: none;
   
}
ul.bjqs-controls{list-style:none;margin:0;padding:0;z-index:9999;}
ul.bjqs-controls.v-centered li a{position:absolute;}
ul.bjqs-controls.v-centered li.bjqs-next a{right:0;}
ul.bjqs-controls.v-centered li.bjqs-prev a{left:0;}
ol.bjqs-markers {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1px; /* 이미지 아래에 겹치게 표시, 필요시 값 조정 */
    margin: 0 auto;
    width: 100%;
    text-align: center;
    z-index: 1000;
    pointer-events: auto;
}

ol.bjqs-markers li {
    display: inline-block;
    margin: 0 6px;
}

    ol.bjqs-markers li a {
        display: inline-block;
        width: 4px;
        height: 4px;
        background: rgba(255,255,255,0.15); /* 거의 투명한 흰색 */
        color: rgba(255,255,255,0.15);
        border-radius: 70%;
        margin: 0 6px;
        text-indent: -9999px;
        transition: width 0.2s, height 0.2s, background 0.2s;
    }

    ol.bjqs-markers li.active-marker a {
        width: 6px;
        height: 6px;
        color: rgba(255,255,255,0.15);
        background: rgba(255,255,255,0.7); /* 반투명 흰색 */
    }

p.bjqs-caption{display:block;width:96%;margin:0;padding:2%;position:absolute;bottom:0;}


.bjqs-controls li a {
    background: rgba(78, 84, 200, 0.2) !important; /* 반투명 배경 */
    color: rgba(255,255,255,0.3) !important;       /* 반투명 텍스트 */
    /* 나머지 스타일은 그대로 유지 */
    display: inline-block;
    padding: 12px 28px;
    margin: 0 8px;
    font-size: 1.2em;
    font-weight: bold;
    border-radius: 32px;
    border: none;
    box-shadow: none;
    text-shadow: none;
    transition: background 0.3s, transform 0.2s;
    outline: none;
    cursor: pointer;
    letter-spacing: 1px;
    text-decoration: none;
}

.bjqs-controls li a:hover, 
.bjqs-controls li a:focus {
    background: rgba(143, 148, 251, 0.7) !important; /* 호버 시 더 진한 반투명 */
    color: rgba(255,255,255,0.9) !important;         /* 호버 시 더 진한 텍스트 */
    transform: scale(1.08);
}

.bjqs-controls {
    opacity: 0;
    transition: opacity 0.3s;
}

#banner-fade:hover .bjqs-controls {
    opacity: 1;
}

#banner-fade {
    position: relative;
}