@charset "utf-8";

/*---------- front_bg ----------*/

.front_bg {
  background-image: url(../img/meeting3.jpg);
  background-position: 0 -3.3rem;
  background-size: cover;
  width: 100%;
  height: 79.8rem;
  position: relative;
}

.fuwafuwa1 {
  animation: fuwafuwa1 3s ease-in-out infinite alternate;
  display: inline-block;
  transition: 1.5s ease-in-out;
}

@keyframes fuwafuwa1 {
  0% {
    transform:translate(0, 0) rotate(-7deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(7deg);
  }
}

.fuwafuwa2 {
  animation: fuwafuwa2 2s ease-in-out infinite alternate;
  display: inline-block;
  transition: 1.5s ease-in-out;
}

@keyframes fuwafuwa2 {
  0% {
    transform:translate(0, 0) rotate(-5deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(5deg);
  }
}

.fuwafuwa3 {
  animation: fuwafuwa3 4s ease-in-out infinite alternate;
  display: inline-block;
  transition: 1.5s ease-in-out;
}

@keyframes fuwafuwa3 {
  0% {
    transform:translate(0, 0) rotate(-9deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(9deg);
  }
}

.front_logo {
  position: absolute;
  top: 35.345rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 43.215rem;
  height: 13.308rem;
  object-fit: cover;
}

.front_bird {
  position: absolute;
  top: 18.0rem;
  left: 27.80rem;
  object-fit: cover;
  width: 18.3rem;
  height: 10.9rem;
}

.front_y_flower {
  position: absolute;
  top: 38.4rem;
  left: 10.4rem;
  object-fit: cover;
  width: 13.4rem;
  height: 14.1rem;
}

.front_ring_flower {
  position: absolute;
  top: 14.4rem;
  left: 87.0rem;
  object-fit: cover;
  width: 11.864rem;
  height: 12.037rem;
}

.front_flower {
  position: absolute;
  top: 39.3rem;
  left: 104.6rem;
  object-fit: cover;
  width: 13.5rem;
  height: 12.2rem;
}

.front_two_flower {
  position: absolute;
  top: 63.3rem;
  left: 26.0rem;
  object-fit: cover;
  width: 14.1rem;
  height: 9.7rem;
  z-index: 2;
}

.front_p_flower {
  position: absolute;
  top: 61.7rem;
  left: 93.0rem;
  object-fit: cover;
  width: 8.9rem;
  height: 8.3rem;
  z-index: 2;
}

.front_border {
  position: absolute;
  top: 58.9rem;
  left: 0rem;
  object-fit: cover;
  width: 100%;
  height: 54.528rem;
  z-index: 1;
}

/*---------- front_main_bg ----------*/

.front_main_bg {
  background-image: url(../img/front_bg.png);
  background-position: 0 0;
  background-size: cover;
  width: 100%;
  z-index: 10;
  position: relative;
  padding-bottom: 10.2rem;
}

.sub_content {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.0rem;
  margin-top: 12.6rem;
}

.front_pass {
  object-fit: cover;
  width: 30.7rem;
  height: auto;
}

.sub_title {
  font-size: 3.0rem;
  font-family: var(--NotoSans);
  font-weight: 500;
  letter-spacing: calc(3em / 30);
  color: #000;  
}

.front_pass2 {  
  object-fit: cover;
  width: 30.7rem;
  height: auto;
}

.sub_text {
  width: 84.0rem;
  font-size: 1.6rem;
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  text-align: center;
  margin: 3.6rem auto 9.6rem auto;
  color: #000;
}

/*---------- front_about ----------*/

.front_about {
  display: flex;
}

.front_bird2 {
  margin-left: 5.0rem;
  width: 18.3rem;
  height: 10.9rem;
  object-fit: cover;
}

.front_about_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  letter-spacing: calc(4em / 40);
  font-size: 4.0rem;
  color: #333;
  margin-left: 21.4rem;
  margin-right: 5.0rem;
  margin-top: -3rem;
}

.front_about_sub_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  line-height: calc(40em / 26);
  letter-spacing: calc(2.6em / 26);
  font-size: 2.6rem;
  color: #000;
  margin-left: 14.9rem;
  border-left: #F5B2B2 solid 0.5rem;
  height: 2.5rem;
  padding-left: 0.5rem;
  display: flex;
  align-items: center;
}

.front_about_text {
  width: 57.5rem;
  padding-top: 8.1rem;
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  font-size: 1.6rem;
  color: #000;
}

.front_btn {
  width: 13.5rem;
  margin-left: 44.0rem;
  color: #fff;
  background-color: #F5B2B2;
  border-radius: 2.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.4rem;
  line-height: calc(36em / 24);
  font-weight: 700;
  font-family: var(--NotoSans);
  letter-spacing: calc(1.68em / 24);
  padding: 0.3rem 3.3rem;
  transition: .3s;
  overflow: hidden;
}

.front_btn:hover {
  color: #fff;
  background-color: #122242;
}

/*---------- front_service ----------*/

.front_service {
  display: flex;
  margin-top: 19.1rem;
  margin-left: 30.3rem;
}

.front_y_flower2 {
  width: 13.4rem;
  height: 14.1rem;
  object-fit: cover;
}

.front_service_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  letter-spacing: calc(4em / 40);
  font-size: 4.0rem;
  color: #333;
  margin-left: 13.4rem;
  margin-right: 5.0rem;
  margin-top: -6rem;
}

.front_service_sub_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  line-height: calc(40em / 26);
  letter-spacing: calc(2.6em / 26);
  font-size: 2.6rem;
  color: #000;
  margin-left: 6.9rem;
  border-left: #F5B2B2 solid 0.5rem;
  height: 2.5rem;
  padding-left: 0.5rem;
  display: flex;
  align-items: center;
}

.front_service_text {
  width: 57.5rem;
  padding-top: 8.4rem;
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  font-size: 1.6rem;
  color: #000;
}

/*---------- front_flow ----------*/

.front_flow {
  display: flex;
  margin-top: 20.0rem;
}

.front_p_flower2 {
  margin-left: 5.0rem;
  width: 8.9rem;
  height: 8.3rem;
  object-fit: cover;
}

.front_flow_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  letter-spacing: calc(4em / 40);
  font-size: 4.0rem;
  color: #333;
  margin-left: 13.9rem;
  margin-right: 5.0rem;
  margin-top: -1rem;
}

.front_flow_sub_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  line-height: calc(40em / 26);
  letter-spacing: calc(2.6em / 26);
  font-size: 2.6rem;
  color: #000;
  margin-left: 7.4rem;
  border-left: #F5B2B2 solid 0.5rem;
  height: 2.5rem;
  padding-left: 0.5rem;
  display: flex;
  align-items: center;
}

.front_flow_text {
  width: 57.5rem;
  padding-top: 7.3rem;
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  font-size: 1.6rem;
  color: #000;
}

/*---------- front_contact_outer ----------*/

.front_contact_outer {
  position: relative;
  width: 118.0rem;
  background-color: #F5B2B3;
  margin: 21.6rem auto 0rem auto;
  padding-left: 5.0rem;
  display: flex;
}


.front_contact_wrapper {
  display: block;
  position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.front_contact {
  padding-bottom: 1.2rem;
}

.front_contact_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  display: inline-block;
  letter-spacing: calc(4em / 40);
  font-size: 4.0rem;
  color: #FFF;
  border-bottom: #fff solid 0.2rem; 
  padding-top: 3.0rem;
}

.front_contact_text {
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  letter-spacing: calc(1.6em / 16);
  font-size: 1.6rem;
  color: #FFF;
  width: 71.9rem;
  padding-top: 1.5rem;
}

.front_contact_btn {
  color: #122343;
  margin-left: 47.7rem;
  background: #fff;
  font-family: var(--NotoSans);
  font-weight: 700;
  line-height: calc(36em / 24);
  letter-spacing: calc(1.68em / 24);
  font-size: 2.4rem;
  border-radius: 2.2rem;
  padding: 0.5rem 3.3rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 22.3rem;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.front_contact_btn::after {
  background: #122343;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}
    
.front_contact_outer:hover .front_contact_btn::after{
  transform: scale(1, 1);
}

.front_contact_outer:hover .front_contact_btn{
  color: #fff;
}

.front_contact_img {
  width: 34.0rem;
  height: 25.5rem;
  object-fit: cover;
  vertical-align: bottom;
  margin-left: 3.6rem;
  margin-top: -4rem;
}

@media screen and (max-width:699.98px) {

/*---------- front_bg ----------*/

.front_bg {
  background-image: url(../img/meeting3.jpg);
  background-position: -17rem 0;
  background-size: cover;
  width: 100%;
  height: 66.7rem;
  position: relative;
}

.fuwafuwa1 {
  animation: fuwafuwa1 3s ease-in-out infinite alternate;
  display: inline-block;
  transition: 1.5s ease-in-out;
}

@keyframes fuwafuwa1 {
  0% {
    transform:translate(0, 0) rotate(-7deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(7deg);
  }
}

.fuwafuwa2 {
  animation: fuwafuwa2 2s ease-in-out infinite alternate;
  display: inline-block;
  transition: 1.5s ease-in-out;
}

@keyframes fuwafuwa2 {
  0% {
    transform:translate(0, 0) rotate(-5deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(5deg);
  }
}

.fuwafuwa3 {
  animation: fuwafuwa3 4s ease-in-out infinite alternate;
  display: inline-block;
  transition: 1.5s ease-in-out;
}

@keyframes fuwafuwa3 {
  0% {
    transform:translate(0, 0) rotate(-9deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(9deg);
  }
}

.front_logo {
  position: absolute;
  top: 31.094rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 18.0rem;
  height: 5.543rem;
  object-fit: cover;
}

.front_bird {
  position: absolute;
  top: 6.341rem;
  left: 6.118rem;
  object-fit: contain;
  width: 8.459rem;
  height: 6.841rem;
}

.front_y_flower {
  position: absolute;
  top: 21.2rem;
  left: 1.5rem;
  object-fit: cover;
  width: 7.5rem;
  height: 7.875rem;
}

.front_ring_flower {
  position: absolute;
  top: 9.761rem;
  left: 24.82rem;
  object-fit: cover;
  width: 9.113rem;
  height: 9.225rem;
}

.front_flower {
  position: absolute;
  top: 41.6rem;
  left: 29.0rem;
  object-fit: cover;
  width: 7.0rem;
  height: 6.4rem;
}

.front_two_flower {
  position: absolute;
  top: 58.442rem;
  left: 5.25rem;
  object-fit: cover;
  width: 7.5rem;
  height: 5.034rem;
  z-index: 2;
}

.front_p_flower {
  position: absolute;
  top: 57.423rem;
  left: 28.5rem;
  object-fit: cover;
  width: 7.5rem;
  height: 7.071rem;
  z-index: 2;
}

.front_border {
  position: absolute;
  top: 59.9rem;
  left: 0rem;
  object-fit: cover;
  width: 100%;
  height: 16.216rem;
  z-index: 1;
}

/*---------- front_main_bg ----------*/

.front_main_bg {
  background-image: url(../img/front_bg.png);
  background-position: 0 0;
  background-size: cover;
  width: 100%;
  z-index: 10;
  position: relative;
  padding-bottom: 7.0rem;
}

.anim-box.fadeup.is_animated {
  animation: fadeup 2s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}

@keyframes fadeup {
  0% {
    transform: translateY(30px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.sub_content {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
  margin-top: 2.874rem;
}

.front_pass {
  object-fit: contain;
  width: 9.5rem;
  height: auto;
}

.sub_title {
  font-size: 2.0rem;
  font-family: var(--NotoSans);
  font-weight: 500;
  letter-spacing: 0;
  color: #000;  
}

.front_pass2 {  
  object-fit: contain;
  width: 9.5rem;
  height: 0.734rem;
}

.sub_text {
  width: 30.0rem;
  font-size: 1.6rem;
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  text-align: center;
  margin: 2.5rem auto 6.0rem auto;
  color: #000;
}

/*---------- front_about ----------*/

.front_about {
  display: flex;
  flex-direction: column;
}

.front_bird2 {
  margin-left: 1.5rem;
  width: 11.278rem;
  height: 9.122rem;
  object-fit: contain;
}

.front_about_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  letter-spacing: calc(3.5em / 35);
  font-size: 3.5rem;
  color: #333;
  margin-left: 6.75rem;
  margin-right: 0rem;
  margin-top: 0rem;
}

.front_about_sub_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  line-height: calc(40em / 20);
  letter-spacing: calc(2em / 20);
  font-size: 2.0rem;
  color: #000;
  margin-left: 1.5rem;
  border-left: #F5B2B2 solid 0.5rem;
  height: 2.5rem;
  padding-left: 0.5rem;
  display: flex;
  align-items: center;
}

.front_about_text {
  width: 34.5rem;
  padding-top: 2.0rem;
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  font-size: 1.6rem;
  margin: 0 auto;
}

.front_btn {
  margin: 0 auto;
  width: 13.5rem;
  margin-top: 1.0rem;
  color: #fff;
  background-color: #F5B2B2;
  border-radius: 2.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.4rem;
  line-height: calc(36em / 24);
  font-weight: 700;
  font-family: var(--NotoSans);
  letter-spacing: calc(1.68em / 24);
  padding: 0.3rem 3.3rem;
}

.front_btn:hover {
  color: #fff;
  background-color: #122242;
}

/*---------- front_service ----------*/

.front_service {
  display: flex;
  flex-direction: column;
  margin-top: 6.5rem;
  margin-left: 0rem;
}

.front_service_outer {
  position: relative;
}

.front_y_flower2 {
  position: absolute;
  top: 0;
  right: 1.5rem;
  width: 8.0rem;
  height: 8.4rem;
  object-fit: cover;
}

.front_service_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  letter-spacing: calc(3.5em / 35);
  font-size: 3.5rem;
  color: #333;
  margin-left: 6.7rem;
  margin-right: 0rem;
  margin-top: 2.4rem;
}

.front_service_sub_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  line-height: calc(40em / 20);
  letter-spacing: calc(2em / 20);
  font-size: 2.0rem;
  color: #000;
  margin-left: 1.5rem;
  border-left: #F5B2B2 solid 0.5rem;
  height: 2.5rem;
  padding-left: 0.5rem;
  display: flex;
  align-items: center;
}

.front_service_text {
  width: 34.5rem;
  padding-top: 3.0rem;
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  font-size: 1.6rem;
  margin: 0 auto;
}

/*---------- front_flow ----------*/

.front_flow {
  display: flex;
  flex-direction: column;
  margin-top: 6.5rem;
}

.front_p_flower2 {
  margin-left: 1.5em;
  width: 7.0rem;
  height: 6.6rem;
  object-fit: cover;
}

.front_flow_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  letter-spacing: calc(3.5em / 35);
  font-size: 3.5rem;
  color: #333;
  margin-left: 7.1rem;
  margin-right: 0rem;
  margin-top: 0rem;
}

.front_flow_sub_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  line-height: calc(40em / 20);
  letter-spacing: calc(2em / 20);
  font-size: 2.0rem;
  color: #000;
  margin-left: 1.5rem;
  border-left: #F5B2B2 solid 0.5rem;
  height: 2.5rem;
  padding-left: 0.5rem;
  display: flex;
  align-items: center;
}

.front_flow_text {
  width: 34.5rem;
  padding-top: 3.0rem;
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  font-size: 1.6rem;
  margin: 0 auto;
}

/*---------- front_contact_outer ----------*/

.front_contact_outer{
  position: relative;
  width: 34.5rem;
  background-color: #F5B2B3;
  margin: 6.021rem auto 0rem auto;
  padding-left: 0rem;
  display: flex;
  flex-direction: column;
}

.front_contact_wrapper {
  display: block;
  position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.front_contact {
  padding-bottom: 0rem;
}

.front_contact_title {
  font-family: var(--NotoSans);
  font-weight: 700;
  display: inline-block;
  letter-spacing: calc(3.5em / 30);
  font-size: 3.5rem;
  color: #FFF;
  border-bottom: #fff solid 0.2rem; 
  padding-top: 2.0rem;
  margin-left: 1.5rem;
}

.front_contact_text {
  font-family: var(--NotoSans);
  font-weight: 350;
  line-height: calc(40em / 16);
  letter-spacing: 0;
  font-size: 1.6rem;
  color: #FFF;
  width: 31.5rem;
  padding-top: 0.5rem;
  margin: 0 auto;
}

.front_contact_btn {
  color: #122343;
  margin: 1.0rem auto 0 1.5rem;
  background: #fff;
  font-family: var(--NotoSans);
  font-weight: 700;
  line-height: calc(36em / 24);
  letter-spacing: calc(1.68em / 24);
  font-size: 2.4rem;
  border-radius: 2.2rem;
  padding: 0.5rem 3.3rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 22.3rem;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.front_contact_btn::after {
  background: #122343;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}

.front_contact_outer:hover .front_contact_btn::after{
  transform: scale(1, 1);
}

.front_contact_outer:hover .front_contact_btn{
  color: #fff;
}

.front_contact_img {
  width: 32.0rem;
  height: 24.0rem;
  object-fit: cover;
  vertical-align: bottom;
  margin: 0 auto;
  padding-bottom: 2.0rem;
}

}