.namebox_5{ margin-top:10px; margin-bottom:10px;
background:#f5f5f5; 
}

.namebox_5 ul{
margin-top:30px; margin-bottom:30px;
}
.namebox_5 li{ position:relative;
float:left; border:1px solid #ccc; margin-bottom:10px; 
}
.namebox_5 li img{ 


max-width:100%;  float:left;
}

.namebox_5 li:last-child{margin-bottom:30px;}



/*.js_best_name{width:100%; height:40px; position:absolute; top:171px; bottom:0; background:pink;}*/



@media all and (min-width:1300px) {

.namebox_5{ 
width:1025px; overflow:hidden; 
}



.namebox_5 li{ margin-right:0.8%; height:225px;
width:18.6341463%; height:242px;
}

.namebox_5 li img{ width:100%; height:200px;}
 
.namebox_5 li:nth-child(1){
margin-left:1.2%;
}

.namebox_5 li:nth-child(6){
margin-left:1.2%;
}


.js_best_name{width:100%; height:42px; position:absolute; top:200px; bottom:0; line-height:42px;}

}


@media all and (min-width:1000px) and (max-width:1299px) {

.namebox_5{ 
width:100%; overflow:hidden; 
}

.namebox_5 ul{
 margin-bottom:30px;
}

.namebox_5 li{ margin-right:0.8%; 

width:18.6341463%;
}


 
.namebox_5 li:nth-child(1){
margin-left:1.2%;
}

.namebox_5 li:nth-child(6){
margin-left:1.2%;
}









}


@media all and (min-width:850px) and (max-width:999px) {

.namebox_5{ 
width:100%; overflow:hidden; 
}

.namebox_5 ul{
 margin-bottom:30px;
}

.namebox_5 li{ margin-right:0.8%; 

width:18.6341463%;
}


 
.namebox_5 li:nth-child(1){
margin-left:1.2%;
}

.namebox_5 li:nth-child(6){
margin-left:1.2%;
}







}






@media all and (min-width:650px) and (max-width:849px) {


.namebox_5{ 
width:100%; overflow:hidden; 
}



.namebox_5 li{ margin-right:0.8%;
width:18.6341463%;
}

.namebox_5 li img{
width:100%;
}
.namebox_5 li:nth-child(1){
margin-left:1.2%;
}

.namebox_5 li:nth-child(6){
margin-left:1.2%;
}




}

@media all and (max-width:649px) {




.namebox_5{ 
width:100%; overflow:hidden; 
}


.namebox_5 li{ margin-right:6%;
width:39.9548533%;
 margin-bottom:15px;}

.namebox_5 li img{
width:100%;
}

.namebox_5 li:nth-child(1){
margin-left:6%;
}

.namebox_5 li:nth-child(3){
margin-left:6%;
}

.namebox_5 li:nth-child(5){
margin-left:6%;
}


.namebox_5 li:nth-child(7){
margin-left:6%;
}


.namebox_5 li:nth-child(9){
margin-left:6%;
}




}





/*³ôÀ̼³Á¤*/


@media all and (min-width:1150px) and (max-width:1299px) {



.namebox_5 li{height:220px;}

.js_best_name{width:100%; height:42px; position:absolute; top:178px; bottom:0; line-height:42px;}


.namebox_5 li img{ width:100%; height:178px;}


}


@media all and (min-width:1100px) and (max-width:1149px) {


.namebox_5 li{height:200px;}

.js_best_name{width:100%; height:42px; position:absolute; top:160px; bottom:0; line-height:42px;}


.namebox_5 li img{ width:100%; height:160px;}


}



@media all and (min-width:1000px) and (max-width:1099px) {


.namebox_5 li{height:190px;}

.js_best_name{width:100%; height:42px; position:absolute; top:150px; bottom:0; line-height:42px;}

.namebox_5 li img{ width:100%; height:150px;}


}



@media all and (min-width:899px) and (max-width:999px) {


.namebox_5 li{height:180px;}

.js_best_name{width:100%; height:40px; position:absolute; top:140px; bottom:0; line-height:40px;}

.namebox_5 li img{ width:100%; height:140px;}

}


@media all and (min-width:800px) and (max-width:900px) {


.namebox_5 li{height:160px;}

.js_best_name{width:100%; height:40px; position:absolute; top:120px; bottom:0; line-height:40px;}

.namebox_5 li img{ width:100%; height:120px;}



}


@media all and (min-width:750px) and (max-width:799px) {


.namebox_5 li{height:180px;}

.js_best_name{width:100%; height:40px; position:absolute; top:140px; bottom:0;  line-height:40px;}

.namebox_5 li img{ width:100%; height:140px;}


}



@media all and (min-width:650px) and (max-width:749px) {

.namebox_5 li{height:160px;}

.js_best_name{width:100%; height:40px; position:absolute; top:120px; bottom:0;  line-height:40px;}

.namebox_5 li img{ width:100%; height:120px;}



}



@media all and (min-width:500px) and (max-width:649px) {

.namebox_5 li{height:220px;}

.js_best_name{width:100%; height:40px; position:absolute; top:180px; bottom:0;line-height:40px;}

.namebox_5 li img{ width:100%; height:180px;}



}


@media all and (min-width:400px) and (max-width:499px) {

.namebox_5 li{height:200px;}

.js_best_name{width:100%; height:40px; position:absolute; top:160px; bottom:0;line-height:40px;}

.namebox_5 li img{ width:100%; height:160px;}



}




@media all  and (min-width:350px) and (max-width:399px) {

.namebox_5 li{height:180px;}

.js_best_name{width:100%; height:40px; position:absolute; top:138px; bottom:0;line-height:42px;}

.namebox_5 li img{ width:100%; height:138px;}



}

@media all and (min-width:300px) and (max-width:349px) {

.namebox_5 li{height:160px;}

.js_best_name{width:100%; height:40px; position:absolute;top:120px; bottom:0;line-height:40px;}

.namebox_5 li img{ width:100%; height:120px;}

}


@media all  and (max-width:299px) {

.namebox_5 li{height:140px;}

.js_best_name{width:100%; height:40px; position:absolute; top:100px; bottom:0;line-height:40px;}

.namebox_5 li img{ width:100%; height:100px;}



}




}