@charset "utf-8";
/* CSS Document */
#search_area_index {
  padding: 80px 20px;
  max-width: 1280px;
  margin: 0 auto;
}
#search_area_index .selectbox {
    height: 46px;
    border: 1px solid #999999;
}

#search_area_index .selectbox select {
    height: 44px;
}
#search_area_index .selectbox::before {
    background: #E5005A;
}
#search_area_index .selectbox::before, .selectbox::after {
    width: 40px;
}
#search_area_index input[type="text"] {
    height: 46px;
}

@media only screen and (min-width: 721px) {
    #search_area_index{
        padding: 20px 20px 0;
    }
    #search_area_index .search_box {
        background:#FFF4F5;
        border-radius: 10px;
        padding: 30px 50px;
      border: none;
    }
    #search_area_index .search_box .inner {
        padding: 30px 0 0;
    }

    #search_area_index .search_box h3 {
        padding: 15px 0;
        font-size: 2.0rem;
        font-weight: bold;
        line-height: 1;
        border-bottom: 1px solid #E5005A;
    }

    #search_area_index .search_box .input_item {
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    #search_area_index .search_box .input_item .note {
      -webkit-box-flex: 0;
          -ms-flex: 0 0 40px;
              flex: 0 0 40px;
      padding: 5px 0 0;
      font-size: 1.2rem;
    }

    #search_area_index .search_box .input_item input[type="text"] {
        width: 100%;
    }

    #search_area_index .search_box [class^="btn_"] {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        min-width: inherit;
        margin: 30px 0 0;
        font-weight: bold;
    }

    #search_area_index .tab_box #search_pref {
      display: block !important;
      position: relative;
      float: left;
      width: 70%;
      max-width: 840px;
      max-height: 565px;
      padding:  0 0;
      background: #fff;
      /*----- #tohoku -----*/
      /*----- #kanto -----*/
      /*----- #tokai -----*/
      /*----- #kansai -----*/
      /*----- #chugoku -----*/
    }

    #search_area_index .tab_box #search_pref h3 {
      text-align: center;
      font-size: 2.8rem;
      font-weight: bold;
      line-height: 1.2;
    }

    #search_area_index .tab_box #search_pref figure {
      position: absolute;
      top: 90px;
      left: 200px;
    }

    #search_area_index .tab_box #search_pref dl {
      position: absolute;
      background: rgba(255, 255, 255, 0.5);
      text-align: center;
      border-radius: 10px;
      padding: 0;
    }

    #search_area_index .tab_box #search_pref dl dt {
        font-size: 2.0rem;
        font-weight: bold;
        line-height: 1;
        border-radius: 8px 8px 0 0;
        padding: 10px 10px;
        color: #fff;
    }

    #search_area_index .tab_box #search_pref dl dd {
        font-size: 1.6rem;
        display: grid;
        gap: 10px;
        padding: 10px 10px;
    }

    #search_area_index .tab_box #search_pref dl dd a {
      flex: 0 0 70px;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 36px;
      border-radius: 100px;
      color: #333;
      margin: 0 !important;
    }

    #search_area_index .tab_box #search_pref dl dd a:hover {
      opacity: 0.7;
    }

    #search_area_index .tab_box #search_pref dl#tohoku {
        border: 1px solid #2E88D2;
    }
    #search_area_index .tab_box #search_pref dl#tohoku dt {
        background: #2E88D2;
    }
    #search_area_index .tab_box #search_pref dl#tohoku dd {
        grid-template-columns: repeat(1, 1fr);
    }
    #search_area_index .tab_box #search_pref dl#tohoku a {
        background: #DBEFFF;
    }
    #search_area_index .tab_box #search_pref dl#kanto {
        border: 1px solid #11A73B;
    }
    #search_area_index .tab_box #search_pref dl#kanto dt {
        background: #11A73B;
    }
    #search_area_index .tab_box #search_pref dl#kanto dd {
        grid-template-columns: repeat(2, 1fr);
    }
    #search_area_index .tab_box #search_pref dl#kanto a {
        background: #D3F5DD;
    }
    #search_area_index .tab_box #search_pref dl#tokai {
        border: 1px solid #BD7DE2;
    }
    #search_area_index .tab_box #search_pref dl#tokai dt {
        background: #BD7DE2;
    }
    #search_area_index .tab_box #search_pref dl#tokai dd {
        grid-template-columns: repeat(4, 1fr);
    }
    #search_area_index .tab_box #search_pref dl#tokai a {
        background: #F4E4FD;
    }
    #search_area_index .tab_box #search_pref dl#kansai {
        border: 1px solid #F56B7B;
    }
    #search_area_index .tab_box #search_pref dl#kansai dt {
        background: #F56B7B;
    }            
    #search_area_index .tab_box #search_pref dl#kansai dd {
        grid-template-columns: repeat(3, 1fr);
    }            
    #search_area_index .tab_box #search_pref dl#kansai a {
        background: #FFE9EB;
    }            
    #search_area_index .tab_box #search_pref dl#chugoku {
        border: 1px solid #F29300;
    }
    #search_area_index .tab_box #search_pref dl#chugoku dt {
        background: #F29300;
    }
    #search_area_index .tab_box #search_pref dl#chugoku dd {
        grid-template-columns: repeat(3, 1fr);
    }
    #search_area_index .tab_box #search_pref dl#chugoku a {
        background: #FFF1DA;
    }
    #search_area_index .tab_box #search_pref #tohoku {
      top: 80px;
      right: 0;
      width: 130px;
    }

    #search_area_index .tab_box #search_pref #tohoku dd {
      justify-content: center;
    }

    #search_area_index .tab_box #search_pref #kanto {
      top: 295px;
      right: 0;
      width: 245px;
    }

    #search_area_index .tab_box #search_pref #kanto dd {
      justify-content: space-between;
    }

    #search_area_index .tab_box #search_pref #tokai {
      top: 500px;
      right: 0;
      width: 475px;
    }

    #search_area_index .tab_box #search_pref #kansai{
      top: 80px;
      left: 0;
      width: 360px;
    }

    #search_area_index .tab_box #search_pref #chugoku {
      top: 240px;
      left: 0;
      width: 360px;
    }

    #search_area_index .tab_box #search_area {
      display: block;
      /*margin: 0 0 30px 900px;*/
      margin: 0 0 30px 72%;
    }

    #search_area_index .tab_box #search_area .selectbox {
      width: 100%;
    }

    #search_area_index .tab_box + #search_keyword {
      /*margin: 0 0 0 900px;*/
      margin: 0 0 0 72%;
    }

    #search_area_index .tab_box + #search_keyword input[type="text"] {
      min-width: 240px;
    }
}
@media only screen and (max-width: 1280px) {
    #search_area_index .search_box {
        padding: 20px 20px;
    }
    #search_area_index .tab_box #search_pref figure {
      position: absolute;
      left: 120px;
    }
}

/* #school_search */
#search_area_index #school_search {
	display: block;
	background: url(/img/bg_school_02.png) 0 0 repeat #c4e7c8;
	margin: 20px 0;
}

#search_area_index #school_search .bg{
    position:relative;
    width: 960px;
    margin:0 auto;
    background: url(/img/img_map.png) 40% 50% no-repeat;
}


#search_area_index #school_search .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 960px;
  height: 280px;
  margin: 0 auto;
  padding: 0 0 0 650px;
}

#search_area_index #school_search .inner h2 {
  font-size: 3rem;
  font-weight: bold;
  line-height: 1.2;
}

#search_area_index #school_search .inner p {
  margin: 15px 0 25px;
}

#search_area_index #school_search #search_keyword{
	position:absolute;
	top: 25px;
	left: 0;
	width: 350px;
}

/*#search_area_index #school_search a:hover [class^="btn_"] {
  background: #faccde;
}
*/

#search_area_index #school_search .search_box {
  padding: 25px 28px 30px;
  background:#FFF;
  background-color: rgba( 255, 255, 255, 0.55 );
}


#search_area_index #school_search .search_box h2 {
  margin: 0 0 25px;
  text-align: center;
  font-size: 2.8rem;
  font-weight: bold;
  line-height: 1.2;
}

#search_area_index #school_search .search_box [class^="btn_"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  min-width: inherit;
  margin: 30px 0 0;
}

#search_area_index #school_search .search_box .input_item input[type="text"] {
    width: 100%;
}

#search_area_index #school_search .school_area{
	width:960px;
	margin:0 auto;
	padding-bottom:40px;
}

#search_area_index #school_search .school_area h3{
  margin: 0 0 15px;
  font-size: 2.0rem;
  font-weight: bold;
}

#search_area_index #school_search .school_area p{
  font-size: 1.4rem;
  font-weight: bold;
}

#search_area_index #school_search .school_area a{
  text-decoration:underline;
  font-weight: normal;
}

#search_area_index #school_search  .school_area table th{
	text-align:left;
}

#search_area_index #school_search  .school_area table td span{
	margin:0 5px;
}

#school_index .row_medium {
  max-width: 1280px;
  width: 100%;
  margin: 0;
}
#school_index .btn_box {
  padding: 80px 0;
  text-align: center;
}
#school_index .btn_box .entry_txt{
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  position: relative;
  display: inline-block;
  margin: 0 0 5px;
}
#school_index .btn_box .entry_txt::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 19px;
  background: url(/school/img/diagonal_line.png) no-repeat left;
  top: 0;
  left: -30px;
}
#school_index .btn_box .entry_txt::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 19px;
  background: url(/school/img/diagonal_line.png) no-repeat left;
  top: 0;
  right: -30px;
  transform: scaleX(-1);
}
#school_index .btn_orange02 {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2.6rem;
  font-weight: bold;
  color: #fff;
  width: 60%;
  max-width: 500px;
  height: 85px;
  border-radius: 10px;
  background: #FF7E00;
  box-shadow: 0 6px 0 0 #D96B00;
  margin: 0 auto;
  position: relative;
  transition: all .3s;
}
#school_index .btn_orange02 span{
  border-radius: 20px;
  background: #FFF;
  width: 80px;
  height: 36px;
  margin: 0 20px 0 0;
  color: #FF7E00;
  text-align: center;
  font-feature-settings: 'palt' on;
  font-family: "Noto Sans JP";
  font-size: 20px;
  font-style: normal;
  font-weight: bold;
  display: grid;
  place-items: center;
}
#school_index .btn_orange02 i{
  position: absolute;
  right: 20px;
}
#school_index #flow_briefing_top.flow_briefing {
  padding: 150px 0 0;
  background: #FFF;
  margin: 0;
}
#school_index .flow_briefing .flow{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 1280px;
  margin: 0 auto 0;
  counter-reset: li;
  gap: 40px;
}
#school_index .flow_briefing .flow li {
  width: 210px;
  position: relative;
}
#school_index .flow_briefing .flow li div {
  position: relative;
}
#school_index .flow_briefing .flow li div::before {
  content: "";
  width: 60px;
  height: 60px;
  position: absolute;
  top: -10px;
  left: -10px;
  z-index: 2;
}
#school_index .flow_briefing .flow li:nth-child(1) div::before {
  background: url(/img/num_01.png);
}
#school_index .flow_briefing .flow li:nth-child(2) div::before {
  background: url(/img/num_02.png);
}
#school_index .flow_briefing .flow li:nth-child(3) div::before {
  background: url(/img/num_03.png);
}
#school_index .flow_briefing .flow li:nth-child(4) div::before {
  background: url(/img/num_04.png);
}
#school_index .flow_briefing .flow li figure {
  width: 210px;
  height: 160px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  border-style: solid;
  border-width: 3px;
  border-radius: 20px;
  margin: 0 0 20px;
}
#school_index .flow_briefing .flow li:nth-child(1) figure {
  border-color: #f56b7a;
}
#school_index .flow_briefing .flow li:nth-child(2) figure {
  border-color: #e8c817;
}
#school_index .flow_briefing .flow li:nth-child(3) figure {
  border-color: #76cda8;
}
#school_index .flow_briefing .flow li:nth-child(4) figure {
  border-color: #3394d6;
}
#school_index .flow_briefing .flow li div h3 {
  font-weight: bold;
  font-size: 1.6rem;
  margin: 0 0 10px;
  text-align: center;
}


@media screen and (max-width: 720px) {
  
/* search */
  #search_area_index {
  padding: 40px 20px 0;
}
#search_area_index .search_box {
    background:#FFF;
    border: none;
    border-radius: 10px;
    padding: 30px 25px;
}
#search_area_index #search_keyword.search_box {
    background:#FFF4F5;
}
#search_area_index .search_box .inner {
    padding: 20px 0 0;
}

#search_area_index .search_box h3 {
    padding: 0 0 15px;
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 1;
    border-bottom: 1px solid #E5005A;
}
    
#search_area_index .search_box .input_item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 0 30px 0;
}

#search_area_index .search_box .input_item .note {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 40px;
          flex: 0 0 40px;
  padding: 5px 0 0;
  font-size: 1.2rem;
}

#search_area_index .search_box .input_item input[type="text"] {
  width: 100%;
}


#school_index #search_area_index .local_nav {
  border-top: none;
    overflow: hidden;
}

#school_index #search_area_index .local_nav .tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#school_index #search_area_index .local_nav .tab li {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
}

#school_index #search_area_index .local_nav .tab li a {
    display: block;
    background: #EBEBEB;
    font-weight: bold;
    text-align: center;
    height: 45px;
    line-height: 45px;
    border-radius: 10px 10px 0 0;
    padding: 0;
}

#school_index #search_area_index .local_nav .tab li.active a {
    border-top: 1px solid #E5005A;
    border-right: 1px solid #E5005A;
    border-left: 1px solid #E5005A;
    background: #FFF;
}
#school_index #search_area_index .local_nav .tab li:not(.active) a {
    color: #808080;
    border-bottom: 1px solid #E5005A;
}

#school_index .tab_box {
  /* #search_pref
		----------------------------------------------------------- */
  /* #search_area
		----------------------------------------------------------- */
}

#school_index .tab_box #search_pref {
  padding: 0 0;
  background: #fff;
}

#school_index .tab_box #search_pref dl dt {
    padding: 5px 10px;
    color: #fff;
    font-weight: bold;
    border-radius: 5px;
}

#school_index .tab_box #search_pref dl#tohoku dt {    
    background: #2E88D2;
}   
#school_index .tab_box #search_pref dl#kanto dt {    
    background: #11A73B;
}   
#school_index .tab_box #search_pref dl#tokai dt {    
    background: #BD7DE2;
}   
#school_index .tab_box #search_pref dl#kansai dt {    
    background: #F56B7B;
}   
#school_index .tab_box #search_pref dl#chugoku dt {    
    background: #F29300;
} 

#school_index .tab_box #search_pref dl dd {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin: 10px 0 0;
}

#school_index .tab_box #search_pref dl dd a {
    width: 100%;
    height: 40px;
    text-align: center;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
  color: #333;
  margin: 0;
}
    
#school_index .tab_box #search_pref dl#tohoku dd a {    
    background: #DBEFFF;
}   
#school_index .tab_box #search_pref dl#kanto dd a {    
    background: #D3F5DD;
}   
#school_index .tab_box #search_pref dl#tokai dd a {    
    background: #F4E4FD;
}   
#school_index .tab_box #search_pref dl#kansai dd a {    
    background: #FFE9EB;
}   
#school_index .tab_box #search_pref dl#chugoku dd a {    
    background: #FFF1DA;
} 

#school_index .tab_box #search_pref dl + dl {
    margin: 20px 0 0;
}

#school_index .tab_box #search_area {
    padding: 10px 15px 0;
    border: none;
}

#school_index .tab_box #search_area .input_item {
    display: flex;
    margin-top: 0;
}

#school_index .tab_box #search_area .input_item .selectbox {
    margin: 0;
}

#school_index .tab_box #search_area .input_item .note {
    height: 40px;
}

#school_index .tab_box + #search_keyword {
    margin: 40px 0 0;
}
#school_index .btn_box {
  padding: 50px 0;
  text-align: center;
}
  #school_index #flow_briefing .btn_box p {
    width: 70%;
    margin: 0 auto 10px;
  }
 #school_index .btn_orange02 {
    font-size: 1.8rem;
    text-align: center;
    width: 100%;
    max-width: inherit;
    height: 65px;
  }
#school_index .btn_orange02 span {
  width: 60px;
  height: 30px;
  margin: 0 10px 0 -20px;
  font-size: 16px;
}
#school_index #flow_briefing_top.flow_briefing {
  width: 100%;
  margin: 0 0 20px;
  padding: 40px 20px;
}
#school_index .flow_briefing .flow {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto 30px;
  counter-reset: li;
  gap: 0;
}
#school_index .flow_briefing .flow li {
  width: 100%;
  margin-bottom: 20px;
}
#school_index .flow_briefing .flow li div h3 {
  text-align: left;
}
#school_index .flow_briefing .flow li figure {
  width: 140px;
  height: 106px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  border-style: solid;
  border-width: 3px;
  border-radius: 20px;
  margin: 0 10px 20px 0;
  float: left;
}
#school_index .flow_briefing .flow li:nth-child(1) div::before {
  background: url(/img/num_01.png);
  background-size: contain;
}
#school_index .flow_briefing .flow li:nth-child(2) div::before {
  background: url(/img/num_02.png);
  background-size: contain;
}
#school_index .flow_briefing .flow li:nth-child(3) div::before {
  background: url(/img/num_03.png);
  background-size: contain;
}
  #school_index .flow_briefing .flow li:nth-child(4) div::before {
  background: url(/img/num_04.png);
  background-size: contain;
}

#school_index .flow_briefing .flow li div::before {
  content: "";
  width: 30px;
  height: 30px;
  position: absolute;
  top: -10px;
  left: -10px;
  z-index: 2;
}
}