@charset "UTF-8";

/*================================================
 *  一般・共通設定
 ================================================*/

 .photoSmp {
   display: none;
 }


 /* タブレット向けレイアウト */
 @media all and (max-width: 1224px) {
   .aboutP {font-size: 1.3em;}
   .aboutSP {font-size: 1em;}
   .serviceP {font-size: 1.1em; padding-bottom: 10px;}

}

/* タブレット向けレイアウト */
@media all and (max-width: 1024px) {

  .header-title h1 {font-size: 2em;}
  .top p {top: 15%;}
  #topP {font-size: 2.5em; line-height: 1;}
  #topSP {display: none;}
  .menu-title h2 {font-size: 2em;}
  .menu-title h3 {font-size: 4em;}
  .menu-text p {margin: 10px;}
  .about-title h4 {font-size: 2em;}
  .service-title h4 {font-size: 1.5em;}
  .titleP {font-size: 1em;}
  .aboutP {font-size: 1em; padding-bottom: 20px;}
  .serviceP {font-size: 0.9em; padding-bottom: 10px;}
  p {font-size: 0.8em;}
  .aboutSP {font-size: 0.8em;}
  .company-table {font-size: 0.8em;}

}



 /* スマホ向けレイアウト */
 @media all and (max-width: 800px) {

   header, .header-bk {height: 60px;}
   .hamburger {top: 61px;}

   #topP {font-size: 2em;}
   .menu-title h2 {font-size: 1.5em;}
   .menu-title h3 {font-size: 3em;}
   .about-title h4 {font-size: 1.5em;}
   .service-title h4 {font-size: 1em;}
   .service-button a {font-size: 1em;}

   .menu-text p {margin: 20px;}
   #pink p {text-align: center;}
   .about-title {margin: 40px auto 10px auto;}
   .service-button {width: 100px;}
   .menu-container {flex-direction: column;}
   .menu-text, .menu-photo, .menu-contact {width: 100%;}
   #pink {background-color: #FFFFFF;}
   .serviceRes {order: 1;}
   .serviceResTex {margin-bottom: 30px;}
   .photoPc {display: none;}
   .photoSmp {display: block;}

   a.anchor {padding-top: 130px;margin-top: -130px;}

   /* ハンバーガー */
  header {align-items: center;}
  .header-menu {display: none;}
  .open {display: block;}
  .open.active {display: none;}
  .close.active {display: block;}


}

 /* スマホ向けレイアウト */
 @media all and (max-width: 450px) {
   #topP {font-size: 1.2em;}
   .menu-title h2 {font-size: 1.5em;}
   .menu-title h3 {font-size: 2em;}
   .about-title h4 {font-size: 1.2em;}

   .service-title {background: linear-gradient(to left, #c09236 70%, #FFFFFF);}

   a.anchor {padding-top: 100px;margin-top: -100px;}

}