@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=BIZ+UDGothic:wght@400;700&display=swap');

:root {
    --body: #fff;
    --text: #333;
    --white: #fff;
    --gr5: #f9f9f9;
    --gr10: #f3f3f3;
    --gr15: #eee;
    --gr20: #e6e6e6;
    --gr25: #ccc;
    --gr30: #bbb;
    --gr40: #aaa;
    --gr50: #999;
    --gr60: #888;
    --gr70: #777;
    --gr80: #666;
    --gr85: #555;
    --gr90: #333;
    --gr95: #222;
    --dark: #111;
    --black: #000;
    --menubg: #fff;
    --gr90-always: #333;
    --black-always: #000;
    --tag: #f3f3f3;
    --submenu: #f3f3f3;
    --mainbutton: #f3f3f3;
    --h3bg: #f6f6f6;
    --green: #008000;
    --shadow: var(--gr20);
    --main: #ccbfeb;
    --link: #3d6cc4;
    --PClr: #24a700;
    --SPClr: #66cc00;
    --ThClr: #ffffd5;
    --HWrap: #66CC00;
    --fz-body: 1rem;
    --fz-h1: calc(var(--fz-body) * 10 / 7.27);
    --fz-h2: calc(var(--fz-body) * 10 / 8.8888889);
    --fz-h3: calc(var(--fz-body) * 10 / 9.4117647);
    --fz-h4: calc(var(--fz-body) * 10 / 9.4117647);
    --fz-h6: 1rem;
    --fz-sm-h: calc(var(--fz-body) * 10 / 11.4285714);
    --fz-caption: calc(var(--fz-body) * 1 / 1.333333332);
    --fz-code: calc(var(--fz-body) * 10 / 11.4285714);
    --fz120: 1.2em;
    --fz110: 1.1em;
    --fz105: 1.05em;
    --fz100: 1em;
    --fz95: .95em;
    --fz90: .9em;
    --fz85: .85em;
    --fz80: .85em;
    --fz80: .8em;
    --wd-main: 1080px;
    --wd-article: 1080px;
    --width-50: 50%;
    --width-40: 40%;
    --sp0: 0;
    --sp1: .125rem;
    --sp2: .25rem;
    --sp3: .5rem;
    --sp4: calc(1rem * 1 / 1.333333332);
    --sp5: 1rem;
    --sp6: 1.5rem;
    --sp7: 2rem;
    --sp8: 3rem;
    --spm5: -1rem;
    --rd0: 0;
    --rd1: .125rem;
    --rd2: .25rem;
    --rd3: .5rem;
    --rd4: calc(1rem * 1 / 1.333333332);
    --rd5: 1rem;
    --rd6: 1.5rem;
    --rd7: 2rem;
    --rdr: 99rem
}

body {
    position: relative;
    font-family: "BIZ UDPGothic", "BIZ UDGothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif;
    font-size: 1rem;
    /* font-size: 85%; */
    /* font-feature-settings: "palt"; */
    letter-spacing: 1px;
    line-height: 1.5em;
    -webkit-text-size-adjust: 100%;
    color: var(--gr90);
    background-color: var(--body)
}

h1 {
    font-size: 137.55%
}

h2 {
    font-size: 112.50%
}

h3 {
    font-size: 106.25%
}

h4 {
    font-size: 106.25%
}

h5 {
    font-size: 106.25%
}

h6 {
    font-size: 100%
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    line-height: 1.4em
}

img {
    width: 100%;
    height: auto
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
ul,
blockquote {
    margin: 0;
    padding: 0;
    list-style: none
}

*,
*:before,
*:after {
    box-sizing: border-box
}

a {
    color: inherit;
    text-decoration: none;
    transition: all .2s
}

input,
textarea,
button {
    appearance: none
}

.dark,
.dark * {
    --body: #222;
    --text: #fff;
    --white: #000;
    --gr5: #111;
    --gr10: #222;
    --gr15: #333;
    --gr20: #555;
    --gr25: #666;
    --gr30: #777;
    --gr40: #888;
    --gr50: #999;
    --gr60: #aaa;
    --gr70: #bbb;
    --gr80: #ccc;
    --gr85: #ddd;
    --gr90: #eee;
    --gr95: #f3f3f3;
    --dark: #f9f9f9;
    --black: #fff;
    --gr90-always: #333;
    --black-always: #000;
    --tag: #555;
    --submenu: #333;
    --h3bg: #2f2f2f;
    --shadow: #000;
    --link: #6c99ee;
    --green: #2f2f2f;
    --PClr: #111;
    --SPClr: #222;
    --ThClr: #333;
    --HWrap: #333;
}

code,
pre {
    border-radius: var(--rd3);
    font-size: 87.5%
}

code {
    padding: var(--sp1) var(--sp2);
    background-color: var(--gr15)
}

pre {
    padding: var(--sp4) var(--sp5);
    line-height: 1.6;
    background-color: #0d1117;
    white-space: pre !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    letter-spacing: 0
}

pre code {
    padding: var(--sp2) 0;
    background-color: transparent
}

@media (min-width: 769px) {
    pre code {
        line-height: 1.7
    }
}

br.br_resp {
    display: inline;
}

@media (min-width: 769px) {
    br.br_resp {
        display: none;
    }
}

.spaceBetween,
.spaceBetweenSp2 {
    display: flex;
    justify-content: space-between;
    align-items: center
}

@media (max-width: 1440px) {
    .spaceBetweenSp2>* {
        width: 50%
    }

    .spaceBetweenSp2 {
        flex-wrap: wrap
    }
}

p.hide {
    display: none;
}

.sideBySide,
.flexContainer,
.sideBySideCenter {
    display: flex;
    flex-direction: column
}

@media (min-width: 769px) {

    .sideBySide,
    .flexContainer,
    .sideBySideCenter {
        flex-direction: row;
        justify-content: space-between
    }
}

.sideBySideLeft {
    display: flex;
    flex-direction: row;
    justify-content: left
}

.sideBySideCenter {
    align-items: center;
    text-align: center
}

@media (max-width: 1440px) {
    .sideBySideCenter {
        text-align: left
    }
}

.flexContainer {
    gap: var(--sp5);
    margin: var(--sp5) 0 var(--sp6)
}

.Main {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 100%
}

.containerMain {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 100%
}

@media (min-width: 769px) {
    .containerMain {
        max-width: var(--wd-main)
    }
}

.container-full {
    width: 100%;
}

.containerArticle {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 100%
}

@media (min-width: 769px) {
    .containerArticle {
        max-width: var(--wd-article)
    }
}

.woodborder {
    background-image: url('fileadmin_templates_data_files_ksjc_border.png');
    background-repeat: repeat-x;
    height: 1rem;
    width: 100%;
    background-size: contain;
    background-position-y: bottom;

}

.siteInformation {
    color: var(--black);
    background-color: var(--gr20);
    font-size: 90%;
}

.footer {
    background-color: var(--SPClr);
    font-size: 90%;
}

.footer {
    color: #fff;
}

.footerMenu2 {
    background-color: var(--PClr);
}

.footerMenu1 A,
.footerMenu2 A {
    color: #fff;
    white-space: nowrap;
}

.copyright {
    font-size: 90%;
}




.spMd2 {
    display: grid;
    grid-template-columns: 1fr 1fr
}

.spMd2-1fr-a {
    display: grid;
    grid-template-columns: 1fr auto
}

.spMd3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr
}

.sp1Md2 {
    display: block
}

@media (min-width: 769px) {
    .sp1Md2 {
        display: grid;
        grid-template-columns: 1fr 1fr
    }
}

.sp1Md3 {
    display: block
}

@media (min-width: 769px) {
    .sp1Md3 {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr
    }
}

.sp1Md4 {
    display: block
}

@media (min-width: 769px) {
    .sp1Md4 {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr
    }
}

.sp2Md3 {
    display: grid;
    grid-template-columns: 1fr 1fr
}

@media (min-width: 769px) {
    .sp2Md3 {
        grid-template-columns: 1fr 1fr 1fr
    }
}

.sp2Md4 {
    display: grid;
    grid-template-columns: 1fr 1fr
}

@media (min-width: 769px) {
    .sp2Md4 {
        grid-template-columns: 1fr 1fr 1fr 1fr
    }
}

.sp2Md5 {
    display: grid;
    grid-template-columns: 1fr 1fr
}

@media (min-width: 769px) {
    .sp2Md5 {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr
    }
}

.sp2Md160Auto {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

@media (min-width: 769px) {
    .sp2Md160Auto {
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr))
    }
}

.sp2Md200Auto {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

@media (min-width: 769px) {
    .sp2Md200Auto {
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr))
    }
}

.hbgMenu {
    position: relative;
    z-index: 2
}

.hbgItems {
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: var(--sp4) var(--sp6) var(--sp7);
    position: absolute;
    top: 100%;
    left: 0;
    transform: translateY(10px);
    transition: .3s;
    width: 100%;
    height: auto;
    background-color: var(--body);
    visibility: hidden;
    opacity: 0
}

#hbg:checked~.hbgItems {
    display: flex;
    visibility: visible;
    transform: translate(0);
    opacity: 1
}

.hbgInput,
.hbgBtn {
    display: none
}

.hbgBtn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--sp3);
    margin-right: var(--sp3);
    border: none;
    width: 30px;
    height: 30px;
    background-color: transparent;
    appearance: none;
    cursor: pointer
}

@media (min-width: 769px) {
    .hbgBtn {
        display: none;
    }
}

.hbgBtn .hbgL {
    display: block;
    width: 28px;
    height: 2px;
    transition: .3s;
    background-color: var(--text)
}

#hbg:checked~.hbgBtn .hbgL:nth-of-type(1) {
    transform: translate(2px) rotate(45deg);
    transform-origin: 0%
}

#hbg:checked~.hbgBtn .hbgL:nth-of-type(2) {
    opacity: 0
}

#hbg:checked~.hbgBtn .hbgL:nth-of-type(3) {
    transform: translate(2px) rotate(-45deg);
    transform-origin: 0%
}

.header_wrap {
    width: 100%;
    background: var(--HWrap);
}

.header {
    display: flex;
    justify-content: space-between;
    align-items: initial;
    margin-left: auto;
    margin-right: auto;
    padding: var(--sp2) var(--sp2);
    width: 100%;
    max-width: var(--wd-main)
}

@media (min-width: 769px) {
    .header {
        padding: var(--sp4) var(--sp2)
    }
}

.logo {
    height: 64px;
    width: 260px;
}

@media (min-width:621px) {
    .logo {
        height: 80px;
        width: 340px;
    }
}

.logo a picture {
    height: 64px;
}

@media (min-width:621px) {
    .logo a picture {
        height: 80px;
    }

    .logo a picture,
    .logo a picture img {
        /* filter: drop-shadow(1px 1px 2px rgba(50, 100, 0, 0.5)); */
    }
}

.dark .logo a {
    height: 64px;
    width: 260px;
    background-image: url('http://www.kitaqshinsyo.com/fileadmin/templates/data_files/logo_ksjc.webp');
    background-size: contain;
    background-repeat: no-repeat;
}

@media (min-width:621px) {
    .dark .logo a {
        height: 80px;
        width: 340px;
    }
}

.dark .logo a img {
    display: none;
}

.headerInner {
    display: flex;
    align-items: center;
}

.headerInnerBox {
    display: flex;
    justify-content: right;
    align-items: center;
    gap: var(--sp3);
    font-size: 95%;
    padding: var(--sp4) var(--sp5);
    border-radius: var(--rd4);
    background: #aadc88;
}

.navItem {
    list-style: none;
    text-decoration: none
}

.navLink {
    display: block;
    padding: var(--sp3) 0px;
    width: 100%;
    text-decoration: none;
    color: var(--text);
    font-weight: 700;
}

.navLink:hover,
.navLink:active {
    opacity: .8
}

.headerMainMenu {
    display: none;
}

@media (min-width:621px) {
    .headerMainMenu {
        display: block;
        background: var(--ThClr);
    }

    .navItemBox {
        margin-left: auto;
        margin-right: auto;
        max-width: var(--wd-main);
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        list-style: none;
        padding: 0 var(--sp3);
        background: var(--gr20);
    }

    .navItemBox .navLink {
        padding: var(--sp3) var(--sp5);
    }

    .navItemBox .navLink:hover,
    .navItemBox .navLink:active {
        background: var(--gr90);
        color: var(--white);
    }
}

.textonlyBtn {
    align-items: center;
    display: flex;
    transition: all .2s
}

.textonlyBtn:hover,
.textonlyBtn:active {
    opacity: .8;
    cursor: pointer
}

#themeToggle {
    align-items: center;
    display: flex;
    transition: all .2s
}

#themeToggle:hover,
#themeToggle:active {
    opacity: .8;
    cursor: pointer
}

.sun {
    fill: #000
}

.moon,
.dark .sun {
    fill: transparent
}

.dark .moon {
    fill: #fff
}

.siteLogo img {
    width: 160px
}

@media (min-width: 769px) {
    .siteLogo {
        width: 200px
    }
}

.siteLogoSvg path {
    stroke: none;
    fill-rule: nonzero;
    fill: #000;
    fill-opacity: 1
}

.dark .siteLogoSvg path {
    fill: #fff
}

.ulBase li,
.ulBaseBorder li {
    padding-left: 1em;
    text-indent: -1em
}

.ulBase li:before,
.ulBaseBorder li:before {
    display: inline-block;
    margin-right: .3333333333rem;
    position: relative;
    top: 0;
    border-radius: var(--rdr);
    content: "";
    width: 10px;
    height: 10px;
    font-size: 10px;
    background-color: var(--gr30)
}

.ulBaseBorder {
    padding: var(--sp5);
    border-radius: var(--rd3);
    border: 1px solid var(--gr20)
}

.btnBase {
    display: block;
    position: relative;
    padding: var(--sp5);
    border-radius: var(--rdr);
    width: 14rem;
    text-align: center;
    text-decoration: none;
    background-color: var(--submenu);
    box-shadow: 0 3px 0 var(--gr20);
    transition: all .2s
}

.btnBase:link,
.btnBase:visited {
    color: var(--black)
}

.btnBase:hover,
.btnBase:active {
    opacity: .9
}

.btnSubMenu {
    display: block;
    padding: var(--sp5);
    border-radius: var(--rd3);
    font-size: 95%;
    text-align: center;
    background-color: var(--submenu);
    border: 1px solid var(--gr15);
    box-shadow: 0 2px 0 var(--gr15)
}

.btnSubMenu:hover,
.btnSubMenu:active {
    opacity: .8
}

.btnCat {
    display: block;
    text-align: center;
    font-size: 90%;
    padding: var(--sp4) var(--sp5);
    background-color: var(--tag);
    border-radius: var(--rdr);
    box-shadow: 0 2px 0 var(--gr15)
}

.btnCat:hover,
.btnCat:active {
    opacity: .8
}

.dark .btnBase,
.dark .btnSubMenu,
.dark .btnCat {
    box-shadow: 0 2px 0 var(--black-always)
}

.tableBase {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    font-size: 90%
}

.tableBase th {
    padding: var(--sp3) var(--sp4);
    border: solid 1px var(--gr20);
    background: var(--gr5)
}

.tableBase td {
    padding: var(--sp3) var(--sp4);
    border: solid 1px var(--gr20)
}

.dark .tableBase th {
    background: var(--gr5);
    border: solid 1px var(--gr20)
}

.dark .tableBase td {
    border: solid 1px var(--gr20)
}

.share {
    display: flex;
    justify-content: center;
    gap: var(--sp3);
    align-items: center;
    margin: var(--sp5);
    border-radius: var(--rd3)
}

.shareItems {
    display: flex;
    padding: var(--sp2);
    gap: var(--sp3)
}

.shareItems a {
    display: flex;
    align-items: center
}

.shareItems svg {
    width: 24px;
    height: 24px
}

.toc {
    margin-top: var(--sp5);
    padding: var(--sp6);
    border: 1px solid var(--gr20);
    border-radius: var(--rd3)
}

.tocTitle {
    text-align: center;
    position: relative;
    font-weight: 600
}

.tocTitle:after {
    position: absolute;
    width: 20px;
    height: 2px;
    background-color: var(--gr40);
    content: "";
    bottom: -4px;
    left: calc(50% - 10px);
    transform: tranlateX(-50%)
}

.tocList {
    margin-top: var(--sp6)
}

.tocList>* {
    color: var(--gr80);
    line-height: 1.4;
    font-size: 90%
}

.tocList>*+* {
    margin-top: var(--sp4)
}

.tocList .h3 {
    padding-left: 1em
}

.tocList .h4 {
    padding-left: 2em
}

.tocList .h5 {
    padding-left: 3em
}

.tocList .h6 {
    padding-left: 4em
}

article.genPhoto {
    background: var(--PClr);
    border-radius: var(--rd3);
    display: grid;
}

/* .genPhoto img {
    filter: brightness(110%);
} */
.genPhoto a {
    display: grid;
}

.genPhoto img {
    border-radius: var(--rd3) var(--rd3) 0 0;
}

@media (min-width: 769px) {

    .genPhoto a:hover,
    .genPhoto a:active {
        opacity: .8;
    }
}

.genPhoto h6 {
    color: white;
    background: var(--PClr);
    border-radius: 0 0 10px 10px;
    margin-top: -0.3rem !important;
}

.genPhoto h6 br {
    display: inline;
}

@media (min-width: 769px) {
    .genPhoto h6 br {
        display: none;
    }
}

.Anews h2,
.Anews .postBody h2 {
    color: #ffffff;
    border: 0;
    background-color: var(--PClr);
    padding: var(--sp4) var(--sp4);
    border-radius: var(--rd3) var(--rd3) 0 0;
}

.postBody {
    width: 100%;
    padding: var(--sp6) 0 var(--sp6);
    line-height: 1.7;
    font-size: var(--body-fz);
}

.postBody p {
    line-height: 1.65
}

.postBody p img {
    vertical-align: top
}

.postBody strong {
    font-weight: 600
}

.postBody small {
    font-size: 90%;
    color: var(--gr90)
}

.postBody blockquote {
    padding: var(--sp5);
    border-radius: var(--rd3);
    font-size: 95%;
    color: var(--gr90);
    background-color: var(--gr5)
}

.postBody cite {
    display: block;
    margin-top: var(--sp2) !important;
    font-style: normal;
    font-size: 95%;
    text-align: right;
    color: var(--gr85)
}

.postBody h2 {
    border-top: 1px solid var(--text);
    border-bottom: 1px solid var(--text);
    padding: var(--sp4) var(--sp4)
}

.postBody h3 {
    background-color: var(--h3bg);
    background-color: var(--PClr);
    color: white;
    padding: var(--sp4);
    border-radius: var(--rd3);
    line-height: 1.5
}

.postBody h4 {
    padding-left: var(--sp3);
    border-left: 4px solid var(--gr15)
}

.postBody h6 {
    color: var(--gr80)
}

.postBody>*+* {
    margin-top: var(--sp5)
}

.postBody>*+h2,
.postBody>*+h3,
.postBody>*+h4,
.postBody>*+h5,
.postBody>*+h6 {
    margin-top: var(--sp7)
}

.postBody>*+table {
    margin-top: var(--sp6)
}

.postBody>*+ul,
.postBody>*+ol {
    margin-top: var(--sp6)
}

.Anews .postBody>*+ul,
.Anews .postBody>*+ol {
    margin-top: 0;
    background-color: var(--white);
    box-shadow: 1px 1px 2px rgba(0 0 0 / 25%);
}

.Anews .Anewsbody {
    padding: var(--sp7);
    margin-top: 0;
    font-weight: bold;
    background-color: var(--white);
    box-shadow: 1px 1px 2px rgba(0 0 0 / 25%);
}

.Anewsbody.Closing {

    H1,
    H2,
    H3,
    H4,
    H5,
    H6 {
        margin-top: 1.4rem;
        margin-bottom: .5rem;
    }

    H1:first-child,
    H2:first-child,
    H3:first-child,
    H4:first-child,
    H5:first-child,
    H6:first-child {
        margin-top: 0;
    }
}

.Anewsbody.Closing img {
    max-width: 100%;
}

.unit_singleContent {
    font-weight: bold;
    padding: 1rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
    background: var(--white);
    box-shadow: 1px 1px 2px rgba(0 0 0 / 25%);
}

.unit_singleContent .csc-default {
    padding: 1rem;
}

.unit_singleContent .csc-default h2.csc-firstHeader {
    margin-top: -2.5rem;
    margin-left: -2rem;
    margin-right: -2rem;
    margin-bottom: 0;
}

.postBody .unit_singleContent h3 {
    margin-bottom: .6rem;
}

.postBody.Bnews ul,
.postBody.Bnews ol {
    margin-top: 0;
}

.postBody.Bnews ul li,
.postBody.Bnews ol li {
    padding: var(--sp3) var(--sp1);
    border-bottom: 1px solid var(--gr20);
}

.Bnews .ulBase li:before,
.Bnews .ulBaseBorder li:before {
    margin-left: 20px;
}

.Bnews h2,
.Bnews .postBody h2 {
    color: #ffffff;
    border: 0;
    background-color: var(--PClr);
    padding: var(--sp4) var(--sp4);
    border-radius: var(--rd3);
}

.Bnews .postBody {
    margin-top: 0;
    padding-top: 0;
}

.Bnews .postBody ul,
.Bnews .postBody ol {
    margin-top: 0;
}

.Bnews .postBody ul li,
.Bnews .postBody li {
    padding: var(--sp3) var(--sp1);
    border-bottom: 1px solid var(--gr20);
}

.Bnews .ulBase li:before,
.Bnews .ulBaseBorder li:before {
    margin-left: 20px;
}

.Bnews h2,
.Bnews .postBody h2 {
    color: #ffffff;
    border: 0;
    background-color: var(--PClr);
    padding: var(--sp4) var(--sp4);
    border-radius: var(--rd3);
}


button {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: var(--sp4) 0;
    border: 0;
    border-radius: var(--rdr);
    width: 200px;
    font-size: %100);
    color: var(--black);
    background-color: var(--submenu);
    box-shadow: 0 3px 0 var(--gr20);
    transition: all .2s
}

button:hover,
button:active {
    opacity: .8
}

.dark button {
    background-color: var(--submenu);
    box-shadow: 0 2px 0 var(--black-always)
}

.search-form-2 {
    display: none;
}

@media (min-width: 769px) {
    .search-form-2 {
        display: flex;
        align-items: center;
        overflow: hidden;
        border: 2px solid #01a706;
        border-radius: 20px;
    }
}

.search-form-2 input {
    width: 100px;
    height: 40px;
    padding: 5px 15px;
    border: none;
    border-radius: 5px;
    box-sizing: border-box;
    background-color: #f2f2f2;
    font-size: .9em;
    outline: none;
}

@media (min-width: 769px) {
    .search-form-2 input {
        width: 120px;
    }
}

.search-form-2 input::placeholder {
    color: #777777;
}

a.search-form-2 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 40px;
    border: none;
    padding-left: 0.6rem;
    padding-right: 0.6rem;
    border-radius: 5px;
    background-color: #01a706;
    cursor: pointer;
    color: white;
}

a.search-form-2 strong {
    display: none;
}

a.search-form-2:before {
    width: 24px;
    height: 24px;
    background-image: url('data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E');
    background-repeat: no-repeat;
    content: '';
}

a.search-form-2:hover,
a.search-form-2:active {
    opacity: .8;
}

@media (min-width: 769px) {
    a.search-form-2 strong {
        display: flex;
    }
}

.textonlybtnWrap {
    display: none;
}

@media (min-width: 769px) {
    .textonlybtnWrap {
        display: block;
    }
}

a.textonlybtn {
    display: none;
}

@media (min-width: 769px) {
    a.textonlybtn {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 40px;
        padding-left: 0.6rem;
        padding-right: 0.6rem;
        border-radius: 5px;
        background-color: var(--gr15);
        cursor: pointer;
        color: var(--text);
    }
}

/*a.textonlybtn:before { 
width: 24px;
height: 24px;
background-image: url('data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M280-160v-520H80v-120h520v120H400v520H280Zm360 0v-320H520v-120h360v120H760v320H640Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E');
background-repeat: no-repeat;
content: '';
}
*/
.textonlybtn:hover,
.textonlybtn:active {
    opacity: .8;
    cursor: pointer
}


.fontsizebtnWrap {
    display: none;
}

@media (min-width: 769px) {
    .fontsizebtnWrap {
        display: flex;
        flex-wrap: nowrap;
    }
}

.fontsizebtn {
    display: none;
}

@media (min-width: 769px) {
    a.fontsizebtn {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 40px;
        padding-left: 0.6rem;
        padding-right: 0.6rem;
        border-radius: 5px;
        background-color: var(--gr10);
        cursor: pointer;
        color: var(--text);
        font-weight: bold;
        margin: 0 1px;
    }

    a.fontsizebtn.active {
        background: var(--PClr);
        color: white;
    }
}

/*a.fontsizebtn:before { 
width: 24px;
height: 24px;
background-image: url('data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M280-160v-520H80v-120h520v120H400v520H280Zm360 0v-320H520v-120h360v120H760v320H640Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E');
background-repeat: no-repeat;
content: '';
}
*/
.fontsizebtn:hover,
.fontsizebtn:active {
    opacity: .8;
    cursor: pointer
}



.bgclrbtnWrap {
    display: none;
}

@media (min-width: 769px) {
    .bgclrbtnWrap {
        display: block;
    }

    .bgclrbtn.moon,
    .dark .bgclrbtn.sun {
        display: none;
    }

    .bgclrbtn.sun,
    .dark .bgclrbtn.moon {
        display: flex;
    }

    .bgclrbtn {
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 40px;
        padding-left: 0.6rem;
        padding-right: 0.6rem;
        border-radius: 5px;
        background-color: var(--gr85);
        cursor: pointer;
        color: var(--white);
    }
}

/*a.bgclrbtn:before { 
width: 24px;
height: 24px;
background-image: url('data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M280-160v-520H80v-120h520v120H400v520H280Zm360 0v-320H520v-120h360v120H760v320H640Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E');
background-repeat: no-repeat;
content: '';
}
*/
.bgclrbtn:hover,
.bgclrbtn:active {
    opacity: .8;
    cursor: pointer
}

.breadCrumb {
    overflow-x: auto;
    margin: var(--sp3) 0 var(--sp3)
}

@media (min-width: 769px) {
    .breadCrumb {
        margin: var(--sp3) 0 var(--sp3)
    }
}

.breadCrumbItems {
    display: flex;
    margin: 0 0 var(--sp3) 0;
    padding: 0;
    gap: var(--sp1);
    list-style: none;
    white-space: nowrap
}

@media (min-width: 769px) {
    .breadCrumbItems {
        margin: 0 0 var(--sp3) 0
    }
}

.breadCrumbItem {
    list-style-type: none;
    font-size: 90%;
    color: var(--gr80);
    white-space: nowrap
}

.breadCrumbItem a:hover {
    text-decoration: underline
}

.author {
    margin: var(--sp6) 0;
    background-color: var(--gr5)
}

.authorInner {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: var(--sp5);
    align-items: center
}

.authorImage {
    aspect-ratio: 1/1
}

.authorImage img {
    border-radius: 100% !important
}

.pagination {
    display: block;
    justify-content: space-between;
    align-items: stretch
}

.pagination a {
    display: flex;
    gap: var(--sp3);
    padding: var(--sp4);
    border: 1px solid var(--gr15);
    border-radius: var(--rd3);
    align-items: center;
    box-shadow: 0 2px 0 var(--gr15)
}

.pagination a:hover,
.pagination a:active {
    opacity: .8
}

@media (min-width: 769px) {
    .pagination {
        display: flex;
        gap: var(--sp3)
    }

    .pagination a {
        width: 50%;
        align-items: center
    }
}

.dark .pagination a {
    box-shadow: 0 2px 0 var(--black-always)
}

.paginationNext {
    margin-left: auto;
    text-align: right;
    margin-top: var(--sp3);
    justify-content: flex-end
}

@media (min-width: 769px) {
    .paginationNext {
        margin-top: 0
    }
}

.paginationPrevText,
.paginationNextText {
    align-items: center;
    font-size: 90%;
    line-height: 1.475
}

.paginationPrevText div,
.paginationNextText div {
    font-size: 85%;
    color: var(--gr80);
    margin-bottom: var(--sp2)
}

.listPagination {
    display: flex;
    gap: var(--sp3);
    margin-top: var(--sp7);
    justify-content: space-between;
    align-items: stretch
}

.listPagination a {
    display: flex;
    gap: var(--sp3);
    padding: var(--sp4);
    border: 1px solid var(--gr15);
    border-radius: var(--rd3);
    align-items: center;
    width: 9em;
    box-shadow: 0 2px 0 var(--gr15)
}

.listPagination a:hover,
.listPagination a:active {
    opacity: .8
}

.dark .listPagination a {
    box-shadow: 0 2px 0 var(--black-always)
}

.listPaginationNext {
    margin-top: 0;
    text-align: right;
    justify-content: flex-end
}

.listPaginationPrevText,
.listPaginationNextText {
    align-items: center;
    font-size: 90%
}

.listPaginationPrevText span,
.listPaginationNextText span {
    font-size: 85%;
    color: var(--gr80)
}

.linkCardLink {
    display: block;
    margin: var(--sp6) 0
}

.linkCardLink:hover,
.linkCardLink:active {
    opacity: .8
}

.linkCard {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--sp4);
    padding: var(--sp5);
    border: 1px solid var(--gr15);
    border-radius: var(--rd3);
    width: 100%;
    box-shadow: 0 2px 0 var(--gr15)
}

.linkCardText {
    width: 65%
}

.linkCardTitle {
    font-weight: 700;
    font-size: 105%;
    line-height: 1.4;
    color: var(--gr80)
}

@media (min-width: 769px) {
    .linkCardTitle {
        font-size: 95%
    }
}

.linkCardUrl {
    margin-top: var(--sp1);
    font-size: 85%;
    color: var(--gr80)
}

.linkCardPic {
    width: 30%;
    aspect-ratio: 1/1;
    line-height: 1
}

.linkCardPic img {
    width: 90px;
    height: 90px;
    border-radius: var(--rd3);
    object-fit: cover
}

@media (min-width: 769px) {
    .linkCardPic {
        aspect-ratio: 3/2
    }

    .linkCardPic img {
        width: 100%;
        height: auto
    }
}

.dark .linkCard {
    border: 1px solid var(--gr15);
    background-color: var(--gr5);
    box-shadow: 0 2px 0 var(--gr5)
}

.gmap {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-bottom: 16px
}

.gmap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0
}

.scrollBannerWrap {
    overflow-x: scroll;
    padding-bottom: var(--sp3);
    margin-right: var(--spm5);
    margin-left: var(--spm5)
}

.scrollBanner {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    height: auto;
    gap: var(--sp5)
}

.scrollBanner li img {
    width: 190px;
    border-radius: var(--rd3)
}

.scrollBanner li:first-child {
    padding-left: var(--sp5)
}

.scrollBanner li:last-child {
    padding-right: var(--sp5)
}

@media (min-width: 769px) {
    .scrollBanner {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        overflow-x: initial;
        gap: var(--sp5)
    }

    .scrollBanner li img {
        width: 100%;
        border-radius: var(--rd3)
    }

    .scrollBanner li:first-child {
        padding-left: initial
    }

    .scrollBanner li:last-child {
        padding-right: initial
    }
}

.articleUpperAmazon {
    margin-top: var(--sp5);
    padding: var(--sp5) var(--sp5);
    border: 1px solid var(--gr20);
    border-radius: var(--rd3)
}

.dark .articleUpperAmazon {
    border: 1px solid var(--gr10);
    background-color: #111
}

.articleUpperAmazonTitle {
    margin-bottom: var(--sp4);
    padding: var(--sp3);
    padding-bottom: 7px;
    border-radius: 5px 5px 2px 2px;
    text-align: center;
    color: var(--white);
    background-color: var(--gr90);
    background: linear-gradient(180deg, #444 0%, #444 50%, #333 50%, #333 100%)
}

.dark .articleUpperAmazonTitle {
    font-weight: 700;
    color: var(--text);
    background: linear-gradient(180deg, #4f4f4f 0%, #4f4f4f 50%, #444 50%, #444 100%)
}

.articleUpperAmazonScrollProductItems {
    overflow-x: scroll;
    display: flex;
    display: -webkit-box;
    margin-top: var(--sp4);
    padding-bottom: var(--sp4)
}

.articleUpperAmazonScrollProductItems>div {
    width: 125px;
    height: auto;
    text-align: center;
    line-height: 1.4
}

.articleUpperAmazonScrollProductItems>div+div {
    margin-left: 10px
}

.articleUpperAmazonScrollProductItems a {
    display: block;
    text-decoration: none;
    font-size: 75%;
    line-height: 1.5;
    color: var(--link);
    font-feature-settings: "palt";
    letter-spacing: 0
}

.articleUpperAmazonScrollProductItems a .price {
    color: var(--gr60)
}

.articleUpperAmazonScrollProductItems a .price del {
    display: inline-block;
    margin-right: var(--sp3)
}

.articleUpperAmazonScrollProductItems img {
    display: block;
    margin-bottom: var(--sp2);
    border-radius: var(--rd3);
    width: 100%;
    height: auto
}

.articleUpperAmazonTextBlockItems {
    margin: var(--sp4) 0 0;
    padding: var(--sp4) var(--sp5);
    list-style: none;
    border-radius: 5px;
    background-color: #f3f3f3
}

.articleUpperAmazonTextBlockItems li+li {
    margin-top: var(--sp3)
}

.articleUpperAmazonTextBlockItems.feature {
    background-color: #fee
}

.articleUpperAmazonTextBlockItems.feature a:link,
.articleUpperAmazonTextBlockItems.feature a:visited,
.articleUpperAmazonTextBlockItems.feature a:hover,
.articleUpperAmazonTextBlockItems.feature a:active {
    color: #900
}

.dark .articleUpperAmazonTextBlockItems {
    background-color: #222
}

.dark .articleUpperAmazonTextBlockItems.feature a:link,
.dark .articleUpperAmazonTextBlockItems.feature a:visited,
.dark .articleUpperAmazonTextBlockItems.feature a:hover,
.dark .articleUpperAmazonTextBlockItems.feature a:active {
    color: var(--link)
}

.bgThClr {
    background-color: var(--ThClr)
}

.bgWhite {
    background-color: var(--white)
}

.bgGr5 {
    background-color: var(--gr5)
}

.bgGr10 {
    background-color: var(--gr10)
}

.bgTag {
    background-color: var(--tag)
}

.bgSubMenu {
    background-color: var(--submenu)
}

.bGr {
    border: 1px solid var(--gr15)
}

.radius0 {
    border-radius: var(--rd0)
}

.radius1 {
    border-radius: var(--rd1)
}

.radius2 {
    border-radius: var(--rd2)
}

.radius3 {
    border-radius: var(--rd3)
}

.radius4 {
    border-radius: var(--rd4)
}

.radius5 {
    border-radius: var(--rd5)
}

.radius6 {
    border-radius: var(--rd6)
}

.radius7 {
    border-radius: var(--rd7)
}

.radius8 {
    border-radius: var(--rd8)
}

.radiusChildImg img {
    border-radius: var(--rd3)
}

.radiusRound {
    border-radius: var(--rdr)
}

.grid {
    display: grid
}

.block {
    display: block
}

.inlineBlock {
    display: inline-block
}

.inline {
    display: inline
}

.inlineFlex {
    display: inline-flex
}

.table {
    display: table
}

.tableCell {
    display: table-cell
}

.flex {
    display: flex
}

.srOnly {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0
}

.spShow {
    display: block
}

@media (min-width: 769px) {
    .spShow {
        display: none
    }
}

.mdShow {
    display: none
}

@media (min-width: 769px) {
    .mdShow {
        display: block
    }
}

.alignCenter {
    align-items: center
}

.justifyBetween {
    justify-content: space-between
}

.justifyCenter {
    justify-content: center
}

.justifyStart {
    justify-content: flex-start
}

.justifyEnd {
    justify-content: flex-end
}

.boxShadow,
.dark .boxShadow {
    box-shadow: 0 2px 0 var(--shadow)
}

.fz80 {
    font-size: .8em
}

.fz85 {
    font-size: .85em
}

.fz90 {
    font-size: .9em
}

.fz95 {
    font-size: .95em
}

.fz100 {
    font-size: 1em
}

.fz105 {
    font-size: 1.05em
}

.fz110 {
    font-size: 1.1em
}

.fz115 {
    font-size: 1.15em
}

.fz120 {
    font-size: 1.2em
}

.fz140 {
    font-size: 1.4em
}

.fwT {
    font-weight: 400
}

.fwN {
    font-weight: 500
}

.fwB {
    font-weight: 600
}

.marker {
    background: linear-gradient(transparent 70%, rgba(166, 193, 238, .4) 0)
}

.gap0 {
    gap: var(--sp0)
}

.st0>*+* {
    margin-top: var(--sp0)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp0) + 1)
}

.mt0 {
    margin-top: var(--sp0)
}

.mb0 {
    margin-bottom: var(--sp0)
}

.pt0 {
    padding-top: var(--sp0)
}

.pb0 {
    padding-bottom: var(--sp0)
}

.py0 {
    padding-top: var(--sp0);
    padding-bottom: var(--sp0)
}

.px0 {
    padding-left: var(--sp0);
    padding-right: var(--sp0)
}

.p0 {
    padding: var(--sp0)
}

@media (min-width: 769px) {
    .md\:gap0 {
        gap: var(--sp0) !important
    }

    .md\:st0>*+* {
        margin-top: var(--sp0) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp0) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt0 {
        margin-top: var(--sp0) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb0 {
        margin-bottom: var(--sp0) !important
    }

    .md\:ml0 {
        margin-left: var(--sp0) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt0 {
        padding-top: var(--sp0) !important
    }

    .md\:pb0 {
        padding-bottom: var(--sp0) !important
    }

    .md\:py0 {
        padding-top: var(--sp0) !important;
        padding-bottom: var(--sp0) !important
    }

    .md\:px0 {
        padding-left: var(--sp0) !important;
        padding-right: var(--sp0) !important
    }

    .md\:p0 {
        padding: var(--sp0) !important
    }
}

.gap1 {
    gap: var(--sp1)
}

.st1>*+* {
    margin-top: var(--sp1)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp1) + 1)
}

.mt1 {
    margin-top: var(--sp1)
}

.mb1 {
    margin-bottom: var(--sp1)
}

.pt1 {
    padding-top: var(--sp1)
}

.pb1 {
    padding-bottom: var(--sp1)
}

.py1 {
    padding-top: var(--sp1);
    padding-bottom: var(--sp1)
}

.px1 {
    padding-left: var(--sp1);
    padding-right: var(--sp1)
}

.p1 {
    padding: var(--sp1)
}

@media (min-width: 769px) {
    .md\:gap1 {
        gap: var(--sp1) !important
    }

    .md\:st1>*+* {
        margin-top: var(--sp1) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp1) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt1 {
        margin-top: var(--sp1) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb1 {
        margin-bottom: var(--sp1) !important
    }

    .md\:ml1 {
        margin-left: var(--sp1) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt1 {
        padding-top: var(--sp1) !important
    }

    .md\:pb1 {
        padding-bottom: var(--sp1) !important
    }

    .md\:py1 {
        padding-top: var(--sp1) !important;
        padding-bottom: var(--sp1) !important
    }

    .md\:px1 {
        padding-left: var(--sp1) !important;
        padding-right: var(--sp1) !important
    }

    .md\:p1 {
        padding: var(--sp1) !important
    }
}

.gap2 {
    gap: var(--sp2)
}

.st2>*+* {
    margin-top: var(--sp2)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp2) + 1)
}

.mt2 {
    margin-top: var(--sp2)
}

.mb2 {
    margin-bottom: var(--sp2)
}

.pt2 {
    padding-top: var(--sp2)
}

.pb2 {
    padding-bottom: var(--sp2)
}

.py2 {
    padding-top: var(--sp2);
    padding-bottom: var(--sp2)
}

.px2 {
    padding-left: var(--sp2);
    padding-right: var(--sp2)
}

.p2 {
    padding: var(--sp2)
}

@media (min-width: 769px) {
    .md\:gap2 {
        gap: var(--sp2) !important
    }

    .md\:st2>*+* {
        margin-top: var(--sp2) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp2) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt2 {
        margin-top: var(--sp2) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb2 {
        margin-bottom: var(--sp2) !important
    }

    .md\:ml2 {
        margin-left: var(--sp2) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt2 {
        padding-top: var(--sp2) !important
    }

    .md\:pb2 {
        padding-bottom: var(--sp2) !important
    }

    .md\:py2 {
        padding-top: var(--sp2) !important;
        padding-bottom: var(--sp2) !important
    }

    .md\:px2 {
        padding-left: var(--sp2) !important;
        padding-right: var(--sp2) !important
    }

    .md\:p2 {
        padding: var(--sp2) !important
    }
}

.gap3 {
    gap: var(--sp3)
}

.st3>*+* {
    margin-top: var(--sp3)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp3) + 1)
}

.mt3 {
    margin-top: var(--sp3)
}

.mb3 {
    margin-bottom: var(--sp3)
}

.pt3 {
    padding-top: var(--sp3)
}

.pb3 {
    padding-bottom: var(--sp3)
}

.py3 {
    padding-top: var(--sp3);
    padding-bottom: var(--sp3)
}

.px3 {
    padding-left: var(--sp3);
    padding-right: var(--sp3)
}

.p3 {
    padding: var(--sp3)
}

@media (min-width: 769px) {
    .md\:gap3 {
        gap: var(--sp3) !important
    }

    .md\:st3>*+* {
        margin-top: var(--sp3) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp3) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt3 {
        margin-top: var(--sp3) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb3 {
        margin-bottom: var(--sp3) !important
    }

    .md\:ml3 {
        margin-left: var(--sp3) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt3 {
        padding-top: var(--sp3) !important
    }

    .md\:pb3 {
        padding-bottom: var(--sp3) !important
    }

    .md\:py3 {
        padding-top: var(--sp3) !important;
        padding-bottom: var(--sp3) !important
    }

    .md\:px3 {
        padding-left: var(--sp3) !important;
        padding-right: var(--sp3) !important
    }

    .md\:p3 {
        padding: var(--sp3) !important
    }
}

.gap4 {
    gap: var(--sp4)
}

.st4>*+* {
    margin-top: var(--sp4)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp4) + 1)
}

.mt4 {
    margin-top: var(--sp4)
}

.mb4 {
    margin-bottom: var(--sp4)
}

.pt4 {
    padding-top: var(--sp4)
}

.pb4 {
    padding-bottom: var(--sp4)
}

.py4 {
    padding-top: var(--sp4);
    padding-bottom: var(--sp4)
}

.px4 {
    padding-left: var(--sp4);
    padding-right: var(--sp4)
}

.p4 {
    padding: var(--sp4)
}

@media (min-width: 769px) {
    .md\:gap4 {
        gap: var(--sp4) !important
    }

    .md\:st4>*+* {
        margin-top: var(--sp4) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp4) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt4 {
        margin-top: var(--sp4) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb4 {
        margin-bottom: var(--sp4) !important
    }

    .md\:ml4 {
        margin-left: var(--sp4) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt4 {
        padding-top: var(--sp4) !important
    }

    .md\:pb4 {
        padding-bottom: var(--sp4) !important
    }

    .md\:py4 {
        padding-top: var(--sp4) !important;
        padding-bottom: var(--sp4) !important
    }

    .md\:px4 {
        padding-left: var(--sp4) !important;
        padding-right: var(--sp4) !important
    }

    .md\:p4 {
        padding: var(--sp4) !important
    }
}

.gap5 {
    gap: var(--sp5)
}

.st5>*+* {
    margin-top: var(--sp5)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp5) + 1)
}

.mt5 {
    margin-top: var(--sp5)
}

.mb5 {
    margin-bottom: var(--sp5)
}

.pt5 {
    padding-top: var(--sp5)
}

.pb5 {
    padding-bottom: var(--sp5)
}

.py5 {
    padding-top: var(--sp5);
    padding-bottom: var(--sp5)
}

.px5 {
    padding-left: var(--sp5);
    padding-right: var(--sp5)
}

.p5 {
    padding: var(--sp5)
}

@media (min-width: 769px) {
    .md\:gap5 {
        gap: var(--sp5) !important
    }

    .md\:st5>*+* {
        margin-top: var(--sp5) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp5) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt5 {
        margin-top: var(--sp5) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb5 {
        margin-bottom: var(--sp5) !important
    }

    .md\:ml5 {
        margin-left: var(--sp5) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt5 {
        padding-top: var(--sp5) !important
    }

    .md\:pb5 {
        padding-bottom: var(--sp5) !important
    }

    .md\:py5 {
        padding-top: var(--sp5) !important;
        padding-bottom: var(--sp5) !important
    }

    .md\:px5 {
        padding-left: var(--sp5) !important;
        padding-right: var(--sp5) !important
    }

    .md\:p5 {
        padding: var(--sp5) !important
    }
}

.gap6 {
    gap: var(--sp6)
}

.st6>*+* {
    margin-top: var(--sp6)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp6) + 1)
}

.mt6 {
    margin-top: var(--sp6)
}

.mb6 {
    margin-bottom: var(--sp6)
}

.pt6 {
    padding-top: var(--sp6)
}

.pb6 {
    padding-bottom: var(--sp6)
}

.py6 {
    padding-top: var(--sp6);
    padding-bottom: var(--sp6)
}

.px6 {
    padding-left: var(--sp6);
    padding-right: var(--sp6)
}

.p6 {
    padding: var(--sp6)
}

@media (min-width: 769px) {
    .md\:gap6 {
        gap: var(--sp6) !important
    }

    .md\:st6>*+* {
        margin-top: var(--sp6) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp6) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt6 {
        margin-top: var(--sp6) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb6 {
        margin-bottom: var(--sp6) !important
    }

    .md\:ml6 {
        margin-left: var(--sp6) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt6 {
        padding-top: var(--sp6) !important
    }

    .md\:pb6 {
        padding-bottom: var(--sp6) !important
    }

    .md\:py6 {
        padding-top: var(--sp6) !important;
        padding-bottom: var(--sp6) !important
    }

    .md\:px6 {
        padding-left: var(--sp6) !important;
        padding-right: var(--sp6) !important
    }

    .md\:p6 {
        padding: var(--sp6) !important
    }
}

.gap7 {
    gap: var(--sp7)
}

.st7>*+* {
    margin-top: var(--sp7)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp7) + 1)
}

.mt7 {
    margin-top: var(--sp7)
}

.mb7 {
    margin-bottom: var(--sp7)
}

.pt7 {
    padding-top: var(--sp7)
}

.pb7 {
    padding-bottom: var(--sp7)
}

.py7 {
    padding-top: var(--sp7);
    padding-bottom: var(--sp7)
}

.px7 {
    padding-left: var(--sp7);
    padding-right: var(--sp7)
}

.p7 {
    padding: var(--sp7)
}

@media (min-width: 769px) {
    .md\:gap7 {
        gap: var(--sp7) !important
    }

    .md\:st7>*+* {
        margin-top: var(--sp7) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp7) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt7 {
        margin-top: var(--sp7) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb7 {
        margin-bottom: var(--sp7) !important
    }

    .md\:ml7 {
        margin-left: var(--sp7) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt7 {
        padding-top: var(--sp7) !important
    }

    .md\:pb7 {
        padding-bottom: var(--sp7) !important
    }

    .md\:py7 {
        padding-top: var(--sp7) !important;
        padding-bottom: var(--sp7) !important
    }

    .md\:px7 {
        padding-left: var(--sp7) !important;
        padding-right: var(--sp7) !important
    }

    .md\:p7 {
        padding: var(--sp7) !important
    }
}

.gap8 {
    gap: var(--sp8)
}

.st8>*+* {
    margin-top: var(--sp8)
}

.st>*+h2,
.st>*+h3,
.st>*+h4,
.st>*+h5,
.st>*+h6 {
    margin-top: calc(var(--sp8) + 1)
}

.mt8 {
    margin-top: var(--sp8)
}

.mb8 {
    margin-bottom: var(--sp8)
}

.mxA {
    margin-left: auto;
    margin-right: auto
}

.pt8 {
    padding-top: var(--sp8)
}

.pb8 {
    padding-bottom: var(--sp8)
}

.py8 {
    padding-top: var(--sp8);
    padding-bottom: var(--sp8)
}

.px8 {
    padding-left: var(--sp8);
    padding-right: var(--sp8)
}

.p8 {
    padding: var(--sp8)
}

@media (min-width: 769px) {
    .md\:gap8 {
        gap: var(--sp8) !important
    }

    .md\:st8>*+* {
        margin-top: var(--sp8) !important
    }

    .md\:st>*+h2,
    .md\:st>*+h3,
    .md\:st>*+h4,
    .md\:st>*+h5,
    .md\:st>*+h6 {
        margin-top: calc(var(--sp8) + 1) !important
    }

    .md\:mtA {
        margin-top: auto !important
    }

    .md\:mt8 {
        margin-top: var(--sp8) !important
    }

    .md\:mbA {
        margin-bottom: auto !important
    }

    .md\:mb8 {
        margin-bottom: var(--sp8) !important
    }

    .md\:ml8 {
        margin-left: var(--sp8) !important
    }

    .md\:mxA {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .md\:pt8 {
        padding-top: var(--sp8) !important
    }

    .md\:pb8 {
        padding-bottom: var(--sp8) !important
    }

    .md\:py8 {
        padding-top: var(--sp8) !important;
        padding-bottom: var(--sp8) !important
    }

    .md\:px8 {
        padding-left: var(--sp8) !important;
        padding-right: var(--sp8) !important
    }

    .md\:p8 {
        padding: var(--sp8) !important
    }
}

.ul {
    text-decoration: underline
}

.ulNone {
    text-decoration: none
}

.ulLink {
    text-decoration: underline
}

.ulLink:hover,
.ulLink:active {
    opacity: .8
}

.ulLink:link,
.ulLink:visited,
.ulLink:hover,
.ulLink:active {
    color: var(--link)
}

.tL {
    text-align: left
}

.tR {
    text-align: right
}

.tC {
    text-align: center
}

.textJustify {
    text-align: justify
}

@media (min-width: 769px) {
    .md\:tL {
        text-align: left
    }

    .md\:tR {
        text-align: right
    }

    .md\:tC {
        text-align: center
    }

    .md\.textJustify {
        text-align: justify
    }
}

.gr50 {
    color: var(--gr50)
}

.gr60 {
    color: var(--gr60)
}

.gr70 {
    color: var(--gr70)
}

.gr80 {
    color: var(--gr80)
}

.lh1 {
    line-height: 1
}

.lh11 {
    line-height: 1.1
}

.lh12 {
    line-height: 1.2
}

.lh13 {
    line-height: 1.3
}

.lh14 {
    line-height: 1.4
}

.lh15 {
    line-height: 1.5
}

.lh16 {
    line-height: 1.6
}

.lh17 {
    line-height: 1.7
}

.lh18 {
    line-height: 1.8
}

.width40 {
    width: var(--width-40)
}

.width30 {
    width: var(--width-30)
}

@media (min-width: 769px) {
    .md\:width40 {
        width: var(--width-40)
    }

    .md\:width30 {
        width: var(--width-30)
    }
}

/* ------------------------------------ common1107css ----------------------------------------- */

/* GENERAL fonts */


/** Tables **/
table {
    border-right: 0;
    clear: both;
    margin-bottom: 10px;
    font-size: 100%;
    border-collapse: collapse;
    ;
}

th {
    text-align: left;
    padding: 4px;
}

th a {
    display: block;
    padding: 2px 4px;
    text-decoration: none;
}

th a.asc:after {
    content: ' ?';
}

th a.desc:after {
    content: ' ?';
}

table tr td {
    font-size: 100%;
    padding: 6px;
}

table tr:nth-child(2n) td {}

table .altrow td {}

table tr td P {
    margin: 0;
    padding: 0;
}

.voicearea_start {
    display: none;
}

.voicearea_thanks {
    display: none;
}

.voicearea_end {
    display: none;
}

#modified {
    display: none;
}

.newsmodified {
    display: none;
}

DIV#container {
    position: relative;
    margin: 0;
    padding: 180px 0 0 0;
}

.content_border_wrap {
    background: var(--gr10);
}

DIV#print_container {
    position: relative;
    width: 760px;
    font-size: 12px;
    height: auto;
    text-align: left;
    margin: 0 auto;
    padding: 0;
}

DIV.print_header {
    padding-bottom: 20px;
}

DIV#printbutton {
    padding: 16px 0;
    text-align: center;
}

/* content header */
DIV#siteHeader {
    position: absolute;
    top: 0;
    left: 0;
    clear: both;
    width: 100%;
    height: 100px;
    padding: 0;
    text-align: left;
    background: #48ab06;
}

DIV.headerwrap {
    width: 980px;
    height: 100px;
    margin: 0 auto;
    background: url('fileadmin_templates_images_shinsyou_headerwrap_bg.gif') 82% 72px no-repeat;
}

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

DIV#logo {
    float: left;
    display: block;
    height: 95px;
    width: 354px;
    margin: 8px 0 0 0;
    border: 0;
}

DIV#logo a {
    display: block;
    width: 340px;
    height: 80px;
}

DIV#logo a img {
    width: 340px;
    height: 80px;
}

DIV#headerImage p {
    text-indent: -9999px;
}

.header_search {
    float: right;
    padding: 16px 10px 0 0;
    margin: 0;
    vertical-align: text-bottom;
}

.go-button {
    font-size: 11px;
    color: #666666;
    padding: 2px 2px 0 2px;
    margin-left: 3px;
}

DIV.header_right {
    float: right;
    height: 57px;
    width: 602px;
    padding: 0;
    /* margin: 3px 0 0 0; */
    margin: 0;
    background: url('fileadmin_templates_images_shinsyou_atool_bg.gif') 0 0 no-repeat;
}


.header_right_text {
    float: right;
    height: 37px;
    padding: 0;
    margin: 2px 15px 0 2px;
}

.textonlybtnWrap {
    display: block;
}

a.textonlybtn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 34px;
    padding: 0 .4rem;
    border-radius: 5px;
    background-color: #fefefe;
    cursor: pointer;
    color: #333333;
    text-decoration: none;
}

.textonlybtn:hover,
.textonlybtn:active {
    opacity: .8;
    cursor: pointer
}

/* 2024ヘッダーメニュー　ここから */
.headerMainMenu {
    position: absolute;
    top: 100px;
    left: 0;
    margin: 0 auto;
    width: 100%;
    /* border-top: 2px solid #d3d3d3; */
    /* border-bottom: 3px solid #d9d9d9; */
    /* background: #ffffff; */
    letter-spacing: 1px;
    line-height: 1.5em;
    -webkit-text-size-adjust: 100%;
    z-index: 101;
}

.navItem {
    list-style: none;
    text-decoration: none;
    line-height: 1.4;
    padding: 0;
    background: none;
}

.navLink {
    display: block;
    padding: .5rem 0;
    /* width: 100%; */
    text-decoration: none;
    font-size: 1rem;
    color: #333;
    font-weight: 700;
    line-height: 1.5rem;
    transition: all .2s;
}

.active .navLink,
.navLink:hover,
.navLink:active {
    opacity: .8
}

/* .headerMainMenu {
    display: block;
    background: var(--ThClr);
} */

.navItemBox {
    max-width: 1008px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    list-style: none;
    padding: 0 .5rem;
    margin: 0 auto;
    background: #e6e6e6;
}

.navItemBox .navLink {
    padding: .5rem 1rem;
}

.navItemBox .navLink:hover,
.navItemBox .navLink:active,
.navItemBox .active .navLink {
    background: #333;
    color: #fff;
}

/* 2024ヘッダーメニュー　ここまで */


DIV#footer_menu01_wrap {
    clear: both;
    padding: 0;
    width: 100%;
    margin: 0 auto;
    background: #44770B;
    border-top: 1px solid #3D6B0A;
}

DIV#footer_space {
    width: 980px;
    padding: 0;
    margin: 0 auto;
    text-align: left;
}

DIV#footer_space ul {
    list-style: none;
    height: 21px;
    padding: 5px 0;
    margin: 0;
}

DIV#footer_space li {
    float: right;
    font-size: 12px !important;
    list-style: none;
    padding: 3px 10px 3px 10px;
    margin: 0;
    background: none;
}

DIV#footer_space li a {
    color: #ffffff;
    font-weight: normal;
    text-decoration: none;
}

DIV.footer_menu02_wrap {
    width: 100%;
    padding: 0;
    background: #559C0E;
    border-top: 1px solid #8AB748;
}

DIV.footer_menu02 {
    width: 998px;
    text-align: center;
    font-size: 13px !important;
    margin: 0 auto;
    padding: 16px 0 60px;
    color: #eeeeee;
}

DIV.footer_menu02 A {
    font-weight: normal;
    color: #ffffff;
    text-decoration: none;
}

DIV.footer_menu03_wrap {
    width: 100%;
    padding: .5rem 0;
    background: #24a700;
}

DIV.footer_menu03 {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    width: 998px;
    text-align: center;
    font-size: 1.06em !important;
    margin: .2rem auto;
    color: #ffffff;
}

DIV.footer_menu03 A {
    font-weight: normal;
    color: #ffffff;
    text-decoration: none;
}

br.br_resp {
    display: inline;
}

@media (min-width: 769px) {
    br.br_resp {
        display: none;
    }
}

.footer24 {
    color: #fff;
    background: #66cc00;
    letter-spacing: 1px;
    line-height: 1.5em;
    -webkit-text-size-adjust: 100%;
}

.footer_about_us {
    width: 998px;
    padding: 1rem;
    margin: 1rem auto .5rem;
    font-size: 14.4px;
}

.footerMenu2 {
    background-color: var(--PClr);
}

.footerMenu1 A,
.footerMenu2 A {
    color: #fff;
    white-space: nowrap;
}

.copyright {
    text-align: center;
    font-size: .9rem;
    padding: .6rem;
}

TABLE.contenttable-0 {
    width: 100%;
    font-size: 12px;
    line-height: 1.5;
}

TABLE.contenttable-0 td A {
    font-size: 12px;
}

TABLE.contenttable-0 caption {
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    padding-left: 8px;
}

TABLE.contenttable-0 TD.td-0 {
    padding: 5px 5px 3px 10px;
    border-bottom: 1px solid #eeeeee;
}

TABLE.contenttable-0 TD.td-1 {
    padding: 5px 5px 3px 12px;
    border-bottom: 1px solid #eeeeee;
}

TABLE.contenttable-0 TD.td-2 {
    padding: 5px 5px 3px 12px;
    border-bottom: 1px solid #eeeeee;
}

TABLE.contenttable-0 TR.tr-even {}

TABLE.contenttable-0 TR.tr-odd {}

TABLE.contenttable-0 TR.tr-odd TD.td-1 {}

TABLE.contenttable-1 {
    width: 100%;
    font-size: 12px;
    line-height: 1.5;
}

TABLE.contenttable-1 td A {
    font-size: 12px;
}

TABLE.contenttable-1 caption {
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    padding-left: 8px;
}

TABLE.contenttable-1 TD.td-0 {
    width: 20%;
    padding: 5px 5px 3px 10px;
    border-left: 4px solid #009900;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-1 TD.td-1 {
    padding: 5px 5px 3px 12px;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-1 TD.td-2 {
    padding: 5px 5px 3px 12px;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-1 TR.tr-even {
    background: #FFFFFF;
}

TABLE.contenttable-1 TR.tr-odd {
    background: #f5f5f5;
}

TABLE.contenttable-1 TR.tr-odd TD.td-1 {
    background: #f5f5f5;
}

TABLE.contenttable-2 {
    width: 100%;
    font-size: 12px;
    line-height: 1.5;
    border-collapse: collapse;
}

TABLE.contenttable-2 td A {
    font-size: 12px;
}

TABLE.contenttable-2 caption {
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    padding-left: 8px;
}

TABLE.contenttable-2 TD.td-0 {
    width: 20%;
    padding: 5px 5px 3px 10px;
    border-left: 4px solid #0099FF;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-2 TD.td-1 {
    padding: 5px 5px 3px 12px;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-2 TD.td-2 {
    padding: 5px 5px 3px 12px;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-2 TR.tr-even {
    background-color: #FFFFFF;
}

TABLE.contenttable-2 TR.tr-odd {
    background-color: #f5f5f5;
}

TABLE.contenttable-2 TR.tr-odd TD.td-1 {
    background-color: #f5f5f5;
}

TABLE.contenttable-3 {
    width: 100%;
    font-size: 12px;
    line-height: 1.5;
    border-collapse: collapse;
}

TABLE.contenttable-3 td A {
    font-size: 12px;
}

TABLE.contenttable-3 caption {
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    padding-left: 8px;
}

TABLE.contenttable-3 TD.td-0 {
    padding: 8px 5px 6px 35px;
    background: #ffffff url('http://www.kitaqshinsyo.com/fileadmin/templates/images/contenttable-3_marker.gif') left center no-repeat;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-3 TD.td-1 {
    padding: 5px 5px 3px 12px;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-3 TD.td-2 {
    padding: 5px 5px 3px 12px;
    border-bottom: 1px dotted #cccccc;
}

TABLE.contenttable-3 TR.tr-even {
    background-color: #FFFFFF;
}

TABLE.contenttable-3 TR.tr-odd {
    background-color: #ffffff;
}

TABLE.contenttable-3 TR.tr-odd TD.td-1 {
    background-color: #ffffff;
}

/* Left, center, right and justify alignment of text in block elements*/
p.align-left,
td.align-left,
th.align-left,
h1.align-left,
h2.align-left,
h3.align-left,
h4.align-left,
h5.align-left,
h6.align-left,
div.align-left,
address.align-left {
    text-align: left;
}

p.align-center,
td.align-center,
th.align-center,
h1.align-center,
h2.align-center,
h3.align-center,
h4.align-center,
h5.align-center,
h6.align-center,
div.align-center,
address.align-center {
    text-align: center;
}

p.align-right,
td.align-right,
th.align-right,
h1.align-right,
h2.align-right,
h3.align-right,
h4.align-right,
h5.align-right,
h6.align-right,
div.align-right,
address.align-right {
    text-align: right;
}

p.align-justify,
td.align-justify,
th.align-justify,
h1.align-justify,
h2.align-justify,
h3.align-justify,
h4.align-justify,
h5.align-justify,
h6.align-justify,
div.align-justify,
address.align-justify {
    text-align: justify;
}

span.important {
    color: #8A0020;
}

span.name-of-person {
    color: #10007B;
}

span.detail {
    color: #186900;
}

/* Selectors for the default configuration of the link accessibity feature.*/
a.external-link {}

a.external-link-new-window {}

a.internal-link {}

a.internal-link-new-window {}

a.download {}

a.mail {}

.align-left {
    text-align: left;
}

.align-center {
    text-align: center;
}

.align-right {
    text-align: right;
}

.important {
    color: #8A0020;
}

.name-of-person {
    color: #10007B;
}

.detail {
    color: #186900;
}

.component-items {
    color: #186900;
}

.action-items {
    color: #8A0020;
}

.component-items-ordered {
    color: #186900;
}

.action-items-ordered {
    color: #8A0020;
}

blockquote {
    background: #F3F3F1;
    margin: 0 20px;
    padding: 15px 20px 15px 45px;
    font-size: 0.9em;
}


a.internal-link-type1 {
    padding-right: 13px;
    margin-right: 2px;
    background: url('fileadmin_templates_images_icon_internal_link.gif') 100% 50% no-repeat;
}

a.internal-link-type2 {
    padding-left: 15px;
    background: url('fileadmin_templates_images_link_list_marker.gif') 0 50% no-repeat;
}

a.internal-link-new-window {
    padding-right: 13px;
    background: url('fileadmin_templates_images_icon_internal_link.gif') 100% 50% no-repeat;
}

a.external-link {
    padding-right: 18px;
    background: url('fileadmin_templates_images_icon_external_link.gif') 100% 50% no-repeat;
}

a.external-link-new-window {
    padding-right: 18px;
    background: url('fileadmin_templates_images_icon_external_link.gif') 100% 50% no-repeat;
}

a.download {
    padding-right: 16px;
    margin-right: 2px;
    background: url('fileadmin_templates_images_icon_download_link.gif') 100% 50% no-repeat;
}

a.doc_download {
    padding-right: 16px;
    margin-right: 2px;
    background: url('cms_core_gfx_fileicons_doc.png') 100% 50% no-repeat;
}

a.xls_download {
    padding-right: 16px;
    margin-right: 2px;
    background: url('cms_core_gfx_fileicons_xls.png') 100% 50% no-repeat;
}

a.pdf_download {
    padding-right: 16px;
    margin-right: 2px;
    background: url('cms_core_gfx_fileicons_pdf.png') 100% 50% no-repeat;
}


DIV#content_border {
    line-height: 1.6;
    padding-bottom: 1.5rem;
}


.wakuwaku {
    text-align: left;
    padding: 40px 0 5px;
}

.wakuwaku a {
    color: #FFA500;
}

/*-----------------------------------  news v1 view  -----------------------------------*/

.clear {
    clear: both;
    display: block;
    margin: 0.5em auto;
}

div.cag_pagebrowser {
    margin: 0 0 1em 0;
}

div.cag_pagebrowser ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

div.cag_pagebrowser ul li {
    display: inline;
    text-align: center;
}

div.cag_pagebrowser a {
    font-size: 0.8em;
}

div.cag_pagebrowser .divider {
    padding: 0 0.5em;
}


.example-container {
    background: #000000;
}

span.news-header-list-categories {
    padding: .3rem .6rem;
    background: var(--gr20);
    margin-left: .6rem;
    font-size:90%;
    white-space: nowrap;
}

span.news-header-list-date {
    padding-right: .6rem;
}
.btn_toppage {display:none;}


.imgMenu .csc-textpic-imagerow {
    background: var(--PClr);
    border-radius: var(--rd3);
    /* display:grid; */
}

/* .imgMenu img {
    filter: brightness(110%);
} */
.imgMenu a {
    display: grid;
}

.imgMenu img {
    border-radius: var(--rd3) var(--rd3) 0 0;
}

@media (min-width: 769px) {

    .imgMenu a:hover,
    .imgMenu a:active {
        opacity: .8;
    }
}

.imgMenu dd {
    color: white;
    background: var(--PClr);
    text-align: center;
    padding: var(--sp3) 0;
    border-radius: 0 0 10px 10px;
    margin-top: 0 !important;
}

.imgMenu dd br {
    display: inline;
}

@media (min-width: 769px) {
    .imgMenu dd br {
        display: none;
    }
}


.imgMenu {
    background-color: var(--ThClr);
    padding: var(--sp2) 0;
}

.imgMenu>.csc-textpic {
    background-color: var(--ThClr);
    padding-top: var(--sp7);
}

.imgMenu hr {
    background-image: url('fileadmin_templates_data_files_ksjc_border.png');
    background-repeat: repeat-x;
    height: 3rem;
    padding: 0;
    margin-top: 2rem;
    width: 100%;
    background-size: contain;
    background-position-y: bottom;
    border: 0;
}

@media (max-width: 992px) {
    .imgMenu .csc-textpic-imagewrap {width:100%!important; padding-left: 1.5rem!important;padding-right: 1.5rem!important;}
    .imgMenu .csc-textpic-imagerow {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--sp6) !important;
        max-width: auto !important;
        background: none!important;
        width: auto!important;
    }
    .imgMenu .csc-textpic-image img {
        margin:0!important;
    }
    .imgMenu .csc-textpic-imagerow-last {
        /* margin-top: -1.2rem; */
        margin: 1.4rem 0 0 0!important;
    }
    .imgMenu dl.csc-textpic-image {
        background: var(--PClr);
        border-radius: var(--rd3);
        display: grid;
        width: 100%!important;
    }
    .imgMenu .csc-textpic .csc-textpic-imagewrap .csc-textpic-image {margin-left:0px!important;}
    .imgMenu .csc-textpic-center DIV.csc-textpic-imagewrap .csc-textpic-image {
        display: grid;
        margin-left: 0!important;
    }
    DIV#siteHeader {
        position: relative;
        width: 100%;
        padding: 0 1rem;
        height:auto;
    }
    DIV#container {
        padding:0!important;
    }
    DIV.headerwrap {width:auto;height:auto;}
    DIV.header_right {width:auto!important;}
    DIV.headerMainMenu {position: relative; top: 0;display:flex;}
    DIV.footer_menu03 {width:100%!important;flex-wrap:wrap;}
    DIV.footer_menu03 .containerMain {width:100%!important;}
    .footer_about_us {width:100%!important;}
}
@media (max-width: 874px) {
    #styleswich_font, #styleswich_bgcolor {
        display: none!important;
    }
}
@media (max-width: 564px) {
    DIV#logo {
        height: 95px;
        width: calc(354px * 0.853);
    }
    DIV#logo a {
        width: calc(340px * 0.853);
        height: calc(80px * 0.853);
    }
    DIV#logo a img {
        width: calc(340px * 0.853);
        height: calc(80px * 0.853);
    }
}