@charset "utf-8";

#mainimg.noimg .ttlblk .ttl {
    color: #003353;
    text-shadow: none;
}
#mainimg.noimg .ttlblk .ttl .en:after {
    background: #003353;
}
.educational_plan .content_in {
  width:100%;
  max-width:865px;
  margin:0 auto;
  padding-bottom:100px;
}
.educational_plan .explist > li {
  border:1px solid #F2F2F2;
  margin-bottom:34px;
}
.educational_plan .item_name {
  color:#000;
  font-size:16px;
  line-height:1;
  display:flex;
  align-items:center;
  padding:5px 59px 5px 5px;
  background-color:#bcd8ef;
  position:relative;
  cursor:pointer;
}
.educational_plan.archive .item_name:after {
  content: "";
  display: block;
  width: 14px;
  height: 9px;
  background: url(../imgs/educational_plan/arrow_app.svg) 0 0 no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  z-index: 3;
  transition: all 0.3s;
}
.educational_plan.archive .item_name.open:after {
    transform: translateY(-50%) rotate(180deg);
}
.educational_plan .item_name span {
  display:inline-flex;
  padding:18px;
}
.educational_plan.archive .item_name .num {
  font-family: "Maru Maru Gothic CLr StdN R";
  border-right:1px solid #F2F2F2;
}
.educational_plan .item_name .ja {
  color:#003353;
  letter-spacing:0.06em;
  transition: all 0.3s;
}
.educational_plan.archive .item_name:hover .ja {
  text-decoration:underline;
}
.educational_plan .item_cont {
  padding:25px 20px;
}
.educational_plan.archive .item_cont {
  display:none;
}
.educational_plan .item_cont_in {
  display:flex;
  flex-wrap:wrap;
  /*justify-content:center;*/
  gap:10px;
}
.educational_plan .item_cont .btn_item {
  color:#003353;
  font-size:14px;
  line-height:1;
  text-align:center;
  width:calc((100% - 30px) / 4);
  min-width:180px;
  padding:14px 20px;
  background-color:transparent;
  border-radius:20px;
  transition:all 0.3s;
}
.educational_plan .item_cont .btn_item:hover {
  background-color:#d9e0e5;
}



@media screen and (max-width: 1440px) {
}

@media screen and (max-width: 1260px) {
}

@media screen and (max-width: 1240px) {
}

@media screen and (max-width: 820px) {
}

@media screen and (max-width: 768px) {


}


@media screen and (max-width: 640px) {
.educational_plan .item_cont .btn_item {
    width: calc((100% - 10px) / 2);
    min-width: 142px;
    padding: 14px 10px;
}

}

@media screen and (max-width: 400px) {
.educational_plan .item_cont .btn_item {
    padding: 14px 5px;
}

}

@media screen and (max-width: 375px) {
.educational_plan .item_cont .btn_item {
    font-size: 13px;
}
.educational_plan .item_cont .btn_item {
  min-width:auto;
}


}