/*!******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[2].use[3]!./src/scss/top.scss ***!
  \******************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* Mixins */
/* IEハック用mixin */
/*========= LoadingのためのCSS ===============*/
/* Loading背景画面設定　*/
#splash {
  /*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 10000;
  background: #fff;
  text-align: center;
  color: #333;
}

/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo svg {
  max-width: 600px;
  width: 100%;
}

/*============================
.sectionTitle（共通）
============================*/
.sectionTitle {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 1em;
}
.sectionTitle .ja {
  position: relative;
  font-weight: bold;
  line-height: 1.2;
  font-size: clamp(2rem, 2.6vw, 3.4rem);
}
.sectionTitle .en {
  position: relative;
  font-weight: bold;
  line-height: 1.2;
  font-family: "Roboto", sans-serif;
  font-size: clamp(1.4rem, 1.5vw, 1.6rem);
  color: #053a86;
}

/*============================
.topBtn（共通）
============================*/
.topPageBtn {
  background-color: #053a86;
  color: #fff;
  padding: 1em 3em;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1.2;
  border-radius: 3em;
  display: inline-block;
  letter-spacing: -0.01em;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  position: relative;
  -webkit-box-shadow: 0px 0px 0px 0px #053a86 inset, 0 10px 20px 0px rgba(32, 45, 64, 0.3);
          box-shadow: 0px 0px 0px 0px #053a86 inset, 0 10px 20px 0px rgba(32, 45, 64, 0.3);
}
@media screen and (min-width: 480px ) {
  .topPageBtn {
    font-size: 1.8rem;
  }
}
.topPageBtn:hover {
  -webkit-box-shadow: 0px 0px 0px 2px #053a86 inset, 0 10px 20px 0px rgba(32, 45, 64, 0.3);
          box-shadow: 0px 0px 0px 2px #053a86 inset, 0 10px 20px 0px rgba(32, 45, 64, 0.3);
  background-color: #fff739;
  color: #053a86;
}
.topPageBtn::after {
  font-family: "Font Awesome 5 Free";
  content: "\f054";
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-animation: passing-anime 2s linear infinite;
          animation: passing-anime 2s linear infinite;
  position: absolute;
  right: 1em;
  top: 1em;
}

.topPageBtn-yellow {
  background-color: #fff739;
  color: #053a86;
  padding: 1em 3em;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1.2;
  border-radius: 3em;
  display: inline-block;
  letter-spacing: -0.01em;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  position: relative;
  -webkit-box-shadow: 0px 0px 0px 0px #053a86 inset, 0 10px 20px 0px rgba(32, 45, 64, 0.3);
          box-shadow: 0px 0px 0px 0px #053a86 inset, 0 10px 20px 0px rgba(32, 45, 64, 0.3);
}
@media screen and (min-width: 480px ) {
  .topPageBtn-yellow {
    font-size: 1.8rem;
  }
}
.topPageBtn-yellow:hover {
  -webkit-box-shadow: 0px 0px 0px 2px #053a86 inset, 0 10px 20px 0px rgba(32, 45, 64, 0.3);
          box-shadow: 0px 0px 0px 2px #053a86 inset, 0 10px 20px 0px rgba(32, 45, 64, 0.3);
  background-color: #fff739;
  color: #053a86;
}
.topPageBtn-yellow::after {
  font-family: "Font Awesome 5 Free";
  content: "\f054";
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-animation: passing-anime 2s linear infinite;
          animation: passing-anime 2s linear infinite;
  position: absolute;
  right: 1em;
  top: 1em;
}

@-webkit-keyframes passing-anime {
  0% {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    opacity: 0;
  }
  50% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    opacity: 0;
  }
}

@keyframes passing-anime {
  0% {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    opacity: 0;
  }
  50% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    opacity: 0;
  }
}
/* =========================================================
topHero
========================================================= */
.topHero {
  position: relative;
  padding: 0 0 20px;
}
@media screen and (min-width: 768px ) {
  .topHero {
    padding: 50px 0;
  }
}
@media screen and (max-width: 767px ) {
  .topHero-inner {
    padding-left: 0;
    padding-right: 0;
  }
}
.topHero-box {
  position: relative;
  margin: 0 auto;
  width: 100%;
  overflow: hidden;
}
@media screen and (min-width: 768px ) {
  .topHero-box {
    border: 5px solid #fff;
    border-radius: 20px;
  }
}
.topHero-txtWrap {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.topHero-logo {
  max-width: 50vw;
  margin-bottom: 10%;
}
.topHero-img {
  height: 70vw;
}
@media screen and (min-width: 768px ) {
  .topHero-img {
    height: auto;
  }
}
.topHero-img img {
  width: 100%;
  max-width: initial;
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
}

/* =========================================================
.topImportant
========================================================= */
.topImportant {
  padding-top: 30px;
  padding-bottom: 30px;
}
@media screen and (min-width: 768px ) {
  .topImportant {
    padding-left: 60px;
    padding-right: 60px;
  }
}
.topImportant .topImportantList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 10px;
}
.topImportant .topImportantCard {
  padding: 1em;
  display: block;
  background-color: #fbf5eb;
}
.topImportant .topImportantCard-txtArea {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 1.6;
}
.topImportant .topImportantCard-txtArea__icon {
  width: 15px;
  margin-right: 5px;
  color: #fff739;
}
.topImportant .topImportantCard-txtArea__icon img {
  display: block;
}
.topImportant .topImportantCard-txtArea__txt {
  width: calc(100% - 20px);
}
.topImportant .topImportantCard-txtArea__txt a {
  color: #053a86;
}
.topImportant .topImportantCard-txtArea__txt a:hover {
  color: #ff6625;
}

/*============================
topAbout
============================*/
.topAbout {
  position: relative;
  padding: 0 0 30px;
}
@media screen and (min-width: 768px ) {
  .topAbout {
    padding: 0 0 50px;
  }
}
.topAbout-inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 768px ) {
  .topAbout-inner {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}
.topAbout-txtArea {
  width: 100%;
  position: relative;
  padding: 3%;
}
@media screen and (min-width: 768px ) {
  .topAbout-txtArea {
    width: 45%;
  }
}
@media screen and (min-width: 990px ) {
  .topAbout-txtArea {
    padding: 5%;
  }
}
.topAbout-txtArea > * {
  z-index: 1;
  position: relative;
}
.topAbout-txtArea h2 {
  font-weight: bold;
  line-height: 1.4;
  color: #053a86;
  margin-bottom: 0.5em;
  text-align: center;
  font-size: clamp(2rem, 2.6vw, 3rem);
}
.topAbout-txtArea p {
  margin-bottom: 1em;
}
.topAbout-txtArea .topAbout-btn {
  text-align: center;
}
@media screen and (min-width: 768px ) {
  .topAbout-txtArea::before {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    width: 0%;
    padding-top: 0%;
    border-radius: 50%;
    background-color: #fff;
    display: block;
    content: "";
  }
}
.topAbout-txtArea.effect_start::before {
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  width: 110%;
  padding-top: 110%;
}
.topAbout-imgArea {
  width: 100%;
}
@media screen and (min-width: 768px ) {
  .topAbout-imgArea {
    width: 55%;
  }
}
.topAbout-img {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  border: 10px solid #fff;
}
.topAbout-img .logo {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  display: block;
  content: "";
  width: 23%;
}

/* =========================================================
.topBusiness
========================================================= */
.topBusiness {
  padding: 30px 0;
}
@media screen and (min-width: 768px ) {
  .topBusiness {
    padding: 50px 0;
  }
}
.topBusiness-inner {
  position: relative;
}
@media screen and (min-width: 768px ) {
  .topBusiness-inner::before {
    position: absolute;
    background: url(../images/common/obj-circle_big.svg) no-repeat center center/cover;
    width: 50%;
    padding-top: 50%;
    right: -25%;
    bottom: 0;
    content: "";
    display: block;
  }
}
.topBusiness .sectionTitle::before {
  font-size: clamp(2rem, 2.6vw, 3.4rem);
  position: absolute;
  background-color: #fff;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  content: "";
  display: block;
  border-radius: 50%;
}
.topBusiness .sectionTitle.effect_start::before {
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  width: 7em;
  height: 7em;
}
.topBusiness .businessCardList {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  border-radius: 50%;
}
@media screen and (min-width: 768px ) {
  .topBusiness .businessCardList {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 30px;
  }
}
.topBusiness .businessCardList .businessCard-imgArea {
  border: 3px solid #053a86;
  overflow: hidden;
  border-radius: 10px;
  position: relative;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  overflow: hidden;
  background-color: #053a86;
}
.topBusiness .businessCardList .businessCard-imgArea img {
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
}
.topBusiness .businessCardList .businessCard:hover .businessCard-imgArea {
  border: 3px solid #ff6625;
}
.topBusiness .businessCardList .businessCard:hover .businessCard-imgArea img {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  opacity: 0.8;
}
.topBusiness .businessCardList .businessCard-txtArea {
  margin-top: 3px;
  font-weight: bold;
  position: relative;
  display: block;
}
.topBusiness .businessCardList .businessCard-title {
  line-height: 1.2;
  font-size: clamp(1.4rem, 2vw, 1.8rem);
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1fr;
  grid-template-columns: auto 1fr;
  gap: 2px;
}
.topBusiness .businessCardList .businessCard-title i {
  line-height: 1.3;
}

/* =========================================================
.topOperation
========================================================= */
.topOperation {
  padding: 30px 0;
}
@media screen and (min-width: 768px ) {
  .topOperation {
    padding: 50px 0;
  }
}
.topOperation-inner {
  position: relative;
}
@media screen and (min-width: 768px ) {
  .topOperation-inner::before {
    position: absolute;
    background: url(../images/common/obj-circle_big.svg) no-repeat center center/cover;
    width: 40%;
    padding-top: 40%;
    left: -20%;
    bottom: -40%;
    content: "";
    display: block;
  }
}
.topOperation .sectionTitle::before {
  font-size: clamp(2rem, 2.6vw, 3.4rem);
  position: absolute;
  background-color: #fff;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  content: "";
  display: block;
  border-radius: 50%;
}
.topOperation .sectionTitle.effect_start::before {
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  width: 7em;
  height: 7em;
}
.topOperation .operationCardList {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 10px;
  border-radius: 50%;
}
@media screen and (min-width: 768px ) {
  .topOperation .operationCardList {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
}
.topOperation .operationCardList .operationCard {
  border: 3px solid #053a86;
  border-radius: 10px;
  position: relative;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  overflow: hidden;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.topOperation .operationCardList .operationCard:hover {
  border: 3px solid #ff6625;
}
.topOperation .operationCardList .operationCard-imgArea {
  width: 25%;
}
@media screen and (min-width: 768px ) {
  .topOperation .operationCardList .operationCard-imgArea {
    width: 120px;
  }
}
.topOperation .operationCardList .operationCard-txtArea {
  padding: 15px;
  width: 75%;
}
@media screen and (min-width: 768px ) {
  .topOperation .operationCardList .operationCard-txtArea {
    width: calc(100% - 120px);
  }
}
.topOperation .operationCardList .operationCard-title {
  font-weight: bold;
  line-height: 1.4;
  font-size: clamp(1.4rem, 2.6vw, 1.8rem);
}

/****************************************

.topNews

*****************************************/
.topNews {
  position: relative;
  padding: 30px 0;
}
@media screen and (min-width: 768px ) {
  .topNews {
    padding: 50px 0;
  }
}
.topNews .topNewsWrap {
  background-color: #fff;
  padding: 20px;
  border-radius: 10px;
}
@media screen and (min-width: 768px ) {
  .topNews .topNewsWrap {
    padding: 40px;
    border-radius: 20px;
  }
}
.topNews .newsList {
  margin-bottom: 30px;
}

/* =========================================================
.topContact
========================================================= */
.topContact {
  position: relative;
  padding: 30px 0;
  background: url(../images/top/topContact-img.jpg) no-repeat center center/cover;
}
@media screen and (min-width: 768px ) {
  .topContact {
    padding: 8vw 0;
  }
}
.topContact::before {
  background: rgba(0, 0, 0, 0.3);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: "";
  display: block;
}
.topContact-txtArea {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.topContact-txt {
  color: #fff;
  font-weight: bold;
  margin-bottom: 1em;
  text-align: center;
  line-height: 1.6;
}
.topContact-txt span {
  display: inline-block;
}

/* =========================================================
.toptopBnr
========================================================= */
.topBnr {
  position: relative;
  padding: 30px 0;
  background: #fff;
}
@media screen and (min-width: 768px ) {
  .topBnr {
    padding: 50px 0;
  }
}
.topBnr .bnrList {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
}
@media screen and (min-width: 768px ) {
  .topBnr .bnrList {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 15px;
  }
}
.topBnr .bnrList a {
  display: block;
}
.topBnr .bnrList a:hover {
  opacity: 0.7;
}

/*# sourceMappingURL=top.css.map*/