@charset "UTF-8";

*{margin: 0; padding: 0;}
label, span{display:inline-block;}
li{list-style:none;}
a{text-decoration:none; display:inline-block; color:#000;}
img{max-width:100%;}
.blind{font-size:0; position:absolute; left:-9999px;}
.center{
    /* 최대넓이가 800px이라는 것은 화면이 아무리 넓어도 800px까지만 커지고 
       화면폭이 작아지면 상대적인 크기로 줄어드는 것을 말한다. */
    max-width: 100%; margin: auto;
}
.row{overflow: hidden;}
.col{float: left;}
[class*=col]{width: 100%;}
.box{border:1px solid #000; height: 100px;}

/* 반응형이 아닌 기본값 */
.col-1{width:8.33%;} 
.col-2{width:16.66%;}        
.col-3{width:25%;}
.col-4{width:33.33%;}
.col-5{width:41.66%;}
.col-6{width:50%;}
.col-7{width:58.33%;}
.col-8{width:66.66%;}
.col-9{width:75%;}
.col-10{width:83.33%;}
.col-11{width:91.66%;}
.col-12{width:100%;}

/* 스마트폰 xs */
@media screen and (max-width:767px){
    .col-xs-1{width:8.33%;} 
    .col-xs-2{width:16.66%;}        
    .col-xs-3{width:25%;}
    .col-xs-4{width:33.33%;}
    .col-xs-5{width:41.66%;}
    .col-xs-6{width:50%;}
    .col-xs-7{width:58.33%;}
    .col-xs-8{width:66.66%;}
    .col-xs-9{width:75%;}
    .col-xs-10{width:83.33%;}
    .col-xs-11{width:91.66%;}
    .col-xs-12{width:100%;}
}

/* 태블릿 sm */
@media screen and (min-width:768px){
    .col-sm-1{width:8.33%;} 
    .col-sm-2{width:16.66%;}        
    .col-sm-3{width:25%;}
    .col-sm-4{width:33.33%;}
    .col-sm-5{width:41.66%;}
    .col-sm-6{width:50%;}
    .col-sm-7{width:58.33%;}
    .col-sm-8{width:66.66%;}
    .col-sm-9{width:75%;}
    .col-sm-10{width:83.33%;}
    .col-sm-11{width:91.66%;}
    .col-sm-12{width:100%;}
}

/* 기본데스크탑 md */
@media screen and (min-width:992px){
    .col-md-1{width:8.33%;} 
    .col-md-2{width:16.66%;}        
    .col-md-3{width:25%;}
    .col-md-4{width:33.33%;}
    .col-md-5{width:41.66%;}
    .col-md-6{width:50%;}
    .col-md-7{width:58.33%;}
    .col-md-8{width:66.66%;}
    .col-md-9{width:75%;}
    .col-md-10{width:83.33%;}
    .col-md-11{width:91.66%;}
    .col-md-12{width:100%;}
}

/* 큰데스크탑 lg */
@media screen and (min-width:1200px){
    .col-lg-1{width:8.33%;} 
    .col-lg-2{width:16.66%;}        
    .col-lg-3{width:25%;}
    .col-lg-4{width:33.33%;}
    .col-lg-5{width:41.66%;}
    .col-lg-6{width:50%;}
    .col-lg-7{width:58.33%;}
    .col-lg-8{width:66.66%;}
    .col-lg-9{width:75%;}
    .col-lg-10{width:83.33%;}
    .col-lg-11{width:91.66%;}
    .col-lg-12{width:100%;}
}