/******************************************* 폰트 ********************************************/ @font-face { font-family:nanumbarunpenr; src: url(../font/nanumbarunpen/nanumbarunpenr.eot); src: local("nanumbarunpen r"), url(../font/nanumbarunpen/nanumbarunpenr.woff) format("woff"); } @font-face { font-family:nanumbarunpenb; src: url(../font/nanumbarunpenb.eot); src: local("nanumbarunpen b"), url(../font/nanumbarunpen/nanumbarunpenb.woff) format("woff"); } /******************************************* YELLOW-FINGER ********************************************/ /******************************************* 공통요소 ********************************************/ * { margin: 0px; padding: 0px; -webkit-overflow-scrolling : touch; outline: 0 none !important; font-family: 'nanumbarunpenr', 'nanumbarunpen r', sans-serif; } html, body { display: inline; height: 100%; margin: 0px; padding: 0px; font-size: 14px; } h1,h2,h3,h4,h5 { font-weight: normal; } a { text-decoration: none; } li, ul, ol { list-style: none; } /* float */ .left { float: left; } .right { float: right; } .clear { clear: both; } /* text-align */ .text_left { text-align: left; } .text_right { text-align: right; } .text_center { text-align: center; } /* display */ .display_inline_block { display: inline-block; } .display_none { display: none; } .display_block { display: block; } .display_table { display: table; } .display_table_cell { display: table-cell; } /* position */ .position_relative { position: relative; } .position_absolute { position: absolute; } .position_fixed { position: fixed; } .slow { transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; } .bold { font-weight: bold; font-weight: 800; } .en { font-family: 'Open Sans', sans-serif; } /******************************************* YELLOW-FINGER ********************************************/ #header { top:0px; left: 0px; width: 100%; height: 102px; text-align: center; z-index: 98; background-color: #fff; box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.05); } #header_box { width: 990px; height: 102px; line-height: 102px; } #header .header_logo_box { top: 0px; left: 0px; width: 100px; height: 100%; padding-left: 15px; box-sizing: border-box; z-index: 1; } #header .header_logo_box a { width: auto; height: 100%; } #header .header_logo_box a img { width: 85px; vertical-align: middle; } #header .header_nav_box { width: 100%; height: 100%; padding-left: 115px; box-sizing: border-box; } #header .header_nav_box .header_nav_top { width: 100%; height: 52px; line-height: 52px; padding-right: 15px; box-sizing: border-box;} #header .header_nav_box .header_nav_top div { width: auto; height: 100%; } #header .header_nav_box .header_nav_top div a { width: 25px; height: 25px; vertical-align: bottom; background-color: #333; } #header .header_nav_box .header_nav_top div a.sns_01 { background: url(../images/facebook.svg) no-repeat center center; } #header .header_nav_box .header_nav_top div a.sns_02 { background: url(../images/instagram.svg) no-repeat center center; } #header .header_nav_box .header_nav_top div a.sns_03 { width: 35px; background: url(../images/naverblog.svg) no-repeat center center; background-size: 75%; } #header .header_nav_box .header_nav_top div a:hover.sns_01 { background: url(../images/c_facebook_over.svg) no-repeat center center; } #header .header_nav_box .header_nav_top div a:hover.sns_02 { background: url(../images/c_instagram_over.svg) no-repeat center center; } #header .header_nav_box .header_nav_top div a:hover.sns_03 { background: url(../images/c_naverblog_over.svg) no-repeat center center; background-size: 75%; } #header .header_nav_box .header_nav_bottom { width: 100%; height: 50px; line-height: 50px; } #header .header_nav_box .header_nav_bottom a { width: auto; padding: 0px 15px; font-size: 14px; color: #333333; } #header .header_nav_box .header_nav_bottom a:hover { background-color: #e29068; color: #fff; } #footer { width: 100%; height: auto; background-color: #32384e; } #footer_box { width: 100%; } #footer .footer_top { width: 100%; padding: 45px 0px; text-align: center; } #footer .footer_top > div { width: 990px; height: auto; margin: 0 auto; padding: 0px 15px; box-sizing: border-box; } #footer .footer_top .footer_logo { width: 100%; height: auto; text-align: center; } #footer .footer_top .footer_info { width: 100%; height: auto; line-height: 22px; font-size: 12px; color: #dac8b4; font-family: "dotum"; padding-top: 30px; } #footer .footer_top .footer_info span { color: #f78b56; font-family: "dotum"; } #footer .footer_top .footer_sns { width: 100%; height: auto; padding-top: 30px; text-align: center; } #footer .footer_top .footer_sns a { width: 35px; height: 35px; background-color: #dac8b4; border-radius: 100%; margin: 0px 8px; } #footer .footer_top .footer_sns a.footer_sns_01 { background: url(../images/c_facebook.svg) #dac8b4 no-repeat center center; } #footer .footer_top .footer_sns a.footer_sns_02 { background: url(../images/c_instagram.svg) #dac8b4 no-repeat center center;} #footer .footer_top .footer_sns a.footer_sns_03 { background: url(../images/c_naverblog.svg) #dac8b4 no-repeat center center; background-size: 80%; } #footer .footer_top .footer_sns a:hover.footer_sns_01 { background: url(../images/c_facebook.svg) #e29068 no-repeat center center; } #footer .footer_top .footer_sns a:hover.footer_sns_02 { background: url(../images/c_instagram.svg) #e29068 no-repeat center center;} #footer .footer_top .footer_sns a:hover.footer_sns_03 { background: url(../images/c_naverblog.svg) #e29068 no-repeat center center; background-size: 80%; } #footer .footer_bottom { width: 100%; height: 52px; line-height: 52px; border-top: 1px solid #24293b; text-align: center; box-sizing: border-box; } #footer .footer_bottom > div { width: 990px; height: 51px; text-align: center; color: #dac8b4; font-size: 12px; font-family: "dotum"; padding: 0px 15px; box-sizing: border-box; } #header .header_m_nav { display: none; top: 30px; right: 15px; width: 20px; height: 20px; cursor: pointer; } #header .header_m_nav > div { width: 100%; height: 2px; background-color: #222; } #header .header_m_nav > div.header_m_nav_01 { top: 0px; left: 0px; -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } #header .header_m_nav > div.header_m_nav_02 { top: 6px; left: 0px; -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } #header .header_m_nav > div.header_m_nav_03 { top: 12px; left: 0px; -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } #header .header_m_nav > div.header_m_nav_01.rotate { top: 8px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } #header .header_m_nav > div.header_m_nav_02.rotate { opacity: 0; } #header .header_m_nav > div.header_m_nav_03.rotate { bottom: 10px; top: auto; -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } #header .header_m_nav > div:first-child { margin-top: 0px; } #headerMobileNavBgFull { display: none; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #000; opacity: 0.5; z-index: 97; } #headerMobileNavBg { display: none; top: 72px; right: 0px; width: 250px; height: 100%; background-color: #fff; z-index: 98; } #headerMobileNav > ul > li > div { width: 100%; height: 45px; line-height: 45px; box-sizing: border-box; padding: 0px 15px; } #headerMobileNav > ul > li > div a { width: 25px; height: 25px; vertical-align: bottom; background-color: #333; } #headerMobileNav > ul > li > div a.sns_01 { background: url(../images/facebook.svg) no-repeat center center; } #headerMobileNav > ul > li > div a.sns_02 { background: url(../images/instagram.svg) no-repeat center center; } #headerMobileNav > ul > li > div a.sns_03 { width: 35px; background: url(../images/naverblog.svg) no-repeat center center; background-size: 75%; } #headerMobileNav { display: none; top: 72px; right: 0px; width: 250px; height: auto; z-index: 99; } #headerMobileNav > ul { width: 100%; } #headerMobileNav > ul > li { width: 100%; } #headerMobileNav > ul > li > a { width: 100%; height: 45px; line-height: 45px; box-sizing: border-box; padding: 0px 15px; border-bottom: 1px solid #dcdcdc; font-size: 14px; color: #000000; font-weight: normal; background-size: 15px; background-color: #fff; } #headerMobileNav > ul > li:first-child > a { border-top: 1px solid #dcdcdc; } #headerMobileNav > ul > li > a:hover { color: #fff; background-size: 15px; background-color: #e29068; } #headerMobileNav > ul > li > ul { display: none; width: 100%; } #headerMobileNav > ul > li > ul > li { width: 100%; } #headerMobileNav > ul > li > ul > li > a { width: 100%; height: 45px; line-height: 45px; box-sizing: border-box; padding: 0px 30px; border-bottom: 1px solid #dcdcdc; font-size: 14px; color: #000000; font-weight: normal; background: url(../images/m_nav_dot.png) no-repeat 15px center; background-color: #fafafa; } #headerMobileNav > ul > li > ul > li > a:hover { color: #fff; background-color: #222; } #wrap { width: 100%; height: auto; text-align: center; padding-top: 102px; } #slider_box { width: 100%; height: 648px; background-color: #333; } #slider_box .slider_img { width: 100%; height: 100%; } #slider_box * { height: 100%; } #slider_box .slick-prev, #slider_box .slick-next { width: 22px; height: 40px; z-index: 1; } #slider_box .slick-prev { background: url(../images/left.svg) no-repeat left center; } #slider_box .slick-next { background: url(../images/right.svg) no-repeat right center; } #slider_box { margin-bottom: 0px; } #slider_box .slick-dots { height: 10px; bottom: 25px; } #slider_box .slick-dots li { width: 10px; height: 10px; background-color: #24293a; border-radius: 100%; opacity: 0.5; } #slider_box .slick-dots li.slick-active { opacity: 1; } #slider_box .slick-dots li:hover { opacity: 1; } #slider_box .slick-dots li button { display: none; } #quick_box { width: 100%; height: auto; padding: 45px 0px; background-color: #b19a86; } #quick_box > div { width: 990px; height: auto; margin: 0 auto; padding: 0px 15px; box-sizing: border-box; } #quick_box a { width: 20%; text-align: center; } #quick_box a .quick_icon { width: 100%; height: 90px; text-align: center; } #quick_box a .quick_icon > div { width: 90px; height: 90px; border-radius: 100%; background-color: #24293a; } #quick_box a.quick_01 .quick_icon > div { background: url(../images/documents.svg) #24293a no-repeat center center; } #quick_box a:hover.quick_01 .quick_icon > div { background: url(../images/w_documents.svg) #fff no-repeat center center; } #quick_box a.quick_02 .quick_icon > div { background: url(../images/todo.svg) #24293a no-repeat center center; } #quick_box a:hover.quick_02 .quick_icon > div { background: url(../images/w_todo.svg) #fff no-repeat center center; } #quick_box a.quick_03 .quick_icon > div { background: url(../images/advertising.svg) #24293a no-repeat center center; } #quick_box a:hover.quick_03 .quick_icon > div { background: url(../images/w_advertising.svg) #fff no-repeat center center; } #quick_box a.quick_04 .quick_icon > div { background: url(../images/newpost.svg) #24293a no-repeat center center; } #quick_box a:hover.quick_04 .quick_icon > div { background: url(../images/w_newpost.svg) #fff no-repeat center center; } #quick_box a.quick_05 .quick_icon > div { background: url(../images/businesscontact.svg) #24293a no-repeat center center; } #quick_box a:hover.quick_05 .quick_icon > div { background: url(../images/w_businesscontact.svg) #fff no-repeat center center; } #quick_box a .quick_txt { width: 100%; height: 28px; line-height: 28px; font-size: 18px; color: #24293a; margin-top: 15px; } #quick_box a:hover .quick_txt { color: #fff; } #portfolio_box { width: 100%; height: auto; padding: 60px 0px; } #portfolio_box > div { width: 990px; height: auto; margin: 0 auto; padding: 0px 15px; box-sizing: border-box; } #portfolio_box .portfolio_title { width: 100%; height: 40px; line-height: 30px; font-size: 40px; text-align: center; color: #24293a; } #portfolio_box .portfolio_title > div > div { padding: 0px 5px; } #portfolio_box .portfolio_title .btn_prev { top: 0px; left: 0px; width: 35px; height: 35px; border: 1px solid #dcdcdc; box-sizing: border-box; background: url(../images/prev.svg) no-repeat center center; } #portfolio_box .portfolio_title .btn_prev:hover { background: url(../images/w_prev.svg) no-repeat center center; background-color: #dcdcdc; } #portfolio_box .portfolio_title .btn_next { top: 0px; right: 0px; width: 35px; height: 35px; border: 1px solid #dcdcdc; box-sizing: border-box; background: url(../images/next.svg) no-repeat center center; } #portfolio_box .portfolio_title .btn_next:hover { background: url(../images/w_next.svg) no-repeat center center; background-color: #dcdcdc; } #portfolio_box .portfolio_title img { vertical-align: -5px; } #portfolio_box .portfolio_slider { width: 100%; height: auto; padding-top: 45px; } #portfolio_slider { width: 100%; height: auto; } #portfolio_slider .opacity { top: 0px; left: 0px; width: 100%; height: 409px; line-height: 409px; z-index: 9999; cursor: pointer; } #portfolio_slider .opacity .bg { top: 0px; left: 0px; width: 100%; height: 409px; line-height: 409px; background-color: #fff; opacity: 0; z-index: 1; } #portfolio_slider .opacity .txt { top: 0px; left: 0px; width: 100%; height: 409px; line-height: 409px; opacity: 1; z-index: 2; opacity: 0; background: url(../images/BTN.svg) no-repeat center center;font-size: 18px; } #portfolio_slider .portfolio_slider_list:hover .opacity .bg { opacity: 0.9; } #portfolio_slider .portfolio_slider_list:hover .opacity .txt { opacity: 1; } #portfolio_slider .portfolio_slider_list { width: 33.3333%; border: 1px solid #ddd; border-left: 0px; border-top: 0px; box-sizing: border-box; } #portfolio_slider .portfolio_slider_list:nth-child(1) { border-top: 1px solid #ddd; border-left: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(2) { border-top: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(3) { border-top: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(4) { border-left: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(5) { } #portfolio_slider .portfolio_slider_list:nth-child(6) { } #portfolio_slider .portfolio_slider_list .portfolio_img { width: 100%; height: 256px; background-color: #333; } #portfolio_slider .portfolio_slider_list .portfolio_info { width: 100%; height: 153px; box-sizing: border-box; padding: 25px 20px; text-align: left; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_date { width: 100%; height: 25px; line-height: 25px; font-size: 14px; color: #72777b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_group { width: 100%; height: 26px; line-height: 26px; font-size: 16px; color: #24293a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_title { width: 100%; height: 52px; line-height: 26px; font-size: 16px; color: #24293a; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #company_box { width: 100%; height: auto; padding: 60px 0px 75px; background-color: #f2f2f0; } #company_box > div { width: 990px; height: auto; margin: 0 auto; padding: 0px 15px; box-sizing: border-box; } #company_box .company_title { width: 100%; height: 40px; line-height: 30px; font-size: 40px; text-align: center; color: #24293a; } #company_box .company_title > div > div { padding: 0px 5px; } #company_box .company_title img { vertical-align: -5px; } #company_box .company_tab { width: 100%; height: auto; padding-top: 45px; text-align: center; } #company_box .company_tab > div { width: 100%; height: 100%; border-top: 1px solid #dcdcdc; box-sizing: border-box; } #company_box .company_tab > div > div { width: 100px; margin: 0px 20px; } #company_box .company_tab > div > div > div { width: auto; height: 56px; line-height: 56px; font-size: 14px; color: #3c404b; cursor: pointer; } #company_box .company_tab > div > div > div > span { opacity: 0; top: -2px; left: 0px; width: 100%; height: 4px; background-color: #e29068; border-radius: 4px; } #company_box .company_tab > div > div > div.active { color: #e29068; } #company_box .company_tab > div > div > div.active > span { opacity: 1; } #company_box .company_tab_01 { width: 100%; height: auto; padding-top: 60px; text-align: center; } #company_box .company_tab_01 div { width: 100%; } #company_box .company_tab_01 img { max-width: 100%; margin: 0 auto; } #company_box .company_tab_01 img.company_web { display: block; } #company_box .company_tab_01 img.company_mobile { display: none; } #boad_box { width: 100%; height: auto; padding: 60px 0px; } #boad_box > div { width: 990px; height: auto; margin: 0 auto; padding: 0px 15px; box-sizing: border-box; } #boad_box .company_title { width: 100%; height: 40px; line-height: 30px; font-size: 40px; text-align: center; color: #24293a; } #boad_box .company_title > div > div { padding: 0px 5px; } #boad_box .company_title img { vertical-align: -5px; } #boad_box .boad_tbl { width: 100%; height: auto; padding-top: 45px; text-align: center; } #boad_box .boad_tbl div.list_box { width: 100%; border-top: 3px solid #e29068; } #boad_box .boad_tbl div.list_box .list{ width: 100%; height: auto; padding: 30px 0px; border-bottom: 1px solid #dcdcdc; cursor: pointer; } #boad_box .boad_tbl div.list_box .list .list_num { top: 30px; left: 0px; width: 141px; height: 56px; box-sizing: border-box; border-right: 1px solid #dcdcdc; text-align: center; z-index: 1; } #boad_box .boad_tbl div.list_box .list .list_num .idx { width: 100%; height: 40px; line-height: 40px; font-size: 40px; color: #666666; } #boad_box .boad_tbl div.list_box .list .list_num .date { width: 100%; height: 12px; line-height: 12px; font-size: 12px; color: #666666; margin-top: 4px; } #boad_box .boad_tbl div.list_box .list .list_title { width: 100%; height: 56px; line-height: 28px; padding-left: 188px; padding-right: 120px; box-sizing: border-box; text-align: left; } #boad_box .boad_tbl div.list_box .list .list_title .title { width: 100%; height: 18px; line-height: 18px; font-size: 18px; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #boad_box .boad_tbl div.list_box .list .list_title .desc { width: 100%; height: 14px; line-height: 14px; font-size: 14px; color: #666; margin-top: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #boad_box .boad_tbl div.list_box .list .list_more { top: 30px; right: 0px; width: 120px; height: 56px; line-height: 56px; } #boad_box .boad_tbl div.list_box .list .list_more .btn { width: 40px; height: 40px; vertical-align: middle; box-sizing: border-box; border: 1px solid #dcdcdc; cursor: pointer; background: url(../images/more_btn.svg) no-repeat center center; } #boad_box .boad_tbl div.list_box .list.active .list_num .idx { color: #d06d3c; } #boad_box .boad_tbl div.list_box .list.active .list_num .date { color: #d06d3c; } #boad_box .boad_tbl div.list_box .list.active .list_title .title { color: #d06d3c; } #boad_box .boad_tbl div.list_box .list.active .list_title .desc { color: #d06d3c; } #boad_box .boad_tbl div.list_box .list.active .list_more .btn{ background: url(../images/more_btn_hover.svg) no-repeat center center; } #boad_box .boad_tbl div.list_box .more_box { display: none; width: 100%; line-height: 30px; text-align: left; color: #666666; font-size: 13px; background-color: #fafafa; border-bottom: 1px solid #dcdcdc; padding: 45px 30px; box-sizing: border-box; font-family: "dotum" !important; } #boad_box .boad_tbl div.list_box .more_box * { max-width: 100%; font-family: "dotum" !important; } #boad_box .boad_tbl div.list_box .more_btn { width: 100%; height: auto; padding-top: 60px; text-align: center; } #boad_box .boad_tbl div.list_box .more_btn a { width: 135px; height: 45px; line-height: 39px; border: 3px solid #e29068; border-radius: 45px; font-size: 16px; color: #e29068; text-align: center; box-sizing: border-box; } #boad_box .boad_tbl div.list_box .more_btn a:hover { color: #fff; background-color: #e29068; } #request_box { width: 100%; height: auto; padding: 75px 0px; background: url(../images/request_bg.jpg) no-repeat center center; background-size: cover; } #request_box > div { width: 990px; height: auto; margin: 0 auto; padding: 0px 15px; box-sizing: border-box; } #request_box .request_title { width: 100%; height: 40px; line-height: 30px; font-size: 40px; text-align: center; color: #fff; } #request_box .request_title > div > div { padding: 0px 5px; } #request_box .request_title img { vertical-align: -5px; } #request_box .request_info_box { width: 100%; height: auto; padding-top: 60px; text-align: center; } #request_box .request_info_box > div { width: 100%; height: auto; margin: 0 auto; box-sizing: border-box; } #request_box .request_info_box > div > div { width: 33.3333%; height: 54px; border-left: 1px solid #bababa; box-sizing: border-box; text-align: center;} #request_box .request_info_box > div > div:first-child { border-left: 0px; } #request_box .request_info_box .request_info_title { width: 100%; height: 20px; line-height: 20px; font-size: 16px; color: #fff; } #request_box .request_info_box .request_info_desc { width: 100%; height: 34px; line-height: 34px; font-size: 16px; color: #fff; } #contact_box { width: 100%; height: auto; padding: 60px 0px; background-color: #f2f2f0; } #contact_box > div { width: 990px; height: auto; margin: 0 auto; padding: 0px 15px; box-sizing: border-box; } #contact_box .contact_info_box { width: 100%; height: auto; text-align: center; } #contact_box .contact_info_box .contact_info_txt_01 { width: 100%; height: auto; margin-top: 15px; } #contact_box .contact_info_box .contact_info_txt_03 { width: 33.3333%; height: auto; } #contact_box .contact_info_box .contact_info_txt_03 > label { width: 90%; height: 40px; line-height: 40px; font-size: 16px; color: #878787; text-align: left; } #contact_box .contact_info_box .contact_info_txt_03 > input { width: 90%; height: 40px; padding: 0px 15px; background-color: #fff; border: 1px solid #dcdcdc; box-sizing: border-box; text-align: left; } #contact_box .contact_info_box .contact_info_txt_03.contact_info_txt_left > label { float: left; } #contact_box .contact_info_box .contact_info_txt_03.contact_info_txt_left > input { float: left; } #contact_box .contact_info_box .contact_info_txt_03.contact_info_txt_center > label { margin: 0 auto; } #contact_box .contact_info_box .contact_info_txt_03.contact_info_txt_center > input { margin: 0 auto; } #contact_box .contact_info_box .contact_info_txt_03.contact_info_txt_right > label { float: right; } #contact_box .contact_info_box .contact_info_txt_03.contact_info_txt_right > input { float: right; } #contact_box .contact_info_box .contact_info_txt_01 > label { width: 100%; height: 40px; line-height: 40px; font-size: 16px; color: #878787; text-align: left; } #contact_box .contact_info_box .contact_info_txt_01 > input { width: 100%; height: 40px; padding: 0px 15px; background-color: #fff; border: 1px solid #dcdcdc; box-sizing: border-box; } #contact_box .contact_info_box .contact_info_txt_01 > select { width: 100%; height: 40px; padding: 0px 0px 0px 15px; background-color: #fff; border: 1px solid #dcdcdc; box-sizing: border-box; } #contact_box .contact_info_box .contact_info_txt_01 > textarea { resize: none; width: 100%; height: 160px; padding: 15px 15px; background-color: #fff; border: 1px solid #dcdcdc; box-sizing: border-box; } #contact_box .contact_info_box .contact_info_txt_01.contact_info_check { width: 100%; height: 40px; line-height: 40px; text-align: left; margin-top: 5px; } #contact_box .contact_info_box .contact_info_txt_01.contact_info_check > label { width: auto; height: auto; line-height: auto; font-size: 16px; color: #878787; text-align: left; margin-left: 10px; } #contact_box .contact_info_box .contact_info_txt_01.contact_info_check > input { width: auto; height: auto; vertical-align: sub; padding: 0px 15px; background-color: #fff; border: 1px solid #dcdcdc; box-sizing: border-box; } #contact_box .contact_info_box .more_btn { width: 100%; height: auto; padding-top: 30px; text-align: center; } #contact_box .contact_info_box .more_btn a { width: 135px; height: 45px; line-height: 39px; border: 3px solid #e29068; border-radius: 45px; font-size: 16px; color: #e29068; text-align: center; box-sizing: border-box; } #contact_box .contact_info_box .more_btn a:hover { color: #fff; background-color: #e29068; } #recruit_box { width: 100%; height: auto; padding: 60px 0px; background-color: #c4ab95; } #recruit_box > div { width: 990px; height: auto; margin: 0 auto; padding: 0px 15px; box-sizing: border-box; } #recruit_box .recruit_title { width: 100%; height: 40px; line-height: 30px; font-size: 40px; text-align: center; color: #24293a; } #recruit_box .recruit_title > div > div { padding: 0px 5px; } #recruit_box .recruit_title img { vertical-align: -5px; } #recruit_box .recruit_desc { width: 100%; height: auto; line-height: 30px; font-size: 18px; text-align: center; color: #24293a; padding: 30px 0px; } #recruit_box .recruit_img { width: 100%; height: auto; background-color: #fff; } #recruit_box .recruit_img > img { max-width: 100%; } #recruit_box .recruit_btn { width: 100%; height: 35px; padding-top: 60px; text-align: center; } #recruit_box .recruit_btn a { width: 35px; height: 35px; line-height: 35px; text-align: center; border-radius: 35px; background: url(../images/top.svg) no-repeat center center; background-color: #e29068; color: #32384e; } #recruit_box .recruit_btn a:hover { background: url(../images/top.svg) no-repeat center center; background-color: #dac8b4; } #popBg { display: none; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #000; opacity: 0.5; z-index: 999999; } #popBox { display: none; top: 20%; left: 50%; width: 960px; height: 60%; max-height: 100%; margin-left: -480px; background-color: #fff; padding: 40px; box-sizing: border-box; z-index: 1000000; overflow-y: auto; } #popBox > div { width: 100%; height: 100%; } #popBox .pop_info_box { width: 100%; height: 270px; box-sizing: border-box; padding-bottom: 30px; border-bottom: 1px solid #ddd; z-index: 1; } #popBox .pop_info_box .pop_info_img { top: 0px; left: 0px; width: 330px; height: 100%; background-color: #333; } #popBox .pop_info_box > div { width: 100%; height: 100%; } #popBox .pop_info_box .pop_info_txt { width: 100%; height: 100%; padding-left: 375px; box-sizing: border-box; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_box { width: 100%; height: auto; padding: 30px 0px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_date { width: 100%; line-height: 25px; font-size: 16px; color: #666; text-align: left; padding-top: 15px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_title { width: 100%; line-height: 36px; font-size: 26px; color: #222; text-align: left; padding-top: 15px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_category { width: 100%; line-height: 28px; font-size: 18px; color: #666; padding-top: 15px; } #popBox .pop_info_load { width: 100%; height: 100%; box-sizing: border-box; padding-top: 320px; background-color: #fff; } #popBox .pop_info_load .pop_info_load_txt_box{ width: 100%; height: 100%; line-height: 25px; overflow-y: auto; font-size: 12px; font-family: "dotum"; } #popBox .pop_info_load .pop_info_load_txt_box * { max-width: 100%; font-family: "dotum" !important; } #popBox .prev_btn { top: 0px; right: 90px; width: 35px; height: 35px; border: 1px solid #dcdcdc; box-sizing: border-box; background: url(../images/prev.svg) no-repeat center center; z-index: 10; } #popBox .prev_btn:hover { background: url(../images/w_prev.svg) no-repeat center center; background-color: #dcdcdc; } #popBox .next_btn { top: 0px; right: 50px; width: 35px; height: 35px; border: 1px solid #dcdcdc; box-sizing: border-box; background: url(../images/next.svg) no-repeat center center; z-index: 10; } #popBox .next_btn:hover { background: url(../images/w_next.svg) no-repeat center center; background-color: #dcdcdc; } #popBox .close_btn { top: 0px; right: 0px; width: 35px; height: 35px; border: 1px solid #dcdcdc; box-sizing: border-box; background: url(../images/xxx.svg) #666 no-repeat center center; z-index: 10; } #popBox .close_btn:hover { background-color: #000; } #popMore { top: 270px; left: 50%; width: 100px; height: 35px; line-height: 35px; text-align: left; margin-left: -50px; padding-left: 20px; font-size: 12px; font-family: "dotum"; color: #fff; border: 1px solid #ddd; border-top: 0px; border-radius: 0px 0px 5px 5px; background: url(../images/up.svg) no-repeat calc(100% - 10px) center; background-size: 13px; background-color: #666; cursor: pointer; box-sizing: border-box; } #popMore:hover { background-color: #b19a86; } #popMore img { width: 13px; vertical-align: text-top; margin-left: 5px; } br.bt_type { display: none; } @media (max-width: 479px){ #header .header_m_nav { display: block; } #wrap { padding-top: 72px; } #header { height: 72px; } #header_box { width: 100%; height: 72px; line-height: 72px; padding: 0px 15px; box-sizing: border-box; } #header .header_nav_box { display: none; } #header .header_logo_box a img { width: auto; height: 42px; } #slider_box { height: 270px; } .slick-next { right: 10px; } .slick-prev { left: 10px; } #slider_box .slick-prev, #slider_box .slick-next { width: 10px; } #quick_box { padding: 15px 0px; } #quick_box > div { width: 100%; padding: 0px 5px; } #quick_box a .quick_icon { height: 50px; } #quick_box a .quick_icon > div { width: 50px; height: 50px; } #quick_box a.quick_01 .quick_icon > div { background: url(../images/documents.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_01 .quick_icon > div { background: url(../images/w_documents.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_02 .quick_icon > div { background: url(../images/todo.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_02 .quick_icon > div { background: url(../images/w_todo.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_03 .quick_icon > div { background: url(../images/advertising.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_03 .quick_icon > div { background: url(../images/w_advertising.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_04 .quick_icon > div { background: url(../images/newpost.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_04 .quick_icon > div { background: url(../images/w_newpost.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_05 .quick_icon > div { background: url(../images/businesscontact.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_05 .quick_icon > div { background: url(../images/w_businesscontact.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a .quick_txt { height: 20px; line-height: 20px; margin-top: 5px; font-size: 12px; } #portfolio_box { padding: 30px 0px; } #portfolio_box > div { width: 100%; padding: 0px 10px; } #portfolio_box .portfolio_title { height: 24px; font-size: 24px; } #portfolio_box .portfolio_title .btn_prev { width: 28px; height: 28px; } #portfolio_box .portfolio_title .btn_next { width: 28px; height: 28px; } #portfolio_box .portfolio_slider { padding-top: 30px; } #portfolio_slider .opacity { height: 233px; line-height: 233px; } #portfolio_slider .opacity .bg { height: 233px; line-height: 233px; } #portfolio_slider .opacity .txt { height: 233px; line-height: 233px; } #portfolio_slider .portfolio_slider_list { width: 50%; border: 1px solid #ddd; border-left: 0px; border-top: 0px; } #portfolio_slider .portfolio_slider_list:nth-child(1) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; border-top: 1px solid #ddd; border-left: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(2) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; border-top: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(3) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; border-left: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(4) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; } #portfolio_slider .portfolio_slider_list:nth-child(5) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; border-left: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(6) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; } #portfolio_slider .portfolio_slider_list .portfolio_img { height: 140px; } #portfolio_slider .portfolio_slider_list .portfolio_info { height: 92px; padding: 15px 10px; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_date { height: 18px; line-height: 18px; font-size: 13px; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_group { height: 20px; line-height: 20px; font-size: 14px; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_title { height: 20px; line-height: 20px; -webkit-line-clamp: 1; font-size: 14px; } #company_box { padding: 30px 0px 35px; } #company_box > div { width: 100%; padding: 0px 10px; } #company_box .company_title { height: 24px; font-size: 24px; } #company_box .company_tab { padding-top: 30px; } #company_box .company_tab > div > div { width: 70px; margin: 0px 10px; } #company_box .company_tab > div > div > div { font-size: 13px; height: 30px; line-height: 30px; } #company_box .company_tab_01 { padding-top: 30px; } #boad_box { padding: 30px 0px; } #boad_box > div { width: 100%; padding: 0px 10px; } #boad_box .company_title { height: 24px; font-size: 24px; } #boad_box .boad_tbl { padding-top: 30px; } #boad_box .boad_tbl div.list_box .more_btn { padding-top: 30px; } #boad_box .boad_tbl div.list_box .list { padding: 15px 0px; } #boad_box .boad_tbl div.list_box .list .list_num { top: 15px; width: 50px; height: 40px; } #boad_box .boad_tbl div.list_box .list .list_num .idx { height: 40px; line-height: 40px; font-size: 20px; } #boad_box .boad_tbl div.list_box .list .list_num .date { display: none; } #boad_box .boad_tbl div.list_box .list .list_title { height: 40px; padding-left: 65px; padding-right: 58px; } #boad_box .boad_tbl div.list_box .list .list_title .title { height: 22px; line-height: 22px; font-size: 14px; } #boad_box .boad_tbl div.list_box .list .list_title .desc { height: 12px; line-height: 12px; font-size: 12px; margin-top: 5px; } #boad_box .boad_tbl div.list_box .list .list_more { top: 15px; width: 58px; height: 40px; line-height: 40px; } #boad_box .boad_tbl div.list_box .list .list_more .btn { width: 28px; height: 28px; background-size: 45%; } #boad_box .boad_tbl div.list_box .list.active .list_more .btn { background-size: 45%; } #boad_box .boad_tbl div.list_box .more_box { padding: 15px; font-size: 11px; line-height: 25px; } #boad_box .boad_tbl div.list_box .more_btn a { font-size: 13px; border: 2px solid #e29068; width: 120px; height: 35px; line-height: 32px; } #request_box { padding: 30px 0px; } #request_box > div { width: 100%; padding: 0px 5px; } #request_box .request_title { height: 24px; font-size: 24px; } #request_box .request_info_box { padding-top: 30px; } #request_box .request_info_box > div > div { height: 40px; } #request_box .request_info_box .request_info_title { font-size: 12px; font-family: "dotum"; } #request_box .request_info_box .request_info_desc { font-size: 12px; height: 20px; line-height: 20px; font-family: "dotum"; } #contact_box { padding: 30px 0px; } #contact_box > div { width: 100%; padding: 0px 10px; } #contact_box .contact_info_box .contact_info_txt_03 { width: 100%; margin-top: 15px; } #contact_box .contact_info_box .contact_info_txt_03:first-child { margin-top: 0px; } #contact_box .contact_info_box .contact_info_txt_03 > label { width: 100%; font-size: 13px; height: 20px; line-height: 20px; } #contact_box .contact_info_box .contact_info_txt_03 > input { width: 100%; height: 30px; line-height: 30px; } #contact_box .contact_info_box .contact_info_txt_01 > label { font-size: 13px; height: 20px; line-height: 20px; } #contact_box .contact_info_box .contact_info_txt_01 > input { height: 30px; line-height: 30px; } #contact_box .contact_info_box .contact_info_txt_01 > select { height: 30px; line-height: 30px; } #contact_box .contact_info_box .contact_info_txt_01 > textarea { height: 100px; padding: 15px 10px; } #contact_box .contact_info_box .contact_info_txt_01.contact_info_check > label { font-size: 14px; margin-left: 0px; } #contact_box .contact_info_box .contact_info_txt_01.contact_info_check > input { vertical-align: sub; } #contact_box .contact_info_box .contact_info_txt_01.contact_info_check { font-size: 13px; height: 20px; line-height: 20px; } #contact_box .contact_info_box .more_btn a { font-size: 13px; border: 2px solid #e29068; width: 120px; height: 35px; line-height: 32px; } #recruit_box { padding: 30px 0px; } #recruit_box > div { width: 100%; padding: 0px 10px; } #recruit_box .recruit_title { height: 24px; font-size: 24px; } #recruit_box .recruit_desc { line-height: 25px; font-size: 14px; padding: 30px 0px 15px; } #recruit_box .recruit_btn { padding-top: 30px; } #footer .footer_top { padding: 30px 0px; } #footer .footer_top > div { width: 100%; padding: 0px 5px; } #footer .footer_bottom > div { width: 100%; } #footer .footer_top .footer_logo > img { width: 57px; } #footer .footer_top .footer_info { padding-top: 15px; font-size: 11px; } #footer .footer_top .footer_sns { padding-top: 15px; } br.bt_type { display: block; } #popBox { left: 15px; width: calc(100% - 30px); margin-left: auto; padding: 30px 15px; } #popBox .pop_info_box > div { padding-top: 40px; } #popBox .pop_info_box { position: relative; height: auto; padding-bottom: 15px; } #popBox .pop_info_box .pop_info_txt { padding-left: 0px; } #popBox .pop_info_box .pop_info_img { position: relative; width: 100%; height: 200px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_box { padding: 0px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_date { font-size: 13px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_title { line-height: 26px; font-size: 16px; padding-top: 5px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_category { line-height: 24px; font-size: 14px; padding-top: 5px; } #popBox .pop_info_load { padding-top: 45px; padding-bottom: 30px; height: 300px; } #popMore { top: 0px; height: 30px; line-height: 30px; border-radius: 0px; } #popBox .prev_btn { right: 70px; width: 30px; height: 30px; } #popBox .next_btn { right: 35px; width: 30px; height: 30px; } #popBox .close_btn { width: 30px; height: 30px; } #company_box .company_tab_01 img.company_web { display: none; } #company_box .company_tab_01 img.company_mobile { display: block; } } @media (max-width: 749px) and (min-width: 480px) { #header .header_m_nav { display: block; } #wrap { padding-top: 72px; } #header { height: 72px; } #header_box { width: 100%; height: 72px; line-height: 72px; padding: 0px 15px; box-sizing: border-box; } #header .header_nav_box { display: none; } #header .header_logo_box a img { width: auto; height: 42px; } #slider_box { height: 320px; } #quick_box { padding: 30px 0px; } #quick_box > div { width: 100%; } #quick_box a .quick_icon { height: 70px; } #quick_box a .quick_icon > div { width: 70px; height: 70px; } #quick_box a.quick_01 .quick_icon > div { background: url(../images/documents.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_01 .quick_icon > div { background: url(../images/w_documents.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_02 .quick_icon > div { background: url(../images/todo.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_02 .quick_icon > div { background: url(../images/w_todo.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_03 .quick_icon > div { background: url(../images/advertising.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_03 .quick_icon > div { background: url(../images/w_advertising.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_04 .quick_icon > div { background: url(../images/newpost.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_04 .quick_icon > div { background: url(../images/w_newpost.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_05 .quick_icon > div { background: url(../images/businesscontact.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_05 .quick_icon > div { background: url(../images/w_businesscontact.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a .quick_txt { font-size: 16px; } #portfolio_box > div { width: 100%; } #portfolio_box .portfolio_title { height: 30px; font-size: 30px; } #portfolio_slider .portfolio_slider_list { width: 50%; border: 1px solid #ddd; border-left: 0px; border-top: 0px; } #portfolio_slider .portfolio_slider_list:nth-child(1) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; border-top: 1px solid #ddd; border-left: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(2) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; border-top: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(3) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; border-left: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(4) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; } #portfolio_slider .portfolio_slider_list:nth-child(5) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; border-left: 1px solid #ddd; } #portfolio_slider .portfolio_slider_list:nth-child(6) { border: 1px solid #ddd; border-left: 0px; border-top: 0px; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_date { font-size: 13px; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_group { font-size: 14px; } #portfolio_slider .portfolio_slider_list .portfolio_info .portfolio_info_title { font-size: 14px; } #company_box > div { width: 100%; } #company_box .company_title { height: 30px; font-size: 30px; } #company_box .company_tab_01 { padding-top: 30px; } #boad_box > div { width: 100%; } #boad_box .company_title { height: 30px; font-size: 30px; } #boad_box .boad_tbl div.list_box .more_btn { padding-top: 30px; } #boad_box .boad_tbl div.list_box .list { padding: 25px 0px; } #boad_box .boad_tbl div.list_box .list .list_title { height: 50px; padding-left: 150px; padding-right: 100px; } #boad_box .boad_tbl div.list_box .list .list_num { top: 25px; width: 120px; height: 50px; } #boad_box .boad_tbl div.list_box .list .list_more { top: 18px; width: 80px; height: 50px; line-height: 50px; } #boad_box .boad_tbl div.list_box .list .list_num .idx { height: 35px; line-height: 35px; font-size: 35px; } #boad_box .boad_tbl div.list_box .list .list_title .title { height: 16px; line-height: 16px; font-size: 16px; } #boad_box .boad_tbl div.list_box .list .list_title .desc { height: 12px; line-height: 12px; font-size: 12px; margin-top: 15px; } #boad_box .boad_tbl div.list_box .more_btn a { font-size: 14px; border: 2px solid #e29068; } #request_box { padding: 45px 0px; } #request_box > div { width: 100%; } #request_box .request_title { height: 30px; font-size: 30px; } #request_box .request_info_box .request_info_title { font-size: 14px; } #request_box .request_info_box .request_info_desc { font-size: 14px; } #contact_box > div { width: 100%; } #contact_box .contact_info_box .contact_info_txt_03 > label { width: 95%; font-size: 14px; height: 35px; line-height: 35px; } #contact_box .contact_info_box .contact_info_txt_03 > input { width: 95%; height: 35px; line-height: 35px; } #contact_box .contact_info_box .contact_info_txt_01 > label { font-size: 14px; height: 35px; line-height: 35px; } #contact_box .contact_info_box .contact_info_txt_01 > input { height: 35px; line-height: 35px; } #contact_box .contact_info_box .contact_info_txt_01 > select { height: 35px; line-height: 35px; } #contact_box .contact_info_box .contact_info_txt_01 > textarea { height: 120px; } #contact_box .contact_info_box .contact_info_txt_01.contact_info_check > label { font-size: 14px; } #contact_box .contact_info_box .more_btn a { font-size: 14px; border: 2px solid #e29068; } #recruit_box > div { width: 100%; } #recruit_box .recruit_title { height: 30px; font-size: 30px; } #recruit_box .recruit_desc { line-height: 25px; font-size: 16px; } #recruit_box .recruit_btn { padding-top: 30px; } #footer .footer_top > div { width: 100%; } #footer .footer_bottom > div { width: 100%; } #footer .footer_top .footer_logo > img { width: 95px; } #company_box .company_tab_01 img.company_web { display: none; } #company_box .company_tab_01 img.company_mobile { display: block; } #popBox { left: 15px; width: calc(100% - 30px); margin-left: auto; padding: 30px 15px; } #popBox .pop_info_box > div { padding-top: 50px; } #popBox .pop_info_box { position: relative; height: auto; } #popBox .pop_info_box .pop_info_txt { padding-left: 0px; } #popBox .pop_info_box .pop_info_img { position: relative; width: 100%; height: 280px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_box { padding: 0px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_date { font-size: 14px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_title { line-height: 30px; font-size: 20px; padding-top: 5px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_category { line-height: 26px; font-size: 16px; padding-top: 5px; } #popBox .pop_info_load { padding-top: 45px; padding-bottom: 30px; height: 300px; } #popMore { top: 0px; border-radius: 0px; } } @media (max-width: 1023px) and (min-width: 750px) { #header .header_m_nav { display: block; } #header { height: 72px; } #wrap { padding-top: 72px; } #header_box { width: 100%; height: 72px; line-height: 72px; padding: 0px 15px; box-sizing: border-box; } #header .header_nav_box { display: none; } #header .header_logo_box a img { width: auto; height: 42px; } #slider_box { height: 480px; } #quick_box { padding: 30px 0px; } #quick_box > div { width: 100%; } #quick_box a .quick_icon { height: 85px; } #quick_box a .quick_icon > div { width: 85px; height: 85px; } #quick_box a.quick_01 .quick_icon > div { background: url(../images/documents.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_01 .quick_icon > div { background: url(../images/w_documents.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_02 .quick_icon > div { background: url(../images/todo.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_02 .quick_icon > div { background: url(../images/w_todo.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_03 .quick_icon > div { background: url(../images/advertising.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_03 .quick_icon > div { background: url(../images/w_advertising.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_04 .quick_icon > div { background: url(../images/newpost.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_04 .quick_icon > div { background: url(../images/w_newpost.svg) #fff no-repeat center center; background-size: 70%; } #quick_box a.quick_05 .quick_icon > div { background: url(../images/businesscontact.svg) #24293a no-repeat center center; background-size: 70%; } #quick_box a:hover.quick_05 .quick_icon > div { background: url(../images/w_businesscontact.svg) #fff no-repeat center center; background-size: 70%; } #portfolio_box > div { width: 100%; } #portfolio_box .portfolio_title { font-size: 36px; } #company_box > div { width: 100%; } #company_box .company_title { font-size: 36px; } #company_box .company_tab_01 { padding-top: 30px; } #boad_box > div { width: 100%; } #boad_box .company_title { font-size: 36px; } #boad_box .boad_tbl div.list_box .more_btn { padding-top: 30px; } #request_box > div { width: 100%; } #request_box .request_title { font-size: 36px; } #contact_box > div { width: 100%; } #recruit_box > div { width: 100%; } #recruit_box .recruit_title { font-size: 36px; } #footer .footer_top > div { width: 100%; } #footer .footer_bottom > div { width: 100%; } #footer .footer_top .footer_logo > img { width: 95px; } #popBox { left: 15px; width: calc(100% - 30px); margin-left: auto; } #popBox .pop_info_box .pop_info_txt { padding-left: 360px; } #popBox .pop_info_box .pop_info_txt .pop_info_txt_title { font-size: 24px; } } /* @media (max-width: 479px){ } @media (max-width: 749px) and (min-width: 480px) { } @media (max-width: 1023px) and (min-width: 750px) { } */