@charset "UTF-8";
/*-------------------------------------------------------------------
    준비중
-------------------------------------------------------------------*/
#ready_page{}
#ready_page .bx_box{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center; gap: 1.6rem; position: relative; padding: 14rem 2rem; background-image: url(../../../img/site/kor/skin/box_img01.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; background-attachment: fixed; border-radius: 1.2rem;}
#ready_page .bx_box:before{content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2);}
#ready_page .bx_box strong{display: block; position: relative; z-index: 1; width: 100%; text-align: center; color: #fff; font-size: 4.6rem; font-weight: 700; line-height: 1.4;}
#ready_page .bx_box p{display: block; position: relative; z-index: 1; width: 100%; text-align: center; color: rgba(255, 255, 255, 0.75); font-size: 2.2rem;}

/*-------------------------------------------------------------------
    공통
-------------------------------------------------------------------*/
.textani{opacity: 0.25; position: relative; z-index: 1; padding-left: 50%; font-size: 1.9rem; line-height: 1.7; letter-spacing: -0.038rem; transform: translateY(6rem); transition: all 0.2s linear;}
.textani.on{opacity: 1; transform: translateY(0);}
.hover_img{display: block; width: 100%;}
.hover_img >div{display: block; position: relative; width: 86.6rem; max-width: 100%; border-radius: 0.4rem; transition: all 0.2s linear;}
.hover_img:not(.no) >div:hover,
.hover_img:not(.no).on >div{width: 100%;}
.hover_img:not(.no) >div:before{content: ""; opacity: 1; display: block; position: absolute; top: 50%; left: 50%; z-index: 1; width: 8rem; height: 8rem; background: rgba(212, 0, 15, 0.3) url(../../../img/site/kor/content/0201_img20.svg) no-repeat center center / 100% auto; border-radius: 50%; transform: translate(-50%,-50%); transition: all 0.2s linear;}
.hover_img >div:hover:before,
.hover_img.on >div:before{opacity: 0;}
.hover_img >div *{display: block; width: 100%;}
.hover_img >div img{border-radius: 0.4rem;}

@media screen and (max-width:1200px){
    .textani{padding-left: 0;}
}
@media screen and (max-width:1024px){
    .hover_img >div{width: 100%;}
    .hover_img:not(.no) >div:before{display: none;}
}
@media screen and (max-width:640px){
    .textani{transform: translateY(0);}
}

/*-------------------------------------------------------------------
    About > 인스텍 소개
-------------------------------------------------------------------*/
[data-content="0101"]{}
[data-content="0101"] .mv_list{position: relative; left: 50%; width: 100vw; transform: translateX(-50%); padding-bottom: 18rem;}
[data-content="0101"] .mv_list:before{content: ""; display: block; position: absolute; bottom: 0; right: 0; z-index: -1; width: 97.4rem; height: 132.4rem; background: url(../../../img/site/kor/content/0101_03.svg) no-repeat right center / auto 100%;}
[data-content="0101"] .mv_list ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 6rem; max-width: calc(1600px + 4rem); margin: 0 auto; padding-left: 10rem; }
[data-content="0101"] .mv_list ul li{overflow: hidden; width: 42rem; height: 46rem; border-radius: 1.2rem; background: url(../../../img/site/kor/content/0101_01.jpg) no-repeat center center / cover;}
[data-content="0101"] .mv_list ul li:nth-child(2){margin-top: 8rem; background-image: url(../../../img/site/kor/content/0101_02.jpg);}
[data-content="0101"] .mv_list ul li div{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: flex-end; align-items: flex-start; position: relative; width: 100%; height: 100%; padding: 4rem 3.2rem; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%); transition: all 0.2s linear;}
[data-content="0101"] .mv_list ul li:hover div{padding-bottom: 5rem;}
[data-content="0101"] .mv_list ul li div:before{opacity: 0; content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.00) 50%, rgba(212, 0, 15, 0.15) 75%, rgba(212, 0, 15, 0.40) 100%); transition: all 0.2s linear;}
[data-content="0101"] .mv_list ul li:hover div:before{opacity: 1;}
[data-content="0101"] .mv_list ul li div em{display: block; position: relative; width: 100%; color: #D4000F; font-size: 1.6rem; font-weight: 600; letter-spacing: 0.24rem; text-transform: uppercase;}
[data-content="0101"] .mv_list ul li div strong{display: block; position: relative; width: 100%; margin-top: 1.6rem; font-size: 3.2rem; font-weight: 600; line-height: 1.4; letter-spacing: -0.06rem; color: #fff;}
[data-content="0101"] .mv_list ul li div p{display: block; opacity: 0.5; position: relative; width: 100%; margin-top: 0.8rem; font-family: 'Poppins'; font-size: 1.6rem; font-weight: 300; line-height: 1.6; letter-spacing: .0325rem; color: #fff;}
[data-content="0101"] .mv_list .bg{display: block; opacity: 0.5; position: absolute; right: -18.8rem;; white-space: nowrap; font-size: 12rem; font-weight: 600; font-family: 'Poppins'; text-transform: uppercase; background: #E6E8EA; background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
[data-content="0101"] .va{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; }
[data-content="0101"] .va li{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; width: 100%; min-height: 308px; flex: 1; transition: all 0.2s linear;}
[data-content="0101"] .va:not(:hover) li:first-child,
[data-content="0101"] .va li:hover{flex: 2%;}
[data-content="0101"] .va li div{display: flex; flex-direction: column; justify-content: flex-start; gap: 2.4rem;  width: 100%; padding: 3.2rem; background-color: #F4F5F6; border-radius: 0; transition: all 0.2s linear;}
[data-content="0101"] .va:not(:hover) li:first-child div,
[data-content="0101"] .va li:hover div{gap: 0; padding: 4.8rem 3.2rem; background-color: #D4000F; border-radius: 1.6rem;}
[data-content="0101"] .va li div i{display: block; width: 6rem; height: 6rem; margin-left: auto; transition: all 0.2s linear;}
[data-content="0101"] .va li div i img{display: block; width: 100%;}
[data-content="0101"] .va:not(:hover) li:first-child div img,
[data-content="0101"] .va li:hover div i img{filter: brightness(3);}
[data-content="0101"] .va:not(:hover) li:first-child div i,
[data-content="0101"] .va li:hover div i{width: 8rem; height: 8rem;}
[data-content="0101"] .va li div >span{}
[data-content="0101"] .va li div >span em{display: block; width: 100%; color: #6D7882; font-size: 1.6rem; font-weight: 500; line-height: 1; letter-spacing: 0.11rem; text-transform: uppercase; transition: all 0.2s linear;}
[data-content="0101"] .va:not(:hover) li:first-child div >span em,
[data-content="0101"] .va li:hover div >span em{color: #fff; font-weight: 500;}
[data-content="0101"] .va li div >span strong{display: block; width: 100%; margin-top: 0.8rem; font-weight: 700; font-size: 2.4rem; color: #131416; transition: all 0.2s linear;}
[data-content="0101"] .va:not(:hover) li:first-child div >span strong,
[data-content="0101"] .va li:hover div >span strong{color: #fff; font-size: 3.2rem; font-weight: 700; letter-spacing: -0.064rem;}
[data-content="0101"] .va li div >span b{display: block; width: 100%; margin-top: 0.6rem; color: rgba(255, 255, 255, 0.9); font-weight: 400; letter-spacing: -0.034rem; color: #131416; transition: all 0.2s linear;}
[data-content="0101"] .va:not(:hover) li:first-child div >span b,
[data-content="0101"] .va li:hover div >span b{color: #fff; font-weight: 500;}
[data-content="0101"] .va li div >span span{display: block; width: 100%; min-height: 7.2rem; margin-top: 1.2rem; color: #464C53; font-size: 1.6rem; letter-spacing: -0.032rem;}
[data-content="0101"] .va:not(:hover) li:first-child div >span span,
[data-content="0101"] .va li:hover div >span span{color: #fff;}

@media screen and (max-width:1640px){
    [data-content="0101"] .mv_list{padding-bottom: 14rem;}
    [data-content="0101"] .mv_list ul{gap: 5rem; padding-left: 3rem;}
    [data-content="0101"] .mv_list .bg{font-size: 10rem;}
}
@media screen and (max-width:1400px){
    [data-content="0101"] .va{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 2rem;}
    [data-content="0101"] .va li{flex: none; width: calc((100% - 2rem) / 2); min-height: auto;}
    [data-content="0101"] .va:not(:hover) li:first-child,
    [data-content="0101"] .va li:hover{flex: none;}
    [data-content="0101"] .va li div,
    [data-content="0101"] .va:not(:hover) li:first-child div,
    [data-content="0101"] .va li:hover div{gap: 1.2rem; width: 100%; height: 100%; padding: 2rem 2.5rem 2.5rem; background-color: #F4F5F6; border-radius: 0;}
    [data-content="0101"] .va:not(:hover) li:first-child div i,
    [data-content="0101"] .va li:hover div i{width: 6rem; height: 6rem;}
    [data-content="0101"] .va:not(:hover) li:first-child div >span strong,
    [data-content="0101"] .va li:hover div >span strong{font-size: 2.4rem; font-weight: 600; letter-spacing: 0;}
    [data-content="0101"] .va li div >span span{min-height: auto; margin-top: 1rem;}
    [data-content="0101"] .va:not(:hover) li:first-child div >span em,[data-content="0101"] .va li:hover div >span em{color: #6D7882;}
    [data-content="0101"] .va:not(:hover) li:first-child div >span strong, [data-content="0101"] .va li:hover div >span strong{color: #131416;}
    [data-content="0101"] .va:not(:hover) li:first-child div >span span, [data-content="0101"] .va li:hover div >span span{color: #464C53;}
    [data-content="0101"] .va:not(:hover) li:first-child div img, [data-content="0101"] .va li:hover div i img{filter: brightness(1);}
}
@media screen and (max-width:1200px){
    [data-content="0101"] .mv_list ul{gap: 4rem;}
    [data-content="0101"] .mv_list ul li{width: 36rem; height: 40rem;}
    [data-content="0101"] .mv_list ul li:nth-child(2){margin-top: 6rem;}
    [data-content="0101"] .mv_list ul li div{padding: 3rem;}
    [data-content="0101"] .mv_list ul li:hover div{padding-bottom: 4.5rem;}
    [data-content="0101"] .mv_list ul li div strong{font-size: 3rem;}
}
@media screen and (max-width:1024px){
    [data-content="0101"] .mv_list{padding-bottom: 11rem;}
    [data-content="0101"] .mv_list:before{bottom: 10rem; width: calc(97.4rem * 0.7); height: calc(132.4rem * 0.7);}
    [data-content="0101"] .mv_list ul{align-items: flex-start; gap: 2.5rem;}
    [data-content="0101"] .mv_list ul li{width: calc((100% - 2.5rem - 3rem) / 2); height: 36rem;}
    [data-content="0101"] .mv_list ul li:nth-child(2){margin-top: 4rem;}
    [data-content="0101"] .mv_list ul li div{padding: 3rem 2rem;}
    [data-content="0101"] .mv_list ul li:hover div{padding-bottom: 3rem;}
    [data-content="0101"] .mv_list ul li div:before{display: none;}
    [data-content="0101"] .mv_list ul li div strong{font-size: 2.8rem;}
    [data-content="0101"] .mv_list .bg{font-size: 7rem;}
    [data-content="0101"] .va li div >span b{font-size: 1.9rem;}
    [data-content="0101"] .va li div >span span{font-size: 1.7rem;}
}
@media screen and (max-width:640px){
    [data-content="0101"] .va{gap: 1.5rem;}
    [data-content="0101"] .va li{width: calc((100% - 1.5rem) / 2);}
    [data-content="0101"] .va li div,
    [data-content="0101"] .va:not(:hover) li:first-child div,
    [data-content="0101"] .va li:hover div{padding: 2rem 2rem 2.5rem;}
    [data-content="0101"] .va li div i,
    [data-content="0101"] .va:not(:hover) li:first-child div i,
    [data-content="0101"] .va li:hover div i{width: 5rem; height: 5rem;}
    [data-content="0101"] .va li div >span strong,
    [data-content="0101"] .va:not(:hover) li:first-child div >span strong,
    [data-content="0101"] .va li:hover div >span strong{margin-top: 0.6rem;}
    [data-content="0101"] .va li div >span span{margin-top: 0.6rem;}
    [data-content="0101"] .va li div >span b{font-size: 1.9rem;}
    [data-content="0101"] .va li div >span span{font-size: 1.8rem;}
    [data-content="0101"] .mv_list{padding-bottom: 7rem;}
    [data-content="0101"] .mv_list:before{bottom: 20rem; width: calc(97.4rem * 0.5); height: calc(132.4rem * 0.5);}
    [data-content="0101"] .mv_list ul{gap: 2rem;}
    [data-content="0101"] .mv_list ul li{width: calc(100% - 3rem); height: auto;}
    [data-content="0101"] .mv_list ul li:nth-child(2){margin-top: 0;}
    [data-content="0101"] .mv_list ul li div{padding: 2rem;}
    [data-content="0101"] .mv_list ul li:hover div{padding-bottom: 2rem;}
    [data-content="0101"] .mv_list ul li div strong{margin-top: 0.8rem; font-size: 2.6rem;}
    [data-content="0101"] .mv_list .bg{font-size: 5rem;}
}
@media screen and (max-width:540px){
    [data-content="0101"] .va{gap: 1.5rem;}
    [data-content="0101"] .va li{width: 100%;}
    [data-content="0101"] .va li div,
    [data-content="0101"] .va:not(:hover) li:first-child div,
    [data-content="0101"] .va li:hover div{gap: 1rem;}
    [data-content="0101"] .va li div i,
    [data-content="0101"] .va:not(:hover) li:first-child div i,
    [data-content="0101"] .va li:hover div i{width: 4.5rem; height: 4.5rem;}
    [data-content="0101"] .va li div >span span br{display: none; }
}
@media screen and (max-width:480px){
    [data-content="0101"] .mv_list{padding-bottom: 6rem;}
    [data-content="0101"] .mv_list .bg{right: -13rem; font-size: 4rem;}
}

/*-------------------------------------------------------------------
    About > 연혁
-------------------------------------------------------------------*/
[data-content="0102"]{}
[data-content="0102"] [data-skin="box"][data-type="1"]{padding: 8rem 2rem;}
[data-content="0102"] .his{position: relative; padding-top: 8rem;}
[data-content="0102"] .his >ul{display: flex; flex-direction: column; gap: 8.7rem;}
[data-content="0102"] .his >ul >li{display: block; width: 100%;}
[data-content="0102"] .his >ul >li:after{content: ""; display: block; clear: both;}
[data-content="0102"] .his >ul >li >*{float: left; width: calc((100% - 23.2rem) / 2);}
[data-content="0102"] .his >ul >li .l{position: sticky; top: 12rem;}
[data-content="0102"] .his >ul >li .l strong{display: block; font-size: 4rem; font-weight: 700; color: #131416;}
[data-content="0102"] .his >ul >li .l p{display: block; margin-top: 1.2rem; font-size: 2.3rem; font-weight: 300;}
[data-content="0102"] .his >ul >li .l img{display: block; max-width: 100%; margin-top: 2.4rem;}
[data-content="0102"] .his >ul >li .l em{display: block; margin-top: 2.4rem; font-size: 7rem; font-family: 'Poppins'; font-weight: 600; line-height: 1; color: #E6E8EA;}
[data-content="0102"] .his >ul >li .r{display: flex; flex-direction: column; gap: 3.2rem; margin-left: 23.2rem; margin-top: 17rem;}
[data-content="0102"] .his >ul >li:last-child .r{padding-bottom: 8rem;}
[data-content="0102"] .his >ul >li .r >li{font-size: 1.9rem; font-weight: 400; letter-spacing: -0.038rem; color: rgba(0, 0, 0, 0.50);}
[data-content="0102"] .his >ul >li .r >li.on{color: #1E2124; font-size: 2.4rem; font-weight: 600; }
[data-content="0102"] .his >ul >li .r >li b{display: block; width: 100%; font-weight: 500; font-size: 2rem; color: rgba(0, 0, 0, 0.25);}
[data-content="0102"] .his >ul >li .r >li.on b{color: #D4000F; font-size: 3.6rem; font-weight: 700;}
[data-content="0102"] .his .lines{position: absolute; top: 0; left: 50%; width: 2px; height: 100%; margin-left: -1px; background-color: rgba(0, 0, 0, 0.10); }
[data-content="0102"] .his .lines i{opacity: 0; display: block; position: relative; width: 100%; background-color: #D4000F; text-indent: -9999px; transition: all 0.2s linear;}
[data-content="0102"] .his .lines.on i{opacity: 1;}
[data-content="0102"] .his .lines i:before{content: ""; display: block; position: absolute; bottom: 0; left: 50%; width: 12.4rem; height: 12.4rem; background: url(../../../img/site/kor/content/0102_01.svg) no-repeat center center / 100% auto; transform: translate(-50%,50%);}

@media screen and (max-width:1640px){
    [data-content="0102"] .his >ul >li >*{width: calc((100% - 18rem) / 2);}
    [data-content="0102"] .his >ul >li .r{margin-left: 18rem;}
}
@media screen and (max-width:1400px){
    [data-content="0102"] .his >ul >li >*{width: calc((100% - 12rem) / 2);}
    [data-content="0102"] .his >ul >li .r{margin-left: 12rem; margin-top: 13rem;}
}
@media screen and (max-width:1200px){
    [data-content="0102"] .his >ul >li >*{width: calc((100% - 10rem) / 2);}
    [data-content="0102"] .his >ul >li .l strong{font-size: 3.6rem;}
    [data-content="0102"] .his >ul >li .l p{margin-top: 0.8rem; font-size: 2.1rem;}
    [data-content="0102"] .his >ul >li .l img{margin-top: 1.8rem;}
    [data-content="0102"] .his >ul >li .l em{margin-top: 1.8rem; font-size: 5.2rem;}
    [data-content="0102"] .his >ul >li .r{gap: 2.8rem; margin-left: 10rem; margin-top: 11rem;}
    [data-content="0102"] .his >ul >li .r >li.on{font-size: 2.2rem;}
    [data-content="0102"] .his >ul >li .r >li.on b{font-size: 3.2rem;}
    [data-content="0102"] .his .lines i:before{width: 10rem;height: 10rem;}
}
@media screen and (max-width:1024px){
    [data-content="0102"] [data-skin="box"][data-type="1"]{padding: 6rem 2rem;}
    [data-content="0102"] .his{padding-top: 5rem; padding-left: 6rem;}
    [data-content="0102"] .his >ul{gap: 6rem;}
    [data-content="0102"] .his >ul >li >*{width: 100%;}
    [data-content="0102"] .his >ul >li .l{position: relative; top: auto;}
    [data-content="0102"] .his >ul >li .l strong{font-size: 3.2rem;}
    [data-content="0102"] .his >ul >li .l p{margin-top: 0.6rem; font-size: 1.9rem;}
    [data-content="0102"] .his >ul >li .l img{margin-top: 1.2rem;}
    [data-content="0102"] .his >ul >li .l em{margin-top: 2rem; font-size: 4rem;}
    [data-content="0102"] .his >ul >li .r{gap: 1.5rem; margin-top: 2rem; margin-left: 0;}
    [data-content="0102"] .his >ul >li:last-child .r{padding-bottom: 4rem;}
    [data-content="0102"] .his >ul >li .r >li{position: relative; padding-left: 9rem; font-size: 1.9rem;}
    [data-content="0102"] .his >ul >li .r >li.on{font-size: 1.9rem; font-weight: 500;}
    [data-content="0102"] .his >ul >li .r >li b{position: absolute; top: -0.1rem; left: 0; font-size: 2rem;}
    [data-content="0102"] .his >ul >li .r >li.on b{font-size: 2rem;}
    [data-content="0102"] .his .lines{left: 2.5rem;}
    [data-content="0102"] .his .lines i:before{width: 8rem; height: 8rem;}
}
@media screen and (max-width:640px){
    [data-content="0102"] [data-skin="box"][data-type="1"]{padding: 5rem 2rem;}
    [data-content="0102"] .his{padding-top: 4rem; padding-left: 4rem;}
    [data-content="0102"] .his >ul{gap: 5rem;}
    [data-content="0102"] .his >ul >li .l strong{font-size: 2.8rem;}
    [data-content="0102"] .his >ul >li .l p{margin-top: 0.4rem; font-size: 1.9rem;}
    [data-content="0102"] .his >ul >li .l img{margin-top: 1rem;}
    [data-content="0102"] .his >ul >li .l em{margin-top: 1.8rem; font-size: 3.4rem;}
    [data-content="0102"] .his >ul >li .r{gap: 1rem; margin-top: 1.6rem;}
    [data-content="0102"] .his >ul >li:last-child .r{padding-bottom: 3rem;}
    [data-content="0102"] .his >ul >li .r >li{position: relative; padding-left: 8.6rem; font-size: 1.8rem;}
    [data-content="0102"] .his >ul >li .r >li.on{font-size: 1.9rem; font-weight: 500;}
    [data-content="0102"] .his >ul >li .r >li b{font-size: 2rem;}
    [data-content="0102"] .his >ul >li .r >li.on b{font-size: 2rem;}
    [data-content="0102"] .his .lines{left: 1.25rem;}
    [data-content="0102"] .his .lines i:before{width: 6rem; height: 6rem;}
}
@media screen and (max-width:480px){
    [data-content="0102"] [data-skin="box"][data-type="1"]{padding: 4rem 2rem;}
    [data-content="0102"] .his{padding-top: 3rem; padding-left: 4rem;}
    [data-content="0102"] .his >ul >li .r >li{position: relative; padding-left: 0;}
    [data-content="0102"] .his >ul >li .r >li b{position: relative; top: auto; left: auto;}
}

/*-------------------------------------------------------------------
    About > 글로벌네트워크
-------------------------------------------------------------------*/
[data-content="0103"]{}
[data-content="0103"] .maps{position: relative; padding: 4rem; background-color: #131926;}
[data-content="0103"] .maps:before{content: ""; display: block; position: absolute; bottom: 0; left: 0; z-index: 1; width: 100%; height: 20rem; background: linear-gradient(0deg, rgba(0, 0, 0, 0.60) 0%, rgba(0, 0, 0, 0.00) 102%);}
[data-content="0103"] .maps .svgs{display: block; position: absolute; top: 0; left: 50%; width: 100%; height: 100%; transform: translateX(-50%);}
[data-content="0103"] .maps .svgs img{display: block; width: 100%; height: 100%; margin: 0 auto; object-fit: cover;}
[data-content="0103"] .maps .svgs svg [data-cirlce]{transform-box: fill-box; transform-origin: center; animation: ani_0103_01 1.2s linear infinite;}
[data-content="0103"] .maps .svgs .pins{display: block; position: absolute; top: 5.8rem; left: 50%; z-index: 1; width: 100%; max-width: calc(1600px + 12rem); padding: 0 6rem; transform: translateX(-50%);}
[data-content="0103"] .maps .svgs .pins ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 0.8rem 2rem;}
[data-content="0103"] .maps .svgs .pins ul li{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.6rem; color: #fff;}
[data-content="0103"] .maps .svgs .pins ul li:before{content: ""; display: block; width: 1.4rem; height: 2rem; background: url(../../../img/site/kor/content/0103_37.svg) no-repeat center center / 100% auto;}
[data-content="0103"] .maps .svgs .pins ul li[data-color="2"]:before{background-image: url(../../../img/site/kor/content/0103_38.svg);}
[data-content="0103"] .maps .lists{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 6rem; position: relative; z-index: 1; padding-top: 45%; color: #fff;}
[data-content="0103"] .maps .lists li{display: flex; flex-wrap: wrap; flex-direction: column; align-content: flex-start; justify-content: flex-start; align-items: flex-start; gap: 1rem;}
[data-content="0103"] .maps .lists li strong{display: block; font-size: 1.8rem; font-weight: 400; font-family: 'Poppins';}
[data-content="0103"] .maps .lists li em{display: block; font-size: 8rem; font-weight: 500; line-height: 0.8; font-family: 'Exat CYR';}
[data-content="0103"] .maps .lists li em span{font-size: 0.85em;}
[data-content="0103"] .maps >p{display: block; position: relative; z-index: 1; margin-top: 4rem; font-family: 'Poppins'; font-size: 2rem; font-weight: 400; color: #fff;}
[data-content="0103"] .gc_list{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 1.2rem; padding: 2rem; background-color: rgba(243, 206, 0, 0.30);}
[data-content="0103"] .gc_list >li{display: block; width: calc((100% - (1.2rem * 4)) / 5);}
[data-content="0103"] .gc_list >li >div,
[data-content="0103"] .gc_list >li >a{overflow: hidden; display: block; border-radius: 4px;}
[data-content="0103"] .gc_list >li >* img{display: block; width: 100%;}
[data-content="0103"] .pr_list{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 2rem;}
[data-content="0103"] .pr_list >li{width: calc((100% - 4rem) / 3);}
[data-content="0103"] .pr_list >li >div{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2rem; width: 100%; height: 100%; padding: 1.6rem; background-color: rgba(49, 210, 255, 0.10); border-radius: 4px; transform: translateY(0); transition: all 0.2s linear;}
[data-content="0103"] .pr_list >li >div:hover{background-color: rgba(49, 210, 255, 0.40); transform: translateY(-0.8rem); }
[data-content="0103"] .pr_list >li >div .imgs{display: block; width: 16rem; height: auto;}
[data-content="0103"] .pr_list >li >div .imgs img{display: block; width: 100%; height: auto; border-radius: 4px;}
[data-content="0103"] .pr_list >li >div .txts{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: flex-start; gap: 0.8rem; flex: 1; font-family: 'Poppins';}
[data-content="0103"] .pr_list >li >div .txts strong{display: block; width: 100%; font-size: 1.7rem; font-weight: 600; line-height: 1.4; color: #1E2124;}
[data-content="0103"] .pr_list >li >div .txts p{display: block; width: 100%; font-size: 1.5rem; font-weight: 400; color: rgba(0, 0, 0, 0.75);}
[data-content="0103"] .pr_list >li >div .links{display: block; position: relative; width: 3.2rem;}
[data-content="0103"] .pr_list >li >div .links i{display: block; position: relative; width: 100%; height: 0; padding-top: 100%; text-indent: -9999px;}
[data-content="0103"] .pr_list >li >div .links i:before{content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../../../img/site/kor/content/0103_36.svg) no-repeat center center / 100% auto; border-radius: 4px; filter: brightness(0); background-color: transparent; transition: all 0.2s linear;}
[data-content="0103"] .pr_list >li >div:hover .links i:before{background-color: rgba(0, 0, 0, 0.25); filter: brightness(1);}
[data-content="0103"] .pr_list >li >div .links span{opacity: 0; position: absolute; top: 3.8rem; left: 50%; padding: 0.4rem; background-color: #fff; border: 1px solid #B1B8BE; border-radius: 4px; transform: translateX(-50%); transition: all 0.2s linear;}
[data-content="0103"] .pr_list >li >div:hover .links span{opacity: 1;}
[data-content="0103"] .pr_list >li >div .links a{display: block; width: auto; min-width: 6rem; padding: 0.3rem 1rem; text-align: center; font-size: 1.4rem; color: #000; font-weight: 500; font-family: 'Pretendard'; background-color: transparent; border-radius: 3px; transition: all 0.2s linear;}
[data-content="0103"] .pr_list >li >div .links a:not(:first-child){margin-top: 1px;}
[data-content="0103"] .pr_list >li >div .links a:hover{color: #fff; background-color: #D4000F;}

@keyframes ani_0103_01{
    0%,20%{transform: scale(1);}
    80%{transform: scale(3);}
    81%,100%{opacity: 0; transform: scale(3);}
}

@media screen and (max-width:1640px){
    [data-content="0103"] .maps{}
    [data-content="0103"] .maps .lists{gap: 5rem;}
    [data-content="0103"] .maps .lists li{gap: 1.5rem;}
}
@media screen and (max-width:1400px){
    [data-content="0103"] .maps{padding: 3rem 3rem 4rem;}
    [data-content="0103"] .maps .svgs .pins{top: 3rem; padding: 0 3rem;}
    [data-content="0103"] .maps .lists{gap: 4rem;}
    [data-content="0103"] .maps .lists li{gap: 1rem;}
    [data-content="0103"] .pr_list >li{width: calc((100% - 2rem) / 2);}
}
@media screen and (max-width:1200px){
    [data-content="0103"] .gc_list >li{width: calc((100% - (1.2rem * 4)) / 5);}
    [data-content="0103"] .pr_list{gap: 1.2rem;}
    [data-content="0103"] .pr_list >li{width: calc((100% - 1.2rem) / 2);}
    [data-content="0103"] .maps{width: calc(100% + 4rem); margin-left: -2rem; padding: 2rem 2rem 4rem;}
    [data-content="0103"] .maps .svgs .pins{top: 2rem; padding: 0 2rem;}
    [data-content="0103"] .maps .svgs .pins ul{gap: 0.6rem 1.8rem;}
    [data-content="0103"] .maps .svgs .pins ul li{font-size: 1.6rem;}
    [data-content="0103"] .maps .svgs .pins ul li:before{width: calc(1.4rem * 0.9); height: calc(2rem * 0.9);}
    [data-content="0103"] .maps >p{margin-top: 4rem; font-size: 2.1rem;}
}
@media screen and (max-width:1024px){
    [data-content="0103"] .maps .svgs:before{height: 15rem;}
    [data-content="0103"] .maps .lists li strong{font-size: 1.8rem;}
    [data-content="0103"] .maps .lists li em{font-size: 7.5rem;}
    [data-content="0103"] .gc_list >li{width: calc((100% - (1.2rem * 3)) / 4);}
    [data-content="0103"] .maps >p{margin-top: 3rem; font-size: 1.8rem;}
    [data-content="0103"] .pr_list >li >div{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: flex-start; gap: 0; position: relative; min-height: 11rem; padding: 1.5rem 1.5rem 1.5rem 18rem;}
    [data-content="0103"] .pr_list >li >div:hover{background-color: rgba(49, 210, 255, 0.10); transform: translateY(0);}
    [data-content="0103"] .pr_list >li >div .imgs{position: absolute; top: 1.5rem; left: 1.5rem; width: 15rem;}
    [data-content="0103"] .pr_list >li >div .txts{display: block; flex: none; width: 100%;}
    [data-content="0103"] .pr_list >li >div .txts strong{font-size: 1.8rem;}
    [data-content="0103"] .pr_list >li >div .txts p{display: none;}
    [data-content="0103"] .pr_list >li >div .links{width: 100%; margin-top: 0.6rem;}
    [data-content="0103"] .pr_list >li >div .links i{display: none;}
    [data-content="0103"] .pr_list >li >div .links span{opacity: 1; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 1rem;position: relative; top: auto; left: auto; padding: 0; background-color: transparent; border: none; border-radius: 0; transform: translateX(0);}
    [data-content="0103"] .pr_list >li >div .links span a{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; min-width: auto; padding: 0; font-size: 1.6rem; font-family: 'Poppins'; font-weight: 400; border-radius: 0;}
    [data-content="0103"] .pr_list >li >div .links span a:after{content: ""; display: block; width: 2.2rem; height: 2.2rem; background: url(../../../img/site/kor/content/0103_36.svg) no-repeat center center / 100% auto; filter: brightness(0);}
    [data-content="0103"] .pr_list >li >div .links span a:not(:first-child){margin-top: 0;}
    [data-content="0103"] .pr_list >li >div .links a:hover{background-color: transparent;}
}
@media screen and (max-width:840px){
    [data-content="0103"] .maps .svgs:before{height: 10rem;}
    [data-content="0103"] .maps .svgs img{object-fit: contain;}
    [data-content="0103"] .maps .lists{width: auto; max-width: 48rem; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 2rem;}
    [data-content="0103"] .maps .lists li{align-items: center; gap: 0.6rem; width: auto; min-width: 15rem;}
    [data-content="0103"] .maps .lists li em{display: block; width: 100%; font-size: 6rem;}
    [data-content="0103"] .maps .lists li strong{display: block; width: 100%;}
    [data-content="0103"] .maps >p{margin-top: 2.5rem;}
    [data-content="0103"] .gc_list >li{width: calc((100% - (1.2rem * 3)) / 4);}
    [data-content="0103"] .pr_list{gap: 1.5rem;}
    [data-content="0103"] .pr_list >li{width: calc((100% - 1.5rem) / 2);}
    [data-content="0103"] .pr_list >li >div{justify-content: flex-start; min-height: 9.5rem; padding: 1.25rem 1.25rem 1.25rem 15.5rem;}
    [data-content="0103"] .pr_list >li >div .imgs{top: 1.25rem; left: 1.25rem; width: 13rem;}
}
@media screen and (max-width:740px){
    [data-content="0103"] .pr_list >li >div{min-height: 8.5rem; padding: 1.25rem 1.25rem 1.25rem 13.5rem;}
    [data-content="0103"] .pr_list >li >div .imgs{width: 11rem;}
    [data-content="0103"] .pr_list >li >div .txts strong{font-size: 1.8rem;}
    [data-content="0103"] .pr_list >li >div .links span a{font-size: 1.6rem;}
}
@media screen and (max-width:640px){
    [data-content="0103"] .maps .svgs{position: relative; top: auto; left: -2rem; width: calc(100% + 4rem); transform: translateX(0);}
    [data-content="0103"] .maps .svgs:before{height: 8rem;}
    [data-content="0103"] .maps .svgs .pins ul{gap: 0.4rem 1.2rem;}
    [data-content="0103"] .maps .svgs .pins ul li{font-size: 1.7rem;}
    [data-content="0103"] .maps .svgs .pins ul li:before{width: calc(1.4rem * 0.85); height: calc(2rem * 0.85);}
    [data-content="0103"] .maps .lists{gap: 1.5rem 2rem; max-width: 44rem; padding-top: 0;}
    [data-content="0103"] .maps .lists li{min-width: 13rem;}
    [data-content="0103"] .maps .lists li strong{font-size: 1.9rem;}
    [data-content="0103"] .maps .lists li em{font-size: 5rem;}
    [data-content="0103"] .maps >p{margin-top: 2rem; font-size: 1.9rem;}
    [data-content="0103"] .gc_list >li{width: calc((100% - (1.2rem * 2)) / 3);}
    [data-content="0103"] .pr_list >li >div .txts strong{font-size: 1.9rem;}
    [data-content="0103"] .pr_list >li >div .links span a{font-size: 1.7rem;}
}
@media screen and (max-width:540px){
    [data-content="0103"] .pr_list >li >div{padding: 1.25rem 1.25rem 1.5rem;}
    [data-content="0103"] .pr_list >li >div .imgs{position: relative; top: auto; left: auto; width: 100%; margin-bottom: 1rem;}
    [data-content="0103"] .pr_list >li >div .links{margin-top: 0.6rem;}
}
@media screen and (max-width:480px){
    [data-content="0103"] .maps .svgs:before{height: 6rem;}
    [data-content="0103"] .maps .lists li em{font-size: 4rem;}
    [data-content="0103"] .gc_list{gap: 1rem;}
    [data-content="0103"] .gc_list >li{width: calc((100% - (1rem * 2)) / 3);}
    [data-content="0103"] .pr_list{gap: 1rem;}
    [data-content="0103"] .pr_list >li{width: calc((100% - 1rem) / 2);}
}
@media screen and (max-width:360px){
    [data-content="0103"] .maps .lists{gap: 1.5rem 1.75rem; max-width: none;}
    [data-content="0103"] .maps .lists li{gap: 0.4rem; min-width: auto;}
    [data-content="0103"] .maps .lists li strong{font-size: 1.6rem;}
    [data-content="0103"] .maps .lists li em{font-size: 3.6rem;}
    [data-content="0103"] .gc_list >li{width: calc((100% - 1rem) / 2);}
    [data-content="0103"] .pr_list >li{width: 100%;}
}

/*-------------------------------------------------------------------
    Products 제품소개
-------------------------------------------------------------------*/
[data-content="02"]{}
[data-content="02"] >ul{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 6rem;}
[data-content="02"] >ul >li{display: flex; flex-wrap: wrap; flex-direction: column-reverse; align-content: flex-start; justify-content: flex-start; align-items: flex-start; position: relative; width: 100%; min-width: 0; }
[data-content="02"] >ul >li a{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: flex-end; align-items: flex-start; width: 100%; height: 100%; padding: 4rem; background-color: rgba(0, 0, 0, 0.10); transition: all 0.2s linear;}
[data-content="02"] >ul >li a:hover{background-color: rgba(0, 0, 0, 0.15);}
[data-content="02"] >ul >li a:before{content: ""; display: block; position: relative; height: auto; padding-top: 106.55%;}
[data-content="02"] >ul >li >*{position: relative; z-index: 1;}
[data-content="02"] >ul >li em{display: inline-block;padding: 0.4rem 1rem; font-family: 'Pretendard'; font-size: 1.5rem; color: #fff; font-weight: 400; background-color: #D4000F; border-radius: 0.2rem;}
[data-content="02"] >ul >li h4{display: block; width: 100%; margin-top: 0.4rem; margin-bottom: 0.4rem; line-height: 1.4;}
[data-content="02"] >ul >li p{display: block; width: 100%; font-size: 1.6rem; font-weight: 500; font-family: 'Pretendard';}
[data-content="02"] >ul >li b{display: block; width: 100%; font-size: 1.5rem; font-weight: 500; font-family: 'Pretendard';}
[data-content="02"] >ul >li img{position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; object-fit: contain; object-position: center 20%;}
[data-content="02"] >div{padding: 6.35rem 10rem; background: linear-gradient(90deg, #090607 37.81%, rgba(13, 10, 21, 0.00) 66.75%), url(../../../img/site/kor/content/02_img04.jpg) no-repeat center right / auto 100%;}
[data-content="02"] >div >em{display: block; font-size: 1.6rem; font-weight: 400; font-family: 'Pretendard';}
[data-content="02"] >div >h5{margin-top: 0.8rem; color: #fff;}
[data-content="02"] >div >p{display: block; color: rgba(255, 255, 255, 0.80); font-family: 'Pretendard'; font-size: 1.8rem; font-weight: 300; line-height: 1.4;}
[data-content="02"] >div >a{color: #33363D;}

@media screen and (max-width:1400px){
    [data-content="02"] >ul{gap: 4rem;}
    [data-content="02"] >ul >li a{padding: 3rem;}
    [data-content="02"] >div{padding: 5rem 6rem;}
}
@media screen and (max-width:1200px){
    [data-content="02"] >ul{gap: 3rem;}
    [data-content="02"] >ul >li a{padding: 2.5rem;}
    [data-content="02"] >div{padding: 4rem;}
}
@media screen and (max-width:1024px){
    [data-content="02"] >ul{gap: 2rem;}
    [data-content="02"] >ul >li a{padding: 2rem;}
    [data-content="02"] >div{padding: 3rem;}
    [data-content="02"] >ul >li img{object-position: center 10%;}
}
@media screen and (max-width:740px){
    [data-content="02"] >ul{gap: 1.5rem;}
    [data-content="02"] >ul >li a{padding: 1.5rem;}
    [data-content="02"] >ul >li img{top: 1.5rem; left: 50%; width: 80%; height: auto; transform: translateX(-50%);}
}
@media screen and (max-width:640px){
    [data-content="02"] >ul >li h4{}
    [data-content="02"] >ul >li em{font-size: 1.6rem;}
    [data-content="02"] >ul >li p{font-size: 1.6rem;}
    [data-content="02"] >ul >li b{font-size: 1.7rem;}
    [data-content="02"] >div{padding: 3rem 2rem; background-position: center right 60%;}
    [data-content="02"] >div >p{font-size: 1.8rem;}
}
@media screen and (max-width:480px){
    [data-content="02"] >ul{flex-wrap: wrap;}
    [data-content="02"] >ul >li a{justify-content: center; min-height: 23rem; padding: 1.5rem 1.5rem 1.5rem 18rem;}
    [data-content="02"] >ul >li a:before{display: none;}
    [data-content="02"] >ul >li img{left: 1rem; top: 3rem; width: auto; height: 18rem; transform: translateX(0);}
    [data-content="02"] >div{padding: 2rem;}
}

/*-------------------------------------------------------------------
    Products > 제품 상세
-------------------------------------------------------------------*/
[data-content="0201"]{}
[data-content="0201"]:before{content: ""; display: block; position: absolute; top: 50%; right: 50%; z-index: -1; width: 100vw; height: 130rem; background: url(../../../img/site/kor/content/0201_img07.svg) no-repeat right top / auto 100%; transform: translate(50%,-50%);}
[data-content="0201"] .box1{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 10rem; }
[data-content="0201"] .box1.ty2{align-items: stretch;}
[data-content="0201"] .box1.right{flex-direction: row-reverse;}
[data-content="0201"] .box1 .l{width: 100%; min-width: 0;}
[data-content="0201"] .box1.ty2 .l{display: flex; flex-wrap: wrap; flex-direction: column; align-content: flex-start; justify-content: space-between; align-items: flex-start; gap: 4rem;}
[data-content="0201"] .box1.ty2 .l [data-skin="list"]{margin-top: auto; margin-bottom: auto;}
[data-content="0201"] .box1.ty2 .l .list1{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 0.8rem; width: 100%;}
[data-content="0201"] .box1.ty2 .l .list1 >li{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: flex-start; gap: 0.8rem; width: 100%; padding: 1.6rem 2rem; background-color: #F4F5F6; border-radius: 0.4rem;}
[data-content="0201"] .box1.ty2 .l .list1 >li >img{display: block; width: 4.8rem;}
[data-content="0201"] .box1.ty2 .l .list1 >li >strong{display: block; width: 100%; margin-top: auto; margin-bottom: auto; font-size: 1.5rem; font-weight: 400; color: #33363D; line-height: 1.3; font-family: 'Pretendard';}
[data-content="0201"] .box1 .l .box1_list{}
[data-content="0201"] .box1 .l .box1_list >li{margin-top: 1.2rem; color: #33363D; font-size: 1.5rem;}
[data-content="0201"] .box1 .l .box1_list >li:first-child{margin-top: 0;}
[data-content="0201"] .box1 .l .box1_list >li >strong{margin-bottom: 0.6rem; font-size: 1.7rem; font-weight: 600;}
[data-content="0201"] .box1 >img{display: block; width: 46.8rem;}
[data-content="0201"] .box1 .l .box1_list >li >ul{}
[data-content="0201"] .box1 .l .box1_list >li >ul >li{margin-top: 0.6rem;}
[data-content="0201"] .box1 .l .box1_list >li >ul >li:first-child{margin-top: 0;}
[data-content="0201"] .box1 .l .box1_list >li >ul >li strong{font-weight: 500;}
[data-content="0201"] .box1 >.imgs{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2rem; flex-shrink: 0; width: 60.8rem;}
[data-content="0201"] .box1 >.imgs div{width: 100%;}
[data-content="0201"] .box1 >.imgs:not([style="width: 66rem;"]) div:nth-child(1){flex: 1.18;}
[data-content="0201"] .box1 >.imgs:not([style="width: 66rem;"]) div:nth-child(2){flex: 1;}
[data-content="0201"] .box1 >.imgs div img{display: block; width: 100%; border-radius: 0.4rem;}
[data-content="0201"] .box1 >.imgs div strong{display: block; margin-top: 1.2rem; text-align: center; color: #6D7882; font-weight: 600; line-height: 1.3; font-family: 'Pretendard'; letter-spacing: -0.03rem;}
[data-content="0201"] .scroll_img{overflow: hidden; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="0201"] .scroll_img >div{overflow: hidden; border-radius: 0.6rem;}
[data-content="0201"] .scroll_img >div >img{display: block; width: auto; max-width: 100%; margin: 0 auto;}
[data-content="0201"] .list2{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2.4rem;}
[data-content="0201"] .list2.divi_3{flex-wrap: wrap;}
[data-content="0201"] .list2.ty2{gap: 6rem;}
[data-content="0201"] .list2 >li{width: 100%; min-width: 0; padding: 2.4rem; background-color: #F4F5F6; border-radius: 0.4rem;}
[data-content="0201"] .list2.divi_3 >li{width: calc((100% - 2.4rem - 2.4rem) / 3);}
[data-content="0201"] .list2.ty2 >li{position: relative; }
[data-content="0201"] .list2.ty2 >li:not(:last-child):before{content: ""; display: block; position: absolute; top: 50%; left: calc(100% + 2.2rem); width: 0; height: 0; border-style: solid; border-width: 1rem 0 1rem 1.4rem; border-color: transparent transparent transparent #d4000f; transform: translateY(-50%);}
[data-content="0201"] .list2 >li img{display: block; width: 4.8rem;}
[data-content="0201"] .list2 >li strong{display: block; margin-top: 1.6rem; font-size: 1.8rem; font-weight: 600; line-height: 1.3; color: #1E2124;}
[data-content="0201"] .list2 >li p{display: block; margin-top: 1.2rem; font-size: 1.6rem; font-family: 'Pretendard'; letter-spacing: -0.032rem;}
[data-content="0201"] .list3{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 2.4rem;}
[data-content="0201"] .list3 >li{width: calc((100% - 2.4rem - 2.4rem) / 3); min-width: 0; padding: 2.4rem; background-color: #F4F5F6; border-radius: 0.4rem;}
[data-content="0201"] .list3 >li div{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 2rem;}
[data-content="0201"] .list3 >li div img{display: block; width: 4.8rem;}
[data-content="0201"] .list3 >li div strong{display: block; width: 100%; min-width: 0; font-size: 1.8rem; font-weight: 600; line-height: 1.3; color: #1E2124;}
[data-content="0201"] .list3 >li p{display: block; margin-top: 1.6rem; font-size: 1.6rem; font-family: 'Pretendard';}
[data-content="0201"] .list4{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 2.4rem;}
[data-content="0201"] .list4 >li{width: calc((100% - 2.4rem - 2.4rem - 2.4rem) / 4);}
[data-content="0201"] .list4.divi_3 >li{width: calc((100% - 2.4rem - 2.4rem) / 3);}
[data-content="0201"] .list4 >li >img{overflow: hidden; display: block; width: 100%; border-radius: 0.4rem; border: 1px solid #E6E8EA;}
[data-content="0201"] .list4 >li >strong{display: block; margin-top: 2rem; font-size: 1.8rem; font-weight: 500; line-height: 1.2; text-align: center;}
[data-content="0201"] .list4 >li >p{display: block; margin-top: 1.2rem; text-align: center; font-size: 1.6rem;  line-height: 1.2;}
[data-content="0201"] .box2{display: flex; flex-wrap: wrap; justify-content: space-evenly; align-items: stretch; gap: 2rem; padding: 2.8rem 2rem 2rem; background-color: #292728; border-radius: 0.6rem;}
[data-content="0201"] .box2 div{}
[data-content="0201"] .box2 div img{display: block; width: auto; max-width: 100%;}
[data-content="0201"] .box2 div p{display: block; margin-top: 1.6rem; text-align: center; font-size: 1.8rem; font-weight: 500; line-height: 1.2; color: rgba(255, 255, 255, 0.75);}
[data-content="0201"] .box3{display: flex; flex-wrap: nowrap; justify-content: space-evenly; align-items: stretch; gap: 2rem; padding: 7rem 2rem; background-color: #292728; border-radius: 0.6rem;}
[data-content="0201"] .box3.ty2{padding: 6.6rem 2rem;}
[data-content="0201"] .box3:before,
[data-content="0201"] .box3:after{content: ""; order: 2; display: block; height: 0; width: 0; margin-top: auto; margin-bottom: auto; border-style: solid; border-width: 1.9rem 0 1.9rem 3.4rem; border-color: transparent transparent transparent #d4000f;}
[data-content="0201"] .box3:after{order: 4;}
[data-content="0201"] .box3.ty2:after{display: none;}
[data-content="0201"] .box3 >div{width: 100%; max-width: 28rem; min-width: 0;}
[data-content="0201"] .box3.ty2 >div{max-width: 37.5rem;}
[data-content="0201"] .box3 >div:nth-child(1){order: 1;}
[data-content="0201"] .box3 >div:nth-child(2){order: 3;}
[data-content="0201"] .box3 >div:nth-child(3){order: 5;}
[data-content="0201"] .box3 >div img{width: 100%;}
[data-content="0201"] .box3 >div.t{display: block; position: relative; height: auto;}
[data-content="0201"] .box3 >div.t:before{content: ""; display: block; width: 100%; height: auto; padding-top: 100%; background-color: rgba(212, 0, 15, 0.75); border-radius: 50%;}
[data-content="0201"] .box3 >div.t span{display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0.8rem; position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 2rem; color: rgba(255, 255, 255, 0.75); font-size: 2rem; font-weight: 400; line-height: 1.2;  text-align: center;}
[data-content="0201"] .box3 >div.t span strong{display: block; width: 100%; font-size: 4.6rem; font-weight: 500; line-height: 1.2; color: #fff;}
[data-content="0201"] .box3.ty2 >div p{display: block; margin-top: 2.4rem; text-align: center; color: #E6E8EA; font-weight: 500; line-height: 1.5;}
[data-content="0201"] .box4{display: flex; flex-wrap: nowrap; justify-content: flex-end; align-items: stretch; gap: 4rem; padding: 2rem 4rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="0201"] .box4 .l{display: flex; flex-wrap: nowrap; justify-content: space-evenly; align-items: center; gap: 2rem; width: 100%; margin-left: auto; margin-right: auto;}
[data-content="0201"] .box4 .l span{width: 100%; max-width: 12rem; min-width: 0; text-align: center; }
[data-content="0201"] .box4 .l span:nth-child(1){order: 1;}
[data-content="0201"] .box4 .l span:nth-child(2){order: 3;}
[data-content="0201"] .box4 .l span:nth-child(3){order: 5;}
[data-content="0201"] .box4 .l:before,
[data-content="0201"] .box4 .l:after{content: ""; order: 2; display: block; height: 0; width: 0; margin-top: auto; margin-bottom: auto; border-style: solid; border-width: 1.9rem 0 1.9rem 3.4rem; border-color: transparent transparent transparent #d4000f;}
[data-content="0201"] .box4 .l:after{order: 4;}
[data-content="0201"] .box4 .r{flex-shrink: 0; width: auto; width: 52.2rem; min-width: 0; padding: 2rem 3rem; background-color: #E6E8EA; border-radius: 0.6rem;}
[data-content="0201"] .box4 .l span img,
[data-content="0201"] .box4 .r img{display: block; max-width: 100%; margin-bottom: 2.4rem;}
[data-content="0201"] .box4 .l span,
[data-content="0201"] .box4 .r{font-size: 2rem; color: #1E2124; font-weight: 500; line-height: 1.4;}
[data-content="0201"] .box5{padding: 4rem 4.8rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="0201"] .box5 >div{overflow-y: auto; }
[data-content="0201"] .box5 .move{display: inline-block;}
[data-content="0201"] .box5 .move strong{display: block; text-align: right; font-weight: 500; font-size: 3.2rem; padding-right: 5rem; color: #1E2124;}
[data-content="0201"] .box5 .move img{display: block; max-width: 100%;}
[data-content="0201"] .box6{}
[data-content="0201"] .box6 .t{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 8rem; padding: 2rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="0201"] .box6 .t >div{overflow: hidden; display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 1rem; position: relative; width: 100%; min-width: 0; border-radius: 0.6rem;}
[data-content="0201"] .box6 .t >.r{background-color: rgba(255, 255, 255, 0.10);}
[data-content="0201"] .box6 .t >div >div{display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 1rem; height: auto;}
[data-content="0201"] .box6 .t >div >div img{width: 100%;}
[data-content="0201"] .box6 .t >div em{position: absolute; top: 0; left: 0; padding: 0.6rem 1.6rem; color: #fff; font-size: 1.7rem; background-color: #D4000F; border-bottom-right-radius: 0.6rem;}
[data-content="0201"] .box6 .b{overflow: hidden; display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; margin-top: 4rem;}
[data-content="0201"] .box6 .b >*{width: 100%; min-width: 0;}
[data-content="0201"] .box6 .b >p{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; flex-shrink: 0; width: 8rem; text-align: center; font-size: 3.2rem; font-weight: 200;}
[data-content="0201"] .box6 .b >div{background-color: #E6E8EA; border-radius: 0.6rem;}
[data-content="0201"] .box6 .b >.l{background-color: transparent; border-color: #D4000F; border: 1px solid #D4000F;}
[data-content="0201"] .box6 .b >div >strong{display: block; padding: 1.2rem 2rem; font-size: 1.8rem; font-weight: 500; line-height: 1.2; text-align: center; line-height: 1.2; color: #fff; font-weight: 500; background-color: #58616A;}
[data-content="0201"] .box6 .b >.l >strong{background-color: #D4000F;}
[data-content="0201"] .box6 .b >div >.m{padding: 2rem;}
[data-content="0201"] .box6 .b >div >.m b{display: block; font-size: 1.8rem; font-weight: 600; line-height: 1.2; color: #1E2124;}
[data-content="0201"] .box6 .b >div >.m p{margin-top: 0.8rem; font-family: 'Pretendard';}
[data-content="0201"] .box6 .b >div >.m ul{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2rem; margin-top: 2rem;}
[data-content="0201"] .box6 .b >div >.m ul li{width: 100%; min-width: 0;}
[data-content="0201"] .box6 .b >div >.m ul li img{display: block; width: 100%; border-radius: 0.4rem;}
[data-content="0201"] .box6 .b >div >.m ul li span{display: block; margin-top: 1.2rem; text-align: center; font-size: 1.8rem; font-weight: 500; line-height: 1.2; color: #1E2124;}
[data-content="0201"] .box6 .b >div >.f{padding: 2.4rem 2rem; background-color: rgba(255, 255, 255, 0.10);}
[data-content="0201"] .box6 .b >.l >.f{background-color: rgba(212, 0, 15, 0.30);}
[data-content="0201"] .box6 .b >div >.f b{display: block; text-align: center; font-size: 2.4rem; font-weight: 600;}
[data-content="0201"] .box6 .b >.l >.f b{color: #D4000F; font-weight: 700;}
[data-content="0201"] .box6 .b >div >.f ul{display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; justify-content: flex-start; align-items: center; margin-top: 0.8rem;}
[data-content="0201"] .box6 .b >div >.f ul li{position: relative; padding-left: 0.8rem; color: #464C53;}
[data-content="0201"] .box6 .b >div >.f ul li:before{content: "·"; position: absolute; top: 0; left: 0; font-weight: 700;}
[data-content="0201"] .list5{display: flex; flex-wrap: nowrap; justify-content: space-around; align-items: stretch; gap: 3.2rem;}
[data-content="0201"] .list5 >li{position: relative; width: 100%; max-width: 26rem;}
[data-content="0201"] .list5 >li:before{content: ""; display: block; width: 100%; height: auto; padding-top:  100%; background-color: #D4000F; border-radius: 50%;}
[data-content="0201"] .list5 >li span{display: flex; flex-wrap: wrap; justify-content: center; align-items: center;  position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 2rem; font-size: 2.2rem; font-weight: 400; line-height: 1.2; color: #fff;}

@media screen and (max-width:1400px) and (min-width:1201px){
    [data-content="0201"] .box1.ty2 .l .list1{flex-wrap: wrap;}
    [data-content="0201"] .box1.ty2 .l .list1 >li{width: calc((100% - 0.8rem) / 2);}
}
@media screen and (max-width:1640px){
    [data-content="0201"]:before{height: 110rem;}
    [data-content="0201"] .box1{gap: 6rem;}
    [data-content="0201"] .box1 >img{width: 42rem;}
    [data-content="0201"] .box1 >.imgs{width: 53rem;}
    [data-content="0201"] .list2.ty2{gap: 5rem;}
    [data-content="0201"] .list2.ty2 >li:not(:last-child):before{left: calc(100% + 1.9rem);}
    [data-content="0201"] .box5{padding: 3rem 3.5rem;}
    [data-content="0201"] .box5 .move strong{padding-right: 0;}
    [data-content="0201"] .box6 .t{gap: 6rem;}
    [data-content="0201"] .box6 .b >p{width: 6rem;}
    [data-content="0201"] .list5{gap: 3rem;}
}
@media screen and (max-width:1400px){
    [data-content="0201"]:before{height: 90rem;}
    [data-content="0201"] .box1{gap: 5rem;}
    [data-content="0201"] .box1 >img{width: 40rem;}
    [data-content="0201"] .box1 >.imgs{width: 48rem;}
    [data-content="0201"] .list2.ty2{gap: 3.5rem;}
    [data-content="0201"] .list2.ty2 >li:not(:last-child):before{left: calc(100% + 1.2rem); border-width: 0.8rem 0 0.8rem 1.2rem;}
    [data-content="0201"] .box3:before,
    [data-content="0201"] .box3:after{border-width: 1.7rem 0 1.7rem 3rem;}
    [data-content="0201"] .box3 >div.t span{font-size: 1.8rem;}
    [data-content="0201"] .box3 >div.t span strong{font-size: 4.2rem;}
    [data-content="0201"] .box3.ty2 >div p{margin-top: 1.6rem; font-size: 1.8rem;}
    [data-content="0201"] .box4{padding: 2rem 3rem;}
    [data-content="0201"] .box4 .l{gap: 1.5rem;}
    [data-content="0201"] .box4 .l:before,
    [data-content="0201"] .box4 .l:after{border-width: 1.7rem 0 1.7rem 3rem;}
    [data-content="0201"] .box4 .r{width: 50%; padding: 2rem;}
    [data-content="0201"] .box4 .l span img, [data-content="0201"] .box4 .r img{margin-bottom: 1.6rem;}
    [data-content="0201"] .box4 .l span, [data-content="0201"] .box4 .r{font-size: 1.8rem;}
    [data-content="0201"] .box5{padding: 3rem 3.5rem;}
    [data-content="0201"] .box5 .move strong{padding-right: 5.5rem; font-size: 3rem;}
}
@media screen and (max-width:1200px){
    [data-content="0201"]:before{height: 80rem;}
    [data-content="0201"] .box1{gap: 4rem;}
    [data-content="0201"] .box1 >img{width: 36rem;}
    [data-content="0201"] .box1 >.imgs{width: 52rem;}
    [data-content="0201"] .list5{gap: 2.5rem;}
}
@media screen and (max-width:1024px){
    [data-content="0201"]:before{height: 70rem;}
    [data-content="0201"] .box1{flex-wrap: wrap; gap: 2rem;}
    [data-content="0201"] .box1.right{flex-direction: row;}
    [data-content="0201"] .box1 >img{order: 2; width: 40rem; max-width: 100%;}
    [data-content="0201"] .box1 .l{order: 2;}
    [data-content="0201"] .box1 >.imgs{gap: 1.5rem;}
    [data-content="0201"] .list2.ty2{gap: 2rem;}
    [data-content="0201"] .list2.ty2 >li:not(:last-child):before{display: none;}
    [data-content="0201"] .list2{flex-wrap: wrap; gap: 2rem;}
    [data-content="0201"] .list2 >li{width: calc((100% - 2rem) / 2); padding: 2rem;}
    [data-content="0201"] .list2.divi_3 >li{width: calc((100% - 2rem - 2rem) / 3);}
    [data-content="0201"] .list3{gap: 2rem;}
    [data-content="0201"] .list3 >li{width: calc((100% - 2rem - 2rem) / 3); padding: 2rem;}
    [data-content="0201"] .list3 >li div{display: block; }
    [data-content="0201"] .list3 >li div strong{margin-top: 1.6rem;}
    [data-content="0201"] .list3 >li p{margin-top: 0.8rem;}
    [data-content="0201"] .list4{gap: 2rem;}
    [data-content="0201"] .list4 >li{width: calc((100% - 2rem - 2rem) / 3);}
    [data-content="0201"] .list4.divi_3 >li{width: calc((100% - 2rem - 2rem) / 3);}
    [data-content="0201"] .list4 >li >strong{margin-top: 1.6rem;}
    [data-content="0201"] .list4 >li >p{margin-top: 0.8rem;}
    [data-content="0201"] .box2{padding: 2rem;}
    [data-content="0201"] .box2 div{width: auto; max-width: calc((100% - 2rem) / 2);}
    [data-content="0201"] .box2 div p{margin-top: 1.2rem; font-size: 1.6rem;}
    [data-content="0201"] .box3{padding: 5rem 2rem;}
    [data-content="0201"] .box3.ty2{padding: 3.5rem 2rem;}
    [data-content="0201"] .box3:before,
    [data-content="0201"] .box3:after{border-width: 1.5rem 0 1.5rem 2.8rem;}
    [data-content="0201"] .box3 >div.t span{font-size: 1.7rem;}
    [data-content="0201"] .box3 >div.t span strong{font-size: 4rem;}
    [data-content="0201"] .box3.ty2 >div p{margin-top: 1.2rem; font-size: 1.6rem;}
    [data-content="0201"] .box4{padding: 2rem;}
    [data-content="0201"] .box4 .l{gap: 1.25rem;}
    [data-content="0201"] .box4 .l:before,
    [data-content="0201"] .box4 .l:after{border-width: 1.5rem 0 1.5rem 2.8rem;}
    [data-content="0201"] .box4 .r{padding: 1.75rem;}
    [data-content="0201"] .box4 .l span img,
    [data-content="0201"] .box4 .r img{margin-bottom: 1.2rem;}
    [data-content="0201"] .box4 .l span,
    [data-content="0201"] .box4 .r{font-size: 1.6rem;}
    [data-content="0201"] .box5{padding: 2.5rem 2rem;}
    [data-content="0201"] .box5 .move strong{padding-right: 6rem; font-size: 2.8rem;}
    [data-content="0201"] .box6 .t{gap: 5rem;}
    [data-content="0201"] .box6 .t >div em{padding: 0.4rem 1.2rem; font-size: 1.6rem;}
    [data-content="0201"] .box6 .b{margin-top: 3rem;}
    [data-content="0201"] .box6 .b >div >.m ul{gap: 1.75rem; margin-top: 1.6rem;}
    [data-content="0201"] .box6 .b >div >.m ul li span{margin-top: 1rem;}
    [data-content="0201"] .box6 .b >div >.f{padding: 1.6rem 2rem;}
    [data-content="0201"] .box6 .b >div >.f ul{margin-top: 0.6rem;}
    [data-content="0201"] .box6 .b >p{width: 5rem; font-size: 2.8rem;}
    [data-content="0201"] .list5{gap: 2rem;}
}
@media screen and (max-width:840px){
    [data-content="0201"] .scroll_img{overflow-x: auto;}
    [data-content="0201"] .scroll_img >div{width: 100rem;}
    [data-content="0201"] .list2,
    [data-content="0201"] .list2.ty2{gap: 1.5rem;}
    [data-content="0201"] .list2 >li{width: calc((100% - 1.5rem) / 2); padding: 2rem;}
    [data-content="0201"] .list2.divi_3 >li{width: calc((100% - 1.5rem) / 2);}
    [data-content="0201"] .list3{gap: 1.5rem;}
    [data-content="0201"] .list3 >li{width: calc((100% - 1.5rem) / 2);}
    [data-content="0201"] .list4.divi_3 >li{width: calc((100% - 1.5rem) / 2);}
    [data-content="0201"] .list4{gap: 1.5rem;}
    [data-content="0201"] .list4 >li{width: calc((100% - 1.5rem) / 2);}
    [data-content="0201"] .box2{gap: 1.5rem;}
    [data-content="0201"] .box2 div{max-width: calc((100% - 1.5rem) / 2);}
    [data-content="0201"] .box3{gap: 1.75rem; padding: 4rem 2rem;}
    [data-content="0201"] .box3.ty2{padding: 3rem 2rem;}
    [data-content="0201"] .box3:before,
    [data-content="0201"] .box3:after{border-width: 1rem 0 1rem 1.7rem;}
    [data-content="0201"] .box3 >div.t span{padding: 1.5rem; font-size: 1.6rem;}
    [data-content="0201"] .box3 >div.t span strong{font-size: 3.2rem;}
    [data-content="0201"] .box5 .move img{width: 90rem; max-width: none;}
    [data-content="0201"] .box5 .move strong{font-size: 2.6rem; padding-right: 0; text-align: center;}
    [data-content="0201"] .box6 .t{gap: 2rem;}
    [data-content="0201"] .box6 .b{flex-direction: column; gap: 1rem;}
    [data-content="0201"] .box6 .b >p{width: 100%; font-size: 2.6rem; line-height: 1;}
    [data-content="0201"] .list5 >li div span{font-size: 1.8rem;}
    [data-content="0201"] .list5{flex-wrap: wrap; gap: 3rem 2rem;}
    [data-content="0201"] .list5 >li{width: calc((100% - 2rem) / 2); max-width: none;}
    [data-content="0201"] .list5 >li div{width: 100%; max-width: 18rem; margin: 0 auto;}
}
@media screen and (max-width:640px){
    [data-content="0201"]:before{height: 60rem;}
    [data-content="0201"] .scroll_img >div{width: 80rem;}
    [data-content="0201"] .box1 >img{width: 36rem;}
    [data-content="0201"] .box1 >.imgs{width: 100%;}
    [data-content="0201"] .box1 >.imgs >div >strong{font-size: 1.6rem;}
    [data-content="0201"] .box1.ty2 .l{gap: 2rem;}
    [data-content="0201"] .box1.ty2 .l .list1{flex-wrap: wrap; gap: 1.25rem;}
    [data-content="0201"] .box1.ty2 .l .list1 >li{display: block; width: calc((100% - 1.25rem) / 2); padding: 2rem 1.5rem 2rem;}
    [data-content="0201"] .box1.ty2 .l .list1 >li >img{width: 4rem;}
    [data-content="0201"] .box1.ty2 .l .list1 >li >strong{margin-top: 1.6rem; font-size: 1.8rem; font-weight: 500; line-height: 1.3; font-family: 'Poppins';}
    [data-content="0201"] .box1 .l .box1_list >li >strong{font-size: 1.8rem;}
    [data-content="0201"] .box1 .l .box1_list >li >p,
    [data-content="0201"] .box1 .l .box1_list >li >ul{font-size: 1.7rem !important;}
    [data-content="0201"] .list2,
    [data-content="0201"] .list2.ty2{gap: 1.25rem;}
    [data-content="0201"] .list2 >li{width: calc((100% - 1.25rem) / 2); padding: 2rem 1.5rem 2rem;}
    [data-content="0201"] .list2 >li strong,
    [data-content="0201"] .list3 >li div strong,
    [data-content="0201"] .list4 >li >strong{font-size: 2rem;}
    [data-content="0201"] .list2 >li p,
    [data-content="0201"] .list3 >li p,
    [data-content="0201"] .list4 >li >p{font-size: 1.8rem;}
    [data-content="0201"] .list2.divi_3 >li{width: calc((100% - 1.25rem) / 2);}
    [data-content="0201"] .list2 >li img{width: 4rem;}
    [data-content="0201"] .list3{gap: 1.25rem;}
    [data-content="0201"] .list3 >li{width: calc((100% - 1.25rem) / 2); padding: 2rem 1.5rem 2rem;}
    [data-content="0201"] .list3 >li div img{width: 4rem;}
    [data-content="0201"] .list4{gap: 2rem 1.25rem;}
    [data-content="0201"] .list4 >li{width: calc((100% - 1.25rem) / 2);}
    [data-content="0201"] .list4.divi_3 >li{width: calc((100% - 1.25rem) / 2);}
    [data-content="0201"] .box2{gap: 1.25rem;}
    [data-content="0201"] .box2 div{max-width: calc((100% - 1.25rem) / 2);}
    [data-content="0201"] .box3{flex-direction: column; align-items: center; gap: 0; padding: 1rem 2rem 0;}
    [data-content="0201"] .box3.ty2{gap: 2rem; padding: 2.5rem 2rem;}
    [data-content="0201"] .box3:before,
    [data-content="0201"] .box3:after{border-width: 1.7rem 1rem 0 1rem; border-color: #D4000F transparent transparent transparent;}
    [data-content="0201"] .box3:after{margin-bottom: 1rem;}
    [data-content="0201"] .box3 >div.t{max-width: none; width: 100%; height: auto; margin: 2rem 0 2.5rem; background-color: rgba(212, 0, 15, 0.75); border-radius: 0.4rem;}
    [data-content="0201"] .box3 >div.t:before{display: none;}
    [data-content="0201"] .box3 >div.t span{display: block; position: relative;}
    [data-content="0201"] .box3 >div.t span strong{margin-bottom: 0.4rem; font-size: 2.6rem;}
    [data-content="0201"] .box4{flex-direction: column; gap: 2rem; padding: 2rem;}
    [data-content="0201"] .box4 .l{max-width: 45rem;}
    [data-content="0201"] .box4 .l:before,
    [data-content="0201"] .box4 .l:after{border-width: 1rem 0 1rem 1.7rem;}
    [data-content="0201"] .box4 .r{width: 100%;}
    [data-content="0201"] .box4 .r img{display: block; width: 100%;}
    [data-content="0201"] .box5{padding: 2rem;}
    [data-content="0201"] .box5 .move img{width: 80rem; margin-top: 0;}
    [data-content="0201"] .box5 .move strong{font-size: 2.4rem;}
    [data-content="0201"] .box6 .t{flex-wrap: wrap; gap: 1rem;}
    [data-content="0201"] .box6 .b{margin-top: 2rem;}
    [data-content="0201"] .list5 >li div{max-width: 15rem;}
    [data-content="0201"] .list5 >li div span{font-size: 1.6rem;}
}
@media screen and (max-width:480px){
    [data-content="0201"]:before{height: 50rem;}
    [data-content="0201"] .box1 >img{width: 100%;}
    [data-content="0201"] .box1.ty2 .l .list1 >li >img,
    [data-content="0201"] .list2 >li img,
    [data-content="0201"] .list3 >li div img{width: 3.6rem;}
    [data-content="0201"] .box1.ty2 .l .list1 >li >strong,
    [data-content="0201"] .list2 >li strong,
    [data-content="0201"] .list3 >li div strong{margin-top: 1.2rem;}
    [data-content="0201"] .box2{gap: 2rem;}
    [data-content="0201"] .box2 div{max-width: 100%;}
}

/*-------------------------------------------------------------------
    technology > 공정기술 > 핵심기술
-------------------------------------------------------------------*/
[data-content="030101"]{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: flex-start; align-items: flex-start; align-content: flex-start; gap: 2.4rem;}
[data-content="030101"] >div{overflow: hidden; width: 100%; border: 1px solid #D4000F; border-radius: 0.4rem;}
[data-content="030101"] >div >strong{display: block; width: 100%; padding: 1.2rem 2rem; text-align: center; font-size: 2rem; font-weight: 600; color: #fff; background-color: #D4000F;}
[data-content="030101"] >div .ins{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: flex-start; align-items: flex-start; align-content: flex-start; gap: 2rem; padding: 2rem;}
[data-content="030101"] >div .ins .h{display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 0.4rem 0; width: 100%;}
[data-content="030101"] >div .ins .h li{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; color: rgba(0, 0, 0, 0.75); font-size: 1.8rem; font-weight: 600; line-height: 1.2;}
[data-content="030101"] >div .ins .h li:not(:last-child):after{content: ""; display: block; width: 1px; height: 1.1rem; margin: 0 1.6rem; background-color: rgba(0, 0, 0, 0.25);}
[data-content="030101"] >div .ins .f{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 1rem; width: 100%;}
[data-content="030101"] >div .ins .f >div{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 1rem; width: 100%; min-width: 0;}
[data-content="030101"] >div .ins .f .list1{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 1rem; width: 100%;}
[data-content="030101"] >div .ins .f .list1 >li{overflow: hidden; width: 100%; min-width: 0; border: 1px solid #CDD1D5; border-radius: 0.4rem;}
[data-content="030101"] >div .ins .f .list1 >li >b{display: block; width: 100%; padding: 1.2rem 2rem; color: #1E2124; font-weight: 600; text-align: center;background-color: #E6E8EA;}
[data-content="030101"] >div .ins .f .list1 >li >div{display: flex; flex-direction: column; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start; align-items: flex-start; gap: 0.8rem; padding: 1.6rem 2rem; color: #464C53; font-size: 1.6rem; font-weight: 400; letter-spacing: -0.032rem;}
[data-content="030101"] >div .ins .f .list1 >li >div >em{display: block; width: 100%; text-align: center; color: #D4000F; font-size: 1.8rem; font-weight: 600; letter-spacing: 0; line-height: 1.2;}
[data-content="030101"] >div .ins .f .list1 >li >div >p{display: block; width: 100%; text-align: center;}
[data-content="030101"] >div .ins .f >div >div{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center; align-items: center; gap: 0.6rem; width: 100%; padding: 2rem; color: rgba(0, 0, 0, 0.75); font-weight: 500; letter-spacing: -0.034rem; background-color: rgba(212, 0, 15, 0.15); border-radius: 0.4rem;}
[data-content="030101"] >div .ins .f >div >div em{display: block; width: 100%; text-align: center;color: #D4000F; font-weight: 700; letter-spacing: 0; font-size: 2rem;}

@media screen and (max-width:1300px){
    [data-content="030101"] >div .ins{gap: 1.75rem;}
    [data-content="030101"] >div .ins .f{flex-wrap: wrap;}
    [data-content="030101"] >div .ins .f .list1{flex-wrap: wrap; }
    [data-content="030101"] >div .ins .f .list1 >li{width: calc((100% - 1rem) / 2);}
    [data-content="030101"] >div .ins .f .list1 >li >b{padding: 1rem 1.5rem;}
    [data-content="030101"] >div .ins .f .list1 >li >b br{display: none;}
    [data-content="030101"] >div .ins .f .list1 >li >div{gap: 0.5rem; padding: 1.4rem 1.5rem;}
    [data-content="030101"] >div .ins .f >div >div{gap: 0.4rem; padding: 1.5rem;}
}
@media screen and (max-width:640px){
	[data-content="030101"] >div >strong{font-size: 2.2rem;}
	[data-content="030101"] >div .ins .h li{font-size: 2rem;}
	[data-content="030101"] >div .ins .f .list1 >li >b{font-size: 1.9rem;}
	[data-content="030101"] >div .ins .f .list1 >li >div{font-size: 1.8rem;}
}
@media screen and (max-width:480px){
    [data-content="030101"] >div .ins .f .list1 >li{width: 100%;}
}

/*-------------------------------------------------------------------
    technology > 공정기술 > DMT® Technology
-------------------------------------------------------------------*/
[data-content="030102"]{}
[data-content="030102"] .box1{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 10rem; }
[data-content="030102"] .box1.ty2{align-items: stretch;}
[data-content="030102"] .box1.right{flex-direction: row-reverse;}
[data-content="030102"] .box1 .l{width: 100%; min-width: 0;}
[data-content="030102"] .box1.ty2 .l{display: flex; flex-wrap: wrap; flex-direction: column; align-content: flex-start; justify-content: space-between; align-items: flex-start; gap: 4rem;}
[data-content="030102"] .box1.ty2 .l .list1{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 0.8rem; width: 100%; }
[data-content="030102"] .box1.ty2 .l .list1 >li{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: flex-start; gap: 0.8rem; width: 100%; padding: 1.6rem 2rem; background-color: #292728; border-radius: 0.4rem;}
[data-content="030102"] .box1.ty2 .l .list1 >li >img{display: block; width: 4.8rem;}
[data-content="030102"] .box1.ty2 .l .list1 >li >strong{display: block; width: 100%; margin-top: auto; margin-bottom: auto; font-size: 1.5rem; font-weight: 300; line-height: 1.3; font-family: 'Pretendard';}
[data-content="030102"] .box1.ty3{overflow: hidden; align-items: stretch; background-color: #F4F5F6; border-radius: 0.4rem;}
[data-content="030102"] .box1.ty3 .l{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: flex-start; padding: 3rem 4.8rem; padding-right: 0;}
[data-content="030102"] .box1.ty3 >img{height: auto; object-fit: cover; border-radius: 0 0.4rem 0.4rem 0;}
[data-content="030102"] .box1 >.imgs{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2rem; flex-shrink: 0; width: 60.8rem;}
[data-content="030102"] .box1 >.imgs div{width: 100%;}
[data-content="030102"] .box1 >.imgs:not([style="width: 66rem;"]) div:nth-child(1){flex: 1.18;}
[data-content="030102"] .box1 >.imgs:not([style="width: 66rem;"]) div:nth-child(2){flex: 1;}
[data-content="030102"] .box1 >.imgs div img{display: block; width: 100%; border-radius: 0.4rem;}
[data-content="030102"] .box1 >.imgs div strong{display: block; margin-top: 1.2rem; text-align: center; color: #6D7882; font-weight: 600; line-height: 1.3; font-family: 'Pretendard'; letter-spacing: -0.03rem;}
[data-content="030102"] .box1 .l .box1_list{}
[data-content="030102"] .box1 .l .box1_list >li{margin-top: 1.2rem; color: #CDD1D5; font-size: 1.5rem; font-weight: 300;}
[data-content="030102"] .box1 .l .box1_list >li:first-child{margin-top: 0;}
[data-content="030102"] .box1 .l .box1_list >li >strong{margin-bottom: 0.6rem; font-size: 1.7rem; font-weight: 600;}
[data-content="030102"] .box1 >img,
[data-content="030102"] .box1 >video{display: block; width: 46.8rem; border-radius: 0.4rem; border: 1px solid #E6E8EA;}
[data-content="030102"] .box1 .l .box1_list >li >ul{}
[data-content="030102"] .box1 .l .box1_list >li >ul >li{margin-top: 0.6rem;}
[data-content="030102"] .box1 .l .box1_list >li >ul >li:first-child{margin-top: 0;}
[data-content="030102"] .box1 .l .box1_list >li >ul >li strong{font-weight: 500;}
[data-content="030102"] .box2{}
[data-content="030102"] .box2 .imgs{display: flex; flex-wrap: nowrap; align-content: center; justify-content: space-around; align-items: center; gap: 2rem; padding: 2rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="030102"] .box2 .imgs img{display: block; width: auto; min-width: 0;;}
[data-content="030102"] .box2 ul{display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; align-content: flex-start; gap: 10rem;}
[data-content="030102"] .box2 ul >li{width: 100%; min-width: 0;}
[data-content="030102"] .box2 ul >li >strong{display: block; color: #D4000F; font-weight: 600; font-size: 2rem;}
[data-content="030102"] .box2 ul >li >p{display: block; color: #33363D; font-size: 1.6rem; font-weight: 400; font-family: 'Pretendard';}
[data-content="030102"] .box3{padding: 3.2rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="030102"] .box3 .t{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 4rem;}
[data-content="030102"] .box3 .t table{display: table; table-layout: fixed; width: 100%; border-top: 2px solid #D4000F; background-color: #fff; font-family: 'Pretendard'; font-size: 1.5rem; text-align: center;}
[data-content="030102"] .box3 .t table thead{}
[data-content="030102"] .box3 .t table thead tr{border-bottom: 1px solid rgba(0, 0, 0, 0.10);}
[data-content="030102"] .box3 .t table thead tr th{height: 5.3rem; padding: 1rem; background-color: rgba(212, 0, 15, 0.10); color: #1E2124; font-weight: 500;}
[data-content="030102"] .box3 .t table thead tr >*:not(:last-child){border-right: 1px solid rgba(0, 0, 0, 0.10);}
[data-content="030102"] .box3 .t table tbody{}
[data-content="030102"] .box3 .t table tbody tr{border-bottom: 1px solid rgba(0, 0, 0, 0.10);}
[data-content="030102"] .box3 .t table tbody tr >*:not(:last-child){border-right: 1px solid rgba(0, 0, 0, 0.10);}
[data-content="030102"] .box3 .t table tbody tr th{height: 5.3rem; padding: 1rem; background-color: rgba(212, 0, 15, 0.10); color: #1E2124; font-weight: 500;}
[data-content="030102"] .box3 .t table tbody tr td{height: 5.3rem; padding: 1rem;}
[data-content="030102"] .box3 .t .mo{display: none;}
[data-content="030102"] .box3 .t .l div:last-child >ul li p{border-right: 0;}
[data-content="030102"] .box3 .t .img{overflow: hidden; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; align-content: center; width: auto; max-width: 100%; min-width: 43.2rem; border-radius: 0.6rem; background-color: #fff;}
[data-content="030102"] .box3 .t .img img{display: block; width: 100%; object-fit: contain;}
[data-content="030102"] .box3 .b{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 4rem;}
[data-content="030102"] .box3 .b div{display: flex; flex-direction: column; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start; align-items: flex-start; gap: 1.6rem; width: 100%; min-width: 0;}
[data-content="030102"] .box3 .b div strong{display: block; color: #1E2124; font-size: 1.8rem; font-weight: 600; line-height: 1.2;}
[data-content="030102"] .box3 .b div img{display: block; width: 100%; border-radius: 0.4rem;}
[data-content="030102"] .box3 .b div p{font-family: 'Pretendard';}
[data-content="030102"] .box4{padding: 3.8rem 4rem 8rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="030102"] .box4 img{display: block; width: 100%;}
[data-content="030102"] .box4 img.mo{display: none;}
[data-content="030102"] .box5{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap:  3.6rem 2rem; position: relative; padding: 4rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="030102"] .box5 strong{display: block; width: 100%; text-align: center; color: #1E2124; font-size: 2.4rem; font-weight: 600;}
[data-content="030102"] .box5 p{position: absolute; top: 6rem; right: 4rem; color: #6D7882; font-size: 1.4rem; font-weight: 400; font-family: 'Pretendard';}
[data-content="030102"] .box5 div{width: 100%; border-bottom: 2px solid #CDD1D5;}
[data-content="030102"] .box5 div img{display: block; width: auto; max-width: 100%; margin: 0 auto;}
[data-content="030102"] .box6{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap:  3.6rem 2rem; position: relative; padding: 4.8rem 2rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="030102"] .box6 strong{order: 1; display: block; width: 100%; text-align: center; color: #1E2124; font-size: 2.4rem; font-weight: 600;}
[data-content="030102"] .box6 p{order: 3; width: 100%; color: #6D7882; font-size: 1.4rem; font-weight: 400; font-family: 'Pretendard'; text-align: right}
[data-content="030102"] .box6 div{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2rem; order: 2; padding: 0 1rem;}
[data-content="030102"] .box6 div ul{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: space-between; align-items: flex-end;}
[data-content="030102"] .box6 div ul li{color: #464C53; font-size: 1.6rem; font-weight: 500;}
[data-content="030102"] .box6 div img{display: block; width: 100%; min-width: 0;}
[data-content="030102"] .box7{display: flex; flex-wrap: wrap; justify-content: space-evenly; align-items: stretch; gap: 1rem; position: relative; padding: 2.4rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="030102"] .box7 >li{display: block; }
[data-content="030102"] .box7 >li img{display: block; width: 12rem; height: 12rem; margin: 0 auto; background-color: rgba(0, 0, 0, 0.25); border-radius: 50%;}
[data-content="030102"] .box7 >li strong{display: block; width: 100%; margin-top: 1.6rem; text-align: center; color: #33363D; font-size: 1.8rem; font-weight: 500; letter-spacing: -0.036rem;}
[data-content="030102"] .box7 >li ul{margin-top: 0.8rem;}
[data-content="030102"] .box7 >li ul li{color: #464C53; font-size: 1.5rem; font-family: 'Pretendard';}
[data-content="030102"] .box8{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 4rem; padding: 2rem; background-color: #F4F5F6;}
[data-content="030102"] .box8 >div{}
[data-content="030102"] .box8 >div >strong{display: block; width: 100%; margin-bottom: 2.4rem; color: #D4000F; font-size: 2.4rem; font-weight: 600;}
[data-content="030102"] .box8 >.l{flex: 1.9; width: 100%;}
[data-content="030102"] .box8 >.l >div{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 3.2rem; width: 100%; min-width: 0;}
[data-content="030102"] .box8 >.l >div img{width: calc((100% - 3.2rem) / 2); border-radius: 0.4rem;}
[data-content="030102"] .box8 >.r{flex: 1.1;}
[data-content="030102"] .box8 >.r ul{display: block; width: 100%; border-top: 2px solid #D4000F; background-color: #fff;}
[data-content="030102"] .box8 >.r ul li{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch;}
[data-content="030102"] .box8 >.r ul li *{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 100%; min-height: 5.3rem; padding: 1rem; font-size: 1.5rem; text-align: center; border-bottom: 1px solid rgba(0, 0, 0, 0.10); font-family: 'Pretendard';}
[data-content="030102"] .box8 >.r ul li b{color: #1E2124; font-weight: 500; border-right: 1px solid rgba(0, 0, 0, 0.10); background-color: rgba(212, 0, 15, 0.10);}
[data-content="030102"] .box8 >.r ul li p{color: #D4000F;}
[data-content="030102"] .box8 >.r >p{margin-top: 1.6rem; color: rgba(0, 0, 0, 0.75); font-size: 1.5rem;}
[data-content="030102"] .img_divi2{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 4rem;}
[data-content="030102"] .img_divi2.ty2{gap: 3rem;}
[data-content="030102"] .img_divi2 img{display: block; width: 100%; min-width: 0; border-radius: 0.4rem;}
[data-content="030102"] .img_divi2.ty2.f img:nth-child(1){flex: 2;}
[data-content="030102"] .img_divi2.ty2.f img:nth-child(2){flex: 1;}
[data-content="030102"] .box9{padding: 4rem 2rem; background-color: #F4F5F6;}
[data-content="030102"] .box9 ul{display: flex; flex-wrap: nowrap; justify-content: space-evenly; align-items: stretch; gap: 1rem; }
[data-content="030102"] .box9 ul li{display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; gap: 1rem;}
[data-content="030102"] .box9 ul li img{display: block; width: 12rem; height: 12rem; background-color: #fff; border-radius: 50%; border: 2px solid #B1B8BE;}
[data-content="030102"] .box9 ul li span{display: block; position: relative; width: 2rem; height: 2rem; text-indent: -9999px;}
[data-content="030102"] .box9 ul li span:before,
[data-content="030102"] .box9 ul li span:after{content: ""; display: block; position: absolute; top: 50%; left: 50%; width: 100%; height: 2px; background-color: #999; transform: translate(-50%,50%);}
[data-content="030102"] .box9 ul li span:after{left: -1px; top: 1px; transform: rotate(90deg) translate(50%,-50%);}
[data-content="030102"] .box9 ul li p{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 12rem; height: 12rem; padding: 0.5rem; text-align: center; font-weight: 500; letter-spacing: -0.034rem; border-radius: 50%; background-color: #E6E8EA; border: 2px solid #B1B8BE;}
[data-content="030102"] .box10{padding: 4rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="030102"] .box10 h4{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: baseline; gap: 0.4rem 1.2rem;}
[data-content="030102"] .box10 h4 span{font-size: 0.589em; font-family: 'Pretendard'; font-weight: 400;}
[data-content="030102"] .box10 ol{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 3.8rem;}
[data-content="030102"] .box10 ol >li{position: relative; width: 100%;}
[data-content="030102"] .box10 ol >li:not(:last-child):after{content: ""; display: block; position: absolute; top: 0; left: 100%; width: 3.8rem; height: 100%; background: url(../../../img/site/kor/content/030104_img19.svg) no-repeat right center / 100% auto;}
[data-content="030102"] .box10 ol >li >div{display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; justify-content: space-between; align-items: center; width: 100%; height: 100%; padding: 0 1.6rem 1.2rem; text-align: center; background-color: #fff; border: 1px solid #0043D4; border-radius: 0.4rem;}
[data-content="030102"] .box10 ol >li >div em{display: block; width: calc(100% + 3.2rem); padding: 0.625rem; color: #fff; font-weight: 500; background-color: #0043D4;}
[data-content="030102"] .box10 ol >li >div strong{display: block; width: 100%; margin-top: 0; margin-bottom: auto; padding: 1.2rem 0; color: #464C53; font-weight: 600; line-height: 1.3;}
[data-content="030102"] .box10 ol >li >div div{display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; gap: 0.2rem; width: 100%; padding-top: 1.2rem; border-top: 1px solid rgba(0, 0, 0, 0.25);}
[data-content="030102"] .box10 ol >li >div div p{display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; width: 100%; min-height: calc((1.5rem * 1.3) * 2); font-size: 1.5rem; font-weight: 400; line-height: 1.3;}
[data-content="030102"] .box10 ol >li >div div img{display: block; width: auto; height: 5.6rem;}
[data-content="030102"] .box11{padding: 3rem; border: 1px solid rgba(0,0,0,0.1); border-radius: 0.6rem;}

@media screen and (max-width:1400px) and (min-width:1201px){
    [data-content="030102"] .box1.ty2 .l .list1{flex-wrap: wrap;}
    [data-content="030102"] .box1.ty2 .l .list1 >li{width: calc((100% - 0.8rem) / 2);}
}
@media screen and (max-width:1640px){
    [data-content="030102"] .box1{gap: 6rem;}
    [data-content="030102"] .box1 >img,
    [data-content="030102"] .box1 >video{width: 42rem;}
    [data-content="030102"] .box1 >.imgs{width: 53rem;}
    [data-content="030102"] .box2 ul{gap: 5rem;}
    [data-content="030102"] .box3 .t{gap: 3rem;}
    [data-content="030102"] .box3 .b{gap: 3rem;}
    [data-content="030102"] .box5{padding: 3rem; gap: 3rem 2rem;}
    [data-content="030102"] .box6{padding: 3rem 2rem; gap: 3rem 2rem;}
    [data-content="030102"] .box8{gap: 2.5rem;}
    [data-content="030102"] .box8 >div >strong{margin-bottom: 1.8rem;}
    [data-content="030102"] .box8 >.l >div{gap: 2rem;}
    [data-content="030102"] .box8 >.l >div img{width: calc((100% - 2rem) / 2);}
    [data-content="030102"] .box8 >.r >p{margin-top: 1.2rem;}
    [data-content="030102"] .img_divi2{gap: 3rem;}
    [data-content="030102"] .img_divi2.ty2{gap: 2.5rem;}
    [data-content="030102"] .box9{padding: 3rem 2rem; text-align: center;}
    [data-content="030102"] .box9 ul{display: inline-flex; flex-wrap: wrap; max-width: 80rem; gap: 2rem; margin: 0 auto;}
    [data-content="030102"] .box10{padding: 3rem;}
    [data-content="030102"] .box10 ol{gap: 2rem 3rem;}
    [data-content="030102"] .box10 ol >li:not(:last-child):after{width: 3rem;}
}
@media screen and (max-width:1400px){
    [data-content="030102"] .box1{gap: 5rem;}
    [data-content="030102"] .box1 >img,
    [data-content="030102"] .box1 >video{width: 40rem;}
    [data-content="030102"] .box1.ty3 .l{padding: 3rem 0 3rem 3rem;}
    [data-content="030102"] .box1 >.imgs{width: 48rem;}
    [data-content="030102"] .box2 ul{gap: 4rem;}
    [data-content="030102"] .box3 .t .img{min-width: 36rem;}
    [data-content="030102"] .box4{padding: 3rem 3rem 5rem;}
    [data-content="030102"] .box7{flex-wrap: wrap; justify-content: flex-start; gap: 3rem 2rem; padding: 3rem 2rem;}
    [data-content="030102"] .box7 >li{width: calc((100% - 2rem - 2rem - 2rem) / 4); text-align: center;}
    [data-content="030102"] .box7 >li strong{margin-top: 1.2rem;}
    [data-content="030102"] .box7 >li ul{display: inline-block; width: auto; margin: 0.8rem auto 0; text-align: left;}
    [data-content="030102"] .box8{gap: 2rem;}
    [data-content="030102"] .box8 >div >strong{margin-bottom: 1.4rem;}
    [data-content="030102"] .box8 >.l >div{gap: 1.5rem;}
    [data-content="030102"] .box8 >.l >div img{width: calc((100% - 1.5rem) / 2);}
    [data-content="030102"] .box10 ol{flex-wrap: wrap;}
    [data-content="030102"] .box10 ol >li{width: calc((100% - 3rem - 3rem) / 3);}
    [data-content="030102"] .box10 ol >li:nth-child(3n):after{display: none;}
}
@media screen and (max-width:1200px){
    [data-content="030102"] .box1{gap: 4rem;}
    [data-content="030102"] .box1 >img,
    [data-content="030102"] .box1 >video{width: 36rem;}
    [data-content="030102"] .box1 >.imgs{width: 52rem;}
    [data-content="030102"] .box5{gap: 1.5rem; padding: 2.5rem;}
    [data-content="030102"] .box5 strong{order: 1;}
    [data-content="030102"] .box5 p{order: 3; position: relative; top: auto; right: auto; width: 100%; text-align: right;}
    [data-content="030102"] .box5 div{order: 2; margin-top: 1rem;}
    [data-content="030102"] .box6{gap: 1.5rem; padding: 2.5rem 2rem;}
    [data-content="030102"] .box6 div{margin-top: 1rem;}
    [data-content="030102"] .img_divi2,
    [data-content="030102"] .img_divi2.ty2{gap: 2rem;}
    [data-content="030102"] .box9{padding: 2.5rem 2rem;}
    [data-content="030102"] .box9 ul li img,
    [data-content="030102"] .box9 ul li p{width: 12rem; height: 12rem;}
    [data-content="030102"] .box9 ul li p{font-size: 1.5rem;}
    [data-content="030102"] .box10{padding: 2.5rem;}
    [data-content="030102"] .box11{padding: 2.5rem;}
}
@media screen and (max-width:1024px){
    [data-content="030102"] .box1{flex-wrap: wrap; gap: 2rem;}
    [data-content="030102"] .box1.ty3{background-color: transparent;}
    [data-content="030102"] .box1.right{flex-direction: row;}
    [data-content="030102"] .box1 >img,
    [data-content="030102"] .box1 >video{order: 2; width: 40rem; max-width: 100%;}
    [data-content="030102"] .box1 .l{order: 2;}
    [data-content="030102"] .box1.ty3 .l{padding: 0;}
    [data-content="030102"] .box1.ty3 >img{border-radius: 0.4rem;}
    [data-content="030102"] .box1 >.imgs{gap: 1.5rem;}
    [data-content="030102"] .box2 ul{gap: 3rem;}
    [data-content="030102"] .box3{padding: 2.5rem;}
    [data-content="030102"] .box3 .t{gap: 2rem;}
    [data-content="030102"] .box3 .t table{font-size: 1.45rem;}
    [data-content="030102"] .box3 .t table thead tr th,
    [data-content="030102"] .box3 .t table tbody tr th,
    [data-content="030102"] .box3 .t table tbody tr td{height: 4.5rem;}
    [data-content="030102"] .box3 .t .img{min-width: 32rem;}
    [data-content="030102"] .box3 .b{gap: 2rem;}
    [data-content="030102"] .box4{padding: 2rem 2rem 3rem;}
    [data-content="030102"] .box5{gap: 1.5rem; padding: 2rem;}
    [data-content="030102"] .box5 strong{font-size: 2.2rem;}
    [data-content="030102"] .box5 div{margin-top: 0;}
    [data-content="030102"] .box5 div img{max-width: 80%;}
    [data-content="030102"] .box6{gap: 1.5rem; padding: 2rem;}
    [data-content="030102"] .box6 strong{font-size: 2.2rem;}
    [data-content="030102"] .box6 div ul li{font-size: 1.5rem;}
    [data-content="030102"] .box6 div img{width: 100%; height: auto; object-fit: cover; object-position: top left}
    [data-content="030102"] .box7 >li img{width: 11rem; height: 11rem;}
    [data-content="030102"] .box8{flex-direction: column; gap: 2rem;}
    [data-content="030102"] .box8 >.l{width: 100%;}
    [data-content="030102"] .box8 >.l >div{gap: 2rem;}
    [data-content="030102"] .box8 >.l >div img{width: calc((100% - 2rem) / 2);}
    [data-content="030102"] .box8 >div >strong{margin-bottom: 1rem; font-size: 2.2rem;}
    [data-content="030102"] .box8 >.r ul li *{min-height: 4.5rem;}
}
@media screen and (max-width:840px){
    [data-content="030102"] .box4 div{overflow-x: auto;}
    [data-content="030102"] .box4 img{min-width: 750px}
    [data-content="030102"] .box3 .t{flex-direction: column;}
    [data-content="030102"] .box3 .t .img{min-width: 100%;}
    [data-content="030102"] .box3 .t .img img{max-width: 35rem;}
    [data-content="030102"] .box2 ul{flex-direction: column; gap: 2.5rem;}
    [data-content="030102"] .img_divi2,
    [data-content="030102"] .img_divi2.ty2{gap: 1.5rem;}
}
@media screen and (max-width:640px){
    [data-content="030102"] .box1 >img,
    [data-content="030102"] .box1 >video{width: 36rem;}
    [data-content="030102"] .box1 >.imgs{width: 100%;}
    [data-content="030102"] .box1 >.imgs >div >strong{font-size: 1.6rem;}
    [data-content="030102"] .box1.ty2 .l{gap: 2rem;}
    [data-content="030102"] .box1.ty2 .l .list1{flex-wrap: wrap; gap: 1.25rem;}
    [data-content="030102"] .box1.ty2 .l .list1 >li{display: block; width: calc((100% - 1.25rem) / 2); padding: 2rem 1.5rem 2rem;}
    [data-content="030102"] .box1.ty2 .l .list1 >li >img{width: 4rem;}
    [data-content="030102"] .box1.ty2 .l .list1 >li >strong{margin-top: 1.6rem; font-size: 1.8rem; font-weight: 500; line-height: 1.3; font-family: 'Poppins';}
    [data-content="030102"] .box2 .imgs{flex-direction: column; justify-content: center; gap: 1.5rem;}
    [data-content="030102"] .box2 .imgs img{display: block; width: 100%; max-width: 52rem;}
    [data-content="030102"] .box2 .imgs img:nth-child(2){max-width: 20rem;}
    [data-content="030102"] .box2 ul >li >p{font-size: 1.9rem;}
    [data-content="030102"] .box3 .b{flex-direction: column; gap: 3rem;}
    [data-content="030102"] .box3 .b div{gap: 1.2rem;}
    [data-content="030102"] .box3 .b div strong{font-size: 2rem;}
    [data-content="030102"] .box4{padding: 2rem;}
    [data-content="030102"] .box5 strong{font-size: 2rem;}
    [data-content="030102"] .box6 strong{font-size: 2rem;}
    [data-content="030102"] .box7{gap: 2rem; padding: 2rem;}
    [data-content="030102"] .box7 >li img{width: 10rem; height: 10rem;}
    [data-content="030102"] .box7 >li strong{margin-top: 1rem; font-size: 1.9rem;}
    [data-content="030102"] .box7 >li ul{margin: 0.4rem 0 0;}
    [data-content="030102"] .box7 >li ul{width: 100%;}
    [data-content="030102"] .box7 >li ul >li{font-size: 1.7rem;}
    [data-content="030102"] .box8 >div >strong{margin-bottom: 0.8rem;}
    [data-content="030102"] .box8 >.r ul li b,
    [data-content="030102"] .box8 >.r ul li p,
    [data-content="030102"] .box3 .t table thead tr th, 
    [data-content="030102"] .box3 .t table tbody tr th, 
    [data-content="030102"] .box3 .t table tbody tr td{font-size: 1.8rem;}
    [data-content="030102"] .box9{padding: 2rem;}
    [data-content="030102"] .box9 ul{gap: 1rem 1.5rem;}
    [data-content="030102"] .box9 ul li{gap: 0.8rem;}
    [data-content="030102"] .box9 ul li img,
    [data-content="030102"] .box9 ul li p{width: 11rem; height: 11rem;}
    [data-content="030102"] .box9 ul li p{font-size: 1.6rem;}
    [data-content="030102"] .box9 ul li span{width: 1.8rem; height: 1.8rem;}
    [data-content="030102"] .box8 >.r >p{font-size: 1.7rem;}
    [data-content="030102"] .box10{padding: 2rem;}
    [data-content="030102"] .box10 ol{gap: 2rem 2.5rem;}
    [data-content="030102"] .box10 ol >li{width: calc((100% - 2.5rem ) / 2);}
    [data-content="030102"] .box10 ol >li:not(:last-child):after{width: 2.5rem;}
    [data-content="030102"] .box10 ol >li:nth-child(3n):after{display: block;}
    [data-content="030102"] .box10 ol >li:nth-child(2n):after{display: none;}
    [data-content="030102"] .box10 ol >li >div em{font-size: 1.9rem;}
    [data-content="030102"] .box10 ol >li >div strong{font-size: 1.9rem;}
    [data-content="030102"] .box10 ol >li >div div p{font-size: 1.7rem;}
    [data-content="030102"] .box11{padding: 2rem;}
}
@media screen and (max-width:480px){
    [data-content="030102"] .box1 >img,
    [data-content="030102"] .box1 >video{width: 100%;}
    [data-content="030102"] .box1 >img.w_img{width: 100%; max-width: 32rem;}
    [data-content="030102"] .box2 .imgs{ gap: 1rem;}
    [data-content="030102"] .box2 .imgs img:nth-child(2){max-width: 18rem;}
    [data-content="030102"] .box3 .t table{display: none;}
    [data-content="030102"] .box3 .t .mo{display: flex; flex-wrap: wrap; flex-direction: column; gap: 2rem; justify-content: flex-start; align-content: flex-start; align-items: flex-start; font-family: 'Pretendard'; font-size: 1.6rem;}
    [data-content="030102"] .box3 .t .mo >div{width: 100%;}
    [data-content="030102"] .box3 .t .mo >div strong{display: block; color: #131416; font-size: 1.7rem; font-weight: 500;}
    [data-content="030102"] .box3 .t .mo >div ul{display: block; margin-top: 1.2rem; border-top: 1px solid #D4000F; background-color: #fff;}
    [data-content="030102"] .box3 .t .mo >div ul >li{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; align-content: stretch; }
    [data-content="030102"] .box3 .t .mo >div ul >li *{width: 100%; min-width: 0; padding: 1rem; border-bottom: 1px solid rgba(0, 0, 0, 0.10);}
    [data-content="030102"] .box3 .t .mo >div ul >li b{color: #1E2124; font-weight: 500; background-color: rgba(212, 0, 15, 0.10); border-right: 1px solid rgba(0, 0, 0, 0.10);}
    [data-content="030102"] .box3 .t .mo >div ul >li p{text-align: center;}
    [data-content="030102"] .box4 div{width: 100%;}
    [data-content="030102"] .box4 img{display: none;}
    [data-content="030102"] .box4 img.mo{display: block; width: 280px; max-width: 100%; min-width: 0; margin: 0 auto;}
    [data-content="030102"] .box7{gap: 2rem 1.5rem;}
    [data-content="030102"] .box7 >li{width: calc((100% - 1.5rem - 1.5rem) / 3);}
    [data-content="030102"] .box7 >li img{width: 9rem; height: 9rem;}
    [data-content="030102"] .img_divi2,
    [data-content="030102"] .img_divi2.ty2{flex-wrap: wrap; gap: 1rem;}
    [data-content="030102"] .img_divi2.ty2.f img:nth-child(1),
    [data-content="030102"] .img_divi2.ty2.f img:nth-child(2){flex: auto;}
    [data-content="030102"] .box9 ul{gap: 0.75rem 1rem;}
    [data-content="030102"] .box10 ol{gap: 1.5rem 2.5rem;}
}
@media screen and (max-width:360px){
    [data-content="030102"] .box7 >li{width: calc((100% - 1.5rem) / 2);}
    [data-content="030102"] .box10 ol >li{width: 100%;}
    [data-content="030102"] .box10 ol >li:not(:last-child):after{display: none;}
}

/*-------------------------------------------------------------------
    technology > 소재기술
-------------------------------------------------------------------*/
[data-content="0302"]{}
[data-content="0302"] .box1{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 10rem; }
[data-content="0302"] .box1.ty2{align-items: stretch;}
[data-content="0302"] .box1.right{flex-direction: row-reverse;}
[data-content="0302"] .box1 .l{width: 100%; min-width: 0;}
[data-content="0302"] .box1.ty2 .l{display: flex; flex-wrap: wrap; flex-direction: column; align-content: flex-start; justify-content: space-between; align-items: flex-start; gap: 4rem;}
[data-content="0302"] .box1.ty2 .l .list1{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 0.8rem; width: 100%; }
[data-content="0302"] .box1.ty2 .l .list1 >li{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: flex-start; gap: 0.8rem; width: 100%; padding: 1.6rem 2rem; background-color: #292728; border-radius: 0.4rem;}
[data-content="0302"] .box1.ty2 .l .list1 >li >img{display: block; width: 4.8rem;}
[data-content="0302"] .box1.ty2 .l .list1 >li >strong{display: block; width: 100%; margin-top: auto; margin-bottom: auto; font-size: 1.5rem; font-weight: 300; line-height: 1.3; font-family: 'Pretendard';}
[data-content="0302"] .box1.ty3{overflow: hidden; align-items: stretch; background-color: #F4F5F6; border-radius: 0.4rem;}
[data-content="0302"] .box1.ty3 .l{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: flex-start; padding: 3rem 4.8rem; padding-right: 0;}
[data-content="0302"] .box1.ty3 >img{height: auto; object-fit: cover; border-radius: 0 0.4rem 0.4rem 0;}
[data-content="0302"] .box1 >.imgs{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2rem; flex-shrink: 0; width: 60.8rem;}
[data-content="0302"] .box1 >.imgs div{width: 100%;}
[data-content="0302"] .box1 >.imgs:not([style="width: 66rem;"]) div:nth-child(1){flex: 1.18;}
[data-content="0302"] .box1 >.imgs:not([style="width: 66rem;"]) div:nth-child(2){flex: 1;}
[data-content="0302"] .box1 >.imgs div img{display: block; width: 100%; border-radius: 0.4rem;}
[data-content="0302"] .box1 >.imgs div strong{display: block; margin-top: 1.2rem; text-align: center; color: #6D7882; font-weight: 600; line-height: 1.3; font-family: 'Pretendard'; letter-spacing: -0.03rem;}
[data-content="0302"] .box1 .l .box1_list{}
[data-content="0302"] .box1 .l .box1_list >li{margin-top: 1.2rem; color: #CDD1D5; font-size: 1.5rem; font-weight: 300;}
[data-content="0302"] .box1 .l .box1_list >li:first-child{margin-top: 0;}
[data-content="0302"] .box1 .l .box1_list >li >strong{margin-bottom: 0.6rem; font-size: 1.7rem; font-weight: 600;}
[data-content="0302"] .box1 >img,
[data-content="0302"] .box1 >video{display: block; width: 46.8rem; border-radius: 0.4rem; border: 1px solid #E6E8EA;}
[data-content="0302"] .box1.ty4 >img{width: 60.8rem; border-radius: 0; border: 0;}
[data-content="0302"] .box1 .l .box1_list >li >ul{}
[data-content="0302"] .box1 .l .box1_list >li >ul >li{margin-top: 0.6rem;}
[data-content="0302"] .box1 .l .box1_list >li >ul >li:first-child{margin-top: 0;}
[data-content="0302"] .box1 .l .box1_list >li >ul >li strong{font-weight: 500;}
[data-content="0302"] .box2{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 3.2rem;}
[data-content="0302"] .box2 >li{width: 100%; text-align: center;}
[data-content="0302"] .box2 >li div{overflow: hidden; border-radius: 0.6rem;}
[data-content="0302"] .box2 >li div strong{display: block; padding: 1.2rem 2rem; color: #fff; font-size: 1.8rem; font-weight: 500; line-height: 1.2; font-family: 'Pretendard'; background-color: #D4000F; }
[data-content="0302"] .box2 >li div img{display: block; width: 100%;}
[data-content="0302"] .box2 >li ul{display: inline-block; text-align: left;}
[data-content="0302"] .box3{display: flex; flex-wrap: nowrap; align-content: center; justify-content: space-evenly; align-items: stretch; gap: 3rem; padding: 3.2rem 3rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="0302"] .box3 >div{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: flex-start; gap: 1.4rem; width: auto; min-width: 0;}
[data-content="0302"] .box3 >div strong{display: block; width: 100%; color: #131416; font-size: 2.4rem; font-weight: 600; line-height: 1.2;}
[data-content="0302"] .box3 >div img{display: block; width: auto; max-width: 100%;}
[data-content="0302"] .box4{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 3.2rem;}
[data-content="0302"] .box4 >li{width: 100%;}
[data-content="0302"] .box4 >li .imgs{overflow: hidden; display: block; position: relative; width: 100%; border-radius: 0.4rem;}
[data-content="0302"] .box4 >li .imgs img{display: block; width: 100%;}
[data-content="0302"] .box4 >li .imgs i{display: inline-block; position: absolute; top: 0; left: 0; width: auto; padding: 0.6rem 1.6rem; color: #fff; font-weight: 500; font-family: 'Pretendard'; background-color: #D4000F; border-bottom-right-radius: 0.4rem;}
[data-content="0302"] .box4 >li p{display: block; margin-top: 2rem; text-align: center;}
[data-content="0302"] .box5{display: flex; flex-wrap: nowrap; justify-content: space-evenly; align-items: stretch; gap: 3.2rem;}
[data-content="0302"] .box5 >li{width: 100%; max-width: 26rem;}
[data-content="0302"] .box5 >li div{display: block; position: relative; width: 100%; height: auto; }
[data-content="0302"] .box5 >li div:before{content: ""; display: block; width: 100%; height: 0; padding-top: 100%; background-color: rgba(212, 0, 15, 0.75); border-radius: 50%;}
[data-content="0302"] .box5 >li div span{display: flex; justify-content: center; align-content: center; align-items: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 2rem; text-align: center; font-size: 2.2rem; font-weight: 300; color: #fff; line-height: 1.2; border-radius: 50%;}
[data-content="0302"] .box5 >li p{display: block; color: #33363D; font-size: 1.8rem; font-weight: 500; line-height: 1.2; text-align: center;}
[data-content="0302"] .box6{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 10rem; padding: 2rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="0302"] .box6 .box6_in{display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: flex-start; align-items: flex-start; gap: 0.8rem; position: absolute; bottom: 0; left: 0; width: 100%; padding: 1.2rem 1.6rem; background-color: rgba(0, 0, 0, 0.50); backdrop-filter: blur(4px);}
[data-content="0302"] .box6 .box6_in i{display: inline-block; padding: 0.3rem 0.6rem; font-family: 'Pretendard'; font-size: 1.6rem; font-weight: 500; color: #fff; background-color: #D4000F; border-radius: 0.2rem;}
[data-content="0302"] .box6 .box6_in ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 0.8rem 1.2rem; font-family: 'Pretendard'; color: #fff; font-weight: 300; font-size: 1.6rem;}
[data-content="0302"] .box6 .box6_in ul li{position: relative; position: relative; padding-left: 0.8rem;}
[data-content="0302"] .box6 .box6_in ul li:before{content: "·"; display: block; position: absolute; top: 0; left: 0;}
[data-content="0302"] .box6 .l{flex: 1.75; display: flex; flex-direction: column; justify-content: flex-end; position: relative; width: 100%; min-width: 0;}
[data-content="0302"] .box6 img{display: block; width: auto; max-width: 100%;}
[data-content="0302"] .box6 .l .t{display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center; gap: 0.9rem;}
[data-content="0302"] .box6 .l .t span{display: block; position: relative; text-align: center;}
[data-content="0302"] .box6 .l .t span img{display: block; width: auto; max-width: 100%;}
[data-content="0302"] .box6 .l .t span em{display: block; margin-top: -1.8rem;}
[data-content="0302"] .box6 .l .t span em i{display: inline-block; padding: 0.3rem 0.6rem; font-size: 1.6rem; font-weight: 500; color: #fff; background-color: #D4000F; border-radius: 0.2rem;}
[data-content="0302"] .box6 .l .t b{display: block; position: relative; width: 4.2rem; height: 4.2rem; text-indent: -9999px;}
[data-content="0302"] .box6 .l .t b:before,
[data-content="0302"] .box6 .l .t b:after{content: ""; display: block; position: absolute; top: 50%; left: 0; width: 100%; height: 0.4rem; background-color: #D4000F;}
[data-content="0302"] .box6 .l .t b:after{transform: rotate(90deg);}
[data-content="0302"] .box6 .l .line{display: flex; flex-wrap: nowrap; justify-content: center; align-items: stretch; gap: 0; margin-top: -0.6rem;}
[data-content="0302"] .box6 .l .line div{display: block; position: relative; width: 28.573%;}
[data-content="0302"] .box6 .l .line div:before{content: ""; display: block; width: 100%; height: auto; padding-top: 43.878%;}
[data-content="0302"] .box6 .l .line div svg{display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
[data-content="0302"] .box6 .l .b{position: relative; border-radius: 0.6rem; border: 1px solid #CDD1D5;}
[data-content="0302"] .box6 .l .b:before{content: ""; display: block; position: absolute; top: 50%; left: calc(100% + 3.5rem); width: 0; height: 0; border-style: solid; border-width: 1.9rem 0 1.9rem 3.4rem; border-color: transparent transparent transparent #d4000f; transform: translateY(-50%);}
[data-content="0302"] .box6 .l .b img{display: block; position: relative; width: 100%; border-radius: 0.6rem;}
[data-content="0302"] .box6 .l .b .box6_in{width: auto; border-radius: 0 0.6rem 0 0.6rem;}
[data-content="0302"] .box6 .r{overflow: hidden; flex: 1.25; display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; justify-content: space-between; align-items: center; position: relative; width: 100%; min-width: 0; background-color: #fff; border: 1px solid #CDD1D5; border-radius: 0.6rem;}
[data-content="0302"] .box6 .r img{display: block; width: 100%; margin: auto;}
[data-content="0302"] .box7{display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; gap: 10rem; padding: 2rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="0302"] .box7 .l{flex: 1.8; display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; gap: 0.5rem;}
[data-content="0302"] .box7 .l >div{flex: 1; text-align: center; }
[data-content="0302"] .box7 .l >div >b{display: inline-block;padding: 0.3rem 0.6rem; font-family: 'Pretendard'; font-size: 1.6rem; font-weight: 500; color: #fff; background-color: #D4000F; border-radius: 0.2rem;}
[data-content="0302"] .box7 .l >div.ll >b{color: #33363D; background-color: #fff; font-weight: 600;}
[data-content="0302"] .box7 .l >div >img{display: block; width: auto; max-width: 100%; margin: 2.4rem auto 0;}
[data-content="0302"] .box7 .l >div >ul{display: flex; flex-direction: column; justify-content: flex-start; align-content: flex-start; align-items: flex-start; gap: 0.4rem; text-align: left; color: rgba(0, 0, 0, 0.75); font-family: 'Pretendard'; letter-spacing: -0.04rem;}
[data-content="0302"] .box7 .l >div.lr >ul{color: #131416;}
[data-content="0302"] .box7 .l >div >ul >li{position: relative; padding-left: 3.2rem;}
[data-content="0302"] .box7 .l >div >ul >li:before{content: ""; display: block; position: absolute; top: 0.1rem; left: 0; width: 2.4rem; height: 2.4rem; background: url(../../../img/site/kor/content/030202_img08.svg) no-repeat center center / 100% auto;}
[data-content="0302"] .box7 .l >div.lr >ul >li:before{background-image: url(../../../img/site/kor/content/030202_img09.svg);}
[data-content="0302"] .box7 .l >span{flex: 0.345;display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
[data-content="0302"] .box7 .l >span span{display: block; position: relative; width: 100%; height: auto; }
[data-content="0302"] .box7 .l >span span:before{content: ""; display: block; width: 100%; height: auto; padding-top: 97%; background: url(../../../img/site/kor/content/030202_img07.svg) no-repeat center center / 100% auto;}
[data-content="0302"] .box7 .l >span span i{display: flex; flex-wrap: wrap; justify-content: center; align-content: center; align-items: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; color: #D4000F; font-size: 2.2rem; font-weight: 600; text-align: center;}
[data-content="0302"] .box7 .r{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-end; flex: 1;}
[data-content="0302"] .box7 .r ul{display: flex; flex-direction: column; justify-content: flex-start; align-content: flex-start; align-items: flex-start; gap: 1.6rem;}
[data-content="0302"] .box7 .r ul li{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 2.4rem; position: relative; }
[data-content="0302"] .box7 .r ul li.ty2{padding-top: 4.8rem;}
[data-content="0302"] .box7 .r ul li.ty2:before{content: "="; display: block; position: absolute; top: -0.4rem; left: 50%; color: #D4000F; font-size: 4rem; line-height: 1; transform: translateX(-50%);}
[data-content="0302"] .box7 .r ul li img{display: block; width: 7.2rem; height: 7.2rem; background-color: #fff; border-radius: 50%;}
[data-content="0302"] .box7 .r ul li.ty2 img{background-color: #D4000F;}
[data-content="0302"] .box7 .r ul li div{width: 100%; min-width: 0;}
[data-content="0302"] .box7 .r ul li div strong{display: block; color: #131416; font-size: 1.8rem; font-weight: 500;}
[data-content="0302"] .box7 .r ul li div p{display: block; margin-top: 1.2rem; font-family: 'Pretendard'; font-size: 1.6rem; font-weight: 400;}
[data-content="0302"] .box7.ty2{display: block; padding: 4.3rem 4.8rem 0;}
[data-content="0302"] .box7.ty2 .l{display: inline-flex; gap: 4rem; width: auto;}
[data-content="0302"] .box7.ty2 .l >div{text-align: left;}
[data-content="0302"] .box7.ty2 .l >span{width: auto;}
[data-content="0302"] .box7.ty2 .l >span span:before{position: absolute; top: 50%; left: 0; background-image: url(../../../img/site/kor/content/030204_img10.svg); transform: translateY(-50%);}
[data-content="0302"] .box7.ty2 .l >span span i{position: relative; top: auto; left: auto; white-space: nowrap; padding: 2rem 2.6rem;}
[data-content="0302"] .box7.ty2 .l >div >ul >li{white-space: nowrap;}
[data-content="0302"] .box7.ty2 .b img{display: block; width: auto; max-width: 100%; margin-left: auto;}
[data-content="0302"] .box8{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2rem; padding: 2rem; background-color: rgba(244, 245, 246, 0.5); border-radius: 0.6rem;}
[data-content="0302"] .box8 >div{width: 100%;}
[data-content="0302"] .box8 >.l{flex: 1;}
[data-content="0302"] .box8 >.l ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 1.6rem; width: 100%; height: 100%;}
[data-content="0302"] .box8 >.l ul li{overflow: hidden; display: flex; position: relative; width: calc((100% - 1.6rem) / 2); padding-top: 4rem; border: 1px solid #E6E8EA; border-radius: 0.4rem; background-color: #fff;}
[data-content="0302"] .box8 >.l ul li img{display: block; width: 100%; height: auto; object-fit: contain;}
[data-content="0302"] .box8 >.l ul li i{position: absolute; top: 0; left: 0; width: auto; padding: 0.4rem 0.8rem; color: #fff; font-size: 1.5rem; font-weight: 500; background-color: #D4000F; border-radius: 0 0 0.4rem 0;}
[data-content="0302"] .box8 >.m{flex: 2; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; border: 1px solid #E6E8EA; border-radius: 0.4rem; background-color: #fff;}
[data-content="0302"] .box8 >.m img{display: block; width: 100%;}
[data-content="0302"] .box8 >.r{flex: 0.85; overflow: hidden; display: flex; flex-wrap: wrap; flex-direction: column; align-content: flex-start; justify-content: flex-start; align-items: flex-start; gap: 0.3rem; border: 1px solid #E6E8EA; border-radius: 0.4rem; background-color: #fff; }
[data-content="0302"] .box8 >.r i{width: auto; padding: 0.4rem 0.8rem; color: #fff; font-size: 1.5rem; font-weight: 500; background-color: #D4000F; border-radius: 0 0 0.4rem 0;}
[data-content="0302"] .box8 >.r div{width: 100%;}
[data-content="0302"] .box8 >.r div img{display: block; width: 100%;}
[data-content="0302"] .box8 >.r table{margin-top: auto;}
[data-content="0302"] .box8 >.r table tbody tr:last-child{border-bottom: 0;}
[data-content="0302"] .box8 >.r table tr th,
[data-content="0302"] .box8 >.r table tr td{height: 3.7rem; padding: 5px; font-size: 12px;}
[data-content="0302"] .box9{padding: 2rem; background-color: #F4F5F6; border-radius: 0.6rem;}
[data-content="0302"] .box9 .ins{display: block; width: 100%; max-width: 980px; margin: 0 auto;}
[data-content="0302"] .box9 .ins >strong{display: block; color: #131416; font-size: 2rem; font-weight: 600;}
[data-content="0302"] .box9 .ins >ul{display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; gap: 2rem; width: 100%; margin-top: 0.8rem; padding: 2rem; background-color: #fff; border: 1px solid #CDD1D5; border-radius: 0.6rem;}
[data-content="0302"] .box9 .ins >ul li{text-align: center; color: #1E2124; font-size: 1.6rem; font-family: 'Pretendard'; font-weight: 400;}
[data-content="0302"] .box9 .ins >ul li span{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 6rem; height: 6rem; margin-left: auto;  margin-right: auto; margin-bottom: 0.8rem; text-align: center; font-size: 2.4rem; font-weight: 800; color: #fff; font-family: 'Pretendard'; background: radial-gradient(63.51% 63.51% at 36.7% 30.03%, #ABB7C4 0%, #3A4755 100%); border-radius: 50%;}
[data-content="0302"] .box9 .ins >ul li[data-color="2"] span{background: radial-gradient(63.51% 63.51% at 36.7% 30.03%, #ABC4AE 0%, #14481A 100%);}
[data-content="0302"] .box9 .ins >ul li[data-color="3"] span{background: radial-gradient(63.51% 63.51% at 36.7% 30.03%, #C4ABC4 0%, #4D1B4C 100%);}
[data-content="0302"] .box9 .ins >ul li[data-color="4"] span{background: radial-gradient(63.51% 63.51% at 36.7% 30.03%, #769DF0 0%, #11295D 100%);}
[data-content="0302"] .box9 .ins >ul li[data-color="5"] span{background: radial-gradient(63.51% 63.51% at 36.7% 30.03%, #F0D076 0%, #806211 100%);}
[data-content="0302"] .box9 .ins >ul li[data-color="6"] span{background: radial-gradient(63.51% 63.51% at 36.7% 30.03%, #F09276 0%, #802A11 100%);}
[data-content="0302"] .box9 .ins >ul li[data-color="7"] span{background: radial-gradient(63.51% 63.51% at 36.7% 30.03%, #76D6F0 0%, #116780 100%);}
[data-content="0302"] .box9 .ins >ul li[data-color="8"] span{background: radial-gradient(63.51% 63.51% at 36.7% 30.03%, #F4C1AB 0%, #724F41 100%);}
[data-content="0302"] .box9 .ins .t{margin-top: 2rem;}
[data-content="0302"] .box9 .ins .t:after{content: ""; display: block; width: 0; height: 0; margin: 2rem auto; border-style: solid; border-width: 3.8rem 2rem 0 2rem; border-color: #d4000f transparent transparent transparent;}
[data-content="0302"] .box9 .ins .t_in{overflow: hidden; position: relative; width: 100%; border: 1px solid #CDD1D5; border-radius: 0.6rem;}
[data-content="0302"] .box9 .ins .t_in img{display: block; width: auto; max-width: 100%;}
[data-content="0302"] .box9 .ins .t_in div{display: inline-flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; justify-content: flex-start; align-items: flex-start; gap: 0.8rem; position: absolute; bottom: 0; left: 0; width: auto; padding: 1.2rem 1.6rem; background-color: rgba(0, 0, 0, 0.50); backdrop-filter: blur(4px); border-top-right-radius: 0.6rem;}
[data-content="0302"] .box9 .ins .t_in div i{display: inline-block; padding: 0.3rem 0.6rem; font-family: 'Pretendard'; font-size: 1.6rem; font-weight: 500; color: #fff; background-color: #D4000F; border-radius: 0.2rem;}
[data-content="0302"] .box9 .ins .t_in div ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 0.8rem 1.2rem; font-family: 'Pretendard'; color: #fff; font-weight: 300; font-size: 1.6rem;}
[data-content="0302"] .box9 .ins .t_in div ul li{position: relative; position: relative; padding-left: 0.8rem;}
[data-content="0302"] .box9 .ins .t_in div ul li:before{content: "·"; display: block; position: absolute; top: 0; left: 0;}
[data-content="0302"] .box9 .ins .b{display: flex; flex-wrap: nowrap; justify-content: space-around; align-items: center; gap: 3rem; width: 100%; padding: 2rem 2rem; background-color: #fff; border: 1px solid #CDD1D5; border-radius: 0.6rem;}
[data-content="0302"] .box9 .ins .b img{display: block; width: auto; max-width: 100%; min-width: 0; margin:  0 auto;}
[data-content="0302"] .box9 .ins .b div{margin-top: auto;margin-bottom: -0.8rem;}
[data-content="0302"] .box9 .ins .b div i{display: inline-block; padding: 0.3rem 0.6rem; font-family: 'Pretendard'; font-size: 1.6rem; font-weight: 500; color: #fff; background-color: #D4000F; border-radius: 0.2rem;}
[data-content="0302"] .box9 .ins .b div ul{display: flex; flex-direction: column; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 0.8rem; margin-top: 0.8rem; font-family: 'Pretendard'; font-size: 1.6rem;}
[data-content="0302"] .box9 .ins .b div ul li{position: relative; position: relative; padding-left: 0.8rem;}
[data-content="0302"] .box9 .ins .b div ul li:before{content: "·"; display: block; position: absolute; top: 0; left: 0;}
[data-content="0302"] .box10{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 6rem; padding: 2.5rem 3rem; font-family: 'Pretendard'; background-color: rgba(244, 245, 246, 0.5); border-radius: 0.6rem;}
[data-content="0302"] .box10 >div{flex: 1; width: 100%;}
[data-content="0302"] .box10 >div.l{flex: 1.194;}
[data-content="0302"] .box10 >div >strong{display: block; color: #1E2124; font-size: 1.8rem; font-weight: 500; letter-spacing: -0.036rem;}
[data-content="0302"] .box10 >div >p{margin-top: 0.8rem; font-size: 1.6rem; letter-spacing: -0.032rem;}
[data-content="0302"] .box10 >div ul{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 2rem;}
[data-content="0302"] .box10 >div >ul{margin-top: 0.8rem;}
[data-content="0302"] .box10 >div >ul li{display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; gap: 0.8rem; width: 100%;}
[data-content="0302"] .box10 >div >ul >li{flex: 1;}
[data-content="0302"] .box10 >div >ul >li:nth-child(2){flex: 1.5;}
[data-content="0302"] .box10 >div >ul li img{display: block; width: auto; max-width: 100%; min-width: 0; border: 1px solid #E6E8EA; border-radius: 0.6rem;}
[data-content="0302"] .box10 >div ul li span{display: block; width: 100%; font-size: 1.6rem; letter-spacing: -0.032rem;}
[data-content="0302"] .box10 >div ul li ul{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 1rem;}

@media screen and (max-width:1400px) and (min-width:1201px){
    [data-content="0302"] .box1.ty2 .l .list1{flex-wrap: wrap;}
    [data-content="0302"] .box1.ty2 .l .list1 >li{width: calc((100% - 0.8rem) / 2);}
}
@media screen and (max-width:1640px){
    [data-content="0302"] .box1{gap: 6rem;}
    [data-content="0302"] .box1 >img,
    [data-content="0302"] .box1 >video{width: 42rem;}
    [data-content="0302"] .box1 >.imgs,
    [data-content="0302"] .box1.ty4 >img{width: 53rem;}
    [data-content="0302"] .box2{gap: 3rem;}
    [data-content="0302"] .box3{padding: 3rem;}
    [data-content="0302"] .box4{gap: 3rem;}
    [data-content="0302"] .box5{gap: 3rem;}
    [data-content="0302"] .box6{gap: 6rem;}
    [data-content="0302"] .box6 .l .b:before{left: calc(100% + 2rem); border-width: 1.4rem 0 1.4rem 2.4rem;}
    [data-content="0302"] .box7{gap: 6rem;}
    [data-content="0302"] .box7 .l >span{flex: 0.3;}
    [data-content="0302"] .box7 .r{align-items: center;}
    [data-content="0302"] .box7.ty2{padding: 3rem 3rem 0;}
    [data-content="0302"] .box7.ty2 .l{gap: 3rem;}
    [data-content="0302"] .box8{gap: 1.5rem;}
    [data-content="0302"] .box8 >.l ul{gap: 1.2rem;}
    [data-content="0302"] .box8 >.l ul li{width: calc((100% - 1.2rem) / 2);}
    [data-content="0302"] .box9 .ins .t:after{margin: 1.8rem auto; border-width: 2.6rem 1.6rem 0 1.6rem;}
    [data-content="0302"] .box10{gap: 3rem;}
}
@media screen and (max-width:1400px){
    [data-content="0302"] .box1{gap: 5rem;}
    [data-content="0302"] .box1 >img,
    [data-content="0302"] .box1 >video{width: 40rem;}
    [data-content="0302"] .box1 >.imgs,
    [data-content="0302"] .box1.ty4 >img{width: 48rem;}
    [data-content="0302"] .box1.ty3 .l{padding: 3rem 0 3rem 3rem;}
    [data-content="0302"] .box3 >div{gap: 1rem;}
    [data-content="0302"] .box7{flex-direction: column; gap: 3rem; padding: 3rem 2rem;}
    [data-content="0302"] .box7 .l >div >img{max-width: 80%;}
    [data-content="0302"] .box7 .l >span{flex: 0.25;}
    [data-content="0302"] .box7 .r{width: 100%;}
    [data-content="0302"] .box7 .r ul{flex-wrap: wrap; flex-direction: row; width: 100%; gap: 2rem;}
    [data-content="0302"] .box7 .r ul >li{width: calc((100% - 2rem) / 2);}
    [data-content="0302"] .box7 .r ul li.ty2{width: 100%; padding-top: 4.2rem;}
    [data-content="0302"] .box7 .r ul li.ty2:before{font-size: 3.5rem;}
    [data-content="0302"] .box7 .r ul li div p{margin-top: 1rem;}
    [data-content="0302"] .box7.ty2 .b{margin-top: 1rem;}
    [data-content="0302"] .box8{flex-wrap: wrap; gap: 2rem;}
    [data-content="0302"] .box8 >.l{order: 1; flex: 2; width: auto;}
    [data-content="0302"] .box8 >.l ul li img{max-width: 13rem; margin: 0 auto; }
    [data-content="0302"] .box8 >.m{order: 3; flex: auto; width: 100%;}
    [data-content="0302"] .box8 >.m img{max-width: 50rem;}
    [data-content="0302"] .box8 >.r{order: 2; flex: 1; width: auto;}
    [data-content="0302"] .box10{/*flex-direction: column;*/ gap: 2rem; padding: 2rem;}
    [data-content="0302"] .box10 >div ul{gap: 1.25rem;}
    [data-content="0302"] .box10 >div ul li span{font-size: 1.4rem;}
    [data-content="0302"] .box10 >div >ul >li:nth-child(2){flex: 1.55;}
    [data-content="0302"] .box10 >div ul li ul{gap: 0.8rem;}
}
@media screen and (max-width:1200px){
    [data-content="0302"] .box1{gap: 4rem;}
    [data-content="0302"] .box1 >img,
    [data-content="0302"] .box1 >video{width: 36rem;}
    [data-content="0302"] .box1 >.imgs,
    [data-content="0302"] .box1.ty4 >img{width: 52rem;}
    [data-content="0302"] .box3{padding: 2.5rem; gap: 2.5rem;}
    [data-content="0302"] .box4{gap: 2.5rem;}
    [data-content="0302"] .box5{gap: 2.5rem;}
    [data-content="0302"] .box7 .l >span span i{font-size: 2rem;}
    [data-content="0302"] .box7 .r ul li{align-items: flex-start;gap: 2rem;}
    [data-content="0302"] .box7 .r ul li img{width: 6.4rem; height: 6.4rem;}
    [data-content="0302"] .box7 .r ul li div p{margin-top: 0.8rem;}
    [data-content="0302"] .box7.ty2{padding: 2.5rem 2.5rem 0;}
    [data-content="0302"] .box7.ty2 .l{gap: 2.5rem;}
    [data-content="0302"] .box7.ty2 .l >span span i{padding: 1.5rem 2.6rem;}
}
@media screen and (max-width:1024px){
    [data-content="0302"] .box1{flex-wrap: wrap; gap: 2rem;}
    [data-content="0302"] .box1 >.imgs{gap: 1.5rem;}
    [data-content="0302"] .box1.ty3{background-color: transparent;}
    [data-content="0302"] .box1.right{flex-direction: row;}
    [data-content="0302"] .box1 >img,
    [data-content="0302"] .box1 >video,
    [data-content="0302"] .box1 >.imgs{order: 2; width: 40rem; max-width: 100%;}
    [data-content="0302"] .box1 .l{order: 2;}
    [data-content="0302"] .box1.ty3 .l{padding: 0;}
    [data-content="0302"] .box1.ty3 >img{border-radius: 0.4rem;}
    [data-content="0302"] .box2{gap: 2rem;}
    [data-content="0302"] .box3{padding: 2.5rem 2rem; gap: 2rem;}
    [data-content="0302"] .box3 >div{gap: 0.8rem;}
    [data-content="0302"] .box3 >div strong{font-size: 2.2rem;}
    [data-content="0302"] .box4{gap: 2rem;}
    [data-content="0302"] .box5{gap: 2rem;}
    [data-content="0302"] .box5 >li div span{font-size: 2rem;}
    [data-content="0302"] .box6{gap: 4rem;}
    [data-content="0302"] .box6 .box6_in{padding: 1rem 1.4rem;}
    [data-content="0302"] .box6 .l .b:before{left: calc(100% + 1.4rem); border-width: 1.2rem 0 1.2rem 2rem;}
    [data-content="0302"] .box7{gap: 2.5rem; padding: 2.5rem 2rem;}
    [data-content="0302"] .box7 .l >div >ul{font-size: 1.6rem;}
    [data-content="0302"] .box7 .l >div >ul >li{padding-left: 2.6rem;}
    [data-content="0302"] .box7 .l >div >ul >li:before{width: 2rem; height: 2rem;}
    [data-content="0302"] .box7 .l >span span i{font-size: 1.8rem;}
    [data-content="0302"] .box7 .r ul{gap: 1.5rem 2rem;}
    [data-content="0302"] .box7 .r ul li{gap: 1.5rem;}
    [data-content="0302"] .box7 .r ul li img{width: 5.6rem; height: 5.6rem;}
    [data-content="0302"] .box7 .r ul li div strong{font-size: 1.7rem;}
    [data-content="0302"] .box7 .r ul li div p{margin-top: 0.6rem; font-size: 1.5rem;}
    [data-content="0302"] .box7.ty2{padding: 2rem 2rem 0;}
    [data-content="0302"] .box7.ty2 .b img{width: 100%; max-width: 60rem;}
    [data-content="0302"] .box8 >.l{flex: 1.5;}
    [data-content="0302"] .box8{gap: 1.5rem;}
    [data-content="0302"] .box9 .ins .t{margin-top: 1.6rem;}
    [data-content="0302"] .box9 .ins .t:after{margin: 1.6rem auto; border-width: 2.4rem 1.4rem 0 1.4rem;}
    [data-content="0302"] .box9 .ins >ul li span{width: 5.5rem; height: 5.5rem; margin-bottom: 0.6rem; font-size: 2.2rem;}
    [data-content="0302"] .box9 .ins .t_in div{padding: 1rem 1.4rem;}
    [data-content="0302"] .box9 .ins .b img{width: 100%; max-width: 45rem;}
    [data-content="0302"] .box9 .ins .b div ul{gap: 0.6rem;}
    [data-content="0302"] .box10{flex-direction: column;}
    [data-content="0302"] .box10 >div >p{margin-top: 0.6rem; font-size: 1.5rem;}
    [data-content="0302"] .box10 >div ul{gap: 2rem;}
    [data-content="0302"] .box10 >div ul li ul{gap: 1rem;}
    [data-content="0302"] .box10 >div >ul >li:nth-child(2){flex: 1.42;}
    [data-content="0302"] .box10 >div ul li span{font-size: 1.5rem;}
}
@media screen and (max-width:840px){
    [data-content="0302"] .box3{flex-direction: column;}
    [data-content="0302"] .box3 >div:first-child img{max-width: 30rem;}
    [data-content="0302"] .box4{gap: 1.5rem;}
    [data-content="0302"] .box4 >li .imgs i{padding: 0.4rem 1.2rem; font-size: 1.6rem;}
    [data-content="0302"] .box5 >li div span{font-size: 1.8rem;}
    [data-content="0302"] .box5{flex-wrap: wrap; gap: 3rem 2rem;}
    [data-content="0302"] .box5 >li{width: calc((100% - 2rem) / 2); max-width: none;}
    [data-content="0302"] .box5 >li div{width: 100%; max-width: 18rem; margin: 0 auto;}
    [data-content="0302"] .box6{flex-direction: column; gap: 5rem;}
    [data-content="0302"] .box6 .l .b:before{left: 50%; top: calc(100% + 2.5rem); border-width: 2.2rem 1.4rem 0 1.4rem; border-color: #D4000F transparent transparent transparent; transform: translate(-50%,-50%);}
    [data-content="0302"] .box9 .ins >ul >li{width: calc((100% - 2rem - 2rem - 2rem) / 4);}
    [data-content="0302"] .box9 .ins .t{margin-top: 1.4rem;}
    [data-content="0302"] .box9 .ins .t:after{margin: 1.4rem auto; border-width: 1.8rem 1rem 0 1rem;}
    [data-content="0302"] .box9 .ins .b img{max-width: 40rem;}
    [data-content="0302"] .box10 >div >ul >li:nth-child(2){flex: 1.45;}
}
@media screen and (max-width:740px){
    [data-content="0302"] .box7.ty2{}
    [data-content="0302"] .box7.ty2 .l{display: block;}
    [data-content="0302"] .box7.ty2 .l >div{display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; justify-content: flex-start; align-items: center; text-align: center;}
    [data-content="0302"] .box7.ty2 .l >div >ul{display: inline-flex;}
    [data-content="0302"] .box7.ty2 .l >div >ul >li{white-space: normal;}
    [data-content="0302"] .box7.ty2 .l >span span{display: inline-block; position: relative; width: auto;}
    [data-content="0302"] .box7.ty2 .l >span span:before{width: 100%; height: 100%; padding-top: 0; background-image: url(../../..//img/site/kor/content/030204_img11.svg); background-size: contain;}
    [data-content="0302"] .box7.ty2 .l >span span i{padding: 2rem 6rem 3rem;}
    [data-content="0302"] .box7.ty2 .l >div >ul{min-width: 30rem;}
    [data-content="0302"] .box7.ty2 .l >div >ul >li{white-space: nowrap;}
    [data-content="0302"] .box7.ty2 .b img{margin: 0 auto;}
    [data-content="0302"] .box9 .ins .b img{max-width: 32rem;}
    [data-content="0302"] .box10 >div >ul >li:nth-child(2){flex: 1.475;}
}
@media screen and (max-width:640px){
    [data-content="0302"] .box1 >img,
    [data-content="0302"] .box1 >video{width: 36rem;}
    [data-content="0302"] .box1 >.imgs{width: 100%;}
    [data-content="0302"] .box1 >.imgs >div >strong{font-size: 1.6rem;}
    [data-content="0302"] .box1.ty2 .l{gap: 2rem;}
    [data-content="0302"] .box1.ty2 .l .list1{flex-wrap: wrap; gap: 1.25rem;}
    [data-content="0302"] .box1.ty2 .l .list1 >li{display: block; width: calc((100% - 1.25rem) / 2); padding: 2rem 1.5rem 2rem;}
    [data-content="0302"] .box1.ty2 .l .list1 >li >img{width: 4rem;}
    [data-content="0302"] .box1.ty2 .l .list1 >li >strong{margin-top: 1.6rem; font-size: 1.8rem; font-weight: 500; line-height: 1.3; font-family: 'Poppins';}
    [data-content="0302"] .box2{flex-wrap: wrap;}
    [data-content="0302"] .box3 >div strong{font-size: 2rem;}
    [data-content="0302"] .box3 >div:first-child img{max-width: 26rem;}
    [data-content="0302"] .box4{flex-wrap: wrap; gap: 2rem;}
    [data-content="0302"] .box5 >li div{max-width: 15rem;}
    [data-content="0302"] .box5 >li div span{font-size: 1.6rem;}
    [data-content="0302"] .box6{gap: 4rem;}
    [data-content="0302"] .box6 .box6_in{padding: 0.8rem 1rem;}
    [data-content="0302"] .box6 .l .t span em i,
    [data-content="0302"] .box6 .box6_in i{font-size: 1.6rem;}
    [data-content="0302"] .box6 .box6_in ul{font-size: 1.7rem;}
    [data-content="0302"] .box6 .l .t{gap: 0.4rem;}
    [data-content="0302"] .box6 .l .b:before{top: calc(100% + 2rem); border-width: 1.8rem 1.2rem 0 1.2rem;}
    [data-content="0302"] .box7 .l{flex-direction: column;}
    [data-content="0302"] .box7 .l >div >b{font-size: 1.9rem;}
    [data-content="0302"] .box7 .l >div >ul{display: inline-block; font-size: 1.8rem;}
    [data-content="0302"] .box7 .l >span{width: 12rem; margin: 1rem auto;}
    [data-content="0302"] .box7 .l >span span:before{padding-top: 80%; transform: rotate(90deg); background-size: auto 100%;}
    [data-content="0302"] .box7 .l >div >img{max-width: 30rem}
    [data-content="0302"] .box7 .r ul{gap: 1.25rem;}
    [data-content="0302"] .box7 .r ul li{width: 100%;}
    [data-content="0302"] .box7 .r ul li div strong{font-size: 1.8rem;}
    [data-content="0302"] .box7 .r ul li div p{margin-top: 0.2rem; font-size: 1.7rem;}
    [data-content="0302"] .box8{gap: 1rem;}
    [data-content="0302"] .box8 >.l{flex: 1; }
    [data-content="0302"] .box8 >.l ul{flex-wrap: nowrap; gap: 1rem;}
    [data-content="0302"] .box8 >.l ul li{padding-top: 3rem;}
    [data-content="0302"] .box8 >.l ul li i{font-size: 1.4rem;}
    [data-content="0302"] .box8 >.m{order: 2;}
    [data-content="0302"] .box8 >.r{order: 3; flex: 1; width: 100%;}
    [data-content="0302"] .box8 >.r div img{max-width: 40rem; margin: 0 auto;}
    [data-content="0302"] .box8 >.r table tr th, 
    [data-content="0302"] .box8 >.r table tr td{font-size: 1.8rem;}
    [data-content="0302"] .box9 .ins >ul{gap: 1.5rem;}
    [data-content="0302"] .box9 .ins >ul >li{width: calc((100% - 1.5rem - 1.5rem - 1.5rem) / 4);}
    [data-content="0302"] .box9 .ins .t_in div ul li,
    [data-content="0302"] .box9 .ins .b div ul{font-size: 1.8rem;}
    [data-content="0302"] .box9 .ins .t{margin-top: 1.2rem;}
    [data-content="0302"] .box9 .ins .t:after{margin: 1rem auto;}
    [data-content="0302"] .box9 .ins .t_in{background-color: #fff;}
    [data-content="0302"] .box9 .ins .t_in div{position: relative; top: auto; left: auto; width: 100%; border-top-right-radius: 0;}
    [data-content="0302"] .box9 .ins .b{gap: 2rem;}
    [data-content="0302"] .box9 .ins .b img{max-width: 28rem;}
    [data-content="0302"] .box9 .ins .t_in div i,
    [data-content="0302"] .box9 .ins .b div i{font-size: 1.6rem;}
    [data-content="0302"] .box9 .ins .b div ul{gap: 0.4rem;}
    [data-content="0302"] .box10 >div >p{margin-top: 0.2rem;}
    [data-content="0302"] .box10 >div ul{gap: 1.5rem;}
    [data-content="0302"] .box10 >div >ul >li:nth-child(2){flex: 1.5;}
    [data-content="0302"] .box10 >div >strong{font-size: 2rem;}
    [data-content="0302"] .box10 >div >p, 
    [data-content="0302"] .box10 >div ul li span{font-size: 1.8rem;}
}
@media screen and (max-width:540px){
    [data-content="0302"] .box9 .ins .b img{max-width: 24rem;}
    [data-content="0302"] .box10 >div ul{gap: 1.25rem;}
    [data-content="0302"] .box10 >div >ul >li:nth-child(2){flex: 1.55;}
}
@media screen and (max-width:480px){
    [data-content="0302"] .box1 >img,
    [data-content="0302"] .box1 >video,
    [data-content="0302"] .box1.ty4 >img{width: 100%;}
    [data-content="0302"] .box3 >div:first-child img{max-width: 24rem;}
    [data-content="0302"] .box6 .l .t span em{margin-top: -1rem;}
    [data-content="0302"] .box6 .l .t span em i{display: inline-flex; min-height: 4.5rem; padding: 0.3rem 0.8rem; justify-content: center; align-items: center; text-align: center; line-height: 1.2;}
    [data-content="0302"] .box9 .ins >ul{justify-content: flex-start; gap: 1.5rem 1rem;}
    [data-content="0302"] .box9 .ins >ul >li{width: calc((100% - 1rem - 1rem) / 3); font-size: 1.5rem;}
    [data-content="0302"] .box9 .ins .b{flex-direction: column; gap: 2rem;}
    [data-content="0302"] .box9 .ins .b div{width: 100%;}
    [data-content="0302"] .box10 >div ul{gap: 1.5rem;}
    [data-content="0302"] .box10 >div >ul{flex-wrap: wrap;flex-direction: column;}
    [data-content="0302"] .box10 >div >ul li{gap: 0.4rem;}
    [data-content="0302"] .box10 >div >ul >li{gap: 1rem;}
}
@media screen and (max-width:360px){
    [data-content="0302"] .box3 >div:first-child img{max-width: 20rem;}
}

/*-------------------------------------------------------------------
    technology > 기술 협력 파트너
-------------------------------------------------------------------*/
[data-content="0305"]{}
[data-content="0305"] >ul{display: block;margin-top: 8rem;}
[data-content="0305"] >ul >li{width: calc((100% - 10rem) / 2);}
[data-content="0305"] >ul >li:nth-child(2n){margin-left: auto;}
[data-content="0305"] >ul >li img{display: block; width: 100%; border-radius: 0.6rem;}
[data-content="0305"] >ul >li p{display: block; margin-top: 2rem; color: #131416; font-size: 2rem; font-weight: 700; font-family: 'Pretendard';}

@media screen and (max-width:1640px){
    [data-content="0305"] >ul{margin-top: 6rem;}
    [data-content="0305"] >ul >li{width: calc((100% - 8rem) / 2);}
}
@media screen and (max-width:1400px){
    [data-content="0305"] >ul{margin-top: 5rem;}
}
@media screen and (max-width:1200px){
    [data-content="0305"] >ul >li{width: calc((100% - 6rem) / 2);}
}
@media screen and (max-width:1024px){
    [data-content="0305"] >ul{margin-top: 4rem;}
    [data-content="0305"] >ul >li{width: calc((100% - 4rem) / 2);}
    [data-content="0305"] >ul >li p{margin-top: 1.4rem; font-size: 1.8rem;}
}
@media screen and (max-width:840px){
    [data-content="0305"] >ul >li{width: calc((100% - 4rem) * 0.55); margin-top: 3rem;}
    [data-content="0305"] >ul >li:first-child{margin-top: 0;}
}
@media screen and (max-width:640px){
    [data-content="0305"] >ul{margin-top: 3rem;}
    [data-content="0305"] >ul >li{width: calc((100% - 4rem) * 0.6);}
    [data-content="0305"] >ul >li p{margin-top: 0.8rem; font-size: 1.9rem;}
}
@media screen and (max-width:540px){
    [data-content="0305"] >ul >li{width: 100%;}
}

/*-------------------------------------------------------------------
    Technology > 연구 성과
-------------------------------------------------------------------*/
[data-content="0304"]{padding: 4rem; border-radius: 0.6rem; border: 1px solid #E6E8EA;}
[data-content="0304"] strong{display: block; margin-bottom: 2.4rem; text-align: center; color: #131416; font-size: 2.4rem; font-weight: 700;}
[data-content="0304"] img{display: block; width: auto; max-width: 100%; margin: 0 auto;}

@media screen and (max-width:1400px){
    [data-content="0304"]{padding: 3rem;}
}
@media screen and (max-width:1024px){
    [data-content="0304"]{padding: 2.5rem;}
    [data-content="0304"] strong{margin-bottom:  calc(2.4rem * 0.75); font-size: 2.2rem;}
}
@media screen and (max-width:640px){
    [data-content="0304"]{padding: 2rem;}
    [data-content="0304"] strong{margin-bottom: calc(2.4rem * 0.6); font-size: 2.1rem;}
}

/*-------------------------------------------------------------------
    Contact US > 제품문의
-------------------------------------------------------------------*/
[data-content="0701"]{display: block; position: relative; }
[data-content="0701"]:after{content: ""; display: block; clear: both;}
[data-content="0701"] >*{float: left;}
[data-content="0701"] .l{display: block; position: relative; width: calc(100% - 34rem - 4rem); min-width: 0; padding-right: 4rem; font-family: 'Pretendard';}
[data-content="0701"] .l:before{content: ""; display: block; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background-color: #CDD1D5;}
[data-content="0701"] .l >ul{border-top: 2px solid #D4000F;}
[data-content="0701"] .l >ul >li{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 1.2rem; padding: 2rem 0; border-bottom: 1px solid #E6E8EA;}
[data-content="0701"] .l >ul >li >strong{width: 24rem; font-family: 'Pretendard'; font-size: 1.5rem; font-weight: 500;}
[data-content="0701"] .req{color: var(--color-red);}
[data-content="0701"] .l >ul >li >div,
[data-content="0701"] .l >ul >li >div .emails{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 1.2rem 0.8rem; flex: 1; width: 100%; min-width: 0;}
[data-content="0701"] .l >ul >li >div .emails{width: auto; flex: none;}
[data-content="0701"] .l >ul >li >div [data-skin="input"],
[data-content="0701"] .l >ul >li >div [data-skin="select"],
[data-content="0701"] .l >ul >li >div [data-skin="file"] .names{width: 28rem;}
[data-content="0701"] .l >ul >li >div >span{color: #6D7882; font-size: 1.5rem; font-weight: 400; line-height: 1.5;}
[data-content="0701"] .l >.ag_box{}
[data-content="0701"] .l >.ag_box [data-skin="radio"]:not(:first-child){margin-top: 2.4rem;}
[data-content="0701"] .l >.ag_box .captcha_box{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.8rem; margin-top: 2.4rem;}
[data-content="0701"] .l >.ag_box .captcha_box >img{display: block; height: 4.8rem; border: 1px solid #E6E8EA; border-radius: 0.4rem;}
[data-content="0701"] .l >.ag_box .captcha_box [data-skin="input"]{width: 28rem;}
[data-content="0701"] .r{position: sticky; top: 8rem; width: 34rem; margin-left: 4rem; padding-top: 2rem;}
[data-content="0701"] .r >strong{display: block; color: #131416; font-size: 2.4rem; font-weight: 600; line-height: 1.5;}
[data-content="0701"] .r >ul{margin-top: 2rem;}
[data-content="0701"] .r >ul >li{padding: 0.8rem 0; font-size: 1.7rem; color: #464C53; font-family: 'Pretendard'; border-bottom: 1px solid #E6E8EA;}
[data-content="0701"] .r >ul >li:first-child{padding-top: 0;}
[data-content="0701"] .r >ul >li >b{display: block; color: #1A1311; font-size: 1.8rem; font-weight: 500; font-family: 'Poppins';}
[data-content="0701"] .r >div{margin-top: 2rem;}

@media screen and (max-width:1640px){
    [data-content="0701"] .l{width: calc(100% - 30rem - 4rem);}
    [data-content="0701"] .l >ul >li >strong{width: 20rem;}
    [data-content="0701"] .r{width: 30rem;}
}
@media screen and (max-width:1400px){
    [data-content="0701"] .l{width: calc(100% - 25rem - 3rem); padding-right: 3rem;}
    [data-content="0701"] .l >ul >li >strong{width: 17rem;}
    [data-content="0701"] .r{width: 25rem; margin-left: 3rem;}
    [data-content="0701"] .l >ul >li >div [data-skin="input"],
    [data-content="0701"] .l >ul >li >div [data-skin="select"],
    [data-content="0701"] .l >ul >li >div [data-skin="file"] .names{width: 24rem;}
    [data-content="0701"] .l >.ag_box .captcha_box [data-skin="input"]{width: 24rem;}
}
@media screen and (max-width:1200px){
    [data-content="0701"]{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: flex-start; align-items: stretch; gap: 4rem;}
    [data-content="0701"]:after{display: none;}
    [data-content="0701"] .l{order: 2; width: 100%; padding-right: 0;}
    [data-content="0701"] .l:before{display: none;}
    [data-content="0701"] .l >ul{}
    [data-content="0701"] >*{float: none;}
    [data-content="0701"] .r{order: 1; position: relative; top: auto; width: 100%; margin-left: 0; padding-top: 0;}
    [data-content="0701"] .r >ul{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 4rem;}
    [data-content="0701"] .r >ul >li{position: relative; width: 100%; padding: 0; border-bottom: 0;}
    [data-content="0701"] .r >ul >li:not(:first-child):before{content: ""; display: block; position: absolute; top: 50%; left: -2rem; width: 1px; height: 100%; background-color: #E6E8EA; transform: translateY(-50%);}
}
@media screen and (max-width:1024px){
    [data-content="0701"] .l >ul >li >div [data-skin="input"],
    [data-content="0701"] .l >ul >li >div [data-skin="select"],
    [data-content="0701"] .l >ul >li >div [data-skin="file"] .names{width: 20rem;}
    [data-content="0701"] .l >.ag_box .captcha_box [data-skin="input"]{width: 20rem;}
}
@media screen and (max-width:740px){
    [data-content="0701"] .l >ul >li{display: block; }
    [data-content="0701"] .l >ul >li >strong{font-size: 1.78rem;}
    [data-content="0701"] .l >ul >li >div{flex-direction: column; gap: 0.8rem; margin-top: 1.5rem;}
    [data-content="0701"] .l >ul >li >div .emails{flex-wrap: nowrap; flex: 1; width: 100%;}

    [data-content="0701"] .l >ul >li >div [data-skin="input"],
    [data-content="0701"] .l >ul >li >div [data-skin="select"],
    [data-content="0701"] .l >ul >li >div [data-skin="file"] .names{width: 100%;}
    [data-content="0701"] .l >ul >li >div [data-skin="file"]{flex-wrap: nowrap;}
    [data-content="0701"] .l >ul >li >div [data-skin="file"] .names{flex: 1; min-width: 0;}
    [data-content="0701"] .l >ul >li >div a{margin-left: auto;}
    
    [data-content="0701"] .l >.ag_box .captcha_box >img{height: 4.4rem;}
    [data-content="0701"] .l >.ag_box .captcha_box [data-skin="input"]{width: 100%;}

    [data-content="0701"] .r >ul{display: block;}
    [data-content="0701"] .r >ul >li{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: start; gap: 1rem; padding: 1.3rem 0; border-bottom: 1px solid #E6E8EA;}
    [data-content="0701"] .r >ul >li:not(:first-child):before{display: none;}
    [data-content="0701"] .r >ul >li b{width: 12rem;}
}








/*-------------------------------------------------------------------
    About >
-------------------------------------------------------------------*/

@media screen and (max-width:1640px){

}
@media screen and (max-width:1400px){

}
@media screen and (max-width:1200px){

}
@media screen and (max-width:1024px){

}
@media screen and (max-width:640px){

}
@media screen and (max-width:480px){

}