@charset "utf-8";
/********************
** common
********************/
.linkBtn{border:1px solid #000}
.linkBtn2{border:1px solid #f7f8f8}
.hrPoint{border:1px solid #eeeef0; border-width:0 0 1px 0}
.linkBtnBlue{background:rgba(59,121,188,0.7); box-shadow:inset 1px 1px 2px rgba(255,255,255,0.25)}

/** subBanner **/
.subBanner{background-size:cover !important}
.ceo, .organization, .location{background:url('/img/subBanner-001.jpg')center center no-repeat}
.law, .insurance, .hr, .laborcase, .torment{background:url('/img/subBanner-002.jpg')center center no-repeat}
.employment{background:url('/img/subBanner-006.jpg')center center no-repeat}
.workplacedisable{background:url('/img/subBanner-003.jpg')center center no-repeat}
.welfare{background:url('/img/subBanner-004.jpg')center center no-repeat}
.contactform{background:url('/img/subBanner-005.jpg')center center no-repeat}

.subMenu{border-bottom:1px solid #d9dade}
.subMenu a{border:1px solid #d9dade; border-right:0; border-bottom:0; align-self: stretch;}
.subMenu a:nth-last-child(1){border-right:1px solid #d9dade}
.subMenu a.active{border-bottom:4px solid #2B60A1; color:#2b60a1}

/********************
** header
********************/
header{left:0;top:0; border-bottom: 1px solid #91949f;}
.toggleBtn{cursor: pointer;}
.toggleBtn span{transition: ease-in-out 0.3s;}
.toggleBtn span:nth-child(1){left:0; top:0}
.toggleBtn span:nth-child(2){left:0; top:10px; }
.toggleBtn span:nth-child(3){left:0; top:20px}

.toggleBtn.active span:nth-child(1){left:50%; top:50%; transform: translate(-50%, -50%) rotate(45deg); background:#fff}
.toggleBtn.active span:nth-child(2){left:9999px; top:10px; }
.toggleBtn.active span:nth-child(3){left:50%; top:50%; transform: translate(-50%, -50%) rotate(-45deg);background:#fff}

.dropDownCnt a{border-bottom:1px solid #eeeef0}
.dropMenuArrow{transform: rotate(180deg); transition: ease-in-out 0.3s;}
.dropDownMenu.active .dropMenuArrow{transform: rotate(0deg);}
/********************
** index
********************/
/** popup **/
.popup{background:rgba(0,0,0,0.5); left:0; top:0}
.popupCnt{overflow:hidden}
.popup a{cursor: pointer;}
.popup[hidden] { display: none !important; }

/** mainBanner **/
.mainBanner{background:url('/img/mainBanner.jpg')center center no-repeat; background-size:cover}
.mainBannerShadow{text-shadow: 0 0 8px rgba(0,0,0,0.25);}

/** mainService **/
.mainService a{background-size:cover !important}
.mainService a:nth-child(1){background:url('/img/mainService-001.jpg')center center no-repeat}
.mainService a:nth-child(2){background:url('/img/mainService-002.jpg')center center no-repeat}
.mainService a:nth-child(3){background:url('/img/mainService-003.jpg')center center no-repeat}
.mainService a:nth-child(4){background:url('/img/mainService-004.jpg')center center no-repeat}

/** mainSolution **/
.mainSloganBox{width:1200px}
.mainSloganBox > div{background:rgba(151,186,226,0.5); border:2px solid #c8daef}
.mainSloganBox > div.wpA{left:50%; transform:translateX(-50%)}

/** mainPartner **/
.mainPartner{background:url('/img/partnerBg.jpg')}
.mainPartnerBox{border:1px solid #5f96d1}
.mainPartnerBox > div{overflow: hidden;}
.mainPartnerBox > div > div{border:1px solid #c8daef; align-self: stretch;}

/** mainLocation **/
.mainLocationCnt > div{align-self: stretch; border:1px solid #91949f}
.map{width:50% !important; height:auto !important; min-height:400px !important;  border-right:0 !important; border-radius:8px 0 0 8px !important}
.mainLocationDetail{border-radius:0 8px 8px 0}

/** mainContact **/
.mainContact{background:url('/img/contactBg.jpg')center center no-repeat; background-size:cover}
.mainContactLink{align-self: stretch; box-shadow:inset 1px 1px 2px rgba(255,255,255,0.25)}
.mainContact1{background:rgba(219,195,150,0.7)}
.mainContact2{background:rgba(59,121,188,0.7)}
.mainContact3{background:rgba(65,66,75,0.7)}

/********************
** organization
********************/
.organizationCnt{width:calc(50% - 12px); border:1px solid #97bae2; align-self: stretch;}

/********************
** location
********************/
.mapContent{border-bottom:1px solid #d9dade}
.mapLocation{width:100% !important; height:480px !important}

/********************
** law
********************/
.lawServiceDetail{width:calc(33.3333333% - 16px); border:1px solid #d9dade; box-shadow:0 0 8px #eeeef0; border-top:4px solid #2b60a1; align-self: stretch;}
.lawProcessCnt{align-self: stretch; width:calc(33.33333% - 32px);border:1px solid #5f96d1; box-shadow:2px 2px 8px #c8daef}


/********************
** insurance
********************/
.insurProcesscnt{align-self: stretch; width:calc(50% - 32px);border:1px solid #5f96d1; box-shadow:2px 2px 8px #c8daef}
.insuranceTypeDetail{border:1px solid #d9dade}
.insuranceEffect{background:url('/img/expectationBg.jpg')center center no-repeat; background-size:cover}
.insuranceEffectBox{width:calc(50% - 12px); align-self: stretch;}

/********************
** hr
********************/
.hrDetail{width:calc(50% - 12px); border:1px solid #d9dade; box-shadow:0 0 8px #eeeef0; border-top:4px solid #2b60a1; align-self: stretch;}

/********************
** laboarCase
********************/
.laborNeedsBox{width:calc(33.33333% - 36px);overflow:hidden; align-self: stretch;}
.laborNeedsBoxTit{border:1px solid #2b60a1; border-radius:8px 8px 0 0}
.laborNeedsBoxCnt{border:1px solid #b8bac1; border-radius:0 0 8px 8px}

.laborCaseTypeCnt{border:1px solid #d9dade; box-shadow:0 0 8px #c8daef; border-top:4px solid #2b60a1; align-self: stretch;}
.laborCaseTypeCnt1{width:calc(50% - 12px)}
.laborCaseTypeCnt2{width:100%}
.laborCaseTypeCnt3{width:calc(33.3333% - 16px)}

.tormentEffectBox{width:calc(33.3333% - 16px); align-self: stretch;}

/********************
** employment
********************/
.employmentCaseTit1{border:1px solid #234c81}
.employmentCaseCnt{border:1px solid #d9dade}
.employmentCaseTit2{border:1px solid #3b79bc}
.employmentCaseMove{left:-26px; box-shadow: -4px 0 8px rgba(0,0,0,0.25);}

.employmentCheck{background:url('/img/expectationBg.jpg')center center no-repeat; background-size:cover}
.employmentCheckBox{width:calc(50% - 12px); align-self: stretch;}

.employmentContact{background:url('/img/subContactBg.jpg')center center no-repeat; background-size:cover}

/********************
** workplaceDisable
********************/
.workTbl td{border:1px solid #91949f}
.workTbl td.bco_gray0{border-left:0}
.workTbl tr td:nth-last-child(1){border-right:0}

/********************
** welfare
********************/
.welfareBenefit{background:url('/img/expectationBg.jpg')center center no-repeat; background-size:cover}
.welfareBenefitNotice{background:rgba(32,57,90,0.7); backdrop-filter: blur(16px);}

/********************
** contact
********************/
.contactFormBox{box-shadow: 0 0 4px #d9dade;}
.tabBtn{ border:1px solid #26272b;cursor: pointer; background:#fff; color:#26272b}
.tabBtn.isActive{ background:#26272b;color:#fff;}

.iptText{border:1px solid #d9dade}
.iptText::placeholder{color:#91949f}
.formRow input[type='radio']{left:-99999px}
.formRow input[type='radio'] + label{cursor: pointer;}
.formRow input[type='radio'] + label span{background:url('/img/radioOff.svg')center center; background-size:cover}
.formRow input[type='radio']:checked + label span{background:url('/img/radioOn.svg')center center; background-size:cover}

.formAgree input[type="checkbox"]{left:-99999px;}
.formAgree input[type="checkbox"] + label{cursor: pointer;}
.formAgree input[type="checkbox"] + label span{background:url('/img/chkOff.svg')center center; background-size:cover}
.formAgree input[type="checkbox"]:checked + label span{background:url('/img/chkOn.svg')center center; background-size:cover}
.formAgree a{text-decoration: underline;}

/********************
** contactList
********************/
.contactTbl td{border:1px solid #d9dade}

/********************
** 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.jpg')center center no-repeat; background-size:cover}

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

/********************
** footer
********************/
.fixBtnBox{right:60px; bottom:40px; cursor: pointer;}
.topBtn{box-shadow:0 0 4px rgba(0,0,0,0.25)}

.fixModal{bottom:40px; right:98px; box-shadow:0 0 16px rgba(0,0,0,0.25)}
.modalClose{cursor: pointer; filter: invert(1);}
.fixModalMore{box-shadow:inset 1px 1px 2px #eeeef0}