/*---------------------------------------------------------------------------------

 Theme Name:   Yokohama Real Estate Regeneration Partners 
 Theme URI:    
 Description:  横浜再生パートナーズ公式サイト子テーマ
 Author:       宮川泰之（ゼロイチ宮川）
 Author URI:   
 Template:     Divi
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

------------------------------ ADDITIONAL CSS HERE ------------------------------*/

/* NEWS表示用 */
.yr-news-wrap{
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  height:78px;
  background:linear-gradient(90deg,#06142d 0%,#0d2347 30%,#3d4653 50%,#0d2347 70%,#06142d 100%);
  border-top:1px solid rgba(201,167,92,.6);
  border-bottom:1px solid rgba(201,167,92,.35);
  overflow:hidden;
}

.yr-news-wrap::before,
.yr-news-wrap::after{
  content:"";
  position:absolute;
  left:0;
  width:100%;
  height:1px;
  background:rgba(201,167,92,.25);
}

.yr-news-wrap::before{top:5px;}
.yr-news-wrap::after{bottom:5px;}

.yr-news-label{
  width:140px;
  min-width:140px;
  text-align:center;
  color:#c9a75c;
  font-size:24px;
  letter-spacing:.12em;
  border-right:1px solid rgba(201,167,92,.4);
}

.yr-news-slider{
  position:relative;
  flex:1;
  height:100%;
  overflow:hidden;
}

.yr-news-track{
  position:relative;
  width:100%;
  height:100%;
}

.yr-news-item{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  gap:36px;
  padding:0 40px;
  opacity:0;
  transform:translateY(12px);
  transition:opacity .7s ease, transform .7s ease;
  text-decoration:none;
}

.yr-news-item.active{
  opacity:1;
  transform:translateY(0);
}

.yr-news-date{
  color:#fff;
  font-size:16px;
  white-space:nowrap;
}

.yr-news-title{
  color:#fff;
  font-size:16px;
}

.yr-news-arrow{
  width:90px;
  min-width:90px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#c9a75c;
  font-size:42px;
}

@media(max-width:768px){
  .yr-news-wrap{
    height:64px;
  }

  .yr-news-label{
    width:82px;
    min-width:82px;
    font-size:15px;
  }

  .yr-news-item{
    gap:10px;
    padding:0 12px;
  }

  .yr-news-date,
  .yr-news-title{
    font-size:11px;
  }

  .yr-news-title{
    line-height:1.4;
  }

  .yr-news-arrow{
    width:42px;
    min-width:42px;
    font-size:26px;
  }
}