* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "MS PGothic", sans-serif; -webkit-text-size-adjust: 100%; }
html { overflow-y: scroll;}
html,
body { word-break: break-all;word-wrap: break-word;margin:0; padding:0; height:100%; line-height:1.5;  -webkit-tap-highlight-color: rgba(0,0,0,0.8); font-size:16px; color:#000; }
.small{font-size: 70%;font-weight: normal;}
    .container {
      max-width: 900px;
      margin: auto;
      padding:0px 2%;
    }

    /*共通*/
input { font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "MS PGothic", sans-serif; }
* a { color:#1558d6; text-decoration:none; }
* a:visited { color:#660099; text-decoration:none; }
.title-desc{font-size: 0.8rem;text-align: center;margin:8px auto 0 auto;}

@media screen and (max-width: 768px) {/*pc*/
      .title-desc {
        font-size: 0.6rem;
      }
}


.txt-center{text-align: center;}
.bold{font-weight: bold;}
.big{font-size: 120%;}

#footer_area{
  background-color: #000;width:100%;margin-top:30px;padding:10px;text-align: center;
}
#footer_copy{
padding-bottom:20px;color:#fff;
}
#footer_home{font-size: 20px;margin-bottom:10px;width:100% ;text-align:center;}

#footer_copy a:link{color:#fff;}
#footer_copy a:visited{color:#fff;}

#contents{
  width:100%;
}
@media screen and (min-width: 768px) {/*pc*/
      #contents {
        width:900px;margin:0 auto;
      }
}

a[target="_blank"] {
  &:after {
    font-family: "Font Awesome 6 Free";
    content: "\f08e";
    font-weight: 900;
    margin: 0 0.25rem;
  }
}

    header {
      background: #fff;
      padding: 1rem 0 0.5rem;
      border-bottom: 1px solid #ddd;
    }
    .width_rap{
      width: 900px;
      margin:0 auto;
    }
    @media screen and (max-width: 768px) {/*pc*/
    .width_rap {
      width: 100%;
    }
  }
    .logo {
     
      font-weight: bold;
      text-align: center;
      
          font-size: 1.4rem;
          width:150px;
        margin:4px auto 8px auto;
    }
.logo img{width:100%;}

    @media screen and (min-width: 768px) {/*pc*/
      .logo {
        font-size: 1.4rem;
         width:150px;
      }
      
  }

    .search-box {
      display: flex;
      gap: 0.5rem;
      margin: 4px auto 6px auto;
      justify-content: center;
      flex-wrap: wrap;
      font-size: :0.6rem;
      
    }
   .search-box {/*スマホ*/
    max-width: 90%;
    }

    @media screen and (min-width: 768px) {/*pc*/
    .search-box {
      max-width: 60%;
    }
    }

    .search-box input {
      flex: 1;
      min-width: 200px;
      padding: 0.5rem;
      border: 1px solid #ccc;
      border-radius: 4px;
      font-size: 0.9rem;
    }

    .search-box button {
      padding: 0.5rem 1rem;
      background: #007acc;
      color: white;
      border: none;
      border-radius: 4px;
      cursor: pointer;
      font-size: 0.9rem;
    }
nav {
  background: #000;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 0.25rem 0;
  font-weight: bold;
  width: 100%;
 
}

/* 中身を制限幅＆中央寄せ */
.nav-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 3px 0.5%;
}

/* ナビリンク */
.nav-links-scroll {
  display: flex;
  flex-direction: row;
  gap: 0;
  overflow-x: auto;
  justify-content: flex-start; /* 左寄せ */
}


  .nav-links-scroll a {
float: left;
  margin: 3px 0%;
  padding: 0 1.5%;
  font-weight: bold;
  text-align: center;
  
  color: #FFF;
  border-right: #4D4D4D solid 1px;
  }

  .nav-links-scroll a  {/*スマホ*/
    font-size:0.8rem;
    }

    @media screen and (min-width: 768px) {/*pc*/
    .nav-links-scroll a  {
      font-size: 1.4rem;
    }
    }



    section {
      margin-top: 14px;
    }

    h2 {
      font-size: 1.2rem;
      margin-bottom: 0.8rem;
      border-bottom: 2px solid #007acc;
      padding-bottom: 0.3rem;
    }

    .card {
      background: white;
      border-radius: 2px;
      border:solid 2px #333;
      box-shadow: 0 2px 6px rgba(0,0,0,0.05);
      padding: 8px 4%;
      margin-bottom: 1rem;
      transition: transform .2s, box-shadow .2s;
    }

        @media screen and (min-width: 768px) {/*pc*/
    .card  {
       padding: 8px 2.5%;
    }
    }


    .card:hover {
      transform: scale(1.01);
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }

    .card-title {
      font-size: 1rem;
      font-weight: bold;
      margin: 0 0 0.4rem;
    }

      .card-title  {/*スマホ*/
    font-size:1rem;
    }

    @media screen and (min-width: 768px) {/*pc*/
    .card-title  {
      font-size: 1.6rem;
    }
    }


    .card-meta {
      font-size: 0.85rem;
      color: #555;
      line-height: 1.4;
    }



.card-body {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  align-items: flex-start;
  margin-top: 4px;
}

.card-image img {
  width: 100px;
  height: auto;
  border-radius: 4px;
}

.card-info {
  flex: 1;
}

.info-line {
  font-size: 1.5rem;
  margin-bottom: 0.3rem;
  line-height: 1.4;
  font-weight: bold;
  color:red;
}

.ra-vn{
font-size: 1.0rem;
  margin: 0 10px 0 0;
  font-weight: normal;
  color:#333;
}



/* スマホ用フォントサイズ調整 */
@media screen and (max-width: 767px) {
  .card-image img {
    width: 80px;
  }

  .info-line {
    font-size: 1.2rem;
  }

  .ra-vn{
    font-size: 0.8rem;

  }
}





    .category-list {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5rem;
    }

    .category-tag {
      background: #e6f2ff;
      color: #007acc;
      padding: 0.4rem 0.8rem;
      border-radius: 20px;
      font-size: 0.85rem;
      cursor: pointer;
    }










/*ページネーション*/
.page-all{ float: left; margin:25px 0 ; width: 100%; text-align: center; font-size: 16px; border:solid 0px #333 ;}
.page-all a{ margin:0 7px; }
.page-all span{ color: #999; margin:0 8px; }

.related{
    margin:4px 0;
}
.term_list_item{
    margin:4px 0;
}