.q-a{width: 12.6rem;padding-top: .6rem; padding-bottom: .45rem;}
.q-cont{width: 100%;}
.q-titles{text-align: center;font-weight: bold;color: #333333;padding-bottom: .1rem;}
.q-list{width: 100%;}
.q-item{display: block;cursor: pointer;margin-top: .6rem; width: 100%;position: relative;text-align: right;background-color: #f8f8f8;}
.q-img{position: absolute;top: 0;left: 0;width: 50%;height: 100%;background-size: cover;background-position: center center;background-repeat: no-repeat;}
.q-text{display: inline-block;text-align: center;padding: .5rem .6rem;width: 50%;}
.q-icon{position: relative;top: 0;transition: all ease .5s;display: inline-block; width: .8rem;margin-bottom: .35rem;}
.q-icon img{width: 100%;}
.q-b{font-weight: bold; color: #333333;line-height: 1.3;margin-bottom: .25rem;}
.q-textbox{color: #666666;line-height: 2.2;text-align: left;}
.q-textbox *{line-height: inherit;}
.q-item:hover .q-icon{top: -5px;} 
@media(min-width: 750px){ 
    .q-item:nth-child(2n)  {text-align: left;}
    .q-item:nth-child(2n) .q-img{right: 0;left: auto;}
}
@media(max-width: 750px){ 
    .q-a{width: 100%;}
    .q-img{width: 100%;height: auto;padding-top: 59.58%;position:  static;}
    .q-text{width: 100%;padding: .35rem .25rem;}
}