/*新着&Topics*/
.box_out4:has(.new-arrival) {
  margin:0;
}

.new-arrival {
  width:100%;
}




/*リスト型ページ設定_サステナビリティ・技術情報*/
.news-list4{
  list-style: none outside;
  margin: 0;
  padding: 0 0 0 3rem;
}

.news-list4 .item a{
  display: flex;
  text-decoration: none;
  flex-wrap: nowrap;
  text-align: left;
  color: #333;
  padding: 20px 20px;
  font-size: 1rem;
  align-items: center;
}

.news-list4 .item .title1{
  margin: 0;
  width: 100%;
  padding-left:1rem;
  text-indent:-1rem;
}

.news-list4 .item .titlemov{
  margin: 0;
  width: 100%;
   flex-wrap: nowrap;
  text-align: left;
  color: #333;
  text-decoration : underline;
  padding-left:1rem;
}

.news-list4 .item .titlemov:after{
  position: relative;
  top: 3px;
  margin: 0 5px 0 5px;
  content: url(../img/movie_p1.png);
}

.news-list4 .item .titlepdf{
  margin: 0;
  width: 100%;
   flex-wrap: nowrap;
  text-align: left;
  color: #333;
  padding-left:1rem;
  text-indent:-1rem;
}

.news-list4 .item .titlepdf:after{
  position: relative;
  top: 2px;
  margin: 0 5px 0 5px;
  content: url(../img/pdf_p1.png);
}

.news-list4 .item .titlelink{
  margin: 0;
  width: 100%;
  flex-wrap: nowrap;
  text-align: left;
  color: #333;
  text-decoration : underline;
  padding-left:1rem;
  text-indent:-1rem;
}

.nedolist {
  padding-left: 0!important;
  text-indent: 0!important;
}

.news-list4 .item :hover {
  background: #f5f5f5;
}










/*新着リスト*/

.box_out4:has(.new-arrival) {
  flex-basis:100%;
  display:block;
}


.news-list{
  list-style: none outside;
  margin: 0; 
}

/*文字タイトル(新着＆Topicsなど)*/
.Titleline2{
  text-align: center;
  margin-left: auto; /* 中央寄せにするため */
  margin-right: auto; /* 中央寄せにするため */
  border-bottom: solid 2px;;
  border-color: #b0c4de;
  font-weight: bold;
  /*font-size: 1.8vw;*/
  font-size: clamp(1.6rem, 2vw, 2.4rem);
  width:60%;
}

.news-list {
  /*display:flex;*/
  /*flex-flow: row wrap;*/
  /*border-bottom: 1px dashed #b0c4de;*/
  /*padding:1rem 0;*/
  list-style: none outside;
}

.news-list a {
  display:flex;
  text-decoration: none;
  color:#333;
  padding:1.5rem 0;
  flex-wrap: wrap;
  flex-wrap: nowrap;
  border-bottom: 1px dashed #b0c4de;
  
  position: relative;
}

.news-list li {
  /*display:block;*/
  
  /*margin:0.7rem;*/
  /*flex-basis: 8rem;*/
  
  /*text-overflow: ellipsis;*/
  /*overflow: hidden;
  white-space: nowrap;*/
}

.news-list .item p {
  margin:0 0.5rem;
}

/*日付*/
.news-list .date {
  font-size: 0.9rem;
  display: inline-block;
  vertical-align: middle;
}

/*カテゴリー（ロゴ）*/
.news-list .category {
  /*display: inline-block;*/
  font-size: 0.9rem;
  /*padding: 0.1rem 1.5rem;*/
  width:7rem;
  
  display: inline-block;
  vertical-align: middle;
}
.news-list .category span {
  display: inline-block;
  color: #FFF;
  font-size: 0.9rem;
  text-align: center;
  /*padding: 0.1rem 1.5rem;*/
  background-color: #4682b4;
  width:7rem;
}

.news-list .title {
  color: #333;
  font-size: 1rem; 
  text-decoration: none;
  /*margin-top:0;*/
  /*overflow-wrap: normal;*/
  width:100%;
  
  display: inline-block;
  vertical-align: middle;
}

.news-list .item:hover {
  background: #f5f5f5;
  /*padding:100% 0 ;*/
}

.new-mark .title::before {
  content:"new!";
  color:red;
  font-weight: bold;
  padding-right:0.3rem;
}





.sustainability .news-list4 {
  padding-left:0;
}

.sustainability .news-list4 .titlelink{
  text-indent:0;
  display: flex;
  align-items: center;
}

.news-info {
  align-items: center; /* 上下中央 */
  display: flex; /* 日付とカテゴリーの横並び */
  flex-shrink: 0; /* これが無いと日付・カテゴリーラベルが潰れる */
}

/*英語版*/

.news-list .english a {
  align-items: center; /* 上下中央寄せ */
  display: flex; /* Flexboxを適用 */
}


.news-list .english .date {
  top:50%;
}

.news-list .english span {
  font-size: 0.8rem;
  line-height: 1;
  padding:0.2rem 0;
}

.news-list4 .english .titlelink {
  text-decoration:none;
}

.news-list4 .english {
  pointer-events: none;
}

/*PC対応*/
@media screen and (min-width: 769px) {
/* 769px以上の幅の場合に適応される */
  /*新着&Topics*/
  .box_out:has(.new-arrival) {
    /*width: 80%;*/
  }
  
  .news-list .date {
    margin-top:0.1rem!important;
  }
  .news-list .category {
    margin-top:0.1rem!important;
  }
  .news-list .category span {
    margin-top:0.1rem;
  }
  
  
  
  
  
}


@media only screen and (min-width: 481px) and (max-width: 768px) {
/* 481～768pxまでの幅の場合に適応される */

  .news-list a {
    flex-wrap: wrap;
  }
  
}

/*スマホ対応*/
@media screen and (max-width: 480px) {
/* 480pxまでの幅の場合に適応される */

  /*新着リスト*/
  .box_out2 {
    width: 100%;
  }

  .new-arrival {
    width: 90%;
    margin: auto;
  }

  /*文字タイトル(新着＆Topicsなど)*/
  .Titleline2{
    line-height: 3vh;
    font-size: 1.2rem;
  }

  .news-list a {
    flex-wrap: wrap;
  }

  .news-list4 .item .titlemov{
    padding-bottom:0.2rem;
  }

}