@charset "UTF-8";

/******************************
common
******************************/

/******************************
pagesec-philosophy
******************************/
.pagesec-philosophy{
  background: url(../../images/page/about/philosophy_bg.webp) no-repeat center / cover;
}
.pagesec-philosophy .message{
  background: rgba(255,255,255,.85);
  margin: 0 auto;
  max-width: 860px;
  padding: 8rem ;
}

.pagesec-philosophy .message .ttl{
  color: #d88a92;
  font-size: 3rem;
  font-weight: bold;
  letter-spacing: 4px;
  margin-bottom: 3rem;
  text-shadow: 1px 1px 0px #fff, -2px 1px 0px #fff, 1px -2px 0px #fff, -2px -2px 0px #fff, 1px -1px 0px #fff, -1px 1px 0px #fff, -2px -1px 0px #fff, -1px -2px 0px #fff, 2px 2px 1px #fff, -2px 2px 1px #fff, 2px -2px 1px #fff, -2px -2px 1px #fff, 2px 0px 1px #fff, -1px 2px 1px #fff, -2px -1px 1px #fff, -1px -2px 1px #fff;
}
@media only screen and (max-width: 1180px) {
}
@media only screen and (max-width: 1024px) {
  .pagesec-philosophy .message{
    max-width: 800px;
    padding: 5rem 5rem 7rem;
  }
}
@media only screen and (max-width: 820px) {
  .pagesec-philosophy .message .ttl {
    font-size: 2.7rem;
    margin-bottom: 1rem;
  }
}
@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 767px) {
  .pagesec-philosophy .message {
    padding: 2rem 1.5rem 3rem;
  }
  .pagesec-philosophy .message .ttl {
    font-size: 5.6vw;
    letter-spacing: 2px;
    text-align: center;
  }
}

/******************************
pagesec-overview
******************************/
.pagesec-overview{
  background: url(../../images/page/about/overview_bg.webp) no-repeat center / cover;
  padding: 15rem 0 10rem;
}
.policy .policylist{
  gap: 2rem;
}
.policy .policylist > div{
  background: #fff3f4;
  border: 4px solid #d88a92;
  border-radius: 20px;
  overflow: hidden;
  width: calc(33% - 2rem);
}
.policy .policylist > div > dt{
  background: #d88a92;
  color: #fff;
  padding: 1rem 1rem .5rem;
  text-align: center;
}
.policy .policylist > div > dt i{
  font-size: 3rem;
}
.policy .policylist > div > dt span{
  display: block;
  font-size: 2rem;
  font-weight: bold;
}
.policy .policylist > div > dd{
  padding: 2rem 1.5rem;
}

.overview {
  margin-top: 12rem;
}
.overview .tblbox3{
  background: #fff;
  border-bottom: 2px solid #d88a92;
  margin: 0 auto;
  max-width: 900px;
  padding: 3rem 3rem 5rem;
}

@media only screen and (max-width: 1180px) {
}
@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 820px) {
  .policy .policylist > div {
    width: calc(50% - 2rem);
  }
}
@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 767px) {
  .pagesec-overview{
    padding: 10rem 0 7rem;
  }
  .policy .policylist > div {
    width: 100%;
  }
  .policy .policylist > div > dt i{
    font-size: 2.4rem;
  }
  .policy .policylist > div > dt span{
    font-size: 1.8rem;
  }

  .overview .tblbox3 {
    padding: 3rem 2rem 5rem;
  }
}