/* twitter bootstrap float clearfix */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.font_nanum { font-family: "Nanum Gothic", sans-serif; }
.font_nanum_bold { font-family: 'Nanum Gothic Bold', sans-serif; }
.font_nanum_extrabold { font-family: 'Nanum Gothic ExtraBold', sans-serif; }
.font-size-12 { font-size: 12px; }
.font-size-13 { font-size: 13px; }
.font-size-14 { font-size: 14px; }
.font-size-15 { font-size: 15px; }


.start_x {
    background: url('../images/sub/bx/img_sub01_02/web_x.jpg') no-repeat center 93px;
    height: 187px;
}
.header {
    text-align: center;
    margin-bottom: 90px;
}
.header p.text01 {
    font-size: 26px;
}
.header p.text02 {
    font-family: "Myriad Pro", sans-serif;
    font-weight: bold;
    font-size: 16px;
    padding-top: 34px;
    margin-bottom: 60px;
}

.header p.text03 {
    font-size: 13px;
    color: #666;
    margin-bottom: 84px;
    font-family: "yg740", NanumGothic, '나눔고딕', Malgun Gothic, '맑은 고딕', dotum, sans-serif;
    word-break: keep-all;
    letter-spacing:-1px;
}

.portfolio {
    padding-bottom: 180px;
}
.portfolio .img01 {
    height: 409px;
}
/* 여기부터 1번 */
/* 2016 */
.portfolio .img01.bg_2016img01 {
	background-color:#191813;}
.portfolio .img01.bg_2016img02 {
	background-color:#160633;}
.portfolio .img01.bg_2016img03 {
	background-color:#000;}
.portfolio .img01.bg_2016img04 {
	background-color:#916331;}
.portfolio .img01.bg_2016img05 {
	background-color:#000;}
.portfolio .img01.bg_2016img06 {
	background-color:#d3e5f3;}
.portfolio .img01.bg_2016img07 {
	background-color:#62cbd1;}	
.portfolio .img01.bg_2016img10 {
		background-color:#cee9fc;}
.portfolio .img01.bg_2016img12 {	
    background: url('../images/sub/bx/img_sub01_02/2016bx12_bg.jpg') repeat-x top center;}
	
/* 2015 */
.portfolio .img01.bg_img01 {
	background-color:#282725;}
	
.portfolio .img01.bg_img02 {
    background: url('../images/sub/bx/img_sub01_02/bx2_bg.jpg') repeat-x top center;
}

.portfolio .img01.bg_img03 {
	background-color:#fbf700;}
	
.portfolio .img01.bg_img04 {
    background: url('../images/sub/bx/img_sub01_02/bx4_bg.jpg') repeat-x top center;
}

	
.portfolio .img01.bg_img05 {
	background-color:#09090b;}
	
.portfolio .img01.bg_img06 {
	background-color:#F5F5F5;}

.portfolio .img01.bg_img07 {
	background-color:#504e4f;}
	
	
.portfolio .img01.bg_img08 {
	background-color:#BAE6DD;}

.portfolio .img01.bg_img09 {
	background-color:#000000;}

.portfolio .img01.bg_img10 {
	background-color:#ffe376;}
	
.portfolio .img01.bg_img11 {
    background: url('../images/sub/bx/img_sub01_02/bx11_bg.jpg') repeat-x top center;
}

.portfolio .img01.bg_img12 {
	background-color:#e5edef;}

.portfolio .img01.bg_img13 {
	background-color:#f6f6f6;}
	
.portfolio .img01.bg_img14 {
    background: url('../images/sub/bx/img_sub01_02/bx14_bg.jpg'); background-size:100% 409px; background-repeat:no-repeat;
}


.portfolio .img01.bg_img15 {
	background-color:#144281;}
	
.portfolio .img01.bg_img16 {
    background: url('../images/sub/bx/img_sub01_02/bx16_bg.jpg') repeat-x top center;
}
	
.portfolio .img01.bg_img17 {
	background-color:#6f5558;}
	
.portfolio .img01.bg_img18 {
	background-color:#dcf2fa;}
	
.portfolio .img01.bg_img19 {
    background: url('../images/sub/bx/img_sub01_02/bx19_bg.jpg') repeat-x top center;
}

.portfolio .img01.bg_img20 {
    background: url('../images/sub/bx/img_sub01_02/bx20_bg.jpg') repeat-x top center;
}

.portfolio .img01.bg_img21 {
	background-color:#eeebea;}
	
.portfolio .img01.bg_img22 {
	background-color:#b1e3ee;}
	
.portfolio .img01.bg_img23 {
	background-color:#e9e9e6;}
	
.portfolio .img01.bg_img24 {
    background: url('../images/sub/bx/img_sub01_02/bx24_bg.jpg') repeat-x top center;
}

.portfolio .img01.bg_img25 {
    background: url('../images/sub/bx/img_sub01_02/bx25_bg.jpg') repeat-x top center;
}

.portfolio .img01.bg_img26 {
	background-color:#b8022b;}

	
.portfolio .img01.bg_img27 {
    background: url('../images/sub/bx/img_sub01_02/bx27_bg.jpg') repeat-x top center;
}
	
.portfolio .img01.bg_img28 {
	background-color:#000;}
	
.portfolio .img01.bg_img29 {
	background-color:#010a0a;}

.portfolio .img01.bg_img30 {
	background-color:#e2c79f;}

.portfolio .img01.bg_img31 {
	background-color:#f5f5f5;}

.portfolio .img01.bg_img32 {
	background-color:#f4f4f4;}
	
.portfolio .img01.bg_img33 {
	background-color:#000;}
	
.portfolio .img01.bg_img34 {
	background-color:#c6d99b;}

.portfolio .img01.bg_img35 {
	background-color:#000;}
	
.portfolio .img01.bg_img36 {
	background-color:#707190;}	
	
.portfolio .img01.bg_img37 {
	background-color:#fcd846;}
	
.portfolio .img01.bg_img38 {
	background-color:#272221;}

.portfolio .img01.bg_img39 {
	background-color:#365112;}
	
.portfolio .img01.bg_img40 {
	background-color:#97d7ba;}	


.portfolio .img01 > div {
    width: 1198px;
    margin: 0 auto;
}
.portfolio .portfolio_cont {
    width: 1198px;
    margin: 0 auto;
    position: relative;
}
.portfolio .portfolio_cont ul.intro {
    color: #7f7e7e;
}
.portfolio .portfolio_cont ul.intro1 {
    padding-top: 33px;
}
.portfolio .portfolio_cont ul.intro2 {
    padding-top: 10px;
}
.portfolio .portfolio_cont ul.intro3 {
    padding: 34px 0 0 0;
    clear: both;
    overflow: hidden;
}
.portfolio .portfolio_cont ul.intro4 {
    padding: 35px 0 0 0;
}
.portfolio .portfolio_cont .intro1 li {
    float: left;
    overflow: hidden;
}
.portfolio .portfolio_cont .intro2 li {
    float: left;
    overflow: hidden;
}
.portfolio .portfolio_cont .intro3 li {
    float: none;
    clear: both;
}
.portfolio .portfolio_cont .intro4 li {
    float: none;
}
.portfolio .portfolio_cont .intro li > div {
    float: left;
    line-height: 14px;
}
.portfolio .portfolio_cont .intro .brand .text01 {
    width: 94px;
}
.portfolio .portfolio_cont .intro .brand .text02 {
    width: 134px;
    padding-right: 10px;
}
.portfolio .portfolio_cont .intro .type .text01 {
    width: 94px;
}
.portfolio .portfolio_cont .intro .type .text02 {
    width: 206px;
    padding-right: 10px;
}
.portfolio .portfolio_cont .intro .layout .text01 {
    width: 98px;
}
.portfolio .intro .layout .text02 {
    width: 248px;
    padding-right: 10px;
}
.portfolio .portfolio_cont .intro .theory .text01 {
    width: 94px;
}
.portfolio .portfolio_cont .intro .theory .text02 {
    width: 200px;
    text-align: right;
}
.portfolio .portfolio_cont .intro .program .text01 {
    width: 94px;
    padding-left: 238px;
}
.portfolio .portfolio_cont .intro .program .text02 {
    width: 206px;
    padding-right: 10px;
}
.portfolio .portfolio_cont .intro .typography .text01 {
    width: 98px;
}
.portfolio .portfolio_cont .intro .typography .text02 {
    width: 248px;
    padding-right: 10px;
}
.portfolio .portfolio_cont .intro .visual2 .text01 {
    width: 94px;
}
.portfolio .portfolio_cont .intro .visual2 .text02 {
    width: 200px;
    text-align: right;
}
.portfolio .portfolio_cont .intro .standard .text01 {
    width: 94px;
    padding-left: 903px;
}
.portfolio .portfolio_cont .intro .standard .text02 {
    width: 200px;
    text-align: right;
    padding-bottom: 13px;
}
.portfolio .portfolio_cont .intro .time .text01 {
    width: 68px;
    color: #4b4747;
    font-size: 13px;
    padding-left: 903px;
}
.portfolio .portfolio_cont .intro .time .text02 {
    width: 226px;
    text-align: right;
    color: #4b4747;
    font-size: 13px;
}
.portfolio .portfolio_cont .intro .color .text01 {
    width: 122px;
    color: black;
    font-size: 15px;
    padding-left: 912px;
}
.portfolio .portfolio_cont .intro .color .color_val {
    width: 164px;
    padding-top: 4px;
}
.portfolio .portfolio_cont .intro .color .color_val div {
    float: left;
    width: 41px;
    height: 11px;
}
.portfolio .portfolio_cont .intro .class1 {
    padding-top: 24px;
    color: #4b4747;
    font-size: 14px;
}
.portfolio .portfolio_cont .intro .class1 .text01 {
    width: 50px;
    padding-left: 912px;
}
.portfolio .portfolio_cont .intro .class1 .text02 {
    width: 147px;
}
.portfolio .portfolio_cont .intro .class1 .text03 {
    width: 36px;
}
.portfolio .portfolio_cont .intro .class1 .text04 {
    width: 53px;
}
.portfolio .btn_group {
    position: absolute;
    top: 131px;
    left: 6px;
}
.portfolio .btn_group > div {
    float: left;
    margin-right: 19px;
}