@charset "utf-8";


@import url(common.css);
@import url(layout.css);
@import url(font.css);

/* 메인비주얼 */
.visual { background:url(../img/visual_1.jpg) left top no-repeat; height:953px;}
.logo { padding:35px 0 20px; text-align:center;}
/* 탑메뉴 */
.topmenu { clear:both; text-align:center; padding-top:10px;}
.topmenu ul li { display:inline; padding:0 15px; color:#fff; text-align:center;}
.topmenu ul li a { color:#fff; font-family:NanumGothic; font-size:12px;}

/* 메인카피 */
.main_copy { float:left; padding-top:130px; padding-left:20%;}
.main_copy .main_copy_ttl { color:#fff; font-size:14px; border-bottom:1px solid #fff; line-height:150%; display:inline-block;}
.main_copy .main_copy_txt { padding-top:20px; font-size:36px; color:#ffea00; font-family:NanumSquareR; font-weight:normal;line-height:110%;}
.main_copy .main_copy_txt span { font-size:36px; color:#ffea00; font-weight:600;}
.main_copy .main_copy_txt2 { padding-top:20px; font-size:17px; color:#fff; font-family:NanumSquareR; line-height:130%;}

.main_qucik_conts { float:right; padding-top:80px; padding-right:20%; }
.main_qucik_conts .main_qucik {  background:rgba(219,181,89, 0.85); padding:30px 70px; overflow:hidden;width:580px; box-sizing:border-box; border-radius:30px 0 30px 0;}
.main_qucik_conts .main_qucik > div { width:180px; height:180px; border-radius:100%; background:#fff; float:left; margin:10px 20px;}
.main_qucik_conts .main_qucik > a { width:180px; height:180px; border-radius:100%; background:#fff; float:left; margin:10px 20px;}
.main_qucik_conts .main_qucik > a > div > span { text-align:center; display:block; font-weight:600; padding-top:15px;}
.main_qucik_conts .main_qucik > div img { padding-top:50px;}
.main_qucik_conts .main_qucik .main_quick_A { padding:50px 0 5px 0; text-align:center;}
.main_qucik_conts .main_qucik .main_quick_B { text-align:center;}
.main_qucik_conts .main_qucik .main_quick_B img { padding:55px 0 5px 0;}
.main_qucik_conts .main_qucik .main_quick_C { padding:50px 0 5px 0; text-align:center;}
.main_qucik_conts .main_qucik .main_quick_D { padding:50px 0 5px 0; text-align:center;}

#section_B { clear:both; width:100%; height:416px; background:#f2f2f2 url(../img/kakao_bann.png) center no-repeat; }
#section_B .section_B_L { float:left; width:50%;}
#section_B .section_B_L p { text-align:center;}
#section_B .section_B_L .section_B_L_no { width:230px; height:230px; line-height:230px; border-radius:100%; background:#fff; text-align:center; margin:35px auto 10px;}
#section_B .section_B_L .section_B_L_no span { vertical-align:top;}
#section_B .section_B_L .section_B_L_no span:nth-child(1) { color:#537fba; font-size:66px; font-weight:600;}
#section_B .section_B_L .section_B_L_no span:nth-child(2) { vertical-align:top; padding:0 10px;}
#section_B .section_B_L .section_B_L_no span:nth-child(3) { font-size:40px; color:#333; padding:5px 0 20px 0;}

#section_B .section_B_R { float:left; width:50%;}
#section_B .section_B_R p { text-align:center;}
#section_B .section_B_R .section_B_R_no { width:230px; height:230px; line-height:230px; border-radius:100%; background:#fff; text-align:center; margin:35px auto 10px;}
#section_B .section_B_R .section_B_R_no span { vertical-align:top;}
#section_B .section_B_R .section_B_R_no span:nth-child(1) { color:#000; font-size:48px; font-weight:600;}
#section_B .section_B_R .section_B_R_no span:nth-child(2) { vertical-align:top; padding:0 10px;}
#section_B .section_B_R .section_B_R_no span:nth-child(3) { font-size:48px; color:#000; padding:0 0 20px 0;}

#section_B .section_B_main { font-size:17px; font-weight:600; color:#000; text-align:center; padding:10px 0 20px 0;}
#section_B p { line-height:140%; color:#7b7b7b; font-size:13px; font-family:NanumSquareR; max-width:350px; margin:0 auto;}


#section_C { clear:both; height:357px; background:url(../img/service_back.png) center no-repeat;}
#section_C .section_tech_ttl { float:left; width:460px; box-sizing:border-box; text-align:center; color:#fff; font-size:48px; padding-top:145px;}
#section_C .tech_bann { float:right; width:760px; padding-top:75px;}
#section_C .tech_bann li { float:left; width:156px; height:86px; padding:23px 0 0 0; box-sizing:border-box; border:1px solid #f0c357; color:#f0c357; margin:0 25px 30px 0; text-align:center;}
#section_C .tech_bann li span { text-align:center; display:block; color:rgba(255,255,255,0.5); padding-top:5px;}
#section_C .tech_bann li:nth-child(2n+2) { width:156px; height:86px; border:1px solid #39cac8; color:#39cac8;}



.portfolio { /*margin: 10px -16px;*/}
.portfolio,
.portfolio > .portf_column { padding:0;}
.portf_column { float:left; width:25%; height:310px; display: none; }
.portfolio:after { content: ""; display: table; clear: both;}
.content { /*background-color: white;*/ padding:0 1px 5px; text-align:center;}
.content img { width:100%; height:305px;}
.show { display : block;}
.btn { border: none; outline: none; padding: 12px 0; background-color: white; cursor: pointer; color:#7f7f7f;}
.btn:after { content:'/'; display:inline-block; padding:0 10px; color:#ddd; }
.btn:hover { /*background-color: #ddd;*/ color:#6b6b6b;}
.btn.active { /*background-color: #666;*/ color:#0f61ad; font-weight:600;}

.portfolio_ttl { text-align:center; padding:50px 0 20px 0;}

/* 메인 하단 컨텐츠 보드 */
.board_conts { clear:both;}
.board_conts .board_A { width:25%; height:200px; float:left; border-right:1px solid #e9e9e9; box-sizing:border-box; padding:5px 20px 0 0;}
.board_conts .board_B { width:25%; height:200px; float:left; border-right:1px solid #e9e9e9; box-sizing:border-box; padding:5px 20px 0 20px;}
.board_conts .board_C { width:25%; height:200px; float:left; border-right:0px solid #e9e9e9; box-sizing:border-box; padding:5px 20px 0 20px;}
.board_conts .board_D { width:25%; float:left;}
.board_conts .board_D img { text-align:right;}
.board_conts .board_A ul,
.board_conts .board_B ul,
.board_conts .board_C ul { padding-top:15px;}
.board_conts .board_A ul li,
.board_conts .board_B ul li,
.board_conts .board_C ul li { color:#7d7d7d; border-bottom:1px solid #e9e9e9; height:28px; line-height:28px;}


/* 포스터 */
.poster-port {clear: both;}
.poster-port .poster-title {text-align: center;font-size: 36px;padding: 20px;}
.poster-conts {clear: both;margin-bottom: 50px;}
.poster-conts span {display: inline-block;padding: 30px;}