/* ------------------- sub page ------------------- */
/* sub-banner */
#sub-banner {margin-top:128px; line-height: 1.5; color: #fff; padding-top: 190px; height: 144px; overflow: hidden; }
#sub-banner1 {margin-top:128px; line-height: 1.5; color: #fff; padding-top: 190px; height: 144px; overflow: hidden; background: url(../img/designbaba/imgs/sub_bg1.jpg) no-repeat;}
#sub-banner2 {margin-top:128px; line-height: 1.5; color: #fff; padding-top: 190px; height: 144px; overflow: hidden; background: url(../img/designbaba/imgs/sub_bg2.jpg) no-repeat;}
#sub-banner3 {margin-top:128px; line-height: 1.5; color: #fff; padding-top: 190px; height: 144px; overflow: hidden; background: url(../img/designbaba/imgs/sub_bg3.jpg) no-repeat;}
#sub-banner4 {margin-top:128px; line-height: 1.5; color: #fff; padding-top: 190px; height: 144px; overflow: hidden; background: url(../img/designbaba/imgs/sub_bg3.jpg) no-repeat;}
#sub-banner5 {margin-top:128px; line-height: 1.5; color: #fff; padding-top: 190px; height: 144px; overflow: hidden; background: url(../img/designbaba/imgs/sub_bg6.jpg) no-repeat;}
#sub-banner6 {margin-top:128px; line-height: 1.5; color: #fff; padding-top: 190px; height: 144px; overflow: hidden; background: url(../img/designbaba/imgs/sub_bg7.jpg) no-repeat;}

#sub-banner h2 {font-size: 30px; text-align: center; margin-top:-130px;}
#sub-banner p {font-size: 15px; padding-top:10px; opacity: 0.9; text-align: center; text-shadow:1px -1px 1px #111;}
#sub-banner img {width: 100%; display: block;}
#sub-banner1 h2 {font-size: 30px; text-align: center; margin-top:-130px;}
#sub-banner1 p {font-size: 15px; padding-top:10px; opacity: 0.9; text-align: center;}
#sub-banner1 img {width: 100%; display: block;}
#sub-banner2 h2 {font-size: 30px; text-align: center; margin-top:-130px;}
#sub-banner2 p {font-size: 15px; padding-top:10px; opacity: 0.9; text-align: center;}
#sub-banner2 img {width: 100%; display: block;}
#sub-banner3 h2 {font-size: 30px; text-align: center; margin-top:-130px;}
#sub-banner3 p {font-size: 15px; padding-top:10px;  text-align: center;}
#sub-banner3 img {width: 100%; display: block;}
#sub-banner4 h2 {font-size: 30px; text-align: center; margin-top:-130px;}
#sub-banner4 p {font-size: 15px; padding-top:10px; opacity: 0.9; text-align: center;}
#sub-banner4 img {width: 100%; display: block;}
#sub-banner5 h2 {font-size: 30px; text-align: center; margin-top:-130px;}
#sub-banner5 p {font-size: 15px; padding-top:10px; opacity: 0.9; text-align: center;}
#sub-banner5 img {width: 100%; display: block;}
#sub-banner6 h2 {font-size: 30px; text-align: center; margin-top:-130px;}
#sub-banner6 p {font-size: 15px; padding-top:10px; opacity: 0.9; text-align: center;}
#sub-banner6 img {width: 100%; display: block;}

#sub-banner.ba-bg1 {background: url(../img/designbaba/imgs/sub_bg1.jpg) no-repeat; }
#sub-banner.ba-bg2 {background: url(../img/designbaba/imgs/sub_bg2.jpg) no-repeat; }
#sub-banner.ba-bg3 {background: url(../img/designbaba/imgs/sub_bg3.jpg) no-repeat; }
#sub-banner.ba-bg4 {background: url(../img/designbaba/imgs/sub_bg4.jpg) no-repeat; }
#sub-banner.ba-bg5 {background: url(../img/designbaba/imgs/sub_bg5.jpg) no-repeat; }
#sub-banner.ba-bg6 {background: url(../img/designbaba/imgs/sub_bg6.jpg) no-repeat; }
/* contents */
.contents { }
.contents h1 {font-size: 40px; line-height: 48px;}
.contents h2 {font-size: 30px; font-style: italic; font-weight: bold;}
.contents h3 {font-size: 26px; color: #333;}
.contents h4 {font-size: 22px; font-weight: bold; padding-top: 4px; padding-bottom: 20px;}
.contents h5 {font-size: 18px; font-weight: bold; color #222; margin-bottom: 15px;}
.contents h6 {font-size: 16px;}
.contents p {font-size: 14px; line-height: 22px;color: #555;}
/* sub-menu */
/* path */
.path {text-align: right; padding: 20px 0 30px; color: #767676; font-size: 15px; }
.path span {padding-left: 15px; background: url(../img/designbaba/imgs/path_arrow.png) no-repeat 5px 5px; font-size: 0.8rem; text-transform: uppercase;}
.path span:first-child {background: none;}
.path span i {font-size: 1rem;}
/* cont-title */
.sub-title {padding: 10px 0 10px 0; text-align: center;}
.sub-title .container {border-bottom: 1px solid #edecec; padding-bottom: 50px;}
.sub-title .ct-box {position: relative; height: 70px; width: 220px; margin: 0 auto; }
.sub-title .ct-box em {display: block; letter-spacing: 1px; font-size: 12px; color: #767676; text-transform: uppercase; line-height: 18px;}
.sub-title .ct-box h3 {font-size: 30px; line-height: 43px; font-weight: bold;}
.sub-title .ct-box h4 {font-size: 16px; line-height: 43px; padding-bottom: 10px; text-align: center; color: #767676;}
/* cont-title */
.sub-title2 {padding: 20px 0 40px 0; text-align: center;}
.sub-title2 .container {border-bottom: 0px solid #edecec;}
.sub-title2 .ct-box2 {position: relative; height: 70px; margin: 0 auto; }
.sub-title2 .ct-box2 em {display: block; letter-spacing: 1px; font-size: 12px; color: #767676; text-transform: uppercase; line-height: 18px;}
.sub-title2 .ct-box2 h3 {font-size: 30px; line-height: 43px; font-weight: bold;}
.sub-title2 .ct-box2 h4 {font-size: 16px; line-height: 43px; padding-bottom: 10px; text-align: center; color: #767676;}
/* sub-text-box */
.sub-text-box {border: 1px solid #e1e1e1; background: #f5f5f5; line-height: 26px; padding: 33px 0; text-align: center; font-size: 18px; color: #333; }
/* column-box */
.column-box {overflow: hidden;}
.column-box .column {float: left;}
.column-box .column-img-box { border:1px solid #ccc; width: 100%; height: auto;}
.column-box .column img {width: 100%; margin-bottom:-7px;}
.column-box .w10 {width: 10%;}
.column-box .w20 {width: 20%;}
.column-box .w30 {width: 30%;}
.column-box .w40 {width: 40%;}
.column-box .w50 {width: 50%;}
.column-box .w60 {width: 60%;}
.column-box .w70 {width: 70%;}
.column-box .w80 {width: 80%;}
.column-box .w90 {width: 90%;}
.column-box .w100 {width: 100%;}
/* column-box2 */
.column-box2 {overflow: hidden; position:relative; }
.column-box2 .column {float: left;}
.column-box2 .column img {width: 100%;}
.column-box2 .w10 {width: 10%;}
.column-box2 .w20 {width: 20%;}
.column-box2 .w30 {width: 30%;}
.column-box2 .w40 {width: 40%;}
.column-box2 .w50 {width: 50%;}
.column-box2 .w60 {width: 60%;}
.column-box2 .w70 {width: 70%;}
.column-box2 .w80 {width: 80%;}
.column-box2 .w90 {width: 90%;}
.column-box2 .w100 {width: 100%;}
.column-box2 h3 {position:absolute; left:0px; top:50px; font-size:30px; color:#333;}
.column-box2 .btnArea {box-sizing:border-box; overflow:hidden; float:left; padding-top:30px; }
.column-box2 .btnArea button {border-bottom:1px solid #d5d5d5; background:#fff; font-size:15px; color:#555; width:100%; height:60px; line-height:60px; text-align:left; padding-left:40px;}
.column-box2 .btnArea button:first-child {border-top:1px solid #d5d5d5;}
.column-box2 .btnArea button.on {background:#0168b7; color:#fff; font-family:'NanumBarunGothicBold', 'dotum', "µ¸¿ò", sans-serif; width:100%;}
.column-box2 .btnArea button.on span {display:inline-block; padding-left:20px; position:relative; left:-20px;}
.column-box2 .btnArear button.on span:before {position:absolute; width:10px; height:2px; background:#fff; content:""; top:26px; left:0;}
.column-box2 > div {float:right; height:400px; box-sizing:border-box; border:1px solid #e1e1e1; overflow-y:auto; line-height:24px;}
.contentdiv {padding: 30px;}
/* border */
.bomdash {border-bottom: 1px solid rgba(0,0,0,0.2); border-bottom-style: dashed;}
/* table */
.table-style1 {width: 100%; border-top: 2px solid #464e6b;}
.table-style1 tr { }
.table-style1 th {border-bottom: 1px solid #c6c6c6; background-color: #f8f8f8; color: #484848; padding: 8px 20px;text-align: center;}
.table-style1 td {border-bottom: 1px solid #c6c6c6; padding: 8px 20px; }
/* table2 */
.table-style2 {border-top: 2px solid #464e6b;}
.table-style2 tr { }
.table-style2 th {border-bottom: 1px solid #c6c6c6; background-color: #f8f8f8; color: #484848; padding: 8px 20px;text-align: center;}
.table-style2 td {border-bottom: 1px solid #c6c6c6; padding: 8px 20px; }
/* CEO ÀÎ»ç¸» */
.img-box {width:100%;}
.img-box img {width:100%; padding-bottom: 20px;}
.txt-box {width:100%; position: relative; padding-bottom: 50px;}
.txt-box h1 {color: #333; font-size: 30px; font-weight: bold; text-align: center; padding: 30px; /*font-family: 'Nanum Brush Script';*/}
.txt-box p {padding-bottom:30px; font-size: 14px; line-height: 22px;color: #555; text-align: center;}
.txt-box span.ceo_sign {position: absolute; right: 0; font-size: 18px; text-align: right; display:block;}
.img-box {
margin-left:auto;
margin-right:auto;
}
/* ¿À½Ã´Â ±æ */
.map ul {padding: 30px;margin-top: 20px;background: #F5F5F5;border: 1px solid #E5E5E5;}
.map ul li {padding: 10px; /*border-bottom: 1px solid rgba(225,225,225,0.5);*/}
.map ul li p {display: inline-block; font-size: 14px; line-height: 22px;color: #555;}
.map_img {height: 450px;}
.tit {font-size: 16px; font-weight: 600;padding-right: 30px;color: #000; width: 100px; display: inline-block;}
/* ¿¬Çõ */
.history {width: 100%; }
.history-list {display:inline-block; width:59%; vertical-align:top; padding-left:10px; }
.history-list li {padding: 5px 0 5px 40px; }
.his-tit {color:#1e1e1e; font-size:26px; font-weight:600; background: url('../img/designbaba/imgs/line_r2.gif') no-repeat 0 22px;}
.his-txt {font-size: 14px; line-height: 22px;color: #555; padding-bottom:50px;background: url('../img/designbaba/imgs/line_y.gif') repeat-y 6px 0;}
.history-img {padding-top: 20px; display:inline-block; width:40%; vertical-align: top; padding-left:10px;}
.history-img > .pic {padding-bottom: 15px; }
.history-img > .pic img { width: 100%;}
.history-img > .txt {padding-bottom: 20px; }
/*¼¶±â´ÂºÐµé*/
#group-box20 {padding-bottom:30px; }
.people-box {clear: both;
display: block;
padding: 10px;
margin: 0px 10px 10px 10px;
border: 1px dashed #bbb;}
.people-box .people-tit {padding-left: 10px;
text-align: left;
font-weight: 700;
color: #333;
font-size: 22px;} 
.mok-box {overflow: hidden; display: block; width: 100%;}
.mok-box .mok-wrap {overflow: hidden; float:left; width:50%; padding: 10px}
.mok-box .mok-wrap .mok-img {float:left; width:120px; }
.mok-box .mok-wrap .mok-img img {width: 93px; height: 103px;}
.mok-box .mok-wrap .mok-info {width:60%; float:left; text-align:left; }
.mok-box .mok-wrap .mok-name {font-size:19px; font-weight:700;}
.mok-box .mok-wrap .mok-txt {font-size:15px; }
.mok-box .mok-wrap .mok-info2 { float:left; text-align:left; }
.mok-box .mok-wrap .mok-email {float:left; width:100%; }
.mok-box .mok-wrap .mok-zone { float:left; }
/* ÆÄÆ®³Ê */
.partner {width:100%;}
.partner-intro {width:100%; padding:35px; background: url('../img/certificate_intro_bg.jpg') center no-repeat; background-size:cover; margin-bottom:40px;}
.partner-intro > h3 {color:#161e36; font-size:25px; line-height:30px;}
.partner-list {text-align:center; font-size:0;}
.partner-list li {width:20%; font-size:15px; line-height:20px; padding:0 5px 5px 5px; display:inline-block; vertical-align:top;}
.partner-list li a { }
.partner-list li a img {width:100%; border:1px solid #CCC;}
/* item */
.item { background-color: red; width: 100px; height: 100px; margin:300px;}
/* »ç¾÷¼Ò°³1 */
.business-story {width: 100%; overflow: hidden;  text-align: center;}
.business-story-box {float: left; width: 24%; margin: 0 auto; display: inline-block; margin-right: 1%; box-shadow: 3px 3px 15px rgba(0,0,0,0.05); vertical-align:top;} /*¹ÝÀÀÇüÈ¨ÆäÀÌÁö ¸¶Áø·ü % Àû¿ë*/
.business-story-box.last {margin-right: 0px; }
.business-story-box h5 {font-size: 16px; font-weight: bold; color: #222;}
.business-story-box .bs-img {position: relative; display: block; color: #fff; overflow:hidden; }
.business-story-box .bs-img:after {content: ''; width: 100%; height: 100%; display: block;
position: absolute; left: 0; top: 0; background-color: rgba(0,0,0,0.0); z-index: 90; transition: all 0.3s ease-in-out;}
.business-story-box .bs-img:hover::after {background-color: rgba(0,0,0,0.4);}
.business-story-box .bs-img img {width: 100%; display: block; transform: scale(1,1); transition:all 0.3s ease-in-out;}
.business-story-box .bs-img:hover img {transform: scale(1.3,1.3);}
.business-story-box .bs-img em {opacity: 0; position: absolute; left: 50%; top: 50%; 
transition: all 0.3s ease-in-out; transform: translate(-50%,-50%); z-index: 2; font-size: 0;}
.business-story-box .bs-img:hover em {opacity: 1; font-size: 16px;}
.business-story-box figcaption {font-size: 14px; line-height: 22px; padding: 20px 0;}
.business-story-box .bs-text {padding:25px;}
.business-story-box .bs-btn {position: relative;}
.business-story-box .bs-btn {width:100%; border: 1px solid #CCC; font-size: 11px; font-weight: 500; padding:10px 20px; margin: 0 auto;}
.business-story-box .bs-btn .s-btn:after {content: ''; width: 100%; height: 100%; display: block;
position: absolute; left: 0; top: 0; background-color: rgba(0,0,0,0.0); z-index: 90; transition: all 0.3s ease-in-out;}
.business-story-box .bs-btn .s-btn:hover::after {background-color: rgba(0,0,0,0.1);}
.business-story-box .bs-btn span:hover { }
/* ¼îÇÎ¸ô ÁÂÃø¸Þ´º¹Ù */
#ba-box {overflow: hidden; margin-bottom: 20px;}
#ba-box .left-box {float: left; width: 25%; }
#ba-box .left-box .left-sub-menu {text-align: center; max-width: 230px; }
#ba-box .left-box .left-sub-menu h3 {background: #333; width: 100%; height: 80px; line-height: 80px; margin-bottom: 1px; font-size: 1.125em; font-weight: 700; color: #fff; }
#ba-box .left-box .left-sub-menu a {
-webkit-transition: all 0.1s ease-out;
transition: all 0.1s ease-out;
display: block;
height: 50px;
line-height: 50px;
padding: 0 10px;
background-color: #fff;
border: 1px solid #ddd;
border-width: 0px 1px 1px 1px;
box-sizing: border-box;
font-size: 0.875em;
color: #333;
padding-top: 0px ! important;}
#ba-box .left-box .left-sub-menu ul li:hover a,
#ba-box .left-box .left-sub-menu #leftoff:hover a { background-color: #eee; color: #000;}
#ba-box .left-box .left-sub-menu .site { }
#ba-box .left-box .left-sub-menu .site .family { max-width:230px; margin-top: 15PX; display: block; border: 1px solid #ddd; border-width: 1px 1px 1px 1px; padding-left: 20px; background-color: #fff; font-size: 15px; color: #333; height:50px; line-height: 60px; /*background: url(../img/family-icon.png) no-repeat right center*/}
#ba-box .left-box .left-sub-menu .site select {font-size: 0.875em !important; }
#ba-box .left-box .left-sub-menu .site select option {height: 200px !important;}
#ba-box .left-box .left-sub-menu .sub-info {font-size: 1rem; padding: 20px 5px 5px 5px;}
#ba-box .left-box .left-sub-menu .sub-info i {font-size: 1.5rem; padding: 20px 5px 5px 5px;}
/* »óÇ°¸®½ºÆ® */
#ba-box .right-box {float: right; width: 75%;}
#ba-box .right-box .product-box {position: relative;}
#ba-box .right-box .product-box h3::before {content: ''; width: 30px; height: 2px; background-color: #EB6655; position: absolute; left: 0; top: 0;}
#product_list_sort {text-align: right; width: 100%; border-bottom: 1px solid #eee; height: 25px; margin-bottom: 10px; font-size: 0.875em; color: #222;}
#product_list {text-align: center; vertical-align: top; padding-bottom: 50px;}
#product_list a {font-size: 0.875em; color: #111; display: inline-block; padding: 5px;}
#product_list a img {max-width: 250px; height: auto; max-width: 250px;}
#product_list span {font-size: 0.875em; color: #333; font-weight: normal;}
/* ¿Â¶óÀÎ¹®ÀÇ */
#ba-box .right-box {float: right; width: 75%; }
#ba-box .right-box .form-box {position: relative;}
#ba-box .right-box .form-box h3::before {content: ''; width: 30px; height: 2px; background-color: #EB6655; position: absolute; left: 0; top: 0;}
#ba-box .right-box .form-box .np_form {width:100%; margin: 0 auto;}
#ba-box .right-box .form-box .np_form td.formmail_title_bgcolor {line-height: 25px ! important; width: 20%; min-width: 40px; background-color: #f7f7f7; border-top: 1px solid #fff; vertical-align: middle; font-size: 0.875em; color: #555;}
#ba-box .right-box .form-box .np_form td.formmail_cell_bgcolor {line-height: 25px !important; width: 80%; max-width: 40px; padding: 5px !important;}
#ba-box .right-box .form-box .np_form td.formmail_cell_bgcolor .formmail_textarea_style {width: 100%; min-width: 30px; border: 1px solid #ccc;}
#ba-box .right-box .form-box .np_form select {width: 100%; padding: 3px 5px; height: 36px; margin: 1px 0; border: 1px solid #ccc;}
#ba-box .right-box .form-box .np_form input[class=formmail_border] {width: 100%; border: 1px solid #ccc; background-color: transparent; height: 36px; padding: 3px 5px; margin: 1px 0;}
#ba-box .right-box .form-box .np_form input[name=phone_no1], .np_form input[name=phone_no2], .np_form input[name=phone_no3], .np_form input[name=mobile_no1], .np_form input[name=mobile_no2], .np_form input[name=mobile_no3] {max-width: 70px; width: 100%;}
/* ba-01 */
.ba-01 {}
.ba-01 ul {overflow: hidden; margin: 20px 0; text-align: center; }
.ba-01 ul li {overflow: hidden; float: left; background-color: #eee; border: 1px solid #fff; padding: 15px 10px 10px; width: 25%; height: 80px; line-height: 1.4; word-wrap: break-word;}
.ba-01 ul li:hover {background-color: #1b926c; color: #fff;}
.ba-01 .fontawesome {font-size: 1.5em;}
.ba-01 .fontawesome span.fontawesome-text {display: block; font-size: 0.8em;}
/*
.ba-01 ul li:nth-child(1n) {border-right: 0px solid #ccc;}
.ba-01 ul li:last-child {border-right: 1px solid #ccc;}
*/
/* sub-portfolio */
#sub-portfolio img{width: 100%; }
/* mediaquery: */
@media (max-width: 1280px) {
/*#sub-menu {display: none;}*/
/*#sub-banner {margin-top:80px; }*/
}
@media (max-width: 1024px) {
.column-box2 .column {float: none; width: 100%;}
}
@media (max-width: 960px) {
#sub-banner h2 {font-size: 1.3rem; padding: 0 20px; margin-bottom: 5px;}
#sub-banner p {font-size: 0.8rem; padding: 0 20px;}
#ba-box .left-box {/*width:100%;*/ display: none;}
#ba-box .left-box .left-sub-menu {text-align: center; max-width: 100%; }
#ba-box .left-box .left-sub-menu ul {display: line; width:100%;}
#ba-box .left-box .left-sub-menu a {height: 30px; line-height: 30px;}
#ba-box .left-box .left-sub-menu .site .family {display: none;}
#ba-box .right-box {width: 100%; margin-top: 20px;}
#ba-box .right-box .n_tit_page h3 {font-size: 1.2rem; font-weight: bold;}
.sub-title2 .ct-box2 {margin-bottom:-30px;} 
.sub-title2 .ct-box2 > h4 {display: none;}
.ba01 ul li {width: 50%; font-size: 12px; background-color: red;}
}
@media (max-width: 768px) {
.ba-01 ul li {width: 50%; font-size: 12px;}
.column-box .column {float: none; width: 100%;}
.column-box .column .table-style2 {border-top: 0;}
.column-box .column .pl00 {padding-left: 0 !important;}
.column-box .column .pl05 {padding-left: 0 !important;}
.column-box .column .pl10 {padding-left: 0 !important;}
.column-box .column .pl15 {padding-left: 0 !important;}
.column-box .column .pl20 {padding-left: 0 !important;}
.column-box .column .pl25 {padding-left: 0 !important;}
.column-box .column .pl30 {padding-left: 0 !important;}
.column-box .column .pl35 {padding-left: 0 !important;}
.column-box .column .pl40 {padding-left: 0 !important;}
.column-box .column .pl45 {padding-left: 0 !important;}
.column-box .column .pl50 {padding-left: 0 !important;}
.column-box .column .pl55 {padding-left: 0 !important;}
.column-box .column .pl60 {padding-left: 0 !important;}
.column-box .column .pr00 {padding-right: 0 !important;}
.column-box .column .pr05 {padding-right: 0 !important;}
.column-box .column .pr10 {padding-right: 0 !important;}
.column-box .column .pr15 {padding-right: 0 !important;}
.column-box .column .pr20 {padding-right: 0 !important;}
.column-box .column .pr25 {padding-right: 0 !important;}
.column-box .column .pr30 {padding-right: 0 !important;}
.column-box .column .pr35 {padding-right: 0 !important;}
.column-box .column .pr40 {padding-right: 0 !important;}
.column-box .column .pr45 {padding-right: 0 !important;}
.column-box .column .pr50 {padding-right: 0 !important;}
.column-box .column .pr55 {padding-right: 0 !important;}
.column-box .column .pr60 {padding-right: 0 !important;}
}
@media (max-width: 600px) {
.mok-box .mok-wrap {width:100%;}
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {