.visualArea {position:relative;height:550px; overflow:hidden;}
.visualArea .rollArea {position:relative;z-index:3;}
.visualArea .rollArea li {width:100%;height:550px;overflow:hidden;}
.visualArea .rollArea li img {position:absolute;top:0;left:50%;height:550px;z-index:1;}
.visualArea .rollArea li img.desc{width:1920px;margin-left:-960px;}
.visualArea .rollArea li img.tablet {width:1023px;margin-left:-512px;}
.visualArea .rollArea li img.mobile {width:767px;margin-left:-384px;}
.visualArea .rollArea li img.tablet, .visualArea .rollArea li img.mobile {display:none;}
.visualArea .rollArea li .text {position:relative;display:block;padding:50px 0 0 0px;z-index:3; width:980px; margin:0 auto;}
.visualArea .rollArea li .txt{position:relative; left:0 !important; height:310px;}

/* pager */
.bx-pager {position:absolute;left:50%;bottom:20px;z-index:3;overflow:hidden; margin-left:-42px;}
.bx-pager-item {float:left;}
.bx-pager-item a {text-indent:-9999em;display:block;width:24px; height:4px; margin:0 2px; background:url(../img/main/sp_page.png) no-repeat 0 -4px;}
.bx-pager-item a.active {background-position:0px 0;}



@media only screen and (min-width:1921px) {
.visualArea {width:1920px; margin:0 auto;}
}



/* tablet */
@media only screen and (max-width:1023px) {
.visualArea .rollArea li .txt{width:auto; height:35%;}
.visualArea .rollArea li .text{padding:4% 0%;}
}

@media only screen and (max-width:767px) {
.visualArea .rollArea li img.desc, .visualArea .rollArea li img.tablet {display:none;}
.visualArea .rollArea li img.mobile {display:block;}
.visualArea {height:240px;}
.visualArea .mobileNone {display:none;}
.visualArea .rollArea li {height:240px;}
.visualArea .rollArea li img {height:240px;}
.visualArea .rollArea li .txt{height:70%;}
.visualArea .rollArea li .text {height:100%;}
.bx-pager {bottom:15px;}
}