@charset "UTF-8";
blockquote,
body,
dd,
dl,
dt,
fieldset,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
html,
iframe,
legend,
li,
ol,
p,
pre,
textarea,
ul,
ol {
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

ul, ol {
  list-style: none;
}

button,
input,
select,
textarea {
  margin: 0;
}

html {
  box-sizing: border-box;
}

*,
*:after,
*:before {
  box-sizing: inherit;
  overflow-wrap: break-word;
}

audio,
embed,
iframe,
img,
object,
video {
  height: auto;
  max-width: 100%;
}

img {
  vertical-align: top;
}

iframe {
  border: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
  text-align: left;
}

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

:root {
  --color-bk01: #313131;
  --color-bk02: #222;
  --color-bk03: #555;
  --color-wt01: #fff;
  --color-mu01: #f3e3db;
  --color-mu02: #dfccc2;
  --color-mu03: #93556c;
  --color-mu04: #fef8ee;
  --color-mu05: #f3efe5;
  --color-mu06: #e7d4e3;
  --color-mu07: #a675a5;
  --color-mu08: #845080;
  --color-mu09: #68394c;
  --color-mu11: #f5edf3;
  --color-mu12: #fbf8fa;
  --color-mu21: linear-gradient(to right, #e7d4e3 0%, #a675a5 100%);
  --color-gj01: #b8bbaf;
  --color-gj02: #e5e6e6;
  --color-gj03: #b1c3cb;
  --color-gj04: #c9c9ca;
  --color-gj05: #9f9fa0;
  --color-gj06: #595757;
  --color-gj07: #35526d;
  --color-gj08: #346c9c;
  --color-gj09: #417abe;
  --color-ww01: #e94d15;
  --color-ww02: #f18d1d;
  --color-ww03: #f8b633;
  --color-ww04: #d59a3e;
  --color-ww05: #fcd46d;
  --color-ww06: #fffbd4;
  --color-ww07: #fffdef;
  --color-ww08: #db532c;
  --color-ww09: #a74535;
}

:root {
  --font-size30: 22px;
  --font-size24: 20px;
  --font-size20: 16px;
  --font-size16: 15px;
  --font-size14: 13px;
  --font-size13: 12px;
}
@media print, screen and (min-width: 768px) {
  :root {
    --font-size30: 30px;
  }
}
@media print, screen and (min-width: 768px) {
  :root {
    --font-size24: 24px;
  }
}
@media print, screen and (min-width: 768px) {
  :root {
    --font-size20: 20px;
  }
}
@media print, screen and (min-width: 768px) {
  :root {
    --font-size16: 16px;
  }
}
@media print, screen and (min-width: 768px) {
  :root {
    --font-size14: 14px;
  }
}
@media print, screen and (min-width: 768px) {
  :root {
    --font-size13: 13px;
  }
}

.fontsize30 {
  font-size: var(--font-size30);
}

.fontsize24 {
  font-size: var(--font-size24);
}

.fontsize20 {
  font-size: var(--font-size20);
}

.fontsize16 {
  font-size: var(--font-size16);
}

.fontsize14 {
  font-size: var(--font-size14);
}

.fontsize13 {
  font-size: var(--font-size13);
}

body {
  font-family: "Zen Maru Gothic", serif;
  -webkit-text-size-adjust: 100%;
  font-feature-settings: "palt" 1;
}

.sans-serif {
  font-family: sans-serif;
}

.serif {
  font-family: serif;
}

.font_min01 {
  font-family: Ryumin Regular KL;
}

.font_min02 {
  font-family: Ryumin Bold KL;
}

.font_min03 {
  font-family: Reimin Medium;
}

.font_min04 {
  font-family: A1 Mincho;
}

.font_min05 {
  font-family: Shimanami;
}

.font_go01 {
  font-family: Shin Go Regular;
}

.font_go02 {
  font-family: Shin Go Bold;
}

.font_go03 {
  font-family: "ゴシックMB101 B";
}

.font_go04 {
  font-family: Midashi Go MB31;
}

.font_go05 {
  font-family: Gothic Medium BBB;
}

.font_marugo01 {
  font-family: "Jun 201";
}

.font_marugo02 {
  font-family: "Jun 501";
}

.font_marugo03 {
  font-family: Shin Maru Go Regular;
}

.font_marugo04 {
  font-family: Shuei NijimiMGo B;
}

.font_design01 {
  font-family: Maru Folk Medium;
}

.font_design02 {
  font-family: Folk Medium;
}

.font_design03 {
  font-family: Cinema Letter;
}

.font_design04 {
  font-family: Haruhi Gakuen;
}

.font_design05 {
  font-family: GSanSerif-B;
}

.font_design06 {
  font-family: Nachin;
}

.font_design07 {
  font-family: Take Bold;
}

.font_design08 {
  font-family: Brush-U;
}

.font_design09 {
  font-family: Talking;
}

.font_design10 {
  font-family: Suzumushi;
}

.font_deco01 {
  font-family: Shin Go Shadow;
}

.font_fude01 {
  font-family: Kyoukasho ICA Medium;
}

.font_fude02 {
  font-family: Likurei;
}

.font_fude03 {
  font-family: Kointai-M;
}

.font_fude04 {
  font-family: SakuraKeisetsu;
}

.font_ud01 {
  font-family: TBUDGothic R;
}

.font_ud02 {
  font-family: TBUDGothic E;
}

.font_ud03 {
  font-family: UD Shin Go Conde90 L;
}

.font_ud04 {
  font-family: UD Shin Go Conde90 M;
}

html {
  height: 100%;
}

body {
  font-size: var(--font-size16);
  color: var(--color-bk01);
  line-height: 1.75;
  background: var(--color-mu12);
  overflow-y: scroll;
}
@media (prefers-color-scheme: dark) {
  body {
    background: var(--color-bk01);
    color: #ddd;
  }
}

a {
  font-weight: inherit;
  font-style: inherit;
  font-size: inherit;
  color: inherit;
  text-decoration: none;
  outline: none;
}

svg {
  vertical-align: top;
}

p {
  margin: 0 0 10px;
}

strong {
  font-style: normal;
  font-weight: bold;
  color: #000;
}

em {
  font-style: normal;
  font-weight: bold;
  background: linear-gradient(rgba(255, 255, 255, 0) 60%, var(--color-mu06) 60%);
}
@media (prefers-color-scheme: dark) {
  em {
    background: linear-gradient(rgba(255, 255, 255, 0) 60%, var(--color-mu08) 60%);
  }
}

rt {
  color: var(--color-mu08);
  font-weight: normal;
  text-align: center;
}
@media (prefers-color-scheme: dark) {
  rt {
    color: var(--color-mu06);
  }
}

.hidden {
  display: none;
}

.transparent {
  opacity: 0;
}

.inline {
  display: inline;
}

.ib {
  display: inline-block;
  vertical-align: top;
  font-weight: inherit;
}

.md-block,
.md-inline,
.md-ib {
  display: none !important;
}

@media print, screen and (min-width: 768px) {
  .md-block {
    display: block !important;
  }
  .md-inline {
    display: inline !important;
  }
  .md-ib {
    display: inline-block !important;
  }
  .md-less {
    display: none !important;
  }
}
.pdt0 {
  padding-top: 0px !important;
}

.pdt10 {
  padding-top: 10px !important;
}

.pdt20 {
  padding-top: 20px !important;
}

.pdt30 {
  padding-top: 30px !important;
}

.pdt40 {
  padding-top: 40px !important;
}

.pdt50 {
  padding-top: 50px !important;
}

@media print, screen and (min-width: 768px) {
  .pdt0-md {
    padding-top: 0px !important;
  }
  .pdt10-md {
    padding-top: 10px !important;
  }
  .pdt20-md {
    padding-top: 20px !important;
  }
  .pdt30-md {
    padding-top: 30px !important;
  }
  .pdt40-md {
    padding-top: 40px !important;
  }
  .pdt50-md {
    padding-top: 50px !important;
  }
}
.mgt0 {
  margin-top: 0px !important;
}

.mgt10 {
  margin-top: 10px !important;
}

.mgt20 {
  margin-top: 20px !important;
}

.mgt30 {
  margin-top: 30px !important;
}

.mgt40 {
  margin-top: 40px !important;
}

.mgt50 {
  margin-top: 50px !important;
}

@media print, screen and (min-width: 768px) {
  .mgt0-md {
    margin-top: 0px !important;
  }
  .mgt10-md {
    margin-top: 10px !important;
  }
  .mgt20-md {
    margin-top: 20px !important;
  }
  .mgt30-md {
    margin-top: 30px !important;
  }
  .mgt40-md {
    margin-top: 40px !important;
  }
  .mgt50-md {
    margin-top: 50px !important;
  }
}
.mgt00em {
  margin-top: 0em !important;
}

.mgt01em {
  margin-top: 1em !important;
}

.mgt02em {
  margin-top: 2em !important;
}

.mgt03em {
  margin-top: 3em !important;
}

.mgt04em {
  margin-top: 4em !important;
}

.mgt05em {
  margin-top: 5em !important;
}

@media print, screen and (min-width: 768px) {
  .mgt00em-md {
    margin-top: 0em !important;
  }
  .mgt01em-md {
    margin-top: 1em !important;
  }
  .mgt02em-md {
    margin-top: 2em !important;
  }
  .mgt03em-md {
    margin-top: 3em !important;
  }
  .mgt04em-md {
    margin-top: 4em !important;
  }
  .mgt05em-md {
    margin-top: 5em !important;
  }
}
.gutter {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

@media print, screen and (min-width: 768px) {
  .max720 {
    max-width: 720px;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

@media print, screen and (min-width: 768px) {
  .max1000 {
    max-width: 1000px;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

.cmn-layout {
  position: relative;
}
.cmn-layout-right {
  margin: 40px 0 0;
}
.meta {
  font-size: var(--font-size14);
  display: flex;
  flex-wrap: wrap;
  gap: 0 1em;
}
.meta_list {
  color: #555;
}
@media (prefers-color-scheme: dark) {
  .meta_list {
    color: #aaa;
  }
}

.page-main {
  margin: 10px 0 0;
}

.inside-links {
  background: var(--color-mu06);
  padding: 1em 1em;
  border-radius: 3px;
}
.inside-links-ttl {
  color: var(--color-mu08);
  text-align: center;
}
@media (prefers-color-scheme: dark) {
  .inside-links-ttl {
    color: var(--color-mu06);
  }
}
.inside-links-border {
  border-top: 1px solid var(--color-mu07);
  margin: 0.5em 0;
}
@media (prefers-color-scheme: dark) {
  .inside-links {
    background: var(--color-bk02);
  }
}

.outside-links {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1em 1em;
  margin: 1em 0 0;
}
@media print, screen and (min-width: 768px) {
  .outside-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.outside-links .link {
  text-align: center;
  padding: 1em 1em;
  border-style: solid;
  border-color: var(--color-bk03);
  border-width: 1px;
  border-radius: 0.5em;
}

.cat-list {
  font-size: var(--font-size14);
  text-align: center;
}
.cat-list-link {
  display: inline-block;
  vertical-align: top;
  margin: 5px 10px 5px 0;
  border-radius: 3px;
}
.cat-list-link.active {
  color: var(--color-mu08);
  font-weight: bold;
}
@media (prefers-color-scheme: dark) {
  .cat-list-link.active {
    color: var(--color-mu07);
  }
}

.tag-list {
  font-size: var(--font-size14);
  text-align: center;
}
.tag-list-link {
  display: inline-block;
  vertical-align: top;
  margin: 5px 10px 5px 0;
  border-radius: 3px;
}
.tag-list-link.active {
  color: var(--color-mu08);
  font-weight: bold;
}
@media (prefers-color-scheme: dark) {
  .tag-list-link.active {
    color: var(--color-mu07);
  }
}

h1, .h1 {
  font-size: var(--font-size30);
  position: relative;
  font-weight: bold;
  line-height: 1.5;
  padding: 0 0 0.25em;
  margin: 0 0 0.25em;
}
h1::after, .h1::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  height: 3px;
  background-image: var(--color-mu21);
}

h2, .h2 {
  font-size: var(--font-size24);
  color: #fff;
  font-weight: bold;
  line-height: 1.5;
  background: var(--color-mu08);
  padding: 0.25em 0.75em;
  margin: 60px 0 20px;
  border-radius: 3px;
}
h2:nth-of-type(1), .h2:nth-of-type(1) {
  margin-top: 0;
}

.h2b {
  font-size: var(--font-size24);
  color: #fff;
  font-weight: bold;
  line-height: 1.5;
  background: var(--color-mu07);
  padding: 0.25em 0.75em;
  margin: 0 0 10px;
  border-radius: 3px;
}

h3, .h3 {
  font-size: var(--font-size20);
  font-weight: bold;
  line-height: 1.5;
  padding: 0 0 0 0.75em;
  margin: 40px 0 20px;
  border-style: solid;
  border-width: 0 0 0 5px;
  border-color: var(--color-mu06) var(--color-mu07);
}

h4, .h4 {
  font-size: var(--font-size16);
  display: flex;
  font-weight: bold;
  line-height: 1.5;
  margin: 40px 0 20px;
}
h4::before, h4::after, .h4::before, .h4::after {
  flex-shrink: 0;
  content: "";
  width: 0.4em;
  border-style: solid;
  border-color: var(--color-mu07);
}
h4::before, .h4::before {
  margin: 0 1em 0 0;
  border-width: 1px 0 1px 1px;
}
h4::after, .h4::after {
  margin: 0 0 0 1em;
  border-width: 1px 1px 1px 0;
}

h5, .h5 {
  font-size: var(--font-size16);
  position: relative;
  font-weight: bold;
  line-height: 1.5;
  padding: 0 0 0 1.7em;
  margin: 20px 0 10px;
}
h5::after, .h5::after {
  content: "";
  position: absolute;
  top: 0.25em;
  left: 0;
  width: 1em;
  height: 1em;
  background: repeating-linear-gradient(-45deg, var(--color-mu07) 0, var(--color-mu07) 4px, rgba(255, 255, 255, 0) 4px, rgba(255, 255, 255, 0) 8px);
}

h6, .h6 {
  font-size: var(--font-size16);
  position: relative;
  font-weight: bold;
  line-height: 1.5;
  padding: 0 0 0 1.7em;
  margin: 20px 0 10px;
}
h6::before, h6::after, .h6::before, .h6::after {
  content: "";
  position: absolute;
  border-radius: 3px;
}
h6::before, .h6::before {
  top: 0;
  left: 0;
  z-index: 2;
  width: 0.8em;
  height: 0.8em;
  background: var(--color-mu07);
}
h6::after, .h6::after {
  top: 0.4em;
  left: 0.25em;
  z-index: 1;
  width: 1em;
  height: 1em;
  background: var(--color-mu06);
}

.ul {
  background: var(--color-mu06);
  padding: 1em 1em;
  border-radius: 3px;
  margin: 10px 0;
}
@media (prefers-color-scheme: dark) {
  .ul {
    background: var(--color-bk02);
  }
}
.ul-li {
  position: relative;
  padding: 0 0 0 1.25em;
}
.ul-li::after {
  content: "";
  position: absolute;
  top: 0.625em;
  left: 0;
  width: 0.5em;
  height: 0.5em;
  background: var(--color-mu07);
  border-radius: 50%;
}

.ol {
  counter-reset: item;
  background: #ddd;
  padding: 1em 1em;
  border-radius: 3px;
  margin: 10px 0;
}
@media (prefers-color-scheme: dark) {
  .ol {
    background: var(--color-bk02);
  }
}
.ol-li {
  position: relative;
  padding: 0 0 0 2em;
  counter-reset: item_sub 0;
}
.ol-li::after {
  counter-increment: item;
  content: counter(item) ".";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--color-mu07);
  font-weight: bold;
}
.ol-li-sub {
  position: relative;
  padding: 0 0 0 1em;
  margin: 0 0 0 2em;
}
.ol-li-sub::after {
  content: "・";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--color-mu07);
  font-weight: bold;
}
.ol-li-sub02 {
  position: relative;
  padding: 0 0 0 1em;
  margin: 0 0 0 3em;
}
.ol-li-sub02::after {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--color-mu07);
  font-weight: bold;
}

.ol-kanji {
  counter-reset: item;
}
.ol-kanji-li {
  position: relative;
  padding: 0 0 0 2em;
}
.ol-kanji-li::after {
  counter-increment: item;
  content: counter(item, cjk-ideographic) ".";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--color-mu07);
  font-weight: bold;
}

.ac-list {
  font-size: 16px;
  position: relative;
  color: #555;
  line-height: 1.5;
  overflow: hidden;
  border-bottom: 1px dashed var(--color-mu08);
  padding: 20px 0 15px;
}
@media print, screen and (min-width: 768px) {
  .ac-list {
    font-size: 18px;
  }
}
.ac-list:nth-of-type(1) {
  margin-top: 0;
}
@media (prefers-color-scheme: dark) {
  .ac-list {
    color: #aaa;
  }
}
.ac-list-wrap {
  margin: 20px 0;
}
.ac-list-day {
  font-size: 12px;
  display: flex;
  margin: 0 0 10px;
}
@media print, screen and (min-width: 768px) {
  .ac-list-day {
    font-size: 13px;
  }
}
.ac-list-day-in {
  min-width: 7.5em;
  color: #fff;
  text-align: center;
  padding: 0.1em 0;
  background: var(--color-mu08);
  border-radius: 3px;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.25);
}
.ac-list-ttl {
  display: block;
  color: var(--color-mu07);
  font-weight: bold;
  margin: 0 0 2px;
}
.ac-list-day {
  font-size: 14px;
}
@media print, screen and (min-width: 768px) {
  .ac-list-day {
    font-size: 15px;
  }
}
.ac-list-cat {
  font-size: 14px;
}
@media print, screen and (min-width: 768px) {
  .ac-list-cat {
    font-size: 14px;
  }
}
.ac-list-cat-link {
  display: inline-block;
  vertical-align: top;
  margin: 5px 0.75em 5px 0;
}
.ac-list-tag {
  font-size: 14px;
}
@media print, screen and (min-width: 768px) {
  .ac-list-tag {
    font-size: 14px;
  }
}
.ac-list-tag-link {
  display: inline-block;
  vertical-align: top;
  margin: 5px 0.75em 5px 0;
}

.img-kanji {
  width: 1em;
  vertical-align: baseline;
}

.font-btn {
  font-size: var(--font-size16);
  background: var(--color-mu06);
  padding: 0.5em 1em 1em;
  border-radius: 3px;
  margin: 20px 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (prefers-color-scheme: dark) {
  .font-btn {
    background: var(--color-bk02);
  }
}
.font-btn-left {
  width: 100%;
}
@media print, screen and (min-width: 768px) {
  .font-btn-left {
    width: 35%;
  }
}
.font-btn-center {
  width: 45%;
  margin: 10px 0 0;
}
@media print, screen and (min-width: 768px) {
  .font-btn-center {
    width: 23%;
    margin: 0;
  }
}
.font-btn-right {
  width: 45%;
  margin: 10px 0 0;
}
@media print, screen and (min-width: 768px) {
  .font-btn-right {
    width: 23%;
    margin: 0;
  }
}
.font-btn-ttl {
  font-weight: bold;
  text-align: center;
  margin: 0 0 0.5em;
}
.font-btn-inner {
  display: flex;
  justify-content: space-between;
}
.font-btn-list {
  width: 32%;
  font-weight: bold;
  text-align: center;
  background: #fff;
  padding: 0.5em 0;
  border-radius: 3px;
  cursor: pointer;
}
@media (prefers-color-scheme: dark) {
  .font-btn-list {
    background: var(--color-bk01);
  }
}
.font-btn-list.selected {
  color: #fff;
  background: var(--color-mu08);
}
.font-btn-list2 {
  width: 48.7%;
}

#header {
  margin: 0 0 20px;
}

.header_first {
  font-size: 20px;
  position: relative;
  background-image: var(--color-mu21);
}
@media print, screen and (min-width: 768px) {
  .header_first {
    font-size: 30px;
  }
}
.header_menu_btn {
  position: absolute;
  top: 0;
  left: 1em;
  bottom: 0;
  width: 1em;
  cursor: pointer;
  display: flex;
  align-items: center;
}
.header_ttl {
  color: #fff;
  font-weight: bold;
  text-align: center;
  padding: 0.25em 0;
  text-shadow: 0.05em 0.05em 0 var(--color-mu07);
}
.header_ttl_text {
  cursor: pointer;
}
.header_second {
  height: 0;
  overflow: hidden;
  background: var(--color-mu06);
}
@media (prefers-color-scheme: dark) {
  .header_second {
    background: var(--color-bk02);
  }
}
.header_second_inner {
  padding: 1.5em 20px;
}
.header_second_list {
  padding: 1em 0.5em;
  border-top: 1px solid var(--color-mu07);
}
.header_second_list:nth-of-type(1) {
  padding-top: 0;
  border-top: 0;
}
@media (prefers-color-scheme: dark) {
  .header_second_list {
    border-color: var(--color-mu06);
  }
}
.header_menu_btn_close {
  width: 15em;
  color: #fff;
  text-align: center;
  background: var(--color-mu08);
  margin: 1.5em auto 0;
  padding: 0.25em 0;
  border-radius: 3px;
  cursor: pointer;
}

@media print, screen and (min-width: 768px) {
  .hover-img {
    transition: 0.4s;
  }
  .hover-img:hover {
    opacity: 0.8;
  }
}

[data-scroll] {
  cursor: pointer;
}

[data-izimodal] {
  width: 90%;
  max-height: 90%;
}

.iziModal .iziModal-content {
  background: var(--color-mu01);
}
@media (prefers-color-scheme: dark) {
  .iziModal .iziModal-content {
    background: var(--color-bk01);
  }
}

.text-color01 {
  color: var(--color-mu08);
}
@media (prefers-color-scheme: dark) {
  .text-color01 {
    color: var(--color-mu07);
  }
}
.text-link {
  color: var(--color-mu08);
  text-decoration: underline;
}
@media (prefers-color-scheme: dark) {
  .text-link {
    color: var(--color-mu07);
  }
}
.text-chu {
  font-size: 11px;
  padding: 0 0 0 1em;
  text-indent: -1em;
  line-height: 1.5;
}
@media print, screen and (min-width: 768px) {
  .text-chu {
    font-size: 12px;
  }
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.text-under {
  text-decoration: underline;
}
.text-gouji {
  display: inline-block;
  transform: scaleX(0.5);
  margin: 0 -0.5em;
}
.text-del {
  text-decoration: line-through;
}

.indent {
  color: #555;
  padding: 0 0 0 1em;
  text-indent: -1em;
}
@media (prefers-color-scheme: dark) {
  .indent {
    color: #aaa;
  }
}
.indent-b {
  position: relative;
  padding: 0 0 0 1.25em;
}
.indent-b::after {
  content: "";
  position: absolute;
  top: 0.5em;
  left: 0;
  width: 0.75em;
  height: 0.75em;
  background-color: var(--color-mu07);
  border-radius: 50%;
}
.indent-c {
  position: relative;
  padding: 0 0 0 1em;
}
.indent-c::after {
  content: "⇀";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--color-mu07);
}
.indent-d {
  position: relative;
  padding: 0 0 0 1em;
}
.indent-d::after {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}
.indent-kun {
  position: relative;
  z-index: 0;
  padding: 0 0 0 2em;
}
.indent-kun::after {
  content: "一";
  position: absolute;
  top: 0;
  left: 0;
}

.lineheight2 {
  line-height: 2;
}

.lineheight225 {
  line-height: 2.25;
}

.lineheight25 {
  line-height: 2.5;
}

.link-icon,
.nolink-icon {
  font-size: 14px;
  position: relative;
  display: inline-block;
  vertical-align: top;
  padding: 0 0 0 2em;
}
@media print, screen and (min-width: 768px) {
  .link-icon,
  .nolink-icon {
    font-size: 15px;
  }
}
.link-icon::after,
.nolink-icon::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1.75em;
}
.link-icon-right::after,
.nolink-icon-right::after {
  background: url(../img/common/icon_right.svg) no-repeat center center;
  background-size: contain;
}
.link-icon-right02::after,
.nolink-icon-right02::after {
  background: url(../img/common/icon_right02.svg) no-repeat center center;
  background-size: contain;
}
.link-icon-right03::after,
.nolink-icon-right03::after {
  background: url(../img/common/icon_right03.svg) no-repeat center center;
  background-size: contain;
}
.link-icon-info::after,
.nolink-icon-info::after {
  background: url(../img/common/icon_info.svg) no-repeat center center;
  background-size: contain;
}
.link-icon-window::after,
.nolink-icon-window::after {
  background: url(../img/common/icon_window.svg) no-repeat center center;
  background-size: contain;
}
.link-icon-pdf::after,
.nolink-icon-pdf::after {
  background: url(../img/common/icon_pdf.svg) no-repeat center center;
  background-size: contain;
}

.link-icon {
  text-decoration: underline;
}

button {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

.button01 {
  display: block;
  position: relative;
  width: 100%;
  color: var(--color-mu08);
  font-weight: bold;
  text-align: center;
  background: linear-gradient(to bottom, #fff 0%, #dfccc2 100%);
  padding: 0.5em 1em;
  border: 1px solid #dfccc2;
  border-radius: 3px;
  cursor: pointer;
}
.button01::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border: 1px solid #fff;
  border-radius: inherit;
}

.button02 {
  display: block;
  width: 100%;
  color: var(--color-mu08);
  font-weight: bold;
  text-align: center;
  background: linear-gradient(to bottom, #fff 0%, #fff 55%, #f3efe5 55%, #f3efe5 100%);
  padding: 0.5em 1em;
  border: 1px solid #dfccc2;
  border-radius: 3px;
  cursor: pointer;
}

blockquote {
  padding: 0 1em;
  border-left: 5px #ddd solid;
  margin: 10px 0;
}
@media (prefers-color-scheme: dark) {
  blockquote {
    border-color: var(--color-bk02);
  }
}
blockquote p {
  margin: 0;
}

.blockquote02 {
  border: 0;
  margin: 0;
  padding: 0;
}

.bq {
  padding: 0.5em 1em;
  border-left: 5px #ddd solid;
  margin: 10px 0;
}
@media (prefers-color-scheme: dark) {
  .bq {
    border-color: var(--color-bk02);
  }
}

pre {
  margin: 20px 0 0;
}
pre + pre {
  margin-top: 0;
}

code {
  font-family: Consolas, Menlo, monospace;
  letter-spacing: 0;
  font-size: 11px;
  position: relative;
  display: block;
  overflow: auto;
  line-height: 1.5;
  background: #2b2b2b;
  color: #f8f8f2;
  padding: 0.75em 1em 1em;
}
@media print, screen and (min-width: 768px) {
  code {
    font-size: 12px;
  }
}
code::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  color: #fff;
  text-align: center;
  background: var(--color-mu08);
  padding: 0 0.5em;
  border-radius: 0 0 3px 0;
}
code.html::before {
  content: "HTML";
}
code.css::before {
  content: "CSS";
}
code.scss::before {
  content: "SCSS";
}
code.js::before {
  content: "jQuery";
}
code.js02::before {
  content: "JS";
}
code.php::before {
  content: "PHP";
}
code.apache::before {
  content: "htaccess";
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-x {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table {
  width: 200%;
}
@media print, screen and (min-width: 768px) {
  .table {
    width: 100%;
  }
}
.table td, .table th {
  vertical-align: middle;
  padding: 0.5em 1em;
  border-style: solid;
  border-color: var(--color-mu06);
  border-width: 1px 0;
}
.table th {
  color: var(--color-bk01);
  text-align: center;
  background: var(--color-mu06);
}

.table-b {
  width: 100%;
}
.table-b .th-b, .table-b .td-b {
  vertical-align: middle;
  padding: 0.5em 0.5em;
  border-style: solid;
  border-color: #ccc;
  border-width: 0 0 1px;
}

.details {
  margin: 0 0 20px;
}

.summary {
  position: relative;
  color: var(--color-mu08);
  padding: 0.25em 0.5em;
  border: 1px solid var(--color-mu08);
  border-radius: 3px;
  cursor: pointer;
  outline: none;
  margin: 0 0 20px;
}
.details[open] summary::after {
  content: "";
}

.cmn-details-text {
  margin: 1em 0 0;
}

.pointer {
  cursor: pointer;
}

.ttl01 {
  display: flex;
  margin: 20px 0 10px;
}
.ttl01_inner {
  min-width: 11em;
  color: #fff;
  text-align: center;
  padding: 0.1em 0;
  background: var(--color-mu08);
  border-radius: 3px;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.25);
}

.justify-content-center {
  justify-content: center;
}
.justify-content-end {
  justify-content: end;
}
.justify-content-between {
  justify-content: space-between;
}

.align-items-start {
  align-items: start;
}
.align-items-center {
  align-items: center;
}
.align-items-end {
  align-items: end;
}

.col11 {
  display: flex;
  flex-wrap: wrap;
  gap: var(--col11-gap-row) var(--col11-gap-column);
}
@media print, screen and (min-width: 768px) {
  .col11-md {
    display: flex;
    flex-wrap: wrap;
    gap: var(--col11-gap-row) var(--col11-gap-column);
  }
}
.col11-gap0 {
  --col11-gap-row: 0px;
  --col11-gap-column: 0px;
}
.col11-gap-row0 {
  --col11-gap-row: 0px;
}
.col11-gap-column0 {
  --col11-gap-column: 0px;
}
.col11-gap5 {
  --col11-gap-row: 5px;
  --col11-gap-column: 5px;
}
.col11-gap-row5 {
  --col11-gap-row: 5px;
}
.col11-gap-column5 {
  --col11-gap-column: 5px;
}
.col11-gap10 {
  --col11-gap-row: 10px;
  --col11-gap-column: 10px;
}
.col11-gap-row10 {
  --col11-gap-row: 10px;
}
.col11-gap-column10 {
  --col11-gap-column: 10px;
}
.col11-gap15 {
  --col11-gap-row: 15px;
  --col11-gap-column: 15px;
}
.col11-gap-row15 {
  --col11-gap-row: 15px;
}
.col11-gap-column15 {
  --col11-gap-column: 15px;
}
.col11-gap20 {
  --col11-gap-row: 20px;
  --col11-gap-column: 20px;
}
.col11-gap-row20 {
  --col11-gap-row: 20px;
}
.col11-gap-column20 {
  --col11-gap-column: 20px;
}
.col11-gap25 {
  --col11-gap-row: 25px;
  --col11-gap-column: 25px;
}
.col11-gap-row25 {
  --col11-gap-row: 25px;
}
.col11-gap-column25 {
  --col11-gap-column: 25px;
}
.col11-gap30 {
  --col11-gap-row: 30px;
  --col11-gap-column: 30px;
}
.col11-gap-row30 {
  --col11-gap-row: 30px;
}
.col11-gap-column30 {
  --col11-gap-column: 30px;
}
.col11-gap35 {
  --col11-gap-row: 35px;
  --col11-gap-column: 35px;
}
.col11-gap-row35 {
  --col11-gap-row: 35px;
}
.col11-gap-column35 {
  --col11-gap-column: 35px;
}
.col11-gap40 {
  --col11-gap-row: 40px;
  --col11-gap-column: 40px;
}
.col11-gap-row40 {
  --col11-gap-row: 40px;
}
.col11-gap-column40 {
  --col11-gap-column: 40px;
}
@media print, screen and (min-width: 768px) {
  .col11-gap0-md {
    --col11-gap-row: 0px;
    --col11-gap-column: 0px;
  }
  .col11-gap-row0-md {
    --col11-gap-row: 0px;
  }
  .col11-gap-column0-md {
    --col11-gap-column: 0px;
  }
  .col11-gap10-md {
    --col11-gap-row: 10px;
    --col11-gap-column: 10px;
  }
  .col11-gap-row10-md {
    --col11-gap-row: 10px;
  }
  .col11-gap-column10-md {
    --col11-gap-column: 10px;
  }
  .col11-gap20-md {
    --col11-gap-row: 20px;
    --col11-gap-column: 20px;
  }
  .col11-gap-row20-md {
    --col11-gap-row: 20px;
  }
  .col11-gap-column20-md {
    --col11-gap-column: 20px;
  }
  .col11-gap30-md {
    --col11-gap-row: 30px;
    --col11-gap-column: 30px;
  }
  .col11-gap-row30-md {
    --col11-gap-row: 30px;
  }
  .col11-gap-column30-md {
    --col11-gap-column: 30px;
  }
  .col11-gap40-md {
    --col11-gap-row: 40px;
    --col11-gap-column: 40px;
  }
  .col11-gap-row40-md {
    --col11-gap-row: 40px;
  }
  .col11-gap-column40-md {
    --col11-gap-column: 40px;
  }
}
.col11-count1 {
  --col11-count: 1;
}
.col11-count2 {
  --col11-count: 2;
}
.col11-count3 {
  --col11-count: 3;
}
.col11-count4 {
  --col11-count: 4;
}
@media print, screen and (min-width: 768px) {
  .col11-count1-md {
    --col11-count: 1;
  }
  .col11-count2-md {
    --col11-count: 2;
  }
  .col11-count3-md {
    --col11-count: 3;
  }
  .col11-count4-md {
    --col11-count: 4;
  }
  .col11-count5-md {
    --col11-count: 5;
  }
  .col11-count6-md {
    --col11-count: 6;
  }
  .col11-count7-md {
    --col11-count: 7;
  }
  .col11-count8-md {
    --col11-count: 8;
  }
}
.col11-item1 {
  width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 1);
}
.col11-item2 {
  width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 2);
}
.col11-item3 {
  width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 3);
}
.col11-item4 {
  width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 4);
}
@media print, screen and (min-width: 768px) {
  .col11-item1-md {
    width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 1);
  }
  .col11-item2-md {
    width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 2);
  }
  .col11-item3-md {
    width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 3);
  }
  .col11-item4-md {
    width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 4);
  }
  .col11-item5-md {
    width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 5);
  }
  .col11-item6-md {
    width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 6);
  }
  .col11-item7-md {
    width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 7);
  }
  .col11-item8-md {
    width: calc((100% - var(--col11-gap-row) * (var(--col11-count) - 1)) / 8);
  }
}

.col21-1 {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.col21-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.col21-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.col21-4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.col21-5 {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.col21-6 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
@media print, screen and (min-width: 768px) {
  .col21-1-md {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .col21-2-md {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .col21-3-md {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .col21-4-md {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .col21-5-md {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .col21-6-md {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .col21-7-md {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .col21-8-md {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .col21-9-md {
    display: grid;
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .col21-10-md {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .col21-11-md {
    display: grid;
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .col21-12-md {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}

.gap5 {
  gap: 5px;
}
.gap-row5 {
  row-gap: 5px;
}
.gap10 {
  gap: 10px;
}
.gap-row10 {
  row-gap: 10px;
}
.gap15 {
  gap: 15px;
}
.gap-row15 {
  row-gap: 15px;
}
.gap20 {
  gap: 20px;
}
.gap-row20 {
  row-gap: 20px;
}
.gap25 {
  gap: 25px;
}
.gap-row25 {
  row-gap: 25px;
}
.gap30 {
  gap: 30px;
}
.gap-row30 {
  row-gap: 30px;
}
.gap35 {
  gap: 35px;
}
.gap-row35 {
  row-gap: 35px;
}
.gap40 {
  gap: 40px;
}
.gap-row40 {
  row-gap: 40px;
}
@media print, screen and (min-width: 768px) {
  .gap10-md {
    gap: 10px;
  }
  .gap20-md {
    gap: 20px;
  }
  .gap30-md {
    gap: 30px;
  }
  .gap40-md {
    gap: 40px;
  }
  .gap50-md {
    gap: 50px;
  }
  .gap60-md {
    gap: 60px;
  }
}

.card01-wrap {
  display: flex;
  flex-wrap: wrap;
}
.card01-list {
  padding: 0.25em 0.5em;
  margin: 0 0.5em 0.5em 0;
  border-radius: 3px;
  border: 1px solid var(--color-mu06);
}

.card02-wrap {
  display: grid;
  gap: 3px 0;
  margin: 20px 0 0;
}
@media print, screen and (min-width: 768px) {
  .card02-wrap {
    grid-template-columns: repeat(1, 1fr);
    gap: 3px 3px;
  }
}
@media print, screen and (min-width: 768px) {
  .card02-wrap02 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.card02-list {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  font-size: 14px;
  min-height: 60px;
  line-height: 1.5;
  background: var(--color-mu06);
  padding: 0.5em 0.5em;
  border-radius: 3px;
}
@media print, screen and (min-width: 768px) {
  .card02-list {
    font-size: 15px;
  }
}
@media (prefers-color-scheme: dark) {
  .card02-list {
    background: var(--color-bk02);
  }
}
@media print, screen and (min-width: 768px) {
  .card02-list {
    min-height: 66px;
  }
}
.card02-list02 {
  justify-content: center;
}
.card02-constant {
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 112px;
  height: 60px;
  margin: 0 1em 0 0;
  overflow: hidden;
  border-radius: 3px;
}
@media print, screen and (min-width: 768px) {
  .card02-constant {
    width: 120px;
    height: 66px;
  }
}
.card02-img {
  border-radius: 3px;
}
.card02-link {
  display: block;
  text-decoration: underline;
}
.card02-link02 {
  text-decoration: none;
}
.card02-sublink {
  display: block;
  color: var(--color-mu08);
}
@media (prefers-color-scheme: dark) {
  .card02-sublink {
    color: var(--color-mu07);
  }
}
.card02-date {
  margin: 0;
}
.cmn-shoseki {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 0 20px;
}
.cmn-shoseki-ttl {
  font-weight: bold;
  margin: 0 0 0.5em;
}
.cmn-shoseki-r {
  margin: auto 0;
}
@media print, screen and (min-width: 768px) {
  .cmn-shoseki {
    grid-template-columns: 150px 1fr;
    gap: 0 40px;
  }
}

.youtube-tm {
  max-width: 320px;
  margin: 20px auto;
}
.youtube-tm-link {
  position: relative;
  display: block;
}
.youtube-tm-link::before, .youtube-tm-link::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.youtube-tm-link::after {
  z-index: 1;
  width: 3em;
  height: 2em;
  background: #ff0000;
  border-radius: 0.25em;
}
.youtube-tm-link::before {
  z-index: 2;
  width: 1em;
  height: 1em;
  background: #fff;
  clip-path: polygon(0 0, 0 100%, 100% 50%);
  left: 0.25em;
}
.youtube-tm-text {
  font-size: 12px;
  position: absolute;
  top: 0.5em;
  left: 0.75em;
  color: #fff;
  line-height: 1.5;
  text-shadow: 1px 1px 4px rgb(0, 0, 0), -1px -1px 4px rgb(0, 0, 0);
}
.youtube-mv {
  max-width: 570px;
  margin: 20px auto;
}
.youtube-mv-inner {
  position: relative;
  width: 100%;
  padding: 56.25% 0 0;
  margin: 0 0 10px;
}
.youtube-mv iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.youtube-text {
  margin: 10px 0 0;
}

.googlemap {
  position: relative;
  z-index: 1;
  padding: 56.25% 0 0;
}
.googlemap iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.qaa_research {
  position: relative;
  z-index: 0;
  padding: 1em 1em;
  margin: 4em 0 0;
  border: 1px solid var(--color-ww02);
  border-radius: 4px;
}
@media print, screen and (min-width: 768px) {
  .qaa_research_right {
    flex-shrink: 0;
  }
}
.qaa_research_row {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5em 2em;
}
.qaa_research_text {
  width: 100%;
  text-align: center;
}
@media print, screen and (min-width: 768px) {
  .qaa_research_text {
    width: auto;
  }
}
.qaa_research_label {
  cursor: pointer;
  display: flex;
  align-items: center;
}
.qaa_research_radio {
  width: 1.25em;
  height: 1.25em;
  vertical-align: middle;
  margin: 0 0.5em 0 0;
}
.qaa_research_btn {
  border: none;
  outline: none;
  appearance: none;
  display: block;
  width: 8em;
  color: var(--color-wt01);
  font-weight: bold;
  line-height: 2;
  background-color: var(--color-ww02);
  border-radius: 1em;
  margin: 1em auto 0;
  cursor: pointer;
}
.qaa_research_btn:disabled {
  background-color: var(--color-ww05);
  cursor: auto;
}
.qaa_research_input {
  display: block;
  width: 100%;
  height: 2.5em;
  padding: 0em 1em;
  margin: 1em 0 0;
  box-sizing: border-box;
  font-family: inherit;
}
.qaa_research_end {
  display: none;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: var(--color-ww02);
  font-weight: bold;
  background: var(--color-wt01);
  align-items: center;
  justify-content: center;
}
@media (prefers-color-scheme: dark) {
  .qaa_research_end {
    background: var(--color-bk01);
  }
}
.qaa_research_end.send {
  display: flex;
}

.btm_bnr {
  width: 50%;
  max-width: 200px;
  padding: 5px 5px;
}
.btm_bnr_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  margin: 35px -5px;
}
@media print, screen and (min-width: 768px) {
  .btm_bnr_wrap {
    margin: 75px -5px;
  }
}
.btm_bnr img {
  display: block;
}

.to_top_fix {
  font-size: 12px;
  font-size: 14px;
  position: fixed;
  right: 0;
  bottom: 0.5em;
  background: var(--color-mu07);
  color: #fff;
  padding: 0.25em 0.7em;
  cursor: pointer;
  z-index: 100;
}
.to_top_fix.ver02 {
  display: none;
  bottom: 3em;
}

body:has(#sec_mokuji) .to_top_fix.ver02 {
  display: block;
}

.to_top {
  position: relative;
  padding: 0 0 0 1.75em;
  cursor: pointer;
}
.to_top::after {
  content: "";
  position: absolute;
  top: 0.35em;
  left: 0;
  border-style: solid;
  border-color: transparent transparent var(--color-mu07);
  border-width: 0 0.6em 1.038em;
}
.to_top_area {
  display: flex;
  justify-content: center;
  margin: 40px 0 0;
}

#footer {
  background-image: var(--color-mu21);
  padding: 20px 5%;
  margin: 20px 0 0;
}
@media print, screen and (min-width: 768px) {
  #footer {
    padding: 20px 20px;
  }
}

.fm_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.fm_link {
  color: #fff;
  margin: 0 0.5em 0.5em;
  text-shadow: 0.05em 0.05em 0 var(--color-mu07);
}

.footer_copy {
  font-size: 12px;
  font-size: 14px;
  color: #fff;
  text-align: center;
  text-shadow: 0.05em 0.05em 0 var(--color-mu07);
  margin: 0;
}