@charset "UTF-8";

#sub{padding-bottom:160px;}

.sub-head{height:500px;/* margin-bottom:120px;*/ padding-top:240px; background:url(/assets/images/sub/about_visual.jpg) no-repeat center / cover; text-align:center;}
.sub0101 .sub-head{background-image:url(/assets/images/sub/about_visual.jpg);}
.sub0102 .sub-head{background-image:url(/assets/images/sub/history_visual.jpg);}
.sub0103 .sub-head{background-image:url(/assets/images/sub/network_visual.jpg);}
.sub0104 .sub-head{background-image:url(/assets/images/sub/csr_visual.jpg);}
.sub0201 .sub-head{background-image:url(/assets/images/sub/glance_visual.jpg);}
.sub0202 .sub-head{background-image:url(/assets/images/sub/green_visual.jpg);}
.sub0203 .sub-head{background-image:url(/assets/images/sub/bio_visual.jpg);}
.sub0204 .sub-head{background-image:url(/assets/images/sub/certification_visual.jpg);}
.sub0301 .sub-head{background-image:url(/assets/images/sub/ingredients_visual.jpg);}
.sub0401 .sub-head{background-image:url(/assets/images/sub/news_visual.jpg);}
.sub0402 .sub-head{background-image:url(/assets/images/sub/trend_visual.jpg);}
.sub0403 .sub-head{background-image:url(/assets/images/sub/archive_visual.jpg);}
.sub0501 .sub-head{background-image:url(/assets/images/sub/contact_visual.jpg);}
.sub0502 .sub-head{background-image:url(/assets/images/sub/system_visual.jpg);}
.sub0601 .sub-head{background-image:url(/assets/images/sub/ir_visual.jpg);}
.sub0602 .sub-head{background-image:url(/assets/images/sub/ir_visual.jpg);}
.sub0603 .sub-head{background-image:url(/assets/images/sub/ir_visual.jpg);}
.sub0901 .sub-head{background-image:url(/assets/images/sub/news_visual.jpg);}
.sub-head .sub-title{color:#fff; font-size:100px; font-weight:400; line-height:1;}

#contents{margin-top:120px;}

.color-primary{color:#6ABF4B; font-weight:600;}
.color-secondary{color:#87A9E2; font-weight:600;}

.btn-wrap{display:block; position:relative; margin-top:80px; text-align:center;}

.btn-01{display:inline-block; display:inline-flex; position:relative; height:48px; padding:0 24px; border:solid 1px rgba(101, 100, 100, 0.5); border-radius:24px; color:#656464; font-size:18px; font-weight:500; text-align:center; line-height:1.55; align-items:center;justify-content:center;gap:12px;}
.btn-01:after{width:6px; height:10px; background:url(../images/common/arrow.png) no-repeat center / cover; content:'';}
.btn-01:hover{border-color:transparent; background-color:#6ABF4B; color:#fff;}
.btn-01:hover:after{background-image:url(../images/common/arrow_white.png);}

.btn-02{display:inline-flex; position:relative; height:52px; padding:0 24px; border:solid 1px rgba(101, 100, 100, 0.5); border-radius:50px; color:#656464; font-size:18px; font-weight:500; text-align:center; line-height:1.55; align-items:center;justify-content:center;}
.btn-02:hover{border-color:transparent; background-color:#6ABF4B; color:#fff;}

.col-box{display:flex; font-size:0; justify-content:space-between;}
.col-box + .col-box{margin-top:120px;}
.col-box .col-item{display:inline-block; position:relative; vertical-align:top;}
.col-box .col-item.left{width:366px; flex-shrink:0;}
.col-box .col-item.left.w-220{width:220px;}
.col-box .col-item.right{margin-left:24px; flex:1 0 0;}
.col-box .col-item.left.w-220 + .col-item.right{width:calc(100% - 244px);}
.col-box .col-item.left h3{color:#656464; font-size:32px; text-align:left; line-height:1.25;}
.col-box .col-item.left ul{margin-top:80px;}
.col-box .col-item.left ul li + li{margin-top:12px;}
.col-box .col-item.left ul li span{display:inline-block; position:relative; color:#656464; font-size:18px; text-align:left; line-height:1.56; vertical-align:top;}
.col-box .col-item.left ul li span.dt{width:41px; margin-right:8px; color:#000; font-size:18px; font-weight:600; text-align:left; line-height:1.56;}
.col-box .col-item .title{color:#000; font-size:24px; font-weight:600; text-align:left; line-height:1.5;}
.col-box .col-item .title span{display:block; font-size:inherit; font-weight:400; line-height:inherit;}
.col-box .col-item .text{color:#656464; font-size:18px; text-align:left; line-height:1.56;}
.col-box .col-item .title + .text{margin-top:12px;}
.col-box .col-item .text + .text{margin-top:12px;}
.col-box .col-item .text span{font-size:inherit; line-height:inherit;}
.col-box .col-item .black{color:#000 !important;}
.col-box .col-item b{color:inherit; font-size:inherit; line-height:inherit;}
.col-box .col-item .col-img{max-width:100%;}
.col-box .col-item .list{margin-top:48px; border-top:1px solid #000;}
.col-box .col-item .list > li{position:relative; padding:24px 0; padding-left:16px; border-bottom:1px solid #E8E8E8;}
.col-box .col-item .list > li.pl-none{padding-left:0;}
.col-box .col-item .list > li > span{position:absolute; top:24px; left:0; color:#6ABF4B; font-size:16px; line-height:1.5;}
.col-box .col-item .list > li.l-num{padding-left:20px;}
.col-box .col-item .list > li.l-num > span{font-size:18px; font-weight:600;}
.col-box .col-item .list > li > p{color:#656464; font-size:16px; line-height:1.5;}
.col-box .col-item .list > li > div{color:#000; font-size:18px; font-weight:600; line-height:1.55556;}
.col-box .col-item .list > li > div.in-text{display:flex; gap:24px;}
.col-box .col-item .list > li > div.in-text span{min-width:88px; flex-shrink:0;}
.col-box .col-item .list > li > div.in-text p{color:#646464; font-size:16px; font-weight:400;}
.col-box .col-item .list > li > ul{margin-top:6px;}
.col-box .col-item .list > li.pl-none > ul{padding-left:13px;}
.col-box .col-item .list > li > ul li{position:relative; color:#656464; font-size:16px; line-height:1.5;}
.col-box .col-item .list > li > ul li:before{position:absolute; top:0; left:-9px; content:'·';}
.col-box .col-item .list + .text{margin-top:48px;}

/* sub0101 - about */
.about{position:relative;}
.about:before{position:absolute; top:-34px; right:0; width:320px; height:220px; background:url(../images/sub/about_bg.png) no-repeat center / cover; content:'';}
.about .col-box .col-item .title span:first-child{font-weight:500;}
.about .col-box .col-item .title + .text{margin-top:24px;}
.about .about-text{display:flex; margin-top:48px; flex-direction:column; gap:24px;}
.about .about-text .text{margin-top:0 !important; color:#656464;}
.about .about-text .text.black{margin-top:24px !important;}

/* sub0102 - history */
.history{margin:-120px 0 -160px; padding:120px 0 0;}
.history .timeline-list{position:relative; background:url("/assets/images/sub/time_bg.png") no-repeat top 109px left 0; font-size:0;}
.history .timeline-list:before{display:block; position:absolute; top:-120px; left:50%; z-index:-1; width:100vw; height:calc(100% + 120px); background-image:linear-gradient(to bottom, #f3faf1 0%, rgba(243, 250, 241, 0)); content:''; transform:translateX(-50%);}
.history .timeline-list ul li{display:inline-block; position:relative; width:220px; padding-top:128px; vertical-align:top;}
.history .timeline-list ul li .timeline-box{position:relative;}
.history .timeline-list ul li:not(.time-img) .timeline-box:before{display:inline-block; position:absolute; top:-32px; left:0; right:0; width:12px; height:12px; margin:0 auto; border:solid 8px #b5dfa5; border-radius:50%; background-color:#6abf4b; content:'';}
.history .timeline-list ul li + li{margin-left:24px;}
.history .timeline-list ul li.time-img{padding-top:233px}
.history .timeline-list ul li.time-img:before{display:block; position:absolute; top:0; left:0; right:0; width:220px; height:220px; background-repeat:no-repeat; background-size:cover; content:'';}
.history .timeline-list ul li.n1.time-img:before{background-image:url(/assets/images/sub/time_img01.png);}
.history .timeline-list ul li.n3.time-img:before{background-image:url(/assets/images/sub/time_img02.png);}
.history .timeline-list ul li.n6.time-img:before{background-image:url(/assets/images/sub/time_img03.png);}
.history .timeline-list ul li.n8.time-img:before{background-image:url(/assets/images/sub/time_img04.png);}
.history .timeline-list ul li.n9.time-img:before{background-image:url(/assets/images/sub/time_img05.png);}
.history .timeline-list ul li.n11.time-img:before{background-image:url(/assets/images/sub/time_img06.png);}
.history .timeline-list ul li.n12.time-img:before{background-image:url(/assets/images/sub/time_img07_ko.png);}
html[lang="en"] .history .timeline-list ul li.n12.time-img:before{background-image:url(/assets/images/sub/time_img07_en.png);}
html[lang="zh-CN"] .history .timeline-list ul li.n12.time-img:before{background-image:url(/assets/images/sub/time_img07_en.png);}
.history .timeline-list ul li.n13.time-img:before{background-image:url(/assets/images/sub/time_img08.png);}
.history .timeline-list ul li.n14.time-img:before{display:none;}
.history .timeline-list ul li.n16.time-img:before{background-image:url(/assets/images/sub/time_img10.png);}
.history .timeline-list ul li.n4{padding-top:28px;}
.history .timeline-list ul li.n4 .timeline-box:before{display:none;}
.history .timeline-list ul li.n5{position:absolute;}
.history .timeline-list ul li.n5 .timeline-box{position:absolute; left:-216px;}

.history .timeline-list ol > li:nth-child(2){margin-top:75px;}
.history .timeline-list .reverse{display:flex; padding-right:239px; flex-direction:row-reverse;}
.history .timeline-list ul li.n7{margin-left:25px;}

.history .timeline-list ol > li:nth-child(3){margin-top:75px; padding-left:249px;}
.history .timeline-list ul li.time-img.small{padding-top:18px;}
.history .timeline-list ul li.time-img.small .timeline-box p{text-align:left;}
.history .timeline-list ul li.n13{width:300px; padding-top:18px; padding-left:110px;}
.history .timeline-list ul li.n13.time-img:before{width:98px; height:98px;}
.history .timeline-list ul li.n14{position:absolute;}
.history .timeline-list ul li.n14 .timeline-box{position:absolute; top:139px; left:-314px; padding-right:110px;}
.history .timeline-list ul li.n14 .timeline-box:after{display:block; position:absolute; top:-17px; right:0; width:98px; height:98px; background:url(/assets/images/sub/time_img09.png) no-repeat; content:'';}
.history .timeline-list ul li.n15{position:absolute;}
.history .timeline-list ul li.n15 .timeline-box{position:absolute; left:-36px;}
.history .timeline-list ul li.n16{margin-left:183px;}
/* 점선 중앙에 점 고정: n7(2019.04.02), n10(2022.12.05)는 살짝 아래로 */
.history .timeline-list ul li.n7 .timeline-box:before{top:-24px;}
.history .timeline-list ul li.n10 .timeline-box:before{top:-24px;}
.history .timeline-list .date{color:#6abf4b; font-size:24px; font-weight:600; text-align:center; line-height:1.5;}
.history .timeline-list .text{color:#000; font-size:18px; text-align:center; line-height:1.56;}
.history .timeline-list .timeline-box .text{padding-bottom:6px;}
/* 영문/중문: 상단 타임라인 텍스트가 선에 가리지 않도록 여백·크기 조정 */
html[lang="en"] .history .timeline-list .text{font-size:13px; line-height:1.45; word-break:break-word;}
html[lang="en"] .history .timeline-list .timeline-box .text{padding-bottom:12px;}
html[lang="zh-CN"] .history .timeline-list .timeline-box .text{padding-bottom:12px;}
/* 2025.03.14(n15) 영문만: 점이 점선 중앙에 오고 글씨를 가리지 않도록 위로 올림 */
html[lang="en"] .history .timeline-list ul li.n15 .timeline-box:before{top:-40px;}

.history .history-box{display:block; position:relative; margin-top:240px; padding-bottom:160px;}
.history .history-box:before{display:block; position:absolute; left:50%; bottom:0; z-index:-1; width:100vw; height:100%; background:url(/assets/images/sub/history_bg.png); content:''; transform:translateX(-50%);}
.history .history-box .history-inner:after{display:block; position:absolute; top:0; left:371px; width:1px; height:70px; background-color:#6abf4b; content:'';}
.history .history-box .title{display:inline-block; position:absolute; top:0; left:0;}
.history .history-box .title h3{color:#656464; font-size:32px; line-height:1.25;}
.history .history-box .history-inner{margin-left:371px; padding-top:60px; padding-left:55px;}
.history .history-box .history-inner:before{display:block; position:absolute; top:0; left:371px; width:1px; height:calc(100% - 158px); background-color:#e8e8e8; content:'';}
.history .history-item{display:flex; position:relative; margin-bottom:59px; gap:63px;align-items:flex-start;}
.history .history-item:last-child{margin-bottom:0; padding-bottom:59px;}
.history .history-item:before{display:block; position:absolute; top:14px; left:-57px; width:6px; height:6px; border-radius:50%; background-color:#e8e8e8; content:'';}
.history .history-item:after{display:block; position:absolute; top:13px; left:-55px; width:1px; height:0; background-color:#6abf4b; content:''; transition:height 0.8s linear;}
.history .history-item.show:after{height:calc(100% + 62px);}
.history .history-item:last-child.show:after{height:100%;}
.history .history-item .col.year{position:relative; color:#000; font-size:24px; font-weight:600; text-align:left; line-height:1.5;}
.history .history-item .col.year:before{display:block; opacity:0; position:absolute; top:10px; left:-60px; z-index:1; width:12px; height:12px; border:2px solid #6abf4b; border-radius:50%; background-color:#fff; content:''; transition:opacity 0.25s ease-in-out; box-sizing:border-box;}
.history .history-item.show .col.year:before{opacity:1;}
.history .history-item .col.text{min-width:0; flex:1;}
.history .history-item .col.text ul{margin:0; padding:0; list-style:none;}
.history .history-item .col.text li{display:flex; margin-bottom:11px; gap:2px;align-items:start;}
.history .history-item .col.text li:last-child{margin-bottom:0;}
.history .history-item .col.text .year{flex-shrink:0; width:60px; color:#6abf4b; font-size:18px; font-weight:600; line-height:1.55556;}
.history .history-item .col.text .text{color:#000; font-size:18px; line-height:1.55556;}
.history .history-item .col.text .text em{margin-left:8px; color:#656464; font-size:18px; line-height:1.55556;}

/* sub0103 - network */
.network .network-img{max-width:100%;}
.network .network-text{position:relative; margin-top:-80px;}
.network .network-text div{color:#000; font-size:18px; font-weight:600; line-height:1.5556;}
.network .network-text p{max-width:831px; color:#656464; font-size:16px; line-height:1.5;}
.network .network-text p + div{margin-top:30px;}

/* sub0104 - csr */
.csr .csr-main{display:flex; position:relative; margin:-120px 0 -160px; padding:120px 0 160px; text-align:center; flex-direction:column; gap:120px; align-items:center;}
.csr .csr-main:before{position:absolute; top:0; left:50%; bottom:0; width:100vw; background:url(../images/sub/csr_bg.jpg) no-repeat center bottom / cover; content:''; transform:translateX(-50%);}
.csr .csr-main .csr-text{display:flex; position:relative; max-width:1100px; flex-direction:column; gap:24px;}
.csr .csr-main .csr-text div{color:#6ABF4B; font-size:32px; font-weight:600; line-height:1.25;}
.csr .csr-main .csr-text p{color:#000; font-size:18px; line-height:1.55556;}
.csr .csr-main .csr-list{display:flex; position:relative; gap:24px;}
.csr .csr-main .csr-list li a{display:flex; width:342px; height:342px; border-radius:999px; background:rgba(106, 191, 75, 0.50); color:#fff; flex-direction:column; align-items:center; justify-content:center; backdrop-filter:blur(10px); gap:24px;}
.csr .csr-main .csr-list li a img{height:80px;}
.csr .csr-main .csr-list li a div{font-size:24px; font-weight:600; line-height:1.5;}
.csr .csr-main .csr-list li a p{color:#E8E8E8; font-size:18px; line-height:1.55556;}
.csr .col-box .col-item .col-img + .text{margin-top:48px;}
.csr .col-box .col-item .ico-list{display:flex; flex-wrap:wrap; gap:48px;}
.csr .col-box .col-item .ico-list li{width:calc(50% - 24px);}
.csr .col-box .col-item .ico-list li img{height:60px;}
.csr .col-box .col-item .ico-list li div{margin-top:24px; color:#000; font-size:20px; font-weight:600; line-height:1.5;}
.csr .col-box .col-item .ico-list li p{margin-top:12px; color:#656464; font-size:16px; line-height:1.5;}
.csr .col-box .col-item .text + .text.black{margin-top:48px;}

/* sub0201 - glance */
.glance .col-box .col-item.right{max-width:764px;}
.glance .glance-list{display:flex; margin-top:120px; flex-direction:column; gap:120px;}
.glance .glance-list li{display:flex; gap:122px; align-items:center;}
.glance .glance-list li .img{overflow:hidden; width:732px; max-width:732px; flex-shrink:0; border-radius:24px; aspect-ratio:732/440;}
.glance .glance-list li .img img{width:100%; height:100%; object-fit:cover;}
.glance .glance-list li .text div{color:#000; font-size:48px; font-weight:600; line-height:1.25;}
.glance .glance-list li .text p{margin-top:24px; font-size:24px; line-height:1.5;}
.glance .glance-list li .text .btn-01{margin-top:48px;}

/* sub0202 - green */

/* sub0203 - bio */

/* sub0204 - certification */
.sub0204 .cert-section,
.sub0204 .cert-section *{box-sizing:border-box;}

.sub0204 .certification{margin-top:0;}

.sub0204 .cert-section{padding:120px 0 160px; display:flex; flex-direction:column; gap:120px; align-items:flex-start; justify-content:flex-start;}
.sub0204 .cert-section .section-01,
.sub0204 .cert-section .section-02{display:flex; flex-direction:row; gap:80px; align-items:flex-start; justify-content:flex-start;}

.sub0204 .cert-section .section-01 > .div,
.sub0204 .cert-section .section-02 > .div{width:220px; color:#656464; font-size:32px; line-height:40px; font-weight:400; text-align:left; flex-shrink:0;}

/* .content: 피그마 PC 기준 */
.sub0204 .cert-section .content{display:flex; flex-direction:column; gap:48px; align-items:flex-start; justify-content:flex-start; flex-shrink:0;}
.sub0204 .cert-section .content .p{display:flex; flex-direction:column; gap:12px; align-items:flex-start; justify-content:flex-start;}
.sub0204 .cert-section .content .p .div{color:#000; text-align:left; font-size:18px; line-height:28px; font-weight:600;}
.sub0204 .cert-section .content .p ._100{color:#656464; text-align:left; font-size:18px; line-height:28px; font-weight:400;}

.sub0204 .cert-section .table{display:flex; flex-direction:column; gap:0; align-items:flex-start; justify-content:flex-start; overflow:hidden; min-width:1074px; width:1074px; flex-shrink:0;}
.sub0204 .cert-section .thead{display:flex; flex-direction:row; width:1074px; min-width:1074px; background:#F3FAF1; border-top:1px solid #000; overflow:hidden; flex-shrink:0;}
.sub0204 .cert-section .th{border-right:1px solid #e8e8e8; padding:20px 0; width:314px; height:136px; display:flex; align-items:center; justify-content:center; background:#F3FAF1;}
.sub0204 .cert-section .th .div2,
.sub0204 .cert-section .th3 .div2,
.sub0204 .cert-section .th4 .div2,
.sub0204 .cert-section .th5 .div2{color:#000; text-align:center; font-size:18px; line-height:28px; font-weight:600;}
.sub0204 .cert-section .th2{display:flex; flex-direction:row; flex-wrap:wrap; align-content:flex-start; width:760px; background:#F3FAF1;}
.sub0204 .cert-section .th3{border-bottom:1px solid #e8e8e8; padding:20px 0; width:760px; display:flex; align-items:center; justify-content:center; background:#F3FAF1;}
.sub0204 .cert-section .th4{border-right:1px solid #e8e8e8; padding:20px 0; width:380px; display:flex; align-items:center; justify-content:center; background:#F3FAF1;}
.sub0204 .cert-section .th5{padding:20px 0; width:380px; display:flex; align-items:center; justify-content:center; background:#F3FAF1;}

.sub0204 .cert-section .tbody{display:flex; flex-direction:column; gap:0; overflow:hidden; min-width:1074px; width:1074px; flex-shrink:0;}
.sub0204 .cert-section .tr{border-top:1px solid #e8e8e8; border-bottom:1px solid #e8e8e8; display:flex; flex-direction:row; align-items:center; overflow:hidden; min-width:1074px;}
.sub0204 .cert-section .tr2{border-bottom:1px solid #e8e8e8; display:flex; flex-direction:row; align-items:center; overflow:hidden; min-width:1074px;}
.sub0204 .cert-section .td{border-right:1px solid #e8e8e8; padding:20px 0; width:314px; display:flex; align-items:center; justify-content:center;}
.sub0204 .cert-section .td .div3{color:#656464; text-align:center; font-size:16px; line-height:24px; font-weight:400;}
.sub0204 .cert-section .td2{border-right:1px solid #e8e8e8; padding:20px 0; width:380px; display:flex; align-items:center; justify-content:center;}
.sub0204 .cert-section .td3{padding:20px 0; width:380px; display:flex; align-items:center; justify-content:center;}
.sub0204 .cert-section ._31,
.sub0204 .cert-section ._6,
.sub0204 .cert-section ._32,
.sub0204 .cert-section ._53,
.sub0204 .cert-section ._63,
.sub0204 .cert-section ._59{color:#656464; text-align:center; font-size:16px; line-height:24px; font-weight:400;}

.sub0204 .cert-section .img-wrap{display:flex; flex-wrap:wrap; gap:24px; width:1074px; max-width:100%; box-sizing:border-box;}
.sub0204 .cert-section .img-wrap .img{position:relative; width:calc((1074px - 72px) / 4); max-width:calc((100% - 72px) / 4); height:168px; padding:20px; background:#fff; border:1px solid #e8e8e8; box-sizing:border-box; flex-shrink:0;}
.sub0204 .cert-section .img-wrap .img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); max-width:calc(100% - 40px); max-height:128px; object-fit:contain;}

/* 테이블 래퍼 - 반응형에서 한 화면에 맞춤(가로스크롤 없음) */
.sub0204 .cert-section .table-scroll{width:100%; overflow:visible;}
.sub0204 .cert-section .table-scroll::-webkit-scrollbar{height:6px;}
.sub0204 .cert-section .table-scroll::-webkit-scrollbar-thumb{background:#e8e8e8; border-radius:3px;}
.sub0204 .cert-section .table-scroll::-webkit-scrollbar-track{background:#f5f5f5;}

.sub0204 .cert-section .union,
.sub0204 .cert-section .union2,
.sub0204 .cert-section .union3,
.sub0204 .cert-section .union4{position:absolute; top:14.29%; left:50%; transform:translateX(-50%); width:109px; height:53.57%;}
.sub0204 .cert-section .iso-9001,
.sub0204 .cert-section .iso-14001,
.sub0204 .cert-section .iso-37001,
.sub0204 .cert-section .iso-45001{position:absolute; top:124px; left:50%; transform:translateX(-50%); color:#00539f; font-size:14px; line-height:20px; font-weight:600; text-align:center;}

/* sub0301 - ingredients */
.ingredients{display:block; position:relative; font-size:0; line-height:0;}
.tab .tab-item{display:inline-block; position:relative; width:calc((100% - 12px) / 2); height:90px; background-color:#f3faf1;}
.tab .tab-item + .tab-item{margin-left:12px;}
.tab .tab-item.active{background-color:#6abf4b;}
.tab .tab-item button{display:block; position:relative; width:100%; height:100%; color:#656464; font-size:20px; font-weight:600; text-align:center; line-height:1.5;}
.tab .tab-item.active button{color:#fff;}
.tab .tab-panel{display:none;}
.tab .tab-panel.active{display:block;}
.tab .tab-panel-wrap{position:relative; margin-top:48px; padding:24px 0 28px; border-top:solid 1px #e8e8e8; border-bottom:solid 1px #e8e8e8;}
.tab .choose-box{display:inline-block; position:relative; width:calc(100% / 4); padding-left:24px;}
.tab .choose-box.long{width:100%; padding-left:12px;}
.tab .choose-box .choose-title{color:#000; font-size:18px; font-weight:600; line-height:1.55556;}
.tab .choose-box .scroll{display:block; position:relative; max-height:200px; padding:11px 0 32px; overflow-y:auto;}
.tab .choose-box .scroll::-webkit-scrollbar{width:2px;}
.tab .choose-box .scroll::-webkit-scrollbar-thumb{height:10%; border-radius:0; background-color:#656464;}
.tab .choose-box .scroll::-webkit-scrollbar-track{background-color:#e8e8e8;}

.tab .choose-box .checkitem{display:block; margin-bottom:6px;}
.tab .choose-box.long .checkitem{display:inline-block; margin-right:6px;}
.tab .choose-box .checkitem input{display:inline-block; opacity:0; position:absolute; top:-3px; left:-3px; width:0; height:0;}
.tab .choose-box .checkitem label{display:inline-block; position:relative; padding:10px 20px; border:1px solid #e8e8e8; border-radius:50px; background-color:#fff; color:#656464; font-size:16px; line-height:1.5; cursor:pointer;}
.tab .choose-box .checkitem input[type="checkbox"]:checked +label{border-color:#656464; background-color:#656464; color:#fff;}

.tab .choose-search{display:flex; gap:24px; align-items:center;}
.tab .choose-search select{width:208px; height:28px; padding:0 22px 0 12px; background:url(../images/sub/select_arrow.png) no-repeat no-repeat right 12px center / 10px; color:#000; font-size:18px; flex-shrink:0;}
.tab .choose-search input{height:28px; color:#000; font-size:18px; flex:1 0 0;}
.tab .choose-search input::placeholder{color:rgba(0,0,0,0.5);}
.tab .btn-wrap{margin-top:48px;}

.ingredients .result-box{margin-top:120px; border-top:solid 1px #000;}
.ingredients .result-item{display:flex; padding:24px 0 22px 0; border-bottom:1px solid #e8e8e8; gap:35px;align-items:center;}
.ingredients .result-item .left-box{border:1px solid #E8E8E8; flex:0 0 208px;}
.ingredients .result-item .left-box img{display:block; width:100%;}
.ingredients .result-item .right-box{display:flex; flex:1;flex-wrap:wrap;gap:27px;}

.ingredients .right-box .right-item{display:flex; flex-direction:column;}
.ingredients .right-box .right-item.info{min-width:460px; flex:1.5;}
.ingredients .right-box .right-item.info .anchor{display:block; position:relative; height:100%;}
.ingredients .right-box .right-item.keyword,
.ingredients .right-box .right-item.effect{min-width:160px; flex:1;}
.ingredients .right-box .right-item.filter{display:inline-block; flex:1;}

.ingredients .right-box .right-item .title{display:inline-block; position:relative; margin-bottom:12px; padding-right:21px; color:#000; font-size:24px; font-weight:600; line-height:1.5;}
.ingredients .right-box .right-item .anchor .title:before{display:block; opacity:0; position:absolute; top:-2px; right:0; bottom:0; width:8px; height:13px; margin:auto 0; background:url(/assets/images/common/arrow_primary.png) no-repeat center / 8px; content:'';}
.ingredients .right-box .right-item .anchor:hover .title:before{opacity:1;}
.ingredients .right-box .right-item.info .anchor:hover .title{color:#6abf4b;}
.ingredients .right-box .right-item .sub-title{color:#000; font-size:16px; font-weight:600; line-height:1.5;}
.ingredients .right-box .right-item .text{color:#656464; font-size:16px; line-height:1.5;}
.ingredients .right-box .right-item .filter-item{display:inline-block; position:relative; height:40px; margin:0 6px 6px 0; padding:0 14px; border-radius:20px; color:#656464; font-size:16px; line-height:40px;}
.ingredients .right-box .right-item .filter-item.type1{background:#dff6de;}
.ingredients .right-box .right-item .filter-item.type2{background:#d3efe9;}
.ingredients .right-box .right-item .filter-item.type3{background:#e3e7f8;}
.ingredients .right-box .right-item .filter-item.type4{background:#f6e0e0;}

.pagination{display:flex; min-width:0; max-width:100%; margin-top:80px; justify-content:center;align-items:center;}
.pagination .pagination-btn{display:inline-block; position:relative; width:32px; height:32px; background:url("/assets/images/common/arrow.png") no-repeat center / 6px;}
.pagination .pagination-btn.prev{transform:rotate(180deg);}
.pagination .pagination-links{display:flex; min-width:0; max-width:100%; margin:0 12px; align-items:center;gap:6px;}
.pagination .pagination-link{width:32px; height:32px; border-radius:50%; background-color:#e8e8e8; color:#656464; font-size:14px; font-weight:600; text-align:center; line-height:32px; letter-spacing:0;}
.pagination .pagination-link.active{background-color:#6abf4b; color:#fff;}

.ingredients-box{display:flex; padding:24px; background-color:#F3FAF1; flex-direction:column; gap:12px;}
.ingredients-box .name{color:#6ABF4B; font-size:24px; font-weight:600; line-height:1.5;}
.ingredients-box .keyword{display:flex; flex-wrap:wrap; gap:12px;}
.ingredients-box .keyword span{color:#656464; font-size:16px; line-height:1.5;}

/* sub0401 ~ sub0403 - board */
.board .board-search{display:flex; align-items:center; justify-content:space-between;}
.board .board-search .search-total{color:#000; font-size:16px; line-height:1.5; flex-shrink:0;}
.board .board-search .search-total span{color:inherit; font-size:inherit; line-height:inherit;}
.board .board-search .search-total span:nth-child(2){color:#6ABF4B; font-weight:600;}
.board .board-search .search-inp{position:relative; display:flex; width:464px; padding:14px 42px 14px 4px; border:1px solid #E8E8E8; align-items:center; gap:12px; box-sizing:border-box;}
.board .board-search .search-inp select{appearance:none; -webkit-appearance:none; -moz-appearance:none; width:118px; height:24px; padding:0 22px 0 12px; border:none; border-right:1px solid #E8E8E8; background:url(../images/sub/select_arrow.png) no-repeat right 12px center / 10px; color:#000; font-size:16px; flex-shrink:0; cursor:pointer; outline:none;}
.board .board-search .search-inp select:hover{border-right-color:#d0d0d0;}
.board .board-search .search-inp select:focus{border-right-color:#6ABF4B;}
.board .board-search .search-inp input{height:24px; color:#000; font-size:16px; flex:1 1 0; min-width:0; border:none; outline:none; background:none;}
.board .board-search .search-inp input::placeholder{color:rgba(0,0,0,0.5);}
/* 검색 버튼: absolute 배치로 브라우저 기본값 무관하게 항상 박스 안에 위치 */
.board .board-search .search-inp button{position:absolute; right:14px; top:50%; transform:translateY(-50%); width:20px; height:20px; padding:0; margin:0; border:none; background:url(../images/common/search_primary.png) no-repeat center / cover; font-size:0; cursor:pointer; appearance:none; -webkit-appearance:none;}
.board .board-list{display:flex; margin-top:48px; gap:48px 24px; flex-wrap:wrap;}
.board .board-list .board-item{width:calc((100% - 48px) / 3);}
.board .board-list .board-item a{display:flex; flex-direction:column; gap:24px;}
.board .board-list .board-item a .img{position:relative; aspect-ratio:464/312;}
.board .board-list .board-item a .img img{width:100%; height:100%; object-fit:cover;}
.board .board-list .board-item a .img:after{position:absolute; top:0; left:0; width:100%; height:100%; border:2px solid transparent; content:''; box-sizing:border-box;}
.board .board-list .board-item a:hover .img:after{border-color:#6ABF4B;}
.board .board-list .board-item a .text{display:flex; flex-direction:column; gap:12px;}
.board .board-list .board-item a .text div{display:-webkit-box; overflow:hidden; color:#000; font-size:20px; font-weight:600; text-overflow:ellipsis; line-height:1.5; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.board .board-list .board-item a:hover .text div{color:#6ABF4B;}
.board .board-list .board-item a .text p{display:-webkit-box; overflow:hidden; color:#656464; font-size:16px; text-overflow:ellipsis; line-height:1.5; -webkit-box-orient:vertical; -webkit-line-clamp:3;}
.board .board-list .board-item a .text span{margin-top:12px; color:#656464; font-size:16px; line-height:1.5;}
.board .pagination{font-size:0;}
.board .board-view{border-top:2px solid #000; border-bottom:1px solid #E8E8E8;}
.board .board-view .view-head{display:flex; padding:24px; border-bottom:1px solid #E8E8E8; flex-direction:column; gap:12px;}
.board .board-view .view-head .view-title{color:#000; font-size:24px; font-weight:600; line-height:1.5;}
.board .board-view .view-head .view-date{color:#646464; font-size:16px; line-height:1.5;}
.board .board-view .view-file{display:flex; padding:16px 24px; border-bottom:1px solid #E8E8E8; flex-wrap:wrap;}
.board .board-view .view-file .file-title{position:relative; margin-right:16px; padding-right:17px; font-size:14px; font-weight:600; line-height:1.42857; flex-shrink:0;}
.board .board-view .view-file .file-title:after{position:absolute; top:0; right:0; bottom:0; width:1px; height:14px; margin:auto 0; background-color:#E8E8E8; content:'';}
.board .board-view .view-file .file-list{display:flex; flex-wrap:wrap; gap:12px;}
.board .board-view .view-file .file-list a{color:#656464; font-size:14px; text-decoration:underline; line-height:1.42857;}
.board .board-view .view-cont{display:flex; padding:60px 24px; flex-direction:column; align-items:start; gap:24px;}
.board .board-view .view-cont p{color:#000; font-size:16px; line-height:1.5;}

/* sub0901 - 검색 결과 */
.search-result-contents{margin-top:48px;}
.search-result-header{display:flex; align-items:flex-start; flex-wrap:wrap; gap:16px 24px; padding-bottom:24px; border-bottom:1px solid #E8E8E8;}
.search-result-form{display:flex; align-items:flex-start; gap:12px; flex-wrap:wrap;}
.search-result-keyword-wrap{display:inline-flex; flex-direction:column; align-items:flex-start; flex:0 1 auto; min-width:0; max-width:320px;}
.search-result-keyword-wrap .search-result-keyword{color:#000; font-size:24px; font-weight:600; line-height:1.4;}
.search-result-inp{display:block; width:100%; min-width:180px; padding:0; border:0; background:none; color:#000; font-size:24px; font-weight:600; line-height:1.4;}
.search-result-inp::placeholder{color:rgba(0,0,0,0.4);}
.search-result-inp:focus{outline:none;}
.search-result-keyword-underline{display:block; width:100%; height:2px; margin-top:4px; background:#6ABF4B;}
.search-result-submit{display:flex; width:40px; height:40px; align-items:center; justify-content:center; border:1px solid #E8E8E8; border-radius:50%; background:#fff; flex-shrink:0; cursor:pointer;}
.search-result-submit:hover{border-color:#6ABF4B; background:#6ABF4B;}
.search-result-submit:hover .ico-search{filter:brightness(0) invert(1);}
.search-result-submit .ico-search{width:20px; height:20px; background:url(../images/common/search_primary.png) no-repeat center/contain;}
.search-result-summary{margin:0; width:100%; color:#656464; font-size:16px; line-height:1.5;}
.search-result-summary strong{color:#000; font-weight:600;}
.search-result-summary .search-result-count{display:inline; color:#6ABF4B !important; font-weight:600; vertical-align:baseline;}
.search-result-tabs{margin-top:32px;}
.search-result-tab-list{display:flex; flex-wrap:wrap; gap:0 24px; margin:0; padding:0; list-style:none;}
.search-result-tab-list li{margin:0;}
.search-result-tab{display:inline-flex; align-items:center; justify-content:center; padding:12px 0; margin:0; border:0; background:none; color:#656464; font-size:16px; font-weight:500; line-height:1.5; cursor:pointer; border-bottom:2px solid transparent;}
.search-result-tab:hover{color:#000;}
.search-result-tab.active{color:#000; font-weight:600; border-bottom-color:#6ABF4B;}
.search-result-tab .tab-count{display:inline; color:#6ABF4B; font-weight:600; vertical-align:baseline;}
.search-result-tab.active .tab-count{color:#6ABF4B;}
.search-result-list-wrap{margin-top:48px;}
.search-result-list{margin:0; padding:0; list-style:none;}
.search-result-list > li{border-bottom:1px solid #E8E8E8;}
.search-result-list > li:first-child{border-top:1px solid #E8E8E8;}
.search-result-item{display:flex; gap:32px; padding:32px 0; align-items:flex-start;}
.search-result-item .thumb-wrap{flex-shrink:0; width:320px; aspect-ratio:464/312; overflow:hidden; border-radius:4px;}
.search-result-item .thumb-wrap img{width:100%; height:100%; object-fit:cover;}
.search-result-item .body{flex:1; min-width:0; display:flex; flex-direction:column; gap:12px;}
.search-result-item .body .subtitle{color:#656464; font-size:14px; line-height:1.5;}
.search-result-item .body .title{color:#000; font-size:20px; font-weight:600; line-height:1.5;}
.search-result-item a:hover .body .title{color:#6ABF4B;}
.search-result-item .body .summary{color:#656464; font-size:16px; line-height:1.6; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.search-result-item .body .breadcrumb{margin-top:4px; color:#656464; font-size:14px; line-height:1.5;}
.search-result-empty{padding:48px 0; text-align:center; color:#656464; font-size:16px;}
@media (max-width:768px){
    .search-result-header{flex-direction:column; align-items:flex-start;}
    .search-result-keyword-wrap .search-result-keyword,
    .search-result-inp{font-size:20px;}
    .search-result-item{flex-direction:column; gap:20px; padding:24px 0; align-items:stretch;}
    .search-result-item .thumb-wrap{width:100%; max-width:none;}
    .search-result-item .body{width:100%; box-sizing:border-box;}
}

/* sub0501 ~ sub0502 - contact */
.contact{display:block; position:relative; font-size:0; line-height:0;}
.contact .address-box + .address-box{margin-top:80px;}
.contact .address-box .map-box{height:400px; margin-top:48px;}
.contact .address-box .map-box iframe{height:100%;}

.contact .form-box .form-item + .form-item{margin-top:24px;}
.contact .form-box .form-item{display:flex; align-items:center;}
.contact .form-box .form-item label{flex-shrink:0; width:100px; min-height:60px; display:flex; align-items:center; position:relative; color:#000; font-size:18px; font-weight:600; text-align:left; line-height:1.2;}
.contact .form-box .form-item .essential{color:#6abf4b;}
.contact .form-box .form-item .form-cont{flex:1; min-width:0; position:relative;}
.contact .form-box .form-item .form-cont textarea,
.contact .form-box .form-item .form-cont input{display:block; width:100%; height:60px; padding:0 11px; border-bottom:solid 1px rgba(101, 100, 100, 0.5); background-color:#fff; color:#000; font-size:16px;}
.contact .form-box .form-item .form-cont textarea{height:180px; padding:19px 11px;}
.contact .form-box .form-item:has(textarea){align-items:flex-start;}
.contact .form-box .form-item:has(textarea) label{min-height:auto; padding-top:19px;}
.contact .form-box .form-item .form-cont textarea:focus,
.contact .form-box .form-item .form-cont input:focus{border-bottom-color:#6abf4b; outline:none;}
.contact .form-box .form-item .form-cont textarea::placeholder,
.contact .form-box .form-item .form-cont input::placeholder{color:rgba(0, 0, 0, 0.5); font-size:16px; font-weight:400; line-height:24px; letter-spacing:0;}
.contact .form-box .form-item .form-cont textarea:focus::placeholder,
.contact .form-box .form-item .form-cont input:focus::placeholder{color:#000;}
.contact .btn-wrap{margin-top:48px;}
.nl-privacy-wrap{padding-left:100px;}

.contact .table{display:table; position:relative; width:100%; border-collapse:collapse; border-spacing:0; border-top:1px solid #000; box-sizing:border-box;}
.contact .table thead tr th,
.contact .table tbody tr th,
.contact .table tbody tr td{padding:20px 10px; border-right:1px solid #e8e8e8; vertical-align:middle; box-sizing:border-box;}
.contact .table thead tr th:last-child,
.contact .table tbody tr td:last-child{border-right:none;}
.contact .table thead tr th{border-bottom:1px solid #e8e8e8;}
.contact .table tbody tr th,
.contact .table tbody tr td{padding:19px 10px 18px; border-bottom:1px solid #e8e8e8;}
.contact .table thead tr th{background-color:#f3faf1; color:#000; font-size:18px; font-weight:600; line-height:26px;}
.contact .table tbody tr td{background-color:#fff; color:#656464; font-size:16px; font-weight:400; line-height:26px;}

@media (max-width:1440px){






    .col-box .col-item.left{width:250px;}

    /* sub0101 - about */

    /* sub0102 - history */
    .history .timeline-list{max-width:970px; margin:0 auto; background-position:top 84px left; background-size:100%;}
    .history .timeline-list ul li{width:170px; padding-top:103px;}
    .history .timeline-list ul li.time-img{padding-top:173px;}
    .history .timeline-list ul li.time-img:before{width:170px; height:170px;}
    .history .timeline-list ul li.n4{padding-top:10px;}
    .history .timeline-list ul li.n5 .timeline-box{left:-186px;}

    .history .timeline-list ol > li:nth-child(2){margin-top:16px;}
    .history .timeline-list .reverse{padding-right:119px;}

    .history .timeline-list ol > li:nth-child(3){margin-top:16px; padding-left:0;}
    .history .timeline-list ul li.n13{width:280px; margin-top:-18px;}
    .history .timeline-list ul li.n14 .timeline-box{top:108px;}
    .history .timeline-list ul li.n16{margin-left:132px;}
    .history .timeline-list .date{font-size:20px;}
    .history .timeline-list .text{font-size:16px;}
    html[lang="en"] .history .timeline-list .text{font-size:12px; line-height:1.4; word-break:break-word;}

    .history .history-box .history-inner:after{left:170px;}
    .history .history-box .history-inner{margin-left:170px;}
    .history .history-box .history-inner:before{left:170px;}

    /* sub0103 - network */

    /* sub0104 - csr */
    .csr .csr-main .csr-list{gap:12px;}
    .csr .csr-main .csr-list li a{width:242px; height:242px; gap:12px;}
    .csr .csr-main .csr-list li a img{height:60px;}
    .csr .csr-main .csr-list li a div{font-size:20px;}
    .csr .csr-main .csr-list li a p{font-size:16px;}

    /* sub0201 - glance */

    /* sub0202 - green */

    /* sub0203 - bio */

    /* sub0204 - certification: 1440px는 PC 유지, 여백·폰트만 축소 */
    .sub0204 .cert-section{padding:80px 0 100px; gap:80px;}
    .sub0204 .cert-section .section-01,
    .sub0204 .cert-section .section-02{gap:60px;}
    .sub0204 .cert-section .section-01 > .div,
    .sub0204 .cert-section .section-02 > .div{width:180px; font-size:28px; line-height:36px;}
    .sub0204 .cert-section .content{gap:32px;}
    .sub0204 .cert-section .content .p .div{font-size:17px;}
    .sub0204 .cert-section .content .p ._100{font-size:17px;}
    .sub0204 .cert-section .thead,
    .sub0204 .cert-section .th,
    .sub0204 .cert-section .th2,
    .sub0204 .cert-section .th3,
    .sub0204 .cert-section .th4,
    .sub0204 .cert-section .th5{background:#F3FAF1;}
    .sub0204 .cert-section .th{padding:16px 0; height:auto; min-height:100px;}
    .sub0204 .cert-section .th .div2,
    .sub0204 .cert-section .th3 .div2,
    .sub0204 .cert-section .th4 .div2,
    .sub0204 .cert-section .th5 .div2{font-size:17px;}
    .sub0204 .cert-section .th3,
    .sub0204 .cert-section .th4,
    .sub0204 .cert-section .th5{padding:16px 0;}
    .sub0204 .cert-section .td,
    .sub0204 .cert-section .td2,
    .sub0204 .cert-section .td3{padding:16px 0;}
    .sub0204 .cert-section .td .div3,
    .sub0204 .cert-section ._31,
    .sub0204 .cert-section ._6,
    .sub0204 .cert-section ._32,
    .sub0204 .cert-section ._53,
    .sub0204 .cert-section ._63,
    .sub0204 .cert-section ._59{font-size:15px;}
    .sub0204 .cert-section .img-wrap{gap:20px;}
    .sub0204 .cert-section .img-wrap .img{padding:18px;}
    .sub0204 .cert-section .img-wrap .img img{max-height:110px;}
    .sub0204 .cert-section .iso-9001,
    .sub0204 .cert-section .iso-14001,
    .sub0204 .cert-section .iso-37001,
    .sub0204 .cert-section .iso-45001{font-size:13px;}

    /* sub0301 - ingredients */


    .ingredients .result-item{gap:24px; align-items:start;}
    .ingredients .result-item .right-box{gap:24px 12px;}

    .ingredients .right-box .right-item.info{min-width:100%;}
}

@media (max-width:1024px){
    #sub{padding-bottom:40px;}

    #contents{margin-top:40px;}

    .sub-head{display:flex; height:220px; padding-top:15px; align-items:center; justify-content:center;}
    .sub-head .sub-title{font-size:28px;}


    .btn-wrap{margin-top:36px !important;}

    .btn-01{height:36px; padding:0 16px; font-size:14px; gap:8px;}

    .btn-02{height:43px; padding:0 16px; font-size:15px;}

    .col-box{flex-direction:column; gap:16px;}
    .col-box + .col-box{margin-top:40px;}
    .col-box .col-item.left{display:flex; width:100%; flex-direction:column;}
    .col-box .col-item.right{width:100% !important; margin-left:0;}
    .col-box .col-item.left h3{font-size:20px;}
    .col-box .col-item.left h3 br{display:none;}
    .col-box .col-item.left ul{margin-top:12px;}
    .col-box .col-item.left ul li + li{margin-top:4px;}
    .col-box .col-item.left ul li span{font-size:14px;}
    .col-box .col-item.left ul li span.dt{width:26px; font-size:14px;}
    .col-box .col-item .title{font-size:16px;}
    .col-box .col-item .text{font-size:14px;}
    .col-box .col-item .title + .text{margin-top:8px !important;}
    .col-box .col-item .text + .text{margin-top:8px !important;}
    .col-box .col-item .list{margin-top:24px;}
    .col-box .col-item .list > li{padding-top:12px; padding-bottom:12px;}
    .col-box .col-item .list > li > span{top:12px; font-size:14px;}
    .col-box .col-item .list > li.l-num{padding-left:16px;}
    .col-box .col-item .list > li.l-num > span{font-size:14px;}
    .col-box .col-item .list > li.l-num > div{font-size:14px;}
    .col-box .col-item .list > li > p{font-size:14px;}
    .col-box .col-item .list > li > div{font-size:15px;}
    .col-box .col-item .list > li > ul{margin-top:2px;}
    .col-box .col-item .list > li > ul li{font-size:14px;}
    .col-box .col-item .list + .text{margin-top:24px;}

    /* sub0101 - about */
    .about:before{top:-20px; right:-150px;}
    .about .about-text{margin-top:16px; gap:4px;}

    /* sub0102 - history */
    .history{margin:-40px 0; padding-top:40px;}
    .history .timeline-list{display:none;}
    .history .history-box{margin-top:40px;}
    .history .timeline-list > ol{display:flex; flex-direction:column; gap:12px;}
    .history .timeline-list ul{display:flex; flex-direction:column !important; align-items:center; gap:12px;/* flex-wrap:wrap;*/}
    .history .timeline-list ul li{position:relative !important; width:170px !important; margin-top:0 !important; margin-left:0 !important; padding-top:0;}
    .history .timeline-list ul li .timeline-box{position:relative !important; top:auto !important; left:auto !important;}
    .history .timeline-list ul li:not(.time-img) .timeline-box:before{display:none;}
    .history .timeline-list ul li.time-img{padding:173px 0 0 0 !important;}
    .history .timeline-list ul li.time-img:before{width:170px !important; height:170px !important;}
    .history .timeline-list ul li.n13.time-img:before{width:98px !important; height:98px !important; margin:0 auto;}

    .history .timeline-list ol > li:nth-child(2){margin-top:0;}
    .history .timeline-list .reverse{padding-right:0;}

    .history .timeline-list ul li.n13{padding:101px 0 0 !important;}
    .history .timeline-list ul li.n14{padding-top:0 !important;}
    .history .timeline-list ul li.n14 .timeline-box{padding:101px 0 0 0 !important;}
    .history .timeline-list ul li.n14 .timeline-box:after{top:0; left:0; margin:0 auto;}
    .history .timeline-list .date{font-size:16px; text-align:center !important;}
    .history .timeline-list .text{font-size:14px; text-align:center !important;}
    html[lang="en"] .history .timeline-list .text{font-size:11px; line-height:1.35; word-break:break-word;}

    .history .history-box{max-width:560px; margin:100px auto 0; padding-bottom:60px;}
    .history .history-box .history-inner:after{left:60px; height:22px;}
    .history .history-box .title{top:-50px; right:0; text-align:center; /* position:relative;*/}
    .history .history-box .title h3{font-size:26px;}
    .history .history-box .history-inner{margin-left:0; padding-top:5px; padding-left:7px;}
    .history .history-box .history-inner:before{left:60px;}
    .history .history-item{margin-bottom:30px; gap:30px;}
    .history .history-item:before{top:10px; left:-11px; width:4px; height:4px;}
    .history .history-item:after{left:53px;}
    .history .history-item .col.year{font-size:16px;}
    .history .history-item .col.year:before{top:6px; left:49px; width:9px; height:9px; border-width:2px;}
    .history .history-item .col.text li{margin-bottom:6px;}
    .history .history-item .col.text .year{width:50px; font-size:14px;}
    .history .history-item .col.text .text{display:flex; font-size:14px; flex-wrap:wrap; gap:0 8px;}
    .history .history-item .col.text .text em{margin-left:0; font-size:14px; /* display:block;*/}

    /* sub0103 - network */
    .network .network-text{margin-top:10px;}
    .network .network-text div{font-size:16px;}
    .network .network-text p{font-size:14px;}
    .network .network-text p + div{margin-top:12px;}

    /* sub0104 - csr */
    .csr .csr-main{margin:-40px 0; padding:40px 0; gap:40px;}
    .csr .csr-main .csr-text{gap:12px;}
    .csr .csr-main .csr-text div{font-size:24px;}
    .csr .csr-main .csr-text p{font-size:14px;}
    .csr .csr-main .csr-list{max-width:320px; margin:0 auto; flex-wrap:wrap;}
    .csr .csr-main .csr-list li a{width:154px; height:154px; gap:8px;}
    .csr .csr-main .csr-list li a img{height:40px;}
    .csr .csr-main .csr-list li a div{font-size:16px;}
    .csr .csr-main .csr-list li a p{margin-top:-4px; font-size:14px;}
    .csr .col-box .col-item .col-img + .text{margin-top:16px;}
    .csr .col-box .col-item .ico-list{gap:16px;}
    .csr .col-box .col-item .ico-list li{position:relative; width:100%; padding-left:47px;}
    .csr .col-box .col-item .ico-list li img{position:absolute; top:0; left:0; height:36px;}
    .csr .col-box .col-item .ico-list li div{margin-top:7px; font-size:16px;}
    .csr .col-box .col-item .ico-list li p{margin-top:4px; font-size:14px;}

    /* sub0201 - glance */
    .glance .glance-list{margin-top:40px; gap:24px;}
    .glance .glance-list li{gap:16px;}
    .glance .glance-list li .img{width:490px; max-width:490px; border-radius:12px;}
    .glance .glance-list li .text div{font-size:18px;}
    .glance .glance-list li .text p{margin-top:8px; font-size:14px;}
    .glance .glance-list li .text .btn-01{margin-top:12px;}

    /* sub0202 - green */

    /* sub0203 - bio */

    /* sub0204 - certification: 1024px 이하 한 화면 맞춤, flex 비율 + 여백 축소 */
    .sub0204 .cert-section{padding:40px 0 60px; gap:48px;}
    .sub0204 .cert-section .section-01,
    .sub0204 .cert-section .section-02{flex-direction:column; gap:24px; align-items:stretch;}
    .sub0204 .cert-section .section-01 > .div,
    .sub0204 .cert-section .section-02 > .div{width:100%; font-size:20px; line-height:1.4;}
    .sub0204 .cert-section .section-02 > .div br{display:none;}
    .sub0204 .cert-section .content{gap:20px; max-width:100%; min-width:0; overflow:hidden;}
    .sub0204 .cert-section .content .p{gap:8px;}
    .sub0204 .cert-section .content .p .div{font-size:16px;}
    .sub0204 .cert-section .content .p ._100{font-size:14px;}
    .sub0204 .cert-section .table-scroll{min-width:0;}
    .sub0204 .cert-section .table{width:100%; min-width:0; max-width:100%; flex-shrink:1;}
    .sub0204 .cert-section .thead{width:100%; min-width:0; flex-wrap:nowrap; flex-shrink:0;}
    .sub0204 .cert-section .tbody{width:100%; min-width:0;}
    .sub0204 .cert-section .tr,
    .sub0204 .cert-section .tr2{min-width:0; flex-wrap:nowrap;}
    .sub0204 .cert-section .th{flex:0 0 29.2%; width:29.2%; min-width:0; padding:12px 8px; height:auto; min-height:70px;}
    .sub0204 .cert-section .th2{flex:1 1 70.8%; min-width:0; display:flex; flex-wrap:nowrap;}
    .sub0204 .cert-section .th3{flex:1 1 50%; min-width:0; padding:12px 8px;}
    .sub0204 .cert-section .th4{flex:1 1 25%; min-width:0; padding:12px 8px;}
    .sub0204 .cert-section .th5{flex:1 1 25%; min-width:0; padding:12px 8px;}
    .sub0204 .cert-section .td{flex:0 0 29.2%; width:29.2%; min-width:0; padding:12px 8px;}
    .sub0204 .cert-section .td2{flex:1 1 35.4%; min-width:0; padding:12px 8px;}
    .sub0204 .cert-section .td3{flex:1 1 35.4%; min-width:0; padding:12px 8px;}
    .sub0204 .cert-section .thead,
    .sub0204 .cert-section .th,
    .sub0204 .cert-section .th2,
    .sub0204 .cert-section .th3,
    .sub0204 .cert-section .th4,
    .sub0204 .cert-section .th5{background:#F3FAF1;}
    .sub0204 .cert-section .th .div2,
    .sub0204 .cert-section .th3 .div2,
    .sub0204 .cert-section .th4 .div2,
    .sub0204 .cert-section .th5 .div2{font-size:15px; word-break:keep-all;}
    .sub0204 .cert-section .td .div3,
    .sub0204 .cert-section ._31,
    .sub0204 .cert-section ._6,
    .sub0204 .cert-section ._32,
    .sub0204 .cert-section ._53,
    .sub0204 .cert-section ._63,
    .sub0204 .cert-section ._59{font-size:13px;}
    .sub0204 .cert-section .img-wrap{width:100%; gap:16px;}
    .sub0204 .cert-section .img-wrap .img{flex:0 1 calc((100% - 48px) / 4); min-width:0; max-width:none; padding:12px;}
    .sub0204 .cert-section .img-wrap .img img{max-height:90px;}
    .sub0204 .cert-section .iso-9001,
    .sub0204 .cert-section .iso-14001,
    .sub0204 .cert-section .iso-37001,
    .sub0204 .cert-section .iso-45001{font-size:12px; top:auto; bottom:8px; left:50%; transform:translateX(-50%);}

    /* sub0301 - ingredients */
    .tab .tab-item{width:calc((100% - 8px) / 2); height:50px;}
    .tab .tab-item + .tab-item{margin-left:8px;}
    .tab .tab-item button{font-size:16px;}
    .tab .tab-panel-wrap{margin-top:24px; padding:12px 0;}
    .tab .choose-box{width:50%; padding:0 10px;}
    .tab .choose-box:nth-child(n+3){margin-top:20px; padding-top:12px; border-top:1px dashed #f3f3f3;}
    .tab .choose-box.long{padding-left:0;}
    .tab .choose-box .choose-title{font-size:16px;}
    .tab .choose-box .scroll{height:159px;}

    .tab .choose-box .checkitem label{padding:4px 12px; font-size:14px;}
    .tab .btn-wrap{margin-top:28px;}

    .tab .choose-search{gap:8px;}
    .tab .choose-search select{width:90px; font-size:15px;}
    .tab .choose-search input{font-size:15px;}

    .ingredients .result-box{margin-top:60px;}
    .ingredients .result-item{padding:12px 0; gap:8px; flex-direction:column;}
    .ingredients .result-item .left-box{flex:none; width:160px; height:auto; margin:0;}
    .ingredients .result-item .left-box img{width:100%; height:auto; object-fit:contain;}
    .ingredients .result-item .right-box{gap:8px;}

    .ingredients .right-box .right-item.keyword,
    .ingredients .right-box .right-item.effect{min-width:100%;}
    .ingredients .right-box .right-item.filter{min-width:100%;}

    .ingredients .right-box .right-item .title{margin-bottom:4px; font-size:18px;}
    .ingredients .right-box .right-item .sub-title{font-size:15px;}
    .ingredients .right-box .right-item .text{font-size:14px;}
    .ingredients .right-box .right-item .filter-item{height:30px; padding:0 8px; font-size:12px; line-height:30px;}

    .pagination{margin-top:36px;}


    /* sub0401 ~ sub0403 - board */
    .board .board-search{flex-direction:column; align-items:start; gap:6px;}
    .board .board-search .search-total{font-size:14px;}
    .board .board-search .search-inp{width:100%; padding:10px 12px 10px 0; gap:8px;}
    .board .board-search .search-inp select{width:90px; font-size:15px;}
    .board .board-search .search-inp input{width:100%; font-size:15px;}
    .board .board-search .search-inp button{background-size:16px;}
    .board .board-list{margin-top:24px; gap:24px 12px;}
    .board .board-list .board-item{width:calc((100% - 24px) / 3);}
    .board .board-list .board-item a{gap:12px;}
    .board .board-list .board-item a .text{gap:4px;}
    .board .board-list .board-item a .text div{font-size:15px;}
    .board .board-list .board-item a .text p{font-size:14px;}
    .board .board-list .board-item a .text span{margin-top:4px; font-size:14px;}
    .board .board-view .view-head{padding:12px 8px; gap:8px;}
    .board .board-view .view-head .view-title{font-size:16px;}
    .board .board-view .view-head .view-date{font-size:14px;}
    .board .board-view .view-file{padding:12px 8px;}
    .board .board-view .view-file .file-title{margin-right:8px; padding-right:9px;}
    .board .board-view .view-cont{padding:16px 8px; gap:12px;}
    .board .board-view .view-cont p{font-size:14px;}


    /* sub0501 ~ sub0502 - contact */
    .contact .address-box + .address-box{margin-top:30px;}
    .contact .address-box .map-box{height:240px; margin-top:12px;}

    .contact .form-box .form-item + .form-item{margin-top:12px;}
    .contact .form-box .form-item label{width:60px; min-height:40px; font-size:14px;}
    .nl-privacy-wrap{padding-left:60px;}
    .contact .form-box .form-item .form-cont textarea,
    .contact .form-box .form-item .form-cont input{height:40px; padding:0 8px; font-size:14px;}
    .contact .form-box .form-item .form-cont textarea{height:80px; padding-top:8px;}
    .contact .form-box .form-item .form-cont textarea::placeholder,
    .contact .form-box .form-item .form-cont input::placeholder{font-size:14px;}

    .contact .table colgroup col{width:auto !important;}
    .contact .table thead tr th,
    .contact .table tbody tr th,
    .contact .table tbody tr td{padding:8px 4px;}
    .contact .table thead tr th{font-size:14px;}
    .contact .table tbody tr td{font-size:13px; line-height:1.25; word-break:break-all;}
}

@media (max-width:768px){
    /* contact col-box 세로 스택 */
    .contact .col-box{flex-direction:column; gap:24px;}
    .contact .col-box .col-item.left{width:100%;}
    .contact .col-box .col-item.right{margin-left:0;}
    .contact .col-box + .col-box{margin-top:48px;}
    .contact .col-box .col-item.left ul{margin-top:16px;}

    /* contact 폼 모바일 */
    .contact .form-box .form-item{flex-direction:column; align-items:flex-start; gap:6px;}
    .contact .form-box .form-item label{width:auto; min-height:auto;}
    .contact .form-box .form-item .form-cont{width:100%;}
    .nl-privacy-wrap{padding-left:0;}

    /* contact 딜러 테이블 모바일 스크롤 */
    .contact .table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch;}
    .contact .table-wrap .table{min-width:700px;}
    .contact .table-wrap .table thead tr th,
    .contact .table-wrap .table tbody tr td{white-space:nowrap; word-break:normal;}

    .glance .glance-list li{flex-direction:column; align-items:start;}

    .board .board-list .board-item{width:calc((100% - 12px) / 2);}

    /* sub0204 - certification: 768px 한 화면 맞춤, 여백·폰트 최소화 */
    .sub0204 .cert-section{padding:24px 0 40px; gap:32px;}
    .sub0204 .cert-section .section-01,
    .sub0204 .cert-section .section-02{min-width:0; width:100%; overflow:hidden;}
    .sub0204 .cert-section .section-01 > .div,
    .sub0204 .cert-section .section-02 > .div{font-size:18px;}
    .sub0204 .cert-section .content{gap:16px; overflow:hidden; min-width:0; width:100%;}
    .sub0204 .cert-section .content .p .div{font-size:15px;}
    .sub0204 .cert-section .content .p ._100{font-size:13px;}
    .sub0204 .cert-section .table-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch;}
    .sub0204 .cert-section .table{min-width:800px; width:800px; max-width:none; flex-shrink:0;}
    .sub0204 .cert-section .thead{min-width:800px; width:800px; flex-shrink:0;}
    .sub0204 .cert-section .tbody{min-width:800px; width:800px; flex-shrink:0;}
    .sub0204 .cert-section .tr,
    .sub0204 .cert-section .tr2{min-width:800px;}
    .sub0204 .cert-section .th{padding:8px 6px; min-height:52px;}
    .sub0204 .cert-section .th3,
    .sub0204 .cert-section .th4,
    .sub0204 .cert-section .th5{padding:8px 6px;}
    .sub0204 .cert-section .td,
    .sub0204 .cert-section .td2,
    .sub0204 .cert-section .td3{padding:8px 6px;}
    .sub0204 .cert-section .thead,
    .sub0204 .cert-section .th,
    .sub0204 .cert-section .th2,
    .sub0204 .cert-section .th3,
    .sub0204 .cert-section .th4,
    .sub0204 .cert-section .th5{background:#F3FAF1;}
    .sub0204 .cert-section .th .div2,
    .sub0204 .cert-section .th3 .div2,
    .sub0204 .cert-section .th4 .div2,
    .sub0204 .cert-section .th5 .div2{font-size:13px;}
    .sub0204 .cert-section .td .div3,
    .sub0204 .cert-section ._31,
    .sub0204 .cert-section ._6,
    .sub0204 .cert-section ._32,
    .sub0204 .cert-section ._53,
    .sub0204 .cert-section ._63,
    .sub0204 .cert-section ._59{font-size:12px;}
    /* 인증 이미지: 모바일에서 2열 배치 */
    .sub0204 .cert-section .img-wrap{gap:12px;}
    .sub0204 .cert-section .img-wrap .img{flex:0 1 calc((100% - 12px) / 2); min-width:0; padding:10px; height:120px;}
    .sub0204 .cert-section .img-wrap .img img{max-height:80px;}
    .sub0204 .cert-section .iso-9001,
    .sub0204 .cert-section .iso-14001,
    .sub0204 .cert-section .iso-37001,
    .sub0204 .cert-section .iso-45001{font-size:10px; top:auto; bottom:6px; left:50%; transform:translateX(-50%);}
}

/* ============ 공지 배지 ============ */
.notice-badge{display:inline-block; padding:2px 8px; border-radius:4px; background:#6ABF4B; color:#fff; font-size:12px; font-weight:600; letter-spacing:-0.2px; margin-right:6px; vertical-align:middle; line-height:1.4;}
.board-item--notice{position:relative;}
.board-item--notice a .img:after{border-color:#6ABF4B !important;}
/* ============ IR 테이블형 게시판 ============ */
/* 다른 서브페이지와 동일한 좌우 여백: max-width/margin 제거, .wrap 패딩에 위임 */
.board-table-wrap{margin-top:24px; overflow-x:auto; -webkit-overflow-scrolling:touch;}
.board-table{width:100%; min-width:560px; border-collapse:collapse; border-top:2px solid #000; font-size:15px; table-layout:fixed;}
.board-table col.col-num{width:70px;}
.board-table col.col-attach{width:70px;}
.board-table col.col-date{width:120px;}
.board-table thead th{padding:12px 16px; background:#f8f8f8; border-bottom:1px solid #ccc; font-weight:600; text-align:center; white-space:nowrap;}
.board-table tbody td{padding:14px 16px; border-bottom:1px solid #e8e8e8; vertical-align:middle;}
.board-table tbody tr:hover td{background:#f9fdf6;}
.board-table .td-num{text-align:center; color:#888; font-size:14px; overflow:hidden;}
.board-table .td-title{text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.board-table .td-title a{color:#222; text-decoration:none; display:block; overflow:hidden; text-overflow:ellipsis;}
.board-table .td-title a:hover{color:#6ABF4B; text-decoration:underline;}
.board-table .td-title .notice-badge{font-size:11px; padding:2px 6px; margin-right:6px;}
.board-table .td-attach{text-align:center; color:#6ABF4B; font-size:16px; overflow:hidden;}
.board-table .td-date{text-align:center; color:#888; font-size:14px; white-space:nowrap; overflow:hidden;}
.board-table .no-data{text-align:center; padding:60px 0; color:#aaa; font-size:15px;}
/* IR 게시판 페이지네이션 */
.board-paging{display:flex; justify-content:center; align-items:center; gap:6px; margin-top:32px;}
.board-paging button{min-width:36px; height:36px; padding:0 8px; border:1px solid #ddd; background:#fff; color:#444; font-size:14px; cursor:pointer; border-radius:4px; transition:all .15s;}
.board-paging button:hover,.board-paging button.active{background:#6ABF4B; color:#fff; border-color:#6ABF4B;}
.board-paging button:disabled{opacity:.4; cursor:default;}
/* DART 공시정보 iframe */
.dart-frame-wrap{
  max-width:760px;
  margin:24px auto 0;
  border:1px solid #e0e0e0;
  border-radius:4px;
  overflow:hidden; /* 이중 스크롤바 방지: iframe 내부 스크롤만 사용 */
}
.dart-frame-wrap iframe{
  display:block;
  width:760px;
  height:900px;
  border:0;
  overflow:auto;
}
.dart-fallback{display:none; padding:60px 24px; text-align:center;}
.dart-fallback p{color:#666; margin-bottom:20px; font-size:15px; line-height:1.7;}
.dart-fallback a.btn-dart{display:inline-block; padding:12px 32px; background:#6ABF4B; color:#fff; border-radius:4px; text-decoration:none; font-size:15px; font-weight:600;}
.dart-fallback a.btn-dart:hover{background:#5aaf3b;}
@media (max-width:768px){
  /* IR 테이블 반응형: 가로스크롤 방식 (폭 유지, overflow-x scroll) */
  .board-table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; margin-top:16px;}
  .board-table{min-width:480px; font-size:14px;}
  .board-table thead th{padding:10px 12px; font-size:13px;}
  .board-table tbody td{padding:10px 12px;}
  .board-table .td-num{font-size:13px;}
  .board-table .td-date{font-size:13px;}
  /* 모바일 검색 영역 */
  .board .board-search .search-inp{border:1px solid #e8e8e8; border-radius:4px;}
  /* 모바일: 가로 스크롤로 열람 */
  .dart-frame-wrap{
    max-width:100%;
    margin:16px 0 0;
    border-radius:0;
    border-left:0;
    border-right:0;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
  }
  .dart-frame-wrap iframe{
    width:760px;
    height:750px;
  }
}