/*	cmn-color
------------------------------------ */
/*	transition,hover
------------------------------------ */
/*	media-screen
------------------------------------ */
/*	font
------------------------------------ */
@font-face {
  font-family: "Noto Serif Regular";
  src: url("../fonts/NotoSerifCJKjp-Regular.woff") format("woff");
}
@font-face {
  font-family: "Noto Serif Medium";
  src: url("../fonts/NotoSerifCJKjp-Medium.woff") format("woff");
}
@font-face {
  font-family: "Noto Serif SemiBold";
  src: url("../fonts/NotoSerifCJKjp-SemiBold.woff") format("woff");
}
@font-face {
  font-family: "Noto Serif Bold";
  src: url("../fonts/NotoSerifCJKjp-Bold.woff") format("woff");
}
@font-face {
  font-family: "Noto Serif Black";
  src: url("../fonts/NotoSerifCJKjp-Black.woff") format("woff");
}
@font-face {
  font-family: "shippori";
  src: url("../fonts/ShipporiMinchoB1-Bold.ttf");
}
@font-face {
  font-family: "ms";
  src: url("../fonts/msmincho.ttc");
}
@font-face {
  font-family: "bodoni";
  src: url("../fonts/BodoniModa_18pt-Medium.ttf");
}
/*	layout
------------------------------------ */
/*	cmn-color
------------------------------------ */
/*	transition,hover
------------------------------------ */
/*	media-screen
------------------------------------ */
/*	font
------------------------------------ */
@font-face {
  font-family: "Noto Serif Regular";
  src: url("../fonts/NotoSerifCJKjp-Regular.woff") format("woff");
}
@font-face {
  font-family: "Noto Serif Medium";
  src: url("../fonts/NotoSerifCJKjp-Medium.woff") format("woff");
}
@font-face {
  font-family: "Noto Serif SemiBold";
  src: url("../fonts/NotoSerifCJKjp-SemiBold.woff") format("woff");
}
@font-face {
  font-family: "Noto Serif Bold";
  src: url("../fonts/NotoSerifCJKjp-Bold.woff") format("woff");
}
@font-face {
  font-family: "Noto Serif Black";
  src: url("../fonts/NotoSerifCJKjp-Black.woff") format("woff");
}
@font-face {
  font-family: "shippori";
  src: url("../fonts/ShipporiMinchoB1-Bold.ttf");
}
@font-face {
  font-family: "ms";
  src: url("../fonts/msmincho.ttc");
}
@font-face {
  font-family: "bodoni";
  src: url("../fonts/BodoniModa_18pt-Medium.ttf");
}
/*	layout
------------------------------------ */
/*	font-size  cmn
------------------------------------ */
/* =========================================

  main layout  all

========================================= */
/*	com parts  PC
------------------------------------ */
.sns-none {
  display: none !important;
}

.over {
  overflow: hidden;
}

.pre {
  white-space: pre-line;
}

.no-sb {
  margin: 50px auto 0;
}

.anchor-mp {
  margin: -170px auto 0;
  padding-top: 170px;
}

.com-txt-box p:nth-of-type(n+2) {
  margin-top: 14px;
}
.com-txt-ac {
  font-family: "Noto serif Bold", serif;
}

.clamp1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.clamp2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.clamp3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

@media screen and (min-width: 768px) {
  .com-pd {
    padding: 110px 0 130px;
  }
}

.com-tel-note {
  display: block;
  line-height: 1;
}
.com-tel-link {
  margin-top: 7px;
  padding-left: 38px;
  background: url(../img/s-top/info-tel.png) no-repeat left center;
}
.com-tel-num {
  font-family: "ms", "Noto serif Regular", serif;
  font-size: 35px;
  font-size: 3.5rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #111111;
}
@media screen and (max-width: 767px) {
  .com-tel-num {
    font-size: 22px;
    font-size: 2.2rem;
  }
}

.com-mail {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 230px;
  height: 50px;
  border: 1px solid #a50a2a;
  background-color: #fff;
  border-radius: 999px;
  text-align: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.com-mail-ttl {
  margin-left: 8px;
  padding-top: 3px;
  font-family: "Noto serif Medium", serif;
  font-size: 15px;
  font-size: 1.5rem;
  letter-spacing: 0.08em;
  color: #111111;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media screen and (max-width: 767px) {
  .com-mail-ttl {
    font-size: 13px;
    font-size: 1.3rem;
  }
}
.com-mail:hover .com-mail-ttl {
  color: #a50a2a;
}

.com-sub-bg {
  background: url(../img/sub/com-sec01.png) no-repeat center top;
}
@media screen and (min-width: 1921px) {
  .com-sub-bg {
    background-size: 100%;
  }
}

/*	top-about  PC
------------------------------------ */
#top-about .about-inner {
  position: relative;
}
#top-about .about-con {
  max-width: 540px;
  margin-left: auto;
}
#top-about .about-img {
  position: absolute;
  top: 130px;
  left: calc(50% - 960px);
}
#top-about .about-ttl {
  margin-top: 65px;
  margin-left: -10px;
  font-family: "Noto serif SemiBold", serif;
  font-size: 35px;
  font-size: 3.5rem;
  letter-spacing: 0.08em;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  #top-about .about-ttl {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
#top-about .about-ttl-ac {
  letter-spacing: 0.08em;
  display: inline-block;
  background: rgb(103, 221, 235);
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(103, 221, 235)), color-stop(32%, rgb(40, 203, 234)), color-stop(76%, rgb(62, 182, 244)), to(rgb(68, 176, 246)));
  background: -webkit-linear-gradient(top, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  background: linear-gradient(180deg, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 1;
  position: relative;
}
#top-about .about-ttl-ac::before {
  content: "";
  display: block;
  width: 83px;
  height: 7px;
  background: url(../img/top/about-ttl-cir.png) no-repeat left center, url(../img/top/about-ttl-cir.png) no-repeat center, url(../img/top/about-ttl-cir.png) no-repeat right center;
  position: absolute;
  top: -14px;
  left: 52px;
}
#top-about .com-btn {
  margin-top: 59px;
}

/*	top-service  PC
------------------------------------ */
#top-service .service-bg {
  background: url(../img/top/service-right.png) no-repeat 95.5% 66px/12.1%, url(../img/top/service-ttl-ico.png) no-repeat calc(50% - 630px) 310px, url(../img/top/service-bg.png) no-repeat center bottom/100%;
}
#top-service .service-ttl {
  margin-top: 68px;
}
#top-service .service-ttl-box {
  padding: 3px 19px;
  background: #0098bd;
  border-radius: 999px;
  font-family: "Noto serif SemiBold", serif;
  font-size: 30px;
  font-size: 3rem;
  letter-spacing: 0.08em;
  line-height: 1;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #top-service .service-ttl-box {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
#top-service .service-ttl-txt {
  display: block;
  font-family: "Noto serif Medium", serif;
  font-size: 35px;
  font-size: 3.5rem;
  letter-spacing: 0.08em;
  color: #111111;
}
@media screen and (max-width: 767px) {
  #top-service .service-ttl-txt {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
#top-service .service-ttl-txt-ac {
  display: inline-block;
  background: rgb(103, 221, 235);
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(103, 221, 235)), color-stop(32%, rgb(40, 203, 234)), color-stop(76%, rgb(62, 182, 244)), to(rgb(68, 176, 246)));
  background: -webkit-linear-gradient(top, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  background: linear-gradient(180deg, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#top-service .service-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 1253px;
  margin-top: 153px;
  margin-left: -92px;
  text-align: center;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#top-service .service-list-item {
  width: 480px;
  height: 480px;
  padding-top: 227px;
  background: url(../img/top/service-txt-bg.png) no-repeat center/cover;
  position: relative;
}
#top-service .service-list-item:nth-of-type(2) {
  margin-top: 105px;
}
#top-service .service-list-item:nth-of-type(3) {
  margin-top: 201px;
}
#top-service .service-list-ttl {
  margin: auto;
  position: absolute;
  left: 0;
  right: 0;
  top: -52px;
}
#top-service .service-list-txt {
  display: inline;
  border-bottom: 2px dotted #1e5679;
  font-family: "Noto serif Medium", serif;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 0.08em;
  line-height: 2.5;
  color: #111111;
}
@media screen and (max-width: 767px) {
  #top-service .service-list-txt {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
#top-service .service-btn {
  margin-top: -120px;
}

/*	top-bnr  PC
------------------------------------ */
#top-bnr .bnr-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
#top-bnr .bnr-list-item {
  width: 100%;
  max-width: 510px;
}
@media screen and (min-width: 768px) {
  #top-bnr .bnr-list-item:hover a {
    opacity: 1;
    -webkit-transform: translateY(-10px);
            transform: translateY(-10px);
  }
}
#top-bnr .bnr-list li:nth-of-type(n+2) {
  margin-left: 60px;
}
#top-bnr .bnr-list-link {
  display: block;
  padding: 117px 0 123px;
}
#top-bnr .bnr-list-link01 {
  background: url(../img/top/bnr-flow.jpg) no-repeat center/cover;
}
#top-bnr .bnr-list-link02 {
  background: url(../img/top/bnr-company.jpg) no-repeat center/cover;
}
#top-bnr .bnr-list-head {
  text-align: center;
}
#top-bnr .bnr-list-head-en {
  font-family: "bodoni", "Noto serif Medium", serif;
  font-size: 50px;
  font-size: 5rem;
  letter-spacing: 0.08em;
  line-height: 1;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #top-bnr .bnr-list-head-en {
    font-size: 30px;
    font-size: 3rem;
  }
}
#top-bnr .bnr-list-head-ja {
  display: block;
  width: 160px;
  height: 40px;
  margin: 8px auto 0;
  background: #fff;
  font-family: "Noto serif Medium", serif;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.08em;
  line-height: 40px;
  color: #111111;
}
@media screen and (max-width: 767px) {
  #top-bnr .bnr-list-head-ja {
    font-size: 19px;
    font-size: 1.9rem;
  }
}

/*	top-contact  PC
------------------------------------ */
#top-contact .contact-bg {
  background: url(../img/top/com-contact-bg.png) no-repeat center/cover;
}
#top-contact .contact-box {
  margin: 50px auto 0;
  padding: 65px 0 39px;
  background: #fff;
  position: relative;
}
#top-contact .contact-box-ttl {
  max-width: 700px;
  margin: auto;
  background: #0098bd;
  border-radius: 999px;
  padding: 8.5px;
  text-align: center;
  font-family: "Noto serif Bold", serif;
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 0.08em;
  line-height: 1.5;
  color: #fff;
  position: absolute;
  top: -25px;
  left: 0;
  right: 0;
}
@media screen and (max-width: 767px) {
  #top-contact .contact-box-ttl {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
#top-contact .contact-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
#top-contact .contact-list li:nth-of-type(n+2) {
  margin-left: 38px;
}
#top-contact .com-head01 {
  text-align: center;
}
#top-contact .com-head01-en {
  display: inline-block;
  font-family: "bodoni", "Noto serif Medium", serif;
  background: rgb(29, 213, 230);
  background: -webkit-gradient(linear, left bottom, left top, from(rgb(29, 213, 230)), to(rgb(70, 174, 247)));
  background: -webkit-linear-gradient(bottom, rgb(29, 213, 230) 0%, rgb(70, 174, 247) 100%);
  background: linear-gradient(0deg, rgb(29, 213, 230) 0%, rgb(70, 174, 247) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#top-contact .com-tel-link {
  padding-left: 55px;
  background-image: url(../img/top/com-contact-tel.png);
}
#top-contact .com-tel-num {
  font-size: 50px;
  font-size: 5rem;
}
@media screen and (max-width: 767px) {
  #top-contact .com-tel-num {
    font-size: 30px;
    font-size: 3rem;
  }
}
@media screen and (min-width: 768px) {
  #top-contact .com-mail {
    width: 400px;
    height: 80px;
    border-width: 2px;
  }
  #top-contact .com-mail-ttl {
    font-size: 20px;
    font-size: 2rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 767px) {
  #top-contact .com-mail-ttl {
    font-size: 19px;
    font-size: 1.9rem;
  }
}

/* =========================================

sub layout  PC

========================================= */
.sub main {
  position: relative;
}

/*	about  PC
------------------------------------ */
.com-sub-flex {
  margin: 60px auto 0;
}
.com-sub-ttl {
  font-family: "Noto serif Bold", serif;
  font-size: 30px;
  font-size: 3rem;
  display: inline-block;
  background: rgb(103, 221, 235);
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(103, 221, 235)), color-stop(32%, rgb(40, 203, 234)), color-stop(76%, rgb(62, 182, 244)), to(rgb(68, 176, 246)));
  background: -webkit-linear-gradient(top, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  background: linear-gradient(180deg, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 0.08em;
  line-height: 1;
  position: relative;
}
@media screen and (max-width: 767px) {
  .com-sub-ttl {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.com-sub-ttl::before {
  content: "";
  display: block;
  width: 360px;
  height: 1px;
  margin: auto;
  background-color: #111111;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 180px;
}
.com-sub-txt {
  margin-top: 20px;
}
.com-sub-btn {
  margin-top: 49px;
}
.com-sub-box {
  margin: 90px auto 0;
}
.com-sub-box-ttl {
  display: block !important;
  text-align: center;
  display: inline-block;
  background: rgb(103, 221, 235);
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(103, 221, 235)), color-stop(32%, rgb(40, 203, 234)), color-stop(76%, rgb(62, 182, 244)), to(rgb(68, 176, 246)));
  background: -webkit-linear-gradient(top, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  background: linear-gradient(180deg, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: "Noto serif Bold", serif;
  font-size: 30px;
  font-size: 3rem;
  letter-spacing: 0.08em;
  position: relative;
}
@media screen and (max-width: 767px) {
  .com-sub-box-ttl {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.com-sub-box-ttl::before, .com-sub-box-ttl::after {
  content: "";
  display: block;
  width: 450px;
  height: 1px;
  margin: auto;
  background-color: #111111;
  position: absolute;
  top: 0;
  bottom: 0;
}
.com-sub-box-ttl::before {
  left: 0;
}
.com-sub-box-ttl::after {
  right: 0;
}
.com-sub-other {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 25px auto 0;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.com-sub-other-item:nth-of-type(n+2) {
  margin-left: 27px;
}
.com-sub-other-img {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  border: 5px solid #fff;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.com-sub-other-ttl {
  margin: 21px auto 0;
  text-align: center;
  font-family: "shippori", "Noto serif Bold", serif;
  font-size: 25px;
  font-size: 2.5rem;
  letter-spacing: 0.08em;
  color: #111111;
  line-height: 1.4;
}
@media screen and (max-width: 767px) {
  .com-sub-other-ttl {
    font-size: 20px;
    font-size: 2rem;
  }
}

#about .reason-list {
  margin: 60px auto 0;
}
#about .reason-list-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 50px;
  background: #eef7fc;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#about .reason-list-item:nth-of-type(n+2) {
  margin-top: 40px;
}
#about .reason-list-ttl {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
#about .reason-list-ttl-point {
  display: block;
  width: 120px;
  height: 40px;
  background-color: #a50a2a;
  text-align: center;
  font-family: "shippori", "Noto serif Bold", serif;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.08em;
  line-height: 40px;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #about .reason-list-ttl-point {
    font-size: 19px;
    font-size: 1.9rem;
  }
}
#about .reason-list-ttl-txt {
  margin-left: 15px;
  font-family: "shippori", "Noto serif Bold", serif;
  font-size: 25px;
  font-size: 2.5rem;
  letter-spacing: 0.08em;
  color: #111111;
}
@media screen and (max-width: 767px) {
  #about .reason-list-ttl-txt {
    font-size: 20px;
    font-size: 2rem;
  }
}
#about .reason .com-txt-box {
  margin-top: 15px;
}
#about .area-bg {
  background: url(../img/about/area-bg.png) no-repeat center/cover;
}
#about .area .com-head02 {
  text-align: left;
}
#about .area-ttl {
  display: inline-block;
  margin-top: 55px;
  padding: 1px 24.5px;
  background-color: #fff;
  font-family: "Noto serif Medium", serif;
  font-size: 25px;
  font-size: 2.5rem;
  letter-spacing: 0.08em;
  color: #111111;
}
@media screen and (max-width: 767px) {
  #about .area-ttl {
    font-size: 20px;
    font-size: 2rem;
  }
}
#about .area-ttl-ac {
  color: #a50a2a;
}
#about .area-txt {
  margin-top: 20px;
}

/*	service  PC
------------------------------------ */
#service .com-sub-txt {
  margin-top: 0;
}
#service .com-sub-con p:nth-of-type(n+2) {
  margin-top: 20px;
}
#service .com-sub-box {
  margin: 81px auto 0;
  padding: 29px 49px 35px;
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  #service .com-sub-box-ttl::before, #service .com-sub-box-ttl::after {
    width: 360px;
  }
}
#service .com-sub-box-txt {
  margin: 5px auto 0;
  text-align: center;
  font-size: 20px;
  font-size: 2rem;
}
@media screen and (max-width: 767px) {
  #service .com-sub-box-txt {
    font-size: 19px;
    font-size: 1.9rem;
  }
}
#service .problem .com-head02-blue {
  color: #0098bd;
}
#service .problem-list {
  margin: 70px auto 0;
}
#service .problem-list-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#service .problem-list-item:nth-of-type(n+2) {
  margin-top: 60px;
}
#service .problem-list-con {
  width: 100%;
  max-width: 540px;
}
#service .problem-list-ttl {
  padding: 13px 25px 10px;
  background-color: #0098bd;
  font-family: "Noto serif Medium", serif;
  font-size: 25px;
  font-size: 2.5rem;
  letter-spacing: 0.08em;
  color: #fff;
  line-height: 1.4;
}
@media screen and (max-width: 767px) {
  #service .problem-list-ttl {
    font-size: 20px;
    font-size: 2rem;
  }
}
#service .problem-txt-box {
  margin-top: 20px;
}
#service .works-bg {
  background: url(../img/service/works-bg.png) no-repeat center top/cover;
}
#service .works-list {
  margin: 65px auto 0;
}
#service .works-list-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 50px;
  background-color: #fff;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#service .works-list-item:nth-of-type(n+2) {
  margin-top: 40px;
}
#service .works-list-con {
  text-align: center;
}
#service .works-list-before {
  display: inline-block;
  width: 150px;
  height: 40px;
  background-color: #0098bd;
  border-radius: 999px;
  font-family: "Noto serif Medium", serif;
  font-size: 25px;
  font-size: 2.5rem;
  letter-spacing: 0.08em;
  line-height: 40px;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #service .works-list-before {
    font-size: 20px;
    font-size: 2rem;
  }
}
#service .works-list-before-frame {
  width: 300px;
  height: 200px;
  margin: 30px auto 0;
  border: 5px solid #0098bd;
}
#service .works-list-before-frame img {
  width: 100%;
  height: 100%;
  border: 1px solid #fff;
  -o-object-fit: cover;
     object-fit: cover;
}
#service .works-list-ico {
  margin-top: 143px;
}
#service .works-list-after {
  display: inline-block;
  width: 150px;
  height: 40px;
  background: rgb(103, 221, 235);
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(103, 221, 235)), color-stop(32%, rgb(40, 203, 234)), color-stop(76%, rgb(62, 182, 244)), to(rgb(68, 176, 246)));
  background: -webkit-linear-gradient(top, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  background: linear-gradient(180deg, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  border-radius: 999px;
  font-family: "Noto serif Medium", serif;
  font-size: 25px;
  font-size: 2.5rem;
  letter-spacing: 0.08em;
  line-height: 40px;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #service .works-list-after {
    font-size: 20px;
    font-size: 2rem;
  }
}
#service .works-list-after-frame {
  width: 450px;
  height: 300px;
  margin: 30px auto 0;
  padding: 9px;
  background: rgb(29, 213, 230);
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(29, 213, 230)), color-stop(32%, rgb(36, 207, 233)), color-stop(51%, rgb(48, 195, 238)), color-stop(76%, rgb(58, 185, 242)), to(rgb(70, 174, 247)));
  background: -webkit-linear-gradient(top, rgb(29, 213, 230) 0%, rgb(36, 207, 233) 32%, rgb(48, 195, 238) 51%, rgb(58, 185, 242) 76%, rgb(70, 174, 247) 100%);
  background: linear-gradient(180deg, rgb(29, 213, 230) 0%, rgb(36, 207, 233) 32%, rgb(48, 195, 238) 51%, rgb(58, 185, 242) 76%, rgb(70, 174, 247) 100%);
}
#service .works-list-after-frame img {
  width: 100%;
  height: 100%;
  border: 1px solid #fff;
  -o-object-fit: cover;
     object-fit: cover;
}
#service .works-bnr {
  width: 100%;
  max-width: 850px;
  margin: 130px auto 0;
  border: 5px solid #0098bd;
}
#service .works-bnr-bg {
  border: 10px solid #fff;
  padding: 16px 25px 16px 29px;
  background: url(../img/service/bnr-bg.png) no-repeat center/cover;
}
#service .works-bnr-ttl {
  font-family: "Noto serif Bold", serif;
  font-size: 30px;
  font-size: 3rem;
  letter-spacing: 0.08em;
  color: transparent;
  text-shadow: 3px 3px 3px #fff, -3px 3px 3px #fff, 3px -3px 3px #fff, -3px -3px 3px #fff;
  line-height: 1;
  position: relative;
}
@media screen and (max-width: 767px) {
  #service .works-bnr-ttl {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
#service .works-bnr-ttl::before {
  content: attr(title);
  display: inline-block;
  display: inline-block;
  background: rgb(103, 221, 235);
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(103, 221, 235)), color-stop(32%, rgb(40, 203, 234)), color-stop(76%, rgb(62, 182, 244)), to(rgb(68, 176, 246)));
  background: -webkit-linear-gradient(top, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  background: linear-gradient(180deg, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  text-shadow: none;
}
#service .works-bnr-txt {
  margin-top: 17px;
  line-height: 1.76;
}
#service .works-bnr-txt-ac {
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.08em;
  color: #a50a2a;
  font-family: "Noto serif SemiBold", serif;
}
@media screen and (max-width: 767px) {
  #service .works-bnr-txt-ac {
    font-size: 19px;
    font-size: 1.9rem;
  }
}

/*	flow  PC
------------------------------------ */
#flow .flow-bg {
  background-repeat: repeat-y;
}
#flow .flow-list {
  margin: 55px auto 0;
}
#flow .flow-list-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 40px;
  background-color: #ffffff;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#flow .flow-list-item:nth-of-type(n+2) {
  margin: 90px auto 0;
  position: relative;
}
#flow .flow-list-item:nth-of-type(n+2)::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin: auto;
  border-style: solid;
  border-color: #a50a2a transparent transparent transparent;
  border-width: 30px 25px 0px 25px;
  position: absolute;
  top: -60px;
  left: 0;
  right: 0;
}
#flow .flow-list-con {
  width: 100%;
  max-width: 530px;
}
#flow .flow-list-ttl {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  padding: 0 12px;
  background: rgb(103, 221, 235);
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(103, 221, 235)), color-stop(32%, rgb(40, 203, 234)), color-stop(76%, rgb(62, 182, 244)), to(rgb(68, 176, 246)));
  background: -webkit-linear-gradient(top, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  background: linear-gradient(180deg, rgb(103, 221, 235) 0%, rgb(40, 203, 234) 32%, rgb(62, 182, 244) 76%, rgb(68, 176, 246) 100%);
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
#flow .flow-list-ttl-step {
  width: 100px;
  height: 30px;
  border-radius: 999px;
  background-color: #ffd144;
  text-align: center;
  font-family: "Noto serif Medium", serif;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.08em;
  line-height: 30px;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #flow .flow-list-ttl-step {
    font-size: 19px;
    font-size: 1.9rem;
  }
}
#flow .flow-list-ttl-txt {
  margin-left: 10px;
  font-family: "Noto serif Medium", serif;
  font-size: 30px;
  font-size: 3rem;
  letter-spacing: 0.08em;
  line-height: 1.7;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #flow .flow-list-ttl-txt {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
#flow .flow-list-txt {
  margin-top: 20px;
}
@media screen and (min-width: 768px) {
  #flow .flow-list-txt {
    white-space: nowrap;
  }
}
#flow .flow-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-top: 40px;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
#flow .flow-info li:nth-of-type(n+2) {
  margin-left: 10px;
}
#flow .flow .com-tel-link {
  background-position: left top;
}
#flow .flow .com-tel-num {
  font-size: 30px;
  font-size: 3rem;
}
@media screen and (max-width: 767px) {
  #flow .flow .com-tel-num {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
#flow .flow .com-mail {
  width: 250px;
  height: 60px;
}

/*	company  PC
------------------------------------ */
#company .greeting .com-txt-box {
  margin: 50px auto 0;
}
@media screen and (min-width: 768px) {
  #company .greeting .com-txt-box {
    text-align: center;
  }
}
@media screen and (min-width: 768px) {
  #company .greeting .com-txt-name {
    margin-top: 40px;
  }
}
#company .company-bg {
  background: url(../img/company/company-bg.png) no-repeat center/cover;
}
#company .company-box {
  margin: 70px auto 0;
  padding: 30px;
  background: #fff;
}

/*	com-page
------------------------------------ */
#contact .com-sub-bg, #site .com-sub-bg, #privacy .com-sub-bg, #e404 .com-sub-bg {
  background-repeat: repeat-y;
}