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

/* info_box */

.info2 {
   
    border:1px solid #efefef;
}

.info2 h1 {
    font-family: "Noto Sans KR", sans-serif;
    font-size:20px;
    font-weight:500;
    letter-spacing:-1px;
    color:#fff;
    padding:5px 50px;
    background:#2c3383;

}

.info2 h1 em {
    font-family: "Noto Sans KR", sans-serif;
    font-weight:200;
    letter-spacing:0px;
    color:#eee;
    margin-left:7px;
    font-size:14px;
}

.info2 .info_box {
    overflow:hidden;
    position:relative;
    padding:50px 20px;
    background:url(/app/dubu_sourcecode/docs/imgs/1450932199_info_img4.png) repeat-x bottom;
    background-size:10px;
}


.info2 .info_box ul {
    float:left;
    margin-left:40px;
    width: 60%;
}

.info2 .info_box li {
    font-family: "Noto Sans KR", sans-serif;
    font-size:13px;
    font-weight:300;
    letter-spacing:-0.7px;
    line-height:1.8;
    color:#595959;
}
.info2 .info_box ul li strong {
    font-family: "Noto Sans KR", sans-serif;
    font-size:15px;
    font-weight:800;
    margin-top:10px;
    display:block;
}


.info2 .info_box img {
    width:180px;
    border-radius:10px;
    border:5px solid #eee;
    background:#fafafa;
}


/* name */

.info2 .info_box .name {
    float:left;
    width:220px;
    text-align:center;
}

.info2 .info_box .name h2 {
    font-family: "Noto Sans KR", sans-serif;
    font-size:16px;
    font-weight:500;
    letter-spacing:-1px;
    color:#9a9a9a;
    margin-top:10px;
}

.info2 .info_box .name h2 em {
    font-family:'Nanum Brush Script';
    font-size:2.5em;
    font-weight:400;
    letter-spacing:-2px;
    color:#000;
    display:block;
}
.info2 .info_box .name h3 {
    font-family: "Noto Sans KR", sans-serif;
    font-size:17px;
    font-weight:400;
    letter-spacing:-1px;
    margin-top:20px;
}

/* 설정 */
.info2 .gray {
    background:url(/app/dubu_sourcecode/docs/imgs/1450932683_info_img5.png) repeat-x bottom #fafafa;
    background-size:10px;
}

.info2 .mt20 {
    margin-top:20px;
}


/* tablet */
@media screen and (min-width:769px) and (max-width:991px){
    .info2 {
        margin:0px;
        border:0px;
    }
}

/* mobile */
@media screen and (max-width:768px){
    .info2 {
        margin:0px;
        border:0px;
    }

    .info2 h1 {
        padding:5px 7%;
    }
    
    .info2 h1 em {
    	display:block;
    }
    .info2 .info_box ul {
        float:none;
        margin-left:0px;
        margin-top:30px;
        padding:0 7%;
    }
    /* name */

    .info2 .info_box .name {
        float:none;
        width:100%;
    }

}