@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-blue01: #103883;
  --color-navy: #0b142f;
  --color-blue02: #004087;
  --color-green: #43b263;
  --color-yellow: #fff000;
  --color-gray: #eaebef;  
  --color-lightblue: #2d9cd8;
  --color-red:#c30d23;
}

body {
  /* font-family: '游ゴシック体', 'Yu Gothic', 'YuGothic', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif; */
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  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;
}

footer {
  margin-top: auto;
}

/*========================== 
フォント
==========================*/
.ten-mincho {
  font-family: "ten-mincho", serif;
  font-weight: 400;
  font-style: normal;
}

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

section {
  padding: 60px 0;
}
@media screen and (max-width: 768px) {
  .inner {
    max-width: 100%;
  }
  section{
  padding: 50px 0;   
  }
}
/*========================== 
見出し
==========================*/
h2{
  font-size: 25px;
  margin: 0 0 20px 0;
  font-weight: 600;
}

/*========================== 
リンク
==========================*/
a {
  text-decoration: none;
  transition: all .4s ease;
}

.external-link {
  position: relative;
}

.external-link::after {
  font: var(--fa-font-solid);
  font-size: 16px;
  content: "\f08e";
  margin-left: 7px;
  color: var(--color-theme);
  display: inline-block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

@media (hover: hover) {
  a:hover {
    color: var(--dummy);
  }
}

/*========================== 
汎用スタイル
==========================*/
@media screen and (min-width: 768px) {
  .sp {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .pc {
    display: none;
  }
}

.nobreak {
  display: inline-block;
}

.indent-1 {
  padding-left: 1em;
  text-indent: -1em;
}
.mb-0{
  margin-bottom: 0px;
}

.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;
}