@charset "utf-8"; /* @import url(//fonts.googleapis.com/earlyaccess/nanumgothiccoding.css); */ /* @import url(http://fonts.googleapis.com/css?family=Ubuntu); @import url('https://fonts.googleapis.com/css?family=Nunito'); */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Play:wght@400;700&display=swap'); /* @import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@300;400;600;700&display=swap'); */ /* @import url('https://fonts.googleapis.com/css2?family=Russo+One&display=swap'); */ /* @import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/static/pretendard.css"); */ /* @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap'); */ /* @font-face {font-family: 'GmarketSansMedium'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff'); font-weight: normal; font-style: normal;} */ /* @font-face {font-family: 'GmarketSansBold';src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');font-weight: normal;font-style:normal;} */ /*@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;500;600&display=swap'); */ /* @font-face { font-family: 'BinggraeTaom'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.1/BinggraeTaomA1.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'GoyangDeogyang'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/GoyangDeogyang.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'S-CoreDream-4Regular'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'S-CoreDream-9Black'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-9Black.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'S-CoreDream-2ExtraLight'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-2ExtraLight.woff') format('woff'); font-weight: normal; font-style: normal;} @font-face { font-family: 'S-CoreDream-6Bold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-6Bold.woff') format('woff'); font-weight: normal; font-style: normal;} @font-face { font-family: 'S-CoreDream-7ExtraBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-7ExtraBold.woff') format('woff'); font-weight: normal; font-style: normal;} */ /* @font-face { font-family: 'TmonMonsori'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/TmonMonsori.woff') format('woff'); font-weight: normal; font-style: normal;} */ /* @font-face { font-family: 'S-CoreDream-8Heavy'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-8Heavy.woff') format('woff'); font-weight: normal; font-style: normal;} */ /* @import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css); */ .nanumgothic * {font-family: 'Nanum Gothic', sans-serif;} .nanumsquare { font-family: 'NanumSquare', sans-serif !important; } .taom { font-family: 'BinggraeTaom', sans-serif !important; } .goyang { font-family: 'GoyangDeogyang', sans-serif !important; } .notosans { font-family: 'Noto Sans KR', sans-serif; } .scoredream_el { font-family: 'S-CoreDream-2ExtraLight', sans-serif; } .scoredream_r { font-family: 'S-CoreDream-4Regular', sans-serif; } .scoredream_b { font-family: 'S-CoreDream-6Bold', sans-serif; } .scoredream_eb { font-family: 'S-CoreDream-7ExtraBold', sans-serif; } .scoredream_hvy { font-family: 'S-CoreDream-8Heavy', sans-serif; } .scoredream_bl { font-family: 'S-CoreDream-9Black', sans-serif; } /* 초기화 */ html {overflow-y:scroll;height:100%;min-width:320px; scroll-behavior: smooth; } body {margin:0;padding:0;height:100%;font-family: "Noto Sans KR", Noto Sans KR, sans-serif;} html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0} h1, h2, h3, h4, h5, h6 {font-size:1em} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block} #hd ul, nav ul, #ft ul {margin:0;padding:0;list-style:none} ul,li,ol{list-style:none;padding:0;margin:0} legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden} label, input, button, select, img {vertical-align:middle} input, button {margin:0;padding:0;font-size:1em} button , input[type=submit]{cursor:pointer} input[type=text], input[type=password], input[type=submit], input[type=image], button {font-size:1em;-webkit-appearance:none;} textarea, select {font-size:1em;font-family:dotum} textarea {border-radius:0;-webkit-appearance:none} select {margin:0} p {margin:0;padding:0;word-break:break-all} hr {display:none} pre {overflow-x:scroll;font-size:1.1em} a:link, a:visited {text-decoration:none} a:hover, a:focus, a:active {text-decoration:none} /* 이미지 마우스 오버 */ .imgswap img:first-child {display:inline-block; } .imgswap img:last-child {display:none; } .imgswap:hover img:first-child {display:none; animation:opacity_img_revers 1s } .imgswap:hover img:last-child {display:inline-block; animation:opacity_img 1s } @keyframes opacity_img { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes opacity_img_revers { 0% {opacity: 1;} 100% {opacity: 0;} } .imghover img:hover {-webkit-filter: grayscale(80%); filter: grayscale(80%); } .img_scale img:hover { animation:pingpong_img 0.4s forwards } .img_scale img:not(:hover) { animation:pingpong_img_revers 0.4s forwards } @keyframes pingpong_img { 0% { transform:scale(1); /* default */ -webkit-transform:scale(1); /* 크롬 */ -moz-transform:scale(1); /* FireFox */ -o-transform:scale(1); /* Opera */ } 100% { transform:scale(1.05); /* default */ -webkit-transform:scale(1.05); /* 크롬 */ -moz-transform:scale(1.05); /* FireFox */ -o-transform:scale(1.05); /* Opera */ } } @keyframes pingpong_img_revers { 0% { transform:scale(1.05); /* default */ -webkit-transform:scale(1.05); /* 크롬 */ -moz-transform:scale(1.05); /* FireFox */ -o-transform:scale(1.05); /* Opera */ } 100% { transform:scale(1); /* default */ -webkit-transform:scale(1); /* 크롬 */ -moz-transform:scale(1); /* FireFox */ -o-transform:scale(1); /* Opera */ } } .text_enter:hover { animation:text_enter_event 0.7s forwards } /*.text_enter:not(:hover) { animation:text_enter_event_revers 0.4s forwards }*/ @keyframes text_enter_event { 0% {opacity: 1;} 50% {opacity: 0.6;} 100% {opacity: 1;} } @keyframes text_enter_event_revers { 0% {opacity: 1;} 50% {opacity: 0.6;} 100% {opacity: 1;} } .img_moving img { animation:mbottom 4s ease-in Infinite Alternate; } @keyframes mbottom { 0% { margin-bottom: 0px; } 25% { margin-bottom: -15px; } 50% { margin-bottom: -0px; } 75% { margin-bottom: 15px; } 100% { margin-bottom: 0px; } } .img_moving2 img { animation:mright 4s ease-in Infinite Alternate; } @keyframes mright { 0% { margin-right: 0px; } 25% { margin-right: 5px; } 50% { margin-right: 0px; } 75% { margin-right: -5px; } 100% { margin-right: 0px; } } .img_moving3 img { animation:mleft 3s ease-in Infinite Alternate; } @keyframes mleft { 0% { margin-left: 0px; } 25% { margin-left: 10px; } 50% { margin-left: 0px; } 75% { margin-left: 10px; } 100% { margin-left: 0px; } } /* 팝업레이어 */ #hd_pop {z-index:1000;position:relative;margin:0 auto;width:100%;height:0px} #hd_pop h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} .hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff;} .hd_pops_con {width:100% !important;overflow:auto} .hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right} .hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff} /* 상단 레이아웃 */ #hd {width:100%;background:#fff;position:relative;} #hd #hd_wr{max-width:1000px;margin:0 auto;width:100%;position:relative;} #hd:after {display:block;visibility:hidden;clear:both;content:""} #hd_h1 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #logo {text-align:left;} #logo a{margin-top:0px;display:inline-block} #hd_sch_open{display:none} #hd_sch {text-align:center;} #hd_sch h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #hd_sch form {position:relative;background:#ececec;border-radius:0px} #hd_sch form:after {display:block;visibility:hidden;clear:both;content:""} #hd_sch #sch_stx {width:127px;padding-left:10px;border:0;background:none;height:35px !important;line-height:35px !important;vertical-align:middle;} #hd_sch #sch_submit {margin:0;padding:0 ;height:35px !important;line-height:35px !important;border:0;background:#dfdfdf;border-radius:0 5px 5px 0 ;color:#fff;vertical-align:middle;cursor:pointer;width:40px} #hd_sch #sch_submit:hover, #hd_sch #sch_submit:focus{background:#00c6b2;transition: 0.8s;-webkit-transition: 0.8s;-moz-transition: 0.8s;-ms-transition: 0.8s;-o-transition: 0.8s;} #sch_stc_label{position:absolute;top:0;left:10px;height:35px !important;line-height:35px !important;color:#666} #hd_nb {clear:both;background:#ecf0f7;text-align:center} #hd_nb li {display:inline-block} #hd_nb li:nth-last-of-type(1) {border-right:0 !important} #hd_nb a {display:inline-block;padding:10px 7px;text-decoration:none} /* 공통 스타일 */ .fs085 {font-size:0.85em;} /* 스타일 가이드 */ .fs10 {font-size:10px;} .fs11 {font-size:11px;} .fs12 {font-size:12px;} .fs13 {font-size:13px;} .fs14 {font-size:14px;} .fs15 {font-size:15px;} .fs16 {font-size:16px;} .fs17 {font-size:17px;} .fs18 {font-size:18px;} .fs19 {font-size:19px;} .fs20 {font-size:20px;} .fs22 {font-size:22px;} .fs24 {font-size:24px;} .fs26 {font-size:26px;} .fs28 {font-size:28px;} .fs30 {font-size:30px;} .fs32 {font-size:32px;} .fs34 {font-size:34px;} .fs36 {font-size:36px;} .fs38 {font-size:38px;} .fs40 {font-size:40px;} .fs42 {font-size:42px;} .fs44 {font-size:44px;} .fs46 {font-size:46px;} .fs48 {font-size:48px;} .fs50 {font-size:50px;} .fs52 {font-size:52px;} .fs54 {font-size:54px;} .fs56 {font-size:56px;} .fs58 {font-size:58px;} .fs60 {font-size:60px;} .fs62 {font-size:62px;} .fs64 {font-size:64px;} .fs66 {font-size:66px;} .fs68 {font-size:68px;} .fs70 {font-size:70px;} .fs72 {font-size:72px;} .fs74 {font-size:74px;} .fs76 {font-size:76px;} .fs78 {font-size:78px;} .fs80 {font-size:80px;} .fs82 {font-size:82px;} .fs84 {font-size:84px;} .fs86 {font-size:86px;} .fs88 {font-size:88px;} .fs90 {font-size:90px;} .fs92 {font-size:92px;} .fs94 {font-size:94px;} .fs96 {font-size:96px;} .fs98 {font-size:98px;} .fs100 {font-size:100px;} .fw100 {font-weight:100;} .fw200 {font-weight:200;} .fw300 {font-weight:300;} .fw400 {font-weight:400;} .fw500 {font-weight:500;} .fw600 {font-weight:600;} .fw700 {font-weight:700;} .fw800 {font-weight:800;} .fw900 {font-weight:900;} .main_modal_popup {background:rgba(0,0,0,0.6);width:100%;height:100vh; } .main_color0 {color:#000;} .main_color1 {color:#FFF;} .main_color2 {color:#535353;} .main_color3 {color:#ff0000;} .main_color4 {color:#fb6000;} .main_color5 {color:#ebebeb;} .button1 {padding:20px 60px; background:#ff0000; color:#fff; border-radius:40px; transition:background 0.3s;} .button1:hover {background:#000; color:#fff; } /* 스타일 가이드 끝 */ /***************************************************************/ /* 스타일 작업 시작 */ body { background:transparent;} body, html {width: 100%;} #wrap {background: transparent; text-align: center; } *, *:after, *:before {box-sizing: border-box; padding:0; margin:0;} img { display:inline-block; font-size: 0;} /* header, .main_silde {width: 100%;} */ a {text-decoration: none; color:#000;} a:hover { color:#8edf02;} input, select, textarea {font-family: 'noto sans KR', sans-serif;} /* header 메뉴 */ header {z-index: 15; width: 100%; margin: 0 auto; flex-wrap: wrap;display:flex;justify-content: center;align-items: center;position:fixed; height: 110px;} /* header:after { left:0; right:0; margin: 0 auto;justify-content: center;align-items: center;display: flex;content:''; top: 100px; position:absolute; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.3);} */ header h1 {z-index: 12;flex-basis: content;text-align: left;} header h1 img { height: 35px; /* filter: brightness(0) grayscale(1) invert(1); */} header h1 .menu-white { display:none;} header h1 a { display: inline-block;} header .box_inner {z-index:4; position: relative;display:flex; max-width: 1640px; padding: 15px 20px 0 20px; width: 100%; height: 100%;justify-content: space-between; align-items: center;} header:not(.menu-scroll) .nav_wrap { display: none;} .menu-scroll .yes-scroll { display:inline-block;} .menu-scroll .no-scroll { display:none;} .menu-scroll h1 img { filter:none; } /*웹용 메뉴*/ .nav_web { margin-left: auto; margin-right: 0; padding-left: 5%; max-width: 710px; height: 100%; flex:1 1 710px; position: relative;} .nav_web a { height: 100%;color:#fff; } .nav_web>ul {width:100%; height: 100%; display: flex; justify-content: space-between; align-items: center; } .nav_web>ul>li { flex: 1; height: 100%;position:relative; display: inline-block; text-align: left;} .nav_web>ul>li:hover>a:after { content:''; bottom:-2px; position: absolute; height:4px; width: 80%; left:0; background:#8edf02;} .nav_web>ul>li:hover>a { color:#8edf02 } .nav_web>ul>li>a { position: relative; font-size: 1.1em; font-weight: 700;} .nav_web a:hover { color:#8edf02} .nav_web li li a { color:#b5b5b5; padding: 9px 0;} .nav_web a { width:100%;} .nav_web ul ul { position: absolute; width:100%; text-align: left; display: none; height: 170px; letter-spacing: -0.3px; padding: 15px 7px;/* background:red; */ } .nav_web li:not(.nav_head) a { display: flex; justify-content: start;align-items: center; } .nav_web .nav_head span { padding-left: 14px; position: relative;} .nav_web .nav_head { padding-top: 35px;} .nav_web .nav_head span:first-of-type:after { right:-8px;top: 7px; content: ''; height: 10px; background:#fff; width: 1px; position: absolute;} .nav_web .nav_head .go { padding-left: 20px;} .nav_head_wrap { display: flex; justify-content: flex-end; align-items: center; width:100%; padding-top:5px;} .nav_head_wrap a { display:block; position: relative; font-size:0; padding: 10px 0px;} /*모바일용메뉴*/ .nav_md {width: 100%; height: 100%; top:0; right:0; position: fixed; z-index: 11;} .nav_md_wrap { position:absolute; right:0; background:#015ccf; height: 100%; width: 100%; /* max-width: 570px; */} .nav_md_wrap>ul { height: 100%; padding: 5em 0 0 0em; } .nav_md_wrap>ul>li { position:relative; width: 100%; max-width: 100%;display: inline-block; } .nav_md_wrap>ul>li>a { padding-left:3em; font-size: 1.05em; position: relative;} .nav_md_wrap>ul>li>a:before { position: relative; margin-top:-2px; vertical-align: middle; font-size: 0.6em; padding-right: 1.5em; content:'\253C'; display:inline-block} .nav_md_wrap a:hover {color:#fff;} .nav_md>ul>li:hover>a { color:#fff } .nav_md_wrap>ul>li:hover { padding-bottom: 0.7em} .nav_md ul ul { background:#2674d6; padding:0.8em 0% 0.8em 5em; display: none;} .nav_md ul ul a { font-size: 0.9em; font-weight: 400; padding: 3px 0; } .nav_md ul ul a br { display:none;} .nav_md ul ul a:hover { opacity: 1;} .nav_md ul a { position:relative; padding: 13px 0px; display: block; text-align: left; color:#fff;} .nav_md .nav_head span { padding-left: 14px; font-size: 1.8em;position: relative;} .nav_md .nav_head {text-align:left; border-bottom:1px solid #d3d1d0; padding: 40px;} .nav_md .close { position:absolute; right:20px; width: 40px; height: 50px; z-index: 11;} .nav_md .close a { position: relative; display: block; font-size:0;width: 100%; height: 100%;} .nav_md .close a:after {transform: translate(-50%, -50%); top: 60%; left:47%; position:absolute; content:'\2715'; font-weight: 100; color:#fff; font-size: 1.7rem; z-index:6} /* 국영문 */ header .nav_head { padding-top: 5px; width:5em; min-width: 90px; font-size: 1.1em; position: relative; z-index:12;} .nav-head-box { display:flex; border-radius: 2em; line-height: 1; padding:0.12em 0.2em 0.14em 0.2em; border:1px solid #fff; justify-content: center; align-items: center; } .nav-head-box .nav-lang { display:flex; width:100%; position: relative; font-weight:700; justify-content: center; text-align: center;} .nav-head-box .nav-lang p:after { content:''; height: 0.6em; width:2px; background:#fff; position: absolute; right:0; top:48%; transform: translateY(-50%);} .nav-head-box .nav-lang p { position: relative; display:inline-block;} .nav-head-box .nav-lang p:last-of-type:after { opacity: 0;} .nav-head-box .nav-lang .active, .nav-head-box .nav-lang a:hover { color:#8edf02} .nav-head-box .nav-lang a { color:#fff; padding: 0 0.4em;} /* 메뉴 스크롤 시 */ .menu-scroll { background-color:rgba(0,0,0, 0.71); } .menu-scroll .nav_web ul ul {width: 100%; top: 110px; padding: 10px 0;position:absolute; } .menu-scroll .nav_web { z-index:4;} .menu-scroll .nav_web>ul>li>a { position: relative; height:100%; text-align: center;} .menu-scroll .nav_wrap { border-top:1px solid #66686b; display: block; z-index:1;width: 100%; height: 200px;background-color:rgba(0,0,0, 0.71); position: absolute; left:0; top: 110px;} /* 2depth 배경 */ .menu-scroll .nav_head p { width:100%;} .menu-scroll .menu-white { display:none;} /* 메뉴 스크롤 검정 */ .menu-scroll-black .nav_web>ul>li>a {color:#000; } .menu-scroll-black h1 .menu-black { display:none;} .menu-scroll-black h1 .menu-white { display:block;} .menu-scroll-black .nav-head-box .nav-lang a { color:#000;} .menu-scroll-black .nav-head-box { border-color:#000;} .menu-scroll-black .nav-head-box .nav-lang p:after { background:#000;} .menu-scroll-black .nav-head-box .nav-lang a.active { color:#8edf02 } .menu-scroll-black .menu_view a:after { color:#000;} /*모바일메뉴 오픈시 로고/국영문 */ .nav-md-view h1 img { filter: brightness(0) grayscale(1) invert(1);} .nav-md-view .nav-head-box .nav-lang .active, .nav-md-view .nav-head-box .nav-lang a:hover { color:#8edf02} /* 모바일메뉴보기 버튼 */ .menu_view {display:none; position:absolute; top:0px; right:10px; width: 60px; height: 60px; padding-top:5px; z-index: 5;} .menu_view a { position: relative; display: block; font-size:0;width: 100%; height: 100%;} .menu_view a:after { width: 100%; height: 70%; position: absolute; left: 48%; top:50%; transform: translate(-50%, -50%); content: ''; content:'\2261'; font-weight: 100; color:#fff; font-size: 2rem; line-height:2rem; z-index: 6} .container {background: transparent; margin: 0 auto; text-align: center;} /*메인상단 슬라이드 뒷배경*/ .scroll-box-1 .ls-slide-backgrounds { position:absolute; left:0; top:0; width: 100%; height: 100%; overflow:hidden;} .scroll-box-1 .ls-slide-backgrounds img {object-fit: cover; max-height: 100%; height: 100%; width: 100%; object-position: 30% center;} .scroll-box-1 .ls-slide-texts { z-index: 2; padding: 0px 20px; max-width: 1640px; text-align: left;width: 100%;color:#fff; position:absolute; left:50%; top:50%; transform: translate( -50%, -50%);} .scroll-box-1 .ls-head {font-weight:300; letter-spacing: -0.03em; word-break: keep-all; position: relative; padding-bottom: 0.4em; line-height: 1.35; font-size : 2.6em;} .scroll-box-1 .ls-info1 {letter-spacing: -0.05em;font-size: 1.3em; padding-bottom: 0.3em; line-height: 1.3em} .scroll-box-1 .ls-info2 {letter-spacing: -0.05em;font-size: 1em; padding-bottom: 2.5em; line-height: 1.3em} .scroll-box-1 .ls-btn a { letter-spacing: -0.3px; border-radius: 100px; font-weight:600; font-size: 0.75em; line-height:1; display:inline-block; position: relative; padding:1.2em 1.1em; color:#fff;} .scroll-box-1 .ls-btn a:before { content:''; left:-0.5%; top:50%; transform: translateY(-50%); position: absolute; z-index:-1; width: 3.6em; transition:width 0.15s; height:3.6em; background:#8edf02; border-radius: 2em; line-height:1;} .scroll-box-1 .ls-btn a:hover:before { width: 100%; background:#8edf02} .scroll-box-1 .ls-btn a:after {filter: brightness(0) grayscale(1) invert(1); position: relative; content:''; height:0.9em; width: 3em; background-position: right center; background-repeat: no-repeat; background-size: contain; display:inline-block; } /*메인 모바일 슬라이드*/ .scroll-box-1 .scroll-box-btn2 { color:#fff; z-index: 5; width: 100%; max-width: 1920px; position: absolute; bottom:450px; } .scroll-box-1 { position:relative; width: 100%; height: 100%;} .scroll-box-1-1 { height: 100%;z-index: 2;} /*메인 스크롤 버튼*/ .scroll-box-1 .scroll-box-btn { width:50px; color:#fff; z-index: 5; display:flex; position: absolute; right:-0.2em; top:52%; transform: translateY(-50%);} .scroll-box-1 .scroll-btn { padding-left: 5px; padding-bottom: 1em; z-index: 4;display: flex; flex-direction: column; justify-content : end;align-items: center; clear: both; width: 100%; position: relative;} .scroll-box-1 .scroll-btn a { margin: 1em 0; background-color:transparent; width:1.7em; height:1.7em; line-height: 1; border-radius: 2em; display:block; color:#fff; position: relative;} .scroll-box-1 .scroll-btn a:hover, .scroll-box-1 .scroll-btn .active { background:rgba(255,255,255,0.5);} .scroll-box-1 .scroll-btn span { font-size:0; display:block;position: absolute; left:50%; top:50%; border-radius: 0.3rem; transform: translate(-50%, -50%); line-height:1; width: 0.4rem; height:0.4rem; background:#fff; } /*메인 product*/ .scroll-box-2 { position:relative; width: 100%; height: 100vh; overflow: hidden; } .scroll-box-2 .ls-slide-backgrounds {position:absolute; left:0; bottom:0; width: 66%; height: 100vh; overflow:hidden;} .scroll-box-2 .ls-slide-backgrounds img {height: 100vh; width: 100%; object-fit: cover; } .scroll-box-2 .scroll-box-2-1 { width:100%; height:100%; display: table; table-layout: fixed;} .scroll-box-2 button {top:50%; font-size:0; border:none; border-radius: 5px; width:4rem; height: 4rem; background:none; position: absolute; z-index: 5;} .scroll-box-2 button:after {background-position: center center; transform: translate(0%, -50%); top:50%; left:0%; width:100%; height:100%; content:'';position: absolute; background-size: contain; background-repeat: no-repeat;} .scroll-box-2 .slide-right:after { left: auto; right:0% } .scroll-box-2 .slide-left { left:3rem; } .scroll-box-2 .slide-left:after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='75px' height='109px'%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M74.952,2.080 L74.071,0.971 L0.965,57.765 L74.100,108.979 L74.923,107.827 L3.351,57.707 L74.952,2.080 Z'/%3E%3C/svg%3E");} .scroll-box-2 .slide-right { right:3rem; } .scroll-box-2 .slide-right:after { filter: brightness(0) grayscale(1) invert(1); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='75px' height='109px'%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M0.048,2.080 L0.929,0.971 L74.035,57.765 L0.900,108.979 L0.077,107.827 L71.649,57.707 L0.048,2.080 Z'/%3E%3C/svg%3E");} .scroll-box-2 .slide-in { flex-wrap: wrap; width: 100%; height:100%; position: relative; margin:0 auto; } .scroll-box-2 .slide-in .slide-box { height:100%; width:100%; margin:0 auto; } .scroll-box-2 .slide-in .list { background:#fff; display:flex; justify-content: space-between; align-items: center; width:100%; height:100vh;} .scroll-box-2 .inner-box { display:table-cell; width:100%; height:100%;vertical-align:middle; text-align: center;} .scroll-box-2 dl { letter-spacing: -0.04em; text-align: left; width: 32%; max-width: 520px; margin-left: auto;} .scroll-box-2 dt p { font-size: 1.1em; font-weight:600; padding-bottom: 0.6em; } .scroll-box-2 dd p { line-height: 1.6em; font-size: 0.95em; display:block; padding: 2em 0 2em 0; color:#535353} .scroll-box-2 dt h3 { line-height: 1.3em; font-size: 2.2em; } .scroll-box-2 .ls-img-01 { width: 66%; height:100%; } .scroll-box-2 .ls-img-01 img { object-position: right 50%; object-fit: cover; width:100%; height:100%;} .scroll-box-2 .ls-btn a { z-index:2; letter-spacing: -0.3px; border-radius: 100px; font-weight:600; font-size: 0.75em; line-height:1; display:inline-block; position: relative; padding:1.2em 1.1em; color:#8edf02;} .scroll-box-2 .ls-btn a span { position: relative;} .scroll-box-2 .ls-btn a:before { content:''; left:-0.5%; top:50%; transform: translateY(-50%); position: absolute; z-index:-1; width: 3.6em; transition:width 0.15s; height:3.6em; background:#8edf02; border-radius: 2em; line-height:1;} .scroll-box-2 .ls-btn a:hover:before { width: 100%; background:#8edf02} .scroll-box-2 .ls-btn a:hover:after { filter: brightness(0) grayscale(1) invert(1); } .scroll-box-2 .ls-btn a:after {position: relative; content:''; height:0.9em; width: 3em; background-position: right center; background-repeat: no-repeat; background-size: contain; display:inline-block; } .scroll-box-2 .ls-btn a span, .scroll-box-2 .ls-btn a:hover { color:#fff;} /*메인 business*/ .scroll-box-3 { position:relative; width: 100%; height: 100vh; overflow:hidden } .scroll-box-3 .ls-slide-backgrounds {position:absolute; left:0; bottom:0; width: 100%; height: 100vh; overflow:hidden;} .scroll-box-3 .ls-slide-backgrounds img {object-fit: cover; object-position: 32% center; max-height: 100vh; height: 100vh; width: 100%;} .scroll-box-3 .scroll-box-3-1 { height:100%; width:100%; display: table; table-layout: fixed; position: relative; } .scroll-box-3 .inner-box { margin: 0px auto; max-width: 1640px; padding-left:20px; padding-right:20px;} .scroll-box-3 .box-area { height:100%; display:table-cell; width:100%;vertical-align:middle; } .scroll-box-3 .m-head { color:#fff; position: relative; text-align: center; } .scroll-box-3 .m-head h2 { padding-top: 0.5em; padding-bottom: 0.5em; line-height: 1.15em;} .scroll-box-3 .m-head p { font-size: 2em; font-weight:300;} .scroll-box-3 .box-inner { padding-top: 7%; height:100%; display:flex; justify-content: center; align-items: stretch;} .scroll-box-3 .box-inner .ls-list { position: relative; width: 33.333%; border-right:1px solid #fff;} .scroll-box-3 .box-inner .ls-list:last-of-type { border:none;} .scroll-box-3 .ls-info { display:flex; padding-top:1em; color:#fff; justify-content: center; flex-direction:column; align-items: center; margin-bottom:auto; position: relative; } .scroll-box-3 .ls-list .ls-icon { margin-left: -3px; width: 13em; height: auto; position: relative; display: inline-block; vertical-align: middle;} .scroll-box-3 .ls-list a:hover .d-hover-none { display:none;} .scroll-box-3 .ls-list a:hover .d-hover-view { display:inline-block;} .scroll-box-3 .ls-list .d-hover-view { display:none;} .scroll-box-3 .ls-list .ls-icon { text-align: center;} .scroll-box-3 .ls-list .ls-icon img { max-width: 80%; height: 100%;} .scroll-box-3 .ls-info h3 { font-size: 1.15em; line-height: 1.3em; padding-bottom: 0.4em;} .scroll-box-3 .ls-info p { display:block; line-height: 1.6em; font-size: 0.7em; } /*메인 news*/ .scroll-box-4 { position:relative; width: 100%; height: 100vh; overflow:hidden } .scroll-box-4 .ls-slide-backgrounds {position:absolute; left:0; bottom:0; width: 100%; height: 100vh; overflow:hidden;} .scroll-box-4 .ls-slide-backgrounds img {object-fit: cover; max-height: 100vh; height: 100vh; width: 100%;} .scroll-box-4 .scroll-box-4-1 { height:100%; width:100%; display: table; table-layout: fixed; position: relative;} .scroll-box-4 .m-head { width:100%; max-width:1640px; position: relative; text-align: left; } .scroll-box-4 .m-head h2 { padding-top: 0.5em; padding-bottom: 0.5em; line-height: 1.15em;} .scroll-box-4 .m-head p {font-weight:500; line-height: 1.25em; font-size: 2em;} .scroll-box-4 .box-area { height:100%; display:table-cell; width:100%; vertical-align:middle;} .scroll-box-4 .box-inner { padding-top: 2%; height: 100%; width:100%; } .scroll-box-4 .inner-box { position:relative; width:calc(100% + 100px); padding-left:140px; } .scroll-box-4 .ls-list { text-align: left; width: 29em; /* max-width: 396px; */ margin-right: 2.7em;} .scroll-box-4 .ls-info h3 { font-size: 1.05em; height:5em; line-height: 1.4em; padding-top: 1.5em; } .scroll-box-4 .ls-list .ls-img-01 { position: relative; width:100%;} .scroll-box-4 .ls-list a:hover .ls-img-01:after { width:100%; height:100%; left:0; top:0; content:'';mix-blend-mode: multiply; position: absolute; background:rgba(0,93,204,0.6);} .scroll-box-4 .ls-list img { width:100%; height:100%; max-height:200px; object-fit: cover; max-height: 300px; } .scroll-box-4 .ls-info p { display:block; font-size: 0.7em; color:#626262; } .scroll-box-4 .ls-btn { bottom:0; position: absolute; right:0;} .scroll-box-4 .ls-btn a { z-index:2; letter-spacing: -0.3px; border-radius: 100px; font-weight:600; font-size: 0.75em; line-height:1; display:inline-block; position: relative; padding:1.2em 1.1em; color:#8edf02;} .scroll-box-4 .ls-btn a span { position: relative;} .scroll-box-4 .ls-btn a:before { content:''; left:-0.5%; top:50%; transform: translateY(-50%); position: absolute; z-index:-1; width: 3.6em; transition:width 0.15s; height:3.6em; background:#8edf02; border-radius: 2em; line-height:1;} .scroll-box-4 .ls-btn a:hover:before { width: 100%; background:#8edf02} .scroll-box-4 .ls-btn a:hover:after { filter: brightness(0) grayscale(1) invert(1); } .scroll-box-4 .ls-btn a:after {position: relative; content:''; height:0.9em; width: 3em; background-position: right center; background-repeat: no-repeat; background-size: contain; display:inline-block; } .scroll-box-4 .ls-btn a span, .scroll-box-4 .ls-btn a:hover { color:#fff;} .scroll-box-4 .slide-btn { position: relative; padding-top: 5em; } .scroll-box-4 button { top:50%; font-size:0; border:none; border-radius: 5px; width:2rem; height: 2rem; background:none; position: absolute; z-index: 5;} .scroll-box-4 button:after { background-position: center center; transform: translate(0%, -50%); top:50%; left:0%; width:100%; height:100%; content:'';position: absolute; background-size: contain; background-repeat: no-repeat;} .scroll-box-4 .slide-right:after { left: auto; } .scroll-box-4 .slide-left { left:0; } .scroll-box-4 .slide-left:after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='75px' height='109px'%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M74.952,2.080 L74.071,0.971 L0.965,57.765 L74.100,108.979 L74.923,107.827 L3.351,57.707 L74.952,2.080 Z'/%3E%3C/svg%3E");} .scroll-box-4 .slide-right { right:auto; left:2.5rem; } .scroll-box-4 .slide-right:after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='75px' height='109px'%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 0, 0)' d='M0.048,2.080 L0.929,0.971 L74.035,57.765 L0.900,108.979 L0.077,107.827 L71.649,57.707 L0.048,2.080 Z'/%3E%3C/svg%3E");} /*서브상단 뒷배경*/ .snb-bg { height: 100vh;} .snb-bg .ls-slide-backgrounds { position:absolute; left:0; top:0; width: 100%; height: 100vh; overflow:hidden;} .snb-bg .ls-slide-backgrounds img {object-fit: cover; height: 100%; width: 100%; object-position: 65% center;} .snb-bg .box_inner { height: 100%; clear: both; position: relative; text-align: center; margin:0 auto; max-width: 1640px; padding-left:20px; padding-right:20px;} .snb-bg .ls-slide-texts {letter-spacing: -0.055em; text-align: left; width: 100%; color:#fff; position:absolute; left:50%; top:40%; transform: translate( -50%, -40%); padding-left:20px; padding-right:20px;} .snb-bg .ls-slide-texts .ls-info { font-size:2.6em; line-height: 1.4em; } .snb-bg .ls-slide-texts .ls-head { padding-left: 0.1em; font-size: 1.3em; font-weight: 600; padding-bottom:0.6em;} .snb { width: 100%; position: relative ; z-index:3;} .snb .snb-in { position: relative; z-index:3; width:100%; height:100%; margin:0 auto; max-width: 1640px; padding-left:20px; padding-right:20px; } .snb ul { font-size: 1.05em; padding-top: 2.5em; position: relative; display: flex; justify-content: start; align-items: center; height:100%; width: 100%; } .snb li {min-width: 8em; position: relative; height:100%;} .snb li:before { content:''; position: absolute; left:0; top:50%; transform: translateY(-50%); height:1em; width:2px; background:#aaaaaa} .snb li:last-of-type:after { content:''; position: absolute; right:0; top:50%; transform: translateY(-50%); height:1em; width:2px; background:#aaaaaa} .snb li a { display:block; height:100%; position: relative; color:#aaaaaa; letter-spacing: -0.03em; } .snb li a>span { display:flex; align-items: center; justify-content: center; height:100%; position: relative;} .snb li a span span { display:inline-block; } .snb li a:hover span:after, .snb li a.active span:after { z-index:4; left:50%; transform: translateX(-50%); text-align: center; font-size: 1.2em; line-height: 1.2em; position: absolute; bottom:-1.1em; height:1em; width:1em; content:'\2022';} .snb li a.active, .snb li a:hover {color:#000; font-weight:600; } .snb-color-01 { background:#000;} .snb-color-01 li a.active, .snb-color-01 li a.active {color:#fff; } .snb-color-01 li a:hover {color:#fff; } .snb-md { z-index: 8; position: relative; height: 40px; margin-left:20px; margin-right:20px; font-size:1.05em; } .snb_list { z-index:9; right:0px; top:40px; width: 100%; position: absolute; background:rgba(255,255,255,0.9); } .snb-md .snb_list ul { border:1px solid rgba(160,160,160,0.5); border-top:0; } .snb-md li { width: 100%;} .snb-md li a { line-height:1.6; text-align: center; color:#959595; border-top:1px solid rgba(160,160,160,0.5); position: relative; display: block; padding: 12px } .snb-md li a:hover, .snb-md li a.active { background:rgba(232,232,232,0.5); color:#ed2124} .snb-md i { font-size:0;font-style: normal; height:100%; display:block; width: 40px; position: absolute; right: 5px; top:0;} .snb-md i:after { z-index:4;position: absolute; color:#ed2124; top:50%; left:50%; content:'\25E2'; font-size:0.9rem; font-weight: 300; } .snb-md .snb_view:after { transform: translate(-59%, -65%) rotate( 45deg )} .snb-md .snb-close:after { transform: translate(-57%, -35%) rotate( -135deg )} .snb-md li:last-of-type a:after { display: none;} .snb-md .sel-menu { overflow:hidden; background:#fff;border-top-left-radius: 0.7em; border-top-right-radius: 0.7em; position: relative; display:flex; justify-content: center; align-items: center; text-align: left; height: 100%; } .snb-md .sel-menu h2 { padding-left:20px; width: 56%;} .snb-md .sel-menu a {display: block; height:100%;} .snb-md .sel-menu a span { color:#ed2124; display:flex; justify-content: center; align-items: center; height:100%; } .co-location { color:#9f9f9f; font-size: 0.6em; text-align: left;} /*메인 슬라이드 내용*/ .main_silde { height: 965px;} .main_silde .box_inner { margin:0 auto; max-width: 1757px;height: 900px; position: relative; } .main_silde .sildeBtn {position:absolute; bottom: 0px;} /*메인 슬라이드 버튼*/ .sildeBtn { display: flex; justify-content: center;align-items: center; clear: both; width: 100%;} .sildeBtn span { border:1px solid #035fff; display: inline-block; margin: 0 6px;background: #fff; font-size:0; border-radius: 9px; height:18px; width: 18px;} .sildeBtn span.active { background:#035fff; } .sub-menu { margin:0; margin-top:0!important; width: 100%;position: relative ; } .sub-menu ul { display: flex; justify-content:center; align-items: center; height: 115px;} .sub-menu li { display: inline-block; flex: 1 1 290px; width: 290px; max-width: 290px;} .sub-menu li a { border:1px solid #0b3775; color:#0b3775;font-size: 0.8em; display: block; padding: 20px 0 20px 0; background:#fff;} .sub-menu li a.active, .sub-menu li a:hover{ background:#0b3775; color:#fff;} .sub-menu li a { border-right:0;} .sub-menu li:last-of-type a { border-right:1px solid #0b3775;} .clearfix { clear: both} .vr-center { width: 100%; text-align:center;position:absolute; left:50%; top:50%; transform: translate( -50%, -50%); } .head-line .text { padding-bottom: 150px;color:#0b3775; font-size: 3rem; position: relative; font-weight: 600; letter-spacing: -0.5px;} .head-line .text:after { z-index:5;content:''; width: 1px; height: 65px; position: absolute; left:50%; top: 100px;transform: translate(-50%, 0); background:#000; } sup { font-size: 0.5em;} .bgc-01 { background-color:#8edf02;} .bgc-02 { background-color:#8edf02;} .bgc-03 { background-color:#8edf02;} .bgc-04 { background-color:#2478ad;} .bgc-05 { background-color:#595757;} .bgc-06 { background-color:#90c31f;} .bgc-07 { background-color:#000000;} .bgc-08 { background-color:#fff;} .fc-01 { color:#8edf02} .fc-01b { color:#0039cc} .fc-02 { color:#8edf02} .fc-03 { color:#8edf02!important;} .fc-04 { color:#d20000} .fc-05 { color:#acacac} .fn-01 { font-family: 'Play', 'Noto Sans KR', sans-serif!important; font-weight:700; } .fn-02 { font-family: 'GmarketSansBold', 'Noto Sans KR', sans-serif!important; } .fs-01 { font-weight: 300;} /*푸터*/ footer { background:#161616; color:#fff; position: relative; width: 100%; } footer .box-inner { margin:0 auto; width: 100%; padding: 25px 20px; max-width: 1640px; position: relative; } footer .footer { width:100%; padding-top: 30px; padding-bottom:30px;position: relative; height: 100%;text-align: left;} footer .foo-head-box { padding-bottom:5em; width:100%; display:flex; justify-content: start; align-items:stretch ;} footer .foo-menu { width: 50%;} footer .foo-menu>ul { padding-left: 0.5em; display:flex; justify-content: start; width: 50%;} footer .foo-menu>ul>li>a { font-size: 1.1em; padding: 0.2em 0 0.8em 0; padding-right: 3em; color:#959595} footer .foo-menu li li a { font-size: 1.05em; padding: 0.3em 0; font-weight: 400; color:#fff;} footer .foo-menu a { display:block;} footer .foo-menu>ul>li:hover>a { color:#8edf02; } footer .foo-menu li li a:hover { color:#8edf02; } footer .head-box { width:50%; display:flex; flex-direction: column; justify-content:flex-start; } footer .head-box .copy { bottom:0; position: absolute;} footer .logo { text-align: left; width:50%;} footer .col-box p { line-height: 1.8em; width:100%; } footer .copy {text-align: right; font-size: 0.9em; padding-top: 20px;} footer .col-box { border-top:1px solid #fff; padding-top: 1em; position: relative; width:100%;display:flex; justify-content: space-between; align-items: stretch;} footer h1 a { text-align: right; display:block;} /* sns + top */ .scroll-page-top { z-index:10; position:fixed; right: 20px; bottom:20px; height: 60px; width: 60px;} .scroll-page-top .scroll-page { position: absolute; left:0%; top: 50%;transform: translate(-0%, -50%); } .scroll-page-top .scroll-page li { padding: 10px 0; position: relative;} .scroll-page-top .scroll-page li a { font-size:0; position: relative; width: 49px; height: 49px; display:block; background:rgba(0,0,0,0.3); border-radius: 30px; } .scroll-page-top .scroll-page li a:hover { background:#8edf02} .scroll-page-top .scroll-page li a div {position: relative; width:100%; height:100%;} .scroll-page-top .scroll-page p { display:inline-block; color: #fff; filter :brightness(0) invert(1); width: 100%; height:100%; background-size: 55%; background-repeat: no-repeat; background-position: center center;} .page-top { z-index:4; position:absolute; height: 45px; width: 45px;} .page-top a { box-shadow: 0.1em 0.1em 0.3em rgba(0,0,0,0.3); border:1px solid #8edf02; color: #fff; background:#8edf02; border-radius: 50%;position: relative;display: block; width: 100%; height: 100%;} .page-top a span { font-size: 0.8em; position: absolute; top:50%; transform: translateY(-50%); width:100%; left:0; text-align: center;} /* .page-top a:after {content:'\2517';position: absolute; font-size: 0.85rem; left:52%; top:30%; transform: translate(-50%, -50%) rotate(135deg); } */ .ptb25 { padding: 25px 0;} .pt170 { margin-top: 170px;} .ptb50 { padding: 50px 0;} .pb20 { padding-bottom:20px;} .pb100 { padding-bottom:100px;} .fs09e { font-size: 0.9em } .fs12e { font-size: 1.2em } .fs08e { font-size: 0.8em } .wd1700 { max-width: 1700px;} .wdauto { width: auto;} .wd12p { width: 12%;} .wd30p { width: 30%;} .wd20p { width: 20%;} .wd15p { width: 15%;} .container {font-size: 1.2rem;} .container * { word-break: keep-all;} .d-lg-none { display:none;} /* pc 용 감추기 */ .d-sm-view { display:none;} .con-head { font-weight: bold;} /* 서브 컨텐츠 제목 */ .con-head h3 { font-size: 1.4em; color:#8edf02;} .con-head p { letter-spacing: -0.01em; font-size: 2.3em; padding-top: 0.3em; font-weight: 800;} .con-head+.con-head { padding-top: 70px;} .ls-tab-01 a { font-size: 1.05em; color:#aaaaaa; border-radius: 5em; display:block; border:1px solid #aaaaaa; padding: 0.4em 0 0.5em 0; line-height:1;} .ls-tab-01 ul { display:flex; } .ls-tab-01 a:hover, .ls-tab-01 a.active{ font-weight:600; color:#fff; border-color:#000; background:#000; } .ls-tab-02 a {display:block; color:#c8c8c8; padding: 10px 0; } .ls-tab-02 a:hover, .ls-tab-02 a.active{ color:#ed2124; } .ls-tab-02 a:hover span, .ls-tab-02 a.active span { border-bottom:1px solid #ed2124; font-weight:600; } .ls-icon-01:after {/*화살표*/background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='22px' height='14px'%3E%3Cpath fill-rule='evenodd' fill='rgb(0, 57, 204)' d='M12.615,-0.006 L12.194,0.590 L20.242,6.294 L0.009,6.294 L0.009,7.024 L20.333,7.024 L12.180,13.435 L12.629,14.010 L21.995,6.644 L12.615,-0.006 Z'/%3E%3C/svg%3E"); } .ls-icon-02:after {/*전화*/background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='48px' height='46px'%3E%3Cpath fill-rule='evenodd' fill='rgb(182, 182, 184)' d='M45.527,35.743 C42.795,33.767 39.991,31.887 37.173,30.035 C35.084,28.662 34.572,28.773 32.740,30.594 C30.401,32.916 28.033,33.173 25.170,31.497 C21.091,29.109 18.453,25.300 15.644,21.678 C13.608,19.054 13.734,17.538 16.061,15.153 C17.394,13.785 17.618,12.463 16.461,10.906 C14.216,7.882 12.039,4.805 9.742,1.823 C8.293,-0.058 6.522,-0.295 4.544,1.030 C1.833,2.845 0.321,5.420 0.170,8.720 C0.000,12.459 1.066,15.951 2.564,19.299 C7.354,30.011 15.587,37.329 25.760,42.494 C28.691,43.981 32.072,44.730 33.906,44.975 C39.204,45.686 42.730,43.931 45.661,41.362 C47.977,39.331 48.000,37.533 45.527,35.743 Z'/%3E%3C/svg%3E"); } /* 회사소개 */ .con-com-01 { overflow: hidden; margin:0 auto; padding: 3em 0px 0 0px; position: relative;} .con-com-01 .con-head { text-align: left; max-width: 1640px; margin:0 auto; padding-left:20px; padding-right:20px;} .con-com-01 .com-box-01 { width: 100%; max-width: 1920px; margin:0 auto; padding: 5em 0; } .con-com-01 .ls-box-in { overflow: hidden; padding-top: 1em; width:100%; justify-content: center; display:flex; align-items: stretch; } .con-com-01 .ls-txt-01 { letter-spacing: -0.05em; text-align: left; width: 50%;max-width:823px; margin-left: auto; padding-left:20px;} .con-com-01 .ls-txt-01 strong { font-weight:400; font-size: 2.6em; line-height: 1.35em} .con-com-01 .ls-txt-01 p { line-height: 1.5em; text-align: justify; opacity: 0.8; font-size: 0.9em; padding-top: 3em;} .con-com-01 .ls-img-01 { text-align: right; width: 50%; height:598px; padding-left: 7%;} .con-com-01 .ls-img-01 img { height:100%;max-height:100%; object-fit: cover; width:100%; object-position: center center;} .con-com-01 .com-box-02 { text-align: center; background:#000; padding: 5em 0; } .con-com-01 .con-box-02 {position: relative; width: 100%; max-width: 1540px; margin:0 auto; padding: 0em 20px } .con-com-01 .com-box-02 .con-head {text-align: center;} .con-com-01 .com-box-02 .con-head p { color:#fff;} .con-com-01 .ls-list-box { width:100%; display:flex; justify-content: space-between; align-items: stretch;} .con-com-01 .ls-list-box .ls-list { color:#fff; text-align: center; padding: 4em 0em; width: 25%; position: relative; } .con-com-01 .ls-list-box .ls-list p { padding-top: 1.4em; line-height: 1.8em; font-size: 0.9em; color:#5f5f5f; } .con-com-01 .ls-list-box .ls-list:after { content:''; height:45%; width:1px; background:#fff; position: absolute; right:0; top:50%; transform: translateY(-50%);} .con-com-01 .ls-list-box .ls-list:last-of-type:after { display:none;} .con-com-01 .ls-list-box .ls-icon { height: 6.5em;} .con-com-01 .ls-list-box .ls-icon img { height:80%; } .con-com-01 .ls-list-box h4 { font-size: 1.2em;} .con-com-01 .com-box-03 { display:table; vertical-align: middle; width:100%; height: 620px; background-position: center center; background-size: cover;} .con-com-01 .con-box-03 { display:table-cell; vertical-align: middle;} .con-com-01 .con-box-03 .con-head { width:100%; text-align: center;} .con-com-01 .ls-txt-02 {width:100%; padding-top: 0.5em; font-weight: 600; font-size: 2.05em; color:#fff; } .con-com-01 .ls-btn { padding-top: 2em;} .con-com-01 .ls-btn a { z-index:2; letter-spacing: -0.3px; border-radius: 100px; font-weight:600; font-size: 0.85em; line-height:1; display:inline-block; position: relative; padding:1.2em 1.3em; color:#fff;} .con-com-01 .ls-btn a span { position: relative;} .con-com-01 .ls-btn a:before { content:''; left:-0.5%; top:50%; transform: translateY(-50%); position: absolute; z-index:-1; width: 100%; height:3.1em; background:#8edf02; border-radius: 2em; line-height:1;} .con-com-01 .ls-btn a:after { filter: brightness(0) grayscale(1) invert(1); position: relative; content:''; height:0.8em; width: 2.2em; background-position: right center; background-repeat: no-repeat; background-size: contain; display:inline-block; } .con-com-01 .ls-btn a span, .con-com-01 .ls-btn a:hover { color:#fff;} /* 사업분야 */ .con-com-02 { overflow: hidden; background:#000; margin:0 auto; padding: 3em 0px 0 0px; position: relative;} .con-com-02 .con-head { text-align: left; max-width: 1640px; margin:0 auto; padding-left:20px; padding-right:20px;} .con-com-02 .com-box-01 { width: 100%; padding: 5em 0 3em 0; } .con-com-02 .con-box-01 {padding-top:1em;} .con-com-02 .con-box-01 .ls-img-01 { z-index:0; position: relative; margin-top: -5em; height: 29em; background-position: top center; background-size: cover; background-repeat: no-repeat; } .con-com-02 .ls-txt-01 {z-index:1; position: relative; text-align: left; font-weight:400; color:#fff; font-size: 2.6em; line-height: 1.35em; max-width: 1640px; margin:0 auto; padding-left:20px; padding-right:20px; } .con-com-02 .com-box-02 { max-width: 1640px; margin:0 auto; padding:5em 20px; } .con-com-02 .ls-list-box { width:100%; display:flex; justify-content: space-between; align-items: stretch;} .con-com-02 .ls-list-box .ls-list { color:#fff; text-align: center; width: 31.7%; position: relative; } .con-com-02 .ls-list-box dl { width:100%; padding: 13% 12.5%; flex-direction: column; display:flex; text-align: left; top:0; position: absolute; height:100%; color:#fff;} .con-com-02 .ls-list-box dd { line-height: 1.6em; min-height: 4.5em; text-align: justify; margin-top: auto; font-size: 0.9em} .con-com-02 .ls-list-box dt { font-weight: 600; font-size: 1em; } .con-com-02 .ls-list-box dt strong { font-size: 1.8em; } .con-com-02 .ls-list-box .ls-img-02 {position: relative;} .con-com-02 .ls-list-box .ls-img-02 img { width:100%; } /* 채용안내 */ .con-com-03 { overflow: hidden; margin:0 auto; padding: 3em 0px 0 0px; position: relative;} .con-com-03 .con-head { text-align: left; max-width: 1640px; margin:0 auto;} .con-com-03 .com-box-01 { width: 100%; max-width: 1640px; margin:0 auto; padding: 5em 20px; } .con-com-03 .con-box-01 { padding-top:1em; } .con-com-03 .ls-txt-01 {z-index:1; position: relative; text-align: left; font-weight:400; font-size: 2.6em; line-height: 1.35em;} .con-com-03 .head-txt { padding-bottom: 2em; font-size: 2.1em; text-align: left;} .con-com-03 .con-box-02 { padding-top: 7em;} .con-com-03 .con-box-03 { padding-top: 7em;} .con-com-03 .con-box-04 { padding-top: 7em;} .con-com-03 .ls-list-type .ls-list { padding: 2%; text-align: left; background-position: 96% 1.5em; background-repeat: no-repeat; background-size: 4.2em auto; border:1px solid #959595} .con-com-03 .ls-list-type { letter-spacing: -0.01em; margin-right:-2em; flex-wrap: wrap; display:flex; justify-content: start; align-items: stretch;} .con-com-03 .ls-list-box-01 dt { font-size: 1.35em; font-weight: 600; padding-bottom: 0.5em;} .con-com-03 .ls-list-box-01 ul { display:flex; flex-wrap: wrap;} .con-com-03 .ls-list-box-01 li::before { display:inline-block;padding-right: 0.3em; content:'\00B7';} .con-com-03 .ls-list-box-01 .ls-list{ width: calc(50% - 2em); margin-right:2em;} .con-com-03 .ls-list-box-03 .ls-list{ width: calc(33.333% - 2em); margin-bottom:2em; margin-right:2em;} .con-com-03 .ls-list-type .ls-type { font-size: 0.7em; opacity: 0.5;} .con-com-03 .ls-txt-02 { margin-top: 1.2em; border-top:1px solid #000; padding-top: 1.2em;} .con-com-03 .ls-txt-02 strong { font-weight:500; font-size: 1.1em; display:block; padding-bottom:0.7em} .con-com-03 .ls-txt-02 li { padding-right: 0.3em; opacity: 0.8; font-size: 0.9em;} .con-com-03 .ls-list-type dl { padding-top: 4em;} .con-com-03 .ls-list-type dd { opacity: 0.8; font-size: 0.9em} .con-com-03 .ls-list-box-03 dt {font-weight:500; font-size: 1.1em; display:block; padding-bottom:0.7em} .con-com-03 .ls-list-box-02 { flex-wrap: wrap; display:flex; justify-content: space-between;} .con-com-03 .ls-list-box-02 .ls-num {display:inline-block; width: 2.1em; height: 2.1em; line-height: 1em; font-size: 1.2em; border-radius: 1.2em; padding: 0.5em; ;} .con-com-03 .ls-list-box-02 .ls-list {padding: 6% 0; position: relative;width: 24%} .con-com-03 .ls-list-box-02 .ls-list:before {z-index:-1; content:''; width: 100%; height:100%; left:50%; top:50%; transform: translate(-50%, -50%); position: absolute; background-repeat: no-repeat; background-position: center center; background-size: contain; } .con-com-03 .ls-list-box-02 .ls-list:nth-child(1):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='none' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-03 .ls-list-box-02 .ls-list:nth-child(2):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(243, 243, 243)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-03 .ls-list-box-02 .ls-list:nth-child(3):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(225, 225, 225)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-03 .ls-list-box-02 .ls-list:nth-child(4):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(0, 0, 0)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-03 .ls-list-box-02 .ls-list:nth-child(1) .ls-num { background:rgba(0,0,0,0.1)} .con-com-03 .ls-list-box-02 .ls-list:nth-child(2) .ls-num { background:rgba(0,0,0,0.1)} .con-com-03 .ls-list-box-02 .ls-list:nth-child(3) .ls-num { background:rgba(0,0,0,0.1)} .con-com-03 .ls-list-box-02 .ls-list:nth-child(4) .ls-num { color:#000; background:rgba(255,255,255,1)} .con-com-03 .ls-list-box-02 .ls-list:nth-child(4) { color:#fff;} .con-com-03 .ls-list-box-02 dt { font-size: 1.35em; font-weight: 600; padding: 0.5em 0;} .con-com-03 .ls-list-box-02 dd { font-size: 1em;} .con-com-03 .com-box-02 { display:table; vertical-align: middle; width:100%; height: 26em; background-position: center center; background-size: cover;} .con-com-03 .con-box-05 { width:100%; display:table; height:100%; max-width: 1640px; margin:0 auto; padding-left:20px; padding-right:20px; vertical-align: middle;} .con-com-03 .ls-txt-03 {display:table-cell; vertical-align: middle; text-align: left; width:80%; padding-top: 0.5em; font-weight: 600; font-size: 2.05em; color:#fff; } .con-com-03 .ls-btn { display:table-cell; vertical-align: middle; width:20%;} .con-com-03 .ls-btn a { z-index:2; letter-spacing: -0.3px; border-radius: 100px; font-weight:600; font-size: 0.85em; line-height:1; display:inline-block; position: relative; padding:1.2em 1.3em; color:#fff;} .con-com-03 .ls-btn a span { position: relative;} .con-com-03 .ls-btn a:before { content:''; left:-0.5%; top:50%; transform: translateY(-50%); position: absolute; z-index:-1; width: 100%; height:3.1em; background:#8edf02; border-radius: 2em; line-height:1;} .con-com-03 .ls-btn a:after { filter: brightness(0) grayscale(1) invert(1); position: relative; content:''; height:0.8em; width: 2.2em; background-position: right center; background-repeat: no-repeat; background-size: contain; display:inline-block; } .con-com-03 .ls-btn a span, .con-com-03 .ls-btn a:hover { color:#fff;} /* 세이프로드 */ .con-com-04 { overflow: hidden; margin:0 auto; padding: 3em 0px 0 0px; position: relative;} .con-com-04 .con-head { text-align: left; max-width: 1600px; margin:0 auto;} .con-com-04 .ls-tab-box { width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-04 .ls-tab-box li { min-width:8em; margin-right: 0.5em;} .con-com-04 .com-box-01 { width: 100%; max-width: 1640px; margin:0 auto; padding: 5em 20px; } .con-com-04 .com-box-02 { color:#fff; text-align: center; vertical-align: middle; width:100%; padding: 4em 0; background-position: center center; background-size: cover;} .con-com-04 .com-box-03 { width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-04 .com-box-04 { position: relative; width: 100%; max-width: 1640px; margin:0 auto; padding: 5em 20px; } .con-com-04 .com-box-04:before { position: absolute; content:''; top:0; height:1px; width:calc(100% - 40px); left:0; max-width: 1600px; margin:0 auto; transform: translateX(20px); background:#959595} .con-com-04 .com-box-07:before { position: absolute; content:''; top:0; height:1px; width:calc(100% - 40px); left:0; max-width: 1600px; margin:0 auto; transform: translateX(20px); background:#959595} .con-com-04 .com-box-05 { color:#fff; text-align: center; vertical-align: middle; width:100%; padding: 4em 0; background-position: center center; background-size: cover;} .con-com-04 .com-box-06 { position: relative; width: 100%; max-width: 1640px; margin:0 auto; padding: 7em 20px 10em 20px; } .con-com-04 .com-box-07 {position: relative; width: 100%; max-width: 1640px; margin:0 auto; padding: 5em 20px; } .con-com-04 .com-box-08 { color:#fff; text-align: center; vertical-align: middle; width:100%; padding: 4em 0; background-position: center center; background-size: cover;} .con-com-04 .com-box-09 {position: relative; width: 100%; max-width: 1640px; margin:0 auto; padding: 7em 20px 10em 20px; } .con-com-04 .con-box-01 { padding-top:1em; display:flex; align-items: start;} .con-com-04 .con-box-02 {width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-04 .con-box-05 { padding: 7em 0 10em 0;} .con-com-04 .con-box-06 { padding-top:1em; display:flex; align-items: start;} .con-com-04 .con-box-07 {width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-04 .con-box-09 { padding-top:1em; display:flex; align-items: center; justify-content: space-between} .con-com-04 .con-box-10 {width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-04 .ls-txt-01 { max-width: 1000px; padding-right:5%; z-index:1; position: relative; text-align: left;} .con-com-04 .ls-txt-01 strong { font-weight:400; font-size: 2.3em; line-height: 1.35em; letter-spacing: -0.02em; } .con-com-04 .ls-txt-01 p { padding-top: 2em; line-height: 1.5em; opacity: 0.8; font-size: 1.1em; } .con-com-04 .ls-img-01 { width: 40%; max-width: 430px; margin-left:auto; padding: 3em 2em; border:1px solid #cacaca;} .con-com-04 .ls-img-01 img { max-width:100%;} .con-com-04 .ls-img-03 { width: 40%; max-width: 430px; margin-left:auto;} .con-com-04 .ls-img-03 img { max-width:100%;} .con-com-04 .head-txt { padding-bottom: 1.5em; font-size: 2.3em; text-align: left;} .con-com-04 .com-box-02 .con-head { text-align: center; } .con-com-04 .com-box-05 .con-head { text-align: center; } .con-com-04 .com-box-08 .con-head { text-align: center; } .con-com-04 .con-box-02 .ls-list { color:#fff; text-align: center; padding: 2em 0em; width: 33.33%; position: relative; } .con-com-04 .con-box-07 .ls-list { color:#fff; text-align: center; padding: 2em 0em; width: 33.33%; position: relative; } .con-com-04 .con-box-10 .ls-list { color:#fff; text-align: center; padding: 2em 0em; width: 25%; position: relative; } .con-com-04 .ls-list-box { width:100%; display:flex; justify-content: space-between; align-items: stretch;} .con-com-04 .ls-list-box .ls-icon { width:100%; height: 9.41em; padding-left: 10%; padding-right:10%;} .con-com-04 .ls-list-box .ls-icon img { max-width:100%; height:100%;} .con-com-04 .ls-list-box .ls-list p { padding-top: 0em; line-height: 1.6em; font-size: 1.1em; font-weight:600} .con-com-04 .ls-list-box .ls-list:after { content:''; height:55%; width:1px; background:rgba(255,255,255,0.5); position: absolute; right:0; top:55%; transform: translateY(-50%);} .con-com-04 .ls-list-box .ls-list:last-of-type:after { display:none;} .con-com-04 .ls-list-box .ls-list span { font-size: 0.95em; opacity: 0.5; padding-top:0.5em; display:block} .con-com-04 .ls-list-box-02 { flex-wrap: wrap; display:flex; justify-content: space-between;} .con-com-04 .ls-list-box-02 .ls-num {display:inline-block; width: 2.1em; height: 2.1em; line-height: 1em; font-size: 1.2em; border-radius: 1.2em; padding: 0.5em; ;} .con-com-04 .ls-list-box-02 .ls-list {padding: 6% 0; position: relative;width: 24%} .con-com-04 .ls-list-box-02 .ls-list:before { z-index:-1; content:''; width: 100%; height:100%; left:50%; top:50%; transform: translate(-50%, -50%); position: absolute; background-repeat: no-repeat; background-position: center center; background-size: contain; } .con-com-04 .ls-list-box-02 .ls-list:nth-child(1):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(255, 255, 255)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-04 .ls-list-box-02 .ls-list:nth-child(2):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(243, 243, 243)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-04 .ls-list-box-02 .ls-list:nth-child(3):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(225, 225, 225)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-04 .ls-list-box-02 .ls-list:nth-child(4):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(149, 149, 149)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(142, 223, 2)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-04 .ls-list-box-02 .ls-list:nth-child(1) .ls-num { background:rgba(0,0,0,0.1)} .con-com-04 .ls-list-box-02 .ls-list:nth-child(2) .ls-num { background:rgba(0,0,0,0.1)} .con-com-04 .ls-list-box-02 .ls-list:nth-child(3) .ls-num { background:rgba(0,0,0,0.1)} .con-com-04 .ls-list-box-02 .ls-list:nth-child(4) .ls-num { color:#000; background:rgba(255,255,255,1)} .con-com-04 .ls-list-box-02 .ls-list:nth-child(4):after { display:none;} .con-com-04 .ls-list-box-02 .ls-list:after {z-index:-2; content:''; width: 3em; height:1em; right:-1.5em; top:50%; transform: translateY(-50%); position: absolute; background-repeat: no-repeat; background-position: center center; background-size: contain;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='42px' height='20px'%3E%3Cpath fill-rule='evenodd' fill='rgb(191, 191, 191)' d='M29.056,0.709 L28.475,1.517 L39.571,9.259 L-0.004,9.259 L-0.004,10.249 L39.697,10.249 L28.455,18.951 L29.075,19.729 L41.988,9.733 L29.056,0.709 Z'/%3E%3C/svg%3E"); } .con-com-04 .ls-list-box-02 .ls-list p { font-size: 1em; padding-top: 0.8em} .con-com-04 .ls-list-box-03 { flex-wrap: wrap; display:flex; justify-content: space-between; margin-right:-1.2em} .con-com-04 .ls-list-box-03 .ls-list{letter-spacing: -0.05em; position: relative; width: calc(25% - 1.2em); margin-right:1.2em;} .con-com-04 .ls-list-box-03 h5 { font-size: 1em; font-weight: 500; position: absolute;left:7%; top:7%;} .con-com-04 .ls-list-box-03 .ls-img-02 {position: relative;} .con-com-04 .ls-list-box-03 .ls-img-02 img { max-width:100%;} .con-com-04 .vod-in { max-width: 1270px; margin:0 auto;} .con-com-04 .vod-box {position:relative; height: 0; padding-bottom:56.25%;} .con-com-04 .vod-box iframe, .con-com-04 .vod-box div, .con-com-04 .vod-box embed, .con-com-04 .vod-box object, .con-com-04 .vod-box video {z-index: 2; position: absolute; width: 100%; height: 100%; left: 0; top: 0; } .con-com-04 .con-box-03 { padding-top: 7em;} .con-com-04 .con-box-04 { padding-top: 7em;} .con-com-04 .ls-list-box-04 {padding-top:2em; flex-wrap: wrap; display:flex; justify-content: start; } .con-com-04 .ls-list-box-04 .ls-list{ text-align: center; position: relative; width: 30%; margin-right: 0.5em; } .con-com-04 .ls-list-box-04 .ls-num { margin:0 auto; position: relative; font-size: 1.25em; font-weight: 600; line-height: 3.8em; height: 3.8em; width: 3.8em; text-align: center; background:#8edf02; border-radius: 5em; } .con-com-04 .ls-list-box-04 .ls-num span { font-size:0.5em; line-height:0; position:relative; margin-top:-30px; } .con-com-04 .ls-list-box-04 span { font-size: 0.95em; padding-top:0.5em; display:block;} .con-com-04 .ls-list-box-05 { text-align: right; margin-left:auto; padding-top:1em; flex-wrap: wrap; display:flex; justify-content: start; } .con-com-04 .ls-list-box-05 .ls-list{ display:table; text-align: center; position: relative; width: 23%; margin-right: 0.5em; background:#8edf02; border-radius: 5em; line-height:7em; height:7em; width: 7em; text-align: center;} .con-com-04 .ls-list-box-05 span { display:table-cell; vertical-align: middle; line-height: 1.3em; height:100%; font-size:0.8em; } /* 미어킵 */ .con-com-05 { overflow: hidden; margin:0 auto; padding: 3em 0px 0 0px; position: relative;} .con-com-05 .con-head { text-align: left; max-width: 1600px; margin:0 auto;} .con-com-05 .com-box-01 { width: 100%; max-width: 1640px; margin:0 auto; padding: 5em 20px; } .con-com-05 .com-box-02 { color:#fff; text-align: center; vertical-align: middle; width:100%; padding: 4em 0; background-position: center center; background-size: cover;} .con-com-05 .com-box-03 { width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-05 .con-box-01 { padding-top:1em; display:flex; align-items: start;} .con-com-05 .con-box-02 {width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-05 .con-box-05 { padding: 7em 0 10em 0;} .con-com-05 .head-txt { padding-bottom: 1.5em; font-size: 2.3em; text-align: left;} .con-com-05 .com-box-02 .con-head { text-align: center; } .con-com-05 .ls-txt-01 { max-width: 1100px; padding-right:5%; z-index:1; position: relative; text-align: left;} .con-com-05 .ls-txt-01 strong { font-weight:400; font-size: 2.6em; line-height: 1.35em; letter-spacing: -0.02em; } .con-com-05 .ls-txt-01 p { padding-top: 2em; line-height: 1.5em; opacity: 0.8; font-size: 0.95em; } .con-com-05 .ls-img-01 { width: 40%; max-width: 430px; margin-left:auto; padding: 3em 2em; border:1px solid #cacaca;} .con-com-05 .ls-img-01 img { max-width:100%;} .con-com-05 .ls-img-03 { padding:2.5em 2em 3em 2em; background:#f0f0f0; width: 100%; } .con-com-05 .ls-img-03 img { max-width:100%;} .con-com-05 .vod-in { max-width: 1270px; margin:0 auto;} .con-com-05 .vod-box {position:relative; height: 0; padding-bottom:56.25%;} .con-com-05 .vod-box iframe, .con-com-05 .vod-box div, .con-com-05 .vod-box embed, .con-com-05 .vod-box object, .con-com-05 .vod-box video {z-index: 2; position: absolute; width: 100%; height: 100%; left: 0; top: 0; } .con-com-05 .con-box-03 { padding-top: 7em;} .con-com-05 .con-box-04 { padding-top: 7em;} .con-com-05 .con-box-02 .ls-list { color:#fff; text-align: center; padding: 2em 0em; width: 25%; position: relative; } .con-com-05 .ls-list-box { width:100%; display:flex; justify-content: space-between; align-items: stretch;} .con-com-05 .ls-list-box .ls-icon { width:100%; height: 9.41em; padding-left: 10%; padding-right:10%;} .con-com-05 .ls-list-box .ls-icon img { max-width:100%; height:100%;} .con-com-05 .ls-list-box .ls-list p { padding-top: 0em; line-height: 1.6em; font-size: 1.1em; font-weight:600} .con-com-05 .ls-list-box .ls-list:after { content:''; height:55%; width:1px; background:rgba(255,255,255,0.5); position: absolute; right:0; top:55%; transform: translateY(-50%);} .con-com-05 .ls-list-box .ls-list:last-of-type:after { display:none;} .con-com-05 .ls-list-box .ls-list span { font-size: 0.95em; opacity: 0.5; padding-top:0.5em; display:block} .con-com-05 .ls-list-box-02 { padding-top:4em; flex-wrap: wrap; display:flex; justify-content: space-between;} .con-com-05 .ls-list-box-02 .ls-num {display:inline-block; width: 2.1em; height: 2.1em; line-height: 1em; font-size: 1.2em; border-radius: 1.2em; padding: 0.5em; ;} .con-com-05 .ls-list-box-02 .ls-list {padding: 7% 0; position: relative;width: 24%} .con-com-05 .ls-list-box-02 .ls-list:before { z-index:-1; content:''; width: 100%; height:100%; left:50%; top:50%; transform: translate(-50%, -50%); position: absolute; background-repeat: no-repeat; background-position: center center; background-size: contain; } .con-com-05 .ls-list-box-02 .ls-list:nth-child(1):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(255, 255, 255)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-05 .ls-list-box-02 .ls-list:nth-child(2):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(243, 243, 243)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-05 .ls-list-box-02 .ls-list:nth-child(3):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(191, 191, 191)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(225, 225, 225)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-05 .ls-list-box-02 .ls-list:nth-child(4):before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='372.5px' height='372.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(149, 149, 149)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='rgb(0, 92, 207)' d='M185.801,0.499 C288.140,0.499 371.102,83.551 371.102,186.000 C371.102,288.448 288.140,371.499 185.801,371.499 C83.462,371.499 0.500,288.448 0.500,186.000 C0.500,83.551 83.462,0.499 185.801,0.499 Z'/%3E%3C/svg%3E"); } .con-com-05 .ls-list-box-02 .ls-list:nth-child(1) .ls-num { background:rgba(0,0,0,0.1)} .con-com-05 .ls-list-box-02 .ls-list:nth-child(2) .ls-num { background:rgba(0,0,0,0.1)} .con-com-05 .ls-list-box-02 .ls-list:nth-child(3) .ls-num { background:rgba(0,0,0,0.1)} .con-com-05 .ls-list-box-02 .ls-list:nth-child(4) .ls-num { color:#8edf02; background:rgba(255,255,255,1)} .con-com-05 .ls-list-box-02 .ls-list:nth-child(4) { color:#fff;} .con-com-05 .ls-list-box-02 .ls-list:nth-child(4):after { display:none;} .con-com-05 .ls-list-box-02 .ls-list:after {z-index:-2; content:''; width: 3em; height:1em; right:-1.5em; top:50%; transform: translateY(-50%); position: absolute; background-repeat: no-repeat; background-position: center center; background-size: contain;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='42px' height='20px'%3E%3Cpath fill-rule='evenodd' fill='rgb(191, 191, 191)' d='M29.056,0.709 L28.475,1.517 L39.571,9.259 L-0.004,9.259 L-0.004,10.249 L39.697,10.249 L28.455,18.951 L29.075,19.729 L41.988,9.733 L29.056,0.709 Z'/%3E%3C/svg%3E"); } .con-com-05 .ls-list-box-02 .ls-list p { font-size: 1.1em; padding-top: 0.8em} .con-com-05 .ls-list-box-03 { flex-wrap: wrap; display:flex;margin-right:-2em; justify-content: start; align-items: stretch;} .con-com-05 .ls-list-box-03 .ls-list{ display:flex; flex-direction: column; letter-spacing: -0.05em; text-align: left; padding:2% 2% 3% 2%; background:#f0f0f0; position: relative; width: calc(33.333% - 2em); margin-right:2em;} .con-com-05 .ls-list-box-03 h5 { font-size: 1.35em; font-weight: 500;} .con-com-05 .ls-list-box-03 p { padding-bottom:1em; padding-top:1em; max-width: 19em; font-size: 0.9em; opacity: 0.5;} .con-com-05 .ls-list-box-03 .ls-img-02 { padding-left: 2em; padding-right:2em; margin-top: auto; text-align: center; position: relative;} .con-com-05 .ls-list-box-03 .ls-img-02 img { max-width:100%; } /* 스마트안심 */ .con-com-06 { overflow: hidden; margin:0 auto; padding: 3em 0px 0 0px; position: relative;} .con-com-06 .con-head { text-align: left; max-width: 1600px; margin:0 auto;} .con-com-06 .com-box-01 { width: 100%; max-width: 1640px; margin:0 auto; padding: 5em 20px; } .con-com-06 .com-box-02 { color:#fff; text-align: center; vertical-align: middle; width:100%; padding: 4em 0; background-position: center center; background-size: cover;} .con-com-06 .com-box-03 { width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-06 .con-box-01 { padding-top:1em; display:flex; align-items: start;} .con-com-06 .con-box-02 {width: 100%; max-width: 1640px; margin:0 auto; padding: 0em 20px; } .con-com-06 .con-box-04 { padding: 7em 0 10em 0;} .con-com-06 .head-txt { padding-bottom: 1.5em; font-size: 2.3em; text-align: left;} .con-com-06 .com-box-02 .con-head { text-align: center; } .con-com-06 .ls-txt-01 { max-width: 1100px; padding-right:5%; z-index:1; position: relative; text-align: left;} .con-com-06 .ls-txt-01 strong { font-weight:400; font-size: 2.6em; line-height: 1.35em; letter-spacing: -0.02em; } .con-com-06 .ls-txt-01 p { padding-top: 2em; line-height: 1.5em; opacity: 0.8; font-size: 0.95em; } .con-com-06 .ls-img-01 { width: 40%; max-width: 430px; margin-left:auto; padding: 3em 2em; border:1px solid #cacaca;} .con-com-06 .ls-img-01 img { max-width:100%;} .con-com-06 .ls-img-03 { padding:2.5em 2em 3em 2em; background:#f0f0f0; width: 100%; } .con-com-06 .ls-img-03 img { max-width:100%;} .con-com-06 .vod-in { max-width: 1270px; margin:0 auto;} .con-com-06 .vod-box {position:relative; height: 0; padding-bottom:56.25%;} .con-com-06 .vod-box iframe, .con-com-06 .vod-box div, .con-com-06 .vod-box embed, .con-com-06 .vod-box object, .con-com-06 .vod-box video {z-index: 2; position: absolute; width: 100%; height: 100%; left: 0; top: 0; } .con-com-06 .con-box-03 { padding-top: 7em;} .con-com-06 .con-box-04 { padding-top: 7em;} .con-com-06 .con-box-02 .ls-list { color:#fff; text-align: center; padding: 2em 0em; width: 25%; position: relative; } .con-com-06 .ls-list-box { width:100%; display:flex; justify-content: space-between; align-items: stretch;} .con-com-06 .ls-list-box .ls-icon { width:100%; height: 9.41em; padding-left: 10%; padding-right:10%;} .con-com-06 .ls-list-box .ls-icon img { max-width:100%; height:100%;} .con-com-06 .ls-list-box .ls-list p { padding-top: 0em; line-height: 1.6em; font-size: 1.1em; font-weight:600} .con-com-06 .ls-list-box .ls-list:after { content:''; height:55%; width:1px; background:rgba(255,255,255,0.5); position: absolute; right:0; top:55%; transform: translateY(-50%);} .con-com-06 .ls-list-box .ls-list:last-of-type:after { display:none;} .con-com-06 .ls-list-box .ls-list span { font-size: 0.95em; opacity: 0.5; padding-top:0.5em; display:block} .con-com-06 .ls-list-box-03 { flex-wrap: wrap; display:flex; justify-content: space-between; margin-right:-1.2em} .con-com-06 .ls-list-box-03 .ls-list{letter-spacing: -0.05em; position: relative; width: calc(25% - 1.2em); margin-right:1.2em;} .con-com-06 .ls-list-box-03 h5 { font-size: 1em; font-weight: 500; position: absolute;left:9%; top:7%; } .con-com-06 .ls-list-box-03 .ls-img-02 {position: relative;} .con-com-06 .ls-list-box-03 .ls-img-02 img { max-width:100%;} .con-com-06 .ls-list-box-02 { text-align: right; margin-left:auto; padding-top:1em; flex-wrap: wrap; display:flex; justify-content: start; } .con-com-06 .ls-list-box-02 .ls-list{ color:#fff; font-size: 1.1em; display:table; text-align: center; position: relative; width: 23%; margin-left: 1em; background:#8edf02; border-radius: 5em; line-height:9em; height:9em; width: 9em; text-align: center;} .con-com-06 .ls-list-box-02 span { display:table-cell; vertical-align: middle; line-height: 1.3em; height:100%;} /*1:1*/ .con-com-07 { overflow: hidden; margin:0 auto; padding: 3em 0px 3em 0px; position: relative;} .con-com-07 .con-head { text-align: left; max-width: 1600px; margin:0 auto;} .con-com-07 .com-box-01 { width: 100%; max-width: 1640px; margin:0 auto; padding: 5em 20px; } .con-com-07 .head-txt { padding-bottom: 1em; font-size: 2em; text-align: left; border-bottom:1px solid #000;} .con-com-07 .ls-txt-01 { max-width: 740px; padding-right:5%; z-index:1; position: relative; text-align: left;} .con-com-07 .ls-txt-01 strong { font-weight:400; font-size: 2.6em; line-height: 1.35em; letter-spacing: -0.02em; } .con-com-07 .con-box-01 { padding-top:1em; } .con-com-07 .con-box-02 { padding: 3em 0px 30px 0px; text-align: left; } .con-com-07 .con-box-02 .ls-info, .con-com-07 .con-box-02 ::placeholder { position: relative; top:-2px; opacity: 0.6; line-height: 1; letter-spacing: -0.5px; color:#838383;} .con-com-07 .con-box-02 .ls-info { padding-bottom:15px;} .con-com-07 .con-box-02 .dl-box-01 { padding-top: 1.5em;flex-wrap: wrap; display:flex; justify-content: center; align-items: center;} .con-com-07 .con-box-02 dl { font-size:1.15em; width: 100%; line-height: 1.2em;display:flex; flex-wrap: wrap; position: relative; padding: 1em 5px; } .con-com-07 .con-box-02 dt {letter-spacing: -1px; color:#1b1b1b; font-weight: 600; display: block; width: 19%; padding-left: 20px; max-width: 200px; flex:1; } .con-com-07 .con-box-02 dd {text-align:left; display: block; width: 81%;flex:1;} .con-com-07 .con-box-02 dt>span { top:4px; display:inline-block; position: relative; width: 10px;} .con-com-07 .con-box-02 input[type=text], .con-com-07 textarea { border: 1px solid #bbbbbb; width:100%; padding: 0.8em 1.2em; } .con-com-07 .con-box-02 input.wd40p { width: 60%;} .con-com-07 textarea { height: 10em;} .con-com-07 .con-box-02 .dl-p { padding-top: 10px; padding-bottom:10px;} .con-com-07 .con-box-02 dt label { padding: 15px 0px 10px 0; display: inline-block; text-align: left;} .con-com-07 .ls-warning { text-align: right;} .con-com-07 .filebox { position:relative; display:flex; } .con-com-07 .filebox .upload-name { display: inline-block; border: 1px solid #bbbbbb; padding: 0.8em 1.2em; background:#e8e8e8; vertical-align: middle; width: 78%; flex:1; } .con-com-07 .filebox label { text-align: center; padding: 0.8em 0; color: #fff; background-color: #000; width: 22%; max-width: 200px; cursor: pointer; margin-left: 1em; flex:1;} .con-com-07 .con-box-03 { padding-top: 4em;} .con-com-07 .con-box-03 label { display: flex; padding-top: 1em; justify-content: start; align-items: center; cursor: pointer;} .con-com-07 .ls-txt-a { padding-top: 3em;} .con-com-07 .ls-txt-a textarea { height: 13em;} .con-com-07 .con-box-03 input[type=checkbox] { display: inline-block; min-width: 18px; width: 1.5em; height: 1.5em; border-radius: 0;} .con-com-07 .con-box-03 label>span { line-height:1; font-size: 1.1em; position: relative; padding-left: 10px; vertical-align: middle;} .con-com-07 .con-box-03 label>span span { font-size: 0.8em; color: #646464; vertical-align: middle;} .con-com-07 .con-box-04 { padding-top: 4em;} .con-com-07 .ls-btn { vertical-align: middle; width:100%} .con-com-07 .ls-btn a { z-index:2; letter-spacing: -0.3px; border-radius: 100px; font-weight:600; font-size: 0.85em; line-height:1; display:inline-block; position: relative; padding:1.2em 2em; color:#8edf02;} .con-com-07 .ls-btn a span { position: relative;} .con-com-07 .ls-btn a:before { border:2px solid #8edf02; content:''; left:-0.5%; top:50%; transform: translateY(-50%); position: absolute; z-index:-1; width: 100%; height:3.1em; background:#fff; border-radius: 2em; line-height:1;} .con-com-07 .ls-btn a:after { position: relative; content:''; height:0.8em; width: 2.2em; background-position: right center; background-repeat: no-repeat; background-size: contain; display:inline-block; } .con-com-07 .ls-btn a span, .con-com-07 .ls-btn a:hover { color:#fff;} .con-com-07 .ls-btn a:hover:before { background:#8edf02} .con-com-07 .ls-btn a:hover:after { filter: brightness(0) grayscale(1) invert(1);} /*게시판 : 인증현황 */ #news_list { width:100%; margin-left:10px; } #news_list .gl_list { display:inline-block; width:24%; } .bo_list1 { width:100%; display:flex; justify-content: center; align-items: flex-start;} .bo_list1 li {width:100%; max-width:280px; height:290px; overflow:hidden; padding:10px; } .bo_list1 .bo_image1 { width:100%; overflow:hidden; height:180px; border:1px solid #eee; } .bo_list1 .bo_image1 img {object-fit: cover; height: 180px; width: 100%; padding:10px; } .bo_list1 .bo_title1 {margin-top:20px; height:80px; text-align:center; } .bo_list1 .bo_title1 .tt { font-size:1.05em; font-weight:700; max-height:100px; overflow:hidden; word-break: keep-all;} .bo_list1 .bo_title1 .st { margin-top:10px; color:#767676; font-size:0.9em; } .bo_list1 .bo_title1 .dt { margin-top:10px; font-size:0.8em; color:#767676; } .vo_title1 { border-top:2px solid #000; border-bottom:1px solid #ccc; padding:50px 20px 40px 20px; text-align:center; margin-bottom:50px; margin-top:150px; } .vo_title1 .tt { font-size:1.7em; font-weight:600; margin-bottom:20px; } .vo_title1 .st { font-size:0.9em; color:#888; font-weight:400; } .vo_list_btn1 { text-align:center; margin:80px 0; } .vo_list_btn1 a { border:1px solid #eee; background:#8edf02; color:#fff; padding:15px 70px; font-weight:500; } .vo_list_btn1 a:hover { background:#ccc; color:#000; } /*게시판 : 일반 */ .bo_list2 { width:100%; } .bo_list2 table {width:100%; border-collapse:collapse;} .bo_list2 table thead th { border-top:2px solid #000; border-bottom:1px solid #000; padding:20px 7px; text-align:center; } .bo_list2 table tbody td { border-bottom:1px solid #e5e5e5; padding:20px 7px; } .bo_list2 table tbody td.text-center {text-align:center;} .bo_list2 a:hover { color:#8edf02; } #fboardlist {padding:0 10px;} #bo_list2_search { margin:0 auto; text-align:center; margin-bottom:150px; padding:20px 0; } #bo_list2_search select { width:120px; height:40px; border:1px solid #cfcfcf; } #bo_list2_search input[type=text] { width:300px; height:40px; border:1px solid #cfcfcf; padding:0 10px; } #bo_list2_search input[type=submit] { width:90px; height:40px; border:1px solid #8edf02; color:#8edf02; background:#fff; } #bo_list2_search input[type=submit]:hover { color:#fff; background:#8edf02; } /* 사내소식 */ #news_list3 { width:100%; margin-left:10px; } #news_list3 .gl_list { display:inline-block; width:24%; } .bo_list3 { width:100%; display:flex; justify-content: center; align-items: flex-start;} .bo_list3 li {width:100%; max-width:400px; height:380px; overflow:hidden; padding:10px; } .bo_list3 .bo_image1 { width:100%; overflow:hidden; height:210px; border:1px solid #eee; } .bo_list3 .bo_image1 img {object-fit: cover; height: 210px; width: 100%; padding:0px; } .bo_list3 .bo_title1 {margin-top:20px; height:80px; text-align:left; } .bo_list3 .bo_title1 .tt { font-size:1.35em; font-weight:700; max-height:100px; overflow:hidden; word-break: keep-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .bo_list3 .bo_title1 .st { margin-top:10px; color:#767676; font-size:0.9em; word-break: break-all; } .bo_list3 .bo_title1 .dt { margin-top:10px; font-size:0.8em; color:#767676; } #bo_v_atc * { word-break: break-all; } /* PC 사이즈 */ @media all and (max-width : 1680px) { .scroll-box-1 .scroll-box-btn { right: 20px;} } @media all and (max-width : 1440px) { .scroll-page-top { right: 20px;} .con-com-02 .ls-list-box dl { padding: 11% 10.5%;} .con-com-02 .ls-list-box dd { text-align: left;} .con-com-04 .ls-list-box-02 .ls-list:after { width: 2.5em; right: -1em;} .con-com-05 .ls-list-box-02 .ls-list:after { width: 2.5em; right: -1em;} } @media all and (max-width : 1280px) { .con-head p { font-size: 2em;} .scroll-box-2 .ls-img-01 { width: 60%;} .scroll-box-2 dl { width: 38%;} .scroll-box-2 .slide-in .list { padding-left: 4em;} .scroll-box-2 .slide-left { left: 0.7rem;} .scroll-box-2 .slide-right { right: 0.7rem;} .scroll-box-4 .inner-box { width:100%; padding-left:50px; padding-right:50px; } .scroll-box-4 .ls-list img { max-height: 200px; } .container { font-size: 1.1rem;} .con-com-01 .ls-txt-01 strong { font-size: 2.2em;} .con-com-02 .ls-txt-01 { font-size: 2.2em;} .con-com-02 .ls-list-box dt { font-size: 0.9em;} .con-com-02 .ls-list-box dt strong { font-size: 1.5em;} .con-com-02 .ls-list-box dd { text-align: left; font-size: 0.75em} .con-com-03 .ls-list-box-02 .ls-list { padding: 5% 0;} .con-com-04 .ls-txt-01 strong { font-size: 2.2em;} .con-com-04 .ls-txt-01 { max-width: 50%;} .con-com-04 .ls-list-box-05 .ls-list { width: 6em; height: 6em; line-height: 6em;} .con-com-04 .ls-list-box-02 .ls-list { padding: 5% 0; width: 23.5%;} .con-com-04 .head-txt { font-size: 2em} .con-com-05 .ls-txt-01 strong { font-size: 2.2em;} .con-com-05 .ls-txt-01 { max-width: 50%;} .con-com-05 .ls-list-box-02 .ls-list { padding: 6% 0; width: 23.5%;} .con-com-05 .head-txt { font-size: 2em} .con-com-06 .ls-txt-01 strong { font-size: 2.2em;} .con-com-06 .ls-list-box-02 .ls-list { font-size: 1em} .con-com-06 .head-txt { font-size: 2em} .con-com-07 .ls-txt-01 strong { font-size: 2.2em;} .con-com-07 .head-txt { font-size: 1.6em;} } /* 패드류 기본 */ @media all and (min-width : 769px) and (max-width : 1024px) { } @media all and (max-width : 1024px){ .scroll-box-1, .scroll-box-1 .ls-slide-backgrounds, .scroll-box-1 .ls-slide-backgrounds img { min-height:768px; height:768px;} .scroll-box-2, .scroll-box-2 .ls-slide-backgrounds, .scroll-box-2 .ls-slide-backgrounds img { min-height:500px; height:500px; } .scroll-box-3, .scroll-box-3 .ls-slide-backgrounds, .scroll-box-3 .ls-slide-backgrounds img { min-height:550px; height:550px; } .scroll-box-4, .scroll-box-4 .ls-slide-backgrounds, .scroll-box-4 .ls-slide-backgrounds img { min-height:550px; height:550px; } .scroll-box-2 .slide-in .list {height:500px;} .scroll-box-3 .inner-box { padding-top:10%; } .scroll-box-4 .inner-box { padding-top:10%; } header .d-md-none { display:none;} header .d-lg-none { display: block;} header { height: 60px;} header:after { top: 60px;} header .box_inner { padding-top:0; padding-left: 20px; padding-right:20px; } header:after { display:none;} header h1 img { height: 18px; } header.menu-scroll { /*background-color:transparent;*/} .menu-scroll .nav_wrap { display:none;} header .nav_head {min-width:auto; position: absolute; right: 70px; font-size: 0.8em;} .nav-head-box { padding-top: 0.14em;border-color:rgba(255,255,255,0.5)} .nav-head-box .nav-lang { font-weight:400;} .snb-bg .ls-slide-texts { top:50%; transform: translate( -50%, -50%); } .container { font-size: 0.95em;} footer .foo-menu>ul {flex-direction: column; padding-left:0; width:100%; } footer .foo-menu>ul>li>a { font-size: 1.15em; padding-bottom: 0.3em;} footer .foo-menu ul ul { display:none;} footer .foo-menu li { width:100%;} footer .col-box .copy { text-align: left; padding-top: 2em;} footer { font-size: 0.9em; } footer .footer {flex-wrap: wrap; padding-top:0.5em; padding-bottom:1em;} footer .foo-head-box { padding-bottom: 2em;} footer .col-box { padding-top: 2em; font-size: 1.1em; flex-direction: column; max-width:100%; width:100%; padding-left:0;} footer .col-box p { line-height: 1.8em;} footer .col-box b { font-weight: 600;} footer h1 img { height:20px;} .page-top { width: 40px; height: 40px; } .scroll-page-top { width: 40px;} .scroll-box-2 button { width: 3rem; height: 3rem;} .con-com-04 .ls-list-box-02 .ls-list:after { width: 2em; } .con-com-05 .ls-list-box-02 .ls-list:after { width: 2em; } .con-com-06 .ls-list-box-02 .ls-list {height: 8em; width: 8em; line-height: 8em;} } @media all and (max-width : 1023px){ .container { font-size: 0.85em;} .scroll-box-1 .scroll-box-btn { display:none;} .con-com-01 .ls-img-01 { height: 430px } } @media all and (max-width : 820px){ .scroll-box-1, .scroll-box-1 .ls-slide-backgrounds, .scroll-box-1 .ls-slide-backgrounds img { min-height:768px; height:768px;} .scroll-box-2, .scroll-box-2 .ls-slide-backgrounds, .scroll-box-2 .ls-slide-backgrounds img { min-height:700px; height:700px; } .scroll-box-3, .scroll-box-3 .ls-slide-backgrounds, .scroll-box-3 .ls-slide-backgrounds img { min-height:700px; height:700px; } .scroll-box-4, .scroll-box-4 .ls-slide-backgrounds, .scroll-box-4 .ls-slide-backgrounds img { min-height:650px; height:650px; } .scroll-box-2 .slide-in .list { height:768px; padding-top:0;} .scroll-box-3 .inner-box { padding-top:20%; } .scroll-box-4 .inner-box { padding-top:15%; } .scroll-box-4 .ls-list { margin-right:0px; } .snb li a>span span { width:100%;} .snb li a>span { flex-direction: column;} .con-com-04 .ls-list-box-03 h5 { font-size: 1.2em;} .con-com-06 .ls-list-box-03 h5 { font-size: 1.2em;} .con-com-07 .con-box-02 dt { max-width: 150px;} .con-com-07 .filebox label { max-width: 150px;} } @media all and (max-width : 768px){ .container { font-size: 0.8em;} .con-head { font-size: 1em; font-size: 0.8em;} .con-head p { font-size: 2.1em } .head-line .text { padding-bottom: 100px;} .head-line .text:after { top:90px } .footer { font-size: 0.85em;} .d-md-none { display: none!important;} /* pc 용 감추기 */ .d-lg-none { display:block;} /* mobile 용 보여주기 */ .snb-bg .ls-slide-backgrounds img {object-position: 40% center ; } .snb-bg .ls-slide-texts .ls-head { font-size: 1em;} .snb-bg .ls-slide-texts .ls-info { font-size: 2.1em; line-height: 1.25em;} .snb li a:hover span:after, .snb li a.active span:after { bottom: -0.8em} /* .snb-title { padding-top: 70px; padding-bottom: 20px;} .snb-bg { height: 280px;} .snb-bg .ls-slide-backgrounds {height: 320px;} .snb-bg .ls-slide-backgrounds img {height: 320px; object-position: 75% center ;} .snb-bg .ls-slide-texts .ls-head { font-size: 2.3em; letter-spacing: -0.1px; padding-bottom: 5px;} */ .scroll-box-1 .ls-head { font-size: 2.15em; } .scroll-box-1 .ls-info1 { font-size: 1em;} .scroll-box-1 .ls-info2 { line-height: 1.5em;} .scroll-box-2 .ls-img-01 { width:100%; height: 55%;} .scroll-box-2 dl { width:100%; height: 45%;max-width:100%; display:flex; padding-bottom: 3em; flex-direction: column; justify-content: end; padding-left:20px; padding-right:20px; margin-top: auto; margin-left: 0;} .scroll-box-2 .slide-in .list { padding-left:0; flex-direction: column;} .scroll-box-2 button { top:auto; bottom:calc(55% + 2.5rem);width: 2rem; height:2rem;} .scroll-box-2 .slide-left {left: auto; right: calc(3.5rem + 20px);} .scroll-box-2 .slide-right {right:20px; } .scroll-box-2 .slide-right:after { filter:none} .scroll-box-2 dt h3 { font-size: 2.5em} .scroll-box-2 dt p { font-size: 1.2em;} .scroll-box-2 dd p {padding: 1.5em 0;} .scroll-box-3 .m-head p { font-size: 1.75em; line-height:1.3em;} .scroll-box-3 .ls-list .ls-icon img { width:100%; height:auto; max-width: 5.3rem; } .scroll-box-3 .ls-list .ls-icon { text-align: left; width: 7.4em} .scroll-box-3 .box-inner .ls-list { padding:1.5em 0.5em 1.5em 0.5em; width:100%; border-right:0; border-bottom:1px solid #fff} .scroll-box-3 .box-inner .ls-list a { align-items: center; justify-content: start; display:flex; } .scroll-box-3 .ls-info { margin-top:auto; padding-top:0; align-items: start; text-align: left; width:74%; } .scroll-box-3 .box-inner { max-width: 475px; margin:0 auto; flex-wrap: wrap; padding-top: 2em;} .scroll-box-3 .ls-info p { font-size: 0.85em; line-height: 1.5em;} .scroll-box-3 .ls-info h3 { font-size: 1.05em; padding-bottom: 0.4em;} .scroll-box-4 .m-head p { font-size: 1.75em; font-weight:300;} .scroll-box-4 .ls-btn { position: relative; padding: 2em 0;} .scroll-box-4 .ls-list { width: 22em; margin-right: 0em;} .scroll-box-4 .ls-list img { max-height: 180px; } .con-com-01 { padding-top: 1em;} .con-com-01 .ls-txt-01 strong { font-size: 1.95em;} .con-com-01 .ls-box-in { flex-wrap: wrap;} .con-com-01 .ls-txt-01 { width:100%; max-width:100%; margin-left:0; padding-right:20px;} .con-com-01 .ls-img-02 { padding-top: 3em} .con-com-01 .ls-img-02 img { width:100%;} .con-com-01 .ls-txt-01 p { padding-top:2em;} .con-com-01 .ls-list-box { flex-wrap: wrap; max-width: 500px; margin:0 auto;} .con-com-01 .ls-list-box .ls-list { width: 50%; padding: 2em 0;} .con-com-01 .ls-list-box .ls-list p { margin:0 auto; max-width: 140px;} .con-com-01 .ls-list-box .ls-list p br { display:none;} .con-com-01 .ls-list-box .ls-list:after { height: 70%; background:#808080; } .con-com-01 .ls-list-box .ls-list:nth-child(even):after { display:none;} .con-com-01 .ls-list-box .ls-list:nth-child(1n+3):before { content:''; position: absolute; top:0; height:1px; width: 70%; left: 50%; transform: translateX(-50%); background:#808080 } .con-com-01 .ls-list-box .ls-icon { height: 5.3em;} .con-com-01 .ls-list-box h4 { font-size: 1em;} .con-com-01 .ls-list-box .ls-list p { font-size: 0.9em; padding-top: 1em; line-height: 1.4em;} .con-com-01 .ls-list-box .ls-list:nth-child(4) p { max-width: 150px;} .con-com-01 .com-box-03 { height: 380px;} .con-com-01 .ls-txt-02 { font-size: 1.55em;} .con-com-01 .ls-btn a { font-size: 0.75em;} .con-com-02 { padding-top: 1em;} .con-com-02 .com-box-01 { padding-bottom:0;} .con-com-02 .ls-txt-01 { font-size: 1.95em;} .con-com-02 .ls-list-box { flex-wrap: wrap;} .con-com-02 .ls-list-box .ls-list { margin-bottom: 2em; width:100%; max-height: 30em} .con-com-02 .ls-list-box dl { padding:2em 2em 3em 2em;} .con-com-02 .ls-list-box dd { min-height: auto;} .con-com-02 .ls-list-box dt strong { font-size: 1.7em; padding-top: 0.7em;} .con-com-02 .ls-list-box .ls-img-02 { height:100%;} .con-com-02 .ls-list-box .ls-img-02 img { object-fit: cover; width:100%; height:100%; object-position: center center; } .con-com-03 { padding-top: 1em;} .con-com-03 .ls-txt-01 { font-size: 1.95em;} .con-com-03 .ls-list-box-02 .ls-list { font-size: 0.8em; padding: 4.2% 0;} .con-com-03 .ls-list-box-03 .ls-list { width: calc(50% - 2em)} .con-com-03 .con-box-02 { padding-top:4em;} .con-com-03 .con-box-03 { padding-top:4em;} .con-com-03 .con-box-04 { padding-top:4em;} .con-com-03 .head-txt { font-size: 1.6em;} .con-com-03 .ls-list-type dl { padding-top:2.3em;} .con-com-03 .ls-list-box-03 dt { padding-bottom: 0.5em;} .con-com-03 .ls-list-type .ls-list { background-position: 96% 1.2em; background-size: 3.4em auto} .con-com-03 .ls-list-type .ls-list {padding:1.5em;} .con-com-03 .ls-list-box-01 dt { font-size: 1.15em;} .con-com-03 .ls-list-box-01 li { width:100%;} .con-com-03 .ls-list-box-02 dt { padding-bottom: 0.3em;} .con-com-03 .ls-txt-03 { font-size: 1.55em; width: 60%} .con-com-03 .ls-btn { text-align: right; width: 40%;} .con-com-03 .ls-btn a { font-size: 0.75em;} .con-com-04 { padding-top: 3em;} .con-com-04 .con-box-03 { padding-top: 3em;} .con-com-04 .con-box-04 { padding-top: 3em; } .con-com-04 .head-txt { font-size: 1.8em; } .con-com-04 .com-box-04 { padding-top:3em;} .con-com-04 .con-box-05 { padding: 3em 0 5em 0} .con-com-04 .com-box-06 { padding: 3em 20px 5em 20px} .con-com-04 .com-box-09 { padding: 3em 20px 5em 20px} .con-com-04 .con-box-06 { align-items: flex-end;} .con-com-04 .con-box-09 { flex-wrap: wrap;} .con-com-04 .con-box-01 { flex-wrap: wrap;} .con-com-04 .ls-txt-01 { width:100%; max-width:100%; padding-right:0;} .con-com-04 .ls-txt-01 strong { font-size: 1.95em;} .con-com-04 .ls-txt-01 p { font-size: 1em;} .con-com-04 .ls-img-01 { width:100%; margin-top:2em; max-width:100%; } .con-com-04 .ls-img-01 img { max-width:100%;} .con-com-04 .ls-img-02 { width:100%;} .con-com-04 .ls-list-box .ls-icon { padding-left:0; text-align: center; padding-right: 2em; width: 30%; height: 7em;} .con-com-04 .ls-list-box .ls-icon img {max-width:none; width: auto;} .con-com-04 .ls-list-box {flex-wrap: wrap; max-width: 360px; margin:0 auto; } .con-com-04 .ls-list-box .ls-list { width:100%; display: flex; padding:1em 20px; justify-content: center; align-items: center;} .con-com-04 .ls-list-box .ls-list p { width:70%; font-size: 0.9em;} .con-com-04 .ls-list-box .ls-list:after { bottom:0; top:auto; left:0; transform: none; width:100%; height:1px;} .con-com-04 .ls-list-box-02 .ls-list { font-size: 0.8em;} .con-com-04 .ls-list-box-02 .ls-list p { font-size: 1.1em;} .con-com-04 .ls-list-box-03 h5 { font-size: 1em;} .con-com-04 .ls-list-box-04 { margin-left: -2px; margin-right:-0.5em; max-width: 180px;} .con-com-04 .ls-list-box-04 .ls-list { margin-right: 0.3em;} .con-com-04 .ls-list-box-04 span {font-size: 0.9em;} .con-com-04 .ls-list-box-04 .ls-num { width: 3.6em; height: 3.6em; line-height: 3.6em; font-size: 0.95em;} .con-com-04 .ls-list-box-05 { width:100%;} .con-com-04 .con-box-10 .ls-list-box { flex-wrap: wrap; max-width: 500px; margin:0 auto;} .con-com-04 .con-box-10 .ls-list-box .ls-list { display:block; width: 50%; padding: 2em 0;} .con-com-04 .con-box-10 .ls-list-box .ls-list:after {left:auto; bottom:0; top:50%; transform: translateY(-50%); right:0; height: 70%; width:1px; background:#808080; } .con-com-04 .con-box-10 .ls-list-box .ls-list:nth-child(even):after { display:none;} .con-com-04 .con-box-10 .ls-list-box .ls-list:nth-child(1n+3):before { content:''; position: absolute; top:0; height:1px; width: 70%; left: 50%; transform: translateX(-50%); background:#808080 } .con-com-04 .con-box-10 .ls-list-box .ls-icon {padding-right:0; width:100%; } .con-com-04 .con-box-10 .ls-list-box .ls-list p { width:100%;} .con-com-04 .con-box-10 .ls-list-box .ls-list span { font-size: 0.8em; padding-top: 0.5em; line-height: 1.4em;} .con-com-04 .con-box-06 { position: relative;} .con-com-04 .ls-img-03 {max-width:150px; position: absolute; right:0; bottom:0;} .con-com-04 .ls-list-box-05 { padding-top: 2em;justify-content: center;} .con-com-04 .ls-list-box-05 span { font-size: 0.95em;} .con-com-05 { padding-top: 1em;} .con-com-05 .con-box-03 { padding-top: 3em;} .con-com-05 .con-box-04 { padding-top: 3em; } .con-com-05 .con-box-05 { padding: 3em 0 5em 0} .con-com-05 .head-txt { font-size: 1.8em; } .con-com-05 .con-box-01 { flex-wrap: wrap;} .con-com-05 .ls-txt-01 { width:100%; max-width:100%; padding-right:0;} .con-com-05 .ls-txt-01 strong { font-size: 1.95em;} .con-com-05 .ls-txt-01 p { font-size: 1em;} .con-com-05 .ls-img-01 { width:100%; margin-top:2em; max-width:100%; } .con-com-05 .ls-img-01 img { max-width:100%;} .con-com-05 .ls-list-box { flex-wrap: wrap; max-width: 500px; margin:0 auto;} .con-com-05 .ls-list-box .ls-list { display:block; width: 50%; padding: 2em 0;} .con-com-05 .ls-list-box .ls-list:after {left:auto; bottom:0; top:50%; transform: translateY(-50%); right:0; height: 70%; width:1px; background:#808080; } .con-com-05 .ls-list-box .ls-list:nth-child(even):after { display:none;} .con-com-05 .ls-list-box .ls-list:nth-child(1n+3):before { content:''; position: absolute; top:0; height:1px; width: 70%; left: 50%; transform: translateX(-50%); background:#808080 } .con-com-05 .ls-list-box .ls-icon { width:100%;height: 7em; } .con-com-05 .ls-list-box .ls-list p { width:100%;} .con-com-05 .ls-list-box .ls-list span { font-size: 0.8em; padding-top: 0.5em; line-height: 1.4em;} .con-com-05 .ls-list-box-02 .ls-list { font-size: 0.8em;} .con-com-05 .ls-list-box-02 .ls-list p { font-size: 1.1em;} .con-com-05 .ls-list-box-03 h5 { font-size: 1em;} .con-com-05 .ls-img-03 img { max-width: 400px; width:100%;} .con-com-06 { padding-top: 1em;} .con-com-06 .head-txt { font-size: 1.8em; } .con-com-06 .ls-txt-01 { width:100%; max-width:100%; padding-right:0;} .con-com-06 .ls-txt-01 strong { font-size: 1.95em;} .con-com-06 .ls-txt-01 p { font-size: 1em;} .con-com-06 .con-box-01 { flex-wrap: wrap;} .con-com-06 .con-box-03 { padding-top: 3em;} .con-com-06 .con-box-04 { padding: 3em 0 5em 0} .con-com-06 .ls-list-box-02 { width:100%; padding-top: 2em;justify-content: start;} .con-com-06 .ls-list-box-02 .ls-list {margin-left:0; margin-right:1em; } .con-com-06 .ls-list-box-02 span { font-size: 0.95em;} .con-com-06 .ls-list-box { flex-wrap: wrap; max-width: 500px; margin:0 auto;} .con-com-06 .ls-list-box .ls-list { display:block; width: 50%; padding: 2em 0;} .con-com-06 .ls-list-box .ls-list:after {left:auto; bottom:0; top:50%; transform: translateY(-50%); right:0; height: 70%; width:1px; background:#808080; } .con-com-06 .ls-list-box .ls-list:nth-child(even):after { display:none;} .con-com-06 .ls-list-box .ls-list:nth-child(1n+3):before { content:''; position: absolute; top:0; height:1px; width: 70%; left: 50%; transform: translateX(-50%); background:#808080 } .con-com-06 .ls-list-box .ls-icon { width:100%;height: 7em; } .con-com-06 .ls-list-box .ls-list p { width:100%;} .con-com-06 .ls-list-box .ls-list span { font-size: 0.8em; padding-top: 0.5em; line-height: 1.4em;} .con-com-06 .ls-list-box-03 h5 { font-size: 1em;} .con-com-07 { padding-top: 1em;} .con-com-07 .con-box-02 dl { font-size: 1em; padding-left:0; padding-right:0;} .con-com-07 .con-box-02 dt { padding-left:0; max-width: 65px;} .con-com-07 .filebox label { max-width: 70px; margin-left: 0.5em} .con-com-07 .con-box-03 { padding-top:3em;} .con-com-07 .ls-txt-01 { width:100%; max-width:100%; padding-right:0;} .con-com-07 .ls-txt-01 strong { font-size: 1.95em;} .con-com-07 .ls-txt-01 p { font-size: 1em;} .con-com-07 .con-box-02 input.wd40p { width:100%;} .con-com-07 .con-box-02 input[type=text], .con-com-07 textarea { padding-left: 0.8em; padding-right: 0.8em} .con-com-07 .con-box-02 dt label { padding-top: 10px;} .con-com-07 .filebox .upload-name { padding-left:0.8em; padding-right:0;} /*게시판 : 인증현황 */ #news_list { width:100%; margin-left:0px; } #news_list .gl_list { display:inline-block; width:48%; } .bo_list1 { width:100%; display:flex; justify-content: center; align-items: flex-start;} .bo_list1 li {width:100%; max-width:280px; height:250px; overflow:hidden; padding:10px; } .bo_list1 .bo_image1 { width:100%; overflow:hidden; height:190px; border:1px solid #eee; } .bo_list1 .bo_image1 img {object-fit: cover; height: 190px; width: 100%; padding:5px; } .bo_list1 .bo_title1 {margin-top:10px; height:50px; text-align:center; } .bo_list1 .bo_title1 .tt { font-size:0.9em; font-weight:600; max-height:100px; overflow:hidden; word-break: keep-all;} .bo_list1 .bo_title1 .st { margin-top:10px; color:#767676; font-size:0.9em; } .bo_list1 .bo_title1 .dt { margin-top:10px; font-size:0.8em; color:#767676; } .vo_title1 { border-top:2px solid #000; border-bottom:1px solid #ccc; padding:30px 10px 20px 10px; text-align:center; margin-bottom:50px; margin-top:0px; } .vo_title1 .tt { font-size:1.3em; font-weight:600; margin-bottom:10px; } .vo_title1 .st { font-size:0.9em; color:#888; font-weight:400; } .vo_list_btn1 { text-align:center; margin:80px 0; } .vo_list_btn1 a { border:1px solid #333; color:#333; padding:15px 70px; border-radius:30px; font-weight:600; } .vo_list_btn1 a:hover { background:#333; color:#fff; } /*게시판 : 일반 */ .bo_list2 { width:100%; } .bo_list2 table {width:100%; border-collapse:collapse;} .bo_list2 table thead th { border-top:2px solid #000; border-bottom:1px solid #000; padding:20px 7px; text-align:center; } .bo_list2 table tbody td { border-bottom:1px solid #e5e5e5; padding:20px 7px; } .bo_list2 table tbody td.text-center {text-align:center;} .bo_list2 a:hover { color:#51b431; } #bo_list2_search { margin:0 auto; text-align:center; margin-bottom:50px; } #bo_list2_search select { width:80px; height:40px; border:1px solid #cfcfcf; } #bo_list2_search input[type=text] { width:120px; height:40px; border:1px solid #cfcfcf; padding:0 10px; } #bo_list2_search input[type=submit] { width:50px; height:40px; border:1px solid #51b431; color:#51b431; background:#fff; } #bo_list2_search input[type=submit]:hover { color:#fff; background:#51b431; } #bo_list_admin th:nth-of-type(2) {display:none;} #bo_list th:nth-of-type(1) {display:none;} #bo_list_admin td:nth-of-type(2) {display:none;} #bo_list td:nth-of-type(1) {display:none;} /* 사내소식 */ #news_list3 { width:100%; margin-left:0px; } #news_list3 .gl_list { display:inline-block; width:100%; } .bo_list3 { width:100%; display:flex; justify-content: center; align-items: flex-start;} .bo_list3 li {width:100%; max-width:400px; height:400px; overflow:hidden; padding:10px; } .bo_list3 .bo_image1 { width:100%; overflow:hidden; height:210px; border:1px solid #eee; } .bo_list3 .bo_image1 img {object-fit: cover; height: 210px; width: 100%; padding:0px; } .bo_list3 .bo_title1 {margin-top:20px; height:80px; text-align:left; } .bo_list3 .bo_title1 .tt { font-size:1.35em; font-weight:700; max-height:100px; overflow:hidden; word-break: keep-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .bo_list3 .bo_title1 .st { margin-top:10px; color:#767676; font-size:0.9em; } .bo_list3 .bo_title1 .dt { margin-top:10px; font-size:0.8em; color:#767676; } } /* 모바일사이즈 기본 */ @media all and (max-width : 699px){ } @media all and (max-width : 640px){ .con-com-03 .ls-list-box-02 { max-width: 320px; margin:0 auto; align-items: center;} .con-com-03 .ls-list-box-02 .ls-list { height: 17em; padding: 4.5em 0; width: 48%;} .con-com-03 .ls-txt-03 { display:block; width:100%;} .con-com-03 .ls-btn { padding-top: 1.5em; display:block; width:100%; text-align: left;} .con-com-03 .con-box-05 { display:table-cell; } .con-com-03 .com-box-02 { height: 21em;} .con-com-04 .ls-list-box-03 .ls-list { width:calc(50% - 1.2em); margin-bottom:1.2em;} .con-com-04 .ls-list-box-02 { max-width: 320px; margin:0 auto; align-items: center;} .con-com-04 .ls-list-box-02 .ls-list { height: 17em; padding: 4.5em 0; width: 48%;} .con-com-04 .ls-list-box-05 .ls-list { width:5em; height:5em; line-height: 5em;} .con-com-04 .ls-img-01 img { max-width: 200px;} .con-com-04 .ls-img-01 { padding:2em;} .con-com-04 .ls-list-box-02 .ls-list:nth-child(2):after { left:50%; top:auto; bottom:0; transform: translate(-50%, 0) rotate(90deg);} .con-com-04 .ls-list-box-02 .ls-list:nth-child(3) { order:4} .con-com-04 .ls-list-box-02 .ls-list:nth-child(3):after { left:0; right:auto; transform: translate(-50%, 0) rotate(175deg);} .con-com-04 .ls-list-box-02 .ls-list:nth-child(4) { order:3} .con-com-05 .ls-img-01 img { max-width: 200px;} .con-com-05 .ls-img-01 { padding:2em;} .con-com-05 .ls-list-box-03 { margin-right:0;} .con-com-05 .ls-list-box-03 .ls-list { flex-direction: row; width:100%; margin-bottom:1.2em; padding: 1.5em; margin-right:0;} .con-com-05 .ls-list-box-03 .ls-img-02 { padding-right:0; margin-left: auto; max-width: 150px;} .con-com-05 .ls-list-box-02 { max-width: 320px; margin:0 auto; align-items: center;} .con-com-05 .ls-list-box-02 .ls-list { height: 17em; padding: 4.5em 0; width: 48%;} .con-com-05 .ls-list-box-02 .ls-list:nth-child(2):after { left:50%; top:auto; bottom:0; transform: translate(-50%, 0) rotate(90deg);} .con-com-05 .ls-list-box-02 .ls-list:nth-child(3) { order:4} .con-com-05 .ls-list-box-02 .ls-list:nth-child(3):after { left:0; right:auto; transform: translate(-50%, 0) rotate(175deg);} .con-com-05 .ls-list-box-02 .ls-list:nth-child(4) { order:3} .con-com-06 .ls-list-box-03 .ls-list { width:calc(50% - 1.2em); margin-bottom:1.2em;} } @media all and (max-width : 540px){ .d-sm-none { display:none;} .d-sm-view { display:block;} .con-com-03 .ls-list-type { margin-right:0;} .con-com-03 .ls-list-box-01 .ls-list { width:100%; margin-right:0; margin-bottom:2em;} .con-com-03 .ls-list-box-03 .ls-list { width:100%; margin-right:0; margin-bottom: 1.2em;} .con-com-03 .ls-list-type dd { font-size: 0.85em} .con-com-06 .ls-txt-01 p br { display:none;} } @media all and (max-width : 375px){ .scroll-box-4 .ls-tab-box ul { justify-content: start;} .snb li {min-width:auto; flex:1;} .con-com-04 .ls-tab-box li {min-width:auto; flex:1;} .con-com-04 .ls-txt-01 strong { word-break: normal; } } /* 스타일 작업 종료 */ /*******************************************************************************************************************/ /* 중간 레이아웃 */ /**********************************************************************************************************************/ /* 여기부터 반응형 메인 박스 스타일 적용 */ /**********************************************************************************************************************/ #wrapper {width:100%;} #wrapper:after {display:block;visibility:hidden;clear:both;content:""} #container {position:relative;max-width:1000px;margin:0px auto;z-index:1;padding:0px} #container:after {display:block;visibility:hidden;clear:both;content:""} #container_title {margin:0 0px 10px;font-size:1.2em;font-weight:bold;text-align:center;border-bottom:2px solid #ddd;padding-bottom:0px;} /*index*/ .latest{width:100%;float:left} #main_work ul:after {display:block;visibility:hidden;clear:both;content:""} #main_work ul li{background:#fff;letter-spacing:-0.01em} #main_work ul li.main_work_1{background:#f8f8f8;} #main_work .work_txt span{ display:block;padding:5px 0;color:#808080;line-height:1.5em} #lt_notice{clear:both} #lt_notice,#lt_board,#lt_board2,#lt_board3,#lt_board4,#lt_board5,#lt_board6,#lt_gall{margin-top:20px} /* PC 사이즈 1001px 픽셀사이즈까지 */ @media (min-width : 1361px) { #main_work .work_img{width:35%;height:122px;line-height:112px;display:block;float:left;} #main_work .work_txt{width:65%;height:122px;display:block;float:left;} #main_work .work_txt span.work_txt_tit{margin-top:20px ;font-weight:bold;font-size:1.25em;color:#111} .view_pc {display:block;} .view_tab {display:none;} .view_pctab {display:block;} .view_tabmobi {display:none;} .view_mobi {display:none;} .rbtn_icon {display:block;margin-top:25px;} .rbtn_icon .btn {margin-left:7px;} } /* 패드류 기본*/ @media all and (min-width : 601px) and (max-width : 1360px) { #main_work{margin-top:20px} #main_work ul li{float:left;width:33.3%;text-align:center;} #main_work .work_img{display:block;} #main_work .work_img img{max-width:100px;width:80%;height:auto} #main_work .work_txt span.work_txt_p{display:none;} #main_work .work_txt span.work_txt_tit{margin:0 0 15px;font-size:1.2em;color:#111;font-weight:bold} .view_pc {display:none;} .view_tab {display:block;} .view_pctab {display:block;} .view_tabmobi {display:block;} .view_mobi {display:none;} .rbtn_icon {display:none;margin-top:25px;} .rbtn_icon .btn {margin-left:7px;} } /* 모바일 기본*/ @media all and (max-width : 600px){ #main_work{margin-top:20px} #main_work ul li{float:left;width:33.3%;text-align:center;} #main_work .work_img{display:block;} #main_work .work_img img{max-width:100px;width:80%;height:auto} #main_work .work_txt span.work_txt_p{display:none;} #main_work .work_txt span.work_txt_tit{margin:0 0 15px;font-size:1.2em;color:#111;font-weight:bold} .view_pc {display:none;} .view_tab {display:none;} .view_pctab {display:none;} .view_tabmobi {display:block;} .view_mobi {display:block;} .rbtn_icon {display:none;} } /* 하단 레이아웃 */ #ft {border-top:1px solid #dde4e9;background:#fafafa;text-align:center} #ft h1 {width:0;height:0;font-size:0;line-height:0;overflow:hidden;} #ft_company{padding:20px 20px 10px} #ft_company a{font-weight:bold;display:inline-block;padding:0px 5px;font-size:1.12em;border-left:2px solid #eee} .bd_no{border:none !important} #ft_copy p{color:#000;padding-bottom:20px} #ft_copy .ft_sns{padding:15px 20px} #ft_copy .ft_sns a{padding:3px;} #top_btn{position:fixed;bottom:10px ;right:10px;border:none;z-index:99} /*group*/ #group .lt{margin-top:20px} #group .lt_date{position:absolute;top:0;right:0;color:#5d938b} @media all and (max-width : 375px) { #group .lt{margin-top:10px} } /* 게시물 선택복사 선택이동 */ #copymove {} .copymove_current {float:right;color:#ff3061} .copymove_currentbg {background:#f4f4f4} /* 화면낭독기 사용자용 */ #hd_login_msg {position:absolute;top:0;left:0;width:0;height:0;overflow:hidden} .msg_sound_only, .sound_only {display:inline-block;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;width:1px !important;height:1px !important;font-size:0 !important;line-height:0 !important;overflow:hidden} /* 본문 바로가기 */ .to_content a {z-index:100000;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0;overflow:hidden} /* 이미지 등비율 리사이징 */ .img_fix {width:100%;height:auto} /* 캡챠 자동등록(입력)방지 기본 */ #captcha {display:inline-block;position:relative} #captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden} #captcha audio {display:block;margin:0 0 5px;width:187px} #captcha #captcha_img {width:150px;height:60px;border:1px solid #e9e9e9;} #captcha #captcha_reload {margin:0;padding:0 5px;width:32px;height:32px;border:0;background:url(../img/captcha.png) no-repeat 0 -30px;overflow:hidden; vertical-align:middle;overflow:hidden;cursor:pointer;text-indent:-999px} #captcha #captcha_key {margin:0 0 0 4px;padding:0 5px;width:150px;height:60px;border:1px solid #b8c9c2;background:#f7f7f7;font-size:1.333em;font-weight:bold;text-align:center;line-height:2em} #captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em} #captcha #captcha_mp3{width:32px;height:32px;margin:0;padding:0 5px;height:32px;border:0;background:url(../img/captcha.png) no-repeat 0 0;vertical-align:middle;overflow:hidden;cursor:pointer;overflow:hidden;text-indent:-999px} /*단축키일람 */ .btn_cke_sc{background:#333;color:#fff;padding:5px;border:none;margin-bottom:5px} .cke_sc_def {margin:0 0 5px;padding:10px;border:1px solid #ccc;background:#f7f7f7;text-align:center} .cke_sc_def dl{margin:0 0 5px;text-align:left;zoom:1} .cke_sc_def dl:after {display:block;visibility:hidden;clear:both;content:""} .cke_sc_def dt, .cke_sc_def dd {float:left;margin:0;padding:5px 0;border-bottom:1px solid #e9e9e9} .cke_sc_def dt {width:50%;font-weight:bold} .cke_sc_def dd {width:50%} .btn_cke_sc_close{background:#333;padding:5px;border:none;color:#fff} /* 버튼 */ a.btn01 {display:inline-block;padding:8px 7px 7px;border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none;vertical-align:middle} a.btn01:focus, a.btn01:hover {text-decoration:none} button.btn01 {display:inline-block;margin:0;padding:7px;border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none} a.btn02 {display:inline-block;padding:8px 7px 7px;border:1px solid #3b3c3f;background:#4b545e;color:#fff;text-decoration:none;vertical-align:middle} a.btn02:focus, .btn02:hover {text-decoration:none} button.btn02 {display:inline-block;margin:0;padding:7px;border:1px solid #3b3c3f;background:#4b545e;color:#fff;text-decoration:none} .btn_confirm {text-align:center} /* 서식단계 진행 */ .btn_submit {padding:8px;border:0;background:#dfdfdf;color:#fff;letter-spacing:-0.1em;border-radius:0px} fieldset .btn_submit {padding:0 7px;height:24px;line-height:1em} a.btn_cancel {display:inline-block;padding:8px 7px 7px;border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none;vertical-align:middle;border-radius:0px} button.btn_cancel {display:inline-block;padding:7px;border:1px solid #ccc;background:#fafafa;color:#000;vertical-align:top;text-decoration:none;border-radius:0px} a.btn_frmline, button.btn_frmline {display:inline-block;padding:0 5px;height:1.9em;border:0;background:#333;color:#fff;letter-spacing:-0.1em;text-decoration:none;vertical-align:top;line-height:1.9em} /* 우편번호검색버튼 등 */ button.btn_frmline {font-size:1em} /* 게시판용 버튼 */ a.btn_b01 {display:inline-block;margin:0 0 3px;padding:8px 7px 7px;border:1px solid #d9ded9;background:#fff;color:#000;text-decoration:none;vertical-align:middle;border-radius:0px} a.btn_b01:focus, .btn_b01:hover {text-decoration:none;color:#00c6b2} a.btn_b02 {display:inline-block;margin:0 0 3px;padding:8px 7px 7px;border:1px solid #dfdfdf;background:#dfdfdf;color:#fff;text-decoration:none;vertical-align:middle;border-radius:0px} a.btn_b02:focus, .btn_b02:hover {background:#00c6b2;transition: 0.8s;-webkit-transition: 0.8s;-moz-transition: 0.8s;-ms-transition: 0.8s;-o-transition: 0.8s;} a.btn_admin {display:inline-block;margin:0 0 3px;padding:8px 7px 7px;border:1px solid #e8180c;background:#e8180c;color:#fff;text-decoration:none;vertical-align:middle;border-radius:0px} /* 관리자 전용 버튼 */ a.btn_admin:focus, a.btn_admin:hover {text-decoration:none} /* 댓글 스타일 */ .cnt_cmt {display:inline-block;margin:0 0 0 3px;font-weight:bold} /* 기본테이블 */ .tbl_wrap {margin:0 0 10px} .tbl_wrap table {width:100%;border-collapse:collapse;border-radius:0px 5px 0 0;} .tbl_wrap caption {padding:10px 0;color:#4b8b99;font-weight:bold;text-align:left} .tbl_head01 {} .tbl_head01 caption {padding:0 0 10px;color:#777;text-align:left} .tbl_head01 thead th {padding:12px 0;background:#dfdfdf;color:#fff;text-align:center;letter-spacing:-0.1em;} .tbl_head01 thead th:first-child{border-top-left-radius:0px;} .tbl_head01 thead th:last-child{border-top-right-radius:0px} .tbl_head01 thead a {color:#fff} .tbl_head01 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head01 tfoot th {border-top:1px solid #666;border-bottom:1px solid #666;background:#484848;color:#fff} .tbl_head01 tfoot td {border-color:#666;background:#484848;color:#fff;font-weight:bold;text-align:center} .tbl_head01 tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9} .tbl_head01 td {background:#fff;padding:10px;border-top:1px solid #eee;border-bottom:1px solid #e9e9e9;line-height:1.5em;word-break:break-all} .tbl_head01n {font-size:17px; font-weight:300px; } .tbl_head01n caption {padding:0 0 10px;color:#777;text-align:left} .tbl_head01n thead th {padding:15px 0;background:#fff;color:#000;text-align:center; border-top:1px solid #000; } .tbl_head01n thead th:first-child{border-top-left-radius:0px;} .tbl_head01n thead th:last-child{border-top-right-radius:0px} .tbl_head01n thead a {color:#000} .tbl_head01n thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head01n tfoot th {border-top:1px solid #666;border-bottom:1px solid #666;background:#fff;color:#000;} .tbl_head01n tfoot td {border-color:#666;background:#fff;color:#000;font-weight:bold;text-align:center} .tbl_head01n tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9} .tbl_head01n td {background:#fff;padding:10px;border-top:1px solid #eee;border-bottom:1px solid #e9e9e9;line-height:1.5em;word-break:break-all} .tbl_head02 {} .tbl_head02 caption {padding:0 0 10px;color:#777;text-align:left} .tbl_head02 thead th {padding:5px 0;border-top:1px solid #d1dee2;border-bottom:1px solid #d1dee2;background:#e5ecef;color:#383838;font-size:0.95em;text-align:center;letter-spacing:-0.1em} .tbl_head02 thead a {color:#383838} .tbl_head02 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head02 tfoot th {border-top:1px solid #666;border-bottom:1px solid #666;background:#484848;color:#fff} .tbl_head02 tfoot td {border-color:#666;background:#484848;color:#fff;font-weight:bold;text-align:center} .tbl_head02 tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9} .tbl_head02 td {padding:5px 3px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;line-height:1.4em;word-break:break-all} .tbl_head022 {} .tbl_head022 caption {padding:0 0 10px;color:#777;text-align:left} .tbl_head022 thead th {padding:5px 0;border-bottom:1px solid #d1dee2;border-right:1px solid #d1dee2;border-left:1px solid #d1dee2;border-top:1px solid #333;background:#e5ecef;color:#383838;font-size:0.95em;text-align:center;letter-spacing:-0.1em} .tbl_head022 thead a {color:#383838} .tbl_head022 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */ .tbl_head022 tfoot th {border-top:1px solid #666;border:1px solid #666;background:#484848;color:#fff} .tbl_head022 tfoot td {border-color:#666;background:#484848;color:#fff;font-weight:bold;text-align:center} .tbl_head022 tbody td {padding:5px 0;border:1px solid #e9e9e9;} .tbl_head022 tbody th {padding:5px 0;border:1px solid #e9e9e9;text-align:center;} .tbl_head022 td {padding:5px 3px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;line-height:1.4em;word-break:break-all} .tbl_head022 input[type=text] {border:1px solid #d1dee2; width:90%;height:20px;margin-left:5px;} .tbl_head022 input[type=file] {margin-left:5px;} .tbl_head022 textarea {border:1px solid #d1dee2; width:98%;height:120px;margin-left:5px;} .tbl_head022 span {color:red;} /* 폼 테이블 */ .tbl_frm01 {} .tbl_frm01 th {padding:10px 0;width:90px;border:1px solid #e9e9e9;border-left:0;text-align:left} .tbl_frm01 td {padding:10px 5px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:transparent} .tbl_frm01 textarea, .frm_input {border:1px solid #c2c2c2;background:#fff;vertical-align:middle;line-height:2.3em;height:2.3em;-webkit-appearance:none;border-radius:5px} .tbl_frm01 textarea {width:100%;height:100px} .tbl_frm01 a {text-decoration:none} .tbl_frm01 .frm_file {display:block;margin-bottom:5px;width:100%} .tbl_frm01 .frm_info {display:block;padding:5px 0 0;color:#666;line-height:1.3em} /* 자료 없는 목록 */ .empty_table {padding:20px 0 !important;text-align:center} .empty_list {padding:20px 0 !important;text-align:center} /* 필수입력 */ .required, textarea.required {background:url('../img/wrest.gif') #f7f7f7 top right no-repeat !important} /* 테이블 항목별 정의 */ .td_board {width:120px;text-align:center} .td_category {width:80px;text-align:center} .td_chk {width:30px;text-align:center} .td_date {width:60px;text-align:center} .td_datetime {width:150px;text-align:center} .td_group {width:100px;text-align:center} .td_mb_id {width:100px;text-align:center} .td_mng {width:80px;text-align:center} .td_name {width:100px;text-align:left} .td_nick {width:100px;text-align:center} .td_num {width:50px;text-align:center} .td_numbig {width:80px;text-align:center} .td_stat {width:60px;text-align:center} .txt_active {color:#5d910b} .txt_done {color:#e8180c} .txt_expired {color:#ccc} .txt_rdy {color:#8abc2a} /* 새창 기본 스타일 */ .new_win {} .new_win #win_title {margin:0 0 20px;padding:20px;border-top:3px solid #4e5d60;border-bottom:1px solid #e9e9e9;font-size:1.2em} .new_win #win_title .sv {font-size:0.75em;line-height:1.2em} .new_win .tbl_wrap {margin:0 20px} .new_win .win_ul {margin:-20px 0 20px 0;padding:0 20px;border-bottom:1px solid #455255;background:#484848;list-style:none} .new_win .win_ul:after {display:block;visibility:hidden;clear:both;content:""} .new_win .win_ul li {float:left;margin-left:-1px} .new_win .win_ul a {display:block;padding:10px;border-right:1px solid #455255;border-left:1px solid #455255;color:#fff;font-weight:bold;text-decoration:none} .new_win .win_desc {padding:10px 20px} .new_win .win_btn {clear:both;margin:20px;text-align:center} .new_win .win_btn a {display:inline-block;padding:0 10px;height:2.5em;background:#666;color:#fff;text-decoration:none;vertical-align:middle;line-height:2.5em} .new_win .win_btn button {display:inline-block;padding:0 10px;height:2.5em;border:0;background:#666;color:#fff;text-decoration:none;line-height:2.5em} .new_win .win_btn input {padding:0 10px;height:2.5em;line-height:2.5em} /* 검색결과 색상 */ .sch_word {color:#ff3061} /* 사이드뷰 */ .sv_wrap {display:inline-block;position:relative;font-weight:normal} .sv_wrap .sv {z-index:1000;display:none;margin:5px 0 0;border:1px solid #283646} .sv_wrap .sv a {display:inline-block;margin:0;padding:3px;width:94px;border-bottom:1px solid #283646;background:#111;color:#fff !important;text-align:left} .sv_wrap a:focus, .sv_wrap a:hover, .sv_wrap a:active {text-decoration:none} .sv_on {display:block !important;position:absolute;top:16px;left:0px;width:auto;height:auto} .sv_nojs .sv {display:block} /* 페이징 */ .pg_wrap {clear:both;margin:0px 0 20px;padding: 0 0;text-align:center;font-size:1.083em} .pg {} .pg_page, .pg_current {display:inline-block;padding:0 8px;height:30px;color:#000;letter-spacing:0;line-height:30px;vertical-align:middle} .pg a:focus, .pg a:hover {text-decoration:none} .pg_page {text-decoration:none} .pg_start{background:url(../img/page_btn.gif) no-repeat 0 0 ;text-indent:-9999px;overflow:hidden;width:30px;height:30px;border:1px solid #eee;padding:0;border-radius:15px;border:1px solid #ddd} .pg_prev {background:url(../img/page_btn.gif) no-repeat -31px 0;text-indent:-9999px;overflow:hidden;width:30px;height:30px;border:1px solid #eee;padding:0;border-radius:15px;border:1px solid #ddd} .pg_end{background:url(../img/page_btn.gif) no-repeat -93px 0;text-indent:-9999px;overflow:hidden;width:30px;height:30px;border:1px solid #eee;padding:0;border-radius:15px;border:1px solid #ddd} .pg_next {background:url(../img/page_btn.gif) no-repeat -63px 0;text-indent:-9999px;overflow:hidden;width:30px;height:30px;border:1px solid #eee;padding:0;;border-radius:15px;border:1px solid #ddd} .pg_current {display:inline-block;margin:0 4px 0 0;background:#dfdfdf;color:#fff;border-radius:15px;font-weight:bold;font-weight:bold} /* PC화면으로 */ #device_change {display:block;margin:5px;padding:5px 0;border:1px solid #eee;border-radius:2em;color:#000;font-size:1em;text-decoration:none;text-align:center} .clear_01 { clear: both; line-height: 0px; font-size:0px} .blank5 { height:5px} .blank10 { height:10px} .blank20 { height:20px} .pdtb50 {padding: 50px 0px;} .pdtb40 {padding: 40px 0px;} .pdtb30 {padding: 30px 0px;} .pdtb20 {padding: 20px 0px;} .pdtb15 {padding: 15px 0px;} .pdtb10 {padding: 10px 0px;} .pd50 {padding: 50px;} .pd40 {padding: 40px;} .pd30 {padding: 30px;} .pd20 {padding: 20px;} .pd10 {padding: 10px;} #ft_copy ul { padding:0px; margin: 0px;list-style:none;line-height:10px;} #ft_copy ul li {color:#000; display:inline-block; padding: 5px 3px;} .tip { background-color: #eaeaea; padding: 10px;line-height:17px;letter-spacing:0.05em;} .tip input[type=text] { padding: 3px; border: 1px solid #dfdfdf; width: 300px} .tip input[type=radio] { width:20px} .tip select { border:1px solid #dfdfdf; padding: 3px 5px; font-size: 12px} .tip span { color:#000; font-weight: bold} .stit h2 { font-size:15px; color:#346ba3; padding-top:0px; margin:0px; padding-bottom:15px ; text-align:left} .stit h2 span { font-size:12px; padding-left:10px; color:#000} .stit2 h2 { font-size:15px; color:#000; padding-top:0px; margin:0px 0 20px 0; padding-bottom:7px ; text-align:left; border-bottom: 1px dotted #ccc} .pop_left { float:left; width:44%;} .pop_left ul { padding:0px; margin:0px; list-style: none} .pop_left ul li { float:left; border-bottom:1px solid #dfdfdf; font-size:13px; padding:10px 0 5px 0; text-align:left} .pop_left .ti { width:30%} .pop_left .con { width:70%; font-weight:bold} .pop_right { float:right; width:44%; } .pop_right ul { padding:0px; margin:0px; list-style: none} .pop_right ul li { float:left; border-bottom:1px solid #dfdfdf; font-size:13px; padding:10px 0 5px 0; text-align:left} .pop_right .ti { width:30%} .pop_right .con { width:70%; font-weight:bold} .pop_ti { font-size:40px; padding-bottom:20px; font-weight:bold; letter-spacing:20px; text-align:center;position:relative; border-bottom:1px solid #000; margin-bottom:20px} .dojang { position:absolute; top:100px; right:30px; } .tbl_frm02_pop {margin:0 0 0px} .tbl_frm02_pop table {width:100%;border-collapse:collapse;border-spacing:0; border-left:1px solid #e9e9e9; border-right:1px solid #e9e9e9} .tbl_frm02_pop th {width:70px;padding:10px 5px;border:1px solid #e9e9e9; background:#f5f8f9;text-align:left; color: #3a3a3a;font-size:12px; font-weight:bold} .tbl_frm02_pop td {padding:10px 5px 10px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;font-size:13px;} .tbl_frm02_pop .CT { text-align:center} .tbl_frm02_pop .RT { text-align:right} .tbl_frm02_pop .hit { font-weight:bold; color: #000; font-size:15px} .top_text {margin:0 auto;width:100%;max-width:1000px;color:#333;font-size:17px;text-align:left;} .top_text .subtitle {font-size:37px;color:#333;padding-right:40px;} .top_text .subtext {font-size:17px;color:#333;padding-top:30px;line-height:25px;padding-left:40px;padding-right:40px;} .top_text .subicon {padding-top:30px;padding-right:40px;} .top_text .subtext2 {font-size:13px;color:#333;padding-top:0px;line-height:25px;padding-left:40px;padding-right:40px;} .sc_top_menu2 {margin:0 auto;width:100%;max-width:1400px;color:#101f39;padding-top:30px;font-size:17px;} .sc_top_menu2 a {color:#101f39;} .top_text2 {margin:0 auto;width:100%;max-width:1200px;color:#101f39;font-size:17px;text-align:right;} .top_text2 .subtitle {font-size:37px;;color:#101f39;text-align:right;padding-left:40px;padding-right:40px;} .top_text2 .subtext {font-size:17px;color:#101f39;padding-top:30px;line-height:25px;text-align:right;padding-left:40px;padding-right:40px;} .top_text2 .subicon {padding-top:30px;text-align:right;padding-left:40px;padding-right:40px;} .top_text2 .subtext2 {font-size:13px;color:#101f39;padding-top:0px;line-height:25px;text-align:right;padding-left:40px;padding-right:40px;} .sc_top_menu3 {margin:0 auto;width:100%;max-width:1400px;color:#352f2a;padding-top:30px;font-size:17px;} .sc_top_menu3 a {color:#352f2a;} .top_text3 {margin:0 auto;width:100%;max-width:1200px;color:#352f2a;font-size:17px;text-align:center;} .top_text3 .subtitle {font-size:37px;;color:#352f2a;text-align:center;padding-left:40px;padding-right:40px;} .top_text3 .subtext {font-size:17px;color:#352f2a;padding-top:30px;line-height:25px;text-align:center;padding-left:40px;padding-right:40px;} .top_text3 .subicon {padding-top:30px;text-align:center;padding-left:40px;padding-right:40px;} .top_text3 .subtext2 {font-size:13px;color:#352f2a;padding-top:0px;line-height:25px;text-align:center;padding-left:40px;padding-right:40px;} .top_text4 {margin:0 auto;width:100%;max-width:1200px;color:#e6d0a9;font-size:17px;text-align:center;} .top_text4 .subtitle {font-size:37px;;color:#e6d0a9;text-align:center;padding-left:40px;padding-right:40px;} .top_text4 .subtext {font-size:17px;color:#e6d0a9;padding-top:30px;line-height:25px;text-align:center;padding-left:40px;padding-right:40px;} .top_text4 .subicon {padding-top:30px;text-align:center;padding-left:40px;padding-right:40px;} .top_text4 .subtext2 {font-size:13px;color:#e6d0a9;padding-top:0px;line-height:25px;text-align:center;padding-left:40px;padding-right:40px;} .top_text5 {margin:0 auto;width:100%;max-width:1200px;color:#ffffff;font-size:17px;text-align:center;} .top_text5 .subtitle {font-size:40px;;color:#ffffff;text-align:center;padding-left:40px;padding-right:40px;} .top_text5 .subtext {font-size:24px;color:#ffffff;padding-top:30px;line-height:38px;text-align:center;padding-left:40px;padding-right:40px;} .top_text5 .subicon {padding-top:30px;text-align:center;padding-left:40px;padding-right:40px;} .top_text5 .subtext2 {font-size:17px;color:#e6d0a9;padding-top:10px;line-height:30px;text-align:center;padding-left:40px;padding-right:40px;} .top_text22 {margin:0 auto;width:100%;max-width:1200px;color:#101f39;font-size:17px;text-align:center;} .top_text22 .subtitle {font-size:37px;;color:#101f39;text-align:center;padding-left:40px;padding-right:40px;} .top_text22 .subtext {font-size:17px;color:#101f39;padding-top:30px;line-height:25px;text-align:center;padding-left:40px;padding-right:40px;} .top_text22 .subicon {padding-top:30px;text-align:center;padding-left:40px;padding-right:40px;} .top_text22 .subtext2 {font-size:13px;color:#101f39;padding-top:0px;line-height:25px;text-align:center;padding-left:40px;padding-right:40px;}