﻿.contents_wrapper.blue {
  padding-bottom: 24px;
}

h1 {
  margin-top: 20px
}

.info_1 h1 .bt_line {
  color: #002e4e
}

.info_1 .bt_line {
  padding: 0;
  color: #fff;
  display: inline-block;
  position: relative
}

.info_1 .bt_line::after {
  content: "";
  display: block;
  width: 100px;
  height: 7px;
  background: #2755d9;
  position: absolute;
  bottom: -20px;
  left: calc(50% - 50px);
}

.info_1 .lead {
  font-size: 18px;
  font-size: 1.125rem;
  text-align: center;
  color: #002e4e;
  letter-spacing: 1.8px;
  width: 70%;
  margin: 36px auto;
  line-height: 34px
}

.info_1 .info_wrap_first {
  font-size: 10px;
  font-size: 0.625rem;
  /*width: 892px;*/
  margin: 0 auto;
  position: relative;
  margin-top: 82px;
  border-radius: 12px;
  /*margin-bottom: 50px*/
}

.info_1 .usecaase .usecaase_in {
  font-size: 10px;
  font-size: 0.625rem;
  /*width: 892px;*/
  background: #4b72bc;
  margin: 0 auto;
  position: relative;
  border-radius: 12px;
  /*
  margin-top: 52px;
  padding-top: 50px;
  padding-bottom: 102px
  padding-bottom: 48px;
 */
  padding: 0 20px 48px;
}

/*
@media(max-width: 800px){
  .box_title{
    margin-left: -12px;
    margin-right: -12px;
  }
}
*/
.info_1 .usecaase .box_title {
  margin-top: 8px;
  margin-bottom: 56px
}

.info_1 .usecaase .box_title_en {
  color: #fff
}

.info_1 .usecaase .bt_line::after {
  content: "";
  display: block;
  width: 25.5%;
  height: 7px;
  background: #fff;
  position: absolute;
  bottom: -21px;
  left: 37.5%
}

.info_1 .usecaase:before {
  content: "";
  position: absolute;
  top: 30.2%;
  left: 50%;
  transform: translateX(-50%);
  border-top: 40px solid #4c72bc;
  border-right: 35px solid transparent;
  border-left: 35px solid transparent
}

.info_1 .info_box_second {
  float: left;
  width: calc(50% - 40px);
  margin: 20px;
  color: #fff;
}

@media(max-width: 1000px) {
  .info_1 .info_box_second {
    width: 100%;
  }
}


.info_1 .info_box_second .case {
  font-size: 20px;
  display: block;
  width: 100px;
  padding: 0 10px;
  margin: 0 auto;
  text-align: center;
  color: #fff;
  border: solid 0.5px #fff;
  border-radius: 16px;
}

.info_1 .info_box_second .title {
  font-size: 22px;
  display: block;
  padding: 16px;
  font-weight: 700;
  color: #fff;
}

.info_1 .info_box_second .text {
  font-size: 18px;
  width: 100%;
  display: inline-block;
  border-top: 1px solid #fff;
  margin: 0;
  padding: 14px 0;
}

@media(max-width: 1000px) {
  .info_1 .info_box_second .text {
    font-size: 16px;
    font-size: 1rem;
  }
}

.info_1 .info_box_second .usecase_image {
  width: 100%;
}

.info_1 .info_box_second .usecase_image img {
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
}

.info_1 .info_box_first {
  background: #fff;
  border: 1px solid #DBDADA;
  position: relative;
  border-radius: 12px;
  /* height: 380px; */
  text-align: center;
  flex-basis: calc((100% - 64px)/3);
}

.info_1 .info_img {
  display: block;
}

.info_1 .info_img img {
  width: 100%;
  height: auto;
  border-radius: 12px 12px 0 0;
}

@media(max-width: 1000px) {
  .info_1 .info_box_first {
    flex-basis: auto;
    margin-bottom: 20px;
    height: auto;
  }
}

.info_1 .info_box_first .title {
  font-size: 27px;
  font-size: 1.6875rem;
  display: block;
  padding: 24px 24px 14px;
  text-align: left;
  font-weight: bold;
  line-height: 1.2;
  color: #002e4e
}

@media(max-width: 1000px) {
  .info_1 .info_box_first .title {
    font-size: 24px;
    font-size: 1.5rem;
    text-align: center;
  }
}

.info_1 .info_box_first hr {
  border: none;
  border-top: 7px solid #2755d9;
  width: 33%;
  text-align: left;
  margin-left: 27px
}

.info_1 .info_box_first .info_box_in {
  width: 81%;
  margin: 24px auto;
  text-align: left
}

.info_1 .info_box_first .info_box_in .info__title {
  display: block;
  font-size: 22px;
}

.info_1 .info_box_first .info_box_in .info__txt {
  font-size: 19px;
  font-size: 1.1875rem;
  line-height: 2.2
}

.info_1 li .info_box_img img {
  width: 70%;
}

@media(max-width: 1000px) {
  .info_1 li .info_box_img img {
    width: 50%;
  }
}

.info_1 li .info_box_img {
  position: absolute;
  /*top: 171px;*/
  right: -20px;
  bottom: -20px;
}

@media(max-width: 1000px) {
  .info_1 li .info_box_img {
    bottom: 0;
    right: -30px;
  }
}

.info_1 .box_news .box_title {
  margin-bottom: 0
}

.info_1 .box_news .news .box_title {
  margin-top: 12px
}


.info_1 .box_news .wrapper {
  font-size: 10px;
  font-size: .625rem;
  width: 848px;
  background: #fff;
  margin: 0 auto;
  position: relative;
  padding: 24px 16px 16px 32px;
  border-radius: 12px
}

.info_1 .box_news .wrapper hr {
  border: none;
  border-top: 2px dotted #526dac;
  width: 95%;
  margin-left: 13px
}

.info_1 .box_news .wrapper a {
  display: block;
  margin: 14px 0 17px 40px;
  color: #002e4e
}

.info_1 .box_news .wrapper a dl {
  display: flex;
  align-items: center
}

.info_1 .box_news .wrapper a dl dt.date {
  display: table-cell;
  vertical-align: middle;
  width: 72px;
  margin-right: 12px
}

.info_1 .box_news .wrapper a dl dt.tag span {
  font-size: 10px;
  font-size: 0.625rem;
  background: #326ee0;
  border-radius: 100px;
  color: #fff;
  line-height: 1;
  display: inline-block;
  padding: 4px 0 2px;
  text-align: center;
  width: 80px
}

.info_1 .box_news .wrapper a dl dd.txt {
  font-size: 14px;
  font-size: 0.875rem;
  color: #002e4e;
  max-width: 450px;
  padding: 0 24px 0 24px;
  position: relative;
  width: 414px;
  margin-left: -8px
}

.info_1 .arrow {
  font-size: 12px;
  font-size: 0.75rem;
  position: relative;
  display: inline-block;
  color: #000;
  vertical-align: middle;
  text-decoration: none
}

.info_1 .arrow::before,
.info_1 .arrow::after {
  position: absolute;
  top: 24px;
  bottom: 30px;
  right: -729px;
  margin: auto;
  content: "";
  vertical-align: middle
}

.info_1 .arrow_r::before {
  left: 188px;
  width: 10px;
  height: 10px;
  border-top: 2px solid #002e4e;
  border-right: 2px solid #002e4e;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg)
}

.info_1 .lists {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
  max-width: 1000px;
}

/*.info_1 li:nth-of-type(1),.info_1 li:nth-of-type(2),.info_1 li:nth-of-type(3) {
  margin-top: 0
}
*/

.info_1 li:nth-of-type(3n-1):nth-last-of-type(1) {
  margin-right: auto;
  margin-left: 20px
}

.info_1 .info_box_in {
  margin-top: 18px
}

.info_1 .info_box_in li {
  text-align: left;
  padding-left: 43px;
  margin-bottom: 7px;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #002e4e
}

.info_1 .check {
  padding-left: 24px;
  position: relative;
  margin-bottom: 16px
}

.info_1 .check:before,
.info_1 .check:after {
  content: "";
  display: block;
  position: absolute
}

.info_1 .check:after {
  border-left: 2px solid #526dac;
  border-bottom: 2px solid #526dac;
  width: 8px;
  height: 4px;
  transform: rotate(-45deg);
  left: 24px;
  top: 6px
}

.info_1 {
  margin: 0 auto;
  padding: 56px 0 32px;
}

.info_1 .title {
  font-size: 32px;
  font-size: 2rem;
  padding: 72px 0 64px;
  color: #002e4e;
  text-align: center;
  letter-spacing: -0.8px;
  line-height: 1.6;
  /*background: #f1f5f8*/
}

.info_1 .feature {
  display: inline-block;
  clear: left;
  margin: 20px 0;
  border: 1px solid #DBDADA;
  background: #FCFCFC;
  border-radius: 20px;
}

@media (max-width: 1000px) {
  .info_1 .feature {
    margin: 0 0 20px;
  }
}

.info_1 .feature_image {
  float: left;
  width: calc(40% - 40px);
  margin: 40px 40px 40px 0;
  height: calc(100% - 80px);
  background: #fff;
  /*margin-right: 20px;*/
  /*margin-left: 40px;*/
}

@media(max-width:1000px) {
  .info_1 .feature_image {
    margin: 10px 0 0;
    width: 100%;
    height: auto;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
  }
}

.info_1 .feature_image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
  /*border: 1px solid #afafaf;*/
}

@media(max-width: 1000px) {
  .info_1 .feature_image img {
    height: auto;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
  }
}

.info_1 .feature_text {
  float: left;
  width: calc(60% - 80px);
  text-align: center;
  padding: 40px;
}

@media(max-width: 1000px) {
  .info_1 .feature_text {
    /*margin: 0 20px;*/
    width: calc(100% - 40px);
    padding: 20px;
  }
}

.info_1 .feature_text .title {
  font-size: 32px;
  font-weight: 700;
  padding-top: 0;
  padding-bottom: 32px;
  /* background: #fff; */
}

@media(max-width:1000px) {
  .info_1 .feature_text .title {
    font-size: 20px;
    font-size: 1.25rem;
    padding: 0 0 10px;
  }
}

.info_1 .feature_text .description {
  font-size: 26px;
  text-align: left;
}

@media(max-width: 1000px) {
  .info_1 .feature_text .description {
    font-size: 16px;
    font-size: 1rem;
  }
}

.info_1 .feature_text a {
  display: inline-block;
  /*background:#cddae2;*/
  border: 1px solid #002e4e;
  padding: 12px 28px;
  border-radius: 24px;
  font-size: 14px;
  font-weight: 700;
  margin-top: 32px;
}

@media(max-width: 1000px) {
  .info_1 .feature_text a {
    display: none;
  }
}

.info_1 .link {
  float: right;
  text-align: center;
  margin: 0 60px;
  width: calc(60% - 160px);
}

@media(max-width:1000px) {
  .info_1 .link {
    clear: left;
    width: 100%;
    margin: 0;
    padding-top: 10px;
    padding-bottom: 20px;
  }
}

.info_1 .link a {
  display: none;
}

@media(max-width: 1000px) {
  .info_1 .link a {
    display: inline-block;
    /*background:#cddae2;*/
    border: 1px solid #002e4e;
    padding: 12px 28px;
    border-radius: 24px;
    font-size: 14px;
    font-weight: 700;
  }
}

.info_1 .box1 {
  /*width: 894px;*/
  margin: 32px auto 0;
  background: #fff;
  position: relative;
  border-radius: 10px
}

.info_1 .box1 .title_box,
.info_2 .box2 .title_box,
.info_2 .box3 .title_box {
  padding: 40px;
  text-align: center
}

.info_1 .box1 .ribbon,
.info_2 .box2 .ribbon,
.info_2 .box3 .ribbon {
  font-size: 28px;
  font-size: 1.75rem;
  max-width: 440px;
  width: 100%;
  display: inline-block;
  position: relative;
  /*top: -30px;*/
  padding: 4px 24px;
  height: 54px;
  line-height: 47px;
  text-align: center;
  background: #002e4e;
  color: #fff;
  box-sizing: border-box
}

.info_1 .box1 .ribbon:before,
.info_1 .box1 .ribbon:after,
.info_2 .box2 .ribbon:before,
.info_2 .box2 .ribbon:after,
.info_2 .box3 .ribbon:before,
.info_2 .box3 .ribbon:after {
  position: absolute;
  content: "";
  width: 0px;
  height: 0px;
  z-index: 1
}

.info_1 .box1 .ribbon:before,
.info_2 .box2 .ribbon:before,
.info_2 .box3 .ribbon:before {
  top: 0;
  left: 0;
  border-width: 29px 0px 25px 15px;
  border-color: transparent transparent transparent #fff;
  border-style: solid
}

.info_1 .box1 .ribbon:after,
.info_2 .box2 .ribbon:after,
.info_2 .box3 .ribbon:after {
  top: 0;
  right: 0;
  border-width: 29px 15px 25px 0px;
  border-color: transparent #fff transparent transparent;
  border-style: solid
}

.info_1 .box1 .ribbon.add_app {
  max-width: 640px;
}

.pc_only {
  display: inline-block;
}

@media(max-width: 640px) {
  .pc_only {
    display: none;
  }
}

@media(max-width: 640px) {
  .info_1 .box1 .ribbon.add_app {
    font-size: 28px;
    font-size: 1.75rem;
  }
}

@media(max-width: 440px) {
  .info_1 .box1 .ribbon.add_app {
    font-size: 24px;
    font-size: 1.5rem;
  }
}

@media(max-width: 400px) {
  .info_1 .box1 .ribbon.add_app {
    font-size: 20px;
    font-size: 1.25rem;
  }
}


.info_1 .box1 .col2_in,
.info_2 .box2 .col2_in,
.info_2 .box3 .col2_in {
  flex-basis: calc((100% - 20px)/2);
  max-width: calc((100% - 20px)/2);
  margin-top: 20px;
  text-align: center
}

.info_1 .box1 .col2_in:nth-of-type(1),
.info_1 .box1 .col2_in:nth-of-type(2),
.info_2 .box2 .col2_in:nth-of-type(1),
.info_2 .box2 .col2_in:nth-of-type(2),
.info_2 .box3 .col2_in:nth-of-type(1),
.info_2 .box3 .col2_in:nth-of-type(2) {
  margin-top: 0
}

.info_1 .box1 .col2,
.info_2 .box2 .col2,
.info_2 .box3 .col2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between
}

.info_1 .box1 .lead {
  width: 780px;
  margin: 0 auto;
  margin-top: -10px;
  line-height: 1.6
}

.info_1 .box1 hr {
  border: none;
  border-top: 2px dotted #526dac;
  width: calc(100% - 40px);
  margin: 27px 20px;
}

.info_1 .box1 .png1 {
  margin-top: 32px
}

.info_1 .box1 .png1 img {
  width: 87%;
  padding-left: 57px
}

.info_1 .box1 .text1 {
  position: relative
}

.info_1 .box1 .text1 .svg1 {
  position: absolute;
  top: 60px;
  left: 138px
}

.info_1 .box1 .text1 .svg1 img {
  width: 70%
}

.info_1 .box1 .text1 .text1_1 {
  font-size: 23px;
  font-size: 1.4375rem;
  /*position: absolute;*/
  /*top: 120px;*/
  /*left: 48px;*/
  font-weight: bold;
  /*letter-spacing: 1.9px;*/
  width: calc(100% - 40px);
  text-align: center;
  margin-bottom: 40px;
}

.info_1 .box1 .text1 .text1_2 {
  /*position: absolute;*/
  /*width: 330px;*/
  /*top: 175px;*/
  /*left: 23px;*/
  text-align: left;
  width: calc(100% - 40px);
}

.info_1 .box1 .png2 {
  margin-top: 12px
}

.info_1 .box1 .png2 img {
  width: 87%;
  padding-left: 57px
}

.info_1 .box1 .text2 {
  position: relative
}

.info_1 .box1 .text2 .svg2 {
  position: absolute;
  top: 23px;
  left: 152px
}

.info_1 .box1 .text2 .svg2 img {
  width: 70%
}

.info_1 .box1 .text2 .text2_1 {
  font-size: 23px;
  font-size: 1.4375rem;
  position: absolute;
  top: 94px;
  /*left: 18px;*/
  font-weight: bold;
  /*letter-spacing: 1.9px*/
  width: calc(100% - 40px);
  text-align: center;
}

.info_1 .box1 .text2 .text2_2 {
  position: absolute;
  /*width: 330px;*/
  top: 149px;
  /*left: 33px;*/
  text-align: left;
  width: calc(100% - 40px);
}

.info_1 .box1 .png3 {
  margin-top: 9px
}

.info_1 .box1 .png3 img {
  padding-left: 57px
}

.info_1 .box1 .text3 {
  position: relative
}

.info_1 .box1 .text3 .svg3 {
  position: absolute;
  top: 29px;
  left: 162px
}

.info_1 .box1 .text3 .svg3 img {
  width: 70%
}

.info_1 .box1 .text3 .text3_1 {
  font-size: 23px;
  font-size: 1.4375rem;
  position: absolute;
  top: 111px;
  /*left: 44px;*/
  font-weight: bold;
  /*letter-spacing: -0.1px*/
  width: calc(100% - 40px);
  text-align: center;
}

.info_1 .box1 .text3 .text3_2 {
  position: absolute;
  /*width: 366px;*/
  top: 164px;
  /*left: 6px;*/
  text-align: left;
  width: calc(100% - 40px);
}

.info_2 .box2 {
  padding-bottom: 44px;
  margin-top: 58px
}

.info_2 .box2 .lead {
  width: 780px;
  margin: 0 auto;
  margin-top: -10px;
  line-height: 1.6
}

.info_2 .box2 hr {
  border: none;
  border-top: 2px dotted #526dac;
  width: 93%;
  margin: 25px 34px 0px
}

.info_2 .box2 .png4 {
  margin-top: 28px
}

.info_2 .box2 .png4 img {
  width: 87%;
  padding-left: 57px
}

.info_2 .box2 .text4 {
  position: relative
}

.info_2 .box2 .text4 .svg4 {
  position: absolute;
  top: 56px;
  left: 105px
}

.info_2 .box2 .text4 .svg4 img {
  width: 70%
}

.info_2 .box2 .text4 .text4_1 {
  font-size: 23px;
  font-size: 1.4375rem;
  position: absolute;
  top: 119px;
  left: 112px;
  font-weight: bold;
  letter-spacing: -0.1px
}

.info_2 .box2 .text4 .text4_2 {
  position: absolute;
  width: 366px;
  top: 173px;
  left: 6px
}

.info_2 .box2 .png5 {
  margin-top: 12px
}

.info_2 .box2 .png5 img {
  width: 87%;
  padding-left: 57px
}

.info_2 .box2 .text5 {
  position: relative
}

.info_2 .box2 .text5 .svg5 {
  position: absolute;
  top: 22px;
  left: 147px
}

.info_2 .box2 .text5 .svg5 img {
  width: 70%
}

.info_2 .box2 .text5 .text5_1 {
  font-size: 23px;
  font-size: 1.4375rem;
  position: absolute;
  top: 91px;
  left: 148px;
  font-weight: bold
}

.info_2 .box2 .text5 .text5_2 {
  position: absolute;
  width: 345px;
  top: 146px;
  left: 22px
}

.info_2 .box2 .png6 {
  margin-top: 9px
}

.info_2 .box2 .png6 img {
  width: 87%;
  padding-left: 57px
}

.info_2 .box2 .text6 {
  position: relative
}

.info_2 .box2 .text6 .svg6 {
  position: absolute;
  top: 31px;
  left: 149px
}

.info_2 .box2 .text6 .svg6 img {
  width: 70%
}

.info_2 .box2 .text6 .text6_1 {
  font-size: 23px;
  font-size: 1.4375rem;
  position: absolute;
  top: 108px;
  left: 88px;
  font-weight: bold;
  letter-spacing: -0.1px
}

.info_2 .box2 .text6 .text6_2 {
  position: absolute;
  width: 411px;
  top: 161px;
  left: -10px
}

.info_2 .box3 {
  margin-top: 58px;
  padding-bottom: 42px
}

.info_2 .box3 .lead {
  width: 780px;
  margin: 0 auto;
  margin-top: -10px;
  line-height: 1.6
}

.info_2 .box3 hr {
  border: none;
  border-top: 2px dotted #526dac;
  width: 93%;
  margin: 24px 34px 0px
}

.info_2 .box3 .png7 {
  margin-top: 28px
}

.info_2 .box3 .png7 img {
  width: 87%;
  padding-left: 57px
}

.info_2 .box3 .text7 {
  position: relative
}

.info_2 .box3 .text7 .svg7 {
  position: absolute;
  top: 46px;
  left: 145px
}

.info_2 .box3 .text7 .svg7 img {
  width: 70%
}

.info_2 .box3 .text7 .text7_1 {
  font-size: 23px;
  font-size: 1.4375rem;
  position: absolute;
  top: 113px;
  left: 96px;
  font-weight: bold;
  letter-spacing: -0.1px
}

.info_2 .box3 .text7 .text7_2 {
  position: absolute;
  width: 340px;
  top: 166px;
  left: 14px
}

.info_2 .box3 .png8 {
  margin-top: 11px
}

.info_2 .box3 .png8 img {
  width: 87%;
  padding-left: 57px
}

.info_2 .box3 .text8 {
  position: relative
}

.info_2 .box3 .text8 .svg8 {
  position: absolute;
  top: 34px;
  left: 143px
}

.info_2 .box3 .text8 .svg8 img {
  width: 70%
}

.info_2 .box3 .text8 .text8_1 {
  font-size: 23px;
  font-size: 1.4375rem;
  position: absolute;
  top: 94px;
  left: 56px;
  font-weight: bold
}

.info_2 .box3 .text8 .text8_2 {
  position: absolute;
  width: 411px;
  top: 148px;
  left: 6px
}

.footer_banner {
  margin: 0px auto;
  text-align: center;
  padding: 70px 0 4px;
  background: #fff
}

.footer_banner .title {
  font-size: 28px;
  font-size: 1.75rem;
  letter-spacing: -1.2px;
  padding-top: 28px;
}

@media(max-width:1000px) {
  .footer_banner .title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}

.footer_banner .title br, br.sp{
  display: none;
}

@media(max-width: 540px) {
  .footer_banner .title br, br.sp {
    display: block;
  }
}

.footer_banner .logo_img {
  background: #fff;
  max-width: 1000px;
  padding: 40px 40px 64px;
  margin: 46px auto 62px;
  border-radius: 14px;
  filter: drop-shadow(0px 4px 2px rgba(0, 0, 0, 0.1))
}

@media(max-width:1000px) {
  .footer_banner .logo_img {
    padding: 20px 20px 44px;
  }
}


.footer_banner .logo_wrap {
  /*width: 894px;*/
  overflow: hidden;
  margin: 0 auto;
  margin-top: -6px
}

.footer_banner .box {
  height: 20px;
  width: calc(12.5% - 32px);
  float: left;
  position: relative;
  margin: 4px 16px;
  padding: 32px 0;
}

@media(max-width:940px) {
  .footer_banner .box {
    width: calc(16.6% - 32px);
  }
}

@media(max-width:740px) {
  .footer_banner .box {
    width: calc(25% - 16px);
    margin: 4px 8px;
  }
}

.footer_banner .box img {
  width: 100%;
  max-height: 60px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  object-fit: contain;
}

.wrap::after {
  width: 1360px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
  opacity: .5;
  content: url(../images/WORKUS_about.png)
}

.footer_banner span {
  display: inline-block;
  width: 100%;
  font-size: 12px;
  text-align: right;
  margin-top: 20px;
}

/*! WORKUSとは end */

/*! 資料ダウンロード start */
.free_dl {
  position: fixed;
  right: 40px;
  z-index: 2;
  bottom: 40px;
  width: 213px;
  border-radius: 4px
}

.free_dl .free_dl_wrap {
  position: sticky;
  top: 80px;
  filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.5))
}

.free_dl__in {
  background: #fff;
  border-radius: 4px
}

.free_dl__title {
  font-size: 11.5px;
  font-size: 0.71875rem;
  background: #002e4e;
  color: #fff;
  text-align: center;
  padding: 11px 0 8px;
  border-radius: 4px 4px 0 0
}

.free_dl h2 {
  font-size: 14px;
  font-size: 0.875rem;
  text-align: center;
  font-weight: bold;
  color: #002e4e;
  padding: 14px 0 0;
  font-weight: bold
}

.free_dl__text {
  padding: 10px 22px 16px;
  font-size: 11px;
  font-size: 0.6875rem;
  line-height: 1.7
}

.free_dl__btn {
  text-align: center
}

.free_dl__btn a img {
  width: 172px;
  padding-bottom: 13px
}

.free_dl .close_btn {
  display: block;
  position: relative;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  margin-left: auto;
  margin-bottom: 6px
}

.free_dl .close_btn::before,
.free_dl .close_btn::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.5px;
  height: 10px;
  background: #002e4e
}

.free_dl .close_btn::before {
  transform: translate(-50%, -50%) rotate(45deg)
}

.free_dl .close_btn::after {
  transform: translate(-50%, -50%) rotate(-45deg)
}

.show {
  animation-name: on;
  animation-duration: .8s;
  animation-fill-mode: forwards;
  opacity: 1
}

@keyframes on {
  from {
    opacity: 0;
    transform: translateY(0)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

.showNone {
  animation-name: off;
  animation-duration: .8s;
  animation-fill-mode: forwards;
  opacity: 0
}

@keyframes off {
  from {
    opacity: 1;
    transform: translateY(0)
  }

  to {
    opacity: 0;
    transform: translateY(0)
  }
}



/* sp */
@media (max-width: 800px) {

  .free_dl {
    bottom: 2%;
  }

  .responsive {
    content: url('../images/top_dl_btn_sp.svg');
  }

  .free_dl__btn a img {
    width: 320px;
    height: auto;
    margin: 0;
    padding: 0;
  }

  .free_dl__btn {
    width: 320px;
    margin: 0 auto;
    padding: 0;
  }

  .free_dl {
    width: 100%;
    right: 0;
  }

  .free_dl__in {
    background: inherit;
  }

  .free_dl .free_dl_wrap {
    filter: none;
  }

  .free_dl .close_btn,
  .free_dl h2,
  .free_dl .free_dl__title,
  .free_dl .free_dl__text {
    display: none !important;
  }
}

/*! 資料ダウンロード end */

/* 20240422 start */
.top_visual_add_btn img.main_pc {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.top_visual_add_btn {
  position: relative;
}

/* TOP App btn */
.top_visual_add_btn .top_btn_box .btn_apple {
  position: absolute;
  top: 56.2%;
  left: 34.8%;
  display: block;
}

.top_visual_add_btn .top_btn_box .btn_apple a {
  display: block;
  width: 100%;
}

.top_visual_add_btn .top_btn_box .btn_google {
  position: absolute;
  top: 56.2%;
  left: 59.5%;
  display: block;
}

.top_visual_add_btn tr.btn_sp {
  display: none;
}

.top_visual_add_btn .top_btn_box .btn_google a {
  display: block;
  width: 100%;
}

.top_visual_add_btn img.main_sp {
  display: none;
}

/* ヘッダ start */
@media (min-width: 1001px) and (max-width: 1059px) {
  /* .top_visual_add_btn .top_btn_box .btn_google {
    left: 67.4%;
  } */
}
/* ヘッダ end */

/* sp */
@media (max-width: 1000px) {
  .top_visual_add_btn img.main_pc {
    display: none;
  }

  .top_visual_add_btn img.main_sp {
    display: block;
    width: 100%;
  }

  .top_visual_add_btn .top_btn_box {
    position: absolute;
    transform: translate(-50%, -50%);
    left: 50%;
    bottom: 0.5%;
    width: 92%;
  }

  .top_visual_add_btn .btn_apple a {
    display: block;
    width: 100%;
  }

  .top_visual_add_btn .btn_google a {
    display: block;
    width: 100%;
    margin-left: auto;
  }

  .top_visual_add_btn .btn_apple img {
    width: 80%;
  }

  .top_visual_add_btn .btn_google img {
    width: 80%;
  }

  .top_visual_add_btn .top_btn_box .btn_apple {
    position: inherit;
    display: block;
    text-align: center;
  }

  .top_visual_add_btn .top_btn_box .btn_google {
    position: inherit;
    display: block;
    text-align: center;
  }

  .top_visual_add_btn tr.btn_sp {
    display: block;
  }

  .top_visual_add_btn tr.btn_pc {
    display: none;
  }

}

@media (max-width: 640px) {
  .top_visual_add_btn .top_btn_box .btn_apple a {
    display: block;
    width: 100%;
  }

  .top_visual_add_btn .top_btn_box .btn_google a {
    display: block;
    width: 100%;
  }
}

.feature_text .title::after {
  content: "";
  display: block;
  width: 100px;
  height: 7px;
  margin-top: 6px;
  background: #2755d9;
  position: absolute;
  left: calc(50% - 256px);
}

.info_box_first .title::after {
  content: "";
  display: block;
  width: 100px;
  height: 7px;
  margin-top: 16px;
  background: #2755d9;
  position: absolute;
}

.line_both_sides.one {
  margin: 0 auto 40px;
}

.line_both_sides {
  font-size: 32px;
  font-size: 2rem;
  font-weight: 700;
  width: 1048px;
  margin: 0 auto;
  padding: 16px;
  display: inline-block;
  position: relative;
  left: 50%;
  transform: translate(-50%);
  text-align: center;
  color: #002E4E;
}

.line_both_sides:before {
  content: "";
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 32%;
  height: 1px;
  background: #002E4E;
  left: 0;
}

.line_both_sides:after {
  content: "";
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 32%;
  height: 1px;
  background: #002E4E;
  right: 0;
}

/* 20240708 start */

.qr_image img {
  width: 128px;
}

.app_dl .img_box_apple {
  width: 100%;
  margin: 16px auto;
}

.app_dl .img_box_google {
  width: 100%;
  margin: 16px auto;
}

.dl_box .btn_apple {
  margin-right: 32px;
}

.dl_box .btn_apple a {
  margin-left: 42px;
}

.dl_box .btn_google {
  margin-right: 32px;
}

.dl_box .btn_google a {
  margin-left: 42px;
}
/* 20240708 end */


@media (max-width: 1000px) {

  .info_box_first .title::after,
  .feature_text .title::after {
    height: inherit;
  }

  .line_both_sides {
    width: 100%;
  }

  .line_both_sides:before {
    width: 12%;
  }

  .line_both_sides:after {
    width: 12%;
  }

  .app_dl .img_box_apple {
    width: 70%;
    margin: 16px auto;
  }
  
  .app_dl .img_box_google {
    width: 70%;
    margin: 16px auto;
  }
  
  .dl_box .btn_apple {
    margin-right: 32px;
  }
  
  .dl_box .btn_google {
    margin-right: 32px;
  }
  
  .dl_box .btn_apple a {
    margin-left: 0;
  }
    
  .dl_box .btn_google a {
    margin-left: 0;
  }

  .qr_image {
    text-align: center;
    padding: 24px 0;
  }
  
  .qr_image img {
    width: 68px;
  }

}

/* dl */
.dl_box {
  width: 900px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

.app_dl {
  width: 48%;
  background: #fff;
  border-radius: 4px;
  /* justify-content: center;
  align-items: center; */
  border-radius: 10px 10px 10px 10px;
  filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.5));
}

.app_dl_title_pc {
  font-size: 19px;
  background: #55A7D3;
  color: #fff;
  text-align: center;
  padding: 11px 0 8px;
  border-radius: 10px 10px 0 0;
}

.app_dl_title_sp {
  display: none;
}

.app_dl_text {
  font-size: 10px;
  text-align: center;
  margin-bottom: 24px;
  color: black;
}

.app_dl_text>span {
  display: block;
}

.app_text_sp {
  display: none;
}

@media (max-width: 1000px) {
  .app_dl .img_box_apple {
    margin: 0 auto;
    padding: 40px 0 16px;
    text-align: center;
  }

  .app_dl .img_box_google {
    margin: 0 auto;
    padding: 40px 0 16px;
    text-align: center;
  }

  .app_dl .btn_apple a {
    display: block;
    width: 100%;
  }

  .app_dl .btn_google a {
    display: block;
    width: 100%;
  }

  .app_dl .btn_apple img {
    width: 100%;
  }

  .app_dl .btn_google img {
    width: 100%;
  }

  .app_dl_title_pc {
    display: none;
  }

  .app_dl_title_sp {
    display: block;
    font-size: 26px;
    background: #55A7D3;
    color: #fff;
    text-align: center;
    padding: 11px 0 8px;
    border-radius: 10px 10px 0 0;
  }

  @media(max-width: 640px) {
    .app_dl_title_sp {
      font-size: 22px;
    }
  }

  .dl_box {
    width: 90%;
    margin: 0 auto;
    display: inherit;
  }

  .app_dl {
    width: 100%;
    margin-bottom: 40px;
  }

  .app_text_sp {
    display: block;
    font-size: 20px;
    line-height: 1.8;
  }

  .app_text_sp p:first-child {
    font-weight: bold;
  }

  .qr_image {
    display: none;
  }

  .app_dl_text {
    display: none;
  }
}

/* footer start */
.bottom_btn_wrap .bottom_btn_box {
  position: relative;
  width: 800px;
  margin: 0 auto;
}

.dl_footer_pc {
  width: 100%;
  background: #55a7d3;
  margin: 0 auto;
  text-align: center;
  padding: 16px 0;
}

.dl_footer_pc img {
  width: 100%;
  max-width: 900px;
}

.dl_footer_pc {
  position: relative;
}

.dl_footer_sp img {
  display: none;
}

.bottom_btn_wrap .bottom_btn_box .btn_apple {
  position: absolute;
  top: 52px;
  right: 300px;
  display: block;
  z-index: 1;
}

.bottom_btn_wrap .bottom_btn_box .btn_apple a {
  display: block;
  width: 100%;
}

.bottom_btn_wrap td span.btn_apple img {
  width: 120px;
}

.bottom_btn_wrap td span.btn_google img {
  width: 120px;
}

.bottom_btn_wrap .bottom_btn_box .btn_google {
  position: absolute;
  top: 52px;
  right: 47px;
  display: block;
  z-index: 1;
}

.bottom_btn_wrap .bottom_btn_box .btn_google a {
  display: block;
  width: 100%;
}

@media (max-width: 1000px) {
  .dl_footer_pc img {
    display: none;
  }

  .dl_footer_sp img {
    display: block;
    width: 100%;
  }

  .bottom_btn_wrap {
    position: relative;
  }

  .bottom_btn_wrap .bottom_btn_box {
    position: absolute;
    transform: translate(-50%, -50%);
    left: 50%;
    bottom: 2.6%;
    width: 92%;
  }

  .bottom_btn_wrap .bottom_btn_box .btn_apple a {
    display: block;
    width: 100%;
  }

  .bottom_btn_wrap .bottom_btn_box .btn_google a {
    display: block;
    width: 100%;
    margin-left: auto;
  }

  .bottom_btn_wrap .bottom_btn_box .btn_apple {
    position: inherit;
    display: block;
    text-align: center;
  }

  .bottom_btn_wrap .bottom_btn_box .btn_google {
    position: inherit;
    display: block;
    text-align: center;
  }

  .bottom_btn_wrap .bottom_btn_box .btn_apple img {
    width: 80%;
  }

  .bottom_btn_wrap .bottom_btn_box .btn_google img {
    width: 80%;
  }

  .dl_footer_pc {
    background: inherit;
  }
}

@media (max-width: 640px) {
  .bottom_btn_wrap .bottom_btn_box .btn_apple a {
    display: block;
    width: 100%;
  }

  .bottom_btn_wrap .bottom_btn_box .btn_google a {
    display: block;
    width: 100%;
  }
}
/* footer end */
/* 20240422 end */


/* 20240710 start */
.sky_blue {
  background: #e7fbff;
}
@media screen and (max-width: 1000px){
  .contents.sky_blue {
    padding: 0 8px;
    width: calc(100% - 16px);
  }
}

.sky_blue .contents .box_title::after {
  background: #012E4E;
}

.table_design {
  font-size: 19px;
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  max-width: 976px;
  text-align: center;
  margin: 0 auto;
}

.table_design td {
  text-align: center;
}

.table_design thead th {
  color: #fff;
  border-left: none;
  border-right: none;
  text-align: center;
}

.table_design tbody th {
  color: #fff;
  text-align: center;
}

.boder_1,
.boder_2,
.boder_2_2,
.boder_3,
.boder_4 {
  display: block;
  /*余白重要*/
  margin: 6px 6px;
  font-weight: bold;
  padding: 0 4px;
}

.boder_1 {
  background: #002e4f;
  border-radius: 10px;
  height: 50px;
  line-height: 50px;
}

.boder_2 {
  background: #002e4f;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 140px;
  line-height: 140px;
}

.boder_2_2 {
  background: #002e4f;
  border-radius: 10px;
  display: block;
  height: 140px;
  line-height: 92px;
  font-weight: bold;
}

.color_white {
  background: #fff;
}

.boder_3 {
  background: #fff;
  display: flex;
  flex-direction: column;  
  border-radius: 10px;
  height: 140px;
  justify-content: center;
}

.boder_3 span {
  /*padding: 12px 0 0 0;*/
  /*line-height: 1.2;*/
  display: block;
  text-align: left;
  padding-left: 1.5em;
  text-indent: -1em;
}

.boder_5 {
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 10px;
  height: 140px;
  margin: 0 6px 0;
}

.boder_5 .title {
  display: block;
  padding-top: 10px;
  font-weight: bold;
}

.boder_5 .rei {
  padding-left: 3em;
  text-indent: -3em;
}

.boder_5 dl {
  font-size: 15px;
  color: #707070;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding-top: 10px;
}

.boder_5 dt {
  width: 30%;
  text-align: right;
  background: #fff;
}

.boder_5 dd {
  width: 70%;
  text-align: left;
  background: #fff;
}

.inquiry a {
  /*
  height: 38px;
  line-height: 38px;
  */
  display: block;
  /*width: 80%;
  margin: -16px auto 0;
  */
  margin: -116px auto 0;
  font-size: 14px;
  color: #3571DA;
  font-weight: bold;
  padding: 0;
  height: 0;
  /*
  border-radius: 32px;
  border: 1px solid #3571DA;
  */
}

/* 20240719 start */
.table_design_sp {
  display: none;
}
/* 20240719 end */

@media screen and (max-width: 880px) {
  /* .x_scroll {
    overflow-x: auto;
  } */
  .table_design {
    width: 100%;
    text-align: left;
    font-size: 18px;
  }
  .boder_5 dl {
    font-size: 14px;
  }
  .boder_5 dt {
    width: 45%;
  }
  .boder_5 dd {
    width: 40%;
  }
  .table_design td::before {
    color: #002e4e;
  }

/* 20240719 start */  
  /*pc*/
  .table_design_pc {
    display: none;
  }
  .table_design_sp {
    display: block;
  }
  .table_design_sp span {
    display: block;
    font-weight: bold;
    font-size: 15px;
    margin-left: 6px;
    padding-top: 20px;
  }
  .table_design_sp span.last {
    padding-bottom: 8px;
  }
/* 20240719 end */
}

@media screen and (max-width: 780px) {
  .table_design {
    width: 100%;
    text-align: left;
    font-size: 16px;
  }
}

@media screen and (max-width: 460px) {
  .boder_2, .boder_2_2 {
    font-size: 15px;
  }
  .boder_3 {
    font-size: 13.5px;
  }
 .boder_3 span {
    /*padding: 13px 0 0 0;*/
    /*line-height: 1.2;*/
    display: block;
    text-align: left;
    /*padding-left: 1.0em;*/
    text-indent: -1em;
  }
  .boder_5 .title {
    padding: 8px 12px 0 12px;
  }
  .boder_5 dd {
    width: 60%;
  }
  .table_design {
    width: 100%;
    font-size: 14px;
  }
  .boder_5 dl {
    font-size: 13px;
    /*padding-left: 8px;*/
  }
  .boder_5 dt {
    width: 40%;
  }
  .table_design_sp span {
    font-size: 15px;
  }
  .inquiry a {
    font-size: 12px;
  }
}
/* 20240710 end */
