@import url("http://fonts.googleapis.com/earlyaccess/notosanskr.css");

.sub{font-size:15px; font-weight:400; font-family:'noto sans kr'; letter-spacing:-0.5px; color:#333;}
.sub img{display:block; margin:0 auto; width:100%; max-width:1000px;}
.sub h3{font-size:22px; margin-top:20px;}
.sub h3:before{
    display:inline-block;
    content:'';
    width:3px;
    height:10px;
    background:#ff6c00;
    transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg);
    margin:0 4px 15px 5px;
}
.sub h4{font-size:20px; background:#ff6c00; color:#fff; padding:3px 8px; display:inline-block; margin-top:20px; font-weight:500;}
.sub h5{color:#ff6c00; font-size:18px; margin-top:20px;}
.sub h5:first-child, .sub h4:first-child{margin-top:0;}
.sub ul{overflow:hidden; display:table; width:100%;}
.sub li{text-indent:-8px; margin:7px 0 0 8px;}
.sub li:first-child{margin-top:0;}
.sub li:before{content:""; display:inline-block; margin:0 5px 4px 0; width:4px; height:4px; border-radius:50%; background-color:#ff6c00;}
.sub span{color:#ff6c00;}

.con{padding:0 15px; margin-top:3px;}
.con h3{font-size:20px;}
.con h3:first-child{margin-top:0;}
.con h3:before{display:none;}

.m_list{display:table; width:100%; overflow:hidden;  margin-top:3px;}
.m_list img{width:20%; margin-right:5%; border-radius:10px;}
.m_list img, .m_cover{float:left;}

.m_cover{width:75%;}
.m_info{overflow:hidden; margin-bottom:20px;}
.m_info:last-child{margin-bottom:0;}
.m_info h4{font-size:20px; width:20%; border-top:2px solid #ff6c00; padding:10px 0 0 10px; background:none; color:#333;}
.m_info ul{width:80%; border-top:2px solid #ddd; padding:10px 0 0 10px; line-height:22px; color:#777;}
.m_info h4, .m_info ul{float:left;}

/* tablet */
@media screen and (min-width:769px) and (max-width:991px){
}

/* mobile */
@media screen and (max-width:768px){
    .sub li{float:left; width:46%; margin:1%;}
    .con{padding:0 5px;}
}