@charset "utf-8";

/********** 
** mainPopup
***********/
.popupBox{background:rgba(0,0,0,0.5);left:0;top:0; z-index: 99999999999;display:none}
.popupBtnBox button{background:transparent;cursor: pointer;}
.popupSwiper{width:100%}
.popupSwiper .swiper-slide{overflow:hidden; line-height: 0;}
.popupSwiperBtnBox button{background:transparent; border:1px solid #f7f8f8; cursor: pointer;}
.popupSwiperBtnBox span{border:1px solid #f7f8f8}
#popupPrev span{border-width:0px 0px 1px 1px; transform:rotate(45deg);left:2px}
#popupNext span{border-width:1px 1px 0px 0px; transform:rotate(45deg); left:-2px}

/*******************
** header 
********************/
.headerCnt {box-shadow:4px 4px 8px rgba(157,4,4,0.20);}
header {position: fixed;top: 0;left: 0;width: 100%;background-color: transparent;transition: background-color 0.3s ease, box-shadow 0.3s ease;z-index: 100;}
header.active {background-color: #fff;box-shadow: 0 2px 8px rgba(0,0,0,0.08);}
.quickbtn {right:2%; bottom:15%; max-width:110px; box-shadow:4px 4px 8px rgba(0,0,0,0.05);}
.quickbtnLine {border-bottom:1px solid #D9DADE;}


/********************
** index
********************/
/** mainBaner **/
.mainBanner1 {background-image:url('/img/mainBanner-001.jpg'); background-size:cover; background-position:center;}
.mainBanner2 {background-image:url('/img/mainBanner-002.jpg'); background-size:cover; background-position:center;}
.mainBanner3 {background-image:url('/img/mainBanner-003.jpg'); background-size:cover; background-position:center;}
.mainBanner4 {background-image:url('/img/mainBanner-004.jpg'); background-size:cover; background-position:center;}
.swiper-pagination-bullet {background:none !important; border:1px solid #F7F8F8; opacity:1 !important;}
.swiper-pagination-bullet-active {background:#F7F8F8 !important;}

/** intro **/
.introCntLine {border:1px solid #D9DADE; box-shadow:8px 8px 16px #EEEEF0;}
.introCnts {display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: auto;}
@media (max-width: 768px) {.introCnts {grid-template-columns: 1fr;}}

/** service **/
.serviceCntLine {border:1px solid #D9DADE; box-shadow:8px 8px 16px #EEEEF0;}
.serviceCnts {display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows:auto;}
@media (max-width:768px) {.serviceCnts {grid-template-columns:1fr;}}
.serviceCntBg {right:0; top:0;}

/** benefit **/
.benefitCntsLine {border:1px solid #D9DADE; box-shadow:8px 8px 16px #EEEEF0;}
.benefitCnts {display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows:auto;}
@media (max-width:768px) {.benefitCnts {grid-template-columns:1fr;}}

/** benefit_5 **/
.benefit_5TableWrap {border: 1px solid #D9DADE; overflow: hidden; overflow-x: auto; overflow-y: hidden; width: 100%; -webkit-overflow-scrolling: touch;}
.benefit_5Table {border-collapse: collapse; width: 100%;}
.benefit_5Table th,
.benefit_5Table td {border: 1px solid #B8BAC1; white-space: nowrap;}



/** contact **/
.contactBg {background: linear-gradient(to right, #FEF2F2, #F9E4E4); box-shadow:-1px -1px 4px #FFC9C9;}
.contactBoxLine { border:1px solid #B8BAC1; }
#policy{position:absolute;left:-999999px;}
#policy + label .chkIcon{display:inline-block;width: 20px; height:20px; margin-right:8px; background: url('/img/chkOff.svg') center center no-repeat; background-size: cover;}
#policy:checked + label .chkIcon{background-image: url('/img/chkOn.svg');}
.mainContactFormLabel{left:50%; top:-40px; transform:translateX(-50%)}
.contactBnt {box-shadow:4px 4px 16px rgba(157,4,4,0.20);}

/********************
** contactList
********************/
.contactTbl td{border-bottom:1px solid #d9dade; border-right:1px solid #d9dade;}
.contactTbl td:last-child {border-right: none;}


/********************
** contactView
********************/
.contactViewCnt p:nth-child(1){border-top:1px solid #d9dade}
.contactViewCnt p:nth-child(2){border-top:1px solid #eeeef0}
.contactViewBox .contactViewCnt:nth-last-child(1) p:nth-child(1){border-bottom:1px solid #d9dade}
.contactViewBox .contactViewCnt:nth-last-child(1) p:nth-child(2){border-bottom:1px solid #eeeef0}
.contactBtn{border:1px solid #d9dade}


/********************
** policy
********************/
.policyTit{border-bottom:1px solid #26272b}

/********************
** login
********************/
.login{background:url('/img/mainBanner-001.jpg')center center no-repeat; background-size:cover}
.iptText {border:1px solid #D9DADE;}

/********************
** adminMenu
********************/
.adminMenu{box-shadow:0 0 8px rgba(0,0,0,0.25)}