@charset "UTF-8";


/*コンテンツ部分 開始-----------------------------------------------------------------------*/
#sp_contents img {
	vertical-align: top;
}
#sp_contents a img:hover {
	opacity: 0.7;
}
#part02 {
	margin: 0 0 0 -3px;
}
#part03 .flexbox {
	display: flex;
	margin: 0 20px;
}
#part03 .kiyaku {
	width: 585px;
	margin: 0 0 0 236px;
}
#part03 .btn {
	width: 782px;
}
#part03 .btn div {
	text-align: left;
}
#part04 .flexbox div {
	background: #ece9dc;
	margin: 0 0 24px;
}
#part04 .flexbox div ul {
	display: flex;
	justify-content: space-evenly;
	width: 100%;
	padding: 18px 0;
}
#part05 .wrap_ranking {
	position: relative;
}
#part05 .ranking {
	position: relative;
	z-index: 1;
}
#part05 #university {
	position: absolute;
	z-index: 3;
	left: 17px;
	top: 182px;
}
#part05 #techinical {
	position: absolute;
	z-index: 3;
	left: 17px;
	top: 0;
}
#part05 .flexbox {
	display: flex;
}
#part05 .btn.flexbox {
	margin: 0 20px;
}
#part05 .top3 {
	position: relative;
	z-index: 2;
	margin: 0 0 0 99px;
	width: 864px;
}
#part05 .top10 {
	justify-content: space-between;
	margin: 0 0 45px 70px;
	width: 890px;
}
#part05 .top10 div div {
	border-bottom: 1px solid #000000;
}
#part05 .top10 div div:first-child {
	border-top: 1px solid #000000;
}
#part05 .top10 div div.rankingnote {
	border-bottom: none;
}
#part05 .top10 div div img {
	position: relative;
	left: -1px;
}
#part06 .flexbox {
	display: flex;
	margin: 0 20px;
}
#pagetop {
	z-index: 10;
}

/* ズームイン */
.zoomIn{
	animation-name:zoomInAnime;
	animation-duration:1s;
	animation-fill-mode:forwards;
}
@keyframes zoomInAnime{
  from {
	transform: scale(0.6);
  }

  to {
      transform: scale(1);
  }
}

/* 順番に表示 */
/*  スタート時は要素自体を透過0にするためのopacity:0;を指定する  */
.box{
	opacity: 0;
}

/*  ふわっと動かす  */
.fadeUp {
	animation-name:fadeUpAnime;
	animation-duration:0.5s;
	animation-fill-mode:forwards;
	opacity: 0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/*コンテンツ部分 終了-----------------------------------------------------------------------*/


/* ###################### 767px以下 ###################### */
@media (max-width: 767px) {


}


/* ###################### 768px以上 ###################### */
@media (min-width: 768px) {


}


/* ################## 768px以上979px以下 ################## */
@media (min-width: 768px) and (max-width: 979px) {


}


/* ################## 979px以下 ################## */
@media (max-width: 979px) {

#part03 .flexbox {
	margin: 0;
}
#part03 .kiyaku {
	width: 62%;
	margin: 0 0 0 23%;
}
#part03 .btn {
	width: 77%;
}
#part04 .flexbox div ul li {
	flex: 0 0 47%;
}
#part05 #university,
#part05 #techinical {
	position: relative;
	left: 0;
	top: 0;
	text-align: left;
	margin: 0 0 10px;
}
#part05 #university img,
#part05 #techinical img {
	width: 20%;
}
#part05 .top3 {
	margin: 0;
	width: 100%;
}
#part05 .top10 {
	justify-content: space-between;
	margin: 0 0 5% 3%;
	width: 100%;
}
#part05 .top10 div {
	width: 95%;
}
#part05 .top10 div div img {
	left: 0px;
}
#part05 .btn.flexbox {
	margin: 0;
}
#part06 .flexbox {
	margin: 0;
}

}


/* ###################### 980px以上 ###################### */
@media (min-width: 980px) {

#part04 .flexbox {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	margin: 0 20px;
}
#part04 .flexbox div {
	width: 450px;
}

}
