@charset "utf-8";

.top_visual_wrap { width:100%; position:relative; margin-top:-27px; background: url("/img/spot/bg_sky.jpg") top center / cover no-repeat;  }
.top_visual .contents { padding:80px 0 30px 0; }
.top_bg { width:100%; }
@media (min-width:768px) {
  .top_visual_wrap { margin-top:50px; }
}
@media (min-width:1300px) {
    .top_visual .contents { padding:80px 0; }
    .top_visual_wrap { background: url("/img/spot/bg_sky_pc.jpg")  top center / cover no-repeat; margin-top:0; }
}

.top_visual .h1_wrap { width:100%;  height:100px; margin-bottom:40px; text-align:center; background-image: url("/img/spot/ribbon.png");background-repeat: no-repeat;background-position: center center; background-size: 100% auto;         }
.top_visual .h1_wrap strong { width:100%; font-size:46px; letter-spacing:0.15em; text-align:center; }
.top_visual .h1_wrap h1 { width:100%; font-size:16px; text-align:center; letter-spacing:0.1em; color:#FC5942; }
.kensaku-form { height:40px; border:1px solid #ccc; display:flex; padding:0 2.5%; border-radius:5px; align-items: center;}
.kensaku-form .INPUT { width:100%; }
.kensaku-form img { margin-left:-25px;}
.top_visual .illust_nanmaru_pc_wrap { display:none; }
@media (min-width:415px) and (max-width:767px) {
  .top_visual .h1_wrap { height:150px;}

}
@media (min-width:768px) {
    .top_visual { margin-top:0; }
    .top_visual .h1_wrap { margin-top:100px; }
    .top_visual p { width:100%; text-align:left; line-height:35px; margin-top:50px; }

}

@media (min-width:768px) and (max-width:1299px) {
  .top_visual .h1_wrap { width:500px;  height:150px; margin:0px auto 0 auto; text-align:center; background-image: url("/img/spot/ribbon.png");}
  .top_visual .h1_wrap strong { margin-top:30px; }
  .top_bg_wrap .top_visual .contents { width:100%; background:none; border:0; display:block; }
  .top_bg_wrap .top_visual .contents .pc { display:none; }
  .top_bg_wrap .top_visual .contents p { text-align:center; }
  .top_visual p { margin-top:0; }

}


@media (min-width:1300px) {
    .top_visual { position:relative; padding:100px 0 0 0;}
    .top_bg_wrap .top_visual .contents { position:absolute; left:0; bottom:25%; width:50%; background:none; border:0; display:block; }
    .top_bg_wrap .top_visual .contents .pc { display:inline-block; }
    .top_bg_wrap .top_visual .contents p { text-align:left; }
    .top_visual .h1_wrap{ margin:50px 0 0 -100px; }
    .top_visual .h1_wrap strong { font-size:72px; margin:30px 0 50px 0; }
    .top_visual .h1_wrap h1 { font-size:24px; }
    .top_visual p { width:100%; text-align:left; line-height:35px; margin-top:50px; }

    .top_visual .illust_nanmaru_pc_wrap { width:260px; position:absolute; bottom:100px; left:50%; display:block; }
    .top_visual .illust_nanmaru_pc_wrap .illust_nanmaru_pc { width:150px; z-index:2; position:relative; margin-bottom:20px; }
    .top_visual .illust_nanmaru_pc_wrap .page_title_fukidashi { position:absolute; bottom:120px; right:20px; z-index:1; }
    .top_visual .illust_nanmaru_pc_wrap .page_title_fukidashi span { width:100%; text-align:center; }

}

.top_bg_wrap .top_bg_sp { width:100%; display:block; }
.top_bg_wrap .top_bg_pc { display:none; }
.top_bg_wrap .top_bg_pad { display:none; }
.top_bg_wrap .section_title_en { display:inline-block; }
.pad { display:none; }
@media (min-width:768px) {
    .top_bg_wrap { width:100%; }
    .top_bg_wrap .top_bg_sp { display:none; }
    .top_bg_wrap .section_title_en { width:100%; font-size:20px; color:#FC5942; opacity:1; display:block; text-align:left; line-height:1.7em; margin-top:50px; }

}
@media (min-width:1100px) {
    .top_bg_wrap { width:85%; margin:0 auto 80px auto; }

}

@media (min-width:768px) and (max-width:1299px) {
  .top_bg_wrap .top_bg_pad { width:100%; display:block; }
  .top_bg_wrap .top_bg_pad { display:block; }
  .pad { display:inline-block; }

}

.top_visual .kumo_left { display:none; }
.top_visual .kumo_center { display:none; }
.top_visual .kumo_right { display:none; }
.top_visual .taiyo { display:none; }
@media (min-width:1300px) {
  .top_visual .kumo_left  { width:5%; position:absolute; top:20%; left:50%; animation: kumoFloat 4s ease-in-out infinite; display:block; }
  @keyframes kumoFloat {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

  .top_visual .kumo_center  { width:5%; position:absolute; top:20%; left:65%;  animation: kumoFloat2 3s ease-in-out infinite; display:block;}
    @keyframes kumoFloat2 {
  0%   { transform: translateY(-10px); }
  50%  { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}

  .top_visual .kumo_right  { width:5%; position:absolute; top:18%; right:5%; animation: kumoFloat 4s ease-in-out infinite; display:block;}
    @keyframes kumoFloat {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

  .top_visual .taiyo  { width:5%; position:absolute; top:20%; right:15%; display:block;}
  .top_bg_wrap .top_bg_pc { width:100%; display:block; }
  .top_bg_wrap .top_bg_pad { display:none; }
  .pad { display:none; }

}


.top_bg_wrap .contents .keyword_wrap input:focus {
    outline: none;
    border: 1px solid #fff; /* 好きな色に */
}
@media (min-width:768px) {
    .top_bg_wrap .contents { width:80%; border:2px solid #004680; border-radius:30px; background:#fff; padding:50px 10%; filter: drop-shadow(1px 1px 10px rgba(0, 0, 0, 0.08)); margin-top:-50px; display:flex; }
    .top_bg_wrap .contents  .section_title.bgtext { width:50%; margin-bottom:0; }
    .top_bg_wrap .contents  .section_title.bgtext .section_title_ja.center { width:100%; font-size:36px; text-align:left; line-height:1.7em; }
    .top_bg_wrap .contents .keyword_wrap { width:50%; }
    .top_bg_wrap .contents .keyword_wrap p { margin-bottom:10px; }
     .top_bg_wrap .contents .keyword_wrap input { width:100%; }

}
@media (min-width:768px) and (max-width:1299px) {
   .top_bg_wrap .contents { padding:50px 5%;}
   .top_bg_wrap .contents  .section_title.bgtext .section_title_ja.center { font-size:30px; }
   .top_bg_wrap .contents .keyword_wrap p { font-size:14px; }

}


.condition_wrap { width:100%; display:flex; flex-wrap:wrap; gap:24px; }
.condition_wrap li { width:100%; }
.condition_wrap li .img_wrap { width:100%; height:150px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.condition_wrap li .img_wrap img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.condition_wrap li .img_wrap:hover img { transform:scale(1.1); }
.condition_wrap li .img_wrap strong { width:100%; text-align:center; font-weight:bold; color:#fff; position:absolute; font-size:20px; letter-spacing:0.1em; z-index:2; }
.condition_wrap li .img_wrap strong  span { width:100%; display:inline-block; font-weight:normal; }
@media (min-width:768px) {
    .condition_wrap { margin-bottom:100px; }
    .condition_wrap li { width: calc(calc(100% - 48px) / 3);}
    .condition_wrap li .img_wrap { height:216px; }
    .condition_wrap li .img_wrap strong { font-size: min(2.4vw,28px); }
    .condition_wrap li .img_wrap strong  span { font-size:20px; margin-top:10px; font-weight:bold; }
}

@media (min-width:1100px) {
    .contents_bg_basic.area { background:none; }
    .contents_bg_basic.area .contents { padding-bottom:0; }
}

.link_lists_title {text-align: center;padding: 8px 0;background-color: #004680;font-size: 18px;font-weight: bold; color:#fff; }
.link_lists a{width: 44vw;display: inline-block;position: relative;}
.link_lists a:hover{text-decoration: underline;transition: 0.3s;}
.link_lists img{width: 5px;height: auto;position: absolute;right: 20px;top: 50%;transform: translateY(-50%);}
.area_button_else a{position: relative;}
.area_button_else img{width: 5px;height: auto;position: absolute;right: -25px;top: 50%;transform: translateY(-50%);}
.area_links {display: flex;flex-direction: row;flex-wrap: wrap;padding:20px 20px;gap: 10px; background:#fff; }
.area_links a{width:100%; position:relative; }
.area_links a:hover { text-decoration: underline;}
@media (min-width:768px) {
    .link_lists{padding-bottom: 0px;width: auto;}
    .link_lists_school{border: 1px solid #DADADA;width: auto;}
    .link_lists_comment{width: 1320px;margin-bottom: 40px;margin-bottom: 60px;margin-top: 60px;}
    .area_links{padding: 20px 50px; border:1px solid #ccc; }
    .area_links a{width: calc(calc(100% - 20px) / 3);}
    .link_lists img{right: 50px;}
}
@media (min-width:1100px) {
        .area_links a{width: calc(calc(100% - 30px) / 4);}
}
@media (min-width:1300px) {
        .area_links a{width: calc(calc(100% - 40px) / 5); }
}
.area_links a img{width: 5px;height: auto;position: absolute;right: 20px;top: 50%;transform: translateY(-50%);}
.area_links_wrap { width:100%; margin-bottom:80px; }

.area_links_wrap.chuo { margin-bottom:40px; }


.category_wrap {
  width: 100%;
  position: relative;
}

/* 中央の1320pxコンテナ */
.category_inner {
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}

/* SP〜タブレットまでは縦並び */
.category_inner > div {
  width: 100%;
}

.category_img .img_category {
  width: 100%;
  display: block;
}

/* タブレットで横並び（右に画像・左にボタン）*/
@media (min-width: 1100px) {
  .category_inner {
    flex-wrap: nowrap;
    flex-direction: row-reverse;
  }
}

@media (min-width: 1100px) {
    .category_inner > div { width:50%; margin-right:50%; }
    .category_buttons {
        width: 50%;
        position: relative;
        z-index: 1;
    }
    .category_img {
        position: absolute;
        top: 0;
        left: 50%;
        right: 0;

    }
    .category_img .img_category {
        width: 100%;
        height: 100%;
        object-fit: cover;
        position:relative;
        z-index:1;
    }
    .img_wrap { position:relative; margin-left:50px; }
    .img_wrap::after {
    content:'';
    position:absolute;
    bottom:-24px;
    left:-24px;
    width:60%;
    height:80%;
    background:#004680;
    z-index:0;
    }
    .category_wrap::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width:90%;
    height: 80%;
    background: #EDF5FD; /* 薄い水色 */
    z-index: -1;
}
.category_wrap { margin-bottom:180px; }
.title_category { padding-bottom:0; }



}






/*ボタン*/
.button_contents { width:90%; display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; margin:0 auto 50px auto; }
.button_contents li { display: flex; flex: 0 0 calc((100% - 20px) / 3); align-items: center;border: 2px solid #004680;border-radius: 10px;box-shadow: 0 3px 6px rgba(0,0,0,.16);overflow: hidden;}
.button_contents li a { width:100%; height:100%; display:flex; align-items:center; flex-wrap:wrap; padding:16px 0 10px 0; position:relative; }
.button_contents li a::after { content:""; position:absolute; top:50%; right:7%; transform:translateY(-50%); width:12px; height:12px; background:url("/img/common/icon_arrow_right_blue.svg") no-repeat center / contain; }
.button_contents li a.otherlink::after { content:none; }
.button_contents li a:hover { background:#f2f2f2; }
.button_contents li a img { width:auto; height:35px; margin:0 auto; display:block; }
.button_contents li a span { width:100%; text-align:center; display:inline-block; color:#004680; font-size:13px; margin-top:5px;}
.button_contents li a span.icon_other {position:relative; }
.button_contents li a span.icon_other::after { content:""; position:absolute; top:50%; right:20px; width:12px; height:12px; background:url("/img/common/icon_othersite_blue.svg") no-repeat center/contain; transform:translateY(-50%); }
@media (min-width:768px) {
  .button_contents{ margin-bottom:120px; }
  .button_contents li { width:15%; height:70px;}
  .button_contents li a { padding:50px 0; }
  .button_contents li a img  { height:57px; }
  .button_contents li a span { font-size:18px; margin-top:10px; height:auto; }
  .button_contents li a span.icon_other::after { right:40px; }

}

@media (min-width:768px) and (max-width:1099px) {
   .button_contents li { height:120px; }
  .button_contents li a { padding:10px 0;}
  .section_title.bgtext { margin-bottom:0; }
}
@media (min-width:1100px) {
    .button_contents li { display: flex; flex: 0 0 calc((100% - 10px) / 2);}
    .button_contents li a { padding:10px 0 10px 16px; flex-wrap:nowrap; background:#fff; }
    .button_contents li a img  { height:46px; }
    .button_contents li a img.icon_education { width:50px; height:35px; }
    .button_contents li a img.icon_park { width:54px; height:33px; }
    .button_contents li a span { width:80%; margin-top:0; margin-left:10%; text-align:left; font-weight:bold; }


}





/*タグ*/
.tag_links { display:flex; gap:8px; flex-wrap:wrap; }
.tag_links a { background:#fff; border-radius:20px; border:1px solid #DADADA; line-height:45px; padding:0 30px; box-shadow: none;}
