@charset "UTF-8";
body { width: 100%; max-width: 1920px; margin: 0 auto; position: relative; overflow-x: hidden; font-family: "ヒラギノ角ゴ Pro W3", "游ゴシック Medium", "-apple-system", BlinkMacSystemFont, "Yu Gothic Medium", YuGothic, "游ゴシック体", "Noto Sans Japanese", "メイリオ", "Hiragino Kaku Gothic ProN", "MS PGothic", Osaka, "sans-serif"; }

a { color: #333; -webkit-transition: 0.3s all linear; transition: 0.3s all linear; }

a:hover { text-decoration: none; -webkit-transition: 0.3s all linear; transition: 0.3s all linear; }

.button a { padding: 5px 20px 7px; background: #333; color: #fff; text-align: center; text-transform: uppercase; }
.button a:hover { background: #666  !important; }

.inner { max-width: 1200px; margin: 0 auto; }

.footer { padding: 30px 0px 0; background: #242424; color: #fff; }
.footer .inner { padding: 0 20px 30px; max-width: 1200px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.footer .inner .left { width: 30%; }
.footer .inner .left .logo { max-width: 250px; margin-bottom: 20px; }
.footer .inner .left .content { padding-top: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.footer .inner .left .content .icon { width: 40px; min-width: 40px; height: 40px; border-radius: 100%; background: #5d5d5d; padding: 10px; margin-right: 5px; }
.footer .inner .left .content .icon:hover { border: 1px solid #fff; }
.footer .inner .left .content .tel { line-height: 1.2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
.footer .inner .left .content .tel h6 { font-size: 20px; }
.footer .inner .nav { width: 30%; min-width: 320px; }
.footer .inner .nav ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.footer .inner .nav ul li { width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; padding-left: 15px; padding-bottom: 10px; }
.footer .inner .nav ul li a { color: #fff; }
.footer .inner .nav ul li a:hover { text-decoration: underline; }
.footer .inner .nav ul li::before { content: ""; position: absolute; left: 0; width: 10px; height: 2px; background: #fff; }
.footer .inner .facebook { width: 30%; max-height: 200px; overflow: hidden; background: #666; }
.footer .copyright { background: #3f3f3f; text-align: center; padding: 3px 0 5px; }

.index-nav .logo { position: absolute; left: 50px; }
.index-nav .logo span { background: #f99905; color: #fff; display: inline-block; text-align: center; width: 100%; }
.index-nav .logo p { font-weight: bold; color: #000; }
.index-nav .nav { padding: 10px 20px; background: #242424; }
.index-nav .nav .nav-nav { width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.index-nav .nav .nav-nav .items { position: relative; border-right: 1px solid #6d6d6d; }
.index-nav .nav .nav-nav .items:first-child { border-left: 1px solid #6d6d6d; }
.index-nav .nav .nav-nav .items > a { padding: 0 25px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 100%; width: 100%; text-decoration: none; font-size: 16px; color: #fff; }
.index-nav .nav .nav-nav .items > a:hover { color: #fa454e; }

.menu-handler { width: 60px; height: 60px; background: #333333; cursor: pointer; position: fixed; z-index: 9000; top: 0; right: 0; display: none; }
.menu-handler .burger { width: 32px; height: 4px; display: block; position: absolute; z-index: 5; top: 30px; left: 27px; margin: 0 0 0 -14px; -webkit-transform-origin: center; transform-origin: center; background: #fff; }
.menu-handler .burger-1 { -webkit-transform: translateY(-9px); transform: translateY(-9px); z-index: 9999; }
.menu-handler .burger-3 { -webkit-transform: translateY(9px); transform: translateY(9px); }

.menu-handler:hover .burger { background: #aaa; }

.menu-handler.active .burger { -webkit-transform: translateY(0); transform: translateY(0); }

.menu-handler .burger-1.rotated { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.menu-handler .burger-2.rotated { opacity: 0; }
.menu-handler .burger-3.rotated { -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.navigation-wrapper { width: 100%; min-width: 100vw; height: 100%; min-height: 100vh; background: #333; top: 0; left: 0; display: none; position: fixed; font-size: 1.5em; z-index: 999; }

.navigation { position: absolute; top: 80px; text-align: center; width: 100%; }
.navigation > li { font-size: 16px; margin-bottom: 10px; }
.navigation > li > a { color: #fff; -webkit-transition: all 0.3s; transition: all 0.3s; text-decoration: none; line-height: 1.2; }
.navigation > li > a:hover { color: #fa454e; }
.navigation > li .sub-nav { display: none; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; color: #000; padding: 5px 10px; }
.navigation > li .sub-nav li { padding: 0 10px; }
.navigation > li .sub-nav a { font-size: 14px; color: #000; }

.fixed { position: absolute; top: 0; right: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; z-index: 50; }
.fixed .contact a { display: block; background: #1f5eb6; text-align: center; padding: 5px 10px; font-size: 14px; max-height: 60px; }
.fixed .contact a i img { height: 2em; margin: 0 auto; }
.fixed .map a { display: block; background: #fa454e; text-align: center; padding: 5px 10px; font-size: 14px; max-height: 60px; }
.fixed .map a i img { height: 2em; margin: 0 auto; }
.fixed a { color: #fff; }
.fixed a:hover { background: #666; }

.hidden { display: none; }

@media screen and (max-width: 1220px) { .index-nav .nav .nav-nav .items > a { font-size: 14px; } }
@media screen and (max-width: 1200px) { .index-nav .nav .nav-nav .items > a { font-size: 14px; } }
@media screen and (max-width: 1150px) { .index-nav .nav { display: none; }
  .menu-handler { display: block; }
  .fixed { padding-right: 60px; } }
@media screen and (max-width: 1000px) {
  .footer .inner .left { width: 100%; margin-bottom: 20px; text-align: center; }
  .footer .inner .logo { margin: 0 auto; }
  .footer .inner .nav { width: 100%; max-width: 500px; margin: 0 auto; margin-bottom: 20px; }
  .footer .inner .facebook { width: 100%; max-width: 500px; margin: 0 auto; }
  .footer .inner .nav ul { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
  .footer .inner .nav ul li { display: inline-block; width: auto; padding: 0 20px; }
  .footer .inner .nav ul li::before { top: calc(50% - 1px); }
  .footer .inner .left .content { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } }

@media screen and (max-width: 750px) {

}
@media screen and (max-width: 450px) {
  .footer .copyright { font-size: 12px; }
}

@media screen and (max-width: 350px) { .footer .inner .nav { min-width: 0; } }

.bktop { display: none; position: fixed; bottom: 20px; right: 20px; width: 50px; height: 50px; border-radius: 100%; border: 5px solid #7c7c7c; background: #000; color: #fff; font-size: 12px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; cursor: pointer; line-height: 1; }
.bktop i { width: 20px; max-width: 20px; }

.grid{
  display: flex;
  flex-wrap: wrap;
}

.inner{
  max-width: 1230px;
  height: 100%;
  padding: 0 15px;
  margin: 0 auto;
  position: relative;
}

.lower-logo{
  position: absolute;
}
.lower-logo img{
  width: 220px;
  padding: 10px;
}

.lower-hero{
  position: relative;
  background-size: cover;
  background-position: center;
  height: 320px;
  margin-top: 0px;
}
.lower-ttl{
    color: #fff;
    position: absolute;
    z-index: 2;
    bottom: 40px;
    left: 15px;
    background: rgba(19, 19, 19, 0.86);
    padding: 20px 40px;
    min-width: 340px;
}

.lower-hero h1{
  font-family: "Roboto", YuGothic, "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: 44px;
  letter-spacing: 3px;
  text-transform: uppercase;
  position: relative;
}

.index-title {  }
.index-title h1 { font-size: 40px; text-transform: uppercase; line-height: 1; font-family: "Montserrat","ヒラギノ角ゴ Pro W3", "游ゴシック Medium", "-apple-system", BlinkMacSystemFont, "Yu Gothic Medium", YuGothic, "游ゴシック体", "Noto Sans Japanese", "メイリオ", "Hiragino Kaku Gothic ProN", "MS PGothic", Osaka, "sans-serif"; }
.index-title h2 { font-size: 16px; }

.afterline h1 p { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.afterline h1 p::after { content: ""; position: relative; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin-left: 15px; min-width: 20px; max-width: 100px; height: 1px; background: #333; }

.container-fluid{
  margin: 50px 0;
}

.contents{
  margin-top: 30px;
}

.lower-hero h1:before {
    content: '';
    position: absolute;
    left: -2px;
    bottom: 5px;
    display: inline-block;
    width: 220px;
    height: 3px;
    background-color: #fff;
}

.lower-ttl p{
  font-size: 20px;
  letter-spacing: 2px;
}

.bread-wrap{
  margin-top: 20px
}
.breadcrumb li {
  display: inline-block;
}
.breadcrumb li a{
  text-decoration: underline;
  color: #003598;
}
.breadcrumb li.active{
  color: #999;
}

.breadcrumb>li+li:before {
  padding: 0 5px;
  color: #ccc;
  content: "/\00a0";
}

.const{
  height: 600px;
  justify-content: center;
  align-items: center;
  flex-flow: column;
}

.const h1{
  font-size: 32px;
}
.const h2{
  font-size: 22px;
}
.red{
  color: #fa454e;
}
.mt-1{
  margin-top: 10px;
}