@charset "utf-8";

/*========================== 
<a href="tel:">のリンクをPC表示時に無効　
==========================*/
@media screen and (min-width: 768px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}
/*========================== 
印刷設定
==========================*/
@media print {
  #header-nav-box {
    display: none;
  }
  /* 最初のページのみヘッダーを表示する場合は、以下のように追加 */
  @page:first {
    #header-nav-box {
      display: block;
    }
  }
}
/*========================== 
基本スタイル
==========================*/
:root {
  --color-blue: #0062b1;
  --color-orange: #ef8200;
}
body {
    font-family: '游ゴシック体', 'Yu Gothic', 'YuGothic', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    text-align: justify;
    font-feature-settings: "palt";
    -webkit-font-feature-settings: "palt";
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-optical-sizing: auto;
    word-break: break-all;
    display: flex;
    flex-direction: column;
    min-height: 100dvh;
    caret-color: transparent;
  }
  body.no-scroll {
    overflow: hidden;
}
footer{
  margin-top: auto;
}

/*========================== 
基本レイアウト
==========================*/
  .inner {
    max-width: 1000px;
    margin-right: auto;
    margin-left: auto;
    padding: 0 30px;
  }
  section{
    margin-bottom: 70px;
  }

/*========================== 
見出し
==========================*/
h2{
  font-size: 25px;
  font-weight: 600;
  margin-bottom: 30px;
}
h2:not(#news-content h2){
  text-align: center;
}

h3{
  font-weight: 600;
  margin-bottom: 30px;
  font-size: 20px;
}
h3:not(#news-content h3){
  text-align: center;
}
h4{
  font-weight: 600;
}
/* Android端末向けの指定 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    h2, h3, h4 {
        font-weight: 700!important;
    }
}
@media screen and (max-width: 768px) {
  h2{
    font-size: 20px!important;
  }
  h3{
    font-size: 18px!important;
  }
}
/*========================== 
リンク
==========================*/
a{
  text-decoration: none;
  transition: all .4s ease;
}
.external-link{
  position: relative;
}
.external-link::after {
  font: var(--fa-font-solid);
  font-size: 13px;
  content: "\f08e";
  margin-left: 7px;
  color: var(--color-blue);

}
.internal-link{
  position: relative;
}
.internal-link::after {
  font: var(--fa-font-solid);
  font-size: 16px;
  content: "\f054";
  margin-left: 7px;
  color: var(--color-blue);
  display: inline-block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
}
@media (hover: hover) {
  a:hover {
    color: var(--color-dummy);
  }
}
/*========================== 
汎用スタイル
==========================*/
  @media screen and (min-width: 769px) {
    .sp {
      display: none;
    }
  }
  @media screen and (max-width: 768px) {
    .pc {
      display: none;
    }
  }

  .mb-10{
    margin-bottom: 10px;
  }
  .mb-20{
    margin-bottom: 20px;
  }
  .mb-30{
    margin-bottom: 30px;
  }
  .mb-40{
    margin-bottom: 40px;
  }
  .mb-50{
    margin-bottom: 50px;
  }
  .mb-60{
    margin-bottom: 60px;
  } 
  .mb-70{
    margin-bottom: 70px;
  }
  .mb-80{
    margin-bottom:80px;
  }
  .mb-90{
    margin-bottom:90px;
  }
  .mb-100{
    margin-bottom:100px;
  }


  .tal-l{
    text-align: left;
  }
  .tal-c{
    text-align: center;
  }
  .tal-r{
    text-align: right;
  } 

  .indent-1 {
    padding-left: 1em;
    text-indent: -1em;
  }
  .indent-2 {
    padding-left: 2em;
    text-indent: -2em;
  }
.indent-3 {
    padding-left: 3em;
    text-indent: -3em;
  }