/*　画面サイズが900px以下の場合ここの記述が適用される　*/
@media screen and (max-width:900px) {
/* 共通 */
.inner {
  width: auto;
}
.about header, 
.works header, 
.works header, 
.contact header, 
.thanks header {
  height: 150px;
}
header .nav_pc {
  display: none;
}
.hamburger-button {
  display: flex;
}
main {
  width: auto;
}
article{
  margin-bottom: 60px;
}
.home h2, 
.about h2,
.works h2,
.contact h2,
.thanks h2 {
  text-align: center;
  font-size: 40px;
}
.about h2, 
.works h2,
.contact h2 {
  margin-top: -150px;
}
footer {
  height: 110px;
}
.footer_fixed {
  display: none;
}
.back-top {
  right: 5%;
  bottom: 100px;
}



/* トップページ */
.home .slider {
  display: none;
}
.home .slider_sp {
  display: block;
  text-align: center;
  margin-bottom: 30px;
}
.home .greeting_back {
  height: 640px;
  margin-bottom: 60px;
}
.home .greeting_back h2 {
  position: static;
  text-align: center;
  padding-top: 10px;
}
.home .greeting_back img {
  position: absolute;
  top: 80px;
  right: 0;
  left: 0;
  margin: auto;
}
.home .greeting_back .greeting_text {
  top: 360px;
  width:530px;
  height: 250px;
  right: 0;
  left: 0;
  margin: auto;
}
.home .greeting_back .greeting_text p {
  position: absolute;
  z-index: 2;
  right: 0;
  left: 0;
  margin: auto;
  width: 470px;
}
.home .greeting_back .link_box {
  bottom: 5px;
}
.home h3 {
  font-size: 40px;
  text-align: center;
  margin-bottom: 60px;
}
.home .top_works {
  display: block;
  margin-bottom: 60px;
}
.home .top_works img {
  margin-bottom: 15px;
}
.home .top_works .top_web_link {
  margin-bottom: 60px;
}

/* about */
.about .about_first {
  display: block;
}
.about .about_first img {
  width:210px; 
  display: block;
  margin: 0 auto;
  margin-bottom: 30px;
}
.about .about_first .about_text {
  margin-top: 0;
  width: 500px;
  margin-right: auto;
  margin-left: auto;
}
.about dl {
  width: 480px;
  margin-bottom: 60px;
}
.about dl dt {
  width: 130px;
}
.about dl dd {
  width: 350px;
}
/* skills */
.about .skill_back h3 {
  font-size: 40px;
  text-align: center;
  top: -10px;
  margin-bottom: 60px;
}
.about .skill_back {
  height: 100%;
  padding-bottom: 15px;
}
.about .skill_back .skills_head {
  display: block;
}
.about .skill_back .skills_contents {
  display: inline;
  align-items: flex-start;
  width: 380px;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 30px;
}
.about .skill_back .skills_head .skills_contents img {
  padding-bottom: 0;
}
/* works */
.works h3 {
  font-size: 24px;
}
.works .works_web {
  display: block;
  margin-bottom: 60px;
}
.works .works_web .float {
  margin-right: auto;
  margin-left: auto;
}
.works .works_web img {
  margin-bottom: 30px;
}
.works .works_dtp_back {
  height: 100%;
  padding-bottom: 15px;
}
.works .works_dtp_back h3 {
  top: -6px;
}
.works .works_dtp_back .works_dtp {
  display: block;
}
.works .works_dtp_back .works_dtp .float {
  margin-right: auto;
  margin-left: auto;
}
.works .works_dtp_back .works_dtp img{
  display: block;
  margin: 0 auto 30px auto;
}

/* web下層ページ */
.underpage_web ol {
  display: none;
}
.underpage_web figure {
  margin-bottom: 60px;
}
.underpage_web figure img {
  width: 80%;
}
.underpage_web .underpage_web_textbox {
  margin-bottom: 60px;
}
.underpage_web h2 {
  font-size: 14px;
  width: 80%;
  text-align: left;
  margin-left: 11%;
}
.underpage_web dl {
  font-size: 12px;
  width: 70%;
  margin-bottom: 60px;
}
.underpage_web dt {
  width:20%;
}
.underpage_web dd {
  width: 80%;
}
.underpage_web .underpage_web_text {
  font-size: 12px;
  width: 70%;
  text-align: left;
  margin-bottom: 30px;
}
.underpage_web .button_box {
  margin-left: 15%;
  gap: 0 auto;
}
.underpage_web .link_website {
  font-size: 12px;
  width: 150px;
  height: 30px;
}
.underpage_web .link_back {
  font-size: 12px;
  width: 50px;
}


 /* DTP下層ページ */
 .underpage_dtp ol {
  display: none;
}
.underpage_dtp figure {
  margin-bottom: 60px;
}
.underpage_dtp figure img {
  width: 80%;
}
.underpage_dtp .underpage_dtp_textbox {
  margin-bottom: 60px;
}
.underpage_dtp h2 {
  font-size: 14px;
  width: 80%;
  text-align: left;
  margin-left: 11%;
}
.underpage_dtp dl {
  font-size: 12px;
  width: 70%;
  margin-bottom: 60px;
}
.underpage_dtp dt {
  width: 20%;
}
.underpage_dtp dd {
  width: 80%;
}
.underpage_dtp .underpage_dtp_text {
  font-size: 12px;
  width: 70%;
  text-align: left;
  margin-bottom: 30px;
}
.underpage_dtp .button_box {
  margin-left: 15%;
  gap: 0 auto;
}
.underpage_dtp .link_back_dtp {
  font-size: 12px;
  width: 50px;
}
/* contact */
.contact .contact_text {
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}
.contact p {
  text-align: left;
  display: inline-block;
}
.contact table {
  margin-right: auto;
  margin-left: auto;
}
.contact button {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

/* thanks */
.thanks .thanks_text {
  width: 80%;
  margin-right: auto;
  margin-left: auto;
}
.thanks .thanks_sign {
  text-align: right;
  margin-right: 11%;
}
}

/*　画面サイズが600px以下の場合ここの記述が適用される　*/
@media screen and (max-width:600px) {
/* header */
header {
  height: 100px;
}
header h1 {
  position: absolute;
  top: 30px;
  left: 30px;
}
header h1 img{
  width: 80%;
  height: 80%;
}

/* トップページ */
.home .slider_sp img{
  width: 80vw;
  height: 100%;
}
.home .greeting_back {
  height: auto;
}
.home .greeting_back img {
  position: static;
  display: block;
  margin: 0 auto;
  margin-bottom: 30px;
}
.home .greeting_back h2 {
  position: static;
  margin-bottom: 30px;
}
.home .greeting_back .greeting_text {
  position: static;
  height: auto;
  width: auto;
}
.home .greeting_back .greeting_text p {
  position: static;
  width: 80%;
}
.home .greeting_back .greeting_text .link_box {
  position: static;
  text-align: center;
}
.home .top_works img {
  width: 80%;
  height: 80%;
}

/* about */
.about .about_first {
  width: auto;
  margin: 0 auto;
  font-size: 12px;
  line-height: 24px;
}
.about .about_first .about_text {
  width: 80%;
  margin-bottom: 30px;
}
.about dl {
  text-align:center;
  margin-left:10%;
  width: 80%;
}
.about dl dt {
  width: 35%;
}
.about dl dd {
  width: 65%;
}
/* skills */

.about .skill_back .skills_head .skills_contents {
  gap: 0 20px;
  width: 80%;
}
/* underpageweb */
.underpage_web {
  line-height: 24px;
}
.underpage_web dl {
  text-align: left;
  margin-left:10%;
  width: 75%;
  margin-bottom: 30px;
}
.underpage_web dt {
  width: 30%;
}
.underpage_web dd {
  width: 70%;
}
.underpage_web .underpage_web_text {
  width: 75%;
  margin: auto auto 30px auto;
}
.underpage_web .button_box {
  display: block;
  margin: 0 auto;
}
.underpage_web .link_website  {
  display: block;
  margin: 0 auto;
  margin-bottom: 30px;
}
.underpage_web .link_back {
  display: block;
  margin: 0 auto;
}

/* dtp下層ページ */
.underpage_dtp {
  line-height: 24px;
}
.underpage_dtp dl {
  text-align: left;
  margin-left:10%;
  margin-bottom: 30px;
  width: 75%;
}
.underpage_dtp dt {
  width: 30%;
}
.underpage_dtp dd {
  width: 70%;
}
.underpage_dtp .underpage_dtp_text {
  width: 75%;
  margin: auto auto 30px auto;
}
.underpage_dtp .link_back_dtp {
  display: block;
  margin: 0 auto;
}
/* contact */
.contact .contact_text {
  width: 80%;
}
.contact table input {
  width: 350px;
}
.contact table textarea {
  width: 350px;
}
}