@charset "UTF-8";
*, body {
  font-family: "Noto Sans JP", sans-serif;
}

.google-maps {
  position: relative;
  padding-bottom: 500px;
  height: 0;
  overflow: hidden;
}

.google-maps iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

.maincatch-img-catch {
  font-size: 5vw;
}

.maincatch-img-catch_sub {
  font-size: 3vw;
}

.overlay {
  position: relative;
  overflow: hidden;
  cursor: default;
}

.overlay .mask {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  z-index: 1000;
  width: 100%;
  height: 100%;
  background-attachment: fixed;
  background-color: rgba(0, 0, 0, 0.3);
}

.img-flame-1_2 {
  padding-bottom: 150%;
  height: 0;
  position: relative;
  overflow: hidden;
}

.img-flame-2_1 {
  padding-bottom: 50%;
  height: 0;
  position: relative;
  overflow: hidden;
}

.img-flame-2_1 img, .img-flame-1_2 img, .img-flame-2_1_slide img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;";
}

/*文字色*/
.color-009fe8 .color-main,
.color-009fe8 .lg-heading,
.color-009fe8 h2,
.color-009fe8 .icon,
.color-009fe8 table tbody td:first-of-type {
  color: #009fe8 !important;
}

.color-036eb8 .color-main,
.color-036eb8 .lg-heading,
.color-036eb8 h2,
.color-036eb8 .icon,
.color-036eb8 table tbody td:first-of-type {
  color: #036eb8 !important;
}

.color-b73f90 .color-main,
.color-b73f90 .lg-heading,
.color-b73f90 h2,
.color-b73f90 .icon,
.color-b73f90 table tbody td:first-of-type {
  color: #b73f90 !important;
}

.color-ff689b .color-main,
.color-ff689b .lg-heading,
.color-ff689b h2,
.color-ff689b .icon,
.color-ff689b table tbody td:first-of-type {
  color: #ff689b !important;
}

.color-e50012 .color-main,
.color-e50012 .lg-heading,
.color-e50012 h2,
.color-e50012 .icon,
.color-e50012 table tbody td:first-of-type {
  color: #e50012 !important;
}

.color-ff983e .color-main,
.color-ff983e .lg-heading,
.color-ff983e h2,
.color-ff983e .icon,
.color-ff983e table tbody td:first-of-type {
  color: #ff983e !important;
}

.color-ffc600 .color-main,
.color-ffc600 .lg-heading,
.color-ffc600 h2,
.color-ffc600 .icon,
.color-ffc600 table tbody td:first-of-type {
  color: #ffc600 !important;
}

.color-80ca3c .color-main,
.color-80ca3c .lg-heading,
.color-80ca3c h2,
.color-80ca3c .icon,
.color-80ca3c table tbody td:first-of-type {
  color: #80ca3c !important;
}

.color-4caf50 .color-main,
.color-4caf50 .lg-heading,
.color-4caf50 h2,
.color-4caf50 .icon,
.color-4caf50 table tbody td:first-of-type {
  color: #4caf50 !important;
}

.color-000000 .color-main,
.color-000000 .lg-heading,
.color-000000 h2,
.color-000000 .icon,
.color-000000 table tbody td:first-of-type {
  color: #000000 !important;
}

/*背景色*/
.color-009fe8 .bg-main,
.color-009fe8 .btn-edge,
.color-009fe8 .box-bottom-right,
.color-009fe8 table thead th,
.color-009fe8 .dash-toolbar1,
.color-009fe8 .more-menu1 {
  background-color: #009fe8 !important;
}

.color-036eb8 .bg-main,
.color-036eb8 .btn-edge,
.color-036eb8 .box-bottom-right,
.color-036eb8 table thead th,
.color-036eb8 .dash-toolbar1,
.color-036eb8 .more-menu1 {
  background-color: #036eb8 !important;
}

.color-b73f90 .bg-main,
.color-b73f90 .btn-edge,
.color-b73f90 .box-bottom-right,
.color-b73f90 table thead th,
.color-b73f90 .dash-toolbar1,
.color-b73f90 .more-menu1 {
  background-color: #b73f90 !important;
}

.color-ff689b .bg-main,
.color-ff689b .btn-edge,
.color-ff689b .box-bottom-right,
.color-ff689b table thead th,
.color-ff689b .dash-toolbar1,
.color-ff689b .more-menu1 {
  background-color: #ff689b !important;
}

.color-e50012 .bg-main,
.color-e50012 .btn-edge,
.color-e50012 .box-bottom-right,
.color-e50012 table thead th,
.color-e50012 .dash-toolbar1,
.color-e50012 .more-menu1 {
  background-color: #e50012 !important;
}

.color-ff983e .bg-main,
.color-ff983e .btn-edge,
.color-ff983e .box-bottom-right,
.color-ff983e table thead th,
.color-ff983e .dash-toolbar1,
.color-ff983e .more-menu1 {
  background-color: #ff983e !important;
}

.color-ffc600 .bg-main,
.color-ffc600 .btn-edge,
.color-ffc600 .box-bottom-right,
.color-ffc600 table thead th,
.color-ffc600 .dash-toolbar1,
.color-ffc600 .more-menu1 {
  background-color: #ffc600 !important;
}

.color-80ca3c .bg-main,
.color-80ca3c .btn-edge,
.color-80ca3c .box-bottom-right,
.color-80ca3c table thead th,
.color-80ca3c .dash-toolbar1,
.color-80ca3c .more-menu1 {
  background-color: #80ca3c !important;
}

.color-4caf50 .bg-main,
.color-4caf50 .btn-edge,
.color-4caf50 .box-bottom-right,
.color-4caf50 table thead th,
.color-4caf50 .dash-toolbar1,
.color-4caf50 .more-menu1 {
  background-color: #4caf50 !important;
}

.color-000000 .bg-main,
.color-000000 .btn-edge,
.color-000000 .box-bottom-right,
.color-000000 table thead th,
.color-000000 .dash-toolbar1,
.color-000000 .more-menu1 {
  background-color: #000000 !important;
}

.color-009fe8 .border-gradient {
  background: linear-gradient(to left, white, #009fe8);
}

.color-036eb8 .border-gradient {
  background: linear-gradient(to left, white, #036eb8);
}

.color-b73f90 .border-gradient {
  background: linear-gradient(to left, white, #b73f90);
}

.color-ff689b .border-gradient {
  background: linear-gradient(to left, white, #ff689b);
}

.color-e50012 .border-gradient {
  background: linear-gradient(to left, white, #e50012);
}

.color-ff983e .border-gradient {
  background: linear-gradient(to left, white, #ff983e);
}

.color-ffc600 .border-gradient {
  background: linear-gradient(to left, white, #ffc600);
}

.color-80ca3c .border-gradient {
  background: linear-gradient(to left, white, #80ca3c);
}

.color-4caf50 .border-gradient {
  background: linear-gradient(to left, white, #4caf50);
}

.color-000000 .border-gradient {
  background: linear-gradient(to left, white, #000000);
}

/*ボーダー色*/
.color-009fe8 .border-main,
.color-009fe8 h2,
.color-009fe8 .lg-heading,
.color-009fe8 .btn-edge,
.color-009fe8 .border-double-flame {
  border-color: #009fe8 !important;
}

.color-036eb8 .border-main,
.color-036eb8 h2,
.color-036eb8 .lg-heading,
.color-036eb8 .btn-edge,
.color-036eb8 .border-double-flame {
  border-color: #036eb8 !important;
}

.color-b73f90 .border-main,
.color-b73f90 h2,
.color-b73f90 .lg-heading,
.color-b73f90 .btn-edge,
.color-b73f90 .border-double-flame {
  border-color: #b73f90 !important;
}

.color-ff689b .border-main,
.color-ff689b h2,
.color-ff689b .lg-heading,
.color-ff689b .btn-edge,
.color-ff689b .border-double-flame {
  border-color: #ff689b !important;
}

.color-e50012 .border-main,
.color-e50012 h2,
.color-e50012 .lg-heading,
.color-e50012 .btn-edge,
.color-e50012 .border-double-flame {
  border-color: #e50012 !important;
}

.color-ff983e .border-main,
.color-ff983e h2,
.color-ff983e .lg-heading,
.color-ff983e .btn-edge,
.color-ff983e .border-double-flame {
  border-color: #ff983e !important;
}

.color-ffc600 .border-main,
.color-ffc600 h2,
.color-ffc600 .lg-heading,
.color-ffc600 .btn-edge,
.color-ffc600 .border-double-flame {
  border-color: #ffc600 !important;
}

.color-80ca3c .border-main,
.color-80ca3c h2,
.color-80ca3c .lg-heading,
.color-80ca3c .btn-edge,
.color-80ca3c .border-double-flame {
  border-color: #80ca3c !important;
}

.color-4caf50 .border-main,
.color-4caf50 h2,
.color-4caf50 .lg-heading,
.color-4caf50 .btn-edge,
.color-4caf50 .border-double-flame {
  border-color: #4caf50 !important;
}

.color-000000 .border-main,
.color-000000 h2,
.color-000000 .lg-heading,
.color-000000 .btn-edge,
.color-000000 .border-double-flame {
  border-color: #000000 !important;
}

/* .color-main{
    color: #42A5F5 !important;
} */
/*背景色*/
/* .bg-main{
    background-color: #42A5F5 !important;
} */
.bg-main-rgba {
  background-color: rgba(66, 165, 245, 0.2509803922) !important;
}

/*ボーダー色*/
/* .border-main{
    border-color: #42A5F5 !important;
} */
.lg-heading {
  /* color: #42A5F5; */
  font-size: 1.5625rem !important;
  text-align: left !important;
  /* border-bottom: solid 5px #42A5F5; */
  border-bottom: solid 5px;
  padding-bottom: 0 !important;
}

.lg-heading {
  margin-top: 50px;
}

.templates .form-control {
  font-size: 14px;
}

.templates h2 {
  /* border-bottom: double 5px #42A5F5; */
  border-bottom: double 5px;
}

.templates h2,
.templates h2 .form-control {
  font-weight: bold;
  font-size: 1.875rem;
  /* color: #42A5F5; */
}

.iphone5-width .object-fit-img img {
  height: unset !important;
}

/*
.btn-edge{
    background-color: #42A5F5;
} */
.border-double-flame {
  background: none;
  /* border: 6px groove #42A5F5; */
  border: 6px groove;
  margin: 10px; /* 外側の余白 */
  padding: 20px; /* 内側の余白 */
  position: relative;
  margin-bottom: 50px;
}

/*メインパネル関連*/
.border-gradient {
  height: 3px;
  /* background: linear-gradient(to left, white, #42A5F5); */
  border: none;
}

.box-bottom-right {
  /* background-color: #42A5F5; */
  color: #fff;
  position: relative;
  width: 95%;
}

.box-bottom-right::before {
  content: "";
  position: absolute;
  bottom: -30px;
  right: -30px;
  z-index: 3;
  background-color: rgba(51, 51, 51, 0.19);
  width: 60px;
  height: 60px;
}

/*フェードインアニメーション*/
.fadein-1, .fadein-2, .fadein-3, .fadein-4 {
  opacity: 0;
  transform: translateX(-100%);
}

.fadein-1 {
  animation: example 1s ease 0.3s 1 forwards;
}

.fadein-2 {
  animation: example 1s ease 0.6s 1 forwards;
}

.fadein-3 {
  animation: example 1s ease 0.9s 1 forwards;
}

.fadein-4 {
  animation: example 1s ease 1.2s 1 forwards;
}
@keyframes example {
  30% {
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*=======================================================
= template
========================================================*/
.template1 h3,
.template1 h3 .form-control,
.template2 h3,
.template2 h3 .form-control,
.template3 h3,
.template3 h3 .form-control,
.template4 h3,
.template4 h3 .form-control,
.template5 h3,
.template5 h3 .form-control,
.template9 h3,
.template9 h3 .form-control,
.template10 h3,
.template10 h3 .form-control {
  font-size: 1.125rem;
  font-weight: bold;
}

.template2 h4,
.template2 h4 .form-control,
.template3 h4,
.template3 h4 .form-control,
.template4 h4,
.template4 h4 .form-control,
.template5 h4,
.template5 h4 .form-control,
.template6 h3,
.template6 h3 .form-control,
.template6 h4,
.template6 h4 .form-control,
.template7 h3,
.template7 h3 .form-control,
.template7 h4,
.template7 h4 .form-control,
.template8 h3,
.template8 h3 .form-control {
  font-size: 1.125rem;
  font-weight: bold;
  /* color: #42A5F5; */
}

.template9 h4,
.template9 h4 .form-control,
.template10 h4,
.template10 h4 .form-control {
  font-size: 1.25rem;
  font-weight: bold;
  margin: 0;
  /* color: #42A5F5; */
}

.template11 h3,
.template11 h3 .form-control {
  font-size: 1rem;
  font-weight: bold;
  margin: 0;
  color: #fff;
}

.template12 h3,
.template12 h3 .form-control {
  text-align: center;
  font-size: 1.25rem;
  font-weight: bold;
  margin: 10px;
}

.template12 h4 {
  /* border-left: solid 8px #42A5F5; */
  border-left: solid 8px;
  padding-left: 5px;
}

.template12 h4,
.template12 h4 .form-control {
  font-size: 1rem;
  font-weight: bold;
  margin: 0;
  margin-bottom: 10px;
  /* color: #42A5F5; */
}

.template9 .box,
.template10 .box {
  /* border: solid 1px #42A5F5; */
  border: solid 1px;
  padding: 10px;
  height: 100%;
}

.template12 .box {
  border-top: solid 1px #dee2e6;
  height: 100%;
}

/* .template9 hr,
.template10 hr,
.template11 hr{
    border-color: #42A5F5;
} */
#slide-preview-center .object-fit-img .img-flame {
  padding-bottom: 50%;
  height: 0;
  position: relative;
  overflow: hidden;
}

#slide-preview-fade .object-fit-img .img-flame,
.template1 .object-fit-img .img-flame,
.template2 .object-fit-img .img-flame {
  max-width: 960px;
  padding-bottom: 50%;
  height: 0;
  position: relative;
  overflow: hidden;
}

.template8 .object-fit-img .img-flame {
  padding-bottom: 50%;
  height: 0;
  position: relative;
  overflow: hidden;
}

.object-fit-img img,
.template1 .object-fit-img img,
.template2 .object-fit-img img,
.template8 .object-fit-img img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;";
}

.template3 .object-fit-img .img-flame,
.template6 .object-fit-img .img-flame,
.template7 .object-fit-img .img-flame {
  max-width: 960px;
  padding-bottom: 100%;
  height: 0;
  position: relative;
  overflow: hidden;
}

.template3 .object-fit-img img,
.template6 .object-fit-img img,
.template7 .object-fit-img img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;";
}

.template4 .object-fit-img,
.template5 .object-fit-icon {
  max-width: 180px;
  margin: auto;
}

.template4 .object-fit-img .img-flame,
.template5 .object-fit-icon .img-flame {
  display: inline-block;
  height: 100%;
  padding: 50%;
  position: relative;
  overflow: hidden;
  border: solid 2px #888;
  border-radius: 50%;
}

.template4 .object-fit-img .img-flame {
  width: 100%;
}

.template5 .object-fit-icon .img-flame {
  width: 60%;
  padding: 30%;
  left: 20%;
}

.template4 .object-fit-img .img-flame img {
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;";
  position: absolute;
  top: 0;
  left: -100%;
  right: -100%;
  height: 100% !important;
  margin: auto;
}

.template5 .object-fit-icon .img-flame div {
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;";
  position: absolute;
  top: 60%;
  bottom: 50%;
  left: -100%;
  right: -100%;
  height: 100% !important;
  margin: auto;
}

.template5 .object-fit-icon .img-flame img {
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;";
  position: absolute;
  top: 0;
  left: -100%;
  right: -100%;
  height: 100% !important;
  margin: auto;
}

.template5 .icon {
  text-align: center;
  font-size: 3.1875rem;
  /* color: #42A5F5; */
  font-family: "Font Awesome 6 Free" !important;
  font-weight: bolder;
}

.template11 table thead th,
.template11 table thead th .form-control {
  color: #fff;
  /* background-color: #42A5F5; */
  font-weight: bold;
}

.template11 table tbody .item {
  width: 190px;
}

.template11 table tbody td:first-of-type,
.template11 table tbody td:first-of-type .form-control {
  background-color: #f8f9fa;
  /* color: #42A5F5; */
  font-weight: bold;
  vertical-align: middle;
}

/*=======================================================
= アイコンリスト
========================================================*/
.icon-list {
  font-size: 1.25rem;
  text-align: center;
}

.icon-list [class^=col] {
  padding: 0;
}

.icon-list i {
  padding: 20px;
  width: 100%;
  height: auto;
}

.icon-list i:hover {
  cursor: pointer;
  background-color: #ddd;
  width: 100%;
  height: auto;
}

/*グローバルメニュー*/
.dropdown-item:focus, .dropdown-item:hover {
  background-color: transparent;
}

/*=======================================================
= アイコンリスト 書き換え善福です。
========================================================*/
.icons-list {
  font-size: 1.25rem;
  text-align: center;
}

.icons-list [class^=col] {
  padding: 0;
}

.icons-list i {
  padding: 20px;
  width: 100%;
  height: auto;
}

.icons-list i:hover {
  cursor: pointer;
  background-color: #ddd;
  width: 100%;
  height: auto;
}

/*テーマカラー・ブラック*/
.globalMenu1 .globalMenu_li:not(:last-child),
.more-menu1 .globalMenu_li:not(:last-child),
.globalMenu2 .globalMenu_li:not(:last-child),
.more-menu2 .globalMenu_li:not(:last-child) {
  border-bottom: 1px solid #fff;
}

/* =====================================================================
//メディアクエリ　992px以上(lg)で適応
======================================================================*/
@media (min-width: 992px) {
  /*グローバルメニュー*/
  /*テーマカラー*/
  .dash-toolbar1,
  .more-menu1 {
    /* background-color: #42A5F5; */
    color: #fff;
  }
  /*ブラック*/
  .dash-toolbar2,
  .more-menu2 {
    background-color: #333;
    color: #fff;
  }
  /*通常*/
  .globalMenu .globalMenu_li:not(:last-child),
  .more-menu .globalMenu_li:not(:last-child) {
    border-bottom: 1px solid #ccc;
  }
  /*通常*/
  .globalMenu a,
  .globalMenu i,
  .more-menu a,
  .more-menu i {
    color: #666 !important;
  }
  .globalMenu a {
    display: block;
    padding: 0 10px;
  }
  /*テーマカラー・ブラック*/
  .globalMenu1 a,
  .globalMenu1 i,
  .more-menu1 a,
  .more-menu1 i,
  .globalMenu2 a,
  .globalMenu2 i,
  .more-menu2 a,
  .more-menu2 i {
    color: #fff !important;
  }
}
/* =====================================================================
//メディアクエリ　768px以上(md)で適応
======================================================================*/
/* =====================================================================
//メディアクエリ　576px以上(sm)で適応
======================================================================*/
/* =====================================================================
//メディアクエリ　992px以下で適応
======================================================================*/
@media (max-width: 992px) {
  /*グローバルメニュー*/
  .globalMenu a {
    color: #666 !important;
  }
  /*テーマカラー・ブラック*/
  .globalMenu1 a,
  .globalMenu2 a {
    color: #fff !important;
  }
  /*テーマカラー・ブラック*/
  .dash-toolbar1,
  .more-menu1 {
    /* background-color: #42A5F5; */
    color: #fff;
  }
  .dash-toolbar2,
  .more-menu2 {
    background-color: #333;
    color: #fff;
  }
  /*テーマカラー・ブラック*/
}
/* =====================================================================
//メディアクエリ　576px以下で適応
======================================================================*/
@media (max-width: 576px) {
  .lg-heading {
    font-size: 1.125rem !important;
  }
  .templates h2,
  .templates h2 .form-control {
    font-size: 1.125rem;
  }
  .template10 h4,
  .template10 h4 .form-control {
    font-size: 1.5rem;
  }
  .template11 table tbody td {
    display: block;
    width: 100% !important;
  }
}
