@charset "UTF-8";

/* page title */
.page-tit { font-weight: 100;}

/* intro */
.content-wrap.intro {padding-bottom: 100px;}
.intro figure {margin: 0 auto;} 
.intro .brand-value-system figure {width: 834px;}
.intro .brand-structure figure {width: 1280px;}

/* logo */
.intro .brand-kv .group-logo {width: 146px;}
.retail .brand-kv .group-logo {width: 294px;}
.logis  .brand-kv .group-logo {width: 281px;}
.networks .brand-kv .group-logo {width: 421px;}
.food .brand-kv .group-logo {width: 306px;}
.humannet .brand-kv .group-logo {width: 457px;}
.kopla .brand-kv .group-logo {width: 512px;}

.content {padding-bottom: 0;}

.brand-kv .group-logo {margin: 0 auto;}
.brand-kv .txt {text-align: center; margin-bottom: 50px;}
.brand-kv .txt .tit {font-size: 32px; margin: 20px 0 8px;}
.brand-kv .txt .desc p {letter-spacing: -.063em;}
.brand-assignment {padding-bottom: 80px; border-bottom: 1px solid #ddd;}
.brand-assignment figure {width: 471px; margin: 0 auto; padding-top: 16px;}

.group-info {width: 100%; margin-top: 100px; padding: 56px 0 70px;}
.group-info .tit {font-size: 28px; line-height: 1.29; color: #0e1518; text-align: center; margin-bottom: 55px;}
.group-info .tit .link-btn {display: inline-block; width: 36px; height: 36px; background: no-repeat right center / contain; background-image: url('/assets/image/bgf/company/group/icon_home36.png'); vertical-align: top; margin-left: 15px;}
.group-info .txt > div {padding: 0 81px;}
.group-info .txt > div dl {font-size: 0;}
.group-info .txt > div dl > * {display: inline-block; font-size: 16px; line-height: 2.13;}
.group-info .txt > div dt {width: 130px; vertical-align: top; color: #0e1518;}
.group-info .txt > div dd {width: calc(100% - 130px); color: #666;} 


/* info img */
.content-wrap.intro {padding-top: 0;}
.brand-structure .brand-title {font-size: 16px; line-height: 1.2; text-align: center;letter-spacing: -0.03em; padding-bottom: 30px; color: #3bb149;}
.brand-structure .brand_map {display: flex;align-items: center; justify-content: center;}
.brand-structure .brand_map .line-box {margin: 0 0 90px; width: 1280px; height: 523px; background: url("/assets/image/bgf/eng/company/group/intro/20251219_line.png") no-repeat center; background-position-y: -50px; position: relative;}
.brand-structure .brand_map .line-box .bgf {width: 118px; height: 117px; position: absolute; top: 0; left: 580px;}
.brand-structure .brand_map .line-box .retail {width: 185px; height: 137px; position: absolute; top: 180px; left: 227px;}
.brand-structure .brand_map .line-box .ecomaterials {width: 165px; height: 137px; position: absolute; top: 180px; left: 878px;}
.brand-structure .brand_map .line-box .logis {width: 90px; height: 90px; position: absolute; top: 367px; left: 123px;}
.brand-structure .brand_map .line-box .networks {width: 90px; height: 90px; position: absolute; top: 367px; left: 223px;}
.brand-structure .brand_map .line-box .foods {width: 90px; height: 90px; position: absolute; top: 367px; left: 323px;}
.brand-structure .brand_map .line-box .humannet {width: 90px; height: 90px; position: absolute; top: 367px; left: 423px;}
.brand-structure .brand_map .line-box .ecosolution {width: 90px; height: 90px; position: absolute; top: 367px; left: 762px;}
.brand-structure .brand_map .line-box .ecocycle {width: 90px; height: 90px; position: absolute; top: 367px; left: 1062px;}
.brand-structure .brand_map .line-box .knw {width: 90px; height: 90px; position: absolute; top: 367px; left: 861px;}
.brand-structure .brand_map .line-box .fluorinekorea {width: 90px; height: 90px; position: absolute; top: 367px; left: 962px;}
.brand-structure .brand_map .line-box .daewonchemical {width: 90px; height: 90px; position: absolute; top: 367px; left: 947px;}


@media screen and (max-width: 1440px) {
	.content-wrap.intro {padding-bottom: 6.94vw;}

	.intro .brand-value-system figure {width: 57.92vw;}
	.intro .brand-structure figure {width: 88.89vw;}

	.intro .brand-kv .group-logo {width: 10.14vw;}
	.retail .brand-kv .group-logo {width: 20.42vw;}
	.logis .brand-kv .group-logo {width: 19.51vw;}
	.networks .brand-kv .group-logo {width: 29.24vw;}
	.food .brand-kv .group-logo {width: 21.25vw;}
	.humannet .brand-kv .group-logo {width: 31.74vw;}
	.eco .brand-kv .group-logo {width: 22.64vw;}
	.kopla .brand-kv .group-logo {width: 35.56vw;}

	.brand-kv .txt {margin-bottom: 3.47vw;}
	.brand-kv .txt .tit {font-size: 2.22vw; margin: 1.39vw 0 0.56vw;}
	.brand-assignment {padding-bottom: 5.56vw;}
	.brand-assignment figure {width: 32.71vw; margin: 0 auto; padding-top: 1.11vw;}

	.group-info {margin-top: 6.94vw; padding: 3.89vw 0 4.86vw;}
	.group-info .tit {font-size: 1.94vw; line-height: 1.29; margin-bottom: 3.82vw;}
	.group-info .tit .link-btn {width: 2.50vw; height: 2.50vw; margin-left: 1.04vw;}
	.group-info .txt > div {padding: 0 5.63vw;}
	.group-info .txt > div dl > * { font-size: 1.11vw; line-height: 2.13;}
	.group-info .txt > div dt {width: 9.03vw;}
	.group-info .txt > div dd {width: calc(100% - 9.03vw); } 

	/* info img */
	.content-wrap.intro {padding-top: 0;}
	.brand-structure .brand-title {font-size: 1.11vw; line-height: 1.2; letter-spacing: -0.03em; padding-bottom: 2.08vw;}
	.brand-structure .brand_map {align-items: center;}
	.brand-structure .brand_map .line-box {margin: 0 0 6.25vw; width: 88.89vw; height: 36.32vw; background: url("/assets/image/bgf/eng/company/group/intro/20251219_line.png") no-repeat 100% 100%;  background-size: cover; background-position-y: -3.47vw; }
	.brand-structure .brand_map .line-box .bgf {width: 8.19vw; height: 8.13vw;  top: 0; left: 40.28vw;}
	.brand-structure .brand_map .line-box .retail {width: 12.85vw; height: 9.51vw;  top: 12.50vw; left: 15.76vw;}
	.brand-structure .brand_map .line-box .ecomaterials {width: 11.46vw; height: 9.51vw;  top: 12.50vw; left: 60.97vw;}
	.brand-structure .brand_map .line-box .logis {width: 6.25vw; height: 6.25vw;  top: 25.49vw; left: 8.54vw;}
	.brand-structure .brand_map .line-box .networks {width: 6.25vw; height: 6.25vw;  top: 25.49vw; left: 15.49vw;}
	.brand-structure .brand_map .line-box .foods {width: 6.25vw; height: 6.25vw;  top: 25.49vw; left: 22.43vw;}
	.brand-structure .brand_map .line-box .humannet {width: 6.25vw; height: 6.25vw;  top: 25.49vw; left: 29.38vw;}
	.brand-structure .brand_map .line-box .ecosolution {width: 6.25vw; height: 6.25vw;  top: 25.49vw; left: 52.92vw;}
	.brand-structure .brand_map .line-box .ecocycle {width: 6.25vw; height: 6.25vw;  top: 25.49vw; left: 73.75vw;}
	.brand-structure .brand_map .line-box .knw {width: 6.25vw; height: 6.25vw;  top: 25.49vw; left: 59.79vw;}
	.brand-structure .brand_map .line-box .fluorinekorea {width: 6.25vw; height: 6.25vw;  top: 25.49vw; left: 66.81vw;}
	.brand-structure .brand_map .line-box .daewonchemical {width: 6.25vw; height: 6.25vw; top: 25.49vw; left: 66.15vw;}
}

@media screen and (max-width: 768px) {
	/*intro*/
	.content-wrap.intro {padding-bottom: 6.19vw;}

	.intro ul li h4 {font-size: 2.86vw; color: #0e1517;}
	.intro ul li p {font-size: 2.62vw;}

	.intro .brand-value-system ul li {width: 30.95vw; height: 30.95vw; margin: 3.57vw auto 0; text-align: center; border: 1.19vw solid #adb2b5; border-radius: 50%;}
	.intro .brand-value-system ul li p {color: #999;} 
	.intro .brand-value-system ul li h4 {padding-bottom: 0.71vw; border-bottom: 0.24vw solid #ccc; font-weight: 400;}
	.intro .brand-value-system ul li strong {display:block; color: #3bb149; padding-top: 1.19vw; font-size: 2.86vw; font-weight: 600; line-height: 1.4;}

	.intro .brand-structure figure {width: 47.14vw; margin: 0;}
	.intro .brand-kv .txt {margin-bottom: 11.90vw;}
	.intro .brand-structure .txt h4{font-weight: 600;}
	.intro .brand-structure .txt p{line-height: 1.4;}

	.intro .brand-structure .brand_map {position: relative; display: flex; justify-content: center; height: 120.33vw;}
	.intro .brand-structure .brand_map_desc {width: 26.43vw;}
	.intro .brand-structure .brand_map_desc ul li {position: absolute; left: 58.62vw;}
	.intro .brand-structure .brand_map_desc ul li:nth-child(1){top: 5.05vw; width: 28%;}
	.intro .brand-structure .brand_map_desc ul li:nth-child(2){top: 72.57vw;width: 29%;}
	.intro .brand-structure .brand_map_desc ul li:nth-child(3){top: 90.19vw;width: 29%;}
	.intro .brand-structure .brand_map_desc ul li:nth-child(4){top: 109vw;width: 24%;}

	/* common */
	.content-wrap {padding-top: 9.52vw;}
	.sec-tit {margin-bottom: 6.43vw; line-height: 1.1;}

	.intro .brand-kv .group-logo {width: 21.43vw;}
	.retail .brand-kv .group-logo {width: 42.62vw;}
	.logis .brand-kv .group-logo {width: 38.10vw;}
	.networks .brand-kv .group-logo {width: 57.62vw;}
	.food .brand-kv .group-logo {width: 41.90vw;}
	.humannet .brand-kv .group-logo {width: 61.43vw;}
	.eco .brand-kv .group-logo {width: 44.76vw;}
	.kopla .brand-kv .group-logo {width: 76.95vw;}

	.brand-kv .txt {text-align: center; margin-bottom: 9.52vw;}
	.brand-kv .txt .tit { font-size: 3.81vw; font-weight: 700; margin: 2.38vw 0 0.71vw; line-height: normal; letter-spacing: -0.03em;}
	.brand-kv .txt .desc p {font-weight: 400; letter-spacing: 0;}
	.brand-kv .kv-obj {height: 35.71vw; overflow: hidden;}
	.brand-kv .kv-obj img {width: auto; height: 100%; position: relative; left: 50%; transform: translateX(-50%);}
	.sec.brand-structure {margin-top: 11.90vw;}
	.sec.brand-assignment {margin: 11.90vw 4.76vw 0; padding-bottom: 13.10vw;}
	.m-full .sec.brand-assignment {margin: 11.90vw 4.76vw 0; padding-bottom: 13.10vw;}
	.sec.brand-assignment figure {width: 56.19vw; padding-top: 0;}

	.group-info {margin-top: 9.52vw; padding: 5.95vw 0 10.71vw;}
	.group-info .row {padding: 0;}
	.group-info .tit {font-size: 3.81vw; font-weight: 700; line-height: 1.29; text-align: left; margin-bottom: 2.62vw;}
	.group-info .tit .link-btn {width: 4.76vw; height: 4.76vw; margin-left: 2.38vw; background-image: url('/assets/image/bgf/company/group/icon_home36-m.png');}
	.group-info .txt > div {padding: 0;}
	.group-info .txt > div dl > * {font-size: 2.86vw; line-height: 1.5; padding: 1.67vw 0;}
	.group-info .txt > div dt {width: 23.81vw;}
	.group-info .txt > div dd {width: calc(100% - 23.81vw); } 
	.m-full .sec.brand-structure { padding: 0;}

	/* info img */
	.content-wrap.intro {padding-bottom: 6.19vw;}
	.brand-structure .brand-title {font-size: 2.08vw;font-weight: 500;padding-bottom: 4.69vw;}
	.brand-structure .brand_map .line-box {margin: 0 0 13.80vw; width: 100%; height: 102.99vw; background: url("/assets/image/bgf/eng/company/group/intro/20251219_line_mo.png") no-repeat 100% 100%; background-size: cover; background-position-y: -5.21vw;}
	.brand-structure .brand_map .line-box .bgf {width: 19.53vw; height: 19.53vw; top: 0; left: 40.23vw;}
	.brand-structure .brand_map .line-box .retail {width: 23.05vw; height: 21.22vw; top: 25.39vw; left: 16.75vw;}
	.brand-structure .brand_map .line-box .ecomaterials {width: 21.22vw; height: 21.22vw; top: 25.39vw; left: 61.03vw;}
	.brand-structure .brand_map .line-box .logis {width: 13.80vw; height: 13.80vw; top: 51.69vw; left: 13.4vw;}
	.brand-structure .brand_map .line-box .networks {width: 13.80vw; height: 13.80vw; top: 51.69vw; left: 28.85vw;}
	.brand-structure .brand_map .line-box .foods {width: 13.80vw; height: 13.80vw; top: 68.23vw; left: 13.4vw;}
	.brand-structure .brand_map .line-box .humannet {width: 13.80vw; height: 13.80vw; top: 68.23vw; left: 28.85vw;}
	.brand-structure .brand_map .line-box .ecosolution {width: 13.80vw; height: 13.80vw; top: 51.69vw; left: 56.82vw;}
	.brand-structure .brand_map .line-box .ecocycle {width: 13.80vw; height: 13.80vw; top: 51.69vw; left: 72.34vw;}
	.brand-structure .brand_map .line-box .knw {width: 13.80vw; height: 13.80vw; top: 68.23vw; left: 56.82vw;}
	.brand-structure .brand_map .line-box .fluorinekorea {width: 13.80vw; height: 13.80vw; top: 68.23vw; left: 72.34vw;}
	.brand-structure .brand_map .line-box .daewonchemical {width: 13.80vw; height: 13.80vw; top: 84.23vw; left: 36.72vw;}
}

@media screen and (max-width: 350px) {
	.group-info .txt > div dl > * {font-size: 10px;}
}

@media screen and (max-width: 320px) {
	/*intro*/
	.content-wrap.intro {padding-bottom: 20px;}

	.intro ul li h4 {font-size: 9px; }
	.intro ul li p {font-size: 8px;}

	.intro .brand-value-system ul li {width: 99px; height: 99px; margin: 11px auto 0; border: 4px solid #adb2b5;}
	.intro .brand-value-system ul li h4 {padding-bottom: 2px;}
	.intro .brand-value-system ul li strong { padding-top: 4px; font-size: 9px;}

	.intro .brand-structure figure {width: 151px;}
	.intro .brand-kv .txt {margin-bottom: 38px;}
	
	.intro .brand-structure .brand_map {height: 385px;}
	.intro .brand-structure .brand_map_desc {width: 85px;}
	.intro .brand-structure .brand_map_desc ul li {left: 188px;}
	.intro .brand-structure .brand_map_desc ul li:nth-child(1){top: 16px;}
	.intro .brand-structure .brand_map_desc ul li:nth-child(2){top: 136px;}
	.intro .brand-structure .brand_map_desc ul li:nth-child(3){top: 196px;}
	.intro .brand-structure .brand_map_desc ul li:nth-child(4){top: 259px;}

	/* common */
	.content-wrap {padding-top: 30px;}
	.sec-tit {margin-bottom: 21px;}

	.intro .brand-kv .group-logo {width: 69px;}
	.retail .brand-kv .group-logo {width: 136px;}
	.logis .brand-kv .group-logo {width: 122px;}
	.networks .brand-kv .group-logo {width: 184px;}
	.food .brand-kv .group-logo {width: 134px;}
	.humannet .brand-kv .group-logo {width: 197px;}
	.eco .brand-kv .group-logo {width: 143px;}
	.kopla .brand-kv .group-logo {width: 246px;}

	.brand-kv .txt { margin-bottom: 30px;}
	.brand-kv .txt .tit { font-size: 12px;  margin: 8px 0 2px;}
	.brand-kv .kv-obj {height: 114px;}
	.sec.brand-structure {margin-top: 38px;}
	.sec.brand-assignment {margin: 38px 15px 0; padding-bottom: 42px;}
	.sec.brand-assignment figure {width: 180px;}
	.m-full .sec.brand-assignment {margin: 38px 15px 0; padding-bottom: 42px;}

	.group-info {margin-top: 30px; padding: 19px 0 34px;}
	.group-info .tit {font-size: 12px; margin-bottom: 8px;}
	.group-info .tit .link-btn {width: 15px; height: 15px; margin-left: 8px;}
	.group-info .txt > div dl > * {font-size: 9px; padding: 5px 0;}
	.group-info .txt > div dt {width: 76px;}
	.group-info .txt > div dd {width: calc(100% - 76px); } 


	/*intro*/
	.content-wrap.intro {padding-bottom: 20px;}
	.brand-structure .brand-title {font-size: 7px;padding-bottom: 15px;}
	.brand-structure .brand_map .line-box {margin: 0 0 44px; width: 100%; height: 330px; background: url("/assets/image/bgf/eng/company/group/intro/20251219_line_mo.png") no-repeat 100% 100%; background-size: cover; background-position-y: -17px;}
	.brand-structure .brand_map .line-box .bgf {width: 62px; height: 62px; top: 0; left: 129px;}
	.brand-structure .brand_map .line-box .retail {width: 74px; height: 68px; top: 81px; left: 54px;}
	.brand-structure .brand_map .line-box .ecomaterials {width: 68px; height: 68px; top: 81px; left: 196px;}
	.brand-structure .brand_map .line-box .logis {width: 44px; height: 44px; top: 165px; left: 43px;}
	.brand-structure .brand_map .line-box .networks {width: 44px; height: 44px; top: 165px; left: 92px;}
	.brand-structure .brand_map .line-box .foods {width: 44px; height: 44px; top: 218px; left: 43px;}
	.brand-structure .brand_map .line-box .humannet {width: 44px; height: 44px; top: 218px; left: 92px;}
	.brand-structure .brand_map .line-box .ecosolution {width: 44px; height: 44px; top: 165px; left: 182px;}
	.brand-structure .brand_map .line-box .ecocycle {width: 44px; height: 44px; top: 165px; left: 231px;}
	.brand-structure .brand_map .line-box .knw {width: 44px; height: 44px; top: 218px; left: 182px;}
	.brand-structure .brand_map .line-box .fluorinekorea {width: 44px; height: 44px; top: 218px; left: 231px;}
	.brand-structure .brand_map .line-box .daewonchemical {width: 44px; height: 44px; top: 269px; left: 118px;}
}