@charset 'UTF-8';

.kn-ttl.-h2 {
  font-size: .34rem;
  font-weight: 400;
  line-height: 1.28824;
  margin: 0 auto 30px;
  padding: 0;
  text-align: center;
  border: none;
}

.kn-ttl.-h2>.kn-link {
  color: #547bdb;
}

.kn-ttl.-h2>.kn-link.-forward {
  margin: 0 0 .25em 20px;
  padding-right: 44px;
}

.kn-ttl.-h2>.kn-link.-forward:before {
  z-index: 1;
  top: 0;
  right: 10px;
  bottom: 0;
  left: auto;
  border-color: #fff;
}

.kn-ttl.-h2>.kn-link.-forward:after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  display: inline-block;
  width: 24px;
  height: 24px;
  margin: auto;
  content: '';
  border-radius: 50%;
  background: #547bdb;
}

.kn-section .kn-btn>b {
  padding: 0 25px;
}

.kn-section.-main,.kn-section.-learning,.kn-section.-pickup {
  background: #f3f6ff;
}

.kn-section.-main {
  padding: 30px 0 20px;
}

@-webkit-keyframes top-fadein {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes top-fadein {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.kn-slider-container.-main img {
  width: 100%;
  height: auto;
}

.kn-slider-container.-main .swiper-pagination-bullet {
  z-index: 1;
  width: 10px;
  height: 10px;
  opacity: 1;
  background: #d5e0fb;
  box-shadow: 0 0 1px 1px #fff;
}

.kn-slider-container.-main .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #547bdb;
}

.kn-section.-univ .kn-ttl.-h3 {
  font-size: .22rem;
  font-weight: 400;
  line-height: 1.44545;
  margin: 10px 0 20px;
  padding: 0;
  text-align: center;
  color: #547bdb;
  border: none;
}

.kn-section.-univ .kn-d-list.-univ.-hotuviv {
  margin: 0;
}

.kn-univ-search-form {
  width: calc(100%/3*2);
  margin: auto;
}

.kn-univ-search-form .kn-university-search {
  margin-bottom: 20px;
}

.kn-univ-search-form .kn-university-search>.input>.kn-textbox {
  font-size: .16rem;
  height: 54px;
}

.kn-univ-search-pref {
  position: relative;
}

.kn-univ-search-pref>.map {
  position: relative;
  overflow: hidden;
  width: 250px;
  height: 210px;
  margin: auto;
  background: url(/images/img_campas_search_bg.png) left top no-repeat;
}

.kn-univ-search-pref>.map:before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  content: '';
  transition: opacity 300ms ease;
  opacity: 0;
  background: url(/images/img_campas_search_on.png) -100% top no-repeat;
}

.kn-univ-search-pref>.map>img {
  position: relative;
}

.kn-univ-search-pref[data-active-area=hokkaido-tohoku]>.map:before {
  opacity: 1;
}

.kn-univ-search-pref[data-active-area=kanto-koshinetsu]>.map:before {
  opacity: 1;
  background-position: left -210px;
}

.kn-univ-search-pref[data-active-area=hokuriku-tokai]>.map:before {
  opacity: 1;
  background-position: left -420px;
}

.kn-univ-search-pref[data-active-area=kinki]>.map:before {
  opacity: 1;
  background-position: left -630px;
}

.kn-univ-search-pref[data-active-area=chugoku-shikoku]>.map:before {
  opacity: 1;
  background-position: left -840px;
}

.kn-univ-search-pref[data-active-area=kyushu-okinawa]>.map:before {
  opacity: 1;
  background-position: left -1050px;
}

.kn-univ-search-pref>.areas>li>.area:hover {
  text-decoration: none;
  opacity: .9;
}

@-webkit-keyframes area-fadein {
  0% {
    width: 90px;
    height: 90px;
    opacity: 0;
  }

  100% {
    width: 90px;
    height: 90px;
    opacity: 1;
  }
}

@keyframes area-fadein {
  0% {
    width: 90px;
    height: 90px;
    opacity: 0;
  }

  100% {
    width: 90px;
    height: 90px;
    opacity: 1;
  }
}

.kn-section.-news .kn-scroll-block.-scroll-y {
  height: 220px;
}

.kn-slider-container.-ticker {
  position: relative;
  margin: 0 0 30px;
  border-radius: 24px;
  background: #f7f7f4;
}

.kn-slider-container.-ticker:before,.kn-slider-container.-ticker:after {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  display: block;
  width: 40px;
  content: '';
  background: inherit;
}

.kn-slider-container.-ticker:before {
  left: 0;
}

.kn-slider-container.-ticker:after {
  right: 0;
}

.kn-slider-container.-ticker>.slider-wrapper>.slider-item>a {
  line-height: 1.3;
  display: block;
  padding: 15px 40px;
  text-align: center;
  color: #333;
}

.kn-slider-container.-ticker>.slider-wrapper>.slider-item>a:hover {
  text-decoration: none;
}

.kn-slider-container.-ticker .prev,.kn-slider-container.-ticker .next {
  position: absolute;
  z-index: 3;
  top: 0;
  bottom: 0;
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: auto;
  cursor: pointer;
}

.kn-slider-container.-ticker .prev {
  left: 20px;
}

.kn-slider-container.-ticker .prev:before {
  position: absolute;
  top: 0;
  top: 1px;
  bottom: 0;
  left: 5px;
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: auto;
  content: '';
  -webkit-transform: rotate(225deg);
          transform: rotate(225deg);
  vertical-align: middle;
  border-top: 1px solid #0072ba;
  border-right: 1px solid #0072ba;
  border-bottom-color: transparent!important;
  border-left-color: transparent!important;
}

.kn-slider-container.-ticker .next {
  right: 20px;
}

.kn-slider-container.-ticker .next:before {
  position: absolute;
  top: 0;
  top: 1px;
  bottom: 0;
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: auto;
  content: '';
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  vertical-align: middle;
  border-top: 1px solid #0072ba;
  border-right: 1px solid #0072ba;
  border-bottom-color: transparent!important;
  border-left-color: transparent!important;
}

@media print,screen and (min-width:768px) {
  .kn-section:before {
    min-width: 1060px;
  }

  .kn-section.-main>.container {
    overflow: hidden;
/*    min-height: 329px;*/
    -webkit-animation: top-fadein 1000ms ease forwards;
            animation: top-fadein 1000ms ease forwards;
    opacity: 0;
  }

  .kn-slider-container.-main {
    width: 776px;
  }

  .kn-section.-exam {
    padding: 80px 0 100px;
  }

/*
  .kn-section.-exam:before {
    background: url(/images/bg_exam.jpg) center bottom repeat-x;
    background-color: inherit;
  }
*/

  .kn-section.-univ {
    padding: 60px 0 190px;
  }

  .kn-section.-univ:before {
    background: url(/images/bg_exam.jpg) center bottom repeat-x;
    background-color: inherit;
  }

  .kn-section.-univ .kn-d-list.-univ.-hotuviv {
    padding: 0;
  }

  .kn-section.-univ .kn-d-list.-univ.-hotuviv>.contents {
    margin: 0;
  }

  .kn-univ-search-form {
    padding-top: 40px;
  }

  .kn-univ-search-pref>.areas>li>.area {
    font-weight: 700;
    position: absolute;
    right: 0;
    left: 0;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 0;
    height: 0;
    margin: auto;
    padding-top: .1em;
    transition: opacity 300ms 50ms ease;
    opacity: 0;
    color: #547bdb;
    border: 3px solid #547bdb;
    border-radius: 50%;
    background: #fff;

    -ms-flex-align: center;
    align-items: center;
  }

  .kn-univ-search-pref>.areas>li>.area>b {
    line-height: 1.3;
    position: relative;
    padding-left: 24px;
  }

  .kn-univ-search-pref>.areas>li>.area>b:before {
    position: absolute;
    top: 0;
    top: 5px;
    bottom: 0;
    bottom: auto;
    left: 10px;
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: auto;
    content: '';
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    vertical-align: middle;
    border-top: 2px solid #547bdb;
    border-top-color: inherit;
    border-right: 2px solid #547bdb;
    border-right-color: inherit;
    border-bottom-color: transparent!important;
    border-left-color: transparent!important;
  }

  .kn-univ-search-pref>.areas>li>.area.-hokkaido-tohoku {
    top: 15px;
    right: -350px;
    color: #57aee5;
    border-color: #57aee5;
  }

  .kn-univ-search-pref>.areas>li>.area.-kanto-koshinetsu {
    right: -320px;
    bottom: 10px;
    color: #42d4bb;
    border-color: #42d4bb;
  }

  .kn-univ-search-pref>.areas>li>.area.-hokuriku-tokai {
    top: 30px;
    color: #6bdf7f;
    border-color: #6bdf7f;
  }

  .kn-univ-search-pref>.areas>li>.area.-kinki {
    top: 40px;
    left: -100px;
    color: #55c6d7;
    border-color: #55c6d7;
  }

  .kn-univ-search-pref>.areas>li>.area.-chugoku-shikoku {
    top: 40px;
    left: -120px;
    color: #809bdf;
    border-color: #809bdf;
  }

  .kn-univ-search-pref>.areas>li>.area.-kyushu-okinawa {
    top: 60px;
    left: -300px;
    color: #a88beb;
    border-color: #a88beb;
  }

  .kn-univ-search-pref[data-active-area=hokkaido-tohoku]>.areas>li>.area.-hokkaido-tohoku,.kn-univ-search-pref[data-active-area=kanto-koshinetsu]>.areas>li>.area.-kanto-koshinetsu,.kn-univ-search-pref[data-active-area=hokuriku-tokai]>.areas>li>.area.-hokuriku-tokai,.kn-univ-search-pref[data-active-area=kinki]>.areas>li>.area.-kinki,.kn-univ-search-pref[data-active-area=chugoku-shikoku]>.areas>li>.area.-chugoku-shikoku,.kn-univ-search-pref[data-active-area=kyushu-okinawa]>.areas>li>.area.-kyushu-okinawa {
    -webkit-animation: area-fadein ease 600ms 50ms forwards;
            animation: area-fadein ease 600ms 50ms forwards;
  }

  .kn-section.-toku {
    padding: 100px 0;
  }

  .kn-section.-toku .kn-txt.-voice {
    font-size: .18rem;
    line-height: 1.54444;
    margin-bottom: 30px;
    text-align: center;
  }

  .kn-section.-news {
    padding: 100px 0 50px;
  }
}

@media screen and (max-width:767px) {
  .kn-main-container>.column.-main {
    padding: 0;
  }

  .kn-ttl.-h2 {
    font-size: .22rem;
    line-height: 1.44545;
    margin-bottom: 20px;
  }

  .kn-ttl.-h2>.kn-link.-forward {
    padding-right: 26px;
  }

  .kn-ttl.-h2>.kn-link.-forward:before {
    right: 7px;
    width: 4px;
    height: 4px;
  }

  .kn-ttl.-h2>.kn-link.-forward:after {
    width: 16px;
    height: 16px;
  }

  .kn-section.-main {
    padding: 15px 10px;
  }

  .kn-slider-container.-main {
    height: 0;
    margin-right: -10px;
    margin-left: -10px;
    padding-top: calc(100%*248/776);
  }

  .kn-slider-container.-main>.slider-wrapper {
    position: absolute;
    top: 0;
    left: 0;
  }

  .kn-section.-exam {
    padding-bottom: 40px;
  }

/*
  .kn-section.-univ {
    padding-bottom: 40px;
  }
*/

  .kn-section.-univ .kn-ttl.-h3 {
    font-size: .18rem;
    line-height: 1.54444;
  }

  .kn-section.-univ .kn-box.-bg.-univsearch,.kn-section.-univ .kn-box.-bg.-hot {
    margin-right: -10px;
    margin-left: -10px;
  }

  .kn-univ-search-form {
    width: 75%;
  }

  .kn-univ-search-form .kn-university-search {
    margin-bottom: 15px;
  }

  .kn-univ-search-pref>.map {
    display: none;
  }

  .kn-univ-search-pref>.areas {
    display: -ms-flexbox;
    display: flex;

    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .kn-univ-search-pref>.areas>li {
    width: calc(100%/3 - 4px/3);
  }

  .kn-univ-search-pref>.areas>li:nth-child(n+4) {
    margin-top: 2px;
  }

  .kn-univ-search-pref>.areas>li>.area {
    font-size: .14rem;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    min-width: 0;
    height: 70px;
    padding: 5px;
    color: #fff;
    background: #547bdb;

    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .kn-univ-search-pref>.areas>li>.area.-hokkaido-tohoku {
    background: #57aee5;
  }

  .kn-univ-search-pref>.areas>li>.area.-kanto-koshinetsu {
    background: #42d4bb;
  }

  .kn-univ-search-pref>.areas>li>.area.-hokuriku-tokai {
    background: #6bdf7f;
  }

  .kn-univ-search-pref>.areas>li>.area.-kinki {
    background: #55c6d7;
  }

  .kn-univ-search-pref>.areas>li>.area.-chugoku-shikoku {
    background: #809bdf;
  }

  .kn-univ-search-pref>.areas>li>.area.-kyushu-okinawa {
    background: #a88beb;
  }

  .kn-section.-toku {
    padding: 40px 10px;
  }

  .kn-section.-news {
    padding: 40px 10px 0;
  }

  .kn-section.-news .kn-scroll-block.-scroll-y {
    height: 320px;
  }

  .kn-slider-container.-ticker {
    margin: 0 0 20px;
  }

  .kn-slider-container.-ticker:before,.kn-slider-container.-ticker:after {
    width: 30px;
  }

  .kn-slider-container.-ticker .prev {
    left: 10px;
  }

  .kn-slider-container.-ticker .next {
    right: 10px;
  }
}