@charset "utf-8";

body {
  color: #333; /* txtcolor1 */
  background-color: #fff; /* bgcolor0 */
}

a {
  color: #333; /* txtcolor1 */
}

span.draft {
    background-color: #555; /* txtcolor2 */
    color: #fff; /* txtcolor0 */
}

div#homecontent h2 {
  background-color: #F2E3D5; /* bgcolor1 */
  border-left: 1em solid #F89C35; /*  bgcolor2 */
  border-right: none;
  border-top: .1em solid #F89C35; /*  bgcolor2 */
  border-bottom: none;
}


aside.toc>nav#TableOfContents>ul::before {
  background-color: #F2E3D5; /* bgcolor1 */
}

aside.toc>nav#TableOfContents>ul {
  border-color: #F2E3D5; /* bgcolor1 */
}

/* ********************* Header ************* */
div#headerarea,
div#menuarea {
  background-color: #fff; /* bgcolor0 */
}

/* ********************* Footer ************* */
footer {
  border-top: 2px solid #ccc; /* border0 */
}

footer div.poweredby {
  color: #777; /* txtcolor3 */
}

/* ********************* Menu [nav-drawer] ************* */

/* アイコンのスペース */
#nav-open {
  background-color: #fff; /* bgcolor0 */
  border: 1px solid gray;
}

#nav-open::before {
  color: #777; /* txtcolor3 */
}

/* ハンバーガーアイコンをCSSだけで表現 */
#nav-open span,
#nav-open span::before,
#nav-open span::after {
  background-color: #555; /* txtcolor2 */
}

#nav-close {
  background: #000; /* bgcolor3 */
}

/* 中身 */
#nav-content {
  background-color: #fff; /* bgcolor0 */ /* 背景色 */
  border-left: 1rem solid #F2E3D5; /* bgcolor1 */
}

#nav-content ul#menu__list {
  padding-left: 0;
}

#nav-content li.menu__item {
  border-radius: 0 .5rem .5rem 0;
}

#nav-content li.menu__item:hover > a {
  border-radius: 0 .5rem .5rem 0;
}

#nav-input:checked ~ #nav-content {
  box-shadow: 1em 0 2em rgba(0,0,0,.5); /* shadow0 */
}


/* ********************* Menu / Sub Menu ************* */
.menu {
}

.menu__btn {
  color: #fff; /* txtcolor0 */
  background: #F89C35; /*  bgcolor2 */
}

.menu__list {
  /* background-color: #E6B27E; */
 border-bottom: 2px solid #F89C35;
}
.submenu__list {
  background: #F89C35; /*  bgcolor2 */
}

li.menu__item {
  background: #F89C35; /*  bgcolor2 */
  border: 2px solid #F89C35;
  border-bottom: none;
  border-radius: .5rem .5rem 0 0;
}

li.menu__item:hover > a {
  color: #F89C35; /*  bgcolor2 */
  background: #fff; /* bgcolor0 */
  border: none;
  border-radius: .5rem .5rem 0 0;
  text-decoration: none;
}

li.menu__item--active {
  background: #fff; /* #F2E3D5; */ /* bgcolor1 */
  border-radius: .5rem .5rem 0 0;
}

li.menu__item--active .menu__text {
  color: #555; /* txtcolor2 */ /* #F89C35; */ /*  bgcolor2 */
}

li.menu__item--active:hover > a {
  background: #F2E3D5; /* bgcolor1 */
}

.menu__link {
  color: #fff; /* txtcolor0 */
}

.menu__link:hover {
  color: #F89C35; /*  bgcolor2 */
  background: #fff; /* bgcolor0 */
}

.menu__text {
  font-size: 120%;
}


/* *********************************** 通常 ***************************** */

@media screen and (min-width: 767px), print {
  .menu {
    /* border-bottom: 5px solid #e22d30; */
  }

  .menu__item:first-child {
    /* border: 0; */
  }

  .menu__item {
    border: none;
    border-left: 1px solid rgba(255, 255, 255, 0.5);
    border-right: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: .5rem .5rem 0 0;
  }
}

/* *********************************** スマホ対応 ***************************** */

@media screen and (max-width: 767px) {
  /* 特になし */
}

/* ************* External Link Button ************* */
/*
div.googlemap {
  border: 1px solid gray;
}

div.googlemap>a {
}

div.googlemap>span {
  border-left: .5em solid black;
  border-top: .5em solid transparent;
  border-bottom: .5em solid transparent;
}
*/

div.download-button > a,
div.link-button > a {
  color: #fff; /* txtcolor0 */
  background: #F89C35; /*  bgcolor2 */
  border: 2px solid #F89C35; /*  bgcolor2 */
}

div.link-button > a::before {
  border-color: transparent transparent transparent #fff; /* txtcolor0 */
}

div.download-button > a:hover,
div.link-button > a:hover {
  color: #333; /* txtcolor1 */
  background: #fff; /* bgcolor0 */
  text-decoration: none;
}

div.download-button > a:hover::before,
div.link-button > a:hover::before {
  border-color: transparent transparent transparent #333; /* txtcolor1 */
}

div.download-button > a:hover > span.icon-outer::before {
  border-top-color: #333; /* txtcolor1 */
}
div.download-button > a:hover > span.icon-outer::before {
  border-top-color: #333; /* txtcolor1 */ /* 矢印の下三角 */
}
div.download-button > a:hover > span.icon-outer::after {
  background: #333; /* txtcolor1 */ /* 矢印の上四角 */
}
div.download-button > a:hover > span.icon-outer > span.icon-inner::before {
  border: 2px solid #333; /* txtcolor1 */ /* 下のボックス枠 */
  border-top: none; /* 下のボックスの上辺を消す */
}

div.download-button > a > span.icon-outer::before {
  border: .8em solid transparent;
  border-top-color: #fff; /* txtcolor0 */ /* 矢印の下三角 */
}
div.download-button > a > span.icon-outer::after {
  background: #fff; /* txtcolor0 */ /* 矢印の上四角 */
}
div.download-button > a > span.icon-outer > span.icon-inner::before {
  border: 2px solid #fff; /* txtcolor0 */ /* 下のボックス枠 */
  border-top: none; /* 下のボックスの上辺を消す */
}

div.mamedo > a > span.thumb > img {
  border: 1px solid #ccc; /* border0 */
  box-shadow: 8px 8px 8px -4px #ccc; /* shadow1 */
}

figcaption {
  background: #eee; /* bgcolor3 */
  border: 1px solid #ccc; /* border0 */
}

/* *** ページ先頭へ戻るボタン *** */

div#pagetop {
  font-weight: bold;
  background-color: #F89C35; /* bgcolor2 */
  /* background-color: #F2E3D5; */ /* bgcolor1 */
  /* border: 2px solid #80B57A; */ /* bgcolor2 */
}

div#pagetop a::before,
div#pagetop a::after {
  color: #000; /* txtcolor4 */
  /* color: #fff; */ /* txtcolor0 */
}
