@charset "UTF-8";
/*ベースフォント設定*/
/*Font Awesome5---------------------------------------------*/
@media screen and (min-width: 1201px ) { /*PC*/ }
@media screen and (max-width: 760px ) { /*SP*/ }
@media screen and (max-width: 1200px ) and (min-width: 761px ) { /*TB*/ }
@media screen and (max-width: 760px ) { /*SP*/
  body {
    -webkit-text-size-adjust: 100%;
    font-size: 75%;
  }
}
@-webkit-keyframes buruburu {
  0% {
    -webkit-transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, -5px);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
@keyframes buruburu {
  0% {
    -webkit-transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, -5px);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
@-webkit-keyframes buruburu2 {
  0% {
    -webkit-transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, -20px);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
@keyframes buruburu2 {
  0% {
    -webkit-transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, -20px);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
@-webkit-keyframes fadein {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 70%;
  }
  70% {
    opacity: 50%;
  }
  100% {
    opacity: 100%;
  }
}
@keyframes fadein {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 70%;
  }
  70% {
    opacity: 50%;
  }
  100% {
    opacity: 100%;
  }
}
@-webkit-keyframes gradAnimeTime {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes gradAnimeTime {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.fade {
  opacity: 0;
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  -webkit-transition: all 0.7s;
  transition: all 0.7s;
}
.fade.effect {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.slidein {
  opacity: 0;
  -webkit-transform: translateX(-300px);
          transform: translateX(-300px);
  -webkit-transition: all 0.7s;
  transition: all 0.7s;
}
.slidein.effect {
  opacity: 1;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

@-webkit-keyframes fadeUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes fadeUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
.fade-list > * {
  -webkit-transition: all 0.7s;
  transition: all 0.7s;
  opacity: 0;
  -webkit-transform: translateY(20px);
          transform: translateY(20px);
  position: relative;
}
.fade-list.effect > *:nth-child(1) {
  -webkit-animation: fadeUp 0.5s 0.3s 1 ease normal forwards;
          animation: fadeUp 0.5s 0.3s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(2) {
  -webkit-animation: fadeUp 0.5s 0.6s 1 ease normal forwards;
          animation: fadeUp 0.5s 0.6s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(3) {
  -webkit-animation: fadeUp 0.5s 0.9s 1 ease normal forwards;
          animation: fadeUp 0.5s 0.9s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(4) {
  -webkit-animation: fadeUp 0.5s 1.2s 1 ease normal forwards;
          animation: fadeUp 0.5s 1.2s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(5) {
  -webkit-animation: fadeUp 0.5s 1.5s 1 ease normal forwards;
          animation: fadeUp 0.5s 1.5s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(6) {
  -webkit-animation: fadeUp 0.5s 1.8s 1 ease normal forwards;
          animation: fadeUp 0.5s 1.8s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(7) {
  -webkit-animation: fadeUp 0.5s 2.1s 1 ease normal forwards;
          animation: fadeUp 0.5s 2.1s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(8) {
  -webkit-animation: fadeUp 0.5s 2.4s 1 ease normal forwards;
          animation: fadeUp 0.5s 2.4s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(9) {
  -webkit-animation: fadeUp 0.5s 2.7s 1 ease normal forwards;
          animation: fadeUp 0.5s 2.7s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(10) {
  -webkit-animation: fadeUp 0.5s 3s 1 ease normal forwards;
          animation: fadeUp 0.5s 3s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(11) {
  -webkit-animation: fadeUp 0.5s 3.3s 1 ease normal forwards;
          animation: fadeUp 0.5s 3.3s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.fade-list.effect > *:nth-child(12) {
  -webkit-animation: fadeUp 0.5s 3.6s 1 ease normal forwards;
          animation: fadeUp 0.5s 3.6s 1 ease normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}

.move-img {
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.move-img:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 100%;
  background: #fff;
  z-index: 1;
  -webkit-transform-origin: right center;
          transform-origin: right center;
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transition: width 0.3s cubic-bezier(0.19, 1, 0.22, 1) 0s, -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0.4s;
  transition: width 0.3s cubic-bezier(0.19, 1, 0.22, 1) 0s, -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0.4s;
  transition: width 0.3s cubic-bezier(0.19, 1, 0.22, 1) 0s, transform 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0.4s;
  transition: width 0.3s cubic-bezier(0.19, 1, 0.22, 1) 0s, transform 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0.4s, -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0.4s;
}
.move-img img {
  position: relative;
  width: 100%;
  height: auto;
  opacity: 0;
  left: -100%;
  -webkit-transition: all 0.7s;
  transition: all 0.7s;
}
.move-img.effect img {
  opacity: 1;
  left: 0;
}
.move-img.effect:before {
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  width: 100%;
}

.blur {
  -ms-filter: blur(6px);
  -webkit-filter: blur(6px);
          filter: blur(6px);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  -webkit-transform: scale(0.95);
  transform: scale(0.95);
}
.blur.effect {
  -webkit-transform: scale(1);
  transform: scale(1);
  -ms-filter: blur(0);
  -webkit-filter: blur(0);
          filter: blur(0);
}

.focus-img {
  position: relative;
}
.focus-img img {
  display: block;
  min-width: 100%;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(1.5) rotateZ(0);
  transform: translate(-50%, -50%) scale(1.5) rotateZ(0);
  -webkit-transition: all 3s;
  transition: all 3s;
}
.focus-img.effect img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(1) rotateZ(0);
  transform: translate(-50%, -50%) scale(1) rotateZ(0);
}


/*共通------------------------------------------*/
/*=============================================================================*/
/*ページ内コンテンツ===============================================================*/
/*=============================================================================*/
.pc_slider {
  display: block;
}

.sp_slider {
  display: none;
}

@media screen and (max-width: 760px ) { /*SP*/
  .pc_slider {
    display: none;
  }
  .sp_slider {
    display: block;
  }
}
#keyvisual {
  z-index: 1;
  margin-bottom: 2em;
  position: relative;
}
@media screen and (max-width: 760px ) {
  #keyvisual { /*SP*/ }
  #keyvisual .ms-thumb-list {
    display: none;
  }
}
#keyvisual #slide-dep-nav {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
          align-items: stretch;
  -ms-flex-pack: start;
  -webkit-box-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  max-width: 50%;
  margin: 0 auto;
}
@media screen and (max-width: 1200px ) and (min-width: 761px ) {
  #keyvisual #slide-dep-nav {
    max-width: 60%;
  }
}
@media screen and (max-width: 760px ) {
  #keyvisual #slide-dep-nav {
    max-width: 85%;
  }
}
#keyvisual #slide-dep-nav li {
  width: 33.3%;
  padding: 10px;
}
@media screen and (max-width: 1200px ) and (min-width: 761px ) {
  #keyvisual #slide-dep-nav li {
    padding: 5px;
  }
  #keyvisual #slide-dep-nav li a {
    padding-top: 60% !important;
  }
}
@media screen and (max-width: 760px ) {
  #keyvisual #slide-dep-nav li { /*SP*/
    padding: 5px;
    width: 50% !important;
  }
  #keyvisual #slide-dep-nav li a {
    padding-top: 10px !important;
  }
  #keyvisual #slide-dep-nav li a span {
    position: relative !important;
    display: block;
    bottom: auto;
    left: auto;
  }
}
#keyvisual #slide-dep-nav li, #keyvisual #slide-dep-nav li * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#keyvisual #slide-dep-nav li a {
  border: 3px solid #fff;
  display: block;
  width: 100%;
  height: 0;
  padding-top: 95%;
  background: #fff;
  position: relative;
  background: no-repeat center top;
  background-size: 100% !important;
}
#keyvisual #slide-dep-nav li a, #keyvisual #slide-dep-nav li a:before {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
#keyvisual #slide-dep-nav li a span {
  display: inline-block;
  width: 100%;
  padding: 10px;
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  z-index: 100;
}
#keyvisual #slide-dep-nav li a span:before {
  content: "#";
}
#keyvisual #slide-dep-nav li a:before {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background: rgba(0, 0, 0, 0);
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.3)));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
  background-size: 100% 200%;
  background-position: 100% 100%;
}
#keyvisual #slide-dep-nav li a:hover {
  background-size: 110% !important;
}
#keyvisual #slide-dep-nav li a:hover:before {
  background-position: 100% 0;
}
#keyvisual #slide-dep-nav #slide-dep-business a {
  background-image: url("../img/dep-business.jpg");
}
#keyvisual #slide-dep-nav #slide-dep-design a {
  background-image: url("../img/dep-design.jpg");
}
#keyvisual #slide-dep-nav #slide-dep-child a {
  background-image: url("../img/dep-child.jpg");
}
#keyvisual #slide-dep-nav #slide-dep-health a {
  background-image: url("../img/dep-food.jpg");
}
#keyvisual #slide-dep-nav #slide-dep-english a {
  background-image: url("../img/dep-english.jpg");
}
#keyvisual .ms-thumb-list {
  z-index: 300;
}

#area-important {
  z-index: 3;
  padding: 3em 0;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
          align-items: stretch;
  -ms-flex-pack: start;
  -webkit-box-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
}
#area-important header {
  -ms-flex-grow: 1;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  color: #c73b3b;
  position: relative;
  padding-bottom: 7em;
  padding-right: 3em;
}
#area-important header h1 {
  font-size: 115%;
  letter-spacing: 2px;
}
#area-important header p {
  font-size: 85%;
  max-width: 90%;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media screen and (max-width: 760px ) {
  #area-important { /*SP*/
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0 3%;
  }
  #area-important header, #area-important .important-news {
    width: 100%;
  }
  #area-important header {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-align: center;
    -webkit-box-align: center;
            align-items: center;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
            justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-direction: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
            flex-direction: row;
    padding-bottom: 1em;
  }
  #area-important header p {
    position: relative;
    margin-bottom: 0;
  }
  #area-important header p br {
    display: none;
  }
}

.important-news {
  width: 75%;
}
.important-news li {
  margin-bottom: 15px;
  background: #ffefef;
}

.toggle-switch {
  padding: 1em 1.5em;
  padding-left: 7em;
  cursor: pointer;
  -webkit-transition: all 0.7s;
  transition: all 0.7s;
}
.toggle-switch:hover {
  background: #FFE5E5;
}
.toggle-switch dt {
  line-height: 1;
}
.toggle-switch dt {
  font-family: "Josefin Sans", sans-serif;
  width: 7em;
  color: #c73b3b;
  position: absolute;
  top: 1.5em;
  left: 1em;
}
.toggle-switch dd {
  position: relative;
  padding-right: 3em;
}
.toggle-switch dd:after {
  display: inline-block;
  line-height: 1;
  content: url("../img/icon-plus.png");
  padding: 2px 3px;
  border: 1px solid #ff6b6b;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) scale(1);
          transform: translateY(-50%) scale(1);
  right: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.toggle-switch + .expert {
  display: none;
  border-top: 1px dotted #ED9B9B;
  padding: 1.5em 5% 1em;
}
.toggle-switch + .expert .more {
  margin-bottom: 0;
  text-align: right;
}
.toggle-switch + .expert .more a {
  display: inline-block;
  padding: 5px 1em;
  background: #ed6ea0;
  background: -webkit-gradient(linear, left top, right top, from(#ed6ea0), to(#ec8c69));
  background: linear-gradient(to right, #ed6ea0, #ec8c69);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
  color: #fff;
}
.toggle-switch.open dd:after {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) scale(1) rotateZ(45deg);
  transform: translateY(-50%) scale(1) rotateZ(45deg);
  border-radius: 100%;
}

#area-information {
  background: url("../img/bg-information.jpg") no-repeat left top;
  background-size: contain;
  padding: 7em 0;
}
#area-information > header {
  text-align: center;
  margin-bottom: 3em;
  padding: 0 5%;
}

#area-campuslife header {
  background: url("../img/juntan_perspective.jpg") no-repeat left center;
  background-size: contain;
  padding: 5em 0 0;
  margin-bottom: -1em;
}
#area-campuslife header h1 {
  background: url("../img/bg-title-campus.gif") no-repeat right bottom;
  background-size: auto 100%;
  text-align: center;
  padding: 3em 5% 7em;
}
@media screen and (max-width: 1200px ) and (min-width: 761px ), screen and (max-width: 760px ) {
  #area-campuslife header h1 {
    background: none;
  }
}
#area-campuslife #info-campuslife li {
  max-width: 400px;
}
#area-campuslife .slick-dots li button:before {
  display: inline-block;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background: #fff;
  border: 2px solid #6565ae;
}
@media screen and (max-width: 760px ) {
  #area-campuslife .slick-dots li {
    padding: 5px !important;
  }
}
#area-campuslife .slick-dots li.slick-active button:before {
  background: #6565ae;
}

#info-campuslife {
  padding-bottom: 3em;
  margin-bottom: 5em;
}
#info-campuslife li {
  padding: 15px;
  padding-top: 2em;
}
#info-campuslife li dl {
  background: #fff;
  -webkit-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.1));
  -moz-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.1));
  -ms-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.1));
  filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.1));
  display: -ms-grid;
  display: grid;
  grid-auto-columns: 1fr;
  -ms-grid-columns: 2em 0px 1fr;
  grid-template-columns: 2em 1fr;
  -ms-grid-rows: 1fr 0px auto;
  grid-template-rows: 1fr auto;
  gap: 0px 0px;
      grid-template-areas: "aside thum" "aside title";
}
@media all and (-ms-high-contrast: none) {
  #info-campuslife li dl {
    -webkit-box-shadow: 1px 3px 5px 0 rgba(0, 0, 0, 0.1);
            box-shadow: 1px 3px 5px 0 rgba(0, 0, 0, 0.1);
  }
}
#info-campuslife li dl dt {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
  grid-area: thum;
  margin-top: -2em;
  overflow: hidden;
  aspect-ratio: 3/2;
  background: #fff;
}
#info-campuslife li dl dt a {
  display: block;
  min-height: 210px;
  position: relative;
}
@media screen and (max-width: 760px ) {
  #info-campuslife li dl dt a {
    min-height: 180px;
  }
}
#info-campuslife li dl dt a img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(1);
          transform: translate(-50%, -50%) scale(1);
  max-width: 100%;
  min-width: 100%;
  height: auto;
}
#info-campuslife li dl dd.post-expert {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: title;
  background: #fff;
}
#info-campuslife li dl dd.post-expert .title {
  font-size: 110%;
  padding: 10px 0;
  margin-bottom: 0;
}
#info-campuslife li dl dd.post-expert .tags, #info-campuslife li dl dd.post-expert .categores {
  font-size: 80%;
}
#info-campuslife li dl dd.post-expert .tags a, #info-campuslife li dl dd.post-expert .categores a {
  color: #7186cb;
}
#info-campuslife li dl dd.post-expert .tags {
  padding: 5px 0;
  font-size: 85%;
}
#info-campuslife li dl dd.post-expert .tags a {
  display: inline-block;
  margin-right: 1em;
}
#info-campuslife li dl dd.post-expert .tags a:before {
  content: "#";
}
#info-campuslife li dl dd.post-expert .categores {
  padding: 5px 0;
}
#info-campuslife li dl dd.post-expert .categores .post-categories li {
  padding: 0;
  display: inline-block;
  margin-right: 1em;
}
#info-campuslife li dl dd.post-expert .categores .post-categories li a {
  display: inline-block;
}
#info-campuslife li dl dd.post-expert .categores .post-categories li a:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  content: "\f02c";
}
#info-campuslife li dl dd.info-data {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  grid-area: aside;
  background: #fff;
  position: relative;
}
#info-campuslife li dl dd.info-data span {
  font-family: "Josefin Sans", sans-serif;
  font-size: 90%;
  letter-spacing: 1px;
  color: #ee7328;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%) scale(1) rotateZ(90deg);
  transform: translateX(-50%) scale(1) rotateZ(90deg);
  top: 3em;
}

#top-postbox {
  background: #fff;
  padding: 1em 3%;
  -webkit-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.1));
  -moz-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.1));
  -ms-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.1));
  filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.1));
  display: -ms-grid;
  display: grid;
  grid-auto-columns: 1fr;
  -ms-grid-columns: 1fr 5% 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: auto 1em auto;
  grid-template-rows: auto auto;
  gap: 1em 5%;
      grid-template-areas: "topics event" "topics event";
}
@media all and (-ms-high-contrast: none) {
  #top-postbox {
    -webkit-box-shadow: 1px 3px 5px 0 rgba(0, 0, 0, 0.1);
            box-shadow: 1px 3px 5px 0 rgba(0, 0, 0, 0.1);
  }
}
@media screen and (max-width: 760px ) {
  #top-postbox { /*SP*/
    display: block;
  }
  #top-postbox .postbox ul {
    max-height: 300px;
    overflow-y: auto;
    padding: 1em 3%;
  }
}

.postbox header {
  padding: 2em 0;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
          align-items: center;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
}
.postbox header h1 {
  font-size: 120%;
  letter-spacing: 2px;
}
.postbox header aside {
  font-family: "Josefin Sans", sans-serif;
}
.postbox header aside a {
  display: inline-block;
  padding: 1em 5em 1em 1em;
  position: relative;
  line-height: 1;
  text-decoration: none;
}
.postbox header aside a, .postbox header aside a:before, .postbox header aside a:after {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.postbox header aside a:before {
  background: #eaeaea;
  width: 2.5em;
  height: 2.5em;
  content: "";
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) scale(1);
          transform: translateY(-50%) scale(1);
  left: 0;
  border-radius: 100%;
  z-index: -1;
}
.postbox header aside a:after {
  background: #c1c1c1;
  width: 4em;
  height: 1px;
  content: "";
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) scale(1);
          transform: translateY(-50%) scale(1);
  right: 0;
}
.postbox header aside a:hover:before {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) scale(1.2) rotateZ(0);
  transform: translateY(-50%) scale(1.2) rotateZ(0);
}
.postbox header aside a:hover:after {
  width: 0;
}

ul.news-lineup li {
  padding-bottom: 15px;
  border-bottom: 1px solid #c1c1c1;
  margin-bottom: 15px;
}
@media screen and (max-width: 760px ) {
  ul.news-lineup li {
    padding-bottom: 8px;
    margin-bottom: 8px;
  }
}
ul.news-lineup li a {
  display: block;
}
ul.news-lineup li dl {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
          align-items: stretch;
  -ms-flex-pack: start;
  -webkit-box-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
}
ul.news-lineup li dl .new {
  font-family: "Josefin Sans", sans-serif;
  display: inline-block;
  font-size: 85%;
  padding: 5px 5px 2px;
  line-height: 1;
  color: #d73737;
  border: 1px solid #d73737;
  margin-left: 1em;
}
ul.news-lineup li dl dt {
  font-family: "Josefin Sans", sans-serif;
  width: 7em;
  max-width: 30%;
  color: #999;
}
ul.news-lineup li dl dt .event-data {
  font-size: 90%;
  display: inline-block;
  text-align: center;
  padding: 5px 5px 2px;
  line-height: 1;
  color: #4bc38c;
  border: 1px solid #4bc38c;
}
ul.news-lineup li dl dd {
  -ms-flex-grow: 1;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  max-width: 70%;
}
ul.news-lineup li dl dd.tags {
  font-size: 85%;
  color: #6b9ed2;
}
ul.news-lineup li dl dd.tags a {
  display: inline-block;
}
ul.news-lineup li dl dd.tags a:not(:last-child) {
  margin-right: 1em;
}
ul.news-lineup li dl dd.tags a:before {
  content: "#";
}
ul.news-lineup.post-taginfo dl {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
ul.news-lineup.post-taginfo dl dt, ul.news-lineup.post-taginfo dl dd {
  width: 100%;
}
ul.news-lineup.post-taginfo dl dd.topics-title {
  padding: 5px 0;
}

#top-news {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  grid-area: topics;
}
#top-news h1 {
  color: #4b8ac3;
}
#top-news aside a {
  color: #4b8ac3;
}
#top-news aside a:before {
  background: #e3f1ff;
}
#top-news aside a:after {
  background: #8cbde7;
  background: linear-gradient(135deg, #8cbde7 0%, #8cbde7 33.3333333333%, #9cb8dd 33.3333333333%, #9cb8dd 66.6666666667%, #bebef2 66.6666666667%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="$statCol", endColorstr="$endCol",GradientType=1 );
}
#top-news dl dt, #top-news dl dd {
  max-width: inherit;
  max-width: initial;
}

#top-admission {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
  grid-area: admission;
}
#top-admission h1 {
  color: #ffba42;
}
#top-admission aside a {
  color: #ffba42;
}
#top-admission aside a:before {
  background: #fffbd8;
}
#top-admission aside a:after {
  background: #fba980;
  background: linear-gradient(135deg, #fba980 0%, #fba980 50%, #f7cb6b 50%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="$statCol", endColorstr="$endCol",GradientType=1 );
}

#top-event {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: event;
}
#top-event h1 {
  color: #4bc38c;
}
#top-event aside a {
  color: #4bc38c;
}
#top-event aside a:before {
  background: #ecfbdc;
}
#top-event aside a:after {
  background: #baecca;
  background: linear-gradient(135deg, #baecca 0%, #baecca 50%, #eceda2 50%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="$statCol", endColorstr="$endCol",GradientType=1 );
}

#area-pickup {
  background: #4589ae;
  padding: 5em 0;
}
#area-pickup header {
  text-align: center;
  margin-bottom: 5em;
}

#pickup-slider {
  padding-bottom: 3em;
}
#pickup-slider:not(.slick-initialized) {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#pickup-slider:not(.slick-initialized) li {
  max-width: 350px;
}
#pickup-slider:not(.slick-initialized) li img {
  max-width: 100%;
  height: auto;
}
#pickup-slider .slick-slide {
  -webkit-filter: grayscale(100%);
          filter: grayscale(100%);
  padding: 10px 10px 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
#pickup-slider .slick-slide.slick-center, #pickup-slider .slick-slide:hover {
  -webkit-filter: grayscale(0%);
          filter: grayscale(0%);
  padding: 0 10px 10px;
  -webkit-filter: drop-shadow(8px 8px 0 #f3e406);
  -moz-filter: drop-shadow(8px 8px 0 #f3e406);
  -ms-filter: drop-shadow(8px 8px 0 #f3e406);
  filter: drop-shadow(8px 8px 0 #f3e406);
}
@media all and (-ms-high-contrast: none) {
  #pickup-slider .slick-slide.slick-center, #pickup-slider .slick-slide:hover {
    -webkit-box-shadow: 8px 8px 0 0 #f3e406;
            box-shadow: 8px 8px 0 0 #f3e406;
  }
}
#pickup-slider .slick-slide.slick-center img, #pickup-slider .slick-slide:hover img {
  opacity: 1;
}
#pickup-slider .slick-slide img {
  max-width: 100%;
  height: auto;
}
#pickup-slider .slick-dots li button:before {
  opacity: 1;
  display: inline-block;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background: #fff;
}
#pickup-slider .slick-dots li.slick-active button:before {
  background: #ffea00;
}

#department-title {
  text-align: center;
  padding: 6em 10% 3em;
  position: relative;
}
#department-title h1 a {
  display: inline-block;
}
#department-title h1 a:hover img {
  opacity: 1;
  -webkit-filter: drop-shadow(5px 10px 10px rgba(193, 193, 193, 0.3));
  -moz-filter: drop-shadow(5px 10px 10px rgba(193, 193, 193, 0.3));
  -ms-filter: drop-shadow(5px 10px 10px rgba(193, 193, 193, 0.3));
  filter: drop-shadow(5px 10px 10px rgba(193, 193, 193, 0.3));
}
@media all and (-ms-high-contrast: none) {
  #department-title h1 a:hover img {
    -webkit-box-shadow: 5px 10px 10px 0 rgba(193, 193, 193, 0.3);
            box-shadow: 5px 10px 10px 0 rgba(193, 193, 193, 0.3);
  }
}
#department-title h1 img {
  max-width: 80%;
  height: auto;
}
#department-title #bg-line-before, #department-title #bg-line-after {
  position: absolute;
  z-index: -1;
}
#department-title #bg-line-before path, #department-title #bg-line-after path {
  stroke: #f4d2ee;
  fill: none;
  height: auto;
}
#department-title #bg-line-before {
  width: 50%;
  top: 0;
  left: 0;
}
#department-title #bg-line-after {
  width: 40%;
  bottom: 0;
  right: 0;
}
#department-title p.btn {
  margin-top: 3em;
}

@-webkit-keyframes lineAnimeBefore {
  0% {
    stroke-dashoffset: 385.0366210938px;
    stroke-dasharray: 385.0366210938px;
  }
  100% {
    stroke-dashoffset: 770.0732421875px;
    stroke-dasharray: 385.0366210938px;
  }
}
@keyframes lineAnimeBefore {
  0% {
    stroke-dashoffset: 385.0366210938px;
    stroke-dasharray: 385.0366210938px;
  }
  100% {
    stroke-dashoffset: 770.0732421875px;
    stroke-dasharray: 385.0366210938px;
  }
}
@-webkit-keyframes lineAnimeBefore2 {
  0% {
    stroke-dashoffset: 266.2696533203px;
    stroke-dasharray: 266.2696533203px;
  }
  100% {
    stroke-dashoffset: 532.5393066406px;
    stroke-dasharray: 266.2696533203px;
  }
}
@keyframes lineAnimeBefore2 {
  0% {
    stroke-dashoffset: 266.2696533203px;
    stroke-dasharray: 266.2696533203px;
  }
  100% {
    stroke-dashoffset: 532.5393066406px;
    stroke-dasharray: 266.2696533203px;
  }
}
@-webkit-keyframes lineAnimeBefore3 {
  0% {
    stroke-dashoffset: 313.9906005859px;
    stroke-dasharray: 313.9906005859px;
  }
  100% {
    stroke-dashoffset: 627.9812011719px;
    stroke-dasharray: 313.9906005859px;
  }
}
@keyframes lineAnimeBefore3 {
  0% {
    stroke-dashoffset: 313.9906005859px;
    stroke-dasharray: 313.9906005859px;
  }
  100% {
    stroke-dashoffset: 627.9812011719px;
    stroke-dasharray: 313.9906005859px;
  }
}
@-webkit-keyframes lineAnimeBefore4 {
  0% {
    stroke-dashoffset: 381.6613464355px;
    stroke-dasharray: 381.6613464355px;
  }
  100% {
    stroke-dashoffset: 763.3226928711px;
    stroke-dasharray: 381.6613464355px;
  }
}
@keyframes lineAnimeBefore4 {
  0% {
    stroke-dashoffset: 381.6613464355px;
    stroke-dasharray: 381.6613464355px;
  }
  100% {
    stroke-dashoffset: 763.3226928711px;
    stroke-dasharray: 381.6613464355px;
  }
}
.effect #bg-line-before path.cls-1 {
  -webkit-animation: lineAnimeBefore 2s ease 0s 1 normal forwards;
          animation: lineAnimeBefore 2s ease 0s 1 normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.effect #bg-line-before path.cls-2 {
  -webkit-animation: lineAnimeBefore2 3.5s ease 0s 1 normal forwards;
          animation: lineAnimeBefore2 3.5s ease 0s 1 normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.effect #bg-line-after path.cls-3 {
  -webkit-animation: lineAnimeBefore3 3s ease 0s 1 normal forwards;
          animation: lineAnimeBefore3 3s ease 0s 1 normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.effect #bg-line-after path.cls-4 {
  -webkit-animation: lineAnimeBefore4 3.5s ease 0s 1 normal forwards;
          animation: lineAnimeBefore4 3.5s ease 0s 1 normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}

@-webkit-keyframes slideBg {
  0% {
    top: -50%;
    right: -100%;
  }
  100% {
    top: 0;
    right: 0;
  }
}
@keyframes slideBg {
  0% {
    top: -50%;
    right: -100%;
  }
  100% {
    top: 0;
    right: 0;
  }
}
ul.department-wrap {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
          align-items: stretch;
  -ms-flex-pack: start;
  -webkit-box-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
}
ul.department-wrap li {
  width: 25%;
}
@media screen and (max-width: 1200px ) and (min-width: 761px ) {
  ul.department-wrap li {
    width: 50%;
  }
}
@media screen and (max-width: 760px ) {
  ul.department-wrap li {
    width: 100%;
  }
}

#top-route .cont {
  max-width: 100% !important;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
          align-items: center;
  -ms-flex-pack: start;
  -webkit-box-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
#top-route .cont #achievement-count {
  font-weight: bold;
  -ms-flex-order: 2;
  -webkit-box-ordinal-group: 3;
          order: 2;
  padding: 6rem 8% 4rem;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 1200px ) and (min-width: 761px ), screen and (max-width: 760px ) {
  #top-route .cont #achievement-count {
    width: 100%;
    padding-top: 3em;
    -ms-flex-order: 0;
    -webkit-box-ordinal-group: 1;
            order: 0;
  }
}
#top-route .cont #achievement-count p {
  font-size: 120%;
  margin-bottom: 0;
  line-height: 1.2;
}
#top-route .cont #achievement-count #countup-wrap {
  color: #da3000;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: end;
  -webkit-box-align: end;
          align-items: flex-end;
  -ms-flex-pack: start;
  -webkit-box-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  font-size: 300%;
  text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff;
}
#top-route .cont #achievement-count #countup-wrap span {
  display: inline-block;
  padding-left: 5px;
}
#top-route .cont #achievement-count #countup-wrap span:not([class]) {
  padding-bottom: 8px;
}
#top-route .cont #achievement-count #countup-wrap #counter {
  font-size: 200%;
}
#top-route .cont #achievement-count:before, #top-route .cont #achievement-count:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-size: contain !important;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  right: 0;
}
#top-route .cont #achievement-count:before {
  background-image: url("../img/top-route-under.png");
  max-width: 600px;
  z-index: -2;
  width: 100%;
}
#top-route .cont #achievement-count:after {
  background-image: url("../img/top-route-top.png");
  max-width: 680px;
  z-index: -1;
}
#top-route .cont #route-exp {
  font-size: 120%;
  line-height: 2;
  width: 55%;
}
@media screen and (max-width: 1200px ) and (min-width: 761px ), screen and (max-width: 760px ) {
  #top-route .cont #route-exp {
    width: 100%;
  }
}
#top-route .cont #route-exp .btn {
  font-size: 90%;
  margin: 2em 0 0;
}

.effect #top-route dt:before {
  -webkit-animation: slideBg 2s ease 0s 1 normal forwards;
          animation: slideBg 2s ease 0s 1 normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.effect #top-route dt:after {
  -webkit-animation: slideBg 2s ease 1s 1 normal forwards;
          animation: slideBg 2s ease 1s 1 normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}

.list-department {
  margin-bottom: 200px;
  display: block;
  background: rgba(222, 222, 222, 0.8705882353);
  position: relative;
  aspect-ratio: 1;
  position: relative;
  background-repeat: no-repeat;
  background-position: center center !important;
  background-size: 100%;
  -webkit-transition: all 0.7s;
  transition: all 0.7s;
}
.list-department dl {
  width: 85%;
  background: #fff;
  padding: 1.5em 1.5em;
  position: absolute;
  bottom: 0;
  left: 0;
}
.list-department dl dt {
  font-size: 140%;
  letter-spacing: 2px;
  font-weight: bold;
  margin-bottom: 10px;
}
.list-department dl .job {
  padding-right: 20%;
}
.list-department dl .job span {
  display: inline-block;
  margin-right: 10px;
}
.list-department p.more {
  display: inline-block;
  font-family: "Josefin Sans", sans-serif;
  font-size: 120%;
  line-height: 1;
  padding: 15px 1em 10px;
  color: #fff;
  background: #000;
  position: absolute;
  right: 0;
  bottom: 0;
  margin-bottom: 0;
}
.list-department:hover {
  text-decoration: none;
  background-size: 120% !important;
}

#dep-business {
  background-image: url("../img/dep-business.jpg");
}
#dep-business dt, #dep-business dd.job span {
  color: #6572e1;
}
#dep-business .more {
  background: #6670e1;
  background: -webkit-gradient(linear, left top, right top, from(#6670e1), to(#43a2eb));
  background: linear-gradient(to right, #6670e1, #43a2eb);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
}

#dep-design {
  background-image: url("../img/dep-design.jpg");
}
#dep-design dt, #dep-design dd.job span {
  color: #ff959a;
}
#dep-design .more {
  background: #ff9599;
  background: -webkit-gradient(linear, left top, right top, from(#ff9599), to(#ffb9d8));
  background: linear-gradient(to right, #ff9599, #ffb9d8);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
}

#dep-child {
  background-image: url("../img/dep-child.jpg");
}
#dep-child dt, #dep-child dd.job span {
  color: #ffc17d;
}
#dep-child .more {
  background: #ffc17e;
  background: -webkit-gradient(linear, left top, right top, from(#ffc17e), to(#ffd068));
  background: linear-gradient(to right, #ffc17e, #ffd068);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
}

#dep-food {
  background-image: url("../img/dep-food.jpg");
}
#dep-food dt, #dep-food dd.job span {
  color: #52b871;
}
#dep-food .more {
  background: #75cd91;
  background: -webkit-gradient(linear, left top, right top, from(#75cd91), to(#cddd64));
  background: linear-gradient(to right, #75cd91, #cddd64);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
}

#dep-english {
  background-image: url("../img/dep-english.jpg");
}
#dep-english dt, #dep-english dd.job span {
  color: #e64e4d;
}
#dep-english .more {
  background: #e54c4c;
  background: -webkit-gradient(linear, left top, right top, from(#e54c4c), to(#ff7163));
  background: linear-gradient(to right, #e54c4c, #ff7163);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
}

#dep-lifescience dt, #dep-lifescience dd.job span {
  color: #e64e4d;
}
#dep-lifescience .more {
  background: #e54c4c;
  background: -webkit-gradient(linear, left top, right top, from(#e54c4c), to(#ff7163));
  background: linear-gradient(to right, #e54c4c, #ff7163);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
}

@-webkit-keyframes rotateAnime {
  0% {
    -webkit-transform: translateY(-50%) rotateZ(0deg);
    transform: translateY(-50%) rotateZ(0deg);
  }
  100% {
    -webkit-transform: translateY(-50%) rotateZ(180deg);
    transform: translateY(-50%) rotateZ(180deg);
  }
  100% {
    -webkit-transform: translateY(-50%) rotateZ(360deg);
    transform: translateY(-50%) rotateZ(360deg);
  }
}
@keyframes rotateAnime {
  0% {
    -webkit-transform: translateY(-50%) rotateZ(0deg);
    transform: translateY(-50%) rotateZ(0deg);
  }
  100% {
    -webkit-transform: translateY(-50%) rotateZ(180deg);
    transform: translateY(-50%) rotateZ(180deg);
  }
  100% {
    -webkit-transform: translateY(-50%) rotateZ(360deg);
    transform: translateY(-50%) rotateZ(360deg);
  }
}
#area-request {
  background: url("../img/bg-request.jpg") no-repeat left top;
  background-size: cover;
  position: relative;
  overflow: hidden;
}
#area-request:before {
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  opacity: 35%;
  background: #c38d8d;
  background: -webkit-gradient(linear, left top, right top, from(#c38d8d), color-stop(#063764), to(#100f33));
  background: linear-gradient(to right, #c38d8d, #063764, #100f33);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
  background-size: 350% 350%;
  animation: gradAnimeTime 15s ease 0s infinite alternate-reverse forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
#area-request header, #area-request ul {
  z-index: 3;
}
#area-request header {
  padding: 8em 0 0;
}
@media screen and (max-width: 760px ) {
  #area-request header {
    padding: 5em 5% 0;
  }
}
#area-request header #req-document-btn a {
  display: inline-block;
  font-size: 120%;
  font-weight: bold;
  letter-spacing: 3px;
  text-decoration: underline;
  text-underline-offset: 10px;
  color: #fff;
  position: relative;
  padding: 3em 5em;
  padding-right: 1em;
}
#area-request header #req-document-btn a:hover {
  text-decoration: none;
}
#area-request header #req-document-btn a svg {
  width: 4em;
  height: 4em;
  border-radius: 100%;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) scale(1);
          transform: translateY(-50%) scale(1);
  left: 0;
  -webkit-animation: rotateAnime 3s ease 0s infinite normal forwards;
          animation: rotateAnime 3s ease 0s infinite normal forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
#area-request header #req-document-btn a:before {
  display: inline-block;
  content: "";
  width: 1em;
  height: 1em;
  background: url("../img/icon-arrow.png") no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) scale(1);
          transform: translateY(-50%) scale(1);
  left: 1.5em;
}
#area-request ul {
  margin-right: 0;
  width: 75%;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
          align-items: stretch;
  -ms-flex-pack: start;
  -webkit-box-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
}
#area-request ul li {
  width: 50%;
  background: #fff;
}
#area-request ul li a {
  display: block;
  padding: 1.5em 3% 1em;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
}
#area-request ul li a span.inq-sub {
  display: block;
}
#area-request ul li a span.inq-text {
  display: block;
  font-size: 130%;
  padding: 5px 0;
}
#area-request ul li a span.inq-text.enFont {
  font-size: 200%;
  letter-spacing: 1px;
  padding: 10px 0;
}
#area-request ul li a:hover .inq-sub {
  letter-spacing: 2px;
}
@media screen and (max-width: 760px ) {
  #area-request ul {
    width: 100%;
  }
  #area-request ul li {
    width: 100%;
  }
}
#area-request ul li#req-tel {
  background: url("../img/bg-square.gif") repeat left top;
}
#area-request ul li#req-form {
  background: #53a4ef;
  background: -webkit-gradient(linear, left top, right top, from(#53a4ef), to(#58cae2));
  background: linear-gradient(to right, #53a4ef, #58cae2);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=quote($statCol), endColorstr=quote($endCol),GradientType=1 );
}
#area-request ul li#req-form a {
  color: #fff;
}