html, body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    -webkit-text-size-adjust: 100%;
    }

  .wrap {
    margin: auto;
    width: 100%;
    color: #0E0E0E;
  }

  .inner-wrap {
    margin: 0 auto;
    background-size: cover;
  }

  .inner-wrap [class^='inner-sec'] {
    max-width: 880px;
    margin: auto;
  }

  h2 {
    color: #0E0E0E;
    font-size: 32px;
    font-weight: bold;
    margin: auto;
  }

  h2 span {
      font-size: 40px;
  }

  .yellow_line {
    background: rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #E6FF00 0%);
    padding: 0 3px;
  }
  p {
    margin: initial;
  }

  .text-center {
    text-align: center;
    font-size: 18px;
  }

  .btn-more {
    background-color: #000;
    font-size: 16px;
    font-weight: bold;
    display: flex;
    color: #fff;
    width: 38.6%;
    margin: auto;
    cursor: pointer;
    transition: all 0.3s ease 0s;
    padding: 13px 0;
    justify-content: center;
    align-items: center;
  }

  .btn-more a {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    justify-content: center;
  }

  .btn-more p {
    margin: 0 0 0 10px;
  }

  .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6  {
    font-weight: bold;
  }

  .pc { display: block !important; }
  .sp { display: none !important; }

  @media (max-width: 600px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
    img { max-width: 90%;}
  }

  @media (min-width:601px) {
    .br-sp { display: none;}
  }

  /*-------------ヘッダー-----------------*/

  header {
    width: 100%;
    height: 80px;
    position: fixed;
    top: 0;
    left: 0;
    align-items: center;
    background-color: #fff;
    z-index: 1000;
  }

  header ul {
    display: flex;
    margin: auto;
    height: 80px;
    position: relative;
  }

  .header_logo {
    display: flex;
    justify-content: center;
  }

  .header_logo img {
    display: block;
  }

  .inner_header_logo {
    font-weight: bold;
    margin-left: 12px;
    font-size: 14px;
  }

  .inner_header_logo p:first-of-type{
    color: #000;
  }

  .inner_header_logo p:last-of-type {
    background-color: #000;
    letter-spacing: 1em;
    text-align: center;
    padding-left: 1em;
  }

  header ul li {

    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 14px;
  }

  header ul li:first-of-type {
    padding: 20px 0;
  }

  header ul li:first-of-type {
    margin-right: auto;
    margin-left: 20px;
  }

  header ul li:nth-of-type(2) {
    background-color: #4CBBB0;
    position: absolute;
    top: 0px;
    left: 68%;
    right: 15%;
    bottom: 0px;
    padding-right: 10px;
  }

  header ul li:nth-of-type(3) {
    background-color: #000;
    z-index: 30;
    position: absolute;
    top: 0px;
    left: 86%;
    right: 0;
    bottom: 0px;
  }

    header ul li:nth-of-type(2):before {
    position: absolute;
    top: 0px;
    left: 67%;
    right: 0;
    bottom: 0px;
    z-index: -1;
    transform: skewX(-11deg);
    background-color: #4CBBB0;
    content: "";
    height: auto;

    position: fixed;
    height: 80px;
  }

  header ul li:nth-of-type(3):before {
    position: absolute;
    top: 0px;
    left: 84%;
    right: 0;
    bottom: 0px;
    z-index: -1;
    transform: skewX(-11deg);
    background-color: #000;
    content: "";
    height: auto;

    position: fixed;
    height: 80px;
  }

  header ul li:not(:first-of-type) a {
    display: block;
    padding: 30px 0;
  }

  /* ----------アイキャッチ--------- */

  .eyecatch {
    background-image: url(./image/eyecatch_pc.png);
    background-color: #4CBBB0;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    margin-top: 55px;
    padding: 77px 0 67px 0;
  }

  .lead {
    width:51%;
  }

  .lead span {
    display: inline-block;
    color: #fff;
    font-size: 49px;
    line-height: 60px;
    margin-bottom: 10px;
    background-color: rgba(0, 0, 0, 0.5);
    padding-right: 20px;
    padding-left: 5px;
  }

  .lead p {
    color: #fff;
    font-size: 26px;
    text-shadow: 2px 2px 0px #00000099;
    font-weight: bold;
    margin: auto;
    text-align: left;
  }

  .lead h1 {
    margin: 30px 0;
  }

  .lead-badges {
    display: flex;
    width: 50%;
    align-items: center;
  }

  .lead-badges .DLlink {
    height: 50%;
    width: 100%;
    margin-left: 17%;
  }

  .lead-badges .DLlink img {
    width: 30%;
  }

  .lead-DLlink {
    display: flex;
    align-items: center;
    height: 20%;
  }

  .lead-QR {
    width: 37%;
    margin: 0 12px 0 7px;
  }

/* ----------こんなお悩みありませんか--------*/

  .sec-problem {
    background: #000000 0% 0% no-repeat padding-box;
  }

  .inner-sec-problem {
    opacity: 1;
    padding-bottom: 235px;
    position: relative;
  }

  .inner-sec-problem h2 {
    color: #fff;
    padding: 60px 0 86px 0;
    font-size: 38px;
  }

  .problems {
    display: flex;

  }

  .problemItem {
    margin: auto;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
  }

  .problemItem img {
    margin-bottom: 10px;
  }

  .problem_answer {
      position: relative;
      padding-top: 236px;
  }

  .answer_item {
      margin: auto;
      text-align: center;
      font-size: 20px;
      font-weight: bold;
  }

  .answer_item img {
    margin-bottom: 10px;
  }
  .greenMessage {
    position: absolute;
    top: 81%;
    left:-5;
    width: 100%;
    border-top: 255px solid #4CBBB0;
    border-right: 58px solid transparent;
    color: #fff;
    font-weight: bold;
    font-size: 32px;
    text-align: center;
    z-index: 3;
  }

  .greenMessage span {
    font-size: 40px;
  }

  .greenMessage p {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -120%);
    transform: translate(-48%, -155%);
    width: 100%;
    margin: auto;
  }

  .greenMessage_left {
    position: absolute;
    top: 81%;
    left: -1013px;
    width: 145%;
    border-top: 255px solid #4CBBB0;
    border-right: 70px solid transparent;
    z-index: 0;
  }


/* ----------特長--------- */

  .sec-feature {
    background-color: #F2F4F4;
  }

  .problem_answer {
    display: flex;
  }

  .description {
    text-align: center;
    font-weight: bold;
    position: relative;
    margin: 127px 0 140px 0;
  }
  .description .background {
    font-size: 100px;
    color: #CDEBE8;
  }

  .description .description-text {
    color: #000;
    font-size: 28px;
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translateX(-50%)
                translateY(-50%);
    width: 100%;
  }

  .feature {
    position: relative;
  }

  .feature_item h2 {
    margin-bottom: 180px;
  }

  .feature_item {
    margin: auto;
    color: #0E0E0E;
  }

  .feature_point {
    display: inline-block;
    position: relative;
    z-index: 1;
    padding: 0px 1em;
    width: 86%;
    margin: 0 10% 20% 5%;
  }

  .feature_point::before {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
    transform: skewX(-8deg);
    background-color: #fff;
    content: "";
    height: auto;
  }

  .inner-feature_point {
    display: flex;
    position: relative;
    justify-content: space-between;
    align-items: center;
  }

  .inner-feature_point .point_img {
    width: 40%;
    height: auto;
    position: absolute;
    bottom: -50px;
    right: -60px;
  }

  .point_img_cloud {
    width: 61%;
    position: absolute;
    bottom: -24px;
    right: -91px;
  }

  .inner-feature_point .point_img_L {
    width: 40%;
    height: auto;
    position: absolute;
    bottom: -50px;
    left: -60px;
  }

  .point_detail {
    max-width: 300px;
    position: relative;
    margin: 5% 0 7% 10%;
  }

  .point_detail_R {
    max-width: 290px;
    right: 0;
    bottom: 0;
    margin-left: auto;
    margin: 5% 10% 7% auto;
  }

  .point_img_4{
    width: 51%;
    height: auto;
    position: absolute;
    bottom: -50px;
    left: -68px;
  }

  .inner-feature_point h3 {
    font-size: 36px;
  }

  .point_number {
    position: absolute;
    top: -76px;
    left: 0;
  }

  .point_number_R {
    position: absolute;
    top: -39px;
    right: 252px;
  }

  .point_detail_text {
    margin-top: 40px;
    margin-bottom: 50px;
  }

  .point_detail_text .text {
    margin-top: 34px;
  }

  .point_detail_text h3 {
    line-height: 49px;
  }

/* ----------ほかにもメリット働き方改革--------- */

  .other_merit_list {
      display: flex;
      margin: auto;
      padding: 25px 60px 124px 60px;
  }

  .merit_item {
      margin: auto;
      text-align: center;
      max-width: 30%;
  }

  .merit_item img {
    max-width: 160px;
  }

  .other_merit h2 {
    margin-bottom: 30px;
  }

  .workstyle_reform {
    position: relative;
    padding-bottom: 80px;
  }

  .workstyle_reform .text {
    margin: 75px 0 100px 0;
    font-size: 16px;
    letter-spacing: 0px;
    text-align: center;
    line-height: 28px;
  }

  .genbade {
    position: absolute;
    right: 6%;
    top: 73%;
    font-size: 40px;
    font-weight: bold;
    max-width: 262px;
    text-align: center;
  }

/* ----------ZENGOの使い方--------- */

  .inner-sec-howto {
    padding: 120px 0;
  }

  .sec-howto h2 span {
    font-size: 40px;
  }

  .sec-howto .text-center {
    margin: 54px 0 90px 0;
  }

  .sec-howto .text-center span {
    font-size: 28px;
    font-weight: bold;
  }

  .howto_3steps {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .howto_box {
    background-color: #F2F4F4;
    width: 30%;
    position: relative;
    padding: 40px 20px 20px 20px;
    text-align: center;
  }

  .howto_box h3 {
    position: relative;
    font-size: 24px;
    line-height: 36px;
    font-weight: bold;
    z-index: 3;
    text-align: left;
    margin: auto;
  }

  .howto_box:not(:last-of-type) h3 {
    margin-bottom: 36px;
  }

  .howto_box p {
    margin: 19px 14px 0 14px;
    line-height: 32px;
  }

  .howto_box .step_img {
    width: 141px;
    margin-top: 50px;
    margin: auto;
  }

  .howto_number {
    position: absolute;
    top: 40px;
    right: 23px;
    z-index: 1;
  }

  .howto-triangle {
    width: 0;
    height: 0;
    border-top: 42px solid transparent;
    border-bottom: 42px solid transparent;
    border-left: 35px solid #F2F4F4;
  }

  .sec-howto .btn-more {
    margin-top: 85px;
  }

/* ----------利用料金--------- */

.inner-sec-price .text-center {
  margin: 32px 0 91px 0;
}

.sec-price .announce {
  font-size: 18px;
  margin: 40px 0 100px 0;
  text-align: center;
}

.price-oval_list {
  display: flex;
}

.price-oval {
  box-shadow: 0px 0px 10px #0000001A;
  border-radius: 80px;
  margin: auto;
  width: 30%;
  text-align: center;
  font-weight: bold;
  font-size: 16px;
  padding: 30px 0;
}


.price-oval:first-of-type {
  padding: 21px 15px;
}


.price-oval .price_L {
  font-size: 28px;
}

.price_yellow {
  font-size: 18px;
  background: rgba(0, 0, 0, 0) linear-gradient(transparent 65%, #E6FF00 0%);
  line-height: 45px;
}

/* ----------機能比較--------- */

.inner-sec-compare {
  padding-bottom:118px;
}

.inner-sec-compare h2 {
  margin-bottom: 50px;
}

.compare-text {
  margin: 85px 0 75px 0;
}

.compare-text .text-center:first-child {
  margin-bottom: 30px;
}
.explain-table .tbl-row {
  display: flex;
}

.explain-table .tbl-col {
  flex: 1;
  text-align: center;
  font-size: 12px;
  line-height: 22px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
}

.explain-table .tbl-row:first-child .tbl-col {
  border-bottom: 6px solid #fff;
  font-size: 24px;
  padding: 52px 0;
  font-weight: bold;
}

.explain-table .tbl-row:first-child .tbl-col:first-child {
  background: #fff;
}

.explain-table .tbl-row:first-child .tbl-col:nth-child(2) {
  background: #e8e8e8;
  border-left: 6px solid #fff;
  border-right: 6px solid #fff;
  padding: 0 10px;
}

.explain-table .tbl-row:first-child .tbl-col:nth-child(3) {
  background: #4CBBB0;
  color: #fff;
  font-weight: bold;
  border-right: 1px solid #fff;
  padding: 0 10px;
}

.explain-table .tbl-row:not(:first-child) .tbl-col:first-child {
  background: #000000;
  color: #fff;
  border-right: 6px solid #fff;
  border-bottom: 6px solid #fff;
}

.explain-table .tbl-row:not(:first-child) .tbl-col:nth-child(2) {
  background: #F2F4F4;
  border-right: 6px solid #fff;
  border-bottom: 6px solid #fff;
  padding: 0 10px;
}

.explain-table .tbl-row:not(:first-child) .tbl-col:nth-child(3) {
  background: #e2f7f5;
  font-weight: bold;
  color: #000000;
  border-right: 1px solid #fff;
  border-bottom: 6px solid #fff;
  padding: 0 10px;
}

.explain-table .tbl-row:not(:first-child) .tbl-col{
  padding: 17px 0;
  font-size: 18px;
}

.explain-table .tbl-row:not(:first-child) .tbl-col:last-child {
  font-size: 24px;
  font-weight: bold;
}

/* ----------よくあるご質問--------- */

.sec-FAQ {
    background-color: #4cbbb0;
}

.sec-FAQ ul {
  padding: 0;
}

.inner-sec-FAQ {
  padding: 86px 0 80px 0;
}

.FAQ-content {
  margin: 50px 0 0 0;
}

.inner-sec-FAQ h2 {
  color: #fff;
}

.qa-list {
  padding: 7%;
}

.qa-item {
  margin-bottom: 20px;
}

.qa-item span {
  font-weight: bold;
}

.qa-icon {
  color: #FFF;
  width: 44px;
  height: 44px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 20px;
  font-weight: bold;
}

.qa-icon p {
  vertical-align: bottom;
}

.question .qa-icon {
  background-color: #4cbbb0;
}

.answer .qa-icon {
  background-color: #000;
}

.question {
  padding: 30px;
  color: #4CBBB0;
  font-weight: bold;
  background-color: #fff;
  display: flex;
}

.answer {
  padding: 30px;
  background-color: #F2F4F4;
  display: flex;
}

.qa_text {
  display: flex;
  align-items: center;
  line-height: 29px;
}

.FAQ-content .text-center {
  color: #fff;
  font-weight: bold;
  margin: 80px 0 43px 0;
}


/* ----------メディア掲載--------- */

.inner-sec-media {
  padding: 120px 0 100px 0;
}

.inner-sec-media ul {
  padding-left: 0;
}

.media_logolist {
  display: flex;
  flex-wrap: wrap;
}

.logo_img_1 {
  margin-top: 50px;
}

.logo_img_2 {
  margin: 50px 50px 0 50px;
}

.logo_img_3 {
  margin-top: 50px;
}

/* ----------お知らせ--------- */

  .sec-information {
      background-color: #F2F4F4;
  }
  .inner-sec-information {
    padding: 80px 0 145px 0;
  }

  .inner-sec-information h2 {
    margin-bottom: 83px;
  }

  .info_frame {
    margin: auto;
    background-color: #fff;
    padding: 0 30px;
  }

  .info_frame .info_item {
    display: flex;
    margin: auto;
    font-size: 16px;
    border-bottom: 2px solid #E9E9E9;
    padding: 30px 0;
    align-items: center;
  }

  .info_frame:nth-of-type(3) .info_item {
    border-bottom: none;
  }

  .info_date {
    font-weight: bold;
    width: 16%;
  }

  .info_type {
    background-color: #4cbbb0;
    color: #fff;
    font-weight: bold;
    text-align: center;
    width: 120px;
    padding-top: 3px;
    padding-bottom: 3px;
    margin: 0 15px 0 5px;
    font-size: 14px;
  }

  .inner-sec-information .btn-more {
    margin-top: 55px;
  }

  .inner-sec-information .info_detail a{
    color: #4cbbb0;
    text-decoration: underline;
  }

/* ----------アプリダウンロード--------- */

  .trial10days {
    background-color: #E6FF00;
    background-image: url(./image/bg_line.png);
    padding: 30px 0;
    margin: auto;
    padding: 80px 0 126px 0;
  }

  .trial10days img {
    display: block;
    margin: auto;
    max-width: 718px;
  }

  .btn-appDL_now {
    background-color: #000;
    color: #fff;
    font-weight: bold;
    font-size: 20px;
    width: 303px;
    text-align: center;
    line-height: 57px;
    margin: auto;
  }

  .sec-appDL {
    background-size: cover;
    background-color: #4cbbb0;
  }

  .inner-sec-appDL {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
  }

  .inner-sec-appDL .appDL_iPhone_img {
    position: absolute;
    bottom: 0;
    left: 0;
  }

  .appDL_info {
    padding: 40px 0 49px 0;
    margin-left:  40%;
  }


  .DLlink {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 76px;
  }


  /* .DLlink img:nth-of-type(2) {
    width: 286px;
    margin-left: 19px;
  } */

  .DLlink a img {
    width: 75%;
    margin-left: 19px;
  }

  .appDL_info .text {
    color: #fff;
    font-weight: bold;
    font-size: 30px;
    text-align: center;
    margin-bottom: 34px;
  }

  .appDL_info .text span {
    font-size: 40px;
  }


  /*  -----お問い合わせ-----　*/

  .sec-contact {
    background-color: #f2f4f4;
  }

  .inner-sec-contact {
    width: 100%;
    text-align: center;
    padding: 96px 0;
  }

  .contactbox_wrap {
    display: flex;
    justify-content: center;
  }

  .contactbox {
    background-color: #fff;
    width: 52%;
    margin-top: 33px;
  }

  .contactbox p:first-child {
    font-size: 20px;
    font-weight: bold;
  }

  .contact_green {
    color: #4CBBB0;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .contactbox:first-of-type {
    padding: 20px 0;
    margin-right: 40px;
  }

  .contactbox:first-of-type .contact_green p:first-of-type {
    font-size: 29px;
    letter-spacing: 0.58px;
    padding: 10px 0;
  }

  .contactbox:first-of-type p:last-of-type {
    font-size: 14px;
  }

  .contactbox:first-of-type img {
    width: 44px;
    height: 44px;
  }

  .contactbox:last-of-type {
    padding: 50px 0 57px 0;
  }

  .contactbox:last-of-type .contact_green {
    padding-top: 10px;
  }

  .contact_green p {
    font-size: 16px;
  }

  .contactbox:last-of-type img {
    width: 39px;
    height: 39px;
    margin-right: 5px;
  }

  .contact_green a {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    justify-content: center;
  }

/* -----Pマーク-----　*/
  .inner-sec-privacyMark {
    display: flex;
    width: 86%;
    padding: 80px 0;
    margin:auto;
    align-items: center;
  }

  .inner-sec-privacyMark .seal img {
    width: 88px;
    margin-right: 20px;
  }

/* -------フッター------　*/


  .sec-footer-corporate {
    max-width: 880px;
    margin: auto;
  }

  .footer-Wrapper {
    background-color: #f2f4f4;
  }
  .footer-Sitemap {
    display: flex;
    padding: 80px 0;
  }

  .Sitemap_col {
    margin: auto;
  }

  .footer-corporate {
    background-color: #4cbbb0;
    padding: 25px 0;
    justify-content: center;
  }

  .ftCorporate-list {
    display: flex;


  }

.ftCorporate-list li {
  margin: auto;
  color: #fff;
  font-weight: bold;
}


  .copyright {
    background-color: black;
    color: white;
    text-align: center;
    font-size: 8px;
    line-height: 14px;
  }

  li {
    list-style: none;
  }

  h2 {
    text-align: center;
  }
  a,
  a:visited,
  a:hover,
  a:active {
    color: inherit;
    text-decoration: none;
  }

  ul {
    padding: 0;
  }