@charset "utf-8";

/* カスタムCSS 2026.06　追加　*/

/* 追加コンテンツ用 共通Wrap要素 */

.extra-content{

  display: block;
  float: none ;
  clear: both ;
  width: 1100px ;
  margin-left: 200px;
  padding: 5vw 0 3vw ;
  box-sizing: border-box;
  
}

.extra-content * {
  box-sizing: border-box;
  float: none ;
  color: #555555;
}


/* FAQコンテンツ用 */
.faq-section {
  counter-reset: faq;
}

 
.faq-item,
.faq-section h2,
.faq-item h3,
.faq-item p {
  display: block;
  width: 100%;
  line-height: 1.4em;
 
  
}
.faq-section h2{
  font-size: 39px;
  text-align: center;
  font-weight: bold;
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  margin-bottom: 1em;
}   

.faq-section h3.faq-sub-ttl{
  font-size: 20px;
  font-weight: bold;
  /*margin-bottom: 0.5em;*/
  padding: 2em 0.5em 1em 0em;
  color: #2c3448;
  
}
.faq-item{
 /* margin-left: 2em;*/
  padding-top: 1em;
  margin-bottom: 1em;
  border-bottom: 1px solid #DDD;
  /*background: #FBFBFB;*/
}

.faq-item h3{  font-size: 18px;  margin-bottom: 1em;}
.faq-item p{ font-size: 18px;  margin-bottom: 1em; }
  

.faq-item h3,
.faq-item p{
  display: grid;
  grid-template-columns: 3.2em 1fr;
  column-gap: 0.5em;
  font-size: 18px;
  margin-bottom: 1em;
}

.faq-item h3::before {
  counter-increment: faq;
  content: "Q" counter(faq) ".";
  font-weight: bold;
  color: #2e9fd0;
  text-align: right;
}

.faq-item p::before {
  content: "A.";
  font-weight: bold;
  color: #E7484B;
  text-align: right;
}



/* アコーディオン　*/
.faq-item h3{
  position:relative;
  padding-right:2em;
}

.faq-item h3::after{
  content:"+";
  position:absolute;
  right:10px;
  top:5px;
  font-size:1.4em;
  color:#2e9fd0;
  transition:transform .3s ease;
}

.faq-item h3:hover{
  cursor:pointer;
}

.faq-item.is-open h3::after{
  transform:rotate(45deg);
}

/* 回答部分 */
.faq-item p{
  overflow:hidden;
  max-height:0;
  opacity:0;
  margin-top:0;
  margin-bottom: 0;

  transition:
    max-height .7s ease,
    opacity .4s ease,
    margin-top .7s ease;
}

.faq-item.is-open p{
  opacity:1;
  margin-bottom: 1em;
}





/* 関連リンク */
.related-page-links {
  padding: 0 20px;
}

.related-page-links h3 {
  margin: 0 0 20px;
  font-size: 22px;
  line-height: 1.4;
  text-align: center;
}

.related-page-links ul {
  margin: 0;
  padding: 0;
  list-style: none;

  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.related-page-links li {
  margin: 0;
  padding: 0;
}

.related-page-links a {
  display: block;
  height: 100%;
  padding: 16px 18px;
  border: 1px solid #d9d9d9;
  background: #fff;
  color: #333;
  transition: all .2s ease;
}

.related-page-links a:hover {
  border-color: #0b4f8a;
  background: #f7fbff;
  text-decoration: underline;
}



/* 運営法人・対応範囲 エリア　*/
.about-section{
  /*border: 1px solid #CCC;*/
  background:#F8F8F8;
  padding: 2em;
  margin-bottom: 2em;
}
.about-section h3 {
  margin: 0 0 20px;
  font-size: 22px;
  line-height: 1.4;
  text-align: center;
}
.about-section p{
  line-height: 1.6em;margin-bottom: 1em;
}
.about-section p a{
  color: #555;
  margin-right: 1em;
  
}

/* パンくずエリア */
.breadcrumb-area{}
.breadcrumb{
  color: #555;
  font-size: 12px;
}
.breadcrumb a{
  color: #555;
  text-decoration:underline;
}