@charset "utf-8";
/* CSS Document */

/* -------------------------
/* Created date: --
/* Created user: --
/* Last up date: 2022.09.14
/* Last up date user: yamaguchi
/* for sp and pc
--------------------------*/
/* ======== newschool shougaku-kin start ================*/
:root{
  --svgOkaneGray: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 53.61 43.83"><path fill="rgba(102,102,102,1)" fill-rule="evenodd" d="M26.86,8.71C16.59-6.95.12.4,0,15.77S26.59,43.83,26.59,43.83s26.9-12.26,27-27.64S37.09-7.07,26.86,8.71Zm5.73,17.34c1.31,0,2,.44,2,1.3s-.65,1.3-2,1.3H29v4c0,1.11-.58,1.66-1.73,1.66s-1.72-.55-1.72-1.66v-4H21.9c-1.31,0-2-.43-2-1.3s.66-1.3,2-1.3h3.62V23.67H21.9c-1.31,0-2-.43-2-1.3s.66-1.29,2-1.29h2l-3.25-5.64a2.9,2.9,0,0,1-.47-1.29c0-.87.53-1.31,1.59-1.31.74,0,1.34.47,1.79,1.41l3.65,7,3.66-7c.45-.94,1.05-1.41,1.79-1.41,1.06,0,1.59.44,1.59,1.31a3,3,0,0,1-.47,1.29l-3.39,5.64h2.17c1.31,0,2,.42,2,1.29s-.65,1.3-2,1.3H29v2.38Z" /></svg>') center / contain no-repeat;
}
/* Bottom Block --------------------------- */
.scShipIntro {
  position: relative;
  margin: 0 auto 30px;
  padding: var(--paddingMin) 15px;
  background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.3) 0 2px, rgba(255, 255, 255, 0) 3px 6px), #e8f0fa;
}

.scShipIntro::before {
  content: '';
  top: 100%;
  left: 50%;
  width: 60px;
  height: 30px;
  background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.3) 0 2px, rgba(255, 255, 255, 0) 3px 6px), #e8f0fa;
  clip-path: polygon(0 0, 50% 100%, 100% 0);
  transform: translate(-50%, 0);
}

.scShipNote {
  margin: 0 auto 30px;
  padding: 10px 10px var(--paddingMinMin);
  max-width: var(--contentsWidth);
  background: #fff;
  border-radius: 1rem;
}

.scShipNote .scLineTitle {
  margin: 0 auto var(--paddingMinMin);
}

.scShipNote p {
  text-align: center;
  line-height: 1.8;
  font-size: 1.3rem;
}

.scShipNote ul{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  justify-content: center;
  gap: 30px;
  padding: 30px 15px;
}

.scShipNote li{
  position: relative;
  z-index: 1;
  display: grid;
  place-content: center;
  gap: 5px;
  min-height: 120px;
  text-align: center;
}

.scShipNote li::before{
  content: '';
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 120px;
  height: 120px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 53.61 43.83"><path fill="rgba(232,240,250,1)" fill-rule="evenodd" d="M26.86,8.71C16.59-6.95.12.4,0,15.77S26.59,43.83,26.59,43.83s26.9-12.26,27-27.64S37.09-7.07,26.86,8.71Zm5.73,17.34c1.31,0,2,.44,2,1.3s-.65,1.3-2,1.3H29v4c0,1.11-.58,1.66-1.73,1.66s-1.72-.55-1.72-1.66v-4H21.9c-1.31,0-2-.43-2-1.3s.66-1.3,2-1.3h3.62V23.67H21.9c-1.31,0-2-.43-2-1.3s.66-1.29,2-1.29h2l-3.25-5.64a2.9,2.9,0,0,1-.47-1.29c0-.87.53-1.31,1.59-1.31.74,0,1.34.47,1.79,1.41l3.65,7,3.66-7c.45-.94,1.05-1.41,1.79-1.41,1.06,0,1.59.44,1.59,1.31a3,3,0,0,1-.47,1.29l-3.39,5.64h2.17c1.31,0,2,.42,2,1.29s-.65,1.3-2,1.3H29v2.38Z" /></svg>') center / contain no-repeat;
  transform: translate(-50%, -50%);
}

.scShipNote li p{
  font-weight: bold;
  font-size: 1.3rem;
  line-height: 1.2;
}

.scShip .itemTypes .itemType + .itemType{
  margin-top: 5px;
}

.scShip .itemType {
  margin: 0 auto;
  padding: 5px;
  width: 8.3em;
  background: #ccc;
  border-radius: 3px;
  color: #fff;
  font-size: 1.5rem;
}

.scShip .itemType.itemType_1 {
  background: rgb(var(--naviEmerald));
}

.scShip .itemType.itemType_2 {
  background: rgb(var(--naviRed));
}

.scShip .itemType.itemType_6 {
  background: rgb(var(--ocYellow));
}

.scShip .itemType.itemType_3 {
  background: rgb(var(--naviViolet));
}

.scShip .itemType.itemType_4 {
  background: #666;
}

.scShip .itemType.itemType_5 {
  background: rgb(var(--naviPink));
}

.scShipNote .osusume{
  font-weight: bold;
  font-size: 1.5rem;
}

.scShip .inPageLinks p {
  margin: 30px auto;
  max-width: var(--contentsWidth);
  text-align: center;
  font-weight: bold;
  color: rgb(var(--naviKoiBlue));
}

.scShip .inPageLinks p span {
  position: relative;
  margin: 0 auto;
  padding-right: 15px;
  display: inline-block;
  font-size: 2rem;
}

.scShip .inPageLinks p span::before {
  content: '';
  top: 50%;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 7px 0 7px;
  border-color: rgb(var(--naviKoiBlue)) rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
  transform: translate(0, -50%);
}

.scShip .inPageLinks ul {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  justify-items: center;
  gap: 3px;
  margin: 0 auto;
  padding: 0 15px;
  max-width: var(--contentsWidth);
}

.scShip .inPageLinks li {
  width: 100%;
  min-height: 30px;
}

.scShip .inPageLinks li a,
.scShip .inPageLinks li span {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 5px 10px;
  height: 100%;
  background: #ccc;
  border: solid 1px #ccc;
  border-radius: 0.5rem;
  font-weight: bold;
  line-height: 1.4;
}

.scShip .inPageLinks li span {
  color: #fff;
}

.scShip .inPageLinks li a {
  padding: 5px 1.75em 5px 10px;
  background: #fff;
  transition: all 0.15s 0s ease;
}

.scShip .inPageLinks li a::before {
  content: '';
  top: 50%;
  right: 0.75em;
  width: 0.6em;
  height: 0.6em;
  border-right: solid 2px rgb(var(--gsGreen));
  border-bottom: solid 2px rgb(var(--gsGreen));
  font-weight: bold;
  transform: translate(0, -50%) rotate(45deg);
  transition: all 0.25s 0s ease;
}


.scShipIntro .itemType_1 {
  background-color: rgb(var(--naviEmerald));
  border-color: rgb(var(--naviEmerald));
}

.scShipIntro .itemType_2 {
  background-color: rgb(var(--naviRed));
  border-color: rgb(var(--naviRed));
}

.scShipIntro .itemType_6 {
  background-color: rgb(var(--ocYellow));
  border-color: rgb(var(--ocYellow));
}

.scShipIntro .itemType_3 {
  background-color: rgb(var(--naviViolet));
  border-color: rgb(var(--naviViolet));
}

.scShipIntro .itemType_4 {
  background-color: #666;
  border-color: #666;
}

.scShipIntro .itemType_5 {
  background-color: rgb(var(--naviPink));
  border-color: rgb(var(--naviPink));
}

.scShip .inPageLinks .itemType_1 {
  border-color: rgb(var(--naviEmerald));
}

.scShip .inPageLinks .itemType_2 {
  border-color: rgb(var(--naviRed));
}

.scShip .inPageLinks .itemType_6 {
  border-color: rgb(var(--ocYellow));
}

.scShip .inPageLinks .itemType_3 {
  border-color: rgb(var(--naviViolet));
}

.scShip .inPageLinks .itemType_4 {
  border-color: #666;
}

.scShip .inPageLinks .itemType_5 {
  border-color: rgb(var(--naviPink));
}

.scShip .inPageLinks .itemType_1::before {
  border-color: rgb(var(--naviEmerald));
}

.scShip .inPageLinks .itemType_2::before {
  border-color: rgb(var(--naviRed));
}

.scShip .inPageLinks .itemType_6::before {
  border-color: rgb(var(--ocYellow));
}

.scShip .inPageLinks .itemType_3::before {
  border-color: rgb(var(--naviViolet));
}

.scShip .inPageLinks .itemType_4::before {
  border-color: #666;
}

.scShip .inPageLinks .itemType_5::before {
  border-color: rgb(var(--naviPink));
}


/* scShipList -----*/
.scShipList {
  margin: 0 auto;
  padding: 0 0 var(--paddingMid);
  max-width: var(--contentsWidth);
}

.scShipTitle {
  margin: 0 auto 30px;
  
}

.scShipTitle p {
  position: relative;
  z-index: 2;
  display: inline-block;
  padding: 0.5em 1.5em;
  background: rgb(var(--naviCream));
  line-height: 1.2;
  border-radius: 2em;
  color: #333;
  text-align: center;
  transform: translate(15px, 10px);
}

.scShipTitle p::before {
  content: '';
  top: 100%;
  left: 30px;
  width: 15px;
  height: 15px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.5 9.57"><path fill="rgba(255,244,153,1)" fill-rule="evenodd" d="M4.12,0C7.17,7.05-1.82,9.2.34,9.5,4.4,10.05,14.23,7.39,16.5,0Z"/></svg>') no-repeat left top;
  background-size: 100% auto;
  transform: scale(-1, 1);
}

.scShipTitle h3 {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  padding: 18px 15px 15px 2em;
  background: #888;
  font-size: 1.8rem;
  line-height: 1.8;
  color: #fff;
  font-weight: bold;
}

.scShipTitle h3::before {
  content: '';
  top: calc(18px + 0.4em);
  left: 1em;
  width: 0.85em;
  height: 0.55em;
  border-left: solid 3px #fff;
  border-bottom: solid 3px #fff;
  transform: rotate(-45deg);
}

.itemType_1 .scShipTitle h3,
.itemType_1 .scShipTitle h3::before {
  background: rgb(var(--naviEmerald));
}

.itemType_2 .scShipTitle h3,
.itemType_2 .scShipTitle h3::before {
  background: rgb(var(--naviRed));
}

.itemType_6 .scShipTitle h3,
.itemType_6 .scShipTitle h3::before {
  background: rgb(var(--ocYellow));
}

.itemType_3 .scShipTitle h3,
.itemType_3 .scShipTitle h3::before {
  background: rgb(var(--naviViolet));
}

.itemType_4 .scShipTitle h3,
.itemType_4 .scShipTitle h3::before {
  background: #666;
}

.itemType_5 .scShipTitle h3,
.itemType_5 .scShipTitle h3::before {
  background: rgb(var(--naviPink));
}

.scShipList ul {
  margin: 0 auto;
  padding: 0 var(--paddingMinMin);  
}

.scShipList ul li {
  background: #fff;
  border-radius: 1rem;
  box-shadow:var(--dropShadowBokashi);}

.scShipList.itemType_1 ul li {
  border-color: rgb(var(--naviEmerald));
}

.scShipList.itemType_2 ul li {
  border-color: rgb(var(--naviRed));
}

.scShipList.itemType_6 ul li {
  border-color: rgb(var(--ocYellow));
}

.scShipList.itemType_3 ul li {
  border-color: rgb(var(--naviViolet));
}

.scShipList.itemType_4 ul li {
  border-color: #666;
}

.scShipList.itemType_5 ul li {
  border-color: rgb(var(--naviPink));
}

.scShipList ul li+li {
  margin-top: 15px;
}

.scShipList ul li h4 {
  cursor: pointer;
  position: relative;
  margin: 0 auto;
  padding: 15px 45px 15px 40px;
  font-size: 1.6rem;
  line-height: 1.2;
  font-weight: bold;
  text-align: left;
}

.scShipList ul li h4::before,
.scShipList ul li h4::after {
  content: '';
  top: 50%;
  right: 10px;
  width: 26px;
  height: 6px;
  background: #999;
  transform: translate(0, -50%);
  transition: all 0.25s 0s ease;
  transform-origin: center;
}

.scShipList ul li h4::after {
  transform: translate(0, -50%) rotate(90deg);
}


.scShipList.itemType_1 h4 {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 53.61 43.83"><path fill="rgba(9,179,204,1)" fill-rule="evenodd" d="M26.86,8.71C16.59-6.95.12.4,0,15.77S26.59,43.83,26.59,43.83s26.9-12.26,27-27.64S37.09-7.07,26.86,8.71Zm5.73,17.34c1.31,0,2,.44,2,1.3s-.65,1.3-2,1.3H29v4c0,1.11-.58,1.66-1.73,1.66s-1.72-.55-1.72-1.66v-4H21.9c-1.31,0-2-.43-2-1.3s.66-1.3,2-1.3h3.62V23.67H21.9c-1.31,0-2-.43-2-1.3s.66-1.29,2-1.29h2l-3.25-5.64a2.9,2.9,0,0,1-.47-1.29c0-.87.53-1.31,1.59-1.31.74,0,1.34.47,1.79,1.41l3.65,7,3.66-7c.45-.94,1.05-1.41,1.79-1.41,1.06,0,1.59.44,1.59,1.31a3,3,0,0,1-.47,1.29l-3.39,5.64h2.17c1.31,0,2,.42,2,1.29s-.65,1.3-2,1.3H29v2.38Z" /></svg>') 10px center / 20px auto no-repeat;
}

.scShipList.itemType_2 h4 {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 53.61 43.83"><path fill="rgba(234,90,90,1)" fill-rule="evenodd" d="M26.86,8.71C16.59-6.95.12.4,0,15.77S26.59,43.83,26.59,43.83s26.9-12.26,27-27.64S37.09-7.07,26.86,8.71Zm5.73,17.34c1.31,0,2,.44,2,1.3s-.65,1.3-2,1.3H29v4c0,1.11-.58,1.66-1.73,1.66s-1.72-.55-1.72-1.66v-4H21.9c-1.31,0-2-.43-2-1.3s.66-1.3,2-1.3h3.62V23.67H21.9c-1.31,0-2-.43-2-1.3s.66-1.29,2-1.29h2l-3.25-5.64a2.9,2.9,0,0,1-.47-1.29c0-.87.53-1.31,1.59-1.31.74,0,1.34.47,1.79,1.41l3.65,7,3.66-7c.45-.94,1.05-1.41,1.79-1.41,1.06,0,1.59.44,1.59,1.31a3,3,0,0,1-.47,1.29l-3.39,5.64h2.17c1.31,0,2,.42,2,1.29s-.65,1.3-2,1.3H29v2.38Z" /></svg>') 10px center / 20px auto no-repeat;
}

.scShipList.itemType_6 h4 {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 53.61 43.83"><path fill="rgba(248,181,81,1)" fill-rule="evenodd" d="M26.86,8.71C16.59-6.95.12.4,0,15.77S26.59,43.83,26.59,43.83s26.9-12.26,27-27.64S37.09-7.07,26.86,8.71Zm5.73,17.34c1.31,0,2,.44,2,1.3s-.65,1.3-2,1.3H29v4c0,1.11-.58,1.66-1.73,1.66s-1.72-.55-1.72-1.66v-4H21.9c-1.31,0-2-.43-2-1.3s.66-1.3,2-1.3h3.62V23.67H21.9c-1.31,0-2-.43-2-1.3s.66-1.29,2-1.29h2l-3.25-5.64a2.9,2.9,0,0,1-.47-1.29c0-.87.53-1.31,1.59-1.31.74,0,1.34.47,1.79,1.41l3.65,7,3.66-7c.45-.94,1.05-1.41,1.79-1.41,1.06,0,1.59.44,1.59,1.31a3,3,0,0,1-.47,1.29l-3.39,5.64h2.17c1.31,0,2,.42,2,1.29s-.65,1.3-2,1.3H29v2.38Z" /></svg>') 10px center / 20px auto no-repeat;
}

.scShipList.itemType_3 h4 {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 53.61 43.83"><path fill="rgba(124,110,188,1)" fill-rule="evenodd" d="M26.86,8.71C16.59-6.95.12.4,0,15.77S26.59,43.83,26.59,43.83s26.9-12.26,27-27.64S37.09-7.07,26.86,8.71Zm5.73,17.34c1.31,0,2,.44,2,1.3s-.65,1.3-2,1.3H29v4c0,1.11-.58,1.66-1.73,1.66s-1.72-.55-1.72-1.66v-4H21.9c-1.31,0-2-.43-2-1.3s.66-1.3,2-1.3h3.62V23.67H21.9c-1.31,0-2-.43-2-1.3s.66-1.29,2-1.29h2l-3.25-5.64a2.9,2.9,0,0,1-.47-1.29c0-.87.53-1.31,1.59-1.31.74,0,1.34.47,1.79,1.41l3.65,7,3.66-7c.45-.94,1.05-1.41,1.79-1.41,1.06,0,1.59.44,1.59,1.31a3,3,0,0,1-.47,1.29l-3.39,5.64h2.17c1.31,0,2,.42,2,1.29s-.65,1.3-2,1.3H29v2.38Z" /></svg>') 10px center / 20px auto no-repeat;
}

.scShipList.itemType_4 h4 {
  background: var(--svgOkaneGray);
  background-position: 10px center;
  background-size: 20px auto;
}

.scShipList.itemType_5 h4 {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 53.61 43.83"><path fill="rgba(245,138,138,1)" fill-rule="evenodd" d="M26.86,8.71C16.59-6.95.12.4,0,15.77S26.59,43.83,26.59,43.83s26.9-12.26,27-27.64S37.09-7.07,26.86,8.71Zm5.73,17.34c1.31,0,2,.44,2,1.3s-.65,1.3-2,1.3H29v4c0,1.11-.58,1.66-1.73,1.66s-1.72-.55-1.72-1.66v-4H21.9c-1.31,0-2-.43-2-1.3s.66-1.3,2-1.3h3.62V23.67H21.9c-1.31,0-2-.43-2-1.3s.66-1.29,2-1.29h2l-3.25-5.64a2.9,2.9,0,0,1-.47-1.29c0-.87.53-1.31,1.59-1.31.74,0,1.34.47,1.79,1.41l3.65,7,3.66-7c.45-.94,1.05-1.41,1.79-1.41,1.06,0,1.59.44,1.59,1.31a3,3,0,0,1-.47,1.29l-3.39,5.64h2.17c1.31,0,2,.42,2,1.29s-.65,1.3-2,1.3H29v2.38Z" /></svg>') 10px center / 20px auto no-repeat;
}

.scShipList ul li h4.minus::before {
  animation: 0.5s 0s linear 1 forwards alternate shinshukuYoko;
}

@keyframes shinshukuYoko {
  0% {
    transform: translate(0, -50%) scale(1, 1);
  }

  50% {
    transform: translate(0, -50%) scale(0, 1);
  }

  100% {
    transform: translate(0, -50%) scale(1, 1);
  }
}


.scShipList ul li h4.minus::after {
  animation: 0.5s 0s linear 1 forwards alternate shinshukuTate;
}

@keyframes shinshukuTate {
  0% {
    transform: translate(0, -50%) rotate(90deg) scale(1, 1);
  }

  100% {
    transform: translate(0, -50%) rotate(90deg) scale(0, 1);
  }
}

.scShipList ul dl {
  display: none;
  margin: 0 auto;
  padding: var(--paddingMinMin) 0;
  border-top: 2px solid rgb(var(--naviEmerald));
  border-radius: 0 0 1rem 1rem;
}

.scShipList.itemType_1 ul dl {
  border-color: rgb(var(--naviEmerald));
}

.scShipList.itemType_2 ul dl {
  border-color: rgb(var(--naviRed));
}

.scShipList.itemType_6 ul dl {
  border-color: rgb(var(--ocYellow));
}

.scShipList.itemType_3 ul dl {
  border-color: rgb(var(--naviViolet));
}

.scShipList.itemType_4 ul dl {
  border-color: #666;
}

.scShipList.itemType_5 ul dl {
  border-color: rgb(var(--naviPink));
}

.scShipList ul dt {
  margin: 0 auto;
  padding: 0 var(--paddingMinMin);
  font-size: 1.6rem;
  line-height: 1.2;
  font-weight: bold;
  text-align: left;
}

.scShipList.itemType_1 ul dt {
  color: rgb(var(--naviEmerald));
}

.scShipList.itemType_2 ul dt {
  color: rgb(var(--naviRed));
}

.scShipList.itemType_6 ul dt {
  color: rgb(var(--ocYellow));
}

.scShipList.itemType_3 ul dt {
  color: rgb(var(--naviViolet));
}

.scShipList.itemType_4 ul dt {
  color: #666;
}

.scShipList.itemType_5 ul dt {
  color: rgb(var(--naviPink));
}

.scShipList ul dd {
  margin: 0 auto var(--paddingMinMin);
  padding: 10px var(--paddingMinMin);
  font-size: 1.3rem;
  line-height: 1.8;
  text-align: left;
}

.scShipIntro .scShipList {
  margin: 0 10px 30px;
  background: #fff;
  border-top: 1px solid rgb(var(--gsGreen));
  border-bottom: 1px solid rgb(var(--gsGreen));
}

.scShipIntro .scShipList li+li {
  border-top: 1px solid rgb(var(--gsGreen));
}

.scShipIntro .scShipList li a {
  position: relative;
  display: grid;
  align-items: center;
  grid-template-columns: 100%;
  gap: 5px;
  padding: 0 20px 10px 15px;
  min-height: 40px;
}

.scShipIntro .scShipList li a::before {
  content: '';
  top: 50%;
  right: 10px;
  width: 0.75em;
  height: 0.75em;
  border-bottom: solid 2px rgb(var(--gsGreen));
  border-right: solid 2px rgb(var(--gsGreen));
  transform: translate(0, -50%) rotate(-45deg);
}

.scShipIntro .scShipList li .itemType {
  transform: translate(0, -1px);
}

.scShipIntro .scShipList li h5 {
  position: relative;
  padding-left: 2em;
  background: var(--svgOkaneGray);
  background-position: left center;
  background-size: auto 1em;
  font-size: 1.6rem;
  line-height: 1.2;
}


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

  /* -------------------------
  /* for pc
  --------------------------*/
  .scShipIntro {
    padding: 60px 0;
  }

  .scShip .inPageLinks {
    grid-template-columns: repeat(6, 1fr);
  }

  .scShip .inPageLinks a:hover {
    transform: translate(0, 5px);
    opacity: 1;
  }

  .scShipNote {
    padding: var(--paddingMinMin);
  }

  .scShipTitle {
    padding: 0;
  }

  .scShipList ul dl {
    padding: var(--paddingMinMin);
  }

  .scColumn .generalBtn {
    margin: 0 auto;
  }
}