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


/*info*/


.info .info_tit {
    margin-top: 80px;
    margin-bottom: 20px;
}

.info .info_tit h4 {
    font-family:'Jeju Gothic';
    font-size:18px;
    font-weight:400;
    color:#383838;
    z-index:100;
    border-radius:30px;
    padding:10px 0;
}

.info .info_tit .topBn h4 span{
    color:#029b7d;
    vertical-align:middle;
}

.info .info_tit h4 em {
    font-family:'Jeju Gothic';
    font-weight:400;
    color:#f36523;
}

.info .info_tit h4 img{
    width:20px;
    vertical-align:middle;
    margin-right:10px;
}


.info h5 {
    font-family:'Jeju Gothic';
    font-size:16px;
    font-weight:400;
    color:#fff;
    display:inline-block;
    background:#ffc230;
    padding:6px 10px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
    position:relative;
    margin-top:20px;
    margin-bottom:-1px;
}

.info h5:after {
    display:inline-block;
    position:absolute;
    right:-15px;
    top:0;
    content:'';
    width:0px;
    height:0px;
    font-size:0;
    border-right:15px solid transparent; /*border의 성질을 이용해 오른쪽테두리만 투명으로 만든다. */
    border-bottom:29px solid #ffc230; /*border를 사용해 두께를 만든다.*/

}

.info p {
    font-family:'Nanum Gothic';
    font-size:15px;
    font-weight:700;
    letter-spacing:-1px;
    line-height:1.5;
    color:rgba(0,0,0,0.8);
    padding:20px 10px;
    background:#f6f6f6;
    border-top:1px solid #ffc230;
    margin-bottom:20px;
}


.info .list ul {
    padding:10px;
    background:#f6f6f6;
    border-top:1px solid #f5ad00;
}

.info .list li {
    font-size:15px;
    font-family:'Nanum Gothic';
    font-weight:700;
    letter-spacing:-1px;
    line-height:1.4;
    color:#595959;
    padding:7px 0px 7px 20px;
    background:url(/app/dubu_sourcecode/docs/imgs/1446792950_info_img31.png) no-repeat left 7px;
    background-size:20px 20px;

}
.info .list li span {
    font-size:13px;
    color:#979797;
}



/* topBn */

.info .topBn {
    background:url(/app/dubu_sourcecode/docs/imgs/1453185889_pro_3.jpg) no-repeat right #f36523	;
    background-size: 54%;
    padding: 7px 30px;
    margin: 20px 0 40px;
    width: 100%;
}

.info .topBn h4 {
    font-size:22px;
    font-family:'Nanum Gothic';
    font-weight:600;
    letter-spacing:-1px;
    line-height:1.2;
    color:#fff;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
    margin:10px 0;
}

.info .topBn ul {
    margin:10px 0;
}

.info .topBn li {
    font-size:15px;
    font-family:'Nanum Gothic';
    font-weight:500;
    letter-spacing:-1px;
    color:#fff;
    padding:10px;
    width:400px;
}

.info .topBn li span {
    font-size:10px;
    font-family:'Nanum Gothic';
    display:inline-block;
    text-align:center;
    vertical-align:middle;
    color:#fff;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
    width:15px;
    height:15px;
    margin-left:-20px;
    margin-right:5px;
    background:#d64400;
    padding:2px;

}


/* service*/

.info .service {
    width:47%;
    display:inline-block;
    margin:1%;
    overflow:hidden;
    border:1px solid #ddd;
    height:110px;
}

.info .service .left {
    width:32%;
    float:left;
    text-align:center;
    padding-top:5px;
}


.info .service span {
    font-family:'Jeju Gothic';
    font-size:16px;
    font-weight:400;
    color:#fff;
    display:block;
    background:#ffc230;
    padding:6px 10px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
    position:relative;
}

.info .service .right {
    width:68%;
    float:left;
    padding:10px;
    border-left:1px solid #ddd;
    height:177px;
}

.info .service li {
    font-family:'Jeju Gothic';
    font-size:13px;
    font-weight:400;
    letter-spacing:-1px;
    line-height:1.3;
    padding:5px 0 5px 20px;
}

.info .service li em {
    font-family:'Jeju Gothic';
    font-weight:400;
    margin-left:-20px;
    margin-right:5px;
}


/* icon_box */
.info .icon_box {
    width:19%;
    text-align:center;
    display:inline-block;
    vertical-align:middle;
}


.info .icon_box span {
    font-family:'Nanum Gothic';
    font-size:13px;
    font-weight:700;
    letter-spacing:-1px;
    display:block;
    padding:10px 0;
    position:relative;
}

.info .icon_box span:after {
    display:block;
    position:absolute;
    right:-12px;
    top:8px;
    content:'';
    width:20px;
    height:20px;
    background:url(/app/dubu_sourcecode/docs/imgs/1446792388_info_img30.png) no-repeat center;
    background-size:cover;
    opacity:0.7;

}

.info .icon_box:last-child span:after {
    display:none;
}
.info .info_box .txts {
    margin-top:40px;
}
.info .info_box .txt {
    font-family:'Nanum Gothic';
    font-size:13px;
    font-weight:200;
    letter-spacing:-1px;
    display:block;
    padding:10px 0 10px 0px;
    position:relative;
}
.info .info_box .txt em{
    font-size:14.5px;
    font-weight:700;
    color:#f36523;
    margin-right:5px;
}



/* box */
.info_box {
    margin-bottom:50px;
}









/*         미디어쿼리         */


/* tablet */
@media (max-width:1199px){
    .info .topBn {
        background: url(/app/dubu_sourcecode/docs/imgs/1453185889_pro_3.jpg) no-repeat 364px #f36523;
        background-size: 66%;
        padding: 7px 30px;
        margin: 20px 0 40px;
    }
}

/* mobile */
@media screen and (max-width:650px){
    .info .topBn {
        padding:20px;
        background: #f36523;
    }
    .info .topBn li {
        width:100%;
        padding: 10px 0px 3px 20px;
        line-height:1.5;
        text-align:justify;
    }
    .info .topBn li span {
        line-height:1.2;
    }
    .info .topBn h4 {
        font-size:18px;
        line-height:1.5;
    }

    .info h5 {
        width:100%;
        display:block;
        background:none;
        color:#e4a101;
        border-top:1px solid #f5ad00;

        text-shadow:none;
    }

    .info h5:after {
        width:0%;
        display:none;
    }

    .info .info_tit h4 {
        font-size:15px;
    }

    .info .service {
        width:100%;
        height:auto;
    }

    .info .service .left img {
        display:none;
    }

    .info .service .left {
        float:none;
        width:100%;
        padding-top:15px;
    }

    .info .service .right {
        float:none;
        width:100%;
        height:auto;
        border:0;
    }

    .info .icon_box {
        width:100%;
    }

    .info .icon_box img{
        width:100%;
        max-width:100px;
        display:block;
        margin:0 auto;
    }
}