
/* 웹스리퍼블릭 주필규 */

@media screen and (max-width:1500px) {
.menu_wrap ul#gnb {margin-left:0px;}
.menu_wrap .inner {width:100%;padding:0px 20px;}
.sub-visual .inner {width:100%;padding:0px 20px;}
.conArea .inner {width:100%;padding:0px 20px 50px;}
.conArea .leftArea {width:30%;}
.conArea .leftArea.leftmenu {margin-left:0px;}
.conArea .leftArea.leftmenu > div > ul > li > a:before {left:-30px;}
.conArea .rightArea {width:70%;}

.panel-market {width:100%;margin-left:0px;left:0px;padding:0px 20px;}
}

@media screen and (max-width:1400px) {
}

@media screen and (max-width:1280px) {

.sub-visual {width:100%;height:400px;background:url('/theme/uws/images/custom/sub_visual.jpg') no-repeat top center;background-size:cover;}
.sub-visual .inner h1 {font-size:30px;padding-top:250px;}
.menu_wrap {width:100%;}
.menu_wrap a {font-size:16px;padding:35px 0px;}
.menu_wrap ul#gnb li { float:left; margin-right:30px; }

.publ .box .iconArea .imgArea > img {width:100%;}*/

/*.panel-market .imgArea > img {width:100%;}*/


 메인섹션추가 2023-04-25 */
.yellow {color:#ffc000 !important;}
.orange {color:#ff8000 !important;}
/* 메인페이지 - 레이어 모달 */
#pf-layer-veneta .content {top:0px; left:0px; width:100%; height:100%; margin:0px 0 0 0px; padding:0px 0px 0;}
#pf-layer-veneta .btn-close {right:auto;left:0px;; }
.pop-inner .pop-visual {background:url("../images/custom/pop-visual-bg1.jpg") no-repeat center top;background-size:cover;}



}

@media screen and (max-width:1024px) {
/*기존 스타일 반응형*/
.sitemaps1 .list li a {font-size:15px;}
.add-menu h2 {font-size:20px;}

.menu_wrap ul#gnb {display:none;}
.sub-visual {background:;height:auto;position:relative;}
.sub-visual.data {height:auto;}
.sub-visual.security {height:auto;}
.sub-visual.compliance {height:auto;}
.sub-visual.company {height:auto;}
.sub-visual.blockchain {height:auto;}
.sub-visual.ir {height:auto;}
.sub-visual.contact {height:auto;}
.sub-visual .inner h1 {font-size:22px;padding-top:0px;position:relative;width:100%;text-align:center;padding:50px 0px;}
.conArea .leftArea {width:100%;}
.conArea .leftArea.leftmenu {margin-left:0px;padding:0px 20px;font-size:0px;margin-top:0px;z-index:9;position:fixed;top:auto;bottom:20px;left:0px;}
.conArea .leftArea.leftmenu > div {width:50%;display:inline-block;margin-bottom:0px;border:solid 1px #ccc;margin-left:-1px;margin-top:-1px;padding:10px;text-align:center;background:#fff;vertical-align:top;}
.conArea .leftArea.leftmenu > div > a {font-size:13px;margin-bottom:0px;}
.conArea .leftArea.leftmenu > div > a.fontsmall {font-size:12px;line-height:1.3;}
.conArea .leftArea.leftmenu > div > ul {display:none;}
.conArea .leftArea.leftmenu > div > ul > li > a:before {left:-30px;}
.conArea .rightArea {width:100%;}

.publ > div {padding:20px 0px;}
.publ .title h1 {color:#262626;font-size:22px;font-weight:bold;}
.publ .conArea {margin-top:20px;}
.publ .conArea h2 {font-size:18px;}
.publ .conArea p {font-size:14px;}
.publ .box .txtArea {margin-top:20px;padding:20px;font-size:14px;text-align:center;}
.publ .box .iconArea > div > span {width:50%;margin-bottom:10px;}
.publ .box .iconArea > div.five > span {width:50%;margin-bottom:10px;}
/*.publ .box .iconArea > div.five > span:not(:last-child):before {content:'\e940';position:absolute;right:0px;top:30px;font-family:'xeicon';font-size:20px;color:#000;}
*/
.publ .box .iconArea > div > span.imgtwo {width:100%;}
.publ .box .iconArea > div > span.imgtwo.sec > img {width:100%;}
.publ .box .iconArea > div > span p {font-size:15px;}
.publ .box .iconArea > div.sfont > span p {font-size:13px;}
.publ .box .iconArea .txtplus {padding:30px 0px;}
.publ .box .iconArea .imgArea {padding:30px 0px;}
.publ .box .iconArea .logoArea {padding:20px 0px;}

.publ .box .specArea {margin-top:20px;padding:20px 0px;font-size:18px;}
.publ .box .specArea .listArea {margin-bottom:30px}
.publ .box .specArea .listArea .subj {width:100%;font-size:18px;margin-bottom:20px;}
.publ .box .specArea .listArea .num {width:100%;font-size:14px;}
.publ .box .specArea .listArea .num span > img {width:100%;}
.publ .box .specArea .listArea .num p {display:inline-block;margin-bottom:5px;color:#262626;}
.publ .box .specArea .listArea .number span {width:100%;display:inline-block;margin-bottom:15px;}
.publ .box .specArea .listArea .number3 {font-size:0px;}
.publ .box .specArea .listArea .number3 span {width:100%;margin-right:0px;margin-bottom:10px;}
.publ .box .specArea .listArea .number3 span p {display:block;vertical-align:middle;text-align:center;height:90px;width:100%;margin:0px auto;font-size:16px;padding-top:25px;}
.publ .box .specArea .listArea .number3 span p.sec {padding-top:35px;}
.publ .box .specArea .listArea .number3 span p.thir {padding-top:15px;}
.publ .box .specArea .listArea .number3 span:last-child {margin-right:0px;}

.publ .box .iconArea > div.txtmun {padding:30px 0px;}
.publ .box .iconArea > div.txtmun > h1 {font-size:16px;line-height:1.5;}
.publ .box .iconArea > div.txtmun > span {width:100%;font-size:14px;}
.publ .box .iconArea > div.txtList {position:relative;margin-bottom:10px;}
.publ .box .iconArea > div.txtList > div {width:100%;margin-right:0px;padding:0px 20px;margin-bottom:30px;}
.publ .box .iconArea > div.txtList > div:last-child {margin-right:0px;}
.publ .box .iconArea > div.txtList .litArea {}
.publ .box .iconArea > div.txtList .litArea h1 {font-size:16px;}
.publ .box .iconArea > div.txtList .litArea h1 > img {top:-5px;width:30px;}
.publ .box .iconArea > div.txtList .litArea p {font-size:13px;}
.publ .box .iconArea > div.txtList .litArea a {text-align:left;}
.publ .box .iconArea > div.btnArea {margin-top:0px;}
.publ .box .iconArea > div.btnArea a {font-size:12px;border:solid 1px #ccc;color:#262626;padding:5px 10px;transition:all .3s ease;}

.publ .box .iconArea > div.txtList.four > div {width:100%;margin-right:0px;}
.publ .box .iconArea > div.txtList.four > div:nth-child(even) {margin-right:0px;}
.publ .box .iconArea > div.txtList.children .litArea h1 > span {display:block;font-size:16px;}
.publ .box .iconArea > div.txtList.children .litArea h1 > img {position:absolute;left:0px;top:7px;width:30px;}


.publ .title.nomen {margin-bottom:10px;}
.publ .title.nomen.first > span {position:absolute;right:128px;top:2px;}
.publ .title.nomen > span a {padding:5px 10px;display:block;font-size:12px;}
.publ .table {margin-bottom:50px;}
.publ .table.last {margin-bottom:250px;}
.publ .table .txtArea {font-size:14px;margin:10px 0px;}
.publ .table .txtArea > h1 {font-size:14px;}
.publ .table .txtArea > span {position:absolute;right:0px;top:-35px;}
.publ .table .txtArea > span a {padding:5px 10px;display:block;font-size:12px;line-height:1.3;}
.publ .table .tblArea {position:relative;}
.publ .table .tblArea .sujArea {border-bottom:solid 0px #ddd;font-size:0px;}
.publ .table .tblArea .sujArea > span {padding:12px;font-size:11px;width:10%;color:#525252;display:inline-block;text-align:center;vertical-align:top;}
.publ .table .tblArea .litArea.noti .sujArea > span {display:none;}
.publ .table .tblArea .litArea.info .tconArea ul li span p {display:block;}
.publ .table .tblArea .tconArea {border-bottom:solid 1px #ddd;width:100%;font-size:0px;}
.publ .table .tblArea .tconArea > span {padding:10px;font-size:14px;width:100%;text-align:left;margin-top:10px;}
.publ .table .tblArea .tconArea > span.num {margin-top:0px;}
.publ .table .tblArea .tconArea > span.subject {text-align:left;}
.publ .table .tblArea .tcontact p {font-size:12px;margin-top:10px;}
.publ .table .txtArea > span.dan {top:0px;}


.publ .table .tblArea .litArea.jemu .tconArea > span {font-size:12px}

.publ .table .tblArea .litArea.noti .tconArea ul li {width:100%;font-size:14px;}
.publ .table .tblArea .litArea.noti .tconArea ul li a {width:100%;font-size:14px;padding:5px;padding-top:30px;}
.publ .table .tblArea .litArea.noti .tconArea ul li span {width:100%;font-size:14px;color:#666;display:inline-block;text-align:left;padding:5px;}
.publ .table .tblArea .litArea.noti .tconArea ul li span:first-child {padding-top:30px;}
.publ .table .tblArea .litArea.noti .tconArea ul li span:last-child {padding-bottom:30px;}

.publ .table .tblArea .litArea.info .tconArea ul li a {width:100%;font-size:14px;padding:0px;}
.publ .table .tblArea .litArea.info .tconArea ul li span {width:100%;font-size:14px;color:#666;display:inline-block;text-align:left;padding:5px;}
.publ .table .tblArea .litArea.info .tconArea ul li span.subj {width:100%}




/* contact */
.contant-table {margin-top:20px;padding-bottom:20px;}
.line-table {height:1px;width:100%;background:#e6eeef;margin:30px 0px 10px;}
.contant-table .contact-list-name {width:100%;font-size:16px;padding-top:22px;padding-left:0px;}
.contant-table .contact-list-name .circle-title::before {display:none;}
.contant-table .contact-list-item {width:100%;}
.contact-list-history {width:100%;font-size:14px;margin-bottom:10px;}
.contact-list-contact span i {display:inline-block;width:20px;height:20px;margin-right:0px;font-size:12px;padding-top:4px;}
.contact-list-contact {width:50%;font-size:14px;}

.contact-list-map {width:100%;margin-top:30px;margin-bottom:30px;}
.contact-list-map .mapsize {width:100%;height:200px;}
.contact-list-info {width:100%;font-size:14px;margin-top:0px;padding-left:0px;}
.contact-list-info strong {font-size:16px;}
.contact-list-info span {margin-top:10px;}


/* 컴퍼니추가 */
.company-page {position:relative;}
.company-page .publ > div {padding-bottom:100px;}
.company-page .publ .title.nomen {margin-top:30px;}
.company-page .add-ceo {margin-left:0px;}
.company-page .wps33-lg {margin-right:0px;width:100%;margin-bottom:10px;}
.company-page .fs18-lg {font-size:16px;}
.company-page ul.mts10 > li{line-height: 2;font-size:13px;}
.company-page ul.mts10 > li:before{content:'';top:1.1em;}
.company-page .fs14-lg {font-size:13px;}
.company-page .pts3-lg {padding-top:2px;}
.company-page .mts5-not-first > *:not(:first-child) {margin-top:10px;}

.mbtop50 {margin-top:50px;}
.addmopeople {display:block !important;width:100%;}
.addmopeo {display:block;width:100%;text-align:left;margin-bottom:10px;}
.addmople {display:block;width:100%;}




/* 메인섹션추가 2023-04-25 */
/* 메인페이지 - 레이어 모달 */
#pf-layer-veneta .btn-close {position:absolute; top:0px; right:0px; width:30px; height:30px; border:0px solid #d0d0d0; background:#fff; cursor:pointer; outline:none;z-index:1;}
#pf-layer-veneta .btn-close span {position:absolute; display:block; top:50%; left:45%; width:20px; height:2px; margin:-1px 0 0 -10px; background:#d0d0d0}
#pf-layer-veneta .content .inner {height:660px; overflow-y:auto}
#pf-layer-veneta .content .inner img {display:block; max-width:100%; margin:auto}
#pf-layer-veneta .content .inner br {display:none;}

.pop-inner {position:relative;width:100%;}
.pop-inner .pop-visual {height:auto;font-size:25px;padding:100px 20px;word-break:keep-all;}
.pop-inner .pop-visual strong {}
.pop-inner .pop-section {padding:35px;font-size:0px;}
.pop-inner .pop-section .left {width:100%;text-align:center;}
.pop-inner .pop-section .left p {font-size:14px;margin-bottom:10px;word-break:keep-all;}
.pop-inner .pop-section .right {width:100%;position:relative;text-align:center;}
.pop-inner .pop-section .right p {font-size:14px;margin-bottom:10px;word-break:keep-all;}
.pop-inner .pop-section-first .pop-logo {background:#fff;padding:20px 15px;margin-top:20px;}
.pop-inner .pop-section-first .pop-logo > div {width:100%;font-size:15px;margin-bottom:20px;}
.pop-inner .pop-section-first .pop-logo > div img {margin-bottom:10px;}
.pop-inner .pop-section-first .etc {position:relative;right:auto;bottom:auto;font-size:12px;text-align:center;margin-top:10px;}

.pop-inner .pop-section-sec {}
.pop-inner .pop-section.pop-section-sec .left {width:100%;text-align:center;}
.pop-inner .pop-section.pop-section-sec .left img {margin-bottom:10px;}
.pop-inner .pop-section.pop-section-sec .left p {font-size:18px;}
.pop-inner .pop-section.pop-section-sec .left span {font-size:14px;}
.pop-inner .pop-section.pop-section-sec .right {width:100%;padding-top:20px;}
.pop-inner .pop-section.pop-section-sec .right p {font-size:14px;}
.pop-inner .pop-section.pop-section-sec .right p strong.line:before {top:5px;}

.pop-inner .pop-section.pop-section-third .left {width:100%;text-align:center;}
.pop-inner .pop-section.pop-section-third .left span {font-size:18px;margin-top:10px;}
.pop-inner .pop-section.pop-section-third .left span a {color:#00579f;font-size:13px;padding:12px 25px;}
.pop-inner .pop-section.pop-section-third .left span a:hover {background:none;color:#00579f;border-color:#00579f;}
.pop-inner .pop-section.pop-section-third .right {width:100%;margin-top:20px;}
.pop-inner .pop-section.pop-section-third .right img {width:60%;}

.pop-inner .pop-section.pop-section-fourth .left {margin-bottom:20px;}
.pop-inner .pop-section.pop-section-fourth .left img {width:100%;}

.pop-inner .pop-section .title {font-size:20px;}
.pop-inner .pop-section .pop-engine {margin:30px 0px;}
.pop-inner .pop-section .pop-engine img {width:100%;}
.pop-inner .pop-section .conArea {text-align:center;}
.pop-inner .pop-section .conArea p {font-size:14px;margin-bottom:20px;word-break:keep-all;}


/*.section .panel-market .textArea .imgArea > img {width:100%;margin-top:10px}

 .mobile-style {display:block !important;}
.pc-style {display:none !important;}

.add-mg-100 {margin-top:50px !important;}
*/

}

@media screen and (max-width: 992px) { /* breakpoint를 992px로 사용하시네요 */


/*#scrollTop {display:block;opacity:0; position:fixed; bottom:30px; right:-30px;  width:45px; height:45px; text-align:center; color:#fff; line-height:45px; border-radius:50%; background:#555; z-index:10;transition:all .3s ease;}
#scrollTop i {position:absolute; top:35%; left:35%; transition:all .4s ease}
#scrollTop span {position:absolute; width:100%; top:0; left:50%; font-weight:600; margin-left:-22px; line-height:45px; opacity:0; filter:alpha(opacity='0'); transform:rotate(-360deg); transition:all .4s ease}
#scrollTop.on i {opacity:0; filter:alpha(opacity='0'); transform:rotate(360deg)}
#scrollTop.on span {display:block; opacity:1; filter:alpha(opacity='100'); transform:rotate(0deg)}
body.fixed #scrollTop {right:10px;opacity:1;}*/

    .pages1 .sec-customer {
        background-image: url('../images/bg/customers1.jpg') !important; /* 새로운 모바일 배경 이미지 경로 */
        background-size: cover; /* 배경 이미지가 섹션을 꽉 채우도록 설정 */
        background-position: center center; /* 배경 이미지 중앙 정렬 */
    }



.sub-visual.ai {height:200px}
.sub-visual.quantum {height:200px}
    /* 여기에 992px 이하 화면에서 적용될 CSS 스타일을 작성하세요 */
    /* 예시: */
    body {
        font-size: 14px; /* 본문 글씨 크기 조정 */
    }
    .some-element {
        width: 100%; /* 특정 요소의 너비 조정 */
        float: none; /* 플로팅 해제 */
    }
	
    /* 로고와 텍스트를 감싸는 가장 바깥쪽 컨테이너 */
    .abs.ts0.ls0.wps100.hps100.dps.flex.center.cross-center {
        /* ★★★ 로고를 화면 정중앙에 위치시키기 위해 Flexbox 정렬 속성 변경 ★★★ */
        justify-content: center; /* 가로 정렬: 중앙 */
        align-items: center;     /* 세로 정렬: 중앙 */
        padding: 0;              /* 패딩 제거 (필요 시 조절) */
        box-sizing: border-box;
        /* position: fixed; bottom: 0; left: 0; 등의 속성은 중앙 정렬과 상충되므로 제거 */
    }

    /* 'cls-white t-acs' 클래스를 가진 내부 컨테이너 (로고를 담고 있음) */
    .cls-white.t-acs {
        text-align: center; /* 로고가 이미지이고, 부모가 flex item이므로 텍스트 정렬은 큰 영향 없음.
                                다만, 내부 텍스트가 생길 경우를 대비하여 중앙 정렬로 설정 */
        width: auto;     /* 내용에 따라 너비 자동 조절 */
        max-width: none; /* 혹시 데스크톱용 max-width가 있다면 해제 */
        /* 추가적인 마진/패딩 제거 또는 조절 */
    }

    /* H1 태그 내의 이미지 (로고) */
    .cls-white.t-acs h1.t-sdws1 {
        display: flex; /* 로고 이미지의 정렬을 위해 flex 유지 */
        flex-direction: row; /* 로고만 있으므로 row든 column이든 큰 영향 없음 */
        justify-content: center; /* 로고를 h1 내에서 수평 중앙 정렬 */
        align-items: center;     /* 로고를 h1 내에서 수직 중앙 정렬 */
        margin: 0; /* 모든 마진 제거하여 중앙 정렬에 방해되지 않도록 함 */
        padding: 0; /* 모든 패딩 제거 */
    }

    /* 로고 이미지 */
    .cls-white.t-acs h1.t-sdws1 img {
        /* ★★★ 모든 마진을 0으로 초기화하여 중앙 정렬에 방해되지 않도록 함 ★★★ */
        margin: 0 !important;
        max-width: 100px; /* 로고 크기 조절 (원하는 크기로 조정) */
        height: auto;
        vertical-align: middle;
    }

    /* 'Powering Information & Communication' 텍스트 */
    .cls-white.t-acs h1.t-sdws1 span {
        /* ★★★ 텍스트를 완전히 숨김 ★★★ */
        display: none !important;
        visibility: hidden; /* 혹시 모를 경우를 대비하여 추가 */
        width: 0;
        height: 0;
        overflow: hidden;
        margin: 0 !important;
        padding: 0 !important;
    }
    .panel {
        width: 100% !important; /* 패널의 너비를 뷰포트 너비의 100%로 설정 (전체 화면) */
        right: 0 !important;      /* 패널을 화면의 오른쪽 가장자리에 정렬 */
        left: 0 !important;       /* 패널을 화면의 왼쪽 가장자리에 정렬 (오른쪽과 함께 100%를 만듦) */
        height: 100% !important; /* 높이도 뷰포트 높이 100% (전체 화면 덮개) */
        top: 0 !important;        /* 상단에 정렬 */
    }
    .panel-left {
        width: 100% !important; /* 패널의 너비를 뷰포트 너비의 100%로 설정 (전체 화면) */
        right: 0 !important;      /* 패널을 화면의 오른쪽 가장자리에 정렬 */
        left: 0 !important;       /* 패널을 화면의 왼쪽 가장자리에 정렬 (오른쪽과 함께 100%를 만듦) */
        height: 100% !important; /* 높이도 뷰포트 높이 100% (전체 화면 덮개) */
        top: 0 !important;        /* 상단에 정렬 */
    }
    .krdc-veneta .panel-left .cls-white img {
        max-width: 120px !important; /* 이미지 최대 너비 조정 (예시: 180px, 필요에 따라 조절) */
        width: 100% !important; /* 부모 너비의 80%로 설정하여 유연하게 반응 */
        height: auto !important;     /* 이미지 비율 유지 */
        margin-bottom: 20px !important; /* 이미지 아래 여백 추가 */
        display: block !important;   /* 블록 요소로 설정하여 중앙 정렬 용이 */
        margin-left: auto !important; /* 중앙 정렬 */
        margin-right: auto !important;/* 중앙 정렬 */
    }
    .krdc-veneta .panel-left .cls-white h2 {
        font-size: 20px !important; /* 폰트 크기 조정 (예시: 24px, 필요에 따라 조절) */
        line-height: 1.4 !important; /* 줄 간격 조정 */
        margin-top: 0px !important;  /* 기존 mts10 클래스 무시 */
        margin-bottom: 15px !important; /* 아래 여백 추가 */
        margin-left: 5px !important; /* 아래 여백 추가 */
        text-align: left  !important; /* 텍스트 왼쪽 정렬 */
        word-break: keep-all !important; /* 단어가 잘리지 않도록 */
        hyphens: auto !important; /* 필요 시 하이픈 자동 추가 */
    }
    .krdc-veneta .panel-left .cls-white p {
        font-size: 15px !important; /* 폰트 크기 조정 (예시: 24px, 필요에 따라 조절) */
        line-height: 1.4 !important; /* 줄 간격 조정 */
        margin-top: 0px !important;  /* 기존 mts10 클래스 무시 */
        margin-bottom: 15px !important; /* 아래 여백 추가 */
        margin-left: 5px !important; /* 아래 여백 추가 */
        text-align: left  !important; /* 텍스트 왼쪽 정렬 */
        word-break: keep-all !important; /* 단어가 잘리지 않도록 */
        hyphens: auto !important; /* 필요 시 하이픈 자동 추가 */
    }
    /* 각 li 항목의 간격 및 내부 여백 조정 */
    .sec-service .list li {
        padding: 5px !important; /* 상하 20px, 좌우 10px 패딩으로 항목 크기 조절 */
        flex-basis: 50% !important; /* 한 줄에 2개씩 배치되도록 설정 (필요 시 조절) */
        max-width: 100% !important; /* 최대 너비도 100%로 제한 */
        margin: 0px !important; /* 각 li 항목 주변에 작은 마진 추가 */
        box-sizing: border-box !important;
        min-height: auto !important; /* **min-height를 auto로 변경하여 내용물 높이에 맞춤** */

		
        display: flex !important;
        flex-direction: row !important; /* 아이콘 박스와 버튼 영역을 가로로 정렬 */
        justify-content: space-between !important; /* 아이콘 박스와 버튼을 양 끝으로 분리 */
        align-items: center !important; /* 세로 중앙 정렬 */
        flex-wrap: wrap !important; /* 내용이 길어지면 줄바꿈 허용 */
    }
    .sec-service {
        min-height: auto !important; /* Allow the section height to be flexible */
        padding: 0px 0 !important; /* Add top/bottom padding to the section */
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important; /* Vertically center the content */
        align-items: center !important; /* Horizontally center the content block */
        padding-top: 0px !important; /* Ensures top spacing */
        padding-bottom: 0px !important; /* Ensures bottom spacing */
    }
    .sec-service .list {
        justify-content: center !important; /* Centers list items horizontally */
        margin: 0 auto !important; /* Centers the entire list block */
        padding-top: 0px !important; /* Ensures top spacing */
        padding-bottom: 0px !important; /* Ensures bottom spacing */
    }
   .sec-service .list li .icon-box {
        display: flex !important; /* icon-box 내부를 flex로 만들어 이미지와 텍스트를 세로 정렬 */
        flex-direction: column !important;
        align-items: center !important; /* 아이콘과 텍스트 중앙 정렬 */
        justify-content: center !important;
        flex-grow: 1 !important; /* 남은 공간을 채우도록 성장 */
        flex-shrink: 0 !important;
        flex-basis: auto !important; /* 초기 크기 자동 조정 */
        min-width: 45px !important; /* 최소 너비 정의 */
        /* width: 60%; */ /* 필요 시 icon-box의 너비 고정 (예: 60%) */
        text-align: center !important; /* 내부 텍스트 정렬 */
        margin-right: 0px !important; /* 버튼 영역과의 간격 */
        padding-left: 0px !important; /* **핵심 변경: 왼쪽에 10px 패딩을 추가하여 내용물을 오른쪽으로 10px 이동** */
    }
    .sec-service .list li .icon-box img {
        width: 35px !important; /* 이미지 너비를 40px로 고정 */
        height: 35px !important; /* 이미지 높이를 40px로 고정 (정사각형으로 만들 경우) */
        /* height: auto !important; */ /* 비율 유지하고 싶다면 height: auto 사용 */
        object-fit: contain !important; /* 이미지가 잘리지 않고 영역에 맞춰지도록 */
        margin-bottom: 3px !important; /* 아이콘 아래 여백을 줄여 이미지와 텍스트 간격 조정 */
    }
    /* 아이콘 텍스트 (.icon-box p) 폰트 사이즈 및 이미지-텍스트 간격 조절 */
    .sec-service .list li .icon-box p {
        font-size: 14px !important; /* 폰트 크기 더 줄임 */
        line-height: 1.2 !important; /* 줄 간격도 더 줄임 */		
        margin-top: 0px !important; /* 텍스트 위 여백을 제거하여 이미지와 텍스트 간격 조정 */
        word-break: keep-all !important;
        text-align: center !important;
    }
    /* 모바일에서 btn-area 숨기기 */
    .sec-service .list li .btn-area {
        display: none !important;
    }

    /* View 버튼 영역의 정렬 및 크기 조절 */
/*    .sec-service .list li .btn-area {
        margin-left: 0px !important;
        margin-top: 0px !important;
        text-align: right !important;
        flex-grow: 0 !important;
        flex-shrink: 0 !important;
        flex-basis: auto !important;
        min-width: 50px !important; /* 버튼 영역 최소 너비 50px로 더 줄임 */
/*        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        padding-right: 120px !important; /* **핵심: 오른쪽에 10px 여백 추가** */
/*    }
 /*  .sec-service .list li .btn-area button {
 /*       height: 23px !important; /* 버튼 높이 조절 */
 /*       padding: 0px 10px !important; /* 버튼 내부 패딩 조절 */
 /*       font-size: 10px !important; /* 버튼 폰트 크기 조절 */
 /*       line-height: 23px !important; /* 버튼 높이에 맞게 라인 높이 조절 */
 /*       float: none !important; /* 혹시 모를 float 속성 제거 */
 /*   }
    /* li 내부의 img (cloud.jpg, data_service.jpg 등 배경 이미지) 스타일 */
    .sec-service .list li > img.img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        z-index: 1 !important;
    }	
    .sec-service .list li br {
        display: none !important;
    }
    /* panel-market 내부의 textArea 위치 조정 */
    .section.market-place .panel-market .textArea {
        margin-top: 50px; /* 위로 50px 올림. 필요에 따라 값 조정 */
        /* 또는 padding-top을 줄일 수도 있습니다 (만약 원래 padding이 크다면) */
        /* padding-top: 20px; */
    }

    .section.market-place .textArea .imgArea img {
        width: 150px; /* 모바일에서 원하는 너비로 조절 (예: 150px) */
        height: auto; /* 높이 자동 조절 */
        /* max-width: 100%; 와 display: block; margin: 0 auto; 는 PC 설정과 동일하게 유지해도 됨 */
    }

    .section.market-place .textArea p {
		font-size: 14px !important; /* 폰트 크기 더 줄임 */
    }

	.panel-market .textArea {
		width:100%;display:inline-block;vertical-align:top;margin-bottom:50px;text-align:center;
	}
	.section .panel-market .textArea .btn-veneta {
		margin-top:20px;
	}
	
    /* 폰트 크기 조정 */
    /* '협력사 및 파트너사' (h3) 및 '주요 고객사' (h2) 제목 */
    .section.sec-customer .ps50 h3 {
		font-size: 30px; 
	}
    .section.sec-customer > h2 {
        font-size: 20px; /* 모바일용 크기로 조절 (예시) */
        /* margin-top 값도 모바일에 맞춰 조절할 수 있습니다. */
        margin-top: 40px !important; /* HTML 인라인 스타일 덮어쓰기 위해 !important 사용 */
    }

    /* '인프라', '보안', '데이터 & AI' (h2) 제목 */
    .category-group h2 {
        font-size: 20px; /* 모바일용 크기로 조절 (예시) */
    }

    /* 이미지 크기 조정 */
    /* 모든 로고 이미지를 감싸는 .ps5-10 div의 너비와 마진 조절 */
    .section.sec-customer .ps5-10 {
        width: 50% !important; /* 한 줄에 2개씩 나오도록 (25% x 4 = 100%) */
        padding-top:10px !important;
		padding-bottom:10px !important;
		padding-left:15px !important;
		padding-right:15px !important;
		/*padding: 5px !important; /* 모바일에서 간격 조절 */
        box-sizing: border-box; /* 패딩 포함 너비 계산 */
    }

    /* .ps5-10 내부의 img 태그 크기 조절 */
    .section.sec-customer .ps5-10 img {
        width: 100% !important; /* 부모 div에 꽉 차게 */
        height: auto !important; /* 비율 유지 */
        max-width: 80px; /* 이미지가 너무 커지지 않도록 최대 너비 제한 (예시) */
        display: block; /* 가운데 정렬을 위해 블록 요소로 변경 */
        margin: 0 auto; /* 가운데 정렬 */
	}
    /* ==== 로고만 특별히 크기 조절 ==== */
    .section.sec-customer .ps5-10 img[src*="/images/logo/ibm.png"] {
        width: 50% !important; /* 부모 div에 맞춰 유동적으로 */
        height: auto !important; /* 비율 유지 */
        max-width: 50px; /* IBM 로고만 더 작게 조절할 너비 (예시: 50px) */
    }


/*}*/

.veneta {font-size:40px;font-weight:lighter;}

.pages1 .panel {width:30%;}
.pages1 .panel-left {width:35%;}
.fs52 {font-size:30px;}
.fs16 {font-size:14px;}


.panel-market {position:absolute;top:10%;display:block;}
.panel-market .textArea {width:100%;display:inline-block;vertical-align:top;margin-bottom:55px;text-align:center;}
.panel-market .textArea h1 {font-size:30px;text-align:center;}
.panel-market .textArea span {font-size:15px;text-align:center;}
.panel-market .textArea p {font-size:16px;margin-top:20px;text-align:center;}
.panel-market .textArea .btn-veneta {margin-top:20px;}
.panel-market .textArea .btn-veneta a {color:#fff;transition:all .4s ease}
.panel-market .textArea .btn-veneta:hover {background:#fff;}
.panel-market .textArea .btn-veneta:hover a {color:#000;}
.panel-market .imgArea {width:100%;display:inline-block;vertical-align:top;margin-top:0px !important;}
.panel-market .imgArea > img {width:100%;}
.panel-market .textArea .imgArea > img {width:20%;margin-top:10px}

.pages1 .sec-service .btn-area {opacity:1;}

.pages1 .sec-service .list li:hover .img{opacity:1;transform: scale(1.1);}
.pages1 .sec-service .list li:hover .icon-box{	transform:translate3d(0, 0px, 0);}
.pages1 .sec-service .list li:hover .btn-area{ opacity: 1; }
.pages1 .sec-service .icon-box > img {width:68px;}
.pages1 .sec-service .icon-box{	transform:translate3d(0, 22px, 0);}
.pages1 .sec-service .btn-area{ transform:translate3d(0, 10px, 0);}

.customers {top:5%;}
.customers > div > div > img {height:20px;width:auto;}
.headers1 .btn-market {height:auto;}
.headers1 .btn-market a {font-size:11px;}
.headers1 .btn-lang {height:auto;}
.headers1 .btn-lang a {font-size:11px;}





}

@media screen and (max-width:640px) {
}

@media screen and (max-width:468px) {
}