/* ----------------------------------------------------------
General Settings
---------------------------------------------------------- */


.ic-tel_box_b {background-image: url(../img/header/ic-tel_box_b.webp);}
.ic-mail_box_b {background-image: url(../img/header/ic-mail_box_b.webp);}
.ic-web_box_b {background-image: url(../img/header/ic-web_box_b.webp);}

/* Company */
#comp01 .aniactive {
  opacity: 0;
  margin-top:5%;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
#comp01 .animove {
  opacity: 1;
  margin-top:0%;
}

#comp02 .aniactive {
  opacity: 0;
  margin-top:5%;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
#comp02 .animove {
  opacity: 1;
  margin-top:0%;
}

/* Introduction */
#introduction .aniactive {
  opacity: 0;
  margin-top:10%;
  transition: 1s ease-in-out;
  -webkit-transition: 1s ease-in-out;
}
#introduction .animove {
  opacity: 1;
  margin-top:0%;
}

/* Service */
#service01.aniactive {
  opacity: 0;
  margin-top:10%;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
#service01.animove {
  opacity: 1;
  margin-top:0%;
}
#service02.aniactive {
  opacity: 0;
  margin-left:10%;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
#service02.animove {
  opacity: 1;
  margin-left:0%;
}


/* ----------------------------------------------------------
Style for PCs
---------------------------------------------------------- */
@media screen and (min-width: 1025px) {

  .pt-privacy {background-image: url(../img/pagetitle/ptbg-privacy.webp);}
.pt-contact {background-image: url(../img/pagetitle/ptbg-contact.webp);}
.pt-recruit {background-image: url(../img/pagetitle/ptbg-recruit.webp);}
.pt-company {background-image: url(../img/pagetitle/ptbg-company.webp);}
.pt-gallery {background-image: url(../img/pagetitle/ptbg-gallery.webp);}
.pt-intro {background-image: url(../img/pagetitle/ptbg-intro.webp);}
.pt-service {background-image: url(../img/pagetitle/ptbg-service.webp);}

 /* Header */
 header figure {
   width:130px;
   height: auto;
   display: flex;
   justify-content: center;
   align-items: center;
   position: fixed;
   top:40px;
   left:50%;
   z-index:18600;
   transform: translateX(-50%);
 }
 header figure img {
   width:100%;
   height: auto;
   display: block;
 }

 /* Pagetitle */
 .pagetitle {
  width: 100%;
  height: 100vh;
  display: block;
 }
 .ptbody {
  width: 100%;
  height: 45%;
  min-height: 400px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  padding:0 5% 2%;
  background-color: rgba(255,255,255,0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
 }
.ptbody h1 {
  font-size: clamp(24px, 1.25vw, 50px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1em;
  margin-bottom: 1em;
  order:2;
}

.ptbody p {
  font-size: clamp(100px, 5vw, 80px);
  font-weight: 400;
  font-family: var(--font-en);
  line-height: 1em;
  letter-spacing: -0.03em;
  order:1;
  margin-bottom: 1em;
}

.ptbody ul {
  margin: 0;
  display: flex;
  justify-content: center;
  order:3;
}
.ptbody ul li {
  font-size: 12px;
  line-height: 1em;
}
.ptbody ul li:after {
  content:" > ";
  margin-left: 0.5em;
  margin-right:0.5em;
}
.ptbody ul li:last-child:after {
  content:"";
}

/* Contents */
.bg-fixed {display: none;}
#wrapper {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  background-attachment:fixed;
}

/* Main */
main p.scl_pbn {
  width:150px;
  height: 30px;
  display: block;
  background-image: url(../img/header/ic-ar_v_b.webp);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: auto 30px;
  background-color: rgba(255,255,255,0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%);

  text-indent: -9999px;
  margin:0 auto;
}
.contentsmain {
  width: 100%;
  height: auto;
  display: block;
  background-color: rgba(255,255,255,0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}


/* ContactMeshods */
ul.contactmethods {
  width: 100%;
  height: auto;
  display: flex;
}
ul.contactmethods li {
  width:30.33333333333%;
  margin: 0 1% 0 0;
  overflow: hidden;
  border-radius: 10px;
  background-color: var(--color-white);
  background-image: url(../img/header/box-1st.webp);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 5px 0%;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
  transition: .4s all;
}
ul.contactmethods li:hover {
  background-size: 5px 100%;
}
ul.contactmethods li a {
  width: 100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:10% 5%;
}
ul.contactmethods li a h4 {
  font-size: clamp(16px, 1.5vw, 20px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1em;
  margin-bottom: 0.5em;
}
ul.contactmethods li.come_tel a:hover p {
  color:var(--color-1st);
  transition: .4s all;
}
ul.contactmethods li.come_tel a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(22px, 1.75vw, 30px);
  font-family: var(--font-en);
  font-weight: 500;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}
ul.contactmethods li.come_mail a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(16px, 1.25vw, 30px);
  font-weight: 400;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}
ul.contactmethods li.come_web a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(16px, 1.25vw, 30px);
  font-weight: 400;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}


/* Gallery
----------------------------------------------------*/

/* Gallery01 */
.gallery01 {
  width: 100%;
  height: auto;
  display: block;
  padding:150px 5% 100px;
}
.gallery01 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.gallery01 ul li {
  width:23%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin-right:5%;
  margin-left:5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery01 ul li:nth-child(1) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(2) {
  margin-top: 5%;
  margin-bottom: 5%;
}
.gallery01 ul li:nth-child(3) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(4) {
  margin-top: 5%;
}
.gallery01 ul li:nth-child(5) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(6) {
  margin-top: 5%;
}

/* Gallery02 */
.gallery02 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery02 ul {
  width: 60%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery02 ul li {
  width:50%;
  height: auto;
  display: block;
  background-color: #ccc;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}

/* Gallery03 */
.gallery03 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery03 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin:0 auto;
}
.gallery03 ul li {
  width:20%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery03 ul li:nth-child(1) {
  margin-top:5%;
}
.gallery03 ul li:nth-child(4) {
  margin-top:5%;
}

/* Gallery04 */
.gallery04 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery04 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin:0 auto;
}
.gallery04 ul li {
  width:20%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery04 ul li:nth-child(2) {
  margin-top:5%;
}
.gallery04 ul li:nth-child(3) {
  margin-top:5%;
}

/* Gallery05 */
.gallery05 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery05 ul {
  width: 60%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin:0 auto;
}
.gallery05 ul li {
  width:48%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 1%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery05 ul li:nth-child(2) {
  margin-top:8%;
}

/* Gallery06 */
.gallery06 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery06 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin:0 auto;
}
.gallery06 ul li {
  width:23.333333333%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery06 ul li:nth-child(1) {
  margin-top:0;
}
.gallery06 ul li:nth-child(2) {
  margin-top:5%;
}
.gallery06 ul li:nth-child(3) {
  margin-top:10%;
}

/* Gallery07 */
.gallery07 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery07 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin:0 auto;
}
.gallery07 ul li {
  width:23.333333333%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery07 ul li:nth-child(1) {
  margin-top:10%;
}
.gallery07 ul li:nth-child(2) {
  margin-top:5%;
}
.gallery07 ul li:nth-child(3) {
  margin-top:0%;
}

/* Gallery08 */
.gallery08 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery08 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery08 ul li {
  width:20%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin-right:2.5%;
  margin-left:2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery08 ul li:nth-child(1) {
  margin-top: 0;
}
.gallery08 ul li:nth-child(2) {
  margin-top: 5%;
  margin-bottom: 5%;
}
.gallery08 ul li:nth-child(3) {
  margin-top: 0;
}
.gallery08 ul li:nth-child(4) {
  margin-top: 5%;
}

/* Gallery ani */
.gallery01 ul.aniactive {
  margin-top:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery01 ul.animove {
  margin-top:0%;
  opacity: 1;
}

.gallery02 ul.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery02 ul.animove {
  margin-right:auto;
  opacity: 1;
}

.gallery03 ul li.aniactive {
  margin-left:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery03 ul li.animove {
  margin-left:0%;
  opacity: 1;
}

.gallery04 ul li.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery04 ul li.animove {
  margin-right:0%;
  opacity: 1;
}

.gallery05 ul li:nth-child(1).aniactive {
  margin-top:8%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery05 ul li:nth-child(1).animove {
  margin-top:0%;
  opacity: 1;
}

.gallery05 ul li:nth-child(2).aniactive {
  margin-top:0%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery05 ul li:nth-child(2).animove {
  margin-top:8%;
  opacity: 1;
}

.gallery06 ul.aniactive {
  margin-left:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery06 ul.animove {
  margin-left:0%;
  opacity: 1;
}

.gallery07 ul.aniactive {
  margin-top:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery07 ul.animove {
  margin-top:0%;
  opacity: 1;
}

.gallery08 ul.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery08 ul.animove {
  margin-right:0%;
  opacity: 1;
}


/* Service
--------------------------------------------------*/
.sectiontitle {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 30px;
}
.sectiontitle h3 {
  font-size: clamp(18px, 3vw, 40px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1.2em;
  margin-bottom: 0.25em;
}
.sectiontitle p {
  font-size: clamp(10px, 1.6vw, 18px);
  font-weight: 500;
  font-family: var(--font-en);
  line-height: 1.2em;
  color:var(--color-1st);
}



/* Intro
--------------------------------------------------*/
.introtxt {
  font-family: var(--font-min)!important;
  font-size: clamp(16px, 1.25vw, 40px)!important;
}



}

/* ----------------------------------------------------------
Style for iPad Pro
---------------------------------------------------------- */
@media screen and (min-width: 769px) and (max-width: 1024px) {

  .pt-privacy {background-image: url(../img/pagetitle/ptbg-privacy.webp);}
.pt-contact {background-image: url(../img/pagetitle/ptbg-contact.webp);}
.pt-recruit {background-image: url(../img/pagetitle/ptbg-recruit.webp);}
.pt-company {background-image: url(../img/pagetitle/ptbg-company.webp);}
.pt-gallery {background-image: url(../img/pagetitle/ptbg-gallery.webp);}
.pt-intro {background-image: url(../img/pagetitle/ptbg-intro.webp);}
.pt-service {background-image: url(../img/pagetitle/ptbg-service.webp);}

 /* Header */
 header figure {
   width:130px;
   height: auto;
   display: flex;
   justify-content: center;
   align-items: center;
   position: fixed;
   top:40px;
   left:50%;
   z-index:18600;
   transform: translateX(-50%);
 }
 header figure img {
   width:100%;
   height: auto;
   display: block;
 }

 /* Pagetitle */
 .pagetitle {
  width: 100%;
  height: 100vh;
  display: block;
 }
 .ptbody {
  width: 100%;
  height: 35%;
  min-height: 400px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  padding:0 5% 50px;
  background-color: rgba(255,255,255,0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
 }
.ptbody h1 {
  font-size: clamp(24px, 1.25vw, 50px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1em;
  margin-bottom: 1em;
  order:2;
}

.ptbody p {
  font-size: clamp(100px, 5vw, 80px);
  font-weight: 400;
  font-family: var(--font-en);
  line-height: 1em;
  letter-spacing: -0.03em;
  order:1;
  margin-bottom: 1em;
}

.ptbody ul {
  margin: 0;
  display: flex;
  justify-content: center;
  order:3;
}
.ptbody ul li {
  font-size: 12px;
  line-height: 1em;
}
.ptbody ul li:after {
  content:" > ";
  margin-left: 0.5em;
  margin-right:0.5em;
}
.ptbody ul li:last-child:after {
  content:"";
}

/* Contents */
.bg-fixed {display: none;}
#wrapper {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  background-attachment:fixed;
}

/* Main */
main p.scl_pbn {
  width:150px;
  height: 30px;
  display: block;
  background-image: url(../img/header/ic-ar_v_b.webp);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: auto 30px;
  background-color: rgba(255,255,255,0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%);

  text-indent: -9999px;
  margin:0 auto;
}
.contentsmain {
  width: 100%;
  height: auto;
  display: block;
  background-color: rgba(255,255,255,0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}


/* ContactMeshods */
ul.contactmethods {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
}
ul.contactmethods li {
  width:30.33333333333%;
  margin: 0 1% 0 0;
  overflow: hidden;
  border-radius: 10px;
  background-color: var(--color-white);
  background-image: url(../img/header/box-1st.webp);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 5px 0%;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
  transition: .4s all;
}
ul.contactmethods li:hover {
  background-size: 5px 100%;
}
ul.contactmethods li a {
  width: 100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:10% 5%;
}
ul.contactmethods li a h4 {
  font-size: clamp(16px, 1.5vw, 20px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1em;
  margin-bottom: 0.5em;
}
ul.contactmethods li.come_tel a:hover p {
  color:var(--color-1st);
  transition: .4s all;
}
ul.contactmethods li.come_tel a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(22px, 1.75vw, 30px);
  font-weight: 500;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}
ul.contactmethods li.come_mail a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(16px, 1.25vw, 30px);
  font-weight: 500;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}
ul.contactmethods li.come_web a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(16px, 1.25vw, 30px);
  font-weight: 500;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}

/* Gallery
----------------------------------------------------*/

/* Gallery01 */
.gallery01 {
  width: 100%;
  height: auto;
  display: block;
  padding:150px 5% 100px;
}
.gallery01 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.gallery01 ul li {
  width:23%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin-right:5%;
  margin-left:5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery01 ul li:nth-child(1) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(2) {
  margin-top: 5%;
  margin-bottom: 5%;
}
.gallery01 ul li:nth-child(3) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(4) {
  margin-top: 5%;
}
.gallery01 ul li:nth-child(5) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(6) {
  margin-top: 5%;
}

/* Gallery02 */
.gallery02 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery02 ul {
  width: 60%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery02 ul li {
  width:50%;
  height: auto;
  display: block;
  background-color: #ccc;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}

/* Gallery03 */
.gallery03 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery03 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin:0 auto;
}
.gallery03 ul li {
  width:20%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery03 ul li:nth-child(1) {
  margin-top:5%;
}
.gallery03 ul li:nth-child(4) {
  margin-top:5%;
}

/* Gallery04 */
.gallery04 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery04 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin:0 auto;
}
.gallery04 ul li {
  width:20%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery04 ul li:nth-child(2) {
  margin-top:5%;
}
.gallery04 ul li:nth-child(3) {
  margin-top:5%;
}

/* Gallery05 */
.gallery05 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery05 ul {
  width: 60%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin:0 auto;
}
.gallery05 ul li {
  width:48%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 1%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery05 ul li:nth-child(2) {
  margin-top:8%;
}

/* Gallery06 */
.gallery06 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery06 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin:0 auto;
}
.gallery06 ul li {
  width:23.333333333%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery06 ul li:nth-child(1) {
  margin-top:0;
}
.gallery06 ul li:nth-child(2) {
  margin-top:5%;
}
.gallery06 ul li:nth-child(3) {
  margin-top:10%;
}

/* Gallery07 */
.gallery07 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery07 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin:0 auto;
}
.gallery07 ul li {
  width:23.333333333%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery07 ul li:nth-child(1) {
  margin-top:10%;
}
.gallery07 ul li:nth-child(2) {
  margin-top:5%;
}
.gallery07 ul li:nth-child(3) {
  margin-top:0%;
}

/* Gallery08 */
.gallery08 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery08 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery08 ul li {
  width:20%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin-right:2.5%;
  margin-left:2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
}
.gallery08 ul li:nth-child(1) {
  margin-top: 0;
}
.gallery08 ul li:nth-child(2) {
  margin-top: 5%;
  margin-bottom: 5%;
}
.gallery08 ul li:nth-child(3) {
  margin-top: 0;
}
.gallery08 ul li:nth-child(4) {
  margin-top: 5%;
}

/* Gallery ani */
.gallery01 ul.aniactive {
  margin-top:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery01 ul.animove {
  margin-top:0%;
  opacity: 1;
}

.gallery02 ul.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery02 ul.animove {
  margin-right:auto;
  opacity: 1;
}

.gallery03 ul li.aniactive {
  margin-left:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery03 ul li.animove {
  margin-left:0%;
  opacity: 1;
}

.gallery04 ul li.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery04 ul li.animove {
  margin-right:0%;
  opacity: 1;
}

.gallery05 ul li:nth-child(1).aniactive {
  margin-top:8%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery05 ul li:nth-child(1).animove {
  margin-top:0%;
  opacity: 1;
}

.gallery05 ul li:nth-child(2).aniactive {
  margin-top:0%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery05 ul li:nth-child(2).animove {
  margin-top:8%;
  opacity: 1;
}

.gallery06 ul.aniactive {
  margin-left:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery06 ul.animove {
  margin-left:0%;
  opacity: 1;
}

.gallery07 ul.aniactive {
  margin-top:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery07 ul.animove {
  margin-top:0%;
  opacity: 1;
}

.gallery08 ul.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery08 ul.animove {
  margin-right:0%;
  opacity: 1;
}


/* Service
--------------------------------------------------*/
.sectiontitle {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 30px;
}
.sectiontitle h3 {
  font-size: clamp(18px, 3vw, 40px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1.2em;
  margin-bottom: 0.25em;
}
.sectiontitle p {
  font-size: clamp(10px, 1.6vw, 18px);
  font-weight: 500;
  font-family: var(--font-en);
  line-height: 1.2em;
  color:var(--color-1st);
}




/* Intro
--------------------------------------------------*/
.introtxt {
  font-family: var(--font-min)!important;
  font-size: clamp(16px, 1.25vw, 40px)!important;
}


}


/* ----------------------------------------------------------
Style for Smartphone
---------------------------------------------------------- */
@media screen and (max-width: 768px) {

  .pt-privacy {background-image: url(../img/pagetitle/ptbg-privacy_m.webp);}
.pt-contact {background-image: url(../img/pagetitle/ptbg-contact_m.webp);}
.pt-recruit {background-image: url(../img/pagetitle/ptbg-recruit_m.webp);}
.pt-company {background-image: url(../img/pagetitle/ptbg-company_m.webp);}
.pt-gallery {background-image: url(../img/pagetitle/ptbg-gallery_m.webp);}
.pt-intro {background-image: url(../img/pagetitle/ptbg-intro_m.webp);}
.pt-service {background-image: url(../img/pagetitle/ptbg-service_m.webp);}

 /* Header */
 header figure {
  width:100px;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top:10px;
  left:50%;
  z-index:18600;
  transform: translateX(-50%);
}
header figure img {
  width:100%;
  height: auto;
  display: block;
}

 /* Pagetitle */
 .pagetitle {
  width: 100%;
  display: block;
 }
 .ptbody {
  width: 100%;
  height: 300px;
  max-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  padding:0 5% 30px;
  background-color: rgba(255,255,255,0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
 }
.ptbody h1 {
  font-size: clamp(18px, 1.25vw, 50px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1em;
  margin-bottom: 1em;
  order:2;
}

.ptbody p {
  font-size: clamp(50px, 5vw, 80px);
  font-weight: 400;
  font-family: var(--font-en);
  line-height: 1em;
  letter-spacing: -0.03em;
  order:1;
}

.ptbody ul {
  margin: 0;
  display: flex;
  justify-content: center;
  order:3;
}
.ptbody ul li {
  font-size: 12px;
  line-height: 1em;
}
.ptbody ul li:after {
  content:" > ";
  margin-left: 0.5em;
  margin-right:0.5em;
}
.ptbody ul li:last-child:after {
  content:"";
}

/* Contents */
.bg-fixed {
  position: fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-repeat:no-repeat;
  background-position:center top;
  background-size:cover;
  z-index:-1;
}
#wrapper {
  background-image: none;
  z-index:1;
}

/* Main */
main p.scl_pbn {
  width:150px;
  height: 30px;
  display: block;
  background-image: url(../img/header/ic-ar_v_b.webp);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: auto 30px;
  background-color: rgba(255,255,255,0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%);

  text-indent: -9999px;
  margin:0 auto;
}
.contentsmain {
  width: 100%;
  height: auto;
  display: block;
  background-color: rgba(255,255,255,0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}


/* ContactMeshods */
ul.contactmethods {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
}
ul.contactmethods li {
  width: 100%;
  margin: 0 0 10px 0;
  overflow: hidden;
  border-radius: 10px;
  background-color: var(--color-white);
  background-image: url(../img/header/box-1st.webp);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 5px 0%;
  box-shadow:0px 10px 10px rgba(0,0,0,0.2);
  transition: .4s all;
}
ul.contactmethods li:hover {
  background-size: 5px 100%;
}
ul.contactmethods li a {
  width: 100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:5% 5%;
}
ul.contactmethods li a h4 {
  font-size: clamp(16px, 1.5vw, 20px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1em;
  margin-bottom: 0.5em;
}
ul.contactmethods li.come_tel a:hover p {
  color:var(--color-1st);
  transition: .4s all;
}
ul.contactmethods li.come_tel a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(22px, 1.75vw, 30px);
  font-weight: 500;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}
ul.contactmethods li.come_mail a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(16px, 1.25vw, 30px);
  font-weight: 500;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}
ul.contactmethods li.come_web a p {
  width: 100%;
  height: auto;
  display: block;
  font-size: clamp(16px, 1.25vw, 30px);
  font-weight: 500;
  line-height: 50px;
  padding-left:50px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 40px;
  margin-bottom: 0em;
}


/* Gallery
----------------------------------------------------*/

/* Gallery01 */
.gallery01 {
  width: 100%;
  height: auto;
  display: block;
  padding:150px 5% 100px;
}
.gallery01 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.gallery01 ul li {
  width:46%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin-right:2%;
  margin-left:2%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
}
.gallery01 ul li:nth-child(1) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(2) {
  margin-top: 5%;
  margin-bottom: 5%;
}
.gallery01 ul li:nth-child(3) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(4) {
  margin-top: 5%;
  margin-bottom: 5%;
}
.gallery01 ul li:nth-child(5) {
  margin-top: 0;
}
.gallery01 ul li:nth-child(6) {
  margin-top: 5%;
}

/* Gallery02 */
.gallery02 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery02 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery02 ul li {
  width:50%;
  height: auto;
  display: block;
  background-color: #ccc;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
}

/* Gallery03 */
.gallery03 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery03 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery03 ul li {
  width:45%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
}
.gallery03 ul li:nth-child(1) {
  margin-top:5%;
  margin-bottom: 5%;
}
.gallery03 ul li:nth-child(4) {
  margin-top:5%;
}

/* Gallery04 */
.gallery04 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery04 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery04 ul li {
  width:45%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
}
.gallery04 ul li:nth-child(2) {
  margin-top:5%;
  margin-bottom: 5%;
}
.gallery04 ul li:nth-child(3) {
  margin-top:5%;
}

/* Gallery05 */
.gallery05 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery05 ul {
  width: 90%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin:0 auto;
}
.gallery05 ul li {
  width:48%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 1%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
}
.gallery05 ul li:nth-child(2) {
  margin-top:8%;
}

/* Gallery06 */
.gallery06 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery06 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery06 ul li {
  width:40%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
}
.gallery06 ul li:nth-child(1) {
  margin-top:0;
}
.gallery06 ul li:nth-child(2) {
  margin-top:5%;
}
.gallery06 ul li:nth-child(3) {
  margin-top:10%;
}

/* Gallery07 */
.gallery07 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery07 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery07 ul li {
  width:40%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin:0 5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
}
.gallery07 ul li:nth-child(1) {
  margin-top:10%;
  margin-bottom: 5%;
}
.gallery07 ul li:nth-child(2) {
  margin-top:5%;
}
.gallery07 ul li:nth-child(3) {
  margin-top:0%;
}

/* Gallery08 */
.gallery08 {
  width: 100%;
  height: auto;
  display: block;
  padding:50px 5% 100px;
}
.gallery08 ul {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin:0 auto;
}
.gallery08 ul li {
  width:45%;
  height: auto;
  display: block;
  background-color: #ccc;
  margin-right:2.5%;
  margin-left:2.5%;
  overflow: hidden;
  border-radius: 3px;
  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
}
.gallery08 ul li:nth-child(1) {
  margin-top: 0;
}
.gallery08 ul li:nth-child(2) {
  margin-top: 5%;
  margin-bottom: 2.5%;
}
.gallery08 ul li:nth-child(3) {
  margin-top: 0;
}
.gallery08 ul li:nth-child(4) {
  margin-top: 5%;
}

/* Gallery ani */
.gallery01 ul.aniactive {
  margin-top:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery01 ul.animove {
  margin-top:0%;
  opacity: 1;
}

.gallery02 ul.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery02 ul.animove {
  margin-right:auto;
  opacity: 1;
}

.gallery03 ul li.aniactive {
  margin-left:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery03 ul li.animove {
  margin-left:0%;
  opacity: 1;
}

.gallery04 ul li.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery04 ul li.animove {
  margin-right:0%;
  opacity: 1;
}

.gallery05 ul li:nth-child(1).aniactive {
  margin-top:8%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery05 ul li:nth-child(1).animove {
  margin-top:0%;
  opacity: 1;
}

.gallery05 ul li:nth-child(2).aniactive {
  margin-top:0%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery05 ul li:nth-child(2).animove {
  margin-top:8%;
  opacity: 1;
}

.gallery06 ul.aniactive {
  margin-left:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery06 ul.animove {
  margin-left:0%;
  opacity: 1;
}

.gallery07 ul.aniactive {
  margin-top:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery07 ul.animove {
  margin-top:0%;
  opacity: 1;
}

.gallery08 ul.aniactive {
  margin-right:5%;
  opacity: 0;
  transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
}
.gallery08 ul.animove {
  margin-right:0%;
  opacity: 1;
}



/* Service
--------------------------------------------------*/
.sectiontitle {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 30px;
}
.sectiontitle h3 {
  font-size: clamp(18px, 3vw, 40px);
  font-family: var(--font-min);
  font-weight: 500;
  line-height: 1.2em;
  margin-bottom: 0.25em;
}
.sectiontitle p {
  font-size: clamp(10px, 1.6vw, 18px);
  font-weight: 500;
  font-family: var(--font-en);
  line-height: 1.2em;
  color:var(--color-1st);
}




/* Intro
--------------------------------------------------*/
.introtxt {
  font-family: var(--font-min)!important;
  font-size: clamp(14px, 1.25vw, 40px)!important;
}



}