@charset "Shift-JIS";

/* ------------------------------------------------ */
/* ALL AREA
/* ------------------------------------------------ */
*, *::before, *::after {margin: 0;padding:0;}
article, aside, figure, footer, header, main, nav, section {display: block;}
body {
    font-family: -apple-system, BlinkMacSystemFont, "BIZ UDGothic", Meiryo UI, Meiryo, Verdana, sans-serif;
    font-size: 1rem;font-weight: 500;line-height: 1.8;color: rgba(0, 0, 0, 1.0);background-color: #fff;}
h1, h2, h3, h4, h5, h6 {margin-top: 0;margin-bottom: 0.5rem;font-family: -apple-system, BlinkMacSystemFont, "BIZ UDGothic", Meiryo UI, Meiryo, Verdana, sans-serif;}
strong {font-family: -apple-system, BlinkMacSystemFont, "BIZ UDGothic", Meiryo UI, Meiryo, Verdana, sans-serif;}
p {margin-top: 0;margin-bottom: 1rem;}
hr {box-sizing: content-box;height: 0;overflow: visible;}
.text-left, .align-left {text-align: left !important;}
.text-right, .align-right {text-align: right !important;}
.text-center, .align-center {text-align: center !important;}
.clearfix::after {display: block;clear: both;content: "";}

.container, .container-fluid {width:100%;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;}
.row {display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-right: -15px;margin-left: -15px;}

.col-lg-auto {-ms-flex: 0 0 auto;flex: 0 0 auto;width: auto;max-width: 100%;}
.col-lg-1 {-ms-flex: 0 0 8.333333%;flex: 0 0 8.333333%;max-width: 8.333333%;}
.col-lg-2 {-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;}
.col-lg-3 {-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;}
.col-lg-4 {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;}
.col-lg-5 {-ms-flex: 0 0 41.666667%;flex: 0 0 41.666667%;max-width: 41.666667%;}
.col-lg-6 {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;}
.col-lg-7 {-ms-flex: 0 0 58.333333%;flex: 0 0 58.333333%;max-width: 58.333333%;}
.col-lg-8 {-ms-flex: 0 0 66.666667%;flex: 0 0 66.666667%;max-width: 66.666667%;}
.col-lg-9 {-ms-flex: 0 0 75%;flex: 0 0 75%;max-width: 75%;}
.col-lg-10 {-ms-flex: 0 0 83.333333%;flex: 0 0 83.333333%;max-width: 83.333333%;}
.col-lg-11 {-ms-flex: 0 0 91.666667%;flex: 0 0 91.666667%;max-width: 91.666667%;}
.col-lg-12 {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
.offset-r1 {margin-right: 8.333333%;}
.offset-r1-2 {margin-right: 4.1666665%;}
.mt-15 {margin-top: 15px;}

.dv-auto {width: auto;max-width: 100%;}
.dv-1 {max-width: 8.333333%;}
.dv-2 {max-width: 16.666667%;}
.dv-3 {max-width: 25%;}
.dv-4 {max-width: 33.333333%;}
.dv-5 {max-width: 41.666667%;}
.dv-6 {max-width: 50%;}
.dv-7 {max-width: 58.333333%;}
.dv-8 {max-width: 66.666667%;}
.dv-9 {max-width: 75%;}
.dv-10 {max-width: 83.333333%;}
.dv-11 {max-width: 91.666667%;}
.dv-12 {max-width: 100%;}

/* ------------------------------------------------ */
/* HEAD "main_head" Navigation Bar
/* ------------------------------------------------ */
.navtop {
  display: block;
  margin: 0;
  padding: 0;
  height: 72px;
  background-color: #fff;
  border-bottom: 1rem solid rgba(67, 87, 162, 1.0);
  background-image: -moz-linear-gradient(180deg, #d9ddec 0%, #d9ddec 25%, #fff 25%, #fff 50%, #d9ddec 50%, #d9ddec 75%, #fff 75%);
  background-image: -webkit-linear-gradient(180deg, #d9ddec 0%, #d9ddec 25%, #fff 25%, #fff 50%, #d9ddec 50%, #d9ddec 75%, #fff 75%);
  background-image: linear-gradient(180deg, #d9ddec 0%, #d9ddec 25%, #fff 25%, #fff 50%, #d9ddec 50%, #d9ddec 75%, #fff 75%);
  background-position: 0 0;
  background-size: 10px 10px;
}
.navbar-header {margin:0;padding:0;}
.navbar-brand {display:inline-block;margin:0 10px 0 0;padding:18px 10px 10px 10px;text-align:center;font-size:1.25rem;font-weight:700;line-height:1.2;border:none;height:2.75rem;width:340px;background-color:#fff;}
.navbar-brand img {margin:0;height:42px;text-align:left;} /* -LOGO- originaly width:300px */
.navbar-brand a:link, .navbar-brand a:visited {text-decoration: none;}

.navbar-brand2 {display:inline-block;margin:0 10px 0 0;padding:18px 10px 10px 10px;text-align:center;font-size:1.25rem;font-weight:700;line-height:1.2;border:none;height:2.75rem;width:340px;}
.navbar-brand2 img {margin:0;height:42px;text-align:left;} /* -LOGO- originaly width:300px */
.navbar-brand2 a:link, .navbar-brand a:visited {text-decoration: none;}

.navbar {display:flex;width: 100%;border: unset;}
.navbar .navlinks {display:flexbox;font-size: 0.85rem;text-decoration:none;margin:24px 0;color:rgba(105, 105, 105, 1.0);}
.navbar .navlinks a {
    color:#fff;
    background-color: #8796c8;
    border-radius: 6px;
    margin:0 4px;
    padding:10px 10px;
    border:1px solid rgba(255, 255, 255, 0.5);
    width:200px;
    text-decoration:none;
}
.navlinks a:link, a:visited {font-size:0.85rem;text-decoration:none; color: #fff;text-decoration:none;}
.navlinks a:hover, .navlinks a:active, .navlinks a:focus {
    color:#fff;
    background-color: rgba(67, 87, 162, 1.0);
    border-radius: 6px;
    margin:0 6px;
    padding:10px 10px;
    border:1px solid rgba(67, 87, 162, 1.0);
    width:200px;
    text-decoration:none;
    transition-property: all;
    transition-duration: 600ms;
    transition-delay: 0s;
    transition-timing-function: ease;
}

/* -ADMIN- login and logout */
#admin-log, #admin-login, #admin-logout {margin:24px 50px 0 auto;padding:0;float:right;}
.navbar .navlinks p {color:rgb(0, 0, 0, 1.0);display:inline-block;font-size: 0.85rem;text-decoration:none;margin-right:0.25rem;}

/* ------------------------------------------------ */
/* ASIDE "main_left" Left
/* ------------------------------------------------ */
.line {margin:0;padding:0 0 10px 0;width:170px;background-color: rgba(67, 87, 162, 0.1);}

//.line h1 {width:170px;margin:0 0 0.5rem 0;padding:0.95rem 0;color:rgba(0, 0, 0, 1.0);font-size: 1.35rem; font-weight:800;letter-spacing:2px;text-indent:1rem;}
.line h1 {width:200px;margin:0 0 0.5rem 0;padding:0.1rem 0;color:rgba(0, 0, 0, 0.0);font-size: 1.35rem; font-weight:990;letter-spacing:2px;text-indent:1rem;}

.line h2 {font-size:1rem; font-weight:700;vertical-align:top;width:170px;border-bottom:2px solid #fff}
.line h2 img {text-align:center;margin: 2px 2px 0 2px;}
.line h2 a {font-size: 0.85rem; text-decoration:none;letter-spacing: 1px;}
.line a:link, a:visited {font-size: 0.85rem; text-decoration:none; color: rgba(0, 0, 0, 1.0);}
.line a:hover {
    color:#fff;
    background-color: rgba(67, 87, 162, 0.6);
    border-radius: 4px;
    padding:4px 6px;
    text-decoration:none;
    transition-property: all;
    transition-duration: 600ms;
    transition-delay: 0s;
    transition-timing-function: ease;
}
.line a:active {
  color: #fff;
  background-color: rgba(67, 87, 162, 1.0);
  border-radius: 4px;
  padding: 4px 6px;
  text-decoration: none;
  text-decoration: none;
  transition-property: all;
  transition-duration: 600ms;
  transition-delay: 0s;
  transition-timing-function: ease;
}
.line a:focus {
  color: #fff;
  background-color: rgba(67, 87, 162, 0.6);
  border-radius: 4px;
  padding: 4px 6px;
  text-decoration: none;
  transition-property: all;
  transition-duration: 600ms;
  transition-delay: 0s;
  transition-timing-function: ease;
}
/* Contents titles */
h2.menu_hd {color: #fff;margin-left:0;}
h2.menu_hd a {color: rgba(0, 0, 0, 1.0);}
h2.menu_hd a:hover {color: rgba(255, 255, 255, 1.0);}
h2.menu_hd a:active {color: rgba(255, 255, 255, 1.0);}
h2.menu_hd a:focus {color: rgba(255, 255, 255, 1.0);}
h2.menu_hd:hover #icon9 {border: 1px solid rgba(255, 255, 255, 1.0);}


/* Drop plus mark colour */
.ICN {margin:0;padding:0;}
span.ICN img {margin:0 5px;padding:4px;border-radius: 50%; vertical-align:text-bottom;}

.menuitem {margin:0 0 12px 18px;}

.line ul {margin:6px 0 0 12px;}
.line ul li {position:relative;list-style: none;}
.line ul li::after {
    display: block;
    content:'';
    position: absolute;
    top: .75rem;
    left: -1rem;
    width: 6px;
    height: 6px;
    border-right: 1px solid rgba(0, 0, 0, 1.0);
    border-bottom: 1px solid rgba(0, 0, 0, 1.0);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    }

/* ------------------------------------------------ */
/* CONTENT "kaisya" Main
/* ------------------------------------------------ */
/* HEAD "head_kaisya" Navigation Bar */
.globalmenu {display:block;max-width:1280px;background-color:rgba(77, 140, 204, 0.3);padding:0 15px 0 15px;margin:0 auto 20px auto;border-bottom-left-radius:10px;border-bottom-right-radius:10px;}
.globalmenu .navbar {display:block;max-width:90%;border: unset;margin: 0 auto;}
.globalmenu .navbar i {font-size:1.25rem;padding-top:0.15rem;}

#gmenu {display:block;width: 100%;margin:15px auto;padding:0;float:left;}
#gmenu a:link, #gmenu a:visited {display:inline-block;padding: 0.25rem 0.5rem;width:9.5rem;text-align: center;margin-right:2px;margin-bottom:4px;background-color:rgba(77, 140, 204, 1.0);}
#gmenu a:hover, #gmenu a:active {border: 1px solid rgba(255,255,255, 1.0);background-color: rgba(51, 51, 51,1.0);}
#gmenu i {margin-top:0.15rem;}

.topics table th a, .topics table td a {color:rgba(0, 0, 0, 1.0);text-decoration:none;}
.topics table th a:visited, .topics table td a:visited {color:rgba(0, 0, 0, 1.0);text-decoration:none;}
.topics table th a:hover, .topics table th a:active {font-weight:700;color:#fff;background-color: rgb(51, 51, 51, 1.0);border-radius:10px;padding:2px;}
.topics table td a:hover, .topics table td a:active {font-weight:700;color:rgb(0, 0, 0, 1.0);padding:0;}

.topics table td span::after {
  font-size: 1rem;
  font-weight: 700;
  color: rgba(0, 0, 0, 1.0);
  content: "New";
}
.topics table td i {font-size:0.85rem;color:#fff;border-radius:10px;padding:0 2px 2px 2px;}
.topics table td i::after {font-size:0.85rem;font-weight:700;color:#fff;border-radius:10px;padding:0 2px 2px 2px;content: ">";}

.topics .container {margin:0;padding:0}
.topics {max-width:1280px;background-color:#fff;padding:0 15px;margin:0 auto 20px auto;}
.topics .text-w {color: #fff;font-size:1rem}
.topics h1 {font-size:1.8rem}

.selectbar {background-color:#8796c8;margin:0 -2px;border-radius:20px;padding:2px;}
.selectbar select {margin:0 10px 0 0;padding:2px 4px;width:7.2rem;background-color:#fff;border-color:#fff;border-radius:12px;}
.selectbar input {margin:0 20px 0 0;padding:1px 4px;width:4rem;color:#fff;background-color: rgba(219,0,92,1.0);border-color:rgba(135, 150, 200, 0.1);border-radius:12px;}

.bg-chart0y1 {background-color: rgba(177, 178, 118, 0.1);}
.bg-chart0b2 {background-color:rgba(178, 178, 178,0.8);}
.bg-chart0b3 {background-color: rgba(77, 140, 204, 0.1);}
.bg-chart0b3 th {background-color: rgba(77, 140, 204, 0.2);}

/* ------------------------------------------------ */
/* CONTENT "mansion" Main
/* ------------------------------------------------ */
.register, .maininfo {margin:0 auto 0 10px;padding:0;width: 95%;}
.register .row, .maininfo .row {display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-right: -15px;}

/* Building Detail - Register */
.register .btnstop {background-color:rgba(77, 140, 204, 0.3);border-bottom-left-radius:0.5rem;border-bottom-right-radius:0.5rem;margin:0 0 20px 0;padding:0;}
.register h1 {color:rgba(51, 51, 51, 1.0);font-size:1.8rem;font-weight:500;margin:-10px 0 10px 0;padding:18px 20px 0 20px;letter-spacing:4px;float:left;}
.register ul {display:flex;float:left;}
.register ul li {display:inline-flex;flex-wrap:wrap;list-style-type:none;padding:2px;}

.btn-regs {margin:18px 0 10px 0;float:right;}
.btn-regs .btn-idblue {color:#fff;background-color: rgba(77, 140, 204, 1.0);border-color: rgba(77, 140, 204, 1.0);padding:6px 6px;}
.btn-regs .btn-idblue:hover {color: #fff;background-color: rgba(51, 51, 51,1.0);border-color: rgba(255, 255, 255, 1.0);}

/* Chart Left - Image Part */
.docimport {display:block;margin:0;padding:0 0 10px 0;font-size:0.85rem;text-align:center;}
.docimport h4 {margin:20px 0 10px 0;padding:2px 0;font-size:0.9rem;background-color:#8796c8;color:#fff;border-radius:5px;}
.docimport p {line-height:1.6;color: rgba(51, 51, 51,1.0);margin:0;padding:0;}

.docimport dl {display:block;margin:0;padding:0;line-height:1.5;}
.docimport dl dt {color:rgba(0, 0, 0, 1.0);padding-bottom:2px;}
.docimport dl dd {padding:0 0 2px 2em;}

.docimport a:link, .docimport a:visited {display:inline-block;text-decoration: none;color:rgba(51, 51, 51,1.0);}
.docimport a:hover, .docimport a:active {display:inline-block;text-decoration: none;font-weight:700;}
.docimport img {margin:0 auto;padding:0;max-width:240px;height:auto;border-radius:10px;}
.docimport img:link, .docimport img:visited, .docimport img:hover, .docimport img:active {margin:0;padding:0;max-width:240px;height:auto;border-radius:10px;}

@media screen and (min-width:1079px) { /*????申?申??申?申???申?申??申?申????申?申??申?申???申?申??申?申��T????申?申??申?申???申?申??申?申C????申?申??申?申???申?申??申?申Y 1080psx????申?申??申?申???申?申??申?申��鐃� (????申?申??申?申???申?申??申?申????申?申??申?申???申?申??申?申????申?申??申?申???申?申??申?申L)*/
.docimport {display:block;margin:0;padding:0 0 10px 0;text-align:center;}
.docimport dl {display:block;margin:0;padding:0;line-height:1.6;}
.docimport dl dt {color:rgba(0, 0, 0, 1.0);float:left;padding:0 10px 0 0;min-width:6rem;}
.docimport dl dd {padding:0 0 2px 0;;margin-left:6rem;}
.docimport img {margin:0 auto;padding:0;max-width:250px;height:auto;border-radius:10px;}
.docimport img:link, .docimport img:visited, .docimport img:hover, .docimport img:active {margin:0;padding:0;max-width:250px;height:auto;border-radius:10px;}
}

/* Chart - Button */
.btn {
  display: inline-block;
  color: rgba(51, 51, 51,1.0);
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: 0.25rem 0.75rem;
  font-size: 0.85rem;
  line-height: 1.2;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
table td .btn-idpink {color: #fff;background-color: rgba(219, 0, 92, 1.0);border-color: rgba(219, 0, 92, 1.0);border-radius:12px;margin:0;}
table td .btn-idpink:hover {color: #fff;background-color: rgba(219, 0, 92, 0.7);border-color: rgba(219, 0, 92, 0.7);border-radius:12px;margin:0;}
table td .btn-idpink:active, table td .btn-idpink:focus {color: #fff;background-color: rgba(219, 0, 92, 0.7);border-color: rgba(219, 0, 92, 1.0);box-shadow: 0 0 0 0.2rem rgba(178, 178, 178, 0.7);border-radius:12px;margin:0;}

table td .btn-idpink2 {color: #fff;background-color: rgba(219,0,92, 0.7);border-color: rgba(219,0,92, 0.7);border-radius:12px;margin:0;}
table td .btn-idpink2:hover {color: #fff;background-color: rgb(219,0,92, 1.0);border-color: rgba(219,0,92, 1.0);border-radius:12px;margin:0;}
table td .btn-idpink2:active, table td .btn-idpink2:focus {color: #fff;background-color: rgba(219,0,92, 1.0);border-color: rgba(219, 0, 92, 1.0);box-shadow: 0 0 0 0.2rem rgba(178, 178, 178, 0.7);border-radius:12px;margin:0;}

table td .btn-idblue {color: #fff;background-color: rgba(77, 140, 204, 1.0);border-color: rgba(77, 140, 204, 0.7);border-radius:12px;margin:0;}
table td .btn-idblue:hover {color: #fff;background-color: rgb(77, 140, 204, 0.7);border-color: rgba(77, 140, 204, 1.0);border-radius:12px;margin:0;}
table td .btn-idblue:active, table td .btn-idblue:focus {color: #fff;background-color: rgba(77, 140, 204, 1.0);border-color: rgba(77, 140, 204, 0.7);box-shadow: 0 0 0 0.2rem rgba(178, 178, 178, 0.7);border-radius:12px;margin:0;}

table td .btn-idblue2 {color: #fff;background-color: rgba(67, 87, 162, 0.7);border-color: rgba(67, 87, 162, 1.0);border-radius:12px;margin:0;}
table td .btn-idblue2:hover {color: #fff;background-color: rgb(67, 87, 162, 1.0);border-color: rgba(67, 87, 162, 1.0);border-radius:12px;margin:0;}
table td .btn-idblue2:active, table td .btn-idblue2:focus {color: #fff;background-color: rgba(67, 87, 162, 0.7);border-color: rgba(67, 87, 162, 1.0);box-shadow: 0 0 0 0.2rem rgba(178, 178, 178, 0.7);border-radius:12px;margin:0;}

/* Chart Back-Ground Colours */
.tblchart {background-color: #fff;}
.tblchart0g1 {background-color: rgba(178,178,178,0.25);}
.tblchart0g2 {background-color: rgba(177, 178, 118,0.15);}
.tblchart0b1 {background-color: rgba(178,178,178, 0.25);}
.tblchart0b2 {background-color: rgba(177, 178, 118, 0.15);}

/* Chart Titile, Column(white) Width&Colours */
.tblchart .ttl {background-color:rgba(178, 178, 178, 0.25);border-top:1px solid #fff;border-bottom:none;}
.tblchart .ttlg {background-color:rgba(178,178,178,0.25);border-top:1px solid #fff;border-bottom:none;}
.tblchart .ttlb {background-color:rgba(178,178,178, 0.25);border-top:1px solid #fff;border-bottom:none;}
.tblchart .ttlb2 {background-color:rgba(178,178,178, 0.25);border-top:1px solid #fff;border-bottom:none;}
.tblchart .bg-w {background-color: #fff;border:1px solid #fff;}
.tblchart .bg-w2 {background-color: #fff;border-top:none;border-bottom: 1px solid #dee2e6;}

table .hauto {width:auto;}
table .h01 {min-width:5rem;}
table .h02 {text-align:center;} /* building img space only */
table .h03 {width:1.5rem;text-align:center;} /* Chart Nest-chart: Text Centering */
table .nesting {margin:15px 0;padding:0;width:97%;} /* Chart Nest-chart: Spacing Top&Bottom */
table tr .nest {padding:0;} /* Chart Nest-chart: Spacing right-side only */

/* Chart Table (core) - */
table {border-collapse: collapse;}
th {text-align: inherit;text-align: -webkit-match-parent;}
.table {width: 100%;color: rgba(0, 0, 0,1.0);font-size:0.85rem;margin:0 0 16px 0;}
.table th, .table td {
    padding: 0.5rem;
    vertical-align: top;
    border-top: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
  }
  .table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #dee2e6;
  }
  .table tbody + tbody {
    border-top: 2px solid #dee2e6;
  }
  .table-sm th,
  .table-sm td {
    padding: 0.3rem 0.5rem;
    border-bottom: 1px solid #dee2e6;
  }
.table-borderless th,
.table-borderless td,
.table-borderless thead th,
.table-borderless tbody + tbody {
  border: 0;
}
.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(177, 178, 118, 0.1);
}

/* Chart for Guide - */
.table-bordered {
  border: 1px solid #dee2e6;
}
.table-bordered th,
.table-bordered td {
  border: 1px solid #dee2e6;
}
.table-bordered thead th,
.table-bordered thead td {
  border-bottom-width: 2px;
}

/* ------------------------------------------------ */
/* Footer - Bi-system Credit
/* ------------------------------------------------ */
.foot {display:block;float:right;font-size:0.6rem;background-color:#fff;margin:10px 0 20px 0;padding:0 8px;color:#666;border-radius:12px;letter-spacing:1px;border: 1px solid #999;}
.bipink {color:rgb(219, 0, 92, 1.0)}

/* ------------------------------------------------ */
/* IE11 Only
/* ------------------------------------------------ */
/* IE11 display hack (Spare) */
_:-ms-lang(x)::-ms-backdrop,
.selector {background-color:#fff;}

@media all and (-ms-high-contrast:none) {
  *::-ms-backdrop,
  .line ul li::after {  /* IE11 - Aside > Mark */
    display: block;
    content: '';
    position: absolute;
    top: 0.4rem;
    left: -1rem;
    width: 6px;
    height: 6px;
    border-right: 1px solid rgba(255, 255, 255, 1.0);
    border-bottom: 1px solid rgba(255, 255, 255, 1.0);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  .ICN {/* IE11 - Aside + Mark */
    margin: -5px 0 0 0;
    padding: 0;
  }
}

/* IE11 display font */
@media all and (-ms-high-contrast:none) {
_:-ms-input-placeholder,
:root {
    font-family: "BIZ UDGothic", Meiryo UI, Meiryo, Verdana, sans-serif;
  }
}

/* ------------------------------------------------ */
/* Scroll Bar / Edge Safari Chrome FireFox Only
/* ------------------------------------------------ */
/* Scrolling bar -> width */
html::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
/* Scrolling bar -> background */
html::-webkit-scrollbar-track {
  border-radius:x 10px;
  box-shadow: 0 0 10px rgba(222, 226, 230,0.0) inset;
  background:#fff;
}
/* Scrolling bar -> Colour */
html::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(222, 226, 230, 1.0);
}

/* ------------------------------------------------ */
/* @media print
/* ------------------------------------------------ */
@media print {

  /* - A4 YOKO Printing Size - */
  .printpages {
    width: 251mm;
    height: 172mm;
    page-break-after: always;
    position: relative;
    counter-increment: page_count;
  }

  /* - The Last Page - For no more page / no-return key - */
  .printpages:last-child {
    page-break-after: auto;
  }
}