@charset "UTF-8";
/* ==========================
    ベースカラーの設定 
=============================*/
/*トップページnavの色*/
/* ==========================
    Compass、Sass各種設定
=============================*/
/*768以上はPC表示*/
/*767以下はスマホ表示・bootstrapはsm*/
/* ====================
    Base -基本の設定-
======================*/
html {
  font-size: 13px;
}
@media screen and (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

body {
  overflow: visible;
  font-weight: 400;
  font-family: "Noto Sans Japanese", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  color: #000000;
  font-weight: 400;
}

main {
  padding-top: 65px;
}
@media screen and (min-width: 768px) {
  main {
    padding-top: 0;
  }
}

/*h2,
h3,
h4,
p,
ul,
li,
dt,
dd,
dl,
ol,
table,
span,
div {
    font-family: "Noto Sans Japanese", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
    color: #000000;
    font-weight: 400;
}*/
a {
  color: inherit;
  text-decoration: none;
  overflow: hidden;
  outline: none;
}

main a {
  color: #1476C6;
}
@media screen and (min-width: 768px) {
  main a:hover {
    text-decoration: underline;
    color: #6ab4f0;
  }
}

a:active,
a:visited,
main a:active,
main a:visited {
  text-decoration: none;
}

p {
  line-height: 2;
}

img {
  max-width: 100%;
}

.float_l {
  float: left;
}

.float_r {
  float: right;
}

.tr {
  display: table-row;
}

/*強調する文字（赤文字）*/
.emphasis {
  color: red;
}
.td_center{
    text-align: center;
    padding-bottom: 5px;
    padding-top: 5px;
}

/* ===========================
    Layout -配置(box)の設定-
=============================*/
.slider-box {
  background: #f5f5f5;
}

@media screen and (min-width: 768px) {
  .bx_container {
    width: 1200px;
    margin: auto;
  }
}

.inside-box {
  padding: 0 10px;
}
@media screen and (min-width: 768px) {
  .inside-box {
    width: 1080px;
    padding: 0;
    margin: auto;
  }
}

.inside-box2-1 {
  padding: 0 10px;
    width: 100%;
}
@media screen and (min-width: 768px) {
  .inside-box {
    width: 1080px;
    padding: 0;
    margin: auto;
  }
}

.top_info-box {
  margin: 30px 0 40px;
}
@media screen and (min-width: 768px) {
  .top_info-box {
    margin: 50px  0;
  }
}

.top_pickup-box {
  background: url(../img/common/sky_bg2560.jpg) #CCEAF7 no-repeat center 30px;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .top_pickup-box {
    background: url(../img/common/sky_bg2560.jpg) #CCEAF7 no-repeat center 60px;
  }
}

.top_ad-box {
  padding: 20px 0 30px;
  background: #FFF4F5;
}
@media screen and (min-width: 768px) {
  .top_ad-box {
    padding: 50px 0  60px;
  }
}

/* hoverで明るくなる画像に敷くdivの設定*/
.link-img_bg {
  background-color: #fff;
}

/* ==============================
    Module -見た目の設定- 
================================*/
.font_bold {
  font-weight: 700;
}

/* お知らせ（what's New）の設定*/
@media screen and (min-width: 768px) {
  .top_info-box div div {
    float: left;
  }
}

.whatsnew {
  width: 136px;
  margin: auto;
  height: 20px;
  line-height: 20px;
  background: url(../img/index/whatsnew.png) no-repeat 0 0;
  background-size: 20px;
  vertical-align: middle;
  font-size: 20px;
  padding-left: 25px;
  margin-bottom: 1rem;
}
@media screen and (min-width: 768px) {
  .whatsnew {
    background-size: 35px;
    height: 35px;
    line-height: 35px;
    font-size: 22px;
    padding-left: 40px;
    width: auto;
  }
}

.info-list {
  list-style-type: none;
}
@media screen and (min-width: 768px) {
  .info-list {
    padding-top: 5px;
  }
}

.info-list li {
  margin-bottom: 1rem;
  display: inline-block;
  position: relative;
}

.info-category {
  display: inline-block;
  width: 105px;
  padding: 2px;
  text-align: center;
  font-size: 11px;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .info-category {
    position: absolute;
    top: 0;
    padding: 5px;
    left: 30px;
    width: 120px;
    font-size: 12px;
    display: inline-block;
  }
}

.info-day {
  font-size: 12px;
  padding-left: 2px;
}
@media screen and (min-width: 768px) {
  .info-day {
    padding-left: 0;
    font-size: 1rem;
    position: absolute;
    display: inline-block;
    top: 0;
    left: 170px;
    width: 100px;
  }
}

.info-txt {
  display: block;
  margin: 5px 0 0;
}
@media screen and (min-width: 768px) {
  .info-txt {
    margin: 0 0 0 280px;
    width: 490px;
    display: inline-block;
  }
}

/*　カテゴリごとの色分け設定　*/
.info-event {
  background-color: #46BCC6;
}

.info-school {
  background-color: #0C497C;
}

.info-admission {
  background-color: #F0626C;
}

.info-other {
  background-color: #1E9ACA;
}
.info-meeting {
  background-color: #EDB60E;
}
.info-support {
  background-color: #F25828;
}

/*「一覧を見る」ボタン*/
.info-btn {
  border: 1px solid #1476C6;
  color: #1476C6;
  width: 140px;
  text-align: center;
  line-height: 30px;
  margin: 0.5rem  auto 0;
}
.info-btn a {
  display: block;
  transition: background-color 0.3s,border 0.3s;
}
@media screen and (min-width: 768px) {
  .info-btn {
    margin-top: 0;
    line-height: 40px;
  }
  .info-btn a:hover {
    background-color: #e2f3fa;
    text-decoration: none;
  }
  .info-btn:hover {
    border: 1px solid #6ab4f0;
  }
}

/* Pickupの設定　*/
.pickup {
  position: relative;
  height: 30px;
  line-height: 30px;
  background: #0C497C;
  font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HG明朝B", "MS Mincho", serif;
  color: #fff;
  font-size: 1rem;
  font-weight: 400;
  text-align: center;
  z-index: 2;
}
@media screen and (min-width: 768px) {
  .pickup {
    height: 60px;
    line-height: 60px;
    font-size: 22px;
  }
}
.pickup:before {
  content: "";
  display: block;
  height: 60px;
  width: 60px;
  margin: auto;
  border-radius: 50%;
  background: #0C497C;
  left: 41%;
  left: -webkit-calc(50% - 30px);
  left: calc(50% - 30px);
  top: -15px;
  z-index: -1;
  position: absolute;
}
@media screen and (min-width: 768px) {
  .pickup:before {
    height: 120px;
    width: 120px;
    left: -webkit-calc(50% - 60px);
    left: calc(50% - 60px);
    top: -30px;
  }
}

.pickup-title {
  margin-top: 25px;
  margin-bottom: 10px;
  text-align: center;
  font-weight: 200;
  font-size: 22px;
  /*青文字*/
}
.pickup-title span {
  color: #0C497C;
  font-weight: 200;
}
@media screen and (min-width: 768px) {
  .pickup-title {
    margin-top: 60px;
    margin-bottom: 20px;
    font-size: 40px;
  }
}

.pickup-txt {
  padding: 0 10px;
  text-align: center;
}

/*Pickupのナビゲーションを包むcontainer*/
.pickup-nav {
  margin-top: 20px;
  padding-bottom: 20px;
  /* padding-bottom 30px - pickup-itemのmargin-bottom 10px = 20px */
}
@media screen and (min-width: 768px) {
  .pickup-nav {
    padding-bottom: 62px;
    /* padding-bottom 80px - pickup-itemのmargin-bottom 18px = 62px */
  }
}

/* Pickupナビゲーションのカラム */
div[class*="pickup-item"] {
  transition: 0.3s;
  backface-visibility: hidden;
  margin-bottom: 10px;
}
div[class*="pickup-item"] img {
  backface-visibility: hidden;
}
@media screen and (min-width: 768px) {
  div[class*="pickup-item"] {
    margin-bottom: 18px;
  }
  div[class*="pickup-item"] img, div[class*="pickup-item"] div {
    transition: 0.3s;
  }
  div[class*="pickup-item"] a:hover {
    text-decoration: none;
  }
  div[class*="pickup-item"] a:hover img {
    opacity: 0.8;
  }
}

/* Pickupのナビゲーションの色*/
.pickup-item1 {
  /*(iPhone5)カラムの高さを揃えたときの背景色*/
  /*オンマウスは10％明るくなる*/
}
@media screen and (max-width: 768px) {
  .pickup-item1 {
    background-color: #239ac3;
    background-clip: content-box;
  }
}
.pickup-item1 .point,
.pickup-item1 .point-txt {
  background-color: #239ac3;
}
.pickup-item1:hover .point, .pickup-item1:hover .point-txt {
  background-color: #3db3dc;
}

.pickup-item2 {
  /*(iPhone5)カラムの高さを揃えたときの背景色*/
  /*10%だと明るすぎるので7％*/
}
@media screen and (max-width: 768px) {
  .pickup-item2 {
    background-color: #009944;
    background-clip: content-box;
  }
}
.pickup-item2 .point,
.pickup-item2 .point-txt {
  background-color: #009944;
}
.pickup-item2:hover .point, .pickup-item2:hover .point-txt {
  background-color: #00bd54;
}

.pickup-item3 {
  /*(iPhone5)カラムの高さを揃えたときの背景色*/
  /*10%だと明るすぎるので5％*/
}
@media screen and (max-width: 768px) {
  .pickup-item3 {
    background-color: #FF7D87;
    background-clip: content-box;
  }
}
.pickup-item3 .point,
.pickup-item3 .point-txt {
  background-color: #FF7D87;
}
.pickup-item3:hover .point, .pickup-item3:hover .point-txt {
  background-color: #ff979f;
}

.pickup-item4 {
  /*(iPhone5)カラムの高さを揃えたときの背景色*/
  /*オンマウスは10％明るくなる*/
}
@media screen and (max-width: 768px) {
  .pickup-item4 {
    background-color: #F18D00;
    background-clip: content-box;
  }
}
.pickup-item4 .point,
.pickup-item4 .point-txt {
  background-color: #F18D00;
}
.pickup-item4:hover .point, .pickup-item4:hover .point-txt {
  background-color: #ffa525;
}

.pickup-item5 {
  /*(iPhone5)カラムの高さを揃えたときの背景色*/
  /*10%だと明るすぎるので5％*/
}
@media screen and (max-width: 768px) {
  .pickup-item5 {
    background-color: #825AA5;
    background-clip: content-box;
  }
}
.pickup-item5 .point,
.pickup-item5 .point-txt {
  background-color: #825AA5;
}
.pickup-item5:hover .point, .pickup-item5:hover .point-txt {
  background-color: #8f6bae;
}

.pickup-item6 {
  /*(iPhone5)カラムの高さを揃えたときの背景色*/
  /*オンマウスは10％明るくなる*/
}
@media screen and (max-width: 768px) {
  .pickup-item6 {
    background-color: #46BCC6;
    background-clip: content-box;
  }
}
.pickup-item6 .point,
.pickup-item6 .point-txt {
  background-color: #46BCC6;
}
.pickup-item6:hover .point, .pickup-item6:hover .point-txt {
  background-color: #6dcad2;
}

.point {
  font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HG明朝B", "MS Mincho", serif;
  color: #fff;
  border-radius: 40px 40px 0 0;
  width: 80px;
  height: 40px;
  line-height: 45px;
  position: relative;
  text-align: center;
  display: block;
  margin: auto;
  margin-top: -30px;
  font-size: 10px;
  text-align: center;
}
.point span {
  font-size: 16px;
}
@media screen and (min-width: 768px) {
  .point {
    font-size: 1rem;
    border-radius: 85px 85px 0 0;
    width: 170px;
    height: 85px;
    margin-top: -70px;
    line-height: 120px;
  }
  .point span {
    font-size: 24px;
  }
}

.point-txt {
  position: relative;
  color: #fff;
  text-align: center;
  font-size: 10px;
  padding: 10px 5px;
  margin-top: -10px;
}
.point-txt p {
  font-size: 16px;
  font-weight: 200;
  margin-top: 5px;
  line-height: 1.3;
}
@media screen and (min-width: 768px) {
  .point-txt {
    font-size: 1rem;
    margin-top: -15px;
    padding: 30px 20px;
  }
  .point-txt p {
    font-size: 30px;
    margin-top: 1rem;
  }
}

/* 私立への入学をお考えの方へ　*/
.top_ad-title {
  margin-bottom: 5px;
  text-align: center;
  font-weight: 200;
  font-size: 22px;
  /*ピンクの文字*/
}
.top_ad-title span {
  color: #F0626C;
  font-weight: 200;
}
@media screen and (min-width: 768px) {
  .top_ad-title {
    font-size: 40px;
  }
}

.top_ad-txt {
  text-align: center;
}

.top_ad-nav {
  margin-top: 10px;
}
@media screen and (min-width: 768px) {
  .top_ad-nav {
    margin-top: 20px;
  }
}

.top_ad-item {
  margin-bottom: 10px;
}
.top_ad-item img,
.top_ad-item p {
  transition: 0.3s;
}
.top_ad-item a:hover {
  text-decoration: none;
}
.top_ad-item p {
  color: #fff;
  text-align: center;
  background: #F0626C;
  font-weight: 200;
  font-size: 16px;
  padding: 5px;
  line-height: 1.3;
}
.top_ad-item:hover img {
  opacity: 0.8;
}
.top_ad-item:hover p {
  background: #f49198;
}
@media screen and (min-width: 768px) {
  .top_ad-item p {
    font-size: 30px;
    padding: 10px;
  }
}

/*‥‥‥‥‥‥‥‥‥‥‥‥
    TOPへもどる
‥‥‥‥‥‥‥‥‥‥‥‥‥*/
.top_btn {
  /*display: none;*/
  position: fixed;
  bottom: 0px;
  right: 0px;
  width: 50px;
  height: 50px;
  transition: border-color 0.3s,bottom 0.1s,background-color 0.3s;
  background-color: #0C497C;
  z-index: 2;
}
.top_btn span {
  border-top: 2px solid;
  border-left: 2px solid;
  border-color: #fff;
  width: 15px;
  height: 15px;
  position: absolute;
  top: 20px;
  left: 17px;
  left: calc(50% - 7.5px);
  transition: border-color 0.3s,bottom 0.1s;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
@media screen and (min-width: 768px) {
  .top_btn {
    width: 70px;
    height: 65px;
  }
  .top_btn span {
    width: 20px;
    height: 20px;
    top: 25px;
    left: 25px;
    left: calc(50% - 10px);
  }
  .top_btn:hover {
    background-color: #1164ab;
    opacity: 1;
  }
}

/* △▼△▼△▼△▼△▼△▼△▼△▼△▼△△▼△▼△▼△▼△▼△▼△▼△▼△▼△
    サブページで使う設定
△▼△▼△▼△▼△▼△▼△▼△▼△▼△△▼△▼△▼△▼△▼△▼△▼△▼△▼△ */
/* ===============================
    サブページ：一番上のタイトル
=================================*/
.common_headline1 {
  width: 100%;
  font-weight: 400;
  font-size: 16px;
  text-align: center;
  border-bottom: 2px solid #E3E3E3;
  border-top: 2px solid #E3E3E3;
  padding-top: 12px;
  padding-bottom: 12px;
}

@media screen and (min-width: 768px) {
  .common_headline1 {
    font-size: 30px;
    border-top: 2px solid #FFF;
    padding-top: 34px;
    padding-bottom: 34px;
  }
}
/* ===========================
    サブページ：学校名一覧
=============================*/
.school_list a {
  color: #1476C6;
}
.school_list a:hover {
  text-decoration: underline;
  color: #6ab4f0;
}
.school_list ul {
  display: table;
  table-layout: fixed;
  padding: 10px;
}
@media screen and (min-width: 768px) {
  .school_list ul {
    padding: 0;
  }
}
.school_list li {
  display: inline-block;
  width: 50%;
  line-height: 1.5;
  padding-bottom: 10px;
}
@media screen and (min-width: 768px) {
  .school_list ul {
    padding-top: 0;
  }
  .school_list li {
    width: 216px;
    display: table-cell;
  }
}

.school_select {
  background: #CCEAF7;
  padding: 10px;
  text-align: center;
  color: #1476C6;
  position: relative;
}

.school_select span {
  position: absolute;
  display: inline-block;
  border-top: 1px solid;
  border-left: 1px solid;
  border-color: #1476C6;
  width: 8px;
  height: 8px;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  margin-left: 30px;
  top: 15px;
}

.school_select span.kaiten {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 18px;
}

.school_list_box {
  margin-top: 10px;
  display: none;
}
@media screen and (min-width: 768px) {
  .school_list_box {
    display: block;
    background: #CCEAF7;
    margin-top: 0;
    padding-top: 20px;
    padding-bottom: 10px;
  }
}

/*　青い帯の見出し　*/
.detail_headline {
  margin: 0 -10px;
  background-color: #0C497C;
  font-size: 16px;
  color: #FFF;
  padding: 7px 10px;
  line-height: 1.4;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .detail_headline {
    padding: 0;
    padding-left: 20px;
    margin: 0;
    font-size: 24px;
    height: 50px;
    line-height: 50px;
  }
}

/*　黒い文字の見出し　*/
.detail_headline_small {
  font-size: 18px;
  font-weight: 400;
  margin: 1rem 0;
}
@media screen and (min-width: 768px) {
  .detail_headline_small {
    font-size: 30px;
  }
}
/*　黒い文字の見出し（清和）　*/
.detail_headline_small2 {
  font-size: 16px;
  font-weight: 400;
  margin: 1rem 0;
}
@media screen and (min-width: 768px) {
  .detail_headline_small2 {
    font-size: 28px;
  }
}
/*　黒い文字の見出し（清和）　*/
.detail_headline_small3 {
  font-size: 16px;
  font-weight: 400;
  margin: 1rem 0;
}
@media screen and (min-width: 768px) {
  .detail_headline_small3 {
    font-size: 26px;
  }
}

/*右サブメニュー*/
.sub_menu_line {
  background-color: #1476C6;
  height: 3px;
  width: 100%;
  margin-bottom: 2px;
  margin-top: 25px;
}

@media screen and (min-width: 768px) {
  .sub_menu_line {
    background-color: #1476C6;
    height: 5px;
    width: 100%;
    margin-bottom: 2px;
    margin-top: 0px;
  }
}
.sub_menu_box ul li {
  list-style: none;
  height: 40px;
  line-height: 40px;
  background: #1476C6;
  display: block;
  margin-bottom: 2px;
  color: #FFF;
}
.sub_menu_box ul li .box_l {
  float: left;
  padding-left: 20px;
}
.sub_menu_box ul li .box_r {
  float: right;
  padding-right: 15px;
}
.sub_menu_box ul li a {
  background-color: #CCEAF7;
  display: block;
  margin-bottom: 2px;
  transition: 0.3s;
}
.sub_menu_box ul li a:hover {
  background-color: #DAEFFA;
}

@media screen and (min-width: 768px) {
  .sub_menu_box ul li {
    height: 70px;
    line-height: 70px;
    font-size: 16px;
  }
}
/*‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥
    ボタンの設定
‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥*/
.return_btn {
  position: relative;
  background: #1476C6;
  padding: 10px 20px;
  margin: 30px auto 0;
  width: 200px;
  height: 40px;
  line-height: 40px;
  text-align: center;
}
.return_btn a {
  color: #fff;
  transition: background 0.3s;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
@media screen and (min-width: 768px) {
  .return_btn {
    font-size: 20px;
    margin: 60px auto 0;
    width: 300px;
    height: 50px;
    line-height: 50px;
  }
  .return_btn a:hover {
    background: #3b9ceb;
    color: #fff;
    text-decoration: none;
  }
}

/* =======================================
    State -jsなどで切り替わる見た目の設定-
==========================================*/
.fixed {
  position: fixed;
  z-index: 9999;
}

/*‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥
    ヘッダー(nav)固定の設定
‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥*/
.js_hide {
  visibility: hidden;
  opacity: 0.01;
  height: 1px;
}

.js_fixed {
  position: fixed;
  width: 100%;
  height: 100%;
}

.js_fixnav {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 9999;
  /*ヘッダー固定時は、.menuが95％に薄くなる*/
}
.js_fixnav .menu {
  background: rgba(12, 73, 124, 0.95);
}

main.js_fixnav {
  padding-top: 80px;
}

.js_nav_width {
  width: 100%;
  /*    @include min-screen($breakpoint-pc) {
          width: 900px;
      }*/
}

@media screen and (min-width: 768px) {
  .js_opa1 {
    opacity: 1;
  }
}

@media screen and (min-width: 768px) {
  .js_opa0 {
    opacity: 0;
  }
}

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


/*2017/10/19追加*/
.urgent {
    width: 100%;
    margin-top: 20px;
    padding: 1rem;
    font-size: 15px;
    line-height: 150%;
    color: #F00;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
@media screen and (min-width: 768px) {
.urgent {
    width: 808px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 35px;
    padding: 1rem;
    font-size: 18px;
    line-height: 150%;
    color: #F00;
}
}
.urgent_t {
    font-size: 18px;
    line-height: 150%;
    color: #F00;
    text-align: center;
    font-weight: 700;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 1rem;
}
@media screen and (min-width: 768px) {
.urgent_t {
    font-size: 24px;
    line-height: 150%;
    color: #F00;
    margin-bottom: 1rem;
}
}

/*2018/7/27追加*/
.urgent-t {
    width: 100%;
    margin-top: 20px;
    padding: 1rem;
    font-size: 15px;
    line-height: 150%;
    border: 4px #F00 solid;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
@media screen and (min-width: 768px) {
.urgent-t {
    width: 808px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 35px;
    padding: 1rem;
    font-size: 18px;
    line-height: 150%;
}
    }
.urgent-tt {
    font-size: 15px;
    line-height: 150%;
    color: #F00;
}
@media screen and (min-width: 768px) {
.urgent-tt {
    font-size: 18px;
    color: #F00;
}}
/*2018/9/27追加*/
.top_adoption-box {
  margin: 30px 0 50px;
  padding: 0 10px;
}
@media screen and (min-width: 768px) {
  .top_adoption-box {
    margin: 50px  0;
  }
}
.adoption-box {
    width: 100%;
    text-align: center;
    background-color: #09715A;
    margin-bottom: 35px;
    font-size: 20px;
    }
@media screen and (min-width: 768px) {
.adoption-box {
    width: 1070px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 70px;
    font-size: 30px;
    }}

.adoption-box a {
    display: block;
    padding-top: 0.7em;
    padding-bottom: 0.7em;
    color: #FFF;
    transition: 0.3s;
}

.adoption-box a:hover {
    color: #FFF;
    background-color: #3A8D7B;
    text-decoration: none;
}

.adoption-box2 {
    width: 100%;
    text-align: center;
    margin-bottom: 35px;
    font-size: 28px;
    background-image: url(../img/index/guidebook25-sp.jpg);
    background-size: 100%;
    }
@media screen and (min-width: 768px) {
.adoption-box2 {
    width: 1070px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 70px;
    font-size: 30px;
    background-image: url(../img/index/guidebook25-pc.jpg);
    }}

.adoption-box2 a {
    display: block;
    padding-top: 0.7em;
    padding-bottom: 0.7em;
    transition: 0.3s;
}

.adoption-box2 a:hover {
    text-decoration: none;
}

/*スマホ用調整クラス*/
@media screen and (max-width: 768px) { 
  .sp-none { display: none; }
  .u-mt0-sp { margin-top: 0; }
  .u-mt5-sp { margin-top: 5px; }
  .u-mt10-sp { margin-top: 10px; }
  .u-mt15-sp { margin-top: 15px; }
  .u-mt16-sp { margin-top: 15px; }
  .u-mt20-sp { margin-top: 20px !important; }
  .u-mt16-sp { margin-top: 16px; }
  .u-mt25-sp { margin-top: 25px; }
  .u-mt30-sp { margin-top: 30px !important; }
  .u-mt40-sp { margin-top: 40px; }
  .u-mt45-sp { margin-top: 45px; }
  .u-mt50-sp { margin-top: 50px; }
  .u-mt60-sp { margin-top: 60px; }
  .u-mt-8-sp { margin-top: -8px; }
  .u-mt-10-sp { margin-top: -10px; }
  .u-mt-40-sp { margin-top: -40px; }
  .u-mb0-sp { margin-bottom: 0; }
  .u-mb10-sp { margin-bottom: 10px; }
  .u-mb15-sp { margin-bottom: 15px; }
  .u-mb16-sp { margin-bottom: 16px; }
  .u-mb20-sp { margin-bottom: 20px; }
  .u-mb30-sp { margin-bottom: 30px !important;; }
  .u-mb40-sp { margin-bottom: 40px; }
  .u-mb50-sp { margin-bottom: 50px; }
  .u-mb-10-sp { margin-bottom: -10px; }
  .u-mb-30-sp { margin-bottom: -30px; }
  .u-mb-16-sp { margin-bottom: -16px; }
  .u-ml10-sp { margin-left: 10px !important; }
  .u-ml15-sp { margin-left: 15px !important; }
  .u-pt0-sp { padding-top: 0; }
  .u-pt5-sp { padding-top: 5px; }
  .u-pt10-sp { padding-top: 10px; }
  .u-pt16-sp { padding-top: 16px; }
  .u-pt20-sp { padding-top: 20px; }
  .u-pt30-sp { padding-top: 30px; }
  .u-pt40-sp { padding-top: 40px; }
  .u-pb0-sp { padding-bottom: 0; }
  .u-pb5-sp { padding-bottom: 5px; }
  .u-pb10-sp { padding-bottom: 10px; }
  .u-pb16-sp { padding-bottom: 16px; }
  .u-pb20-sp { padding-bottom: 20px; }
  .u-pb30-sp { padding-bottom: 30px; }
  .u-pb40-sp { padding-bottom: 40px; }
  .u-pb50-sp { padding-bottom: 50px; }
  .u-pb85-sp { padding-bottom: 85px; }
  .u-pb0-sp { padding-bottom: 0; }
  .u-pb-30-sp { padding-bottom: 0px; }
  .u-txt-s { font-size: 0.9em; } }

/*PC用調整クラス*/
@media screen and (min-width: 768px) {
  .pc-none { display: none; }
  .u-mt0 { margin-top: 0; }
  .u-mt5 { margin-top: 5px; }
  .u-mt10 { margin-top: 10px; }
  .u-mt15 { margin-top: 15px; }
  .u-mt16 { margin-top: 16px; }
  .u-mt20 { margin-top: 20px !important; }
  .u-mt25 { margin-top: 25px; }
  .u-mt30 { margin-top: 30px; }
  .u-mt40 { margin-top: 40px !important; }
  .u-mt45 { margin-top: 45px; }
  .u-mt50 { margin-top: 50px; }
  .u-mt60 { margin-top: 60px; }
  .u-mt70 { margin-top: 70px; }
  .u-mt80 { margin-top: 80px; }
  .u-mt90 { margin-top: 90px; }
  .u-mt100 { margin-top: 100px; }
  .u-mt110 { margin-top: 110px; }
  .u-mt120 { margin-top: 120px; }
  .u-mt-10 { margin-top: -10px; }
  .u-mt-20 { margin-top: -20px; }
  .u-mt-40 { margin-top: -40px; }
  .u-m-1em { margin: -1em; }
  .u-mb0 { margin-bottom: 0; }
  .u-mb10 { margin-bottom: 10px; }
  .u-mb15 { margin-bottom: 15px; }
  .u-mb16 { margin-bottom: 16px; }
  .u-mb20 { margin-bottom: 20px; }
  .u-mb30 { margin-bottom: 30px; }
  .u-mb40 { margin-bottom: 40px; }
  .u-mb50 { margin-bottom: 50px; }
  .u-mb60 { margin-bottom: 60px !important; }
  .u-mb70 { margin-bottom: 70px; }
  .u-mb80 { margin-bottom: 80px !important; }
  .u-mb90 { margin-bottom: 90px; }
  .u-mb100 { margin-bottom: 100px; }
  .u-mb-10 { margin-bottom: -10px; }
  .u-mb-20 { margin-bottom: -20px; }
  .u-mb-50 { margin-bottom: -50px; }
  .u-mtb50 { margin-top: 50px; margin-bottom: 50px; }
  .u-tdp16 td, .u-tdp16 th { padding: 16px !important; }
  .u-ptb0 { padding-top: 0px; padding-bottom: 0px; }
  .u-pt5 { padding-top: 5px; }
  .u-pt10 { padding-top: 10px; }
  .u-pt16 { padding-top: 16px; }
  .u-pt20 { padding-top: 20px; }
  .u-pt30 { padding-top: 30px; }
  .u-pt40 { padding-top: 40px; }
  .u-pt50 { padding-top: 50px; }
  .u-pt70 { padding-top: 70px; }
  .u-pt80 { padding-top: 80px; }
  .u-pb0 { padding-bottom: 0; }
  .u-pb10 { padding-bottom: 10px; }
  .u-pb20 { padding-bottom: 20px; }
  .u-pb30 { padding-bottom: 30px; }
  .u-pb40 { padding-bottom: 30px; }
  .u-pb50 { padding-bottom: 50px; }
  .u-pb60 { padding-bottom: 60px; }
  .u-pb70 { padding-bottom: 70px; }
  .u-pb80 { padding-bottom: 80px; }
  .u-pb90 { padding-bottom: 90px; }
  .u-pb100 { padding-bottom: 100px; }
  .u-pb130 { padding-bottom: 130px; }
  .u-pb200 { padding-bottom: 200px; }
  .u-ptb50 { padding-top: 50px; padding-bottom: 50px; }
  .u-mb-30 { margin-bottom: -30px; }
  .u-pr32 { padding-right: 32px; }
  .u-pr200 { padding-right: 200px; }
  .u-pr115 { padding-right: 115px; }
  .u-w400 { width: 400px; }
  .u-w450 { width: 450px; }
  .u-table-short { width: 400px; } }