@charset "utf-8";

body {
	font-family:  "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
	margin: 0;
	padding: 0;
	background-color: var(--color-bg);
	line-height: 1.6;
}
:root {
						/***共通***/
				/*フォント関係*/
				--fa-font-icon: 900 1em/1 "Font Awesome 7 Free"; /*フォントアイコン用*/
				--font-c-title:"YuMincho",Noto Serif JP,serif;/*h2等の題字フォント指定*/
				/*カラー関係*/
				--color-bg:#EBEBEB; /*背景色*/
				--color-font-base:#000B00; /*文字色*/
				--cardlink-bg-hover:#F7F7F7; /*カード型リンクの装飾*//*マウスが載った時の背景色*/
				/*リンク*/
				--animation: 0.5s;/*アニメーション*/

/***Dusk用***/
--color-a-link:#365F73; /*未訪問リンク*/
--color-a-visited:#8399A6; /*既訪問リンク*/
--color-a-hover:#A1C7BD; /*マウスが載った時*/

--color-bg-bar1:#313A5C; /*日付境界バー*/
--color-font-bar1:#fff; /*日付境界バー文字色*/
--color-bg-bar2:#C8D9C1; /*バー背景色2*/ 

						/***FREEDOM用***/
						--color-a-link-f:#AFA1C4; /*未訪問リンク*/
						--color-a-visited-f:#D4B4CD; /*既訪問リンク*/
						--color-a-hover-f:#F7D4D2; /*マウスが載った時*/

						--color-bg-bar1-f:#A4A8BF; /*日付境界バー*/
						--color-font-bar1-f:#fff; /*日付境界バー文字色*/
						--color-bg-bar2-f:#D2D6C3; /*バー背景色2*/ 
}

/*ハンバーガーメニュー用*/
.c-header {
  align-items: center;
  background-color: var(--color-bg); /* カスタマイズしてください */
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  padding: 0.3rem; /* カスタマイズしてください */
  width: 100%;
}

.c-header__logo {
  color: #000; /* カスタマイズしてください */
  min-width: 80px; /* カスタマイズしてください */
  text-decoration: none;
  font-family: var(--font-c-title);
 display: inline-block;
margin: 0;
padding: 0;
}

.c-header__logo2 {
  color: #000; /* カスタマイズしてください */
  min-width: 80px; /* カスタマイズしてください */
  text-decoration: none;
  font-family: var(--font-c-title);
 display: inline-block;
margin: 0;
padding: 0;
}
.c-header__logo2:before {
content:"/";
}

.c-header__list {
  box-sizing: border-box;
  display: flex;
  margin: 0;
  padding: 0;
}

.c-header__list-item {
  font-family: var(--font-c-title);
  list-style: none;
  text-decoration: none;
  font-weight: bold;
}

.c-header__list-link {
  display: block;
  margin-right: 20px; /* カスタマイズしてください */
  text-decoration: none;
  padding: 10px 0px; /* カスタマイズしてください */
}

.c-header__list-link:hover {
  filter: opacity(0.6); /* カスタマイズしてください */
}

.c-hamburger-menu {
  position: fixed;
  opacity: 0.9;
  top: 0;
  z-index: 10000;
}

@media screen and (max-width: 600px) {
	.headtitle {
	padding: 2.5em 0;
	}
  .c-hamburger-menu__list {
    background-color: var(--color-bg); /* カスタマイズしてください */
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    right: 0;
    padding: 1rem; /* カスタマイズしてください */
    position: absolute;
    transform: translateX(100%);
    transition: 0.3s; /* カスタマイズしてください */
    top: 100%;
    width: 50%;
    border-radius: 0 0 0 1em;
  }

  #hamburger:checked ~ .c-hamburger-menu__list {
    transform: translateX(0%);
    transition: 0.3s;
  }
}

.c-hamburger-menu__input {
  display: none;
}

.c-hamburger-menu__bg {
  background-color: #999; /* カスタマイズしてください */
  cursor: pointer;
  display: none;
  height: 100vh;
  left: 0;
  opacity: 0.9; /* カスタマイズしてください */
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

#hamburger:checked ~ .c-hamburger-menu__bg {
  display: block;
}

.c-hamburger-menu__button {
  display: none;
}

@media screen and (max-width: 600px) {
  .c-hamburger-menu__button {
    align-items: center;
    appearance: none;
    border: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 5px; /* カスタマイズしてください */
    height: 32px; /* カスタマイズしてください */
    justify-content: center;
    width: 32px; /* カスタマイズしてください */
  }
}

.c-hamburger-menu__button-mark {
  background-color: #000; /* カスタマイズしてください */
  display: block;
  height: 1px; /* カスタマイズしてください */
  transition: 0.3s; /* カスタマイズしてください */
  width: 20px; /* カスタマイズしてください */
}

@media screen and (max-width: 600px) {
  #hamburger:checked
    ~ .c-hamburger-menu__button
    .c-hamburger-menu__button-mark:nth-of-type(1) {
    transform: translate(2px, 1px) rotate(45deg); /* カスタマイズしてください */
    transform-origin: 0%; /* カスタマイズしてください */
  }
  #hamburger:checked
    ~ .c-hamburger-menu__button
    .c-hamburger-menu__button-mark:nth-of-type(2) {
    opacity: 0;
  }
  #hamburger:checked
    ~ .c-hamburger-menu__button
    .c-hamburger-menu__button-mark:nth-of-type(3) {
    transform: translate(2px, 3px) rotate(-45deg); /* カスタマイズしてください */
    transform-origin: 0%; /* カスタマイズしてください */
  }
}