@charset "UTF-8";
*,*::before,*::after{box-sizing:border-box}ul[class],ol[class]{padding:0}body,h1,h2,h3,h4,p,ul[class],ol[class],figure,blockquote,dl,dd{margin:0}html{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}ul[class],ol[class]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}img{max-width:100%;display:block}article>*+*{margin-top:1em}input,button,textarea,select{font:inherit}img:not([alt]){filter:blur(10px)}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}
/* コンテンツの中身 */
/* 動画サイトTOPのCSS */

:root{
  --body-bg-color:rgb(20, 20, 20);

  /* --main-bg-color:#000000;   */
  --main-bg-color:#fff;
  /* --main-text-color:#fff; */
  --main-text-color:#000;
  --main-report-text-color:#aaa;
  --button-color:silver;
  --side-bg-color: rgb(20, 20, 20);
  --menu-bar-text-color:#fff;
  

  --hover-bg-color:rgb(67, 68, 68);
}

html{
  /* width: 100%; */
  height: 100%;
}

body{

  background-color: var(--main-bg-color);
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;

  font-family: "Helvetica Neue",
  Arial,
  "Hiragino Kaku Gothic ProN",
  "Hiragino Sans",
  Meiryo,
  sans-serif;

}

#wrapper{
  width: 100%;
  height: 100%;
}

/* ヘッダー関係 */
header{
  background-color: var(--side-bg-color);
  width: 100%;
  /* display: block; */
  height: 60px;
  position: fixed;
  z-index: 1;
}

p {
  white-space: pre-wrap;
}

#body{
  background-color: var(--main-bg-color);
  color: var(--main-text-color);
  text-align: center;
  /* 余計なスクロール削除 */
  overflow: hidden;

}

/* フッター関係 */
footer{
  width: 100%;
  height: 3%;
  /* position: absolute; */
  bottom: 0;
  text-align: center;
  background-color: var(--side-bg-color);
  color: #AAAAAA;
  font-size: 50%;
}

a{
  /* テキスト下部のラインを無しに */
  text-decoration: none;
  /* 文字は白 */
  color: var(--main-text-color);
}

.body-item{
  height: 100%;
}

ul,li{
  list-style: none;
  display: block;
  padding: 0;
  margin-left: 10px;
  text-align: left;
}

.help-card{
  display: inline-block;
  width: 90%;
  border: solid 1px #000;
  padding: 10px;
  margin-bottom: 20px;
}

.help-card *{
  text-align: left;
}

.help-card dt{
  border-bottom: solid 1px #000;
}