@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900');
@import url('https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css');


body{
    color: #333333;
    font-size: 14px;
    font-weight: 400 !important;
    font-family: 'Noto Sans KR', sans-serif !important;
    line-height: 1.6;    
    -webkit-font-smoothing: antialiased;
    padding: 0; margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    width: 100%;
}

div { box-sizing: border-box; }

a{
    color: #333333;
    text-decoration: none;
}
a:hover{
    color: #ff9f00;
    text-decoration: none;
}
a.landing { color: #ff9f00; }
    
.list-nav { width: 100%; clear: both; float: left; margin-top: 7px; }
.list-nav ul { display: block; float: left; margin: 0; padding: 0; margin-left: -10px; }
.list-nav li { display: inline-block; float: left; font-size: 20px; }
.list-nav li a { padding: 5px 10px; display: block; }
.list-last { margin-bottom: 500px !important; }

.beauty_list_header { width: 100% !important; background: #fff; padding: 25px 50px; border-top: 5px solid #ff9f00; border-bottom: 1px solid #ddd; overflow: auto !important; position: fixed; z-index: 999; }
.beauty_list_header .container { width: 100%; float: left; }
.beauty_list_header a { display: block; }
.beauty_list_header .logo { float: right; }
.beauty_list_header h1 { clear: left; float: left; margin-top: 0; margin-bottom: 0; font-size: 24px; font-weight: 500; }
.beauty_list_header h1 a { color: #333 !important; }
.beauty_list_header h1 span { color: #ff9f00 !important; }
.beauty_list_header .list_logo { width: 150px; float: right; margin-top: 0px; }
.beauty_list_header2 h1 span { display: block; margin-bottom: 10px; }

.beauty_list { background: #f5f2f3; padding: 0px 50px 50px 50px; float: left; width: 100%; }
.beauty_list .container { width: 100%; float: left; }
.beauty_list table { display: block; width: 100%; margin-bottom: 0px; clear: both; float: left; border-top: 1px solid #ff9f00; padding: 30px 0; font-family: 'noto sans kr'; }
.beauty_list h4 { font-size: 21px; font-weight: 500; color:#ff9f00; width: 100%; float: left; margin: 0 0 20px 0; }
.beauty_list h4:first-child { padding-top: 140px; }
.beauty_list tr { float: left; width: 330px; }
.beauty_list td { width: 100%; line-height: 35px; font-size: 14px; font-weight: 400; color: #777; }

.beauty_list2 { background: #f5f2f3; padding: 0px 50px 50px 50px; float: left; width: 100%; }
.beauty_list2 .container { width: 100%; }
.beauty_list2 table { display: block; width: 100%; margin-bottom: 50px; clear: both; float: left; border-top: 1px solid #ff9f00; padding: 30px 0; font-family: 'noto sans kr'; }
.beauty_list2 h4 { font-size: 32px; color:#ff9f00; width: 100%; float: left; margin: 0 0 20px 0; padding-top: 230px; }
.beauty_list2 tr { float: left; width: 210px; }
.beauty_list2 td { width: 100%; line-height: 35px; font-size: 14px; font-weight: 500; color: #777; }



@media (min-width: 768px) and (max-width: 1023px)  {

.list-nav li { font-size: 17px; }
.list-nav li a { padding: 10px; }
.beauty_list_header { padding: 17px 30px 20px 30px; }
.beauty_list_header2 { padding: 17px 30px 15px 30px; }
.beauty_list_header h1 { font-size: 25px; }
.beauty_list_header .list_logo { width: 150px; margin-top: 3px; }
.beauty_list,
.beauty_list2 { padding: 0 30px 30px 30px; }
.beauty_list h4:first-child { padding-top: 110px; } 
.beauty_list h4 { font-size: 23px; }
.beauty_list2 h4 { padding-top: 200px; margin-bottom: 5px; }
.beauty_list table,
.beauty_list2 table { padding: 15px 0; }


}

@media (min-width: 0px) and (max-width: 767px) {
 
.list-nav ul { margin-left: -7px; }
.list-nav li { font-size: 13px; }
.list-nav li a { padding: 2px 7px; }
.beauty_list_header { padding: 15px 25px; }
.beauty_list_header h1 { font-size: 14px; }
.beauty_list_header .list_logo { width: 90px; margin-top: 0; }
.beauty_list,
.beauty_list2 { padding: 0 20px 20px 20px; }
.beauty_list h4 { padding-top: 150px; margin-bottom: 15px; font-size: 15px; padding: 0 5px; }
.beauty_list h4:first-child { padding-top: 85px; } 
.beauty_list2 h4 { padding-top: 170px; margin-bottom: 5px; font-size: 15px; padding-left: 5px; padding-right: 5px; }
.beauty_list table { padding: 15px 0; }
.beauty_list2 table { padding: 10px 0; }
.beauty_list tr, 
.beauty_list2 tr { float: left; width: auto; margin-right: 10px; }
.beauty_list td,
.beauty_list2 td { font-size: 13px; line-height: 25px; }
.beauty_list_header2 h1 span { font-size: 12px; }

    
}

@media (min-width: 0px) and (max-width: 350px) { 

.beauty_list_header2 h1 span { font-size: 10px; } 

}

