@charset "UTF-8";
/* CSS Document */





@media screen and (max-width: 799px) {
	
.slide_sp{} 
.slide_pc{ display:none; }
	
#slide{
    clear: both;
    margin: 0 auto;
    overflow: hidden;
    width: 100%;
	  background: #FAF4E3;
}
#slide .bx-wrapper{
	max-width: 350px!important;
	
	 margin: 0 auto!important;
	position: relative;
}
#slide .bx-wrapper .bx-viewport{
    overflow: visible!important;
}
#slide 	.bx-wrapper .bx-controls-direction a{
	position: absolute;
    text-indent: -9999px;
}


.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  width:80px;
  margin:0 auto;
  padding:15px 0 25px;
  
}
.bx-wrapper .bx-pager.bx-default-pager a {
  background: #ccc;  /*ページャーの色の変更*/
  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;
  float:left;
}
 
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
  background: #999;  /**ページャーの色（フーバー、アクティブ）の変更*/
}
	


	
	}


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

.slide_sp{ display:none; } 
.slide_pc{}

#slide{
    clear: both;
    margin: 0 auto;
    overflow: hidden;
    width: 100%;
    background: #FAF4E3;
}
#slide .bx-wrapper{
	max-width: 1100px!important;
    margin: 0 auto!important;
	position: relative;
}
#slide .bx-wrapper .bx-viewport{
    overflow: visible!important;
}
#slide 	.bx-wrapper .bx-controls-direction a{
	position: absolute;
    text-indent: -9999px;
}
#slide .bx-wrapper .bx-controls-direction a.bx-prev{
  left: 46.5%;
  top: 48%;
  width: 80px;
  height: 80px;
  margin-left: -50%;
  margin-top: -25px;
  background: url("../image/slider/slide_prev_btn.png") no-repeat left top;
}
#slide .bx-wrapper .bx-controls-direction a.bx-next{
  right: -5.5%;
  top: 48%;
  width: 80px;
  height: 80px;
  margin-right:0;
  margin-top: -20px;
  background: url("../image/slider/slide_next_btn.png") no-repeat left top;
}

.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  width:80px;
  margin:0 auto;
  padding-top:15px;
  
}
.bx-wrapper .bx-pager.bx-default-pager a {
  background: #ccc;  /*ページャーの色の変更*/
  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;
  float:left;
}
 
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
  background: #999;  /**ページャーの色（フーバー、アクティブ）の変更*/
}
	

}