@charset "utf-8";
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-decoration: none;
  list-style: none;
}
.cf:after {
  content: "";
  clear: both;
  display: block;
}
.mb10 {
  margin-bottom: 10px;
}
.mb20 {
  margin-bottom: 20px;
}
.mt20 {
  margin-top: 20px;
}

body {
  color: #00246f;
  font-size: 13px;
  line-height: 2;
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3",
    "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic",
    sans-serif;
}
pre {
  white-space: -moz-pre-wrap; /* Mozilla */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
  white-space: pre-wrap; /* CSS3 */
  word-wrap: break-word; /* IE 5.5+ */
  display: inline-block;
}
a,
a:link,
a:active,
a:visited {
  transition: background-color 0.35s ease;
  -webkit-transition: background-color 0.35s ease;
  -moz-transition: background-color 0.35s ease;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",
    "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  line-height: normal;
}
h2,
h3,
h4,
h5,
h6 {
  font-size: 130%;
  font-weight: normal;
  padding: 8px 0;
}

/* top page */
/* header */
header {
  border-top: 5px solid #00246f;
  margin-bottom: 2%;
}
.head-Txt {
  margin: 0 auto;
  padding: 20px;
  width: 70%;
}
.head-Txt .site-Ttl {
  display: inline-block;
}
.head-Txt .site-Ttl a {
  color: #000;
  font-size: 18px;
  height: 100%;
}
.head-Txt .site-Ttl a:hover {
  opacity: 0.5;
}
.head-Txt .catch-Copy {
  color: #5a5a5a;
  font-size: 12px;
  width: 100%;
}

/* groval-Nav */
#groval-Nav-Menu {
  display: flex;
  font-size: 13px;
  margin: 0 auto;
  justify-content: space-between;
  width: 70%;
}
#groval-Nav-Menu li {
  border-right: dotted 1px #000;
  text-align: center;
  width: 30%;
}
#groval-Nav-Menu li:first-child {
  border-left: dotted 1px #000;
}
#groval-Nav-Menu li a {
  color: #000;
  display: block;
}
#groval-Nav-Menu li a:hover {
  text-decoration: underline;
}

/* slider */
#slider {
  overflow: hidden;
  position: relative;
  width: 100%;
}
#slider_in {
  position: relative;
  left: 50%;
  width: 3210px;
  margin-left: -1605px;
}
.bx-wrapper {
  margin: 0px auto;
  border: none;
  box-shadow: none;
  background: none;
  position: relative;
}
.bx-wrapper .bx-prev {
  left: 680px;
}
.bx-wrapper .bx-next {
  right: 700px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
  background: #b5b5b5;
}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus,
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
  transition: 0s;
}

/* Content-Frame */
.Content-Frame {
  margin: 3% 0;
}
.side-Menu {
  position: sticky;
  top: 0;
}

.side-Menu,
.article-Link-Frame,
main .Browser-Frame,
.main-Article {
  background: -moz-linear-gradient(
    top,
    rgba(242, 242, 242, 0) 0%,
    rgba(242, 242, 242, 1) 100%
  );
  background: -webkit-linear-gradient(
    top,
    rgba(242, 242, 242, 0) 0%,
    rgba(242, 242, 242, 1) 100%
  );
  background: linear-gradient(
    to bottom,
    rgba(242, 242, 242, 0) 0%,
    rgba(242, 242, 242, 1) 100%
  );
  padding: 2% 0;
  margin: 3% 0 5%;
}
.side-Container,
.article-Link,
main .Browser,
.main-Article-Entry {
  margin: 0 auto;
  width: 70%;
}

/* aside */
.side-Container {
  display: flex;
  justify-content: space-between;
}
.side-Container > li {
  border-right: 1px dotted #000;
  padding: 0 2%;
  width: 50%;
}
.side-Container > li h2 {
  font-size: 30px;
}
.side-Submenu {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.side-Submenu li {
  margin-bottom: 2%;
  width: 50%;
}
.side-Container .menu a {
  padding-left: 20px;
  position: relative;
}
.side-Container .menu a::before {
  border-right: 1px solid #000;
  border-top: 1px solid #000;
  content: "";
  display: block;
  height: 8px;
  left: 0;
  position: absolute;
  top: 11px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 8px;
}
.side-Container .column {
  border-left: 1px dotted #000;
}
.side-Container .column .side-Submenu {
  width: 100%;
}
.side-Container img {
  width: 30%;
}
.side-Container a {
  color: #000;
  display: inline-block;
  padding: 2%;
  position: relative;
}
.side-Container a:hover {
  text-decoration: underline;
}
.slicknav_menu {
  display: none;
}

/* article-Link */
.article-Link:last-child {
  border: none;
}
.article-Link {
  border-bottom: dotted 1px #ccc;
  margin-bottom: 2%;
}
.article-Link img {
  float: left;
  margin: 0 2% 2% 0;
  width: 50%;
}
.article-Link h2 {
  color: #000;
  font-size: 18px;
}
.article-Link p {
  margin-bottom: 2%;
}
.all_View {
  background: #00246f;
  float: right;
}
.all_View a {
  color: #fff;
  display: block;
  padding: 5px 30px;
}
.all_View a:hover {
  opacity: 0.7;
}

/* Browser-Frame */
main .Browser-Frame h2 {
  font-size: 30px;
  margin-bottom: 3%;
}
.browser-Box h3::before {
  border-right: 1px solid #000;
  border-top: 1px solid #000;
  content: "";
  display: block;
  height: 8px;
  left: 15px;
  position: absolute;
  top: 21px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 8px;
}
.browser-Box h3 {
  margin: 0 0 2%;
  padding: 0;
  position: relative;
}
.browser-Box h3 a {
  background: #fff;
  border: 1px solid #ccc;
  color: #000;
  display: block;
  font-size: 20px;
  margin: 0;
  padding: 1% 2% 1% 40px;
}
.browser-Box h3 a:hover {
  background: #dee7fb;
}
.browser-Box p {
  padding: 2%;
}

/* main-Article */
.main-Article-Img {
  width: 100%;
}

/* +下層用 */
.main-Article h2, .under h1 {
  font-size: 30px;
  margin-bottom: 3%;
}
.under h1 {
width: 70%;
margin-inline: auto;
font-weight: normal;
    padding: 8px 0;}
@media  (max-width: 663px) {
      .under h1 {width: 96%;
        font-size: 20px;}
}


.main-Article h3, .under h2 {
  border-left: 8px solid #00246f;
  color: #000;
  font-size: 18px;
  margin-bottom: 3%;
  padding: 0 2%;
}
.main-Article h4, .under h3 {
  border-bottom: 1px solid #000;
  color: #000;
  font-size: 18px;
  margin-bottom: 3%;
}
.under h3 {margin-top: 40px;}

.main-Article h5 {
  background: #00246f;
  color: #fff;
  font-size: 18px;
  margin-bottom: 3%;
  padding: 0 2%;
}
.main-Article h6 {
  color: #00246f;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 3%;
}
.main-Article p,
.main-Article strong,
.main-Article em,
.main-Article b,
.main-Article del,
.main-Article ul,
.main-Article ol,
.main-Article blockquote,
.main-Article address,
.main-Article span,
.main-Article a,
.main-Article ins,
.main-Article pre,
table {
  display: block;
  font-size: 16px;
}
.main-Article strong {
  color: #cf1d1d;
}
.main-Article em {
  text-decoration: underline;
}
.main-Article ul li::before {
  border-right: 1px solid #000;
  border-top: 1px solid #000;
  content: "";
  display: block;
  height: 7px;
  left: 0;
  position: absolute;
  top: 14px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 7px;
}
.main-Article ul li {
  padding-left: 20px;
  position: relative;
}
.main-Article ol {
  counter-reset: number;
}
.main-Article ol li {
  margin-bottom: 2%;
}
.main-Article ol li::before {
  background: #00246f;
  border-radius: 50%;
  color: #fff;
  counter-increment: number;
  content: counter(number);
  display: inline-block;
  margin-right: 10px;
  text-align: center;
  width: 32px;
}
.main-Article blockquote {
  background: #fff;
  border: 1px solid #ccc;
  padding: 1%;
}
.main-Article address {
  border-bottom: 2px dotted #110c08;
  border-top: 2px dotted #110c08;
  padding: 1% 2%;
}
.main-Article a {
  background: #00246f;
  color: #fff;
  display: block;
  padding: 1% 2%;
}
.aligncenter {
  text-align: center;
}
.alignright {
  text-align: right;
}
.main-Article pre {
  border: 1px solid #000;
  margin: 2% 0;
  padding: 2%;
}
table {
  border-collapse: collapse;
  font-size: 13px;
  line-height: 1.5;
  margin-bottom: 20px;
  text-align: left;
}
table th {
  background: #00246f;
  border: 1px solid #00246f;
  color: #fff;
  padding: 10px;
  vertical-align: top;
  width: 20%;
}
table td {
  background: #fff;
  border: 1px solid #00246f;
  padding: 10px;
  vertical-align: top;
  width: 350px;
}

/* footer */
footer {
  background: #fff;
  position: relative;
}
.sitemap-Area {
  margin: 0 auto;
  padding: 3% 0;
  width: 70%;
}
.sitemap-Area > li {
  display: inline-block;
  margin-right: 3%;
  vertical-align: top;
}
.sitemap-Area > li:last-child {
  margin-right: 0;
}
.sitemap-Area > li p {
  color: #000;
}
.sitemap-Area > li li a {
  font-size: 12px;
  color: #000;
}
.sitemap-Area > li li a:hover {
  text-decoration: underline;
}
.copy-Right {
  background: #00246f;
  color: #fff;
  text-align: center;
}
.copy-Right p {
  font-weight: bold;
  margin: 0 auto;
  padding: 3% 0;
  width: 90%;
}

/* top-Icon */
#top-Icon-Box {
  height: auto;
  position: fixed;
  right: 27px;
  width: 65px;
}
.top-Icon {
  display: block;
}
.top-Icon:hover {
  opacity: 0.7;
}

/* under */
/* header */

/* sub-Container */
.sub-Container > h2 {
  border-bottom: 1px dotted #000;
  border-top: 1px dotted #000;
  color: #000;
  font-size: 25px;
  margin: 2% auto;
  padding: 1% 0;
  width: 70%;
}

/* pan-Nav */
#pan-Nav {
  color: #272727;
  font-size: 12px;
  margin: 0 auto;
  width: 70%;
}
#pan-Nav a {
  color: #272727;
}
#pan-Nav > span {
  margin: 0 1%;
}
#pan-Nav > span:first-child {
  margin: 0 1% 0 0;
}

/* side */

/* main */
.eyecatch {
  margin: 0 auto;
  width: 70%;
}
.eyecatch img {
  width: 100%;
}

/* SNS */
.button_Area {
  width: 100%;
}
.button-Ttl {
  background: #fff;
  border: 1px solid #000;
  padding: 6px 15px;
  text-align: center;
  width: 100%;
}
.sns-Container {
  display: flex;
  justify-content: space-between;
  margin: 0 auto 3%;
  width: 100%;
}
.button-Box {
  width: 100%;
  box-sizing: border-box;
}
.button-Box .fa {
  font-weight: bold;
}
.button-Link {
  display: block;
  text-align: center;
  color: #fff !important;
  font-size: 14px !important;
  padding: 10px 0 !important;
  box-sizing: border-box;
  text-decoration: none;
}
.button-Link:hover {
  text-decoration: none !important;
  filter: alpha(opacity=70);
  -moz-opacity: 0.7;
  opacity: 0.7;
}

/* SNSごとの背景色 */
#Twitter {
  background-color: #00acee;
}
#Hatena {
  background-color: #2d4c86;
}
#Facebook {
  background-color: #3b5998;
}
#Ggl-plus {
  background-color: #dd4b39;
}

/* not-Found */
.not-Found-Entry {
  border: 1px dotted #110c08;
  margin: 0 auto;
  padding: 20% 10%;
  width: 70%;
}