@charset "UTF-8";

/* 背景色 ここから---------------------------------------------------------------------------------------*/
body {
  background-color: #f4f4f4;
  /* background-color: #c2b9b2; */
}

/* 実績背景色*/
.work-item ,.sample-item {
  background-color: #f4f4f4;
  /* background-color: #523f3c; */
}
/* 実績背景色 */
.homegallery-grid .item img, .homeworks img, #gallery .art img {
  background-color: #fff;
  background-color: rgba(0,0,0,0.0);
}
/* ナビゲーションバー ---------------------------------------------------------------------------------------*/
.page-header, .main-nav,.hamburger-demo-menuwrap,.demobox-header , nav a{
  background-color: #f4f4f4;
  background-color: #092e58;
  color: #f4f4f4;
}
 /* ハンバーガーアイコン */
  .hamburger-switch-line1, .hamburger-switch-line1:before, .hamburger-switch-line1:after{
    background: #333; /* ハンバーガーアイコンの色 */
    background: #f4f4f4; /* ハンバーガーアイコンの色 */

  }


/*フォント ここから---------------------------------------------------------------------------------------*/

/* フォント メインカラー */
body, p, .mizusoko-name,  .request-text, .sample-text, .contact-text {
  color: #333;
}

.work-caption p {
  color: #333;
  /* color: #f4f4f4; */
}

/* フォント サブカラー */
footer, .js-copybtn, .work-tag li {
  color: #523f3c;
}
/* フォント 白文字（ヘッダーやボタンホバー時の色） */
.page-title,.button:hover,.mail a, #gallery .genre:before, #gallery .genre:after, .js-copybtn:hover, .work-tag li.active, .work-tag li:hover {
  color:#f4f4f4;
}

/* 外部リンク */
.request-text a {
  color: rgb(63, 116, 175);
}

/* 薄い色（ナビホバーや注意文） */
nav a:hover, .attention,.gray {
  color: rgb(150, 150, 150 ,0.6);
}

/* 赤文字 */
.red {
  color: #bb0000;
}
/* 青文字 */
.Blue {
  color: #033e81;
}
/* ボタン---------------------------------------------------------------------- */
.button {
  color: #523f3c;
  color: #092e58;
}
.button:hover,#gallery .genre:before, #gallery .genre:after, .js-copybtn:hover, .work-tag li.active, .work-tag li:hover {
  border-color: #523f3c;
  border-color: #092e58;
  background-color: #523f3c;
  background-color: #092e58;
}

/* 依頼ページ項目区切り線 --------------------------------------------------------------*/
.request-border {
  position: relative;
  border-bottom: 1.5px dashed;
  border-color: #523f3c;
}.price {
  border-color: #523f3c;
}

/* シャドウ--------------------------------------------------------------------------------------- */
.pagetop, .homegallery-grid .item img, #gallery .art img, .work-item {
  box-shadow: 0 0 5px rgba(0,0,0,0.4);;
}
.page-header {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);;
}