/********************************************
* SUB 01
* CEO 인사말
********************************************/

.greeting-tit-wrap strong { display: block; margin-bottom: 7rem; font-size: 5.5rem; line-height: 6rem; } 
.greeting-tit-wrap strong, .greeting-tit-wrap strong em { font-weight: 800; } 
.greeting-tit-wrap strong em { font-size: 3.5rem; color: var(--main-color2); font-family: 'Montserrat' !important; } 

.sub-greeting-top { display: flex; align-items: center; gap: 5rem; margin-bottom: 7rem; } 
.sub-greeting-txt-wrap { width: 57%; } 
.sub-greeting-txt-wrap p {padding-bottom: 1.5rem; font-size: 2.2rem; font-weight: 300; color: #4b4b4b; } 
.sub-greeting-txt-wrap p.bold {font-size: 2.2rem; font-weight: 600; color: #272727; } 
.sub-greeting-txt-wrap p:nth-last-child(1) {padding-bottom: 0;}

.sub-greeting-ci { margin-top: 7rem; padding: 7rem 0; background-color: #f9f9f9; } 
.sub-con-col { display: flex; } 
.sub-con-col .sub-tit2-wrap { width: 20%; } 
.sub-con-col .sub-tit2-wrap h3 { margin-bottom: 2rem; padding-left: 1rem; font-size: 4.5rem; font-weight: 700; color: #333; } 
.sub-con-col .sub-tit2-wrap h3:before { content: ""; display: inline-block; width: 1rem; height: 1rem; background-color: var(--main-color); transform: translate(-1rem, -21px); } 
.sub-con-col .sub-tit2-wrap p { font-size: 1.8rem; color: #666; } 
.sub-greeting-top .sub-greeting-img-wrap { overflow: hidden; width: 60rem; border-radius: 3rem 0 3rem 0; } 
.sub-greeting-top .sub-greeting-img-wrap .sub-greeting-img { width: 100%; height: 40rem; background: url(/wp-content/uploads/2025/05/greeting-img.jpg) center center; background-size: cover; opacity: 1; } 
.sub-ci-wrap { display: flex; align-items: center; justify-content: center; gap: 3rem; width: 80%; height: 30rem; background: url(/wp-content/uploads/2025/05/ci-bg.jpg); } 
.sub-ci-wrap .detail-box b {display: inline-block; padding-bottom: 0.5rem; font-size: 2.1rem; font-weight: 700;}
.sub-ci-wrap .detail-box p {font-size: 1.7rem; font-weight: 500; color: #333;}


/********************************************
* SUB 02
* HISTORY 연혁
********************************************/

.sub-tit-wrap { margin-bottom: 7rem; } 
.history-top { padding: 15rem 0; background: url(/wp-content/uploads/2025/05/history-bg.jpg) top center; background-attachment: fixed; } 
.history-top strong { display: block; text-align: center; font-size: 4.5rem; } 
.history-wrap { position: relative; padding: 0rem 20rem; margin-top: 10rem; } 
.history-box-wrap { display: flex; } 
.history-wrap .history-box {position: relative;; width: 45%; padding: 3rem; border-radius:0 0 4rem 4rem; box-shadow: 0 0 10px #cfcfcf; } 
.history-left-box { justify-content: start; } 
.history-right-box { justify-content: end; margin-top: -15%;} 

.line-box { position: absolute; left: 50%; top: 0; height: 100%; width: 4px; background-color: #cfcfcf; } 
.line-wrap { position: relative; height: 100%; } 
.line-wrap .line { position: absolute; left: 0; top: 0; width: 4px; height: 0%; background-color: var(--main-color); } 

.years { margin: 1rem 0; font-family: 'Montserrat' !important; font-size: 3rem; font-weight: 700; color: var(--main-color); } 
/* .history-box-wrap + .history-box-wrap { margin-top: 3rem; }  */
.txt-wrap p { font-size: 1.8rem; color: #5b5b5b; } 

.history-box .img-con
{width: 100%; height: 25rem;}
.history-box .img-con img
{width: 100%; height: 100%; object-fit: cover; border-radius: 2rem;}
.history-wrap .history-box::before
{content: ""; position: absolute; top: 0; left: 0; width: 110%; height: 4px; background-color: var(--main-color);}
.history-right-box .history-box::before
{left: auto; right: 0;}
.history-wrap .history-box::after
{content: ""; position: absolute; top: 0; left: 111%; transform: translate(-40%, -40%);  width: 2rem; height: 2rem; border-radius: 50%; background-color: var(--main-color);}
.history-right-box .history-box::after
{left: auto; right: 107%;}

/********************************************
* SUB 03
* quality 품질인증
********************************************/


.sub-quality-wrap .container { display: flex; align-items: center; gap: 5rem; } 
.sub-quality-img { width: 60rem; } 
.sub-quality-txt-wrap { width: calc(100% - 65rem); } 
.sub-quality-txt-wrap strong { display: block; margin-bottom: 2rem; font-size: 5.5rem; } 
.sub-quality-txt-wrap p { font-size: 2.6rem; color: #5b5b5b; } 

.sub-con-col { display: flex; gap: 3rem; width: 100%; } 
.sub-ci-col-wrap { display: flex; flex-wrap: wrap; gap: 2rem; width: 80%; } 
.sub-ci-col-wrap .sub-ci-wrap { width: calc((100% - 2rem) / 2); padding: 4rem;} 

.sub-certificate-wrap { padding-top: 7rem; } 

.sub-certificate-wrap ul { display: flex; gap: 2rem; } 
.certificate-img { padding: 1rem; border: 1px solid #ddd; border-radius: 1rem; } 
.sub-certificate-wrap ul li p { text-align: center; margin-top: 2rem; font-size: 1.8rem; font-weight: 600; } 

/********************************************
* SUB 04
* Location 오시는길
********************************************/

.sub-location-col { display: flex; align-items: center; gap: 3rem; } 
.sub-location-left { width: 50%; } 
.sub-location-right { width: 50%; } 
.sub-location-tit-wrap { margin-bottom: 3rem; } 
.sub-location-tit-wrap h3 { font-size: 4.5rem; font-weight: 800; color: #333; } 
.sub-location-addr { width: 100%; padding: 5rem 6rem; border-radius: 2rem; background-color: var(--main-color2); } 
.sub-location-addr dl { display: flex; gap: 2rem; } 
.sub-location-addr dl + dl { margin-top: 2rem; } 
.sub-location-addr dl dt, .sub-location-addr dl dd { font-size: 2rem; color: #fff; } 
.sub-location-addr dl dt { min-width: 10rem; font-weight: 700; } 
.sub-location-addr dl dd { font-weight: 300; } 


/********************************************
* SUB 05
* Business 계약재배
********************************************/


.sub-business-col { display: flex; gap: 5rem; margin-bottom: 7rem; } 
.sub-business-left { margin-bottom: 5rem; } 
.sub-business-left,
.sub-business-right { width: 50%; } 
.sub-business-right { padding-top: 5rem; } 
.sub-business-right .sub-business-tit { width: 100%; height: 100%; background: url(/wp-content/uploads/2025/05/sub2-1-img02.jpg); background-size: cover; } 
.sub-business-right .sub-business-tit,
.sub-business-img-wrap { overflow: hidden; border-radius: 2rem; } 

.sub-business-right .sub-business-tit { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; } 

.sub-business-tit-wrap { margin-bottom: 3rem; } 
.sub-business-tit-wrap em { display: block; margin-bottom: 1rem; font-size: 1.8rem; font-weight: 700; color: var(--main-color2); } 
.sub-business-tit-wrap h3 { font-size: 4.5rem; font-weight: 800; color: #333; } 
.sub-business-top-txt p, .sub-business-top-txt p em { font-size: 2rem; color: #3b3b3b; } 
.sub-business-top-txt p em { font-weight: 600; } 

.sub-business-con-tf .sub-table-wrap table { table-layout: fixed; } 
.sub-business-wrap .sub-table-wrap { width: 100%; } 

.sub-business-col.sub-facility-col .sub-business-left .sub-business-tit { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; text-align: center; } 




/********************************************
* SUB 06
* Business 생산공정
********************************************/

.sub-business-wrap .container + .container { margin-top: 5rem; } 

.sub-business-con { padding-bottom: 7rem; } 
.sub-process-box + .sub-process-box { margin-top: 4rem; } 
.sub-process-list h5 { display: inline-block; margin-bottom: 2rem; padding: 0.7rem 3rem; border-radius: 3rem; background-color: var(--main-color); } 
.sub-process-list h5 em,
.sub-process-list h5 span { font-size: 2.2rem; color: #fff; } 
.sub-process-list h5 em { display: inline-block; margin-right: 1rem; font-weight: 800; } 
.sub-process-list ul { display: flex; flex-wrap: wrap; gap: 5rem; } 
.sub-process-list ul li { position: relative; width: calc((100% - 20rem) / 5); min-height: 17rem; padding: 2rem; border: 2px solid rgba(13, 98, 67, 0.3); } 
/* .sub-process-list ul li:after, */
/* .sub-process-list ul li:before { content: ""; position: absolute; right: -4.3rem; top: 50%; transform: translate(0, -50%); display: block; width: 3rem; height: 3rem; border-radius: 100%; }  */
.sub-process-list ul li:last-child:after,
.sub-process-list ul li:last-child:before { display: none; } 
/* .sub-process-list ul li:after { background: url(/wp-content/uploads/2025/05/process-arrow.png) no-repeat center center; }  */
/* .sub-process-list ul li:before { background-color: var(--main-color2); }  */
.process-tit { font-size: 2rem; font-weight: 800; color: var(--main-color2); margin-bottom: 1rem; } 
.process-tit~span { color: #5b5b5b; } 


/********************************************
* SUB 07
* Products 제품소개
********************************************/
.sub-prod-area { background: url(/wp-content/uploads/2025/05/prod-bg.jpg);  }

.sub-produts-list { padding-top: 7rem; padding-bottom: 1rem; } 
.sub-produts-list ul li { display: flex; align-items: center; gap: 7rem; padding-left: 1rem; } 
.sub-produts-list ul li + li { margin-top: 5rem; } 
.sub-products-img-wrap { width: 45%; padding: 3rem; border-radius: 2rem; background-color: #fff; box-shadow: 0 0 1rem rgba(0,0,0,0.1); } 
.sub-products-info { width: 55%; } 
.sub-products-info h4 { margin-bottom: 3rem; font-size: 3.5rem; font-weight: 700; color: #333; } 
.sub-products-txt { margin-bottom: 7rem; font-size: 2.4rem; color: #5b5b5b; } 
.sub-products-kg span { font-size: 2rem; } 
.sub-products-kg span:first-child { display: inline-block; margin-right: 2rem; padding: 0.5rem 3rem; border-radius: 3rem; color: #fff; background-color: var(--main-color2); } 


/********************************************
* SUB 08
* Business Area 사업영역
********************************************/

.sub-businessarea .container { padding-top: 10rem; } 
.sub-businessarea .container img { margin: 0 auto; } 
.sub-businessarea .container img.mobile-img {display: none; width: 65rem; height: 90rem; object-fit: none;}

/********************************************
* SUB 09
* 시설현황
********************************************/

.sub-facilities-img-wrap { display: flex; flex-wrap: wrap; gap: 1rem; } 
.sub-facilities-img-box { overflow: hidden; position: relative; border-radius: 1rem; } 
.sub-facilities-img-box p { position: absolute; left: 0; top: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; font-size: 3rem; color: #fff; background-color: rgba(0, 0, 0, 0.4); opacity: 0; transition: all .3s; } 
.sub-facilities-img-box:hover p { opacity: 1; } 

@media screen and (max-width: 1400px) {
.history-wrap {padding: 0 6rem;}
}
@media screen and (max-width: 1300px) {
  /* 헤더가 fixed일때, 화면가려짐 */
  #subTop ,#target1,#target2,#target3 {margin-top: -7rem; padding-top: 10rem;}

/* 서브페이지 */
.sub-business-con {padding-bottom: 4rem;}
/*제품소개 */
.sub-business-right .sub-business-tit {padding: 3rem 1rem;}
.sub-facilities-img-wrap {justify-content: space-around;}
.sub-facilities-img-box {width: calc((100% / 3) - 1rem);}
.sub-process-list ul {gap: 3rem;}
.sub-process-list ul li {width: calc((100% - 6rem) / 3);}
/* 회사소개 */
.sub-quality-wrap .container,.sub-con-col {flex-flow: row wrap;}
.sub-con-col .sub-tit2-wrap,.sub-ci-col-wrap {width: 100%; margin: 0;}
.sub-quality-wrap .container {gap: 3rem;}
.sub-quality-txt-wrap,.sub-quality-img {width: calc((100% - 3rem) / 2);}

.sub-greeting-top {gap: 3rem;}
.sub-greeting-top .sub-greeting-img-wrap,.sub-greeting-txt-wrap {width: calc((100% - 3rem) / 2);}
.greeting-tit-wrap strong {margin-bottom: 6rem;}
}

@media screen and (max-width: 1024px) {
/* 제품소개 */
.sub-business-col {gap: 2rem; margin-bottom: 4rem;}
.sub-business-tit-wrap {margin-bottom: 2rem;}
.sub-business-tit-wrap em {font-size: 1.6rem;}
.sub-business-tit-wrap h3 {font-size: 3rem;}
.sub-business-top-txt p, .sub-business-top-txt p em {font-size: 1.8rem;}
.sub-produts-list ul li {gap: 3rem; padding-left: 0;}
.sub-products-img-wrap {padding: 2rem;}
.sub-products-info h4 {font-size: 3rem; margin-bottom: 2rem;}
.sub-products-txt {font-size: 1.8rem; margin-bottom: 4rem;}
.sub-products-kg span {font-size: 1.6rem;}
.sub-products-kg span:first-child {margin-right: 1rem;}
.sub-tit2-wrap {margin-bottom: 2rem;}
.sub-tit2-wrap h4:before {top: 1rem;}
.sub-tit2-wrap h4 {font-size: 2.4rem;}
.sub-process-list ul li {width: calc((100% - 3rem) / 2);}
.sub-process-list ul li:nth-child(even)::before {display: none;}
.process-tit {font-size: 1.8rem;}
.sub-process-list h5 {padding: 0.7rem 2rem;}
.sub-process-list h5 em, .sub-process-list h5 span {font-size: 1.8rem;}
.sub-facilities-img-box {width: calc((100% / 2) - 1rem);}

.sub-facilities-img-box img {width: 100%; height: 100%; object-fit: cover;}
.sub-facilities-img-box p {font-size: 1.8rem;}
.sub-ci-col-wrap .sub-ci-wrap {width: 100%; justify-content: flex-start;}

/* 회사소개 */
.sub-location-col {flex-direction: column-reverse;}
.sub-location-left,.sub-location-right {width: 100%;}
.sub-location-right iframe {height: 30rem;}
.sub-location-tit-wrap {margin-bottom: 2rem;}
.sub-location-tit-wrap h3 {font-size: 2.8rem;}
.sub-location-addr {padding: 3rem;}
.sub-location-addr dl dt, .sub-location-addr dl dd {font-size: 1.8rem;}
.sub-location-addr dl+dl {margin-top: 1rem;}

.sub-quality-txt-wrap strong {font-size: 3rem; margin-bottom: 1rem;}
.sub-quality-txt-wrap p {font-size: 2rem;}
.sub-quality-txt-wrap, .sub-quality-img {width: 100%;}
.sub-quality-img img {width: 100%; height: 30rem; object-fit: cover;}
.sub-con-col .sub-tit2-wrap h3 {position: relative; font-size: 3rem; padding-left: 2rem;}
.sub-con-col .sub-tit2-wrap h3:before {position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.sub-con-col .sub-tit2-wrap p {font-size: 1.6rem;}
.sub-greeting-ci { margin-top: 6rem; padding: 6rem 0; }
.sub-certificate-wrap ul {flex-flow: row wrap; justify-content: space-around;}
.sub-certificate-wrap ul li {width: calc(50% - 2rem);}
.sub-certificate-wrap ul li p {font-size: 1.6rem;}
.sub-certificate-wrap {padding-top: 6rem;}

.history-top {padding: 6rem 0; margin-top: 3rem;}
.history-top strong {font-size: 3.2rem; line-height: 1.3;}
.history-wrap {margin-top: 6rem;}
.history-wrap .history-box {padding: 2rem;}
.years {font-size: 2.1rem; line-height: 1.2; margin-bottom: 1.5rem;}
.txt-wrap p {font-size: 1.6rem;}
.history-box .img-con {height: 20rem;}
.history-right-box .history-box::after {right: 105%;}

.greeting-tit-wrap strong em {font-size: 2.4rem;}
.greeting-tit-wrap strong {font-size: 3.2rem; margin-bottom: 4rem; line-height: 4rem;}
.sub-greeting-top {flex-flow: row wrap; margin-bottom: 0;}
.sub-greeting-top .sub-greeting-img-wrap, .sub-greeting-txt-wrap {width: 100%;}
.sub-greeting-txt-wrap p {font-size: 1.8rem; padding-bottom: 1rem;}
.sub-greeting-txt-wrap p.bold {font-size: 1.8rem;}
.sub-ci-wrap {width: 100%;}

}
@media screen and (max-width: 767px) {
.history-wrap {padding: 0;}
.history-right-box {margin-top: 0;}
.history-left-box {justify-content: flex-end;}
.history-box-wrap {margin-bottom: 4rem;}
.history-wrap .history-box {display: flex; gap: 8rem; width: 100%; box-shadow: none; padding: 0;}
.history-box .img-con {width: 21rem; position: relative;}
.history-box .img-con::after
{content: ""; position: absolute; right: -4rem; bottom: 0; width: 2px; height: 80%; background-color: var(--main-color);}
.history-wrap .history-box::before {display: none;}
.history-right-box .history-box::after {display: none;}
.history-wrap .history-box::after {display: none;}
.line-box {display: none;}
.years {position: relative; margin-top: 0; margin-bottom: 1rem;}
.years::after
{content: ""; position: absolute; left: -4rem; top: 50%; transform: translate(-50%,-50%); width: 2rem; height: 2rem; border-radius: 50%; background-color: var(--main-color); z-index: 1;}
.years::before
{content: ""; position: absolute; left: -4rem; top: 50%; transform: translate(-50%, -50%); width: 1rem; height: 1rem; border-radius: 50%; background-color: #fff; z-index: 2;}
.history-box .txt-wrap {position: relative;}

}
@media screen and (max-width: 650px) {
.sub-quality-wrap .container {padding-top: 6rem; width: 100%;}
.sub-businessarea .container img.pc-img {display: none;}
.sub-businessarea .container img.mobile-img {display: block;}
/* 제품소개 */
.sub-produts-list{padding-top: 6rem;}
.sub-business-col {flex-direction: column;}
.sub-business-left, .sub-business-right {width: 100%;}
.sub-business-left {margin-bottom: 0;}
.sub-business-right {padding-top: 0;}
.sub-business-tit-wrap em {margin-bottom: 0.5rem; font-size: 1.4rem;}
.sub-business-tit-wrap {margin-bottom: 1rem;}
.sub-business-tit-wrap h3 {font-size: 2.4rem;}
.sub-business-top-txt p, .sub-business-top-txt p em {font-size: 1.6rem;}

.sub-produts-list ul li {flex-direction: column; margin-bottom: 0;}
.sub-products-img-wrap,.sub-products-info {width: 100%;}
.sub-products-info h4 {font-size: 1.8rem; margin-bottom: 1rem;}
.sub-products-txt {font-size: 1.6rem; margin-bottom: 2rem;}
.sub-products-kg span {font-size: 1.4rem;}
.sub-products-kg span:first-child {padding: 0.5rem 2rem;}
.sub-table-wrap td {font-size: 1.2rem; word-break: auto-phrase;}
table tfoot th, table thead th,table td, table th {font-size: 1.3rem; padding: 0.5rem;}
table {margin-block-end:0;}
.sub-business-wrap .container+.container {margin-top: 2rem;}
.sub-tit2-wrap h4:before {width: 0.5rem; height: 0.5rem;}
.sub-tit2-wrap h4 {font-size: 2rem; padding: 0; padding: 0 0 1rem 1rem;}

.sub-process-list ul {gap: 2rem;}
.sub-process-list ul li {width: calc((100% - 2rem) / 2); min-height: 0; padding: 1.5rem;}
 /* .sub-process-list ul li:before {width: 2rem; height: 2rem; right: -2.5rem;} */
/* .sub-process-list ul li:after{width: 1rem; height: 1rem; right: -2rem; background: url(/wp-content/uploads/2025/05/process-arrow.png) no-repeat center / cover;} */
.sub-facilities-img-box p {font-size: 1.8rem;}
.sub-img-wrap iframe {height: 40rem;}
.sub-facilities-img-box {width: 100%;}
/* 회사소개 */
.sub-location-tit-wrap h3 {font-size: 2.1rem;}
.sub-location-addr {padding: 2rem;}
.sub-location-addr dl dt, .sub-location-addr dl dd {font-size: 1.6rem;}
.sub-location-addr dl dt {min-width: 7rem;}

.sub-quality-txt-wrap strong {font-size: 2.8rem; line-height: 1.3;}
.sub-quality-txt-wrap p {font-size: 1.8rem;}
.sub-quality-img img {height: 25rem;}
.sub-con-col .sub-tit2-wrap h3 {font-size: 2.4rem; margin-bottom: 1rem;}
.sub-greeting-ci {margin-top: 4rem; padding: 4rem 0;}

.history-top {padding: 4rem 0;}
.history-top strong {font-size: 2.4rem;}
.sub-area2 {padding: 0 0 6rem 0;}

.history-box .img-con {width: 15rem; height: 15rem;}
.history-wrap .history-box {gap: 4rem;}
.history-box .img-con::after {right: -2rem;}
.years::before,.years::after {left: -2rem;}

.greeting-tit-wrap strong {font-size: 2.4rem; line-height: 1.3;}
.greeting-tit-wrap strong em {display: inline-block; font-size: 1.8rem; padding-bottom: 1rem;}
.sub-greeting-top .sub-greeting-img-wrap .sub-greeting-img {height: 25rem;}
.sub-greeting-txt-wrap p,.sub-greeting-txt-wrap p.bold {font-size: 1.6rem;}

.process-tit {font-size: 1.6rem; line-height: 1.2; margin-bottom: 0;}
.process-tit br {display: none;}
.process-tit~span {font-size: 1.4rem; display: inline-block; margin-top: 0.5rem;}
.sub-business-con .info {font-size: 1.4rem;}

.sub-ci-wrap {gap: 2rem;}
.sub-ci-col-wrap .sub-ci-wrap {padding: 2rem;}
.sub-ci-wrap .detail-box b {font-size: 1.6rem;}
.sub-ci-wrap .detail-box p {font-size: 1.4rem;}

}
@media screen and (max-width: 460px) {
.years {font-size: 1.6rem;}
.txt-wrap p {font-size: 1.4rem;}
.years::before  {width: 0.5rem; height: 0.5rem;}
.years::after {width: 1.5rem; height: 1.5rem;}
.history-box .img-con {width: 10rem; min-width: 10rem; height: 10rem;}

}
@media screen and (max-width: 430px) {
.sub-location-addr dl {flex-direction: column; gap: 1rem;}
.sub-location-addr dl+dl {margin-top: 2rem;}
/* 회사소개 */
.sub-certificate-wrap ul li {width: 100%;}
.sub-certificate-wrap ul li p {margin-top: 1rem;}

.history-top {font-size: 2.1rem;}
.sub-img-wrap iframe {height: 20rem;}

.sub-ci-col-wrap .sub-ci-wrap {flex-flow: row wrap; justify-content: center; gap: 0;}
.sub-process-list ul {gap: 1.5rem;}
.sub-process-list ul li {width: calc((100% - 1.5rem) / 2);}
}
