/******************************************* 폰트 ********************************************/ @font-face { font-family:NanumGothic; src: url(../font/nanumgothic/NanumGothic.eot); src: local("Nanum Gothic"), url(../font/nanumgothic/NanumGothic.woff) format("woff"); } @font-face { font-family:NanumGothicBold; src: url(../font/nanumgothic/NanumGothicBold.eot); src: local("Nanum Gothic Bold"), url(../font/nanumgothic/NanumGothicBold.woff) format("woff"); } /******************************************* YELLOW-FINGER ********************************************/ /* 메인 광고 */ div, p, ul, li,ol, table, th, td, textarea, input, span, form, h1, h2, h3, h4, h5, h6, dt, dl, dd, em, sup {padding:0px;margin:0px;vertical-align:top} /******************************************* 공통요소 ********************************************/ * { margin: 0px; padding: 0px; -webkit-overflow-scrolling : touch; outline: 0 none !important; font-family: 'NanumGothic', 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 */ .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; } /* 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-family: 'NanumGothicBold', sans-serif; } .fly { opacity: 0; transition: all 700ms ease-in-out; -webkit-transition: all 700ms ease-in-out; -moz-transition: all 700ms ease-in-out; transform: translateY(50px) translateX(0px) scale(1) translate3d(0, 0, 0); -webkit-transform: -webkit-translateY(50px) -webkit-translateX(0px) -webkit-scale(1) -webkit-translate3d(0, 0, 0); -moz-transform: -moz-translateY(50px) -moz-translateX(0px) -moz-scale(1) -moz-translate3d(0, 0, 0); -o-transform: -o-translateY(50px) -o-translateX(0px) -o-scale(1) -o-translate3d(0, 0, 0); } .show-block { opacity: 1; transform: translateY(0px) translateX(0px) scale(1) translate3d(0, 0, 0); -webkit-transform: -webkit-translateY(0px) -webkit-translateX(0px) -webkit-scale(1) -webkit-translate3d(0, 0, 0); -moz-transform: -moz-translateY(0px) -moz-translateX(0px) -moz-scale(1) -moz-translate3d(0, 0, 0); -o-transform: -o-translateY(0px) -o-translateX(0px) -o-scale(1) -o-translate3d(0, 0, 0); } @keyframes fadein { from { opacity: 0; } to { opacity: 1; } } /* Firefox < 16 */ @-moz-keyframes fadein { from { opacity: 0; } to { opacity: 1; } } /* Safari, Chrome and Opera > 12.1 */ @-webkit-keyframes fadein { from { opacity: 0; } to { opacity: 1; } } /* Internet Explorer */ @-ms-keyframes fadein { from { opacity: 0; } to { opacity: 1; } } /* Opera < 12.1 */ @-o-keyframes fadein { from { opacity: 0; } to { opacity: 1; } } /******************************************* YELLOW-FINGER ********************************************/ /* 상단메뉴 */ #header { top: 0px; left: 0px; width: 100%; height: auto; z-index: 100; } #header .header_top { width: 100%; height: 55px; line-height: 50px; background-color: #FFFFFF; opacity: 0.7; text-align: center; } #header .header_top > div { width: 100%; max-width: 1100px; height: 50px; line-height: 50px; } #header .header_top .header_top_nav { width: auto; box-sizing: border-box; padding-right: 26px; } #header .header_top .header_top_nav ul { width: auto; height: 100%; } #header .header_top .header_top_nav ul > li { width: auto; height: 100%; } #header .header_top .header_top_nav ul > li > a { width: auto; height: 100%; padding: 0px 12px; color: #fff; font-size: 11px; } /* 메인메뉴 */ #header .header_gnb { width: 100%; height: 93px; line-height: 99px; background-color: #ed1556; opacity: 1; box-sizing: border-box; text-align: center; } #header .header_gnb > div { width: 100%; max-width: 1100px; height: 99px; line-height: 99px; } #header .header_gnb .header_gnb_logo { top: 0px; left: 0px; width: 205px; height: 100%; padding-left: 26px; box-sizing: border-box; z-index: 1; } #header .header_gnb .header_gnb_logo a { width: 100%; height: 100%; } #header .header_gnb .header_gnb_logo a img { vertical-align: middle; } #header .header_gnb .header_gnb_logo a img.m_logo{ display: none; } #header .header_gnb .header_gnb_nav { width: 100%; height: 100%; padding-left: 205px; box-sizing: border-box; } #header .header_gnb .header_gnb_nav ul { width: auto; height: 100%; } #header .header_gnb .header_gnb_nav ul > li { width: auto; height: calc(100% + 1px); } #header .header_gnb .header_gnb_nav ul > li > a { width: auto; height: 100%; padding: 0px 26px; margin: 0px 12px; font-size: 17px; color: #ffffff; } #header .header_gnb .header_gnb_nav ul > li:hover > div { display: inline-block; -webkit-animation: fadein 300ms; /* Safari, Chrome and Opera > 12.1 */ -moz-animation: fadein 300ms; /* Firefox < 16 */ -ms-animation: fadein 300ms; /* Internet Explorer */ -o-animation: fadein 300ms; /* Opera < 12.1 */ animation: fadein 300ms; } /* 서브메뉴 */ #header .header_gnb .header_gnb_nav ul > li > div { display: none; left: 0px; top: 92px; width: 100%; height: 60px; line-height: 60px; background-color: #ed1556; opacity: 0.9;z-index: 1; text-align: center; } #header .header_gnb .header_gnb_nav ul > li > div > div { width: 100%; max-width: 1100px; height: 100%; padding: 0px 26px; box-sizing: border-box; } #header .header_gnb .header_gnb_nav ul > li > div > div > ul { width: 740px; } #header .header_gnb .header_gnb_nav ul > li > div > div > ul > li > a { width: auto; height: 100%; font-size: 15px; color: #FFFFFF; } #header .header_gnb .header_gnb_nav ul > li > div > div > ul > li > a.active { color: #454545; } #header .header_m_nav { display: none; top: 30px; left: 30px; width: 30px; height: 30px; cursor: pointer; } #header .header_m_nav > div { width: 100%; height: 4px; background-color: #ffffff; border-radius: 4px; } #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: 8px; left: 0px; -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } #header .header_m_nav > div.header_m_nav_03 { top: 16px; left: 0px; -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } #header .header_m_nav > div.header_m_nav_01.rotate { top: 11px; -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: 15px; top: auto; -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } #header .header_m_nav > div:first-child { margin-top: 0px; } #header .header_m_quick { display: none; top: 30px; right: 30px; width: 30px; height: 30px; cursor: pointer; } #header .header_m_quick > div { width: 6px; height: 6px; background-color: #ed1556; border-radius: 4px; } #header .header_m_quick > div.header_m_quick_01 { top: 7px; left: 0px; } #header .header_m_quick > div.header_m_quick_02 { top: 7px; left: 12px; } #header .header_m_quick > div.header_m_quick_03 { top: 7px; left: 24px; } /* 모바일메뉴 */ #headerMobileNavBgFull { display: none; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #FFFFFF; z-index: 97; } #headerMobileNavBg { display: none; top: 80px; left: 0px; width: 100%; height: auto; padding: 45px 0px; z-index: 98; text-align: center; } #headerMobileNavBg > div { width: 720px; text-align: left; padding: 0px 30px; box-sizing: border-box; } #headerMobileNavBg > div > ul { width: 100%; height: auto; } #headerMobileNavBg > div > ul > li { width: 100%; height: auto; line-height: 50px; border-bottom: 1px solid #ed1556; margin-top: 0px; box-sizing: border-box; } #headerMobileNavBg > div > ul > li:first-child { margin-top: 0px; } #headerMobileNavBg > div > ul > li > a { width: 100%; height: 100%; padding: 0px 60px 0px 15px; box-sizing: border-box; color: #ed1556; font-size: 18px; background-image: url(../images/m_nav_prev_down.png); background-repeat: no-repeat; background-position: calc(100% - 15px) center; background-size: 20px auto; } #headerMobileNavBg > div > ul > li > a.active { background-image: url(../images/m_nav_prev_up.png); } #headerMobileNavBg > div > ul > li > ul { display: none; width: 100%; height: auto; border-top: 1px solid #ed1556; padding: 15px 0px; } #headerMobileNavBg > div > ul > li > ul > li { width: 100%; height: auto; } #headerMobileNavBg > div > ul > li > ul > li > a { width: 100%; height: 40px; line-height: 40px; padding: 0px 15px; box-sizing: border-box; color: #ed1556; font-size: 16px; } #headerMobileNavBg > div > ul > li > ul > li > a.active { color: #fff; } #footer { width: 100%; height: auto; background-color: #ed1556; text-align: center; padding: 45px 0px 60px; text-align: center; } #footer > div { width: 100%; max-width: 1100px; height: auto; line-height: 30px; text-align: left; padding: 0px 26px; color: #eeeeee; font-size: 14px; box-sizing: border-box; } #footer a { font-size: 14px; color: #FFFFFF; } #footer p { font-size: 12px; color: #FFFFFF; } #footer span { font-size: 14px; color: #FFFFFF; padding: 0px 5px; } #footer .sns_info { text-align: center; margin-bottom: 20px; } #footer .sns_info a { margin: 0px 40px; } #footer .sns_info a img { width: 50px; height: auto; } /* 메인이미지 높이 */ #wrap { width: 100%; height: auto; padding-top: 93px; } #sub_header { width: 100%; height: 180px; background-color: #c3dbe0; text-align: center; } #sub_header > div { width: 100%; max-width: 1100px; height: 210px; padding: 54px 26px 50px; box-sizing: border-box; } #sub_header_title { width: 100%; height: 44px; line-height: 44px; font-size: 34px; color: #454545; text-align: left; } #sub_header_desc { width: 100%; height: 34px; line-height: 34px; font-size: 17px; color: #454545; text-align: left; } #wrap .section_title { width: 100%; height: auto; padding-top: 90px; text-align: center; } #wrap .section_title > div { width: 100%; max-width: 1100px; height: auto; line-height: 44px; font-size: 36px; color: #454545; padding: 0px 30px; box-sizing: border-box; } #wrap .section_desc { width: 100%; height: auto; padding-bottom: 65px; text-align: center; margin-top: 30px; } #wrap .section_desc > div { width: 100%; max-width: 1100px; height: auto; line-height: 32px; font-size: 18px; color: #5c5e67; padding: 0px 30px; box-sizing: border-box; } #wrap .section_filter { width: 100%; height: auto; padding: 0px 30px; padding-bottom: 45px; text-align: center; margin-top: 0px; box-sizing: border-box; } #wrap .section_filter > div { width: 100%; max-width: 1100px; height: 120px; background-color: #f0f0f0; padding: 39px 32px; box-sizing: border-box; border-radius: 8px; } #wrap .section_filter .filter_select { width: 190px; height: 42px; line-height: 40px; border-radius: 42px; text-align: center; background-color: #fff; border: 1px solid #e9e9e9; font-size: 16px; color: #898989; box-sizing: border-box; } #wrap .section_filter .filter_select_01 { width: 150px; height: 42px; line-height: 40px; border-radius: 42px; text-align: left; background-color: #fff; border: 1px solid #e9e9e9; font-size: 16px; color: #898989; padding-left: 18px; box-sizing: border-box; margin-left: 0px; cursor: pointer; } #wrap .section_filter .filter_select_02 { width: 150px; height: 42px; line-height: 40px; border-radius: 42px; text-align: left; background-color: #fff; border: 1px solid #e9e9e9; font-size: 16px; color: #898989; padding-left: 18px; box-sizing: border-box; margin-left: 15px; cursor: pointer; } #wrap .section_filter .filter_input_01 { width: 420px; height: 42px; line-height: 40px; border-radius: 42px; text-align: left; background-color: #fff; border: 1px solid #e9e9e9; font-size: 16px; color: #898989; box-sizing: border-box; margin-left: 20px; } #wrap .section_filter .filter_input { width: 678px; height: 42px; border-radius: 42px; background-color: #fff; border: 1px solid #e9e9e9; box-sizing: border-box; margin-left: 24px; } #wrap .section_filter .filter_input input { width: 100%; height: 100%; border: 0px; margin: 0px; padding: 0px 30px; background-color: inherit; border-radius: 42px; box-sizing: border-box; font-size: 16px; } #wrap .section_filter .filter_input_01 input{ width: 100%; height: 100%; border: 0px; margin: 0px; padding: 0px 30px; background-color: inherit; border-radius: 42px; box-sizing: border-box; font-size: 16px; } #wrap .section_filter .filter_btn { width: 110px; height: 42px; line-height: 42px; border-radius: 42px; background-color: #5c5e67; font-size: 16px; color: #fff; box-sizing: border-box; margin-left: 18px; cursor: pointer; } #wrap .section_filter .filter_btn_01 { width: 110px; height: 42px; line-height: 42px; border-radius: 42px; background-color: #5c5e67; font-size: 16px; color: #fff; box-sizing: border-box; margin-left: 9px; cursor: pointer; } #paging { width: 100%; height: 48px; margin: 30px auto 0px; padding-bottom: 200px; text-align: center; } #paging > div { max-width: 1100px; } #paging > div > div { width: 48px; height: 48px; line-height: 44px; border: 2px solid #efefef; box-sizing: border-box; text-align: center; font-size: 16px; color: #323232; margin-left: 18px; cursor: pointer; } #paging > div > div > a { width: 100%; height: 100%; text-align: center; font-size: 16px; color: #323232; } #paging > div > div:first-child { margin-left: 0px; } #paging > div > div.active { background-color: #eaeaea; color: #eaeaea; border: 2px solid #eaeaea; } #paging > div > div.active > a { color: #fff; } #paging > div > div.d_prev > a { background: url(../images/d_prev.png) no-repeat center center; } #paging > div > div.prev > a { background: url(../images/prev.png) no-repeat center center; } #paging > div > div.next > a { background: url(../images/next.png) no-repeat center center; } #paging > div > div.d_next > a { background: url(../images/d_next.png) no-repeat center center; } #sub_header > div { background-repeat: no-repeat; background-position: right -15px; background-size: auto; } #headerMobileQuickNav { display: none; left: 0px; top: 80px; width: 100%; height: 70px; line-height: 70px; background-color: #fff; border-bottom: 1px solid #eaeaea; text-align: center; z-index: 1; } #headerMobileQuickNav > div { width: 100%; max-width: 720px; height: 100%; } #headerMobileQuickNav > div > div { width: 25%; height: 100%;} #headerMobileQuickNav > div > div > a { width: auto; height: 100%; padding: 0px 10px; font-size: 14px; color: #ed1556; } br.br_sub_title_type_01 { display: none; } br.br_sub_type_01 { display: none; } br.br_sub_type_02 { display: none; } @media (max-width: 479px){ #header { position: relative; } #header .header_top { display: none; } #header .header_gnb { text-align: right; height: 80px; line-height: 80px; background-color: #ed1556; border: 0px; } #header .header_gnb > div { height: 80px; line-height: 80px; } #header .header_gnb .header_gnb_nav { display: none; } #header .header_gnb .header_gnb_logo { position: relative; float: none; width: auto; padding: 0px; } #header .header_gnb .header_gnb_logo a img { width: 100%; height: auto; } #header .header_gnb .header_gnb_logo a img.m_logo{ display: inline-block; } #header .header_gnb .header_gnb_logo a img.w_logo{ display: none; } #wrap { padding-top: 0px; } #sub_header { height: 120px; } #sub_header > div { height: 120px; padding: 30px 15px 30px; } #sub_header_title { height: 32px; line-height: 32px; font-size: 22px; } #sub_header_desc { height: 24px; line-height: 24px; font-size: 14px; } #wrap .section_title > div { line-height: 36px; font-size: 26px; padding: 0px 15px; box-sizing: border-box; } #wrap .section_title > div > br.br_sub_title_type_01 { display: block; } #wrap .section_desc > div { line-height: 24px; font-size: 14px; padding: 0px 15px; box-sizing: border-box; } #wrap .section_desc > div > br { display: none; } #wrap .section_desc > div > br.br_sub_type_02 { display: block; } #wrap .section_title { padding-top: 45px; } #wrap .section_desc { margin-top: 15px; padding-bottom: 45px; } #footer { padding: 30px 0px 30px; } #footer > div { height: auto; line-height: 24px; text-align: center; padding: 0px 15px; } #footer a { float: none; font-size: 12px; } #footer span { float: none; padding: 0px 5px; font-size: 12px; } #footer p { float: none; font-size: 12px; } #footer .sns_info { text-align: center; margin-bottom: 10px; } #footer .sns_info a { margin: 0px 10px; } #footer .sns_info a img { width: 30px; height: auto; } #header .header_m_nav { display: block; left: 15px; } #header .header_m_quick { display: block; right: 15px; } #headerMobileNavBg { padding: 30px 0px; } #headerMobileNavBg > div { width: 100%; min-width: 300px; text-align: left; padding: 0px 15px; box-sizing: border-box; } #headerMobileNavBg > div > ul > li { line-height: 40px; } #headerMobileNavBg > div > ul > li > a { font-size: 14px; } #headerMobileNavBg > div > ul > li > ul > li > a { height: 30px; line-height: 30px; font-size: 14px; } #wrap .section_filter { padding: 0px 15px 30px; } #wrap .section_filter > div { height: auto; padding: 30px 15px; } #wrap .section_filter > div > div { max-width: 450px; width: 100%; } #wrap .section_filter .filter_select_01 { width: calc(50% - 7.5px); height: 32px; line-height: 30px; font-size: 12px; padding-left: 15px; } #wrap .section_filter .filter_select_02 { width: calc(40% - 7.5px); height: 32px; line-height: 30px; font-size: 12px; padding-left: 15px; } #wrap .section_filter .filter_input_01 { width: calc(100% - 95px); height: 32px; line-height: 30px; font-size: 12px; margin-left: 0px; margin-top: 15px; } #wrap .section_filter .filter_btn_01 { width: 80px; height: 32px; line-height: 30px; font-size: 12px; margin-top: 15px; } #wrap .section_filter .filter_select { width: calc(100% - 95px); height: 32px; line-height: 30px; font-size: 12px; } #wrap .section_filter .filter_input { width: calc(100% - 95px); height: 32px; line-height: 30px; font-size: 12px; margin-left: 0px; margin-top: 15px; } #wrap .section_filter .filter_btn { width: 80px; height: 32px; line-height: 30px; font-size: 12px; margin-left: 9px; margin-top: 15px; } #paging { height: 30px; margin: 0px auto 0px; padding-bottom: 60px; } #paging > div { padding: 0px 15px; box-sizing: border-box; } #paging > div > div { width: 30px; height: 30px; line-height: 26px; margin-left: 5px; } #paging > div > div > a { font-size: 14px; } #paging > div > div.next > a { background-size: auto 35%; } #paging > div > div.prev > a { background-size: auto 35%; } #paging > div > div.d_next { display: none; } #paging > div > div.d_prev { display: none; } #header .header_gnb .header_gnb_nav ul > li > div { display: none !important; } #sub_header > div { background-position: right -2px; background-size: auto 120%; } #headerMobileQuickNav > div > div > a { font-size: 13px; } #wrap .section_filter .filter_input input { padding: 0px 15px; font-size: 14px; } #wrap .section_filter .filter_input_01 input { padding: 0px 15px; font-size: 14px; } } @media (max-width: 749px) and (min-width: 480px) { #headerMobileQuickNav > div > div > a { font-size: 14px; } #header { position: relative; } #header .header_top { display: none; } #header .header_gnb { text-align: right; height: 80px; line-height: 80px; background-color: #ed1556; border: 0px; } #header .header_gnb > div { height: 80px; line-height: 80px; } #header .header_gnb .header_gnb_nav { display: none; } #header .header_gnb .header_gnb_logo { position: relative; float: none; width: auto; padding: 0px; } #header .header_gnb .header_gnb_logo a img { width: 100%; height: auto; } #header .header_gnb .header_gnb_logo a img.m_logo{ display: inline-block; } #header .header_gnb .header_gnb_logo a img.w_logo{ display: none; } #wrap { padding-top: 0px; } #sub_header { height: 120px; } #sub_header > div { height: 120px; padding: 30px 15px 30px; } #sub_header_title { height: 34px; line-height: 34px; font-size: 24px; } #sub_header_desc { height: 26px; line-height: 26px; font-size: 16px; } #wrap .section_title > div { line-height: 28px; font-size: 28px; padding: 0px 15px; box-sizing: border-box; } #wrap .section_desc > div { line-height: 24px; font-size: 14px; padding: 0px 15px; box-sizing: border-box; } #wrap .section_desc > div > br { display: none; } #wrap .section_desc > div > br.br_sub_type_01 { display: block; } #wrap .section_title { padding-top: 45px; } #wrap .section_desc { padding-bottom: 45px; } #footer { padding: 30px 0px 30px; } #footer > div { height: auto; line-height: 24px; text-align: center; padding: 0px 15px; } #footer a { float: none; } #footer span { float: none; padding: 0px 5px; } #footer p { float: none; } #footer .sns_info { text-align: center; margin-bottom: 10px; } #footer .sns_info a { margin: 0px 10px; } #footer .sns_info a img { width: 30px; height: auto; } #header .header_m_nav { display: block; left: 15px; } #header .header_m_quick { display: block; right: 15px; } #headerMobileNavBg { padding: 30px 0px; } #headerMobileNavBg > div { width: 450px; text-align: left; padding: 0px 15px; box-sizing: border-box; } #headerMobileNavBg > div > ul > li { line-height: 45px; } #headerMobileNavBg > div > ul > li > a { font-size: 16px; } #headerMobileNavBg > div > ul > li > ul > li > a { height: 35px; line-height: 35px; font-size: 14px; } #wrap .section_filter { padding: 0px 15px 30px; } #wrap .section_filter > div { height: auto; padding: 30px 15px; } #wrap .section_filter > div > div { max-width: 450px; width: 100%; } #wrap .section_filter .filter_select_01 { width: calc(50% - 55px); font-size: 12px; padding-left: 15px; } #wrap .section_filter .filter_select_02 { width: calc(50% - 55px); font-size: 12px; padding-left: 15px; } #wrap .section_filter .filter_input_01 { width: calc(100% - 95px); font-size: 12px; margin-left: 0px; margin-top: 15px; } #wrap .section_filter .filter_btn_01 { width: 80px; font-size: 12px; margin-top: 15px; } #wrap .section_filter .filter_select { width: 90px; font-size: 14px; } #wrap .section_filter .filter_input { width: calc(100% - 242px); font-size: 14px; } #wrap .section_filter .filter_btn { width: 80px; font-size: 14px; } #paging { height: 38px; margin: 0px auto 0px; padding-bottom: 60px; } #paging > div { padding: 0px 15px; box-sizing: border-box; } #paging > div > div { width: 38px; height: 38px; line-height: 34px; margin-left: 5px; } #paging > div > div > a { font-size: 14px; } #paging > div > div.next > a { background-size: auto 35%; } #paging > div > div.d_next > a { background-size: auto 35%; } #paging > div > div.prev > a { background-size: auto 35%; } #paging > div > div.d_prev > a { background-size: auto 35%; } #header .header_gnb .header_gnb_nav ul > li > div { display: none !important; } #sub_header > div { background-position: right -2px; background-size: auto 120%; } #wrap .section_filter .filter_input input { padding: 0px 15px; font-size: 14px; } #wrap .section_filter .filter_input_01 input { padding: 0px 15px; font-size: 14px; } } @media (max-width: 1023px) and (min-width: 750px) { #header { position: relative; } #header .header_top { display: none; } #header .header_gnb { text-align: right; height: 80px; line-height: 80px; background-color: #ed1556; border: 0px; } #header .header_gnb > div { height: 80px; line-height: 80px; } #header .header_gnb .header_gnb_nav { display: none; } #header .header_gnb .header_gnb_logo { position: relative; float: none; width: auto; padding: 0px; } #header .header_gnb .header_gnb_logo a img { width: 100%; height: auto; } #header .header_gnb .header_gnb_logo a img.m_logo{ display: inline-block; } #header .header_gnb .header_gnb_logo a img.w_logo{ display: none; } #wrap { padding-top: 0px; } #sub_header { height: 170px; } #sub_header > div { height: 190px; padding: 54px 30px 50px; } #sub_header_title { height: 38px; line-height: 38px; font-size: 28px; } #sub_header_desc { height: 30px; line-height: 30px; font-size: 14px; } #wrap .section_title > div { line-height: 42px; font-size: 34px; } #wrap .section_desc > div { line-height: 24px; font-size: 14px; } #wrap .section_title { padding-top: 60px; } #wrap .section_desc { padding-bottom: 60px; } #footer { padding: 30px 0px 30px; } #footer > div { height: auto; line-height: 24px; text-align: center; padding: 0px 15px; } #footer a { float: none; } #footer span { float: none; padding: 0px 5px; } #footer p { float: none; } #header .header_m_nav { display: block; } #header .header_m_quick { display: block; } #wrap .section_filter > div { height: 102px; padding: 30px 30px; } #wrap .section_filter .filter_select_01 { width: 130px; font-size: 14px; padding-left: 15px; } #wrap .section_filter .filter_select_02 { width: 140px; font-size: 14px; padding-left: 15px; } #wrap .section_filter .filter_input_01 { width: 216px; font-size: 14px; } #wrap .section_filter .filter_btn_01 { width: 100px; font-size: 14px; } #wrap .section_filter .filter_select { width: 100px; font-size: 14px; } #wrap .section_filter > div > div { width: 100%; } #wrap .section_filter .filter_input { width: calc(100% - 262px); font-size: 14px; } #wrap .section_filter .filter_btn { width: 100px; font-size: 14px; } #paging { margin: 0px auto 0px; padding-bottom: 120px; } #paging > div > div > a { font-size: 16px; } #paging > div > div.next > a { background-size: auto 35%; } #paging > div > div.d_next > a { background-size: auto 35%; } #paging > div > div.prev > a { background-size: auto 35%; } #paging > div > div.d_prev > a { background-size: auto 35%; } #header .header_gnb .header_gnb_nav ul > li > div { display: none !important; } } @media (max-width: 1100px) and (min-width: 1024px) { #headerMobileQuickNav { display: none !important; } #header .header_gnb .header_gnb_logo { padding-left: 30px; } #header .header_top .header_top_nav { padding-right: 30px; } #header .header_top .header_top_nav ul > li > a { padding: 0px 10px; } #header .header_gnb .header_gnb_nav ul > li > a { padding: 0px 25px; margin: 0px 15px; } #wrap .section_filter .filter_input { width: 500px; } #sub_header_title { height: 42px; line-height: 42px; font-size: 32px; } #sub_header_desc { height: 32px; line-height: 32px; font-size: 15px; } #wrap .section_title > div { line-height: 42px; font-size: 34px; } #wrap .section_desc > div { line-height: 30px; font-size: 16px; } #footer span { padding: 0px 10px; } #footer > div { padding: 0px 30px; } #paging > div > div > a { font-size: 16px; } #paging > div > div.next > a { background-size: auto 35%; } #paging > div > div.d_next > a { background-size: auto 35%; } #paging > div > div.prev > a { background-size: auto 35%; } #paging > div > div.d_prev > a { background-size: auto 35%; } #header .header_gnb .header_gnb_nav ul > li > div > div > ul { width: 765px; } } /* @media (max-width: 479px){ } @media (max-width: 749px) and (min-width: 480px) { } @media (max-width: 1023px) and (min-width: 750px) { } @media (max-width: 1100px) and (min-width: 1024px) { } */