:root {
    color-scheme: light dark;
}

body {
	font-family: 'Noto Sans JP','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3', sans-serif;
}

/* ページの枠組み ▼ */

.full-page {
	background-color: light-dark(#f5f5f5,#2c2c2c);
    color: light-dark(#000,#fafafa);
	padding-bottom: 20px;
	line-height: 2;
}

.page-title {
    margin: 0px;
    padding: 3% 0%;
    text-align: center;
}

.breadcrumb {
    margin-left: 18px;
    color: #aaa;
    margin-top: 5px;
}

.pd-child {
    color: #aaa;
    text-decoration: none;
}

.page-flex {
    padding: 0px 18px;
    display: flex;
}

.main-contents {
    background-color: light-dark(#fff,#1c1c1c);
    width: 62%;
    padding: 0% 2% 2% 2%;
	color: light-dark(#000,#fafafa);
}

.top-image {
            width: 100%;
            height: auto;
}

.sec1,
.sec2 {
       color: light-dark(#7f7fff,#5f5fff);
       border-left: 2px light-dark(#7f7fff,#5f5fff) solid;
       background-color: light-dark(#eef,#aaf);
       padding-left: 15px;
       margin-top: 80px;
       scroll-margin-top: 100px;
}

.sec1 {
    margin-top: 24px;
}

.submenu {
    width: 30%;
    margin-left: 2%;
}

.sub-page-menu {
	background-color: light-dark(#fff,#1c1c1c);
	padding: 0% 2%;
    font-weight: 300;
}

.sub-page-menu a {
	display: block;
	text-decoration: none;
	color: light-dark(#000,#eee);
	background-color: light-dark(#fff,#1c1c1c);
}

.ts-title {
    padding: 1em 0em 0em 0em;
    font-size: 1.3em;
}

.ts-menu {
    padding: 1em;
}

.ts-menu-2 {
    padding: 0em 1em 0em 2em;
}

/* ページの枠組み ▲ */

/* サイトマップフッター ▼ */

.footer-box {
    background-color: light-dark(#c0c0c0,#000);
    display: flex;
    padding: 7% 7% 0% 7%;
}

.left-space {
    width: 40%;
}

.site-name {
    color: #7f7fff;
    font-size: 2em;
    font-family: "RocknRoll One", sans-serif;
    font-style: normal;
}

.site-name span {
    font-size: 0.5em;
}

.post-cord {
    margin: 1.5em 0em 1em 1em;
    font-size: 1.2em;
    color: light-dark(#000,#fafafa);
}

.address {
    margin: 1em 0em 1em 1em;
    font-size: 1.2em;
    color: light-dark(#000,#fafafa);
}

.middle-space {
    width: 30%;
    position: relative;
}

.link-11,
.link-12,
.link-13,
.link-14 {
    text-decoration: none;
    color: light-dark(#000,#fafafa);
    position: absolute;
}

.link-11:hover,
.link-12:hover,
.link-13:hover,
.link-14:hover {
    opacity: 0.5;
}

.li-11,
.li-12,
.li-13,
.li-14 {
    margin: 8px;
}

.right-space {
    width: 30%;
    position: relative;
}

.link-21,
.link-22,
.link-23,
.link-24 {
    text-decoration: none;
    color: light-dark(#000,#fafafa);
    position: absolute;
}

.link-21:hover,
.link-22:hover,
.link-23:hover,
.link-24:hover {
    opacity: 0.5;
}

.li-21,
.li-22,
.li-23,
.li-24 {
    margin: 8px;
}

/* サイトマップフッター ▲ */

/* コピーライト ▼ */

.copyright {
    text-align: center;
    color: light-dark(#000,#fafafa);
    background-color: light-dark(#c0c0c0,#000);
    padding: 10px;
    border-top: 1px #eee solid;
    font-size: 13px;
}

/* コピーライト ▲ */

@media screen and (max-width: 767px) {

.main-contents {
    width: 100%;
}

.submenu {
    display: none;
}

.left-space {
    width: 100%;
}

.middle-space,
.right-space {
    display: none;
}

}