@charset "utf-8";

/********************
** header
********************/
.headerBtnLine {border:1px solid #2176EF;}

/********************
** index
********************/
/** mainBanner **/
.mainBanner {background:url('/img/mainBanner.jpg'); background-position:center; background-size:cover;}
/** subBanner **/
.subBanner .inner {top:0; left:50%; transform:translate(-50%, -50%);}
.subBannerBox{box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.25);}
/** about **/
.aboutVideoWrap {width:min(100%, 1120px); aspect-ratio:16/9; overflow:hidden;}
.aboutVideo {display:block; width:100%; height:100%; border:0;}
/** overrview **/
.overrviewLight {right:-50px; top:-50px;}
/** feature **/
.feature {background:url('/img/featureBg.jpg'); background-position:center; background-size:cover;}
.featureCnts {display:grid; grid-template-columns:repeat(3, 1fr);}
/** shop **/
.shopRightBg {top:0; right:0;}
.shopLeftBg {bottom:0; left:0;}
.shopBnts {max-height: 450px; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch;}
.shopBnts .active{box-shadow:0 0 8px #B8BAC1; background:#FFF;}
/** service **/
.service {background:url('/img/serviceBg.jpg'); background-position:center; background-size:cover;}
/** service **/
.serviceTop {border-radius:24px 24px 0 0;}
.serviceBottom {border-radius:0 0 24px 24px;}
.serviceBox {box-shadow:0 8px 16px #D9DADE;}
.serviceVideoWrap {aspect-ratio:16/9; overflow:hidden;}
.serviceVideo {display:block; aspect-ratio:16/9; border:0;}
.serviceObject-001 {bottom:-130px; right:-130px;}
.serviceObject-002 {top:66px; left:-148px;}
.serviceModalOverlay {position: fixed; inset: 0; background: rgba(0, 0, 0, 0.6); display: flex; align-items: center; justify-content: center; z-index: 2000;}
.serviceModalOverlay[hidden] {display:none !important;}
.serviceModalContent {position: relative; width: min(100%, 900px); max-height: 90dvh; overflow-y: auto;}
.serviceModalClose {position: absolute; top: 40px; right: 40px; background: transparent; cursor: pointer;}
.serviceModalClose img {display:block; width: 24px; height: 24px;}
.serviceModalBody[hidden] {display:none;}
.serviceModalVideo {display:block; width:100%; aspect-ratio:16 / 9; border:0;}
/** recruit **/
.rectuitCnts {display:grid; grid-template-columns:repeat(3, 1fr);}
.faqQuestion {cursor:pointer;}
.faqQuestion img {transition: transform 0.25s ease;}
.faqQuestion[aria-expanded="true"] img {transform: rotate(180deg);}
.centerMarquee {--center-visible: 2.5; --center-gap: 24px; overflow: hidden;}
.centerTrack {display: flex; gap: var(--center-gap); animation: center-marquee 12s linear infinite;}
.centerSlide {flex: 0 0 calc((100% - (var(--center-gap) * (var(--center-visible) - 1))) / var(--center-visible));}
.centerSlide img {display: block; width: 100%; height: auto;}
@keyframes center-marquee {
    from {transform: translateX(0);}
    to {transform: translateX(calc(-50% - (var(--center-gap) / 2)));}
}
@media (prefers-reduced-motion: reduce) {.centerTrack {animation: none;}}
/** faq **/
.faqBnts {display:grid; grid-template-columns:repeat(4,1fr);}
.faqBnts .active {background:#2176EF; color:#F7F8F8; box-shadow:0 4px 16px #D9DADE;}
.faqPane.is-hidden {display:none !important;}
.faqTable tr{border-top:1px solid #D9DADE;}
.faqTable tr:last-child{border-bottom:1px solid #D9DADE;}
.faqTable th {border-left:1px solid #D9DADE; border-right:1px solid #D9DADE;}
.faqTable td {border-right:1px solid #D9DADE;}
/** contact **/
.inputBox {border:1px solid #D9DADE;}
.contactBtns .active {background:#FFF; color:#26272B;}
.contactBtn {border-radius:16px 16px 0 0;}
.contactBox {border-radius:0 0 16px 16px;}
.contactPane.is-hidden {display:none !important;}
.custom-checkbox{width: 20px; height: 20px; padding: 0; border: 1px solid #26272B; background-color: #fff; margin-right: 10px; transition: background-color 0.3s, border 0.3s; position: relative;}
.checkpolicy input[type="checkbox"] {display: none;}
.checkpolicy input[type="checkbox"]:checked + .custom-checkbox{background-color: #3D79F4; border-color: #3D79F4;}
.checkpolicy input[type="checkbox"]:checked + .custom-checkbox::after{content: ''; position: absolute; top: 2px; left: 5px; width: 5px; height: 8px; border: solid white; border-width: 0 3px 3px 0; transform: rotate(45deg);}
.contactBtnLists {display:grid; grid-template-columns: repeat(4,1fr);}
.contactBtn2 {border:1px solid #D9DADE;}
.contactBtn2.active{background:#2176EF; color:#F7F8F8;}
.contactBtnLists2 {display:grid; grid-template-columns: repeat(3,1fr);}
.contactBtn3 {border:1px solid #D9DADE;}
.contactBtn3.active{background:#2176EF; color:#F7F8F8;}

/********************
** event
********************/
.event {background:url('/img/eventBg.jpg'); background-position:center; background-size:cover;}
.event1 {bottom:0; left:0;}
.event2 {bottom:0; right:0;}

/********************
** login
********************/
.loginBg {background:url('/img/mainBanner.jpg'); background-position:center; background-size:cover;}

/********************
** notice
********************/
/** List **/
.noticeTable th {border-top:2px solid #26272B;}
.noticeTable td {border-top:1px solid #D9DADE;}
.noticeTable tbody:last-child {border-bottom:2px solid #26272B;}

/** view **/
.noticeBLine {border-bottom:1px solid #D9DADE;}
.noticeBtnLine {border:1px solid #D9DADE;}

/********************
** notice
********************/
/** List **/
.sonsultTable th {border-bottom:1px solid #D9DADE; border-top:1px solid #D9DADE; border-right:1px solid #D9DADE;}
.sonsultTable th:last-child {border-right:none;}
.sonsultTable td {border-bottom:1px solid #D9DADE; border-top:1px solid #D9DADE; border-right:1px solid #D9DADE;}
.sonsultTable td:last-child {border-right:none;}

.consiltCntLine {border-top:1px solid #EEEEF0;}
.consiltCnts .consiltCntLine:last-child {border-bottom:1px solid #EEEEF0;}