/* 共通（ローディングとナビゲーション） */
.bxslider {
position: relative;
}
.bxslider ul {
opacity: 0;
}

.bxslider a {
transition: 0.4s;
}
.bxslider .bx-pager {
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 0px;
    text-align: center;
    display: inline;
}
.bxslider .bx-pager-item {
display: inline;
padding: 0 15px;
}
.bxslider .bx-pager-item a {
background: rgba(0, 123, 255, 0.25);
display: inline-block;
width: 12px;
height: 12px;
text-indent: -200%;
overflow: hidden;
border-radius: 50%;
}
.bxslider .bx-pager-item a:hover {
background: rgba(255,255,255,0.6);
}
.bxslider .bx-pager-item a.active {
background: #007bff;
}

.bxslider .bx-controls-direction {
position: absolute;
top: 50%;
left: 0;
margin-top: -1em;
width: 100%;
height: 0px;
}
.bxslider .bx-controls-direction a {
width: 40px;
height: 40px;
display: block;
background: rgba(0,0,0,0.8);
position: relative;
text-indent: -100%;
overflow: hidden;
}
.bxslider .bx-controls-direction a:hover {
background: rgba(0,0,0,0.4);
}
.bxslider .bx-controls-direction a:before,
.bxslider .bx-controls-direction a:after {
content: '';
position: absolute;
top: 12px;
left: 8px;
}
.bxslider .bx-controls-direction a:after {
width: 16px;
height: 16px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
transform: rotate(45deg);
}
.bxslider .bx-controls-direction a.bx-prev:after {
transform: rotate(-135deg);
left: 16px;
}
.bxslider .bx-prev {
float: left;
}
.bxslider .bx-next {
float: right;
}

.bxslider_custom {
overflow: hidden;
}
.bxslider_custom .bxslider {
max-width: 1100px;
width: 100%;
margin: 0 auto;
}
.bxslider_custom ul li img {
width: 100%;
height: auto;
}
.bxslider_custom ul li {
opacity: 0.5;
}
.bxslider_custom ul li.active {
opacity: 1;
}
.bxslider_custom .bx-viewport {
overflow: visible !important;
}