@font-face {
  font-family: 'SoraMedium';
  src: url('Sora-Medium.woff2') format('woff2'), url('Sora-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SoraLight';
  src: url('Sora-Light.woff2') format('woff2'), url('Sora-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
a img {
  border: 0px;
}
a {
  text-decoration: none;
  color: inherit;
}
img {
  max-width: 100%;
}
select::-ms-expand {
  display: none;
}
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #fff inset;
}
input[type=number] {
  -moz-appearance: textfield;
}
::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
::-webkit-outer-spin-button {
  -webkit-appearance: none;
}
.hiddenHeader {
  display: none;
}
ul {
  list-style: none;
}
* {
  padding: 0px;
  margin: 0px;
  outline: none;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}
html {
  scrollbar-gutter: stable;
}
html,
body {
  height: 100%;
  min-height: 100%;
  position: relative;
  width: 100%;
}
body {
  width: 100%;
  -webkit-text-size-adjust: none;
}
#wrapper {
  height: auto;
  min-height: 100%;
  position: relative;
  width: 100%;
}
.noBottAppearance {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
}
.absoluteDivCreate {
  display: block;
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
.centerBgImg {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.centeredObjFit {
  object-fit: cover;
  object-position: center center;
}
.centerflex {
  display: flex;
  justify-content: center;
  align-items: center;
}
.onlydevices {
  display: none;
}
@media (max-device-width: 1024px) and (min-device-width: 320px) {
  .onlydevices {
    display: block;
  }
}
.ipaddevice {
  display: none;
}
@media (max-device-width: 1224px) and (min-device-width: 767.1px) {
  .ipaddevice {
    display: block;
  }
}
.mobdevice {
  display: none;
}
@media (max-device-width: 767px) and (min-device-width: 320.1px) {
  .mobdevice {
    display: block;
  }
}
.bp_sevensixtyseven {
  display: none;
}
@media (max-width: 767px) {
  .bp_sevensixtyseven {
    display: block;
  }
}
.bp_1024 {
  display: none;
}
@media (max-width: 1024px) {
  .bp_1024 {
    display: block;
  }
}
.bp_768 {
  display: none;
}
@media (max-width: 768px) {
  .bp_768 {
    display: block;
  }
}
.custbtn {
  font-family: "Inter", sans-serif;
  font-size: calc(var(--ratio) * 15px);
  line-height: 105%;
  padding-left: calc(var(--ratio) * 21px);
  padding-right: calc(var(--ratio) * 21px);
  font-weight: 800;
  height: calc(var(--ratio) * 60px);
  background: var(--green);
  border-radius: calc(var(--ratio) * 11px);
  font-style: italic;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  cursor: pointer;
  border: 0px;
  text-transform: uppercase;
  position: relative;
  transition: all 0.35s;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.custbtn.grey {
  background: var(--lightblue);
}
.custbtn.yellow {
  background: var(--yellowishgreen);
  color: var(--darkblue);
}
.custbtn.yellow:before {
  background-image: url(../images/dash_blue.svg);
  filter: unset;
}
.custbtn:before {
  width: calc(var(--ratio) * 10px);
  height: calc(var(--ratio) * 15px);
  display: block;
  content: '';
  position: relative;
  background: url(../images/dash_green.svg) no-repeat;
  background-size: contain;
  transition: all 0.35s;
  filter: brightness(0) invert(1);
  margin-right: calc(var(--ratio) * 9px);
}
.desktop .custbtn:hover {
  background: var(--lightblue);
}
.desktop .custbtn.grey:hover {
  background: var(--green);
}
.desktop .custbtn.yellow:hover {
  background: var(--darkblue);
  color: #fff;
}
.desktop .custbtn.yellow:hover:before {
  filter: brightness(0) invert(1);
}
.hiddenheader {
  display: none;
}
.Main {
  background: url(../images/layer.jpg) center center;
  background-size: cover;
}
@media (max-width: 768px) {
  .Main {
    background: url(../images/layer2.png) top right;
    background-size: cover;
  }
}
.Welcome {
  min-height: calc(100dvh);
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-content: space-between;
  position: relative;
  overflow: hidden;
}
.Welcome .part1 {
  width: 100%;
  padding-top: calc(var(--ratio) * 52px);
}
.Welcome .part2 {
  width: 100%;
  padding-bottom: calc(var(--ratio) * 27px);
}
.Welcome .note {
  font-size: calc(var(--ratio) * 14px);
  line-height: 140%;
  font-family: 'SoraMedium';
  color: var(--blue);
}
.Welcome .note a {
  transition: all 0.35s;
}
.Welcome .note a:hover {
  opacity: 0.66;
}
@media (max-device-width: 1024px) {
  .Welcome .note a:hover {
    opacity: 1!important;
  }
}
.Welcome .top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.Welcome .top > li:nth-child(2) {
  display: flex;
  justify-content: flex-end;
}
.Welcome .logo {
  max-width: calc(var(--ratio) * 350px);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
}
.Welcome .logo img {
  width: 100%;
  object-fit: contain;
  display: block;
  max-height: 12.5dvh;
}
.Welcome .date {
  color: var(--red);
  font-size: calc(var(--ratio) * 21px);
  line-height: 140%;
  font-family: 'SoraMedium';
}
.Welcome .date span {
  padding-left: calc(var(--ratio) * 17px);
}
.Welcome .holder {
  position: relative;
  padding-left: calc(var(--ratio) * 87px);
}
.Welcome .caption {
  font-size: calc(var(--ratio) * 100px);
  line-height: 110%;
  color: var(--blue);
  font-family: 'SoraLight';
  font-weight: normal;
  max-width: calc(var(--ratio) *680px);
}
.Welcome .caption b {
  font-family: 'SoraMedium';
}
.Welcome .head {
  position: relative;
}
.Welcome .shape {
  position: absolute;
  top: calc(var(--ratio) * -16px);
  left: calc(var(--ratio) * 112px);
  width: calc(1700px - var(--ratio) * 314px);
  height: 85dvh;
  background: url(../images/curve.png) no-repeat;
  background-size: contain;
  z-index: 1;
  background-position: calc(var(--ratio) * 0px) calc(var(--ratio) * 0px);
}
.Welcome .now {
  color: var(--red);
  font-size: calc(var(--ratio) * 21px);
  line-height: 140%;
  font-family: 'SoraMedium';
  background: none;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}
.Welcome .history {
  position: absolute;
  top: calc(var(--ratio) * 40px);
  left: calc(var(--ratio) * 0px);
  width: 100%;
  height: calc(100% - var(--ratio) * 177px);
  background: url(../images/history.png) no-repeat;
  background-size: contain;
}
@media (max-width: 1850px) and (min-width: 768.1px) {
  .Welcome .note {
    --ratio: 0.9;
  }
}
@media (max-width: 1450px) {
  .Welcome .logo {
    max-width: calc(var(--ratio) * 220px);
  }
}
@media (max-width: 900px) {
  .Welcome .logo {
    max-width: calc(var(--ratio) * 210px);
  }
}
@media (min-width: 768.1px) {
  .Welcome .note br {
    display: none;
  }
}
@media (max-width: 768px) {
  .Welcome {
    overflow: unset;
  }
  .Welcome .logo {
    max-width: calc(var(--ratio) * 230px);
  }
  .Welcome .logo img {
    max-height: none;
  }
  .Welcome .part1 {
    padding-top: calc(var(--ratio) * 30px);
  }
  .Welcome .history {
    position: relative;
    top: unset;
    left: unset;
    height: 63dvh;
    width: calc(100% + 0px);
    min-height: 330px;
    margin-bottom: calc(var(--ratio) * 50px);
    background-image: url(../images/hm3.png);
  }
  .Welcome .top {
    display: block;
    margin-bottom: calc(var(--ratio) * 66px);
  }
  .Welcome .part2 {
    padding-bottom: calc(var(--ratio) * 20px);
  }
  .Welcome .note {
    max-width: calc(var(--ratio) * 544px);
  }
  .Welcome .note .fordesktop {
    display: none;
  }
}
:root {
  --ratio: 1;
  --blue: #002855;
  --red: #742935;
}
@media (max-width: 1024px) {
  :root {
    --ratio: 0.8;
  }
}
@media (max-width: 768px) {
  :root {
    --ratio: 0.78;
  }
}
.container {
  max-width: 1700px;
  position: relative;
  margin: auto;
  width: 100%;
}
@media (max-width: 1950px) {
  .container {
    padding: 0px 18%;
    max-width: 100%;
  }
}
@media (max-width: 1124px) {
  .container {
    padding: 0px 50px;
  }
}
@media (max-width: 768px) {
  .container {
    padding: 0px 25px;
  }
}