@charset "utf-8";
/* CSS Document */
.loopSliderWrap img{
	vertical-align:top;
	width: 100%;
	height: 100%;
}
.loopSliderWrap2 img{
	vertical-align:top;
	width: 100%;
	height: 100%;
}

/* ------------------------------
   loopSlider
------------------------------ */
.loopSliderWrap {
    top: 0;
    left: 0;
    height: 250px;
    overflow: hidden;
    position: absolute;
}
 
.loopSlider {
    margin: 0 auto;
    width: 100%;
    height: 250px;
    text-align: left;
    position: relative;
    overflow: hidden;
}
 
.loopSlider ul {
    height: 250px;
    float: left;
    overflow: hidden;
}
 
.loopSlider ul li {
    width: 250px;
    height: 250px;
    float: left;
    display: inline;
    overflow: hidden;
}
/* ------------------------------
   loopSlider2
------------------------------ */
.loopSliderWrap2 {
    top: 0;
    right: 0;
    height: 250px;
    overflow: hidden;
    position: absolute;
}
 
.loopSlider2 {
    margin: 0 auto;
    width: 100%;
    height: 250px;
    text-align: right;
    position: relative;
    overflow: hidden;
}
 
.loopSlider2 ul {
    height: 250px;
    float: right;
    overflow: hidden;
}
 
.loopSlider2 ul li {
    width: 250px;
    height: 250px;
    float: right;
    display: inline;
    overflow: hidden;
}
 

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.loopSliderWrap {
    top: 0;
    left: 0;
    height: 150px;
    overflow: hidden;
    position: absolute;
}
.loopSlider {
    margin: 0 auto;
    width: 100%;
    height: 150px;
    text-align: left;
    position: relative;
    overflow: hidden;
}
 
.loopSlider ul {
    height: 150px;
    float: left;
    overflow: hidden;
}
 
.loopSlider ul li {
    width: 150px;
    height: 150px;
    float: left;
    display: inline;
    overflow: hidden;
}
	
/* ------------------------------
   loopSlider2
------------------------------ */
.loopSliderWrap2 {
    top: 0;
    right: 0;
    height: 150px;
    overflow: hidden;
    position: absolute;
}
.loopSlider2 {
    margin: 0 auto;
    width: 100%;
    height: 150px;
    text-align: right;
    position: relative;
    overflow: hidden;
}
 
.loopSlider2 ul {
    height: 150px;
    float: right;
    overflow: hidden;
}
 
.loopSlider2 ul li {
    width: 150px;
    height: 150px;
    float: right;
    display: inline;
    overflow: hidden;
}

}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.loopSliderWrap {
    top: 0;
    left: 0;
    height: 150px;
    overflow: hidden;
    position: absolute;
}
.loopSlider {
    margin: 0 auto;
    width: 100%;
    height: 150px;
    text-align: left;
    position: relative;
    overflow: hidden;
}
 
.loopSlider ul {
    height: 150px;
    float: left;
    overflow: hidden;
}
 
.loopSlider ul li {
    width: 150px;
    height: 150px;
    float: left;
    display: inline;
    overflow: hidden;
}
/* ------------------------------
   loopSlider2
------------------------------ */
.loopSliderWrap2 {
    top: 0;
    right: 0;
    height: 150px;
    overflow: hidden;
    position: absolute;
}
.loopSlider2 {
    margin: 0 auto;
    width: 100%;
    height: 150px;
    text-align: right;
    position: relative;
    overflow: hidden;
}
 
.loopSlider2 ul {
    height: 150px;
    float: right;
    overflow: hidden;
}
 
.loopSlider2 ul li {
    width: 150px;
    height: 150px;
    float: right;
    display: inline;
    overflow: hidden;
}
}