#wrap{
    width: 100%;
}

#header{
    width: 100%;
    height: 165px;
}
#header_in{
    position: relative;
    margin: 0 auto;
    width: 1000px;
    height: 115px;
}
#header_in .logo{
    float: left;
    margin: 40px 0 0 0;
}
#header_in .q_mn{
    float: left;
    margin: 40px 0 0 160px;
}
#header_in .q_mn li{
    float: left;
    
}
#header_in .q_mn li:after{
    content:".";
    font-size:20px;
    font-weight: 900;
    padding: 0 8px;
    position: relative;
    top:-3px;
}
#header_in .q_mn li:last-child::after{
    content:"";
}

#header_in .q_mn a{
    font-size: 18px;
    color: #343434;
}

#header_in .input_search{
    float: left;
    margin: 40px 0 0 20px;
    width: 260px; 
    height: 25px;
    background-color:#e9e9e9;
}
#header_in .input_search span{
    float: left;
    line-height: 25px;
    padding-left: 10px;
}
#header_in .input_search a{
    float: right;
}

#header_in .info_menu{
    position: absolute;
    top:5px;
    right: 5px;  
}
#header_in .info_menu li{
    float: left;
    margin-right: 5px;
    padding-right: 5px;
    border-right: 1px solid #343434;
    line-height: 11px;
}
#header_in .info_menu li:last-child{
    margin-right: 0px;
    padding-right: 0px;
    border-right: 0px;
}
#header_in .info_menu a{
    font-size: 11px;
}

#nav_area{
    width: 100%;
    height: 50px;
    background: url(../images/nav_area.jpg)no-repeat 50% 0;
}
#nav_area ul{
    font-size: 0px;/*display: inline적용했을때 여백을 없애는 방법*/
    margin: 0 auto;
    width:1005px;}
#nav_area ul li{display: inline;}

#main_img{
    width: 100%;
    height: 450px;
    background:url(../images/main_img.jpg) no-repeat 50% 0px;
}

#contents{
    padding-top: 35px;
    width: 100%;
}
#item{
    margin: 0 auto;
    width: 1000px;
    height: 260px;
}
#item_h{
    float: left;
    width: 180px;
    height: 260px;
}
#item_h h3{
    font-size: 24px;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    padding: 15px 0;
}
#item_h ul{
    margin-top: 30px;
}
#item_h ul li{
    margin-bottom: 10px;
}
#item_h ul a{
    font-size: 15px;
    font-weight: 900;
}
#item_h ul a:hover{
    color: orange;
    text-decoration: underline;
}

#item_b{
    float: right;
    width: 800px;
    height: 260px;
}
#item_b ul{width: 100%;}
#item_b li{
    float: left;
    width:188px;
    height:260px;
    border: 1px solid #ccc;
    margin-right: 13.33px;
}
#item_b li:last-child{margin-right:0px}
/* 1+188+1 ? 1+188+1  ?  1+188+1 ? 1+188+1 마진X 
   800-760=40 /3 => 13.33px
*/
#item_b li img{
    width: 100%;
    border-bottom: 1px solid #ccc;
}
#item_b li p{
    margin: 15px 0 0 10px;
    font-size: 15px;
}
#item_b li span{
    margin: 5px 0 0 10px;
    font-size: 13px;
}

#banner{
    margin: 0 auto;
    margin-top: 45px;
    width: 1000px;
    height: 280px;
}
#banner a{
    float:left;
    margin-right: 18px;
}
#banner a:last-child{
    margin-right: 0px;
}

#movie{
    margin-top: 40px;
    width: 100%;
    height: 300px;
    background:url(../images/movie.png) no-repeat 50% 0;
    padding-top: 200px;
    box-sizing: border-box;/*패딩을 사용했을 확장되는 크기를 현재크기 포함해서 크기변화안생김*/
}
#movie a{
    margin: 0 auto;
    display: block;
    width:140px;
    height: 40px;
    border: 1px solid #fff;
    font-size: 18px;
    color: #fff;
    text-align: center;
    line-height: 40px;
}
#movie a:hover{
    background-color: #555;
    color: #fff;
    border: 1px solid #555;
    transition: all 0.7s;
}
#style{ 
    margin: 0 auto;
    margin-top: 35px;
    width: 1000px;
    height: 260px;
}
#style_h{
    float: left;
    width: 180px;
    height: 260px;
}
#style_h h3{
    font-size:24px;
    border-top:2px solid #000;
    border-bottom:2px solid #000;
    padding: 15px 0;
}
#style_h ul{
    margin-top: 30px;
}
#style_h li{
    margin-bottom: 10px;
}
#style_h a{
    font-size: 15px;
    font-weight: 900;
}
#style_h a:hover{
    color: red;
}

#style_b{
    float: right;
    width: 800px;
    height: 260px;
}
#style_b li{
    float: left;
    width: 188px;
    height: 260px;
    border: 1px solid #ccc;
    margin-right: 13.33px;
}
#style_b li:last-child{
    margin-right: 0px;

}
#style_b li img{
    width: 100%;
    border-bottom:1px solid #ccc;
}
#style_b li p{
    margin: 15px 0 0 10px;
    font-size: 15px;
}
#style_b li span{
    margin: 5px 0 0 10px;
    font-size: 13px;
}


#goto{
    margin: 0 auto;
    margin-top: 40px;
    width: 1000px;
    height: 390px;
}
#goto .group{
    float: left;
    width: 492px;
}
#goto > a{float: right;}
#goto > .group > a:last-child{
    margin-top: 18px;
    display: block;
} 

#info{
    margin-top: 80px;
    width: 100%;
    height: 160px;
    background:url(../images/footer_top_bg.jpg)repeat-x 0 0;
}
#info_top{
    margin: 0 auto;
    width: 1000px;
    height: 110px ;
}
#info_top img{
    float: left;
}
#info_bottom{
    margin: 0 auto;
    width: 1000px;
    height: 50px ;
    color: #fff;
    line-height: 50px;
}
#info_bottom h3{
    float: left;
    margin: 0 0 0 8px;
    font-size: 14px;
    color: #fff;
}
#info_bottom p{
     float: left;
     margin-left: 24px;
     font-size: 12px;
     color:#fff;
}
#info_bottom span{
    float:right;
    font-size: 12px;
    color:#fff;
    margin: 0 8px 0 0;
}

#footer{
    width: 100%;
}
#footer_top{
    margin: 0 auto;
    width: 1000px;
    height: 300px;
}
#footer_top .all{
    float: left;
    margin: 50px 0 0 20px;
}
#footer_top .all > li{
    float: left;
    margin-right: 50px;
}
#footer_top .sub li:first-child a{
    font-weight: 900;
    font-size: 16px;
}
#footer_top .sub li:first-child{
    margin-bottom: 15px;
}
#footer_top .call_center{
    float: right;
    margin-top: 30px;
}
#footer_top .call_center h3{
    font-size: 28px;
    color: #000;
    border-bottom: 2px solid #000;
    padding-bottom: 10px;    
}
#footer_top .call_center h4{
    margin-top: 14px;
    font-size: 15px;
}
#footer_top .call_center p{
    margin-top: 5px;
    font-size: 14px;
}
#footer_top .app_btns{
    margin-top: 10px;
}
#footer_top .app_btns li{
    float: left;
    margin-right: 10px;
    width: 115px;
    height: 60px;
    border: 1px solid #ccc;
}
#footer_top .app_btns li:last-child{margin-right: 0px;}
#footer_top .app_btns a{
    font-size: 14px;
    font-weight: 900;
    color:#000;
    display: block;
    line-height: 60px;
    text-align: center;
}

#footer_line{
    width: 100%;
    height: 2px;
    background-color: #555;
}
#footer_bottom{
    margin: 0 auto;
    width: 1000px;
    height: 140px;
}

#footer_bottom .logo2{
    float: left;
    margin: 25px 0 0 15px;
    width: 70px;
    height: 50px;
    background-color: #555;
}
#footer_bottom .group{
    float:left ;
    margin: 0 0 0 0;
}
#footer_bottom .info_mn{
    margin: 20px 0 0 15px;
}
#footer_bottom .info_mn li{
    float: left;
}
/* 
 #footer_bottom .info_mn li:before{} 선택된 li요소앞에 내용추가
 #footer_bottom .info_mn li:after{} 선택된 li요소뒤에 내용추가
*/
#footer_bottom .info_mn li:after{
    content: "/";/*들어갈 모양(글자나 기호)*/
    font-size: 14px;/*content에서 글자의 크기*/
    color: #555; /*content에서 글자의 색상*/
    padding: 0 5px; /*가로정렬*/
    position: relative;/*새로운는 마진의 relative(즉 자신이 위치를 기준)*/
    top:-1px;
}
#footer_bottom .info_mn li:last-child::after{
    content: " ";
}
#footer_bottom .info_mn a{
    font-size: 15px;
    color: #000;
} 

#footer_bottom .copyright{
    clear: left;
    margin: 0 0 0 15px;
    padding-top: 10px;
}

#footer_bottom .sns_area{
    float: right;
    margin-top: 20px;
}
#footer_bottom .sns_area ul{}
#footer_bottom .sns_area ul li{ float:left ; margin-right: 10px;}
#footer_bottom .sns_area select{
    width: 120px;
    height: 25px;
}
