/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/

body{
  font-family: "メイリオ","Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  line-height: 1.65714286em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #3c4043;
}

@media (max-width: 1600px) { 
  body{
    font-family: "メイリオ","Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    line-height: 1.65714286em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #3c4043;
  }
}
@media (max-width: 1280px) { 
  body{
    font-family: "メイリオ","Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
    font-family: "Poppins", sans-serif;
    font-size: 0.95rem;
    line-height: 1.65714286em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #3c4043;
  }  
}
@media (max-width: 1220px) { 
  body{
    font-family: "メイリオ","Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
    font-family: "Poppins", sans-serif;
    font-size: 0.9rem;
    line-height: 1.65714286em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #3c4043;
  }  
}
@media (max-width: 1080px) { 
  body{
    font-family: "メイリオ","Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
    font-family: "Poppins", sans-serif;
    font-size: 0.85rem;
    line-height: 1.65714286em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #3c4043;
  }  
}







.app-name{
  font-weight: 500;
}


.dropdown-menu li a{
  color: rgb(29, 29, 29)!important;
}
.dropdown-menu li a:hover{
  color: #fff!important;
}
.dropdown-menu li:hover{
  background-color: rgb(62, 142, 227);
  color: #fff!important;
}

.table_tdimg{
  height: 1.5rem;
  width: 1.5rem;
}

/* ---------------------------------
 Sweet Alert custom 
--------------------------------- */
.swal2CustomCss{
  width: auto!important;
  max-height: 75%!important;
  left:  0!important;                    /* 位置指定 */
  right:  0!important;                   /* 位置指定 */
  margin:  auto!important;               /* 中央寄せ */
  max-width: 75vw!important;
  top: 10vh!important;
}

/* ---------------------------------
 募集フォーム
--------------------------------- */
.entry_form{
  background-color: #eaf4fc;/* 月白 げっぱく */
  padding: 1rem;
}

#PostHeaderSection{
  z-index: 100;
}

/* ----------------------------------------------------------------
    Inspiro Slider - Responsive Classes
-----------------------------------------------------------------*/
@media (max-width: 991.98px) { 
  .inspiro-slider .flickity-button:hover { 
    background-color: transparent; 
  }
  .inspiro-slider .flickity-button.next, .inspiro-slider .flickity-button.next:hover { 
    right: -5px !important; opacity: 1; 
  }
  .inspiro-slider .flickity-button.previous, .inspiro-slider .flickity-button.previous:hover {
     left: -5px !important; opacity: 1;
  }
  .inspiro-slider .container { 
    padding-left: 40px; padding-right: 40px; 
  }
  .inspiro-slider .slide .slide-captions { 
    text-align: center;
    margin-top: 50px;
  }
  .inspiro-slider .slide .slide-captions .strong::after { 
    margin-left: auto; margin-right: auto; 
  }
  .inspiro-slider .slide .slide-captions h1, .inspiro-slider .slide .slide-captions h2 { 
    font-size: 24px; 
    line-height: 24px; 
    margin-bottom: 14px; 
  }
  .inspiro-slider .slide .slide-captions > p { 
    font-size: 12px; 
    font-weight: 400; 
    line-height: 24px; 
    margin-bottom: 16px; 
  }
  .inspiro-slider .slide .slide-captions h3, .inspiro-slider .slide .slide-captions h4, .inspiro-slider .slide .slide-captions h5, .inspiro-slider .slide .slide-captions h6 { 
    color: #fff; 
  } 
}

#mainMenu nav > ul > li > a { 
  position: relative; 
  font-family: "Poppins", sans-serif; 
  padding: 10px 12px; 
  text-transform: uppercase; 
  font-size: 16px; 
  font-weight: 600; 
  letter-spacing: 0.6px; 
  color: #000000; 
  border-radius: 0; 
  border-width: 0; 
  border-style: solid; 
  border-color: transparent; 
  -webkit-transition: all .3s ease; 
  transition: all .3s ease; 
  line-height: normal; 
}

@media (max-width: 1600px) { 
  #mainMenu nav > ul > li > a { 
    font-size: 14px!important;
    margin-left: 4px!important;
  }
}
@media (max-width: 1280px) { 
  #mainMenu nav > ul > li > a { 
    font-size: 13px!important;
    margin-left: 4px!important;
  }
}
@media (max-width: 1220px) { 
  #mainMenu nav > ul > li > a { 
    font-size: 12px!important;
    margin-left: 2px!important;
    padding: 5px 6px!important;
  }
}
@media (max-width: 1080px) { 
  #mainMenu nav > ul > li > a { 
    font-size: 11px!important;
    margin-left: 0px!important;
    padding: 0px!important;
  }
}

#mainMenu nav > ul > li .dropdown-menu > li > a, #mainMenu nav > ul > li .dropdown-menu > li > span, #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
  font-size: 14px;
}
@media (max-width: 1600px) { 
  #mainMenu nav > ul > li .dropdown-menu > li > a, #mainMenu nav > ul > li .dropdown-menu > li > span, #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
    font-size: 12px;
  }
}
@media (max-width: 1280px) { 
  #mainMenu nav > ul > li .dropdown-menu > li > a, #mainMenu nav > ul > li .dropdown-menu > li > span, #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
    font-size: 12px;
  }
}
@media (max-width: 1220px) { 
  #mainMenu nav > ul > li .dropdown-menu > li > a, #mainMenu nav > ul > li .dropdown-menu > li > span, #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
    font-size: 12px;
  }
}
@media (max-width: 1080px) { 
  #mainMenu nav > ul > li .dropdown-menu > li > a, #mainMenu nav > ul > li .dropdown-menu > li > span, #mainMenu nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
    font-size: 11px;
  }
}


p{
  font-size: 1.20rem;
}
.parallax-title h2{
  font-weight: 700;
}
.denwaBangou{
  font-weight: 700;
  font-size: 1.3rem;
  color:rgb(62, 142, 227);
}

@media (max-width: 991.98px){ 
  /* メニューブロック全体の設定 */
  #mainMenu:not(.menu-overlay) nav > ul {
    display: block;
    width: 100%;
  }

  #mainMenu:not(.menu-overlay) nav > ul > li {
    width: 100%;
  }

  #mainMenu:not(.menu-overlay) nav > ul > li > a {
    display: block;
    padding: 12px 0 12px 25vw !important; /* 上位の !important を上書き */
    font-size: 1.5rem!important;
    border: 0;
    border-radius: 0;
    text-align: left;
  }
  /* 子メニューのインデント */
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li > a, 
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li > span, 
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li [class*="col-"] > ul > li > a {
    line-height: 16px;
    font-size: 1.5rem!important;
    padding: 12px 0 12px calc(25vw + 2em) !important;
    display: block;
    text-align: left;
  }

  /* 孫メニューのインデントをさらに深くする */
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu .dropdown-menu > li > a,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu .dropdown-menu > li > span {
    padding: 12px 0 12px calc(25vw + 4em) !important;
  }

  /* ドロップダウンを持つ全階層のメニュー項目を強制的にFlexにして矢印を横に並べる */
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown,
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown-submenu,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown-submenu {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  
  /* 既存の絶対配置の矢印（:before/:after）を非表示にする */
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown:before,
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown:after,
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown-submenu:before,
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown-submenu:after,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown:before,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown:after,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown-submenu:before,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown-submenu:after,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-arrow:after {
    display: none !important;
    content: none !important;
  }

  /* aタグ（テキスト）は要素の幅だけにし、矢印との間隔を少し開ける */
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown > a,
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown-submenu > a,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown > a,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown-submenu > a {
    flex: 0 0 max-content !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    width: max-content !important;
    max-width: max-content !important;
    order: 1 !important;
    padding-right: 5px !important;
    float: none !important;
    margin-right: 0 !important;
  }

  /* タップ領域（.dropdown-arrow）をaタグのすぐ右に配置する */
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-arrow,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li .dropdown-arrow,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu .dropdown-menu > li .dropdown-arrow {
    position: relative !important; /* 絶対配置を解除 */
    right: auto !important;
    top: auto !important;
    left: auto !important;
    flex: 0 0 44px !important;     /* ここが重要：伸びるのを防ぐ */
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;    /* ここが重要：伸びるのを防ぐ */
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    order: 2 !important;
    float: none !important;
    margin: 0 auto 0 0 !important; /* 右側の余白をautoにして左寄せを強制 */
    padding: 0 !important;
  }

  /* .dropdown-arrow の中に下向き矢印を描画する */
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-arrow:before,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li .dropdown-arrow:before,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu .dropdown-menu > li .dropdown-arrow:before {
    content: "\f107" !important; /* FontAwesomeの下矢印 */
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    transform: none !important; /* 回転不要 */
    color: #4a6fa5 !important;
    font-size: 24px !important;
    display: block !important;
  }

  /* サブメニューは幅100%にして下に落とす */
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown > ul.dropdown-menu,
  #mainMenu:not(.menu-overlay) nav > ul > li.dropdown-submenu > ul.dropdown-menu,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown > ul.dropdown-menu,
  #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li.dropdown-submenu > ul.dropdown-menu {
    width: 100% !important;
    order: 3 !important;
  }
}
