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

.sub{
    padding:40px;
}
.sub > div{
    margin-bottom:60px;
}
.sub > div:last-child{
    margin-bottom:0;
}

.sub h2{
    background:#e0e0e0;
    font-family:'noto sans kr';
    font-size:23px;
    font-weight:500;
    letter-spacing:-0.03em;
    border-left:8px solid #72a300;
    padding:3px 0 5px 10px;
    margin-bottom:20px;
}
.sub p{
    font-family:'noto sans kr';
    font-size:14.5px;
    line-height:1.7em;
}
.sub dl{
    border:1px solid #ddd;
    padding:20px;
    margin-top:40px;
}
.sub dt{
    font-family:'noto sans kr';
    font-size:20px;
    font-weight:500;
    letter-spacing:-0.03em;
    color:#355600;
    margin-bottom:20px;
}


.sub ul{
    overflow:hidden;
}
.sub li{
    float:left;
    background:#eee;
    width:16%;
    font-size:14px;
    text-align:center;
    margin:2%;
    position:relative;
}
.sub li span{
    display:block;
    background:#ec8e21;
    font-family:'noto sans kr';
    color:#fff;
    padding:3px 0;
}
.sub li p{
    font-family:'noto sans kr';
    padding:10px 0;
}
.sub li::after{
    display:inline-block;
    content:'��';
    background:#ccc;
    width:24px;
    height:24px;
    font-size:14px;
    color:#fff;
    line-height:24px;
    text-align:center;
    border-radius:50%;
    position:absolute;
    top:50%; margin-top:-12px;
    left:100%; margin-left:2px;
}
.sub li:last-child::after{
    display:none;
}
.sub img{
    display:block;
    width:100%;
    border:1px solid #ddd;
    margin:0 auto;
}


/* tablet */
@media screen and (min-width:769px) and (max-width:991px){
    .sub{
        padding:30px;
    }
}

/* mobile */
@media screen and (max-width:768px){
    .sub{
        padding:20px;
    }
	.sub li{
	    width:96%;
	}
    .sub li::after{
        display:none;
    }
}