@charset "UTF-8";
:root {
  --text-color: #2c2c2c;
  --main-color: #009e94;
  --sub-color: #04e5d8;
  --bk-color: #f1fbfb;
  --accent-color01: #f62424;
}
html {
  scroll-behavior: smooth;
  font-size: 62.5%;
}
body {
  font-family: "Roboto Condensed", "Noto Sans JP", sans-serif;
  color: var(--text-color);
  background-color: var(--bk-color);
  border-top: 3px solid var(--sub-color);
  font-size: 15px;
}
@media screen and (min-width: 800px) {
  #header-wrap h1 img{
width: 80px;
    height: auto;
    margin: 0 auto 50px;
    display: block;
  }
/* 全体レイアウト */
.video-archive-wrapper{
max-width:800px;
margin:0 auto;
}

.video-layout{
display:flex;
gap:40px;
align-items:flex-start;
}

/* メイン */
.video-main{
flex:3;
}
.video-main h1{
font-size: 26px;
    margin-bottom: 30px;
}

/* 動画リスト */
.video-list{
list-style:none;
padding:0;
margin:0;
}

.video-list li{
transition: background-color 0.3s ease;
border-bottom:1px solid #eee;
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
}

/* タイトル */

.video-list a{
text-decoration:none;
  display: block;
  padding: 10px;
  width: 100%;
  height: 100%;
padding:14px 0;

}

.video-list li:hover{
background-color:white;
}

/* 日付 */
.video-date{
font-size:13px;
color:#888;
}

/* ページャー */
.video-pager{
margin-top:40px;
}
.video-pager .page-numbers{
display:inline-block;
padding:8px 12px;
margin:3px;
border:1px solid #ddd;
text-decoration:none;
color:#333;
font-size:14px;
}

.video-pager .page-numbers.current{
background:#0073aa;
color:#fff;
border-color:#0073aa;
}

.video-pager .page-numbers:hover{
background:#f5f5f5;
}

/* サイドバー */
.video-sidebar{
flex:1;
}

.video-sidebar h3{
font-size:18px;
margin-bottom:15px;
}

.video-sidebar ul{
list-style:none;
padding:0;
margin:0;
}

.video-sidebar li{
margin-bottom:8px;
}

.video-sidebar a{
text-decoration:none;
color:#333;
font-size:14px;
}

.video-sidebar a:hover{
color:#0073aa;
}
}


@media screen and (max-width: 767px) {

}