.main-nav {
  position: relative;
}
.main-nav:after {
  clear: both;
  content: "\00a0";
  display: block;
  height: 0;
  font: 0px/0 serif;
  overflow: hidden;
}
.nav-brand {
  float: left;
  margin: 0;
}
.nav-brand a {
  display: block;
  padding: 10px 10px 10px 20px;
  color: #fff;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 22px;
  font-weight: normal;
  line-height: 29px;
  text-decoration: none;
}
.sm-blue ul {
  background: #fff;
}
.sm-blue > li {
  border-bottom: #ccc solid 1px;
}
.sm-blue > li > ul li {
  border-bottom: #ccc dotted 1px;
}
.sm-blue > li > ul li:last-child {
  border-bottom:none;
}
.sm-blue ul a, .sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a:active {
  background: transparent;
  color: #000;
  font-size: 16px;
  text-shadow: none;
  border-left: none;
  padding: .5em 0 .5em 2em;
}
.sm-blue ul ul a, .sm-blue ul ul a:hover, .sm-blue ul ul a:focus, .sm-blue ul ul a:active {
  border-left: none;
}
.sm-blue {
  border-radius: 0;
  background: none;
}
.sm-blue > li {
  border-left: none;
}
.sm-blue a, .sm-blue a:hover, .sm-blue a:focus, .sm-blue a:active, .sm-blue a.highlighted {
  color: #000000;
}
.sm-blue a, .sm-blue a:hover, .sm-blue a:focus, .sm-blue a:active {
  padding-left: 1em;
  background: none;
  font-size: 100%;
  font-weight: bold;
  text-shadow: none;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ Pro", "メイリオ", "Meiryo", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "Helvetica", "Verdana", sans-serif;
}
.sm-blue ul h2{
  text-align: left;
}
.sm-blue ul a, .sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a:active, .sm-blue ul a.highlighted {
  padding: 0;
  color: #ffffff;
  font-weight: normal;
}
.sm-blue ul a.current {
  background:none;
  background-image:none;
  color: #fff;
}
.sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a:active, .sm-blue ul a.highlighted {
  background:none;
  background-image: none;
  color: #000;
}
.sm-blue > li:first-child > a, .sm-blue > li:first-child > :not(ul) a {
  border-radius:0;
}
.sm-blue a .sub-arrow {
  right:2vw;
  background: #2C5EB7;
}
.sm-blue a .sub-arrow::before {
  color: #ffffff;
}
.sm-blue ul a, .sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a:active {
  background: transparent;
  color: #000;
  font-size: 16px;
  text-shadow: none;
  border-left: none;
  padding: .5em 0 .5em 2em;
}
.sm-blue ul ul a, .sm-blue ul ul a:hover, .sm-blue ul ul a:focus, .sm-blue ul ul a:active {
  border-left: none;
}
#main-menu .mega-menu .column-1-7,
#main-menu .mega-menu .column-1-6 {
  padding: 0;
}
#main-menu .mega-menu .column-1-7 h2,
#main-menu .mega-menu .column-1-6 h2 {
  padding: 10px 1em;
}
#main-menu .mega-menu .column-1-7 h2 a,
#main-menu .mega-menu .column-1-6 h2 a {
  padding-left:1em;
}
#main-menu .mega-menu .column-1-7 li a,
#main-menu .mega-menu .column-1-6 li a {
  padding: .5em 0 .5em 2em;
  display: block;
}
#main-menu .mega-menu .column-1-7 h2.pc-only,
#main-menu .mega-menu .column-1-6 h2.pc-only{
  display: none;
}
#main-menu .mega-menu .column-1-7 h2 a{
  display: block;
  font-weight: bold;
  padding: 0;
}
#main-menu .mega-menu .column-1-6.second ul li:first-child{
  border-top:none;
}
#main-menu {
  clear: both;
  -webkit-box-shadow: none;
  box-shadow: none;
}
#main-menu,
#main-menu > .has-mega-menu {
  position: static !important;
}
#main-menu .mega-menu {
  margin-left: 0 !important;
  margin-top: 0 !important;
  right: 0 !important;
  width: auto !important;
  max-width: none !important;
}
#main-menu > .has-mega-menu .scroll-up,
#main-menu > .has-mega-menu .scroll-down {
  margin-left: 0 !important;
}
#main-menu .mega-menu ul {
  position: static;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  width: auto;
  background: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}
#main-menu .mega-menu a {
  text-decoration: none;
}
.mega-menu-sample-image {
  margin: 0.83em 0;
  border: 1px solid;
  height: 80px;
  line-height: 80px;
  text-align: center;
}
#main-menu:before {
  content: '';
  display: block;
  height: 1px;
  font: 1px/1px sans-serif;
  overflow: hidden;
}
/* Mobile menu toggle button */
.main-menu-btn {
  float: right;
  margin: 2.5vw 2vw 0 0;
  position: relative;
  display: inline-block;
  width: 29px;
  height: 29px;
  text-indent: 29px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* hamburger icon */
.main-menu-btn-icon,
.main-menu-btn-icon:before,
.main-menu-btn-icon:after {
  position: absolute;
  top: 50%;
  left: 2px;
  height: 2px;
  width: 24px;
  background: #000000;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.main-menu-btn-icon:before {
  content: '';
  top: -7px;
  left: 0;
}
.main-menu-btn-icon:after {
  content: '';
  top: 7px;
  left: 0;
}
/* x icon */
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon {
  height: 0;
  background: transparent;
}
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:before {
  top: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:after {
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
/* hide menu state checkbox (keep it visible to screen readers) */
#main-menu-state {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
/* hide the menu in mobile view */
#main-menu-state:not(:checked) ~ #main-menu {
  display: none;
}
#main-menu-state:checked ~ #main-menu {
  display: block;
}
.sm-blue > li:last-child > a, .sm-blue > li:last-child > :not(ul) a {
  border-radius: 0 !important;
  /*background:linear-gradient(60deg, #2C5EB7, #61e1f8);*/
  background-image: linear-gradient(to right, #2C5EB7 0%, #3ba7fa  51%, #2C5EB7  100%);
  text-align: center;
  text-transform: uppercase;
  transition: 0.5s;
  background-size: 200% auto;
  color: #fff;
  display: block;
  padding: 12px 40px 12px 24px;
}
.sm-blue > li:last-child > a:hover {
  background-position: right center; /* change the direction of the change here */
  color: #fff;
  text-decoration: none;
}
@media only screen and (max-width:480px){
ul#main-menu{
  position: absolute !important;
  background: #fff;
  width: 100%;
  top: 12.5vw;
}
#main-menu .mega-menu ul {
  padding: 0;
}
.main-menu-btn {
  margin: 1vw 2vw 0 0;
}
#main-menu .mega-menu .column-1-7 li a, #main-menu .mega-menu .column-1-6 li a {
    padding: .5em 2em;
}
.sm-blue > li > ul li:last-child {
  border-bottom: none;
}
}
@media (min-width: 768px) {
  /* hide the button in desktop view */
#main-menu {
  float: none;
  clear: both;
}
.main-menu-btn {
  margin: 2.5vw 2vw 0 0;
}
}
@media (min-width: 960px) {
  .main-menu-btn {
    display: none;
  }
  #main-menu {
    float: none;
    clear: both;
  }
  #main-menu:before {
    display: none;
  }
  #main-menu-state:not(:checked) ~ #main-menu {
    justify-content: space-around;
    display: flex;
    justify-content: center;
  }
  ul.mega-menu {
    padding: 2vw 0;
  }
  .mega-menu ul {
    padding: 0;
  }
  .sm-blue{
    border-radius: 0;
  }
  .sm-blue a .sub-arrow {
    display: none;
  }
  ul.simple-menu a,
  ul.simple-menu a:hover{
    border-bottom: #0F439F solid 1px !important;
  }
  ul.simple-menu a:hover{
    background: #0F439F;
  }
  .sm-blue > li {
    border-top: none;
    border-bottom:none;
  }
  .sm-blue > li > ul li {
    border-bottom:none;
  }
  .sm-blue > li:last-child > a, .sm-blue > li:last-child > :not(ul) a {
    border-radius: 0 !important;
  }
  .sm-blue a, .sm-blue a:hover, .sm-blue a:focus, .sm-blue a:active {
    font-size: 94%;
  }
  .sm-blue a, .sm-blue a:hover, .sm-blue a:focus, .sm-blue a:active, .sm-blue a.highlighted {
    padding: 12px 24px;
  }
  .sm-blue ul a, .sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a:active, .sm-blue ul a.highlighted {
    color: #fff;
    padding: .8vw 2vw;
  }
  .sm-blue a .sub-arrow {
    display: none;
  }
  .sm-blue ul {
    border: none;
    padding:0;
    background: #2C5EB7;
    border-radius: 0;
    box-shadow:none;
    color: #fff;
  }
  .sm-blue a:hover{
    background: #2C5EB7;
    color: #fff;
  }
  .sm-blue a.highlighted{
    color: #fff;
  }
  .sm-blue ul h2{
    color:#fff;
    margin-bottom: .5em;
    font-size: 1.6rem;
  }
  .sm-blue ul h2 a,
  .sm-blue ul h2 a:hover{
    font-size: 1.8rem !important;
    font-weight: bold;
  }
  ul.mega-menu{
    padding: 2vw 0;
  }
  #main-menu .mega-menu ul {
    padding: 0;
  }
  ul.mega-menu li{
    margin-bottom:.2em;
  }
  ul.mega-menu li{
    margin-bottom:.2em;
  }
  ul.mega-menu li a{
    padding: 5px 10px;
    font-size:1.3rem;
  }
  ul.mega-menu li a:hover{
    padding: 5px 10px;
    background: #0F439F;
    font-size:1.3rem;
  }
  #main-menu .mega-menu .column-1-7,
  #main-menu .mega-menu .column-1-7:nth-child(5) {
    float: left;
    width: auto;
    border-left: #0F439F solid 1px;
    padding: 0 2vw;
    min-height: 6em;
  }
  #main-menu .mega-menu .column-1-7:first-child {
    border-left:none; 
  }
  #main-menu .mega-menu .column-1-7:nth-child(2),
  #main-menu .mega-menu .column-1-7:nth-child(4),
  #main-menu .mega-menu .column-1-7:nth-child(6),
  #main-menu .mega-menu .column-1-7:nth-child(8){
    border-left:none;
    padding: 0;
  }
  #main-menu .mega-menu .column-1-7 ul{
    margin-right:2vw;
  }
  #main-menu .mega-menu .column-1-6 {
    float: left;
    width: 16.66%;
    border-left: #0F439F solid 1px;
    padding: 0 1vw;
    box-sizing: border-box;
    min-height: 16em;
  }
  #main-menu .mega-menu .column-1-7.first
  #main-menu .mega-menu .column-1-6.first,
  #main-menu .mega-menu .column-1-6.second{
    border-left: none;
  }
  #main-menu .mega-menu .column-1-6.second{
    margin-top: 27px;
  }
  #main-menu .mega-menu .column-1-7 h2,
  #main-menu .mega-menu .column-1-6 h2 {
    padding: .5rem;
}
  #main-menu .mega-menu .column-1-7 h2 a,
  #main-menu .mega-menu .column-1-6 h2 a {
    padding: .5rem;
}
  ul.sm-blue li ul li ul.top{
    margin-bottom: 2em !important;
  }
  ul.sm-blue li ul{
    /*overflow: hidden;*/
    max-height:9999px !important;
  }
  #main-menu .mega-menu .column-1-4 li:last-child, #main-menu .mega-menu .column-1-6 li:last-child {
    border-bottom: none;
}
  @keyframes SlideDown {
    0% {
      opacity: 0;/* 透明 */
      transform: translateY(-20px);/* Y軸方向に-50px */
    }
    100% {
      opacity: 1;/* 不透明 */
      transform: translateY(0);/* Y軸方向に0px */
    }
  }
  ul.sm-blue li ul{
    position: absolute;
    max-height: 0;
    animation-duration: .2s;
    animation-name: SlideDown;
  }
}
@media (min-width: 1280px) {
#main-menu-state:not(:checked) ~ #main-menu {
    justify-content: space-around;
    display: flex;
  }
  #main-menu {
    float: right;
    clear: none;
  }
  #main-menu-state:not(:checked) ~ #main-menu {
    display: block;
  }
  .sm-blue ul {
    border: none;
    padding:0;
    background: #2C5EB7;
    border-radius: 0;
    box-shadow:none;
    color: #fff;
  }
  .sm-blue ul a, .sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a:active, .sm-blue ul a.highlighted {
    color: #fff;
    padding: .8vw 2vw;
  }
  ul.simple-menu a,
  ul.simple-menu a:hover{
    border-bottom: #0F439F solid 1px !important;
  }
  ul.simple-menu li a:last-child,
  ul.simple-menu li a:last-child:hover{
    border-bottom: none;
  }
  ul.simple-menu a:hover{
    background: #0F439F;
  }
  ul.mega-menu{
    padding: 2vw 0;
  }
  #main-menu .mega-menu ul {
    padding: 0;
  }
  ul.mega-menu li{
    margin-bottom:.2em;
  }
  ul.mega-menu li a{
    padding: 5px 10px;
    font-size:1.4rem;
  }
  ul.mega-menu li a:hover{
    padding: 5px 10px;
    background: #0F439F;
    font-size:1.4rem;
  }
  .sm-blue ul a ul.mega-menu li a{
    border-bottom:none;
  }
#main-menu .mega-menu .column-1-7 li a,
#main-menu .mega-menu .column-1-6 li a {
  padding: .5em;
}
  .sm-blue ul h2{
    color:#fff;
    margin-bottom: .5em;
    font-size: 1.8rem;
    text-align: left;
  }
  .sm-blue a .sub-arrow {
    display: none;
  }
  #main-menu {
    margin-top: 43px;
  }
  .sm-blue a, .sm-blue a:hover, .sm-blue a:focus, .sm-blue a:active, .sm-blue a.highlighted {
    padding: 12px 1vw;
    color: #000;
  }
/*外部リンクアイコン*/
  .sm-blue a[target="_blank"] {
    padding-right: 2vw;
    position: relative;
  }
  .sm-blue a[target="_blank"]::after {
    content:"\f35d";
    font-family: "Font Awesome 5 Free";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    font-weight: 600;
    position: absolute;
    top: 30%;
    padding-left: 0.3em;
    margin-right: 2vw;
  }
  .sm-blue a:hover{
    background: #2C5EB7;
    color: #fff;
  }
  .sm-blue a.highlighted{
    color: #fff;
  }
  .sm-blue ul a, .sm-blue ul a:hover, .sm-blue ul a:focus, .sm-blue ul a:active, .sm-blue ul a.highlighted {
    border: none;
  }
  .main-nav {
    padding-right:75px;
  }
  #main-menu li a:hover::before {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    content: '';
    height: 4px;
    background: #0055c4;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s all;
  }
  #main-menu .mega-menu .column-1-6 {
    float: left;
    width: 16.66%;
    border-left: #0F439F solid 1px;
    padding: 0 1vw;
    box-sizing: border-box;
    min-height: 16em;
  }
  #main-menu .mega-menu .column-1-6.first,
  #main-menu .mega-menu .column-1-6.second{
    border-left: none;
  }
  #main-menu .mega-menu .column-1-6.second{
    margin-top: 43px;
  }
  ul.sm-blue li ul li ul.top{
    margin-bottom: 2em !important;
  }
  ul.sm-blue li ul{
    /*overflow: hidden;*/
    max-height:9999px !important;
  }
  @keyframes SlideDown {
    0% {
      opacity: 0;/* 透明 */
      transform: translateY(-20px);/* Y軸方向に-50px */
    }
    100% {
      opacity: 1;/* 不透明 */
      transform: translateY(0);/* Y軸方向に0px */
    }
  }
  ul.sm-blue li ul{
    position: absolute;
    max-height: 0;
    animation-duration: .2s;
    animation-name: SlideDown;
  }
}