@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(250px, calc( 520  / var(--inner) * 100vw ), 520px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 520  / var(--inner) * 100vw ), 520px) !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {display: none !important;}
.roughmap_maker_label .roughmap_lebel_text,
.roughmap_maker_label:after {display: none !important;}

.bullet-item .bullet-list {position:relative; padding-left:15px; margin-top:10px; line-height:1.3;}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:3px; height: 3px; background:var(--color-primary); border-radius: 50%;}
.bullet-item .bullet-list.none {padding-left: 0;}
.bullet-item .bullet-list.none::before {display: none;}
.bulletitem2 {padding-left:0.6em;text-indent: -0.6em;}

.bg-gray {background:#fafafa;}
.bg-gray2 {background:#F8F8F8;}
.overhidden {overflow: hidden;}
.subsec-pd {padding: clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px) 0;}
 
.comm-subtit {margin-bottom: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);font-size: clamp(20px, calc( 32 / var(--inner) * 100vw ), 32px); font-weight: 600; color: var(--color-primary); line-height: 1.43;text-align: center; }

.sub1_1 {max-width: 610px; width: 100%; margin: 0 auto; letter-spacing:-0.4px;}
.sub1_comm .commbx + .commbx {margin-top: clamp(40px, calc( 70 / var(--inner) * 100vw ), 70px);}
.sub1_comm .title {font-size: clamp(20px, calc( 32 / var(--inner) * 100vw ), 32px); font-weight: 600; color: var(--color-primary); line-height: 1.43;}
.sub1_comm .title + .decbx {margin-top: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.sub1_comm .dec + .dec {padding-top: clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px);}
.sub1_comm .dec span {display: block;color: var(--color-body); line-height: 1.5;}
.sub1_comm .dec .tit {margin-bottom: 4px; font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600;}
.sub1_comm .signbx {display: inline-flex;flex-direction: column; align-items: center;justify-content:center; padding-top: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.sub1_comm .signbx img {width:clamp(120px, calc( 220 / var(--inner) * 100vw ), 220px);}
.sub1_comm .namebx {display: flex; margin:0 -8px; padding-top: 5px;}
.sub1_comm .namebx .name {padding: 0 8px; position: relative; font-size:clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px); color: #666;}
.sub1_comm .namebx .name:not(:last-child):after {position: absolute; content: ''; right: 0; top: 5px; width: 1px; height: 10px; background: #000;}

.history-list {position:relative; margin-top:clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}
.history-line { position: absolute; left:50%; width: 1px; top:17px; bottom: 0; background: #ddd;text-align: center;}
.history-line .line { width: 1px;height: 0; background:var(--color-1); transition: height 0.3s ease-out;}
.history-detailitem .contFlx {display:flex; flex-wrap: wrap;}
.history-detailitem  {padding-bottom:clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px);}
.history-detailitem:last-child {padding-bottom:clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px);}
.history-detailitem:first-child {padding-top: clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px);}
.history-detailitem .cont-wrap {flex:1 0 50%; max-width:50%; padding:0 clamp(30px, calc( 100 / var(--inner) * 100vw ), 100px);}
.history-detailitem .cont-wrap:first-child {padding-left: 0; text-align: right;}
.history-detailitem .cont-wrap:last-child {padding-right: 0;}
.history-detailitem .images {aspect-ratio: 600 / 360; overflow: hidden; border-radius: 24px;}
.history-detailitem .images img {width:100%; height:100%; object-fit:cover;}
.history-detailitem .hislist {display: flex; margin-top: clamp(25px, calc( 30 / var(--inner) * 100vw ), 30px); line-height: 1.36; letter-spacing: -0.5px;}
.history-detailitem .hislist:first-child {margin-top:0;}
.history-detailitem .hislist .month {flex: 1 0 60px; max-width: 60px; margin-right:clamp(10px, calc( 25 / var(--inner) * 100vw ), 25px); font-weight:600; color: var(--color-primary);font-size:clamp(17px, calc( 22 / var(--inner) * 100vw ), 22px);}
.history-detailitem .hislist .width {display: inline-block;position:relative; }
.history-detailitem .hislist .decbx {flex: 1 0 auto; width: 1%;}
.history-detailitem .hislist .dec { font-weight:600; font-size:clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px);}
.history-detailitem .hislist .subdec {padding-top: 10px; color: #777; font-weight: 500; line-height: 1.3;}
.history-detailitem:nth-child(even) .contFlx  {flex-direction: row-reverse;}
.history-detailitem:nth-child(even) .cont-wrap:first-child {text-align: left;padding-left:clamp(30px, calc( 100 / var(--inner) * 100vw ), 100px); padding-right: 0;}
.history-detailitem:nth-child(even) .cont-wrap:last-child {text-align: right;padding-right:clamp(30px, calc( 100 / var(--inner) * 100vw ), 100px); padding-left: 0;}   
.history-detailitem:nth-child(even) .hislist {flex-direction: row-reverse;}
.history-detailitem:nth-child(even) .hislist .month {margin-left:clamp(10px, calc( 25 / var(--inner) * 100vw ), 25px);margin-right:0; }
.history-detailitem:nth-child(even) .hislist .width {text-align:left;}
.progress-container {position:absolute; left:50%; top:0; height:100%; width:2px; background:#dddddd; z-index:10;}
.progress-bar {position: relative; width:2px; background:var(--color-primary); height:0;}
.progress-bar .dot {position: absolute; right:-7px; bottom:-8px; width:16px; height:16px; border-radius:50%; background:var(--color-primary); }
.history-detailitem.last {margin-top: 50px; text-align: center !important;}
.history-detailitem.last .hislist {display: block;}
.history-detailitem.last .hislist .month {margin-bottom: 15px; max-width: 100% !important;}
.history-detailitem.last .hislist .decbx {width: 100%;}
.history-detailitem.last span {text-align: center !important;}
.history-detailitem.last p {text-align: center !important;}
.history-detailitem .hypen {position:absolute;content:'';top:12px;right:-12px; width:clamp(5px, calc( 8 / var(--inner) * 100vw ), 8px);height:clamp(1px, calc( 2 / var(--inner) * 100vw ), 2px);  background:var(--color-primary);}

.sub1_3 .comm-subtit {margin-bottom: clamp(40px, calc( 130 / var(--inner) * 100vw ), 130px);}
.sub1_3 .imgbx {flex: 1 0 clamp(300px, calc( 620 / var(--inner) * 100vw ), 620px); max-width: clamp(300px, calc( 620 / var(--inner) * 100vw ), 620px); margin-right: clamp(20px, calc( 70 / var(--inner) * 100vw ), 70px); text-align: right;}
.sub1_3 .textbx {flex: 1 0 auto; width: 1%;}
.sub1_3 .dec .tit {color: #242424;}
.sub1_3 .dec .tit.color1 {color: #88C247;}
.sub1_3 .dec .tit.color2 {color: #3DBBEC;}
.sub1_3 .dec .tit.color3 {color: #037CC4;}
.sub1_3 .dec .txt {font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px);}


.faq-map {border-top:2px solid #242424;}
.faq-map ul li {border-bottom:1px solid #ddd;}
.faq-map ul li:last-child {margin-bottom:0;}
.faq-map .tit {color:var(--color-body); line-height:1.5em;}
.faq-map .tit a {position:relative; padding:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(15px, calc( 60 / var(--inner) * 100vw ), 60px); text-decoration:none !important; transition:none;}
.faq-map .mapflx {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; letter-spacing: -0.5px;}
.faq-map .titlebx {flex: 1 0 auto; width: 1%;}
.faq-map .toptit {display: flex; margin:0 -14px;}
.faq-map .name {display: inline-block; padding: 0 14px; position: relative; font-size: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); color: #222; font-weight: bold;}
.faq-map .name:not(:last-child)::after {position: absolute; content: ''; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: clamp(10px, calc( 17 / var(--inner) * 100vw ), 17px); background: #ddd;}
.faq-map .bottomtit {margin-top: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px);}
.faq-map .bottomtit span {display: block;font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 500;}
.faq-map .txt2 {padding-top: clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px); color: #aeaeae;}
.faq-map .icnbx {flex:1 0 105px; max-width: 105px;display: flex;align-items: center;justify-content: flex-end;}
.faq-map .icnbx img {width: clamp(25px, calc( 40 / var(--inner) * 100vw ), 40px);}
.faq-map .icnbx .tt {display: inline-block; margin-left: 10px; font-size: clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: bold; color: #242424;}
.faq-map .cnt {display:none; position:relative; padding:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(15px, calc( 60 / var(--inner) * 100vw ), 60px) ; padding-top: 0;}
.faq-map .mapbox {border-radius: 24px; overflow: hidden;}

.prdtextbx {padding-top:clamp(20px, calc( 42 / var(--inner) * 100vw ), 42px); padding-bottom: clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px);}
.prdtextbx .txt1 {font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); color: var(--color-body); line-height: 1.4;}
.prdtextbx .txt2 {padding-top: clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px); font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); color: #aaa; line-height: 1.3;}

.radiobx {display: flex;flex-wrap: wrap;}
.radiobx .item {display: inline-flex;align-items: center; height: clamp(38px, calc( 44 / var(--inner) * 100vw ), 44px); line-height: 1;}
.radiobx .item:not(:last-child) {margin-right: clamp(10px, calc( 40 / var(--inner) * 100vw ), 40px);}

.video-container {aspect-ratio: 16 / 9;}
.video-container video {width:100%; height:100%; object-fit:cover;}

.equipment-list {display: flex; flex-wrap: wrap; margin:clamp(-5px, calc( -5 / var(--inner) * 100vw ), -15px);}
.equipment-item {flex:1 0 33.33333333%; max-width: 33.33333333%; padding:clamp(5px, calc( 15 / var(--inner) * 100vw ), 15px);}
.equipment-item .inner {padding: clamp(20px, calc( 35 / var(--inner) * 100vw ), 35px) clamp(12px, calc( 40 / var(--inner) * 100vw ), 40px); border-radius: clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); background: #f4f4f4; height: 100%; letter-spacing: -0.7px; text-align: center;}
.equipment-item .equipment-title {margin-bottom: clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); color: var(--color-primary); font-weight: 400;}
.equipment-item .title-kor {font-size: clamp(20px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 600;}
.equipment-item .title-eng {font-size: clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px); display: block;}
.equipment-item .equipment-desc {padding-top: clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px); font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); color: var(--color-body);}
.equipment-item .equipment-desc-eng { padding-top: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px);  font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); color: var(--color-body);}
.equipment-item.wid-100 {flex:1 0 100%; max-width: 100%;}
.equipment-item.wid-100:not(:first-child) {margin-top: clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px);}
.equipment-item .inimglist {display: flex;justify-content: center; flex-wrap: wrap; margin: -5px clamp(-5px, calc( -5 / var(--inner) * 100vw ), -37px);}
.equipment-item .inimgitem {flex: 1 0 33.33%; max-width: 33.33%; padding: 5px clamp(5px, calc( 37 / var(--inner) * 100vw ), 37px);}

.oem-process-wrap {display: flex;flex-wrap: wrap; margin:clamp(-6px, calc( -6 / var(--inner) * 100vw ), -20px);}
.oem-process {display:flex; flex-direction:column; gap:clamp(24px, calc( 36 / var(--inner) * 100vw ), 36px); align-items:flex-start; flex: 1 0 50%; max-width: 50%; padding:clamp(6px, calc( 20 / var(--inner) * 100vw ), 20px);}
.oem-title {background:#f9ffeb; border:1px solid #88c247; box-sizing:border-box; display:flex; gap:clamp(4px, calc( 6 / var(--inner) * 100vw ), 6px); align-items:center; justify-content:center; padding:clamp(10px, calc( 12 / var(--inner) * 100vw ), 12px); border-radius:clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px); width:100%;}
.oem-title svg {width:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); height:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); flex-shrink:0;}
.oem-title-text {color:#88c247; font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight:500; }
.oem-title-odm {background:#e6f8ff; border-color:#3dbbec;}
.oem-title-odm .oem-title-text {color:#3dbbec;}
.oem-content {display:flex; flex-direction:column; gap:clamp(14px, calc( 20 / var(--inner) * 100vw ), 20px); position: relative; width:100%;}
.oem-content::before {position: absolute; content:''; left:clamp(38px, calc( 60 / var(--inner) * 100vw ), 60px); top:0; width:1px; height:100%; background:#ddd;z-index: -1;}
.oem-step {background:#f9f9f9; border:1px solid #ddd; display:flex; gap:clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px); padding:clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(18px, calc( 35 / var(--inner) * 100vw ), 35px); border-radius:clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); width:100%;}
.step-number {display:flex; align-items:center; justify-content:center;background:#e5e5e5; border-radius:clamp(8px, calc( 12 / var(--inner) * 100vw ), 12px); width:clamp(36px, calc( 52 / var(--inner) * 100vw ), 52px); height:clamp(36px, calc( 52 / var(--inner) * 100vw ), 52px); font-size:clamp(14px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight:700;}
.step-content {flex:1; padding-top: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px);}
.step-title {display: flex;align-items: center;flex-wrap: wrap; font-size:clamp(18px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight:600;}
.step-title + .step-desc {margin-top: clamp(10px, calc( 18 / var(--inner) * 100vw ), 18px);}
.step-title + .step-desc-wrap {margin-top: clamp(10px, calc( 18 / var(--inner) * 100vw ), 18px);}
.step-note {display: inline-block; padding-left: 8px; font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); color:var(--color-body); font-weight: 400;}
.step-desc { font-weight:500; line-height:clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); color:var(--color-body);}
.step-desc .bulletitem2:not(:first-child) {margin-top: 5px;}
.step-desc-wrap {display:flex; align-items:center; gap:clamp(6px, calc( 10 / var(--inner) * 100vw ), 10px);}
.step-desc-wrap +.step-desc-wrap  {margin-top:2px;}
.step-time {border:1px solid #ddd; box-sizing:border-box; display:flex; gap:4px; align-items:center; justify-content:center; padding:clamp(3px, calc( 4 / var(--inner) * 100vw ), 4px) clamp(4px, calc( 6 / var(--inner) * 100vw ), 6px); border-radius:clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px);}
.time-icon {width:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); height:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px);}
.step-time span {font-size:clamp(11px, calc( 13 / var(--inner) * 100vw ), 13px);  white-space:nowrap; line-height:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px);}

.oemintro-wrap {margin-top:clamp(40px, calc( 130 / var(--inner) * 100vw ), 130px);}

.sub3_1 {padding: 40px 0; overflow: hidden;}

.rd-circle-wrap {display:flex; justify-content:center; align-items:center; padding:clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px) 0; min-height:960px;}
.rd-circle-container {position:relative; width:960px; height:960px; margin:0 auto;}
.rd-circle-lines {position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; pointer-events:none;}
.rd-circle-line {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.rd-circle-line.rd-circle-outer {width:960px; height:960px;}
.rd-circle-line.rd-circle-middle {width:705px; height:705px;}
.rd-circle-line.rd-circle-inner {width:455px; height:455px;}
.rd-circle-line .line-base {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%; border-radius:50%; border:1px solid #0055A5; opacity:0.3; box-sizing:border-box;}
.rd-circle-line .circle-inner {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%;}
.rd-circle-line.rd-circle-outer .circle-inner {animation:rotateCircle 30s linear infinite;}
.rd-circle-line.rd-circle-middle .circle-inner {animation:rotateCircle 25s linear infinite reverse;}
.rd-circle-line.rd-circle-inner .circle-inner {animation:rotateCircle 20s linear infinite;}
.rd-circle-line .circle {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%; border-radius:50%; box-sizing:border-box;}
.rd-circle-line .circle.front {border-top:2px solid #0055A5; border-left:2px solid #0055A5; border-right:none; border-bottom:none;}
.rd-circle-line .circle.back {border-right:2px solid #0055A5; border-bottom:2px solid rgba(0, 85, 165, 0); border-top:none; border-left:none;}
@keyframes rotateCircle {0% {transform:translate(-50%, -50%) rotate(0deg);} 100% {transform:translate(-50%, -50%) rotate(360deg);}}
@keyframes rotateCircleMobile {0% {transform:translate(-50%, -50%) rotate(0deg);} 100% {transform:translate(-50%, -50%) rotate(360deg);}}
.rd-center-logo {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:10; width:auto; height:auto;}
.rd-center-logo img {display:block; max-width:100%; height:auto;}
.rd-circle-items {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%; z-index:5;}
.rd-circle-item {position:absolute; width:230px; height:230px; top:50%; left:50%; transform-origin:center 290px; transform:translate(-50%, -50%) rotate(0deg) translateY(-290px) rotate(0deg); transition:all 0.3s ease; cursor:pointer; z-index:5;}
.rd-circle-item[data-index="0"] {transform:translate(-50%, -50%) rotate(0deg) translateY(-290px) rotate(0deg);}
.rd-circle-item[data-index="1"] {transform:translate(-50%, -50%) rotate(72deg) translateY(-290px) rotate(-72deg);}
.rd-circle-item[data-index="2"] {transform:translate(-50%, -50%) rotate(144deg) translateY(-290px) rotate(-144deg);}
.rd-circle-item[data-index="3"] {transform:translate(-50%, -50%) rotate(216deg) translateY(-290px) rotate(-216deg);}
.rd-circle-item[data-index="4"] {transform:translate(-50%, -50%) rotate(288deg) translateY(-290px) rotate(-288deg);}
.rd-circle-item .item-image {position:absolute; top:0; left:0; width:100%; height:100%; border-radius:50%; overflow:hidden; border:clamp(5px, calc( 7 / var(--inner) * 100vw ), 7px) solid var(--color-primary); box-sizing:border-box; z-index:1;}
.rd-circle-item .item-image img {width:100%; height:100%; object-fit:cover;}
.rd-circle-item .item-content {position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; border-radius:50%; background:transparent; transition:all 0.3s ease; z-index:2; background: linear-gradient(0deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%);}
.rd-circle-item .item-text {text-align:center; position:relative; z-index:3; color:#fff; font-weight:700;  line-height: 1.06;  transition:opacity 0.3s ease;}
.rd-circle-item .item-text .text-kor {display:block; font-size:clamp(18px, calc( 30 / var(--inner) * 100vw ), 30px); font-weight: 500; line-height: 1.2;}
.rd-circle-item .item-text .text-eng {display:none; font-size:clamp(17px, calc( 26 / var(--inner) * 100vw ), 26px);font-weight: 500; line-height: 1.2;}
.rd-circle-item:hover .item-content {background:linear-gradient(0deg, rgba(0, 85, 165, 0.70) 0%, rgba(0, 85, 165, 0.70) 100%);}
.rd-circle-item:hover .item-text .text-kor {display:none;}
.rd-circle-item:hover .item-text .text-eng {display:block;}
.rd-circle-slider {display:none;}
.rd-circle-item-mobile {position:relative; width:230px; height:230px; margin:0 auto;}
.rd-circle-item-mobile .item-image {position:absolute; top:0; left:0; width:100%; height:100%; border-radius:50%; overflow:hidden; border:7px solid var(--color-primary); box-sizing:border-box; z-index:1;}
.rd-circle-item-mobile .item-image img {width:100%; height:100%; object-fit:cover;}
.rd-circle-item-mobile .item-content {position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; border-radius:50%; background:transparent; transition:all 0.3s ease; z-index:2;background: linear-gradient(0deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%);}
.rd-circle-item-mobile .item-text {text-align:center; position:relative; z-index:3; font-weight:700; color:#fff; line-height:1.3;}
.rd-circle-item-mobile .item-text .text-kor {display:block; font-size:clamp(18px, calc( 20 / var(--inner) * 100vw ), 20px);  }
.rd-circle-item-mobile .item-text .text-eng {display:none; font-size:clamp(16px, calc( 18 / var(--inner) * 100vw ), 18px);  }
.rd-circle-item-mobile:hover .item-content {background:linear-gradient(0deg, rgba(0, 85, 165, 0.70) 0%, rgba(0, 85, 165, 0.70) 100%);}
.rd-circle-item-mobile:hover .item-text .text-kor {display:none;}
.rd-circle-item-mobile:hover .item-text .text-eng {display:block;}
.rd-circle-swiper {padding-bottom:20px;}
.rd-circle-swiper .swiper-pagination {bottom:0;}
.rd-circle-swiper .swiper-pagination-bullet {width:10px; height:10px; background:#0055A5; opacity:0.3;}
.rd-circle-swiper .swiper-pagination-bullet-active {opacity:1;}

.patent-list {display: flex;flex-direction: column; gap: clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}
.patent-item {display: flex; align-items: center; flex-wrap: wrap;}
.patent-item .imgbx {flex:1 0 clamp(200px, calc( 330 / var(--inner) * 100vw ), 330px); max-width: clamp(200px, calc( 330 / var(--inner) * 100vw ), 330px); margin-right:clamp(15px, calc( 50 / var(--inner) * 100vw ), 50px);}
.patent-item .textbx {flex: 1 0 auto; width: 1%;}
.patent-item .txt1 {margin-bottom: 10px; font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color: var(--color-body); font-weight: 500; line-height: 1.33;}
.patent-item .txt1 .main {display: inline-block; padding-right: clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px); font-size: clamp(17px, calc( 22 / var(--inner) * 100vw ), 22px); color: var(--color-primary); font-weight: 600;}
.patent-item .title {margin-bottom: clamp(20px, calc( 45 / var(--inner) * 100vw ), 45px); font-size: clamp(19px, calc( 26 / var(--inner) * 100vw ), 26px); font-weight: 600;}
.patent-item .badge {display: inline-flex; align-items: center; justify-content: center; padding: 0 8px; min-width: clamp(50px, calc( 58 / var(--inner) * 100vw ), 58px); height: 36px; font-size: clamp(15px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: bold; background: #484848; border-radius: 8px; color: #fff;}
.patent-item .text {margin-top:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); line-height: 1.75; color: var(--color-body);  }

.sub3_3_1 .flxWrap + .flxWrap {padding-top: clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px);}
.sub3_3_1 .flxWrap:nth-child(2) {flex-direction: row-reverse;}
.sub3_3_1 .flxWrap {margin: clamp(-5px, calc( -5 / var(--inner) * 100vw ), -20px);}
.sub3_3_1 .commbx {flex: 1 0 50%; max-width: 50%; padding: clamp(5px, calc( 20 / var(--inner) * 100vw ), 20px);}
.sub3_3_1 .imgbx img {border-radius: 24px;}
.sub3_3_1 .textbx .inner {display: flex;flex-direction: column; justify-content: center; padding: clamp(30px, calc( 70 / var(--inner) * 100vw ), 70px); border: 1px solid #ddd; border-radius: 24px; height: 100%;}
.sub3_3_1 .textbx .title {margin-bottom: clamp(20px, calc( 43 / var(--inner) * 100vw ), 43px); font-size:clamp(18px, calc( 26 / var(--inner) * 100vw ), 26px); font-weight: 600; color: var(--color-primary);}
.sub3_3_1 .textbx .bulletitem2 {font-size:  clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 500; line-height: 1.6; color: var(--color-body );}

.sub3_3_2 {margin-top: clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px); border-top: 2px solid #ddd;}
.sub3_3_2 .border-item {display: flex; flex-wrap: wrap; padding: clamp(40px, calc( 70 / var(--inner) * 100vw ), 70px) 0; margin: 0 clamp(10px, calc( 70 / var(--inner) * 100vw ), 70px); border-bottom: 1px solid #ddd;}
.sub3_3_2 .imgbx {flex:1 0 clamp(160px, calc( 280 / var(--inner) * 100vw ), 280px); max-width: clamp(160px, calc( 280 / var(--inner) * 100vw ), 280px); padding-right: 15px;}
.sub3_3_2 .textbx {flex: 1 0 auto; width: 1%; letter-spacing: -0.5px;}
.sub3_3_2 .eng {display: block; margin-bottom: 15px; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; color: var(--color-primary);}
.sub3_3_2 .title {margin-bottom: clamp(18px, calc( 35 / var(--inner) * 100vw ), 35px); font-size:clamp(19px, calc( 26 / var(--inner) * 100vw ), 26px); font-weight: 600; color: var(--color-primary);}
.sub3_3_2 .dec {margin-bottom:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px); font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); color: var(--color-body); line-height: 1.5;}