/*================================= floating window =======================================*/
@keyframes floating {
  0% {
    transform: translate(0, 0);
  }
  33% {
    transform: translate(85vw, 40vh);
  }
  66% {
    transform: translate(40vw, 88vh);
  }

  99% {
    transform: translate(0, 0);
  }
}
#p88,
#w88{
  height: 100%;
}

.card {
  position: fixed;
  width: 15rem;
  height: 7rem;
  box-shadow: 1px 2px 3px #343a4030, -1px -2px 3px #343a4030;
  background-color: white;
  border-radius: 5px;
  animation: floating 30s linear infinite forwards;
  top: 0;
  left: 0;
  z-index: 999;
}

.card p {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
}
.card:hover {
  -webkit-animation-play-state: paused;
  -moz-animation-play-state: paused;
  -o-animation-play-state: paused;
  animation-play-state: paused;
}

.card .window {
  height: 100%;
}

.card__header {
  display: flex;
  position: absolute;
  justify-content: flex-end;
  text-align: end;
  width: 100%;
  right: 8px;
  top: 3px;
}

.close {
  color: #343a40a0;
  cursor: pointer;
}

.card__body {
  width: 100%;
  height: 100%;
}

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

.hide {
  display: none;
}
/*================================= layout: navbar and carousel =======================================*/

.layout__navbar {
  position: relative;
  z-index: 2;
}
.layout__carousel {
  position: relative;
  z-index: 1;
}

/*================================= carousel =======================================*/

.Carousel__pic,
.Carousel__pic-inner {
  height: 30rem;
  width: 100%;
  overflow: hidden;
  background: var(--primary);
}

/*================================= main content =======================================*/

.main-content {
  width: 100%;
  background: var(--light);

  display: grid;
  gap: 1rem;
  grid-template-rows: 1fr 1fr;
  grid-template-columns: 2fr 1fr;
}

.sub-content--1 {
  grid-row: 1/3;
  grid-column: 1/2;
}
.sub-content--2 {
  grid-row: 1/2;
  grid-column: 2/3;
}
.sub-content--3 {
  grid-row: 2/3;
  grid-column: 2/3;
}

/*================================= subcontent =======================================*/

.sub-content-title {
  display: flex;
  align-items: end;
  margin-bottom: 0;
  color: var(--primary);
  padding: 1rem;
  width: 100%;
  border-bottom: 1px solid var(--primary);
}
div#wp_news_w103 {
    display: none;
}
.pc img{width:300px}