/* ====================================
   点呼共通パーツ：5カード比較 (.compare)
==================================== */
.compare {
   padding-top: 2rem;
   margin-bottom: 6rem;
}

.midashi_pt01 {
   color: #0055a0;
   text-align: center;
   font-size: 3rem;
   margin: 0 0 4rem;
}

.compare__inner {
   max-width: 1040px;
   margin: auto;
}

.compare__list {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   column-gap: 3%;
   row-gap: 3%;
}

.compare__item:nth-child(1) {
   grid-column: 1 / 2;
   grid-row: 1 / 2;
}

.compare__item:nth-child(2) {
   grid-column: 1 / 2;
   grid-row: 2 / 3;
}

.compare__item:nth-child(3) {
   grid-column: 2 / 3;
   grid-row: 2 / 3;
}

.compare__item:nth-child(4) {
   grid-column: 1 / 2;
   grid-row: 3 / 4;
}

.compare__item:nth-child(5) {
   grid-column: 2 / 3;
   grid-row: 3 / 4;
}

.compare__item {
   position: relative;
   width: auto;
   border-radius: 2rem;
   background: #fff;
   list-style: none !important;
   box-shadow: 0px 5px 15px rgb(25 89 194 / 15%);
}

.compare__item .tit {
   color: #fff;
   background: #0055a0;
   margin: 0;
   text-align: center;
   font-size: 1.2em;
   padding: 1rem 0;
   border-radius: 2rem 2rem 0 0;
}

.compare__item.active .tit {
   color: #000;
   background: #f0bf46;
}

.compare__item-badge {
   color: #0055A0;
   position: absolute;
   right: 14px;
   top: -15px;
   width: 58px;
   height: 58px;
   line-height: 1.1;
   font-weight: 800;
   display: flex;
   justify-content: center;
   align-items: center;
   background: #fff;
   border-radius: 100%;
   border: 1px solid #0055A0;
}

.compare__item-inner {
   padding: 3rem;
   margin: 0;
   font-size: 1.05em;
   line-height: 1.6;
   font-weight: 800;
}

.compare__item p {
   margin: 0;
}

.compare__item .pagelink {
   font-size: .9em;
   color: #0055a0;
   margin-top: .3em;
   display: flex;
   align-items: center;
}

.compare__item .pagelink span {
   margin-right: .3em;
}

.compare__item .pagelink a {
   color: #0055a0;
}

.compare__item img {
   position: absolute;
   top: calc(50% - 30px);
   height: 110px;
   right: 2rem;
}

/* ====================================
   点呼共通パーツ：IT vs 遠隔比較 (.enkaku-detail)
==================================== */
.enkaku-detail {
   background: #EBF4FF;
   padding: 8rem 0;
}

.enkaku-detail__inner {
   max-width: 1040px;
   margin: auto;
   padding: 0 2rem;
}

.enkaku-detail table {
   width: 100%;
   border-collapse: collapse;
   background: #fff;
   margin-bottom: 2rem;
}

.enkaku-detail table th,
.enkaku-detail table td {
   padding: 2rem 1rem;
   text-align: center;
   border: 1px solid #ccc;
}

.enkaku-detail table th {
   background: #eee;
}

.enkaku-detail__anlker {
   display: flex;
   justify-content: space-between;
   margin: 4rem 0 5rem;
   padding-right: 20px;
   border: 4px solid #e1e8f1;
   border-radius: 1rem;
   background: #fff;
}

.enkaku-detail__anlker li {
   list-style: none !important;
   width: 25%;
}

.enkaku-detail__anlker li a {
   color: #0055a0;
   text-decoration: none;
   font-weight: 600;
   display: block;
   padding: 2.5rem 2rem;
   text-align: center;
   border-right: 1px solid #e1e8f1;
}

.enkaku-detail__anlker li span {
   margin: -.3rem .4rem 0 0;
}

.enkaku-detail__anlker li:last-child a {
   border: none;
}

.enkaku-detail .box {
   border-radius: 2rem;
   background: #fff;
   margin-bottom: 5rem;
}

.enkaku-detail .box h3 {
   color: #fff;
   background: #0055a0;
   margin: 0;
   text-align: center;
   font-size: 1.5em;
   padding: 1.5rem 0;
   border-radius: 2rem 2rem 0 0;
}

.enkaku-detail .box .tit {
   font-weight: 700;
   font-size: 1.1em;
}

.box__inner {
   padding: 2rem 4rem 3rem;
   text-align: center;
}

.box__inner img {
   max-width: 650px;
   padding: 0;
}

.enkaku-detail__table dl {
   width: 100%;
   display: flex;
   background: #fff;
   border-radius: 1rem;
   border: 4px solid #cad9e5;
}

.enkaku-detail__table dt {
   width: 200px;
   display: flex;
   align-items: center;
   justify-content: center;
   background: #cad9e5;
}

.enkaku-detail__table dd {
   flex: 1;
   text-align: left;
   display: flex;
   align-items: center;
   justify-content: center;
   margin: 0;
   padding: 2rem 2.5rem;
}

/* ====================================
   機器比較 (.device) — IT点呼・業務前自動点呼
==================================== */
.device {
   padding: 6rem 2rem;
}

.device__box {
   position: relative;
   max-width: 750px;
   text-align: center;
   margin: 5rem auto 0;
   padding: 4rem 2rem 2rem;
   border-radius: 2rem;
   border: 5px solid #cad9e5;
}

.device__box__tit {
   position: absolute;
   top: -4rem;
   left: 0;
   text-align: center;
   margin: 0;
   width: 100%;
}

.device__box__tit span {
   font-size: 1.4em;
   background: #cad9e5;
   display: inline-block;
   border-radius: 1rem;
   padding: .5rem 3rem;
}

.device__box__img {
   position: absolute;
   right: 2rem;
   top: -5rem;
   width: 160px;
}

/* ====================================
   対応機種 (.taiou)
==================================== */
.taiou {
   text-align: center;
   margin-bottom: 8rem;
}

.taiou__tit img {
   width: 185px;
   vertical-align: bottom;
   margin-right: 10px;
}

/* ====================================
   点呼要件一覧 (.func-tenko)
==================================== */
.func-tenko {
   max-width: 1040px;
   margin: 6rem auto 0;
   padding: 0 2rem;
}

.func-tenko > h2 {
   color: #0055a0;
   text-align: center;
   font-size: 2.4rem;
   margin: 0 0 4rem;
}

.tenko-group {
   margin-bottom: 5rem;
}

.tenko-group h3 {
   font-size: 1.4em;
   padding: 6px 0 6px 15px;
   border-left: 5px solid #0055a0;
   margin: 0 0 1.5rem;
}

.tenko-group__item {
   margin-bottom: 0;
   border: 1px solid #ddd;
   border-top: none;
}

.tenko-group__item:first-child {
   border-top: 1px solid #ddd;
}

.tenko-group__item-question {
   position: relative;
   display: block;
   padding: 15px 60px 15px 20px;
   font-size: 1.1em;
   font-weight: 600;
   cursor: pointer;
   background: #fff;
   transition: background .2s;
}

.tenko-group__item-question:hover {
   background: #e8f6fc;
}

.tenko-group__item-question::-webkit-details-marker {
   display: none;
}

.tenko-group__item-question .icon {
   position: absolute;
   top: 0;
   right: 0;
   width: 55px;
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   pointer-events: none;
}

.tenko-group__item-question .icon::after {
   content: "\FF0B";
   font-size: 1.4em;
   color: #1c3c77;
}

.tenko-group__item[open] .tenko-group__item-question {
   color: #fff;
   background: #0055a0;
   border-color: #0055a0;
}

.tenko-group__item[open] .tenko-group__item-question .icon::after {
   color: #fff;
   content: "\FF0D";
}

.tenko-group__item-answer {
   border-top: none;
}

.tenko-group__item-answer .inner {
   padding: 20px 30px 30px;
   overflow: hidden;
}

.tenko-group__item-answer .inner img {
   float: none !important;
   max-width: 100%;
   height: auto;
}

.tenko-group__item-answer .inner table {
   max-width: 100%;
   table-layout: fixed;
   word-wrap: break-word;
}

.tenko-group__item-answer .inner table img {
   max-width: 100%;
   height: auto;
   width: auto !important;
}

/* ====================================
   SP対応
==================================== */
@media screen and (max-width: 767px) {
   /* compare SP */
   .midashi_pt01 {
      font-size: 1.5em;
      margin: 0 0 3rem;
   }

   .compare__list {
      display: block;
      padding-left: 0;
   }

   .compare__item {
      width: 100%;
      border-radius: 1rem;
      margin-bottom: 5%;
   }

   .compare__item .tit {
      border-radius: 1rem 1rem 0 0;
   }

   .compare__item-badge {
      top: -26px;
      width: 50px;
      height: 50px;
   }

   .compare__item img {
      height: 18vw;
      right: 1rem;
      top: calc(50% - 60px);
   }

   .compare__item-inner {
      padding: 1.2rem 2rem 1.5rem;
      font-size: 1em;
   }

   /* enkaku-detail SP */
   .enkaku-detail {
      padding: 4rem 0;
   }

   .enkaku-detail table {
      width: 700px;
   }

   .enkaku-detail__anlker {
      flex-wrap: wrap;
      margin: 0 0 2rem;
      padding-inline: 0 !important;
   }

   .enkaku-detail__anlker li {
      width: 50%;
   }

   .enkaku-detail__anlker li a {
      border-bottom: 1px solid #e1e8f1;
      padding: 2rem 2rem;
   }

   .enkaku-detail__anlker li:nth-child(2) a {
      border-right: none;
   }

   .enkaku-detail__anlker li:nth-child(3) a,
   .enkaku-detail__anlker li:last-child a {
      border-bottom: none;
   }

   .enkaku-detail .box {
      margin-bottom: 2rem;
   }

   .enkaku-detail .box h3 {
      font-size: 1.3em;
   }

   .box__inner {
      padding: 2rem 2rem 3rem;
   }

   .enkaku-detail .box .tit {
      text-align: center;
      margin: 0 0 1em;
   }

   .box__inner img {
      width: 100%;
   }

   .box__inner p {
      text-align: left;
   }

   .enkaku-detail__table dl {
      display: block;
      overflow: hidden;
   }

   .enkaku-detail__table dt {
      width: auto;
      padding: 1rem;
   }

   /* device SP */
   .device {
      padding: 4rem 2rem;
   }

   .device__box {
      margin-top: 4rem;
   }

   .device__box__img {
      width: 22vw;
      top: -6vw;
      right: 1rem;
   }

   .device__box__tit span {
      font-size: 1.2em;
   }

   /* taiou SP */
   .taiou__tit img {
      width: 120px;
      display: block;
      margin: auto;
   }

   .taiou p {
      margin: -1em 0 1em;
   }

   /* func-tenko SP */
   .func-tenko {
      margin-top: 4rem;
   }

   .func-tenko > h2 {
      font-size: 1.6rem;
      margin-bottom: 2rem;
   }

   .tenko-group h3 {
      font-size: 1.15em;
   }

   .tenko-group__item-question {
      font-size: 0.95em;
      padding: 12px 50px 12px 15px;
   }

   .tenko-group__item-question .icon {
      width: 45px;
   }

   .tenko-group__item-answer .inner {
      padding: 15px 20px 25px;
   }
}

/* ====================================
   助成金ボタン (.themeBox-blue)
==================================== */
.functions > .themeBox-blue {
   background: var(--color-lightblue);
   padding: 20px 40px;
   margin: 1em 0;
   text-align: center;
}

.functions > .themeBox-blue p {
   margin-bottom: 1rem;
}

@media screen and (max-width: 767px) {
   .functions > .themeBox-blue {
      padding: 10px 20px;
   }
}

/* ====================================
   遠隔地業務前自動点呼機能 (.seihin-enkaku)
==================================== */
.seihin-enkaku {
   padding: 8rem 2rem;
   background: #e8f0f8;
   margin-bottom: 4rem;
}

.seihin-enkaku__title {
   text-align: center;
   font-size: 1.8em;
   margin: 0 0 1em;
}

.seihin-enkaku__inner {
   max-width: 1000px;
   margin: auto;
}

.seihin-enkaku__text {
   text-align: center;
   margin: 1em 0 2em;
   line-height: 2;
}

.seihin-enkaku__usage {
   background: #fff;
   border-radius: 1rem;
   padding: 2rem 3rem;
   margin-bottom: 3rem;
}

.seihin-enkaku__usage__title {
   font-size: 1.3em;
   color: #0055a0;
   margin: 0 0 1em;
}

.seihin-enkaku__usage ul {
   margin: 0;
   padding-left: 1.5em;
}

.seihin-enkaku__usage li {
   margin-bottom: .5em;
   line-height: 1.8;
}

.seihin-enkaku__list {
   display: flex;
   justify-content: center;
   gap: 2rem;
   margin: 0;
   padding: 0;
   list-style: none;
}

.seihin-enkaku__list li {
   width: 23%;
   max-width: 220px;
   text-align: center;
}

.seihin-enkaku__list li img {
   width: 100%;
   height: auto;
   border-radius: .5rem;
   box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
}

@media screen and (max-width: 767px) {
   .seihin-enkaku {
      padding: 4rem 2rem;
   }

   .seihin-enkaku__title {
      font-size: 1.5em;
   }

   .seihin-enkaku__text {
      text-align: left;
   }

   .seihin-enkaku__usage {
      padding: 1.5rem 2rem;
   }

   .seihin-enkaku__list {
      flex-wrap: wrap;
      gap: 1.5rem;
   }

   .seihin-enkaku__list li {
      width: 45%;
      max-width: none;
   }
}

/* ====================================
   遠隔地自動点呼で必要となる機器 (.func-device)
   対応機種について (.func-taiou)
==================================== */
.func-device {
   padding: 6rem 2rem;
}

.func-device h2 {
   color: #0055a0;
   text-align: center;
   font-size: 1.8em;
   margin: 0 0 1em;
}

.device__box {
   position: relative;
   max-width: 750px;
   text-align: center;
   margin: auto;
   margin-top: 7rem;
   padding: 4rem 2rem 2rem;
   border-radius: 1rem;
   border: 5px solid #cad9e5;
}

.device__box img {
   max-width: 100%;
   height: auto;
}

.device__box__tit {
   position: absolute;
   top: -4rem;
   left: 0;
   text-align: center;
   font-weight: 600;
   display: block;
   width: 100%;
}

.device__box__tit span {
   font-size: 1.4em;
   background: #cad9e5;
   display: inline-block;
   border-radius: 5rem;
   padding: .5rem 3rem;
}

.func-taiou {
   text-align: center;
   padding: 4rem 2rem;
}

.func-taiou__tit {
   font-size: 1.6em;
   margin-bottom: .5em;
}

.func-taiou__tit img {
   width: 185px;
   vertical-align: bottom;
   margin-right: 10px;
}

@media (max-width: 768px) {
   .func-device {
      padding: 4rem 2rem;
   }

   .device__box {
      margin-top: 4rem;
   }

   .device__box__tit span {
      font-size: 1.2em;
   }

   .func-taiou__tit img {
      width: 120px;
      display: block;
      margin: auto;
   }
}

/* ====================================
   要件のポイント (.func-point)
==================================== */
.func-point {
   text-align: center;
   background: #ebf4ff;
   margin-bottom: 6rem;
}

.func-point__inner {
   max-width: 1040px;
   margin: auto;
   padding: 4rem 2rem 2rem;
}

.func-point__title {
   font-size: 3rem;
   color: #0055a0;
   margin-bottom: 1em;
}

.func-point__text {
   line-height: 1.8;
   font-size: 2.05rem;
   margin-bottom: 0;
}

.func-point__text__first {
   display: inline-flex;
   align-items: center;
   gap: .5em;
}

.func-point__text__first img {
   width: 140px;
   vertical-align: middle;
}

.point-box__wrap {
   display: flex;
   justify-content: space-between;
   gap: 5rem;
   margin-top: 4rem;
}

.point-box__wrap .point-box {
   width: 33%;
   border-radius: 2rem;
   background: #fff;
   box-shadow: 0px 5px 15px rgb(25 89 194 / 15%);
}

.point-box__title {
   padding: 2rem;
   color: #fff;
   background: #0055a0;
   border-radius: 2rem 2rem 0 0;
   font-size: 1.8rem;
   line-height: 1.5;
}

.point-box__title .text-orange {
   color: #f0bf46;
}

.point-box__text {
   padding: 2rem;
}

.point-box__text img {
   width: 100%;
}

.point-box__text img + p {
   font-size: .95em;
   text-align: left;
   padding: .5em 5%;
}

@media (max-width: 768px) {
   .func-point__title {
      font-size: 2.4rem;
   }

   .func-point__text {
      font-size: 1.6rem;
   }

   .func-point__text__first img {
      width: 100px;
   }

   .point-box__wrap {
      display: block;
   }

   .point-box__wrap .point-box {
      width: 100%;
      margin-bottom: 3rem;
   }

   .point-box__text img {
      max-width: 300px;
      display: block;
      margin: 0 auto;
   }

   .func-point {
      margin-bottom: 4rem;
   }

   .device__box + .device__box {
      margin-top: 5rem;
   }
}

/* ====================================
   業務前自動点呼 func-head about セクション（LP移植）
==================================== */
.func-head--about {
   padding: 0;
}

.func-head .about {
   max-width: 800px;
   margin: auto;
   padding: 7rem 2rem;
}

.func-head .about__title {
   text-align: center;
   font-size: 2em;
   margin: 0 0 .5em;
   color: #333;
}

.func-head .about__title br.sp {
   display: none;
}

.func-head .about__title img {
   width: 185px;
   vertical-align: bottom;
   margin-right: 10px;
}

.func-head .about__title span {
   color: #0055a0;
}

.func-head .about__text {
   text-align: left;
   line-height: 2;
}

.subsidy_btn {
   margin: 20px auto 0;
}

.subsidy_btn a {
   display: flex;
   align-items: center;
   justify-content: center;
   max-width: 450px;
   height: 80px;
   margin: auto;
   color: #fff;
   text-align: center;
   font-size: 1.3em;
   text-decoration: none;
   background: #0055a0;
   box-shadow: 0px 5px 8px rgb(0 0 0 / 20%);
}

.subsidy_btn a .material-icons-outlined {
   margin-left: 10px;
}

.subsidy_btn a:hover {
   opacity: .85;
}

@media screen and (max-width: 767px) {
   .func-head .about {
      padding: 5rem 2rem;
   }

   .func-head .about__title {
      font-size: 1.5em;
   }

   .func-head .about__title img {
      width: 120px;
      margin-right: 6px;
   }

   .func-head .about__title br.sp {
      display: block;
   }
}