main section {
 width: 100%;
}
main section.lead_area {
 padding: 160px 5% 60px;
 background: var(--gray2);
}
@media screen and (max-width: 767px) {
 main section.lead_area {
  padding-block: 80px 30px;
 }
}
main section.lead_area >.inner {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 width: 100%;
 max-width: 1100px;
 gap: 50px;
 margin: 0 auto;
}
@media screen and (max-width: 767px) {
 main section.lead_area >.inner {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 10px;
 }
}
main section.lead_area >.inner h2 {
 width: 157px;
 -ms-flex-negative: 0;
     flex-shrink: 0;
}
@media screen and (max-width: 767px) {
 main section.lead_area >.inner h2 {
  width: 120px;
  margin: 0 auto;
 }
}
main section.card_area {
 padding: 100px 5%;
}
@media screen and (max-width: 767px) {
 main section.card_area {
  padding-block: 50px;
 }
}
main section.card_area >.inner {
 width: 100%;
 max-width: 1100px;
 margin: 0 auto;
}
main section.card_area >.inner ul {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 90px 40px;
}
@media screen and (max-width: 767px) {
 main section.card_area >.inner ul {
  grid-template-columns: repeat(2, 1fr);
  gap: 50px 4%;
 }
}
main section.card_area >.inner ul li:nth-child(3n+2) {
 margin-top: 85px;
}
@media screen and (max-width: 767px) {
 main section.card_area >.inner ul li:nth-child(3n+2) {
  margin-top: 0;
 }
}
main section.card_area >.inner ul li .card {
 position: relative;
 margin-bottom: 15px;

 aspect-ratio: 680/900;
}
main section.card_area >.inner ul li .card .keyword {
 position: absolute;
 top: -20px;
 right: 20px;
 z-index: 2;
 width: auto;
 pointer-events: none;
}
@media screen and (max-width: 767px) {
 main section.card_area >.inner ul li .card .keyword {
  top: -10px;
  right: 10px;
  width: 30px;
 }
}
main section.card_area >.inner ul li .card:hover .back {
 -webkit-transform: rotateY(180deg);
         transform: rotateY(180deg);
}
main section.card_area >.inner ul li .card:hover .front {
 -webkit-transform: rotateY(0);
         transform: rotateY(0);
}
main section.card_area >.inner ul li .card >div {
 position: absolute;
 top: 0;
 left: 0;
 -webkit-backface-visibility: hidden;
         backface-visibility: hidden;
 -webkit-transition: 0.7s;
 transition: 0.7s;
}
main section.card_area >.inner ul li .card >div.front {
 -webkit-transform: rotateY(-180deg);
         transform: rotateY(-180deg);
}
main section.card_area >.inner ul li .card >div img {
 width: 100%;
}
main section.card_area >.inner ul li p.title {
 line-height: 1.4;
 font-family: var(--shippori-antique);
 font-size: 30px;
}
@media screen and (max-width: 767px) {
 main section.card_area >.inner ul li p.title {
  font-size: 24px;
 }
}
main section.card_area >.inner ul li p.name {
 margin: 5px 0;
}
@media screen and (max-width: 767px) {
 main section.card_area >.inner ul li p.text {
  line-height: 1.7;
  font-size: 14px;
 }
}
/*# sourceMappingURL=style.css.map */