@charset "utf-8"; label, input, select{vertical-align:middle;} body{font-size:14px; font-family:'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', Dotum, "돋움",Gulim, "굴림", Verdana, Tahoma, AppleGothic, sans-serif; color:#333; letter-spacing:0; } input, textarea, select{ font-family:'Noto Sans KR', sans-serif !important; } input[type="checkbox"]{ border:1px solid #ddd;} /* font-family: 'Poppins', sans-serif; */ /* scroll style */ html::-webkit-scrollbar {width: 8px; background-color: #f8f8f8;} .scroll_bx::-webkit-scrollbar {width: 8px; background-color: #f8f8f8;} html::-webkit-scrollbar-thumb {background-color: #ababab; border-radius: 4px;} .scroll_bx::-webkit-scrollbar-thumb {background-color: #ababab; border-radius: 4px;} /* header */ #header {position: fixed; width: 100%; top: 0; left: 0; box-sizing: border-box; z-index: 1000;} #header .h_inner {max-width: 1760px; width: /*calc(100% - 120px)*/calc(100% - 40px); margin: 0 auto; box-sizing: border-box; position: relative;} #sub #header .h_inner {width: calc(100% - 40px);} #header .logo {/*width: 161px; height: 51px;*/width: 143px; height: 45px; background: url(../images/common/logo.png) no-repeat center; background-size: cover!important; position: absolute; left: 0; top: 52px; font-size: 0; -webkit-transition: background 0.3s, transform 0.3s; -moz-transition: background 0.3s, transform 0.3s; transition: background 0.3s, transform 0.3s; z-index: 10;} #main #header .logo {top: /*80px*/52px; -webkit-transition: background 0.3s, transform 0.6s; -moz-transition: background 0.3s, transform 0.6s; transition: background 0.3s, transform 0.6s;} #header .mid_txt {position: absolute; left: 50%; top: 80px; line-height: 32px; transform:translate(-50%, 0%); -webkit-transform:translate(-50%, 0%); font-family: 'Poppins', sans-serif; font-size: 14px; color: #ffffff; font-weight: 700; word-break: keep-all; text-transform: uppercase; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #header .mid_txt span {color: #ed4130;} #header .menu_btn {width: 42px; height: 28px; position: absolute; right: 0; top: /*80px*/60px; cursor: pointer; -webkit-transition: transform 0.3s; -moz-transition: transform 0.3s; transition: transform 0.3s; z-index: 10;} #main #header .menu_btn {-webkit-transition: transform 0.6s; -moz-transition: transform 0.6s; transition: transform 0.6s; } #sub #header .menu_btn {top: 60px;} #header .menu_btn span {position: absolute; width: 100%; height: 4px; background-color: #ed4130; position: absolute; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s;} #header .menu_btn span:nth-child(1) {top: 0; left: 0;} #header .menu_btn span:nth-child(2) {top: 12px; left: 0;} #header .menu_btn span:nth-child(3) {bottom: 0; right: 0px; left: auto;} #header .menu_btn.on span:nth-child(1) {width: 50%; transform: rotate(45deg) translate(5px, 1px); /*top: 6px; left: 2px;*/} #header .menu_btn.on span:nth-child(2) {top: 50%; margin-top: -2px; transform: rotate(-45deg);} #header .menu_btn.on span:nth-child(3) {width: 50%; transform: rotate(45deg) translate(-5px, -1px); /*bottom: 6px; right: 2px;*/} #header .menu_btn .btn_area {position: absolute; width: calc(100% + 50px); height: calc(100% + 50px); top: 50%; left: 50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%);} #header.scroll .logo {background: url(../images/common/logo_on.png) no-repeat center; transform: translate(0, -15px);} #main #header.scroll .logo {transform: /*translate(0, -30px)*/translate(0, -15px);} #header.smOn .logo {transform: translate(0, 0px)!important;} #sub #header .logo {background: url(../images/common/logo_on.png) no-repeat center;} #sub #header.type2 .logo {background: url(../images/common/logo.png) no-repeat center;} #sub #header.scroll.type2 .logo {background: url(../images/common/logo_on.png) no-repeat center;} /*#sub #header.subOn .logo {background: url(../images/common/logo_on.png) no-repeat center;}*/ #header.smOn .logo, #sub #header.smOn .logo {background: url(../images/common/logo.png) no-repeat center;} /*#header.smOn .logo {background: none!important;} #header .logo::after {content: ''; width: 70px; height: 70px; border-radius: 50%; background: url(../images/common/logo_on.png) no-repeat center #f8f8f8; background-size: 28px auto; position: absolute; left: 50%; top: 50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); z-index: -1; opacity: 0; -webkit-transition: opacity 0.6s; -moz-transition: opacity 0.6s; transition: opacity 0.6s;} #header.smOn .logo::after {opacity: 1;}*/ /*#header.scroll {background-color: rgba(255,255,255,.31); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);}*/ #header.scroll .mid_txt {opacity: 0;} #sub #header .mid_txt {color: #000000;} #header.scroll .menu_btn {transform: translate(0, -15px);} #main #header.scroll .menu_btn {transform: /*translate(0, -30px)*/ translate(0, -15px);} #header.smOn .menu_btn {transform: translate(0, 0)!important;} /*#header.scroll .menu_btn span {background-color: #000000;} #sub #header .menu_btn span {background-color: #000000;}*/ #header.smOn .menu_btn span {background-color: #fff!important;} /* footer */ #footer {background-color: #f8f8f8; position: relative; z-index: 100;} #footer .slide_txt {position: absolute; z-index: 1; left: 0; top: 319px; height: 106px; overflow: hidden; white-space: nowrap; display: flex; animation: scrollTextF 30s infinite linear; font-family: 'Poppins', sans-serif; font-size: 146px; color: #ed4130; font-weight: 600; line-height: 106px; text-transform: uppercase;} @-webkit-keyframes scrollTextF { from { transform: translateX(0%); } to { transform: translateX(-50%); } } #footer .txt_bx {max-width: 1200px; width: calc(100% - 40px); margin: 0 auto; box-sizing: border-box; position: relative; display: flex; flex-flow: wrap; padding: 96px 0 94px;} /*#footer .txt_bx .name {width: 360px; font-family: 'Poppins', sans-serif; font-size: 26px; color: #ed4130; font-weight: 600; word-break: keep-all; line-height: 32px;}*/ #footer .txt_bx .name {width: 360px; font-family: 'Poppins', sans-serif; box-sizing: border-box; position: relative; font-size: 20px; font-weight: 800; color: #353535; text-transform: uppercase; line-height: 45px; padding-left: 50px;} #footer .txt_bx .name::before {content: ''; width: 38px; height: 45px; background: url(../images/common/logo_on.png) no-repeat left center; position: absolute; left: 0; top: 0;} #footer .txt_bx .info_bx {width: calc(100% - 360px); box-sizing: border-box; font-size: 0; padding-top: 2px;} #footer .txt_bx .info_bx li {font-size: 14px; color: #666666; line-height: 32px; font-weight: 350; word-break: keep-all; margin-right: 33px; display: inline-block;} #footer .txt_bx .info_bx li:last-child {margin-right: 0;} #footer .txt_bx .info_bx li.w100 {width: 100%; margin-right: 0;} #footer .txt_bx .btm_txt {width: 100%; font-size: 13px; color: #888888; line-height: 22px; word-break: keep-all; margin-top: 9px; text-transform: uppercase;} #footer .txt_bx .top_btn {position: absolute; width: 46px; height: 60px; background: url(../images/icon/top_btn2.png) no-repeat center top; right: 0; top: 100px; font-size: 0; cursor: pointer;} /*#contact_quick {visibility: hidden;}*/ #contact_quick {height: 220px; background-color: #ed4130; display:flex; justify-content:center; align-items:center; table-layout:fixed; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 99; transform: translate(0, 220px); -webkit-transition: all 0.6s; -moz-transition: all 0.6s; transition: all 0.6s;} #contact_quick.on {transform: translate(0, 0px);} #contact_quick.qthOn {transform: translate(0, 220px)!important;} #footer #contact_quick {margin-bottom: 204px; position: relative; top: auto; left: auto; transform: translate(0, 0px)!important; opacity: 1!important;} #contact_quick .con_bx {max-width: 1224px; width: calc(100% - 40px); margin: 0 auto; box-sizing: border-box; display: flex; flex-flow: wrap;} #contact_quick .con_bx strong {width: calc(100% - 400px); font-size: 42px; color: #ffffff; line-height: 56px; font-weight: 700; letter-spacing: -0.05em; word-break: keep-all;} #contact_quick .btn_bx {width: 400px; display: flex; flex-flow: wrap;} #contact_quick .btn_bx li {width: calc(50% - 10px); margin-left: 10px; box-sizing: border-box;} #contact_quick .btn_bx li a {display: block; padding: 0 36px; border: 1px solid #fff; box-sizing: border-box; border-radius: 28px; font-size: 16px; color: #ffffff; font-weight: 500; letter-spacing: -0.05em; word-break: keep-all;} #contact_quick .btn_bx li a span {display: block; position: relative; line-height: 54px;} #contact_quick .btn_bx li a span::before {content: ''; width: 16px; height: 14px; background: url(../images/icon/arrow1.png) no-repeat right center; position: absolute; right: 0; top: 50%; margin-top: -8px;} #contact_quick_pop {position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,.74); z-index: 10000; overflow-y: auto; box-sizing: border-box; padding: 50px 0; display: none;} #contact_quick_pop .pop_inner {display: table; height: 100%; width: 100%;} #contact_quick_pop .pop_w {display: table-cell; vertical-align: middle;} #contact_quick_pop .pop_con {background-color: #fff; max-width: 550px; width: calc(100% - 40px); margin: 0 auto; box-sizing: border-box;} #contact_quick_pop .ttl_bx {background-color: #ed4130; position: relative; padding: 36px 45px 59px; overflow: hidden;} #contact_quick_pop .ttl_bx strong {font-size: 32px; color: #ffffff; font-weight: 700; letter-spacing: -0.05em; word-break: keep-all;} #contact_quick_pop .ttl_bx p {font-size: 18px; color: #ffffff; letter-spacing: -0.05em; color: rgba(255,255,255,.7); word-break: keep-all; margin-top: 5px;} #contact_quick_pop .ttl_bx .bg_txt {font-family: 'Poppins', sans-serif; font-size: 80px; color: #fa6455; font-weight: 600; word-break: keep-all; position: absolute; bottom: -52px; left: 0; text-align: center; width: 100%;} #contact_quick_pop .ttl_bx .close_btn {width: 24px; height: 24px; background: url(../images/icon/close2.png) no-repeat center; font-size: 0; position: absolute; right: 20px; top: 20px; cursor: pointer;} #contact_quick_pop .form_bx {padding: 36px 46px 46px;} #contact_quick_pop .form_bx .f_con .f_w {display: flex; flex-flow: wrap; margin-top: 8px;} #contact_quick_pop .form_bx .f_con .f_w:first-child {margin-top: 0;} #contact_quick_pop .form_bx .f_con input {width: calc(50% - 4px); margin-right: 8px; box-sizing: border-box; border: none; background-color: #f3f3f3; border-radius: 5px; height: 58px; padding: 0 20px; font-size: 16px; color: #111; letter-spacing: -0.05em; word-break: keep-all; outline: none;} #contact_quick_pop .form_bx .f_con input::placeholder {color: #9d9d9d;} #contact_quick_pop .form_bx .f_con input:nth-child(2n) {margin-right: 0;} #contact_quick_pop .form_bx .f_con textarea {width: 100%; height: 160px; box-sizing: border-box; background-color: #f3f3f3; padding: 16px 20px; font-size: 16px; color: #111; letter-spacing: -0.05em; word-break: keep-all; resize: none; border: none; border-radius: 5px; margin-top: 10px; outline: none;} #contact_quick_pop .form_bx .f_con textarea::placeholder {color: #9d9d9d;} #contact_quick_pop .form_bx .agree_bx {padding-left: 30px; position: relative; font-size: 0; margin-top: 20px;} #contact_quick_pop .form_bx .agree_bx input {appearance: none; -webkit-appearance: none; -moz-appearance: none; position: absolute; width: 24px; height: 24px; box-sizing: border-box; top: 0; left: 0; border-radius: 50%; border: 1px solid #dddddd; background: url(../images/icon/chk2.png) no-repeat center 6px #fafafa; background-size: 14px auto!important;} #contact_quick_pop .form_bx .agree_bx input:checked {background: url(../images/icon/chk.png) no-repeat center 6px #ed4130; border-color: #ed4130;} #contact_quick_pop .form_bx .agree_bx label {font-size: 16px; color: #101010; letter-spacing: -0.05em; word-break: keep-all; line-height: 24px;} #contact_quick_pop .form_bx .agree_bx label span {cursor: pointer; color: #ed4130; display: inline-block; border-bottom: 1px solid #ed4130;} #contact_quick_pop .form_bx .btn {display: block; margin-top: 26px; border: 1px solid #ed4130; padding: 0 40px; font-size: 22px; color: #ed4130; font-weight: 700; letter-spacing: -0.05em; word-break: keep-all; border-radius: 35px;} #contact_quick_pop .form_bx .btn span {display: block; line-height: 68px; position: relative;} #contact_quick_pop .form_bx .btn span::before {content: ''; width: 27px; height: 22px; background: url(../images/icon/arrow5.png) no-repeat right center; position: absolute; right: 0; top: 50%; margin-top: -11px;} /* s_visual */ #s_visual {position: fixed; top: 0; left: 0; box-sizing: border-box; z-index: 999; width: 100%;} .pc_show2 {display: block!important;} .m_show2 {display: none!important;} /* PC */ @media all and (min-width:1025px){ .pc_show{ display:block !important;} .pc_i_show{ display:inline-block !important;} .m_show{ display:none !important;} .m_i_show{ display:none !important;} /* header */ /*#header {position: absolute;}*/ #header.smOn .h_inner {width: calc(100% - 80px)!important;} #header .menu_bx {position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: /*#000*/#ed4130; display: none; box-sizing: border-box;} #header .menu_bx .bg_bx {position: absolute; width: 100%; height: 100%; top: 0; left: 0; overflow: hidden;} /*#header .menu_bx .bg_bx::after {content: ''; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,0.7); position: absolute; z-index: 1;}*/ #header .menu_bx .bg_bx > div {position: absolute; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-size: cover; background-repeat: no-repeat; background-position: center; display: none; z-index: 0;} #header .menu_bx .bg_bx .bg2 {background-image: url(../images/sub/sub_v_02.jpg); /*opacity: 0.2;*/} #header .menu_bx .bg_bx .bg3 {background-image: url(../images/sub/sub_v_03.jpg); /*opacity: 0.2;*/} /*#header .menu_bx::before {content: ''; width: calc(100% - 40px); height: calc(100% - 40px); top: 20px; left: 20px; background-color: #ed4130; position: absolute; left: 20px; top: 20px; box-sizing: border-box;}*/ #header .menu_bx .menu_w {position: absolute; width: 100%; height: 100%; top: 0; left: 0; box-sizing: border-box; display:flex; justify-content:center; align-items:center; table-layout:fixed; z-index: 2;} /*#header.smOn .menu_bx .dep1_wrap {position: relative; top: 156px; height: calc(100% - 156px); box-sizing: border-box; -webkit-transition: all 0.6s; -moz-transition: all 0.6s; transition: all 0.6s;} #header.scroll.smOn .menu_bx .dep1_wrap {position: relative; top: 126px; height: calc(100% - 126px); box-sizing: border-box;}*/ #header .menu_bx .dep1_wrap {padding-bottom: 38px; font-size: 0; max-width: 1760px; width: calc(100% - 40px); position: relative; transform: translate(0, -50px); opacity: 0;} #header.smOn .menu_bx .dep1_wrap {-webkit-transition: opacity 0.6s, transform 0.6s; -moz-transition: opacity 0.6s, transform 0.6s; transition: opacity 0.6s, transform 0.6s; transform: translate(0, 0px); opacity: 1;} #header .menu_bx .dep1 {margin-bottom: 26px; /*transform: translate(0, -50px); opacity: 0;*/} /*#header.smOn .menu_bx .dep1 {-webkit-transition: opacity 0.6s, transform 0.6s; -moz-transition: opacity 0.6s, transform 0.6s; transition: opacity 0.6s, transform 0.6s; transform: translate(0, 0px); opacity: 1;} #header.smOn .menu_bx .dep01 {transition-delay: 0.1s;} #header.smOn .menu_bx .dep02 {transition-delay: 0.2s;} #header.smOn .menu_bx .dep03 {transition-delay: 0.3s;} #header.smOn .menu_bx .dep04 {transition-delay: 0.4s;} #header.smOn .menu_bx .dep05 {transition-delay: 0.5s;}*/ #header .menu_bx .dep1:last-child {margin-bottom: 0;} #header .menu_bx .dep1 > a {display: inline-block; font-family: 'Poppins', sans-serif; font-size: 60px; color: #000; font-weight: 700; font-style: italic; line-height: 70px; position: relative; overflow: hidden; -webkit-transition: color 0.3s; -moz-transition: color 0.3s; transition: color 0.3s; padding: 0 3px;} #header .menu_bx .dep1 > a:hover {color: /*#fff*/#000;} #header .menu_bx .dep1 > a.on {color: /*#fff*/#000;} #header .menu_bx .dep1 > a::before {content: ''; width: 0%; height: 3px; background-color: /*#fff*/#000; position: absolute; left: 0; bottom: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #header .menu_bx .dep1 > a:hover::before {width: 100%;} /*#header .menu_bx .dep1 > a.on::before {width: 100%;}*/ #header .menu_bx .dep1 > a span {position: absolute; width: 100%; height: 100%; left: 0; top: 0; /*background-color: #ed4130;*/ color: /*#444444*/#fff; overflow: hidden; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; transition: width 0.3s;} #header .menu_bx .dep1 > a em {position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 3px; box-sizing: border-box;} #header .menu_bx .dep1 > a:hover span {width: 0;} #header .menu_bx .dep1 > a.on span {width: 0;} #header .menu_bx .dep2_bx {} #header .menu_bx .dep2_wrap {position: absolute; width: calc(100% - 460px); top: 27px; right: 0; display: none;} #header .menu_bx .dep2_wrap > li {margin-bottom: 34px;} #header .menu_bx .dep2_wrap > li:last-child {margin-bottom: 0;} #header .menu_bx .dep2_wrap > li > a {font-family: 'Poppins', sans-serif; font-size: 30px; color: /*#444444*/#fff; font-weight: 700; font-style: italic; display: inline-block; position: relative; -webkit-transition: color 0.3s, padding 0.3s; -moz-transition: color 0.3s, padding 0.3s; transition: color 0.3s, padding 0.3s; padding-right: 10px;} #header .menu_bx .dep2_wrap > li > a::before {content: ''; width: 16px; height: 14px; background: url(../images/icon/arrow7.png) no-repeat right center; position: absolute; top: 50%; margin-top: -7px; right: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #header .menu_bx .dep2_wrap > li > a:hover {color: /*#fff*/#000; padding-right: 26px;} #header .menu_bx .dep2_wrap > li > a:hover::before {background-position: left center;} #header .menu_bx .btm_bx {position: absolute; bottom: 74px; left: 50%; width: calc(100% - 80px); max-width: 1760px; box-sizing: border-box; transform:translate(-50%, 0%); -webkit-transform:translate(-50%, 0%); font-size: 0; vertical-align: bottom; padding-bottom: 0; opacity: 0; -webkit-transition: opacity 0.6s; -moz-transition: opacity 0.6s; transition: opacity 0.6s;} #header.smOn .menu_bx .btm_bx { transition-delay: 0.3s; opacity: 1; z-index: 2;} #header .menu_bx .l_bx {width: 100%; box-sizing: border-box; display: inline-block; font-size: 0;} #header .menu_bx .l_bx li {margin-left: 0px; display: inline-block; margin-left: 60px;} #header .menu_bx .l_bx li:first-child {margin-left: 0px;} #header .menu_bx .l_bx li a {font-size: 16px; color: #ffffff; font-weight: 500; display: inline-block; padding-right: 20px; background: url(../images/icon/link.png) no-repeat right center; line-height: 30px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #header .menu_bx .l_bx li a.down {background: url(../images/icon/download.png) no-repeat right center;} #header .menu_bx .l_bx li a:hover {color: #000; background: url(../images/icon/link2.png) no-repeat right center;} #header .menu_bx .l_bx li a.down:hover {background: url(../images/icon/download2.png) no-repeat right center;} #header .menu_bx .mid {font-size: 16px; color: #ffffff; font-weight: 600; word-break: keep-all; font-family: 'Poppins', sans-serif; width: 130px; display: inline-block; line-height: 30px; vertical-align: bottom;} #header .menu_bx .r_bx {width: calc(50% - 65px); box-sizing: border-box; font-size: 0; text-align: right; display: inline-block; vertical-align: bottom;} #header .menu_bx .r_bx li {margin-bottom: 4px;} #header .menu_bx .r_bx li:last-child {margin-bottom: 0;} #header .menu_bx .r_bx li a {font-size: 14px; color: #ffffff; font-weight: 600; font-family: 'Poppins', sans-serif; display: inline-block; padding-right: 23px; background: url(../images/icon/download.png) no-repeat right center; line-height: 30px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #header .menu_bx .r_bx li a:hover {background: url(../images/icon/download2.png) no-repeat right center; color: #000;} #header::before {content: ''; width: 100%; height: 149px; position: absolute; left: 0; top: 0; background-color: rgba(255,255,255,.31); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #header.scroll::before {height: 120px; opacity: 1;} #header .h_menu {box-sizing: border-box; font-size: 0; position: absolute; left: 0; top: 0; /*-webkit-transition: transform 0.3s; -moz-transition: transform 0.3s; transition: transform 0.3s;*/ width: 100%; text-align: center;} /*#header.scroll .h_menu {transform: translate(0, -15px);}*/ #header .h_menu .dep1 {display: inline-block; position: relative; vertical-align: top; margin-right: 80px;} #header .h_menu .dep1:last-child {margin-right: 0;} #header .h_menu .dep1 > a {font-size: 18px; color: #353535; font-family: 'Poppins', sans-serif; font-weight: 600; display:flex; justify-content:center; align-items:center; table-layout:fixed; height: 149px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #header.scroll .h_menu .dep1 > a {height: 120px;} #header.type2 .h_menu .dep1 > a {color: #fff;} #sub #header.scroll.type2 .h_menu .dep1 > a {color: #353535;} #main #header .h_menu .dep1 > a {color: #fff;} #main #header.scroll .h_menu .dep1 > a {color: #353535;} #header .h_menu .dep1 > a span {display: block;} #header .h_menu .dep2_wrap {position: absolute; text-align: center; background-color: #ed4130; border-radius: 10px; width: 180px; left: 50%; margin-left: -90px; top: 100px; visibility: hidden; z-index: -1; opacity: 0; transform: translate(0, 15px); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #header.scroll .h_menu .dep2_wrap {top: 85px;} #header .h_menu .dep1:hover .dep2_wrap {visibility: visible; z-index: 1; opacity: 1; transform: translate(0, 0px)} #header .h_menu .dep2_wrap > li {margin-bottom: 5px;} #header .h_menu .dep2_wrap > li:first-child {padding-top: 15px;} #header .h_menu .dep2_wrap > li:last-child {margin-bottom: 0; padding-bottom: 15px;} #header .h_menu .dep2_wrap > li > a {font-size: 16px; color: #fff; font-family: 'Poppins', sans-serif; font-weight: 600; display: inline-block; line-height: 30px;} /* footer */ #footer .txt_bx .top_btn {-webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s;} #footer .txt_bx .top_btn:hover {background-position: center bottom;} #contact_quick .btn_bx li a {-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #contact_quick .btn_bx li a:hover {color: #ed4130; background-color: #fff;} #contact_quick .btn_bx li a span::before {-webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s;} #contact_quick .btn_bx li a:hover span::before {background-position: left center;} #contact_quick_pop .form_bx .btn {-webkit-transition: background 0.3s, color 0.3s; -moz-transition: background 0.3s, color 0.3s; transition: background 0.3s, color 0.3s;} #contact_quick_pop .form_bx .btn:hover {color: #fff; background-color: #ed4130;} #contact_quick_pop .form_bx .btn span::before {-webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s;} #contact_quick_pop .form_bx .btn:hover span::before {background-position: left center;} /* s_visual */ #s_visual {position: absolute;} #s_visual {padding: 62px 20px; -webkit-transition: background 0.3s, padding 0.3s; -moz-transition: background 0.3s, padding 0.3s; transition: background 0.3s, padding 0.3s;} #s_visual.scroll {/*background-color: #fff; border-bottom: 1px solid #eee; */ padding: 47px 20px 0;} #s_visual .tab_box {max-width: 1760px; margin: 0 auto; padding: 0 220px;} #s_visual .tab_box .dep2_wrap {font-size: 0; max-width: 1224px; margin: 0 auto; display: block!important; height: auto!important;} #s_visual .tab_box .dep2_wrap > li {display: inline-block; margin-right: 35px;} #s_visual .tab_box .dep2_wrap > li:last-child {margin-right: 0;} #s_visual .tab_box .dep2_wrap > li > a {display: block; font-size: 18px; color: #a0a0a0; font-weight: 600; line-height: 27px; position: relative; font-family: 'Poppins', sans-serif; -webkit-transition: color 0.3s; -moz-transition: color 0.3s; transition: color 0.3s;} #s_visual .tab_box .dep2_wrap > li > a::before {content: ''; width: 0%; height: 2px; background-color: #ed4130; position: absolute; left: 0; bottom: 0; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; transition: width 0.3s;} #s_visual .tab_box .dep2_wrap > li:hover > a {color: #ed4130;} #s_visual .tab_box .dep2_wrap > li.on > a {color: #ed4130;} #s_visual .tab_box .dep2_wrap > li.on > a::before {width: 100%;} /*#s_visual.type2 {position: relative; width: 100%; top: auto; left: auto;}*/ } /* 태블릿&모바일 공통*/ @media all and (max-width:1024px){ .pc_show{ display:none !important;} .pc_i_show{ display:none !important;} .m_show{ display:block !important;} .m_i_show{ display:inline-block !important;} /* header */ #header .logo {background-size: 66px 21px!important; width: 66px; height: 21px; top: 24px;} #header .logo::after {width: 45px; height: 45px; background-size: 19px auto!important;} #main #header .logo {top: 21px;} #sub #header.type2 .logo{background: url(../images/common/logo.png) no-repeat center!important; background-size: 66px 21px!important;} #sub #header.scroll.subOn .logo {background: url(../images/common/logo_on.png) no-repeat center!important; background-size: 66px 21px!important;} #header.scroll .logo {transform: /*translate(0, -30px)*/translate(0, 0)!important;} #header .menu_btn {width: 30px; height: 18px; top: 24px!important;} #header.scroll .menu_btn {transform: /*translate(0, -30px)*/translate(0, 0)!important;} #header .menu_btn span {height: 2px;} #header .menu_btn.on span:nth-child(1) {transform: rotate(45deg) translate(3px, 0px);} #header .menu_btn span:nth-child(2) {top: 8px;} #header .menu_btn.on span:nth-child(3) {transform: rotate(45deg) translate(-4px, -1px);} #header .menu_btn .btn_area {width: calc(100% + 25px); height: calc(100% + 25px);} #header .menu_bx {display: none; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: #fff; box-sizing: border-box; /*background: rgba(0,0,0,0.95);*/ background-color: #000; overflow-y: auto; padding: 80px 0 20px;} /*#header .menu_bx::before {content: ''; width: calc(100% - 40px); height: calc(100% - 40px); top: 20px; left: 20px; background-color: #ed4130; position: absolute; left: 20px; top: 20px; box-sizing: border-box;}*/ #header .menu_bx .menu_w {position: fixed; width: 100%; box-sizing: border-box; height: calc(100% - 232px); left: 0; top: 80px; overflow-y: auto;} #header .menu_bx .dep1_wrap {text-align: left; box-sizing: border-box; padding: 0 20px;} #header .menu_bx .dep1 {margin-bottom: 15px;} #header .menu_bx .dep1 > a {display: inline-block; font-size: 35px; color: #fff; font-weight: 700; font-family: 'Poppins', sans-serif; font-style: italic; position: relative; line-height: 45px;} #header .menu_bx .dep1 > a::before {content: ''; width: 0%; height: 1px; background-color: #fff; position: absolute; left: 0; bottom: 0; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; transition: width 0.3s;} #header .menu_bx .dep1 > a.on::before {width: 100%;} #header .menu_bx .dep1 > a span {display: none;} #header .menu_bx .dep2_wrap {display: none;} #header .menu_bx .dep2_wrap > li {margin-bottom: /*5px*/10px;} #header .menu_bx .dep2_wrap > li:first-child {padding-top: /*10px*/15px;} #header .menu_bx .dep2_wrap > li:last-child {margin-bottom: 0px; padding-bottom: 10px;} #header .menu_bx .dep2_wrap > li > a {font-size: 14px; color: #fff; font-style: italic; font-weight: 500; display: inline-block;} #header .menu_bx .btm_bx {padding: 0 20px 20px; position: absolute; box-sizing: border-box; bottom: 0; left: 0; width: 100%;} #header .menu_bx .btm_bx .l_bx {display: flex; flex-flow: wrap; border-top: 1px solid #fff; border-left: 1px solid #fff;} #header .menu_bx .btm_bx .l_bx li {width: 50%; box-sizing: border-box; border-right: 1px solid #fff; border-bottom: 1px solid #fff;} #header .menu_bx .btm_bx .l_bx li a {display: block; text-align: center; font-size: 11px; color: #fff; display:flex; justify-content:center; align-items:center; table-layout:fixed; height: 36px;} #header .menu_bx .btm_bx .l_bx li.en a {font-family: 'Poppins', sans-serif;} #header .menu_bx .btm_bx .mid {text-align: center; font-size: 11px; color: #fff; font-family: 'Poppins', sans-serif; margin-top: 20px;} #header .menu_bx .btm_bx .r_bx {display: none;} #header .h_menu {display: none!important;} /* footer */ #footer .slide_txt {font-size: 65px; animation: scrollTextF 10s infinite linear; height: 50px; line-height: 50px; top: 128px;} #footer .txt_bx {padding: 75px 0 30px;} /*#footer .txt_bx .name {font-size: 13px; line-height: 23px; width: 290px;}*/ #footer .txt_bx .name {font-size: 13px; width: 290px; line-height: 21px; padding-left: 24px; height: 23px;} #footer .txt_bx .name::before {height: 21px; background-size: auto 21px; width: 18px;} #footer .txt_bx .info_bx {width: calc(100% - 290px); padding: 0 40px 0 0;} #footer .txt_bx .info_bx li {font-size: 12px; line-height: 23px;} #footer .txt_bx .btm_txt {font-size: 12px; line-height: 19px;} #footer .txt_bx .top_btn {top: 80px; background-size: 25px auto; width: 25px; height: 33px;} #contact_quick {display: none!important; height: 100px;} #footer #contact_quick {display: flex!important; margin-bottom: 30px;} #contact_quick .con_bx strong {font-size: 18px; line-height: 40px; width: calc(100% - 310px);} #contact_quick .btn_bx {width: 310px;} #contact_quick .btn_bx li a {font-size: 12px; padding: 0 20px;} #contact_quick .btn_bx li a span {line-height: 38px;} #contact_quick .btn_bx li a span::before {height: 10px; width: 12px; background-size: auto 10px; margin-top: -5px;} #contact_quick_pop .pop_con {max-width: 450px;} #contact_quick_pop .ttl_bx {padding: 20px 25px 30px;} #contact_quick_pop .ttl_bx strong {font-size: 15px;} #contact_quick_pop .ttl_bx p {font-size: 12px; margin-top: 3px;} #contact_quick_pop .ttl_bx .bg_txt {font-size: 40px; bottom: -25px;} #contact_quick_pop .form_bx {padding: 20px 25px 30px;} #contact_quick_pop .form_bx .f_con .f_w {margin-top: 5px;} #contact_quick_pop .form_bx .f_con input {font-size: 11px; height: 35px; border-radius: 3px; width: calc(50% - 2.5px); margin-right: 5px; padding: 0 10px;} #contact_quick_pop .form_bx .f_con textarea {font-size: 11px; height: 100px; border-radius: 3px; margin-top: 5px; padding: 8px 10px;} #contact_quick_pop .form_bx .agree_bx {margin-top: 10px; padding-left: 27px;} #contact_quick_pop .form_bx .agree_bx input {width: 20px; height: 20px; background-size: 11px auto!important; background-position: center 5px!important;} #contact_quick_pop .form_bx .agree_bx label {font-size: 12px; line-height: 20px;} #contact_quick_pop .form_bx .agree_bx label span {line-height: 19px;} #contact_quick_pop .form_bx .btn {margin-top: 20px; font-size: 12px; padding: 0 20px;} #contact_quick_pop .form_bx .btn span {line-height: 38px;} #contact_quick_pop .form_bx .btn span::before {width: 16px; height: 10px; margin-top: -5px; background-size: auto 10px;} /* s_visual */ #s_visual .tab_box {position: absolute; left: 110px; top: 23px; width: calc(100% - 140px); box-sizing: border-box;} #s_visual .tab_box .on_txt {font-size: 14px; color: #ed4130; font-weight: 600; word-break: keep-all; font-family: 'Poppins', sans-serif; cursor: pointer; padding-right: 15px; position: relative; display: inline-block!important;} #s_visual .tab_box .on_txt::before {content: ''; width: 9px; height: 6px; background: url(../images/icon/arrow3.png) no-repeat center; position: absolute; right: 0; top: 50%; margin-top: -3px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;} #s_visual .tab_box .on_txt.on::before {transform: rotate(180deg);} #s_visual .tab_box .on_txt span {display: inline-block; line-height: 18px; border-bottom: 2px solid #ed4130; box-sizing: border-box;} #s_visual .tab_box .dep2_wrap {position: absolute; top: 30px; background-color: #ffffff; padding: 0 19px; box-sizing: border-box; box-shadow: 0 12px 26px rgba(0,0,0,0.1); display: none; min-width: 140px;} #s_visual .tab_box .dep2_wrap > li {margin-bottom: 4px;} #s_visual .tab_box .dep2_wrap > li:first-child {padding-top: 12px;} #s_visual .tab_box .dep2_wrap > li:last-child {margin-bottom: 0; padding-bottom: 13px;} #s_visual .tab_box .dep2_wrap > li > a {font-size: 14px; color: #a0a0a0; font-weight: 600; word-break: keep-all; font-family: 'Poppins', sans-serif; display: inline-block; line-height: 25px;} } /* 모바일 */ @media all and (max-width:768px){ .pc_show2 {display: none!important;} .m_show2 {display: block!important;} /* footer */ #footer .slide_txt {top: 164px; font-size: 50px; line-height: 40px; height: 40px;} #footer .txt_bx {padding-top: 61px;} #footer .txt_bx .name {width: 100%;} #footer .txt_bx .info_bx {width: 100%; margin-top: 20px} #footer .txt_bx .info_bx li {width: 100%; line-height: 19px; margin-bottom: 3px; margin-right: 0;} #footer .txt_bx .info_bx li:last-child {margin-bottom: 0;} #footer .txt_bx .btm_txt {margin-top: 15px;} #footer .txt_bx .top_btn {top: 62px;} #contact_quick {height: auto;} #contact_quick .con_bx {justify-content:center; padding: 20px 0 25px} #contact_quick .con_bx strong {width: 100%; text-align: center;} #contact_quick .btn_bx {width: 100%; max-width: 300px; margin-top: 10px;} #contact_quick .btn_bx li {width: calc(50% - 5px); margin-right: 10px; margin-left: 0;} #contact_quick .btn_bx li:nth-child(2n) {margin-right: 0;} #contact_quick_pop .form_bx .f_con input {width: 100%; margin-bottom: 5px; margin-right: 0;} #contact_quick_pop .form_bx .f_con input:last-child {margin-bottom: 0;} }