/*******************************************************
*/
/* common
 *******************************************************/
.sub-content{min-height: 60vh;}

.text-type01 li{margin-bottom:5px;}
.text-type01 li:last-child{margin-bottom:0;}
.text-type01 li p{position:relative;padding-left:10px;}
.text-type01 li p::before{content: '';position:absolute;width:4px;height:4px;background:var(--gray-200);left: 0;top:calc(50% - 2px);;transform: translateX(-50%);border-radius: 100px;}

.gray-bg{background:var(--variant-light);}

.card-content{background:var(--variant-light);}
.card-content.no-bg{background:none;}
.card-body{padding:2rem 2.5rem;}

@media screen and (max-width: 1200px) {
   .card-body {padding:1.8rem 2rem;}
}

@media screen and (max-width: 768px) {
   .card-body {padding: 1.6rem 1.8rem;}
}

@media screen and (max-width: 480px) {
   .card-body {padding: 1.2rem 1rem;}
}

/*******************************************************
*/
/* table style
 *******************************************************/

.custom-table{width:100%;}
.custom-table th{background-color: #f8f9fa;font-weight: bold;font-size:14px; color: #4a5568; padding:12px; text-align: center;border: 1px solid #e2e8f0; white-space: nowrap; }
.custom-table td {text-align:center;font-size:14px; border: 1px solid #e2e8f0; vertical-align:middle; height:auto;padding:8px; transition: background-color 0.2s; }
.custom-table td:hover { background-color: #f7fafc; }

.custom-table td .status-tag{font-size:14px;max-width:calc(70px - 0.5rem);padding:4px;font-weight: bold;text-align: center;white-space: nowrap;}
.custom-table td .status-cancell{background:#FFF7D6;color:#974f0c;}
.custom-table td .status-apply{background:#E9F2FF;color:#0055CC;}
.custom-table td .status-completed{background:#DCFFF1;color:#216E4E;}
.custom-table td .status-closed{background:#f1f2f4;color:#44546F;}

@media (max-width:1200px) {
   .custom-table th { font-size: 13px; padding: 10px 6px; }
   .custom-table td { font-size: 13px; padding: 6px 4px; }
   .custom-table td .status-tag { font-size: 12px;padding: 2px 6px; }
   .custom-table .listBtn .btn { font-size: 12px; padding: 4px 8px; }
   .custom-table .apply-cancel-btn { font-size: 12px !important; padding: 4px 8px !important; height:38px !important;}
}

@media (max-width: 768px) {
   .custom-table, .custom-table thead, .custom-table tbody, .custom-table th, .custom-table td, .custom-table tr { display: block; }
   .custom-table thead tr { position: absolute; top: -9999px; left: -9999px; }
   .custom-table tr { border: 1px solid #ddd; margin-bottom: 15px; padding: 15px; border-radius: 8px; background: #fff; }
   .custom-table td { border: none; padding: 8px 0; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee; text-align: left; }
   .custom-table td:last-child { border-bottom: none; }
   .custom-table td:before { content: attr(data-label); font-weight: bold; color: #555; flex: 0 0 auto; margin-right: 15px; min-width: 80px; }
   .custom-table td > * { flex: 1 1 auto; text-align: right; }
   .custom-table td .status-tag {padding:6px 8px;}
   .custom-table .apply-cancel-btn{text-align:center;}
}

.grid-title h4{color:var(--variant);font-weight:400;}


.btn-default{width: 100%;display: inline-flex;align-items: center;justify-content: center;height: 42px;padding: 0 16px;font-size: 14px;font-weight: 500;border-radius: 6px;text-decoration: none;transition: all 0.6s ease-in-out;background-color: #f8f9fa;color: #666;border: 1px solid #e2e8f0;}
.btn-default:hover{background-color: #edf2f7;border-color: #cbd5e0;}

.contents{margin-bottom:70px;}
.contents:last-child{margin-bottom: 0;}
.contents h6{font-weight:400;}

@media (max-width:768px) {
   .contents{margin-bottom:40px;}
}

/*******************************************************
*/
/* tab style
 *******************************************************/

.tab_wrap { border: 1px solid #333; border-radius: 9999px; box-shadow: none; position: relative; z-index: 10 }
.tab_wrap:after { background: linear-gradient(to left, #333 20%, #333 44%, #999 50%, #444 60%, #333 63%, #333 100%); background-size: 200% auto; border-radius: inherit; bottom: -1px; content: ""; height: 100%; left: 0; position: absolute; transition: background-position-x .6s ease; width: 100%; z-index: -1; background-position-x: 87% }
.tab_wrap_root { background:rgb(0, 15, 24); display: flex; overflow: hidden; padding: 4px; border-radius: inherit; position: relative }
.tab_pill { pointer-events: none; position: absolute; -webkit-user-select: none; -moz-user-select: none; user-select: none; border-radius: inherit; top: 4px; background:linear-gradient(to top right, #1D2333 50%, #21283B 50%); height: 36px; opacity: .8; transition: left .2s ease-in-out, width .2s ease-in-out; z-index: 1 }
.tab_glow { pointer-events: none; position: absolute; -webkit-user-select: none; -moz-user-select: none; user-select: none; border-radius: inherit; top: 4px; background: #fff; bottom: -52px; filter: blur(32px); height: 50px; transition: left .2s ease-in-out; width: 39.5px; z-index: 0 }

.sub_tab { background: transparent; border: 0; color: #888; cursor: pointer;font-size:1.25rem; font-weight: 500; height: 36px; padding:10px 20px; position: relative; text-transform: capitalize; transition: color .15s ease; z-index: 50; border-radius: inherit; flex: 1; display: flex; align-items: center; justify-content: center }
.sub_tab.active, .sub_tab:hover { color: #fafafa; text-shadow: 1px 1px 12px hsla(0, 0%, 100%, .4) }
.sub_tab:focus-visible { box-shadow: 0 0 0 1px #666 }
.sub_tabcon_wrap {position: relative; min-height: 300px }

.sub_tabcon {display: none; animation: fadeIn 0.3s ease-in-out;}
.sub_tabcon.active { display: block }

@keyframes fadeIn { from { opacity: 0; transform: translateY(10px) } to { opacity: 1; transform: translateY(0) } }

@media (max-width: 768px) {
   .sub_tab{font-size:1rem;}
}
@media (max-width: 480px) {
   .sub_tab{font-size:14px;}
}

/* sub tit */
.sub-tit{position:relative;padding-left:30px;}
.sub-tit::before {content: '';position: absolute;width: 22px;height: 22px;background: white;left: 0;top: calc(50% - 1px);transform: translateY(-50%);border-radius: 100px;border: 6px solid var(--primary);}
.sub-tit h3{font-weight:900; font-family:'NanumSquareNeo';}
.sub-tit h3 span{}
.sub-tit h5{}

.sub-tit.type02{padding-left:0;}
.sub-tit.type02::before{display: none;}
@media (max-width: 768px) {
   .sub-tit{padding-left:20px;}
   .sub-tit::before {width: 16px;height: 16px;border: 4px solid var(--primary);}
}

/*******************************************************
*/
/* thumbnail-row-type
 *******************************************************/

.thumbnail-row-type{display:flex;flex: 1;gap:25px;flex-flow: column;}
.thumbnail-row-type .row-item{display:flex;width:100%;border-radius:var(--border-radius);overflow: hidden;min-height:230px;}
.thumbnail-row-type .content-ico{max-width: 325px;max-height:360px;width: 100%;display:flex;align-items:center;justify-content:center;overflow: hidden;position: relative;z-index: 2;}
.thumbnail-row-type .content-ico img{width:100%;height: 100%;object-fit: cover;}
.thumbnail-row-type .content-area{background: rgb(31, 41, 55);width:100%;display: flex;flex-flow:column;flex: 1;justify-content: center;position: relative;z-index: 2;}


@media (max-width: 1600px) {
   .thumbnail-row-type .row-item{min-height:220px;}
   .thumbnail-row-type .content-ico{max-width:270px;}
}


@media (max-width: 1200px) {
   .thumbnail-row-type .row-item{min-height:200px;}
   .thumbnail-row-type .content-ico{max-width:250px;}
}

@media (max-width:1024px) {
   .thumbnail-row-type{gap:20px;}
   .thumbnail-row-type .row-item{flex-direction:column;min-height:auto;}
   .thumbnail-row-type .content-ico{max-width:100%;}
   .thumbnail-row-type .content-area{padding:1.8rem 1.5rem;}
}

@media (max-width:768px) {
   .thumbnail-row-type .content-area{padding:1.2rem;}
}

/*******************************************************
*/
/* thumbnail-col-type
 *******************************************************/
.thumbnail-col-type {}
.thumbnail-col-type .col-type-item{background:var(--variant);position:relative;}

.thumbnail-col-type .title-area{width: 100%;max-width: 250px;position: absolute;left: -2px;top: -2px;padding: 2px 16px 16px 2px;background-color:#fff;text-align: right;border-radius: 0 0 32px 0;}
.thumbnail-col-type .title-area:before {content: "";position: absolute;left: 0;bottom: -4rem;width: 4rem;height: 4rem;overflow: hidden;border-radius:100px;box-shadow: -2rem -2rem 0 0 #fff;}
.thumbnail-col-type .title-area:after {content: "";position: absolute;right: -4rem;top: 0;width: 4rem;height: 4rem;overflow: hidden;border-radius: 100px;box-shadow: -2rem -2rem 0 0 #fff;}
.thumbnail-col-type .title-area h5{font-family: 'NanumSquareNeo';font-weight:700; border-radius:100px;height: 58px;position: relative;z-index: 1;margin: 2px 2px 0 0;line-height: 58px;color: #000;text-align: center;background-color:var(--variant);letter-spacing: -.5px;}

.thumbnail-col-type .text-box{padding-top:6rem;}


/*******************************************************
*/
/* ico-col-type
 *******************************************************/
.ico-col-type .card-content{text-align: center;height:100%;width:100%;}
.ico-col-type .ico-col-item h5{font-weight:bold;color:#000;}
.ico-col-type .ico-col-item h6{font-weight:bold;color:#000;}
.ico-col-type{gap:20px;}
.ico-col-type .content-area{position: relative;}
.ico-col-type .content-area span{font-size: 1rem;padding: 7px 22px;display:inline-flex;color:var(--primary);font-family:'NanumSquareNeo';font-weight:bold;border-radius: 100px;background:white;}

.ico-col-type .content-ico {margin:0 auto;background:#EAECF0;padding:1.2rem;border-radius:100px;width:100px;height:100px;display: flex;align-items: center;justify-content: center;}

@media (max-width:1024px) {
   .ico-col-type{gap:12px;}
}
@media (max-width:480px) {
   .ico-col-type{gap:10px;}
   .ico-col-type .content-area span{font-size:0.875rem;}
   .ico-col-type .content-ico{width:80px;height:80px;}
}

/*******************************************************
*/
/* scan / care / build
 *******************************************************/
.card-content h5{font-weight:300;color:var(--gray-600);line-height: 1.5;}
.card-content h5 b{font-weight:500;}
.card-content p{font-weight:300;color:var(--gray-600);line-height: 1.5;}

.sub-form .contact-form{background: transparent;}

.card-content .notice{font-family:'NanumSquareNeo';margin-bottom:8px; }


.history-area{position: relative;}
.history-area .text-box{text-align: center;position: relative;z-index: 10;}
.history-area h5{ color: white; font-weight: 300; line-height: 1.3;}
.history-area h3{ color: white; font-weight:700; line-height: 1.3;font-family:'NanumSquareNeo';}
.history-area .highlight { background: linear-gradient(45deg, #ff6b35, #ff8c42); color: white; padding:0 3px;display: inline-block; font-weight: bold; position: relative; box-shadow: 0 4px 15px rgba(255,107,53,0.3); }

.history-area-bg{background-size: cover !important;background-position: center center;position: absolute;width: 100%;height: 100%;top: 0;left: 0;right: 0;animation: backgroundZoomRotate 5s ease-out forwards;transform: scale(1.1);}
.history-area-bg.bg-02{background-image: url('../img/sub/history-bg-02.jpg');}
.history-area-bg.bg-03{background-image: url('../img/sub/history-bg-03.jpg');}


@keyframes backgroundZoomRotate { 0% {transform: scale(1.1) rotate(0deg);} 100% {transform: scale(1.0) rotate(0.002deg);} }

.benefit-area{gap:20px;}
.benefit-area .content-ico img{margin: 0 auto;width:auto;height: 100%;object-fit: cover;}
.benefit-area .content-area{padding-top:0;}
.benefit-area .content-area h6{font-weight:400;color:var(--gray-600);}

.benefit-area .content-ico{display:flex;justify-content:center;align-items:center;transition:all 0.4s ease;width: 100%;height:240px;margin: 0 auto;}
.benefit-area .content-ico img{transition:all 0.4s cubic-bezier(0.25,0.46,0.45,0.94);}


.benefit-area .col-type-item:nth-child(1) .content-ico img{animation:iconSlide 3s ease-in-out infinite;}
.benefit-area .col-type-item:nth-child(2) .content-ico img{animation:iconBounce 3s ease-in-out infinite;}
.benefit-area .col-type-item:nth-child(3) .content-ico img{animation:iconFloat 3s ease-in-out infinite;}

@keyframes iconSlide{0%{transform:translateX(-15px);}50%{transform:translateX(15px);}100%{transform:translateX(-15px);}}
@keyframes iconBounce{0%,20%,50%,80%,100%{transform:translateY(0);}40%{transform:translateY(-15px);}60%{transform:translateY(-8px);}}
@keyframes iconFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-12px);}}


@media (max-width:1600px) {
   .benefit-area .content-area{padding:0;}
}
@media (max-width:1200px) {
   .benefit-area .content-ico{height:220px;}
}
@media (max-width:960px) {
   .benefit-area{grid-template-columns: repeat(2, 1fr);}
}
@media (max-width:660px) {
   .benefit-area .content-ico {height: 200px;}
   .benefit-area{grid-template-columns: repeat(1, 1fr);}
   .thumbnail-col-type .text-box{padding-top:5rem;}
}