@charset "UTF-8";
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  /**vertical-align:baseline;**/
  background: transparent;
  font-weight: normal;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

ul li {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

body {
  margin: 0px;
  padding: 0px;
}

select,
input,
textarea {
  line-height: 1.8em;
  border: 1px solid #CCCCCC;
  padding: 5px 8px;
  font-size: 12px;
}

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

	1-2.Universal selector

=======================================*/
* {
  font-weight: normal;
  font-style: normal;
  font-size: 100%;
}

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

	1-4.Text Module

=======================================*/
p,
pre,
address,
cite {
  margin: 0em;
  padding: 0em;
  line-height: 1.6em;
  color: #333333;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0em;
  padding: 0em;
  line-height: 1.8em;
  font-weight: normal;
  color: #333333;
}

strong {
  font-weight: bold;
  line-height: 200%;
}

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

	1-5.Hypertext Module

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

	1-6.List Module

=======================================*/
ul,
ol,
dl {
  margin: 0px;
  padding-left: 0px;
}

li,
dt,
dd {
  list-style: none;
  line-height: 1.8em;
  color: #333333;
}

ol li {
  list-style: decimal inside;
  margin-left: 35px;
  text-indent: -25px;
}

dd {
  margin: 0px 0px 0px 10px;
}

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

	1-7.Edit Module

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

	1-8.Forms Module

=======================================*/
textarea {
  font-size: 12px;
}

select {
  padding: 0.1em;
  font-size: 12px;
}

input:focus,
textarea:focus {
  font-size: 12px;
  background: #FFFFCC;
}

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

	1-9.Tables Module

=======================================*/
table {
  border-collapse: separate;
  border-spacing: 0px;
  border-collapse: collapse;
}

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

	1-10.Image Module

=======================================*/
img {
  border-style: none;
  padding: 0px;
}

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

	1-11.Object Module

=======================================*/
/** none style **/
.none {
  display: none;
}

/** clear style **/
.clear {
  clear: both;
}

.clearfix {
  _display: inline-block;
}

.clearfix:after {
  content: ".";
  display: block;
  height: 0px;
  clear: both;
  visibility: hidden;
}

/** float style **/
/* left-floats */
.fleft0 {
  float: left;
  display: inline;
}

.fleft1 {
  float: left;
  display: inline;
  margin-right: 10px;
}

.fleft2 {
  float: left;
  display: inline;
  margin-right: 20px;
}

/* right-floats */
.fright0 {
  float: right;
  display: inline;
}

.fright1 {
  float: right;
  display: inline;
  margin-left: 10px;
}

.fright2 {
  float: right;
  display: inline;
  margin-left: 20px;
}

/** All-margins style **/
.m5 {
  margin: 5px;
}

.m10 {
  margin: 10px;
}

.m15 {
  margin: 15px;
}

.m20 {
  margin: 20px;
}

.m30 {
  margin: 30px;
}

.m40 {
  margin: 40px;
}

.m50 {
  margin: 50px;
}

.m75 {
  margin: 75px;
}

.m100 {
  margin: 100px;
}

/** Top-margins style **/
.t-m5 {
  margin-top: 5px;
}

.t-m10 {
  margin-top: 10px;
}

.t-m15 {
  margin-top: 15px;
}

.t-m20 {
  margin-top: 20px;
}

.t-m30 {
  margin-top: 30px;
}

.t-m40 {
  margin-top: 40px;
}

.t-m50 {
  margin-top: 50px;
}

.t-m75 {
  margin-top: 75px;
}

.t-m100 {
  margin-top: 100px;
}

/** Bottom-margins style **/
.b-m5 {
  margin-bottom: 5px;
}

.b-m10 {
  margin-bottom: 10px;
}

.b-m15 {
  margin-bottom: 15px;
}

.b-m20 {
  margin-bottom: 20px;
}

.b-m30 {
  margin-bottom: 30px;
}

.b-m40 {
  margin-bottom: 40px;
}

.b-m50 {
  margin-bottom: 50px;
}

.b-m75 {
  margin-bottom: 75px;
}

.b-m100 {
  margin-bottom: 100px;
}

/** Left-margins style **/
.l-m5 {
  margin-left: 5px;
}

.l-m10 {
  margin-left: 10px;
}

.l-m15 {
  margin-left: 15px;
}

.l-m20 {
  margin-left: 20px;
}

.l-m30 {
  margin-left: 30px;
}

.l-m40 {
  margin-left: 40px;
}

.l-m50 {
  margin-left: 50px;
}

.l-m70 {
  margin-left: 70px;
}

.l-m75 {
  margin-left: 75px;
}

.l-m100 {
  margin-left: 100px;
}

/** Right-margins style **/
.r-m5 {
  margin-right: 5px;
}

.r-m10 {
  margin-right: 10px;
}

.r-m15 {
  margin-right: 15px;
}

.r-m20 {
  margin-right: 20px;
}

.r-m30 {
  margin-right: 30px;
}

.r-m40 {
  margin-right: 40px;
}

.r-m50 {
  margin-right: 50px;
}

.r-m75 {
  margin-right: 75px;
}

.r-m100 {
  margin-right: 100px;
}

/** Height-margins style **/
.h-m5 {
  margin-top: 5px;
  margin-bottom: 5px;
}

.h-m10 {
  margin-top: 10px;
  margin-bottom: 10px;
}

.h-m15 {
  margin-top: 15px;
  margin-bottom: 15px;
}

.h-m20 {
  margin-top: 20px;
  margin-bottom: 20px;
}

.h-m30 {
  margin-top: 30px;
  margin-bottom: 30px;
}

.h-m40 {
  margin-top: 40px;
  margin-bottom: 40px;
}

.h-m50 {
  margin-top: 50px;
  margin-bottom: 50px;
}

/** Width-margins style **/
.w-m5 {
  margin-left: 5px;
  margin-right: 5px;
}

.w-m10 {
  margin-left: 10px;
  margin-right: 10px;
}

.w-m15 {
  margin-left: 15px;
  margin-right: 15px;
}

.w-m20 {
  margin-left: 20px;
  margin-right: 20px;
}

.w-m30 {
  margin-left: 30px;
  margin-right: 30px;
}

.w-m40 {
  margin-left: 40px;
  margin-right: 40px;
}

.w-m50 {
  margin-left: 50px;
  margin-right: 50px;
}

/** All-paddings style **/
.p5 {
  padding: 5px;
}

.p10 {
  padding: 10px;
}

.p15 {
  padding: 15px;
}

.p20 {
  padding: 20px;
}

.p30 {
  padding: 30px;
}

.p40 {
  padding: 40px;
}

.p50 {
  padding: 50px;
}

.p75 {
  padding: 75px;
}

.p100 {
  padding: 100px;
}

/** Top-paddings style **/
.t-p5 {
  padding-top: 5px;
}

.t-p10 {
  padding-top: 10px;
}

.t-p15 {
  padding-top: 15px;
}

.t-p20 {
  padding-top: 20px;
}

.t-p30 {
  padding-top: 30px;
}

.t-p40 {
  padding-top: 40px;
}

.t-p50 {
  padding-top: 50px;
}

.t-p75 {
  padding-top: 75px;
}

.t-p100 {
  padding-top: 100px;
}

/** Bottom-paddings style **/
.b-p5 {
  padding-bottom: 5px;
}

.b-p10 {
  padding-bottom: 10px;
}

.b-p15 {
  padding-bottom: 15px;
}

.b-p20 {
  padding-bottom: 20px;
}

.b-p30 {
  padding-bottom: 30px;
}

.b-p40 {
  padding-bottom: 40px;
}

.b-p50 {
  padding-bottom: 50px;
}

.b-p75 {
  padding-bottom: 75px;
}

.b-p100 {
  padding-bottom: 100px;
}

/** Left-paddings style **/
.l-p5 {
  padding-left: 5px;
}

.l-p10 {
  padding-left: 10px;
}

.l-p15 {
  padding-left: 15px;
}

.l-p20 {
  padding-left: 20px;
}

.l-p30 {
  padding-left: 30px;
}

.l-p40 {
  padding-left: 40px;
}

.l-p50 {
  padding-left: 50px;
}

.l-p75 {
  padding-left: 75px;
}

.l-p100 {
  padding-left: 100px;
}

/** Right-paddings style **/
.r-p5 {
  padding-right: 5px;
}

.r-p10 {
  padding-right: 10px;
}

.r-p15 {
  padding-right: 15px;
}

.r-p20 {
  padding-right: 20px;
}

.r-p30 {
  padding-right: 30px;
}

.r-p40 {
  padding-right: 40px;
}

.r-p50 {
  padding-right: 50px;
}

.r-p75 {
  padding-right: 75px;
}

.r-p100 {
  padding-right: 100px;
}

/** Height-paddings style **/
.h-p5 {
  padding-top: 5px;
  padding-bottom: 5px;
}

.h-p10 {
  padding-top: 10px;
  padding-bottom: 10px;
}

.h-p15 {
  padding-top: 15px;
  padding-bottom: 15px;
}

.h-p20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.h-p30 {
  padding-top: 30px;
  padding-bottom: 30px;
}

.h-p40 {
  padding-top: 40px;
  padding-bottom: 40px;
}

.h-p50 {
  padding-top: 50px;
  padding-bottom: 50px;
}

.h-p75 {
  padding-top: 75px;
  padding-bottom: 75px;
}

.h-p100 {
  padding-top: 100px;
  padding-bottom: 100px;
}

/** Width-paddings style **/
.w-p5 {
  padding-left: 5px;
  padding-right: 5px;
}

.w-p10 {
  padding-left: 10px;
  padding-right: 10px;
}

.w-p15 {
  padding-left: 15px;
  padding-right: 15px;
}

.w-p20 {
  padding-left: 20px;
  padding-right: 20px;
}

.w-p30 {
  padding-left: 30px;
  padding-right: 30px;
}

.w-p40 {
  padding-left: 40px;
  padding-right: 40px;
}

.w-p50 {
  padding-left: 50px;
  padding-right: 50px;
}

.w-p75 {
  padding-left: 75px;
  padding-right: 75px;
}

.w-p100 {
  padding-left: 100px;
  padding-right: 100px;
}

/** Text-aligns style **/
.tcenter {
  text-align: center;
}

.tright {
  text-align: right;
}

.tleft {
  text-align: left;
}

/** font-colors style **/
.orange {
  color: #FF6600;
}

.orange2 {
  color: #FF9933;
}

.red {
  color: #CC0000;
}

.red2 {
  color: #FF6666;
}

.wine {
  color: #9E005D;
}

.blue {
  color: #0033FF;
}

.green {
  color: #75BE2E;
}

.skyblue {
  color: #007BC6;
}

.magenta {
  color: #663366;
}

.white {
  color: #FFF;
}

.darkpink {
  color: #9E005D;
}

/** font-sizes style **/
.f-s8 {
  font-size: 8px;
}

.f-s10 {
  font-size: 10px;
}

.f-s11 {
  font-size: 11px;
}

.f-s12 {
  font-size: 12px;
}

.f-s13 {
  font-size: 13px;
}

.f-s14 {
  font-size: 14px;
}

.f-s16 {
  font-size: 16px;
}

.f-s18 {
  font-size: 18px;
}

.f-s20 {
  font-size: 20px;
}

.f-s22 {
  font-size: 22px;
}

.f-s24 {
  font-size: 24px;
}

.l0 {
  line-height: 0;
}

.bnone {
  border: none;
}

.pc {
  display: block;
}
@media screen and (max-width: 767px) {
  .pc {
    display: none;
  }
}

.sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp {
    display: block;
  }
}

.inner, .company, .safety {
  width: 1000px;
  margin: auto;
  position: relative;
}
@media screen and (max-width: 767px) {
  .inner, .company, .safety {
    width: 90%;
  }
}

.flb_sb, .form .line ul, .faq .inner, .faq .safety, .faq .company, .company, .flow .inner, .flow .company, .flow .safety, .staff .inner .box, .staff .company .box, .staff .safety .box, .staff .inner, .staff .company, .staff .safety, .safety .list, .gnav .inner, .gnav .company, .gnav .safety {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.flb_ct, .campaign ul li a, .campaign ul, .campaign dl dd {
  display: flex;
  justify-content: center;
}

.flb_st, .form .line table .zipbox, .form .line .box2, .form .map, .works .workslist .box dl {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.flb_ed, .greeting .inner, .greeting .company, .greeting .safety, .gnav ul {
  display: flex;
  justify-content: flex-end;
}

.hv {
  text-decoration: none;
  opacity: 0.7;
}

.ab_tl {
  position: absolute;
  top: 0;
  left: 0;
}

.ab_tr {
  position: absolute;
  top: 0;
  right: 0;
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
body {
  background: #FFF;
  margin: 0;
  padding: 0;
  line-height: 1.6em;
  font-size: 16px;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "sans-serif";
  color: #080808;
  min-width: 1040;
}
@media screen and (max-width: 767px) {
  body {
    padding-top: 0 !important;
  }
}

a {
  color: #080808;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

p {
  word-wrap: break-word;
  -ms-word-wrap: break-word;
  line-height: 1.6em;
}

dd {
  margin-left: 0px;
}

a img {
  border-style: none;
}

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

/* ヘッダー */
.mv {
  display: block;
  width: 100%;
}

/* ナビゲーション */
.gnav {
  display: block;
  width: 100%;
  padding: 15px 0;
  background: #fff;
  position: relative;
  z-index: 999;
}
@media screen and (max-width: 767px) {
  .gnav {
    display: none;
  }
}
.gnav.fixed {
  position: fixed;
  top: 0;
  left: 0;
}
.gnav .inner, .gnav .company, .gnav .safety {
  align-items: center;
}
.gnav h1 {
  display: block;
  font-size: 22px;
  font-weight: 700;
  line-height: 1em;
  text-align: center;
}
.gnav h1 a {
  color: #0070D5;
  font-weight: 700;
}
.gnav h1 span {
  display: block;
  font-size: 10px;
  font-weight: 500;
}
.gnav ul {
  align-items: center;
}
.gnav ul li {
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 1em;
}
.gnav ul li a {
  font-weight: 600;
  padding: 5px 35.5px;
  position: relative;
  display: block;
}
.gnav ul li a::after {
  content: "";
  display: block;
  width: 1px;
  height: 100%;
  background: #CCC;
  position: absolute;
  top: 0;
  right: 0;
}
.gnav ul li a img {
  display: block;
  margin: auto;
  margin-bottom: 10px;
}
.gnav ul li:last-child a::after {
  content: none;
}

/* スマホナビ */
.open {
  display: none;
}
@media screen and (max-width: 767px) {
  .open {
    display: block;
    width: 55px;
    height: 55px;
    position: fixed;
    top: 10px;
    right: 5%;
    z-index: 998;
  }
}

.spnav {
  display: none;
}
@media screen and (max-width: 767px) {
  .spnav {
    background: #F0FAFD;
    width: 100%;
    height: 100vh;
    box-sizing: border-box;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    padding-top: 100px;
    text-align: center;
  }
  .spnav .close {
    width: 55px;
    height: 55px;
    position: absolute;
    top: 10px;
    right: 5%;
    display: block;
  }
  .spnav .txtnav {
    padding-bottom: 20px;
  }
  .spnav .txtnav li {
    font-size: 16px;
    padding-bottom: 40px;
    max-width: 83%;
    margin: auto;
  }
  .spnav .txtnav li a {
    font-weight: bold;
    display: flex;
    align-items: center;
    text-align: left;
  }
  .spnav .txtnav li a img {
    margin-right: 10px;
  }
  .spnav .btnnav li {
    display: block;
    width: 83%;
    margin: auto;
    padding-bottom: 20px;
  }
  .spnav .btnnav li a {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    height: 50px;
    border: #222 1px solid;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    position: relative;
  }
  .spnav .btnnav li a::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 20px;
    margin: auto;
    content: "";
    vertical-align: middle;
    box-sizing: border-box;
    width: 4px;
    height: 4px;
    border: 4px solid transparent;
    border-left: 4px solid #fff;
  }
  .spnav .btnnav li a img {
    margin-right: 10px;
  }
  .spnav .btnnav li:first-child a {
    background: #2FB553;
  }
  .spnav .btnnav li:last-child a {
    background: #00B4E6;
  }
}

/* フッター */
footer {
  background: #0070D5;
  padding: 20px 0;
  text-align: center;
}
@media screen and (max-width: 767px) {
  footer {
    padding: 10px 0;
  }
}
footer p {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  footer p {
    font-size: 12px;
  }
}
footer p a {
  color: #fff;
}

.btncontact {
  position: fixed;
  top: 50%;
  right: 10px;
  display: block;
  width: 130px;
  z-index: 999;
}
@media screen and (max-width: 767px) {
  .btncontact {
    width: 100%;
    right: 0;
    top: auto;
    bottom: 0;
    line-height: 0;
  }
  .btncontact img {
    width: 100%;
  }
}

/* コンテンツ */
.trouble {
  background: #F0FAFD;
  padding-top: 63px;
  padding-bottom: 80px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .trouble {
    padding-top: 40px;
    padding-bottom: 20px;
  }
}
.trouble::after {
  content: "";
  display: block;
  border-top: 40px solid #F0FAFD;
  border-right: 80px solid transparent;
  border-left: 80px solid transparent;
  position: absolute;
  left: 50%;
  margin-left: -80px;
  bottom: -40px;
}
@media screen and (max-width: 767px) {
  .trouble::after {
    border-top: 20px solid #F0FAFD;
    border-right: 40px solid transparent;
    border-left: 40px solid transparent;
    bottom: -20px;
    margin-left: -40px;
  }
}
.trouble h2 {
  font-size: 24px;
  width: 600px;
  height: 90px;
  margin: 0 auto 30px auto;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  background: url(../images/trouble/bg.svg) no-repeat center;
}
@media screen and (max-width: 767px) {
  .trouble h2 {
    width: 100%;
    margin-bottom: 20px;
    font-size: 20px;
  }
}
.trouble h2 span {
  font-size: 36px;
  font-weight: bold;
  color: #ED7052;
  display: block;
  position: relative;
  margin: 0 5px;
}
@media screen and (max-width: 767px) {
  .trouble h2 span {
    font-size: 32px;
  }
}
.trouble h2 span::after {
  display: block;
  content: "";
  width: 100%;
  height: 5px;
  margin-bottom: -5px;
  background-color: #ED7052;
}
.trouble .flb_ct, .trouble .campaign ul li a, .campaign ul li .trouble a, .trouble .campaign ul, .campaign .trouble ul, .trouble .campaign dl dd, .campaign dl .trouble dd {
  gap: 2rem;
}
@media screen and (max-width: 767px) {
  .trouble .flb_ct, .trouble .campaign ul li a, .campaign ul li .trouble a, .trouble .campaign ul, .campaign .trouble ul, .trouble .campaign dl dd, .campaign dl .trouble dd {
    flex-wrap: wrap;
  }
}
.trouble .flb_ct .box, .campaign ul li .trouble a .box, .trouble .campaign ul .box, .campaign .trouble ul .box, .trouble .campaign dl dd .box, .campaign dl .trouble dd .box {
  background-color: #fff;
  border: #1A50B5 1px solid;
  width: 174px;
  box-sizing: border-box;
  padding: 5px;
}
@media screen and (max-width: 767px) {
  .trouble .flb_ct .box, .campaign ul li .trouble a .box, .trouble .campaign ul .box, .campaign .trouble ul .box, .trouble .campaign dl dd .box, .campaign dl .trouble dd .box {
    border: none;
    display: flex;
    width: 100%;
    gap: 10px;
    align-items: center;
  }
}
.trouble .flb_ct .box picture, .campaign ul li .trouble a .box picture, .trouble .campaign ul .box picture, .campaign .trouble ul .box picture, .trouble .campaign dl dd .box picture, .campaign dl .trouble dd .box picture {
  line-height: 0;
  display: block;
}
@media screen and (max-width: 767px) {
  .trouble .flb_ct .box picture, .campaign ul li .trouble a .box picture, .trouble .campaign ul .box picture, .campaign .trouble ul .box picture, .trouble .campaign dl dd .box picture, .campaign dl .trouble dd .box picture {
    flex-shrink: 0;
  }
}
@media screen and (max-width: 767px) {
  .trouble .flb_ct .box .txt, .campaign ul li .trouble a .box .txt, .trouble .campaign ul .box .txt, .campaign .trouble ul .box .txt, .trouble .campaign dl dd .box .txt, .campaign dl .trouble dd .box .txt {
    width: 100%;
  }
}
.trouble .flb_ct .box .txt h3, .campaign ul li .trouble a .box .txt h3, .trouble .campaign ul .box .txt h3, .campaign .trouble ul .box .txt h3, .trouble .campaign dl dd .box .txt h3, .campaign dl .trouble dd .box .txt h3 {
  font-weight: bold;
  color: #1A50B5;
  font-size: 1.1rem;
  border-bottom: #1A50B5 1px solid;
  margin-bottom: 5px;
}
@media screen and (min-width: 768px) {
  .trouble .flb_ct .box .txt h3, .campaign ul li .trouble a .box .txt h3, .trouble .campaign ul .box .txt h3, .campaign .trouble ul .box .txt h3, .trouble .campaign dl dd .box .txt h3, .campaign dl .trouble dd .box .txt h3 {
    margin: 10px 0;
  }
}
.trouble .flb_ct .box .txt h3 span, .campaign ul li .trouble a .box .txt h3 span, .trouble .campaign ul .box .txt h3 span, .campaign .trouble ul .box .txt h3 span, .trouble .campaign dl dd .box .txt h3 span, .campaign dl .trouble dd .box .txt h3 span {
  font-size: 1.2rem;
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  .trouble .flb_ct .box .txt h3 span, .campaign ul li .trouble a .box .txt h3 span, .trouble .campaign ul .box .txt h3 span, .campaign .trouble ul .box .txt h3 span, .trouble .campaign dl dd .box .txt h3 span, .campaign dl .trouble dd .box .txt h3 span {
    font-size: 1.5rem;
  }
}
.trouble .flb_ct .box .txt p, .campaign ul li .trouble a .box .txt p, .trouble .campaign ul .box .txt p, .campaign .trouble ul .box .txt p, .trouble .campaign dl dd .box .txt p, .campaign dl .trouble dd .box .txt p {
  font-size: 1rem;
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  .trouble .flb_ct .box .txt p, .campaign ul li .trouble a .box .txt p, .trouble .campaign ul .box .txt p, .campaign .trouble ul .box .txt p, .trouble .campaign dl dd .box .txt p, .campaign dl .trouble dd .box .txt p {
    font-size: 1.1rem;
  }
  .trouble .flb_ct .box .txt p br, .campaign ul li .trouble a .box .txt p br, .trouble .campaign ul .box .txt p br, .campaign .trouble ul .box .txt p br, .trouble .campaign dl dd .box .txt p br, .campaign dl .trouble dd .box .txt p br {
    display: none;
  }
}

.example {
  background: #0070D5 url(../images/example/bg.jpg);
  background-position: center;
  background-size: cover;
  padding-top: 100px;
  padding-bottom: 100px;
}
@media screen and (max-width: 767px) {
  .example {
    padding-top: 60px;
    padding-bottom: 20px;
  }
}
.example .ptxt {
  position: relative;
  text-align: center;
  color: #1A50B5;
  background-color: #fff;
  padding: 10px;
  width: 230px;
  border-radius: 50px;
  margin: auto;
  margin-bottom: 20px;
  font-weight: bold;
}
.example .ptxt::after {
  width: 15px;
  height: 10px;
  display: block;
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  margin-left: -7px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 7.5px 0 7.5px;
  border-color: #ffffff transparent transparent transparent;
}
.example h2 {
  font-weight: bold;
  font-size: 30px;
  color: #fff;
  text-align: center;
  margin-bottom: 30px;
}
.example h2 span {
  font-weight: bold;
  font-size: 36px;
  color: #FFF615;
}
@media screen and (max-width: 767px) {
  .example h2 {
    font-size: 20px;
  }
  .example h2 span {
    font-size: 30px;
  }
}
.example .flb_ct, .example .campaign ul li a, .campaign ul li .example a, .example .campaign ul, .campaign .example ul, .example .campaign dl dd, .campaign dl .example dd {
  gap: 1rem;
  flex-wrap: wrap;
}
.example .flb_ct .box, .campaign ul li .example a .box, .example .campaign ul .box, .campaign .example ul .box, .example .campaign dl dd .box, .campaign dl .example dd .box {
  background-color: #fff;
  width: 320px;
  box-sizing: border-box;
  padding: 20px;
}
@media screen and (max-width: 767px) {
  .example .flb_ct .box, .campaign ul li .example a .box, .example .campaign ul .box, .campaign .example ul .box, .example .campaign dl dd .box, .campaign dl .example dd .box {
    border: none;
    display: flex;
    width: 100%;
    gap: 10px;
    align-items: center;
    padding: 5px;
  }
}
.example .flb_ct .box picture, .campaign ul li .example a .box picture, .example .campaign ul .box picture, .campaign .example ul .box picture, .example .campaign dl dd .box picture, .campaign dl .example dd .box picture {
  line-height: 0;
  display: block;
}
@media screen and (max-width: 767px) {
  .example .flb_ct .box picture, .campaign ul li .example a .box picture, .example .campaign ul .box picture, .campaign .example ul .box picture, .example .campaign dl dd .box picture, .campaign dl .example dd .box picture {
    flex-shrink: 0;
  }
}
@media screen and (max-width: 767px) {
  .example .flb_ct .box .txt, .campaign ul li .example a .box .txt, .example .campaign ul .box .txt, .campaign .example ul .box .txt, .example .campaign dl dd .box .txt, .campaign dl .example dd .box .txt {
    width: 100%;
  }
}
.example .flb_ct .box .txt h3, .campaign ul li .example a .box .txt h3, .example .campaign ul .box .txt h3, .campaign .example ul .box .txt h3, .example .campaign dl dd .box .txt h3, .campaign dl .example dd .box .txt h3 {
  font-weight: bold;
  color: #E24E00;
  font-size: 1.1rem;
  border-bottom: #E24E00 1px solid;
  margin-bottom: 5px;
}
@media screen and (min-width: 768px) {
  .example .flb_ct .box .txt h3, .campaign ul li .example a .box .txt h3, .example .campaign ul .box .txt h3, .campaign .example ul .box .txt h3, .example .campaign dl dd .box .txt h3, .campaign dl .example dd .box .txt h3 {
    margin: 10px 0;
    text-align: center;
  }
}
.example .flb_ct .box .txt h3 span, .campaign ul li .example a .box .txt h3 span, .example .campaign ul .box .txt h3 span, .campaign .example ul .box .txt h3 span, .example .campaign dl dd .box .txt h3 span, .campaign dl .example dd .box .txt h3 span {
  font-size: 1.2rem;
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  .example .flb_ct .box .txt h3 span, .campaign ul li .example a .box .txt h3 span, .example .campaign ul .box .txt h3 span, .campaign .example ul .box .txt h3 span, .example .campaign dl dd .box .txt h3 span, .campaign dl .example dd .box .txt h3 span {
    font-size: 1.5rem;
  }
}
.example .flb_ct .box .txt p, .campaign ul li .example a .box .txt p, .example .campaign ul .box .txt p, .campaign .example ul .box .txt p, .example .campaign dl dd .box .txt p, .campaign dl .example dd .box .txt p {
  font-size: 1rem;
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  .example .flb_ct .box .txt p, .campaign ul li .example a .box .txt p, .example .campaign ul .box .txt p, .campaign .example ul .box .txt p, .example .campaign dl dd .box .txt p, .campaign dl .example dd .box .txt p {
    text-align: center;
    font-size: 1.1rem;
  }
}

.campaign {
  background: #FFEF4E;
  padding: 50px 0;
}
@media screen and (max-width: 767px) {
  .campaign {
    padding: 30px 0;
  }
}
.campaign .inner, .campaign .company, .campaign .safety {
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
  text-align: center;
  position: relative;
  padding-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .campaign .inner, .campaign .company, .campaign .safety {
    padding-bottom: 20px;
  }
}
.campaign .off {
  position: absolute;
  top: -30px;
  left: 0;
  width: 180px;
}
@media screen and (max-width: 767px) {
  .campaign .off {
    position: relative;
    background: #E24E00;
    width: 100%;
    top: auto;
    padding: 6px 0;
  }
  .campaign .off img {
    width: 72%;
    margin: auto;
  }
}
.campaign h2 {
  width: 477px;
  padding-top: 21px;
  padding-bottom: 11px;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .campaign h2 {
    width: 213px;
    padding: 14px 0;
  }
}
.campaign h3 {
  font-size: 26px;
  font-weight: 700;
  position: relative;
  padding-bottom: 20px;
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .campaign h3 {
    font-size: 21px;
    padding-bottom: 13px;
    margin-bottom: 11px;
    line-height: 1.5em;
  }
}
.campaign h3 b {
  font-size: 30px;
  font-weight: 700;
  color: #E24E00;
  background: linear-gradient(transparent 60%, #FFFF2C 60%);
}
@media screen and (max-width: 767px) {
  .campaign h3 b {
    font-size: 18px;
  }
}
.campaign h3 b span {
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  .campaign h3 b span {
    font-size: 24px;
  }
}
.campaign h3::after {
  content: "";
  display: block;
  width: 787px;
  height: 1px;
  background-size: 6px 1px;
  background-image: linear-gradient(to right, #707070, #707070 2px, transparent 2px, transparent 6px);
  background-repeat: repeat-x;
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -343.5px;
}
@media screen and (max-width: 767px) {
  .campaign h3::after {
    background: #707070;
    width: 276px;
    margin-left: -138px;
  }
}
.campaign dl {
  padding-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .campaign dl {
    padding-bottom: 13px;
  }
}
.campaign dl dt {
  font-size: 26px;
  font-weight: 600;
  color: #333;
  padding-bottom: 11px;
}
.campaign dl dt span {
  color: #E24E00;
  font-weight: bold;
}

@media screen and (max-width: 767px) {
  .campaign dl dt {
    font-size: 16px;
  }
}
.campaign dl dd {
  align-items: center;
  font-size: 16px;
  font-weight: 300;
}
@media screen and (max-width: 767px) {
  .campaign dl dd {
    display: block;
    font-size: 12px;
  }
}
.campaign dl dd span {
  font-size: 19px;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .campaign dl dd span {
    font-size: 16px;
    font-weight: 700;
  }
}
.campaign dl dd b {
  font-size: 19px;
  font-weight: 600;
  margin-right: 10px;
  position: relative;
}

.campaign dl dd a {
  font-weight: 700;
}
.campaign ul {
  align-items: center;
}
@media screen and (max-width: 767px) {
  .campaign ul {
    display: block;
  }
}
.campaign ul li {
  display: block;
  width: 444px;
}
@media screen and (max-width: 767px) {
  .campaign ul li {
    width: 83%;
    margin: auto;
  }
}
.campaign ul li a {
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  height: 60px;
  border: #222 2px solid;
  border-radius: 50px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  position: relative;
}
@media screen and (max-width: 767px) {
  .campaign ul li a {
    font-size: 14px;
    font-weight: 700;
  }
}
.campaign ul li a::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 30px;
  margin: auto;
  content: "";
  vertical-align: middle;
  box-sizing: border-box;
  width: 6px;
  height: 6px;
  border: 6px solid transparent;
  border-left: 6px solid #fff;
}
@media screen and (max-width: 767px) {
  .campaign ul li a::after {
    right: 20px;
    width: 4px;
    height: 4px;
    border: 4px solid transparent;
    border-left: 4px solid #fff;
  }
}
.campaign ul li a:hover {
  text-decoration: none;
}
.campaign ul li a img {
  margin-right: 10px;
}
.campaign ul li:first-child {
  margin-right: 20px;
}
@media screen and (max-width: 767px) {
  .campaign ul li:first-child {
    margin-bottom: 20px;
    margin-right: auto;
  }
}
.campaign ul li:first-child a {
  background: #2FB553;
}
.campaign ul li:first-child a:hover {
  background: #89BF21;
}
.campaign ul li:last-child a {
  background: #00B4E6;
}
.campaign ul li:last-child a:hover {
  background: #008EE6;
}

.about_shanetsu {
  padding: 60px 0;
  padding-bottom: 90px;
  background-color: #0070D5;
}
.about_shanetsu h2 {
  font-size: 36px;
  color: #fff;
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .about_shanetsu h2 {
    font-size: 6.7vw;
  }
}
.about_shanetsu h2 span {
  font-weight: bold;
  border-bottom: #FFFE2C 8px solid;
}
.about_shanetsu .cont-box {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: center;
}
.about_shanetsu .cont-box .box {
  background-color: #fff;
  max-width: 488px;
  padding: 19px;
  box-sizing: border-box;
}
.about_shanetsu .cont-box .box picture {
  line-height: 0;
  display: block;
  text-align: center;
}
.about_shanetsu .cont-box .box h3 {
  color: #0070D5;
  display: flex;
  font-size: 24px;
  justify-content: center;
}
.about_shanetsu .cont-box .box h3 span {
  font-weight: bold;
  background-color: #fff;
  display: block;
  padding: 10px 20px;
  margin-top: -30px;
}
.about_shanetsu .cont-box .box .ttl {
  text-align: center;
  margin-bottom: 30px;
}
.about_shanetsu .cont-box .box .ttl span {
  line-height: 1.4;
  color: #0070D5;
  font-size: 30px;
  font-weight: bold;
  background: linear-gradient(transparent 60%, #FFFF2C 0%);
}
@media screen and (max-width: 767px) {
  .about_shanetsu .cont-box .box .ttl span {
    font-size: 5vw;
  }
}
.about_shanetsu .cont-box .box .ttl::first-letter {
  font-size: 50px;
}
@media screen and (max-width: 767px) {
  .about_shanetsu .cont-box .box .ttl::first-letter {
    font-size: 8vw;
  }
}

.works {
  background: #F0FAFD;
  padding: 60px 0;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .works {
    padding: 40px 0;
  }
}
.works h2 {
  font-size: 30px;
  color: #0070D5;
  padding-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .works h2 {
    font-size: 25px;
    padding-bottom: 37px;
  }
}
.works h2 span {
  font-weight: 600;
  position: relative;
  padding-bottom: 15px;
}
.works h2 span::after {
  content: "";
  display: block;
  width: 125px;
  height: 10px;
  background: url("../images/works/line.png") center top no-repeat;
  background-size: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .works h2 span::after {
    width: 102px;
  }
}
@media screen and (max-width: 767px) {
  .works .workslist {
    width: 90%;
    margin: auto;
  }
}
.works .workslist .box {
  width: 804px;
  box-sizing: border-box;
  background: #fff;
  border: #0070D5 2px solid;
  border-radius: 3px;
  padding: 20px 60px;
  margin: 0 25px;
}
@media screen and (max-width: 767px) {
  .works .workslist .box {
    width: 100%;
    padding: 10px 10px 15px 10px;
    border-radius: 0;
    margin: 0;
  }
}
.works .workslist .box img {
  display: block;
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .works .workslist .box img {
    margin-bottom: 10px;
  }
}
.works .workslist .box dl {
  align-items: center;
}
@media screen and (max-width: 767px) {
  .works .workslist .box dl {
    display: block;
    text-align: left;
  }
}
.works .workslist .box dl dt {
  font-size: 16px;
  background: #FEEF4E;
  font-weight: 300;
  padding: 0 13px;
  line-height: 25px;
  display: inline-block;
  margin-right: 10px;
}
@media screen and (max-width: 767px) {
  .works .workslist .box dl dt {
    font-size: 13px;
    padding: 0 10px;
  }
}
.works .workslist .box dl dd {
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  color: #0070D5;
}
@media screen and (max-width: 767px) {
  .works .workslist .box dl dd {
    display: block;
    margin-top: 10px;
    text-align: left;
  }
}
.works .workslist .slick-dots {
  bottom: -50px;
}
@media screen and (max-width: 767px) {
  .works .workslist .slick-dots {
    bottom: -35px;
  }
}
.works .workslist .slick-dots li {
  width: 47px;
  height: 5px;
}
@media screen and (max-width: 767px) {
  .works .workslist .slick-dots li {
    width: 36px;
  }
}
.works .workslist .slick-dots li button {
  width: 47px;
  height: 5px;
}
@media screen and (max-width: 767px) {
  .works .workslist .slick-dots li button {
    width: 36px;
  }
}
.works .workslist .slick-dots li button::before {
  content: "";
  font-family: "";
  width: 47px;
  height: 5px;
  background: #8E8E8E;
  display: block;
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .works .workslist .slick-dots li button::before {
    width: 36px;
  }
}
.works .workslist .slick-dots li.slick-active button::before {
  background: #0070D5;
}
.works .workslist .slick-prev, .works .workslist .slick-next {
  width: 50px;
  height: 51px;
  z-index: 10;
}
@media screen and (max-width: 767px) {
  .works .workslist .slick-prev, .works .workslist .slick-next {
    width: 32px;
    height: 33px;
  }
}
.works .workslist .slick-prev::before, .works .workslist .slick-next::before {
  display: block;
  font-family: "";
  width: 50px;
  height: 51px;
  content: "";
}
@media screen and (max-width: 767px) {
  .works .workslist .slick-prev::before, .works .workslist .slick-next::before {
    width: 32px;
    height: 33px;
  }
}
.works .workslist .slick-prev {
  left: 24%;
  background: url("../images/works/prev.png") center top no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .works .workslist .slick-prev {
    left: -5%;
  }
}
.works .workslist .slick-next {
  right: 24%;
  background: url("../images/works/next.png") center top no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .works .workslist .slick-next {
    right: -5%;
  }
}

.safety {
  padding-top: 42px;
  padding-bottom: 79.5px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .safety {
    padding: 40px 0;
  }
}
.safety h2 {
  width: 370px;
  margin: 0 auto 30px auto;
}
@media screen and (max-width: 767px) {
  .safety h2 {
    width: 100%;
    margin: 0 auto 20px auto;
  }
}
.safety h2 img {
  display: block;
}
@media screen and (max-width: 767px) {
  .safety .list {
    display: block;
  }
}
.safety .list .box {
  width: 320px;
  box-sizing: border-box;
  padding: 15px 20px 30px 20px;
  border: #0070D5 2px solid;
  border-radius: 3px;
}
@media screen and (max-width: 767px) {
  .safety .list .box {
    border-radius: 0;
    padding: 20px;
    margin-bottom: 20px;
  }
}
.safety .list .box img {
  display: block;
  width: 120px;
  margin: 0 auto 20px auto;
}
@media screen and (max-width: 767px) {
  .safety .list .box img {
    border-bottom-width: 94px;
    margin: 0 auto 10px auto;
  }
}
.safety .list .box h3 {
  color: #0070D5;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4em;
  padding-bottom: 14px;
  margin-bottom: 17px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .safety .list .box h3 {
    font-weight: 700;
    padding-bottom: 10px;
    margin-bottom: 10px;
  }
}
.safety .list .box h3::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-size: 16px 1px;
  background-image: linear-gradient(to right, #707070, #707070 9px, transparent 9px, transparent 17px);
  background-repeat: repeat-x;
  position: absolute;
  left: 0;
  bottom: 0;
}
.safety .list .box p {
  font-size: 16px;
  font-weight: 300;
  line-height: 1.43em;
}

.voice {
  background: url("../images/voice/bg.jpg") center top no-repeat;
  background-size: cover;
  padding-top: 40px;
  padding-bottom: 80px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .voice {
    background: url("../images/voice/bg_sp.jpg") center top no-repeat;
    background-size: cover;
    padding-bottom: 60px;
  }
}
.voice h2 {
  font-size: 32px;
  font-weight: 600;
  color: #0070D5;
  padding-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .voice h2 {
    font-size: 25px;
    font-weight: 700;
  }
}
.voice h2 span {
  font-weight: 600;
  position: relative;
}
.voice h2 span::after {
  content: "";
  display: block;
  width: 125px;
  height: 10px;
  background: url("../images/voice/line.png") center top no-repeat;
  background-size: cover;
  position: absolute;
  left: 50%;
  bottom: -20px;
  margin-left: -62.5px;
}
.voice p {
  font-size: 16px;
  font-weight: 300;
}
.voice .voicelist {
  padding-top: 20px;
  width: 804px;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .voice .voicelist {
    width: 90%;
  }
}
.voice .voicelist .box {
  border: #515152 2px solid;
  border-radius: 3px;
  padding: 40px 60px 0 40px;
  box-sizing: border-box;
  height: 340px;
  background: #fff;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .box {
    padding: 20px 20px 0 20px;
    height: 416px;
    position: relative;
  }
}
.voice .voicelist .box p {
  font-size: 16px;
  font-weight: 300;
  line-height: 1.7em;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .box p {
    font-size: 14px;
    line-height: 1.4em;
  }
}
.voice .voicelist .box h3 {
  font-size: 16px;
  font-weight: 600;
  padding-top: 20px;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .box h3 {
    font-size: 14px;
    font-weight: 700;
    position: absolute;
    left: 20px;
    bottom: 20px;
    padding-top: 0;
  }
}
.voice .voicelist .slick-dots {
  bottom: -50px;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .slick-dots {
    bottom: -35px;
  }
}
.voice .voicelist .slick-dots li {
  width: 47px;
  height: 5px;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .slick-dots li {
    width: 36px;
  }
}
.voice .voicelist .slick-dots li button {
  width: 47px;
  height: 5px;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .slick-dots li button {
    width: 36px;
  }
}
.voice .voicelist .slick-dots li button::before {
  content: "";
  font-family: "";
  width: 47px;
  height: 5px;
  background: #fff;
  display: block;
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .slick-dots li button::before {
    width: 36px;
  }
}
.voice .voicelist .slick-dots li.slick-active button::before {
  background: #515152;
}
.voice .voicelist .slick-prev, .voice .voicelist .slick-next {
  width: 51px;
  height: 51px;
  z-index: 10;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .slick-prev, .voice .voicelist .slick-next {
    width: 32px;
    height: 32px;
  }
}
.voice .voicelist .slick-prev::before, .voice .voicelist .slick-next::before {
  display: block;
  font-family: "";
  width: 51px;
  height: 51px;
  content: "";
}
@media screen and (max-width: 767px) {
  .voice .voicelist .slick-prev::before, .voice .voicelist .slick-next::before {
    width: 32px;
    height: 32px;
  }
}
.voice .voicelist .slick-prev {
  left: -25.5px;
  background: url("../images/voice/prev.png") center top no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .slick-prev {
    left: -5%;
  }
}
.voice .voicelist .slick-next {
  right: -25.5px;
  background: url("../images/voice/next.png") center top no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .voice .voicelist .slick-next {
    right: -5%;
  }
}

.staff {
  background: #F0FAFD;
  padding-top: 50px;
  padding-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .staff {
    padding-top: 40px;
    padding-bottom: 45px;
  }
}
.staff h2 {
  font-size: 30px;
  color: #0070D5;
  padding-bottom: 30px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .staff h2 {
    font-size: 25px;
    padding-bottom: 37px;
  }
}
.staff h2 span {
  font-weight: 600;
  position: relative;
  padding-bottom: 15px;
}
.staff h2 span::after {
  content: "";
  display: block;
  width: 183px;
  height: 10px;
  background: url("../images/works/line.png") center top no-repeat;
  background-size: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .staff h2 span::after {
    width: 150px;
  }
}
@media screen and (max-width: 767px) {
  .staff .inner, .staff .company, .staff .safety {
    display: block;
  }
}
.staff .inner .box, .staff .company .box, .staff .safety .box {
  align-items: flex-start;
  width: 490px;
  box-sizing: border-box;
  background: #fff;
  padding: 30px 20px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .staff .inner .box, .staff .company .box, .staff .safety .box {
    width: 100%;
    padding: 20px 20px 40px 20px;
    margin-bottom: 20px;
  }
}
.staff .inner .box img, .staff .company .box img, .staff .safety .box img {
  width: 223px;
}
@media screen and (max-width: 767px) {
  .staff .inner .box img, .staff .company .box img, .staff .safety .box img {
    width: 100%;
  }
}
.staff .inner .box .img, .staff .company .box .img, .staff .safety .box .img {
  display: none;
}
@media screen and (max-width: 767px) {
  .staff .inner .box .img, .staff .company .box .img, .staff .safety .box .img {
    display: block;
    width: 37%;
    text-align: center;
  }
  .staff .inner .box .img h4, .staff .company .box .img h4, .staff .safety .box .img h4 {
    font-size: 16px;
    font-weight: 600;
    color: #707070;
    padding-top: 15px;
  }
}
.staff .inner .box .txt, .staff .company .box .txt, .staff .safety .box .txt {
  width: 205px;
}
@media screen and (max-width: 767px) {
  .staff .inner .box .txt, .staff .company .box .txt, .staff .safety .box .txt {
    width: 63%;
    box-sizing: border-box;
    padding-left: 10px;
  }
}
.staff .inner .box .txt h3, .staff .company .box .txt h3, .staff .safety .box .txt h3 {
  font-size: 16px;
  border: #0070D5 1px solid;
  text-align: center;
  line-height: 36px;
  margin-bottom: 20px;
  font-weight: 600;
  color: #0070D5;
}
@media screen and (max-width: 767px) {
  .staff .inner .box .txt h3, .staff .company .box .txt h3, .staff .safety .box .txt h3 {
    font-size: 14px;
  }
}
.staff .inner .box .txt p, .staff .company .box .txt p, .staff .safety .box .txt p {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4em;
  letter-spacing: -0.01em;
}
@media screen and (max-width: 767px) {
  .staff .inner .box .txt p, .staff .company .box .txt p, .staff .safety .box .txt p {
    font-size: 14px;
    letter-spacing: 0em;
    line-height: 1.7em;
  }
}
.staff .inner .box .txt h4, .staff .company .box .txt h4, .staff .safety .box .txt h4 {
  font-size: 16px;
  font-weight: 600;
  color: #707070;
  position: absolute;
  left: 20px;
  bottom: 20px;
}
@media screen and (max-width: 767px) {
  .staff .inner .box .txt h4, .staff .company .box .txt h4, .staff .safety .box .txt h4 {
    display: none;
  }
}

.btn {
  width: 640px;
  height: 110px;
  border-radius: 88px;
  overflow: hidden;
  box-shadow: 0 4px 5px rgba(0, 3, 67, 0.27);
  margin: auto;
}
@media screen and (max-width: 767px) {
  .btn {
    box-shadow: none;
    overflow: visible;
    width: 100%;
    height: auto;
    border-radius: 0;
  }
}
.btn:hover {
  box-shadow: none;
}
.btn a:hover {
  opacity: 1;
}

.flow {
  background: #0070D5;
  padding-top: 60px;
  padding-bottom: 100px;
}
@media screen and (max-width: 767px) {
  .flow {
    padding-top: 40px;
    padding-bottom: 60px;
  }
}
.flow h2 {
  font-size: 30px;
  color: #FFF615;
  padding-bottom: 30px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .flow h2 {
    font-size: 25px;
    padding-bottom: 37px;
  }
}
.flow h2 span {
  font-weight: 600;
  position: relative;
  padding-bottom: 15px;
}
.flow h2 span::after {
  content: "";
  display: block;
  width: 360px;
  height: 10px;
  background: url("../images/flow/line.png") center top no-repeat;
  background-size: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .flow h2 span::after {
    width: 300px;
  }
}
.flow h2.sagyou {
  margin-top: 30px;
}
.flow h2.sagyou span::after {
  width: 123px;
  background: url("../images/flow/line2.png") center top no-repeat;
}
@media screen and (max-width: 767px) {
  .flow .inner, .flow .company, .flow .safety {
    padding: 30px 10px;
    background: #fff;
  }
}
.flow .inner .box, .flow .company .box, .flow .safety .box {
  width: 307px;
  box-sizing: border-box;
  padding: 10px 15px 10px 15px;
  position: relative;
  background: #fff;
  margin-bottom: 35px;
}
@media screen and (max-width: 767px) {
  .flow .inner .box, .flow .company .box, .flow .safety .box {
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0;
    padding-bottom: 40px;
    width: 100%;
    background: url(../images/flow/border-dotto.svg) no-repeat;
    background-size: contain;
    background-position: center 99px;
  }
  .flow .inner .box:last-child, .flow .company .box:last-child, .flow .safety .box:last-child {
    padding-bottom: 0;
    background: none;
  }
}
.flow .inner .box::after, .flow .company .box::after, .flow .safety .box::after {
  content: "";
  display: block;
  width: 12px;
  height: 40px;
  background: url("../images/flow/arrow.png") center top no-repeat;
  background-size: cover;
  position: absolute;
  right: -26px;
  top: 50%;
  margin-top: -20px;
}
@media screen and (max-width: 767px) {
  .flow .inner .box::after, .flow .company .box::after, .flow .safety .box::after {
    width: 27px;
    height: 10px;
    background: url("../images/flow/arrow_sp.png") center top no-repeat;
    background-size: cover;
    right: auto;
    left: 50%;
    bottom: -20px;
    top: auto;
    margin-left: -13.5px;
    margin-top: 0;
    content: none;
  }
}
@media screen and (min-width: 768px) {
  .flow .inner .box:nth-of-type(3n)::after, .flow .company .box:nth-of-type(3n)::after, .flow .safety .box:nth-of-type(3n)::after {
    content: none;
  }
}
@media screen and (max-width: 767px) {
  .flow .inner .box:last-of-type, .flow .company .box:last-of-type, .flow .safety .box:last-of-type {
    margin-bottom: 0;
  }
  .flow .inner .box:last-of-type::after, .flow .company .box:last-of-type::after, .flow .safety .box:last-of-type::after {
    content: none;
  }
}
.flow .inner .box .num, .flow .company .box .num, .flow .safety .box .num {
  display: block;
  text-align: center;
  width: 50px;
  line-height: 50px;
  box-sizing: border-box;
  border: #000 1px solid;
  border-radius: 50%;
  position: absolute;
  top: -10px;
  left: 10px;
  background: #FFF615;
  font-size: 26px;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .flow .inner .box .num, .flow .company .box .num, .flow .safety .box .num {
    width: 34px;
    line-height: 34px;
    font-size: 19px;
    top: -5px;
    left: 5px;
  }
}
.flow .inner .box img, .flow .company .box img, .flow .safety .box img {
  margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
  .flow .inner .box img, .flow .company .box img, .flow .safety .box img {
    width: 146px;
    height: 85px;
    -o-object-fit: cover;
       object-fit: cover;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .flow .inner .box .txt, .flow .company .box .txt, .flow .safety .box .txt {
    width: calc(100% - 160px);
  }
}
.flow .inner .box h3, .flow .company .box h3, .flow .safety .box h3 {
  text-align: center;
  color: #0070D5;
  font-size: 22px;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .flow .inner .box h3, .flow .company .box h3, .flow .safety .box h3 {
    font-size: 18px;
    line-height: 1.2em;
    text-align: left;
  }
}
.flow .inner .box p, .flow .company .box p, .flow .safety .box p {
  font-size: 16px;
  line-height: 1.4em;
}
@media screen and (max-width: 767px) {
  .flow .inner .box p, .flow .company .box p, .flow .safety .box p {
    font-size: 15px;
  }
}
.flow .yoko {
  overflow: hidden;
  display: flex;
  justify-content: center;
  gap: 80px;
  margin: auto;
  margin-top: 30px;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  .flow .yoko {
    width: 890px;
  }
}
@media screen and (max-width: 767px) {
  .flow .yoko {
    padding: 0 10px;
    flex-direction: column;
    gap: 30px;
    margin-top: 0;
  }
}
.flow .yoko li {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 34px;
  color: #0070D5;
  background-color: #fff;
  padding: 30px 10px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .flow .yoko li {
    flex-direction: row;
    justify-content: center;
    padding: 10px;
    font-size: 1rem;
  }
}
.flow .yoko li::after {
  position: absolute;
  content: "";
}
@media screen and (min-width: 768px) {
  .flow .yoko li::after {
    right: -50px;
    top: 48%;
    width: 20px;
    height: 20px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 10px 20px;
    border-color: transparent transparent transparent #fff715;
  }
}
@media screen and (max-width: 767px) {
  .flow .yoko li::after {
    bottom: -23px;
    left: 50%;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 17.3px 10px 0 10px;
    border-color: #fff715 transparent transparent transparent;
  }
}
.flow .yoko li span {
  writing-mode: vertical-rl;
}
@media screen and (max-width: 767px) {
  .flow .yoko li span {
    writing-mode: inherit;
  }
}

.greeting {
  position: relative;
  padding-bottom: 60px;
}
.greeting img {
  width: 56%;
  max-width: 1087px;
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 767px) {
  .greeting img {
    width: 100%;
    position: relative;
  }
}
.greeting .inner, .greeting .company, .greeting .safety {
  padding-top: 40px;
}
@media screen and (max-width: 767px) {
  .greeting .inner, .greeting .company, .greeting .safety {
    display: block;
    margin: auto;
    padding-top: 20px;
  }
}
.greeting .inner .box, .greeting .company .box, .greeting .safety .box {
  width: 495px;
}
@media screen and (max-width: 767px) {
  .greeting .inner .box, .greeting .company .box, .greeting .safety .box {
    width: 100%;
  }
}
.greeting h2 {
  text-align: center;
  width: 260px;
  line-height: 50px;
  margin: 0 auto 30px auto;
  border: #000 2px solid;
  border-radius: 68px;
  color: #0070D5;
  font-size: 30px;
  font-weight: 600;
  background: #fff;
  position: relative;
}
@media screen and (max-width: 767px) {
  .greeting h2 {
    font-size: 25px;
    font-weight: 700;
    width: 188px;
    line-height: 54px;
  }
}
.greeting h2::before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}
.greeting h2::after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -18px;
  border: 15px solid transparent;
  border-top: 15px solid #000;
  z-index: 1;
}
.greeting h3 {
  color: #0070D5;
  font-size: 29px;
  font-weight: 600;
  padding-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .greeting h3 {
    font-size: 19px;
    font-weight: 700;
    padding-bottom: 15px;
  }
}
.greeting p {
  font-size: 16px;
  line-height: 1.75em;
}
@media screen and (max-width: 767px) {
  .greeting p {
    line-height: 1.6em;
  }
}
.greeting .name {
  padding-top: 30px;
}
@media screen and (max-width: 767px) {
  .greeting .name {
    padding-top: 20px;
  }
}
.greeting .name dt, .greeting .name dd {
  line-height: 1.4em;
}
.greeting .name dt {
  font-size: 16px;
}
.greeting .name dd {
  font-size: 38px;
}
@media screen and (max-width: 767px) {
  .greeting .name dd {
    font-size: 36px;
  }
}

.company {
  padding-bottom: 100px;
}
@media screen and (max-width: 767px) {
  .company {
    padding-bottom: 20px;
  }
}
.company .box {
  width: 470px;
}
@media screen and (max-width: 767px) {
  .company .box {
    padding-bottom: 40px;
  }
}
.company .box table {
  width: 100%;
  border-top: #707070 1px solid;
}
.company .box table th, .company .box table td {
  font-size: 16px;
  text-align: left;
  padding: 20px 0;
  border-bottom: #707070 1px solid;
  vertical-align: top;
}

.company .box table th {
  width: 110px;
  font-weight: bold;
}
.company h2 {
  font-size: 30px;
  color: #0070D5;
  padding-bottom: 30px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .company h2 {
    font-size: 25px;
    padding-bottom: 37px;
  }
}
.company h2 span {
  font-weight: 600;
  position: relative;
  padding-bottom: 15px;
}
.company h2 span::after {
  content: "";
  display: block;
  width: 125px;
  height: 10px;
  background: url("../images/works/line.png") center top no-repeat;
  background-size: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .company h2 span::after {
    width: 102px;
  }
}
.company iframe {
  display: block;
  width: 690px;
  height: 400px;
  margin-right: -190px;
  border: 0;
}
@media screen and (max-width: 1390px) {
  .company iframe {
    width: 500px;
    margin-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .company iframe {
    display: none;
  }
}

.gmap {
  display: none;
}
@media screen and (max-width: 767px) {
  .gmap {
    display: block;
    width: 100%;
    height: 180px;
    margin-bottom: 60px;
  }
}

.faq {
  background: #F0FAFD;
  padding-top: 60px;
  padding-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .faq {
    padding-top: 50px;
    padding-bottom: 80px;
  }
}
.faq h2 {
  font-size: 30px;
  color: #0070D5;
  padding-bottom: 30px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .faq h2 {
    font-size: 25px;
    padding-bottom: 37px;
  }
}
.faq h2 span {
  font-weight: 600;
  position: relative;
  padding-bottom: 15px;
}
.faq h2 span::after {
  content: "";
  display: block;
  width: 210px;
  height: 10px;
  background: url("../images/works/line.png") center top no-repeat;
  background-size: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .faq h2 span::after {
    width: 180px;
  }
}
.faq .inner, .faq .safety, .faq .company {
  padding-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .faq .inner, .faq .safety, .faq .company {
    display: block;
  }
}
.faq .inner dl, .faq .safety dl, .faq .company dl {
  display: block;
  width: 50%;
  box-sizing: border-box;
}
@media screen and (max-width: 767px) {
  .faq .inner dl, .faq .safety dl, .faq .company dl {
    width: 100%;
  }
}
.faq .inner dl:first-of-type, .faq .safety dl:first-of-type, .faq .company dl:first-of-type {
  padding-right: 20px;
  border-right: #707070 2px dotted;
}
@media screen and (max-width: 767px) {
  .faq .inner dl:first-of-type, .faq .safety dl:first-of-type, .faq .company dl:first-of-type {
    padding-right: 0;
    border-right: 0;
  }
}
@media screen and (min-width: 768px) {
  .faq .inner dl:first-of-type dd:last-of-type, .faq .safety dl:first-of-type dd:last-of-type, .faq .company dl:first-of-type dd:last-of-type {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
  }
}
.faq .inner dl:last-of-type, .faq .safety dl:last-of-type, .faq .company dl:last-of-type {
  padding-left: 20px;
}
@media screen and (max-width: 767px) {
  .faq .inner dl:last-of-type, .faq .safety dl:last-of-type, .faq .company dl:last-of-type {
    padding-left: 0;
  }
}
.faq .inner dl:last-of-type dd:last-of-type, .faq .safety dl:last-of-type dd:last-of-type, .faq .company dl:last-of-type dd:last-of-type {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: 0;
}
.faq .inner dl dt, .faq .safety dl dt, .faq .company dl dt, .faq .inner dl dd, .faq .safety dl dd, .faq .company dl dd {
  position: relative;
  padding-left: 60px;
}
@media screen and (max-width: 767px) {
  .faq .inner dl dt, .faq .safety dl dt, .faq .company dl dt, .faq .inner dl dd, .faq .safety dl dd, .faq .company dl dd {
    padding-left: 35px;
  }
}
.faq .inner dl dt::before, .faq .safety dl dt::before, .faq .company dl dt::before, .faq .inner dl dd::before, .faq .safety dl dd::before, .faq .company dl dd::before {
  content: "";
  display: block;
  position: absolute;
}
.faq .inner dl dt, .faq .safety dl dt, .faq .company dl dt {
  font-size: 18px;
  font-weight: 700;
  padding-bottom: 35px;
}
@media screen and (max-width: 767px) {
  .faq .inner dl dt, .faq .safety dl dt, .faq .company dl dt {
    font-size: 16px;
    padding-bottom: 15px;
  }
}
.faq .inner dl dt::before, .faq .safety dl dt::before, .faq .company dl dt::before {
  width: 23.5px;
  height: 32px;
  background: url("../images/faq/q.png") center top no-repeat;
  background-size: cover;
  top: 0;
  left: 0;
}
@media screen and (max-width: 767px) {
  .faq .inner dl dt::before, .faq .safety dl dt::before, .faq .company dl dt::before {
    width: 14px;
    height: 20px;
    top: 7px;
  }
}
.faq .inner dl dd, .faq .safety dl dd, .faq .company dl dd {
  font-size: 16px;
  line-height: 1.68em;
  padding-bottom: 30px;
  border-bottom: #707070 2px dotted;
  margin-bottom: 25px;
}
@media screen and (max-width: 767px) {
  .faq .inner dl dd, .faq .safety dl dd, .faq .company dl dd {
    padding-bottom: 25px;
    margin-bottom: 25px;
  }
}
.faq .inner dl dd::before, .faq .safety dl dd::before, .faq .company dl dd::before {
  width: 22px;
  height: 24.5px;
  background: url("../images/faq/a.png") center top no-repeat;
  background-size: cover;
  top: 0;
  left: 2px;
}
@media screen and (max-width: 767px) {
  .faq .inner dl dd::before, .faq .safety dl dd::before, .faq .company dl dd::before {
    top: 8px;
    width: 14px;
    height: 15px;
  }
}
@media screen and (max-width: 767px) {
  .faq .btn {
    width: 90%;
    margin: auto;
  }
}

.hiyolist {
  padding-top: 50px;
  padding-bottom: 80px;
}
.hiyolist h2 {
  font-size: 33px;
  font-weight: bold;
  text-align: center;
  background: url(../images/hiyolist/line.svg) no-repeat;
  background-position: 50% 90%;
  line-height: 1.2;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .hiyolist h2 {
    font-size: 1.2rem;
  }
}
.hiyolist h2 span {
  font-size: 40px;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .hiyolist h2 span {
    font-size: 2rem;
  }
}
.hiyolist h2 span.key {
  color: #C64212;
}
.hiyolist .hikaku {
  border: #0070D5 1px solid;
  padding: 2rem;
  display: flex;
  flex-wrap: wrap;
  gap: 4.6rem;
  justify-content: center;
  position: relative;
}
.hiyolist .hikaku::after {
  content: "";
  position: absolute;
  background-color: #0070D5;
}
@media screen and (max-width: 767px) {
  .hiyolist .hikaku::after {
    top: 46%;
    width: calc(100% - 4rem);
    height: 1px;
  }
}
@media screen and (min-width: 768px) {
  .hiyolist .hikaku::after {
    left: 50%;
    height: calc(100% - 4rem);
    width: 1px;
  }
}
.hiyolist .hikaku .box {
  max-width: 430px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hiyolist .hikaku .box h3 {
  font-size: 1.2rem;
  line-height: 1.4;
  color: #0070D5;
  font-weight: bold;
  margin-bottom: 10px;
}
.hiyolist .hikaku .box ul {
  display: flex;
  gap: 2px;
  overflow: hidden;
}
.hiyolist .hikaku .box ul li {
  text-align: center;
}
.hiyolist .hikaku .box ul li p {
  color: #0070D5;
  margin-top: 10px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .hiyolist .hikaku .box ul li p {
    font-size: 0.7rem;
  }
}
.hiyolist .hikaku .box ul li p::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #000000;
  position: absolute;
  right: -10px;
  top: 50%;
  margin-top: -5px;
}
.hiyolist .hikaku .box ul li p span {
  display: inline-block;
  background-color: #0070D5;
  color: #fff;
  padding: 0 10px;
}
.hiyolist .hikaku .box ul li:last-child p {
  color: #C64212;
}
.hiyolist .hikaku .box ul li:last-child p span {
  background-color: #C64212;
}
.hiyolist .hikaku .box .txt {
  margin-top: 10px;
}
.hiyolist .ptxt {
  position: relative;
  text-align: center;
  color: #fff;
  background-color: #1A50B5;
  padding: 10px;
  width: 230px;
  border-radius: 50px;
  margin: auto;
  margin-top: 60px;
  margin-bottom: 20px;
  font-weight: bold;
}
.hiyolist .ptxt::after {
  width: 15px;
  height: 10px;
  display: block;
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  margin-left: -7px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 7.5px 0 7.5px;
  border-color: #1A50B5 transparent transparent transparent;
}
.hiyolist .blue-box {
  padding: 20px;
  border: #0070D5 1px solid;
  background-color: #EFF7FF;
  margin-top: 30px;
  margin-bottom: 60px;
  display: flex;
  gap: 2rem;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .hiyolist .blue-box {
    flex-direction: column;
    justify-content: center;
  }
}
.hiyolist .blue-box .box h3 {
  font-size: 1.3rem;
  font-weight: bold;
  color: #0070D5;
  margin-bottom: 1rem;
}
.hiyolist .h2-ttl {
  line-height: 1.8;
  text-align: center;
  font-size: 1.8rem;
  font-weight: bold;
  color: #0070D5;
  padding-bottom: 15px;
  margin-bottom: 30px;
  background: url(/images/hiyolist/line2.svg) no-repeat center bottom;
  padding-top: 90px;
  margin-top: -90px;
}

.form {
  background: #F0FAFD;
  padding-top: 60px;
  padding-bottom: 120px;
  box-sizing: border-box;
  min-height: calc(100vh - 135px);
}
@media screen and (max-width: 767px) {
  .form {
    padding: 80px 0;
    min-height: calc(100vh - 45px);
  }
}
.form .inner, .form .safety, .form .company {
  box-sizing: border-box;
  border: #707070 1px solid;
  padding: 50px 60px 100px 50px;
  background: #fff;
}
@media screen and (max-width: 767px) {
  .form .inner, .form .safety, .form .company {
    padding: 50px 25px;
  }
}
.form h2 {
  font-size: 30px;
  color: #0070D5;
  padding-bottom: 20px;
  text-align: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .form h2 {
    font-size: 25px;
    padding-bottom: 37px;
    margin-bottom: 10px;
  }
}
.form h2 span {
  font-weight: 600;
  position: relative;
  padding-bottom: 25px;
}
.form h2 span::after {
  content: "";
  display: block;
  width: 125px;
  height: 10px;
  background: url("../images/works/line.png") center top no-repeat;
  background-size: 100%;
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -62.5px;
}
@media screen and (max-width: 767px) {
  .form h2 span::after {
    width: 102px;
    margin-left: -51px;
  }
}
.form .formtxt {
  text-align: center;
  padding-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .form .formtxt {
    padding-bottom: 40px;
  }
}
.form .formtxt p {
  font-size: 16px;
}
.form .formtxt a {
  color: #FF2626;
  margin: 0 5px;
}
.form .formtxt a:hover {
  text-decoration: underline;
}
.form h3 {
  font-size: 16px;
  font-weight: 600;
  border-left: #0070D5 4px solid;
  padding-left: 10px;
  line-height: 1.6em;
  margin-bottom: 20px;
}
.form .map {
  padding-top: 20px;
  padding-bottom: 30px;
  align-items: flex-start;
  border-bottom: #707070 1px solid;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .form .map {
    padding-top: 5px;
  }
}
.form .map .img {
  width: 500px;
  text-align: center;
}
.form .map .img img {
  width: 350px;
}
@media screen and (max-width: 767px) {
  .form .map .img {
    display: none;
  }
}
.form .map .list {
  width: 330px;
}
.form .map .list ul li {
  display: block;
  font-size: 14px;
  line-height: 1.5em;
  padding-bottom: 20px;
  font-weight: 400;
  font-family: "Noto Sans JP", sans-serif;
}
.form .map .list ul li label {
  display: block;
  font-size: 16px;
  color: #fff;
  margin-bottom: 10px;
  line-height: 50px;
  border-radius: 5px;
  padding-left: 15px;
  font-weight: 500;
}
.form .map .list ul li label input[type=radio] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
  border: 0;
  opacity: 0;
}
.form .map .list ul li label span {
  position: relative;
  padding-left: 30px;
}
.form .map .list ul li label span::before, .form .map .list ul li label span::after {
  content: "";
  box-sizing: border-box;
  display: block;
  border-radius: 50%;
  position: absolute;
}
.form .map .list ul li label span::before {
  top: 2px;
  left: 0;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
  background: #fff;
}
.form .map .list ul li input[type=radio]:checked + span::after {
  top: 7px;
  left: 5px;
  width: 10px;
  height: 10px;
  background-color: #000;
}
.form .map .list ul li:nth-child(1) label {
  background: #84C925;
}
.form .map .list ul li:nth-child(2) label {
  background: #58C4F1;
}
.form .map .list ul li:nth-child(3) label {
  background: #EE9C00;
}
.form .map .list p {
  font-size: 12px;
  color: #818181;
}
.form input[type=submit], .form input[type=button] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: #0070D5;
  display: block;
  width: 295px;
  line-height: 80px;
  text-align: center;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  margin: auto;
  border-radius: 8px;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .form input[type=submit], .form input[type=button] {
    width: 100%;
    line-height: 60px;
  }
}
.form input[type=button] {
  background: #C3C3C3;
  margin-bottom: 20px;
  line-height: 70px;
  box-shadow: none;
}
.form .line {
  border-bottom: #707070 1px solid;
  padding-bottom: 40px;
  margin-bottom: 40px;
}
.form .line h2 {
  margin-bottom: 30px;
}
.form .line h3 .req {
  position: relative;
  top: auto;
  right: auto;
}
.form .line input[type=text] {
  border: #555 1px solid;
  border-radius: 3px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 16px;
  line-height: 40px;
  padding: 0 10px;
}
@media screen and (max-width: 767px) {
  .form .line input[type=text] {
    font-size: 14px;
  }
}
.form .line p {
  font-size: 16px;
}
.form .line ul::after {
  content: "";
  display: block;
  width: 280px;
}
@media screen and (max-width: 767px) {
  .form .line ul::after {
    width: 47%;
  }
}
@media screen and (max-width: 767px) {
  .form .line ul.mb li {
    margin-bottom: 20px;
  }
  .form .line ul.mb li:last-child {
    margin-bottom: 0;
  }
}
.form .line ul li {
  display: block;
  font-size: 16px;
  width: 280px;
}
@media screen and (max-width: 767px) {
  .form .line ul li {
    width: 48%;
    font-size: 14px;
  }
  .form .line ul li:nth-child(3) {
    margin-top: 10px;
  }
}
.form .line ul li img {
  display: block;
  margin-bottom: 10px;
}
.form .line ul li label {
  display: block;
  line-height: 40px;
  border-radius: 3px;
  padding-left: 15px;
  border: #555 1px solid;
}
@media screen and (max-width: 767px) {
  .form .line ul li label {
    padding-left: 10px;
  }
}
.form .line ul li label input[type=radio] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
  border: 0;
  opacity: 0;
}
.form .line ul li label span {
  position: relative;
  padding-left: 30px;
}
.form .line ul li label span::before, .form .line ul li label span::after {
  content: "";
  box-sizing: border-box;
  display: block;
  border-radius: 50%;
  position: absolute;
}
.form .line ul li label span::before {
  top: -2px;
  left: 0;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
  background: #fff;
}
.form .line ul li input[type=radio]:checked + span::after {
  top: 3px;
  left: 5px;
  width: 10px;
  height: 10px;
  background-color: #000;
}
.form .line .box1 {
  width: 360px;
}
@media screen and (max-width: 767px) {
  .form .line .box1 {
    width: 100%;
    padding-bottom: 40px;
  }
}
.form .line .box1 input[type=text] {
  width: 240px;
  margin-right: 12px;
}
@media screen and (max-width: 767px) {
  .form .line .box1 input[type=text] {
    width: 200px;
  }
}
.form .line .box2 {
  width: calc(100% - 360px);
}
@media screen and (max-width: 767px) {
  .form .line .box2 {
    width: 100%;
    justify-content: space-between;
  }
}
.form .line .box2 h3 {
  width: 100%;
  box-sizing: border-box;
}
.form .line .box2 input[type=text] {
  width: 150px;
  margin-right: 5px;
}
@media screen and (max-width: 767px) {
  .form .line .box2 input[type=text] {
    width: 90px;
  }
}
.form .line .box2 p:first-of-type {
  margin-right: 25px;
}
@media screen and (max-width: 767px) {
  .form .line .box2 p:first-of-type {
    margin-right: 0;
  }
}
.form .line table {
  width: 100%;
}
.form .line table select {
  font-size: 14px;
  padding: 10px 15px;
  border: #555 1px solid;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 5px;
  background: #fff;
}
.form .line table textarea {
  font-size: 16px;
  border: #555 1px solid;
  border-radius: 5px;
  width: 100%;
  height: 170px;
  box-sizing: border-box;
}
@media screen and (max-width: 767px) {
  .form .line table textarea {
    font-size: 14px;
  }
}
.form .line table input[type=text] {
  width: 100%;
  box-sizing: border-box;
}
.form .line table label {
  display: inline-block;
  position: relative;
  margin-right: 20px;
}
.form .line table label.checkbox {
  margin-right: 0;
}
@media screen and (max-width: 767px) {
  .form .line table label {
    margin-right: 10px;
  }
}
.form .line table label:last-of-type {
  margin-right: 0;
}
.form .line table label input[type=radio] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
  border: 0;
  opacity: 0;
}
.form .line table label span {
  position: relative;
  padding-left: 30px;
}
@media screen and (max-width: 767px) {
  .form .line table label span {
    padding-left: 22px;
  }
}
.form .line table label span::before, .form .line table label span::after {
  content: "";
  box-sizing: border-box;
  display: block;
  border-radius: 50%;
  position: absolute;
}
.form .line table label span::before {
  top: 3px;
  left: 0;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
  background: #fff;
}
.form .line table input[type=radio]:checked + span::after {
  top: 8px;
  left: 5px;
  width: 10px;
  height: 10px;
  background-color: #000;
}
.form .line table th, .form .line table td {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  text-align: left;
  padding: 20px 0;
  vertical-align: top;
  border-bottom: #707070 1px solid;
  color: #3E3E3E;
}
@media screen and (max-width: 767px) {
  .form .line table th, .form .line table td {
    display: block;
    width: 100%;
  }
}
.form .line table th {
  font-weight: 700;
  width: 230px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .form .line table th {
    width: 100%;
    padding-bottom: 20px;
  }
  .form .line table th br {
    display: none;
  }
}
.form .line table td {
  font-weight: 400;
}
.form .line table tr:last-child th, .form .line table tr:last-child td {
  padding-bottom: 0;
  border-bottom: 0;
}
@media screen and (max-width: 767px) {
  .form .line table tr:last-child th {
    padding-bottom: 20px;
  }
}
.form .line table .zipbox {
  align-items: center;
  padding-bottom: 20px;
}
.form .line table .zipbox input[type=text] {
  width: 180px;
}
@media screen and (max-width: 767px) {
  .form .line table .zipbox input[type=text] {
    width: 120px;
  }
}
.form .line table .zipbox span {
  display: block;
  background: #2FB553;
  font-size: 20px;
  color: #fff;
  border-radius: 5px;
  line-height: 40px;
  width: 120px;
  text-align: center;
  margin: 0 7px;
}
@media screen and (max-width: 767px) {
  .form .line table .zipbox span {
    font-size: 16px;
    width: 80px;
  }
}
.form .req {
  color: #fff;
  background: #FC3C3C;
  font-family: "Noto Sans JP", sans-serif;
  display: inline-block;
  line-height: 20px;
  font-size: 12px;
  font-weight: 700;
  padding: 0 5px;
  margin-left: 10px;
  position: absolute;
  top: 28px;
  right: 30px;
}
@media screen and (max-width: 767px) {
  .form .req {
    position: relative;
    top: auto;
    right: auto;
  }
}
.form input[type=checkbox] {
  display: none;
}
.form .checkbox {
  box-sizing: border-box;
  cursor: pointer;
  display: inline-block;
  padding: 5px 0 5px 25px;
  position: relative;
  width: 19%;
  display: inline-block;
}
.form .checkbox.long {
  width: 25%;
}
@media screen and (max-width: 767px) {
  .form .checkbox {
    width: 49%;
  }
}
.form .checkbox::before {
  background: #fff;
  border: 1px solid #231815;
  content: "";
  display: block;
  height: 16px;
  left: 0;
  margin-top: -8px;
  position: absolute;
  top: 50%;
  width: 16px;
}
.form .checkbox::after {
  border-right: 3px solid #000;
  border-bottom: 3px solid #000;
  content: "";
  display: block;
  height: 9px;
  left: 5px;
  margin-top: -7px;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: rotate(45deg);
  width: 5px;
}
.form input[type=checkbox]:checked + .checkbox::after {
  opacity: 1;
}

.thanks {
  text-align: center;
}
@media screen and (max-width: 767px) {
  .thanks {
    text-align: left;
  }
}
.thanks h2 {
  font-weight: bold;
  border-bottom: #ccc 1px solid;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .thanks h2 {
    padding-bottom: 20px;
  }
}
.thanks p {
  font-size: 16px;
  line-height: 2em;
}
.thanks a {
  display: block;
  width: 340px;
  line-height: 60px;
  background: #0070D5;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 16px;
  margin: 40px auto 0 auto;
  border-radius: 10px;
  text-align: center;
}
.thanks a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 767px) {
  .thanks a {
    width: 100%;
  }
}

.tel-contact {
  width: 90%;
  margin: auto;
  margin-bottom: 40px;
  box-sizing: border-box;
  padding: 30px 20px;
  border: #0070D5 2px solid;
  background-color: #fff;
}
.tel-contact .h2 {
  font-size: 24px;
  color: #0070D5;
  text-align: center;
  margin-bottom: 20px;
  font-weight: bold;
}

.tel-contact .column {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  align-items: center;
}
.tel-contact .column .phone-num {
  color: #E24E00;
  font-size: 36px;
  position: relative;
  font-weight: bold;
  white-space: nowrap;
}

@media screen and (min-width: 767px) {
  .tel-contact {
    width: 1000px;
    padding: 40px;
    margin-bottom: 60px;
  }
  .tel-contact .h2 br {
    display: none;
  }
  .tel-contact .column {
    gap: 30px;
  }
}
@media screen and (max-width: 767px) {
  .tel-contact .phone-num {
    font-size: 26px !important;
    width: 100%;
  }
  .tel-contact .phone-num a {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
  }
  .tel-contact .jikan {
    font-size: 14px;
  }
}

.spnavtel {
  width: 83%;
  margin: auto;
}

.spnavtel img {
  width: 100%;
}