@charset "UTF-8";
/**/
/*services*/
/**/
#sec-sv .sec-sv-inner input[type="checkbox"]{
  display: none;
}
#sec-sv .sec-sv-inner ul{
  display: flex;
  flex-direction: column;

  border-top: solid 1px #DEDEDE;
}
#sec-sv .sec-sv-inner ul li{
  padding-left: .4rem;

  border-bottom: solid 1px #DEDEDE;
}
#sec-sv .sec-sv-inner .title{
  display: flex;
  justify-content: space-between;
  padding: 2.4rem 0;
  padding-right: 1.2rem;
}
#sec-sv h3{
  margin-bottom: 0.4rem;

  font-size: 2.6rem;
  font-weight: 600;
}
#sec-sv .heading-EN{
  font-size: 1.3rem;
  font-family: poppins, sans-serif;
  font-weight: 700;
  font-style: normal;
  line-height: 1;

  opacity: 0.2;
}
#sec-sv .sec-sv-inner .title .labelBtn{
  position: relative;

  display: block;
  width: 6rem;
  height: 6rem;

  border: solid 2px #333;
  border-radius: 50%;
}
#sec-sv .sec-sv-inner .labelBtn span::before,
#sec-sv .sec-sv-inner .labelBtn span::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);

  width: 1.6rem;
  height: .2rem;

  background: #333;
}
#sec-sv .sec-sv-inner .title .labelBtn span::after{
  transform: translate(-50%,-50%)rotate(90deg);
  transition: 0.3s all linear;
}
#sec-sv .sec-sv-inner input[type="checkbox"]:checked + .title .labelBtn span::after{
  opacity: 0;
  transition: 0.3s all linear;
}
#sec-sv .sec-sv-inner .content{
  display: grid;
  grid-template-columns: 6fr 4fr;
  column-gap: 2.4rem;

  line-height: 1.6;

  overflow: hidden;
  height: 0;
  max-height: 0;
  transition: 0.8s all linear;
}
#sec-sv .sec-sv-inner .content img{
  display: block;
  margin-bottom: 4rem;
}
#sec-sv .sec-sv-inner li:has(input[type="checkbox"]:checked) .content{
  overflow: hidden;

  height: auto;
  max-height: 80rem;
  transition: 0.8s all linear;
}
/**/
/*works*/
/**/
#works-gallery01{
  margin-bottom: 9.6rem;
}
/**/
/*voice*/
/**/
#sec-voice{
  position: relative;

  --font-width: calc(563px * var(--prism-rate));
  --font-height: calc(111px * var(--prism-rate));

  margin-bottom: 22.4rem;
}
#sec-voice .h2-wrap{
  margin-bottom: 0.4rem;
}
#sec-voice h2 .prism{
  background: url(../img/voices_mask.svg) no-repeat left top/var(--font-width) var(--font-height);
}
.sec-voice-inner .unitContainer{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  column-gap: 4rem;
  row-gap: 8rem;
  width: min(112rem,100%);
  padding: 0 min(3vw,2.4rem);
  margin-inline: auto;
}
.sec-voice-inner .unit{
  padding: .8rem 0;
}
.sec-voice-inner .unit .portlait-wrap{
  display: block;
  width: min(16rem,45%);
  aspect-ratio: 1/1;
  margin-inline: auto;
  margin-bottom: 4.8rem;

  border-radius: 50%;
  border: solid 1px #C6C6C6;
  overflow: hidden;
}
.sec-voice-inner .unit .portlait-wrap img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec-voice-inner .unit .name{
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.4;
  text-align: center;
}
@media (hover){
}
@media (max-width : 1200px){
  main{
    padding-left: 0;
    padding-right: 0;
  }

  .sec-voice-inner .unitContainer{
    grid-template-columns: repeat(3,1fr);
    padding: 0;
  }
}
@media (max-width : 599px){
  .sec-voice-inner .unitContainer{
    grid-template-columns: repeat(2,1fr);
  }
}