@charset "UTF-8";

/* ====== 共通 ====== */

a:hover {
  text-decoration: none;
  opacity: 0.8;
}

header .navbar-brand {
  width: 20%;
}

header .navbar-brand .logo {
  width: 35%;
}

header .tel {
  font-size: 2rem;
  color: #fff;
}

header .tel a {
  color: #fff;
}

/* ====== TOTOP ====== */
/* ページトップ */
#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 80%;
}

#page-top a {
  background: #666;
  text-decoration: none;
  color: #fff;
  width: 100px;
  padding: 25px 0;
  text-align: center;
  display: block;
  border-radius: 10px;
}

#page-top a:hover {
  text-decoration: none;
  background: #999;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:not(:disabled):not(.disabled).active {
  color: #6c757d !important;
}

/* ====== TOP IMAGE ====== */

header.top-page {
  height: 100vh;
  overflow: hidden;
  padding-right: 0;
  padding-left: 0;
}

header.sub-page {
  overflow: hidden;
  padding-right: 0;
  padding-left: 0;
}

.jumbotron {
  background-image: url(../img/main-image02.jpg);
  background-position: unset;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
}

.jumbotron .bg-rgba {
    border: #fefefe 3px solid;
}

.jumbotron h1 {
  word-wrap: break-word;
}

.jumbotron h2 {
  line-height: 1.8rem;
}

/* ====== TOPPAGE SECTION ====== */

#sec1 .card:nth-of-type(2) {
  border-left: none;
  border-right: none;
}

.ttl-bdr {
  font-size: 3rem;
  line-height: 1.5;
  position: relative;
  margin-bottom: 50px;
}

.ttl-bdr::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border-bottom: 2px solid #6c757d;
  width: 12%;
  margin: 0 auto 0px;
}

#sec3 {
  background-image: url("../img/bg-online.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

#sec4 table {
  width: 100%;
  background-color: #CCC;
  font: 12px;
  color: #666;
  table-layout: fixed;
  border-collapse: collapse;
}

#sec4 table th,
#sec4 table td {
  padding: 10px;
  text-align: center;
  border: 1px solid #ccc;
}

#sec4 table th {
  background-color: #002795;
  color: #fff;
}

#sec4 table td {
  width: 14.2%;
}

#sec4 table td:nth-child(7n) {
  background-color: #5197E0;
  color: #fff;
}

#sec4 table td:nth-child(7n+1) {
  background-color: #FF8A8C;
  color: #fff;
}

/* ====== SNS ====== */
.social img {
  width: 36px;
  height: 36px;
}

/* ====== SNS ====== */

iframe {
  width: 100%;
  height: 450px;
}

/* ====== FOOTER ====== */
.footer-logo {
  width: 20%;
}

/* =============================================
メディアクエリ
============================================= */

/* 大デバイス（デスクトップ, 1200px 未満）
==============================================*/
@media screen and (max-width: 1199.98px) {
  .herounit h1 {
    margin-top: 10rem;
  }
}

/* END */
/* 中デバイス（タブレット, 992px 未満）
==============================================*/
@media screen and (max-width: 991.98px) {
  .container {
    max-width: 740px;
  }
}

/* END */
/* 小デバイス（横向きモバイル, 768px 未満）
==============================================*/
@media screen and (max-width: 767.98px) {
  h1 {
    font-size: 2rem!important;
    font-weight: bold!important;
    line-height: 1.2!important;
  }

  #sec3 {
    background-image: none;
  }

  header .navbar-brand {
    width: 70%;
  }

  header .navbar-brand .logo {
    width: 40%;
  }

  header .navbar-nav {
    border-top: 1px solid #fff;
  }

  .footer-logo {
    width: 30%;
  }

}

/* END */
/* 極小デバイス（縦向きモバイル, 576px 未満）
==============================================*/
@media screen and (max-width: 575.98px) {
  .display-3 {
    line-height: 0.8em;
  }

  .display-4 {
    font-size: 2rem;
    line-height: 1.2;
  }
}

/* END */


/*追記*/
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);

body {
    font-family: 'Noto Sans JP', sans-serif;
    }

.weight100   {
    font-weight:100
    }
 
.weight300   {
    font-weight:300
    }
 
.weight400   {
    font-weight:400
    }
 
.weight500   {
    font-weight:500
    }
 
.weight600   {
    font-weight:600
    }
 
.weight700   {
    font-weight:700
    }
 
.weight900   {
    font-weight:900
    }

.container {
    max-width: 1200px;
}

.h1, h1 {
    font-size: 2.5rem;
    color: #fff!important;
}

.h2, h2 p{
    font-size: 1.5rem!important;
}

.h3, h3 p{
    font-size: 1.75rem!important;
}

p {
    font-size: 14px!important;
    letter-spacing: .1em;
    line-height: 2.2;
    font-weight: 400;
    color: #222222;
}

/*ヘッダー*/
.navbar-dark .navbar-nav .nav-link {
    color: #222222;
}

.bg-dark {
    background-color: #fff!important;
}

.navbar-expand-md .navbar-nav .nav-link {
    padding-right: .5rem;
    padding-left: .5rem;
    margin-right: 1.5rem;
}

.btn-outline-light {
    color: #f8f9fa;
    background-color: #cec291;
    background-image: none;
    border-color: none;
}

.btn-outline-light02 {
    color: #f8f9fa;
    background-color: #cec291;
    background-image: none;
    border-color: none;
}

.font-weight-bold span {
    font-weight: 400!important;
    color: #fff;
    font-family: "游ゴシック体", '游ゴシック', "Yu Gothic", YuGothic, 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'メイリオ', 'Meiryo';
}

.font-weight-bold {
    font-weight: 400!important;
    color: #6c757d!important;
    font-family: "游ゴシック体", '游ゴシック', "Yu Gothic", YuGothic, 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'メイリオ', 'Meiryo';
}

.h2 span {
    font-size: 14px;
    font-family: "游ゴシック体", '游ゴシック', "Yu Gothic", YuGothic, 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'メイリオ', 'Meiryo';
    vertical-align: 0;
    padding-left: 5px;
}

.h3 span {
    font-size: 14px;
    font-family: "游ゴシック体", '游ゴシック', "Yu Gothic", YuGothic, 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'メイリオ', 'Meiryo';
    vertical-align: 0;
    padding-left: 5px;
}

.lead {
    /* font-size: 1.25rem; */
    font-weight: 300;
}

.btn-group-lg>.btn, .btn-lg {
    padding: .5rem 1rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .3rem;
}

.jumbotron h2 {
    line-height: 1.8rem;
    color: #fff;
}

.btn-secondary {
    color: #212529;
    background-color: #f8f9fa;
    border-color: #f8f9fa;
    margin-top: 100px;
}

.pt-5, .py-5 {
    padding-top: 5rem!important;
}

h6 {
    margin-bottom: .5rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.2;
    color: #000!important;
}

.ml-auto, .mx-auto {
    margin-left: auto!important;
    margin-top: 10%;
}

@media screen and (max-width: 767.98px) {
.ml-auto, .mx-auto {
    margin-left: auto!important;
    margin-top: 70%;
}
}


/*SUB PAGE*/
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    /*margin-bottom: 3.5rem;*/
    font-family: inherit;
    font-weight: 500;
    line-height: 1.2;
    color: inherit!important;
}

.mb-4, .my-4 {
    margin-bottom: 2.5rem!important;
}

.mb-3, .my-3 {
    margin-bottom: 3.5rem!important;
}

.border {
    border: none!important;
}

table{
  width: 100%;
  border-collapse: collapse;
}

table tr{
  border-bottom: solid 2px white;
}

table tr:last-child{
  border-bottom: none;
}

table th{
  position: relative;
  text-align: left;
  width: 30%;
  background-color: #cec291!important;
  color: white;
  text-align: center;
  padding: 10px 0;
}

table th:after{
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top:calc(50% - 10px);
  right:-10px;
  border-left: 10px solid #cec291;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

table td{
  text-align: left;
  width: 70%;
  text-align: center;
  background-color: #eee;
  padding: 10px 0;
}

table.table-menu{
  width: 100%;
  border-collapse: collapse;
}

table.table-menu tr{
  border-bottom: solid 2px white;
}

table.table-menu tr:last-child{
  border-bottom: none;
}

table.table-menu th{
  position: relative;
  text-align: left;
  width: 30%;
  background-color: #cec291;
  color: white;
  text-align: center;
  padding: 20px 0;
}

table.table-menu th:after{
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top:calc(50% - 10px);
  right:-10px;
  border-left: 10px solid #cec291;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

table.table-menu td{
  text-align: left;
  width: 70%;
  text-align: center;
  background-color: #eee;
  padding: 10px 0;
}

.navbar-toggler{
  border-color: #000;
}

.btn {
    line-height: 1.2!important;
}

.text-white {
    margin-left: 10px;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='black' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E")!important;
}

.mr-auto, .mx-auto {
    margin-right: auto!important;
    margin-left: 30%!important;
}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: rgb(206 194 145)!important;
}

@media screen and (max-width: 767.98px) {
.h2, h2 p {
    font-size: 1rem!important;
    text-align: center;
}
    .table-menu{
        font-size: .75rem!important;
    }
    .h4, h4 {
    font-size: 1rem!important;
    text-align: center;
}
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-bottom: 2.5rem!important;
}

@media (min-width: 768px)
.navbar-expand-md .navbar-collapse {
    display: -webkit-box!important;
}