@charset "UTF-8"; .tabDepth>a, .lastDepth>a, .depth3>a, .depth3>a>span:before, .faq_list>li .q, .faq_list>li .q>.bul, #mVisual .visualRoll .slider>div, #mVisual .vTxtArea .ii, #mVisual .slick-dots>li button, #mVisual .slick-dots>li button:before, #mVisual .iconMenu .inConts>a, .swiper-button, .swiper-pagination-bullet, .m-tab>a, #quick-right>a, .store-area>.store-map .thumb .finding-map-link, .store-area>.store-map .thumb .finding-map-link:after, /*#quick-right,*/ #quick-social, #main-program .program-list>li>a, #mainStrengths .swiper-wrapper .swiper-slide .strengths-text>.btns>button, .mainEsg-list>li:hover figure, .mainEsg-list>li:hover figure img, .tab-three>a, .tab-three>a:before, .tab-three>a:after, .ir-notice .icon, .talent-top>li, #mainVisual .swiper-pagination-bullet:before, .swiper-wrapper .swiper-slide.over:before, .swiper-wrapper .swiper-slide.over:after, .btn-box>a, .spineAim-recommended ul>li, .spineAim-recommended ul>li>p:before{transition: all .3s ease-out; transform-origin: 50% 50%;} #mainVisual .vTxt .ii{transition: all .4s ease-out; transform-origin: 50% 50%;} .historyArea .history_box>.logo>span, .historyArea .history_box>.list:before, #mVisual .vTxt .ii{transition: all .5s ease-out; transform-origin: 50% 50%;} #mVisual .visualRoll .slider .photoBox p{transition: all 1s ease-out; transform-origin: 50% 50%;} /*#mainVisual .visualRoll .swiper-slide>img{transition: all 2s ease-out; transform-origin: 50% 50%;}*/ /*[s] All Style */ h4.txt{margin-bottom:5.5rem; font-weight: 700; font-size:var(--fs_20); line-height:1.3; color: #000; text-align: center;} h4.txt>*{font-size:2.5em;} h4.txt>strong{font-weight: inherit;} *+h4.txt{margin-top:9rem;} h4.tit{margin-bottom:5.5rem; font-weight: 700; font-size:var(--fs_20); line-height:1.3; color: #000; text-align: center;} h4.tit>*{font-size:2em;} h4.small{margin-bottom:2rem; font-weight: 700; font-size:var(--fs_20); line-height:1.3; color: #000;} h4.small>*{font-weight: inherit; font-size:1.5em;} h5.txt{margin-bottom:2.5rem; font-size:var(--fs_20); color: #000;} h5.txt>*{font-size:1.25em; line-height:var(--lh_10);} h5.txt>strong{font-weight: 700;} .nTxt{font-size:var(--fs_20); line-height:var(--lh_10); color: #000;} ul.jum{font-size:var(--fs_20); line-height:var(--lh_10); color: #666;} ul.jum>li{padding-left:1.2rem; position: relative;} ul.jum>li:before{content: "·"; position:absolute; left: 0; top:0;} ul._star{font-size:var(--fs_20); line-height:1.45; color: #666;} ul._star>li{padding-left:1.5rem; font-size:var(--fs_18); position: relative;} ul._star>li:before{content: "※"; position:absolute; left: 0; top:0;} ul.star_>li{padding-left:1.2rem; font-size:var(--base18); line-height:1.5; color: #383637; position: relative;} ul.star_>li:before{content: "*"; color: #ff0000; position:absolute; left: 0; top:0;} ul.star_.inherit>li:before{color:inherit;} ul._line>li{padding-left:1.4rem; font-size:var(--base18); line-height:var(--lineHeight); color: #383637; position: relative;} ul._line>li:before{content: "-"; position:absolute; left: 0; top:0;} ul._line.two{display: flex; flex-flow: row wrap; justify-content: space-between; gap:0 3rem;} ul._line.two>li{flex:1 1 calc((100% - 3rem) / 2);} ul.caution{margin-top:1.5rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #8b909d;} ul.caution>li{padding-left:3.2rem; font-size:var(--fs_18); line-height:var(--lh_10); position: relative;} ul.caution>li:before{content: ""; width:2.2rem; height:2.2rem; background:url('/images/icon_caution.png') no-repeat center center/cover; position:absolute; left: 0; top:0.3rem;} .icon-txt{font-weight: 500; font-size:var(--base20); line-height:var(--lineHeight); color: #383637; display: flex; align-items: start; gap:0 1rem;} .icon-txt figure{width:2rem; display: flex;} .icon-txt p{flex:1;} .icon-txt.clock figure{padding-top:0.5rem;} .icon-txt.c{justify-content: center;} .sticky-table{width:100%; border-top:2px solid #000; font-size:0; line-height:0;} .sticky-table+.sticky-table{margin-top:2rem;} .sticky-table>table{width:100%; border-spacing:0; border-collapse: separate;} .sticky-table>table th, .sticky-table>table td{padding:1.6rem 2rem; background-color: #fff; border-right:1px solid #ddd; border-bottom:1px solid #ddd; font-weight: 400; font-size:var(--fs_20); line-height:1.45; color:#666; text-align:center; vertical-align: middle; border-collapse:separate; empty-cells:show; box-sizing: border-box; word-break:keep-all; word-wrap:break-word;} .sticky-table>table tr>*:last-child{border-right:none;} .sticky-table>table>thead>tr>th, .sticky-table>table>tbody>tr>th{background-color:#fff8f1; font-weight:600; color: #000;} .sticky-table>table>thead>tr>th:first-child{left:0; z-index:2;} .sticky-table>table .th{background-color: #f7f7f7; font-weight: 600;} .sticky-table>table .th-w{font-weight: 600;} .sticky-table>table>tbody>tr>th+td{text-align: left;} .sticky-table>table .gold{background-color: #fff9e6;} .sticky-table>table ul.jum>li{font-size:inherit; line-height:inherit; color:inherit;} .sticky-table.even>table tbody tr:nth-child(even)>*{background-color: #f8f8f8;} .sticky-table.fixed>table{table-layout : fixed;} .sticky-table.line{} .sticky-table.line>table{border-collapse: collapse;} .sticky-table.line>table th, .sticky-table.line>table td{border:1px solid #ddd;} .sticky-table.view{border-top-width:1px;} .sticky-table.view>table{} .sticky-table.view>table th, .sticky-table.view>table td{font-size:1.8rem;} .sticky-table.view>table>tbody>tr>th{width:22rem; background-color: #fcf7f3; padding-left:4rem; text-align: left;} /* ── 스와이프 힌트 ── */ .swipe-hint-box{margin-bottom:1rem; display: none; justify-content: center; } .swipe-hint{padding: 5px 14px 5px 14px; margin:0 auto; background: rgba(0,0,0,0.05); display: inline-flex; align-items: center; gap: 30px; border-radius: 999px;} /* 좌우 화살표 */ .swipe-hint .arrow{display: flex; align-items: center; gap: 3px;} .swipe-hint .arrow::before, .swipe-hint .arrow > span, .swipe-hint .arrow::after{width: 7px; height: 7px; border-top: 2px solid var(--c_point); border-right: 2px solid var(--c_point); display: block; box-sizing: border-box; flex: 0 0 7px;} .swipe-hint .arrow::before, .swipe-hint .arrow::after{content: "";} /* 왼쪽: 바깥→안쪽 순서로 흘러들어오는 느낌 */ .swipe-hint .arrow-left::before, .swipe-hint .arrow-left > span, .swipe-hint .arrow-left::after{transform: rotate(225deg);} .swipe-hint .arrow-left::before{ animation: swipe-hint_blink 1.8s infinite 0.3s; } .swipe-hint .arrow-left>span{ animation: swipe-hint_blink 1.8s infinite 0.15s; } .swipe-hint .arrow-left::after{ animation: swipe-hint_blink 1.8s infinite 0s; } /* 오른쪽: 안쪽→바깥쪽 순서로 흘러나가는 느낌 */ .swipe-hint .arrow-right::before, .swipe-hint .arrow-right > span, .swipe-hint .arrow-right::after{ transform: rotate(45deg);} .swipe-hint .arrow-right::before{ animation: swipe-hint_blink 1.8s infinite 0s; } .swipe-hint .arrow-right>span{ animation: swipe-hint_blink 1.8s infinite 0.15s; } .swipe-hint .arrow-right::after{ animation: swipe-hint_blink 1.8s infinite 0.3s; } @keyframes swipe-hint_blink { 0%, 100% { opacity: 0.1; } 50%{ opacity: 1; } } /* 원형 손가락 아이콘 */ .circle-icon{width: 20px; height: 20px; background: #fff; border-radius: 50%; box-shadow: 0 1px 5px rgba(0,0,0,0.15); display: flex; align-items: center; justify-content: center; flex-shrink: 0; animation: slide-lr 3s ease-in-out infinite;} .circle-icon:before{content: ""; width: 12px; height: 12px; background: var(--c_point); border-radius: 50%; opacity: 0.7;} @keyframes slide-lr { 0%, 75% { transform: translateX(0);} 25% { transform: translateX(10px);} 50%{ transform: translateX(-10px);} } img.noIMG{width:80% !important; height:80% !important; object-fit: contain !important; filter:grayscale(100%); opacity: 0.3; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%);} .tour-swiper-conts{display:none;} .wideKakao{width: 100%; margin: 0 auto; position: relative;} .wideKakao>.root_daum_roughmap{width: 100%; height:56rem;} .wideKakao>.root_daum_roughmap .wrap_map{height:100%; position: absolute; left: -1px; right: -1px; top: -1px;} .wideKakao .hide{display: none;} .video-full{aspect-ratio:16/9; position: relative;} /*.video-full:after{content: ""; width:100%; height:100%; background-color: #000; position:absolute; left: 0; top:0px; opacity: 0.4;}*/ .video-full :where(video, img, iframe){width:100%; height:100%; object-fit: cover; position: absolute; left:0; top:0;} .video-full .video-play-btn{width:100%; height:100%; background:url('/images/btn_video-play.png') no-repeat center center/9rem; position: absolute; left:0; top:0; z-index:3; display:block;} .video-full.is-playing .video-play-btn{display:none;} .video-full.photo{aspect-ratio:12/5;} .ellipsis{display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:var(--line, 2); word-break:break-all;} .ps-green{margin-bottom:2rem; font-weight: 600; font-size:var(--fs_20); line-height:1.1; color: #666; display: flex; flex-flow: row wrap; align-items: center; justify-content: end; gap:0 2.9rem;} .ps-green>p{font-size:1.1em; position: relative;} .ps-green>p+p:before{content: ""; width: 1px; height: 1.8rem; margin-top:-0.9rem; background-color: #ddd; position:absolute; left: -1.45rem; top:50%;} .box-radius-gray{margin-top:5.5rem; padding:2.5rem; background-color: #fff; border:3px solid #ddd; font-size:var(--fs_20); line-height:var(--lh_10); color: #000; text-align: center; border-radius:2rem;} .scroll-img{width:100%; text-align: center; overflow: hidden;} .scroll-img.c{justify-content: center;} .scroll-img.safety{margin-top:-17rem; display:flex;} .scroll-img.ethical{display:flex;} .table-w1280{width:100%; border-top:2px solid #000; font-size:0; line-height:0; overflow: hidden;} .table-w1280>table{width:100%; font-size:var(--fs_20); line-height:1; color:#666; border-spacing:0; border-collapse: separate;} .table-w1280>table th, .table-w1280>table td{height:9rem; padding:0.5rem 1rem; background-color: #fff; border-bottom:1px solid #ddd; font-weight: 400; font-size:0.8em; line-height:1.375; text-align:center; vertical-align: middle; border-collapse:separate; empty-cells:show; box-sizing: border-box; word-break:keep-all; word-wrap:break-word;} .table-w1280>table>thead>tr>th{background-color:var(--c_point2); border-bottom:none; font-weight: 500; color: #fff;} .table-w1280>table>tbody>tr>th{} .table-w1280>table>tbody>tr:nth-child(even)>*{background-color: #f4f6f8;} .table-w1280>table .b{font-weight: 500; color: #000;} .table-w1280>table .b .small{font-weight: 400; color: #666; display:block;} .img-flex{display: flex;} .img-flex.c{justify-content: center;} /*[e] All Style */ /*[s] Main Style */ a:not(.no) .thumb{overflow:hidden;} a:not(.no) .thumb img:not(.noIMG){transition: all .7s ease-out; transform-origin: 50% 50%;} a:not(.no):hover .thumb img:not(.noIMG){transform: scale(1.1);} .m-title{padding-bottom:4.5rem; font-size:var(--fs_20); line-height:1; color: #fff; text-align: center;} .m-title h3{font-weight: 800; font-size:2.75em;} .m-title p{margin-top:1.5rem; font-size:1.1em; line-height:var(--lh_10);} .m-title.black{color: #000;} .m-title.black p, .m-title.black h3{color: inherit;} .m-btn{width:15rem; height:5rem; background-color: var(--c_point); font-weight: 500; font-size:var(--fs_20); line-height:1; color: #fff; display: inline-flex; align-items: center; justify-content: center; border-radius:1rem; overflow: hidden; transition:background-color .3s ease-out, border-color .3s ease-out;} .m-btn.p2{background-color: #0099ff; border-radius:0.5rem;} .s-btn{width:22rem; height:5rem; background-color: #fff; border:1px solid #999; font-weight: 500; font-size:var(--fs_20); line-height:1; color: #666; display: inline-flex; align-items: center; justify-content: center; border-radius:0.5rem; overflow: hidden; transition:background-color .3s ease-out, border-color .3s ease-out, color .3s ease-out;} .s-btn>span{font-size:0.9em;} .s-btn i{font-style: normal;} .s-btn:hover{background-color: var(--c_point); border-color: var(--c_point); color: #fff;} /* .m-btn.gray{border-color:#666; color:#666;} .s-btn{min-height:4.4rem; padding:1.5rem 3rem; background-color: #fff; border:1px solid #666; font-size:var(--fs_20); line-height:1; color: #666; display: inline-flex; align-items: center; justify-content: center; border-radius:1rem; overflow: hidden;} .s-btn>span{font-weight: 600; font-size:0.9em;} a:hover .m-btn, .m-btn:is(:hover, .active), a:hover .s-btn, .s-btn:is(:hover, .active){background-color: var(--c_point2); border-color: var(--c_point2); color: #fff;} */ .btns-box{display: flex; align-items: center; gap:1rem;} .btns-box.end{justify-content: end;} .displacement-swiper{height:96rem; background:#fff; position:relative; overflow:hidden;} .displacement-swiper .displacement-canvas{position:absolute; inset:0; z-index:1; opacity:0; transform:scale(1.06); transition:opacity 1.2s ease, transform 2.2s cubic-bezier(.22,1,.36,1);} .displacement-swiper .displacement-canvas canvas{width:100%; height:100%; display:block;} .displacement-swiper.is-intro .displacement-canvas{opacity:1; transform:scale(1);} #mainVisual{width:100%; height:100%; background:transparent; position:relative; overflow:hidden; z-index:2;} #mainVisual .swiper-wrapper{display: flex; flex-flow: row nowrap; opacity:1; visibility:visible;} #mainVisual .swiper-wrapper .swiper-slide{min-width:100%; width:100%; background:transparent; font-size:0; line-height:0; position: relative; overflow:hidden; display:inline-block; vertical-align: top; -webkit-backface-visibility:hidden; backface-visibility:hidden; transform:translateZ(0);} #mainVisual .swiper-wrapper .swiper-slide:not([data-video-id]):before{content: ""; width: 100%; height: 100%; background-color: #000; opacity: 0.3; display:block; position: absolute; left:0; top:0; z-index:2;} #mainVisual .swiper-wrapper .swiper-slide.swiper-slide-active{z-index:5;} #mainVisual .swiper-wrapper .swiper-slide>img{width:100%; max-width:none; height:96rem; object-fit: cover; object-position: center center; transform:scale(1); transform-origin:center center; will-change:transform; -webkit-backface-visibility:hidden; backface-visibility:hidden;}/* transform:scale(1.1); */ #mainVisual .swiper-wrapper .swiper-slide[data-video-id] .vTxtArea{padding-top:35rem; opacity: 0.7;} #mainVisual .vTxtArea{width:100%; height:100%; max-width:172rem; margin-left:-86rem; padding:0 2rem; position: absolute; left:50%; top:0; z-index:3; display: flex; align-items: center; justify-content: center;} #mainVisual .vTxt{width:100%; font-size:var(--fs_20); line-height:1; text-align: center;} /* #mainVisual .vTxt .ii{line-height:1; color:#fff; display:block; opacity:0; position:relative; transform:translateY(3rem); filter:blur(6px); transition:opacity .5s ease, transform .8s cubic-bezier(.22,1,.36,1), filter .7s ease; transition-delay:0s; will-change:transform,opacity,filter;} #mainVisual .swiper-slide-active .vTxt .ii{opacity:1; transform:translateY(0); filter:blur(0);} #mainVisual .swiper-slide-active .vTxt .i01{transition-delay:1s;} #mainVisual .swiper-slide-active .vTxt .i02{transition-delay:1.1s;} #mainVisual .swiper-slide-active .vTxt .i03{transition-delay:1.2s;} */ .displacement-swiper .displacement-canvas{position:absolute; inset:0; z-index:1; opacity:0; transition:opacity 1.2s ease, transform 2.2s cubic-bezier(.22,1,.36,1);} .displacement-swiper.is-intro .displacement-canvas{opacity:1; } #mainVisual .vTxt .ii{line-height:1; color:#fff; display:block; opacity:0; transform:translateY(4rem); filter:blur(6px); transition:opacity .8s ease, transform .9s cubic-bezier(.22,1,.36,1), filter .8s ease; transition-delay:0s; will-change:transform,opacity,filter;} #mainVisual .swiper-slide-active .vTxt .ii{opacity:1; transform:translateY(0); filter:blur(0);} #mainVisual .swiper-slide-active .vTxt .i01{transition-delay:.15s;} #mainVisual .swiper-slide-active .vTxt .i02{transition-delay:.3s;} #mainVisual .swiper-slide-active .vTxt .i03{transition-delay:.45s;} #mainVisual .swiper-slide:not(.swiper-slide-active) .vTxt .ii{opacity:0; transform:translateY(-2rem); filter:blur(4px); transition-delay:0s; transition-duration:.2s;} #mainVisual .vTxt .ii.title{font-weight:800; font-size:3.25em; line-height:var(--lh_10);} #mainVisual .vTxt .ii.text{margin-top:2rem; font-weight:500; font-size:1.5em; line-height:var(--lh_10);} #mainVisual .vTxt .ii.btn{margin-top:4.5rem; display: flex; justify-content: center;} #mainVisual .swiper-pagination{width:100%; position: absolute; left:0; bottom:16rem; display: none; align-items: center; justify-content: center; gap:0 1.4rem; z-index:7;} #mainVisual .swiper-pagination.open{display: flex;} #mainVisual .swiper-pagination-bullet{width:1.4rem; height:1.4rem; background-color: transparent; border:1px solid rgba(255,255,255,0.6); transition: all .3s ease-out; position: relative; cursor: pointer; border-radius:99rem;} #mainVisual .swiper-pagination-bullet.swiper-pagination-bullet-active{width:4.4rem; background-color:#fff; opacity: 1; border-color:#fff;} /* business */ #main-business{background-color: #000; display: flex; position: relative;} #main-business .m-title{position: absolute; left:0; right:0; top:15rem; z-index:4;} #main-business .main-business{width:100%; display: flex; flex-flow: row nowrap;} #main-business dl{width:25%; height:96rem; padding:0 3rem; background-repeat: no-repeat; background-position: center center; background-size: cover; font-size:var(--fs_20); line-height:1; color: #fff; display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; position: relative; cursor: pointer; transition: width .3s ease-out;} #main-business dl:after{content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); display: block; position:absolute; left: 0; top:0px; transition: background-color .3s ease-out;} #main-business dl:before, #main-business dl>dt, #main-business dl>dd{position: relative; z-index:2; opacity: 0.5; line-height:1; color: #fff; text-align: center; transition: opacity .3s ease-out, font-weight .3s ease-out;} #main-business dl:before{font-weight: 700; font-size:1.5em; display:none;} #main-business dl>dt{margin-top:3rem; font-weight: 500; font-size:2em;} #main-business dl>dd{margin-top:2.5rem; font-weight: 400; line-height:var(--lh_10);} html[lang="en"] #main-business dl>dt{font-size:1.5em;} html[lang="en"] #main-business dl>dd{line-height:var(--lh_10);} #wrap[data-device="pc"] #main-business dl:hover{width:31%;} #wrap[data-device="pc"] #main-business dl:hover ~ dl{width:23%;} #wrap[data-device="pc"] #main-business dl:hover:before, #wrap[data-device="pc"] #main-business dl:hover>dt, #wrap[data-device="pc"] #main-business dl:hover>dd{opacity:1;} #wrap[data-device="pc"] #main-business dl:hover:before{font-weight: 700;} #wrap[data-device="pc"] #main-business dl:hover>dt{font-weight: 700;} #wrap[data-device="pc"] #main-business dl:hover>dd{font-weight: 500;} #wrap[data-device="pc"] #main-business dl:hover:after{background-color: rgba(0,0,0,0.3);} #main-business dl:nth-of-type(1){background-image:url("/images/main/img_business02.jpg?var=2026-08-28");} #main-business dl:nth-of-type(2){background-image:url("/images/main/img_business03.jpg");} #main-business dl:nth-of-type(3){background-image:url("/images/main/img_business04.jpg?var=2026-08-28");} #main-business dl:nth-of-type(4){background-image:url("/images/main/img_business05.jpg");} #wrap[data-device="mobile"] #main-business dl:before, #wrap[data-device="mobile"] #main-business dl>dt, #wrap[data-device="mobile"] #main-business dl>dd{opacity:1;} #wrap[data-device="mobile"] #main-business dl:before{font-weight: 700;} #wrap[data-device="mobile"] #main-business dl>dt{font-weight: 700;} #wrap[data-device="mobile"] #main-business dl>dd{font-weight: 500;} #wrap[data-device="mobile"] #main-business dl:after{background-color: rgba(0,0,0,0.3);} /* R&D */ #main-rnd{padding-top:15rem; background: url('/images/main/bg_rnd.jpg') no-repeat center center / cover; position: relative; overflow: hidden;} #main-rnd .rnd-head{position: absolute; left:57.8125%; top:15rem; z-index:7;} #main-rnd .rnd-head .m-title{text-align: left;} #main-rnd .rnd-head .rnd-menu{font-size:var(--fs_20); line-height:var(--lh_10); color: #fff; display:flex; gap:5rem;} #main-rnd .rnd-head .rnd-menu button{font-weight: 400; font-size:1.1em; line-height:var(--lh_10); color:inherit;} #main-rnd .rnd-head .rnd-menu button:is(:hover, .active){font-weight: 500; text-decoration: underline; text-underline-position:under;} #main-rnd .swiper-container{width:100%; max-width:192rem; margin:0 auto;} #main-rnd .swiper-wrapper{display: flex; justify-content: flex-start;} #main-rnd .swiper-slide{min-width:100%; width:100%; background:transparent; font-size:0; line-height:0; position: relative; overflow:hidden; display:flex; -webkit-backface-visibility:hidden; backface-visibility:hidden; transform:translateZ(0);} #main-rnd .swiper-slide figure{width:50%; height: 81rem; display: flex; border-radius:0 9rem 0 0; overflow: hidden;} #main-rnd .swiper-slide figure img{width:100%; max-width:none; height: 100%; object-fit: cover; display:block; transform:scale(1.07); transition:transform 1.4s ease;} #main-rnd .swiper-slide-active figure img{transform:scale(1);} #main-rnd .swiper-slide .conts{width:50%; padding:22.5rem 7.8125% 15rem; font-size:var(--fs_20); line-height:1; color: #fff;} #main-rnd .swiper-slide .conts .title{font-weight: 700; font-size:2.25em;} #main-rnd .swiper-slide .conts .tit{margin-top:1rem; font-weight: 500; font-size:1.1em;} #main-rnd .swiper-slide .conts .text{margin-top:3rem; font-weight: 500; font-size:1.5em; line-height:var(--lh_10);} #main-rnd .swiper-slide .conts .btn{margin-top:4rem;} #main-rnd .swiper-slide .conts .btn>a{width:16rem; height:5rem; background-color: #0099ff; font-weight: 500; display: inline-flex; align-items: center; justify-content: center; gap:0.5rem; border-radius:0.5rem;} #main-rnd .swiper-slide .conts .btn>a>span{font-weight: 400;} #main-rnd .swiper-slide .ii{opacity:0;transform:translateY(3rem);transition:opacity .65s ease,transform .65s ease;} #main-rnd .swiper-slide:not(.swiper-slide-active) .ii{opacity:0;transform:translateY(3rem);transition-delay:0s;} #main-rnd .swiper-slide.swiper-slide-active{z-index:3;} #main-rnd .swiper-slide-active .title{opacity:1;transform:translateY(0);transition-delay:.35s;} #main-rnd .swiper-slide-active .tit{opacity:1;transform:translateY(0);transition-delay:.55s;} #main-rnd .swiper-slide-active .text{opacity:1;transform:translateY(0);transition-delay:.75s;} #main-rnd .swiper-slide-active .btn{opacity:1;transform:translateY(0);transition-delay:.95s;} :root{ --container: 172rem; /* .inConts의 max-width */ --container_small: 128rem; /* .inConts의 max-width */ --gutter: 2rem; /* .inConts 좌우 패딩 있으면 여기에 넣기 (예: 2rem) */ --outset_172: max(0px, calc(((100vw - var(--sbw, 0px)) - var(--container)) / 2) + var(--gutter)); --outset_128: max(0px, calc(((100vw - var(--sbw, 0px)) - var(--container_small)) / 2) + 3rem); } /* project */ #main-project{padding:15rem 0;} #main-project>.inConts{display: flex; align-items: center; overflow: visible; gap:0 0;} #main-project .mGroup{width:38rem; min-width:38rem; margin-bottom:0;} #main-project .right{width: calc(100% - 38rem)} #main-project .swiper-container{width: calc(100% + var(--outset_172)); padding-bottom:7rem; position: relative; overflow: hidden;} #main-project .swiper-wrapper{width: 100%; height: 100%; display: flex; box-sizing: content-box;} #main-project .swiper-slide{flex-shrink: 0; width:40rem; margin-right:2.5rem; background-color: #f4f6f8; position: relative; overflow:hidden; display:inline-block; vertical-align: top; border-radius:1rem;} #main-project .swiper-slide:last-child {margin-right:0;} #main-project .swiper-slide .thumb{aspect-ratio:400/270; overflow: hidden;} #main-project .swiper-slide .thumb>img{width:100%; height:100%; object-fit: cover; display:block;} #main-project .swiper-slide .conts{min-height:25rem; padding:3.5rem 2.9rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #666;} #main-project .swiper-slide .title{font-weight: 700; font-size:1.5em; color: #000;} #main-project .swiper-slide .text{margin-top:1rem;} #main-project .swiper-button-area{width:12rem; display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; position: relative;} #main-project .swiper-button-area:before{content: ""; width: 1px; height: 100%; margin-left:-0.5px; background-color: #e6e6e6; display: inline-block; position:absolute; left: 50%; top:0px;} #main-project .swiper-button-area .swiper-button{width:2rem; height:3.6rem; background: url('/images/btn_swiper_prev.png') no-repeat center center / cover; cursor: pointer;} #main-project .swiper-button-area .swiper-button-next{background-image: url('/images/btn_swiper_next.png');} #main-project .swiper-button-area .swiper-button:not(.swiper-button-disabled):hover{-webkit-filter: grayscale(100%) brightness(0); filter: grayscale(100%) brightness(0);} #main-project .swiper-button.swiper-button-disabled{opacity: 0.3; cursor: default;} .swiper-container:has(~ .swiper-pagination-progressbar.swiper-pagination-lock){padding-bottom:0 !important;} .swiper-pagination-progressbar.swiper-pagination-lock{display:none !important;} .swiper-pagination-progressbar{width:100%; height:0.6rem; margin-top:0; background-color:#f4f6f8; position: relative; left:0; top:0; border-radius:99px; overflow: hidden;} .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{width: 100%; height: 100%; background: #999; border-radius:99px; position: absolute; left: 0; top: 0; transform-origin: left top;} /* esg */ #main-esg{padding:15rem 0; overflow: hidden; position: relative;} #main-esg:before{content: ""; width: 100%; height: 100%; background: url('/images/main/bg_esg.jpg') no-repeat center center / cover; position:absolute; left: 0; top:0px; transition: all .7s ease-out; } #main-esg .esg-li{margin-top:13rem; display: flex; flex-flow: row wrap; gap:5rem 2rem;} #main-esg .esg-li>li{width:calc((100% - 8rem) / 5);} #main-esg .esg-li>li figure{height:9.2rem; display: flex; align-items: center; justify-content: center;} #main-esg .esg-li>li img{height:8rem;} #main-esg .esg-li>li img[src*="icon_esg03"]{height:9.1rem;} #main-esg .esg-li>li img[src*="icon_esg04"]{height:7.6rem;} #main-esg .esg-li>li dl{margin-top:5rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #fff; text-align: center;} #main-esg .esg-li>li dl>dt{font-weight: 700; font-size:1.75em; line-height:1;} #main-esg .esg-li>li dl>dd{margin-top:2rem;} #main-esg:hover:before{transform: scale(1.03)} /* news */ #main-news{padding:15rem 0; overflow: hidden;} #main-news .swiper-container{} /* #main-news .swiper-wrapper{width: 100%; height: 100%; display: flex; box-sizing: content-box;} #main-news .swiper-slide{flex-shrink: 0; width:40rem; margin-right:2.5rem; position: relative; overflow:hidden; display:inline-block; vertical-align: top;} #main-news .swiper-slide:last-child {margin-right:0;}* */ #main-news .swiper-wrapper{width: 100%; display: flex; flex-flow: row wrap; box-sizing: content-box; gap:4rem 2.5rem;} #main-news .swiper-slide{width:calc((100% - 7.5rem) / 4); position: relative; overflow:hidden; display:inline-block; vertical-align: top;} #main-news .swiper-slide .thumb{aspect-ratio:400/260; overflow: hidden; border-radius:1rem;} #main-news .swiper-slide .thumb>img{width:100%; height:100%; object-fit: cover; display:block;} #main-news .swiper-slide .conts{padding:2rem 0; font-size:var(--fs_20); line-height:var(--lh_10); color: #666;} #main-news .swiper-slide .title{font-weight: 700; font-size:1.1em; color: #000; display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break:break-all;} #main-news .swiper-slide .day{margin-top:2.5rem; line-height:1;} /*[e] Main Style */ /*[s] Sub Style */ /* 기업정보 > 개요 */ .overview-top{padding-top:9.5rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #666; text-align: center;} .overview-top>dt{font-weight: 100; font-size:2em; line-height:var(--lh_10); color: #000;} .overview-top>dt>strong{font-weight: 500;} .overview-top>dd{margin-top:3rem;} .overview-vision{width:100%; margin-top:16rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #666; display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between;} .overview-vision .title{width:31.5476%; max-width:53rem; font-weight: 500; font-size:2em; line-height:1; color: #000; text-align: center;} .overview-vision .conts{width:66.6667%; max-width:112rem;} .overview-vision .conts>li{display: flex; flex-flow: row wrap;} .overview-vision .conts>li figure{width:14rem; display: flex; align-items: start;} .overview-vision .conts>li figure img{width:9.2rem; display: block;} .overview-vision .conts>li dl{flex:1;} .overview-vision .conts>li dl>dt{font-weight: 500; font-size:1.5em; line-height:1; color: #000;} .overview-vision .conts>li dl>dd{margin-top:2rem;} .overview-vision .conts>li+li{margin-top:7.5rem; padding-top:7.5rem; border-top:1px solid #e6e6e6;} .overview-philosophy{} .overview-philosophy_re{width:100%; display:flex; position: relative; overflow:hidden; } .overview-philosophy_re figure{width:50%; height: 96rem; display: flex; overflow: hidden;} .overview-philosophy_re figure img{width:100%; max-width:none; height: 100%; object-fit: cover; display:block;} .overview-philosophy_re .conts{width:50%; padding:0 2rem; font-size:var(--fs_20); line-height:1; color: #000; display: flex; flex-flow: column nowrap; align-items: center; justify-content: center;} .overview-philosophy_re .conts .title{font-weight: 600; font-size:3.5em; line-height:1;} .overview-philosophy_re .conts .tit{margin-top:2rem; font-weight: 600; font-size:1.5em; line-height:1;} .overview-philosophy_re .conts .text{margin-top:3.5rem; font-size:1.25em; line-height:var(--lh_10); color: #666;} .overview-philosophy_re:nth-child(even) figure{order:2;} .overview-philosophy_re:nth-child(even) .conts{order:1;} .overview-info{width:100%; background:url('/images/sub/bg_overview.jpg') no-repeat center center/cover; font-size:var(--fs_20); line-height:1; color: #fff; display:flex; flex-flow: row wrap; position: relative; overflow:hidden;} .overview-info .title{width:100%; margin-bottom:5.5rem; font-weight: 500; font-size:2.5em; text-align: center; letter-spacing: 100%;} .overview-info figure{width:50%; height: 71rem; display: flex; border-radius:0 9rem 0 0; overflow: hidden;} .overview-info figure img{width:100%; max-width:none; height: 100%; object-fit: cover; display:block;} .overview-info .conts{width:50%; padding:0 2rem; display: flex; flex-flow: column nowrap; align-items: center; justify-content: center;} .overview-info .conts dl{line-height:var(--lh_10); display: flex; flex-flow: row wrap; align-items: start;} .overview-info .conts dl>dt{width:12rem; font-weight: 500;} .overview-info .conts dl>dd{flex:1;} .overview-info .conts dl+dl{margin-top:4rem;} .overview-info .new-conts{width:100%; margin-top:-2.5rem; display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between;} .overview-info .new-conts>div{width:calc((100% - 5.9524%) / 2);} .overview-info .new-conts .left{padding-left:10rem;} .overview-info .new-conts dl{padding:3rem 0 2.5rem;} .overview-info .new-conts dl+dl{border-top:1px solid rgba(255,255,255,0.2);} .overview-info .new-conts dl>dt{opacity: 0.5;} .overview-info .new-conts dl>dd{margin-top:2rem; font-weight: 700; font-size:var(--fs_24); line-height:var(--lh_10);} .overview-status{width:100%; height:96rem; background:url('/images/sub/bg_overview.jpg') no-repeat center center/cover; font-size:var(--fs_20); line-height:1; color: #fff; display:none !important;} .overview-status>.inConts{display:flex; flex-flow: row wrap; position: relative;} .overview-status .title{width:50%; font-weight: 500; font-size:2.5em;} .overview-status .conts{width:50%;} .overview-status .conts dl{line-height:var(--lh_10);} .overview-status .conts dl>dt{line-height:1;} .overview-status .conts dl>dd{margin-top:2rem; font-size:1.5em;} .overview-status .conts dl>dd>strong{font-weight: 700; font-size:1.6667em;} .overview-status .conts dl>dd>small{font-weight: 500; font-size:0.6667em;} .overview-status .conts dl+dl{margin-top:14rem;} /* 기업정보 > CEO 인사말 */ .ceo-message{width:100%; height:62rem; margin-top:9.5rem; padding:0 2rem; background:url('/images/sub/img_ceo.jpg?var=2026-08-28') no-repeat center center/cover; font-size:var(--fs_20); line-height:1; color: #fff; display: flex; align-items: center; justify-content: center;} .ceo-message>p{width:93%; font-weight: 100; font-size:7.1429vw; display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; display:none;} .ceo-text{width:100%; background-color: #f3f6fa; font-size:var(--fs_20); line-height:var(--lh_10); color: #666; } .ceo-text>.inConts{display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between;} .ceo-text>.inConts>.title{width:50%; font-weight: 500; font-size:var(--fs_40); line-height:var(--lh_10); color: #000;} .ceo-text>.inConts>div{width:47%;} .ceo-text>.inConts>div p+p{margin-top:1rem;} .ceo-text>.inConts>div p.sign{margin-top:6rem; font-weight: 500; color: #000; text-align: right; display: flex; flex-flow: column nowrap; align-items: end;} .ceo-text>.inConts>div p.sign img{width:16rem; margin-top:1rem; mix-blend-mode: multiply;} /* 기업정보 > 연혁 */ .history-visual{width:100%; height:96rem; margin-top:9.5rem; padding:0 2rem; background:url('/images/sub/bg_history.jpg') no-repeat center center/cover; font-size:var(--fs_20); line-height:1; color: #fff; text-align: center; display: flex; flex-flow: column nowrap; align-items: center; justify-content: center;} .history-visual h3{padding-bottom:3rem; font-weight: 700; font-size:3.25em; line-height:1; position: relative;} .history-visual h3:before{content: ""; width: 5rem; height: 2px; margin-left:-2.5rem; background-color: #fff; position:absolute; left: 50%; bottom:0;} .history-visual dl{margin-top:5rem;} .history-visual dl>dt{font-weight: 100; font-size:var(--fs_50); line-height:var(--lh_10);} .history-visual dl>dt>strong{font-weight: 500;} .history-visual dl>dd{margin-top:2.5rem; font-size:var(--fs_22); line-height:var(--lh_10);} .history-conts{} .history-conts hgroup{font-size:var(--fs_20); line-height:var(--lh_10); color: #666; text-align: center;} .history-conts hgroup h4{font-weight: 500; font-size:var(--fs_40); line-height:1; color: var(--c_point);} .history-conts hgroup p{margin-top:2rem;} .history-wrap{margin-top:10rem; position:relative; overflow: hidden;} .history-wrap:before{content: ""; width: 0.3rem; margin-left:-0.15rem; background-color: #e1e1e1; display: inline-block; position:absolute; left: 50%; top:0; bottom:0;} .history-wrap #history-progress{content: ""; width: 0.3rem; margin-left:-0.15rem; background-color:var(--c_point); display: inline-block; position:absolute; left: 50%; top:0; z-index:2;} .history-list{font-size:0; line-height:0; position: relative;} .history-list>li{display: flex; justify-content: space-between; gap:7rem 16rem; position: relative; z-index:2;} .history-list>li>*{width:calc((100% - 16rem) / 2);} .history-list>li+li{margin-top:15rem;} .history-list .history-in{font-size:var(--fs_20); line-height:var(--lh_10); color: #000; display: flex; flex-flow: column nowrap; gap:4rem 0;} .history-list .history-in>p{font-weight: 700; font-size:var(--fs_60); line-height:0.73;} .history-list .text-wrap{display: flex; flex-flow: column nowrap; gap:3rem 0;} .history-list .text-wrap>dl{display: flex; flex-flow: row wrap; align-items: start;} .history-list .text-wrap>dl>dt{width:5rem; font-weight: 500;} .history-list .text-wrap>dl>dd{flex:1;} .history-list figure{aspect-ratio:76/45;} .history-list figure img{width:100%; max-width:none; height:100%; object-fit:cover; display:block;} .history-list>li:nth-child(even){} .history-list>li:nth-child(even) .history-in{text-align: right; order:1;} .history-list>li:nth-child(even) figure{order:2;} .history-list>li:nth-child(even) .text-wrap>dl>dt{order:2;} .history-list>li:nth-child(even) .text-wrap>dl>dd{order:1;} /* 기업정보 > CI */ .ci-top{width:100%; height:54rem; margin-top:2rem; padding:2rem; background:url('/images/sub/bg_ci01.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center; border-radius:1rem;} .ci-top img{height:11rem;} .ci-list{--r:#a30b1a; --b:#1d2e5b; --g:#256a2b; margin-top:15rem;} .ci-list>li{font-size:var(--fs_20); line-height:var(--lh_10); color: #666; display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between;} .ci-list>li h4{width:33.3333%; padding-left:8.3333%; font-weight: 500; font-size:var(--fs_40); line-height:1; color: #000;} .ci-list>li .conts{flex:1;} .ci-list>li.color{margin-top:9rem;} .ci-list>li.color .conts{display: flex; flex-flow: row wrap; gap:0 4.4643%;} .ci-list>li.color .conts>li{width:calc((100% - 8.9286%) / 3); font-size:var(--fs_20); line-height:var(--lh_10); color: #666;} .ci-list>li.color .conts>li>dl{border-radius:1rem; overflow: hidden;} .ci-list>li.color .conts>li>dl>dt{height:18rem; padding:0 4rem; background:url('/images/sub/bg_ci02_01.png') no-repeat center center/cover; font-weight: 500; font-size:1.1em; line-height:var(--lh_10); color: #fff; display: flex; align-items: center; border-radius:2rem 2rem 0 0;} .ci-list>li.color .conts>li>dl>dd{height:18rem; padding:4rem; border:1px solid #ddd; border-top:none; font-size:0.9em; line-height:var(--lh_10); color: #666; border-radius: 0 0 2rem 2rem;} .ci-list>li.color .conts>li>dl>dd>p{font-weight: 600; font-size:1.2222em; line-height:var(--lh_10); color: #000; display: flex; align-items: center; gap:1rem;} .ci-list>li.color .conts>li>dl>dd>p:after{content: ""; width: 1.6rem; height: 1.6rem; background-color: var(--r); display: inline-block; border-radius:99px;} .ci-list>li.color .conts>li.b>dl>dt{background-image:url('/images/sub/bg_ci02_02.png');} .ci-list>li.color .conts>li.b>dl>dd>p:after{background-color: var(--b);} .ci-list>li.color .conts>li.g>dl>dt{background-image:url('/images/sub/bg_ci02_03.png');} .ci-list>li.color .conts>li.g>dl>dd>p:after{background-color: var(--g);} .ci-list>li.slogan{margin-top:12rem;} .ci-list>li.slogan .conts{white-space: nowrap; display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between;} .ci-list>li.slogan .conts>span{font-weight: 700; font-size:4.6vw; letter-spacing: 0.3vw !important; white-space: nowrap;} .ci-list>li.slogan .conts .g{color: var(--g);} .ci-list>li.slogan .conts .b{color: var(--b);} .ci-list>li.slogan .conts .r{color: var(--r);} /* 기업정보 > 사업장 */ .locations-map{width:100%; margin-top:15.5rem; padding:0 2rem; background-color: #eeeff4; display: flex; align-items: start; justify-content: center;} .location-map-inner{position: relative;} .locations-map .location-item{width:0; height:0; position:absolute; z-index:3;} .locations-map .location-item.point01{left:24.89%; top:9.21%;} .locations-map .location-item.point02{left:69.12%; top:58.37%;} .locations-map .location-item.point03{left:64.84%; top:60.04%;} .locations-map .location-item.point04{left:74.68%; top:60.88%;} .locations-map .location-item.point05{left:73.40%; top:63.39%;} .locations-map .location-point{width:1.7rem; height:1.7rem; border-radius:50%; background:var(--c_point); font-size:var(--fs_20); line-height:var(--lh_10); color: #fff; position:absolute; left:0; top:0; z-index:5; transform:translate(-50%,-50%);} /* .locations-map .location-point::before, .location-point::after{content:""; width:100%; height:100%; border:1px solid rgba(29,46,91,.75); border-radius:50%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(1); opacity:0; pointer-events:none; animation:location-wave 4s ease-out infinite;} */ .locations-map .location-point::after{animation-delay:1.2s;} .locations-map .location-line{display:block; background:var(--c_point); position:absolute; z-index:2; pointer-events:none;} .locations-map .location-line.line-left{width:15rem; height:1px; right:0; top:0;} .locations-map .location-line.line-right{width:16rem; height:1px; left:0; top:0;} .locations-map .location-line.line-top{width:1px; height:16rem; left:0; bottom:0;} .locations-map .location-line.line-bottom{width:1px; height:11rem; left:0; top:0;} .locations-map .location-popup{width:40rem; min-height:27rem; padding:3rem 3.5rem; background:var(--c_point); font-size:var(--fs_20); line-height:var(--lh_10); color: #fff; position:absolute; z-index:7;} .locations-map .location-popup.popup-lab{right:15rem; top:-12.7rem;} .locations-map .location-popup.popup-chilseo{left:-23.8rem; bottom:15rem;} .locations-map .location-popup.popup-gunbuk{right:28rem; top:-15.5rem;} .locations-map .location-item.point03 .location-line.line-left{width:30rem;} .locations-map .location-popup.popup-office{left:15rem; top:-20rem;} .locations-map .location-popup.popup-changwon{left:-23.8rem; top:10rem;} .locations-map .location-popup h4{margin-bottom:3rem; font-weight:700; font-size:var(--fs_30); line-height:1;} .locations-map .location-popup dl{margin-top:2rem;} .locations-map .location-popup dl>dt{font-weight: 500; font-size:var(--fs_17); line-height:var(--lh_10); opacity: 0.5;} .locations-map .location-popup dl>dd{margin-top:0.5rem; word-break:keep-all;} .locations-map .location-popup .location-link{margin-top:3rem; font-weight:600; display:inline-flex; align-items:center; gap:.8rem;} .locations-map .location-popup .location-close{width:2rem; height:2rem; background:url('/images/btn_close.png') no-repeat center center/cover; position:absolute; right:3.5rem; top:3.5rem; cursor:pointer;} .locations-map .location-popup{opacity:0; visibility:hidden; transform:translateY(1.5rem); pointer-events:none; transition:opacity .35s ease,visibility .35s ease,transform .35s ease;} .locations-map .location-item.is-open .location-popup{opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto;} .locations-map .location-item.is-open .location-point::before, .location-item.is-open .location-point::after{animation-play-state:paused; opacity:0;} .locations-map .location-item.is-open .location-line{opacity:1; visibility:visible;} .locations-map .location-item:not(.is-open) .location-line{opacity:0; visibility:hidden;} .locations-map .location-point{padding:0; border:0; cursor:pointer;} @keyframes location-wave{ 0%{transform:translate(-50%,-50%) scale(1); opacity:.8;} 100%{transform:translate(-50%,-50%) scale(5); opacity:0;} } .location-point::after{content:attr(data-title); font-weight: 500; font-size:var(--fs_18); line-height:1; color: var(--c_point); position: absolute; white-space: nowrap; transition:opacity .35s ease; opacity: 1 !important;} .locations-map .location-item.point01 .location-point::after{left:calc(100% + 0.4rem); top:-100%;} .locations-map .location-item.point02 .location-point::after{right:calc(100% + 0.4rem); top:-100%; text-align: right;} .locations-map .location-item.point03 .location-point::after{right:calc(100% + 0.4rem); top:100%;} .locations-map .location-item.point04 .location-point::after{left:calc(100% + 0.4rem); top:-100%;} .locations-map .location-item.point05 .location-point::after{left:calc(100% + 0.4rem); top:100%;} .locations-info{border-top:1px solid #000; font-size:var(--fs_20); line-height:var(--lh_10); color: #000;} .locations-info>li{border-bottom:1px solid #e6e6e6; padding:4.5rem 0; display: flex; flex-flow: row wrap; justify-content: space-between; gap:3.5rem;} .locations-info>li h4{width:25.1667%; font-weight:700; font-size:var(--fs_30); line-height:1;} .locations-info>li .info{flex:1;} .locations-info>li .info>dl{display: flex; gap:0 2.5rem;} .locations-info>li .info>dl>dt{} .locations-info>li .info>dl>dd{color: #666;} .locations-info>li .link{font-weight: 600; display:inline-flex; align-items:start; gap:.8rem;} .locations-info>li .link img{-webkit-filter: grayscale(100%) brightness(0); filter: grayscale(100%) brightness(0);} /* 사업소개 > 사업영역 */ .business-index{width:100%; height:96rem; padding:0 2rem; background:url('/images/sub/bg_business-main01.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .business-index.bg02{background-image:url('/images/sub/bg_business-main02.jpg');} .business-index.bg03{background-image:url('/images/sub/bg_business-main03.jpg?var=2026-08-28');} .business-index.bg04{background-image:url('/images/sub/bg_business-main04.jpg');} .business-index.bg05{background-image:url('/images/sub/bg_business-main05.jpg?var=2026-08-28');} .business-index.bg06{background-image:url('/images/sub/bg_business-main06.jpg');} .business-index>dl{font-size:var(--fs_20); line-height:var(--lh_10); color: #fff; text-align: center;} .business-index>dl>dt{font-weight: 800; font-size:var(--fs_65); line-height:1;} .business-index>dl>dd{margin-top:2.5rem; font-size:var(--fs_25); line-height:var(--lh_10);} /* 사업소개 > 공장 및 설비현황 > 창원1공장 */ .facilities-visual{width:100%; height:86rem; margin-top:10.5rem; padding-top:25rem; background:url('/images/sub/bg_facilities-changwon01.jpg') no-repeat center center/cover; font-size:var(--fs_20); line-height:var(--lh_10); color: #fff;} .facilities-visual.changwon_02{background-image:url('/images/sub/bg_facilities-changwon02.jpg');} .facilities-visual.chilseo{background-image:url('/images/sub/bg_facilities-chilseo.jpg');} .facilities-visual.gunbuk{background-image:url('/images/sub/bg_facilities-gunbuk.jpg');} .facilities-visual.performance{height:62rem; background-image:url('/images/sub/bg_performance.jpg');} .facilities-visual .inConts h3{font-weight: 800; font-size:var(--fs_60); line-height:1;} .facilities-visual .inConts p{margin-top:4.5rem; font-weight: 700; font-size:var(--fs_35); line-height:1;} .facilities-visual .inConts div{margin-top:2.5rem; padding-bottom:4.5rem; font-weight: 500; font-size:var(--fs_22); line-height:var(--lh_10); position: relative;} .facilities-visual .inConts div:before{content: ""; width: 4.5rem; height: 2px; background-color: #fff; display: inline-block; position:absolute; left: 0; bottom:0px;} .facilities-visual.performance .inConts p{margin-top:2.5rem; font-weight: 600; font-size:var(--fs_30); line-height:var(--lh_10);} .facilities-info{margin-top:-10rem; padding:0 0 12rem; position: relative;} .facilities-info ul:not(.facilities-product){width:100%; padding:5.5rem 0 4rem; background-color: #fff; border:1px solid #e6e6e6; border-bottom:0; display: flex; flex-flow: row wrap; justify-content: space-between; box-shadow:0 -0.7rem 0.7rem rgba(0,0,0,0.1); border-radius:2rem 2rem 0 0;} .facilities-info ul:not(.facilities-product)>li{width:calc(100% / 3); font-size:var(--fs_20); line-height:1; color: #000; display: flex; flex-flow: row nowrap; align-items: start; justify-content: center; gap:2.8rem;} .facilities-info ul:not(.facilities-product)>li img[src*="icon_facilities01_01"]{width:5.6rem;} .facilities-info ul:not(.facilities-product)>li img[src*="icon_facilities01_02"]{width:5.2rem;} .facilities-info ul:not(.facilities-product)>li img[src*="icon_facilities01_03"]{width:4.6rem;} .facilities-info ul:not(.facilities-product)>li img[src*="icon_facilities01_04"]{width:4.7rem;} .facilities-info ul:not(.facilities-product)>li dl{font-size:var(--fs_22);} .facilities-info ul:not(.facilities-product)>li dl>dt{font-weight: 600;} .facilities-info ul:not(.facilities-product)>li dl>dd{margin-top:1.7rem; line-height:var(--lh_10);} .facilities-info ul:not(.facilities-product)>li dl>dd>strong{font-weight: 700; font-size:1.3636em; color: var(--c_point); display:block;} .facilities-info ul:not(.facilities-product)>li dl>dd>small{font-size:0.8182em; display:block;} .facilities-product{width:100%; margin-top:5rem; display: flex; flex-flow: column nowrap; gap:12rem 0;} .facilities-product>li{width:100%; display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; gap:6rem 4.7619%;} .facilities-product figure{height:56rem; flex:1; border-radius:1rem; overflow: hidden;} .facilities-product figure img{width:100%; max-width:none; height: 100%; object-fit: cover; display:block;} .facilities-product .conts{width:60rem; padding-bottom:5rem; font-size:var(--fs_20); line-height:1; color: #000;} .facilities-product .conts .cate{color: #0099ff; text-transform : uppercase;} .facilities-product .conts h4{margin-top:2.5rem; padding-bottom:2rem; font-weight: 700; font-size:var(--fs_40); position: relative;} .facilities-product .conts h4:before{content: ""; width: 3.6rem; height: 2px; background-color: #0099ff; display: inline-block; position:absolute; left: 0; bottom:0px;} .facilities-product .conts .text{margin-top:2.5rem; font-size:var(--fs_22); line-height:var(--lh_10);} .facilities-product .conts .info{margin-top:4rem; display: flex; flex-flow: row wrap; align-items: start;} .facilities-product .conts .info>dl{width:calc(100% / 3); display: flex; flex-flow: row wrap; align-items: center; gap:1rem;} .facilities-product .conts .info img{width:6rem;} .facilities-product .conts .info>dl>dd{flex:1; font-weight: 500; line-height:1.35;} .facilities-product>li:nth-child(even) figure{order:2;} .facilities-product>li:nth-child(even) .conts{order:1;} .facilities-product.talent .conts{padding-bottom:0;} .facilities-product.talent .conts .cate{color: #1d2e5b; text-transform : none;} .facilities-product.talent .conts h4{margin-top:1.5rem; padding-bottom:0;} .facilities-product.talent .conts h4:before{display:none;} .facilities-product.talent .conts .text{margin-top:2rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #666;} .facilities-product.talent>li:nth-child(even) .conts{text-align: right;} .facilities-state{background:url('/images/sub/bg_facilities-state.jpg') no-repeat center center/cover; overflow: hidden;} .facilities-area hGroup{font-size:var(--fs_20); line-height:1; color: #000;} .facilities-area hGroup i{margin-bottom:2.5rem; font-style: normal; color: var(--c_point); text-transform : uppercase; display:block;} .facilities-area hGroup h4{font-weight: 700; font-size:var(--fs_40);} .facilities-area hGroup p{margin-top:1rem; font-size:var(--fs_22); line-height:var(--lh_10);} .facilities-state .swiper-container{width:100%; margin-top:5.5rem; padding-bottom:7rem; position: relative;} .facilities-state .swiper-wrapper{width: 100%; height: 100%; display: flex; box-sizing: content-box;} .facilities-state .swiper-slide{flex-shrink: 0; width:53rem; margin-right:4.5rem; background-color: #fff; position: relative; overflow:hidden; display:flex; flex-flow: column wrap; border-radius:1rem; box-shadow:0 0.7rem 0.7rem rgba(0,0,0,0.1);} .facilities-state .swiper-slide:last-child {margin-right:0;} .facilities-state .swiper-slide .thumb{aspect-ratio:530/340; overflow: hidden;} .facilities-state .swiper-slide .thumb>img{width:100%; height:100%; object-fit: cover; display:block;} .facilities-state .swiper-slide .conts{flex:1; min-height:20rem; padding:3.5rem 2.9rem; background-color: #fff; border:1px solid #ddd; border-top:none; font-size:var(--fs_20); line-height:var(--lh_10); color: #666;} .facilities-state .swiper-slide .title{font-weight: 700; font-size:var(--fs_30); color: #000;} .facilities-state .swiper-slide .title:has(>:is(.icon)){display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between; gap:2rem;} .facilities-state .swiper-slide .title .icon{width:6rem; height:3.4rem; border:1px solid #0099ff; font-weight: 700; font-size:0.5667em; line-height:1; color: #0099ff; display: flex; align-items: center; justify-content: center; border-radius:0.5rem;} .facilities-state .swiper-slide .option{margin-top:2.6rem; padding-top:2.6rem; border-top:1px solid #e6e6e6;} .facilities-state .swiper-slide .option>dl{width:100%; font-weight: 500; font-size:var(--fs_18); line-height:var(--lh_10); display: flex; flex-flow: row wrap; align-items: start;} .facilities-state .swiper-slide .option>dl+dl{margin-top:0.7rem;} .facilities-state .swiper-slide .option>dl>dt{width:15rem; display: flex; flex-flow: row wrap; align-items: center; gap:1rem;} .facilities-state .swiper-slide .option>dl>dt i{display: flex;} .facilities-state .swiper-slide .option>dl img[src*="icon_facilities-gunbuk02_01"]{width:2.2rem;} .facilities-state .swiper-slide .option>dl img[src*="icon_facilities-gunbuk02_02"]{width:2rem;} .facilities-state .swiper-slide .option>dl>dd{flex:1;} .facilities-state .swiper-slide .text{margin-top:1rem;} .facilities-state .swiper-button-area{width:12rem; display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; position: relative;} .facilities-state .swiper-button-area:before{content: ""; width: 1px; height: 100%; margin-left:-0.5px; background-color: #e6e6e6; display: inline-block; position:absolute; left: 50%; top:0px;} .facilities-state .swiper-button-area .swiper-button{width:2rem; height:3.6rem; background: url('/images/btn_swiper_prev.png') no-repeat center center / cover; cursor: pointer;} .facilities-state .swiper-button-area .swiper-button-next{background-image: url('/images/btn_swiper_next.png');} .facilities-state .swiper-button-area .swiper-button:not(.swiper-button-disabled):hover{-webkit-filter: grayscale(100%) brightness(0); filter: grayscale(100%) brightness(0);} .facilities-state .swiper-button.swiper-button-disabled{opacity: 0.3; cursor: default;} .facilities-flow{width:100%; height:100%; background:transparent; position:relative; overflow:hidden; z-index:2;} .facilities-flow .swiper-container{margin-top:5.5rem; position: relative;} .facilities-flow .swiper-wrapper{display: flex; flex-flow: row nowrap; opacity:1; visibility:visible;} .facilities-flow .swiper-wrapper .swiper-slide{min-width:100%; width:100%; background:transparent; font-size:0; line-height:0; position: relative; overflow:hidden; display:inline-block; vertical-align: top; -webkit-backface-visibility:hidden; backface-visibility:hidden; transform:translateZ(0); border-radius:2rem;} .facilities-flow .swiper-wrapper .swiper-slide.swiper-slide-active{z-index:3;} .facilities-flow .swiper-wrapper .swiper-slide>img{width:100%; max-width:none; height:54rem; object-fit: cover; object-position: center center; transform:scale(1); transform-origin:center center; will-change:transform; -webkit-backface-visibility:hidden; backface-visibility:hidden;}/* transform:scale(1.1); */ .facilities-flow .vTxtArea{width:100%; height:100%; padding:0 10rem; position: absolute; left:0; top:0; z-index:3; display: flex; align-items: center; justify-content: center;} .facilities-flow .vTxt{width:100%; font-size:var(--fs_20); line-height:1; color:#fff;} .facilities-flow .vTxt .ii{display:block; opacity:0; transform:translateY(4rem); filter:blur(6px); transition:opacity .8s ease, transform .9s cubic-bezier(.22,1,.36,1), filter .8s ease; transition-delay:0s; will-change:transform,opacity,filter;} .facilities-flow.is-ready .swiper-slide-active .vTxt .ii{opacity:1; transform:translateY(0); filter:blur(0);} .facilities-flow.is-ready .swiper-slide-active .vTxt .i01{transition-delay:.15s;} .facilities-flow.is-ready .swiper-slide-active .vTxt .i02{transition-delay:.3s;} .facilities-flow.is-ready .swiper-slide-active .vTxt .i03{transition-delay:.45s;} .facilities-flow .swiper-slide:not(.swiper-slide-active) .vTxt .ii{opacity:0; transform:translateY(-2rem); filter:blur(4px); transition-delay:0s; transition-duration:.2s;} .facilities-flow .vTxt .ii.num{font-weight: 800; font-size:4em; color: rgba(255,255,255,0.1);} .facilities-flow .vTxt .ii.title{margin-top:3rem; padding-bottom:2rem; font-weight: 700; font-size:var(--fs_40); position: relative;} .facilities-flow .vTxt .ii.title:before{content: ""; width: 3.6rem; height: 2px; background-color: #0099ff; display: inline-block; position:absolute; left: 0; bottom:0px;} .facilities-flow .vTxt .ii.text{margin-top:1.5rem; font-size:var(--fs_22); line-height:var(--lh_10);} .facilities-flow-top{display: flex; flex-flow: row wrap; align-items: end; justify-content: space-between;} .facilities-flow-top .right{display: flex; flex-flow: row wrap; align-items: center; gap:0 2rem;} .swiper-flow-pg{display: flex; flex-flow: row wrap;} .swiper-flow-pg button{min-width:13rem; height:9.6rem; padding:0 3rem; font-size:var(--fs_20); line-height:1; color:#666; text-align: center; display: flex; flex-flow: column nowrap; justify-content: space-between;} .swiper-flow-pg button .num{font-weight: 700; font-size:var(--fs_35); transition:color .3s ease-out;} .swiper-flow-pg button .title{transition:color .3s ease-out, font-weight .3s ease-out;} .swiper-flow-pg button .line{width:0; height:0.4rem; background-color: var(--c_point); position: relative; left:50%; transform: translateX(-50%); transition:width .3s ease-out;} html[lang="en"] .swiper-flow-pg button{max-width: 25rem;} html[lang="en"] .swiper-flow-pg button .title{width:calc(100% + 6rem); margin-left:-3rem; text-align: center;} .swiper-flow-pg button+button{border-left:1px solid #e6e6e6;} .swiper-flow-pg button:is(:hover, .swiper-pagination-bullet-active) .num{color: var(--c_point);} .swiper-flow-pg button:is(:hover, .swiper-pagination-bullet-active) .title{font-weight: 500; color: #000;} .swiper-flow-pg button:is(:hover, .swiper-pagination-bullet-active) .line{width:90%;} .swiper-button{cursor: pointer;} .swiper-flow-btn{display: flex; align-items: start; gap:1rem;} .swiper-flow-btn .swiper-button{width:6rem; height:6rem; border:1px solid #dfdfdf; border-radius:99rem; display: flex; align-items: center; justify-content: center;} .swiper-flow-btn .swiper-button img{width:1.1rem; filter: brightness(0) saturate(100%) invert(18%) sepia(9%) saturate(4959%) hue-rotate(188deg) brightness(97%) contrast(91%);} .swiper-flow-btn .swiper-button.swiper-button-next{} .facilities-client{background-color: #f3f6fa; overflow: hidden;} .facilities-client>.inConts{display: flex; align-items: start; overflow: visible; gap:0 0;} .facilities-client hGroup{width:38rem; min-width:38rem; margin-bottom:0;} .facilities-client .right{width: calc(100% - 38rem)} .facilities-client .swiper-container{width: calc(100% + var(--outset_172)); margin-top:3rem; padding-bottom:7rem; position: relative; overflow: hidden;} .facilities-client .swiper-wrapper{width: 100%; height: 100%; display: flex; box-sizing: content-box;} .facilities-client .swiper-slide{flex-shrink: 0; width:30rem; margin-right:2.5rem; padding:3rem 2rem 4rem; background-color: #fff; font-size:var(--fs_20); line-height:1; color: #000; text-align: center; position: relative; overflow:hidden; display:inline-block; vertical-align: top; border-radius:1rem;} .facilities-client .swiper-slide:last-child {margin-right:0;} .facilities-client .swiper-slide figure{width:100%; height:10rem; display: flex; align-items: center; justify-content: center;} .facilities-client .swiper-slide figure>img{max-width:90%; max-height:90%; object-fit: contain; display:block;} .facilities-client .swiper-slide .title{padding-bottom:2rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10); position: relative;} .facilities-client .swiper-slide .title:before{content: ""; width: 4rem; height: 0.3rem; margin-left:-2rem; background-color: var(--c_point); display: inline-block; position:absolute; left: 50%; bottom:0px;} .facilities-client .swiper-button-area{width:7.4rem; margin-left:auto; display: flex; align-items: start; justify-content: space-between; gap:3rem; position: relative;} .facilities-client .swiper-button-area:before{content: ""; width: 1px; height: 100%; margin-left:-0.5px; background-color: #c8ceda; display: inline-block; position:absolute; left: 50%; top:0px;} .facilities-client .swiper-button-area .swiper-button img{width:1.1rem; filter: brightness(0) saturate(100%) invert(18%) sepia(9%) saturate(4959%) hue-rotate(188deg) brightness(97%) contrast(91%);} .facilities-client .swiper-button-area .swiper-button:not(.swiper-button-disabled):hover{-webkit-filter: grayscale(100%) brightness(0); filter: grayscale(100%) brightness(0);} .facilities-client .swiper-button.swiper-button-disabled{opacity: 0.3; cursor: default;} /* 사업소개 > 프로젝트 */ .projects-area{} .projects-area>li{width:100%; height:56rem; padding:0 5.9524%; background:url('/images/sub/bg_projects01.jpg') no-repeat center center/cover; display: flex; align-items: center; border-radius:2rem; overflow: hidden; position: relative;} .projects-area>li+li{margin-top:6rem;} .projects-area>li.bg02{background-image:url('/images/sub/bg_projects02.jpg');} .projects-area>li.bg03{background-image:url('/images/sub/bg_projects03.jpg');} .projects-area>li.bg04{background-image:url('/images/sub/bg_projects04.jpg');} .projects-area>li.bg05{background-image:url('/images/sub/bg_projects05.jpg');} .projects-area>li.bg06{background-image:url('/images/sub/bg_projects06.jpg');} .projects-area>li.bg07{background-image:url('/images/sub/bg_projects07.jpg');} .projects-area>li:before{content: ""; width: 70%; min-width:117rem; height: 100%; position:absolute; left: 0; top:0px; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100;Neutral+Density */ background: linear-gradient(to right, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ } .projects-area .projects-conts{width:57.5rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #fff; position: relative; z-index:2;} .projects-area .projects-conts h4{font-weight: 700; font-size:var(--fs_40); line-height:var(--lh_10);} .projects-area .projects-conts .option{margin-top:3rem; padding-top:3rem; border-top:1px solid rgba(255,255,255,0.3); display: flex; flex-flow: row wrap; gap:6.1rem 4.1rem; overflow: hidden;} .projects-area .projects-conts .option img[src*="icon_projects01"]{width:2.2rem;} .projects-area .projects-conts .option img[src*="icon_projects02"]{width:2rem;} .projects-area .projects-conts .option img[src*="icon_projects03"]{width:2rem;} .projects-area .projects-conts .option img[src*="icon_projects04"]{width:2.1rem;} .projects-area .projects-conts .option>dl{position: relative;} .projects-area .projects-conts .option>dl+dl:before{content: ""; width: 1px; height: 90%; background-color: rgba(255,255,255,0.3); position:absolute; left: -2.1rem; top:0px;} .projects-area .projects-conts .option>dl>dt{font-weight: 500; line-height:1; display: flex; align-items: center; gap:0 0.8rem;} .projects-area .projects-conts .option>dl>dd{margin-top:1rem; font-size:var(--fs_22); line-height:1.35;} html[lang="en"] .projects-area .projects-conts{width:50%;} html[lang="en"] .projects-area .projects-conts h4{white-space: nowrap; } html[lang="en"] .projects-area .projects-conts h4 br{display:none !important;} html[lang="en"] .projects-area .projects-conts .option{gap:4.1rem 0; margin-top:0; border-top:none;} html[lang="en"] .projects-area .projects-conts .option>dl{width:100%} html[lang="en"] .projects-area .projects-conts .option>dl+dl:before{width: 100%; height: 1px; left: 0; top:-2.1rem;} html[lang="en"] .projects-area .projects-conts .option>dl br{display:none;} /* R&D > 기술연구소 */ .rnd-area{} .rnd-area hGroup{margin-bottom:4.5rem; font-size:var(--fs_20); line-height:1; color: #000;} .rnd-area *+hGroup{margin-top:12rem;} .rnd-area hGroup i{margin-bottom:2.5rem; font-style: normal; color: #0099ff; text-transform : uppercase; display:block;} .rnd-area hGroup h4{padding-bottom:2rem; font-weight: 700; font-size:var(--fs_40); position: relative;} .rnd-area hGroup h4:before{content: ""; width: 4rem; height: 2px; background-color: #0099ff; display: inline-block; position:absolute; left: 0; bottom:0px;} .rnd-area hGroup p{margin-top:2rem; font-size:var(--fs_22); line-height:var(--lh_10);} .research_institute-img{display: flex; align-items: start; justify-content: center;} .research_institute-list{display: flex; flex-flow: row wrap; gap:4rem 2.381%;} .research_institute-list>li{width:calc((100% - 2.381%) / 2); padding:5.4rem 2.9762%; border:1px solid #ddd; display: flex; flex-flow: row wrap; gap:4.5rem; border-radius:1rem; box-shadow:0 1.4rem 1.4rem rgba(0,0,0,0.1);} .research_institute-list>li figure{width:16rem;} .research_institute-list>li .conts{flex:1; font-size:var(--fs_20); line-height:1; color: #666;} .research_institute-list>li .conts .num{font-weight: 700; font-size:var(--fs_30); color: #004ab7; text-decoration: underline; text-underline-position:under;} .research_institute-list>li .conts .title{margin-top:2.5rem; font-weight: 700; font-size:var(--fs_30); line-height:var(--lh_10); color: #000;} .research_institute-list>li .conts .text{margin-top:1rem; font-size:var(--fs_22); line-height:var(--lh_10);} /* R&D > 품질보증 시스템 */ .certification-visual{width:100%; height:96rem; margin-top:10.5rem; padding:0 2rem; background:url('/images/sub/bg_certification.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .certification-visual .visual-in{font-size:var(--fs_20); line-height:var(--lh_10); color: #fff; text-align: center; } .certification-visual .visual-in h3{padding-top:4rem; font-weight: 700; font-size:var(--fs_40); line-height:1.35; position: relative;} .certification-visual .visual-in h3:before{content: ""; width: 100%; height: 4rem; background:url('/images/icon_star5.png') no-repeat center top/12rem auto; display: block; position:absolute; left: 0; top:0px;} .certification-visual .visual-in p{margin-top:4.5rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10); display: flex; flex-flow: row wrap; justify-content: center; gap:0 4.9rem;} .certification-visual .visual-in p>span{position: relative;} .certification-visual .visual-in p>span+span:before{content: ""; width: 1px; height: 2.1rem; background-color: #fff; display: block; position:absolute; left: -2.5rem; top:50%; transform: translateY(-50%); opacity: 0.3;} .certification-visual .visual-in ul{margin-top:4.5rem; font-weight: 600; display: flex; justify-content: center; gap:5rem 6rem; position: relative;} .certification-visual .visual-in ul>li{width:calc((100% - 12rem) / 3);} .certification-visual .visual-in ul>li dl{margin-top:2.5rem;} .certification-info{width:100%; display: flex; justify-content: center; gap:0 2rem; position: relative;} .line-center-wrap{position:relative; overflow: hidden;} .line-center-wrap:before{content: ""; width: 0.3rem; margin-left:-0.15rem; background-color: #e1e1e1; display: inline-block; position:absolute; left: 50%; top:0; bottom:0;} .line-center-wrap #line-center-progress{content: ""; width: 0.3rem; margin-left:-0.15rem; background-color:var(--c_point); display: inline-block; position:absolute; left: 50%; top:0; z-index:2;} .activities-list{width:100%; display: flex; flex-flow: column nowrap; gap:12rem 0;} .activities-list>li{width:100%; display: flex; align-items: center; justify-content: space-between; gap:7rem 16rem; position: relative; z-index:2;} .activities-list>li>*{width:calc((100% - 16rem) / 2);} .activities-list figure{height:45rem; flex:1; border-radius:1rem; overflow: hidden;} .activities-list figure img{width:100%; max-width:none; height: 100%; object-fit: cover; display:block;} .activities-list .conts{font-size:var(--fs_20); line-height:1; color: #000;} .activities-list .conts .cate{color: #0099ff; text-transform : uppercase;} .activities-list .conts h4{margin-top:2.5rem; font-weight: 700; font-size:var(--fs_40); position: relative;} .activities-list .conts .tit{margin-top:1.5rem; font-weight: 600; font-size:var(--fs_25); line-height:var(--lh_10);} .activities-list .conts .text{margin-top:2rem; font-size:var(--fs_22); line-height:var(--lh_10);} .activities-list .conts .info{margin-top:4rem; display: flex; flex-flow: row wrap; align-items: start;} .activities-list .conts .info>dl{width:calc(100% / 3); display: flex; flex-flow: row wrap; align-items: center; gap:1rem;} .activities-list .conts .info img{width:6rem;} .activities-list .conts .info>dl>dd{flex:1; font-weight: 500; line-height:1.35;} .activities-list>li:nth-child(even) figure{order:2;} .activities-list>li:nth-child(even) .conts{order:1; text-align: right;} .workflow-visual{width:100%; height:66rem; margin-top:10.5rem; background:url('/images/sub/bg_workflow.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .workflow-visual .inConts{font-size:var(--fs_20); line-height:var(--lh_10); color: #000;} .workflow-visual .inConts i{padding:1.1rem 2.1rem; background-color: var(--c_point); font-style: normal; line-height:1; color: #fff; display: inline-flex; align-items: center; justify-content: center; border-radius:99rem;} .workflow-visual .inConts h3{margin-top:3rem; font-weight: 800; font-size:var(--fs_60); line-height:1;} .workflow-visual .inConts p{margin-top:3rem; font-weight: 600; font-size:var(--fs_30); line-height:1; color: var(--c_point);} .workflow-conts{font-size:var(--fs_20); line-height:1; color: #000;} .workflow-conts h4{font-weight: 700; font-size:var(--fs_40); text-align: center;} .workflow-process{width:100%; margin-top:7.5rem; display: flex; flex-flow: row wrap; gap:0 7.1429%;} .workflow-process>li{width:calc((100% - 14.2858%) / 3); padding-top:6rem; display: flex; position: relative;} .workflow-process>li+li:before{content: ""; width: 25%; height: 100%; background:url('/images/sub/arr_workflow.png') no-repeat center center/58.3333% auto; display: inline-block; position:absolute; left: -25%; top:0px;} .workflow-process .conts{flex:1; min-height:44rem; padding:11rem 2rem 11rem; background-color: #fff; border:1px solid #ddd; font-size:var(--fs_20); line-height:1; color: #666; text-align: center; border-radius:1rem; box-shadow:1.4rem 1.4rem 1.4rem rgba(0,0,0,0.1); position: relative;} .workflow-process .conts img{width:12rem; display:block;} .workflow-process .conts img[src*="icon_workflow02_01"]{width:6.2rem;} .workflow-process .conts img[src*="icon_workflow02_02"]{width:6.1rem;} .workflow-process .conts img[src*="icon_workflow02_03"]{width:6.1rem;} .workflow-process .conts img[src*="icon_workflow02_04"]{width:5.2rem;} .workflow-process .conts img[src*="icon_workflow02_05"]{width:8rem;} .workflow-process .conts img[src*="icon_workflow02_06"]{width:6rem;} .workflow-process .conts .icon-t{width:100%; display: flex; justify-content: center; position: absolute; left:0; top:-6rem;} .workflow-process .conts .icon-b{display: inline-flex; position: absolute; right:3.5rem; bottom:4rem;} .workflow-process .conts .num{font-weight: 700; font-size:var(--fs_30); color: var(--c_point);} .workflow-process .conts .title{margin-top:2.5rem; padding-bottom:2.5rem; font-weight: 700; font-size:var(--fs_30); line-height:var(--lh_10); color: #000; position: relative;} .workflow-process .conts .title:before{content: ""; width: 4rem; height: 2px; margin-left:-2rem; background-color: var(--c_point); display: inline-block; position:absolute; left: 50%; bottom:0px;} .workflow-process .conts .text{margin-top:2.5rem; font-weight: 500; font-size:var(--fs_22); line-height:var(--lh_10);} .workflow-process .conts .text:has(>:is(.box)){display: flex; flex-flow: row wrap; justify-content: center; gap:0.8rem;} .workflow-process .conts .text .box{padding:1rem; background-color: #f4f6f8; border:1px solid #d8e0ee; line-height:1; display: inline-flex; align-items: center; justify-content: center; border-radius:0.5rem;} .workflow-process>li.arr{width:100%; padding:0 calc(((100% - 19.6429%) / 3) / 2); display: flex;} .workflow-process>li.arr:before, .workflow-process>li.arr.p+li:before, .workflow-process>li.arr.t{display: none;} /* 지속가능경영 > 비전/전략 */ .vision_strategy-visual{width:100%; height:62rem; margin-top:10.5rem; background:url('/images/sub/bg_vision_strategy.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .vision_strategy-visual .inConts{font-size:var(--fs_20); line-height:1; color: #fff;} .vision_strategy-visual .inConts h3{font-weight: 800; font-size:var(--fs_60);} .vision_strategy-visual .inConts p{margin-top:2.5rem; font-weight: 600; font-size:var(--fs_30); line-height:var(--lh_10);} .vision_strategy-conts{width:100%; padding-top:12rem; background:#fff url('/images/sub/bg_vision_strategy02.jpg') no-repeat center top/cover;} .vision_strategy-conts hGroup{font-size:var(--fs_20); line-height:1.35; color: #666; text-align: center;} .vision_strategy-conts hGroup i{font-style: normal; display: flex; justify-content: center;} .vision_strategy-conts hGroup img{width:8.8rem;} .vision_strategy-conts hGroup h4{margin-top:2rem; font-weight: 700; font-size:var(--fs_60); line-height:1; color: #000;} .vision_strategy-conts hGroup p{margin-top:2rem; font-weight: 700; font-size:var(--fs_50); color: var(--c_point);} .vision_strategy-conts hGroup p>strong{padding:0 2rem 2rem; border-bottom:0.2rem solid #d1d4dd; font-weight: 700; display:inline-block; position: relative;} .vision_strategy-conts hGroup p>strong:before{content: ""; width: 5rem; height: 0.4rem; margin-left:-2.5rem; background-color: var(--c_point); display: inline-block; position:absolute; left: 50%; bottom:-0.3rem;} .vision_strategy-conts hGroup div{margin-top:2.5rem; font-weight: 500; font-size:var(--fs_22);} .vision_strategy-list{margin-top:6rem; display: flex; flex-flow: row wrap; gap:4rem;} .vision_strategy-list>li{width:calc((100% - 4rem) / 2); padding:2.9rem 2rem 3.5rem; background-color: #fff; border:1px solid #e6e6e6; display: flex; justify-content: center; border-radius:2rem; border-radius:1rem; box-shadow:0.7rem 0.7rem 0.7rem rgba(0,0,0,0.1);} .vision_strategy-list>li .conts{width:100%; max-width:62rem; font-size:var(--fs_20); line-height:var(--lh_10);} .vision_strategy-list>li .conts h5{width:100%; display: flex; flex-flow: row wrap; align-items: center; gap:0 3rem;} .vision_strategy-list>li .conts h5 img{width:10rem;} .vision_strategy-list>li .conts h5>strong{flex:1; font-weight: 700; font-size:var(--fs_40); line-height:var(--lh_10); color: var(--c_point);} .vision_strategy-list>li .conts ol{width:100%; margin-top:2rem; padding-top:2.5rem; border-top:0.3rem solid var(--c_point); counter-reset:item var(--start, 0); position: relative;} .vision_strategy-list>li .conts ol:before{content: ""; width: 0; border-left:1px dotted #1d2e5b; display: inline-block; position:absolute; left: 2.4rem; top:3rem; bottom:3rem;} .vision_strategy-list>li .conts ol>li{padding-left:8.5rem; position: relative;} .vision_strategy-list>li .conts ol>li+li{margin-top:2.5rem;} .vision_strategy-list>li .conts ol>li:before{counter-increment: item; content:counter(item, decimal-leading-zero); width:5rem; height:5rem; background-color: var(--c_point); font-weight: 700; font-size:var(--fs_22); line-height:1; color: #fff; border-radius:999rem; display: flex; align-items: center; justify-content: center; position: absolute; left:0; top:0; z-index:2;} .vision_strategy-list>li .conts ol>li dl{padding-top:0.8rem; display: flex; flex-flow: row wrap; gap:2rem;} .vision_strategy-list>li .conts ol>li dl>dt{font-weight: 700; font-size:var(--fs_25); line-height:var(--lh_10); color: var(--c_point);} .vision_strategy-list>li .conts ol>li dl>dd{flex:1; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10); color: #000;} .vision_strategy-list>li .conts ol>li p{margin-top:1rem; color: #666;} html[lang="en"] .vision_strategy-list>li .conts ol>li p{display:none;} .vision_strategy-list>li .conts ol>li:last-child:after{content: ""; width:5rem; background-color: #fff; position:absolute; left: 0; top:0; bottom:0;} /* 지속가능경영 > 환경경영 */ .environmental-visual{width:100%; height:66rem; margin-top:10.5rem; background:url('/images/sub/bg_environmental.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .environmental-visual .inConts{font-size:var(--fs_20); line-height:1; color: #fff;} .environmental-visual .inConts h3{font-weight: 800; font-size:var(--fs_60);} .environmental-visual .inConts p{margin-top:2.5rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10);} .environmental-conts{padding:12rem 0; background-color: #f3f6fa; background-image:url('/images/sub/bg_environmental02_02.jpg'), url('/images/sub/bg_environmental02.jpg'); background-repeat: no-repeat; background-position: center bottom 0%, center top;} .environmental-conts hGroup{font-size:var(--fs_20); line-height:1; color: #000;} .environmental-conts hGroup h4{font-weight: 700; font-size:var(--fs_40);} .environmental-list{width:100%; margin-top:4.5rem; display: flex; flex-flow: column nowrap; gap:12rem 0;} .environmental-list>li{width:100%; display: flex; align-items: center; justify-content: space-between; gap:5rem 9.5238%; position: relative; z-index:2;} .environmental-list>li>*{width:calc((100% - 9.5238%) / 2);} .environmental-list figure{height:45rem; flex:1; border-radius:1rem; overflow: hidden;} .environmental-list figure img{width:100%; max-width:none; height: 100%; object-fit: cover; display:block;} .environmental-list .conts{font-size:var(--fs_20); line-height:1; color: #000;} .environmental-list .conts .cate{color: #0099ff; text-transform : uppercase;} .environmental-list .conts h5{margin-top:2.5rem; font-weight: 100; font-size:var(--fs_40); position: relative;} .environmental-list .conts h5>strong{font-weight: 500;} .environmental-list .conts .text{margin-top:2rem; line-height:var(--lh_10); color: #666;} .environmental-list>li:before, .environmental-list>li:after{content: ""; background-repeat: no-repeat; background-position: left top; display: inline-block; position:absolute; box-sizing: border-box;} .environmental-list>li:nth-child(2):before{width: 10.2rem; height: 13.2rem; background-image:url('/images/sub/bg_environmental001.png'); left: 0; top:2rem;} .environmental-list>li:nth-child(2):after{width: 9.6rem; height: 12.1rem; background-image:url('/images/sub/bg_environmental002.png'); left: 0; bottom:-8rem;} .environmental-list>li:nth-child(3):before{width: 10rem; height: 10rem; background-image:url('/images/sub/bg_environmental003.png'); right: 0; top:-3.5rem;} .environmental-list>li:nth-child(4):before{width: 10rem; height: 10.4rem; background-image:url('/images/sub/bg_environmental004.png'); left: 0; top:0rem;} .environmental-list>li:nth-child(5):before{width: 10rem; height: 11.2rem; background-image:url('/images/sub/bg_environmental005.png'); right: 0; top:-1.5rem;} .environmental-list>li:nth-child(6):before{width: 10rem; height: 10.1rem; background-image:url('/images/sub/bg_environmental006.png'); left: 0; top:0rem;} .environmental-list>li:nth-child(even) figure{order:2;} .environmental-list>li:nth-child(even) .conts{order:1; text-align: right;} .environmental-btm{padding:12rem 0 18rem; background-color: #fff; background-image:url('/images/sub/bg_environmental03_03.jpg'), url('/images/sub/bg_environmental03.jpg'); background-repeat: no-repeat; background-position: center bottom, center top;} .environmental-btm hGroup{font-size:var(--fs_20); line-height:1; color: var(--c_point);} .environmental-btm hGroup i{font-style: normal; font-weight: 700; font-size:var(--fs_25);} .environmental-btm hGroup h4{margin-top:2.5rem; font-weight: 700; font-size:var(--fs_60); line-height:var(--lh_10);} .environmental-btm hGroup h4>span{color: #40785d;} .environmental-btm hGroup p{margin-top:1rem; font-weight: 600; line-height:var(--lh_10); color: #666;} .environmental-station{margin-top:5rem; padding:0 2rem; background:url('/images/sub/bg_environmental03_02.png') no-repeat center 2.5rem; display: flex; flex-flow: row wrap; align-items: start; justify-content: center; gap:15%;} .environmental-station>li{font-size:var(--fs_20); line-height:var(--lh_10); color: #666; text-align: center;} .environmental-station>li>p{color: #4a7b65; text-transform : uppercase;} .environmental-station>li>i{margin-top:2rem; display: flex; justify-content: center;} .environmental-station>li>i img{height:10.8rem;} .environmental-station>li>dl{margin-top:2.3rem;} .environmental-station>li>dl>dt{font-weight: 700; font-size:var(--fs_22); line-height:var(--lh_10); color: #4a7b65;} .environmental-station>li>dl>dd{margin-top:1rem;} html[lang="en"] .environmental-station{gap:15% 7%;} /* 지속가능경영 > 인권·준법 경영 */ .human-visual{width:100%; height:66rem; margin-top:10.5rem; background:url('/images/sub/bg_human.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .human-visual .inConts{font-size:var(--fs_20); line-height:1; color: #fff;} .human-visual .inConts h3{font-weight: 800; font-size:var(--fs_60); line-height:var(--lh_10);} .human-visual .inConts p{margin-top:1.5rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10);} .human-conts{} .human-conts hGroup{font-size:var(--fs_20); line-height:1; color: var(--c_point);} .human-conts hGroup i{padding-bottom:2.2rem; font-style: normal; position: relative; display:block;} .human-conts hGroup i:before{content: ""; width: 4rem; height: 0.3rem; background-color: var(--c_point); display: inline-block; position:absolute; left: 0; bottom:0px;} .human-conts hGroup h4{margin-top:2.5rem; font-weight: 700; font-size:var(--fs_40); color: #000;} .human-announcement{counter-reset:item var(--start, 0); margin-top:5rem; display: flex; flex-flow: row wrap; gap:8rem 4.7619%;} .human-announcement>li{width:calc((100% - 4.7619%) / 2); border:1px solid #e6e6e6; display: flex; flex-flow: column nowrap; border-radius:1rem; overflow: hidden;} .human-announcement>li figure{display: flex;} .human-announcement>li dl{padding:6.5rem 8.625% 7.5rem 18.625%; font-size:var(--fs_20); line-height:1; color: #666; position: relative;} .human-announcement>li dl:before{counter-increment: item; content:counter(item, decimal-leading-zero); padding-bottom:0.4rem; border-bottom:0.3rem solid var(--c_point); font-weight: 700; font-size:var(--fs_30); color: var(--c_point); display: inline-flex; position: absolute; left:8.625%; top:6.5rem;} .human-announcement>li dl>dt{font-weight: 700; font-size:var(--fs_30); color: #000; } .human-announcement>li dl>dd{margin-top:1.5rem; line-height:var(--lh_10);} .human-text{margin-top:8rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #666; text-align: center; display: flex; justify-content: center; position: relative;} .human-text:before{content: ""; width: 100%; height: 1px; margin-top:-0.5px; background-color: #8e96ad; display: block; position:absolute; left: 0; top:50%;} .human-text>span{padding:0 2.6rem; background-color: #fff; position: relative;} .human-text>span:before, .human-text>span:after{content: ""; width: 0.5rem; height: 0.5rem; margin-top:-0.25rem; background-color: #8e96ad; display: inline-block; position:absolute; left: 0; top:50%; border-radius:99rem;} .human-text>span:after{left:auto; right:0;} .human-conts2{background-color: #f3f6fa;} .human-conts2 hGroup{font-size:var(--fs_20); line-height:1; color: var(--c_point);} .human-conts2 hGroup h4{padding-bottom:2.3rem; font-weight: 700; font-size:var(--fs_40); color: #000; position: relative;} .human-conts2 hGroup h4:before{content: ""; width: 4rem; height: 0.3rem; background-color: var(--c_point); display: inline-block; position:absolute; left: 0; bottom:0px;} .human-guideline{counter-reset:item var(--start, 0); margin-top:5rem; padding:0 5.8929%; background-color: #fff; border-radius:1rem; overflow: hidden;} .human-guideline>li{width:100%; padding:3rem 0; font-size:var(--fs_20); line-height:1; color: #666; display: flex; flex-flow: row wrap; align-items: center;} .human-guideline>li+li{border-top:1px solid #e6e6e6;} .human-guideline>li:before{counter-increment: item; content:counter(item, decimal-leading-zero); width:10rem; font-weight: 700; font-size:var(--fs_30); color: var(--c_point); display: inline-flex;} .human-guideline>li figure{width:7.2rem; display: flex; justify-content: center;} .human-guideline>li p{flex:1; padding:0 3rem 0 10%; font-weight: 700; font-size:var(--fs_30); line-height:1.35; color: var(--c_point);} .human-guideline>li ul{width:40%; padding-left:5.9rem; border-left:1px solid #e6e6e6;} .human-guideline>li ul>li{padding-left:1.2rem; line-height:var(--lh_10); position: relative;} .human-guideline>li ul>li:before{content:"·"; position: absolute; left:0; top:0;} .human-conts3{} .human-conts3 .inConts{display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between;} .human-conts3 hGroup{font-size:var(--fs_20); line-height:1; color: var(--c_point);} .human-conts3 hGroup h4{font-weight: 700; font-size:var(--fs_40); color: #000;} .human-conts3 hGroup p{margin-top:2rem; line-height:var(--lh_10); color: #666;} .chart-img{width:66.6667%; padding:5rem 3rem; border:1px solid #e6e6e6; border-radius:1rem; display: flex; justify-content: center;} html[lang="en"] .human-conts3 hGroup{width:30%;} /* 지속가능경영 > 윤리경영 */ .ethical-visual{width:100%; height:66rem; margin-top:10.5rem; background:url('/images/sub/bg_ethical.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .ethical-visual .inConts{font-size:var(--fs_20); line-height:1; color: #fff;} .ethical-visual .inConts h3{font-weight: 800; font-size:var(--fs_60); line-height:var(--lh_10);} .ethical-visual .inConts p{margin-top:1.5rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10);} .ethical-faq{border:1px solid #e6e6e6; border-radius:1rem; overflow: hidden;} .ethical-faq>li{padding:4.9rem 0 5.9rem; cursor: pointer; position: relative;} .ethical-faq>li+li{border-top:1px solid #e6e6e6;} .ethical-faq>li:before{content: ""; width: 0.4rem; height: 0; background-color: var(--c_point); display: inline-block; position:absolute; left: 0; top:50%; transform: translateY(-50%); transition: height .3s ease-out;} .ethical-faq>li:after{content: ""; width: 2.4rem; height: 1rem; background:url('/images/arr_faq.png') no-repeat center center/cover; display: inline-block; position:absolute; right: 3rem; top:6rem; transition: all .3s ease-out;} .ethical-faq dl{width:100%; font-size:var(--fs_20); line-height:var(--lh_10); color: #666; display: flex; flex-flow: row wrap; align-items: center;} .ethical-faq dl>dt{width:30rem; font-weight: 700; font-size:var(--fs_25); color: #000; text-align: center;} .ethical-faq dl>dd{flex:1; padding-left:7.9rem; position: relative;} .ethical-faq dl>dd:before{content: ""; width: 1px; height:100%; min-height:4rem; background-color: #e6e6e6; display: inline-block; position:absolute; left: 0; top:50%; transform: translateY(-50%);} .ethical-faq dl>dd .tit{transition: font-weight .3s ease-out, color .3s ease-out;} .ethical-faq dl>dd .a{margin-top:2rem; display:none;} .ethical-faq>li.is-active:before{height:100%;} .ethical-faq>li.is-active:after{transform:rotate(180deg);} .ethical-faq>li.is-active dl>dd .tit{font-weight: 600; color: var(--c_point);} .ethical-btm{background-color: #f3f6fa;} .ethical-btm hGroup{font-size:var(--fs_20); line-height:1; color: #666; text-align: center;} .ethical-btm hGroup h4{font-weight: 700; font-size:var(--fs_40); color: #000;} .ethical-btm hGroup p{margin-top:2rem; line-height:var(--lh_10);} /* 지속가능경영 > 안전보건경영 */ .safety-visual{width:100%; height:66rem; margin-top:10.5rem; background:url('/images/sub/bg_safety.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .safety-visual .inConts{font-size:var(--fs_20); line-height:1; color: #fff;} .safety-visual .inConts h3{font-weight: 800; font-size:var(--fs_60); line-height:var(--lh_10);} .safety-visual .inConts p{margin-top:1.5rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10);} .safety-conts{background:#f5f7fc url('/images/sub/bg_safety02.jpg') no-repeat right bottom 10rem;} .safety-conts hGroup{font-size:var(--fs_20); line-height:1; color: #000;} .safety-conts hGroup i{font-style: normal; font-weight: 500; color: var(--c_point); position: relative; display:block; text-transform : uppercase;} .safety-conts hGroup h4{margin-top:1.5rem; font-weight: 700; font-size:var(--fs_50); line-height:var(--lh_10);} .safety-conts hGroup p{margin-top:2rem; font-size:var(--fs_18); line-height:var(--lh_10);} .safety-top{width:100%; display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between;} .safety-top hGroup{width:48rem;} .safety-top .safety-right{flex:1;} .safety-top .safety-faq{counter-reset:item var(--start, 0); width:100%;} .safety-top .safety-faq>li{padding:3.5rem 5rem; background-color: #fff; border-radius:1rem; overflow: hidden; position: relative;} .safety-top .safety-faq>li+li{margin-top:1rem;} .safety-top .safety-faq>li .q{width:100%; padding-left:0.5rem; font-size:var(--fs_20); line-height:1; color: #000; display: flex; flex-flow: row wrap; align-items: start;} .safety-top .safety-faq>li .q>span{width:5rem; background-color: var(--c_point); aspect-ratio:1/1; border-radius:999rem; display: flex; align-items: center; justify-content: center;} .safety-top .safety-faq>li .q>span:before{counter-increment: item; content:counter(item, decimal-leading-zero); font-weight: 600; color: #fff;} .safety-top .safety-faq>li .q>strong{flex:1; margin-left:3.3rem; padding:0.5rem 3.2rem; border-left:1px solid #ddd; font-weight: 700; font-size:var(--fs_30); line-height:var(--lh_10); color: var(--c_point); text-align: left;} .safety-top .safety-faq>li .q>i{width:2.5rem; height:2.5rem; position: relative; top: 1.25rem;} .safety-top .safety-faq>li .q>i:before{content: ""; width: 0.5rem; height: 100%; background-color: var(--c_point); display: inline-block; position:absolute; left: 50%; top:50%; transform: translate(-50%, -50%); transition: all .3s ease-out;} .safety-top .safety-faq>li .q>i:after{content: ""; width:100%; height: 0.5rem; background-color: var(--c_point); display: inline-block; position:absolute; left: 50%; top:50%; transform: translate(-50%, -50%); transition: all .3s ease-out;} .safety-top .safety-faq>li .a{width:100%; margin-top:2.5rem; padding:2.7rem 3.9rem; background-color: #f0f5fb; font-size:var(--fs_20); line-height:var(--lh_10); color: #000; border-radius:1rem; overflow: hidden; display:none;} .safety-top .safety-faq>li.is-active .q>i:before{transform:translate(-50%, -50%) rotate(90deg);} .safety-end{margin-top:6rem; padding:3.2rem 2rem; background-color: #fff; font-size:var(--fs_20); line-height:1; color: #000; border-radius:1rem; overflow: hidden; display: flex; flex-flow: row wrap; align-items: start;} .safety-end>dt{width:22.619%; font-weight: 700; font-size:var(--fs_30); line-height:var(--lh_10); color: #2c569e; text-align: center;} .safety-end>dd{flex:1; padding:0.5rem 0 0.5rem 7%; border-left:1px solid #ddd; font-size:var(--fs_25); line-height:var(--lh_10); color: #000;} .safety-end>dd>strong{font-weight: 700; color: #2c569e;} /* 지속가능경영 > 사회공헌 */ .social-visual{width:100%; height:66rem; margin-top:10.5rem; background:url('/images/sub/bg_social.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .social-visual .inConts{font-size:var(--fs_20); line-height:1; color: #fff;} .social-visual .inConts h3{font-weight: 800; font-size:var(--fs_60); line-height:var(--lh_10);} .social-visual .inConts p{margin-top:2rem; font-weight: 700; font-size:var(--fs_35); line-height:var(--lh_10);} .social-visual .inConts div{margin-top:1.5rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10);} .social-conts{} :where(.social-conts, .social-btm) hGroup{font-size:var(--fs_20); line-height:1; color: #000;} :where(.social-conts, .social-btm) hGroup i{font-style: normal; font-weight: 500; color: var(--c_point); position: relative; display:block; text-transform : uppercase;} :where(.social-conts, .social-btm) hGroup h4{padding-bottom:1.7rem; font-weight: 700; font-size:var(--fs_40); line-height:1; position: relative;} :where(.social-conts, .social-btm) hGroup h4:before{content: ""; width: 5rem; height: 0.4rem; background-color: var(--c_point); display: inline-block; position:absolute; left: 0; bottom:0px;} :where(.social-conts, .social-btm) hGroup h5{margin:0 0 4rem; font-weight: 700; font-size:var(--fs_40); line-height:var(--lh_10);} :where(.social-conts, .social-btm) hGroup *+h5{margin-top:5rem;} .social-core{width:100%; margin-top:6.5rem; display: flex; flex-flow: row wrap; justify-content: space-between; gap:0 4.7619%;} .social-core>li{width:calc((100% - 9.5238%) / 3); padding:5.5rem 3.5rem; border:1px solid #ddd; display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between; gap:0 3rem; border-radius:1rem;} .social-core>li i{display: flex; justify-content: center;} .social-core>li img{width:8rem;} .social-core>li img[src*="icon_social01_02"]{width:8.2rem;} .social-core>li img[src*="icon_social01_03"]{width:8.1rem;} .social-core>li dl{flex:1; font-size:var(--fs_20); line-height:var(--lh_10); color: #666;} .social-core>li dl>dt{font-weight: 700; font-size:var(--fs_30); line-height:var(--lh_10); color: #327acd;} .social-core>li dl>dd{margin-top:1rem;} .donation-area{margin-top:12rem; display: flex; flex-flow: row wrap; align-items: start; justify-content: space-between;} .chart-img{width:66.6667%; padding:5rem 3rem; border:1px solid #e6e6e6; border-radius:1rem; display: flex; justify-content: center;} .social-btm{background-color: #f4f6f8;} .social-list{width:100%; display: flex; flex-flow: row wrap; align-items: start; gap:4rem 4.7619%;} .social-list>li{width:calc((100% - 4.7619%) / 2); font-size:var(--fs_20); line-height:1; color: #000;} .social-list>li figure{aspect-ratio:800/460; display: flex; border-radius:1rem; overflow: hidden;} .social-list>li figure img{width:100%; max-width:none; height: 100%; object-fit: cover; display:block;} .social-list>li p{padding:3rem 0; font-weight: 500; font-size:var(--fs_30); line-height:var(--lh_10); } /* 지속가능경영 > 사이버 신문고 */ .whistleblowing-visual{width:100%; height:62rem; margin-top:10.5rem; background:url('/images/sub/bg_whistleblowing.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .whistleblowing-visual .inConts{font-size:var(--fs_20); line-height:1; color: #fff;} .whistleblowing-visual .inConts h3{font-weight: 800; font-size:var(--fs_60);} .whistleblowing-visual .inConts p{margin-top:2rem; font-weight: 700; font-size:var(--fs_35);} .whistleblowing-visual .inConts div{margin-top:1rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10);} .tab-button{text-align: center; display: flex;} .tab-button button{width:24rem; height:7rem; background-color: #f4f6f8; border:1px solid #ddd; font-size:var(--fs_20); line-height:var(--lh_10); color: #666; transition:background-color .3s ease-out, border-color .3s ease-out, color .3s ease-out;} .tab-button button:is(:hover, .active){background-color: var(--c_point); border-color: var(--c_point); font-weight: 700; color: #fff;} .tab-button button+button{border-left-color: #f4f6f8;} .whistleblowing-conts{} .whistleblowing-conts .inConts{max-width:132rem;} .whistleblowing-conts .tab-button{position: absolute; left:2rem; top:-18.5rem;} .whistleblowing-form{width:100%; flex-flow: column nowrap; gap:10rem 0; display:none;} .whistleblowing-form.is-active{display: flex;} .whistleblowing-form *::-ms-input-placeholder{color:#666;} .whistleblowing-form *::-webkit-input-placeholder{color:#666;} .whistleblowing-form *::-moz-placeholder{color:#666;} .whistleblowing-form input[type=text], .whistleblowing-form input[type=password], .whistleblowing-form select, .whistleblowing-form textarea{width:100%; height:5.2rem; padding:0; background-color:#fff; border:none; font-size:inherit; line-height:1; color:#666; display:flex; align-items: center;} .whistleblowing-form select{padding-right:3rem; background:url("/images/bg_select.png") no-repeat right center; background-size:1.4rem; -webkit-appearance: none; -moz-appearance: none; appearance: none;} .whistleblowing-form select::-ms-expand{display:none;} .whistleblowing-form textarea, .whistleblowing-form .text-area{width:100%; height:20rem; padding:1.6rem; border:1px solid #000; line-height:1.45;} .whistleblowing-form .text-area{font-size:inherit; line-height:1.45; color:#666; overflow: hidden; overflow-y: scroll;} .whistleblowing-form .check-new{font-size:inherit;} .whistleblowing-form .check-new input[type=checkbox]+label, .whistleblowing-form .check-new input[type=radio]+label{font-size:inherit; line-height:2rem; color: #666; display: inline-flex; align-items: center; cursor: pointer; position: relative; gap:0.7rem;} .whistleblowing-form .check-new input[type=checkbox]+label>.graphic, .whistleblowing-form .check-new input[type=checkbox]+label>.graphic:before, .whistleblowing-form .check-new input[type=radio]+label>.graphic, .whistleblowing-form .check-new input[type=radio]+label>.graphic:before{content: ""; width: 2rem; height: 2rem; background-color: #fff; border:1px solid #747474; font-size:0; line-height:0; display: inline-block; vertical-align: top; position: relative; transition:all .1s ease-out;} .whistleblowing-form .check-new input[type=checkbox]+label>.graphic, .whistleblowing-form .check-new input[type=radio]+label>.graphic{border-radius:99px;} .whistleblowing-form .check-new input[type=checkbox]+label>.graphic:before, .whistleblowing-form .check-new input[type=radio]+label>.graphic:before{display:none !important;} .whistleblowing-form .check-new input[type=checkbox]:checked+label>.graphic, .whistleblowing-form .check-new input[type=radio]:checked+label>.graphic{border:0.6rem solid #0099ff;} .whistleblowing-form .check-new.blue input[type=checkbox]:checked+label>.graphic, .whistleblowing-form .check-new.blue input[type=radio]:checked+label>.graphic{border-color:#015db9;} .whistleblowing-form>li{font-size:var(--fs_20); line-height:1; color: #000; display: flex; flex-flow: row wrap; align-items: start;} .whistleblowing-form>li h4{width:36rem; margin-top:-0.6rem; font-weight: 700; font-size:var(--fs_35); line-height:var(--lh_10);} .whistleblowing-form>li .whistleblowing-form_conts{flex:1; display: flex; flex-flow: row wrap; gap:0 4.8913%;} .whistleblowing-form>li .whistleblowing-form_conts dl{width:calc((100% - 4.8913%) / 2); display: flex; flex-flow: column nowrap;} .whistleblowing-form>li .whistleblowing-form_conts *[one]{width:100%;} .whistleblowing-form>li .whistleblowing-form_conts .flex-break{width:100%; flex-basis:100%; height:0;} .whistleblowing-form>li .whistleblowing-form_conts dl>dt{font-weight: 600; font-size:var(--fs_18); line-height:1; color: #444;} .whistleblowing-form>li .whistleblowing-form_conts dl>dt[required]:after{content: "*"; padding-left:0.5rem; font-weight: 400; color: #0099ff;} .whistleblowing-form>li .whistleblowing-form_conts dl>dd{flex:1; min-height:5.2rem; font-size:var(--fs_17); line-height:var(--lh_10); border-bottom:1px solid #000; display: flex; flex-flow: row wrap; align-items: center;} .whistleblowing-form>li .whistleblowing-form_conts dl>dd:has(>:is(textarea, .text-area)){padding-top:1.2rem; border-bottom:0;} .whistleblowing-form>li .whistleblowing-form_conts dl:nth-of-type(n+3), .whistleblowing-form>li .whistleblowing-form_conts *+dl[one], .whistleblowing-form>li .whistleblowing-form_conts .flex-break+dl{margin-top:5.5rem;} .whistleblowing-form>li .whistleblowing-form_conts .check-flex{display: flex; flex-flow: row wrap; align-items: start; gap:0.5rem 2rem;} .whistleblowing-form>li .whistleblowing-form_conts .type-btn{width:100%; position: relative;} .whistleblowing-form>li .whistleblowing-form_conts .type-btn input[type="text"]{padding-right:12rem;} .whistleblowing-form>li .whistleblowing-form_conts .type-btn>label, .whistleblowing-form>li .whistleblowing-form_conts .type-btn>button{width:10rem; height:4rem; background-color: #666; font-size:inherit; line-height:1; color: #fff; display: flex; align-items: center; justify-content: center; position: absolute; right:0; top:0.6rem; z-index:2; cursor: pointer;} .whistleblowing-form>li .whistleblowing-form_conts .file input[type="file"], .whistleblowing-form>li .whistleblowing-form_conts .file *::-webkit-file-upload-button{width:100%; height:100%; position: absolute; left:0; top:0; opacity: 0; cursor: pointer !important;} .whistleblowing-form>li .whistleblowing-form_conts .file-guide{width:100%; min-height:5.2rem; padding:0 12rem 0 0; display:flex; align-items:center; justify-content:space-between; gap:2rem;} .whistleblowing-form>li .whistleblowing-form_conts .file-guide span{font-size:inherit; color:#666;} .whistleblowing-form>li .whistleblowing-form_conts .file-size{font-weight:400; color:#666; white-space:nowrap;} .whistleblowing-form>li .whistleblowing-form_conts .file-size em{font-style:normal; color:#000;} .whistleblowing-form>li .whistleblowing-form_conts .file-list{margin-top:0.6rem; border-top:1px solid #ddd; } .whistleblowing-form>li .whistleblowing-form_conts .file-list:empty{display:none;} .whistleblowing-form>li .whistleblowing-form_conts .file-list li{min-height:4.8rem; padding:1rem 0; display:flex; align-items:center; gap:1rem; position: relative;} .whistleblowing-form>li .whistleblowing-form_conts .file-list li+li{border-top:1px solid #ddd;} .whistleblowing-form>li .whistleblowing-form_conts .file-list .name{min-width:0; flex:1; color:#333; overflow-wrap:anywhere;} .whistleblowing-form>li .whistleblowing-form_conts .file-list .size{color:#666; white-space:nowrap;} .whistleblowing-form>li .whistleblowing-form_conts .file-list .delete{width:2.8rem; height:2.8rem; padding:0; border:0; background-color:#eee; font-size:1.8rem; line-height:1; color:#666; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:none; cursor:pointer;} .whistleblowing-form>li .whistleblowing-form_conts .title{width:25rem; height:4rem; margin-top:6rem; margin-bottom:-3rem; background-color: #f4f6f8; font-weight: 600; font-size:var(--fs_17); line-height:1; color:#444; text-align: center; border-radius:1rem; display:flex; align-items:center; justify-content:center;} .whistleblowing-form>li .whistleblowing-form_conts .text{margin-top:2.5rem; font-size:var(--fs_17); line-height:var(--lh_10); color:#666;} /* 인재채용 > 인재상 */ .talent-pg-title{font-size:var(--fs_20); line-height:1; color: #000;} .talent-pg-title h4{font-weight: 100; font-size:var(--fs_40); line-height:var(--lh_10);} .talent-pg-title h4>strong{font-weight: 500;} /* 인재채용 > 조직문화 */ .culture-conts{padding:12rem 0; background:#f4f6f8 url('/images/sub/bg_culture.png') no-repeat center 13rem;} .culture-option{width:100%; margin-top:8rem; display: flex; flex-flow: row wrap; gap:1rem;} .culture-option>li{width:calc((100% - 3rem) / 4); padding:3.3rem 2rem; background-color: #fff; border:1px solid #eee; display: flex; align-items: center; justify-content: center; gap:1.5rem; border-radius:1rem; box-shadow:0 0.8rem 0.8rem rgba(0,0,0,0.1); position: relative;} .culture-option>li:before{content: ""; width: 4rem; height: 4rem; margin-top:-2rem; background:url('/images/sub/arr_plus.png') no-repeat center center/cover; display: inline-block; position:absolute; right: -2.5rem; top:50%; z-index:2;} .culture-option>li:last-child:before{display:none;} .culture-option>li i{display: flex;} .culture-option>li img{width:5rem;} .culture-option>li img[src*="icon_culture02"]{width:5.1rem;} .culture-option>li p{font-weight: 600; font-size:var(--fs_20); line-height:1.35; color: #333;} /* 인재채용 > 직무소개 */ .jobs-visual{width:100%; height:66rem; margin-top:10.5rem; background:url('/images/sub/bg_jobs.jpg') no-repeat center center/cover; display: flex; align-items: center; justify-content: center;} .jobs-visual .inConts{font-size:var(--fs_20); line-height:1; color: #000;} .jobs-visual .inConts h3{font-weight: 800; font-size:var(--fs_60); line-height:var(--lh_10);} .jobs-visual .inConts p{margin-top:2rem; font-weight: 600; font-size:var(--fs_22); line-height:var(--lh_10);} .jobs-conts{padding:7rem 0 12rem;} .jobs-info{counter-reset:item var(--start, 0); } .jobs-info>li{padding:5rem 0 0; border-bottom:1px solid #ddd; display: flex; flex-flow: row wrap; position: relative;} .jobs-info>li+li{} .jobs-info>li:before{content: ""; width: 1px; background-color:#ddd; position:absolute; left: 41.5rem; top:5rem; bottom:5rem;} .jobs-info hGroup{width:41.5rem; padding-bottom:9rem; font-size:var(--fs_20); line-height:var(--lh_10); color: #666; display: flex; flex-flow: column nowrap; justify-content: start;} .jobs-info hGroup .num{font-weight: 800; font-size:var(--fs_50); line-height:0.75; color: #002999;} .jobs-info hGroup .num:before{counter-increment: item; content:counter(item, decimal-leading-zero);} .jobs-info hGroup h4{margin-top:2.5rem; font-weight: 700; font-size:var(--fs_50); line-height:0.9; color: #000;} .jobs-info hGroup .tit{margin-top:2rem; font-weight: 500; color: var(--c_point);} .jobs-info hGroup .txt{margin-top:3rem; font-weight: 500; font-size:var(--fs_22); line-height:var(--lh_10);} .jobs-info hGroup .btm{font-weight: 700; font-size:var(--fs_50); line-height:0.8; color: #e6e6e6; letter-spacing: 0.2rem; text-transform : uppercase; position: absolute; left:0; bottom:5rem;} .jobs-info .jobs-detail{flex:1; padding:0 0 0 6.4rem; counter-reset:item var(--start, 0); display: flex; flex-flow: row wrap; align-items: center;} .jobs-info .jobs-detail>li{width: 100%; padding:4.5rem 7rem 4.5rem 0; font-size:var(--fs_20); line-height:var(--lh_10); color: var(--c_point); position: relative;} .jobs-info .jobs-detail>li:after{content: ""; width: 2.9rem; height: 1.6rem; background:url('/images/arr_faq.png') no-repeat center center/contain; display: inline-block; position:absolute; right: 2rem; top:7.5rem; transition: all .3s ease-out; filter: brightness(0) saturate(100%) invert(50%) sepia(16%) saturate(1579%) hue-rotate(183deg) brightness(91%) contrast(80%);} .jobs-info .jobs-detail>li+li{border-top:1px solid #ddd;} .jobs-info .jobs-detail>li .q{width:100%; display: flex; flex-flow: row wrap; gap:0 4rem; cursor: pointer;} .jobs-info .jobs-detail>li .q .num{height:100%; font-weight: 700; font-size:var(--fs_35); line-height:1; display: flex; align-items: start;} .jobs-info .jobs-detail>li .q .num:before{counter-increment: item; content:counter(item, decimal-leading-zero);} .jobs-info .jobs-detail>li .q h5{width:34%; display: flex; flex-flow: column nowrap; justify-content: start; gap:1rem;} .jobs-info .jobs-detail>li .q h5>strong{font-weight: 700; font-size:var(--fs_35); line-height:1;} .jobs-info .jobs-detail>li .q h5>small{font-weight: 500;} .jobs-info .jobs-detail>li .q ul{flex:1; display: flex; flex-flow: row wrap; align-items: center; gap:0 4.2rem; overflow: hidden;} .jobs-info .jobs-detail>li .q ul>li{font-weight: 500; font-size:var(--fs_22); line-height:var(--lh_10); color: #4f5e85; position: relative;} .jobs-info .jobs-detail>li .q ul>li:before{content: "·"; position:absolute; left:-2.3rem; top:0px;} .jobs-info .jobs-detail>li .a{width:calc(100% + 7rem); margin-top:2.5rem; padding:2.7rem 3.9rem; background-color: #f0f5fb; font-size:var(--fs_20); line-height:var(--lh_10); color: #000; border-radius:1rem; overflow: hidden; display:none;} .jobs-info .jobs-detail>li.is-active:after{transform:rotate(180deg);} html[lang="en"] .jobs-info .jobs-detail>li:after{top:5.8rem;} html[lang="en"] .jobs-info .jobs-detail>li .q h5{flex:1; width:auto;} html[lang="en"] .jobs-info .jobs-detail>li .q ul{flex:none; width:100%; margin:2rem 0 0 8.1rem;} .jobs-banner{width:100%; height:22rem; margin-top:10.5rem; padding:3.9rem 5rem; background:url('/images/sub/bg_jobs_banner.jpg') no-repeat center center/cover; display: flex; align-items: end; justify-content: space-between; border-radius:2rem;} .jobs-banner hGroup{width:41.5rem; font-size:var(--fs_20); line-height:1; color: #fff;} .jobs-banner hGroup h4{font-weight: 100; font-size:var(--fs_35); line-height:var(--lh_10);} .jobs-banner hGroup h4>strong{font-weight: 600; color: #0099ff;} .jobs-banner hGroup p{margin-top:1.5rem; font-size:var(--fs_18); line-height:var(--lh_10); color:rgba(255,255,255,0.6);} .jobs-banner>p{width:19rem; height:5rem; background-color: #fff; font-size:var(--fs_20); line-height:1; color: #333; display: flex; align-items: center; justify-content: center; gap:1rem; border-radius:1rem;} .jobs-banner>p:after{content: ""; width: 0.9rem; height: 1.5rem; background:url('/images/arr_btn.jpg') no-repeat center center/contain; display: inline-block;} .jobs-banner>p>span{font-weight: 500; font-size:var(--fs_18);} /* etc */ .etc_clause{width:90%; margin:0 auto; font-size:0; line-height:0; text-align: center; box-sizing:border-box; position: relative; overflow: visible !important;} .etc_clause:before, .etc_clause:after{content:"";position:absolute;top:2%;bottom:0;left:10px;right:10px;-webkit-box-shadow:0 0 20px rgba(0,0,0,0.8); -moz-box-shadow:0 0 20px rgba(0,0,0,0.8); box-shadow:0 0 20px rgba(0,0,0,0.8);-moz-border-radius:100px / 10px; border-radius:0 7rem 0 7rem;} .etc_clause:after{right:10px;left:auto;-webkit-transform:skew(8deg) rotate(3deg);-moz-transform:skew(8deg) rotate(3deg);-ms-transform:skew(8deg) rotate(3deg);-o-transform:skew(8deg) rotate(3deg);transform:skew(8deg) rotate(3deg);} .etc_clause .etc_clause_in{padding:60px 80px 80px; background-color: #fdfdfd; border:1px solid #cecece; border-radius:0 7rem 0 7rem; position: relative; z-index:2;} .etc_clause .logo{margin:0;} .etc_clause .logo img{} .etc_clause .txt{padding:30px 0 55px; font-weight: 300; font-size:2rem; line-height:1; color: #666;} .etc_clause .txt>span{font-weight: 500; color: #000;} .clause-style{} .clause-style .logo img{height:6rem;} .clause-style .scroll{max-height:30rem; font-size:1.8rem; line-height:1.45; color: #666; overflow: hidden; overflow-y: auto;} .clause-style .scroll{text-align: left;} .clause-style .scroll>p{margin:4rem 0 1rem;} .clause-style .scroll>p:first-child{margin-top:0rem;} .clause-style .scroll>p>strong{font-weight: 700; font-size:1.2em; color: #000; display:inline-block;} .clause-style .scroll *+p>strong{} .clause-style .scroll ol{margin-top:1rem;} .clause-style .scroll ol>li{padding-left:2rem; text-indent: -2rem;} .clause-style .scroll ol>li>ol{margin-top:0rem;} .clause-style .scroll ol ul, .clause-style .scroll ol ol{margin:0.3rem 0 1rem;} .clause-style .scroll ul>li{padding-left:1.2rem; text-indent: -1.2rem;} .clause-style .scroll .kr>li{padding-left:2.2rem; text-indent: -2.2rem;} .clause-style .scroll .kr>li>strong{font-weight: 600; color:#333;} .clause-style .scroll .kr.mt>li+li{margin-top:2rem;} .clause-style .scroll .num>li{padding-left:1.8rem; text-indent: -1.8rem;} .etc_select{width:90%; margin:0 auto 2rem; text-align: right;} .etc_select select.base{width:auto;} /*[e] Sub Style */ /*[s] Plugin Style */ .fancybox__slide{padding:40px 6rem !important;} .layer-base.fancybox__content>.carousel__button.is-close{width:4rem; height:4rem; background-color: var(--c_point2); top:0rem !important; right:0rem; border-radius:0 1rem 0 1rem; overflow: hidden;} .layer-base.fancybox__content>.carousel__button.is-close svg{width:50%; height:50%; stroke-width:2; filter:none; color: #fff;} .layer-base.fancybox__content>.carousel__button.is-back{width:3.6rem; height:3.6rem; position: absolute; left:0; top:0; display:none;} .layer-base.fancybox__content>.carousel__button.is-back img{display:block;} .layer-base{padding:0 !important; background-color: transparent !important; font-size:0; line-height:0; display:none;} .layer-base .layer-in{} .layer-base h2{padding-bottom:2rem; border-bottom:2px solid #555; font-weight: bold; font-size:3.5rem; line-height:1.3; color: #000;} .layer-base h2>strong{font-weight: bold;} .layer-base *+h2{margin-top:7.5rem;} .layer-base .etc_clause{width:100%;} .layer-base .etc_clause .etc_clause_in {border-radius: 1rem;} #priPop-lay{max-width:102.4rem;} .lay-doctor{width:100%; max-width:128rem;} .lay-doctor .layer-in{padding:0; background-color: #fff; border-radius:1rem; overflow: hidden;} .lay-doctor .lay-doctor-top{padding:7rem 6rem 0; background-color: #f4f6f8; border-radius:1rem; overflow: hidden; display: flex; flex-flow: row wrap; justify-content: space-between; gap:0 5%;} .lay-doctor .lay-doctor-top>figure{width:42%; max-width:42rem; display: flex; align-items:end; justify-content: center;} .lay-doctor .lay-doctor-top .info-conts{width:53%; padding-bottom:7rem;} .lay-doctor .lay-doctor-top .info-conts .name{display: flex; flex-flow: row wrap; align-items: end; gap:1rem 2rem;} .lay-doctor .lay-doctor-top .info-conts .name>dt{font-weight: 800; font-size:5rem; line-height:6rem; color: #000;} .lay-doctor .lay-doctor-top .info-conts .name>dd{font-weight: 600; font-size:2.2rem; line-height:3.2rem; color: #222;} .lay-doctor .lay-doctor-top .info-conts .department{margin-top:3.5rem; padding-top:5rem; border-top:2px solid #000; display: flex; flex-flow: column nowrap; gap:1.5rem;} .lay-doctor .lay-doctor-top .info-conts .department>dt{font-weight: bold; font-size:2.5rem; line-height:3.5rem; color: var(--c_point2);} .lay-doctor .lay-doctor-top .info-conts .department>dd{display: flex; flex-flow: row wrap; gap:1rem;} .lay-doctor .lay-doctor-top .info-conts .department>dd>p{height:4.2rem; padding:0 2rem; background-color: #e6ecf0; font-weight: 500; font-size:1.8rem; line-height:1; color: var(--c_point2); white-space: nowrap; display: flex; align-items: center; justify-content: center; border-radius:99px;} .reservation-btn{display: flex; flex-flow: row wrap; gap:1rem;} .reservation-btn>a{min-width:18rem; height:5.5rem; padding:0 3rem; background-color: var(--c_point2); font-weight: 500; font-size:1.8rem; line-height:1; color: #fff; white-space: nowrap; display: flex; align-items: center; gap:1rem; border-radius:1rem;} .reservation-btn>a figure img{width:2.2rem;} .reservation-btn>a.naver{background-color: #00c13a;} .reservation-btn.end{justify-content: end;} .lay-doctor .lay-doctor-top .info-conts .reservation-btn{margin-top:6rem;} .lay-doctor .lay-doctor-conts{padding:7.5rem 6rem;} /*[e] Plugin Style */ @media only screen and (max-width : 1720px){ #mainVisual .vTxtArea, #mainVisual .swiper-option{max-width:none; margin-left:0; left:0;} } @media only screen and (max-width : 1680px){ .overview-info .new-conts .left{padding-left:0;} } @media only screen and (max-width : 1500px){ /* 기업정보 > 사업장 */ .locations-map{} .location-line{display:none !important;} .location-popup{margin-left: -20rem;} .location-popup.popup-lab{right: auto; left: 50%;} .location-popup.popup-chilseo{margin-top: -16rem; left:50%; bottom:auto; top:50%;} .location-popup.popup-gunbuk{margin-top: -16rem; top: 50%; right: auto; left: 50%;} .location-popup.popup-office{margin-top: -16rem; left:50%; top:50%;} .location-popup.popup-changwon{margin-top: -16rem; left:50%; top:50%;} } @media only screen and (max-width : 1440px){ } @media only screen and (max-width : 1320px){ .table-w1280{padding-bottom:2rem; overflow-x: scroll;} .table-w1280>table{width:128rem;} } @media only screen and (max-width : 1280px){ .scroll-img.safety{margin-top:0;} /*[s] Main Style */ /*[e] Main Style */ /* 기업정보 > CI */ .ci-list{} .ci-list>li h4{width:22%; padding-left:4%;} .ci-list>li.slogan .conts>span{font-size:5.8vw;} /* 사업소개 > 공장 및 설비현황 > 창원1공장 */ .facilities-area .facilities-flow-top hGroup p br{display:none !important;} .facilities-flow-top{} .facilities-flow-top .right{width:100%; margin-top:5rem; justify-content: space-between;} .facilities-product{} .facilities-product .conts{width:52rem;} /* 지속가능경영 > 사이버 신문고 */ .whistleblowing-conts{} .whistleblowing-form>li{gap:3rem 0;} .whistleblowing-form>li h4{width:100%; margin-top:0;} .whistleblowing-form>li .whistleblowing-form_conts{flex:none; width:100%;} /* 지속가능경영 > 인권·준법 경영 */ .human-conts3{} .human-conts3 .inConts{} .human-conts3 hGroup{width:100% !important;} .chart-img{margin:5rem auto 0;} /* 지속가능경영 > 안전보건경영 */ .safety-conts{} .safety-top hGroup{width:28rem;} /* 지속가능경영 > 사회공헌 */ .donation-area hGroup{width:100%;} .donation-area .chart-img{margin-top:0;} .social-core{gap:4rem;} .social-core>li{width:calc((100% - 4rem) / 2); padding:5rem 3rem;} /* 인재채용 > 직무소개 */ .jobs-info{} .jobs-info .jobs-detail>li .q h5{flex:1; width:auto;} .jobs-info .jobs-detail>li .q ul{flex:none; width:100%; margin:2rem 0 0 8.1rem;} /*[s] Layer Style */ /*[e] Layer Style */ } @media only screen and (max-width : 1180px){ } @media only screen and (max-width : 1024px){ /*[s] All Style */ .wideKakao{height: 0; padding-bottom: 56.25%;} .wideKakao>.root_daum_roughmap{width: 100%; height: 100%; position: absolute; left: 0; top: 0;} ul._line.two>li{flex:1 1 100%;} .sticky-table:not(.no){padding-bottom:1rem; overflow-x:auto; -webkit-overflow-scrolling:touch;} .sticky-table:not(.no)>table{min-width:102.4rem !important;} .safety-conts .swipe-hint-box{margin-top:5rem; display:flex;} .scroll-img.safety{width:100%; padding-bottom:1rem; overflow-x:auto; -webkit-overflow-scrolling:touch;} .scroll-img.safety>img{width:calc(1019px - 4rem) !important; max-width:none;} /*[e] All Style */ /*[s] Main Popup Style */ .hd_pops{position: absolute; left:2rem !important; top:2rem !important;} .hd_pops_con{width:auto !important;} /*[e] Main Popup Style */ /*[s] Main Style */ /* business */ #main-business{padding-top:15rem; background-color:#fff; display: block;} #main-business .m-title{color: #000; position: static;} #main-business .m-title p, #main-business .m-title h3{color: inherit;} #main-business .main-business{flex-wrap: wrap;} #main-business dl{width:50%; height:48rem;} /* R&D */ #main-rnd{padding:15rem 0; background-color: #15244e; background-image: none;} #main-rnd .rnd-head{position: static;} #main-rnd .rnd-head .m-title{text-align: center;} #main-rnd .rnd-head .rnd-menu{justify-content: center;} #main-rnd .swiper-container{margin-top:7rem; } #main-rnd .swiper-slide{flex-wrap: wrap;} #main-rnd .swiper-slide figure{width:70%; height: 51rem; position: relative;} #main-rnd .swiper-slide figure:before{content: ""; width: 100%; height: 50%; display: inline-block; position:absolute; left: 0; bottom:0; z-index:7; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#15244e+0,15244e+20,000000+100&0.65+0,0+100 */ background: linear-gradient(to top, rgba(21,36,78,1) 0%,rgba(21,36,78,0.8) 30%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ } #main-rnd .swiper-slide .conts{width:100%; padding:2rem 2rem 0;} /* project */ #main-project{} #main-project>.inConts{flex-wrap: wrap;} #main-project .mGroup{width:100%;} #main-project .mGroup .m-title{text-align: center !important;} #main-project .mGroup .m-title br{display:none;} #main-project .mGroup .btns{position: absolute; left:0; right:0; bottom:5rem;} #main-project .right{width: 100%} #main-project .swiper-container{width: 100%; padding-bottom:15rem;} #main-project .swiper-button-area{display:none;} /* esg */ #main-esg{} #main-esg .esg-li{justify-content: center;} #main-esg .esg-li>li{width:calc((100% - 4rem) / 3);} /* news */ #main-news{} #main-news .swiper-container{} #main-news .swiper-slide{width:calc((100% - 2.5rem) / 2);} /*[e] Main Style */ /* 기업정보 > 개요 */ .overview-top{} .overview-vision{} .overview-vision .title{width:100%; max-width:none; text-align: left; } .overview-vision .conts{width:100%; margin-top:5rem; max-width:none;} .overview-philosophy{} .overview-philosophy_re{flex-wrap: wrap;} .overview-philosophy_re figure{width:100%; height: auto; aspect-ratio:2/1.5;} .overview-philosophy_re .conts{width:100%; margin-top:7rem; align-items: start;} .overview-philosophy_re:nth-child(even) figure{order:1;} .overview-philosophy_re:nth-child(even) .conts{order:2;} .overview-philosophy_re + .overview-philosophy_re{margin-top:12rem;} .overview-info{} .overview-info figure{width:80%; height: 64rem;} .overview-info .conts{width:100%; margin-top:5rem; align-items: start;} .overview-info .new-conts{} .overview-info .new-conts>div{width:100%;} .overview-info .new-conts div+div{border-top:1px solid rgba(255,255,255,0.2);} /* 기업정보 > CEO 인사말 */ .ceo-text{} .ceo-text>.inConts{} .ceo-text>.inConts>.title{width:100%;} .ceo-text>.inConts>.title br{display:none;} .ceo-text>.inConts>div{width:100%; margin-top:4rem;} .ceo-text>.inConts>div p+p{margin-top:1rem;} .ceo-text>.inConts>div p.sign{margin-top:6rem; font-weight: 500; color: #000; text-align: right; display: flex; flex-flow: column nowrap; align-items: end;} .ceo-text>.inConts>div p.sign img{width:16rem; margin-top:1rem;} /* 기업정보 > 연혁 */ .history-wrap{padding-left:8rem;} .history-wrap:before{margin-left:0; left: 0%;} .history-wrap #history-progress{margin-left:0; left: 0%;} .history-list{} .history-list>li{flex-wrap: wrap;} .history-list .history-in{width:100%; order:2 !important; text-align: left !important;} .history-list .text-wrap>dl>dt{order:1 !important;} .history-list .text-wrap>dl>dd{order:2 !important; } .history-list figure{width:100%; order:1 !important;} /* 기업정보 > CI */ .ci-list{} .ci-list>li h4{width:100%; padding-left:0;} .ci-list>li .conts{flex:none; width:100%; margin-top:4rem;} .ci-list>li.color .conts{gap:0 3rem;} .ci-list>li.color .conts>li{width:calc((100% - 6rem) / 3);} .ci-list>li.slogan .conts>span{font-size:7.5vw;} /* 기업정보 > 사업장 */ .locations-info{} .locations-info>li{position: relative;} .locations-info>li h4{width:100%;} .locations-info>li .info{flex:none; width:100%;} .locations-info>li .link{position: absolute; right:0; top:4.5rem;} /* 사업소개 > 공장 및 설비현황 > 창원1공장 */ .facilities-info{} .facilities-info ul:not(.facilities-product){gap:5rem 0;} .facilities-info ul:not(.facilities-product)>li{width:50%;} .facilities-product figure{height:47rem; flex:none; width:100%; order:1 !important;} .facilities-product .conts{padding-bottom:0; order:2 !important; text-align: left !important;} .facilities-flow-top{} .facilities-flow-top .right{justify-content: end;} .facilities-flow-top .right .swiper-flow-pg{display:none;} .facilities-flow .swiper-container{margin-top:3rem;} .facilities-client{} .facilities-client>.inConts{flex-wrap: wrap;} .facilities-client hGroup{width:100%; min-width:none;} .facilities-client .right{width: 100%; margin-top:5rem;} .facilities-client .swiper-container{width: 100%;} .facilities-area .facilities-client hGroup p br{display:none !important;} /* R&D > 기술연구소 */ .research_institute-list{gap:4rem 0;} .research_institute-list>li{width:100%; padding:5.4rem 4.5rem;} /* R&D > 품질보증 시스템 */ .line-center-wrap{padding-left:8rem;} .line-center-wrap:before{margin-left:0; left: 0%;} .line-center-wrap #line-center-progress{margin-left:0; left: 0%;} .activities-list{} .activities-list>li{flex-wrap: wrap;} .activities-list figure{width:100%; order:1 !important;} .activities-list .conts{width:100%; order:2 !important; text-align: left !important;} .workflow-process{gap:0 10rem;} .workflow-process>li{width:calc((100% - 10rem) / 2);} .workflow-process>li+li:before{width: 10rem; background-size: 6rem; left: -10rem; display:block;} .workflow-process>li.arr.p+li:before{display:block;} .workflow-process>li.arr.t+li:before, .workflow-process>li.arr.p{display: none;} .workflow-process>li.arr.t{padding:0 calc(((100% - 13rem) / 2) / 2); display: flex;} /* 지속가능경영 > 비전/전략 */ .vision_strategy-list{} .vision_strategy-list>li{width:100%;} /* 지속가능경영 > 환경경영 */ .environmental-list{} .environmental-list>li{flex-wrap: wrap;} .environmental-list>li:before, .environmental-list>li:after{display:none !important;} .environmental-list figure{width:100%; order:1 !important;} .environmental-list .conts{width:100%; order:2 !important; text-align: left !important;} /* 지속가능경영 > 인권·준법 경영 */ .human-conts{} .human-announcement{gap:2rem;} .human-announcement>li{width:calc((100% - 2rem) / 2);} .human-announcement>li br{display:none;} .human-announcement>li dl{padding:6.5rem 3rem 7.5rem 3rem;} .human-announcement>li dl:before{margin-bottom:3rem; position: static;} .human-conts2{} .human-guideline>li{padding:4rem 0;} .human-guideline>li ul{width:100%; padding:3rem 0 0 0; border-left:none;} /* 지속가능경영 > 윤리경영 */ .ethical-faq{} .ethical-faq dl>dt{width:25rem;} .ethical-faq dl>dd{padding-left:4.9rem;} /* 지속가능경영 > 안전보건경영 */ .safety-conts{} .safety-top hGroup{width:100%;} .safety-top hGroup br{display:none;} .safety-top .safety-right{flex:none; width:100%; margin-top:5rem;} .safety-end{padding:4rem 3rem;} .safety-end>dt{width:100%; text-align: left;} .safety-end>dd{flex:none; width:100%; padding:1rem 0 0 0; border-left:none;} /* 지속가능경영 > 사회공헌 */ .social-core{gap:3rem;} .social-core>li{width:100%;} .social-list{gap:2rem;} .social-list>li{width:calc((100% - 2rem) / 2);} /* 인재채용 > 조직문화 */ .culture-option{gap:2rem;} .culture-option>li{width:calc((100% - 2rem) / 2);} .culture-option>li:before{display:none;} .culture-option>li:first-child:before{margin-top:0; display:block; right: -3.1rem; top: auto; bottom: -3.2rem;} /* 인재채용 > 직무소개 */ .jobs-info{counter-reset:item var(--start, 0); } .jobs-info>li:before{display:none;} .jobs-info hGroup{width:100%; padding-bottom:0;} .jobs-info hGroup br{display:none;} .jobs-info hGroup .btm{left:auto; right:0; bottom:auto; top:5rem;} .jobs-info .jobs-detail{flex:none; width:100%; padding:0;} /*[s] Plugin Style */ .fancybox__slide{padding:40px 2rem 8px !important;} #find-expert-lay .list{gap:4rem 2rem;} #find-expert-lay .list>li{width:calc((100% - 4rem) / 3);} #success-detail-lay .find-expert-view .success-detail-view h3{font-size:2.2rem;} #success-detail-lay .find-expert-view .success-detail-view h5{font-size:1.7rem;} /*.lay-doctor .lay-doctor-top>figure{width:30rem; height:30rem; margin:0 auto; padding-top:5rem; border-radius:999px; overflow: hidden; align-items:start; box-shadow:1rem 1rem 2rem rgba(0,0,0,0.2);}*/ .lay-doctor .lay-doctor-top>figure{width:100%; max-width:none; justify-content: end; margin-bottom: -9.5rem;} .lay-doctor .lay-doctor-top>figure img{width:25rem;} .lay-doctor .lay-doctor-top .info-conts{width:100%; padding-bottom:7rem;} /*[e] Plugin Style */ } @media only screen and (max-width : 840px){ /*[s] All Style */ h4.txt>*{font-size:2em;} h4.tit>*{font-size:1.8em;} h5.txt>*{font-size:1.3em; line-height:var(--lh_10);} ul.check{line-height:2.8rem;} ul.check>li:before{top:0.3rem;} ul._star>li{padding-left:1.7rem; font-size:var(--fs_22);} .ps-green>p{font-size:var(--fs_22);} .swipe-hint-box.mo{display: flex;} .scroll-img.seoul{width:100%; margin-top:2rem; padding-bottom:1rem; overflow-x:auto; -webkit-overflow-scrolling:touch;} .scroll-img.seoul>img{width:840px !important; max-width:none;} .scroll-img.safety>img{width:840px !important;} /*[e] All Style */ /*[s] Main Popup Style */ .hd_pops{left:2rem !important; right:2rem !important;} .hd_pops_con{} #popLayer{} #popLayer #moPopArea{} #popLayer #moPopArea .moPop{max-width:90%;} #popLayer #moPopArea #moPopRoll{} #popLayer .slider{} #popLayer .slider img{} /* #popLayer .slider#HKeditorContent{padding:20px; font-size:20px; line-height:1.5; color: #666;} #popLayer .slider#HKeditorContent img{width:auto;} #popLayer #moPopRoll.roll .slider{} */ #popLayer .layerPopClose{width:4rem; height:4rem; right:2rem; top:2rem;} #popLayer .layerPopClose:before{margin:-1px 0 0 -2rem;} #popLayer .layerPopClose:after{margin:-2rem 0 0 -1px;} #popLayer .moPopClose{} #popLayer .moPopClose>*{height:8rem; font-size:2rem;} /* #popLayer .moPopClose button{font-size:1.8rem; line-height:2.4rem;} #popLayer .moPopClose button:before{width: 2.4rem; height: 2.4rem; font-size:1.8rem; line-height:2.6rem;} #popLayer .moPopClose button.toDay_close{padding-left:3.2rem;} #popLayer .moPopClose button.close{padding-right:3.2rem} */ #popLayer .slick-dots{bottom:10rem;} #popLayer .slick-dots>li{} #popLayer .slick-dots>li+li{} #popLayer .slick-dots>li button{width:1.8rem; height:1.8rem;} #popLayer .slick-dots>li.slick-active button{} /*[e] Main Popup Style */ /*[s] Main Style */ .m-title{padding-bottom:6rem;} .m-title p{font-size:1.0833em;} .m-title h3{font-size:1.6667em;} .m-title div{} .m-title{padding-bottom:5rem;} .m-title h3{font-size:2.0833em;} .m-title p{font-size:1em; line-height:var(--lh_10);} .m-btn{width:20rem; height:6rem;} .displacement-swiper{height:106rem;} #mainVisual{} #mainVisual .swiper-wrapper .swiper-slide>img{height:106rem;} #mainVisual .vTxt .ii.title{font-size:2.3em; line-height:var(--lh_10);} #mainVisual .vTxt .ii.text{margin-top:2rem; font-size:1.15em; line-height:var(--lh_10);} #mainVisual .swiper-pagination{bottom:12rem; gap:0 2rem;} #mainVisual .swiper-pagination-bullet{width:2rem; height:2rem;} #mainVisual .swiper-pagination-bullet.swiper-pagination-bullet-active{width:6.2rem;} /* business */ #main-business{padding-top:12rem;} #main-business dl{width:100%; height:36rem;} #main-business dl:before{font-size:1.25em;} #main-business dl>dt{font-size:1.875em;} #main-business dl>dd{} /* R&D */ #main-rnd{padding:12rem 0;} #main-rnd .rnd-head{position: static;} #main-rnd .rnd-head .m-title{text-align: center;} #main-rnd .rnd-head .rnd-menu{justify-content: center;} #main-rnd .rnd-head .rnd-menu button{font-size:1em; line-height:var(--lh_10);} #main-rnd .swiper-container{margin-top:7rem; } #main-rnd .swiper-slide{flex-wrap: wrap;} #main-rnd .swiper-slide figure{width:90%; height: 51rem;} #main-rnd .swiper-slide .conts{} #main-rnd .swiper-slide .conts .title{font-size:1.6667em;} #main-rnd .swiper-slide .conts .tit{margin-top:1.5rem; font-size:0.9167em;} #main-rnd .swiper-slide .conts .text{font-size:1.1667em; line-height:var(--lh_10);} #main-rnd .swiper-slide .conts .btn{margin-top:4rem;} #main-rnd .swiper-slide .conts .btn>a{width:24rem; height:5.5rem; font-size:0.9167em; border-radius:1rem;} /* project */ #main-project{padding:12rem 0;} #main-project .swiper-slide{width:42rem; margin-right:4rem;} #main-project .swiper-slide:last-child {margin-right:0;} #main-project .swiper-slide .conts{min-height:21rem; padding:3.5rem 2rem;} #main-project .swiper-slide .title{font-size:1.25em;} #main-project .swiper-slide .text{margin-top:1.5rem;} /* esg */ #main-esg{} #main-esg .esg-li{margin-top:0; gap:4rem 2rem} #main-esg .esg-li>li{width:calc((100% - 2rem) / 2);} #main-esg .esg-li>li dl{margin-top:2.5rem;} #main-esg .esg-li>li dl>dt{font-size:1.4583em;} #main-esg .esg-li>li dl>dd{margin-top:1.5rem; font-size:0.9167em; line-height:var(--lh_10);} #main-esg .esg-li>li dl>dd br{display:none;} /* news */ #main-news{} #main-news .m-title{text-align: center !important;} #main-news .swiper-container{} #main-news .swiper-slide{width:100%;} #main-news .swiper-slide .conts{} #main-news .swiper-slide .title{font-size:1.25em;} #main-news .swiper-slide .day{margin-top:2rem; line-height:1;} /*[e] Main Style */ /* 기업정보 > 개요 */ .overview-top{} .overview-top>dt{font-size:var(--fs_40);} .overview-top>dd{text-align: left;} .overview-vision{margin-top:12rem;} .overview-vision .title{font-size:var(--fs_40);} .overview-vision .conts{width:100%; margin-top:5rem; max-width:none;} .overview-vision .conts>li dl>dt{font-size:var(--fs_30);} .overview-philosophy{} .overview-philosophy_re{} .overview-philosophy_re figure{} .overview-philosophy_re .conts{} .overview-philosophy_re .conts .title{font-size:var(--fs_40);} .overview-philosophy_re .conts .tit{font-size:var(--fs_30);} .overview-philosophy_re .conts .text{font-size:1em; line-height:var(--lh_10);} .overview-info{} .overview-info .title{margin-left: -0.5vw; font-size:calc(100vw / 13); white-space: nowrap;} .overview-info figure{width:90%; height: auto; aspect-ratio:1/1;} .overview-info .conts dl+dl{margin-top:2.5rem;} .overview-status{} .overview-status>.inConts{display:flex; flex-flow: row wrap; position: relative; overflow:hidden;} .overview-status .title{width:18rem; font-size:var(--fs_40);} .overview-status .conts{flex:1; width:auto;} .overview-status .conts dl{} .overview-status .conts dl>dt{} .overview-status .conts dl>dd{margin-top:2rem; font-size:var(--fs_30);} .overview-status .conts dl>dd>strong{font-size:1.6667em;} .overview-status .conts dl>dd>small{margin-top:1rem; font-size:0.8em; display:block;} .overview-status .conts dl+dl{margin-top:12rem;} /* 기업정보 > 연혁 */ .history-visual{} .history-visual h3{font-size:var(--fs_60);} .history-visual dl>dt{font-size:var(--fs_40); line-height:var(--lh_10);} .history-visual dl>dd{font-size:1em; line-height:var(--lh_10);} .history-wrap{margin-top:7rem; padding-left:3rem;} .history-list .history-in>p{font-size:var(--fs_50);} /* 기업정보 > 사업장 */ .locations-map{transform: translateY(0%);} .locations-map .location-popup{width:48rem;} .locations-map .location-popup.popup-lab, .locations-map .location-popup.popup-chilseo, .locations-map .location-popup.popup-gunbuk, .locations-map .location-popup.popup-office, .locations-map .location-popup.popup-changwon{margin: -26rem 0 0 -24rem !important; position: fixed; bottom:auto; left: 50%; top: 50% !important;} .locations-info>li{padding-bottom:10rem;} .locations-info>li .info>dl{flex-wrap: wrap;} .locations-info>li .info>dl>dt{} .locations-info>li .info>dl+dl{margin-top:1rem;} .locations-info>li .link{top:auto; bottom:4.5rem;} /* 사업소개 > 공장 및 설비현황 > 창원1공장 */ .facilities-product figure{height:auto;} .facilities-flow .vTxtArea{padding:0 4rem;} .facilities-flow .vTxt .ii.num{color: rgba(255,255,255,0.3);} /* R&D > 품질보증 시스템 */ .certification-visual{height:auto; padding:12rem 2rem;} .certification-visual .visual-in ul{flex-wrap: wrap;} .certification-visual .visual-in ul>li{width:75%;} .line-center-wrap{padding-left:3rem;} .workflow-process{gap:12rem 0;} .workflow-process>li{width:100%;} .workflow-process>li+li:before{width: 10rem; height: 10rem; margin-left:-5rem; left:50%; top:-11rem; transform:rotate(90deg); display:block !important;} .workflow-process>li.arr{display: none !important;} /* 지속가능경영 > 비전/전략 */ .vision_strategy-visual{height:auto;} /* 지속가능경영 > 환경경영 */ .environmental-list figure{height:30rem;} .environmental-station{background:none; justify-content: start; gap:5rem 0;} .environmental-station>li{width:50%;} /* 지속가능경영 > 인권·준법 경영 */ .human-conts{} .human-announcement{} .human-announcement>li{width:100%;} .human-text{} .human-text>span:before, .human-text>span:after{content: ""; width: 0.5rem; height: 0.5rem; margin-top:-0.25rem; background-color: #8e96ad; display: inline-block; position:absolute; left: 0; top:50%; border-radius:99rem;} .human-text>span:after{left:auto; right:0;} .human-conts2{background-color: #f3f6fa;} .human-guideline{padding:0 2rem;} .human-guideline>li{} .human-guideline>li:before{width:6rem;} .human-guideline>li p{padding:0 3rem 0 2rem;} .human-conts3{} .chart-img{width:100%; padding:3rem 1rem;} /* 지속가능경영 > 윤리경영 */ .ethical-faq dl{padding:0 3rem;} .ethical-faq dl>dt{width:100%; text-align: left;} .ethical-faq dl>dt br{display:none;} .ethical-faq dl>dd{width: 100%; flex:none; margin-top:1rem; padding-left:0; transition: margin-top .3s ease-out;} .ethical-faq dl>dd:before{display:none;} .ethical-faq dl>dd .a{margin-top:1rem;} .ethical-faq>li.is-active dl>dd{margin-top:2rem;} /* 지속가능경영 > 안전보건경영 */ .safety-conts{} .safety-top .safety-faq>li{padding:3.5rem 2rem;} .safety-end{padding:3rem 2rem;} /* 지속가능경영 > 사회공헌 */ :where(.social-conts, .social-btm) hGroup h5{font-size:var(--fs_35); line-height:var(--lh_10);} .social-list>li{width:100%; font-size:var(--fs_20); line-height:1; color: #000;} /* 지속가능경영 > 사이버 신문고 */ .tab-button{} .tab-button button{width:100%;} .whistleblowing-conts{} .whistleblowing-conts .tab-button{right:2rem; top:-15.5rem;} .whistleblowing-conts{} .whistleblowing-form input[type=text], .whistleblowing-form input[type=password], .whistleblowing-form select, .whistleblowing-form textarea{height:7rem;} .whistleblowing-form textarea, .whistleblowing-form .text-area{height:20rem;} .whistleblowing-form .check-new input[type=checkbox]+label>.graphic, .whistleblowing-form .check-new input[type=checkbox]+label>.graphic:before, .whistleblowing-form .check-new input[type=radio]+label>.graphic, .whistleblowing-form .check-new input[type=radio]+label>.graphic:before{width: 2.6rem; height: 2.6rem;} .whistleblowing-form>li .whistleblowing-form_conts{gap:0;} .whistleblowing-form>li .whistleblowing-form_conts dl{width:100%;} .whistleblowing-form>li .whistleblowing-form_conts dl+dl{margin-top:5.5rem !important;} .whistleblowing-form>li .whistleblowing-form_conts dl>dt{font-size:var(--fs_26); line-height:1.35;} .whistleblowing-form>li .whistleblowing-form_conts dl>dd{min-height:7rem; font-size:var(--fs_24); line-height:var(--lh_10);} .whistleblowing-form>li .whistleblowing-form_conts .file-guide{min-height:auto; padding:2rem 0 8.5rem 0; flex-wrap: wrap;} .whistleblowing-form>li .whistleblowing-form_conts .file-size{position: absolute; right:14rem; top:7.5rem;} .whistleblowing-form>li .whistleblowing-form_conts .type-btn>button{width:12rem; height:5rem; font-size:0.9em; top: 1rem;} .whistleblowing-form>li .whistleblowing-form_conts .type-btn .file-guide+button{top: 6.5rem;} .whistleblowing-form>li .whistleblowing-form_conts .file-list{margin-top:0;} .whistleblowing-form>li .whistleblowing-form_conts .file-list li{min-height:6rem; padding:1.5rem 0; gap:2rem;} .whistleblowing-form>li .whistleblowing-form_conts .file-list .delete{width:3.4rem; height:3.4rem; font-size:2.4rem;} .whistleblowing-form>li .whistleblowing-form_conts .title{width:32rem; height:6rem; font-size:var(--fs_26);} .whistleblowing-form>li .whistleblowing-form_conts .text{font-size:var(--fs_24); line-height:var(--lh_10);} /* 인재채용 > 직무소개 */ .jobs-banner{height:auto; padding:4rem 3rem 5rem; flex-wrap: wrap;} .jobs-banner hGroup{width:100%;} .jobs-banner>p{width:22rem; height:5.5rem; margin-top:4rem;} /* etc */ .etc_clause{width:100%; margin:0 auto;} .etc_clause .etc_clause_in{padding:5rem 3rem; border-radius:1rem;} .etc_clause .logo{margin:0;} .etc_clause .txt{padding:2rem 0 6rem; font-size:2.6rem;} .etc_clause .scroll{font-size:2rem;} .clause-style .scroll{font-size:2.2rem;} .clause-style .scroll ol>li{padding-left:2.3rem; text-indent: -2.3rem;} .clause-style .scroll .kr>li{padding-left:2.7rem; text-indent: -2.7rem;} .clause-style .scroll ul>li{padding-left:1.4rem; text-indent: -1.4rem;} .etc_select{width:100%;} .etc_select select.base{width:22rem;} /*[s] Plugin Style */ .layer-base.fancybox__content>.carousel__button.is-close, .layer-base.fancybox__content>.carousel__button.is-back{width:5rem; height:5rem;} #find-expert-lay .scroll{height:100rem;} #find-expert-lay .text-box{font-size:3rem; line-height:4.4rem;} #find-expert-lay .list{gap:4rem 3rem;} #find-expert-lay .list>li{width:calc((100% - 3rem) / 2);} #find-expert-lay .list>li .cate{font-size:2.2rem;} #find-expert-lay .list>li .name{font-size:2.6rem;} #find-expert-lay .find-expert-view .photo-box{width:100%; max-width:none; display: flex; gap:3rem;} #find-expert-lay .find-expert-view .photo-box>dt{max-width:50%;} #find-expert-lay .find-expert-view .photo-box>dd{margin-top:0; font-size:2.4rem; flex-flow: column wrap; justify-content: center;} #find-expert-lay .find-expert-view .photo-box>dd>strong{width:100%; margin-top:1rem;} #find-expert-lay .find-expert-view .history-info{width:100%; height:54.77rem; margin-top:5rem;} #find-expert-lay .find-expert-view .history-info *+h5.bul{margin-top:4rem;} #find-expert-lay .find-expert-view .history-info .txt{font-size:2.4rem;} #success-detail-lay .scroll{height:100rem;} #success-detail-lay .find-expert-view .success-detail-view h3{font-size:3rem;} #success-detail-lay .find-expert-view .success-detail-view h5{font-size:2.6rem;} #success-detail-lay .find-expert-view .success-detail-view p{font-size:2.2rem;} #success-detail-lay .find-expert-view .success-detail-view .txt{font-size:2.4rem;} .add-form-lay .layer-in .text{font-size:2.2rem;} .lay-alert{max-width:90%;} .lay-alert .layer-in .logos img{height:8rem;} .lay-alert .layer-in .text{font-size:2.4rem; line-height:3.6rem;} .lay-doctor .lay-doctor-top{padding:5rem 3rem 0;} .lay-doctor .lay-doctor-top>figure{margin-bottom:-14.3rem;} .lay-doctor .lay-doctor-top>figure img{width:20rem;} .lay-doctor .lay-doctor-top .info-conts .name>dt{width:100%;} .lay-doctor .lay-doctor-top .info-conts .department>dd>p{height:5rem; font-size:2.2rem;} .reservation-btn>a{min-width:auto; height:6rem; font-size:2.2rem;} .lay-doctor .lay-doctor-conts{padding:7.5rem 3rem;} /*[e] Plugin Style */ } @media only screen and (max-width : 640px){ .ethical-btm .swipe-hint-box{display:flex;} .scroll-img.ethical{width:100%; margin-top:2rem; padding-bottom:1rem; overflow-x:auto; -webkit-overflow-scrolling:touch; justify-content: start !important;} .scroll-img.ethical>img{width:740px !important; max-width:none;} .ci-top img{height:8rem;} .ci-list>li.color .conts{gap:3rem 0;} .ci-list>li.color .conts>li{width:100%;} /* 사업소개 > 공장 및 설비현황 > 창원1공장 */ .facilities-info{} .facilities-info ul:not(.facilities-product){padding:5.5rem 3rem 4rem; gap:5rem;} .facilities-info ul:not(.facilities-product)>li{width:100%; justify-content: start;} .facilities-info ul:not(.facilities-product)>li dl{flex: 1;} .facilities-info ul:not(.facilities-product)>li dl>dd br{display:none;} .facilities-product .conts .info{gap:2rem;} .facilities-product .conts .info>dl{width:calc((100% - 2rem) / 2);} .facilities-product .conts .info>dl>dd br{display:none;} .facilities-state .swiper-slide{width:40rem; margin-right:2.5rem;} .facilities-state .swiper-slide:last-child {margin-right:0;} html[lang="en"] .facilities-state .swiper-slide{width:54rem;} html[lang="en"] .facilities-state .swiper-slide .option>dl>dt{width:19rem;} /* 사업소개 > 프로젝트 */ .projects-area{} .projects-area>li{padding:0 3rem;} .projects-area .projects-conts .option{margin-top:4rem; padding-top:0; border-top:none;} .projects-area .projects-conts .option>dl{width:calc((100% - 4.1rem) / 2); display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; text-align: center;} .projects-area .projects-conts .option>dl:nth-child(n+3):nth-child(-n+4):after{content: ""; width: 90%; height: 1px; background-color: rgba(255,255,255,0.3); position:absolute; left: 50%; top:-3.1rem; transform: translateX(-50%);} html[lang="en"] .projects-area .projects-conts{width:100%;} html[lang="en"] .projects-area .projects-conts h4{white-space: normal; } html[lang="en"] .projects-area .projects-conts .option{padding-top:3rem;} html[lang="en"] .projects-area .projects-conts .option>dl{width:100%; text-align: left; display:block;} html[lang="en"] .projects-area .projects-conts .option>dl:nth-child(n+3):nth-child(-n+4):after{display:none;} /* R&D > 기술연구소 */ .research_institute-list{} .research_institute-list>li{padding:5.4rem 2rem; gap:3rem;} .research_institute-list>li figure{width:12rem;} /* R&D > 품질보증 시스템 */ .certification-visual{} .certification-visual .visual-in p{justify-content: start; gap:0 0;} .certification-visual .visual-in p>span{width:100%;} .certification-visual .visual-in p>span+span:before{display:none;} .certification-info{flex-wrap: wrap; gap:4rem 0;} .certification-info>li{width:50%; text-align: center;} .certification-info>li img{width:34rem;} /* 인재채용 > 조직문화 */ .culture-option{gap:2rem;} .culture-option>li{width:100%;} .culture-option>li:before{display:block; margin-left:-2rem; right: auto; left:50%; top: auto; bottom: -3.2rem;} .culture-option>li:last-child:before{display:none;} /* 인재채용 > 직무소개 */ .jobs-info .jobs-detail>li .q{gap:0 2rem;} .jobs-info .jobs-detail>li .q ul{margin-left:6rem;} html[lang="en"] .jobs-info .jobs-detail>li:after{top:5.8rem;} html[lang="en"] .jobs-info .jobs-detail>li .q ul{margin-left:6rem;} } @media only screen and (max-width : 480px){ .certification-info>li{width:100%;} } @media only screen and (max-width : 400px){ } /* font-size:var(--fs_20); line-height:var(--lh_10); transform: scale(1.1) 부분을 transform: scale(1.1) rotate(.001deg); 로 변경하면 부드럽게 처리되네요 display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; display: flex; flex-flow: column wrap; align-items: center; justify-content: center; flex-flow: column wrap; align-content: center; justify-content: space-between; justify-content: space-around; flex-wrap: wrap; transform:rotate(180deg); transform: translateY(-50%); transform: scale(1) filter:blur(3px); filter:grayscale(100%); -webkit-filter:grayscale(100%); backdrop-filter:blur(50px); transition: all .5s linear; transition: all .5s ease-out; transition-delay: .8s; :before{content: ""; width: 24px; height: 24px; background-color: #fff; border:1px solid #666; display: inline-block; position:absolute; left: 0; top:0px; box-sizing: border-box;} display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; //한줄 감추기 display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break:break-all; //두줄 감추기 active border-radius:1rem; width:calc(100% / 6); box-shadow:0 0 1rem rgba(0,0,0,0.2); :first-child html[lang="en"] */