@charset "utf-8";

/* hr System
--------------------------------------------------------- */
.txt {
  display: block;
}

.sec-hr-system {
  margin-block: 90px;
}

.sec-hr-system .system .system-detail {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.sec-hr-system .system-left {
  width: 49%;
}

.sec-hr-system .system-list {
  padding-top: 5px;
}

.sec-hr-system .request-btn {
  margin-top: -3px;
}

.sec-hr-system .system-right {
  width: 47.1%;
  margin-top: -4px;
}

.sec-hr-system .system-right img {
  max-width: 500px;
}

.sec-hr-system .hr-sytem-function .pos {
  position: relative;
  margin: 52px auto 30px;
  text-align: center;
  max-width: 599px;
}

.sec-hr-system .hr-sytem-function .pos a {
  position: absolute;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-01 {
  top: 8%;
  left: 29.5%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-01 img {
  max-width: 76px;
}

.sec-hr-system .hr-sytem-function .pos p {
  line-height: 1.5;
  padding: 12px 0;
  font-size: 13px;
  font-weight: 500;
  text-align: center;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-02 {
  top: 8.3%;
  right: 34%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-02 img {
  max-width: 52px;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-03 {
  top: 22.5%;
  right: 12%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-03 img {
  max-width: 51px;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-04 {
  right: 3.6%;
  bottom: 33.5%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-04 img {
  max-width: 73px;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-05 {
  right: 17.5%;
  bottom: 11.5%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-05 img {
  max-width: 77px;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-06 {
  bottom: 2.5%;
  left: 41.5%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-06 img {
  max-width: 53px;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-07 {
  bottom: 11.4%;
  left: 18.2%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-07 img {
  max-width: 71px;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-08 {
  bottom: 32.5%;
  left: 3.5%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-08 img {
  max-width: 55px;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-09 {
  top: 22%;
  left: 6.5%;
}

.sec-hr-system .hr-sytem-function .pos .pos-function-09 img {
  max-width: 54px;
}

.sec-hr-system .hr-sytem-function .hr-sytem-info li {
  display: flex;
  margin-bottom: 29px;
  box-shadow: 0 2px 8px rgba(45, 187, 84, 0.1);
  border-left: 2px solid #2DBB54;
}

.sec-hr-system .hr-sytem-function .hr-sytem-info li .img-blk {
  width: 11%;
  padding: 20px 10px 20px 19px;
}

.sec-hr-system .hr-sytem-function .hr-sytem-info li .img-blk img {
  max-width: 80px;
}

.sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk {
  width: 88%;
  padding: 26px 10px 3px 2px;
}

.sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk p {
  line-height: 1.8;
  padding: 14px 0;
  color: #606060;
}

.sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk .paragraph {
  padding: 2px 0 15px 0;
}

.sec-hr-system .system-ttl {
  margin-bottom: 40px;
  font-family: 'Poppins', sans-serif;
}

.sec-hr-system .hr-system .sec-ttl {
  padding-top: 5px;
}

.sec-hr-system .hr-sytem-info.system {
  margin-bottom: 22px;
  padding-block: 0 50px;
  border-bottom: 1px solid #2dbb54;
}

.sec-hr-system .hr-overview .sec-ttl {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
}

.sec-hr-system .ancr-links {
  position: -webkit-sticky;
  position: sticky;
  top: 107px;
  z-index: 99;
  width: 88%;
  margin: 40px auto 0;
  box-shadow: 0 5px 8px rgba(45, 187, 84, 0.15);
  background-color: #FFFFFF;
  border-radius: 24px;
  display: flex;
}

.sec-hr-system .ancr-links li {
  width: 25%;
  text-align: center;
}

.sec-hr-system .ancr-links li a {
  width: 100%;
  line-height: 1.5;
  padding: 8px;
  color: #2DBB54;
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 600;
  border-radius: 24px;
}

.sec-hr-system .ancr-links li a:hover,
.sec-hr-system .ancr-links li a.active {
  background-color: #F3FCF7;
}

.sec-hr-system .hr-overview .hr-img {
  margin: 0 auto;
  text-align: center;
}

.sec-hr-system .hr-overview .hr-txt {
  position: relative;
  width: 77.5%;
  line-height: 2.1;
  margin: 0 auto;
  padding: 3% 4.6% 0;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
}

.sec-hr-system .hr-overview .hr-txt::before,
.sec-hr-system .hr-overview .hr-txt::after {
  position: absolute;
  top: 28px;
  width: 21px;
  height: 16px;
  content: '';
}

.sec-hr-system .hr-overview .hr-txt::before {
  left: 0;
  background: url('../img/hr-system/ico_open_double_code.png') no-repeat center/cover;
}

.sec-hr-system .hr-overview .hr-txt::after {
  right: 0;
  background: url('../img/hr-system/ico_close_double_code.png') no-repeat center/cover;
}

.sec-hr-system .hr-overview .hr-txt span {
  color: #2DBB54;
}

.sec-hr-system .system-report .report-img {
  margin: 0 auto;
  text-align: center;
}

.sec-hr-system .system-report .report-list {
  padding: 50px 100px 0;
}

.sec-hr-system .system-report .report-list li {
  position: relative;
  top: 0;
  line-height: 1.8;
  margin: 3px 0;
  padding: 20px 20px 15px 66px;
  font-size: 16px;
  cursor: pointer;
  transition: top 0.2s linear;
  border-radius: 7px;
}

.sec-hr-system .system-report li::before {
  position: absolute;
  top: 24px;
  left: 34px;
  width: 16px;
  height: 17px;
  background: url('../img/hr-system/img_report_icon.png') no-repeat center/contain;
  content: '';
}

.sec-hr-system .system-report .report-list li:hover {
  top: -10px;
  box-shadow: 0 0 11px rgba(45, 187, 84, 0.25);
}

.sec-hr-system .system-report.system {
  margin-bottom: 29px;
  padding-bottom: 50px;
  border-bottom: 1px solid #2dbb54;
}

.sec-hr-system .services-txt-blk {
  display: flex;
  padding-top: 25px;
}

.sec-hr-system .hr-overview .system {
  margin-bottom: 0;
  padding: 51px 0px 49px 0px;
  border-bottom: 1px solid #2dbb54;
}

.sec-hr-system .system-report,
.sec-hr-system .hr-overview,
.sec-hr-system .hr-sytem-function,
.sec-hr-system .services-pos {
  margin-top: -60px;
  padding-top: 120px;
}

/* Ipad
-----------------------------------------------------------------*/
@media only screen and (min-width:769px) and (max-width:1024px) {
  .txt {
    display: none;
  }

  .sec-hr-system {
    margin-block: 7.789vw;
  }

  .sec-hr-system .hr-overview .system {
    padding: 4.98vw 0vw 4.785vw 0vw;
  }

  .sec-hr-system .system .system-detail {
    flex-direction: column;
  }

  .sec-hr-system .system-list {
    padding-top: 1.855vw;
  }

  .sec-hr-system .request-btn {
    margin-top: -0.293vw;
  }

  .sec-hr-system .system-left {
    width: 100%;
  }

  .sec-hr-system .system-right {
    width: 100%;
    margin-top: 2.512vw;
    text-align: center;
  }

  .sec-hr-system .system-right img {
    max-width: 48.828vw;
  }

  .sec-hr-system .hr-sytem-function .pos {
    margin: 5.078vw auto 2.930vw;
    max-width: 58.496vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-01 img {
    max-width: 7.422vw;
  }

  .sec-hr-system .hr-sytem-function .pos p {
    padding: 1.172vw 0;
    font-size: 1.270vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-02 img {
    max-width: 5.078vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-03 img {
    max-width: 4.980vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-04 img {
    max-width: 7.129vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-05 img {
    max-width: 7.520vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-06 img {
    max-width: 5.176vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-07 img {
    max-width: 6.934vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-08 img {
    max-width: 5.371vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-09 img {
    max-width: 5.273vw;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li {
    margin-bottom: 2.832vw;
    border-left: 0.195vw solid #2DBB54;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .img-blk {
    width: 14%;
    padding: 1.953vw 0.977vw 1.953vw 1.855vw;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .img-blk img {
    max-width: 7.813vw;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk {
    width: 86%;
    padding: 2.539vw 0.977vw 0.293vw 0.195vw;
    font-size: 2.083vw;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk p {
    padding: 1.367vw 0;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk .paragraph {
    padding: 0.195vw 0 1.465vw 0;
  }

  .sec-hr-system .system-ttl {
    margin-bottom: 3.906vw;
  }

  .sec-hr-system .hr-system .sec-ttl {
    padding-top: 0.488vw;
  }

  .sec-hr-system .hr-sytem-info.system {
    margin-bottom: 2.148vw;
  }

  .sec-hr-system .hr-overview {
    padding: 0.195vw 0 1.953vw;
  }

  .sec-hr-system .ancr-links {
    top: 10.449vw;
    margin: 3.906vw auto 5.664vw;
    box-shadow: 0 0.488vw 0.781vw rgba(45, 187, 84, 0.15);
    border-radius: 2.344vw;
  }

  .sec-hr-system .ancr-links li a {
    padding: 0.781vw;
    font-size: 2.083vw;
    border-radius: 2.344vw;
  }

  .sec-hr-system .hr-overview .hr-img {
    width: 92.1%;
    max-width: 95.313vw;
  }

  .sec-hr-system .hr-overview .hr-txt {
    width: 95.5%;
    padding: 3% 3.7% 0;
    font-size: 2.083vw;
  }

  .sec-hr-system .hr-overview .hr-txt::before,
  .sec-hr-system .hr-overview .hr-txt::after {
    top: 2.734vw;
    width: 2.051vw;
    height: 1.563vw;
  }

  .sec-hr-system .system-report .report-img {
    width: 40.3%;
    max-width: 41.699vw;
  }

  .sec-hr-system .system-report .report-list {
    padding: 4.883vw 9.766vw 0;
  }

  .sec-hr-system .system-report .report-list li {
    margin: 0.293vw 0;
    padding: 1.953vw 1.953vw 1.465vw 6.445vw;
    font-size: 2.083vw;
    border-radius: 0.684vw;
  }

  .sec-hr-system .system-report li::before {
    top: 2.344vw;
    left: 3.32vw;
    width: 1.563vw;
    height: 1.66vw;
  }

  .sec-hr-system .system-report .report-list li:hover {
    top: -0.977vw;
    box-shadow: 0 0 1.074vw rgba(45, 187, 84, 0.25);
  }

  .sec-hr-system .system-report.system {
    margin-bottom: 2.832vw;
    padding-bottom: 5.078vw;
  }

  .sec-hr-system .services-txt-blk {
    padding-top: 2.441vw;
    flex-direction: column;
  }

  .sec-hr-system .system-report,
  .sec-hr-system .hr-overview,
  .sec-hr-system .hr-sytem-function,
  .sec-hr-system .services-pos {
    margin-top: -5.859vw;
    padding-top: 11.719vw;
  }
}

/* SP
-----------------------------------------------------------------*/
@media only screen and (max-width:768px) {
  .txt {
    display: none;
  }

  .sec-hr-system {
    margin-block: 11.72vw;
  }

  .sec-hr-system .hr-overview .system {
    padding: 6.641vw 2.344vw 6.381vw;
  }

  .sec-hr-system .system .system-detail {
    flex-direction: column;
  }

  .sec-hr-system .system-left {
    width: 100%;
  }

  .sec-hr-system .system-list {
    padding-top: 2.525vw;
  }

  .sec-hr-system .request-btn {
    margin-top: 0;
  }

  .sec-hr-system .system-right {
    width: 100%;
    margin: 4.319vw auto 2.031vw;
    padding: 0 3.125vw 0 1.875vw;
  }

  .sec-hr-system .system-right img {
    width: 100%;
    max-width: 86.875vw;
  }

  .sec-hr-system .hr-sytem-function .pos {
    margin: 5.313vw auto 5.469vw;
    max-width: 90.625vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-img {
    width: 100%;
  }

  .sec-hr-system .hr-sytem-function .pos a {
    position: absolute;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-01 {
    left: 30%;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-01 img {
    max-width: 11.336vw;
  }

  .sec-hr-system .hr-sytem-function .pos p {
    padding: 1.705vw 0;
    font-size: 1.875vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-02 img {
    max-width: 7.813vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-03 {
    right: 12.5%;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-03 img {
    max-width: 7.778vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-04 {
    right: 3.7%;
    bottom: 33.8%;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-04 img {
    max-width: 11.394vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-05 {
    right: 17.5%;
    bottom: 11.5%;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-05 img {
    max-width: 11.563vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-06 {
    left: 42%;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-06 img {
    max-width: 7.969vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-07 {
    left: 19%;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-07 img {
    max-width: 10.702vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-08 {
    bottom: 33%;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-08 img {
    max-width: 8.230vw;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-09 {
    left: 7%;
  }

  .sec-hr-system .hr-sytem-function .pos .pos-function-09 img {
    max-width: 8.125vw;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li {
    margin-bottom: 4.531vw;
    border-left: 0.313vw solid #2DBB54;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .img-blk {
    width: 15%;
    padding: 2.344vw 1.875vw;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .img-blk img {
    margin: 0 auto;
    max-width: 9.531vw;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk {
    width: 85%;
    padding: 3.125vw 1.781vw 0.469vw 1.313vw;
    font-size: 3.2vw;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk p {
    padding: 1.875vw 0 1.875vw 0;
  }

  .sec-hr-system .hr-sytem-function .hr-sytem-info li .txt-blk .paragraph {
    padding: 0.313vw 0 2.344vw 0;
  }

  .sec-hr-system .system-ttl {
    margin-bottom: 6.25vw;
  }

  .sec-hr-system .ancr-links {
    top: 16.719vw;
    width: 95.5%;
    margin: 6.25vw auto 0;
    box-shadow: 0 0.781vw 1.25vw rgba(45, 187, 84, 0.15);
    border-radius: 3.75vw;
  }

  .sec-hr-system .ancr-links li a {
    padding: 1.25vw;
    font-size: 3.5vw;
    border-radius: 3.75vw;
  }

  .sec-hr-system .hr-overview .hr-img {
    width: 96.6%;
    max-width: 92.344vw;
  }

  .sec-hr-system .hr-overview .hr-txt {
    width: 94.9%;
    line-height: 2.2;
    padding: 8% 5.5% 0;
    font-size: 3.5vw;
  }

  .sec-hr-system .hr-overview .hr-txt::before,
  .sec-hr-system .hr-overview .hr-txt::after {
    top: 6.688vw;
    width: 3.281vw;
    height: 2.5vw;
  }

  .sec-hr-system .hr-overview .hr-txt::after {
    top: inherit;
    bottom: 0;
  }

  .sec-hr-system .system-report.system {
    margin-bottom: 4.531vw;
    padding-bottom: 8.225vw;
  }

  .sec-hr-system .system-report {
    padding-top: 9.688vw;
  }

  .sec-hr-system .system-report .report-img {
    width: 73.7%;
    max-width: 66.719vw;
  }

  .sec-hr-system .system-report .report-list {
    padding: 7.813vw 3vw 0;
  }

  .sec-hr-system .system-report .report-list li {
    margin: 0.469vw 0;
    padding: 3.125vw 3.125vw 2.344vw 10.313vw;
    font-size: 3.5vw;
    border-radius: 1.094vw;
  }

  .sec-hr-system .system-report li::before {
    top: 3.75vw;
    left: 5.313vw;
    width: 2.5vw;
    height: 2.656vw;
  }

  .sec-hr-system .system-report .report-list li:hover {
    top: -1.563vw;
    box-shadow: 0 0 1.719vw rgba(45, 187, 84, 0.25);
  }

  .sec-hr-system .system-report,
  .sec-hr-system .hr-overview,
  .sec-hr-system .hr-sytem-function,
  .sec-hr-system .services-pos {
    margin-top: -9.375vw;
    padding-top: 18.75vw;
  }

  .sec-hr-system .services-txt-blk {
    flex-direction: column;
  }

}