@charset "utf-8";
@media screen and (max-width: 1024px) {
  /*---- 共通　----*/
 .sp-onry {
  display: none;
 }
 .ipad-onry {
  display: none;
 }
 .pc-onry {
  display: none;
 }
 .pc-none {
  display: block;
 }
 /*---- nav ----*/
 .page .nav-logo img {
  margin: 10px 0 10px 20px;
 }
 /*---- 見出し ----*/
 .inner h2 img {
  width: 33%;
 }
 .container h2 img {
  width: 21%;
 }
.page  h1 {
  font-size: 25px;
 }
 h3{
  font-size: 21px;
 }
 p {
  font-size: 18px;
 }
 /*---- btn ----*/
 .btn-push {
  font-size: 16px;
  padding: 15px 40px;
 }
 /*---------------------
  index
 ----------------------*/
 /*---- main-slider ----*/
 .main-slider {
  height: 85vh;
 }
 .info-box {
  text-align: center;
  padding: 10px 0;
 }
 .info-box p {
  font-size: 20px;
  line-height: 1.5;
  text-align: center;
 }
 .info-box .message {
  padding: 5px 0 0 100px;
 }
.info-box img {
  width: 70%;
  padding: 0 120px 0 0;
 }
 .info-box .time {
  font-size: 17px;
  padding: 0 120px 0 0;
 }
 /* nav */
 .top-logo {
  padding-left: 40px;
 }
 .nav-menu {
  padding-right: 20px;
 }
 .nav-menu nav li a {
  font-size: 18px;
 }
 /* illust */
 .top-main-point.left {
  left: 10px;
 }
 .top-main-point.right {
  right: 10px;
 }
 /*---- #TOP-CONCEPT ----*/
 #TOP-CONCEPT {
  padding: 70px 0;
 }
 /* illust */
 #TOP-CONCEPT .container h2 img {
  width: 70%;
 }
 #TOP-CONCEPT .Colum3 {
  justify-content: center;
 }
 .balloon {
  width: 30%;
  margin: 0 0 60px 0;
 }
 .cloud {
  width: 15%;
  margin: 50px 0 90px 20px;
 }
 .butterfly {
  margin: 0 0 0 70px;
 }
 #TOP-CONCEPT .Column2 {
  padding: 0 40px;
 }
 #TOP-CONCEPT .Column2 h3 {
  margin-bottom: 20px;
 }
 #TOP-CONCEPT p {
  font-size: 18px;
  padding: 0 20px;
 }
 /*---- #TOP-CONCEPT ----*/
 #TOP-POINT .Column2, #TOP-POINT .Column3 {
  text-align: center;
 }
 #TOP-POINT .Column2 img, #TOP-POINT .Column3 img {
  width: 70%;
 }
 #TOP-POINT p {
  text-align: left;
 }
 #TOP-POINT .Column2 {
  padding: 0 70px;
 }
 #TOP-POINT .Column3 {
  padding: 0 8px;
 }
 /*---- #COMPANY ----*/
 #COMPANY {
  padding: 60px 0;
 }
 #COMPANY .inner {
  width: 90%;
 }
 #COMPANY th {
  font-size: 16px;
 }
 #COMPANY td {
  font-size: 18px;
 }
 .company-protect p {
  font-size: 16px;
 }
 /*---- #CONTACT-INFO ----*/
 #CONTACT-INFO h2 img {
  width: 70%;
 }
 .info-tel h3, .info-form h3 {
  font-size: 21px;
 }
 /*---- #SLIDER ----*/
 #SLIDER .container h2 img {
  width: 18%;
 }
 .photo-gallery {
  padding: 0 60px;
 }
 .slick-prev {
  left: 20px;
 }
 .slick-next {
  right: 20px;
 }
 .photo-card {
  box-shadow: 0 0 8px -6px rgb(104 47 35 / 50%);
 }
 .photo-card img {
  padding: 10px;
  border-radius: 20px;
 }
 .photo-card p {
  font-size: 14px;
  padding: 10px 0 20px;
 }
 /*---------------------
  about
 ----------------------*/ 
 /*---- #CONCEPT ----*/
 #CONCEPT p {
 font-size: 20px;
 }
 /*---- #POLICY ----*/
 #POLICY p.note {
  font-size: 18px;
 }
 #POLICY .Column2 {
  padding: 0 30px
 }
 /*---- #POINT ----*/
 #POINT .inner {
  padding: 0 80px;
 }
 #POINT .inner h2 img {
  width: 25%;
 }
 #POINT .Column3_1 img {
  width: 85%;
 }
 .point-1 .Column3_1, .point-3 .Column3_1, .point-5 .Column3_1 {
  text-align: right;
 }
 .point-2 .Column3_1, .point-4 .Column3_1 {
  text-align: left;
 }
 #POINT .row {
  margin-bottom: 70px;
 }
 /*---------------------
  inside
 ----------------------*/ 
 /*---- #GALLERY ----*/
 #GALLERY .inner h2 img {
  width: 20%;
 }
 /*---- #TODAY ----*/
 #TODAY .inner {
  padding: 0 40px;
 }
 #TODAY .fukidashi span {
  font-size: 18px;
 }
 .time {
  font-size: 13px;
 }
 .activities {
  font-size: 16px;
 }
 /*---------------------
  contact
 ----------------------*/
 /*---- #FORM ----*/
 #FORM .inner h2 img {
  width: 20%;
 }
 .form-message {
  margin-bottom: 50px;
 }
 #FORM table {
  width: 90%;
  margin: 0 auto 80px;
 }
 #FORM .contact-form th {
  font-size: 17px;
 }
 #FORM .submit {
  font-size: 16px;
 }
 /*---- #FAQ ----*/
 #FAQ {
  padding: 140px 0 70px;
 }
 #FAQ .inner h2 img {
  width: 20%;
 }
 #FAQ .title {
  font-size: 18px;
  padding: 15px;
 }
 img.question, img.anser {
  width: 30px;
 }
 .option {
  margin-bottom: 20px;
 }
  table.faq-table {
  font-size: 14px;
 }
 /*---------------------
  privacy
 ----------------------*/
 #PRIVACY .inner {
  padding: 0 40px;
 }
 .policy-text p {
  font-size: 16px;
 }
}

@media screen and (max-width: 926px) {
 /*---- 共通 ----*/
 .ipad-onry {
  display: block;
 }
 /*---- none ----*/
 .page-main-img {
  height: 18vh;
 }
 /*---- 見出し ----*/
 .container h2 img {
  width: 30%;
 }
 /*---- header ----*/
 .header-logo-menu {
  display: none;
 }
 /*---- footer ----*/
 footer nav li {
  flex: 0 0 calc(100% / 4);
 }
 /*---- ToTOP ----*/
 .ToTOP, #ToTOP {
  width: 18%;
  right: 30px;
 }
 /*---------------------
  index
 ----------------------*/
 /*---- main-slider ----*/
 .main-slider {
  height: 80vh;
 }
 .nav-menu li {
  text-align: center;
  padding: 0 13px;
 }
 #TOP-CONCEPT .row {
  margin: 0;
 }
 #TOP-CONCEPT .Column3 {
  max-width: calc(98% / 3);
 }
 .top-info .ipad-none {
  display: none;
 }
 .info-box .message, .info-box .time, .info-box img {
  padding: 0;
 }
 .info-box img {
  width: 50%;
  padding: 5px 0;
 }
 .top-main-point {
  width: 25%;
 }
 /*---- #TOP-CONCEPT ----*/
 #TOP-CONCEPT .container h2 img {
  width: 100%;
  padding-left: 10px;
 }
 .balloon {
  margin: 0 0 70px 0;
 }
 .cloud {
  margin: 60px 0 90px 20px;
 }
 .butterfly {
  margin: 30px 0 0 90px;
 }
 /*---- #TOP-POINT ----*/
 #TOP-POINT .Column2 img, #TOP-POINT .Column3 img {
  width: 90%;
 }
 /*---- #COMPANY ----*/
 #COMPANY .inner {
  padding: 40px;
 }
 #COMPANY .Column2 {
  flex: 0 0 100%;
  max-width: 100%;
 }
 #COMPANY .ipad-none {
  display: none;
 }
 #COMPANY th, #COMPANY td {
  display: revert;
  border-bottom: 2px dashed #c8b7a7;
 }
 #COMPANY th {
  font-size: 18px;
  width: 30%;
  padding: 0 0 0 70px;
  vertical-align: middle;
  }
 #COMPANY td {
  padding: 20px 0 20px 20px;
  width: 70%;
 }
 .company-protect {
  padding: 40px 80px;
  margin-bottom: 40px;
 }
 /*---------------------
  about
 ----------------------*/
 /*---- #POINT ----*/
 #POINT .inner h2 img {
  width: 38%;
 }
 #POINT .inner {
  padding: 0 20px;
 }
 #POINT .Column3_1 {
  flex: 0 0 28%;
  max-width: 28%;
 }
 #POINT .Column3_1 img {
  width: 100%;
 }
 #POINT .Column3_2 {
  flex: 0 0 72%;
  max-width: 72%;
 }
 .point-1 .Column3_2, .point-3 .Column3_2, .point-5 .Column3_2 {
  padding-left: 20px;
 }
 .point-2 .Column3_2, .point-4 .Column3_2 {
  padding-right: 20px;
 }
 /*---------------------
  inside
 ----------------------*/
 /*---- #GALLERY ----*/
 #GALLERY .Column4 {
  flex: 0 0 50%;
  max-width: 50%;
 }
 #GALLERY .inner h2 img {
  width: 30%;
 }
 #GALLERY h3 img {
  width: 25%;
  margin: 80px 0 40px;
 }
 #GALLERY .photo-card {
  margin: 0;
  background: none;
  box-shadow: none;
 }
 #GALLERY .photo-card-deta {
  margin: 15px;
  box-shadow: 0 0 10px -5px rgb(104 47 35 / 30%);
  background: #fff;
 }
 #GALLERY .photo-card img {
  width: 365px;
  height: 325px;
  border-radius: 30px;
  padding: 20px 20px 10px;
 }

 /*---- #TODAY ----*/
 /* none */
 #TODAY .ipad-none {
  display: none;
 }
 .time-line .Column2 {
  flex: 100%;
  max-width: 100%;
  padding: 40px 100px;
 }
 .zero-years {
  margin-bottom: 40px;
 }
 .time-line h3 {
  width: 35%;
 }
 .time {
  font-size: 14px;
 }
 .activities {
  font-size: 18px;
 }
 /*---------------------
  contact
 ----------------------*/ 
 /*---- #FORM ----*/
 #FORM .inner h2 img {
  width: 28%;
 }
 /*---- #FAQ ----*/
 #FAQ .inner h2 img {
  width: 27%;
 }
 .accordion {
  margin: auto;
  max-width: 80vw;
 }
}

@media screen and (max-width: 768px) {
 /*---- 共通 ----*/
.Column4 {
  flex: 0 0 calc(100% / 2);
  max-width: calc(100% / 2);
  padding: 0;
  position: relative;
 }
 section {
  padding: 100px 0;
 }
 /*---- 見出し ----*/
 .container h2 img {
  width: 30%;
 }
 .page  h1 {
  font-size: 27px;
 }
 /*---- none ----*/
 .ipad-none {
  display: none;
 }
 .ipad-onry {
  display: block;
 }
 /*---- header ----*/
 /* hamburger */
 #nav-drawer {
  position: relative;
  padding: 10px;
 }
 .nav-unshown {
  display: none;
 }
 #nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
 }
 #nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px; /*線の太さ*/
  width: 30px; /*長さ*/
  border-radius: 3px;
  background: #fff;
  display: block;
  content: '';
  cursor: pointer;
 }
 #nav-open span:before {
  bottom: -8px;
 }
 #nav-open span:after {
  bottom: -16px;
 }
 #nav-close {
  display: none;
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
 }
 #nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 90%;
  max-width: 230px;
  height: 100%;
  background: #ec694a;
  transition: .3s ease-in-out;
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);
  padding-left: 15px;
 }
 #nav-input:checked ~ #nav-close {
  display: block;
  opacity: .5;
 }
 #nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  box-shadow: 6px 0 25px rgba(0, 0, 0, .20);
 }
 .header-logo-menu {
  display: flex;
  display: -moz-flex;
  display: -o-flex;
  display: -webkit-flex;
  display: -ms-flex;
  flex-direction: row;
  -moz-flex-direction: row;
  -o-flex-direction: row;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  background: #ec694a;
  height: 60px;
  padding: 10px;
 }
 .header-logo-menu .logo-erea img {
  width: 20%;
  height: auto;
  margin-right: 50px;
 }
 .logo-erea {
  width: 100%;
  text-align: center;
  margin: 0;
 }
 .SmNav {
  list-style: none;
  margin-top: 60px;
 }
 .SmNav li, .SmNav li a {
  font-size: 18px;
  color: #FFF;
  padding-bottom: 15px;
 }
 .SmNav img {
  width: 15%;
  margin-right: 7px;
 }
 /*---- footer ----*/
 footer .Column3 {
  text-align: center;
  padding: 0 10px 40px;
 }
 footer img {
  width: 90%;
 }

 /*---------------------
  index
 ----------------------*/
 /*---- main-slider ----*/
 /* nav */
 .top-logo {
  padding-left: 20px;
 }
 .nav-menu {
  padding-right: 0;
 }
 .nav-menu li {
  text-align: center;
  padding: 0 10px;
 }
 /* slider */
 .main-slider {
  height: 90vh;
 }
 /* info-box */
 .main-slider h1 {
  width: 100%;
 }
 .top-main-info img {
  width: 70%;
 }
 .top-main-info {
  display: inline-flex;
  align-items: center;
  text-align: center;
  height: 90vh;
 }
 .top-info {
  display: none;
 }
 
 /*---- #TOP-CONCEPT ----*/
 #TOP-CONCEPT {
  padding: 100px 0;
 }
 #TOP-CONCEPT .row {
  margin: auto 0;
 }
 #TOP-CONCEPT .Column3 {
  flex: 0 0 calc(95% / 3);
  max-width: calc(95% / 3);
 }
 #TOP-CONCEPT .container h2 img {
  width: 90%;
  margin-right: 30px;
 }
 #TOP-CONCEPT .Column2 {
  padding: 0 15px;
 }
 /*---- #TOP-POINT ----*/
 #TOP-POINT .inner h2 img {
  width: 30%;
 }
 #TOP-POINT .Column2 {
  padding: 0 20px;
 }
 #TOP-POINT .Column3 {
  padding: 0 10px;
 }
 #TOP-POINT .Column3 img {
  width: 90%;
 }

 /*---- #CONTACT-INFO ----*/
 #CONTACT-INFO h2 img {
  width: 80%;
 }
 .info-tel h3 i, .info-form h3 i {
  padding: 10px;
 }
 #CONTACT-INFO .Column2 {
  padding: 25px 20px;
 }
 /*---- #SLIDER ----*/
 #SLIDER .container h2 img {
  width: 25%;
 }
 /*---------------------
  about
 ----------------------*/
 /*---- #GOAL ----*/
 .goal-card {
  margin: 10px;
 }
}

 @media screen and (max-width: 480px) {
 /*---- 共通 ----*/
 /*---- 見出し ----*/
 h3 {
  font-size: 20px;
 }
 p {
  font-size: 16px;
 }
 .container h2 img {
  width: 65%;
 }
 /*---- btn ----*/
 .btn-push, #FORM .submit {
  padding: 20px 60px;
 }
 /*---- none ----*/
 .sp-onry {
  display: block;
 }
 .sp-none {
  display: none;
 }
 .sp-nav {
  display: block;
 }
 /*---- Column ----*/
 .Column2 {
  flex: 0 0 100%;
  max-width: 100%;
 }
 .Column3 {
  flex: 0 0 100%;
  max-width: 100%;
 }
 .Column4 {
  flex: 0 0 100%;
  max-width: 100%;
 }
 /*---- header ----*/
 .logo-erea {
  width: 100%;
  margin: -33px;
 }
 .header-logo-menu .logo-erea img {
  width: 33%;
  margin: -6px 0 0 75px;
 }
 .page .logo-erea {
  width: 100%;
  margin: 10px 0;
 }
 .page .header-logo-menu .logo-erea img {
  width: 38%;
  margin: -7px 0 0 -40px;
 }
 .page-main-img {
  height: 30vh;
 }
 /*---- footer ----*/
 footer .sp-nav img {
  width: 45%;
 }
 .sp-nav a {
  font-size: 14px;
 }
 .sp-nav li {
  flex: 0 0 calc(100% / 4);
  margin-bottom: 40px;
  padding: 0 10px;
  border-right: 1px solid #fff;
 }
 .sp-nav li:last-child {
  border-right: none;
 }
 .sp-nav .row {
  justify-content: center;
 }
 /*---- ToTOP ----*/
 .ToTOP, #ToTOP {
  width: 25%;
  right: 20px;
 }
 /*---------------------
  index
 ----------------------*/ 
 /*---- main-slider ----*/
 .main-slider h1 {
  width: 100%;
 }
 .main-slider {
  height: 95vh;
 }
 .top-main-info {
  display: inline-flex;
 }
 .top-main-info img {
  width: 100%;
 }
 #TOP-CONCEPT .Column3 {
  flex: 0 0 100%;
  max-width: 100%;
 }
 /*---- #TOP-CONCEPT ----*/
 #TOP-CONCEPT .container h2 img {
  width: 60%;
  margin-right: 0;
 }
 #TOP-CONCEPT .Column2:first-child {
  margin-bottom: 40px;
 }
 #TOP-CONCEPT p {
  font-size: 18px;
  padding: 0 10px;
 }
 /*---- #TOP-POINT ----*/
 #TOP-POINT .inner h2 img {
  width: 65%;
 }
 #TOP-POINT .Column2 img, #TOP-POINT .Column3 img {
  width: 70%;
 }
 /*---- #COMPANY ----*/
 #COMPANY .inner {
  padding: 25px;
 }
 #COMPANY .row {
  margin-bottom: 30px;
 }
 #COMPANY th, #COMPANY td {
  display: block;
  width: 100%;
  padding: 0;
 }
 #COMPANY th {
  font-size: 15px;
  border: none;
  padding-left: 15px;
 }
 #COMPANY td {
  font-size: 17px;
  margin-bottom: 20px;
  padding: 0 0 20px 15px;
 }
 #COMPANY .ipad-onry {
  display: none;
 }
 #COMPANY .sp-onry {
  display: block;
 }
 .company-protect {
  padding: 20px;
  border-radius: 15px;
 }
 .company-protect h3 {
  font-size: 20px;
 }
 .company-protect p {
  font-size: 14px;
 }
 /*---- #CONTACT-INFO ----*/
 #CONTACT-INFO h2 img {
  width: 90%;
 }
 #CONTACT-INFO .Column2 {
  max-width: 90%;
 }
 #CONTACT-INFO .Column2:first-child {
  margin-bottom: 40px;
 }
 #CONTACT-INFO .btn-push {
  padding: 15px 50px;
 }
 .info-tel h3 i, .info-form h3 i {
  font-size: 15px;
  padding: 5px;
 }
 .info-tel p, .info-form p {
  font-size: 18px;
 }
 /*---- #SLIDER ----*/
 #SLIDER .container h2 img {
  width: 55%;
 }
 /*---------------------
  about
 ----------------------*/  
 /*---- #CONCEPT ----*/
 #CONCEPT p {
  font-size: 18px;
 }
 /*---- #POLICY ----*/
 #POLICY .row {
  margin-bottom: 40px;
 }
 .policy-img img {
  margin-bottom: 20px;
 }
 .policy-2 .policy-img {
  order: 1;
 }    
 .policy-2 .policy-description {
  order: 2;
 }
 /*---- #POINT ----*/
 #POINT .inner h2 img {
  width: 65%;
 }
 #POINT .Column3_1, #POINT .Column3_2 {
  flex: 0 0 100%;
  max-width: 100%;
 }
 #POINT .Column3_1 {
  order: 1;
  text-align: center;
  margin-bottom: 40px;
 }
 #POINT .Column3_1 img {
  width: 80%;
 }
 #POINT .Column3_2 {
  order: 2;
  padding: 0;
  text-align: center;
 }
 #POINT .fukidashi {
  width: 90%;
 }
 #POINT .Column3_2 p {
  text-align: left;
  padding: 0 20px;
 }
 /*---------------------
  inside
 ----------------------*/   
 /*---- #GALLERY ----*/
 #GALLERY .inner {
  padding: 0 5px;
 }
 #GALLERY .inner h2 img {
  width: 60%;
 }
 #GALLERY h3 img {
  width: 45%;
  margin: 80px 0 20px;
 }
 #GALLERY .photo-card img {
  width: 170px;
  height: 155px;
  padding: 10px;
 }
 #GALLERY .photo-card-deta {
  margin: 5px;
  box-shadow: none;
 }
 #GALLERY .photo-card p {
  font-size: 13px;
  padding: 5px 0 15px;
 }
 /*---- #TODAY ----*/
 #TODAY .inner {
  padding: 0 15px;
 }
 .setup-time .Column2:first-child {
  margin-bottom: 40px;
 }
 .zero-years, .one-two-years {
  padding: 40px 20px;
 }
 .time-line .Column2 {
  padding: 40px 20px;
 }
 .time-line h3 {
  width: 65%;
 }
 .time-line {
  padding: 15px;
 }
 .activities {
  font-size: 16px;
  padding: 0 0 20px 15px;
 }
 /*---------------------
  contact
 ----------------------*/   
 #FORM .inner h2 img {
  width: 65%;
 }
 #FORM .fukidashi {
  width: 90%;
 }
 #FORM table {
  width: 98%;
 }
 #FORM .contact-form th {
  padding: 10px 17px;
 }
 #FORM .contact-form th, #FORM .contact-form td {
  display: block;
  width: 100%;
  border: none;
 }
 #FORM .contact-form td input, #FORM .contact-form td textarea {
  padding: 20px 0;
  text-align: center;
 }
 #FORM .agreement {
  font-size: 19px;
 }
 #FORM .submit {
  width: 300px;
 }
 /*---- #FAQ ----*/
 #FAQ .inner h2 img {
  width: 65%;
 }
 #FAQ .title {
  border-radius: 20px;
  font-size: 15px;
 }
 img.question, img.anser {
  width: 25px;
  margin-right: 8px;
 }
 .accordion  {
  max-width: 100vh;
 }
 .content .row {
  padding: 15px;
 }
 .content {
  border-radius: 20px;
 }
 .content p {
  margin-left: 8px;
 }
 #PRIVACY .inner {
  padding: 0 15px;
 }
 .policy-text {
  padding: 35px;
 }
}