@charset "utf-8";

@import url("font.css");
@import url("common.css");
@import url("supplier-registration.css");

/* ===========================================
    Tab Menu
=========================================== */
.tab-menu {
    display: flex;
    border-bottom: 2px solid #e0e0e0;
    margin-bottom: 20px;
}

.tab-btn {
    padding: 12px 24px;
    background: none;
    border: none;
    font-size: 16px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: all 0.3s ease;
}

.tab-btn:hover {
    color: #333;
    background-color: #f8f8f8;
}

.tab-btn.active {
    color: var(--c-primary);
    border-bottom-color: var(--c-primary);
    background-color: #fff;
}

/* ===========================================
    Statistics Cards
=========================================== */
.statistics-container {
    padding: 20px;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.stat-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease;
}

.stat-card:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.stat-card h3 {
    margin: 0 0 15px 0;
    font-size: 18px;
    font-weight: 700;
    color: #333;
    border-bottom: 2px solid var(--c-primary);
    padding-bottom: 8px;
}

.stat-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
}

.stat-item:last-child {
    border-bottom: none;
}

.stat-item .label {
    font-size: 14px;
    color: #666;
    font-weight: 500;
}

.stat-item .value {
    font-size: 16px;
    font-weight: 700;
    color: #333;
}

.stat-item .value.approved {
    color: #28a745;
}

.stat-item .value.rejected {
    color: #dc3545;
}

/* Status colors */
.status.approved {
    color: #28a745;
}

.status.rejected {
    color: #dc3545;
}

.status.pending {
    color: #ffc107;
}

.status.paid {
    color: #17a2b8;
}

body{min-width: var(--min-width);}
.inner-wrap{width: var(--min-width);margin:0 auto;position:relative;}

.wrap{min-height: 100%;display:flex;flex-direction: column;}
.header {position:fixed;width: 100%;min-width: var(--min-width); height: 112px; top:0;  border-bottom:1px solid rgba(255, 255, 255, 0.2);z-index: 100;transition: width 0.5s ease;}
.header .inner-wrap{width:1800px;max-width: 100%; margin:0 auto; height: 100%;display: flex; align-items: center;justify-content: center;color: #fff;}
.header h1{position:absolute;top:50%;left:60px;transform:translateY(-50%);}
.header h1 .logo{display:block;width:226px;height:50px;background:url('../images/logo.svg') no-repeat 0 0;background-size:auto 100%;}
.header .right{position:absolute;top:50%;right:60px;transform:translateY(-50%);display: flex; align-items: center; gap:16px;}
.header .right [class*=btn-]{padding:0 10px;font-size:16px;font-weight:600;}
.header .right .btn-total{width:40px;height:40px;background: url("data:image/svg+xml,%3Csvg width='27' height='26' viewBox='0 0 27 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='2.5' cy='3' r='2.5' fill='white'/%3E%3Ccircle cx='2.5' cy='13' r='2.5' fill='white'/%3E%3Ccircle cx='2.5' cy='23' r='2.5' fill='white'/%3E%3Ccircle cx='13.5' cy='3' r='2.5' fill='white'/%3E%3Ccircle cx='13.5' cy='13' r='2.5' fill='white'/%3E%3Ccircle cx='13.5' cy='23' r='2.5' fill='white'/%3E%3Ccircle cx='24.5' cy='3' r='2.5' fill='white'/%3E%3Ccircle cx='24.5' cy='13' r='2.5' fill='white'/%3E%3Ccircle cx='24.5' cy='23' r='2.5' fill='white'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size: 27px 26px;}
.header .gnb{position:relative;height:100%;}
.header .gnb-nav{height:100%;}
.header .gnb-nav .gnb-dim{content:'';display:none;height:calc(100vh - 112px);position:fixed;top:112px;left:0;width:100%;background:rgba(0,0,0,0.5);}
.header .gnb-nav .gnb { display: flex;}
.header .gnb-nav .gnb > li { position: relative;width:auto;}
.header .gnb-nav .gnb > li > a {height:100%;display:flex;justify-content:center;align-items:center; font-weight: 700; font-size:20px;padding:0 30px;/*transition: width 0.8s ease, padding 0.8s ease;*/white-space: nowrap;}
.header .gnb-nav .gnb > li.on > a,
.header .gnb-nav .gnb > li > a:focus,
.header .gnb-nav .gnb > li > a:hover{ color:var(--c-primary);}
.header.on .gnb-nav .gnb > li > a{width:176px;padding:0 0;}
.header .gnb-nav .gnb-sub{position:fixed;top:112px;left:0;color:#1D1D1D;width:100%;min-width: var(--min-width);}
.header .gnb-nav .gnb-sub {display:none; background:#fff;}
.header .gnb-nav .gnb-sub  > ul{display:flex; align-items:stretch;justify-content: center; position:relative; background:#fff;font-weight:700;font-size:16px; color:#666;}
.header .gnb-nav .gnb-sub  > ul > li{padding:30px 10px;width:176px;border-left:1px solid #ddd;}
.header .gnb-nav .gnb-sub  > ul > li:hover{background:#F8F8F8;}
.header .gnb-nav .gnb-sub  > ul > li:last-child{border-right:1px solid #ddd;}
.header .gnb-nav .gnb-sub  > ul > li ul{display:flex;flex-direction: column;gap:10px;}
.header .gnb-nav .gnb-sub  > ul > li ul li a{display:block;padding:5px;text-align:center;}

.total-menu-wrap{display:none; position:fixed;top:0;left:0;width:100%; color:#1D1D1D;width:100%;;z-index: 100;background:#fff;}
.total-menu-wrap .dim{position:fixed;top:0;left:0;width:100%;height:100%; background:rgba(0, 0, 0, 0.4);}
.total-menu-wrap .inner-wrap{width:100%;max-width: 100%;background:#fff;min-width: var(--min-width);}
.total-menu-wrap .total-menu-header{height:112px;display:flex;align-items:center;padding:0 60px;width:1800px;max-width: 100%;margin:0 auto;}
.total-menu-wrap .total-menu-header .logo{display:block;width:226px;height:50px;background:url('../images/logo2.svg') no-repeat 0 0;background-size:auto 100%;}
.total-menu-wrap .total-menu-header .btn-close{margin-left:auto; width:40px;height:40px;background: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 2L26 26' stroke='%23444444' stroke-width='3'/%3E%3Cpath d='M26 2L2 26' stroke='%23444444' stroke-width='3'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size: 28px 28px;}
.total-menu-wrap .total-menu-body{min-height: 800px;padding:60px;width:1800px;max-width: 100%;margin:0 auto;}
.total-menu-wrap .total-menu-body > ul {display:flex;align-items:stretch;justify-content: center;border-left:1px solid #ddd;}
.total-menu-wrap .total-menu-body > ul > li {flex:1;padding:0 30px;border-right:1px solid #ddd;padding-bottom:50px;}
.total-menu-wrap .total-menu-body > ul > li .tit {display:flex;justify-content:center;align-items:center;height: 72px;background: #F2F2F2;font-weight:700;font-size:28px; color:#333;}
.total-menu-wrap .total-menu-body > ul > li ul {margin-top:30px;}
.total-menu-wrap .total-menu-body > ul > li ul li a {display:block;padding:12px 8px;font-size:20px;font-weight:500; color:#666666;text-align:center;}
.total-menu-wrap .total-menu-body > ul > li:hover .tit{background: linear-gradient(90deg, #EF353D 0%, #F9884E 100%); color:#fff;}
.total-menu-wrap .total-menu-body > ul > li ul li a:hover{ color:var(--c-primary);}


.header.on {background-color: #fff;border-bottom:1px solid #DDDDDD;}
.header.on h1 .logo{background-image: url('../images/logo2.svg');}
.header.on .gnb{ color:#333333;}
.header.on .right [class*=btn-]{ color:#444;}
.header.on .right .btn-total{background-image: url("data:image/svg+xml,%3Csvg width='27' height='26' viewBox='0 0 27 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='2.5' cy='3' r='2.5' fill='%23444444'/%3E%3Ccircle cx='2.5' cy='13' r='2.5' fill='%23444444'/%3E%3Ccircle cx='2.5' cy='23' r='2.5' fill='%23444444'/%3E%3Ccircle cx='13.5' cy='3' r='2.5' fill='%23444444'/%3E%3Ccircle cx='13.5' cy='13' r='2.5' fill='%23444444'/%3E%3Ccircle cx='13.5' cy='23' r='2.5' fill='%23444444'/%3E%3Ccircle cx='24.5' cy='3' r='2.5' fill='%23444444'/%3E%3Ccircle cx='24.5' cy='13' r='2.5' fill='%23444444'/%3E%3Ccircle cx='24.5' cy='23' r='2.5' fill='%23444444'/%3E%3C/svg%3E%0A");}

body.scrolling .header {background-color: #fff;border-bottom:1px solid #DDDDDD;}
body.scrolling .header h1 .logo{background-image: url('../images/logo2.svg');}
body.scrolling .header .gnb{ color:#333333;}
body.scrolling .header .right [class*=btn-]{ color:#444;}
body.scrolling .header .right .btn-total{background-image: url("data:image/svg+xml,%3Csvg width='27' height='26' viewBox='0 0 27 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='2.5' cy='3' r='2.5' fill='%23444444'/%3E%3Ccircle cx='2.5' cy='13' r='2.5' fill='%23444444'/%3E%3Ccircle cx='2.5' cy='23' r='2.5' fill='%23444444'/%3E%3Ccircle cx='13.5' cy='3' r='2.5' fill='%23444444'/%3E%3Ccircle cx='13.5' cy='13' r='2.5' fill='%23444444'/%3E%3Ccircle cx='13.5' cy='23' r='2.5' fill='%23444444'/%3E%3Ccircle cx='24.5' cy='3' r='2.5' fill='%23444444'/%3E%3Ccircle cx='24.5' cy='13' r='2.5' fill='%23444444'/%3E%3Ccircle cx='24.5' cy='23' r='2.5' fill='%23444444'/%3E%3C/svg%3E%0A");}

.footer{padding:64px 0;background:#222222; color:#888888;font-size:16px;width: 100%; flex-shrink: 0; }
.footer .inner-wrap{position:relative;}
.footer .footer-logo {position:absolute;top:0;right:0;}
.footer .footer-logo img {height:46px;}
.footer .address {font-weight:500;}
.footer .address p ~ p{margin-top:6px;}
.footer .address p span {position:relative;display:inline-block;}
.footer .address p span ~ span{padding-left:16px;margin-left:16px;}
.footer .address p span ~ span:before{content:'';display:block;width:1px;height:14px;background:#888;position:absolute;top:50%;left:0;transform:translateY(-50%);}
.footer .footer-info {display:flex;align-items:center; border-top:1px solid #333333;padding-top:24px;margin-top:24px;}
.footer .footer-info .copyright {font-weight:600;}
.footer .footer-info .menu {margin-left:auto;display:flex;align-items:center;font-size:18px;font-weight:500;gap:24px; color:#fff;}

.container .contents{position:relative;width:var(--min-width);margin:0 auto;padding:160px 0 240px;}

.page-header{display:flex;align-items:center; width:100%; height:480px;position:relative; color:#fff;}
.page-header .inner-wrap{height:100%;display:flex;align-items:center;justify-content: center;text-align:center;}
.page-header[class*=bg-]{background-position:50% 50%;background-size:auto 100%;background-repeat:no-repeat;background-color: #000;}
.page-header[class*=bg-]:before{content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.4);}
.page-header.bg-login{background-image:url('../images/visual-login.jpg');}
.page-header.bg-customer{background-image:url('../images/visual-customer.jpg');}
.page-header.bg-apply{background-image:url('../images/visual-apply.jpg');}
.page-header.bg-admin{background-image:url('../images/visual-admin.jpg');}
.page-header .title-page{font-weight:700;font-size:60px;;line-height:1;}
.page-header .txt-sub{font-size:20px;margin-top:36px;}
.page-header .tab-precess,
.page-header .tab-type1{position:absolute;bottom:0;left:0;}

.breadcrumb{margin-top:20px;}
.breadcrumb ol {display: flex;justify-content: center; align-items:center;font-size: 15px;font-weight:600; color:rgba(255, 255, 255, 0.7);}
.breadcrumb li { display: flex; align-items: center; }
.breadcrumb li:first-child:before{content:'';display:block;transform:translateY(-1px); width: 16px;height:16px;background: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_952_2746)'%3E%3Cpath d='M1 8.59998L8 1.59998L15 8.59998' stroke='%23CCCCCC' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3.625 9.16248V14.4125H12.375V9.16248' stroke='%23CCCCCC' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_952_2746'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A") no-repeat 50% 50%;background-size:auto 100%;}
.breadcrumb li + li::before { content: ""; margin: 0 13px;width: 4px;height:4px;border-radius:100%; background:rgba(255, 255, 255, 0.4);}
.breadcrumb li a {  text-decoration: none; }
.breadcrumb li[aria-current="page"] { color:#fff;}

.floating-menu{ position:fixed;bottom:0;right:0;z-index: 10;}
.floating-menu .btn-top{display:none;flex-direction: column;justify-content:center;align-items:center; width:60px;height:60px;background:var(--c-primary);}
.floating-menu .btn-top[style*=block]{display:flex !important;}
.floating-menu .btn-top:before{content:'';display:block;width: 21px;height:12px;background: url("data:image/svg+xml,%3Csvg width='21' height='12' viewBox='0 0 21 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.459961' y='10.54' width='14' height='2.00001' transform='rotate(-45 0.459961 10.54)' fill='white'/%3E%3Crect x='10.3601' y='0.640137' width='14' height='2.00001' transform='rotate(45 10.3601 0.640137)' fill='white'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}

.footer-menu{position:relative;height:220px;background:#222222;}
.footer-menu .inner-wrap{display:flex;align-items:stretch;height:100%}
.footer-menu .inner-wrap a{flex:1; display:flex;justify-content:center;align-items:center;height:100%; color:rgba(255, 255, 255, 0.6);font-size:26px;font-weight:500;}
.footer-menu .inner-wrap a ~ a{border-left:1px solid rgba(255, 255, 255, 0.2);}
.footer-menu .inner-wrap a:hover{ color:#fff;}
.footer-menu .bg{background-position:50% 50%;background-repeat:no-repeat;position:absolute;top:0;left:0;width:100%;height:100%;}
.footer-menu .bg:after{content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.4);}
.footer-menu .bg.bg1 {background-image:url('../images/bg-footer-menu-1.jpg');}
.footer-menu .bg.bg2 {display:none; background-image:url('../images/bg-footer-menu-2.jpg');}
.footer-menu .bg.bg3 {display:none; background-image:url('../images/bg-footer-menu-3.jpg');}


/* ===========================================
    main
=========================================== */

.main-visual{height:970px; background:url('../images/main-visual.jpg') no-repeat 50% 50%;background-size:auto 100%;animation: bgSizeAnim 2.5s ease-in-out forwards;}
.main-visual .inner-wrap{position:relative;height:100%;}
.main-visual .main-text {position:absolute;top:50%;right:0;transform:translateY(-50%); color:#fff;text-align:right;}
.main-visual .main-text strong {font-weight:800;font-size:60px;line-height:1.4;}
.main-visual .main-text p {font-weight:500;font-size:22px;opacity: 0.8;line-height:1.8;margin-top:36px;}
.main-visual .scroll-down {position:absolute;bottom:40px;left:50%;font-size:16px;font-weight:600; color:#F8F8F8;display:flex;flex-direction: column;align-items: center;gap:16px;transform:translateX(-50%);-webkit-animation-name: bounce; animation-name: bounce; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; transition: opacity .3s ease;}
.main-visual .scroll-down:after{content:'';display:block;width: 17px;height:17px;background: url("data:image/svg+xml,%3Csvg width='17' height='17' viewBox='0 0 17 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='0.5'%3E%3Cpath d='M8.5 1L8.5 14' stroke='white' stroke-width='1.5'/%3E%3Cpath d='M2 9L8.5 15L15 9' stroke='white' stroke-width='1.5'/%3E%3C/g%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}
@keyframes bounce {
	to { transform: translateY(0) translateX(-50%) }
	50% { transform: translateY(-15px) translateX(-50%) }
}
@keyframes bgSizeAnim {
	0% { background-size: auto 100%; }
	100% { background-size: auto 120%; }
}

.about-business{padding:200px 0;text-align:center;}
.about-business .tit-main-section {font-weight:700;font-size:80px; color:#000;}
.about-business p {margin-top:60px;font-size:40px;font-weight:700; background: linear-gradient(90deg, #EF353D 0%, #F9884E 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.about-business .btn-wrap {margin-top:40px;display:flex;justify-content:center;align-items:center;}
.about-business .btn-wrap .btn {display: inline-flex; justify-content: center; align-items: center; padding: 10px 20px; height: 48px;font-size:18px;font-weight:500; background: linear-gradient(90deg, #EF353D 0%, #F9884E 100%); border-radius: 999px; color:#fff;gap:4px;}
.about-business .btn-wrap .btn:after{content:'';display:block;width: 20px;height:20px;background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 10H16.5' stroke='white' stroke-width='1.6'/%3E%3Cpath d='M11.5 5L16.5 10L11.5 15' stroke='white' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}

.business-purpose{background:#F8F8F8;}
.business-purpose .inner-wrap{padding:160px 0;}
.business-purpose .tit-main-section {font-size:54px;font-weight:700; color:#222;}
.business-purpose .purpose-list {margin-top:40px;display:flex;height:580px;gap:16px;}
.business-purpose .purpose-list li {position:relative; width:224px;min-width: 224px;display:flex;flex-direction: column;transition: box-shadow 0.3s ease;}
.business-purpose .purpose-list li.on {animation: expandWidth 0.6s forwards ease-in-out;box-shadow: 0px 56px 42px -45px rgba(0, 0, 0, 0.5);}
.business-purpose .purpose-list li.out {animation: contractWidth 0.6s forwards ease-in-out;}
.business-purpose .purpose-list li .text1 {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%); color:#fff;transition: all 0.5s ease;opacity: 1;}
.business-purpose .purpose-list li .text1 em{ display:flex;justify-content:center;align-items:center;padding-right:3px; width: 40px; height: 40px; border-radius:100%; font-weight:700;font-size: 24px;font-style: italic; margin:0 auto; background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.4); backdrop-filter: blur(2px); }
.business-purpose .purpose-list li .text1 p {margin-top:16px; white-space: nowrap;text-align:center; font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: -0.01em; color: #FFFFFF; text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5); }
.business-purpose .purpose-list li .text2 {position:absolute;bottom:0;left:0;width:100%; height:8px;overflow:hidden;background: linear-gradient(90deg, #EF353D 0%, #F9884E 100%);transition: height 0.5s ease; color:#fff;text-align:center;white-space: nowrap;}
.business-purpose .purpose-list li .text2 strong {font-weight:800;font-size:28px;opacity: 0;;transition: opacity 0.5s ease; }
.business-purpose .purpose-list li .text2 p {margin-top:24px;font-size: 16px; color:#fff;letter-spacing: -0.05em;opacity: 0;transition: opacity 0.5s ease; }
.business-purpose .purpose-list li .text2.on{height:280px; padding:16px 40px;display:flex;justify-content:center;align-items:center;flex-direction: column;}
.business-purpose .purpose-list li .text2.on strong,
.business-purpose .purpose-list li .text2.on p{opacity: 1;}
.business-purpose .purpose-list li .bg{height:100%;background-position:50% 50%;background-repeat:no-repeat;position:relative;transition: height 0.5s ease, background 0.5s ease;}
.business-purpose .purpose-list li .bg.on{height:300px;}
.business-purpose .purpose-list li .bg.on + .text1{opacity: 0;}
.business-purpose .purpose-list li .bg:after{content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.3);opacity: 1;transition: opacity 0.5s ease;}
.business-purpose .purpose-list li .bg.on:after{opacity: 0;}
.business-purpose .purpose-list li .bg.bg1 {background-image: url('../images/bg-business-purpose-1.jpg');}
.business-purpose .purpose-list li .bg.bg2 {background-image: url('../images/bg-business-purpose-2.jpg');}
.business-purpose .purpose-list li .bg.bg3 {background-image: url('../images/bg-business-purpose-3.jpg');}
.business-purpose .purpose-list li .bg.bg4 {background-image: url('../images/bg-business-purpose-4.jpg');}
.business-purpose .purpose-list li .bg.bg5 {background-image: url('../images/bg-business-purpose-5.jpg');}

@keyframes expandWidth { 10% { width:224px; } to { width:calc(100% - 736px); } }
@keyframes contractWidth { from { width:calc(100% - 736px); } to { width:224px; } }


.business-vision{padding:130px 0; display:flex;justify-content:center;align-items:center;background:url('../images/bg-business-vision.jpg') no-repeat 50% 50%;}

.scale-support{padding:200px 0;background:#F8F8F8;}
.scale-support .title-wrap{display:flex;justify-content:center;align-items:center;gap:0 16px;flex-wrap: wrap;}
.scale-support .title-wrap .tit-main-section{font-size:80px; color:#000;font-weight:700;}
.scale-support .title-wrap .tag{display:inline-flex;align-items: center;background:#CCCCCC;border-radius:64px;height:64px; color:#fff;padding:0 24px;font-size:36px;font-weight:700;}
.scale-support .title-wrap .sub{width:100%;margin-top:24px;font-size:24px;font-weight:500; color:#777777;text-align:center;}
.scale-support .title-wrap  + *{margin-top:60px;}

/* ===========================================
    content
=========================================== */

* + .title-section{margin-top:200px;}
.title-section{font-weight:700;font-size:54px; color:#222222;text-align:center;}
.title-section + *,
.title-section-sub + *{margin-top:80px;}
.title-section + .title-section-sub{margin-top:24px; color:#777;font-weight:500;font-size:24px;text-align:center;}

* + .title-local{margin-top:60px;}
.title-local{font-weight:700;font-size:32px; color:#333;}
.title-local:after{content:'';display:block;display:inline-block;width:10px;height:10px;border-radius:100%;background:var(--c-primary);margin-left:5px;transform:translateY(2px);}
.title-local + *{margin-top:20px;}

 
.title-data{font-weight:700;font-size:30px; color:#333;text-align:left;}
* ~ .title-data{margin-top:80px;}
.title-data + *{margin-top:20px;}

.tab-type1{width:100%;border-radius:8px 8px 0 0;overflow:hidden;}
.tab-type1 ul{display:flex;width:100%;}
.tab-type1 ul li{flex:1;}
.tab-type1 ul li a{position:relative; display:flex;justify-content:center;align-items:center;flex-direction: column;height:70px; color:#fff;font-weight:700;font-size:20px;background: linear-gradient(90deg, #EF353D 0%, #F9884E 100%);}
.tab-type1 ul li.on a{background:#fff; color:#222;}
.tab-type1 ul li.on a:after{content:'';display:block;position:absolute;bottom:0;left:50%;transform:translateX(-50%);width: 14px;height:11px;background: url("data:image/svg+xml,%3Csvg width='14' height='11' viewBox='0 0 14 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.00007 11L13.4953 0.5H0.504883L7.00007 11Z' fill='%2312B389'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}

/* paging */
.pagination-wrap{position:relative;}
.pagination{position:relative;display:flex;align-items:center;justify-content: center; gap:8px;margin-top:60px;}
.pagination button {display:inline-block; color:#666;width:40px;height:40px;line-height:38px;text-align:center;font-size:14px;font-weight:500;border:1px solid #F2F2F2;}
.pagination [class*=btn-]{display:inline-block;background-size:auto 20px;background-repeat:no-repeat;background-position:50% 50%;}
.pagination ul{display:flex;align-items:center;gap:8px;}
.pagination .on button{ color:#fff; background:var(--c-primary);font-weight:600;border:1px solid transparent;}
.pagination .btn-first{background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 6L10 10L14 14' stroke='%23666666' stroke-width='1.5'/%3E%3Cpath d='M9 6L5 10L9 14' stroke='%23666666' stroke-width='1.5'/%3E%3C/svg%3E%0A");}
.pagination .btn-prev{background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 6L8 10L12 14' stroke='%23666666' stroke-width='1.5'/%3E%3C/svg%3E%0A");}
.pagination .btn-next{background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 6L12 10L8 14' stroke='%23666666' stroke-width='1.5'/%3E%3C/svg%3E%0A");}
.pagination .btn-last{background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 6L10 10L6 14' stroke='%23666666' stroke-width='1.5'/%3E%3Cpath d='M11 6L15 10L11 14' stroke='%23666666' stroke-width='1.5'/%3E%3C/svg%3E%0A");}

/* 데이터 헤더 */
.data-header { display: flex; align-items: center;color: #292E41;gap:0 16px;flex-wrap: wrap;}
* ~ .data-header{margin-top:80px;}
.data-header + *{margin-top:16px;}
.data-header > .right{ margin-left:auto;display:flex;align-items:center;gap:16px;}
.data-header .tit-data{font-size:30px;font-weight:700; color:#333;}
.data-header .tit-data .inp-chk{transform:translateY(-2px);}
.data-header .total{ color:#333;font-size:16px;}
.data-header .total em{ color:var(--c-primary);font-weight:600;vertical-align:baseline;}
.data-header .inp-chk-wrap{gap:24px;}

/* 검색 영역 */
.search-area {display:flex;justify-content:center;align-items:center;flex-direction: column;gap:16px; background: #F2F2F2; padding:30px 20px;gap:16px;margin-top:20px;font-size: 14px;}
.search-area:first-child{margin-top:0;}
.search-area .form-row{display:flex;align-items:center;gap:16px;}
.search-area select,
.search-area input:not([type=radio]),
.search-area input:not([type=checkbox]),
.search-area .search-select .select-box,
.search-area .multi-select .select-box{height:40px;min-width: 140px;}
.search-area .form,
.search-area .form-row { display: flex; align-items: center; gap:16px;}
.search-area .form-set {display:flex;flex-direction: column;gap:6px;}
.search-area .form-set .label{font-weight:700;font-size:16px; color:#333333;}
.search-area .auto{flex:1;}
.search-area .form-row > [class*=btn-] {min-width: 120px;}
.search-area.st2{height:120px; padding:16px 24px 16px 0; background: #FFF6F6; border: 1px solid #FFD0D0;}
.search-area.st2 + .search-area{margin-top:60px;}
.search-area.st2 .form-row{align-items: center;width:100%;gap:0;}
.search-area.st2 .form-row .form-set{flex:1;position:relative;padding:0 24px;}
.search-area.st2 .form-row .form-set ~ .form-set:before{content:'';display:block;position:absolute;top:50%;left:0;width:1px;background:#FFD0D0;height:80px;transform:translateY(-50%);}
.search-area.st2 .form-row .form-set .label{font-size:16px;font-weight:500; color:#E52F42;}
.search-area.st2 select,
.search-area.st2 input:not([type=radio]),
.search-area.st2 input:not([type=checkbox]){width: 100%;border: none;background-color:transparent;padding:0 0;text-align:left !important;font-weight:600; color:#333333;background-position-x:100%;}
.search-area.st2 .form-row > [class*=btn-]{min-width: 0;}


.f-wrap{display:flex;align-items:center;flex-wrap: wrap;}
.f-wrap.colunm{flex-direction:column;gap:8px;align-items: flex-start;}
.f-wrap.colunm .inp-chk-wrap{height:48px;}
.f-wrap > .row{display:flex;align-items:center;gap:32px;width:100%;flex-direction: row;}
/* .f-wrap > .row  ~ .row{margin-top:8px;} */
.f-wrap > .row .auto{flex:1;width:auto;min-width: 0;}
.f-wrap > .row .cell{display:flex;align-items:center;gap:8px;}

.f-cell-wrap{display:flex;gap:40px;margin-top:40px;flex-wrap: wrap;align-items: stretch;}
.f-cell-wrap .v-bar{width:1px;background:#D7DCE5;}
.f-cell-wrap .cell{display:flex;flex-direction: column;overflow:hidden;}
.f-cell-wrap .cell.no-auto,
.f-cell-wrap .cell.auto{flex:1;}
.f-cell-wrap .data-header{width:100%;}
.f-cell-wrap .data-header + *{margin-top:16px;}
.f-cell-wrap:first-child{margin-top:0;}
.f-cell-wrap .auto{flex:1;overflow:hidden;}
.f-cell-wrap .chart-wrap{height:100%;}


/* table */
.data-type1{border-top:1px solid #000;}
.data-type1 table {width:100%;border-collapse:collapse;border-spacing:0;color:#373F57;font-size: 13px;table-layout: fixed;}
.data-type1 table th,
.data-type1 table td{height:60px;border-bottom:1px solid #DDDDDD;font-size:16px; color:#666;vertical-align: middle;text-align:center;}
.data-type1 table th{ color:#333;font-weight:600;}
.data-type1 table .title{display:inline-flex; max-width: 100%;}
.data-type1 table .title .ico-clip{margin-left:4px;}
.data-type1 table .title .ellips{flex:1;}
.data-type1 table .title:hover{text-decoration: underline;}
.data-type1 table .ellips{max-width: 100%; overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;word-wrap:break-word;line-height:1.3em;height:1.3em;}
.data-type1 table .status{font-weight:500;}
.data-type1 table b.num{font-weight:600;}
.data-type1 table .no-data{height:180px;display:flex;justify-content:center;align-items:center;font-size:16px; color:#666666;}

.data-type2{border-top:1px solid #000;}
.data-type2 table {width:100%;border-collapse:collapse;border-spacing:0;color:#222;font-size: 13px;table-layout: fixed;}
.data-type2 table th,
.data-type2 table td{height:80px;border-bottom:1px solid #DDDDDD;font-size:16px; color:#444;vertical-align: middle;text-align:left; border-bottom:1px solid #ddd;}
.data-type2 table th{ color:#222;vertical-align:top;padding:16px 0;}
.data-type2 table th .th{min-height: 48px;display:flex;align-items:center;}
.data-type2 table th span{vertical-align:baseline;}
.data-type2 table td{padding:14px 10px;}
.data-type2 table .txt{ color:#666;}
.data-type2 table * + .txt{margin-top:10px;}

.data-type3 table {width:100%;border-collapse:collapse;border-spacing:0;font-size: 13px;table-layout: fixed;}
.data-type3 table th,
.data-type3 table td{height:80px;border-bottom:1px solid #DDDDDD;font-size:20px;font-weight:500; color:#333;vertical-align: middle;text-align:center; border:1px solid #ddd;background:#fff;}
.data-type3 table thead th{ color:#fff;font-weight:600;background:#444;}
.data-type3 table tbody th{background:#F2F2F2;}

.data-type4{border-top:1px solid #222;}
.data-type4 table {width:100%;border-collapse:collapse;border-spacing:0;color:#222;font-size: 13px;table-layout: fixed;}
.data-type4 table th,
.data-type4 table td{height:48px;border-bottom:1px solid #DDDDDD; color:#222;font-size:16px;vertical-align: middle;}
.data-type4 table th{font-weight:500;text-align:left;}

.board-detail{border-bottom:1px solid #D7DCE5;}
.board-detail .board-header {display: flex; flex-direction: column; align-items: flex-start; padding: 32px 0; gap: 20px;border-top: 1px solid #333;border-bottom:1px solid #ddd;}
.board-detail .board-header .tit {color: #222;font-weight: 600;font-size: 22px;}
.board-detail .board-header .board-info {font-size: 16px;display:flex;align-items:center;flex-wrap: wrap;gap:32px;}
.board-detail .board-header .board-info > span{position:relative; color:#666666;}
.board-detail .board-header .board-info > span em{ color:#444;vertical-align:baseline;font-weight:600;}
.board-detail .board-header .board-info > span .txt{position:relative;padding-left:13px;margin-left:12px;}
.board-detail .board-header .board-info > span .txt:before{content:'';display:block;position:absolute;top:50%;left:0;width: 1px; height: 14px; background: #DDDDDD;transform:translateY(-50%);}
.board-detail .board-content-wrap {padding:32px 0;}
.board-detail .board-content {font-size:18px;white-space: pre-line;line-height:1.9; color:#444;}
.board-detail .board-content + *{margin-top:40px;}

.prev-next dl{border-bottom:1px solid #DDDDDD;height:80px;display:flex;align-items:center;gap:40px;}
.prev-next dl dt,
.prev-next dl dd{font-weight:500; font-size:18px;}
.prev-next dl dt{color:#333;display:flex;align-items:center;gap:16px;}
.prev-next dl dd{flex:1; color:#666;}
.prev-next dl dd a:hover{text-decoration: underline;}
.prev-next dl.prev dt:before{content:'';display:block;width: 20px;height:20px;background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.5 12.5L10 7L15.5 12.5' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}
.prev-next dl.next dt:before{content:'';display:block;width: 20px;height:20px;background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 7L10 12.5L4.5 7' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}


.support-scale{position:relative;padding:100px 0 180px;background:#F8F8F8;}
/* .support-scale .bg{position: absolute;left:50%;top:0; width:100vw; margin-left:-50vw; height:100%;background:#ddd;} */
.business-overview{padding-bottom:200px;}
.overview-wrap{display:flex;align-items: stretch;height:500px;margin-top:40px;background:#222222;}
.overview-wrap .overview-img {flex:1;}
.overview-wrap .overview-img img {object-fit: cover;width:100%;height:100%;}
.overview-wrap .overview-info {width:520px;display:flex;justify-content:center;align-items:flex-start;flex-direction: column;padding:60px 64px;}
.overview-wrap .overview-info .logo{display:block;width:226px;height:50px;background:url('../images/logo.svg');}
.overview-wrap .overview-info .overview-list{width:100%;border-top:2px solid #fff;margin-top:32px;}
.overview-wrap .overview-info .overview-list li {border-bottom:1px solid rgba(255, 255, 255, 0.4);display:flex;min-height: 64px;padding:23px 0; color:rgba(255, 255, 255, 0.8);}
.overview-wrap .overview-info .overview-list li .label {font-weight:600;font-size:17px;width:100px;}
.overview-wrap .overview-info .overview-list li .desc {font-weight:500;font-size:18px;}

.support-scale{display:flex;justify-content:center;align-items:center;flex-direction: column;margin-top:40px;}
.support-scale .support-info strong {font-weight:700;font-size:36px; color:#222;display:block;text-align:center;}
.support-scale .support-info strong em {font-weight:600; color:var(--c-primary);font-size:64px;vertical-align:baseline;letter-spacing: -0.05em;margin-right:1px;}
.support-scale .support-info .sub {font-weight:500;font-size:24px; color:#666666;display:block;text-align:center;}
.support-scale .support-division {display:flex;align-items:center; color:#fff;margin-top:64px;gap:30px;}
.support-scale .support-division .item {display:flex;justify-content:center;align-items:center;flex-direction: column;width:280px;height:280px;border-radius:100%;}
.support-scale .support-division .item1{background:#60534D;}
.support-scale .support-division .item2{background:#E52F42;}
.support-scale .support-division .item3{background:#F7774A;}
.support-scale .support-division .item p {display:flex;flex-direction: column;justify-content: center;align-items: center;margin-top:16px;}
.support-scale .support-division .item p > span {font-weight:500;font-size:20px;}
.support-scale .support-division .item p strong {font-weight:600;font-size:36px;}
.support-scale .support-division .item p strong .per{font-size:24px;font-weight:700;}
.support-scale .support-division .plus {width: 30px;height:30px;background: url("data:image/svg+xml,%3Csvg width='29' height='30' viewBox='0 0 29 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.3334 0.858154V29.1424M28.4756 15.0003L0.191284 15.0003' stroke='%23222222' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}

.dot-list-box {padding: 48px 56px;background: #F8F8F8; border: 1px solid #F2F2F2;}
.dot-list {font-size:26px; color:#333;font-weight:600;display:flex;flex-direction: column;gap:16px;}
.dot-list li {position:relative;padding-left:20px;}
.dot-list li:before{content:'';display:block;width:8px;height:8px;border-radius:100%;background:#888888;position:absolute;top:13px;left:0;}
.dot-list li em { color:var(--c-primary);vertical-align:baseline;}
.dot-list li b {vertical-align:baseline;}

.memo-list ul {display:grid;grid-template-columns: repeat(4, 1fr);grid-gap: 16px;}
.memo-list ul .box {position:relative; flex:1;height:140px;display:flex;justify-content:center;align-items:center;background:#F8F8F8;font-weight:700; color:#222;display:flex;flex-direction: column;font-size:22px;}
.memo-list ul .box:before{content:'';display:block;width: 24px;height:24px;position:absolute;top:0;left:0; background:#fff url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24 0V24H0L24 0Z' fill='%23DDDDDD'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}
.memo-list ul .box .sub {font-size:18px; color:#888888;text-align:center;line-height:1.3;}

.step-system-wrap {margin-top:80px;}
.step-system-wrap .step-positon{text-align:right; color:#666666;font-weight:700;font-size:20px;}
.step-system-wrap .step-positon em {vertical-align:baseline; color:var(--c-primary);}
.step-system-wrap * + .step-system-box {margin-top:20px;}
.step-system-wrap .step-system-box {padding: 100px 96px;background: #F8F8F8;}
.step-system-wrap .step-system-box dl ~ dl{border-top:1px solid #DDDDDD;padding-top:80px;margin-top:80px;}
.step-system-wrap .step-system-box dl dt {font-size:32px;}
.step-system-wrap .step-system-box dl dt em {display:block; color:var(--c-primary); font-weight:700;position:relative;line-height:1.3;}
.step-system-wrap .step-system-box dl dt em:after{content:'';display:inline-block;width:10px;height:10px;border-radius:100%;background:var(--c-primary);transform:translateY(3px);}
.step-system-wrap .step-system-box dl dt strong {display:block;margin-top:16px; color:#222;line-height:1.3;}
.step-system-wrap .step-system-box dl dt p {font-size:22px; color:#666666;margin-top:16px;font-weight:500;line-height:1.3;}
.step-system-wrap .step-system-box dl dd {margin-top:40px;}
.step-system-wrap .step-system-box dl dd ol {display:flex;align-items:stretch;gap:40px;}
.step-system-wrap .step-system-box dl dd ol li {position:relative;flex:1;}
.step-system-wrap .step-system-box dl dd ol li ~ li:before{content:'';display:block;position:absolute;top:50%;left:-28px;transform:translateY(-50%); width: 16px;height:18px;background: url("data:image/svg+xml,%3Csvg width='16' height='18' viewBox='0 0 16 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 2L11 9L4 16' stroke='%23888888' stroke-width='3'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}
.step-system-wrap .step-system-box dl dd ol li .box {display:flex;justify-content: center; align-items:center;flex-direction: column; background:#fff;height:150px; color:#222;position:relative;}
.step-system-wrap .step-system-box dl dd ol li .box .icon {height:40px;width:40px;display:inline-block;}
.step-system-wrap .step-system-box dl dd ol li .box .txt {text-align:center;font-size:22px;font-weight:600;margin-top:10px;line-height:1.3;}
.step-system-wrap .step-system-box dl dd ol li .box .sub{ color:#888;font-size:18px;font-weight:700;}
.step-system-wrap .step-system-box dl dd .ps-dot {position:relative; color:#888888;padding-left:8px;margin-top:40px;}
.step-system-wrap .step-system-box dl dd .ps-dot:before{content:'';display:block;position:absolute;top:8px;left:0;width:2px;height:2px;background:#888888;}
.step-system-wrap .step-system-box [class*=ico-step-]{width:40px;height:40px;}
.step-system-wrap .step-system-box .ico-step-building-plus {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M33.0039 5V14.9967' stroke='%23E52F42' stroke-width='2'/%3E%3Cpath d='M38.0049 9.99072L28.0082 9.99072' stroke='%23E52F42' stroke-width='2'/%3E%3Crect x='5' y='8' width='18' height='28' rx='2' stroke='%23444444' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M23 15L28.0077 17.9212C28.6222 18.2796 29 18.9374 29 19.6487V34C29 35.1046 28.1046 36 27 36H20.5' stroke='%23444444' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M11 14L11 16' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11 21L11 23' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11 28L11 30' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17 14L17 16' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17 21L17 23' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17 28L17 30' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");}
.step-system-wrap .step-system-box .ico-step-building-check {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28 9.57143L30.2643 11.7064C31.0348 12.4328 32.2379 12.4328 33.0084 11.7064L38 7' stroke='%23E52F42' stroke-width='2'/%3E%3Crect x='5' y='8' width='18' height='28' rx='2' stroke='%23444444' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M23 15L28.0077 17.9212C28.6222 18.2796 29 18.9374 29 19.6487V34C29 35.1046 28.1046 36 27 36H20.5' stroke='%23444444' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M11 14L11 16' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11 21L11 23' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11 28L11 30' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17 14L17 16' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17 21L17 23' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17 28L17 30' stroke='%23444444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");}
.step-system-wrap .step-system-box .ico-step-check {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.5 8.5H11C9.89543 8.5 9 9.39543 9 10.5V31C9 32.1046 9.89543 33 11 33H29C30.1046 33 31 32.1046 31 31V10.5C31 9.39543 30.1046 8.5 29 8.5H25.5' stroke='%23444444' stroke-width='2' stroke-linejoin='round'/%3E%3Crect x='15' y='6' width='10' height='5' rx='2' stroke='%23444444' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M14.5 20.5L18.5 24.5L25.5 17.5' stroke='%23E52F42' stroke-width='2'/%3E%3C/svg%3E%0A");}
.step-system-wrap .step-system-box .ico-step-pen {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.3871 18.8474L15.0717 15.4242C15.1825 14.8702 15.5131 14.3847 15.988 14.0787L30.4379 4.76655C31.2642 4.23403 32.3501 4.35008 33.0452 5.04521L35.0917 7.09175C35.7869 7.78688 35.9029 8.87276 35.3704 9.69909L26.0583 24.1489C25.7522 24.6238 25.2668 24.9544 24.7128 25.0652L21.2895 25.7499' stroke='%23444444' stroke-width='2'/%3E%3Cpath d='M18.9406 21.9402C21.7944 24.7939 21.7944 29.4208 18.9406 32.2746C16.2873 34.9279 12.3482 34.4249 8.75914 34.1968C7.65668 34.1267 6.754 33.2241 6.68384 32.1217C6.45544 28.5326 5.95267 24.5937 8.60623 21.9402C11.46 19.0864 16.0869 19.0864 18.9406 21.9402Z' stroke='%23E52F42' stroke-width='2'/%3E%3Cpath d='M7.49815 33.3817L14.8799 26' stroke='%23E52F42' stroke-width='2'/%3E%3C/svg%3E%0A");}
.step-system-wrap .step-system-box .ico-step-money {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 10C25.8168 10.0001 30.5324 14.2516 30.5324 19.496V29.39C30.5324 29.9733 30.7871 30.5275 31.2297 30.9074L32.6229 32.1035C32.7054 32.1744 32.7855 32.2499 32.8432 32.3422C33.2944 33.0652 32.7225 34 31.7597 34H8.24032C7.2775 34 6.7056 33.0652 7.15685 32.3422C7.21445 32.2499 7.29457 32.1744 7.37713 32.1035L8.77034 30.9074C9.21291 30.5275 9.46755 29.9733 9.46755 29.39V19.496C9.46755 14.2515 14.1831 10 20 10Z' stroke='%23444444' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M23 19.9286V19.9286C23 18.8635 22.1365 18 21.0714 18H19C17.8954 18 17 18.8954 17 20V20.5C17 21.6046 17.8954 22.5 19 22.5H21C22.1046 22.5 23 23.3954 23 24.5V25C23 26.1046 22.1046 27 21 27H18.9286C17.8635 27 17 26.1365 17 25.0714V25.0714' stroke='%23E52F42' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M20 16L20 18' stroke='%23E52F42' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M20 27L20 29' stroke='%23E52F42' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M22.5946 11L24.4106 7.12139C24.7649 6.36454 24.5983 5.43537 23.8012 5.18451C23.1104 4.96715 22.1853 4.89297 21.0853 5.23582C20.8667 5.30397 20.6678 5.43145 20.4515 5.50684C20.3658 5.53671 20.2651 5.56335 20.1507 5.58119C20.0509 5.59675 19.9491 5.59675 19.8493 5.58119C19.7349 5.56335 19.6342 5.53671 19.5485 5.50684C19.3322 5.43145 19.1333 5.30397 18.9147 5.23582C17.8147 4.89297 16.8896 4.96715 16.1988 5.18451C15.4017 5.43537 15.2351 6.36454 15.5894 7.12139L17.4054 11' stroke='%23444444' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E%0A");}
.step-system-wrap .step-system-box dl dd ol .comlete .box {background:var(--c-primary); color:#fff;}
.step-system-wrap .step-system-box dl dd ol .comlete .box .icon .ico-step-comlete {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='path-1-inside-1_1088_8084' fill='white'%3E%3Crect x='5' y='8' width='24' height='24' rx='2'/%3E%3C/mask%3E%3Crect x='5' y='8' width='24' height='24' rx='2' stroke='white' stroke-width='4.8' mask='url(%23path-1-inside-1_1088_8084)'/%3E%3Cpath d='M12 16.5L18.0858 22.5858C18.8668 23.3668 20.1332 23.3668 20.9142 22.5858L34 9.5' stroke='white' stroke-width='2.4'/%3E%3C/svg%3E%0A");}

.step-system-wrap .step-system-box dl dd ol li .box .step-badge {
    position: absolute;
    top: 5px;
    left: 5px;
    color: var(--c-primary);
    font-size: 16px;
    font-weight: 700;
    padding: 4px 8px;
    z-index: 10;
}

.noti-box{border:1px solid #FFDFDF;background:#FFF4F4;padding:24px 32px;}
.noti-box .tit{display:flex;align-items:center; color:var(--c-primary);gap:4px;}
.noti-box .tit b{font-size:22px;font-weight:600;}
.noti-box .tit .sub{font-size:18px;font-weight:500; }
.noti-box .txt{color:#222;font-size:18px;margin-top:18px;}

td .file-add-guide{padding-top:5px;}
.file-add-guide + *{margin-top:16px;}
.file-add-guide .txt-noti {display:flex; font-size:18px;font-weight:500; color:#003675;gap:4px;}
.file-add-guide .txt-noti:before{content:'';display:block;width: 20px;height:20px;transform:translateY(2px); background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10.001' cy='10.0005' r='9' fill='%23003675'/%3E%3Cpath d='M10.292 7.50146C10.7522 7.50146 11.126 7.87424 11.126 8.33447V13.3345H11.751C12.211 13.3346 12.5838 13.7075 12.584 14.1675C12.584 14.6276 12.2111 15.0013 11.751 15.0015H8.83398C8.37375 15.0015 8.00098 14.6277 8.00098 14.1675C8.00115 13.7074 8.37386 13.3345 8.83398 13.3345H9.45898V9.16748C8.99875 9.16748 8.62598 8.79471 8.62598 8.33447C8.62598 7.87424 8.99875 7.50146 9.45898 7.50146H10.292Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.0846 4.58447C10.3609 4.58447 10.6259 4.69422 10.8212 4.88957C11.0166 5.08492 11.1263 5.34987 11.1263 5.62614C11.1263 5.90241 11.0166 6.16736 10.8212 6.36271C10.6259 6.55806 10.3609 6.66781 10.0846 6.66781C9.80837 6.66781 9.54342 6.55806 9.34807 6.36271C9.15272 6.16736 9.04297 5.90241 9.04297 5.62614C9.04297 5.34987 9.15272 5.08492 9.34807 4.88957C9.54342 4.69422 9.80837 4.58447 10.0846 4.58447Z' fill='white'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}
.file-add-guide .ps {position:relative; font-size:15px; color:#444;margin-left:24px;padding-left:12px;position:relative;margin-top:10px;}
.file-add-guide .ps:before{content:'';display:block;width:4px;height:4px;border-radius:100%;background:#555555;position:absolute;top:8px;left:0;}
.file-add-guide .guide-box {margin-top:16px; padding: 20px 24px;background: #F8F8F8;}
.file-add-guide .guide-box .tit { color:#333;font-size:18px;font-weight:500;}
.file-add-guide .guide-box ol {margin-top:8px;font-size:16px; color:#444;}

.login-wrap{margin:0 auto; display: flex; flex-direction: column; align-items: flex-start; padding: 64px 80px;width: 560px; height: 477px; top: 620px; background: #FFFFFF; border: 1px solid #444444; }
.login-wrap .login-tit {font-weight: 600;font-size: 32px;letter-spacing: -0.25px;color: #222222;}
.login-wrap ul {margin-top:32px;display:flex;flex-direction: column;gap:10px; width:100%;}
.login-wrap ul li input {width:100%;}
.login-wrap .btn-wrap {margin-top:24px;width:100%;}
.login-wrap .btn-wrap [class*=btn-]{width:100%;}
.login-wrap .login-menu {text-align:right;width:100%; color:#666;font-size:16px;margin-top:24px;}

.tab-precess{width:100%;border-radius:8px 8px 0 0;overflow:hidden;max-width: 1440px;}
.tab-precess ol {display:flex;width:100%;}
.tab-precess ol li{flex:1;background:#F2F2F2;position:relative; display:flex;justify-content:flex-start;align-items:flex-start;align-items: center; height:96px; gap:10px;padding:0 24px;  color:#fff;font-weight:700;}
.tab-precess ol li.on{background: linear-gradient(90deg, #EF353D 0%, #F9884E 100%);}
.tab-precess ol li + li:not(.on){border-left:1px solid #DDDDDD;}
.tab-precess ol li.on + li{border-left:none;}
.tab-precess ol li .text em {display:block; color:#ccc;font-weight:700;font-size:14px;}
.tab-precess ol li .text b {display:block; color:#888;font-size:20px;font-weight:700;}
.tab-precess ol li [class*=ico-]{width:40px;height:40px;background-size:auto 40px !important;background-position:0 0 !important;}
.tab-precess ol li .ico-process-info { background-image: url("data:image/svg+xml,%3Csvg width='80' height='40' viewBox='0 0 80 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 17.833V28.1247' stroke='%23CCCCCC' stroke-width='3'/%3E%3Ccircle cx='20' cy='20' r='13' stroke='%23CCCCCC' stroke-width='3'/%3E%3Ccircle cx='19.9997' cy='13.4997' r='2.16667' fill='%23CCCCCC'/%3E%3Cpath d='M60 17.833V28.1247' stroke='white' stroke-width='3'/%3E%3Ccircle cx='60' cy='20' r='13' stroke='white' stroke-width='3'/%3E%3Ccircle cx='59.9997' cy='13.4997' r='2.16667' fill='white'/%3E%3C/svg%3E%0A");}
.tab-precess ol li .ico-process-note {background-image: url("data:image/svg+xml,%3Csvg width='80' height='40' viewBox='0 0 80 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M50 32.5V7H65L71 13V32.5H50Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M60 15.5H66' stroke='white' stroke-width='3'/%3E%3Cpath d='M60 20.5H66' stroke='white' stroke-width='3'/%3E%3Cpath d='M60 25.5H66' stroke='white' stroke-width='3'/%3E%3Cpath d='M55 15.5H58' stroke='white' stroke-width='3'/%3E%3Cpath d='M55 20.5H58' stroke='white' stroke-width='3'/%3E%3Cpath d='M55 25.5H58' stroke='white' stroke-width='3'/%3E%3Cpath d='M10 32.5V7H25L31 13V32.5H10Z' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M20 15.5H26' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M20 20.5H26' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M20 25.5H26' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M15 15.5H18' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M15 20.5H18' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M15 25.5H18' stroke='%23CCCCCC' stroke-width='3'/%3E%3C/svg%3E%0A");}
.tab-precess ol li .ico-process-detail {background-image: url("data:image/svg+xml,%3Csvg width='80' height='40' viewBox='0 0 80 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='18' cy='12' r='4.5' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M24 21.7996C22.9999 21.2884 21.867 21 20.6667 21H15.3333C11.2832 21 8 24.2832 8 28.3333C8 30.3584 9.64162 32 11.6667 32H18' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M21.4768 28.7978L30.2715 20L34.5141 24.2426L25.7194 33.0405H21.4768L21.4768 28.7978Z' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M27 23L31 27' stroke='%23CCCCCC' stroke-width='3'/%3E%3Ccircle cx='58' cy='12' r='4.5' stroke='white' stroke-width='3'/%3E%3Cpath d='M64 21.7996C62.9999 21.2884 61.867 21 60.6667 21H55.3333C51.2832 21 48 24.2832 48 28.3333C48 30.3584 49.6416 32 51.6667 32H58' stroke='white' stroke-width='3'/%3E%3Cpath d='M61.4768 28.7978L70.2715 20L74.5141 24.2426L65.7194 33.0405H61.4768L61.4768 28.7978Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M67 23L71 27' stroke='white' stroke-width='3'/%3E%3C/svg%3E%0A");}
.tab-precess ol li .ico-process-check {background-image: url("data:image/svg+xml,%3Csvg width='80' height='40' viewBox='0 0 80 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='6.5' y='9.5' width='21' height='21' stroke='%23CCCCCC' stroke-width='3'/%3E%3Cpath d='M12 16.5L19.5 24L34 9.5' stroke='%23CCCCCC' stroke-width='3'/%3E%3Crect x='46.5' y='9.5' width='21' height='21' stroke='white' stroke-width='3'/%3E%3Cpath d='M52 16.5L59.5 24L74 9.5' stroke='white' stroke-width='3'/%3E%3C/svg%3E%0A");}
.tab-precess ol li.on [class*=ico-]{background-position-x: 100% !important;}
.tab-precess ol li.on .text em{ color:#fff;opacity: 0.8;}
.tab-precess ol li.on .text b{ color:#fff;}

.agree-checks{margin-top:80px;}
.agree-checks ul {border-top:1px solid #222;}
.agree-checks ul .item .inp-chk{gap:16px;}
.agree-checks ul .item .check-all .t{ color:#444;font-size:20px;font-weight:500;}
.agree-checks ul .item .item-t {border-bottom:1px solid #ddd;min-height:80px;display:flex;align-items:center;}
.agree-checks ul .item .item-t .inp-chk.item .t em { color:var(--c-primary);vertical-align:baseline;}
.agree-checks ul .item .item-t .btn-detail {margin-left:auto; width:40px;height:40px;background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.5 7.5L10 13L15.5 7.5' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size: 20px 20px;}
.agree-checks ul .item .item-b {display:none; background: #F8F8F8;height:320px;overflow-y:auto; color:#444;font-size:16px;padding:40px;white-space: pre-line;}
.agree-checks ul .item .item-t.active + .item-b{display:block;}
.agree-checks ul .item .item-t.active .btn-detail{transform: rotate(-180deg);}

.complete-wrap{padding-top:80px;}
.complete-wrap .btn-bottom-wrap.center{margin-top:240px;}

/* ===========================================
    Login Prompt Modal
=========================================== */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content {
    background: #fff;
    border-radius: 12px;
    padding: 0;
    max-width: 400px;
    width: 90%;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    animation: modalSlideIn 0.3s ease-out;
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.modal-header {
    padding: 24px 24px 16px;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-header h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: #333;
}

.modal-header .btn-close {
    background: none;
    border: none;
    font-size: 24px;
    color: #999;
    cursor: pointer;
    padding: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-header .btn-close:hover {
    color: #666;
}

.modal-body {
    padding: 20px 24px;
}

.modal-body p {
    margin: 0 0 12px;
    font-size: 16px;
    color: #666;
    line-height: 1.5;
}

.modal-body p:last-child {
    margin-bottom: 0;
}

.modal-footer {
    padding: 16px 24px 24px;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
}

.modal-footer .btn-secondary,
.modal-footer .btn-primary {
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    transition: all 0.2s ease;
}

.modal-footer .btn-secondary {
    background: #f5f5f5;
    color: #666;
}

.modal-footer .btn-secondary:hover {
    background: #e8e8e8;
}

.modal-footer .btn-primary {
    background: var(--c-primary);
    color: #fff;
}

.modal-footer .btn-primary:hover {
    background: #d73527;
}

/* ===========================================
    React Multi-Select Component
=========================================== */
.multi-select {
    position: relative;
    display: inline-block;
    width: 100%;
}

.multi-select .select-box {
    position: relative;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
    padding: 8px 12px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.multi-select .select-box:hover {
    border-color: #999;
}

.multi-select .select-box.open {
    border-color: var(--c-primary);
    box-shadow: 0 0 0 2px rgba(229, 47, 66, 0.25);
}

.multi-select .select-box .placeholder {
    color: #999;
    font-size: 14px;
}

.multi-select .select-box .selected {
    color: #333;
    font-size: 14px;
    flex: 1;
}

.multi-select .select-box .arrow {
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #666;
    transition: transform 0.2s;
}

.multi-select .select-box.open .arrow {
    transform: rotate(180deg);
}

.multi-select .dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    border-top: none;
    border-radius: 0 0 4px 4px;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1000;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    display: none;
}

.multi-select .dropdown.open {
    display: block;
}

.multi-select .dropdown .inp-chk {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    gap: 5px;
}

.multi-select .dropdown .inp-chk:last-child {
    border-bottom: none;
}

.multi-select .dropdown .inp-chk:hover {
    background-color: #f8f9fa;
}

.multi-select.disabled .select-box {
    background-color: #f5f5f5;
    cursor: not-allowed;
    color: #999;
}

.multi-select.disabled .select-box .placeholder,
.multi-select.disabled .select-box .selected {
    color: #999;
}

/* ===========================================
    React Search-Select Component
=========================================== */
.search-select {
    position: relative;
    display: inline-block;
    width: 100%;
}

.search-select .select-box {
    position: relative;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
    padding: 8px 12px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.search-select .select-box:hover {
    border-color: #999;
}

.search-select .select-box.open {
    border-color: var(--c-primary);
    box-shadow: 0 0 0 2px rgba(229, 47, 66, 0.25);
}

.search-select .select-box .placeholder {
    color: #999;
    font-size: 14px;
}

.search-select .select-box .selected {
    color: #333;
    font-size: 14px;
    flex: 1;
}

.search-select .select-box .arrow {
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #666;
    transition: transform 0.2s;
}

.search-select .select-box.open .arrow {
    transform: rotate(180deg);
}

.search-select .dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    border-top: none;
    border-radius: 0 0 4px 4px;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1000;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    display: none;
}

.search-select .dropdown.open {
    display: block;
}

.search-select .search-box {
    position: sticky;
    top: 0;
    padding: 0 16px 16px;
    background: #FFFFFF;
}

.search-select .search-box .search-input {
    height: 40px;
    border: 1px solid #DDDDDD;
    display: flex;
}

.search-select .search-box input {
    flex: 1;
    height: 100% !important;
    border: none !important;
    padding: 0 8px;
    font-size: 14px;
    outline: none;
}

.search-select .search-box button {
    width: 40px;
    height: 100%;
    background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2.85' y='2.85' width='13.3' height='13.3' rx='6.65' stroke='%23444444' stroke-width='1.7' stroke-linecap='round'/%3E%3Cpath d='M14.5 14.5L17.5 17.5' stroke='%23444444' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E%0A") no-repeat 50% 50%;
    border: none;
    cursor: pointer;
}

.search-select .options-container {
    max-height: 150px;
    overflow-y: auto;
}

.search-select label.inp-opt {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 5px 16px;
    color: #444;
    font-size: 16px;
    cursor: pointer;
}

.search-select label.inp-opt:hover {
    background-color: #f8f9fa;
}

.search-select label.inp-opt.on {
    background: #F8F8F8;
}

.search-select label.inp-opt input {
    border: 0 !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important;
}

.search-select label.inp-opt .t {
    font-size: 16px;
    color: #444;
}

.search-select .no-results {
    padding: 12px;
    text-align: center;
    color: #999;
    font-size: 14px;
}

.search-select.disabled .select-box {
    background-color: #f5f5f5;
    cursor: not-allowed;
    color: #999;
}

.search-select.disabled .select-box .placeholder,
.search-select.disabled .select-box .selected {
    color: #999;
}

.btn-file-delete {width: 20px;height:20px;background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.00061 4L16.0003 15.9997' stroke='%23888888' stroke-width='1.4'/%3E%3Cpath d='M15.9996 4.00024L3.99995 15.9999' stroke='%23888888' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat 50% 50%;background-size:auto 100%;}