.fl {
  display: flex;
  flex-wrap: wrap;
}

.hasbg img {
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.hasbg {
  height: 100%;
  position: relative;
}

/* header css */
/* .container-wrapper {
  width: 100%;
  margin: 0 auto;
} */
.header-contents {
  position: fixed;
  width: 100%;
  background-color: #fff;
  z-index: 9999;
}

.sp-nav {
  display: none;
}

#header .header-wrap {
  width: 100%;
  height: 65px;
  border-bottom: solid 3px rgba(0, 137, 206, 1);
  position: relative;
}

#header .inner-header,
#header .main-contents {
  width: 100%;
  height: 100%;
}

#header .header-wrap .inner {
  height: 100%;
}

#header .inner-header.fl {
  z-index: 999;
  justify-content: space-between;
}

#header .inner-header .logo {
  position: relative;
  width: 85px;
  height: 100%;
  margin: 0 30px;
}

#header .logo a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

#header .inner-header .logo img {
  width: 100%;
  margin: 18px auto 0;
}

#header .global-nav,
#header .global-nav .main-wrap,
#header .sub-nav ul {
  height: 100%;
}

#header .global-nav .main-wrap>li>a {
  /* padding: 0px 30px; */
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
  color: #333;
  text-decoration: none;
  z-index: 999;
  position: relative;
}

#header .global-nav .main-wrap>li {
  font-size: 14px;
  min-width: 125px;
}

#header .inner-header,
#header .global-nav li,
#header .sub-header-wrap li {
  height: 100%;
  transition: .3s;
}

#header .global-nav .main-wrap>li>a:hover {
  background-color: rgba(0, 137, 206, 1);
  color: #fff;
  transition: .3s;
}

#header .sub-header-wrap {
  width: 100%;
  height: 0px;
  background-color: rgb(241, 241, 241);
  font-size: 12px;
  justify-content: center;
  position: absolute;
  bottom: 20px;
  left: 0;
  opacity: 0;
  /* -webkit-transition: .1s;
  transition: .1s; */
  z-index: -1;
  border-top: solid 3px rgba(0, 137, 206, 1);
  transition-delay: .2s;
}

#header .global-nav .main-wrap>li:hover>.sub-header-wrap {
  /* transform: translateY(0px); */
  height: 40px;
  bottom: -40px;
  -webkit-transition: opacity .3s;
  transition: opacity .3s;
  opacity: 1;
  z-index: 110;
}

#header .global-nav .main-wrap>li:hover>a {
  background-color: #0289cf;
  color: #fff;
}

#header .sub-header-wrap ul {
  height: 100%;
  justify-content: center;
}

#header .sub-header-wrap ul li {
  height: 100%;
  margin: 0px 35px;
  position: relative;
}

#header .sub-header-wrap ul li:before {
  content: "";
  position: absolute;
  top: 50%;
  right: -30px;
  transform: rotate(38deg) translateY(-50%);
  width: 1px;
  height: 14px;
  background-color: #6d6d6d;
}

#header .sub-header-wrap ul li:last-child:before {
  display: none;
}

#header .sub-header-wrap ul li a:hover {
  color: #e6469a;
  transition: .3s;
}

#header .sub-header-wrap a {
  height: 100%;
  color: #33333C;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: .3s;
}

footer {
  background-color: rgb(47, 47, 47);
  color: #e2e2e2;
  margin-top: 100px;
  padding: 45px 0px 20px;
}

footer h2 a {
  color: #fff;
  text-decoration: none;
  transition: .3s;
}

footer ul li>a {
  color: #b9b9b9;
  text-decoration: none;
}

footer ul {
  display: flex;
  justify-content: center;
}

footer ul li {
  margin-right: 50px;
  position: relative;
}

footer ul li:hover h2 a {
  color: #e13392;
  transition: .3s;
}

footer ul li:before {
  content: "";
  position: absolute;
  top: 50%;
  right: -21px;
  transform: rotate(38deg) translateY(-50%);
  width: 1px;
  height: 14px;
  background-color: #6d6d6d;
}

footer ul li:last-child::before {
  display: none;
}

footer ul li:last-child {
  margin-right: 0;
}

footer ul li.contact-wrapper p {
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  padding-bottom: 20px;
}

footer ul li.contact-wrapper {
  flex: 1;
  width: auto;
  margin-right: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-left: 1px solid #424242;
}

footer ul li.contact-wrapper .bt {
  position: relative;
  padding: 17px 30px;
  border: 1px solid #eaeaea;
  border-radius: 9px;
  width: 178px;
  text-align: center;
  font-size: 14px;
  transition: .3s;
}

footer ul li.contact-wrapper .bt:hover {
  background-color: #eaeaea;
  color: #1b1b1b;
  transition: .3s;
}

footer ul li.contact-wrapper .bt a {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

footer ul li.contact-wrapper .fcw-wrap {
  margin-right: 50px;
}

footer ul li.contact-wrapper .fcw-wrap:last-child {
  margin-right: 0;
}

footer ul li h2 {
  font-size: 14px;
  color: #fff;
  transition: .3s;
}

footer ul li>a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(3px, -50%);
  width: 3px;
  height: 3px;
  background-color: #b9b9b9;
}

footer ul li>a {
  display: block;
  font-size: 12px;
  margin-bottom: 13px;
  padding-left: 15px;
  position: relative;
  transition: .2s;
}

footer ul li>a:hover {
  color: #fff;
  transition: .2s;
}

.footer-under {
  margin: 35px 50px 20px;
  padding-top: 40px;
  border-top: 1px solid #424242;
}

.footer-logo img {
  width: 100%;
}

.footer-logo {
  width: 110px;
  margin-top: 0;
  padding-top: 7px;
}

.footer-under p span {
  display: block;
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 5px;
  color: #989898;
}

.footer-under p {
  display: block;
  /* margin-left: 40px; */
  font-size: 13px;
  line-height: 20px;
  opacity: 0.75;
  color: #a1a1a1;
}

.footer-under .inner {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.footer-sns a {
  width: 28px;
  margin: 20px 8px 0;
}

.footer-sns {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.footer-under .copy {
  display: block;
  font-size: 11px;
  padding-top: 40px;
  text-align: center;
  color: #989898;
  /* font-weight: bold; */
}

.footer-under p.danger {
  margin-bottom: 5px;
}

/*===============================
下層メインビジュアル
===============================*/
section.pages-visual {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding: 100px 0 70px;
}

#pages-visual .visal {
  display: flex;
  height: 480px;
  position: relative;
}

#pages-visual .visal .pages-ttl-wrap {
  width: 45%;
  background: -moz-linear-gradient(-45deg, rgba(68, 226, 234, 0.8) 0%, rgba(68, 226, 234, 0.8) 18%, rgba(0, 96, 214, 0.8) 100%);
  background: -webkit-linear-gradient(-45deg, rgba(68, 226, 234, 0.8) 0%, rgba(68, 226, 234, 0.8) 18%, rgba(0, 96, 214, 0.8) 100%);
  background: linear-gradient(135deg, rgba(68, 226, 234, 0.8) 0%, rgba(68, 226, 234, 0.8) 18%, rgba(0, 96, 214, 0.8) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc44e2ea', endColorstr='#cc0060d6', GradientType=1);
  position: relative;
  z-index: 2;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
}

#pages-visual .visal .pages-img {
  width: 70%;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  z-index: 1;
}

#pages-visual .img-wrapper {
  width: 100%;
  height: auto;
  position: relative;
}

#pages-visual .img-wrapper:before {
  content: "";
  display: block;
  padding-top: 400px;
}

#pages-visual .visal .pages-img .img-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 5px 0 0 5px;
}

#pages-visual .page-ttl {
  color: #fff;
}

#pages-visual .page-ttl .en::before {
  position: absolute;
  content: "";
  width: 50px;
  height: 4px;
  bottom: 0;
  left: 0;
  background-color: #fff;
}

#pages-visual .page-ttl .en {
  position: relative;
  font-size: 55px;
  font-weight: 400;
  letter-spacing: 5px;
  padding-bottom: 20px;
  margin-bottom: 15px;
}

#pages-visual .page-ttl .jp {
  text-align: left;
  /* font-weight: bold; */
  font-size: 18px;
}

/*===============================
/下層メインビジュアル
===============================*/
.inner {
  width: 1320px;
  margin: 0 auto;
}

.banner {
  margin-bottom: 70px;
  position: relative;
}

.banner a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.banner .img-wrap {
  width: 70%;
  margin: 0 auto;
}

.banner .img-wrap img {
  width: 100%;
}

.banner .img-wrap img.sp {
  display: none;
}