@charset "utf-8";

h1{
  font-size: 3rem;
  font-weight: bold;
}
h2{
  font-size: 2.5rem;
  margin-bottom: 40px;
  text-align: center;
}
h1,h2{
  color: var(--mainColor02);
}
h3,p,.works-nav a{
  color: #000;
}

h3{
  font-size: 1.5rem;
  margin-bottom: 1rem;
}
p{
  margin-bottom: 2rem;
  line-height: 2;
}
header{
  background-color: rgba(var(--mainColor02-rgb), 0.9);
}



/******************************/
/************************ mb **/
/******************************/
@media (max-width:600px){
  .no-mb{
    display: none;
  }

  .works-detail{
    padding: 150px 20px 100px;
  }
  
  .works-detail-inner{
    padding-top: 50px;
    text-align: center;
  }
  .works-img{
    width: 100%;
    max-width: 350px;
    margin: 0 auto;   
  }
  .works-img img{
    filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.3));
  }
  
  .works-text{
    padding-top: 50px;
  }
  .works-info{
    text-align: left;
  }
  .works-nav {
    margin: 50px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 150px; 
  }
  .nav-btn {
    display: inline-block;
  }
  .nav-btn:hover {
    transform: translateY(-4px);
  }

  /* work04,05 */


.works-text-web{
  padding-top: 5rem;
}
.works-img-web img{
width: 200px;
height: 400px;
padding: 20px;
}
.pc-img img{
  width: 400px;
  height: auto;
}
.site-link{
  color: blue;
}
.display{
  display: flex;
}
.contact-mb img,
.news-mb img{
  width: 200px;
  padding: 20px;
}
}

  


/******************************/
/************************ pc **/
/******************************/
@media (min-width:600px){

.contact-mb,
.news-mb{
  display: none;
}

.works-detail{
  padding: 150px 0;
}

.works-detail-inner{
  padding-top: 50px;
  display: flex;
}
.works-img{
  width: 100%;
  max-width: 420px;      
  display: flex;
  justify-content: center; /* 横中央 */
  align-items: center;     /* 縦中央 */
 
}
.works-img img{
  filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.3));
}

.works-text{
  padding-left: 70px;
}

.works-nav {
  margin: 80px auto 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 150px;
}
.nav-btn {
  display: inline-block;
}
.nav-btn:hover {
  transform: translateY(-4px);
}

/* work04,05 */
.works-text-web{
  padding-top: 5rem;
}
.works-img-web{
display: flex;
justify-content: space-around;
}
.works-img-web img{
width: 350px;
height: 600px;
padding: 30px;
}
.pc-img img:first-child{
  width: 500px;
  height: 550px;
}
.pc-img img:last-child{
  width: 500px;
  height: 450px;
}
.site-link{
  color: blue;
}


}