@charset "utf-8";

/********************
** header
********************/
header {top: 0;left: 0;background: rgba(255, 255, 255, 0.2);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);border-bottom: 1px solid rgba(255, 255, 255, 0.3);box-shadow: 0 2px 20px rgba(0, 0, 0, 0.05);}


/********************
** index
********************/

/**** mainBanner ****/
.mainBanner {background-image: url(/img/mainBanner.jpg); background-position:center; background-size:cover;}
.mainScroll{left:50%; bottom:0; transform:translateX(-50%);}

/**** keysolution ****/
.keysolution {background: url(/img/keysolutionBg.jpg); background-position:center; background-size:cover;}
.keysolutionLine {border-bottom:1px solid rgba(247, 248, 248, 0.1);}
.keysolutionM {background-color: rgba(247, 248, 248, 0.1);}

/**** advantage ****/
.advantage {
    /* 사파리·크롬(WebKit) */
    background: -webkit-linear-gradient(top, #fff 0%, #EEF7FF 100%);  
    /* 파이어폭스(Gecko) */
    background: -moz-linear-gradient(top, #fff 0%, #EEF7FF 100%);  
    /* 표준 */
    background: linear-gradient(to bottom, #fff 0%, #EEF7FF 100%);
  }
  
/**** case ****/
.caseBtns button {border:none; background:none; transition: color 0.2s ease}
.caseBtns button.active {font-weight: 700;color: #1B6BF5;border-bottom: 2px solid #1B6BF5;}
.caseLine {border:1px solid #B8BAC1;}

.case-item.hidden {display: none;}

.case-list.collapsed {position: relative; overflow: hidden;}
.case-list.collapsed::after {content: "";position: absolute;left: 0; right: 0; bottom: 0;height: 600px; pointer-events: none;z-index: 10;background: linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);}
  
/***** contact ****/
.contact {background: url(/img/contact.jpg); background-position:center; background-size:cover;}

/**** archive ****/
.archivesLine {border-bottom:1px solid #EEEEF0;}
.archiveLine {border-bottom:1px solid #5D606C;}


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

/********************
** contact
********************/
.contactFormLine {box-shadow: 0px 0px 4px #D9DADE;}
.contactLine {border:1px solid #D9DADE;}

.policyInputVisuallyHidden {position: absolute;opacity: 0;width: 20px;height: 20px;margin: 0;z-index: 1;}
.policyLabel {display: inline-flex;align-items: center; gap: 8px;cursor: pointer;position: relative;}
.policyLabel::before {content: "";display: inline-block;width: 20px;height: 20px;background: url("/img/chkOff.svg") no-repeat center / contain;flex: 0 0 20px; border:1px solid #F7F8F8; border-radius:4px;}
#policy:checked + .policyLabel::before {background-image: url("/img/chkOn.svg");}

/********************
** online, onlineView
********************/
.onlineViews {border-top:1px solid #D9DADE; border-bottom:1px solid #D9DADE;}
.onlineViews tr {border-top:1px solid #D9DADE;}
.onlineListBtn {border:1px solid #D9DADE;}
.styleN {border:none;}
.onlineLine {border:1px solid #D9DADE;}
.onlineLists {border-top:1px solid #D9DADE; border-bottom:1px solid #D9DADE;}
.onlineLists tr{border-top:1px solid #D9DADE;}
.onlineLists tr th:not(:last-child){border-right:1px solid #D9DADE;}
.onlineLists tr td:not(:last-child){border-right:1px solid #D9DADE;}