@charset "UTF-8";
/*
 * media.css
 *
 *  version --- 1.0
 *  updated --- 2026/02/25
 */
/*common*/
/* !header
---------------------------------------------------------- */
#header {
  padding-top: 2rem;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-feature-settings: "palt" 1;
}
#header:before {
  background: transparent;
}
#header::after {
  box-shadow: none;
}
@media screen and (min-width: 1000px) {
  #header.is-active + .header-overlay {
    display: block;
  }
}
@media screen and (max-width: 999px) {
  #header.white-bg {
    background: #ffffff;
  }
}
@media screen and (max-width: 999px) {
  #header {
    height: 8rem;
  }
}

.header__wrap {
  display: flex;
  margin: 0 auto;
  padding: 0 2rem 0 4rem;
  width: 100%;
  align-items: center;
}
@media screen and (max-width: 999px) {
  .header__wrap {
    padding: 0 1.2rem;
  }
}

.header-logo {
  margin-right: 1.2rem;
  width: 8.7rem;
  flex-shrink: 0;
  z-index: 1;
}
.header-logo img {
  width: 100%;
}
@media screen and (max-width: 999px) {
  .header-logo {
    width: 7.363rem;
  }
}

.button-menu {
  display: none;
}
@media screen and (max-width: 999px) {
  .button-menu {
    display: flex;
    margin: 1.2rem 0;
    width: 5.6rem;
    height: 5.6rem;
    border: 1px solid #5aaaf2;
    border-radius: 100%;
    background-color: #ffffff;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1019607843);
    cursor: pointer;
    transition: all 0.3s ease;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    z-index: 10;
  }
  .button-menu:nth-child(2) {
    margin: 1.2rem 0 1.2rem auto;
  }
  .button-menu.is-active {
    background-color: #ffffff;
    box-shadow: unset;
    border: solid 1px #5aaaf2;
  }
  .button-menu.is-active .button-menu__line:nth-child(1) {
    background-color: #5aaaf2;
    transform: translateY(0.45rem) rotate(18deg);
  }
  .button-menu.is-active .button-menu__line:nth-child(2) {
    background-color: #5aaaf2;
    transform: translateY(-0.45rem) rotate(-18deg);
  }
  .button-menu .button-menu__line {
    width: 2.8rem;
    height: 0.1rem;
    background-color: #5aaaf2;
    transition: all 0.3s ease;
  }
  .button-menu .button-menu__line + .button-menu__line {
    margin-top: 0.8rem;
  }
}

.header-overlay {
  display: none;
  position: fixed;
  width: 100vw;
  height: 100vh;
  z-index: 910;
}

/* !global navigation
---------------------------------------------------------- */
#g-navi::after {
  content: none;
}
#g-navi > ul {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  background: #fff;
  border-radius: 4rem;
  padding-inline: 4rem;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1019607843);
}
@media screen and (max-width: 999px) {
  #g-navi > ul {
    position: relative;
    left: 0;
    transform: translate(0, 0);
    box-shadow: none;
    width: fit-content;
    margin-inline: auto;
  }
}
#g-navi > ul > li > a {
  height: 5.5rem;
  font-size: 1.6rem;
  font-weight: 500;
  border-bottom: none;
}
@media screen and (max-width: 999px) {
  #g-navi > ul > li > a {
    font-size: 2rem;
  }
}
@media screen and (min-width: 1000px) {
  #g-navi > ul > li > a:hover {
    color: #5aaaf2;
  }
}
#g-navi > ul > li.hasChild > a span {
  display: flex;
  align-items: center;
}
#g-navi > ul > li.hasChild > a span::after {
  position: static;
  content: "";
  display: inline-block;
  width: 1.6rem;
  height: 1.6rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15'%3E%3Cg transform='translate(-525 -132)'%3E%3Ccircle cx='7.5' cy='7.5' r='7.5' transform='translate(525 132)' fill='%235aaaf2'/%3E%3Cpath d='M1187.434,3430.564l-.679-.734,3.107-2.875-3.1-2.733.662-.75,3.513,3.1a.5.5,0,0,1,.009.742Z' transform='translate(-2894.347 1328.107) rotate(-90)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-left: 0.5rem;
  transition: 0.3s ease;
  transform: rotate(180deg);
}
@media screen and (min-width: 1000px) {
  #g-navi > ul > li.hasChild > a:hover span::after {
    transform: rotate(0deg);
  }
}
#g-navi > ul > li.hasChild.is-active > a span::after {
  transform: rotate(0deg);
}
#g-navi .g-navi__links {
  display: flex;
  margin-left: 2rem;
  z-index: 1;
}
@media screen and (max-width: 999px) {
  #g-navi .g-navi__links {
    justify-content: center;
    margin-left: 0;
  }
}
#g-navi .sub-menu {
  top: 100%;
  left: 6rem;
  width: auto;
  padding: 0;
  background-color: #d8eeff;
}
@media screen and (max-width: 999px) {
  #g-navi .sub-menu {
    position: relative;
    left: 0;
    transform: translate(0, 0);
    box-shadow: none;
    width: fit-content;
    background-color: transparent;
    text-align: left;
  }
}
#g-navi .sub-menu .sub-menu__list {
  flex-direction: column;
  gap: 1rem;
  position: relative;
  margin: 0;
  padding: 1rem;
  width: 20.2rem;
  max-width: 20.2rem;
  min-height: 0;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
}
@media screen and (max-width: 999px) {
  #g-navi .sub-menu .sub-menu__list {
    width: 100%;
    max-width: 100%;
    padding: 1rem 0;
    text-align: left;
  }
}
#g-navi .sub-menu li {
  width: 100%;
  margin-left: 0;
  margin-bottom: 0;
}
#g-navi .sub-menu li a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 2rem;
  min-height: 4rem;
  border-bottom: none;
  white-space: nowrap;
  background: #ffffff;
  border-radius: 4rem;
  text-align: center;
}
@media screen and (max-width: 999px) {
  #g-navi .sub-menu li a {
    text-align: left;
    justify-content: flex-start;
    font-size: 1.6rem;
  }
  #g-navi .sub-menu li a::before {
    content: "";
    display: inline-block;
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6.479' height='11.997' viewBox='0 0 6.479 11.997'%3E%3Cpath d='M1185.459,3435.493l-.73-.684,5.093-5.439-5.085-5.174.713-.7,5.757,5.858Z' transform='translate(-1184.729 -3423.496)' fill='%235aaaf2'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 0.5rem;
    transition: 0.3s ease;
  }
}
#g-navi .sub-menu .sub-menu__image {
  position: absolute;
  max-width: 21.9rem;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 3;
  margin-left: 0;
  margin-bottom: 0;
}
#g-navi .sub-menu .sub-menu__index {
  display: flex;
  width: 100%;
}

/*** KAERU LIFE ***/
.footer-kaeru {
  margin-bottom: 6rem;
  padding: 0 0 0;
  overflow: hidden;
}

.footer-kaeru__wrap {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.footer-kaeru__sns ul {
  display: flex;
  justify-content: center;
}

.footer-kaeru__sns li {
  margin: 0 3rem;
}

.footer-kaeru__sns li .image {
  height: 4rem;
  text-align: center;
}

.footer-kaeru__sns li .image img {
  width: auto;
  height: 100%;
  object-fit: contain;
}

/*** スマホ 320px ~ 999px***/
@media screen and (max-width: 999px) {
  /*** KAERU LIFE ***/
  .footer-kaeru__sns li {
    margin: 0;
  }
  .footer-kaeru__sns li + li {
    margin-left: 2.6rem;
  }
  .footer-kaeru__sns li .image {
    height: 3.6rem;
  }
}
#wrapper {
  padding-top: 0;
}

main#x-media {
  position: relative;
  padding-top: 116px;
}
@media screen and (max-width: 999px) {
  main#x-media {
    padding-top: 102px;
  }
}
main#x-media::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  mix-blend-mode: multiply;
  /* 左上を中心とした淡い黄色、左下を中心とした淡い緑、右下を中心とした水色を重ねる */
  background-image: radial-gradient(at 0% 0%, hsl(55, 100%, 93%) 0px, transparent 50%), radial-gradient(at 100% 0%, hsl(210, 30%, 98%) 0px, transparent 50%), radial-gradient(at 0% 100%, hsl(145, 40%, 88%) 0px, transparent 50%), radial-gradient(at 100% 100%, hsl(215, 60%, 85%) 0px, transparent 50%), radial-gradient(at 50% 50%, hsl(180, 20%, 95%) 0px, transparent 70%);
  background-size: cover;
  background-position: bottom;
  pointer-events: none;
  filter: saturate(220%) contrast(0.8);
  height: 930px;
}
main#x-media .page-title {
  font-size: 4.8rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1rem;
}
main#x-media .page-title img {
  max-width: 470px;
  height: auto;
}
main#x-media .page-title-sub {
  font-size: 1.6rem;
  text-align: center;
  margin-bottom: 4rem;
  color: #0059AA;
  font-weight: 600;
}
@media screen and (max-width: 999px) {
  main#x-media .page-title {
    font-size: 3.2rem;
  }
  main#x-media .page-title img {
    width: 75%;
  }
  main#x-media .page-title-sub {
    font-size: 1.2rem;
  }
}
main#x-media .breadcrumb {
  margin: 0 auto 2rem;
  width: 100%;
}
main#x-media .breadcrumb ul {
  display: flex;
}
main#x-media .breadcrumb ul li {
  word-break: keep-all;
  white-space: nowrap;
  font-size: 1.2rem;
  line-height: 1.5;
  position: relative;
  color: #333;
}
main#x-media .breadcrumb ul li + li {
  padding-left: 2em;
}
main#x-media .breadcrumb ul li + li:before {
  position: absolute;
  left: 0.2rem;
  top: 0.1rem;
  z-index: 1;
  content: "";
  width: 2rem;
  height: 1.8rem;
  background: url("/assets/img/common/icon_arrow_blue03.svg") center center no-repeat;
  background-size: auto 0.8rem;
}
main#x-media .breadcrumb ul li:last-child {
  word-break: break-all;
  white-space: unset;
}
main#x-media .breadcrumb ul li a {
  color: #333;
}
@media screen and (max-width: 999px) {
  main#x-media .breadcrumb ul li {
    font-size: 1.1rem;
  }
  main#x-media .breadcrumb ul li + li {
    padding-left: 1.4em;
  }
  main#x-media .breadcrumb ul li + li:before {
    left: 0.1rem;
    top: 0.1rem;
    width: 1.4rem;
  }
}
main#x-media .back-area {
  display: flex;
  justify-content: center;
  margin-bottom: 4rem;
  padding-top: 4rem;
}
@media screen and (max-width: 999px) {
  main#x-media .back-area {
    margin-bottom: 6rem;
    padding-top: 6rem;
  }
}
main#x-media a.btn_back {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  height: 6rem;
  max-width: 30rem;
  font-size: 1.8rem;
  font-weight: 500;
  color: #5aaaf2;
  background: #ffffff;
  text-decoration: none;
  border: solid 2px #5aaaf2;
  border-radius: 4rem;
}
main#x-media a.btn_back::before {
  content: "";
  position: absolute;
  left: 2rem;
  width: 3rem;
  height: 3rem;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='56'%20height='56'%20viewBox='0%200%2056%2056'%3E%3Cg%20transform='translate(-1086%20-481)'%3E%3Ccircle%20cx='28'%20cy='28'%20r='28'%20transform='translate(1086%20481)'%20fill='%235aaaf2'/%3E%3Cg%20transform='translate(-391.814%20-160.308)'%3E%3Cg%20transform='translate(12.814%20-65)'%3E%3Cpath%20d='M78.975.354l7.68,7.68-7.68,7.68'%20transform='translate(1415.717%20726.275)'%20fill='%235aaaf2'/%3E%3Cpath%20d='M79.682,16.42l-1.414-1.414L85.24,8.033,78.268,1.061,79.682-.354l8.387,8.387Z'%20transform='translate(1415.717%20726.275)'%20fill='%23fff'/%3E%3Cpath%20d='M23.372,0H5'%20transform='translate(1479%20734.308)'%20fill='%235aaaf2'/%3E%3Cpath%20d='M23.372,1H5V-1H23.372Z'%20transform='translate(1479%20734.308)'%20fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transform: rotate(180deg);
}
@media screen and (max-width: 999px) {
  main#x-media a.btn_back::before {
    right: 2rem;
    width: 4rem;
    height: 4rem;
  }
}
main#x-media a.btn_back.btn_prev::before {
  left: auto;
  right: 2rem;
  transform: rotate(0);
}
main#x-media a.btn_back:hover {
  color: #ffffff;
  background: #5aaaf2;
}
main#x-media a.btn_back:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='56'%20height='56'%20viewBox='0%200%2056%2056'%3E%3Cg%20transform='translate(-1086%20-481)'%3E%3Ccircle%20cx='28'%20cy='28'%20r='28'%20transform='translate(1086%20481)'%20fill='%23fff'/%3E%3Cg%20transform='translate(-391.814%20-160.308)'%3E%3Cg%20transform='translate(12.814%20-65)'%3E%3Cpath%20d='M78.975.354l7.68,7.68-7.68,7.68'%20transform='translate(1415.717%20726.275)'%20fill='%23fff'/%3E%3Cpath%20d='M79.682,16.42l-1.414-1.414L85.24,8.033,78.268,1.061,79.682-.354l8.387,8.387Z'%20transform='translate(1415.717%20726.275)'%20fill='%235aaaf2'/%3E%3Cpath%20d='M23.372,0H5'%20transform='translate(1479%20734.308)'%20fill='%23fff'/%3E%3Cpath%20d='M23.372,1H5V-1H23.372Z'%20transform='translate(1479%20734.308)'%20fill='%235aaaf2'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
main#x-media #action {
  position: relative;
  padding: 10rem 0;
}
main#x-media #action::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  mix-blend-mode: multiply;
  background-image: radial-gradient(at 0% 0%, hsl(55, 100%, 93%) 0px, transparent 50%), radial-gradient(at 100% 0%, hsl(210, 30%, 98%) 0px, transparent 50%), radial-gradient(at 0% 100%, hsl(145, 40%, 88%) 0px, transparent 50%), radial-gradient(at 100% 100%, hsl(215, 60%, 85%) 0px, transparent 50%), radial-gradient(at 50% 50%, hsl(180, 20%, 95%) 0px, transparent 70%);
  background-size: cover;
  background-position: bottom;
  filter: saturate(200%) contrast(0.8);
  pointer-events: none;
}
main#x-media #action .action-bnr-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* 上段2列 */
  gap: 2rem;
  max-width: 1120px;
  margin: 0 auto;
}
@media screen and (max-width: 999px) {
  main#x-media #action .action-bnr-wrap {
    padding: 0 2rem;
    grid-template-columns: 1fr;
    /* スマホは1列 */
  }
}
main#x-media #action .action-bnr-wrap a.action-bnr {
  display: flex;
  align-items: center;
  max-width: 900px;
  height: 160px;
  padding: 2rem 1.5rem;
  padding-left: 6rem;
  border-radius: 1rem;
  position: relative;
  color: #fff;
  font-size: 2.4rem;
  font-weight: 700;
  text-align: left;
}
@media screen and (max-width: 999px) {
  main#x-media #action .action-bnr-wrap a.action-bnr {
    height: 11rem;
    padding-left: 4rem;
    font-size: 2rem;
  }
}
main#x-media #action .action-bnr-wrap a.action-bnr:hover {
  text-decoration: none;
  filter: contrast(1.2) saturate(120%);
}
main#x-media #action .action-bnr-wrap a.action-bnr::after {
  content: "";
  position: absolute;
  right: 6rem;
  width: 5rem;
  height: 5rem;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='56'%20height='56'%20viewBox='0%200%2056%2056'%3E%3Cg%20transform='translate(-1086%20-481)'%3E%3Ccircle%20cx='28'%20cy='28'%20r='28'%20transform='translate(1086%20481)'%20fill='%23fff'/%3E%3Cg%20transform='translate(-391.814%20-160.308)'%3E%3Cg%20transform='translate(12.814%20-65)'%3E%3Cpath%20d='M78.975.354l7.68,7.68-7.68,7.68'%20transform='translate(1415.717%20726.275)'%20fill='%23fff'/%3E%3Cpath%20d='M79.682,16.42l-1.414-1.414L85.24,8.033,78.268,1.061,79.682-.354l8.387,8.387Z'%20transform='translate(1415.717%20726.275)'%20fill='%235aaaf2'/%3E%3Cpath%20d='M23.372,0H5'%20transform='translate(1479%20734.308)'%20fill='%23fff'/%3E%3Cpath%20d='M23.372,1H5V-1H23.372Z'%20transform='translate(1479%20734.308)'%20fill='%235aaaf2'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (max-width: 999px) {
  main#x-media #action .action-bnr-wrap a.action-bnr::after {
    right: 2rem;
    width: 4rem;
    height: 4rem;
  }
}
main#x-media #action .action-bnr-wrap a.action-bnr.bnr-recruit {
  background-color: #5aaaf2;
}
main#x-media #action .action-bnr-wrap a.action-bnr.bnr-contact {
  background-color: #0059aa;
}
main#x-media #action .action-bnr-wrap a.action-bnr.bnr-contact::after {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='56'%20height='56'%20viewBox='0%200%2056%2056'%3E%3Cg%20transform='translate(-1086%20-481)'%3E%3Ccircle%20cx='28'%20cy='28'%20r='28'%20transform='translate(1086%20481)'%20fill='%23fff'/%3E%3Cg%20transform='translate(-391.814%20-160.308)'%3E%3Cg%20transform='translate(12.814%20-65)'%3E%3Cpath%20d='M78.975.354l7.68,7.68-7.68,7.68'%20transform='translate(1415.717%20726.275)'%20fill='%23fff'/%3E%3Cpath%20d='M79.682,16.42l-1.414-1.414L85.24,8.033,78.268,1.061,79.682-.354l8.387,8.387Z'%20transform='translate(1415.717%20726.275)'%20fill='%230059aa'/%3E%3Cpath%20d='M23.372,0H5'%20transform='translate(1479%20734.308)'%20fill='%23fff'/%3E%3Cpath%20d='M23.372,1H5V-1H23.372Z'%20transform='translate(1479%20734.308)'%20fill='%230059aa'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
main#x-media #action .action-bnr-wrap a.action-bnr.bnr-top {
  grid-column: 1/-1;
  background-color: #fff;
  color: #0059aa;
  justify-content: flex-start;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 999px) {
  main#x-media #action .action-bnr-wrap a.action-bnr.bnr-top {
    height: auto;
    align-items: flex-start;
    flex-direction: column;
  }
}
main#x-media #action .action-bnr-wrap a.action-bnr.bnr-top::after {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='56'%20height='56'%20viewBox='0%200%2056%2056'%3E%3Cg%20transform='translate(-1086%20-481)'%3E%3Ccircle%20cx='28'%20cy='28'%20r='28'%20transform='translate(1086%20481)'%20fill='%230059aa'/%3E%3Cg%20transform='translate(-391.814%20-160.308)'%3E%3Cg%20transform='translate(12.814%20-65)'%3E%3Cpath%20d='M78.975.354l7.68,7.68-7.68,7.68'%20transform='translate(1415.717%20726.275)'%20fill='%230059aa'/%3E%3Cpath%20d='M79.682,16.42l-1.414-1.414L85.24,8.033,78.268,1.061,79.682-.354l8.387,8.387Z'%20transform='translate(1415.717%20726.275)'%20fill='%23fff'/%3E%3Cpath%20d='M23.372,0H5'%20transform='translate(1479%20734.308)'%20fill='%230059aa'/%3E%3Cpath%20d='M23.372,1H5V-1H23.372Z'%20transform='translate(1479%20734.308)'%20fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
main#x-media #action .action-bnr-wrap a.action-bnr.bnr-top i.icon {
  display: inline-block;
  margin-right: 1rem;
  vertical-align: middle;
}
@media screen and (max-width: 999px) {
  main#x-media #action .action-bnr-wrap a.action-bnr.bnr-top i.icon {
    display: block;
    width: 6rem;
    margin-bottom: 0.5rem;
  }
}
main#x-media {
  /* !TOP
  ---------------------------------------------------------- */
}
main#x-media #mv-slide .splide__slide {
  width: 560px;
  flex: 0 0 560px;
  border-radius: 1rem;
  perspective: 500px;
}
main#x-media #mv-slide .splide__slide .slide-card {
  height: 100%;
  background: #f8f8f8;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transform-origin: center;
  transform: translateZ(0);
}
main#x-media #mv-slide .splide__slide .slide-card:hover > figure > img {
  transform: translate(-50%, -50%) scale(1.1);
}
main#x-media #mv-slide .splide__slide .slide-card > figure {
  aspect-ratio: 664/388;
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 1rem 1rem 0 0;
}
main#x-media #mv-slide .splide__slide .slide-card > figure > img {
  object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease-out;
}
main#x-media #mv-slide .splide__slide.onSlide .slide-card {
  box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.15);
  transform: translateZ(40px);
}
@media screen and (max-width: 999px) {
  main#x-media #mv-slide .splide__slide.onSlide .slide-card {
    box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.15);
    transform: translateZ(0);
  }
}
@media screen and (max-width: 999px) {
  main#x-media #mv-slide .splide__slide {
    width: 100%;
    flex: 0 0 100%;
  }
}
main#x-media #mv-slide .splide__track {
  padding-block: 6rem 8rem;
}
@media screen and (max-width: 999px) {
  main#x-media #mv-slide .splide__track {
    padding-block: 2rem 6rem;
  }
}
main#x-media #mv-slide .splide__pagination__page.is-active {
  background: #8d8d8d;
}
main#x-media #mv-slide .splide__arrow {
  background: #fff;
  height: 4em;
  opacity: 1;
  width: 4em;
  z-index: 1;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='56'%20height='56'%20viewBox='0%200%2056%2056'%3E%3Cg%20transform='translate(-1086%20-481)'%3E%3Ccircle%20cx='28'%20cy='28'%20r='28'%20transform='translate(1086%20481)'%20fill='%23fff'/%3E%3Cg%20transform='translate(-391.814%20-160.308)'%3E%3Cg%20transform='translate(12.814%20-65)'%3E%3Cpath%20d='M78.975.354l7.68,7.68-7.68,7.68'%20transform='translate(1415.717%20726.275)'%20fill='%23fff'/%3E%3Cpath%20d='M79.682,16.42l-1.414-1.414L85.24,8.033,78.268,1.061,79.682-.354l8.387,8.387Z'%20transform='translate(1415.717%20726.275)'%20fill='%235aaaf2'/%3E%3Cpath%20d='M23.372,0H5'%20transform='translate(1479%20734.308)'%20fill='%23fff'/%3E%3Cpath%20d='M23.372,1H5V-1H23.372Z'%20transform='translate(1479%20734.308)'%20fill='%235aaaf2'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-size: contain;
  background-position: center;
}
@media screen and (max-width: 999px) {
  main#x-media #mv-slide .splide__arrow {
    display:none;
  }
}
main#x-media #mv-slide .splide__arrow svg {
  opacity: 0;
}
main#x-media #mv-slide .splide__arrow:hover:not(:disabled) {
  opacity: 0.9;
}
main#x-media #mv-slide .splide__arrow:disabled {
  opacity: 0.3;
}
main#x-media #mv-slide .splide__arrow--prev {
  transform: translateY(-50%) rotate(180deg);
  left: 50%;
  margin-left: -33rem;
}
main#x-media #mv-slide .splide__arrow--next {
  right: 50%;
  margin-right: -33rem;
}
main#x-media #mv-slide .slide-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  background: #f8f8f8;
  border-radius: 1rem;
  padding-bottom: 1rem;
  isolation: isolate;
  overflow: hidden;
}
main#x-media #mv-slide .slide-card:hover {
  text-decoration: none;
}
main#x-media #mv-slide .slide-card.new {
  position: relative;
}
main#x-media #mv-slide .slide-card.new::before {
  content: "NEW";
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -1rem;
  left: -1rem;
  width: 5rem;
  height: 5rem;
  padding: 0.2rem 0.8rem;
  background-color: #ff6767;
  font-family: "poppins", sans-serif;
  color: #ffffff;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.15em;
  border-radius: 4rem;
  z-index: 1;
}
main#x-media #mv-slide .slide-card .slide-header {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
  padding: 1.2rem 1.6rem 0;
}
main#x-media #mv-slide .slide-card .slide-header .pub-date {
  font-family: "Poppins", sans-serif;
  font-size: 1.2rem;
  color: #8d8d8d;
}
main#x-media #mv-slide .slide-card .slide-header .category .category-tip {
  display: inline-block;
  padding: 0.2rem 1.2rem;
  background-color: #ffffff;
  color: #0059aa;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  border-radius: 4rem;
  vertical-align: text-top;
}
main#x-media #mv-slide .slide-card .slide-header .category .category-tip::before {
  content: "●";
  display: inline-block;
  transform: scale(0.5);
}
main#x-media #mv-slide .slide-card .tag {
  padding: 1.2rem 1.6rem 0;
}
main#x-media #mv-slide .slide-card .tag .tag-tip {
  display: inline-block;
  padding: 0.2rem 0.8rem;
  border: solid 1px #0059aa;
  color: #0059aa;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  border-radius: 4rem;
}
main#x-media #mv-slide .slide-card .tag .tag-tip::before {
  content: "# ";
  transform: scale(0.8);
}
main#x-media #mv-slide .slide-card .slide-title {
  font-size: 1.8rem;
  font-weight: bold;
  padding: 0 1.6rem;
  flex-shrink: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (max-width: 999px) {
  main#x-media #mv-slide .slide-card .slide-title {
    font-size: 1.6rem;
  }
}
main#x-media #contents {
  padding-bottom: 0;
}
main#x-media #contents section {
  margin-bottom: 12rem;
}
main#x-media #contents section .section-title {
  color: #5aaaf2;
  font-size: 2.8rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 3.2rem;
}
main#x-media #contents section .section-title span {
  display: block;
  font-family: "poppins", sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
}
main#x-media #contents #about {
  margin-top: 4rem;
  background: url(/assets/img/media/bk_whats.png) no-repeat center;
  background-color: hsla(208, 85%, 65%, 0.716);
  background-size: cover;
}
main#x-media #contents #about .about-content {
  padding: 6rem 4rem;
  display: flex;
  flex-direction: column;
  gap: 4rem;
  color: #ffffff;
}
@media screen and (max-width: 999px) {
  main#x-media #contents #about .about-content {
    padding: 0 0 6rem;
  }
}
main#x-media #contents #about .about-content .about-title {
  font-size: 3.2rem;
  font-weight: bold;
}
@media screen and (max-width: 999px) {
  main#x-media #contents #about .about-content .about-title {
    text-align: center;
  }
}
main#x-media #contents #about .about-content .about-title figure {
  padding-top: 24px;
}
@media screen and (max-width: 999px) {
  main#x-media #contents #about .about-content .about-title figure {
    padding-top: 20px;
  }
}
main#x-media #contents #about .about-content .about-title figure img:first-of-type {
  max-width: 368px;
}
@media screen and (max-width: 999px) {
  main#x-media #contents #about .about-content .about-title figure img:first-of-type {
    display: none;
  }
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #about .about-content .about-title figure img:last-of-type {
    display: none;
  }
}
main#x-media #contents #about .about-content .about-title span {
  display: block;
  font-family: "poppins", sans-serif;
  font-size: 1.6rem;
  font-weight: 500;
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #about .about-content {
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
  }
  main#x-media #contents #about .about-content .about-item {
    width: calc(50% - 2rem);
  }
}
@media screen and (max-width: 999px) {
  main#x-media #contents #about {
    padding-top: 6rem;
  }
}
main#x-media #contents #attention {
  text-align: center;
  margin-bottom: 0;
}
main#x-media #contents #attention .keyword-tags {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.2rem;
  margin-top: 1rem;
  max-width: 80rem;
  margin: 0 auto;
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #attention .keyword-tags {
    flex-direction: row;
  }
}
main#x-media #contents #attention .keyword-tags > li {
  display: flex;
  justify-content: center;
}
main#x-media #contents #attention .keyword-tags .tag {
  display: inline-block;
  padding: 0.5rem 2rem;
  background: #ffffff;
  border: 2px solid #5aaaf2;
  border-radius: 4rem;
  font-size: 1.6rem;
  color: #5aaaf2;
  cursor: pointer;
}
@media screen and (max-width: 999px) {
  main#x-media #contents #attention .keyword-tags .tag {
    font-size: 1.2rem;
  }
}
main#x-media #contents #attention .keyword-tags .tag::before {
  content: "# ";
  transform: scale(0.8);
}
main#x-media #contents #attention .keyword-tags .tag:hover {
  background-color: #5aaaf2;
  color: #ffffff;
  text-decoration: none;
}
main#x-media #contents #attention div.keyword-tags {
  flex-direction: row;
}
main#x-media #contents.miraiuum-top #column {
  padding-top: 12rem;
}
main#x-media #contents #navblog {
  width: 100%;
}
main#x-media #contents #navblog > a {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  background-color: #E6F2FD;
  padding-top: 80px;
  padding-bottom: 100px;
  position: relative;
  max-width: 1120px;
}
main#x-media #contents #navblog > a:hover {
  text-decoration: none;
  opacity: 0.7;
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #navblog > a {
    border-radius: 15px;
    padding: 48px;
  }
}
main#x-media #contents #navblog > a::after {
  content: "";
  position: absolute;
  bottom: 40px;
  right: 24px;
  width: 56px;
  aspect-ratio: 56/56;
  background-image: url(../img/media/to-blog.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #navblog > a::after {
    bottom: 48px;
    right: 48px;
  }
}
main#x-media #contents #navblog > a > section {
  margin-bottom: 0;
  width: 100%;
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #navblog > a > section {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    column-gap: 40px;
  }
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #navblog > a > section > figure {
    width: 362px;
  }
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #navblog > a > section > div {
    width: calc(100% - 362px - 40px);
  }
}
main#x-media #contents #navblog > a > section > div > header > h2 {
  padding-top: 64px;
  font-size: 28px;
  line-height: 1;
  font-weight: bold;
  color: #5AAAF2;
  position: relative;
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #navblog > a > section > div > header > h2 {
    padding-top: 63px;
  }
}
main#x-media #contents #navblog > a > section > div > header > h2::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 0;
  aspect-ratio: 120/24;
  width: 120px;
  background-image: url(../img/media/blog-title-before.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #navblog > a > section > div > header > h2::before {
    top: 12px;
  }
}
main#x-media #contents #navblog > a > section > div > p {
  font-size: 14px;
  line-height: 24px;
  padding-top: 16px;
}
@media screen and (min-width: 1000px) {
  main#x-media #contents #navblog > a > section > div > p > br:nth-of-type(2) {
    display: none;
  }
}
main#x-media #contents #totrivia {
  padding-top: 100px;
  padding-bottom: 120px;
}
main#x-media #contents #totrivia > a {
  display: block;
  width: 100%;
  max-width: 430px;
  margin: 0 auto;
}
main#x-media #contents #totrivia > a:hover {
  opacity: 0.7;
}
main#x-media #contents #totrivia > a > img {
  width: 100%;
  height: auto;
}
main#x-media #contents .pagination {
  text-align: center;
  margin-top: 6rem;
}
main#x-media #contents .pagination a.page-num {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  margin: 0 0.25rem;
  border: 2px solid #5aaaf2;
  border-radius: 50%;
  font-family: "poppins", sans-serif;
  color: #5aaaf2;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  transition: background 0.3s, color 0.3s;
}
@media screen and (max-width: 999px) {
  main#x-media #contents .pagination a.page-num {
    width: 4rem;
    height: 4rem;
    font-size: 1.2rem;
  }
}
main#x-media #contents .pagination a.page-num.active {
  background: #5aaaf2;
  color: #fff;
}
main#x-media #contents .pagination a.page-num.active,
main#x-media #contents .pagination a.page-num:hover {
  background: #5aaaf2;
  color: #fff;
}
main#x-media #contents .pagination a.page-next,
main#x-media #contents .pagination a.page-prev {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  font-size: 1rem;
  background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='56'%20height='56'%20viewBox='0%200%2056%2056'%3E%3Cg%20transform='translate(-1086%20-481)'%3E%3Ccircle%20cx='28'%20cy='28'%20r='28'%20transform='translate(1086%20481)'%20fill='%23fff'/%3E%3Cg%20transform='translate(-391.814%20-160.308)'%3E%3Cg%20transform='translate(12.814%20-65)'%3E%3Cpath%20d='M78.975.354l7.68,7.68-7.68,7.68'%20transform='translate(1415.717%20726.275)'%20fill='%23fff'/%3E%3Cpath%20d='M79.682,16.42l-1.414-1.414L85.24,8.033,78.268,1.061,79.682-.354l8.387,8.387Z'%20transform='translate(1415.717%20726.275)'%20fill='%235aaaf2'/%3E%3Cpath%20d='M23.372,0H5'%20transform='translate(1479%20734.308)'%20fill='%23fff'/%3E%3Cpath%20d='M23.372,1H5V-1H23.372Z'%20transform='translate(1479%20734.308)'%20fill='%235aaaf2'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center;
  text-indent: -9999px;
  background-size: contain;
  background-position: center;
  overflow: hidden;
}
main#x-media #contents .pagination a.page-prev {
  transform: rotate(180deg);
}
main#x-media #contents {
  /* !Category
  ---------------------------------------------------------- */
}
main#x-media #contents.category {
  padding-top: 12rem;
}
main#x-media #contents.category .column-list {
  margin-top: 4rem;
}
main#x-media #contents.category #attention {
  padding-block: 6rem;
  background: #d8eeff;
}
main#x-media .column-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5rem;
  max-width: 1120px;
  margin: 0 auto;
}
@media screen and (max-width: 999px) {
  main#x-media .column-list {
    grid-template-columns: 1fr;
  }
}
main#x-media .column-list .column-item a.column-card {
  display: block;
  background: #fff;
  border-radius: 1rem;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
}
main#x-media .column-list .column-item a.column-card:hover figure img {
  transform: translate(-50%, -50%) scale(1.1);
}
main#x-media .column-list .column-item a.column-card figure {
  margin: 0;
  border-radius: 1rem;
  overflow: hidden;
  overflow: hidden;
  position: relative;
  aspect-ratio: 327/184;
}
main#x-media .column-list .column-item a.column-card figure img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: none;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.5s ease-out;
}
main#x-media .column-list .column-item a.column-card .card-content {
  padding: 1rem 0;
}
main#x-media .column-list .column-item a.column-card .card-content .column-header {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
main#x-media .column-list .column-item a.column-card .card-content .column-header .pub-date {
  line-height: 1;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  color: #8d8d8d;
}
main#x-media .column-list .column-item a.column-card .card-content .column-header .category {
  line-height: 0;
}
main#x-media .column-list .column-item a.column-card .card-content .column-header .category .category-tip {
  display: inline-flex;
  align-items: center;
  height: 1.4rem;
  padding: 0.2rem 1rem;
  background-color: #d8eeff;
  font-size: 0.8rem;
  font-style: normal;
  font-weight: 500;
  border-radius: 4rem;
  vertical-align: middle;
}
main#x-media .column-list .column-item a.column-card .card-content .column-header .category .category-tip::before {
  content: "●";
  color: #0059aa;
  display: inline-block;
  transform: scale(0.5);
}
main#x-media .column-list .column-item a.column-card .card-content .column-title {
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 0.5rem;
}
main#x-media .column-list .column-item a.column-card .card-content .tag .tag-tip {
  display: inline-block;
  padding: 0.2rem 0.8rem;
  border: solid 1px #5aaaf2;
  color: #5aaaf2;
  font-size: 0.8rem;
  font-style: normal;
  font-weight: 500;
  border-radius: 4rem;
}
main#x-media .column-list .column-item a.column-card .card-content .tag .tag-tip::before {
  content: "# ";
  transform: scale(0.8);
}

.fixedicon {
  position: fixed;
  left: 80px;
  bottom: 20px;
  z-index: 100;
}
@media screen and (max-width: 999px) {
  .fixedicon {
    left: 24px;
  }
}
.fixedicon a {
  display: block;
}
.fixedicon a img {
  width: 156px;
  height: auto;
  display: block;
}
@media screen and (max-width: 999px) {
  .fixedicon a img {
    width: 117px;
  }
}

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