@charset "utf-8";
@import url("https://fonts.googleapis.com/css?family=Kosugi+Maru&display=swap");
@import url("https://fonts.googleapis.com/css?family=Nunito:900&display=swap&text=0123456789STAR.");
/*
font-family: 'Kosugi Maru', sans-serif;
font-family: 'Nunito', sans-serif;
*/

.contents {
  padding-top: 0 !important;
}

.in1100 {
  font-family: "Kosugi Maru", sans-serif;
  -webkit-transform: scale(1.00001, 1);
  -moz-transform: scale(1.00001, 1);
  -ms-transform: scale(1.00001, 1);
  -o-transform: scale(1.00001, 1);
  transform: scale(1.00001, 1);
}

.main-visual {
  position: relative;
  width: 100%;
  height: 600px;
  background-image: url("./img/mv.jpg");
  background-size: cover;
  background-position: center;
}
.main-visual-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 2rem;
  font-weight: bold;
  text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
}

.text-box {
  padding: 15px 7px;
  font-size: 16px;
}
.text-box p {
  margin-top: 15px;
}

/* タブ */
.tab-wrap input[type="radio"] {
  display: none;
}
.tab-wrap label {
  display: inline-block;
  padding: 10px 50px;
  cursor: pointer;
  background: #fafafa;
  border: 1px solid #ccc;
  margin-right: -8px;
}
.tab-wrap input#tab1:checked ~ label[for="tab1"],
.tab-wrap input#tab2:checked ~ label[for="tab2"] {
  background: rgba(71,114,88);
  border-bottom: none;
  color: #fafafa;
}
.tab-content {
  display: none;
}
#tab1:checked ~ #content1,
#tab2:checked ~ #content2 {
  display: block;
}

/* テーブル */
table.guide-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  margin-bottom: 25px;
}
.guide-table th,
.guide-table td {
  border: 1px solid #ccc;
  padding: 10px;
  vertical-align: top;
  text-align: center;
  word-wrap: break-word;
}
.contents .guide-table th {
  background-color: #84c27a;
  color: white;
  font-weight: normal;
  padding: 5px 3px;
}
.guide-table img {
  width: 80px;
  height: auto;
  border-radius: 5px;
}
.guide-table a {
  display: block;
  margin: 2px 0;
  color: #0073aa;
}
.guide-table a:hover {
  color: #84c27a;
}
.number {
  width: 5%;
}
.introduction {
  width: 42%;
}
td p {
  text-align: left;
}

a.detail_btn {
	display: flex;
    justify-content: space-evenly;
    align-items: center;
	text-align: center;
	text-decoration: none;
	margin: auto;
	padding: 3px;
	background: #27acd9;
	color: #fff;
	border-radius: 100vh;
	position: relative;
	transition: 0.5s;
}
a.detail_btn::before {
	content: '';
	width: 7px;
	height: 7px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(45deg);
}
a.detail_btn:hover {
	background: #44c6f2;
	color: #fff;
}

.guidebtn a{
  width: 50%;
  margin-bottom: 15px;
}

@media screen and (max-width: 768px) {
  .main-visual{
    height: 450px;
  }
  .main-visual-text{
    width: 80%;
  }
}
@media screen and (max-width: 425px) {
  .main-visual{
    background-image: url("./img/mv_sp.jpg");
  }
  .main-visual-text {
    width: 96%;
}
    /* spではスクロール */
    .table-scroll {
      overflow-x: auto;
    }
    table.guide-table {
      width: 225%;
      margin-bottom: 0;
    }

    .guidebtn a{
      margin-top: 15px;
    }
}