@charset "utf-8";

.fv {
  position: relative;
  z-index: 5;
  background-color: #fff;
}

.fv::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  background: url(/system_panel/uploads/images/20260708161750700569.png) no-repeat bottom right/contain;
  width: 100%;
  height: 457px;
}

.fv .inner {
  position: relative;
  padding: calc(var(--header-height) + 209px) 0 272px;
}

.fv .fv-title {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.fv .fv-title .tit-ja {
  font-weight: 400;
  font-size: clamp(2.5rem, 2.257rem + 1.04vw, 3.5rem);
  color: #000;
}

.fv .fv-title .tit-ja br {
  display: none;
}

.fv .fv-title .tit-en {
  font-family: var(--forum);
  font-weight: 400;
  font-size: clamp(1rem, 0.818rem + 0.78vw, 1.75rem);
  color: #000;
}

.fv .bg {
  position: absolute;
  right: 0;
  bottom: -36%;
  max-width: 1064px;
  width: 72%;
  height: calc(482 / 1920 * 100vw);
  opacity: 0;
  filter: blur(10px);
  transform: translateY(-10px);
  border-radius: 10px;
  transition: 1.2s ease-in-out;
}

.fv .bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.fv .bg.is-active {
  opacity: 1;
  filter: blur(0);
  transform: translateY(0);
}

.t_about {
  position: relative;
}

.t_about::before {
  content: "";
  position: absolute;
  left: 0;
  top: 281px;
  margin: auto;
  background: url(/system_panel/uploads/images/20260708212032807685.png) no-repeat center/contain;
  max-width: 999px;
  width: 90%;
  height: 708px;
  z-index: -1;
}

.t_about .inner {
  padding: 130px 0 120px;
  display: flex;
  align-items: flex-start;
}

.t_about .sec-left {
  display: flex;
  flex-direction: column;
  gap: 82px;
  max-width: 1080px;
  width: 72%;
}

.t_about .sec-left .sec-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  z-index: 5;
}

.t_about .sec-left .sec-title .tit-main {
  font-family: var(--forum);
  font-weight: 400;
  //font-style: italic;
  font-size: clamp(6.625rem, 2.666rem + 16.89vw, 22.938rem);
  line-height: 1;
  animation: AnimationTitle 5s ease infinite;
  background: linear-gradient(to right, #415a72 0%, #3f80d9 17.14%, #6f82e3 32.68%, #497ccc 52.82%, #f5f5f5 100%);
  background-size: 200% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

.t_about .sec-left .sec-title .tit-sub {
  font-family: var(--forum);
  font-weight: 400;
  font-size: clamp(1.063rem, 0.714rem + 1.49vw, 2.5rem);
  color: #000;
  margin-left: 20px;
}

.t_about .sec-left .sec-img {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px 15px;
  max-width: 754px;
  width: 75%;
  filter: blur(10px);
  transition: 0.8s ease;
}

.t_about .sec-left .sec-img.is-active {
  filter: blur(0);
}

.t_about .sec-left .sec-img img {
  border-radius: 20px;
}

.t_about .sec-right {
  margin-left: -102px;
  margin-top: 35%;
  max-width: 622px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.t_about .sec-right .tit-ja {
  font-weight: 700;
  font-size: clamp(1.5rem, 1.379rem + 0.52vw, 2rem);
  line-height: calc(46 / 32);
  color: #000;
  margin-bottom: 40px;
}

.t_about .sec-right .desc {
  margin-bottom: 80px;
}

.t_about .morebtn {
  max-width: 242px;
  width: 100%;
}

.t_foreign {
  display: flex;
  gap: 4%;
  background-color: #0b3570;
  overflow: hidden;
}

.t_foreign .sec-img {
  max-width: 998px;
  width: 71%;
  position: relative;
}

.t_foreign .sec-img::after {
  content: "";
  width: 346px;
  height: 100%;
  background: linear-gradient(to right, rgba(28, 33, 30, 0) 0%, rgba(27, 34, 34, 0.04) 15.76%, rgba(21, 42, 69, 0.44) 53.69%, rgba(12, 52, 108, 0.85) 87.19%, #0b3570 100%);
  position: absolute;
  right: 0;
  top: 0;
  z-index: 5;
}

.t_foreign .sec-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.t_foreign .sec-text {
  margin-right: 10%;
  position: relative;
  z-index: 1;
}

.t_foreign .sec-text .en-txt {
  position: absolute;
  font-family: var(--playfair);
  font-weight: 400;
  font-style: italic;
  font-size: clamp(2.188rem, 1.414rem + 3.3vw, 5.375rem);
  line-height: 1;
  color: #3e5e90;
  left: 0;
  bottom: 0;
  white-space: nowrap;
  z-index: -1;
}

.t_foreign .sec-text .inner {
  padding: 56px 0 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
}

.t_foreign .sec-text .tit-ja {
  font-weight: 700;
  font-size: clamp(1.5rem, 1.379rem + 0.52vw, 2rem);
  color: #fff;
}

.t_foreign .sec-text .tit-ja span {
  font-size: clamp(1rem, 0.97rem + 0.13vw, 1.125rem) !important;
}

.t_foreign .sec-text .desc p {
  color: #fff;
}

.t_foreign .sec-text .morebtn {
  max-width: 242px;
  width: 100%;
}

.t_service {
  position: relative;
  z-index: 1;
}

.t_service::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 583px;
  background-color: #0b3570;
  z-index: -1;
  bottom: 0;
  left: 0;
}

.t_service .inner {
  padding: 234px 0 109px;
  position: relative;
}

.t_service .tit-en {
  font-family: var(--forum);
  font-weight: 400;
  //font-style: italic;
  font-size: clamp(4.063rem, 1.969rem + 8.93vw, 12.688rem);
  line-height: 1;
  animation: AnimationTitle 5s ease infinite;
  background: linear-gradient(to right, #415a72 0%, #3f80d9 17.14%, #6f82e3 32.68%, #497ccc 52.82%, #f5f5f5 100%);
  background-size: 200% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  position: absolute;
  z-index: 2;
  top: 160px;
  left: -50px;
}

.t_service .inner .box {
  background: #e2e8ef;
  border-radius: 20px;
  position: relative;
  z-index: 1;
}

.t_service .inner .box .box-inner {
  padding: 195px 0 120px;
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 64px;
}

.t_service .inner .box::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  background: url(/system_panel/uploads/images/20260708212032807685.png) no-repeat center/cover;
  max-width: 1061px;
  width: 90%;
  height: 709px;
  z-index: -1;
}

.t_service .inner .box .box-inner .column {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 5%;
}

.t_service .inner .box .box-inner .column .catch {
  font-weight: 700;
  font-size: clamp(1rem, 0.757rem + 1.04vw, 2rem);
  line-height: calc(24 / 16);
  writing-mode: vertical-rl;
  color: #192633;
}

.t_service .inner .box .box-inner .item {
  --scale: 0;
  --tw-border-opacity: 1;
  --tw-bg-opacity: 1;
  --tw-text-opacity: 1;
  --bg-color: #fff;
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  max-width: 680px;
  width: 100%;
  border-radius: 10px;
  background-color: #192633;
  margin-left: auto;
  overflow: hidden;
}

.t_service .inner .box .box-inner .item .sec-img {
  position: relative;
  z-index: 2;
}

.t_service .inner .box .box-inner .item .sec-text {
  position: relative;
  padding: 48px 0 21px;
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  z-index: 1;
}

.t_service .inner .box .box-inner .item a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 5;
  cursor: pointer;
}

.t_service .inner .box .item-tit {
  font-weight: 700;
  font-size: clamp(1.313rem, 1.146rem + 0.71vw, 2rem);
  color: #fff;
}

.t_service .inner .box .desc p {
  font-weight: 700;
  font-size: clamp(0.75rem, 0.72rem + 0.13vw, 0.875rem);
  line-height: calc(24 / 14);
  color: #fff;
}

.t_service .inner .box .circle {
  width: 92px;
  aspect-ratio: 1/1;
  background-color: #fff;
  border-radius: 50px;
  position: absolute;
  bottom: 21px;
  right: 18px;
  font-weight: 400;
  font-size: clamp(0.563rem, 0.396rem + 0.71vw, 1.25rem);
  color: #192633;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.t_service .inner .box .circle .arrow {
  width: 9px;
  height: 14px;
  background: url(/system_panel/uploads/images/20260708203449816149.svg) no-repeat center/contain;
}

.t_service .inner .box .box-inner .column .item {
  background-color: #0b3570;
  margin-top: 115px;
  margin-left: 0;
}

.t_service .inner .box .box-inner .item .sec-text::before {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  aspect-ratio: 1 / 1;
  display: block;
  min-width: 200%;
  position: absolute;
  right: -50%;
  bottom: -20%;
  margin: auto;
  --tw-scale-x: var(--scale);
  --tw-scale-y: var(--scale);
  background-color: var(--bg-color);
  content: "";
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: 624.9375rem;
  z-index: -1;
}

.t_service .inner .box .box-inner .item:hover {
  --tw-text-opacity: 1;
  --scale: 1;
  color: rgb(11 53 112 / var(--tw-text-opacity));
}

.t_service .inner .box .box-inner .item:hover .circle {
  background-color: #192633;
  color: #fff;
}

.t_service .inner .box .box-inner .column .item:hover .circle {
  background-color: #0b3570;
}

.t_service .inner .box .box-inner .item:hover .circle .arrow {
  filter: brightness(10);
}

.t_service .inner .box .box-inner .item:hover .item-tit,
.t_service .inner .box .box-inner .item:hover .desc p,
.t_service .inner .box .circle {
  color: #192633;
}

.t_service .inner .box .box-inner .column .item:hover .item-tit,
.t_service .inner .box .box-inner .column .item:hover .desc p,
.t_service .inner .box .column .circle {
  color: #0b3570;
}

.t_news .inner {
  padding: 160px 0 148px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 4%;
}

.t_news .sec-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 22px;
  width: 30%;
}

.t_news .sec-head .tit-en,
.t_blog .tit-en,
.t_insta .tit-en {
  font-family: var(--forum);
  font-weight: 400;
  font-size: clamp(2.5rem, 1.908rem + 2.52vw, 4.938rem);
  color: #192633;
}

.t_news .sec-head .morebtn,
.t_blog .morebtn {
  max-width: 193px;
  width: 100%;
}

.t_news .sec-head .morebtn .link-text,
.t_blog .morebtn .link-text {
  font-size: 16px;
}

.t_news .sec-head .morebtn a,
.t_blog .morebtn a {
  padding: 8px 11px 8px 20px;
  gap: 20px;
}

.t_news .sec-head .morebtn .arrow,
.t_blog .morebtn .arrow {
  width: 29px;
}

.t_news .sec-head .webgene-blog {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.t_news .sec-head .sideLink {
  font-weight: 700;
  font-size: clamp(0.875rem, 0.814rem + 0.26vw, 1.125rem);
  color: #192633;
}

.t_news .sec-head .webgene-item {
  display: flex;
  align-items: center;
  gap: 11px;
}

.t_news .sec-head .webgene-item:hover::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 8px;
  height: 8px;
  background-color: #0b3570;
  border-radius: 50px;
}

.t_news .sec-body {
  max-width: 1090px;
  width: 74%;
  display: flex;
  flex-direction: column;
}

.t_news .sec-body .morebtn {
  display: none;
}

.t_news .sec-body .webgene-blog {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 35px;
}

.t_news .sec-body .webgene-item {
  max-width: 340px;
  width: 100%;
  border-radius: 10px;
  filter: drop-shadow(0px 3px 20px rgba(0, 0, 0, 0.16));
  transition: var(--default);
}

.t_news .sec-body .webgene-item:hover {
  transform: translateY(4px);
  filter: none;
}

.t_news .sec-body .webgene-item a {
  display: flex;
  flex-direction: column;
  background-color: #f4f5f7;
  border-radius: 10px;
  padding: 16px 5%;
  height: 100%;
  align-items: flex-start;
}

.t_news .sec-body .blogDetailImg {
  margin-bottom: 15px;
  aspect-ratio: 308/205;
}

.t_news .sec-body .blogDetailImg img {
  border-radius: 5px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.t_news .sec-body .cate {
  border-radius: 9.5px;
  background: #d9dfff;
  font-weight: 700;
  font-size: 12px;
  text-align: center;
  color: #000;
  padding: 0 21px;
  margin-bottom: 20px;
}

.t_news .sec-body .ItemTit {
  font-weight: 700;
  font-size: clamp(0.875rem, 0.845rem + 0.13vw, 1rem);
  line-height: calc(24 / 16);
  color: #192633;
  margin-bottom: 20px;
}

.t_news .sec-body .date {
  font-weight: 700;
  font-size: clamp(0.625rem, 0.595rem + 0.13vw, 0.75rem);
  color: #000;
}

.t_blog .inner {
  padding-bottom: 120px;
  display: flex;
  flex-direction: column;
  gap: 42px;
}

.t_blog .sec-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.t_blog .sec-body .morebtn {
  margin-left: auto;
}

.t_blog .sec-body .webgene-blog {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.t_blog .sec-body .webgeneLink {
  display: grid;
    grid-template-columns: max-content fit-content(10%) 70% max-content;
  gap: 4%;
  font-weight: 700;
  align-items: center;
  font-size: clamp(0.875rem, 0.814rem + 0.26vw, 1.125rem);
  transition: var(--default);
  color: #192633;
  padding-bottom: 20px;
}

.t_blog .sec-body .webgeneLink:hover {
  background-color: rgba(255, 255, 255, 0.6);
}

.t_blog .sec-body .webgeneLink .ItemTit {
  font-weight: 700;
  font-size: clamp(0.875rem, 0.814rem + 0.26vw, 1.125rem);
  color: #192633;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
}

.t_blog .sec-body .webgeneLink .arrow {
  width: 9px;
  height: 14px;
}

.t_blog .sec-body .webgene-item {
  border-bottom: 1px solid #000;
}

.t_insta {
  position: relative;
  margin-bottom: 120px;
}

.t_insta .inner {
  padding: 48px 0 497px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 33px;
}

.t_insta .inner .tit-en {
  margin-top: 48px;
}

.t_insta::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background: url(/system_panel/uploads/images/20260708212032807685.png) no-repeat center/cover;
  max-width: 1020px;
  width: 90%;
  height: 709px;
  z-index: -1;
}

.t_insta .sec-body .webgene-blog {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  width: 90%;
  margin: 0 auto;
}

.t_insta .sec-body .webgene-blog .imgBx01:hover {
  opacity: 50%;
}

.t_insta .sec-body .webgene-blog .webgene-item-main-image,
.t_insta .sec-body .webgene-blog video {
  aspect-ratio: 1/1;
  width: 100%;
}

.t_insta .sec-body .webgene-blog .py-3 {
  padding: 0 !important;
}

.t_insta .sec-body .webgene-blog .imgBx01 {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  transition: 0.4s ease;
}

@keyframes AnimationTitle {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

@media (max-width: 1180px) {

  .t_about .inner,
  .t_news .inner {
    flex-direction: column;
  }

  .t_about .sec-right {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    margin-top: 40px;
  }

  .t_about .sec-left .sec-img,
  .t_about .sec-left,
  .t_news .sec-body {
    max-width: 100%;
    width: 100%;
  }

  .t_news .inner {
    gap: 30px;
  }

  .t_foreign .sec-text {
    margin-right: 5%;
  }

  .t_blog .sec-body .webgeneLink {
    grid-template-columns: max-content fit-content(10%) 66% auto;
  }
}

@media (max-width: 1023px) {
  .fv .inner {
    padding: calc(var(--header-height) + 67px) 0 183px;
  }

  .t_about .inner {
    padding: 65px 0 80px;
  }

  .t_about .sec-left .sec-title {
    gap: 6px;
  }

  .t_about .sec-left {
    gap: 34px;
  }

  .t_about .sec-left .sec-img img {
    border-radius: 10px;
  }

  .t_about .sec-left .sec-img {
    gap: 8px 6px;
  }

  .t_foreign {
    flex-direction: column;
    gap: 37px;
  }

  .t_foreign .sec-img {
    max-width: 100%;
    width: 100%;
  }

  .t_foreign .sec-img img.sp-hidden {
    display: none;
  }

  .t_foreign .sec-img img.pc-hidden {
    display: block;
  }

  .t_foreign .sec-img::after {
    width: 100%;
    height: 375px;
    background: linear-gradient(to bottom, rgba(28, 33, 30, 0) 0%, rgba(27, 34, 34, 0.04) 15.76%, rgba(21, 42, 69, 0.44) 53.69%, rgba(12, 52, 108, 0.85) 87.19%, #0b3570 100%);

    bottom: -37px;
    top: auto;
    right: auto;
    left: 0;
  }

  .t_foreign .sec-text {
    width: 83%;
    margin: 0 auto;
  }

  .t_service .inner {
    padding: 99px 0 57px;
    width: 90%;
  }

  .t_service .inner .box .box-inner .column {
    flex-direction: column-reverse;
    gap: 30px;
    align-items: flex-end;
  }

  .t_service .inner .box .box-inner .column .catch {
    writing-mode: horizontal-tb;
    text-align: right;
  }

  .t_service .inner .box .box-inner .column .item {
    margin-top: 0;
  }

  .t_service .inner .box .box-inner {
    padding: 99px 0 30px;
  }

  .t_service .tit-en {
    top: 28px;
    left: -10px;
  }

  .t_news .inner {
    padding: 72px 0 83px;
  }

  .t_news .sec-head {
    width: 100%;
  }

  .t_news .sec-head .morebtn {
    display: none;
  }

  .t_news .sec-body {
    width: 100%;
    gap: 40px;
  }

  .t_news .sec-body .morebtn {
    display: block;

    margin: 0 auto;
  }

  .t_blog .sec-body .webgeneLink {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 6px;
  }

  .t_blog .sec-body .webgeneLink .ItemTit {
    width: 93%;
  }

  .t_blog .sec-body .webgeneLink .arrow {
    margin-left: auto;
  }

  .t_blog .sec-body .webgene-blog {
    gap: 28px;
  }

  .t_blog .sec-body .morebtn {
    margin: 0 auto;
  }
}

@media (max-width: 767px) {
  .fv .fv-title .tit-ja br {
    display: block;
  }

  .fv .bg {
    bottom: -103px;
    max-width: calc(335 / 375 * 100vw);
    width: 100%;
    height: 170px;
  }

  .fv .bg img.sp-hidden {
    display: none;
  }

  .fv .bg img.pc-hidden {
    display: block;
  }

  .t_service .inner .box::before {
    height: 224px;
  }

  .t_service .inner .box .box-inner .item .sec-img .pc-hidden {
    display: block;
  }

  .t_service .inner .box .box-inner .item .sec-img .sp-hidden {
    display: none;
  }

  .t_service .inner .box .box-inner .item {
    display: flex;
    flex-direction: column;
  }

  .t_service .inner .box .box-inner .item .sec-text {
    padding: 20px 0 66px;
  }

  .t_service .inner .box .circle {
    width: 42px;
    bottom: 9px;
    right: -3%;
  }

  .t_service .inner .box .circle .arrow {
    width: 4px;
    height: 9px;
  }

  .t_news .sec-body .webgene-blog {
    display: flex;
    flex-direction: column;
    gap: 32px;
  }

  .t_news .sec-body .webgene-item {
    max-width: none;
  }

  .t_insta .sec-body .webgene-blog {
    grid-template-columns: repeat(3, 1fr);
  }
}

.gjs-dashed .fv .inner {
  padding: 100px 0 200px;
}

.gjs-dashed .t_service .inner .box .box-inner .item a {
  z-index: -1;
}

.gjs-dashed .fv .bg {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

.gjs-dashed .t_about .sec-left .sec-img {
  filter: blur(0);
}

.gjs-dashed .t_foreign .sec-img::after {
  z-index: -1;
}