@charset "UTF-8";
/*リセットcss---------------------------*/
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

@media screen\0  {
  body {
    display: block;
  }
}
a {
  color: #333;
  text-decoration: none;
  background-color: transparent;
}

a:hover {
  color: #fff33f;
  text-decoration: none;
}

p, ol, ul, li, table, th, td, dl, dt, dd, a, address, figcaption {
  font-feature-settings: "palt";
  margin-bottom: 0;
  color: #333;
  letter-spacing: 1px;
  line-height: 1.5em;
  font-size: 1.6rem;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

table {
  width: 100%;
  border-spacing: 0;
}

button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}
button:focus {
  outline: 0;
}

@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: auto;
  }
}
@media only screen and (min-width: 992px) {
  p, ol, ul, li, table, th, td, dl, dt, dd, a, address, figcaption {
    font-size: 2.6rem;
  }
}
/*フォント関連----------------------*/
body {
  font-family: "Noto Sans JP", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
}

html {
  font-size: 62.5%;
}

h1 {
  font-size: 4rem;
}

h2 {
  font-size: 2.6rem;
}

h3 {
  font-size: 2.4rem;
}

h4 {
  font-size: 2.3rem;
}

h5 {
  font-size: 2.2rem;
}

/*汎用クラス*/
.font_s {
  font-size: 1.2rem !important;
}

.font_sm {
  font-size: 1.6rem !important;
}

.font_smm {
  font-size: 1.6rem !important;
}

.font_mm {
  font-size: 1.6rem !important;
}

.font_ml {
  font-size: 2.6rem !important;
}

.font_m {
  font-size: 1.8rem !important;
}

.font_mml {
  font-size: 2rem !important;
}

.font_l {
  font-size: 2.8rem !important;
}

.font_ll {
  font-size: 8rem !important;
}

@media only screen and (min-width: 768px) {
  /*汎用クラス*/
  .font_sm {
    font-size: 1.8rem !important;
  }
  .font_mm {
    font-size: 2rem !important;
  }
  .font_mml {
    font-size: 2.1rem !important;
  }
  .font_l {
    font-size: 5rem !important;
  }
  .font_ll {
    font-size: 14rem !important;
  }
}
@media only screen and (min-width: 992px) {
  h1 {
    font-size: 8rem;
  }
  h2 {
    font-size: 5.8rem;
  }
  h3 {
    font-size: 4.2rem;
  }
  h4 {
    font-size: 3.4rem;
  }
  h5 {
    font-size: 3rem;
  }
  /*汎用クラス*/
  .font_s {
    font-size: 1.4rem !important;
  }
  .font_m {
    font-size: 2.4rem !important;
  }
  .font_mm {
    font-size: 2.4rem !important;
  }
  .font_mml {
    font-size: 3rem !important;
  }
  .font_ml {
    font-size: 3.6rem !important;
  }
  .font_l {
    font-size: 6rem !important;
  }
  .font_ll {
    font-size: 18rem !important;
  }
}
@media only screen and (min-width: 1200px) {
  .font_mml {
    font-size: 3.5rem !important;
  }
  .font_l {
    font-size: 6rem !important;
  }
}
/* 共通部品置き場 ---------------------------*/
.content {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.content_pt {
  padding-top: 40px !important;
}

.content_pb {
  padding-bottom: 40px !important;
}

.content_big_pb {
  padding-bottom: 80px !important;
}

/*ブロックテキスト*/
.block_text {
  background: #333;
  color: #fff;
  font-weight: bold;
  padding: 3px 10px;
  font-size: 1.8rem;
  display: inline-block;
  line-height: 1.3em;
}

.line_height_2 {
  line-height: 2;
}

.line_height_1_2 {
  line-height: 1.2em !important;
}

.font_weight_800 {
  font-weight: 800 !important;
}

.letter_spacing_0 {
  letter-spacing: 0 !important;
}

.border_box {
  border: 1px solid #333;
  padding: 0 5px;
}

.border_left {
  margin-left: 0;
  padding-left: 15px;
}
.border_left_sub_color {
  border-left: 15px solid #e8382f;
}
.border_left_accent_color {
  border-left: 15px solid #ea5550;
}

.img_hover:hover {
  opacity: 0.5;
}

@media only screen and (min-width: 768px) {
  /*ブロックテキスト*/
  .block_text {
    padding: 0 15px;
    font-size: 3.2rem;
    line-height: 1.4em;
  }
  .two_column_layout {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .two_column_layout .two_column_layout_inner {
    max-width: 49%;
    width: 100%;
  }
  .max_width_525 {
    max-width: 525px;
  }
}
@media only screen and (min-width: 992px) {
  .content {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .content_pt {
    padding-top: 60px !important;
  }
  .content_pb {
    padding-bottom: 60px !important;
  }
  .content_big_pb {
    padding-bottom: 160px !important;
  }
  .btn_blue_mt {
    margin-top: 100px;
  }
  /*ブロックテキスト*/
  .block_text {
    font-size: 4.6rem;
    line-height: 1.6em;
  }
}
/* ボタン置き場 -----------------------------*/
/*基本ボタン*/
.btn_layout {
  margin-top: 20px;
}
.btn_layout a {
  display: block;
  width: 100%;
}
.btn_layout a {
  color: #fff;
  border-radius: 40px;
  padding: 10px;
  font-size: 2.2rem;
  font-weight: bold;
}
.btn_layout_person a {
  background: #e8382f;
  position: relative;
}
.btn_layout_person a::before {
  content: "";
  display: block;
  position: absolute;
  right: 20px;
  bottom: 0;
  background: url(images/btn-human.png) no-repeat;
  background-size: contain;
  width: 50px;
  height: 70px;
}
.btn_layout_person a::after {
  content: "";
  display: block;
  position: absolute;
  right: -5px;
  bottom: -40px;
  background: url(images/icon-btn-cursor.svg) no-repeat;
  background-size: contain;
  width: 50px;
  height: 55px;
}
.btn_layout_blue a {
  background: #e8382f;
  position: relative;
}
.btn_layout_blue a::after {
  content: "";
  display: block;
  position: absolute;
  right: -5px;
  bottom: -40px;
  background: url(images/icon-btn-cursor.svg) no-repeat;
  background-size: contain;
  width: 50px;
  height: 55px;
}
.btn_layout_blue_none a {
  background: #e8382f;
  padding: 10px;
}

/*フッター*/
.page_footer {
  /*基本ボタン*/
}
.page_footer .btn_layout_blue_none a {
  background: #e8382f;
  padding: 10px;
  font-size: 1.6rem;
}

/*フォームボタン*/
.btn_layout {
  margin-top: 20px;
}
.btn_layout a {
  display: block;
  width: 100%;
}
.btn_layout button, .btn_layout input {
  color: #fff;
  font-size: 2.4rem;
  border-radius: 50px;
  text-align: center;
  padding: 5px 15px;
  background: #ea5550;
}
.btn_layout .return {
  font-size: 2.2rem;
  background: rgba(51, 51, 51, 0.6);
}

/*電話*/
.tel a {
  color: #333;
  display: flex;
  align-items: center;
  font-size: 2.6rem;
  font-weight: 800;
  line-height: 1.2em;
}
.tel a::before {
  content: "";
  display: block;
  width: 25px;
  height: 30px;
  background: url(images/icon-tel.svg) no-repeat;
  background-size: contain;
  margin-right: 5px;
}

.page_footer {
  /*電話*/
}
.page_footer .tel a::before {
  background: url(images/icon-footer-tel.svg) no-repeat;
  background-size: contain;
}

@media only screen and (min-width: 768px) {
  /*基本ボタン*/
  .btn_layout a {
    font-size: 3.8rem;
  }
  .btn_layout_person a {
    padding: 10px 100px;
  }
  .btn_layout_person a::before {
    right: 40px;
    width: 100px;
    height: 130px;
  }
  .btn_layout_blue_none a {
    padding: 10px 30px;
  }
}
@media only screen and (min-width: 992px) {
  /*基本ボタン*/
  .btn_layout {
    margin-top: 30px;
  }
  .btn_layout a {
    font-size: 4.6rem;
    border-radius: 60px;
    transition: transform 0.4s linear;
  }
  .btn_layout a:hover {
    transform: scale(1.2);
  }
  .btn_layout_person a {
    padding: 15px 100px;
  }
  .btn_layout_person a::before {
    right: 55px;
    width: 115px;
    height: 150px;
  }
  /*フッター*/
  .page_footer {
    /*基本ボタン*/
  }
  .page_footer .btn_layout_blue_none a:hover {
    transform: none;
    background: rgba(232, 56, 47, 0.8);
  }
  /*フォームボタン*/
  .btn_layout {
    margin-top: 20px;
  }
  .btn_layout a {
    display: block;
    width: 100%;
  }
  .btn_layout button, .btn_layout input {
    padding: 5px 40px;
  }
  .btn_layout button:hover, .btn_layout input:hover {
    background: rgba(234, 85, 80, 0.8);
    color: #fff;
  }
  .btn_layout .return {
    font-size: 1.6rem;
    padding: 10px 40px;
  }
  /*電話*/
  .tel a {
    font-size: 3rem;
  }
  .tel a::before {
    width: 30px;
    height: 35px;
  }
}
@media only screen and (min-width: 1200px) {
  /*基本ボタン*/
  .btn_layout {
    margin-top: 60px;
  }
  .btn_layout_person a::before {
    width: 145px;
    height: 200px;
  }
  .btn_layout_blue_none a {
    padding: 10px 125px;
  }
}
/* 色の汎用クラス置き場 ---------------------------*/
/*テキスト色*/
.text_black {
  color: #333 !important;
}

.text_sub_color {
  color: #e8382f !important;
}

/*背景色*/
.bg_main_color_base {
  background: #fff33f !important;
}

.bg_sub_color {
  background: #e8382f !important;
}

.bg_accent_color {
  background: #ea5550 !important;
}

/* 共通見出し置き場 ---------------------------*/
/*タイトルレイアウト*/
.title_layout {
  font-size: 2.6rem;
  font-weight: 800;
}

/*タイトルレイアウト　丸*/
.title_circle_layout {
  font-size: 2.6rem;
  font-weight: 800;
  text-align: center;
}
.title_circle_layout span {
  display: inline-block;
  background: #ea5550;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  line-height: 60px;
  color: #fff;
  text-align: center;
}

@media only screen and (min-width: 992px) {
  /*タイトルレイアウト*/
  .title_layout {
    font-size: 5.8rem;
  }
  /*タイトルレイアウト　丸*/
  .title_circle_layout {
    font-size: 5.8rem;
  }
  .title_circle_layout span {
    width: 110px;
    height: 110px;
    line-height: 110px;
  }
}
/* ヘッダー関連 ------------------------*/
.page_header {
  position: fixed;
  width: 100%;
  background: #fff;
  padding: 10px 0;
  z-index: 9999;
  border-bottom: 15px solid #e8382f;
}

/*ロゴ*/
h1.logo {
  margin-bottom: 0;
  line-height: 0;
}

.logo img {
  width: 85px;
}

@media only screen and (min-width: 992px) {
  /*ロゴ*/
  .logo img {
    width: 125px;
  }
}
/*  フッター関連 ----------------------------*/
.page_footer {
  margin-top: auto;
  position: relative;
  background: #333;
  /*タイトルレイアウト*/
  /*電話*/
}
.page_footer::before {
  content: "";
  position: absolute;
  border: 25px solid transparent;
  border-top: 30px solid #fff33f;
  width: 25px;
  height: 25px;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 10;
}
.page_footer .title_layout {
  font-size: 3rem !important;
}
.page_footer .tel a {
  color: #fff;
  font-size: 3.5rem;
}

/*住所*/
address {
  font-size: 1.4rem;
}

/*コピーライト*/
.copyright {
  font-size: 1.3rem;
  color: #fff;
  text-align: center;
  margin-top: 30px;
}

@media only screen and (min-width: 992px) {
  .page_footer {
    /*電話*/
  }
  .page_footer .tel a {
    font-size: 4.6rem;
  }
  /*住所、コピーライト*/
  address, .copyright {
    font-size: 1.6rem;
  }
  /*kyoeiロゴ*/
  .footer_logo {
    width: 300px;
  }
}
@media only screen and (min-width: 1200px) {
  .page_footer .btn_layout button {
    min-width: auto;
  }
  /*kyoeiロゴ*/
  .footer_logo {
    width: 400px;
  }
}
/* メイン設定 ---------------------------*/
/*バス広告でのPR*/
.bg_bus_pr {
  margin-top: -10%;
}

.bg_bus_pr_inner {
  margin-top: 10%;
}

/*バス広告4大効果*/
/*counter*/
.counter_box {
  counter-reset: number;
}
.counter_box .counter_box_inner {
  border: 3px solid #333;
  display: flex;
  flex-direction: column;
}
.counter_box .counter_box_inner:nth-of-type(n+3) {
  margin-top: 50px !important;
}
.counter_box .counter_box_number {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  padding-top: 30px;
}
.counter_box .counter_box_number::before {
  counter-increment: number;
  content: counter(number);
  background: #fff33f;
  border-radius: 50%;
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  font-weight: 800;
  margin-bottom: 15px;
  top: -25px;
  position: absolute;
}
.counter_box .counter_box_number img {
  max-width: 80%;
}

/*kyoeiadとは*/
.bg_kyoeiad {
  position: relative;
}
.bg_kyoeiad::before {
  content: "";
  width: 145px;
  height: 40px;
  background: url(images/bg-kyoeiad.svg) no-repeat;
  background-size: contain;
  background-position: top right;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
}

.circle_img {
  width: 110px;
}

.icon_glass {
  position: relative;
}
.icon_glass::after {
  content: "";
  width: 80px;
  height: 80px;
  background: url(images/img-glass.svg) no-repeat;
  background-size: contain;
  background-position: top right;
  display: block;
  position: absolute;
  top: -20px;
  right: 15px;
}

.icon_map {
  position: relative;
}
.icon_map::before {
  content: "";
  width: 100px;
  height: 100px;
  background: url(images/img-map.svg) no-repeat;
  background-size: contain;
  background-position: top right;
  display: block;
  position: absolute;
  top: 20px;
  left: 3px;
}

/*広告紹介*/
.bg_introduction {
  background: url(images/bg-orange-top.svg) no-repeat, url(images/bg-orange-bottom.svg) no-repeat;
  background-size: contain, contain;
  background-position: top center, bottom center;
  display: block;
}

.introduction_mt {
  margin-top: 80px;
}

/*mainimg header調整*/
.header_height_padding {
  padding-top: 65px;
}

/*お問い合わせ---------------------*/
/*フォーム*/
.form-control {
  font-size: 1.6rem;
  height: auto;
}

.formErrorContent {
  padding: 10px;
  color: #fff;
  background: red;
  font-size: 1.6rem;
}

@media only screen and (min-width: 768px) {
  /*counter*/
  .counter_box .counter_box_number {
    padding-top: 30px;
    min-height: 180px;
  }
  .counter_box .counter_box_number::before {
    width: 55px;
    height: 55px;
    font-size: 3.8rem;
  }
  .counter_box img {
    max-width: 100%;
  }
  /*kyoeiadとは*/
  .icon_map::before {
    width: 180px;
    height: 180px;
    left: -15px;
  }
}
@media only screen and (min-width: 992px) {
  /*counter*/
  .counter_box .counter_box_number {
    min-height: 205px;
    padding-top: 60px;
  }
  .counter_box .counter_box_number::before {
    width: 75px;
    height: 75px;
    font-size: 5.8rem;
    top: -40px;
  }
  /*kyoeiadとは*/
  .bg_kyoeiad::before {
    content: "";
    width: 300px;
    height: 80px;
  }
  .circle_img {
    width: 200px;
  }
  .icon_glass::after {
    width: 150px;
    height: 150px;
  }
  .icon_map::before {
    width: 250px;
    height: 250px;
    top: 80px;
    left: -15px;
  }
  .introduction_mt {
    margin-top: 120px;
  }
  /*mainimg header調整*/
  .header_height_padding {
    padding-top: 75px;
  }
}
@media only screen and (min-width: 1200px) {
  /*counter*/
  .counter_box .counter_box_inner:nth-of-type(n+3) {
    margin-top: 80px !important;
  }
  .counter_box .counter_box_number {
    min-height: 225px;
    padding-top: 80px;
  }
  .counter_box .counter_box_number::before {
    width: 95px;
    height: 95px;
    font-size: 7.8rem;
  }
  /*kyoeiadとは*/
  .icon_map::before {
    width: 350px;
    height: 350px;
    top: 50px;
  }
}