/** VARIABLES
===================================*/
/** RESET AND LAYOUT
===================================*/
#contents .bx-wrapper {
position: relative;
padding: 0;
*zoom: 1;
-ms-touch-action: pan-y;
touch-action: pan-y;
margin: 0 0 10px 0;
}
#contents .bx-wrapper img {
display: block;
}
#contents .bxslider {
margin: 0;
padding: 0;
}
#contents ul.bxslider {
list-style: none;
}
#contents .bx-viewport {
-webkit-transform: translatez(0);
}
/** THEME
===================================*/
#contents .bx-wrapper .bx-pager,
#contents .bx-wrapper .bx-controls-auto {
position: absolute;
bottom: -30px;
width: 100%;
}
/* LOADER */
#contents .bx-wrapper .bx-loading {
min-height: 50px;
/*background: url('images/bx_loader.gif') center center no-repeat #ffffff;*/
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2000;
}
/* PAGER */
#contents .bx-wrapper .bx-pager {
text-align: center;
font-size: .85em;
font-family: Arial;
font-weight: bold;
color: #666;
padding-top: 20px;
}
#contents .bx-wrapper .bx-pager.bx-default-pager a {
background: #c1c1c1;
text-indent: -9999px;
display: block;
width: 10px;
height: 10px;
margin: 0 5px;
outline: 0;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
#contents .bx-wrapper .bx-pager.bx-default-pager a:hover,
#contents .bx-wrapper .bx-pager.bx-default-pager a.active,
#contents .bx-wrapper .bx-pager.bx-default-pager a:focus {
background: #000;
}
#contents .bx-wrapper .bx-pager-item,
#contents .bx-wrapper .bx-controls-auto .bx-controls-auto-item {
display: inline-block;
vertical-align: bottom;
*zoom: 1;
*display: inline;
}
#contents .bx-wrapper .bx-pager-item {
font-size: 0;
line-height: 0;
}
#contents .bx-wrapper .bx-prev:hover,
#contents .bx-wrapper .bx-prev:focus {
opacity: 0.8;
}
#contents .bx-wrapper .bx-next:hover,
#contents .bx-wrapper .bx-next:focus {
opacity: 0.8;
}

#contents .bx-wrapper .bx-controls-direction a {
position: absolute;
outline: 0;
width: 40px;
height: 40px;
text-indent: -9999px;
z-index: 9999;
}



@media only screen and (min-width: 641px) {


#contents .bg_white {
background: #f7f5eb;
width: 900px;
margin: 40px auto;
padding: 50px;
box-sizing: border-box;
}
#contents div.slider {
width:100%;
display:block;
margin: 0 auto;
position: relative;
border-bottom: 1px dashed #a4a4a4;
padding: 0 0 30px 0;
}
#contents ul.bxslider01 li {/*メインスライダー*/
display:block;
width:790px;
height:auto;
overflow: hidden;
background: none;
padding: 0;
}
#contents ul.bxslider01 li img{
display:block;
width: 100%;
height:auto;
}
#contents ul.bxslider01 li span {
display: block;
text-align: center;
font-size: 12px;
font-size: 1.2rem;
line-height: 2rem;
margin: 14px 0 0 0;
}
#contents ul.bxslider02 li {
background: none;
padding: 0;
}
#contents ul.bxslider02 li a {/*サムネイル*/
display:block;
width:185px;
height:auto;
}
#contents ul.bxslider02 li a img{/*サムネイルの画像*/
display:block;
width:100%;
height:auto;
}
#contents ul.bxslider02 li a span {
display: none;
}
#contents ul.bxslider01,
#contents ul.bxslider02 {
margin: 0;
padding: 0;
}
#contents div.controlWrap {
width:100%;
display:block;
margin: 14px 0 0 0;
}
#contents .bx-wrapper {
} 
#contents .bx-wrapper .bx-prev {
display: block;
	left: -20px;
	top: 0;
background: url('img/controls_case.png') no-repeat left 0;
background-size: 80px;
}
#contents .bx-wrapper .bx-next {
display: block;
	right: calc(35% - 17px);
	top: 0;
background: url('img/controls_case.png') no-repeat right 0;
background-size: 80px;
}
#contents .bx-wrapper .bx-controls-direction a {
position: absolute;
top: 50%;
outline: 0;
width: 40px;
height: 40px;
margin: -10px 0 0 0;
text-indent: -9999px;
z-index: 9999;
}
#contents #bx-pager {
width: 100%!important;
transform: translate3d(0px, 0px, 0px)!important;
}
#contents #bx-pager li {
margin: 0 20px 0 0;
float: left;
width: 185px;
height:auto;
overflow: hidden;
}
#contents #bx-pager li:nth-child(4n){
margin: 0;
}
#contents .bx-viewport {
height: auto!important;
}
#contents #bx-pager li a img {
opacity: 0.5;
}
#contents #bx-pager li a.active img {
opacity: 1;
}
#contents .txtBox {
width: 920px;
padding: 0 10px;
box-sizing: border-box;
margin: 0 auto;
font-size: 13px;
}



}



@media only screen and (max-width: 640px) {

#contents img {
width: 100%;
height: auto;
}
#contents .bg_white {
background: #f7f5eb;
width: 100%;
margin: 30px auto 20px;
padding: 10px;
box-sizing: border-box;
position: relative;
}
#contents div.slider {
width:100%;
display:block;
margin: 0 auto;
padding: 0;
box-sizing: border-box;
}
#contents ul.bxslider01 li {/*メインスライダー*/
display:block;
width:100%;
height:auto;
overflow: hidden;
background: none;
padding: 0;
}
#contents ul.bxslider01 li img{
display:block;
width: 100%;
height:auto;
}
#contents ul.bxslider01 li span {
display: block;
text-align: center;
font-size: 10px;
font-size: 1rem;
line-height: 2rem;
margin: 30px 0 0 0;
word-break: break-all;
}
#contents ul.bxslider02 li {
background: none;
padding: 0;
}
#contents ul.bxslider02 li a {/*サムネイル*/
display:block;
/*width:100px;*/
height:auto;
}
#contents ul.bxslider02 li a img{/*サムネイルの画像*/
display:block;
width:100%;
height:auto;
margin: 0 0 4px 0;
}
#contents ul.bxslider02 li a span {
display: block;
font-size: 12px;
line-height: 1.3;
}
#contents ul.bxslider02 li a {
text-decoration: none;
}
#contents ul.bxslider01,
#contents ul.bxslider02 {
margin: 0;
padding: 0;
}
#contents div.controlWrap {
width:100%;
display:none;
}
#contents .bx-wrapper {
margin: 0 0 10px 0;
} 
#contents .bx-wrapper .bx-prev {
display: block;
top: 0;
left: -20px;
background: url('img/controls_case.png') no-repeat 0 0;
background-size: 40px;
}
#contents .bx-wrapper .bx-next {
display: block;
top: 0;
right: calc(35% - 17px);
background: url('img/controls_case.png') no-repeat -40px 0;
background-size: 40px;
}
#contents .bx-wrapper .bx-controls-direction a {
top: 50%;
outline: 0;
width: 40px;
height: 40px;
text-indent: -9999px;
z-index: 1;
margin-top: -10px;
}
#contents .bx-wrapper .bx-pager,
#contents .bx-wrapper .bx-controls-auto {
position: absolute;
bottom: inherit;
top: 145px;
width: 100%;
}
#contents #bx-pager {
width: 280px !important;
transform: translate3d(0px, 0px, 0px)!important;
margin: 0 auto;
}
#contents #bx-pager li {
margin: 0 8px 8px 0;
float: left;
width: 88px;
height:auto;
overflow: hidden;
}
#contents #bx-pager li:nth-child(3n) {
margin: 0 0 8px 0;
}
#contents #bx-pager li:nth-child(4),
v#bx-pager li:nth-child(5) {
margin: 0 8px 0 0;
}
#contents #bx-pager li:nth-child(6) {
margin: 0;
}
#contents .bx-viewport {
height: auto!important;
}
#contents #bx-pager li a img {
opacity: 0.5;
}
#contents #bx-pager li a.active img {
opacity: 1;
}
#contents .txtBox {
width: 100%;
padding: 0 10px;
box-sizing: border-box;
font-size: 13px;
}


}





