@charset "UTF-8";

.mainvisual{margin-bottom:5%;height:600px;position:relative;overflow:hidden;}
.mainvisual .inner{display:flex;align-items:center;justify-content:space-between;position: relative;height: 100%;}
.mainvisual .img{position:absolute;top:0;right:0;width:clamp(40%,45vw,55%);height:100%;}
.mainvisual .img img{width:100%;height:100%;object-fit:cover;}
.mainvisual .text{position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:2;width:55%;margin-left: 5%;}
.mainvisual .catchphrase{font-size:clamp(32px,6vw,70px);font-weight:700;letter-spacing:0.1em;line-height:1.1;}
.mainvisual .description{font-size:clamp(14px,2.5vw,24px);font-weight:600;letter-spacing:0.1em;margin-top:2%;margin-left:1%;}
@media screen and (max-width:767px){
.mainvisual{height:auto;margin-bottom:10%;overflow:visible;}
.mainvisual .inner{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;height:auto;margin-top:6%;position:relative;}
.mainvisual .text{position:relative;top:auto;left:auto;transform:none;width:90%;margin-left:5%;z-index:2;}
.mainvisual .catchphrase{font-size:clamp(38px,13vw,56px);line-height:1.1;letter-spacing:0.08em;}
.mainvisual .description{font-size:clamp(14px,4vw,18px);margin-top:4%;margin-left:0;letter-spacing:0.08em;}
.mainvisual .img{position:relative;top:auto;right:auto;width:90%;height:auto;margin:8% auto 0;}
.mainvisual .img img{width:100%;height:auto;object-fit:contain;display:block;}
}
.concept{width:100%;}

.concept .concept-inner .title{display:block;font-size:clamp(16px,2.5vw,24px);font-weight:500;margin-bottom:1%;letter-spacing:0.1em;}
.concept .description{line-height:1.8;margin:0 auto;}
.concept .title span{color:#EA9E9E ;}

@media screen and (max-width:767px){
.concept{margin-bottom:10%;padding:0 5%;}
.concept .description{font-size:14px;line-height:1.9;}
.concept .description br{display:none;}
}

.profile{margin:6% auto;max-width: 1200px;position: relative;}
.profile .item{display:flex;}
.profile .item .img{width:30%;margin-right:5%;}
.profile .item .img img{opacity: .75;border-radius: 10%;}
.profile .item .text{width:55%;padding-top:5%;display:flex;flex-direction:column;}
.profile .item .text .en{font-size:18px;font-weight:500;letter-spacing:0.1em;}
.profile .item .text .jp{font-size:32px;letter-spacing:0.1em;margin-bottom:3.2%;}
.profile .item .text .description{line-height:1.8;}
.profile .btn{margin-left:auto;margin-top:0;position: absolute;right: 10%;bottom: 0;}

@media screen and (max-width:767px){
.profile{margin-bottom:6%;padding:0 5%;}
.profile .item{flex-direction:column;align-items:flex-start;}
.profile .item .img{display:none;}
.profile .item .text{width:100%;padding-top:0;}
.profile .item .text .en{font-size:12px;}
.profile .item .text .jp{font-size:20px;font-weight:500;margin-bottom:2%;}
.profile .item .text .description{font-size:14px;line-height:1.9;}
.profile .btn{max-width:180px;margin:5% auto 0;position:static;}
}

.parallax{height:600px;background-image:url(img/parallax-1.png);background-attachment:fixed;background-size:cover;background-position:center;margin-bottom:8%;}
@media screen and (max-width:767px){
.parallax{height:150px;background-attachment:scroll;margin-bottom:2%;}
}
#works{width: 90%;max-width: 1200px;margin: 0 auto;}
.works-list {grid-template-columns:repeat(3,1fr);gap:30px;margin-bottom:5%;display:none;width: 90%;max-width: 1200px;}
.works-list.active {display:grid;}
.works-list li {position:relative;aspect-ratio:4/3;overflow:hidden;}
.works-list li img {width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.3s ease;}
.works-list li:hover img {transform:scale(1.1);}
.works-list li .info {width:100%;height:100%;display:flex;align-items:center;flex-direction:column;justify-content:center;background-color:rgba(0,0,0,0.6);color:#fff;position:absolute;top:0;left:0;opacity:0;transition:all 0.6s ease;}
.works-list li:hover .info {opacity:1;}
.works-list li .info .name {font-size:clamp(13px,2.5vw,16px);margin-bottom:5px;}
.works-list li .info .detail {font-size:clamp(16px,2.5vw,20px)}
#works .btn{margin:0 auto;}

@media screen and (max-width:767px){
#works{width:90%;margin:0 auto 4%;}
.works-list{width:100%;grid-template-columns:1fr;gap:5%;margin-bottom:10%;}
.works-list.active{display:grid;}
.works-list li{aspect-ratio:4/3;}
.works-list li .info{opacity:1;background-color:rgba(0,0,0,0.45);}
.works-list li:hover img{transform:none;}
.works-list li .info .name{font-size:13px;margin-bottom:2%;}
.works-list li .info .detail{font-size:16px;}
#works .btn{margin:10% auto ;}
}

#contact-form{max-width: 1200px;margin: 2% auto;width: 90%;}
#contact-form dt{font-weight:500;margin-bottom:1%;}
#contact-form dt .require{color:#e52d27;margin-left:0.5%;}
#contact-form dd{margin-bottom:4%;background: #fafafa;}
#contact-form dd input[type="text"],#contact-form dd input[type="email"],#contact-form dd input[type="tel"]{width:100%;border:solid 1px #ccc;padding:1.5% 1%;}
#contact-form dd select{width:100%;border:solid 1px #ccc;padding:1.5% 1%;font-size:15px;background-color:#fff;}
#contact-form dd textarea{width:100%;height:200px;border:solid 1px #ccc;padding:1.5% 1%;}
#contact-form .btn{margin:0 auto;}
#contact-form .btn input{color:#1f1f1f;}
#contact-form .btn:hover input{color:#ffffff;}
#contact-form .privacy-policy{font-size:15px;margin-bottom:4%;}
#contact-form .privacy-policy .privacy-text{max-width:640px;height:200px;border:solid 1px #ccc;padding:4% 2%;margin:0 auto 3%;overflow-x:hidden;background: #fafafa;}
#contact-form .privacy-policy .privacy-text .privacy-title{font-weight:500;margin-bottom:3%;text-align:center;}
#contact-form .privacy-policy .privacy-text .description{line-height:1.1;}
#contact-form .privacy-policy .privacy-text ol{line-height:2;margin-top:3%;}
.form-area .privacy-policy .privacy-text ol li{margin-bottom:2%;}
#contact-form .privacy-policy .privacy-item{text-align:center;}