@charset "utf-8";
.desc p:not(:last-child) {margin-bottom: 0.875em;}
.bdrs50 {border-radius: 0 clamp(15px, calc( 50 / var(--inner) * 100vw ), 50px); overflow: hidden;}

.greetings .img {width: 46.66667%; margin-right: clamp(35px, calc( 80 / var(--inner) * 100vw ), 80px);}
.greetings h2 {font-size: clamp(20px, calc( 32 / var(--inner) * 100vw ), 32px); line-height: 1.25em; margin-bottom: clamp(15px, calc( 22 / var(--inner) * 100vw ), 22px);}
.greetings .sign {margin-top: 1.75em;}
.greetings .sign .name {font-size: clamp(15px, calc( 17 / var(--inner) * 100vw ), 17px); margin-left: 10px;}
.direction-items {border-top: 2px solid #868686; margin-top: 40px;}
.direction-items .icon {width: 60px; height: 60px; border-radius: 100%; background: #efeff3;}
.direction-items .item {padding: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px) 0; gap: 30px; border-bottom: 1px solid #ddd;}
.subway-line {color: #fff; width: 45px; height: 20px; border-radius: 9px; font-size: clamp(13px, calc( 14 / var(--inner) * 100vw ), 14px); margin-right: 10px;}
.root_daum_roughmap, .root_daum_roughmap .wrap_map {width: 100% !important;}
.solution-menu {margin-bottom: clamp(35px, calc( 60 / var(--inner) * 100vw ), 60px); max-width: 1200px; margin-left: auto; margin-right: auto;}
.solution-menu ul {width: max-content; min-width: 100%; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.solution-menu li {position: relative; flex: 1 0 auto; width: auto;}
.solution-menu li:before {position: absolute; content: ''; height: var(--lnb-height); width: 1px; right: 0; background: #ddd;}
.solution-menu li:first-child:after {position: absolute; content: '';  top: 0; height: var(--lnb-height); width: 1px; left: 0; background: #ddd;}
.solution-menu a {display: flex; align-items: center; justify-content: center; height: var(--lnb-height); color: #333; font-weight: 500; font-size: 18px;}
.solution-menu li.active a {background: var(--primary-color); color: #fff;}

.deco-tit {position: relative; width: fit-content; margin-bottom:  clamp(20px, calc( 35 / var(--inner) * 100vw ), 35px); color: var(--dark-color); font-size: clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px); letter-spacing: -.02em;}
.deco-tit:before {position: absolute; content: ''; right: -12px; top: -6px; width: 7px; height: 7px; border-radius: 100%;}
.chk-list li {position: relative; padding-left: 33px;}
.chk-list li:not(:last-child) {margin-bottom: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px);}
.chk-list li:before {position: absolute; content: ''; left: 0; top: 4px; width: 20px; height: 19px; background: no-repeat center center; background-size: contain;}
.btn-inquiry {display: flex; align-items: center; justify-content: center; width: 170px; height: 50px; gap: 50px; margin: 0 auto; border-radius: 25px; border: 1px solid #ddd; color: #686868; font-size: clamp(15px, calc( 17 / var(--inner) * 100vw ), 17px); font-weight: 500;}
.btn-inquiry:hover {color: #fff;}
.btn-inquiry:hover .icon img {filter: brightness(10);}
.dot-list li {position: relative; padding-left: 7px;}
.dot-list li:before {position: absolute; content: '·'; left: 0; font-weight: 900;}
.db .sec-welcome .dot-list li:before {color: var(--primary-color);}

.solution .sec:not(:last-child) {margin-bottom: clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}
.sec-welcome .list-wrap {gap: 20px;}
.welcome-box {padding:clamp(20px, calc( 50 / var(--inner) * 100vw ), 500px); margin-bottom: clamp(20px, calc( 60 / var(--inner) * 100vw ), 60px);;}
.cert-logo {gap: 11px; max-width:30%; text-align: right;}
.welcome-logo {width: fit-content;}
.welcome-info-tit {padding: 4px 16px; margin-right: 19px; border-radius: 8px; color: #fff;}
.welcome-info-cnt span:not(:last-child) {position: relative; margin-right: 12px; padding-right: 11px;}
.welcome-info-cnt span:not(:last-child):before {position: absolute; content: ''; right: -1px; top: 50%; margin-top: -5px; width: 1px; height: 11px; background: #ddd;}
.sec-checklist .img {width: 46.66667%; margin-right: clamp(35px, calc( 80 / var(--inner) * 100vw ), 80px);}
.mid-txt {margin-bottom: clamp(20px, calc( 55 / var(--inner) * 100vw ), 55px); font-size: clamp(23px, calc(34 / var(--inner) * 100vw ), 34px); color: var(--dark-color); line-height: 1.3em; font-weight: 600;}
.sec-function .imgs {gap: clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px)}
.access .sec-function .imgs {flex-wrap: wrap;}
.access .sec-function .imgs .img {position: relative;}
.access .sec-function .imgs .img:after {position: absolute; content: ''; top: 0;right: 0; bottom: 0; left: 0; border: 1px solid #ddd;}
.function-items {flex-wrap: wrap; gap: clamp(20px, calc( 60 / var(--inner) * 100vw ), 60px) 0;}
.function-item {display: flex; align-items: center; gap: clamp(12px, calc( 30 / var(--inner) * 100vw ), 30px); width: 50%; padding-right: 20px;}
.dlp .function-item, .db .function-item {align-items:flex-start;}
.function-item .icon {display: flex; align-items: center; justify-content: center; width: 90px; height: 90px; border-radius: 15px; box-shadow: 3px 3px 8px rgba(0,0,0,.15)}
.function-item .txt {flex:1;}
.function-item h3, .difference-item h3 {margin-bottom: 6px; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); color: var(--dark-color);}
.function-item h3 span {display: inline-block; padding: 0 8px; margin-left: 10px; background: var(--printout-color); border-radius: 11px; line-height: 1.375em; font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); color: #fff; font-weight: 400;}
.difference-items {display: flex; gap:clamp(10px, calc( 30 / var(--inner) * 100vw ), 30px); text-align: center;}
.difference-item {flex:1; padding: clamp(20px, calc( 45 / var(--inner) * 100vw ), 45px) 15px clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px); border-radius: 20px; border: 1px solid #ddd;}
.difference-item .icon {margin-bottom: clamp(8px, calc( 15 / var(--inner) * 100vw ), 15px);}
.tech-items, .field-items, .need-items {gap: 30px;}
.tech-items .item {flex: 1; position: relative;}
.tech-items .item:after {position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid #ddd;}
.field-items .item {display: flex; align-items: center; justify-content: center; flex: 1; height: 100px; background: #f8f8f8; font-weight: 500; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px);}
.effect-item {gap: clamp(30px, calc( 120 / var(--inner) * 100vw ), 120px); font-weight: 500; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px);}
.effect-item:nth-child(even) {flex-direction: row-reverse;}
.effect-item:not(:last-child) {margin-bottom: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.effect-item .img {width: 48.75%;}
.need-item {flex: 1;  display: flex; align-items:center; padding: clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px); box-shadow: 3px 3px 10px rgba(0,0,0,.08)}
.need-item .txt {flex: 1; padding-right: 20px;}
.field-item {flex: 1; display: flex; align-items: center; padding: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px) 0; border-radius: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); box-shadow: 3px 3px 10px rgba(0,0,0,.08);}
.field-item .photo {text-align: center; width: 50%; padding: 15px; border-right: 1px solid #ddd;}
.field-item h3 {font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 500; color: var(--dark-color);}
.field-item .dot-list {flex: 1; padding-left: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); padding-right: 15px;}
.sec-start {position: relative; padding: clamp(35px, calc( 77 / var(--inner) * 100vw ), 77px) 0;}
.sec-start:before {position: absolute; content: '';	left: 0; top: 0; bottom: 0; width: calc(50% + 600px); background: #f8f8f8; z-index: -1; border-radius: 0 180px 180px 0;}
.sec-start .contain {align-items: center;}
.sec-start .txt {flex: 1;}
.sec-start .img {width: 33.33335%; padding-right: clamp(35px, calc( 192 / var(--inner) * 100vw ), 192px);}
.sec-start .num {margin-bottom: clamp(8px, calc( 15 / var(--inner) * 100vw ), 15px);text-decoration: underline; text-underline-offset: 4px; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 700;}
.sec-start h2 {margin-bottom: clamp(12px, calc( 25 / var(--inner) * 100vw ), 25px);font-size: clamp(23px, calc( 36 / var(--inner) * 100vw ), 36px); color: var(--dark-color);}
.support-items {flex-wrap: wrap; gap: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px) 10px;}
.support-item {flex: 1 1 auto; padding: 5px 19px; background: #f8f8f8; border-radius: 16px; box-shadow: 3px 3px 3px rgba(0,0,0,.07); text-align: center;}

.drm .deco-tit:before, .drm .function-item .icon {background: var(--drm-color);}
.printout .deco-tit:before, .printout .function-item .icon {background: var(--printout-color);}
.privacy .deco-tit:before, .privacy .function-item .icon {background: var(--primary-color);}
.dlp .deco-tit:before, .dlp .function-item .icon {background: var(--dlp-color2);}
.access .deco-tit:before, .access .function-item .icon {background: var(--access-color);}
.drm .chk-list li:before {background-image: url('/images/sub/drm-chk.png');}
.printout .chk-list li:before {background-image: url('/images/sub/printout-chk.png');}
.privacy .chk-list li:before {background-image: url('/images/sub/privacy-chk.png');}
.drm .btn-inquiry:hover {background: var(--drm-color); border-color: var(--drm-color);}
.printout .btn-inquiry:hover {background: var(--printout-color); border-color: var(--printout-color);}
.privacy .btn-inquiry:hover {background: var(--primary-color); border-color: var(--primary-color);}
.access .btn-inquiry:hover {background: var(--access-color); border-color: var(--access-color);}

.dlp .sec-start .num {color: var(--dlp-color2);}

.networks {border-top: 2px solid #686868;}
.networks .sec {border-bottom: 2px solid #686868;}
.network-logo {width: 26.25%; background: #f8f8f8; padding: 15px;}
.network-items {padding-left: clamp(20px, calc( 60 / var(--inner) * 100vw ), 60px);}
.network-item {padding: clamp(12px, calc( 48 / var(--inner) * 100vw ), 48px) 0;}
.network-item:not(:last-child) {border-bottom: 1px dashed #ddd;}
.network-item h2 {margin-bottom: clamp(8px, calc( 12 / var(--inner) * 100vw ), 12px);color: var(--dark-color); font-size: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 600;}