.namebox_1{
background:#f5f5f5; 
}
.namebox_1 li{
float:left; border:1px solid #ccc;
}
.namebox_1 li img{
width:100%;  float:left;
}
.js_best_name{
color:#292986; font-weight:500; line-height:50px;
}



/* 칭호부여 */


/*pc*/

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

.namebox_1{
width:1025px; height:564px; margin:10px auto; 
}

.namebox_1 li{
width:191px; height:252px; margin-top:20px; margin-right:10px; 
}


.namebox_1 li:nth-child(1), .namebox_1 li:nth-child(6){
margin-left:10px;
}

.namebox_1 li:nth-child(6), .namebox_1 li:nth-child(7),.namebox_1 li:nth-child(8), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(10){
margin-bottom:30px; margin-top:10px;
}






}

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

.namebox_1{
width:100%;   margin:10px auto; 
}

.namebox_1 ul{
width:783px; height:757px; margin:0 auto;
}


.namebox_1 li{
width:180px; height:237px; margin-top:10px; margin-right:10px;
}


.namebox_1 li:nth-child(1), .namebox_1 li:nth-child(5), .namebox_1 li:nth-child(9){
margin-left:10px;
}

.namebox_1 li:nth-child(6), .namebox_1 li:nth-child(7),.namebox_1 li:nth-child(8), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(10){
margin-top:10px;
}



.namebox_1 li:nth-child(9), .namebox_1 li:nth-child(10){
margin-bottom:10px;
}




}



/*tablet*/

@media all and (min-width:1010px) and (max-width:1059px) {

.namebox_1{
width:100%; margin-top:5px; margin-bottom:10px;
}


.namebox_1 ul{
width:760px; height:750px; margin:10px auto 0;
}



.namebox_1 li{
width:175px; height:231px; margin-top:10px; margin-left:10px;
}


}

@media all and (min-width:801px) and (max-width:1009px) {

.namebox_1{
width:100%;  margin-top:10px; margin-bottom:10px;
}



.namebox_1 li{ 
width:140px; height:184px; margin-top:10px; margin-right:10px;
}


.namebox_1 ul{
width:620px; height:620px;  margin:10px auto 0; 
}


.namebox_1 li:nth-child(1), .namebox_1 li:nth-child(5), .namebox_1 li:nth-child(9){
margin-left:10px;
}



.js_best_name{
line-height:40px;
}





}



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

.namebox_1{
width:100%;  margin-top:10px; margin-bottom:10px;
}



.namebox_1 li{ 
width:135px; height:177px; margin-top:10px; margin-right:10px;
}


.namebox_1 ul{
width:600px; height:695px;  margin:10px auto 0;  
}


.js_best_name{
line-height:40px;
}




}











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


.namebox_1{
width:100%;  margin-top:10px; margin-bottom:10px;
}



.namebox_1 li{ 
width:140px; height:184px; margin-top:10px; margin-right:10px;
}


.namebox_1 ul{
width:620px; height:610px;  margin:10px auto 0;
}




.namebox_1 li:nth-child(1), .namebox_1 li:nth-child(5), .namebox_1 li:nth-child(9){
margin-left:10px;
}

.namebox_1 li:nth-child(6), .namebox_1 li:nth-child(7),.namebox_1 li:nth-child(8), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(10){
margin-top:10px;
}


.namebox_1 li:nth-child(9), .namebox_1 li:nth-child(10){
margin-bottom:10px;
}

.js_best_name{
line-height:40px;
}





}



@media all and (min-width:420px) and (max-width:664px) {

.namebox_1{
width:100%;  margin-top:10px; margin-bottom:10px;
}



.namebox_1 li{
width:175px; height:231px; margin-top:10px; margin-right:10px;

}


.namebox_1 ul{
width:390px; height:1230px;  margin:0 auto;
}



.namebox_1 li:nth-child(1), .namebox_1 li:nth-child(3), .namebox_1 li:nth-child(5), .namebox_1 li:nth-child(7), .namebox_1 li:nth-child(9){
margin-left:10px;
}

.namebox_1 li:nth-child(6), .namebox_1 li:nth-child(7),.namebox_1 li:nth-child(8), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(10){
margin-top:10px;
}


.namebox_1 li:nth-child(9), .namebox_1 li:nth-child(10){
margin-bottom:10px;
}



.js_best_name{
line-height:48px;
}





}



/*mobile*/

@media all and (min-width:361px) and (max-width:419px) {


.namebox_1{
width:100%; margin-top:10px; margin-bottom:10px;
}




.namebox_1 li{ 
width:150px; height:198px; margin-top:10px; margin-right:5px;
}


.namebox_1 ul{
width:330px; height:1060px;  margin:0 auto;
}



.namebox_1 li:nth-child(1), .namebox_1 li:nth-child(3), .namebox_1 li:nth-child(5), .namebox_1 li:nth-child(7), .namebox_1 li:nth-child(9){
margin-left:10px;
}

.namebox_1 li:nth-child(6), .namebox_1 li:nth-child(7),.namebox_1 li:nth-child(8), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(9), .namebox_1 li:nth-child(10){
margin-top:10px;
}



.js_best_name{
line-height:45px;
}





}

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

.namebox_1{
width:100%;  
}

.namebox_1 ul{
width:220px; height:2500px; margin:0 auto;
}



.namebox_1 li{
width:180px; height:237px; margin-top:10px; margin-left:20px;
}







}