/*---------コンテンツページごとに変更 sp ---------*/
.first_view{
  height: 50vh;
  min-height: 250px;
  overflow: hidden;
  
  .content_title{
    height: 100%;
  }
}
/*---お知らせ sp---*/
.news{
  padding: var(--px80) 0;
  background-color: #fff;
  
  .inner{
    width: min(90%,1100px);
    margin: 0 auto;
       
    .info_box{
      
      a{
        display: block;
        width: 100%;
        position: relative;
        
        &:after{
          position: absolute;
          content: "";
          right: 10px;
          bottom: 18px;
          /*ボーダー矢印*/
          display: inline-block;
          width: 11px;
          height: 11px;
          border-top: 2px solid #333;
          border-right: 2px solid #333;
          transform: rotate(45deg);
          transition: .3s;
        }  
        &:hover{
          &:after{
            right: 2px;
          }
        }
      }
      
      li{
        /*ドットを調整*/
        background-image : linear-gradient(to right, #333 4px, transparent 1px);
        background-size: 1px 1px;/*6px 1px 破線*/
        background-repeat: repeat-x;
        background-position: left bottom;
        padding: 10px 0;         
      }
      
      .date{
        color: var(--font-color);
        font-size: 1.4rem;
        margin: 2px 0;
      }
      .text{
        padding: 0 16px 0 0px;
        color: var(--main-color);
        font-weight: var(--Bold);
        margin: 2px 0;
        /*テキスト・・・*/
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        
        span{
          color: #fff;
          background-color: var(--font-color);
          font-size: 12px;
          padding: 2px 6px;
          line-height: 1;
          margin-right: 6px;
          border-radius: 2px;
        }
      }
    }
  }
}
/*---ページネーション sp---*/
.pagination {
  text-align: center;
  margin-top: var(--px60);
}

.pagination a {
  display: inline-block;
  padding: 8px 16px;
  margin: 0 4px;
  text-decoration: none;
  color: var(--main-color);
  border: 1px solid #ddd;
  border-radius: 4px;
}

.pagination a:hover {
  background-color: #f4f4f4;
}

.pagination .current {
  background-color: var(--main-color);
  color: #fff;
  border: 1px solid var(--main-color);
  cursor: default;
}
.pagination .current:hover {
  background-color: var(--main-color);
  color: #fff;
  border: 1px solid var(--main-color);
  opacity: 1;
}
@media (min-width:768px){
/*---------コンテンツページごとに変更 tab ---------*/
.first_view{
  min-height: 500px;
}
/*---お知らせ tab---*/
.news{
  .inner{
    .info_box{
      a{
          &:after{/*ボーダー矢印*/
            bottom: 19px;
          }
        }
      li{
        display: flex;
        justify-content: flex-start;
      }  
        .date{
          width: 110px;
          padding-left: 15px;
        }
        .text{
          width: calc(100% - 120px);
          padding: 0 20px 0 15px;
        }
      
    }
    
  }
}

  
  
}
@media (min-width:1024px){
/*---お知らせ pc---*/
.news{
  .inner{
    
    .info_box{
      
      a{
          &:after{/*ボーダー矢印*/
            bottom: 26px;
            right: 30px; 
            width: 14px;
            height: 14px;
            border-top: 4px solid #333;
            border-right: 4px solid #333;
          }
          &:hover{
            &:after{
              right: 22px;
            }
          }
         }
      li{
        padding: 18px 0;
      }
        .text{
          padding: 0 35px 0 20px;
        }
    }
    
  }
}

  
  
}
@media (min-width:1280px){
.first_view{
  .first_view_layer{
    display: block;
  }

} 


  
}

@media (min-width:1580px){  

  
}