@media (min-width: 240px) and (max-width: 478px) {
.other-service {margin-top:20px; }
.other-service h1 { color:#003366;font-size:22px;font-weight:normal;margin:25px }

.service-list { overflow:auto;/*margin:10px;*/ }
.service-list > .box { /*float:left;*/width:100%;box-sizing:border-box;padding:10px 15px 10px 15px; border-bottom:1px solid #ddd; }
.service-list > .box:last-child { border-bottom:1px solid #ddd;}
.service-list > .box > .img-area { margin-bottom:8px; float:left; width:35%;box-sizing:border-box;}
.service-list > .box > .img-area img { width:100%;box-shadow: 2px 5px 5px 2px #ddd;}
.service-list > .box > .txt-area { margin-bottom:13px; float:left; width:65%; padding-left:10px; box-sizing:border-box;}
.service-list > .box > .txt-area > span { color:#666666;font-size:16px;display:block;line-height:1.6 }
.service-list > .box > .txt-area > a { color:#333;font-size:22px;font-weight:normal;margin:7px 0; line-height:30px;}

.sp-col1{width:100%;/* float:left;*/}
.sp-col2{width:100%; /*float:right;*/}

.sp-box-banner{margin-top:20px;/* padding-right:20px;*/}
.sp-clear-fix {clear:both; height:0px;}

.sp-col-pic { margin: 0px 0 20px 0; width:100%;}
}

@media (min-width: 478px) and (max-width: 767px) {
.other-service {margin-top:20px;}
.other-service h1 { color:#003366;font-size:22px;font-weight:normal;margin:25px }

.service-list { overflow:auto;/*margin:10px;*/ }
.service-list > .box {float:left;width:33.33%;box-sizing:border-box;padding:10px 15px 35px 15px; border-left:1px solid #ddd; }
.service-list > .box:last-child { border-right:1px solid #ddd;}
.service-list > .box > .img-area { margin-bottom:8px; /*float:left;*/ width:100%;box-sizing:border-box;}
.service-list > .box > .img-area img { width:100%;box-shadow: 2px 5px 5px 2px #ddd;}
.service-list > .box > .txt-area { margin-bottom:13px; /*float:left;*/ width:100%; /*padding-left:10px;*/ box-sizing:border-box;}
.service-list > .box > .txt-area > span { color:#666666;font-size:16px;display:block;line-height:1.6 }
.service-list > .box > .txt-area > a { color:#333;font-size:22px;font-weight:normal;margin:7px 0; line-height:30px;}

.sp-col1{width:100%;/* float:left;*/}
.sp-col2{width:100%; /*float:right;*/}

.sp-box-banner{margin-top:20px;/* padding-right:20px;*/}
.sp-clear-fix {clear:both; height:20px;}

.sp-col-pic { margin: 0px 0 20px 0; width:100%;}
}

@media (min-width: 768px) and (max-width: 992px) {

.other-service {margin-top:20px; }
.other-service h1 { color:#003366;font-size:22px;font-weight:normal;margin:25px }

.service-list { overflow:auto;/*margin:10px;*/ }
.service-list > .box {float:left;width:33.33%;box-sizing:border-box;padding:10px 15px 35px 15px; border-left:1px solid #ddd; }
.service-list > .box:last-child { border-right:1px solid #ddd;}
.service-list > .box > .img-area { margin-bottom:8px; /*float:left;*/ width:100%;box-sizing:border-box;}
.service-list > .box > .img-area img { width:100%;box-shadow: 2px 5px 5px 2px #ddd;}
.service-list > .box > .txt-area { margin-bottom:13px; /*float:left;*/ width:100%; /*padding-left:10px;*/ box-sizing:border-box;}
.service-list > .box > .txt-area > span { color:#666666;font-size:16px;display:block;line-height:1.6 }
.service-list > .box > .txt-area > a { color:#333;font-size:22px;font-weight:normal;margin:7px 0; line-height:30px;}

.sp-col1{width:100%;/* float:left;*/}
.sp-col2{width:100%; /*float:right;*/}

.sp-box-banner{margin-top:20px;/* padding-right:20px;*/}
.sp-clear-fix {clear:both; height:20px;}

.sp-col-pic {float: left; margin: 0px 25px 20px 0;}

}

@media (min-width: 992px) and (max-width: 1280px) {

.other-service {margin-top:40px; }
.other-service h1 { color:#003366;font-size:22px;font-weight:normal;margin:25px }

.service-list { overflow:auto;/*margin:10px;*/ }
.service-list > .box {float:left;width:33.33%;box-sizing:border-box;padding:10px 15px 35px 15px; border-left:1px solid #ddd; }
.service-list > .box:last-child { border-right:1px solid #ddd;}
.service-list > .box > .img-area { margin-bottom:8px; /*float:left;*/ width:100%;box-sizing:border-box;}
.service-list > .box > .img-area img { width:100%;box-shadow: 2px 5px 5px 2px #ddd;}
.service-list > .box > .txt-area { margin-bottom:13px; /*float:left;*/ width:100%; /*padding-left:10px;*/ box-sizing:border-box;}
.service-list > .box > .txt-area > span { color:#666666;font-size:16px;display:block;line-height:1.6 }
.service-list > .box > .txt-area > a { color:#333;font-size:22px;font-weight:normal;margin:7px 0; line-height:30px;}

.sp-col1{width:45%; float:left;}
.sp-col2{width:55%; float:right;}

.sp-box-banner{margin-top:40px; padding-right:20px;}
.sp-clear-fix {clear:both; height:30px;}

.sp-col-pic {float: left; margin: 0px 25px 20px 0;}

}

@media (min-width: 1280px) {

.other-service {margin-top:40px; }
.other-service h1 { color:#003366;font-size:22px;font-weight:normal;margin:25px }

.service-list { overflow:auto;/*margin:10px;*/ }
.service-list > .box {float:left;width:33.33%;box-sizing:border-box;padding:10px 15px 20px 15px; border-left:1px solid #ddd; }
.service-list > .box:last-child { border-right:1px solid #ddd;}
.service-list > .box > .img-area { margin-bottom:8px; /*float:left;*/ width:100%;box-sizing:border-box;}
.service-list > .box > .img-area img { width:100%;box-shadow: 2px 5px 5px 2px #ddd;}
.service-list > .box > .txt-area { margin-bottom:13px; margin-top: 14px;/*float:left;*/ width:100%; /*padding-left:10px;*/ box-sizing:border-box;}
.service-list > .box > .txt-area > span { color:#666666;font-size:16px;display:block;line-height:1.6 }
.service-list > .box > .txt-area > a { color:#333;font-size:22px;font-weight:normal;margin:7px 0; line-height:30px;}

.sp-col1{width:45%; float:left;}
.sp-col2{width:55%; float:right;}

.sp-box-banner{margin-top:40px; padding-right:20px;}
.sp-clear-fix {clear:both; height:30px;}

.sp-col-pic {float: left; margin: 0px 25px 20px 0;}
/*.sp-col-pic > .pic {padding-right:20px;}
.sp-col-txt {width:60%; float:right; box-sizing:border-box;}*/

}