@charset "UTF-8";
@import url(./common.css);
/*==================================================================*/
/* style css　*/
/*==================================================================*/
.sub-t h2 {
  padding: 0 1.8em;
  display: inline-block;
  background-image: url("../activity/image/t_kira01.png"), url("../activity/image/t_kira02.png");
  background-position: top left, bottom right;
  background-repeat: no-repeat, no-repeat;
}

.base {
  margin-bottom: 4em;
}
.base .box-t {
  padding-bottom: 1em;
  margin-bottom: 3em;
  background: url("../activity/image/line_box-t.gif") repeat-x 100% 100%;
}
.base .box-t h3 {
  padding-left: 3em;
  font-weight: bold;
  background: url("../activity/image/ic_flag.gif") no-repeat 15px 0;
  font-size: 1.4em;
}
.base .inner {
  width: 95%;
  margin: 0 auto;
}

table th {
  padding: 10px 20px;
  font-weight: bold;
  border: 1px solid white;
  background: #dff4fd;
  text-align: center;
  vertical-align: middle;
}
table td {
  padding: 10px 20px;
  border: 1px solid white;
  background: #fafafa;
}

.about {
  margin-bottom: 5em;
  background: url("../support/image/about_bg.jpg") no-repeat center center;
  background-size: cover;
}
.about .inblock {
  position: relative;
  padding: 5em 0;
}
.about .inblock h2 {
  margin-bottom: 3rem;
  text-align: center;
  font-weight: bold;
  font-size: 1.6rem;
}
.about .inblock .read {
  text-align: center;
  line-height: 2;
}
.about .inblock .illust {
  position: absolute;
  right: 3em;
  bottom: -2em;
}

.policy h2 {
  margin-bottom: 3rem;
  text-align: center;
  font-weight: bold;
  font-size: 1.6rem;
}
.policy .read {
  margin-bottom: 3em;
  text-align: center;
  line-height: 2;
}
.policy .policy-photo {
  margin-bottom: 8em;
}
.policy .policy-photo ul {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 0 1.5em;
}
.policy .policy-block {
  position: relative;
  margin-bottom: 12em;
  padding: 0 4em;
  background: url("../support/image/paper_bg.gif") repeat-y top center;
  background-size: 100% auto;
}
.policy .policy-block:before {
  position: absolute;
  top: -65px;
  left: 0;
  width: 100%;
  height: 87px;
  background: url("../support/image/paper_bg_top.gif") no-repeat;
  content: "";
  display: inline-block;
  background-size: contain;
  z-index: -1;
}
.policy .policy-block:after {
  position: absolute;
  bottom: -80px;
  left: 0;
  width: 100%;
  height: 87px;
  background: url("../support/image/paper_bg_bottom.gif") no-repeat;
  content: "";
  display: inline-block;
  background-size: contain;
  z-index: -1;
}
.policy .policy-block h3 {
  margin-bottom: 2em;
  text-align: center;
}
.policy .policy-block .list-area {
  padding: 3em 2em;
  background: #fff;
  display: flex;
  justify-content: space-between;
}
.policy .policy-block .list-area .text-area {
  width: 44%;
}
.policy .policy-block .list-area .text-area .leaf {
  text-align: center;
  line-height: 0;
}
.policy .policy-block .list-area .text-area ul {
  margin: 2em 0;
}
.policy .policy-block .list-area .text-area ul li {
  padding: 1em 1em 1em 1.5em;
  border-top: 1px dashed #008ce7;
  text-indent: -1em;
}
.policy .policy-block .list-area .text-area ul li:last-child {
  border-bottom: 1px dashed #008ce7;
}
.policy .policy-block .list-area .text-area ul li:before {
  content: "・";
}
.policy .policy-block .list-area .photo-area {
  width: 53%;
}
.policy .policy-block .list-area .photo-area ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1em 2%;
}
.policy .policy-block .list-area .photo-area ul li span {
  display: block;
  font-size: .75rem;
  text-align: center;
  line-height: 1.4;
  font-feature-settings: "palt";
}
.policy .policy-block .list-area .photo-area ul li.long {
  width: 68.5%;
}
.policy .policy-block .list-area .photo-area ul li.small {
  width: 29.5%;
}

.schedule .schedule-block {
  margin-bottom: 5em;
  display: flex;
  justify-content: space-between;
}
.schedule .schedule-block .list-area {
  width: 35%;
  position: relative;
}
.schedule .schedule-block .list-area dl {
  display: flex;
  padding: .5em;
  font-size: 1rem;
}
.schedule .schedule-block .list-area dl:nth-child(odd) {
  background: #f4fbe3;
}
.schedule .schedule-block .list-area dl dt {
  width: 25%;
  text-align: center;
  font-weight: bold;
}
.schedule .schedule-block .list-area dl dd {
  width: 75%;
}
.schedule .schedule-block .list-area .illust {
  position: absolute;
  right: -2em;
  bottom: -2em;
}
.schedule .schedule-block .photo-area {
  width: 60%;
  flex-wrap: wrap;
}
.schedule .schedule-block .photo-area ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1em 2%;
}
.schedule .schedule-block .photo-area ul li {
  width: 49%;
  line-height: 0;
}
.schedule .activity {
  padding: 3em;
  background: #fffaf1;
}
.schedule .activity h4 {
  margin-bottom: 1em;
  text-align: center;
  font-weight: bold;
  font-size: 1.2rem;
}
.schedule .activity .activity-in {
  padding: 2em;
  background: #fff;
}
.schedule .activity .activity-in .list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 1em;
  margin-bottom: 2em;
}
.schedule .activity .activity-in .list li:after {
  content: "/";
  padding-left: 1em;
}
.schedule .activity .activity-in .read {
  margin-bottom: 3em;
  text-align: center;
}
.schedule .activity .activity-in .photo-area ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 4%;
}
.schedule .activity .activity-in .photo-area ul li {
  width: 46%;
  text-align: center;
}
.schedule .activity .activity-in .photo-area ul li:first-child {
  padding-right: 4%;
  border-right: 1px dashed #008ce7;
}

.flow .step-list {
  display: flex;
  justify-content: space-between;
  gap: 0 3%;
  text-align: center;
}
.flow .step-list dl {
  width: 22%;
  position: relative;
}
.flow .step-list dl:after {
  position: absolute;
  content: "\f105";
  font-family: "FontAwesome";
  top: 50%;
  right: -23px;
  transform: translate(0%, -50%);
  -webkit-transform: translate(0%, -50%);
  font-size: 2rem;
}
.flow .step-list dl:last-child:after {
  display: none;
}
.flow .step-list dl dt {
  position: relative;
  bottom: -1em;
  z-index: 1;
  display: inline-block;
  padding: 0.7rem 0.5rem 0.5rem;
  background: #008ce7;
  color: #fff;
  font-weight: bold;
  border-radius: 100px;
  line-height: 1;
  font-size: .9rem;
}
.flow .step-list dl dt span {
  padding: 0 0 3px 0;
  font-size: 1.4rem;
  vertical-align: middle;
  line-height: .5;
  margin-left: 3px;
}
.flow .step-list dl dd.icon {
  position: relative;
  margin-bottom: .5em;
  width: 160px;
  height: 160px;
  border-radius: 100px;
  background: #ebf7ff;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0%);
  -webkit-transform: translate(-50%, 0%);
  text-align: center;
}
.flow .step-list dl dd.icon p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  line-height: 0;
  width: 100%;
}
.flow .step-list dl dd.text {
  font-size: 1.2rem;
  font-weight: bold;
}

.guidance table {
  width: 100%;
}

.price .read {
  margin-bottom: 2em;
}
.price .box {
  margin-bottom: 3em;
}
.price .box .sb {
  font-weight: bold;
}
.price .box table th {
  width: 20%;
}
.price .box table td {
  text-align: center;
}
.price .box table .price {
  text-align: right;
}
.price .box.limit table {
  width: 40%;
}
.price .box.limit table th {
  width: 60%;
}
.price .box.limit table td {
  width: 40%;
}

/*===========================================================================*/
/*  media quary:1000px  */
/*===========================================================================*/
@media screen and (max-width: 1000px) {
  .about .inblock h2 {
    margin-bottom: 2rem;
    font-size: 1.4rem;
  }
  .about .inblock .illust img {
    width: 70px;
  }

  .policy h2 {
    margin-bottom: 2rem;
    font-size: 1.4rem;
  }
  .policy .policy-block {
    margin-bottom: 12em;
    padding: 0 3em;
  }
  .policy .policy-block:before {
    top: -50px;
  }
  .policy .policy-block .list-area {
    padding: 2em 1.5em;
  }
  .policy .policy-block .list-area .text-area {
    width: 44%;
  }
  .policy .policy-block .list-area .text-area ul {
    margin: 1em 0;
  }
  .policy .policy-block .list-area .text-area ul li {
    padding: 0.5em 0.5em 0.5em 1em;
  }

  .schedule .schedule-block .list-area {
    width: 40%;
  }
  .schedule .schedule-block .list-area dl {
    font-size: .9rem;
  }
  .schedule .schedule-block .photo-area {
    width: 57%;
    flex-wrap: wrap;
  }
  .schedule .schedule-block .photo-area ul {
    gap: 0.5em 2%;
  }
  .schedule .activity {
    padding: 2em;
  }
  .schedule .activity h4 {
    font-size: 1.1rem;
  }
  .schedule .activity .activity-in {
    padding: 1.5em;
  }
  .schedule .activity .activity-in .read {
    margin-bottom: 2em;
  }

  .flow .step-list dl:after {
    right: -20px;
  }
  .flow .step-list dl dt {
    font-size: .8rem;
    padding: 0.7rem 0.5rem 0.5rem;
  }
  .flow .step-list dl dt span {
    font-size: 1.4rem;
  }
  .flow .step-list dl dd.icon {
    width: 120px;
    height: 120px;
  }
  .flow .step-list dl dd.icon p img {
    max-height: 50px;
  }
  .flow .step-list dl dd.text {
    font-size: 1rem;
  }

  .price .box.limit table {
    width: 50%;
  }
}
/*===========================================================================*/
/*  media quary:767px  */
/*===========================================================================*/
@media screen and (max-width: 767px) {
  .base .box-t {
    margin-bottom: 1.5em;
    background-size: 5%;
  }
  .base .box-t h3 {
    padding-left: 3em;
    font-size: 1.2em;
    background-position: 10px 0;
  }

  table {
    width: 100%;
  }
  table th {
    width: 25%;
  }

  .about {
    margin-bottom: 3em;
  }
  .about .inblock {
    padding: 3em 0;
  }
  .about .inblock h2 {
    margin-bottom: 1.5rem;
    font-size: 1.2rem;
  }
  .about .inblock .read {
    text-align: left;
  }
  .about .inblock .illust {
    right: 0;
  }

  .policy h2 {
    margin-bottom: 1.5rem;
    font-size: 1.2rem;
  }
  .policy .read {
    margin-bottom: 1em;
    text-align: left;
  }
  .policy .policy-photo {
    margin-bottom: 5em;
  }
  .policy .policy-block {
    margin-bottom: 6em;
    padding: 0 2em;
  }
  .policy .policy-block:before {
    top: -30px;
  }
  .policy .policy-block .list-area {
    display: block;
  }
  .policy .policy-block .list-area .text-area {
    width: 100%;
    margin-bottom: 2.5em;
  }
  .policy .policy-block .list-area .photo-area {
    width: 100%;
  }
  .policy .policy-block .list-area .photo-area ul {
    max-width: 500px;
    margin: 0 auto;
  }
  .policy .policy-block .list-area .photo-area ul li {
    text-align: center;
  }

  .schedule .schedule-block {
    margin-bottom: 3em;
  }
  .schedule .schedule-block .list-area {
    width: 60%;
  }
  .schedule .schedule-block .list-area .illust img {
    width: 50px;
  }
  .schedule .schedule-block .photo-area {
    width: 37%;
  }
  .schedule .schedule-block .photo-area ul {
    display: block;
  }
  .schedule .schedule-block .photo-area ul li {
    width: 100%;
    margin-bottom: .5em;
  }
  .schedule .activity {
    padding: 1.5em;
  }
  .schedule .activity h4 {
    font-size: 1rem;
  }
  .schedule .activity .activity-in {
    padding: 1em;
  }
  .schedule .activity .activity-in .list {
    margin-bottom: 1em;
    justify-content: flex-start;
    gap: 0 0.5em;
  }
  .schedule .activity .activity-in .list li:after {
    padding-left: .5em;
  }
  .schedule .activity .activity-in .read {
    margin-bottom: 1em;
    text-align: left;
  }
  .schedule .activity .activity-in .photo-area ul li {
    width: 48%;
  }

  .flow .step-list dl:after {
    top: 43px;
    right: -12px;
    font-size: 1.2rem;
    transform: none;
  }
  .flow .step-list dl dt {
    padding: 0.4rem 0.5rem 0.4rem;
    font-size: .6rem;
  }
  .flow .step-list dl dt span {
    font-size: .9rem;
  }
  .flow .step-list dl dd.icon {
    width: 75px;
    height: 75px;
  }
  .flow .step-list dl dd.icon p img {
    max-height: 30px;
  }
  .flow .step-list dl dd.text {
    font-size: .85rem;
  }

  .price .box.limit table {
    width: 70%;
  }
}
/*===========================================================================*/
/*  media quary:479px  */
/*===========================================================================*/
@media screen and (max-width: 479px) {
  table {
    font-size: .7rem;
  }
  table th {
    padding: 7px;
  }
  table td {
    padding: 7px;
  }

  .about .inblock {
    padding: 3em 0;
  }
  .about .inblock h2 {
    margin-bottom: 1.5rem;
    font-size: 1rem;
  }
  .about .inblock .illust img {
    width: 55px;
  }

  .policy h2 {
    margin-bottom: 1.5rem;
    font-size: 1rem;
  }
  .policy .read {
    margin-bottom: 1rem;
  }
  .policy .policy-photo {
    margin-bottom: 3em;
  }
  .policy .policy-photo ul {
    gap: 0 0.5em;
  }
  .policy .policy-block {
    margin-bottom: 5em;
    padding: 1em 1.5em;
  }
  .policy .policy-block:before {
    top: -15px;
  }
  .policy .policy-block h3 {
    margin-bottom: .5em;
  }
  .policy .policy-block .list-area {
    padding: 1.5em 1em;
  }
  .policy .policy-block .list-area .photo-area ul li span {
    text-align: left;
    font-size: .6rem;
  }

  .schedule .schedule-block {
    display: block;
  }
  .schedule .schedule-block .list-area {
    width: 100%;
    margin-bottom: 2.5em;
  }
  .schedule .schedule-block .list-area dl {
    font-size: .8rem;
  }
  .schedule .schedule-block .list-area .illust {
    right: 0;
    bottom: -2em;
  }
  .schedule .schedule-block .photo-area {
    width: 100%;
  }
  .schedule .schedule-block .photo-area ul {
    display: flex;
    gap: 0 2%;
  }
  .schedule .schedule-block .photo-area ul li {
    width: 49%;
    margin-bottom: .5em;
  }
  .schedule .activity {
    padding: 1em;
  }
  .schedule .activity .activity-in {
    padding: 1em;
  }
  .schedule .activity .activity-in .list {
    margin-bottom: 1em;
  }
  .schedule .activity .activity-in .read {
    margin-bottom: 1em;
  }
  .schedule .activity .activity-in .photo-area ul li {
    width: 48%;
  }

  .flow .step-list dl:after {
    top: 37px;
    right: -9px;
    font-size: 1rem;
  }
  .flow .step-list dl dt {
    padding: 0.4rem 0.3rem 0.4rem;
    font-size: .4rem;
    bottom: -.5em;
  }
  .flow .step-list dl dt span {
    font-size: .7rem;
    margin-left: 1px;
  }
  .flow .step-list dl dd.icon {
    width: 50px;
    height: 50px;
  }
  .flow .step-list dl dd.icon p img {
    max-height: 22px;
  }
  .flow .step-list dl dd.text {
    font-size: .75rem;
    line-height: 1.4;
  }

  .price .box {
    margin-bottom: 2em;
  }
  .price .box.limit table {
    width: 100%;
  }
}