
/************ main ************/
#title { padding-bottom: 40px; }
section { padding: 80px 0; }
section h1 { text-align: center; margin-bottom: 30px; }
section .t-taba { margin-bottom: 80px; text-align: center; }
section .t-taba a { margin: 10px; font-size: 1.2rem; color: #777; font-weight: 300; }
section .t-taba a:hover { font-weight: 500; color: #a1af96; }


.total { float: left; width: 80%; }
.total span { font-weight: 500; color: #a1af96;}
.hash { float: left; width: 20%; text-align: right; }
.hash a { font-size: 0.9rem; color: #777; font-weight: 300; margin-left: 20px; }
.hash a:hover { font-weight: 500; color: #a1af96; }
.bar { width: 100%; height: 1px; background: #eee; }

section ul { padding: 20px 0; }
section ul li { float: left; width: 32.333%; margin-right: 1.5%; margin-bottom: 30px; }
section ul li img { width: 100%; }
section ul li:nth-child(3n) { margin-right: 0; }

section ul li p { font-size: 1.1rem; }
section .s_price { font-weight: 500; }
.s_title { padding: 10px 0 0; }
.s_title a { color: #555; }
.s_price a { color: #555; }
.s_icon { text-align: right; padding-top: 20px; } 
.s_icon a i { font-size: 1rem; color: #a1af96; } 
.s_icon a { color: #999; margin-left: 20px; font-weight: 500;} 


.m_number { text-align: center; padding: 20px 0 80px; }
.m_number a { color: #a1af96; font-size: 1.5rem; font-weight: 500; }
.m_number a i { font-size: 1rem; color: #999; font-weight: 400; }



/************ 태블릿 **************/

@media screen and (min-width:640px) and (max-width:1399px) { 
    
    /************ main ************/
    #title { padding-bottom: 40px; }
    section { padding: 80px 0; }
    section h1 { color: #333; font-size: 2rem; text-align: center; margin-bottom: 10px;}
    section .t-taba { margin-bottom: 80px; text-align: center; }
    section .t-taba a { margin: 10px; font-size: 1.1rem; color: #777; font-weight: 300; }
    section .t-taba a:hover { font-weight: 500; color: #a1af96; }
    
    
    .total { float: left; width: 45%; }
    .total span { font-weight: 500; color: #a1af96;}
    .hash { float: left; width: 55%; text-align: right; }
    .hash a { font-size: 0.9rem; color: #777; font-weight: 300; margin-left: 10px; }
    .hash a:hover { font-weight: 500; color: #a1af96; }
    .bar { width: 100%; height: 1px; background: #eee; }

    section ul { display: flex; justify-content: space-between; flex-wrap: wrap; }
    section ul li { float: none; flex: 0 0 32%; }
    section ul li img { width: 100%; }
    section ul li:nth-child(3n) { margin-right: 0; }

    section ul li p { font-size: 1rem; }
    section .s_price { font-weight: 500; }
    .s_title { padding: 10px 0 0; }
    .s_title a { color: #555; }
    .s_price a { color: #555; }
    .s_icon { text-align: right; padding-top: 20px; } 
    .s_icon a i { font-size: 1rem; color: #a1af96; } 
    .s_icon a { color: #999; margin-left: 20px; font-weight: 500;} 


    .m_number { text-align: center; padding: 20px 0 80px; }
    .m_number a { color: #a1af96; font-size: 1.5rem; font-weight: 500; }
    .m_number a i { font-size: 1rem; color: #999; font-weight: 400; }


    
}






/************ 모바일 **************/

@media screen and (max-width:639px) {
    
    /************ main ************/
    #title { padding-bottom: 40px; }
    section { padding: 80px 0; }
    section h1 { color: #333; font-size: 2rem; text-align: center; margin-bottom: 10px;}
    section .t-taba { margin-bottom: 80px; text-align: center; }
    section .t-taba a { margin: 5px; font-size: 1rem; color: #777; font-weight: 300; }
    section .t-taba a:hover { font-weight: 500; color: #a1af96; }
    
    .total { float: left; width: 45%; }
    .total p { font-size: 0.8rem; }
    .total span { font-weight: 500; color: #a1af96; font-size: 0.9rem; }
    .hash { float: left; width: 55%; }
    .hash a { font-size: 0.8rem; color: #777; font-weight: 300; margin-left: 5px; }
    .hash a:hover { font-weight: 500; color: #a1af96; }

    .bar { width: 100%; height: 1px; background: #eee; }

    section ul { display: flex; justify-content: space-between; flex-wrap: wrap; }
    section ul li { float: none; flex: 0 0 48%; }
    section ul li img { width: 100%; }
    section ul li:nth-child(2n) { margin-right: 0; }
    section ul li:last-child { display: none; }

    section ul li p { font-size: 1rem; }
    section .s_price { font-weight: 500; }
    .s_title { padding: 10px 0 0; font-size: 1rem; }
    .s_title a { color: #555; }
    .s_price a { color: #555; }
    .s_icon { text-align: right; padding-top: 20px; } 
    .s_icon a i { font-size: 1rem; color: #a1af96; } 
    .s_icon a { color: #999; margin-left: 20px; font-weight: 500;} 


    .m_number { text-align: center; padding: 20px 0 30px; }
    .m_number a { color: #a1af96; font-size: 1.5rem; font-weight: 500; }
    .m_number a i { font-size: 1rem; color: #999; font-weight: 400; }


    

}

