@charset "utf-8";
/* =======================================================
* max-width: 900px
* ======================================================= */
@media screen and (max-width: 900px) {
	#gnavi ul li {
		font-size: 12px;
		font-weight: normal;
		padding: 5px 8px;
	}

	#gnavi ul li::after {
		display: none;
	}

}

/* =======================================================
* max-width: 770px
* ======================================================= */
@media screen and (max-width: 770px) {
	html, body {
		min-width: 375px;
	}

	body {
		font-size: 1.3rem;
	}

	/* footer */
	footer {
		padding-right: 6%;
		padding-left: 6%;
	}

	.footer-inner {
		padding-bottom: 50px;
	}

	.go-to-top {
		position: absolute;
		right: 20px;
		bottom: 0;
	}

	.go-to-top a {
		pointer-events: auto;
		opacity: 1;
	}

	.dt-br {
		display: none;
	}

	.intro {
		padding-right: 0;
		padding-left: 0;
	}

	.intro-block h1 {
		margin-top: -30px;
	}

	.intro-block p {
		margin-top: 40px;
	}

	.contents,
	.example,
	.price,
	.contact {
		padding-right: 6%;
		padding-left: 6%;
	}

	.example-item:not(:first-of-type) {
		margin-top: 50px;
	}

	.example-block th,
	.example-block td {
		width: 100%;
		display: block;
		padding: 10px 0;
	}

	.accordion-title {
		padding: 15px;
	}

	.category {
		font-size: 14px;
	}

	.accordion-title::after {
		right: 3%;
	}

	.accordion-content p::before {
		top: 35%;
	}

	.accordion-content {
		padding: 15px;
		margin-bottom: 8%;
	}

	.accordion-content ul li {
		display: block;
		border-bottom: 1px solid #C0C6C9;
		padding: 10px 0;
	}

	.accordion-content ul li:not(:last-of-type) {
		padding-bottom: 10px;
	}

	.accordion-inner {
		width: 33.3333%
	}

	.contact-form-item input,
	.check-list p input,
	.contact-form-item select,
	textarea {
		padding: 5px;
	}

	.address input:first-of-type,
	.address input:nth-of-type(2),
	.age input,
	.family input {
		width: 20%;
	}

	.check-list.hope label {
		padding-right: 0;
	}

	textarea {
		width: 100%;
	}

}

/* =======================================================
* max-width: 576px
* ======================================================= */
@media screen and (max-width: 576px) {
    body {
      font-size: 1.2rem;
    }

		/* footer */
		footer {
      padding-right: 7%;
      padding-left: 7%;
    }

		.go-to-top img {
      width: 10px;
      height: auto;
    }

		.footer-logo {
      width: 75px;
    }

		#gnavi.container {
			margin-top: 40px;
			padding: 0 7%;
		}

		#gnavi ul {
			padding-bottom: 0;
		}

		.container {
			padding: 0 7% 32px;
		}

		.section-head {
			padding-top: 32px;
		}

		.section-head h2 span:first-of-type {
      font-size: 26px;
    }

		.section-head h2 span:last-of-type {
      margin-top: 10px;
    }

		.summary {
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
    }

		.section-body {
			margin-top: 32px;
		}

		.lead {
      line-height: 2;
    }

		.lead-annotation {
      margin-top: 1em;
    }

		.intro-block h1 {
      width: 250px;
      margin-top: 0rem;
    }

		.intro-block p {
      margin-top: 20px;
      font-size: 1.2rem;
      line-height: 2.3;
    }

		.concept-text {
      line-height: 2;
    }

		.point-details-item+.point-details-item {
      margin-top: 100px;
    }

		.package-item p {
			font-size: 1.4rem;
		}

		.package-plan-annotation {
      margin-top: 25px;
    }

		.price-annotation {
      width: auto;
    }

		.price-annotation-body dl {
      padding-top: 1.1em;
      padding-bottom: 1.1em;
      border-bottom: 1px solid #000;
    }

    .price-annotation-body dl:first-child {
      border-top: 1px solid #000;
    }

		.price-annotation-body dl dd {
      width: 115px;
    }

		.price-annotation-foot {
      padding: 0 .5em;
      margin-top: 25px;
    }

		.flow-item {
      padding-bottom: 30px;
    }

    .flow-item::before {
      left: 22px;
    }

    .flow-item:last-child::after {
      position: absolute;
      bottom: 0;
      left: 22.5px;
      display: block;
      width: 6px;
      height: 6px;
      content: "";
      background: #F8F8F8;
      border: 1px solid #000;
      border-radius: 50%;
      -webkit-transform: translate(-50%, 50%);
      transform: translate(-50%, 50%);
    }

		.flow-block {
      padding-top: 15px;
      padding-left: 70px;
    }

		.flow-block h3 {
      font-size: 1.2rem;
    }

		.flow-number {
      position: absolute;
      top: 0;
      left: 0;
    }

    .flow-number span {
      width: 44px;
      height: 44px;
      font-size: 1.7rem;
    }

		.flow-block::after {
			bottom: -23%;
		}

		.flow-text {
      margin-top: 1em;
    }

		.flow-annotation {
      padding: 40px 7%;
    }

		.contact-btn a,
		.submit,
		.back  {
      padding: 1em 5em;
      font-size: 1.2rem;
    }

		.contact-btn a {
			width: 100%;
		}

		.contact-foot {
      margin-top: 100px;
    }

		/* アニメーション */
		[data-animate][fade-in-up] {
      -webkit-transform:translateY(1.8vh);
      transform: translateY(1.8vh);
    }

		.ie [data-animate][fade-in-up] {
      -webkit-transform:none;
      transform: none;
    }

		[data-animate=active][fade-in-up] {
      -webkit-transform:translateY(0);
      transform: translateY(0);
    }

}