/*bootstrap対策*/
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-family: inherit;
  font-weight: 400;
  line-height: 1;
  color: inherit
}
p {
  margin: 0;
}
dl,
.ol,
.ul,
.dt,
.dd {
  margin: 0;
}

h3,
h4,
.dt p,
.read {
  font-weight: bold !important;
}
/****************************/
h1,
h2,
h3,
h4,
h5,
h6,
p,
.dl,
.dt,
.dd,
.ol,
.ul,
.li,
a,
span,
.address,
blockquote,
table,
tr,
th,
td {}
*,
::after,
::before {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-weight: 400;
  font-size: 2rem;
  /*overflow-x: hidden;*/
  /*横スクロールが出るのを隠すため*/
}
html,
body {
  font-size: 62.5%;
  font-weight: 400;
  /*font-size: 0.390625vw*/
  /*期値を10pxとする場合：10/2560*100=0.396（表示させたい文字サイズ÷width×100*/
  ;
  line-height: 1;
  color: #414141;
  /*transform: rotate(0.03deg);*/
}
body {
  font-size: 1.275rem;
  line-height: 1;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-weight: 300;
}

h3 {
  font-size: 14rem;
  font-weight: bold;
  color: #d3d5d8;
  margin: 0 0 10rem
    /*-17rem*/
    -3.33vw;
  width: fit-content;
}
h3::first-letter {
  color: #004d82;
}
h3 span {
  font-size: 3.3rem;
  color: #d0a4a3;
  content: "";
  display: block;
  text-align: right;
}
h3 span::before {
  content: "";
  width: 12rem;
  height: 0.1rem;
  background: #d0a4a3;
  display: inline-block;
  transform: rotate(-45deg);
  top: -3rem;
  position: relative;
}



/*汎用*/
.inner {
  width: 120rem;
  margin: auto;
}

.buttonA {
  background: #d0a4a3;
  height: 6rem;
  display: grid;
  align-items: center;
  text-align: center;
  width: 32rem;
  line-height: 1 !important;
}
.buttonA:hover {
  background: #fff;
  border: 0.1rem solid #d0a4a3;
  transition: 0.5s;
}
.buttonA:hover :is(a, a::after) {
  color: #d0a4a3 !important;
}
.buttonA a {
  color: #fff;
  height: inherit;
  display: flex;
  align-items: inherit;
  position: relative;
  justify-content: center;
}
.buttonA a::after {
  content: "▶";
  color: #fff;
  font-size: 1.2rem;
  right: 3rem;
  position: absolute;
}
.buttonA a:hover {
  text-decoration: none;
}



.buttonA-2 {
  /*Aの反転ver*/
  background: #fff;
  height: 6rem;
  display: grid;
  align-items: center;
  text-align: center;
  width: 32rem;
  line-height: 1 !important;
  border: 0.1rem solid #d0a4a3;
}
.buttonA-2:hover {
  background: #d0a4a3;
  border: 0.1rem solid #fff;
  transition: 0.5s;
  border: 0.1rem solid #d0a4a3;
}
.buttonA-2:hover :is(a, a::after) {
  color: #fff;
}
.buttonA-2 a {
  color: #d0a4a3;
  height: inherit;
  display: flex;
  align-items: inherit;
  position: relative;
  justify-content: center;
}
.buttonA-2 a::after {
  content: "▶";
  color: #d0a4a3;
  font-size: 1.2rem;
  right: 3rem;
  position: absolute;
}
.buttonA-2 a:hover {
  text-decoration: none;
}





.buttonB {
  background: #fff;
  height: 6rem;
  display: grid;
  align-items: center;
  text-align: center;
  width: 32rem;
  line-height: 1 !important;
  border: 0.1rem solid #f0be24;
}
.buttonB:hover {
  background: #f0be24;
  border: 0.1rem solid #fff;
  transition: 0.5s;
}
.buttonB:hover :is(a, a::after) {
  color: #fff;
}
.buttonB a {
  color: #f0be24;
  height: inherit;
  display: flex;
  align-items: inherit;
  position: relative;
  justify-content: center;
}
.buttonB a::after {
  content: "▶";
  color: #f0be24;
  font-size: 1.2rem;
  right: 3rem;
  position: absolute;
}
.buttonB a:hover {
  text-decoration: none;
}

.buttonB-2 {
  /*Bの反転ver*/
  background: #f0be24;
  height: 6rem;
  display: grid;
  align-items: center;
  text-align: center;
  width: 32rem;
  line-height: 1 !important;
  border: 0.1rem solid #fff;
  border: 0.1rem solid #f0be24;
}
.buttonB-2:hover {
  background: #fff;
  border: 0.1rem solid #f0be24;
  transition: 0.5s;
}
.buttonB-2:hover :is(a, a::after) {
  color: #f0be24;
}
.buttonB-2 a {
  color: #fff;
  height: inherit;
  display: flex;
  align-items: inherit;
  position: relative;
  justify-content: center;
}
.buttonB-2 a::after {
  content: "▶";
  color: #fff;
  font-size: 1.2rem;
  right: 3rem;
  position: absolute;
}
.buttonB-2 a:hover {
  text-decoration: none;
}



/*header*/
header {
  display: flex;
  justify-content: space-between;
  height: 13rem;
  position: sticky;
  top: 0;
  z-index: 9;
}
header .logo {
  /*width:42%;*/
  height: inherit;
  padding: 0 0 0 6.75%;
  display: grid;
  align-items: center;
}
header .logo img {
  width: 13.2rem;

}
header nav {
  /*width: 58%;*/
}
header nav .ul {
  display: flex;
  justify-content: space-between;
  height: 13rem;
}
header nav .ul .li {
  list-style: none;
  display: grid;
  flex-grow: 1;
  padding: 0 2vw;
}
header nav .ul .li p {
  flex-grow: 1;
  display: grid;
}
header nav .ul :is(.li:nth-of-type(1), .li:nth-of-type(6)) {
  display: none;
}

header nav .ul .li:nth-of-type(8) {
  width: 13rem;
  background: #0b3c95;
  flex-grow: initial;
  padding: 0;
}
header nav .ul .li:nth-of-type(8) a::before {
  content: "";
  background: url(/system_panel/uploads/images/icon_mail.png) no-repeat;
  width: 2.5rem;
  height: 2rem;
  margin: 0 auto 3rem;
}
header nav .ul .li:nth-of-type(9) {
  width: 13rem;
  background: #f0be24;
  flex-grow: initial;
  padding: 0;
  line-height: 1.25;
}
header nav .ul .li:nth-of-type(9) a::before {
  content: "";
  background: url(/system_panel/uploads/images/icon_entry.png) no-repeat;
  width: 3.4rem;
  height: 3rem;
  margin: 0 auto 1rem;
  line-height: 1.2;
}
header nav .ul .li a {
  /*height:inherit;*/
  color: #fff;
  display: grid;
  align-content: center;
  text-align: center;
  font-size: 1.9rem;
  font-weight: bold;
}
header nav .ul .li a:hover {
  text-decoration: none;
}



/* スクロールするため高さを出すためのsection */
header .section {
  height: 100vh;
  display: none;
}

header .section-a {
  background: #000;
}

header .section-b {
  background: #fff;
}

/* スクロールして「scroll-navクラス」がついたときのヘッダーデザイン */
header.scroll-nav {
  /* 余白を狭くする */
  padding: 0;
  /* 背景を白にする */
  background: rgba(255, 255, 255, 0.5);
  /* コンテンツの背景が白でもナビゲーションだと分かりやすいように影をつける */
  box-shadow: 0 0 1rem rgba(11, 60, 149, 0.7);
}

/* 「scroll-navクラス」がヘッダーについたときに、ロゴとナビゲーションの文字を黒にする */
header.scroll-nav :is(.logo, .ul .li a) {
  color: #000;
}
header.scroll-nav .ul .li :is(:nth-of-type(8) a, :nth-of-type(9) a) {
  color: #fff;
}



/*main*/
main{
  background-image:url(/system_panel/uploads/images/bg_line.png);
  background-position: center;
  background-repeat: repeat-y;
}
.mainimg {
  position: relative;
  height: 55rem;
  margin: 0 0 -13rem;
  top: -13rem;
  background-size: cover;
}
.mainimg .catch {
  top: 34rem;
  left: 6%;
  position: absolute;
}
.mainimg .catch h2 {
  font-size: 9rem;
  line-height: 1.3;
  color: #fff;
}
.mainimg .catch p {
  font-size: 2rem;
  color: #fff;
}

.bottom {
  padding: 10rem 0 5rem;
  background:#e6ebec url(/system_panel/uploads/images/bg_line.png);
  background-blend-mode: multiply;
  background-position:center;
  text-align: center;
}
.bottom h2 {
  font-size: 4.4rem;
  font-weight: bold;
  color: #d0a4a3;
  margin: 0 auto 5rem;
  width: fit-content;
}
.bottom h2::before {
  content: "";
  width: 12rem;
  height: 0.1rem;
  background: #d0a4a3;
  display: inline-block;
  transform: rotate(-45deg);
  top: -3rem;
  position: relative;
}
.bottom p {
  margin: 0 0 4rem;
}
.bottom [class^="button"] {
  display: inline-block;
  width: 40rem;
}
.bottom .buttonA {
  margin: 0 2rem 0 0;
}
.bottom .buttonA a::before {
  content: "";
  background: url(/system_panel/uploads/images/icon_mail.png) no-repeat;
  width: 2.5rem;
  height: 1.9rem;
  display: inline-block;
  margin: 0 2.5rem 0 -2.5rem;
}
.bottom .buttonA-2 span {
  font-size: 4.4rem;
}
.bottom .buttonA-2 a::after {
  content: "";
}



/*footer*/
footer {
  background: #0b3c95;
  padding: 10rem 0 3.5rem;
}
footer .col2 {
  display: flex;
  margin: 0 0 9rem;
  justify-content: space-between;
}
footer .col2 :is(.left, .right) {
  width: fit-content;
}
footer .col2 .left .logo {
  width: 15.7rem;
  margin: 0 0 5rem;
}
footer .col2 .left .logo img {
  width: 100%;
}
footer .col2 .left p {
  color: #fff;
  line-height: 2.5;
}
footer .col2 .right {}

footer .col2 .right nav {
  display: flex;
  gap: 7rem;
}
footer .col2 .right nav .ul {}
footer .col2 .right nav .ul .li p {
  line-height: 2.65;
}
footer .col2 .right nav>.ul>.li p {
  list-style: none;
}
footer .col2 .right nav>.ul>.li>p a {
  color: #fff;
}

footer .col2 .right nav>.ul>.li>.ul>.li p {
  display: list-item;
  list-style: inside;
}
footer .col2 .right nav>.ul>.li>.ul>.li p::marker {
  content: "-";
  color: #99c3cb;
}
footer .col2 .right nav>.ul>.li>.ul>.li>p a {
  color: #99c3cb;
}
footer .copyright {
  text-align: center;
}
footer .copyright a {
  color: #fff;
  text-decoration: none;
}





/*ページ遷移時のフェードイン効果*/
html {
  animation: fadein 3s forwards;
}
@keyframes fadein {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}


/**/
.aco2 {
  display: none;
  /*初期状態で開いておく場合はinitialに変更*/
}
#wrapper .aco2 {
  display: initial;
  /*初期状態で開いておく場合はinitialに変更*/
}

.aco-open {
  position: relative;
}
.aco-open::after {
  /* 閉じている時 */
  content: "×";
  position: absolute;
  top: 1.5rem;
  right: 2rem;
  font-size: 5rem;
  color: #b6e0c2;
}
.aco-open.active::after {
  /* 開いている時 */
  content: "＋";
  font-size: 5rem;
  color: #b6e0c2;
  top: 1.5rem;
}




/*animate.cssの追加css*/
.animate__delay-1s {
  animation-delay: calc(var(--animate-delay)*0.5) !important;
}
.animate__delay-2s {
  animation-delay: calc(var(--animate-delay)*1) !important;
}
.animate__delay-3s {
  animation-delay: calc(var(--animate-delay)*1.5) !important;
}
.animate__delay-4s {
  animation-delay: calc(var(--animate-delay)*2) !important;
}
.animate__delay-5s {
  animation-delay: calc(var(--animate-delay)*2.5) !important;
}
.animate__delay-6s {
  animation-delay: calc(var(--animate-delay)*3) !important;
}



/*wow.js用*/
.box {
  animation-fill-mode: forwards;
}


/*スムーススクロール*/
html {
  /*scroll-behavior: smooth;※smoooothでの使用は不可*/
}




/*-----ハンバーガーメニュー-----*/
.navToggle {
  display: none;
}





/*slick*/
:is(.slick-img img, .thumbnail-img img) {
  height: auto;
  width: 100%;
  aspect-ratio: 4/3;
  /*slickの仕様対策（比率違いの画像対策）*/
  padding: 1rem;
  object-fit: cover;
}
.slick-prev::before {
  content: "<" !important;
  color: #b2ebfe !important;
  font-weight: bold;
  font-size: 6rem !important;
}
.slick-next::before {
  content: " > " !important;
  color: #b2ebfe !important;
  font-weight: bold;
  font-size: 6rem !important;
}

.slick-next {
  right: -8rem !important;
}
.slick-prev {
  left: -8rem !important;
}
.slick-prev,
.slick-next {
  /*background:#000 !important;*/
  transform: scale(0.5, 1) !important;
  top: -40rem !important;
  padding: 1em;
  width: 5rem !important;
  height: 5rem !important;
}
.slick-prev:before,
.slick-next:before {
  color: #000;
  /*黒にする*/
  opacity: 1;
  /*デフォルトは.75が指定されている*/
}

/* 20231003@追加 */

.infoBoxFlex{
  display: flex;
  justify-content: center;
}

.buttonA-2.topTelLink {
  text-decoration: none;
}

.buttonA-2.topTelLinkBtm {
  text-decoration: none;
}

.topTelLinkBtm > p {
  line-height: 0;
}

.bottom p.topTelTit {
  margin: 5px 0 0 0;
}

.footer-sns-icon {
  max-width: 50px;
  height: auto;
  display: block;
}

.footer-sns-icon img{
  width: 100%;
}

.footer-icon-box {
  display: flex;
  gap: 14px;
  padding-top: 24px;
}
