''''@charset "utf-8"; /*─────────────────────────────────────────────────────────── header, footer, main 관련 작성 css 파일입니다. ** 이와 서브페이지 관련 css는 /css/sub.css 에 있습니다. ───────────────────────────────────────────────────────────*/ .clear:after {content:'';display:block;clear:both;} .fl {float:left;} .fr {float:right;} .ta_c {text-align:center;} .ta_l {text-align:left;} .ta_r {text-align:right;} .dis_table {display:table; table-layout:fixed;width:100%; margin:0;border-collapse:collapse;} .dis_inb {display:inline-block;} .dn{display:none;} /*체크박스*/ input[type="checkbox"] {display:none;} input[type="checkbox"] + label {cursor:pointer;font-size:14px;} input[type="checkbox"] + label:before, input[type="checkbox"] + label::before {display:inline-block;content:"";width:24px;height:24px;margin:-2px 13px 0 0;vertical-align:middle;background:url("../images/sub/chk-off.png") left top no-repeat;cursor:pointer; background-size:100% !important;} input[type="checkbox"]:checked + label:before, input[type="checkbox"]:checked + label::before {background:url("../images/sub/chk-on.png") left top no-repeat;} /*radio*/ .radio_box{display:inline-block;} input[type="radio"] {display:none;} input[type="radio"] + label {cursor:pointer; margin-right:26px;} input[type="radio"] + label:before, input[type="radio"] + label::before {display:inline-block;content:"";width: 24px;height: 24px;margin: -2px 10px 0 20px;vertical-align:middle;background:url('../images/sub/radio-off.png') left top no-repeat;cursor:pointer; background-size:100% !important;} input[type="radio"]:checked + label:before, input[type="radio"]:checked + label::before {background:url('../images/sub/radio-on.png') left top no-repeat;} input[type="radio"] + label:first-of-type:before, input[type="radio"] + label:first-of-type::before {margin-left:0;} /*textarea*/ textarea {font-size:12px;color:#666;border:1px solid #ddd;box-sizing:border-box;margin:0;padding:0 10px;vertical-align:middle;text-align:left;border-radius:0;} textarea:focus{outline:none;} /*button*/ .btn_center {text-align:center;font-size:0;} .btn_center a {margin:0;} .btn_center button + button, .btn_center a + button, .btn_center button + a, .btn_center a + a, .btn_wrap button + button, .btn_wrap a + button, .btn_wrap button + a, .btn_wrap a + a{margin-left:20px;} .btn_center input {margin-top:-10px;} .btn_right a {font-size:15px;font-weight:700;} .btn, .btn_sm, .btn_bbs_go {font-weight:700;border-style:solid;border-width:1px;padding:0;margin:0;text-indent:0;vertical-align:top;text-align:center;display:inline-block;box-sizing:border-box;cursor:pointer;box-shadow:none;outline:0 !important;font-family:'Pretendard', 'Malgun Gothic', '맑은 고딕', dotum, sans-serif;} .btn_sm{height:50px;line-height:48px;font-size:18px;color:#333;font-weight:400;letter-spacing:-0.54px;padding:0 19px;margin-left:10px;} .btn, .btn:hover {width:200px;height:60px;line-height:58px;font-size:20px;color:#fff;font-weight:500;letter-spacing:-0.8px;box-sizing:border-box;} .btn_basic, .btn_basic:hover {border-color:#333 !important;background-color:#fff !important;color:#333 !important;} .btn_point, .btn_point:hover {border-color:#0076bd !important;background-color:#0076bd !important;} .btn_outline, .btn_outline:hover {border-color:#0076bd !important;background-color:#fff !important; color:#0076bd !important;} .btn_sm, .btn_sm:hover {border-color:#333 !important;background-color:#fff !important;color:#333 !important;} .btn_reset {background:none;line-height:48px;} .btn_reset, .btn_reset:hover{background:none;} .board_search .btn, .board_search .btn:hover {width:60px;height:34px;color:#fff;line-height:32px;font-size:13px;} @media only screen and (max-width:1200px){ .btn, .btn:hover{width:160px;height:50px;line-height:50px;font-size:18px;} .btn_sm{font-size:16px;} } @media only screen and (max-width:860px){ .btn_sm{height:42px;line-height:41px;} /*체크박스*/ input[type="checkbox"] + label:before, input[type="checkbox"] + label::before {width:20px;height:20px;margin-right:8px;} /*radio*/ input[type="radio"] + label:before, input[type="radio"] + label::before {width:20px;height:20px;margin-right:8px;} } @media only screen and (max-width:767px){ .btn_sm{height:40px;line-height:38px; font-size:15px;} } @media only screen and (max-width:640px){ .btn_sm{font-size:14px;padding:0 10px;margin-left:5px;} .btn_center.betwn{display:flex; justify-content:space-between;} .btn_center.betwn a{width:100%;} } @media only screen and (max-width:500px){ .btn_center{font-size:0;width:100%;} .btn_center > button, .btn_center > a, .btn_wrap > button, .btn_wrap > a{display: inline-block;box-sizing:border-box;width:calc(50% - 5px);} .btn_center button + button, .btn_center a + button, .btn_center button + a, .btn_center a + a, .btn_wrap button + button, .btn_wrap a + button, .btn_wrap button + a, .btn_wrap a + a{margin-left:10px;} .btn, .btn:hover{width:100%;height:45px;line-height:45px;font-size:16px; min-width:80px;} } @media only screen and (max-width:375px){ .btn, .btn:hover{font-size:15px;} /*체크박스*/ input[type="checkbox"] + label:before, input[type="checkbox"] + label::before {width:18px;height:18px;margin-right:6px;} /*radio*/ input[type="radio"] + label:before, input[type="radio"] + label::before {width:18px;height:18px;margin-right:6px;} } @media only screen and (max-width:365px){ .btn_sm {font-size:13px;} } @media only screen and (max-width:320px){ .btn_center > button, .btn_center > a, .btn_wrap > button, .btn_wrap > a{width:calc(50% - 3.5px);} .btn_center button + button, .btn_center a + button, .btn_center button + a, .btn_center a + a, .btn_wrap button + button, .btn_wrap a + button, .btn_wrap button + a, .btn_wrap a + a{margin-left:0;} .btn_center.betwn a {width: calc(33.32% - 3.5px);min-width: calc(33.32% - 3.5px);} .btn, .btn:hover{font-size:14px;} .btn_sm {font-size:12px;height:35px;line-height:33px;padding-left:5px;padding-right:5px;} } /*─────────────────────────────────────────────────────────── layout common ───────────────────────────────────────────────────────────*/ #wrap {position:relative;height:100%;width:100%;margin:0;padding:0; overflow:hidden;} /* #header 와 #container, #footer 전체 감싸는 영역 */ #wrap #header {width:100%;overflow: visible;} #wrap #container {width:100%;margin:0;padding:0;} #wrap #footer {width:100%;margin:0;} /* #container 안의 레이아웃 */ #contents_wrap {width:100%;max-width:1330px;margin:0 auto;padding:0 15px;position:relative;z-index:1;box-sizing:border-box;} /* #container 안의 컨텐츠 감싸는 영역 */ #contents_wrap.member_contents {max-width:100%;} #contents_wrap #side_box {width:100%;padding:110px 0 0 0;box-sizing:border-box;} /* lnb 감싸는 영역 */ #contents_wrap #contents_box {width:100%;padding:140px 0 180px 0;box-sizing:border-box;} /* 컨텐츠를 감싸는 영역 */ #contents_wrap #side_box + #contents_box {padding-top:0;} /* lnb와 컨텐츠가 float 일때 사이즈 재설정 */ /* navigation layout */ #contents_wrap .nav_wrap {box-sizing:border-box;} /* #content */ #content {width:100%;margin:0;padding:0;text-align:left;box-sizing:border-box;} /* navigation 을 제외한 컨텐츠 */ #content .sub_content{width:100%;margin:0 auto;background:#fff;box-sizing:border-box;} #content .sub_content:after {clear:both;content:"";display:block;} /* 컨텐츠 전체 가로 사이즈 */ .w_custom {width:100%;max-width:1330px;text-align:left;margin:0 auto;padding:0 15px;box-sizing:border-box; position:relative;} @media only screen and (max-width:1317px) { body.on {height:100%;overflow:hidden;} } @media only screen and (max-width:1200px) { } @media only screen and (max-width:1024px) { #contents_wrap #side_box {padding: 85px 0 0 0;} #contents_wrap #contents_box{padding:9.5% 0 120px;} } @media only screen and (max-width:860px) { #contents_wrap #side_box {padding: 85px 0 0 0;} } @media only screen and (max-width:767px) { /*.w_custom {padding-left:4% !important;padding-right:4% !important;}*/ #contents_wrap #side_box {display:none;} .sub_goods #contents_wrap #side_box {display:block;padding:0;} } @media only screen and (max-width:640px) { } @media only screen and (max-width:479px) { } @media only screen and (max-width:320px) { #contents_wrap, .w_custom {padding:0 10px;} } /*─────────────────────────────────────────────────────────── 메인 상품 진열 ───────────────────────────────────────────────────────────*/ /* 메인상품진열 - 공통 */ .main .list_cont {} .main .list_cont ul {font-size:0;width:calc(100% + 15px);margin-left:-15px;} .main .list_cont ul li {display:inline-block;margin-left:15px;vertical-align:top;} .main .list_cont ul li a {display:block;height:100%;} .main .list_cont ul li .thumb {} .main .list_cont ul li .thumb img {max-width:100%;width:100%;} .main .list_cont ul li .info {} .main .list_cont ul li .info p {color:#333;line-height:1.2;} .main .list_cont ul li .info .name {font-size:14px;} /* 메인상품진열 - 갤러리형 */ .main .list_Galleryform {} .main .list_Galleryform ul {text-align:left;} .main .list_Galleryform ul li {width:calc(25% - 15px);} .main .list_Galleryform ul li:nth-of-type(n+5) {margin-top:40px;} .main .list_Galleryform ul li .thumb {} .main .list_Galleryform ul li .thumb img {} .main .list_Galleryform ul li .info {margin-top:10px;} .main .list_Galleryform ul li .info p {} .main .list_Galleryform ul li .info .name {} /* 메인상품진열 - 리스트형 */ .main .list_Listform {} .main .list_Listform ul {} .main .list_Listform ul li {width:calc(50% - 15px);} .main .list_Listform ul li a {width:100%;display:table;} .main .list_Listform ul li:nth-of-type(n+3) {margin-top:40px;} .main .list_Listform ul li .thumb, .main .list_Listform ul li .info {display:table-cell;vertical-align:middle;width:50%;box-sizing:border-box;} .main .list_Listform ul li .thumb {} .main .list_Listform ul li .thumb img {} .main .list_Listform ul li .info {border:1px solid #ddd;padding:0 15px;} .main .list_Listform ul li .info p {} .main .list_Listform ul li .info .name {} @media only screen and (max-width:860px) { /* 메인상품진열 - 갤러리형 */ .main .list_Galleryform ul li {width:calc(50% - 15px);} .main .list_Galleryform ul li:nth-of-type(n+3) {margin-top:40px;} /* 메인상품진열 - 리스트형 */ .main .list_Listform ul li {width:calc(100% - 15px);} .main .list_Listform ul li:nth-of-type(n+2) {margin-top:40px;} } /*─────────────────────────────────────────────────────────── sub custom ───────────────────────────────────────────────────────────*/ /*** company/history (연혁) ***/ /* 연도 */ .sub_history.history1 .history_box .his_year .year strong {background:#4aabe6;} /* 원 */.sub_history.history1 .history_box .his_year .year::before {background-color:#4aabe6;} /* 삼각형 */.sub_history.history1 .history_box .his_year .year strong::after {border-bottom:12px solid #4aabe6;border-color:#4aabe6 !important;} /*** company/history2 (연혁2) ***/ /* 연도 */ .sub_history.history2 .history_box .his_year .year strong {color:#4aabe6;} .sub_history.history2 .history_box .his_year .year strong::before {background:#4aabe6;} .sub_history.history2 .history_box .his_year .year strong::after {border-color:#4aabe6;} /*** company/history3 (연혁3) ***/ /* 연도 */ .sub_history.history3 .history_box table.history span {color:#49abe6;} /*** company/work (조직도1번) ***/ .sub_chart.chart1 .chart .chart_box h3 + h3 {background:#ffa531;} /*** company/work (조직도2번) ***/ /* :before 요소는 라인, :after 요소는 원형 */ .sub_chart.chart2 .chart h3 {box-shadow:0 0 0 20px #f2fafd;border:2px #0095da solid;} .sub_chart.chart2 .chart h3:before{border-color:#0095da;} .sub_chart.chart2 .chart h4{border-color:#0095da;0 0 0 8px #f2fafd;} .sub_chart.chart2 .chart h3:after, .sub_chart.chart2 .chart h4:after, .sub_chart.chart2 .chart li.chart_side li h5:after{border-color:#0095da;} @media only screen and (max-width:479px) { /* 삼각형 */.sub_history.history1 .history_box .his_year .year strong::after {border-bottom:8px solid #4aabe6;} } /*─────────────────────────────────────────────────────────── HEADER | outline/header.html, outline/nav.html ───────────────────────────────────────────────────────────*/ .skip_nav {position:relative;z-index:9999;} .skip_nav a {display:block;height:1px;width:1px;margin-bottom:-1px;overflow:hidden;font-size:12px;color:#fff;font-weight:bold;white-space:nowrap;text-align:center;} .skip_nav a:focus, .skip_nav a:active {height:auto;width:100%;padding:0;margin-bottom:0;position:absolute;left:0;top:0;} #header {left:0;top:0;height: auto;border:0;text-align:center;position:fixed;z-index:10;width:100%;box-sizing:border-box;font-size:0;border-bottom: 0;background:#fff; transition:all 0.4s;} #header:before{position:absolute;content:'';width:100%;height:1px;background:#ccc;top:100%;left:0;z-index: 99;} #header.on {box-shadow:0 0 8px rgba(0, 0, 0, 0.12);} #header .w_set {width:100%;box-sizing:border-box;max-width:1180px;padding:0;margin:0 auto;} #header .w_set2 {position:relative;} #header .header_cont{position:relative;width: 1740px;margin:0 auto;display: flex;height: 80px;align-items: center;} #header .hd_logo {z-index:15;width: 174px;height: 41px;margin-right: 63px;} #header .hd_logo a {background: url('../images/skin/hd_logo.png') no-repeat left;font-size: 0;display: block;height: 100%;background-size: 100% auto;} #header .hd_lnb {position:relative; margin:0;padding:0;font-size:0;width: calc(100% - 231px);padding-right: 200px;vertical-align:top;text-align: left;display:inline-block;box-sizing:border-box;z-index:10;height: 100%;} #header .hd_lnb:before{display:block;position:absolute;content:'';width:300vw;height: 0;background:#fff;top: calc(100% + 1px);left:-50%;transform:translateX(-50%); box-shadow:3px 3px 5px rgb(0,0,0,0.1);transition:all 0.7s;} #header .hd_lnb li, #header .hd_lnb li a {padding:0;line-height: 2;font-size: 18px;font-weight: 400;color:#222;vertical-align: middle;text-align:center;display:inline-block;box-sizing:border-box;transition: all .2s;font-family: 'Poppins', 'Pretendard', sans-serif;letter-spacing: 0;} #header .hd_lnb li {padding: 0 36px;position:relative;height: 100%;} #header .hd_lnb > li > a {padding:0;position:relative;z-index:1;display: flex;align-items: center;height: 100%;} #header .hd_lnb > li > a:after{clear:both;transition:0.5s;width:0;height: 1px;background: #000;position:absolute;left: 50%;bottom: 25px;transform: translateX(calc(-50% - 0.5px));margin-top:0;content:"";display:inline-block;} #header .hd_lnb li a.on:after{width:100%;} #header .hd_lnb li .hd_lnb_dep2 {z-index: 55;display:none;position:absolute;left: 0;background: #fff0;top: calc(100% + 1px);width: max-content;height: 100%;} #header .hd_lnb li .hd_lnb_dep2 > li{display:block;height: 100%;display: inline-flex;align-items: center;} #header .hd_lnb li .hd_lnb_dep2 > li > a{color: #888;} #header .hd_right {top:50%;right: 0;margin:0;padding:0;font-size:0;position:absolute;vertical-align:top;text-align:center;display:inline-block;box-sizing:border-box;z-index:15;transform: translateY(calc(-50% - 0.5px));} #header .hd_right .hd_gnb, #header .hd_right .hd_lang, #header .hd_right .menu-trigger {display:inline-block;vertical-align:middle;} #header .hd_right .hd_lang {margin-right:30px;} #header .hd_right .hd_lang li, #header .hd_right .hd_lang li a {line-height: 1;padding:0;font-size:14px;font-weight:400;color:#888;vertical-align:top;text-align:center;display:inline-block;box-sizing:border-box;} #header .hd_right .hd_lang li {} #header .hd_right .hd_lang li + li a {padding:0 0 0 30px;} #header .hd_right .hd_lang li, #header .hd_right .hd_lang li a {line-height: 1;padding:0;font-size:14px;font-weight:400;color:#888;vertical-align:top;text-align:center;display:inline-block;box-sizing:border-box;} #header .hd_right .hd_gnb {} #header .hd_right .hd_gnb li, #header .hd_right .hd_gnb li a {line-height: 1;padding:0;font-size: 16px;font-weight: 400;color:#888;vertical-align:top;text-align:center;display:inline-block;box-sizing:border-box;} #header .hd_right .hd_gnb li {} #header .hd_right .hd_gnb li + li{margin-left:30px;} #header .hd_right .menu-trigger {display:none; position:relative;padding:0;width: 30px;height: 25px;box-sizing: border-box;margin-left: 30px;} #header .hd_right .menu-trigger span {transition:0.3s;position:absolute;width: 100%;height:2px;background-color: #333;left: 0;} #header .hd_right .menu-trigger span:nth-of-type(1) {top: 0;} #header .hd_right .menu-trigger span:nth-of-type(2) {top: 50%;margin-top: -1px;} #header .hd_right .menu-trigger span:nth-of-type(3) {bottom: 0;} #header .scroll_top{opacity:0; position:fixed;right:20px;bottom:-30px;font-size:0;background:#0076bd url('../images/skin/scroll_top_arrow.png') no-repeat center; background-size:14px auto; border-radius:100%;width: 58px;height: 58px;box-shadow: 0 5px 15px rgba(0,0,0,0.25); transition:all 0.4s; cursor:pointer;} #header.on .scroll_top{opacity:1; bottom:30px;} #header.end .scroll_top{opacity:0 !important; bottom:-30px !important;} #header .scroll_top a{display:block; width:100%; height:100%;} /* hover */ @media only screen and (min-width:1024px){ #header .hd_lnb > li > a:hover:after{width:100%;} #header .hd_lnb li .hd_lnb_dep2 > li > a:hover{color:#111;} #header .hd_lnb.on:before{height: 100%;/* top:calc(100% + 1px); */transition:all 0.4s;} } /* main header */ .main_index #container{padding-top:0 !important;} #header.hd_main{background:transparent;} #header.hd_main:before{display:none;} #header.hd_main .hd_lnb:before{height:0;} #header.hd_main .hd_logo a {background: url('../images/skin/hd_logo_wh.png') no-repeat left;background-size: 100% auto;} #header.hd_main .hd_lnb > li > a {color:#fff;} #header.hd_main .hd_right .hd_lnb li, #heade.hd_mainr .hd_right .hd_lnb li a{transition:0.3s;color:#fff;} #header.hd_main .hd_right .hd_lnb li a:after{background:#fff;} #header.hd_main .hd_right .hd_lang li a {color:#fff;} #header.hd_main .hd_right .hd_gnb li a {color:#fff;} #header.hd_main .hd_right .hd_lnb li a:after {background:#fff;} #header.hd_main .hd_right .menu-trigger span {background:#fff;} @media only screen and (min-width:1024px){ #header.over{background:#fff;} #header.over:before{display:block;} #header.over .hd_lnb.on:before{height:100%;} #header.over .hd_logo a {background: url('../images/skin/hd_logo.png') no-repeat left;background-size: 100% auto;} #header.over .hd_lnb > li > a{color:#333;} #header.over .hd_right .hd_gnb li a{color:#666;} } @media only screen and (max-width:479px){ #header .scroll_top{width:40px;height:40px;} } /* aside */ #aside {top:0px;right: -100%;width: 100%;max-width:500px;transition:0.8s;height:100%;box-sizing:border-box;box-sizing:border-box;position:fixed;background: #fff;z-index:99;} #aside.on {right: 0%;} .aside_bg {left:0px;top:0px;bottom:0;right:0;width:100%;height:100%;background:rgba(0,0,0,0.6);opacity:0;transition:0.8s;z-index:50;position:fixed;display:none;} .aside_bg.on {opacity:1;display:block;} #aside .aside_box .btn_aside_close {position:absolute;right:60px;top:30px;width:32px;height:32px;cursor:pointer;} #aside .aside_box .btn_aside_close .menu-trigger2.active-1 {width:100%;height:100%;} #aside .aside_box .btn_aside_close .menu-trigger2.active-1 span {transition:0.3s;position:absolute;width:100%;height: 1px;background-color: #000;left:0;top:14px;} #aside .aside_box .btn_aside_close .menu-trigger2.active-1 span:nth-of-type(1) {-webkit-transform:translateY (0) rotate (-45deg);transform:translateY(0) rotate(-45deg);} #aside .aside_box .btn_aside_close .menu-trigger2.active-1 span:nth-of-type(2) {opacity:0;} #aside .aside_box .btn_aside_close .menu-trigger2.active-1 span:nth-of-type(3) {-webkit-transform:translateY(0) rotate(45deg);transform:translateY(0) rotate(45deg);} #aside .aside_box {} #aside .aside_box .aside_logo {text-align:center;margin-bottom:58px;} #aside .aside_box .aside_logo a {display:block;background:url('../images/skin/hd_logo.png') no-repeat center;font-size:0;height:30px;background-size:auto 100%;} #aside .aside_box {width:100%;height:100%;margin:0;padding: 56px 30px;overflow-y:auto;position:relative;z-index:1;box-sizing:border-box;display:block;} #aside .aside_box .btn_aside_close {right: 25px;top:15px;width:25px;height:25px;} #aside .aside_box .aside_logo {text-align:left;margin-bottom:22px;display: none;} #aside .aside_box .aside_logo a {display:block;background:url('../images/skin/hd_logo.png') no-repeat left;font-size:0;height:20px;background-size:auto 100%;} #aside .aside_box .aside_gnb {text-align:left;display:block;} #aside .aside_box .aside_gnb li {display:inline-block;vertical-align:middle;} #aside .aside_box .aside_gnb li + li {margin-left:23px;} #aside .aside_box .aside_gnb li a {display:block;font-size: 20px;font-weight: 600;color: #222;} #aside .aside_box .aside_search {margin:40px 0 28px;height:40px;background:#fff;position:relative;display:block;display: none;} #aside .aside_box .aside_search .search_input {width:100%;padding:0 10px;box-sizing:border-box;color:#333;font-size:13px;border:none;line-height:40px;} #aside .aside_box .aside_search .search_enter {width:24px;height:24px;background:url('../images/skin/aside_search.png') no-repeat 0 0;position:absolute;right:15px;top:50%;margin-top:-12px;background-size:auto 100%;font-size: 0;border: 0;} #aside ul.slidemenu {padding: 54px 0 50px 0;} #aside ul.slidemenu li.on > .icons {background:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),transparent;background-position:center;background-size:100% 1px,0 100%;background-repeat:no-repeat;} #aside ul.slidemenu .depth1_li {text-align:left;display:block;vertical-align:top;font-size:0;border-bottom: 0;position:relative;} #aside ul.slidemenu .depth1_li + .depth1_li {margin-top:0;margin-left:0;} #aside ul.slidemenu .depth1_li a, #aside ul.slidemenu .depth1_li .icons {display:inline-block;vertical-align:middle;} #aside ul.slidemenu .depth1_li a {width: calc(100% - 14px);font-family: 'Poppins', 'Pretendard', sans-serif;} #aside ul.slidemenu .depth1_li .depth1_a {transition:0.2s;padding: 0 15px 0 0;line-height: 3;font-size: 18px;font-weight: 500;color: #222;box-sizing: border-box;} #aside ul.slidemenu .depth1_li .icons {width: 14px;height:7px;background:url('../images/skin/aside_cate_off.png') no-repeat center;background-size:100%; cursor:pointer;} #aside ul.slidemenu .depth1_li.on .icons {width: 14px;height:7px;background:url('../images/skin/aside_cate_on.png') no-repeat center;background-size:100%;} #aside ul.slidemenu .depth1_li .depth1_a.now {background:url('../images/skin/aside_cate_on.png') no-repeat 97%;background-size:auto 8px;} #aside ul.slidemenu .depth1_li .depth {padding: 13px 15px 40px;display:none;border:0;border-bottom: 0;} #aside ul.slidemenu .depth1_li .depth li {padding-left:0;position:relative;} #aside ul.slidemenu .depth1_li .depth li + li {margin-top: 19px;} #aside ul.slidemenu .depth1_li .depth li a {font-size:16px;line-height:16px;color: #666;font-weight: 300;position:relative;padding-left: 0;} #aside ul.slidemenu .depth1_li .depth li:before {content:"";display:block;width:2px;height:2px;position:absolute;left:0;top:8px;background:#18b3e5;display: none;} @media only screen and (max-width:1770px) { #header .header_cont{width:calc(100% - 30px);} #header .hd_lnb li{padding: 0 2.1vw;} } @media only screen and (max-width:1500px) { #header .hd_logo{width:150px; margin-right:40px;} #header .hd_lnb{width:calc(100% - 190px); padding-right:155px;} #header .hd_lnb li, #header .hd_lnb li a{font-size:17px;} } @media only screen and (max-width:1300px) { #header .hd_lnb li{position:static;} } @media only screen and (max-width:1217px) { #header .hd_logo{width:130px; margin-right:20px;} #header .hd_lnb{width:calc(100% - 150px); padding-right:130px;} #header .hd_lnb li, #header .hd_lnb li a{font-size:16px;} } @media only screen and (max-width:1024px) { #header{border-bottom:1px solid #ccc;} #header:before{display:none;} #header .hd_lnb, #header .hd_right .hd_gnb{display:none;} #header .hd_right .menu-trigger{display:inline-block;} .main_index #header{background:#fff0; border-color:rgba(255,255,255,0.1);} .main_index #header.on{background:#fff; border-color:#ccc;} .main_index #header .hd_logo a{background-image:url('../images/skin/hd_logo_wh.png');} .main_index #header.on .hd_logo a{background-image:url('../images/skin/hd_logo.png');} .main_index #header .hd_right .menu-trigger span{background-color:#fff;} .main_index #header.on .hd_right .menu-trigger span{background-color:#333;} #header .scroll_top{display:inline-flex;} } @media only screen and (max-width: 980px) { } @media only screen and (max-width:860px) { } @media only screen and (max-width:767px) { } @media only screen and (max-width:640px) { #header .header_cont{height:70px;} } @media only screen and (max-width:479px) { #header .header_cont{height:60px;} #header .hd_logo{width:112px;} #header .hd_right .menu-trigger{width:20px; height:17px;} #header .hd_right .menu-trigger span{height:1px;} } /*─────────────────────────────────────────────────────────── FOOTER | outline/footer.html ───────────────────────────────────────────────────────────*/ .ftr_board{border-top:1px solid #ddd;} .ftr_board .w_custom{display:flex;height: 110px;height: 11.86vh;align-items:center;justify-content:space-between;box-sizing:border-box;} .ftr_board dl{width:50%;display:flex;align-items: center; height:100%;} .ftr_board dl dt{/* font-size:28px; */font-size: 3vh;font-weight:bold;color:#222;padding:0 15px;box-sizing:border-box;} .ftr_board dl dd{position:relative; font-size:16px; font-weight:400; color:#333; padding-left:50px; box-sizing:border-box; height:100%;} .ftr_board dl dd:before{position:absolute; content:''; width:1px; height:20px; background:#ddd; top:50%; left:0; transform:translateY(-50%);} .ftr_board dl dd a{display:block; font-size:inherit; font-weight:inherit; color:inherit;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .ftr_board dl dd a p{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .ftr_board dl dd .more{position:absolute; top:50%; right:0; transform:translateY(-50%); width:55px; height:55px; border:1px solid #ccc; border-radius:100%; box-sizing:border-box; background:#fff url('../images/skin/board_more_icon.png') no-repeat center; transition:all 0.4s;} .ftr_board .faq .more{right:20px;} .ftr_board .faq dt{width:106px; padding-left:0;} .ftr_board .faq dd{width:calc(100% - 106px);} .ftr_board .notice dt{width:155px;} .ftr_board .notice dd{width:calc(100% - 155px);} .ftr_board .bbs_slide_wrap {position:relative;overflow:hidden;padding:38px 0;width:calc(100% - 100px);height:100%;box-sizing:border-box;} .ftr_board .swiper{position:relative;overflow:hidden;padding:0;width:100%;height:100%;box-sizing:border-box;} .ftr_board .swiper .swiper-wrapper{flex-direction:column;} .ftr_board .swiper .swiper-slide .txt{display:inline-flex; align-items:center; height:100%; width:100%;overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } @media only screen and (min-width:1024px){ .ftr_board dl dd .more:hover{border-color:#0076bd; background:#0076bd url('../images/skin/board_more_icon_on.png') no-repeat center;} } #footer{background:#03121b; padding:80px 0;} #footer .logo{font-size:0; margin-bottom:60px;} #footer .cont{display:flex;} #footer .ftr_info{width:480px; padding-right:15px; box-sizing:border-box;} #footer .ftr_info .info_list{} #footer .ftr_info .info_list + .sns_list{margin-top:57px;} #footer .ftr_info .info_list li{} #footer .ftr_info .info_list li + li{margin-top:20px;} #footer .ftr_info .info_list li dl{display:flex;} #footer .ftr_info .info_list li dl dt, #footer .ftr_info .info_list li dl dd{font-size:16px;font-family: 'Poppins', 'Pretendard', sans-serif;} #footer .ftr_info .info_list li dl dt{font-weight:500; color:#fff} #footer .ftr_info .info_list li dl dt + dd{padding-left:8px;} #footer .ftr_info .info_list li dl dd{font-weight:300; color:#aaa;} #footer .ftr_info .info_list li dl dd a{font-size:inherit; font-weight:inherit; color:inherit;} #footer .ftr_info .sns_list{display:flex;} #footer .ftr_info .sns_list li{} #footer .ftr_info .sns_list li + li{margin-left:10px;} #footer .ftr_info .sns_list li a{display:inline-flex;align-items: center;justify-content:center;width:40px;height:40px;border:1px solid rgba(255,255,255,0.2);border-radius:100%;box-sizing:border-box;} #footer .ftr_lnb{width:calc(100% - 480px);display:inline-flex;justify-content: space-between;} #footer .ftr_lnb > li{} #footer .ftr_lnb > li > a{font-size:20px;font-weight:600;color:#fff;line-height: 1;} #footer .ftr_lnb .ftr_lnb_dep2{margin-top:24px;} #footer .ftr_lnb .ftr_lnb_dep2 > li{} #footer .ftr_lnb .ftr_lnb_dep2 > li + li{margin-top:22px;} #footer .ftr_lnb .ftr_lnb_dep2 > li > a{font-size:16px; font-weight:400; color:#aaa;} #footer .ftr_btm{border-top:1px solid rgba(255,255,255,0.2); padding-top:36px; margin-top:58px; display:flex; justify-content:space-between; align-items:center;} #footer .ftr_btm .copyright{font-size:15px; font-weight:400; color:#888;} #footer .ftr_btm .copyright strong{font-weight:600; color:#ccc;} #footer .ftr_btm .copyright a{font-size:inherit; font-weight:inherit; color:inherit;} #footer .ftr_btm .ftr_gnb{display:inline-flex; padding-left:15px;} #footer .ftr_btm .ftr_gnb li{} #footer .ftr_btm .ftr_gnb li + li{margin-left:35px;} #footer .ftr_btm .ftr_gnb li a{font-size:16px; font-weight:400; color:#ccc;} #footer .ftr_btm .ftr_gnb li a strong{font-size:inherit; font-weight:500; color:#fff;} @media only screen and (max-width:1317px){ .ftr_board .faq .more{right:15px;} #footer .ftr_info{width:38%;} #footer .ftr_lnb{width:62%;} #footer .ftr_lnb > li > a{font-size:19px;} #footer .ftr_lnb .ftr_lnb_dep2 > li + li{margin-top:15px;} #footer .ftr_lnb .ftr_lnb_dep2 > li > a{font-size:15px;} } @media only screen and (max-width:1200px){ #footer .ftr_info .info_list li dl dt, #footer .ftr_info .info_list li dl dd{font-size:15px;} #footer .ftr_lnb > li > a{font-size:18px;} #footer .ftr_btm .ftr_gnb li a{font-size:15px;} } @media only screen and (max-width:1023px){ .ftr_board .w_custom{height:90px;} .ftr_board dl dt{font-size:21px;} .ftr_board dl dd{font-size:15px; padding-left:30px;} .ftr_board dl dd .more{width:45px; height:45px; background-size:18px auto;} .ftr_board .faq dt{width:70px;} .ftr_board .faq dd{width:calc(100% - 70px);} .ftr_board .notice dt{width:110px;} .ftr_board .notice dd{width:calc(100% - 110px);} .ftr_board .bbs_slide_wrap {padding:35px 0;width:calc(100% - 80px)} #footer .logo{margin-bottom:50px;} #footer .cont{display:block;} #footer .ftr_info{width:100%; padding-right:0;} #footer .ftr_info .info_list + .sns_list{margin-top:0;} #footer .ftr_info .info_list li + li{margin-top:15px;} #footer .ftr_info .sns_list{position:absolute; top:0; right:15px;} #footer .ftr_lnb{width:100%; margin-top:50px;} #footer .ftr_lnb .ftr_lnb_dep2{margin-top:20px;} #footer .ftr_lnb .ftr_lnb_dep2 > li + li{margin-top:10px;} } @media only screen and (max-width:860px){ .ftr_board .w_custom{height:75px;} .ftr_board dl dt{font-size:19px;} .ftr_board dl dd{font-size:14px;padding-left: 20px;} .ftr_board dl dd .more{width:40px; height:40px; background-size:16px auto;} .ftr_board .faq dt{width: 55px;} .ftr_board .faq dd{width: calc(100% - 55px);} .ftr_board .notice dt{width: 100px;} .ftr_board .notice dd{width: calc(100% - 100px);} .ftr_board .bbs_slide_wrap {padding:28px 0;width:calc(100% - 80px)} } @media only screen and (max-width:767px){ .ftr_board .w_custom{height:70px;} .ftr_board .bbs_slide_wrap {padding:25px 0;} .ftr_board dl dt{font-size:17px;} .ftr_board dl dd .more{width:35px; height:35px; background-size:14px auto;} #footer .logo{width:171px;} #footer .ftr_info .info_list li dl dt, #footer .ftr_info .info_list li dl dd{font-size:14px;} #footer .ftr_lnb > li > a{font-size:17px;} #footer .ftr_lnb .ftr_lnb_dep2{margin-top:15px;} #footer .ftr_lnb .ftr_lnb_dep2 > li + li{margin-top:8px;} #footer .ftr_lnb .ftr_lnb_dep2 > li > a{font-size:14px;} #footer .ftr_btm .copyright{font-size:14px;letter-spacing: 0;font-weight: 300;} #footer .ftr_btm .ftr_gnb li a{font-size:14px;} } @media only screen and (max-width:640px){ .ftr_board .w_custom{display:block; height:auto;} .ftr_board dl{width:calc(100% + 30px); margin-left:-15px; padding:0 15px; box-sizing:border-box; height:60px;} .ftr_board dl + dl{border-top:1px solid #ddd;} .ftr_board dl dt{font-size:16px;} .ftr_board dl dd{font-size:13px;} .ftr_board dl dd:before{height:12px;} .ftr_board dl dd .more{background-size:12px;} .ftr_board .faq dt, .ftr_board .notice dt{width:67px; padding-left:0;} .ftr_board .faq dd, .ftr_board .notice dd{width:calc(100% - 67px);} .ftr_board .faq .more{right:0;} .ftr_board .bbs_slide_wrap {padding:20px 0;width:calc(100% - 50px);} .ftr_board .swiper{} #footer .logo{width:150px;} #footer .ftr_lnb{display:none;} #footer .ftr_btm{display:block;margin-top: 40px;padding-top: 24px;} #footer .ftr_btm .ftr_gnb{padding-left:0; margin-top:28px;} } @media only screen and (max-width:479px){ #footer{padding:40px 0 80px;} #footer .logo{width:112px;margin-bottom: 26px;} #footer .ftr_info .info_list li + li{margin-top: 9px;} #footer .ftr_info .info_list li dl dt, #footer .ftr_info .info_list li dl dd{font-size:13px;letter-spacing: 0;} #footer .ftr_info .info_list li dl dt{font-weight:400;} #footer .ftr_info .info_list + .sns_list{margin-top:40px;} #footer .ftr_info .sns_list{position:relative; right:0;} #footer .ftr_info .sns_list li a{width:35px; height:35px;} #footer .ftr_info .sns_list li:nth-child(1) a img{width:8px;} #footer .ftr_info .sns_list li:nth-child(2) a img{width:16px;} #footer .ftr_info .sns_list li:nth-child(3) a img{width:16px;} #footer .ftr_info .sns_list li:nth-child(4) a img{width:14px;} #footer .ftr_btm .copyright{font-size:13px; line-height:153%;} #footer .ftr_btm .ftr_gnb li + li{margin-left:28px;} #footer .ftr_btm .ftr_gnb li a{font-size:13px; font-weight:300;} #footer .ftr_btm .ftr_gnb li a strong{font-weight:400;} } /*─────────────────────────────────────────────────────────── SIDE_BOX | outline/left_bbs.html｜outline/left_goods.html｜outline/left_member.html｜outline/left_service.html ───────────────────────────────────────────────────────────*/ #side_box {padding-bottom:1.8%;} #side_box .sub_menu {width:100%;padding:0;margin:0;z-index:2;text-align:center;vertical-align:top;} #side_box .sub_menu dl {position:relative;display:inline-block;margin:0 auto;z-index:3;font-size:0;text-align:center;vertical-align:top;padding:0;} #side_box .sub_menu dt, #side_box .sub_menu dd {display:inline-block;margin:0;padding:0;} #side_box .sub_menu dt {display:none;} #side_box .sub_menu dd {line-height:31px;height:32px;padding:0 12px;border-bottom:1px #ccc solid;position:relative;z-index:1;box-sizing:border-box;vertical-align:top;} #side_box .sub_menu dd + dd {} #side_box .sub_menu dd a, #side_box .sub_menu dd strong {height:31px;line-height:31px;font-size:15px;font-weight:600;padding:0 2px;color:#888;display:inline-block;box-sizing:border-box;vertical-align:top;} #side_box .sub_menu dd:hover a, #side_box .sub_menu dd.on a, #side_box .sub_menu dd strong {border-color:#333;color:#333;position:relative;} #side_box .sub_menu dd:hover a:before, #side_box .sub_menu dd.on a:before, #side_box .sub_menu dd strong:before {bottom:-1px;width:100%;height:2px;background:#333;left:50%;transform:translateX(-50%);position:absolute;content:"";display:block;} @media only screen and (max-width:1200px) { } @media only screen and (max-width:1024px) { } @media only screen and (max-width:860px) { #side_box .sub_menu dd {line-height:29px;height:30px;padding:0 8px;} #side_box .sub_menu dd a, #side_box .sub_menu dd strong {height:29px;line-height:29px;font-size:14px;padding:0 2px;} } @media only screen and (max-width:767px) { } @media only screen and (max-width:640px) { #side_box .sub_menu dd {line-height:27px;height:28px;padding:0 8px;} #side_box .sub_menu dd a, #side_box .sub_menu dd strong {height:27px;line-height:27px;font-size:14px;padding:0 2px;} } @media only screen and (max-width:479px) { #side_box {display:none;} } /*─────────────────────────────────────────────────────────── MAIN | index.html ───────────────────────────────────────────────────────────*/ /* visual */ .main_visual {position:relative;width:100%;min-width:1200px;margin:0;height:798px;background:#000;} .main_visual .slick-slide {overflow:hidden;position:relative;text-align:center;height:798px;} .main_visual .slick-slide a {display:inline-block;height:100%;width: 100%;max-width:1920px;margin:0 auto;text-align:Center;position:absolute;left: 0;top:0;outline:0;background-position: center;background-size:cover !important;transition:transform 2s ease-in-out, opacity 2s ease-in-out;transform:scale(1.2) rotate(0.003deg);opacity: .8;} .main_visual .slick-slide img {display:inline-block;height:auto;width:100%;max-width:1920px;} .main_visual .txt_box {width: 100%;text-align:center;transform:translate(-50%, -50%);position:absolute;left:50%;top:50%;font-size: 0;} .main_visual .txt_box p, .main_visual .txt_box b, .main_visual .txt_box span {display:block;text-align:center;color:#fff;font-family: 'Josefin Sans';} .main_visual .txt_box p {font-weight: 100;} .main_visual .txt_box b {margin:45px 0 48px;} .main_visual .txt_box p, .main_visual .txt_box b {font-size:90px;line-height:70px;text-transform: uppercase;} .main_visual .txt_box span {font-size:24px;line-height:36px;font-weight: 300;} .main_visual .visual_btn_wrap {position:absolute;left: 0;bottom: 150px;overflow:hidden;width: 100%;text-align: center;} .main_visual .visual_btn_wrap .control_btn, .main_visual .visual_btn_wrap .slider-progress-wrap, .main_visual .visual_btn_wrap .slide_count {display:inline-block;vertical-align:middle;} .main_visual .visual_btn_wrap .control_btn {font-size:0;} .main_visual .visual_btn_wrap .control_btn #pause-btn, .main_visual .visual_btn_wrap .control_btn .slick-arrow {font-size:0;display:inline-block;vertical-align:middle;height: 20px;} .main_visual .visual_btn_wrap .control_btn #pause-btn {width: 35px;background:url('../images/skin/visual_sld_pause.png') no-repeat center;} .main_visual .visual_btn_wrap .control_btn .slick-arrow {width: 32px;} .main_visual .visual_btn_wrap .control_btn .slick-prev {background: url('../images/skin/visual_sld_prev.png') no-repeat left;} .main_visual .visual_btn_wrap .control_btn .slick-next {background: url('../images/skin/visual_sld_next.png') no-repeat right;} .main_visual .visual_btn_wrap .menu_btn {font-size:0;float:right;background: #222222;width: 600px;} .main_visual .visual_btn_wrap .slider-progress-wrap {width: 150px;transition:all 0.3s;z-index:5;margin:0 auto;padding:0;text-align:center;font-size: 0;} .main_visual .visual_btn_wrap .slider-progress-wrap .slider-progress {width: calc(100% - 50px);background:rgba(255,255,255,0.4);display: inline-block;vertical-align: middle;} .main_visual .visual_btn_wrap .slider-progress-wrap .slider-progress .progress {height:2px;background:#de0000;width: 0;} .main_visual .visual_btn_wrap .slider-progress-wrap .slider-progress .progress.active {width:100%;} .main_visual .visual_btn_wrap .slide_count {color:#fff;font-size:15px;} .main_visual .visual_btn_wrap .slide_count span {font-size:inherit;color:inherit;} .main_visual .slick-dots {width: 50px;box-sizing: border-box;} .main_visual .slick-dots li {opacity:0;} .main_visual .slick-dots li.slick-active {opacity:1;} .main_visual .slick-dots li button {font-size:16px;line-height: 16px;color:#fff;font-weight: 600;} .main_visual .slick-counter span {display:inline-block;vertical-align: top;letter-spacing:-1px;} .main_visual .slick-counter, .main_visual .slick-counter span {} /* visual active */ .main_visual .slick-slide.active a {transform:scale(1) rotate(0.003deg);opacity: 1;} /* 공통 */ .main_tittle{position:relative; text-align:left;} .main_tittle h4{/* font-size:52px; */font-size: 5.55vh;font-weight:600;color:#111;font-family: 'Poppins', 'Noto Sans KR', sans-serif; } .main_tittle h4 + h6{margin-top: 16px;} .main_tittle h4 strong{font-size:inheit; font-weight:inherit; color:#0076bd;} .main_tittle h5{/* font-size:42px; */font-size: 4.55vh;font-weight:600;color:#222;font-family: 'Poppins', 'Pretendard', 'Noto Sans KR', sans-serif;} .main_tittle h5 + p{/* margin-top: 25px; */margin-top: 1.5vh;} .main_tittle h6{/* font-size:26px; */font-size: 2.81vh;font-weight:600;color:#333;line-height:146%;} .main_tittle h6 + p{margin-top: 28px;} .main_tittle p{/* font-size:16px; */font-size: 1.72vh;font-weight:400;color:#666;line-height: 175%;font-family: 'Noto Sans KR', sans-serif;letter-spacing: -0.5px;} .main_tittle p + p{margin-top: 17px;} .main_btn_wrap{} .main_btn_wrap.center{text-align:center;} .main_more_btn{display:inline-flex;align-items:center;/* height:50px; */height: 5.4vh;/* font-size:17px; */font-size: 1.83vh;font-weight:400;color:#fff;padding:0 37px;background:#0076bd;border:1px solid #0076bd;border-radius:25px;box-sizing:border-box;transition:all 0.4s;} .ab_detail_btn{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,118,189,0.8) url('../images/skin/main_recruit_more_icon.png') no-repeat center; z-index:3; opacity:0; transition:all 0.4s; box-shadow:0 5px 20px rgba(0,0,0,0.2);} #wrap .swiper-button-next:after, #wrap .swiper-button-prev:after{display:none;} #wrap .swiper-button-prev, #wrap .swiper-button-next{width:65px; height:65px; border:1px solid #000; border-radius:100%; background:#fff url('../images/skin/main_slide_arrow.png') no-repeat center; transition:all 0.4s; box-sizing:border-box;} #wrap .swiper-button-prev{transform:scaleX(-1); right:calc(100% + 50px); left:auto;} #wrap .swiper-button-next{ left:calc(100% + 50px); right:auto;} /* 애니 */ .section .ScrollAni{opacity:0; transform:translateY(100px); transition:transform 1.5s;} .section .ScrollAni.opa{transform:translate(0);} .section .ScrollAni.left{transform:translateX(-100px);} .section .ScrollAni.right{transform:translateX(100px);} .section.active .ScrollAni{opacity:1; transform:translate(0);} @media only screen and (max-width:1024px) { .section .ScrollAni.left, .section .ScrollAni.right{transform:translateY(100px);} .section.active .ScrollAni{opacity:1; transform:translate(0);} } /* hover */ @media only screen and (min-width:1024px) { .main_more_btn:hover{background:#fff; color:#0076bd;} #wrap .swiper-button-prev:hover, #wrap .swiper-button-next:hover{border-color:#0076bd; background:#0076bd url('../images/skin/main_slide_arrow_on.png') no-repeat center;} } /* 풀페이지 */ #fullpage .fp-tableCell{padding-top:80px; box-sizing:border-box;} #fullpage #section01 {position:relative;} #fullpage #section01 .fp-tableCell{padding-top:0;} #section01 .txt_wrap{position:absolute;top: 51%;left:50%;transform:translate(-50%, -50%);width: 1520px;text-align:left;} #section01 .txt_wrap h3{/*font-size:72px;*/ font-size:7.7vh; font-weight:400;color:#fff;line-height: 140%;letter-spacing: -0.055em;font-family: 'Poppins', 'Noto Sans KR', sans-serif; /* transition-delay:1.2s; */ opacity:0; transform:translate3d(0,100px,0);} #section01 .txt_wrap h3.on{opacity:1; transform:translate3d(0,0,0);} #section01 .txt_wrap h3 strong{font-weight:bold;letter-spacing: 0;} #section01 .txt_wrap p{font-size:20px; font-weight:400; color:#fff; } #section01 .txt_wrap #TypingJs{display:block;} #section01 .video_wrap{width: 100vw;height:100vh;overflow:hidden;background:#000; background-size:cover;} #section01 .video_wrap iframe{width: 120%;height: 140vh;margin-left: -10%;margin-top: -20vh;pointer-events:none;object-fit: cover; min-width:2300px;} #section01 .scroll_down{position:absolute;left:50%;bottom: 0;transform:translateX(-50%);line-height:1;font-size:15px;font-weight:400;color:#fff;font-family: 'Poppins', 'Noto Sans KR', sans-serif; cursor:pointer; transition:all 0.4s;} #section01 .scroll_down:after{display:block;content:'';width:1px;height:50px;background:#fff;margin: 10px auto 0; transition:all 0.4s;} #section01 .scroll_down span{display:inline-block; animation-name: ScrollDown; animation-duration:1s; animation-iteration-count:infinite; animation-direction:alternate; animation-fill-mode: forwards;} @-webkit-keyframes ScrollDown {0% {transform:translateY(-10px);}100% {transform:translateY(0);}} /* hover */ @media only screen and (min-width:1024px) { #section01 .scroll_down:hover{color:#0076bd; font-weight:500;} #section01 .scroll_down:hover:after{background:#0076bd;} } #section02{background:rgba(0,118,189,0.05);} #section02 .main_tittle .all_more_btn{position:absolute;top: 50%;transform: translateY(calc(-50% - 0.5px));right:0;font-size:15px;font-weight:500;color:#333;display:inline-flex;align-items:center;/* height:45px; */height: 4.85vh;border:1px solid #aaa;box-sizing:border-box;padding:0 19px;border-radius:23px;} #section02 .main_tittle .all_more_btn:after{display:inline-flex; content:''; width:15px; height:14px; background:url('../images/skin/main_more_arrow.png') no-repeat center; margin-left:29px; transition:all 0.4s;} #section02 .PostingSwiper{position:relative;} #section02 .recruit_list{display:flex;flex-wrap:wrap;margin-top: 32px;} #section02 .recruit_list li{width:calc(100% / 4 - 30px);margin-right:40px;background:#fff;padding: 30px 30px 94px;box-sizing: border-box;position: relative; height:auto;} #section02 .recruit_list li:nth-child(4n){margin-right:0;} #section02 .recruit_list li:nth-child(n+5){margin-top:40px;} #section02 .recruit_list .cont{} #section02 .recruit_list .cont dl{text-align:left;} #section02 .recruit_list .cont dl dt{/* font-size:16px; */font-size: 1.72vh;font-weight:400;color:#666;} #section02 .recruit_list .cont dl dt + dd{margin-top:15px;} #section02 .recruit_list .cont dl dt strong{display:inline-block; font-weight:bold; color:#333; margin-right:20px;} #section02 .recruit_list .cont dl dd{/* font-size:20px; */font-size: 2.16vh;font-weight:bold;color:#333;line-height:150%;white-space:normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} #section02 .recruit_list .cont > span{/* font-size:16px; */font-size: 1.72vh;font-weight:500;color:#ed4444;font-family: 'Poppins', 'Noto Sans KR', sans-serif;display: flex;align-items: center;padding-top: 17px;margin-top: 25px;position: absolute;left: 30px;bottom: 27px;width: calc(100% - 60px);border-top: 1px solid #ddd;} #section02 .recruit_list .cont > span:before{display:inline-flex;content:'';width:17px;height:17px;background:url('../images/skin/recruit_list_icon.png') no-repeat center;margin-right:10px;} #section02 .main_btn_wrap{/* margin-top:60px; */margin-top: 6.5vh;} #section02 .swiper-pagination-progressbar{display:none;} /* 애니*/ #section02 .recruit_list li:nth-child(1){transition-delay:0.2s} #section02 .recruit_list li:nth-child(2){transition-delay:0.3s} #section02 .recruit_list li:nth-child(3){transition-delay:0.4s} #section02 .recruit_list li:nth-child(4){transition-delay:0.5s} #section02 .recruit_list li:nth-child(5){transition-delay:0.6s} #section02 .recruit_list li:nth-child(6){transition-delay:0.7s} #section02 .recruit_list li:nth-child(7){transition-delay:0.8s} #section02 .recruit_list li:nth-child(8){transition-delay:0.9s} #section02 .main_btn_wrap.ScrollAni{transition-delay:1s} /* hover */ @media only screen and (min-width:1024px) { #section02 .recruit_list li:hover .ab_detail_btn{opacity:1;} #section02 .main_tittle .all_more_btn:hover:after{transform:translateX(5px);} } /* 마감 */ #section02 .recruit_list li.end > a{background:#fff; opacity:0.7; pointer-events:none;} #section02 .recruit_list li.end .cont > span{color:#666;} #section02 .recruit_list li.end .cont > span:before{display:none;} #section03{} #section03 .job_tab_list{position:relative;display:flex;border-bottom:1px solid #ddd;margin-top: 18px;margin-bottom:130px;} #section03 .job_tab_list > li{/* font-size:18px; */font-size: 1.94vh;font-weight: 500;color:#aaa;margin-right:44px;transition:all 0.4s;} #section03 .job_tab_list > li.on{color:#333;} #section03 .job_tab_list > li > span{position:relative; display:block; padding-bottom:15px; font-size:inherit; font-weight:inherit; font-family:inherit; cursor:pointer;} #section03 .job_tab_list > li > span:before{position:absolute; content:''; width:0; height:4px; background:#0076bd; left:50%; bottom:-1px; transform:translateX(-50%); transition:all 0.4s;} #section03 .job_tab_list > li.on span:before{width: 96%;} #section03 .WorkTabSwiper{height:0; overflow:hidden; position:absolute; left:0; top:calc(100% + 30px); margin-bottom:-10px; width:100%;} #section03 .on .WorkTabSwiper{height:auto; overflow:visible;} #section03 .work_tab_list{ display:flex; } #section03 .work_tab_list > li{/* font-size:16px; */font-size: 1.72vh;font-weight: 400;color:#aaa;border:1px solid #ddd;border-radius:25px;display: inline-flex;height: 50px;align-items: center;width: max-content;padding: 0 19px;box-sizing: border-box;margin-right:10px;transition:all 0.4s;margin-bottom:10px;font-family: 'Poppins','Pretendard', sans-serif; cursor:pointer;} #section03 .work_tab_list > li.on{background:#000;border-color:#000;color:#fff;} #section03 .work_tab_list > li span{font-size:inherit; font-weight:inherit; font-family:inherit;} #section03 .work_tab_cont{height:0; /* overflow:hidden; */ transition:all 1.5s;} #section03 .work_tab_cont.on{height:auto; overflow:visible;} #section03 .work_tab_cont .inr{display:flex; align-items:center;} #section03 .work_tab_cont .thumb{position:relative;width:650px;/* height:420px; */height: 45.3vh;box-sizing:border-box;} #section03 .work_tab_cont .thumb:before{position:absolute; content:''; /*width:108px; height:427px;*/width:11.56vh; height:45.7vh; background:url('../images/skin/outline_logo.png') no-repeat center; background-size:100%; top:50%; right:100%; transform:translateY(-50%); display:none;} #section03 .work_tab_cont.on .thumb:before{display:block;} #section03 .tab_cont_wrap .eq:nth-child(n + 6):nth-child(-n + 7) .work_tab_cont .thumb{width:0;} #section03 .on .work_tab_cont .thumb.video{} #section03 .on .work_tab_cont .thumb.video iframe{opacity: 1; transform: scale(1); position: absolute; top: 0; left: 0; z-index: 1;} #section03 .work_tab_cont .thumb img{width:100%;height:100%;object-fit:cover;/*transform:scale(1.3); transition:all 1.5s;*/opacity: 0;} #section03 .work_tab_cont.on .thumb img{/*transform:scale(1);*/} #section03 .work_tab_cont .thumb iframe{width:100%; height:100%; opacity:0; transform:scale(1.1); transition:all 1.5s;} #section03 .work_tab_cont.on .thumb iframe{opacity:1; transform:scale(1)} #section03 .work_tab_cont .thumb .play_btn{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:70px; height:70px; border-radius:100%; background:#fff url('../images/skin/main_play_btn_icon.png') no-repeat center; transition:all 0.4s; z-index:2; display:none;} #section03 .work_tab_cont .main_tittle{width:calc(100% - 650px); padding-left:80px; box-sizing:border-box; opacity:0; transition:all 1.5s;} #section03 .work_tab_cont.on .main_tittle{opacity:1;} #section03 .mobile_select{} #section03 .mobile_select dt{display:none;} /* hover */ @media only screen and (min-width:1024px) { #section03 .job_tab_list > li:hover{color:#333;} #section03 .job_tab_list > li:hover:before{width:100%;} #section03 .work_tab_list > li:hover{background:#000;border-color:#000;color:#fff;} #section03 .work_tab_cont .thumb .play_btn:hover{background:#0076bd url('../images/skin/main_play_btn_icon_on.png') no-repeat center;} } #section04{} #section04 .StorySwiper{width: 100%;height:570px;height: 61.5vh;overflow:hidden;margin-top:32px;} #section04 .StorySwiper .swiper-wrapper{ display:flex; flex-wrap:wrap; flex-direction:column;} #section04 .StorySwiper .swiper-slide{text-align: center; font-size: 18px; background: #fff; height: calc((100% - 50px) / 2) !important;} #section04 .StorySwiper .swiper-slide:nth-child(even){margin-top:40px !important;margin-top: 4.3vh !important;} #section04 .StorySwiper .thumb{position:relative;font-size:0;margin-bottom:20px;width:100%;/* height:230px; */height: 24.81vh;} #section04 .StorySwiper .thumb img{width:100%; height:100%; object-fit:cover;} #section04 .StorySwiper .txt_wrap{text-align:left;} #section04 .StorySwiper .txt_wrap dt{/* font-size:18px; */font-size: 1.94vh;font-weight:500;color:#333;line-height:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} #section04 .main_btn_wrap{display:none;} /* 애니 */ #section04 .StorySwiper .swiper-slide:nth-child(1){transition-delay:0.2s} #section04 .StorySwiper .swiper-slide:nth-child(2){transition-delay:0.3s} #section04 .StorySwiper .swiper-slide:nth-child(3){transition-delay:0.4s} #section04 .StorySwiper .swiper-slide:nth-child(4){transition-delay:0.5s} #section04 .StorySwiper .swiper-slide:nth-child(5){transition-delay:0.6s} #section04 .StorySwiper .swiper-slide:nth-child(6){transition-delay:0.7s} #section04 .StorySwiper .swiper-slide:nth-child(7){transition-delay:0.8s} #section04 .StorySwiper .swiper-slide:nth-child(8){transition-delay:0.9s} #section04 .StorySwiper .swiper-slide:nth-child(9){transition-delay:1s} #section04 .StorySwiper .swiper-slide:nth-child(10){transition-delay:1.1s} #section04 .StorySwiper .swiper-slide:nth-child(11){transition-delay:1.2s} #section04 .StorySwiper .swiper-slide:nth-child(12){transition-delay:1.3s} /* hover */ @media only screen and (min-width:1024px) { #section04 .StorySwiper .swiper-slide:hover .ab_detail_btn{opacity:1;} } #section05 .w_custom{display:flex; align-items:center;} #section05 .SocietySwiper{width:100%;} #section05 .main_tittle{position:relative;width:650px;padding-right:50px;box-sizing:border-box;/* margin-top: 175px; */margin-top: 19vh;} #section05 .main_tittle:before{position:absolute;content:'';width:209px;height:205px;background:url('../images/skin/main_society_logo.png') no-repeat center;background-size:100%;top: -80px;left: -105px;} #section05 .main_tittle p{line-height:162.5%;} #section05 .thumb{width: calc(100% - 650px);height: calc(100vh - 80px);} #section05 .thumb span{display:flex;width: calc(100% + 310px);height:100%;overflow:hidden;} #section05 .thumb img{width:100%; height:100%; object-fit:cover; max-width:none; opacity:0; transform:scale(1.3); transition:all 1.5s;} #section05 .society_tab{position:absolute;left:0;bottom: 170px;bottom: 18.3vh;display:inline-flex;z-index:3;} #section05 .society_tab span{position:relative;/* font-size:18px; */font-size: 1.93vh;font-weight:600;color:#aaa;padding-bottom: 10px;transition:all 0.4s;cursor:pointer;margin-right:60px; width:auto; height:auto; background:none; opacity:1; border-radius:0;} #section05 .society_tab span:focus{outline:none;} #section05 .society_tab span:before{position:absolute; content:''; width:0; height:4px; background:#0076bd; left:50%; bottom:0; transform:translateX(-50%); transition:all 0.4s;} #section05 .society_tab span:after{display:block; content:'컴플라이언스'; transition:all 0.4s;} #section05 .society_tab span:nth-child(2):after{display:block; content:'사회공헌';} #section05 .society_tab span:nth-child(3):after{display:block; content:'환경경영';} #section05 .society_tab span:nth-child(4):after{display:block; content:'윤리경영';} #section05 .society_tab span.swiper-pagination-bullet-active:after{color:#333;} #section05 .society_tab span.swiper-pagination-bullet-active:before{width:96%;} #section05 .society_tab_list{} #section05 .society_tab_list > li{display:flex;/*height:0; overflow:hidden; opacity:0; transition:all 1.5s;*/width: 100% !important;} #section05 .society_tab_list > li.on{/*height:auto; overflow:visible; opacity:1;*/} /* 애니 */ #section05 .society_tab{transition-delay:1s} #section05.active .swiper-slide.swiper-slide-active .thumb img{transform:scale(1); opacity:1; } #section05.active .swiper-slide .main_tittle .ScrollAni{opacity:0; transform:translateY(100px); transition-duration:0s; transition-delay:0s;} #section05.active .swiper-slide.swiper-slide-active .main_tittle .ScrollAni{opacity:1; transform:translateY(0); transition-duration:1.5s;} #section05.active .swiper-slide.swiper-slide-active .main_tittle h4.ScrollAni{transition-delay:0.2s} #section05.active .swiper-slide.swiper-slide-active .main_tittle h6.ScrollAni{transition-delay:0.4s} #section05.active .swiper-slide.swiper-slide-active .main_tittle p.ScrollAni{transition-delay:0.6s} #section05.active .swiper-slide.swiper-slide-active .main_tittle p.ScrollAni + p.ScrollAni{transition-delay:0.8s} /* hover */ @media only screen and (min-width:1024px) { #section05 .society_tab span:hover:after{color:#333;} #section05 .society_tab span:hover:before{width:96%;} } #fullpage #section06, #fullpage #section06 .fp-tableCell{padding:0;} @media only screen and (max-width:1550px){ #wrap .swiper-button-prev, #wrap .swiper-button-next{width:60px; height:60px;} #section01 .txt_wrap{width:calc(100% - 30px);} #section04 .StorySwiper{width:calc(100% - 170px); margin-left:auto; margin-right:auto;} #wrap #section04 .swiper-button-prev{right:auto; left:0;} #wrap #section04 .swiper-button-next{right:0; left:auto;} } @media only screen and (max-width:1317px){ #wrap #section04 .swiper-button-prev{left:15px;} #wrap #section04 .swiper-button-next{right:15px;} #section03 .work_tab_cont .thumb{width:50%;} #section03 .work_tab_cont .thumb:before, #section03 .work_tab_cont.on .thumb:before{display:none;} #section03 .work_tab_cont .main_tittle{width:50%; padding-left:6vw;} #section05 .main_tittle{width:50%;} #section05 .main_tittle:before{left:0;} #section05 .thumb{width:50%;} #section05 .thumb span{width:calc(100% + 15px);} #section05 .thumb img{} #section05 .society_tab{left:15px;bottom: 12vh;} #section05 .society_tab span{margin-right:4.5vw;} } @media only screen and (max-width:1280px){ #fullpage .section{padding:100px 0;} #fullpage #section01{padding:0;} #section01 .video_wrap{/*height:83vw; min-height:667px;*/} #section01 .video_wrap iframe{/*width: 100%;margin-left: 0;height: 100%;margin-top: -22vh;*/ } #section02 .recruit_list li{margin-right:30px; width:calc(100% / 4 - 22.5px);} #section02 .recruit_list li:nth-child(n+5){margin-top:20px;} #fullpage #section05{padding:0;} } @media only screen and (max-width:1200px){ #section05 .main_tittle h6 br, #section05 .main_tittle p br{display:none;} } @media only screen and (max-width:1023px){ .main_tittle h4{font-size:4.6vw;} .main_tittle h5{font-size:4vw;} .main_tittle h5 + p{margin-top: 15px;} .main_tittle h6{font-size:23px;letter-spacing: -0.6px;} .main_tittle p{font-size:15px;} .main_more_btn{font-size:16px;} #wrap .swiper-button-prev, #wrap .swiper-button-next{width:55px; height:55px;} #section01 .txt_wrap h3{font-size:6vw;} #section01 .scroll_down{font-size:14px;} #section02 .recruit_list li{margin-right:20px; width:calc(100% / 4 - 15px);} #section02 .recruit_list li:nth-child(n+5){margin-top:20px;} #section02 .recruit_list .cont dl dt{font-size:15px;} #section02 .recruit_list .cont dl dd{font-size:17px;} #section02 .recruit_list .cont > span{font-size:15px;} #section02 .main_btn_wrap{margin-top:50px;} #section02 .main_tittle .all_more_btn{height:45px;} #section03 .job_tab_list > li{font-size:17px; margin-right:35px;} #section03 .work_tab_list > li{font-size:15px;} #section03 .work_tab_cont .thumb{height:37vw; min-height:300px;} #fullpage #section04{padding-top:0;} #section04 .StorySwiper{width:100%;height:auto;margin-top: 25px;} #section04 .StorySwiper .swiper-wrapper{flex-direction:row; width:100% !important;} #section04 .StorySwiper .swiper-slide{width:calc(100% / 3 - 10px) !important; margin:0 15px 0 0 !important; height:auto !important;} #section04 .StorySwiper .swiper-slide:nth-child(even){margin-top:0 !important;} #section04 .StorySwiper .swiper-slide:nth-child(n+4){margin-top:47px !important;} #section04 .StorySwiper .swiper-slide:nth-child(3n){margin-right:0 !important;} #section04 .StorySwiper .thumb{height:20vw;} #section04 .StorySwiper .txt_wrap dt{font-size:17px;} #wrap #section04 .swiper-button-prev, #wrap #section04 .swiper-button-next{display:none;} #section05 .society_tab{bottom:9vw;} #section05 .main_tittle{margin-top:13vw;} #section05 .thumb{height:800px;} #section05 .society_tab span{font-size:16px;} } @media only screen and (max-width:860px){ .main_tittle h6{font-size:21px;} #wrap .swiper-button-prev, #wrap .swiper-button-next{width:50px; height:50px; background-size:18px auto;} #section01 .video_wrap iframe{min-width:1920px; margin-left:-960px; min-height: 667px;} #section02 .recruit_list li{width:calc(100% / 2 - 10px);} #section02 .recruit_list li:nth-child(4n){margin-right:20px;} #section02 .recruit_list li:nth-child(2n){margin-right:0;} #section02 .recruit_list li:nth-child(n+3){margin-top:20px;} #section03 .job_tab_list > li{margin-right:30px; font-size:16px;} #section03 .work_tab_list > li{height:45px;} #section03 .work_tab_cont .thumb .play_btn{width:60px; height:60px;} #section04 .StorySwiper .thumb{margin-bottom:15px;} #section04 .StorySwiper .txt_wrap dt{font-size:16px;} #section05 .thumb{height:750px;} #section05 .main_tittle{padding-right:30px;} #section05 .society_tab span{font-size:15px; margin-right:20px; padding-bottom:7px;} #section05 .society_tab span:before{height:3px;} } @media only screen and (max-width:767px){ .main_tittle h4{font-size:32px;} .main_tittle h6{font-size:20px;} #section01 .txt_wrap{top: 33.7%;transform:translateX(-50%);} #section01 .txt_wrap h3{font-size:23px;font-weight: 300;} #section01 .txt_wrap h3 strong{font-size:40px;display: inline-block;margin-bottom: 24px;} #section04 .StorySwiper .txt_wrap dt{font-size:15px;} } @media only screen and (max-width:640px){ .main_tittle h4 + h6{margin-top: 11px;} .main_tittle h5{font-size:25px;} .main_tittle h6{font-size:19px;} .main_tittle h6 + p{margin-top: 17px;} .main_tittle p{font-size:14px;line-height:157%;letter-spacing: -0.7px;} .main_tittle p + p{margin-top: 10px;} .main_more_btn{font-size:15px;font-weight: 300;} #wrap .swiper-button-prev, #wrap .swiper-button-next{width:45px; height:45px; background-size:16px auto;} #section01 .scroll_down{font-size:13px; font-weight:200; letter-spacing:0;} #section01 .scroll_down:after{height:40px;} #section02 .recruit_list{flex-direction:column; height:367px; } #section02 .recruit_list li{height:calc(100% / 2 - 10px) !important;padding: 23px 20px 71px;} #section02 .recruit_list li:nth-child(n+3){margin-top:0;} #section02 .recruit_list .cont dl dt{font-size:14px;} #section02 .recruit_list .cont dl dt + dd{margin-top:10px;} #section02 .recruit_list .cont dl dt strong{margin-right: 17px;} #section02 .recruit_list .cont dl dd{font-size:16px; line-height:137%;} #section02 .recruit_list .cont > span{left:20px;bottom: 20px;padding-top: 13px;font-size:13px;} #section02 .recruit_list .cont > span:before{width:14px; height:14px; background-size:100%;} #section02 .main_tittle .all_more_btn{font-size:14px; height:40px;} #section02 .main_tittle .all_more_btn:after{margin-left:20px;} #section02 .swiper-pagination-progressbar{display:block; width:72.5%; height:2px; margin:0 auto; position:relative; margin-top:40px; background:#ccc;} #section02 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#0076bd;} #section03 .mobile_select{position:relative;margin-bottom: 80px; z-index:2;} #section03 .mobile_select dt{display:block;margin-top: 18px;} #section03 .mobile_select dt span{position:relative; display:flex; width:100%; height:45px; align-items:center; padding:0 40px 0 15px; font-size:16px; font-weight:600; color:#333; box-sizing:border-box; border:1px solid #ddd; border-radius:27px;} #section03 .mobile_select dt span:before{position:absolute;content:'';top:50%;right:15px;transform: translateY(calc(-50% - 0.5px)) rotate(45deg);width:7px;height:7px;border:1px solid #333;border-top-color:#fff0;border-left-color:#fff0;} #section03 .mobile_select dt.active span:before{transform: translateY(calc(-50% + 3px)) rotate(-135deg); border-right-color:#0076bd; border-bottom-color:#0076bd;} #section03 .mobile_select dd{position:absolute;top: calc(100% - 1px);left:0; width: 100%; pointer-events:none;} #section03 .mobile_select dd.active{pointer-events:auto;} #section03 .mobile_select dd.active .job_tab_list{border-color:#ddd; background:#fff;} #section03 .mobile_select dd.active .job_tab_list > li > span{opacity:1;} #section03 .mobile_select dd.active .WorkTabSwiper{z-index:-1;} #section03 .job_tab_list{display:block; margin: 0; border:1px solid #fff0; background:#fff0; padding:15px; border-radius:25px; box-sizing: border-box; } #section03 .job_tab_list > li{margin-right:0;width:100%;box-sizing: border-box;font-weight: 300;font-size: 15px; } #section03 .job_tab_list > li + li{margin-top: 7px;} #section03 .job_tab_list > li.on{font-weight:500;} #section03 .job_tab_list > li > span{padding:0; opacity:0;} #section03 .job_tab_list > li > span:before{display:none;} #section03 .WorkTabSwiper{top:15px; pointer-events:auto; z-index:1;} #section03 .work_tab_list > li{height:40px;margin-bottom: 0;} #section03 .work_tab_cont .inr{display:block;} #section03 .work_tab_cont .thumb{width:100%; min-height:230px;} #section03 .work_tab_cont .thumb .play_btn{width:56px; height:56px;} #section03 .work_tab_cont .main_tittle{width:100%;padding: 30px 0 0 0;} #section03 .work_tab_cont .thumb iframe{transform:scale(1); transition:none;} #section03 .tab_cont_wrap .eq:nth-child(n + 6):nth-child(-n + 7) .work_tab_cont .thumb{height:0; min-height:0;} #fullpage #section04{border-top:12px solid #eee; padding-top:100px;} #section04 .StorySwiper .txt_wrap dt{font-size:14px;} #section04 .StorySwiper .swiper-slide{width:calc(100% / 2 - 7.5px) !important;} #section04 .StorySwiper .swiper-slide:nth-child(3n){margin-right:15px !important;} #section04 .StorySwiper .swiper-slide:nth-child(even){margin-right:0 !important;} #section04 .StorySwiper .swiper-slide:nth-child(n+3){margin-top: 47px !important;} #section04 .StorySwiper .thumb{height:30vw; min-height:110px;} #section04 .main_btn_wrap{display:block; margin-top:50px;} #section04 .main_more_btn:after{display:inline-flex; content:''; width:12px; height:12px; background:url('../images/skin/board_more_icon_on.png') no-repeat center; background-size:100%; margin-left:15px;} #fullpage #section05{border-top:12px solid #eee;padding-top: 101px;padding-bottom:110px;} #section05 .society_tab{bottom: -52px;justify-content: space-between;width:calc(100% - 30px);} #section05 .society_tab span{margin-right:0;} #section05 .society_tab span:before{height:2px;} #section05 .society_tab_list > li{display:block;} #section05 .main_tittle{width:100%;margin-top:0;padding-right: 0;} #section05 .main_tittle:before{left:auto;top: -52px;right:0;width:146px;height:143px;background-size:100%;} #section05 .main_tittle p{font-size: 13.5px;} #section05 .thumb{width:calc(100% + 30px);margin-left:-15px;height:auto;margin-top: 57px;} #section05 .thumb span{width:100%;} #section05 .thumb img{width:100%;height: 100%;min-height: 410px;} } @media only screen and (max-width:479px){ .main_tittle h6{font-size:18px;} .main_more_btn{font-size:14px;padding: 0 22px;} #wrap .swiper-button-prev, #wrap .swiper-button-next{width:40px; height:40px; background-size:14px auto;} #fullpage .section{padding: 50px 0 50px;} #section01 .scroll_down{font-size:12px;} #fullpage #section02{padding-bottom:60px} #section02 .recruit_list{margin-top:25px;} #section02 .main_tittle .all_more_btn{font-size:13px;height:30px;padding: 0 13px;} #section02 .main_tittle .all_more_btn:after{width:9px; height:9px; background-size:100%; margin-left:10px;} #fullpage #section03{padding-bottom: 55px;} #section03 .work_tab_list > li{height:35px; font-size:14px; padding:0 14px;} #section03 .work_tab_cont .thumb .play_btn{width: 44px;height: 44px;background-size: 9px 10px;} #fullpage #section04{padding-top: 47px;padding-bottom:60px;} } @media only screen and (min-width:641px) and (max-width:860px){ #section02 .recruit_list li:nth-child(n+3){margin-top:20px !important;} } @media only screen and (min-width:641px){ #section02 .recruit_list{width:100% !important;} } @media only screen and (min-width:860px){ #section02 .recruit_list li:nth-child(n+3), #section02 .recruit_list li:nth-child(n+5){margin-top:20px !important;} } @media only screen and (min-width:861px) and (max-width:1023px){ #section02 .recruit_list li:nth-child(n+3){margin-top:0 !important;} #section02 .recruit_list li:nth-child(n+5){margin-top:20px !important;} } @media only screen and (min-width:1024px) and (max-width:1280px){ #section02 .recruit_list li:nth-child(n+3){margin-top:0 !important;} #section02 .recruit_list li:nth-child(n+5){margin-top:30px !important;} } @media only screen and (min-width:1280px){ #section02 .recruit_list li:nth-child(n+3){margin-top:0 !important;} #section02 .recruit_list li:nth-child(n+5){margin-top:40px !important;} }