@charset "utf-8";




section:has(.innerwrapper) {
  width: 100%;
  margin: 0 40px;
}

#contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#contact .whitebox {
  max-width: 780px;
}
#contact img {
  align-self: flex-start;
  margin: 0 auto;
}
@media screen and (max-width: 390px){
#contact img {

  width: 100%;
  height: auto;
}
}


@media screen and (min-width: 900px){
  #contact {
    flex-direction: row;
  }
  .bg-lightblue {
    padding: 0;
  }
  #contact img {
    margin: 40px 0 0 40px;
  }
}


.contact-textarea  {
  padding: 40px 20px;
}
@media screen and (min-width: 391px) {
  .contact-textarea  {
    margin-top: 20px;
  }
}
@media screen and (min-width: 768px){
  .contact-textarea  {
    margin-top: 40px;
    margin-left: 20px;
    margin-right: 20px;
    border-radius: 8px;
  }
}
@media screen and (min-width: 900px){
  .contact-textarea  {
    margin-right: 40px;
  }
}




#company-overview {
  max-width: 900px;
}
#company-overview th,
#company-overview td {
  vertical-align: text-top;
  line-height: 1.2;
}
#company-overview th {
  padding: 24px 8px 24px 0;
}
#company-overview td {
  padding: 24px 0;
}


#company-overview table {
  border-collapse: collapse;
}
#company-overview tr:not(:last-child) {
  border-bottom: 1px solid #ccc;
}


.fvwrapper {
  padding-top: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* #contact .innerwrapper {
  background: #fff;
  padding: 12px;
  border-radius: 12px;
} */

#contact .fvwrapper img {
  /* display: block; */
  width: 390px;
  height: auto;
  /* margin-left: auto; */
  /* transform: translateY(168px);; */

  margin-bottom: 24px;
}




.white-transparent h2 {
  padding: 24px 0 8px;
}

.white-transparent p {
  padding: 4px 14px;
}

.white-transparent p span {
  display: block;
}

.blue {
  color: #10069f;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 8px;
}

#contact span:has(+a[href^="mailto"])::before {
  margin-right: 8px;
  display: inline-block;
  vertical-align: middle;
  min-width: 20px;
  height: 20px;
  content: url(./../../img/icon-email.svg);
}








.accordion-area .title {
  margin-left: 60px;
  margin-top: 60px;
  font-size: 18px;
}


/*アイコンの＋と×*/
.accordion-area .title::before,
.accordion-area .title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #2488FF;

    margin-left: -40px;
    
}
.accordion-area .title::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
.accordion-area .title::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
.accordion-area .title.close::before{
	transform: rotate(45deg);
}

.accordion-area .title.close::after{
	transform: rotate(-45deg);
}



@media screen and (min-width: 900px){
  .panel {
    margin: 0 40px;
  }

}

@media screen and (min-width: 1260px){
  .panel {

    /* width: 100%; */
    max-width: 1168px;
  }
}

.panel span {
  color: #757575;
  border-radius: 4px;
}

.panel span::before {
  margin-right: 8px;
  display: inline-block;
  vertical-align: text-top;
  min-width: 17px;
  height: 17px;
  content: url(./../img/icon-alert.svg);
}