@charset "UTF-8";

/* default
----------------------------------------------- */
html {
  scroll-behavior: smooth;
}

body {
  position: relative;
  width: 100%;
  margin: 0;
  color: var(--mono-color-1);
  font-family: var(--font-UD-hirakaku-W4);
  font-size: clamp(0.875rem, 0.818rem + 0.24vw, 1rem); /* 14-16px viewport 375-1200px指定*/
  font-weight: 400;
  line-height: 1.75;
  /*/font-feature-settings: "palt";*/
  background-color: var(--mono-color-5);
}

h1,h2,h3,h4,h5,h6 {
  font-family: var(--font-UD-Mshingo-DB);
  letter-spacing: 0.05em;
  line-height: 1.2;
}

img.external,
img.anchor {
  display: inline-block;
  width: 16px !important;
  margin: 0  0.25rem 3px 0.5rem;
  vertical-align: middle;
}

.pc-on { display: block; }
.sp-on { display: none; }

b, strong {
  font-family: var(--font-UD-hirakaku-W5);
}

a, a img {
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
}

a:hover img {
  opacity: 0.7;
}

img {
  max-width: 100%;
  height: auto;
}

small,
.small {
  font-size: 0.75rem;
}

.body p,
.summary p {
  margin: 0 0 1rem;
}

.body table {
  margin-bottom: 1rem;
  border: 1px solid var(--mono-color-3);
}

.red {
  color: var(--ac-color-red);
}

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

  .pc-on { display: none; }
  .sp-on { display: block; }

  a:hover img {
    opacity: 1;
  }
}

/* button
----------------------------------------------- */
#back,
.back,
.more {
  display: block;
  position: relative;
  margin-top: 2rem;
}

a[href].more {
  display: block;
  margin-left: auto;
  width: fit-content;
  font-family: var(--font-UD-Mshingo-DB);
  text-decoration: none;
  transition: var(--transition-default);
}

a[href].more:not(.categoryTemplate a[href].more) {
  color: var(--main-color-1);
}

.back {
  text-align: center;
}

#back a,
.back a,
.more a[href] {
  display: inline-block;
  width: fit-content;
  min-width: 165px;
  padding: 0.3125rem 1.5rem;
  color: var(--mono-color-5);
  font-family: var(--font-UD-Mshingo-DB);
  text-decoration: none;
  background-color: var(--main-color-1);
  border-radius: 3em;
  transition: var(--transition-default);
}

#back a::before,
.back a::before,
a[href].more::before,
.more a[href]::before {
  content: '';
  display: inline-block;
  width: 25px;
  height: 16px;
  margin-right: 0.625rem;
  transition: var(--transition-default);
}

#back a:not(.categoryTemplate #back a)::before,
.back a:not(.categoryTemplate .back a)::before,
a[href].more:not(.categoryTemplate a[href].more)::before,
.more a[href]:not(.categoryTemplate .more a[href])::before {
  background: url("../site/images/ic-double-arrow-w.svg") no-repeat center/cover;
}

#back a:not(.categoryTemplate #back a):hover,
.back a:not(.categoryTemplate .back a):hover,
a[href].more:not(.categoryTemplate a[href].more):hover,
.more a[href]:not(.categoryTemplate .more a[href]):hover {
  background-color: var(--main-color-2);
}

#back a:hover::before,
.back a:hover::before,
a[href].more:hover::before,
.more a[href]:hover::before {
  transform: translateX(3px);
}

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

  #back a:not(.categoryTemplate #back a):hover,
  .back a:not(.categoryTemplate .back a):hover,
  a[href].more:not(.categoryTemplate a[href].more):hover,
  .more a[href]:not(.categoryTemplate .more a[href]):hover {
    background-color: var(--main-color-1);
  }

  a[href].more {
    margin-right: auto;
  }

  #back a:hover::before,
  .back a:hover::before,
  a[href].more:hover::before,
  .more a[href]:hover::before {
    transform: translateX(0);
  }
}


/* dark mode
----------------------------------------------- */
/*@media (prefers-color-scheme: dark) {
  html {
    filter: invert(1) hue-rotate(180deg);
  }

  html img {
    filter: invert(1) hue-rotate(180deg);
  }
}*/


/* responsive table iframe
----------------------------------------------- */
@media only screen and (max-width: 959px) {
  .scroll {
    width: 100%;
    /*width: calc(100vw - 40px);*/
    margin-bottom: 1rem;
    overflow: auto;
    white-space: nowrap;
  }

  .scroll::-webkit-scrollbar {
    height: 15px;
  }

  .scroll::-webkit-scrollbar-track {
    background: var(--mono-color-4);
  }

  .scroll:not(.pageTemplate .scroll)::-webkit-scrollbar-thumb {
    background: var(--main-color-1);
  }

  .scroll table {
    width: 100% !important;
    height: auto !important;
    margin: 0 0 1em !important;
    table-layout: auto;
  }

  .video {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
  }

  .video iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
  }
}


/* Icons
----------------------------------------------- */
.iconFile,
.iconDefault {
  min-height: 45px;
  max-height: 50px;
  padding: 0.625rem 1rem 0.625rem 50px;
  background-image: url("../site/images/ic-file-default.svg");
  background-position: left center;
  background-repeat: no-repeat;
}

.iconBmp {
  background-image: url("../site/images/ic-file-bmp.svg");
}

.iconCsv,
.iconTxt {
  background-image: url("/_common/images/icons/default.png");
}

.iconDoc,
.iconDocx {
  background-image: url("../site/images/ic-file-docx.svg");
}

.iconGif {
  background-image: url("../site/images/ic-file-gif.svg");
}

.iconJpg,
.iconJpe,
.iconJpeg {
  background-image: url("../site/images/ic-file-jpg.svg");
}

.iconJtd {
  background-image: url("/_common/images/icons/jtd.png");
}

.iconLzh {
  background-image: url("/_common/images/icons/lzh.png");
}

.iconPdf {
  background-image: url("../site/images/ic-file-pdf.svg");
}

.iconPng {
  background-image: url("../site/images/ic-file-png.svg");
}

.iconPpt,
.iconPptx {
  background-image: url("/_common/images/icons/ppt.png");
}

.iconXls,
.iconXlsx {
  background-image: url("../site/images/ic-file-xlsx.svg");
}

.iconZip {
  background-image: url("../site/images/ic-file-zip.svg");
}

@media only screen and (max-width: 959px) {
  .iconFile,
  .iconDefault {
    min-height: 25px;
    max-height: 30px;
    padding: 0.625rem 1rem 0.625rem 40px;
  }
}


/* CKEditor templates
----------------------------------------------- */
.temp1,
.temp2,
.temp3,
.temp4 {
  clear: both;
  margin-bottom: 20px;
}

.temp1 .thumb {
  float: left;
  margin-bottom: 10px;
  margin-right: 20px;
}

.temp1 ul,
.temp1 ol {
  display: inline-block;
  vertical-align: top;
}

.temp2 .thumb {
  float: right;
  margin-bottom: 10px;
  margin-left: 20px;
}

.temp3,
.temp4 {
  display: flex;
  justify-content: center;
}

.temp3 dl,
.temp4 dl {
  margin: 0 5px;
  padding: 0;
  vertical-align: bottom;
}

.temp3 dl {
  max-width: 48%;
}

.temp4 dl {
  max-width: 31%;
}

.temp3 dl dt,
.temp4 dl dt {
  margin-bottom: 10px;
  text-align: center;
}

.temp3 dl dd,
.temp4 dl dd {
  margin: 0;
  text-align: center;
}

table.temp5,
table.temp6 {
  margin-bottom: 30px;
}

.temp5 caption,
.temp6 caption {
  text-align: center;
}

.temp5 th,
.temp5 td,
.temp6 th,
.temp6 td {
  padding: 6px 10px;
  border: 1px solid #b3b3b3;
  text-align: center;
}

.adobeReader,
.temp7 {
  clear: both;
  margin: 40px 0 20px;
  padding: 10px 20px 10px 196px;
  border: 1px solid var(--mono-color-3);
  background: var(--mono-color-4) url("/_themes/images/adobe_bn.png") no-repeat 20px center;
}

.adobeReader p,
.temp7 p {
  margin: 0 0 10px;
}

.temp8,
.temp9 {
  display: grid;
  grid-template-columns: 40% 1fr;
  gap: 0 40px;
  margin-bottom: 20px;
}

.temp8 .thumb,
.temp9 .thumb {
  width: 100%;
}

.temp8 .thumb a,
.temp9 .thumb a {
  display: block;
}

.temp8 .thumb img,
.temp9 .thumb img {
  width: 100%;
  margin: 0 !important;
}

@media only screen and (max-width: 959px) {
  .temp1 .thumb,
  .temp2 .thumb {
    float: none;
    margin: 0 0 1rem;
    text-align: center;
  }

  .temp3,
  .temp4 {
    flex-wrap: wrap;
  }

  .temp3 dl,
  .temp4 dl {
    max-width: 100%;
  }

  .adobeReader,
  .temp7 {
    padding: 55px 20px 10px;
    background-position: center 10px;
  }

  .temp8,
  .temp9 {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .temp8 .thumb,
  .temp9 .thumb {
    width: min(90%, 200px);
    margin: 0 auto;
    text-align: center;
  }

  .temp8 .thumb:has(iframe),
  .temp9 .thumb:has(iframe) {
    width: 100%;
  }
}


/* clearfix
----------------------------------------------- */
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}


/* pagination
----------------------------------------------- */
.pagination {
  display: flex;
  justify-content: center;
  margin: 1rem 0;
  text-align: center;
}

.upperPagination {
  margin: 0 0 1rem;
}

.lowerPagination {
  margin: 1rem 0 0;
}

.pagination a,
.pagination em,
.pagination span {
  display: inline-block;
  padding: 0 6px;
  font-style: normal;
  vertical-align: middle;
}

.pagination .current {
  font-family: var(--font-family-w6);
}