/* Boatshow 2023 pre */
/* common.css */

body {
  font-family: Hiragino Kaku Gothic ProN,'ヒラギノ角ゴ ProN W3',Meiryo,'メイリオ',YuGothic,'游ゴシック sans-serif',roboto,Arial,sans-serif;
  color:#222222;
}
p, figcaption {
  font-size: 1.2rem;
}
@media screen and (min-width:768px){
}
@media screen and (max-width:767.9px){
}
/* header start */
#header-fixed {
  color: #222222;
  background-color: #ffffff;
  transition:  .4s;
  padding-bottom: 0;
}
#header-fixed.is-show {
  background-color: #ffffffdd;
  color: #666666;
}
.navbar-brand,
.logo {
  width: 240px;
  height: auto;
}
.navbar {
  padding-top: 0;
}
.navbar-nav {
  font-size: 1.0rem;
}
.navbar-brand {
  background-color: #ffffff;
}
#header-fixed.is-show .navbar-brand {
  background-color: transparent;
}
.navbar-light .navbar-nav .nav-link {
  font-weight: normal;
  padding-right: .8rem;
  padding-left: .8rem;
  border-top: 1px solid transparent;
}
.navbar-light .navbar-nav .nav-link.active {
  border-top: 1px solid #63a0fa;
}
.navbar-light .navbar-nav .nav-link:hover {
  border-top: 1px solid #bbbbbb;
}
#header-fixed.is-show .nav-link {
  color: #222222cc;
}
#header-fixed.is-show .nav-link.active,
#header-fixed.is-show .nav-link.focus,
#header-fixed.is-show .nav-link.hover {
  color: #222222;
}

@media screen and (min-width:768px){
  .logo {
    max-width: 240px;
  }
  .home .navbar-light .navbar-nav .nav-link {
    color: #222222cc;
  }
  .home .navbar-light .navbar-nav .nav-link.active,
  .home .navbar-light .navbar-nav .nav-link:hover {
    color: #222222;
  }
  .home .navbar-light .navbar-nav .show>.nav-link,
  .home .navbar-light .navbar-nav .nav-link:focus {
    color: #222222cc;
  }
}

@media screen and (max-width:767.9px){
  #header-fixed {
    background-color: #ffffff;
    color: #666666;
  }
  .navbar-collapse.show {
    position: relative;
  }
  .logo {
    max-width: 50vw;
  }
  .navbar-light .navbar-toggler {
    border: none;
  }
  .navbar-light .navbar-nav .nav-link {
    padding: 1rem;
    font-size: 1rem;
    border-top: none;
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
  }
  .navbar-light .navbar-nav .nav-link.active {
    border-top: 1px solid transparent;
    border-left: 1px solid #63a0fa;
  }
  .navbar-light .navbar-nav .nav-link:hover {
    border-top: 1px solid transparent;
    border-left: 1px solid #bbbbbb;
  }
}
/* header end */
/* footer start */
#footer {
  background: rgb(0,94,255);
  background: linear-gradient(135deg, #004288 69%, #004288ee 69%, #004288 80%);
}
#footer-innner {
  position: relative;
  padding: 2rem 0;
  display: flex;
  justify-content:space-between;
  align-items: flex-end;
}
.footer-aside {
  position: relative;
}
.backtotop {
  margin-bottom: 0;
}
.backtotop a {
  position: absolute;
  right: 0rem;
  top: -80px;
  width: 0;
  height: 0;
  border-top: 40px solid transparent;
  border-right: 40px solid #666666;
  border-bottom: 40px solid #666666;
  border-left: 40px solid transparent;
  margin-right:0px;
  margin-bottom:0px;
  background:none;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
}
.backtotop a:before {
  display:block;
  margin-right:-20px;
  margin-top: 13px;
}
.backtotop a:hover {
  opacity: .8;
}
.icon .bi-chevron-up {
  fill: #ffffff;
}

.logo {
  width: 100%;
  height: auto;
}
.nav-footer {
  margin-bottom: 0;
}
.nav-footer li {
  list-style-type: none;
  color: #ffffff;
  font-size: 1.0rem;
}
.nav-footer li:before {
  content: "｜";
}
.nav-footer li:first-of-type:before {
  content: "";
}
.nav-footer a {
  color: #ffffff;
  text-decoration: none;
  padding: .4rem;
  border-radius: .5rem;
}
.nav-footer a:hover {
  background-color: #ffffff22;
  text-decoration: none;
}
.copy-footer {
  text-align: right;
  color: #ffffff;
  font-size: .9rem;
  margin-bottom: 0;
}
@media screen and (min-width:768px){
}
@media screen and (max-width:767.9px){
  #footer-innner {
    padding: 1rem;
    display: block;
    justify-content:space-between;
    align-items: flex-end;
  }
  .nav-footer {
    margin-top: 2rem;
    padding-left: 0;
  }
  .nav-footer li {
    margin-bottom: .8rem;
  }
  .nav-footer li:first-of-type:before,
  .nav-footer li:before {
    content: "▶︎";
    font-size: .5em;
  }
  .copy-footer {
    font-size: .8rem;
    margin-top: 2rem;
  }
}
/* footer end */
/* component */
.section {
  padding-top: 2rem;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}
.h2-01 {
  font-weight: bold;
  text-align: center;
  margin-bottom: 2rem;
}
.lead {
  font-size: 1.4rem;
}
.btn {
  font-size: 1.2rem;
}
.btn:hover {
  opacity: .85;
}
.btn-more {
  color: #fff;
  background-color: #ff8400;
}
.mark {
  background-color: #dddddd;
}
.btn-more:hover,
a.btn-more:hover {
  color: #fff;
  background: #ff9922;
}
.btn-home {
  color: #ffffff;
  background-color: #85a9f5;
  font-size: .8rem;
}
.btn-home:hover {
  color: #fff;
  background-color: #0042ca;
}
.icon.icon-download {
  display: inline;
  width: 1.2em;
  margin-left: .3em;
}
.triangle {
  position: relative;
  overflow: hidden;
}
.triangle:before {
  background-color: #005eff;
  position: absolute;
  content: "";
  top: -3vw;
  left: -3vw;
  width: 6vw;
  height: 6vw;
  rotate: 45deg;
}
.btn.triangle:before {
  background-color: #ff5e00;
  left: -6vw;
}
figure img {
  width: 100%;
  height: auto;
  background-color: #f9f9f9;
}
.underline {
}
@media screen and (min-width:768px){
}
@media screen and (max-width:767.9px){
  .triangle:before {
    top: -5vw;
    left: -5vw;
    width: 10vw;
    height: 10vw;
    rotate: 45deg;
  }
}
/* -------------------------------------------------
	responsive
------------------------------------------------- */

@media print, screen and (min-width:768px) {
	.pc-none {
		display: none !important;
	}
}

@media screen and (max-width:767px) {
	.sp-none {
		display: none !important;
	}
}
