﻿
.dc_en {font-family: var(--font-pb); font-size: 26px; margin-bottom: 10px;}
.dc_ko {font-family: var(--font-b); font-size: 26px;}


.business_wrap .sub_box > div {margin-bottom: 120px;}

.business_con .inner {display: flex; text-align: left;}
.business_con .inner > div {width: 50%;}
.business_con .right {font-size: 15px; line-height: 22px; font-family: var(--font-l);}
.business_gray {background-color: #f7f7f7; padding: 120px 0;}

.logo_bundle {display: flex; flex-wrap: wrap; margin-top: 30px;}
.logo_bundle > div {border: 1px solid var(--l-color); background-color: #fff; width: 100px; height: 37px; display: flex; align-items: center; justify-content: center; margin-right: 5px; margin-bottom: 5px;}
.logo_bundle > div img {margin: 0 auto; display: block;}

/* 상품개발 */
.develop_wrap .con_top {background: url(/Content/img/product.png) no-repeat center 0; background-size: cover; position: relative;}
.develop_wrap .develop_con2 ul {display: flex; flex-wrap: wrap;}
.develop_wrap .develop_con2 ul li {display: flex; width: calc((100% - 20px)/2); background-color: #f7f7f7; border-radius: 20px; align-items: center; margin: 0 20px 20px 0; overflow: hidden;}
.develop_wrap .develop_con2 ul li:nth-of-type(2n) {margin: 0 0 20px 0;}
.develop_wrap .develop_con2 ul li .left {position: relative;}
.develop_wrap .develop_con2 ul li .left img {display: block;}
.develop_wrap .develop_con2 ul li .left span {position: absolute; left: 50%; transform: translateX(-50%); top: 30px; font-size: 22px; font-family: var(--font-pb); color: #fff;}
.develop_wrap .develop_con2 ul li .right {text-align: left; padding: 0 30px;}
.develop_wrap .develop_con2 ul li .right p {font-family: var(--font-sb); font-size: 20px; margin-bottom: 20px;}
.develop_wrap .develop_con2 ul li .right span {font-size: 14px; line-height: 18px;}

.develop_wrap .develop_con .inner {display: flex; justify-content: space-between;}
.develop_wrap .develop_con .left {text-align: left;}
.develop_wrap .develop_con .left span {font-size: 15px; margin-top: 40px; line-height: 22px; font-family: var(--font-l); display: inline-block; width: 100%;}
.develop_wrap .develop_con .left span::before {content: ""; display: block; background-color: var(--m-color); width: 40px; height: 5px; margin-bottom: 40px;}
.develop_wrap .develop_con .right div {display: flex; justify-content: space-between; margin-top: 8px;}


/* 유통사업 */
.dst_wrap .con_top {background: url(/Content/img/distribution.png) no-repeat center 0; background-size: cover; position: relative;}
.dst_wrap .dst_con2 ul {display: flex; flex-wrap: wrap;}
.dst_wrap .dst_con2 ul li {width: 50%; display: flex; align-items: center; margin-bottom: 15px;}
.dst_wrap .dst_con2 ul li .import_txt {padding-left: 30px;}
.dst_wrap .dst_con2 ul li .import_txt > p {margin-bottom: 10px; font-family: var(--font-sb); color: var(--m-color); font-size: 14px;}
.dst_wrap .dst_con2 ul li .import_txt > p > span {font-family: var(--font-ps); color: var(--m-color); font-size: 14px;}
.dst_wrap .dst_con2 ul li .import_txt > p > span::after {content: ""; display: inline-block; width: 2px; height: 11px; background-color: var(--m-color); margin: 0 12px;}
.dst_wrap .dst_con2 ul li .import_txt > span {font-size: 13px; color: var(--g-color); font-family: var(--font-l); line-height: 18px; display: inline-block; width: 100%;}
.dst_wrap .dst_con2 ul li .import_txt a {font-size: 10px; padding: 4px 18px; margin-top: 5px;}

.dst_wrap .dst_con3 .inner ul li {display: flex; margin-bottom: 80px; position: relative;}
.dst_wrap .dst_con3 .inner ul li .right {padding: 60px 0 60px 60px; text-align: left;}
.dst_wrap .dst_con3 .inner ul li .right .distribution_mark {position: absolute; bottom: 0; right: 0;}

.dst_wrap .dst_con3 .inner ul li .right p {font-size: 26px; margin-bottom: 30px;}
.dst_wrap .dst_con3 .inner ul li .right span {line-height: 22px; font-size: 15px; font-family: var(--font-l); width: 100%; display: inline-block;}
.dst_wrap .dst_con3 .inner ul li .right .logo_bundle {padding-right: 30px;}


/* 인도네시아 유통사업 */
.Indonesia_wrap .con_top {background: url(/Content/img/Indonesia.png) no-repeat center 0; background-size: cover; position: relative;}
.Indonesia_wrap .Indonesia_box {padding-bottom: 0;}
.Indonesia_wrap .Indonesia_box .indo_con3 {margin-bottom: 0;}
 
.Indonesia_wrap .indo_con2 .inner {display: flex; align-items: center;}
.Indonesia_wrap .indo_con2 .left div {display: flex; justify-content: space-between; margin-top: 8px;}
.Indonesia_wrap .indo_con2 .right {text-align: left; padding-left: 80px;}
.Indonesia_wrap .indo_con2 .right p.indo_em {margin-bottom: 10px; font-family: var(--font-b); color: var(--m-color); font-size: 18px; margin-bottom: 20px;}
.Indonesia_wrap .indo_con2 .right p.indo_em > span {font-family: var(--font-pb); color: var(--m-color); font-size: 18px;}
.Indonesia_wrap .indo_con2 .right p.indo_em > span::after {content: ""; display: inline-block; width: 2px; height: 15px; background-color: var(--m-color); margin: 0 15px;}
.Indonesia_wrap .indo_con2 .right p.indo_b {font-family: var(--font-sb); font-size: 15px; margin-bottom: 40px; line-height: 20px;}
.Indonesia_wrap .indo_con2 .right > span {font-size: 15px; font-family: var(--font-l); line-height: 22px;}


.Indonesia_wrap .indo_middle {position: relative; margin-bottom: 20px; }
.Indonesia_wrap .indo_middle img {width: 100%;}
.Indonesia_wrap .indo_middle .indo_img_mo {display: none;}
.Indonesia_wrap .indo_middle .indo_mtxt {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}

.Indonesia_wrap .indo_con3 .indo_tit {font-family: var(--font-pb); font-size: 28px; margin-bottom: 30px; color: #fff;}
.Indonesia_wrap .indo_con3 .indo_txt {font-size: 15px; font-family: var(--font-l); line-height: 22px; display: inline-block; width: 100%; color: #fff;}


.Indonesia_wrap .indo_con3 .indo_box {display: flex; background-color: #fff; margin-bottom: 60px; align-items: center;}
.Indonesia_wrap .indo_con3 .indo_box:last-of-type {margin-bottom: 0;}
.Indonesia_wrap .indo_con3 .indo_box img {display: block;}
.Indonesia_wrap .indo_con3 .indo_box .indo_mo_img {display: none;}
.Indonesia_wrap .indo_con3 .indo_box .right {width: 100%;}
.Indonesia_wrap .indo_con3 .indo_box .right p {font-family: var(--font-sb); font-size: 20px; margin-bottom: 30px;}
.Indonesia_wrap .indo_con3 .indo_box .right span {font-size: 14px; font-family: var(--font-l); line-height: 22px;}

.Indonesia_wrap .indo_con3 .indo_box .right .logo_bundle {justify-content: center; margin-bottom: 80px;}
.Indonesia_wrap .indo_con3 .indo_box .right .indo_product ul {display: flex; justify-content: center;}
.Indonesia_wrap .indo_con3 .indo_box .right .indo_product ul li {border: 1px solid var(--l-color); display: flex; align-items: center; justify-content: center; margin-right: 5px; width: 200px; height: 165px; overflow: hidden;}




/* 태블릿 */
@media screen and (max-width: 1200px) {
    .business_con .inner {display: inline-block;}
    .business_con .inner > div {width: 100%;}
    .business_con .inner > .left {text-align: center; margin-bottom: 20px;}
    .business_con .inner > .right br {display: none;}

    .develop_wrap .develop_con2 ul li .right {padding: 0 20px;}
    .develop_wrap .develop_con2 ul li .right p {font-size: 18px; margin-bottom: 15px;}

    .business_wrap .sub_box > div {margin-bottom: 100px;}

    .develop_wrap .develop_con .inner {display: inline-block;}
    .develop_wrap .develop_con .left {text-align: center;}
    .develop_wrap .develop_con .left span {margin-bottom: 20px;}
    .develop_wrap .develop_con .left span br {display: none;}
    .develop_wrap .develop_con .left span::before {margin: 0 auto 40px;}

    .develop_wrap .develop_con .right img {width: 100%;}
    .develop_wrap .develop_con .right > div img {margin-right: 15px;}
    .develop_wrap .develop_con .right > div img:nth-of-type(3) {margin-right: 0;}

    .dst_wrap .dst_con2 ul li .import_txt {padding-left: 15px;}

    .dst_wrap .dst_con3 .inner ul li:last-of-type {margin-bottom: 0;}
    .dst_wrap .dst_con3 .inner ul li > div {width: 50%;}
    .dst_wrap .dst_con3 .inner ul li .left img {width: 100%;}

    .dst_wrap .dst_con3 .inner ul li .right {padding: 0 20px 0;}
    .dst_wrap .dst_con3 .inner ul li .right p {margin-bottom: 10px;}
    .dst_wrap .dst_con3 .inner ul li .right span br {display: none;}

    .dst_wrap .dst_con3 .inner ul li .right .logo_bundle {padding-right: 0; margin-top: 20px;}

    .business_wrap .sub_box > div {margin-bottom: 80px;}
    .business_wrap .sub_box > .dst_con5 {margin-bottom: 0;}


    .Indonesia_wrap .indo_con2 .right {padding-left: 30px;}

    .Indonesia_wrap .indo_con3 .indo_box .left {width: 30%;}
    .Indonesia_wrap .indo_con3 .indo_box .left img {width: 100%;}

    .Indonesia_wrap .indo_con3 .indo_box .right {width: 70%;}
    .Indonesia_wrap .indo_con3 .indo_box .right p {margin-bottom: 20px;}

    .Indonesia_wrap .indo_con3 .indo_box .right .logo_bundle {margin-bottom: 30px; margin-top: 20px;}

    .Indonesia_wrap .indo_con3 .indo_box .right .indo_product ul li {width: 120px; height: 120px;}
    .Indonesia_wrap .indo_con3 .indo_box .right .indo_product ul li img {width: 80%;}

    .Indonesia_wrap .indo_con3 .indo_tit {margin-bottom: 10px;}
    .Indonesia_wrap .indo_middle .indo_mtxt {width: 90%; word-break: keep-all;}

}


/* 모바일 */
@media screen and (max-width:767px) {
    .business_gray {padding: 100px 0;}
    .business_con .inner > .right br:nth-of-type(5),
    .business_con .inner > .right br:nth-of-type(6) {display: block;}

    .develop_wrap .develop_con2 ul li {width: 100%; margin: 0; margin-bottom: 20px;}
    .develop_wrap .develop_con2 ul li .right {padding: 0 15px;}
    .develop_wrap .develop_con2 ul li .right p {font-size: 17px;}
    .develop_wrap .develop_con2 ul li .right span br {display: none;}

    .develop_wrap .develop_con .right div {margin-top: 2%;}
    .develop_wrap .develop_con .right > div img {margin-right: 2%; width: 32%;}

    .dst_wrap .dst_con2 ul {display: inline-block;}
    .dst_wrap .dst_con2 ul li {width: 100%;}

    .dst_wrap .dst_con3 .inner ul li {display: inline-block;}
    .dst_wrap .dst_con3 .inner ul li > div {width: 100%;}

    .dst_wrap .dst_con3 .inner ul li .right {padding: 40px 20px 60px;}

    .logo_bundle > div {width: 90px;}


    .Indonesia_wrap .indo_middle .indo_img_pc {display: none;}
    .Indonesia_wrap .indo_middle .indo_img_mo {display: block;}

    .Indonesia_wrap .indo_con3 .indo_tit {line-height: 34px;}
    .Indonesia_wrap .indo_con2 .inner {display: inline-block;}
    .Indonesia_wrap .indo_con2 .inner .left > img {width: 100%;}
    .Indonesia_wrap .indo_con2 .inner .left div img {width: 32%; margin-right: 2%;}
    .Indonesia_wrap .indo_con2 .inner .left div img:nth-of-type(3) {margin-right: 0;}

    .Indonesia_wrap .indo_con2 .right {padding-left: 0; padding-top: 20px;}
    .Indonesia_wrap .indo_con2 .right p.indo_b {margin-bottom: 30px;}

    .Indonesia_wrap .indo_con3 .indo_txt {text-align: left;}

    .Indonesia_wrap .indo_con3 .indo_box {display: inline-block; width: 100%;}
    .Indonesia_wrap .indo_con3 .indo_box .left {width: 100%; overflow: hidden; position: relative;}
    .Indonesia_wrap .indo_con3 .indo_box .indo_mo_img {display: block;}
    .Indonesia_wrap .indo_con3 .indo_box .indo_pc_img {display: none;}

    .Indonesia_wrap .indo_con3 .indo_box .right {width: 100%; padding: 20px;}
    .Indonesia_wrap .indo_con3 .indo_box .right p {line-height: 26px;}
    .Indonesia_wrap .indo_con3 .indo_box .right span br {display: none;}

    .logo_bundle > div {width: calc((100% - 5px)/2);}
    .logo_bundle > div:nth-of-type(2n) {margin-right: 0;}
    .Indonesia_wrap .indo_con3 .indo_box .right .logo_bundle {justify-content: flex-start;}

}

