@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&display=swap");
@font-face {
  font-family: 'NotoSansCJKjp';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/NotoSansCJKjp-Regular.woff2") format("woff2"), url("../fonts/NotoSansCJKjp-Regular.woff") format("woff"), url("../fonts/NotoSansCJKjp-Regular.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: 'NotoSansCJKjp';
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/NotoSansCJKjp-Medium.woff2") format("woff2"), url("../fonts/NotoSansCJKjp-Medium.woff") format("woff"), url("../fonts/NotoSansCJKjp-Medium.ttf") format("truetype");
  font-display: swap;
  font-display: swap;
}

@font-face {
  font-family: 'NotoSansCJKjp';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/NotoSansCJKjp-Bold.woff2") format("woff2"), url("../fonts/NotoSansCJKjp-Bold.woff") format("woff"), url("../fonts/sNotoSansCJKjp-Bold.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: 'NotoSerifCJKjp';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/NotoSerifCJKjp-Regular.woff2") format("woff2"), url("../fonts/NotoSerifCJKjp-Regular.woff") format("woff"), url("../fonts/NotoSerifCJKjp-Regular.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: 'NotoSerifCJKjp';
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/NotoSerifCJKjp-SemiBold.woff2") format("woff2"), url("../fonts/NotoSerifCJKjp-SemiBold.woff") format("woff"), url("../fonts/NotoSerifCJKjp-SemiBold.ttf") format("truetype");
  font-display: swap;
}

/*--------------------------
 ブレークポイント設定
----------------------------*/
:focus {
  outline: none;
}

/* 変数 -----*/
/*--------------------------
 共通設定
----------------------------*/
body {
  font-family: "NotoSansCJKjp", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Yu Gothic", YuGothic, "Helvetica Neue", Arial, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #221815;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.5px;
}

body img {
  width: 100%;
}

body .wrap {
  position: relative;
}

body .uk-container {
  max-width: 1000px;
}

body h1, body h2, body h3, body h4, body h5, body h6 {
  font-family: "NotoSansCJKjp", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Yu Gothic", YuGothic, "Helvetica Neue", Arial, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 1.5;
  color: #221815;
}

/*--------------------------
    フォントサイズ
----------------------------*/
html {
  font-size: 62.5%;
}

body {
  font-size: 16px !important;
  font-size: 1.6rem !important;
  text-align: left !important;
  position: relative;
}

@media (max-width: 767px) {
  body {
    font-size: 14px !important;
    font-size: 1.4rem !important;
  }
}

@media (max-width: 959px) {
  body {
    margin-bottom: 70px;
  }
}

/* PC時tel無効 ------*/
@media (min-width: 768px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}

@media (min-width: 1600px) {
  .uk-hidden-xlarge {
    display: none !important;
  }
}

.uk-visible-xlarge {
  display: none;
}

@media (min-width: 1600px) {
  .uk-visible-xlarge {
    display: block !important;
  }
}

/* --- スマホ縦　非表示　--- */
@media (max-width: 640px) {
  .uk-hidden-xs {
    display: none !important;
  }
}

/* --- スマホ縦のみ表示　--- */
@media (min-width: 480px) {
  .uk-visible-xs {
    display: none !important;
  }
}

@media (max-width: 640px) {
  .uk-visible-xs {
    display: block !important;
  }
}

/*--------------------------
    中央配置
----------------------------*/
/* 上下左右中央配置 */
/* 上下のみ中央配置 */
/* 左右のみ中央配置 */
/* 中央配置解除 */
/* margin auto */
.svg-wrap {
  height: 0;
  position: relative;
}

.svg-wrap img {
  height: 100%;
  display: block;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

/* リンク------*/
a {
  transition: all 0.5s ease 0s;
  color: #221815;
}

a:hover {
  transition: all 0.5s ease 0s;
}

a img {
  transition: all 0.5s ease 0s;
}

a:hover {
  text-decoration: none;
}

a:hover img {
  transition: all 0.5s ease 0s;
}

/* lightbox */
.uk-lightbox {
  z-index: 9999;
}

.uk-lightbox.uk-transition-active.uk-active .uk-lightbox-caption {
  bottom: 50px;
}

#ToolBar #UserMenu img {
  width: auto;
}

/*--------------------------
 共通事項
----------------------------*/
a:hover {
  color: #000;
}

a:hover .uk-overlay-scale {
  /* transform: scale(1.1);*/
  filter: opacity(70%);
  transition: all 0.5s ease 0s;
}

.uk-section {
  margin-left: auto;
  margin-right: auto;
}

p {
  line-height: 1.8;
}

/* ※注意書き ----*/
.att {
  text-indent: -0.5em;
  padding-left: 1em;
}

.att::before {
  content: '※';
  display: inline-block;
}

/* アニメーション----*/
.uk-animation-slide-bottom-small {
  animation-duration: 0.8s;
}

@keyframes uk-fade-bottom-small {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/*--------------------------
 ヘッダー
----------------------------*/
header {
  display: block;
  padding: 20px 0;
  background: #fff;
  transition: all 0.5s ease 0s;
  /* siteid-----*/
  /* グローバルナビ -----*/
}

header .header__inner {
  display: flex;
  width: calc(100% - 200px);
}

@media (max-width: 1299px) {
  header .header__inner {
    width: calc(100% - 80px);
  }
}

@media (max-width: 959px) {
  header .header__inner {
    width: 100%;
  }
}

@media (max-width: 959px) {
  header {
    padding: 10px 0 0;
  }
}

header h1 {
  width: 320px;
  margin: 20px 0 0 30px;
  transition: all 0.5s ease 0s;
}

header h1 .svg-wrap {
  padding-top: 20%;
}

header h1 .svg-wrap img.test {
  display: none;
}

@media (max-width: 1299px) {
  header h1 {
    width: 250px;
  }
}

@media (max-width: 959px) {
  header h1 {
    margin-top: 0;
  }
}

@media (max-width: 767px) {
  header h1 {
    margin-left: 15px;
  }
}

@media (max-width: 640px) {
  header h1 {
    width: 220px;
  }
}

header .gnav {
  margin-left: auto;
  margin-right: 0;
  text-align: center;
}

@media (max-width: 1299px) {
  header .gnav {
    margin-right: 50px;
  }
}

@media (max-width: 959px) {
  header .gnav {
    display: none;
  }
}

header .gnav ul {
  display: flex;
  margin: 0;
}

header .gnav ul li {
  margin-top: 0 !important;
}

header .gnav ul li a {
  display: block;
  position: relative;
  padding: 0 20px;
  text-align: center;
}

@media (max-width: 1299px) {
  header .gnav ul li a {
    padding: 0 10px;
  }
}

header .gnav ul li a::before {
  content: '';
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  bottom: -8px;
  height: 5px;
  width: 60%;
  -webkit-transform: translate(-50%, 0) scale(0, 1);
  -ms-transform: translate(-50%, 0) scale(0, 1);
  transform: translate(-50%, 0) scale(0, 1);
  transition: all 0.5s ease 0s;
}

header .gnav ul li a img {
  width: 120px;
  height: 100px;
}

@media (max-width: 1299px) {
  header .gnav ul li a img {
    width: 100px;
    height: 80px;
  }
}

header .gnav ul li a:hover::before, header .gnav ul li a.current::before {
  -webkit-transform: translate(-50%, 0) scale(1, 1);
  -ms-transform: translate(-50%, 0) scale(1, 1);
  transform: translate(-50%, 0) scale(1, 1);
  transition: all 0.5s ease 0s;
}

header .gnav ul li.home a::before {
  background: #ff8ba7;
}

header .gnav ul li.product a::before {
  background: #45b6ff;
}

header .gnav ul li.about a::before {
  background: #ffc02e;
}

header .gnav ul li.access a::before {
  background: #00d08a;
}

header .gnav ul li.webcatalog a::before {
  background: #bb41ff;
}

header .gnav ul li.insta {
  padding: 25px 20px 25px 0;
}

header .gnav ul li.insta a img {
  width: 40px;
  height: 40px;
}

@media (max-width: 1299px) {
  header .gnav ul li.insta {
    padding: 30px 5px 30px 5px;
  }
  header .gnav ul li.insta a {
    padding: 0;
  }
  header .gnav ul li.insta a img {
    width: 30px !important;
    height: 30px !important;
  }
}

.touch-device header .gnav a:hover::before {
  content: none;
}

/*--------------------------
 スマホヘッダー
----------------------------*/
.spn__toggle {
  position: fixed;
  top: 0px;
  right: 10px;
  padding: 0;
  z-index: 9999;
  text-align: center;
  width: 50px;
  height: 50px;
}

.spn__toggle a {
  background: #fff;
  border: 3px solid #000;
  border-top: none;
  display: block;
  position: relative;
  height: 100%;
  border-radius: 0 0 10px 10px;
}

.spn__toggle a span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  width: 30px;
  height: 4px;
  background-color: #000;
  border-radius: 2px;
}

.spn__toggle a span:nth-of-type(1) {
  top: 15px;
}

.spn__toggle a span:nth-of-type(2) {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.spn__toggle a span:nth-of-type(3) {
  bottom: 15px;
}

.spn__toggle a[aria-expanded="true"] {
  background: #fff;
  animation: none;
}

.spn__toggle a[aria-expanded="true"] span {
  background: #221815;
}

.spn__toggle a[aria-expanded="true"] span:nth-of-type(1) {
  transform: translate(-15px, 8px) rotate(-45deg);
}

.spn__toggle a[aria-expanded="true"] span:nth-of-type(2) {
  opacity: 0;
}

.spn__toggle a[aria-expanded="true"] span:nth-of-type(3) {
  transform: translate(-15px, -8px) rotate(45deg);
}

/* メニュー開 */
#modal_menu {
  z-index: 9998;
  padding: 0;
  transform: translate(100%, 0%);
  transition: all 0.5s ease 0s;
  width: 250px;
  margin-left: calc(100% - 250px);
}

#modal_menu.uk-open {
  transform: translate(0%, 0%);
  transition: all 0.5s ease 0s;
}

#modal_menu .uk-modal-dialog {
  background: none;
  padding: 30px 0px;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  animation: bgchange 80s ease infinite;
  transform: translateY(0%);
  opacity: 1;
}

#modal_menu .uk-modal-dialog .logo {
  width: 160px;
  margin: 0 auto;
}

#modal_menu .uk-modal-dialog .logo .svg-wrap {
  padding-top: 40%;
}

#modal_menu .uk-modal-dialog .nav__gnav {
  padding: 30px;
}

#modal_menu .uk-modal-dialog .nav__gnav ul li {
  text-align: left;
  border-bottom: 1px solid #ccc;
  margin-top: 0 !important;
  mix-blend-mode: multiply;
}

#modal_menu .uk-modal-dialog .nav__gnav ul li a {
  padding: 20px;
  display: block;
  position: relative;
}

@media (max-width: 767px) {
  #modal_menu .uk-modal-dialog .nav__gnav ul li a {
    padding: 15px 0;
  }
}

#modal_menu .uk-modal-dialog .nav__gnav ul li.insta {
  margin-top: 20px !important;
  border-bottom: none;
}

#modal_menu .uk-modal-dialog .nav__gnav ul li.insta a {
  text-align: center;
}

#modal_menu .uk-modal-dialog .nav__gnav ul li.insta a img {
  width: 25px;
  height: 25px;
}

/*--------------------------
 ページのトップへ
----------------------------*/
#pageTop {
  position: fixed;
  bottom: 10px;
  right: 10px;
  z-index: 9999;
  margin: 0;
}

@media (max-width: 959px) {
  #pageTop {
    bottom: 80px;
    right: 10px;
  }
}

@media (max-width: 640px) {
  #pageTop {
    bottom: 100px;
  }
}

#pageTop a {
  display: block;
  width: 40px;
  height: 40px;
  position: relative;
  background: #221815;
  border-radius: 20px;
  color: #fff;
}

#pageTop a span {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  font-size: 14px;
  line-height: 1.1;
}

#pageTop a span::after {
  content: 'TOP';
  font-family: "Roboto Condensed", sans-serif;
  font-size: 10px;
  display: block;
}

/*--------------------------
 side
----------------------------*/
.side {
  position: fixed;
  right: 0;
  top: 50px;
  z-index: 99;
}

@media (max-width: 959px) {
  .side {
    left: 0;
    top: auto;
    bottom: 0;
  }
  .side__inner {
    display: flex;
    flex-wrap: wrap;
  }
}

.side__btn:nth-child(n+2) {
  margin-top: -2px;
}

.side__btn a {
  display: block;
  padding: 10px;
  border-radius: 10px 0 0 10px;
  border: 3px solid #000;
  border-right: 0;
  text-align: center;
  background: #fff;
}

.side__btn a img {
  width: 120px;
  height: 100px;
}

@media (max-width: 1299px) {
  .side__btn a img {
    width: 100px;
    height: 80px;
  }
}

@media (max-width: 959px) and (min-width: 651px) {
  .side__btn a img.port {
    display: none;
  }
}

@media (max-width: 767px) {
  .side__btn a img.port {
    width: 70px;
    height: 60px;
  }
}

.side__btn a img.land {
  display: none;
}

@media (max-width: 959px) and (min-width: 651px) {
  .side__btn a img.land {
    display: block;
    width: 200px;
    height: 40px;
    margin: 0 auto;
  }
}

.side__btn:first-child a:hover {
  background: #00cdd0;
}

.side__btn:nth-child(2) a:hover, .side__btn:nth-child(2) a.current {
  background: #ff9425;
}

.side__btn:nth-child(3) a:hover, .side__btn:nth-child(3) a.current {
  background: #ff7470;
}

@media (max-width: 959px) {
  .side__btn {
    width: 33.33%;
  }
  .side__btn:nth-child(n+2) {
    margin-top: 0px;
  }
  .side__btn a {
    border-radius: 0;
    border-bottom: 0;
  }
  .side__btn:first-child a {
    border-left: 0;
  }
}

.touch-device .side__btn a:hover {
  background: #fff;
}

/*--------------------------
 footer
----------------------------*/
footer {
  padding: 10px 50px;
  margin-top: 80px;
}

footer .ft__inner {
  display: flex;
}

@media (max-width: 1299px) {
  footer .ft__inner {
    display: block;
  }
}

footer .ft__info {
  display: flex;
}

@media (max-width: 1299px) {
  footer .ft__info {
    justify-content: center;
  }
}

@media (max-width: 767px) {
  footer .ft__info {
    display: block;
    text-align: center;
  }
}

footer .ft__info .ft__logo {
  width: 200px;
  height: 40px;
}

footer .ft__info .ft__logo .svg-wrap {
  padding-top: 18%;
}

@media (min-width: 1600px) {
  footer .ft__info .ft__logo {
    width: 250px;
    height: 46px;
  }
}

@media (max-width: 767px) {
  footer .ft__info .ft__logo {
    margin: 0 auto;
  }
}

footer .ft__info .ft__logo img.test {
  display: none;
}

footer .ft__info .ft__adress {
  margin: 15px 0;
  margin-left: 30px;
  font-size: 15px;
  line-height: 1.0;
}

@media (max-width: 640px) {
  footer .ft__info .ft__adress {
    font-size: 12px;
    line-height: 1.5;
    margin-top: 10px;
    margin-bottom: 10px;
  }
}

footer .ft__nav {
  margin-left: auto;
  margin-right: 0px;
}

@media (max-width: 1500px) {
  footer .ft__nav {
    margin: 0 auto;
  }
}

@media (max-width: 767px) {
  footer .ft__nav {
    display: none;
  }
}

footer .ft__nav ul {
  display: flex;
  padding: 14px 0;
  margin: 0;
  margin-left: -40px;
}

@media (max-width: 1500px) {
  footer .ft__nav ul {
    justify-content: center;
    padding: 5px;
  }
}

footer .ft__nav ul li {
  margin-left: 40px;
  margin-top: 0 !important;
  position: relative;
}

footer .ft__nav ul li::before {
  content: '';
  width: 1px;
  height: 15px;
  background: #000;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  left: -20px;
}

footer .ft__nav ul li:first-child::before {
  content: none;
}

footer .ft__nav ul li a {
  line-height: 1.0;
  font-size: 14px;
  white-space: nowrap;
}

footer .ft__nav ul li.insta a {
  padding: 0 12.5px;
}

footer .ft__nav ul li.insta a img {
  width: 25px;
  height: 25px;
}

footer .copy {
  text-align: center;
  font-size: 12px;
  margin-top: 5px;
}

@media (max-width: 640px) {
  footer .copy {
    font-size: 10px;
  }
}

/*--------------------------
 トップページ
----------------------------*/
#Home,
body[id*=index] {
  background: #fff;
  /* animation: bgchange 80s ease infinite;/*変化の時間を変更したい場合は20sの部分を好きな時間に変更*/
  /*    @keyframes bgchange{
      0%   {background:#ff8ba7;}/*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*変化させたい色*/
  /*}  */
  /* 新着情報一覧 -----*/
  /* メインビジュアル -----*/
}

@media (max-width: 959px) {
  #Home,
  body[id*=index] {
    margin-bottom: 0px;
  }
}

#Home 6%,
body[id*=index] 6% {
  background: #ff73e4;
}

#Home 13%,
body[id*=index] 13% {
  background: #ce73ff;
}

#Home 20%,
body[id*=index] 20% {
  background: #965cff;
}

#Home 27%,
body[id*=index] 27% {
  background: #6b5cff;
}

#Home 32%,
body[id*=index] 32% {
  background: #537bff;
}

#Home 39%,
body[id*=index] 39% {
  background: #45b6ff;
}

#Home 46%,
body[id*=index] 46% {
  background: #00cdd0;
}

#Home 53%,
body[id*=index] 53% {
  background: #00d08a;
}

#Home 60%,
body[id*=index] 60% {
  background: #40e700;
}

#Home 66%,
body[id*=index] 66% {
  background: #aeff17;
}

#Home 72%,
body[id*=index] 72% {
  background: #fff600;
}

#Home 79%,
body[id*=index] 79% {
  background: #ffc02e;
}

#Home 85%,
body[id*=index] 85% {
  background: #ff8200;
}

#Home 92%,
body[id*=index] 92% {
  background: #ff4a45;
}

#Home 98%,
body[id*=index] 98% {
  background: #ff5c69;
}

#Home 100%,
body[id*=index] 100% {
  background: #ff8ba7;
}

#Home .newsList,
body[id*=index] .newsList {
  opacity: 0;
  background: rgba(255, 255, 255, 0.95);
  position: absolute;
  right: 20px;
  top: 20px;
  width: calc(55% - 20px);
  max-width: 600px;
  border-radius: 10px;
  padding: 20px 30px 20px 40px;
  box-sizing: border-box;
  z-index: 1;
}

#Home .newsList.uk-scrollspy-inview,
body[id*=index] .newsList.uk-scrollspy-inview {
  opacity: 1;
}

@media (max-width: 959px) {
  #Home .newsList,
  body[id*=index] .newsList {
    top: auto;
    bottom: 15px;
    width: 70%;
  }
}

@media (max-width: 767px) {
  #Home .newsList,
  body[id*=index] .newsList {
    width: 57%;
    padding: 20px 20px 20px 90px;
  }
}

@media (max-width: 640px) {
  #Home .newsList,
  body[id*=index] .newsList {
    width: calc(100% - 20px);
    padding: 15px;
    padding-left: 90px;
    border-radius: 10px 0px 0px 10px;
    right: 0;
  }
}

#Home .newsList h3,
body[id*=index] .newsList h3 {
  position: absolute;
  left: -70px;
  top: -10px;
  animation: 2s linear infinite newsh3;
}

#Home .newsList h3 img,
body[id*=index] .newsList h3 img {
  width: 100px;
  height: 60px;
}

@media (max-width: 767px) {
  #Home .newsList h3,
  body[id*=index] .newsList h3 {
    left: -40px;
    top: -20px;
  }
}

@media (max-width: 640px) {
  #Home .newsList h3,
  body[id*=index] .newsList h3 {
    left: -10px;
    top: -15px;
  }
  #Home .newsList h3 img,
  body[id*=index] .newsList h3 img {
    width: calc(100px *.7);
    height: calc(60px *.7);
  }
}

@keyframes newsh3 {
  0% {
    transform: translateY(0);
  }
  5% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(0);
  }
  20% {
    transform: translateY(-15px);
  }
  25% {
    transform: translateY(0);
  }
  30% {
    transform: translateY(-5px);
  }
  50% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(0);
  }
}

#Home .newsList ul,
body[id*=index] .newsList ul {
  margin: 0;
}

@media (max-width: 767px) {
  #Home .newsList ul,
  body[id*=index] .newsList ul {
    max-height: 80px;
    overflow-y: scroll;
  }
}

#Home .newsList ul li,
body[id*=index] .newsList ul li {
  border-bottom: 1px dotted #ccc;
  padding-bottom: 5px;
  display: flex;
  flex-wrap: wrap;
}

#Home .newsList ul li::before,
body[id*=index] .newsList ul li::before {
  content: none;
}

#Home .newsList ul li:nth-child(n+2),
body[id*=index] .newsList ul li:nth-child(n+2) {
  margin-top: 5px;
}

#Home .newsList ul li .date,
body[id*=index] .newsList ul li .date {
  font-family: "Roboto Condensed", sans-serif;
  display: block;
  font-size: 14px;
  width: 6em;
}

#Home .newsList ul li .txt,
body[id*=index] .newsList ul li .txt {
  display: block;
  width: calc(100% - 6em);
}

#Home .newsList ul li .txt a,
body[id*=index] .newsList ul li .txt a {
  font-size: 14px;
  display: block;
}

@media (min-width: 768px) {
  #Home .newsList ul li .txt a:hover,
  body[id*=index] .newsList ul li .txt a:hover {
    text-decoration: underline;
    color: #ff9425;
  }
}

#Home .newsList__inner,
body[id*=index] .newsList__inner {
  padding-right: 100px;
  position: relative;
}

#Home .newsList__inner .insta,
body[id*=index] .newsList__inner .insta {
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  right: 0;
}

#Home .newsList__inner .insta img,
body[id*=index] .newsList__inner .insta img {
  width: 60px;
  height: 60px;
}

@media (max-width: 1299px) {
  #Home .newsList__inner,
  body[id*=index] .newsList__inner {
    padding-right: 80px;
  }
  #Home .newsList__inner .insta img,
  body[id*=index] .newsList__inner .insta img {
    width: 50px;
    height: 50px;
  }
}

@media (max-width: 767px) {
  #Home .newsList__inner,
  body[id*=index] .newsList__inner {
    padding-right: 0;
  }
  #Home .newsList__inner .insta,
  body[id*=index] .newsList__inner .insta {
    position: absolute;
    left: auto;
    top: auto;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    left: -65px;
    bottom: 5px;
  }
  #Home .newsList__inner .insta img,
  body[id*=index] .newsList__inner .insta img {
    width: 36px;
    height: 36px;
  }
}

@media (max-width: 640px) {
  #Home .newsList__inner .insta,
  body[id*=index] .newsList__inner .insta {
    bottom: 10px;
  }
}

#Home .mv,
body[id*=index] .mv {
  height: 100vh;
  position: relative;
  overflow: hidden;
  /* ブログボタン */
  /* みぞぶたくん */
  /* 動き回るみぞぶたくん */
}

#Home .mv h2,
body[id*=index] .mv h2 {
  width: 20%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

#Home .mv .mb,
body[id*=index] .mv .mb {
  /* 会社のこと */
  /* 製品のこと */
  /* 道順 */
  /* お問い合わせ */
  /* カタログ */
}

#Home .mv .mb-nav,
body[id*=index] .mv .mb-nav {
  position: absolute;
}

#Home .mv .mb-nav > div,
body[id*=index] .mv .mb-nav > div {
  opacity: 0;
}

#Home .mv .mb-nav > div a,
body[id*=index] .mv .mb-nav > div a {
  position: relative;
  display: block;
}

#Home .mv .mb-nav > div a::after,
body[id*=index] .mv .mb-nav > div a::after {
  content: '';
  opacity: 0;
  transition: all 0.5s ease 0s;
}

#Home .mv .mb-nav > div a:hover::after,
body[id*=index] .mv .mb-nav > div a:hover::after {
  transition: all 0.5s ease 0s;
  opacity: 1;
}

#Home .mv .mb-nav > div a img,
body[id*=index] .mv .mb-nav > div a img {
  height: auto;
}

#Home .mv .mb__about,
body[id*=index] .mv .mb__about {
  top: 0;
  left: 25%;
  max-width: 250px;
  width: 15%;
}

#Home .mv .mb__about a::after,
body[id*=index] .mv .mb__about a::after {
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  top: 40%;
  right: -100px;
  width: 130px;
  height: 80px;
  background: url(../img/top/text_about.svg) no-repeat center/contain;
}

@media (max-width: 1299px) {
  #Home .mv .mb__about a::after,
  body[id*=index] .mv .mb__about a::after {
    width: 104px;
    height: 64px;
  }
}

@media (max-width: 767px) {
  #Home .mv .mb__about a::after,
  body[id*=index] .mv .mb__about a::after {
    right: -70px;
    width: 78px;
    height: 48px;
  }
}

#Home .mv .mb__about a img,
body[id*=index] .mv .mb__about a img {
  filter: drop-shadow(-5px -5px 3px rgba(0, 0, 0, 0.4));
}

@media (max-width: 767px) {
  #Home .mv .mb__about a img,
  body[id*=index] .mv .mb__about a img {
    filter: drop-shadow(-3px -3px 3px rgba(0, 0, 0, 0.4));
  }
}

#Home .mv .mb__about a:hover img,
body[id*=index] .mv .mb__about a:hover img {
  animation: ani-about 2s infinite;
}

#Home .mv .mb__product,
body[id*=index] .mv .mb__product {
  top: 25%;
  left: 8%;
  max-width: 270px;
  width: 17.5%;
}

#Home .mv .mb__product a::after,
body[id*=index] .mv .mb__product a::after {
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  top: 50%;
  right: -130px;
  width: 130px;
  height: 80px;
  background: url(../img/top/text_product.svg) no-repeat center/contain;
}

@media (max-width: 1299px) {
  #Home .mv .mb__product a::after,
  body[id*=index] .mv .mb__product a::after {
    right: -110px;
    width: 104px;
    height: 64px;
  }
}

@media (max-width: 767px) {
  #Home .mv .mb__product a::after,
  body[id*=index] .mv .mb__product a::after {
    right: -90px;
    width: 85px;
    height: 60px;
  }
}

#Home .mv .mb__product a img,
body[id*=index] .mv .mb__product a img {
  filter: drop-shadow(5px 10px 3px rgba(0, 0, 0, 0.4));
}

@media (max-width: 767px) {
  #Home .mv .mb__product a img,
  body[id*=index] .mv .mb__product a img {
    filter: drop-shadow(3px 5px 3px rgba(0, 0, 0, 0.4));
  }
}

#Home .mv .mb__product a:hover img,
body[id*=index] .mv .mb__product a:hover img {
  animation: 2s linear infinite ani-product;
}

#Home .mv .mb__access,
body[id*=index] .mv .mb__access {
  bottom: 20%;
  left: 2%;
  max-width: 290px;
  width: 20%;
}

#Home .mv .mb__access a::after,
body[id*=index] .mv .mb__access a::after {
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  top: 35%;
  right: -20px;
  width: 80px;
  height: 100px;
  background: url(../img/top/text_access.svg) no-repeat center/contain;
}

@media (max-width: 1299px) {
  #Home .mv .mb__access a::after,
  body[id*=index] .mv .mb__access a::after {
    width: 64px;
    height: 80px;
  }
}

@media (max-width: 767px) {
  #Home .mv .mb__access a::after,
  body[id*=index] .mv .mb__access a::after {
    width: 55px;
    height: 65px;
    top: 5%;
  }
}

#Home .mv .mb__access a img,
body[id*=index] .mv .mb__access a img {
  filter: drop-shadow(5px 10px 3px rgba(0, 0, 0, 0.4));
}

@media (max-width: 767px) {
  #Home .mv .mb__access a img,
  body[id*=index] .mv .mb__access a img {
    filter: drop-shadow(3px 5px 3px rgba(0, 0, 0, 0.4));
  }
}

#Home .mv .mb__access a:hover img,
body[id*=index] .mv .mb__access a:hover img {
  animation: ani-access ease-in-out 4s infinite alternate;
}

#Home .mv .mb__contact,
body[id*=index] .mv .mb__contact {
  bottom: 5%;
  left: 20%;
  max-width: 285px;
  width: 18.5%;
}

#Home .mv .mb__contact a::after,
body[id*=index] .mv .mb__contact a::after {
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  top: 75%;
  right: -110px;
  width: 135px;
  height: 80px;
  background: url(../img/top/text_contact.svg) no-repeat center/contain;
}

@media (max-width: 1299px) {
  #Home .mv .mb__contact a::after,
  body[id*=index] .mv .mb__contact a::after {
    top: 65%;
    right: -100px;
    width: 108px;
    height: 64px;
  }
}

@media (max-width: 767px) {
  #Home .mv .mb__contact a::after,
  body[id*=index] .mv .mb__contact a::after {
    width: 90px;
    height: 60px;
    top: 5%;
    right: -95px !important;
  }
}

#Home .mv .mb__contact a img,
body[id*=index] .mv .mb__contact a img {
  filter: drop-shadow(5px 10px 3px rgba(0, 0, 0, 0.4));
}

@media (max-width: 767px) {
  #Home .mv .mb__contact a img,
  body[id*=index] .mv .mb__contact a img {
    filter: drop-shadow(3px 5px 3px rgba(0, 0, 0, 0.4));
  }
}

#Home .mv .mb__contact a:hover img,
body[id*=index] .mv .mb__contact a:hover img {
  animation: 5s linear infinite ani-contact;
}

#Home .mv .mb__catalog,
body[id*=index] .mv .mb__catalog {
  bottom: 20%;
  right: 0;
  width: 40%;
  max-width: 700px;
}

#Home .mv .mb__catalog a::after,
body[id*=index] .mv .mb__catalog a::after {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  left: 35%;
  top: -30px;
  width: 150px;
  height: 120px;
  background: url(../img/top/text_catalog.svg) no-repeat center/contain;
}

@media (max-width: 1299px) {
  #Home .mv .mb__catalog a::after,
  body[id*=index] .mv .mb__catalog a::after {
    top: -35px;
    width: 120px;
    height: 96px;
  }
}

@media (max-width: 767px) {
  #Home .mv .mb__catalog a::after,
  body[id*=index] .mv .mb__catalog a::after {
    width: 90px;
    height: 70px;
    top: -45px !important;
  }
}

#Home .mv .mb__catalog a img,
body[id*=index] .mv .mb__catalog a img {
  filter: drop-shadow(5px 10px 3px rgba(0, 0, 0, 0.4));
}

@media (max-width: 767px) {
  #Home .mv .mb__catalog a img,
  body[id*=index] .mv .mb__catalog a img {
    filter: drop-shadow(3px 5px 3px rgba(0, 0, 0, 0.4));
  }
}

#Home .mv .mb__catalog a:hover img,
body[id*=index] .mv .mb__catalog a:hover img {
  animation: ani-catalog ease-in-out 3s infinite alternate;
}

@keyframes ani-about {
  0% {
    transform: translateY(0);
  }
  5% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(0);
  }
  20% {
    transform: translateY(-25px);
  }
  25% {
    transform: translateY(0);
  }
  30% {
    transform: translateY(-15px);
  }
  50% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}

@-webkit-keyframes ani-contact {
  0% {
    transform: rotate(0);
  }
  50% {
    transform: rotate(-15deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

@keyframes ani-product {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-10deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

@keyframes ani-catalog {
  0% {
    transform: translate(0%, 0%);
  }
  50% {
    transform: translate(0%, -10px);
  }
  100% {
    transform: translate(0%, 0%);
  }
}

@keyframes ani-access {
  0%, 40%, 60%, 80% {
    transform: scale(1);
  }
  20%, 50%, 70% {
    transform: scale(0.95);
  }
}

#Home .mv .news__btn,
body[id*=index] .mv .news__btn {
  display: none;
  position: fixed;
  right: -100px;
  bottom: 10%;
  width: 140px;
  height: 115px;
  z-index: 99;
  opacity: 0;
  transition: all 0.5s ease 0s;
  animation: 2s linear infinite newsbtn;
}

@media (max-width: 1299px) {
  #Home .mv .news__btn,
  body[id*=index] .mv .news__btn {
    bottom: 50px;
  }
}

@media (max-width: 959px) {
  #Home .mv .news__btn,
  body[id*=index] .mv .news__btn {
    width: 112px;
    height: 92px;
  }
}

@media (max-width: 767px) {
  #Home .mv .news__btn,
  body[id*=index] .mv .news__btn {
    width: 90px;
    height: 70px;
    bottom: 20px;
  }
}

#Home .mv .news__btn.uk-scrollspy-inview,
body[id*=index] .mv .news__btn.uk-scrollspy-inview {
  opacity: 1;
}

#Home .mv .news__btn:hover,
body[id*=index] .mv .news__btn:hover {
  right: 0;
  transition: all 0.5s ease 0s;
  animation: none;
}

#Home .mv .news__btn a,
body[id*=index] .mv .news__btn a {
  display: block;
  border-radius: 20px 0 0 20px;
}

#Home .mv .news__btn a:hover,
body[id*=index] .mv .news__btn a:hover {
  background: rgba(255, 255, 255, 0.8);
}

#Home .mv .news__btn .svg-wrap,
body[id*=index] .mv .news__btn .svg-wrap {
  padding-top: 82%;
}

@keyframes newsbtn {
  0% {
    transform: translateX(0);
  }
  5% {
    transform: translateX(0);
  }
  10% {
    transform: translateX(0);
  }
  20% {
    transform: translateX(-45px);
  }
  25% {
    transform: translateX(0);
  }
  30% {
    transform: translateX(-35px);
  }
  50% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(0);
  }
}

#Home .mv .mizobutakun,
body[id*=index] .mv .mizobutakun {
  display: block;
  width: 100%;
  height: 100px;
  position: absolute;
  bottom: 0;
  z-index: 999;
}

@media (max-width: 767px) {
  #Home .mv .mizobutakun,
  body[id*=index] .mv .mizobutakun {
    height: 30px;
  }
}

#Home .mv .mizobutakun > div,
body[id*=index] .mv .mizobutakun > div {
  height: 100%;
}

#Home .mv .mizobutakun span,
body[id*=index] .mv .mizobutakun span {
  position: absolute;
  bottom: 25px;
  transform: translateX(-50%);
  width: 150px;
  height: 20px;
  display: block;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  animation: wlk 30s linear 0s infinite normal;
}

@media (max-width: 767px) {
  #Home .mv .mizobutakun span,
  body[id*=index] .mv .mizobutakun span {
    width: 90px;
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  #Home .mv .mizobutakun span,
  body[id*=index] .mv .mizobutakun span {
    width: 90px;
  }
}

@media (max-width: 640px) {
  #Home .mv .mizobutakun span,
  body[id*=index] .mv .mizobutakun span {
    animation: wlk-spn 20s linear 0s infinite normal;
  }
}

#Home .mv .mizobutakun img,
body[id*=index] .mv .mizobutakun img {
  position: absolute;
  bottom: 30px;
  transform: translateX(-50%);
  width: 150px;
  animation: wlk 30s linear 0s infinite normal;
}

@media (max-width: 767px) {
  #Home .mv .mizobutakun img,
  body[id*=index] .mv .mizobutakun img {
    width: 90px;
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  #Home .mv .mizobutakun img,
  body[id*=index] .mv .mizobutakun img {
    width: 90px;
  }
}

@media (max-width: 640px) {
  #Home .mv .mizobutakun img,
  body[id*=index] .mv .mizobutakun img {
    animation: wlk-spn 20s linear 0s infinite normal;
  }
}

@keyframes wlk {
  0% {
    right: 0px;
    transform: rotateY(0deg);
  }
  50% {
    right: calc(100% - 150px);
    transform: rotateY(0deg);
  }
  51% {
    right: calc(100% - 150px);
    transform: rotateY(180deg);
  }
  100% {
    right: 0px;
    transform: rotateY(180deg);
  }
}

@keyframes wlk-spn {
  0% {
    right: 50px;
    transform: rotateY(0deg);
  }
  50% {
    right: calc(100% - 80px);
    transform: rotateY(0deg);
  }
  51% {
    right: calc(100% - 80px);
    transform: rotateY(180deg);
  }
  100% {
    right: 50px;
    transform: rotateY(180deg);
  }
}

#Home .mv #output,
body[id*=index] .mv #output {
  background: #fff;
  border-radius: 10px;
  color: #333;
  /* line-height: 50vh; */
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  text-align: center;
  padding: 50px;
  max-width: 500px;
  z-index: 1000;
  width: 80%;
  box-sizing: border-box;
}

@media (max-width: 900px) {
  #Home .mv #output,
  body[id*=index] .mv #output {
    padding: 30px;
  }
}

#Home .mv #output #omikekka,
body[id*=index] .mv #output #omikekka {
  text-align: center;
  margin-bottom: 40px;
}

#Home .mv #output #omikekka img,
body[id*=index] .mv #output #omikekka img {
  max-width: 250px;
  width: 80%;
}

#Home .mv #output p span,
body[id*=index] .mv #output p span {
  display: block;
  font-weight: bold;
  text-align: center;
  border-radius: 15px;
  margin-bottom: 10px;
  position: relative;
  font-size: 18px;
  padding: 5px;
  color: #fff;
  line-height: 20px;
}

#Home .mv #output p span::before,
body[id*=index] .mv #output p span::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  vertical-align: top;
}

@media (max-width: 767px) {
  #Home .mv #output p span,
  body[id*=index] .mv #output p span {
    font-size: 15px;
  }
}

#Home .mv #output p#grating span,
body[id*=index] .mv #output p#grating span {
  background: #45b6ff;
  margin-bottom: 20px;
}

#Home .mv #output p#grating span::before,
body[id*=index] .mv #output p#grating span::before {
  background: url(../img/top/ico_grating.png) no-repeat center/contain;
}

#Home .mv #output p#grating a,
body[id*=index] .mv #output p#grating a {
  /* text-decoration: underline;
                        color: #00d08a; */
  font-size: 14px;
  padding-top: 100px;
  display: block;
  position: relative;
  pointer-events: none;
  /* U字溝用グレーチング */
  /* 側溝用グレーチング*/
  /* 正方形グレーチング */
  /* 溜ます用グレーチング */
  /* マンホール */
  /* 歩道上りグレーチング */
  /* フロアーハッチ */
  /* ステンレス製グレーチング */
  /* 段差スロープ */
  /* 警官グレーチング */
}

#Home .mv #output p#grating a::before,
body[id*=index] .mv #output p#grating a::before {
  content: '';
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  top: 0;
  width: 110px;
  height: 90px;
}

#Home .mv #output p#grating a.g01::before,
body[id*=index] .mv #output p#grating a.g01::before {
  background: url(../img/top/g01.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g02::before,
body[id*=index] .mv #output p#grating a.g02::before {
  background: url(../img/top/g02.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g03::before,
body[id*=index] .mv #output p#grating a.g03::before {
  background: url(../img/top/g03.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g04::before,
body[id*=index] .mv #output p#grating a.g04::before {
  background: url(../img/top/g04.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g05::before,
body[id*=index] .mv #output p#grating a.g05::before {
  background: url(../img/top/g05.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g06::before,
body[id*=index] .mv #output p#grating a.g06::before {
  background: url(../img/top/g06.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g07::before,
body[id*=index] .mv #output p#grating a.g07::before {
  background: url(../img/top/g07.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g08::before,
body[id*=index] .mv #output p#grating a.g08::before {
  background: url(../img/top/g08.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g09::before,
body[id*=index] .mv #output p#grating a.g09::before {
  background: url(../img/top/g09.jpg) no-repeat center/contain;
}

#Home .mv #output p#grating a.g10::before,
body[id*=index] .mv #output p#grating a.g10::before {
  background: url(../img/top/g10.jpg) no-repeat center/contain;
}

#Home .mv #output p#hitokoto,
body[id*=index] .mv #output p#hitokoto {
  margin-top: 40px;
  font-size: 16px;
}

@media (max-width: 959px) {
  #Home .mv #output p#hitokoto,
  body[id*=index] .mv #output p#hitokoto {
    margin-top: 25px;
  }
}

#Home .mv #output p#hitokoto span,
body[id*=index] .mv #output p#hitokoto span {
  background: #ff9425;
}

#Home .mv #output p#hitokoto span::before,
body[id*=index] .mv #output p#hitokoto span::before {
  background: url(../img/top/ico_hitokoto.png) no-repeat center/contain;
}

@media (max-width: 640px) {
  #Home .mv #output p#hitokoto,
  body[id*=index] .mv #output p#hitokoto {
    font-size: 15px;
  }
}

#Home .mv #output p#close,
body[id*=index] .mv #output p#close {
  position: absolute;
  right: -10px;
  top: -10px;
  background: rgba(0, 0, 0, 0.8);
  width: 30px;
  height: 30px;
  z-index: 10;
  border-radius: 15px;
  margin: 0;
  text-align: center;
}

#Home .mv #output p#close small,
body[id*=index] .mv #output p#close small {
  color: #fff;
  line-height: 1.0;
  font-size: 14px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  font-weight: bold;
}

#Home .mv #overlay,
body[id*=index] .mv #overlay {
  background: rgba(0, 0, 0, 0.7);
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
}

#Home .mv #output, #Home .mv #overlay,
body[id*=index] .mv #output,
body[id*=index] .mv #overlay {
  opacity: 0;
  transition: all 0.5s;
  visibility: hidden;
}

#Home .mv #output.fadein,
#Home .mv #overlay.fadein,
body[id*=index] .mv #output.fadein,
body[id*=index] .mv #overlay.fadein {
  opacity: 1;
  visibility: visible;
}

#Home .mv.index2 .mizobutakun,
body[id*=index] .mv.index2 .mizobutakun {
  z-index: 0 !important;
  width: 100%;
  height: 100%;
}

#Home .mv.index2 .mizobutakun span,
body[id*=index] .mv.index2 .mizobutakun span {
  animation: wlk-all 50s linear 0s infinite normal;
}

@media (max-width: 959px) and (orientation: portrait) {
  #Home .mv.index2 .mizobutakun span,
  body[id*=index] .mv.index2 .mizobutakun span {
    animation: wlk-all-spn 30s linear 0s infinite normal;
  }
}

#Home .mv.index2 .mizobutakun img,
body[id*=index] .mv.index2 .mizobutakun img {
  animation: wlk-all 50s linear 0s infinite normal;
}

@media (max-width: 959px) and (orientation: portrait) {
  #Home .mv.index2 .mizobutakun img,
  body[id*=index] .mv.index2 .mizobutakun img {
    animation: wlk-all-spn 30s linear 0s infinite normal;
  }
}

@keyframes wlk-all {
  0% {
    right: 0px;
    transform: rotateY(0deg);
  }
  15% {
    right: 70%;
    bottom: 30%;
    transform: rotateY(0deg);
  }
  16% {
    right: 70%;
    bottom: 30%;
    transform: rotateY(180deg);
  }
  30% {
    right: 10%;
    bottom: 85%;
    transform: rotateY(180deg);
  }
  31% {
    right: 10%;
    bottom: 85%;
    transform: rotateY(0deg);
  }
  45% {
    right: 85%;
    bottom: 70%;
    transform: rotateY(0deg);
  }
  46% {
    right: 85%;
    bottom: 70%;
    transform: rotateY(180deg);
  }
  60% {
    right: 20%;
    bottom: 45%;
    transform: rotateY(180deg);
  }
  61% {
    right: 20%;
    bottom: 45%;
    transform: rotateY(0deg);
  }
  75% {
    right: 90%;
    bottom: 25%;
    transform: rotateY(0deg);
  }
  76% {
    right: 90%;
    bottom: 25%;
    transform: rotateY(180deg);
  }
  99% {
    right: 0;
    bottom: 10px;
    transform: rotateY(180deg);
  }
  100% {
    right: 0;
    bottom: 10px;
    transform: rotateY(0deg);
  }
}

@keyframes wlk-all-spn {
  0% {
    right: 50px;
    transform: rotateY(0deg);
  }
  15% {
    right: 70%;
    bottom: 30%;
    transform: rotateY(0deg);
  }
  16% {
    right: 70%;
    bottom: 30%;
    transform: rotateY(180deg);
  }
  25% {
    right: 5%;
    bottom: 50%;
    transform: rotateY(180deg);
  }
  26% {
    right: 5%;
    bottom: 50%;
    transform: rotateY(0deg);
  }
  40% {
    right: 80%;
    bottom: 80%;
    transform: rotateY(0deg);
  }
  41% {
    right: 80%;
    bottom: 80%;
    transform: rotateY(180deg);
  }
  50% {
    right: 8%;
    bottom: 90%;
    transform: rotateY(180deg);
  }
  51% {
    right: 8%;
    bottom: 90%;
    transform: rotateY(0deg);
  }
  65% {
    right: 80%;
    bottom: 55%;
    transform: rotateY(0deg);
  }
  66% {
    right: 80%;
    bottom: 55%;
    transform: rotateY(180deg);
  }
  75% {
    right: 15%;
    bottom: 35%;
    transform: rotateY(180deg);
  }
  76% {
    right: 15%;
    bottom: 35%;
    transform: rotateY(0deg);
  }
  85% {
    right: 75%;
    bottom: 25%;
    transform: rotateY(0deg);
  }
  86% {
    right: 75%;
    bottom: 25%;
    transform: rotateY(180deg);
  }
  99% {
    right: 50px;
    bottom: 20px;
    transform: rotateY(180deg);
  }
  100% {
    right: 50px;
    bottom: 20px;
    transform: rotateY(0deg);
  }
}

/*--------------------------
 トップページテスト
----------------------------*/
body[id*=index], body#Home {
  /* メインビジュアル -----*/
}

body[id*=index] header, body#Home header {
  height: 70px;
  padding-top: 0;
}

@media (max-width: 959px) {
  body[id*=index] header, body#Home header {
    height: 60px;
  }
}

body[id*=index] header h1, body#Home header h1 {
  margin-top: 10px;
}

body[id*=index] header h1 .svg-wrap, body#Home header h1 .svg-wrap {
  padding-top: 22%;
}

body[id*=index] header h1 .svg-wrap img.test, body#Home header h1 .svg-wrap img.test {
  display: block;
}

body[id*=index] header h1 .svg-wrap img.prod, body#Home header h1 .svg-wrap img.prod {
  display: none;
}

@media (max-width: 1299px) {
  body[id*=index] header h1, body#Home header h1 {
    margin-top: 20px;
  }
}

@media (max-width: 959px) {
  body[id*=index] header h1, body#Home header h1 {
    margin-top: 5px;
  }
}

body[id*=index] header .gnav ul li a img, body#Home header .gnav ul li a img {
  width: calc(120px * .9);
  height: calc(100px * .9);
}

body[id*=index] header .gnav ul li a::before, body#Home header .gnav ul li a::before {
  bottom: 0px;
}

body[id*=index] header .gnav ul li.insta a img, body#Home header .gnav ul li.insta a img {
  width: 40px;
  height: 40px;
}

body[id*=index] footer, body#Home footer {
  background: #fff;
  padding-top: 20px;
  margin-top: 0;
}

body[id*=index] footer .ft__info .ft__logo, body#Home footer .ft__info .ft__logo {
  width: 230px;
  height: 70px;
}

body[id*=index] footer .ft__info .ft__logo .svg-wrap, body#Home footer .ft__info .ft__logo .svg-wrap {
  padding-top: 22%;
}

body[id*=index] footer .ft__info .ft__logo img.test, body#Home footer .ft__info .ft__logo img.test {
  display: block;
}

body[id*=index] footer .ft__info .ft__logo img.prod, body#Home footer .ft__info .ft__logo img.prod {
  display: none;
}

body[id*=index] .btn, body#Home .btn {
  max-width: 300px;
  margin: 50px auto 0;
}

body[id*=index] .btn a, body#Home .btn a {
  background: #fff;
  border: 2px solid #221815;
  padding: 10px;
  border-radius: 30px;
  display: block;
  font-weight: 700;
  text-align: center;
}

body[id*=index] .btn a:hover, body#Home .btn a:hover {
  background: #221815;
  color: #fff;
}

body[id*=index] .mv, body#Home .mv {
  height: 70vh;
}

body[id*=index] .mv h2, body#Home .mv h2 {
  top: 45%;
  max-width: 320px;
}

body[id*=index] .mv .mb, body#Home .mv .mb {
  /* 道順 */
  /* お問い合わせ */
}

body[id*=index] .mv .mb-nav > div a::after, body#Home .mv .mb-nav > div a::after {
  content: none;
}

body[id*=index] .mv .mb__access, body#Home .mv .mb__access {
  max-width: 200px;
  width: 20%;
  left: 1%;
  bottom: 15%;
}

body[id*=index] .mv .mb__contact, body#Home .mv .mb__contact {
  bottom: 5%;
  left: 20%;
  max-width: 230px;
  width: 15%;
}

body[id*=index] .side, body#Home .side {
  display: none;
}

body[id*=index] h3.section-title, body#Home h3.section-title {
  font-size: 30px;
  border-left-width: 30px;
}

@media (max-width: 640px) {
  body[id*=index] h3.section-title, body#Home h3.section-title {
    font-size: 24px;
    border-left-width: 24px;
  }
}

body[id*=index] .news, body#Home .news {
  background: #fff;
}

body[id*=index] .news__inner, body#Home .news__inner {
  text-align: center;
}

body[id*=index] .news__inner h3.section-title, body#Home .news__inner h3.section-title {
  /* border-left-color: $blog-orange; */
  border-left: none;
  margin-bottom: 60px;
}

body[id*=index] .news__inner h3.section-title span, body#Home .news__inner h3.section-title span {
  position: relative;
  display: inline-block;
}

body[id*=index] .news__inner h3.section-title span img, body#Home .news__inner h3.section-title span img {
  width: 100px;
  height: 60px;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  left: -110px;
  top: calc(50% - 10px);
}

@media (max-width: 640px) {
  body[id*=index] .news__inner h3.section-title span img, body#Home .news__inner h3.section-title span img {
    width: 70px;
    height: 42px;
    left: -75px;
    top: calc(50% - 5px);
  }
}

body[id*=index] .news__inner .news__list, body#Home .news__inner .news__list {
  margin: 0 auto;
  max-width: 600px;
}

body[id*=index] .news__inner .news__list li, body#Home .news__inner .news__list li {
  border-bottom: 1px dotted #ccc;
  padding-bottom: 10px;
  text-align: left;
  display: flex;
  flex-wrap: wrap;
}

body[id*=index] .news__inner .news__list li::before, body#Home .news__inner .news__list li::before {
  content: none;
}

body[id*=index] .news__inner .news__list li:nth-child(n+2), body#Home .news__inner .news__list li:nth-child(n+2) {
  margin-top: 10px;
}

body[id*=index] .news__inner .news__list li .date, body#Home .news__inner .news__list li .date {
  font-family: "Roboto Condensed", sans-serif;
  display: block;
  width: 6em;
}

body[id*=index] .news__inner .news__list li .txt, body#Home .news__inner .news__list li .txt {
  display: block;
  width: calc(100% - 6em);
}

body[id*=index] .news__inner .news__list li .txt a, body#Home .news__inner .news__list li .txt a {
  display: block;
}

@media (min-width: 768px) {
  body[id*=index] .news__inner .news__list li .txt a:hover, body#Home .news__inner .news__list li .txt a:hover {
    text-decoration: underline;
    color: #ff9425;
  }
}

body[id*=index] .catalog, body#Home .catalog {
  background: #f6faff;
}

body[id*=index] .catalog__inner, body#Home .catalog__inner {
  display: flex;
  flex-wrap: wrap;
}

body[id*=index] .catalog__text, body#Home .catalog__text {
  width: 50%;
}

body[id*=index] .catalog__text h3.section-title, body#Home .catalog__text h3.section-title {
  border-left-color: #45b6ff;
}

body[id*=index] .catalog__text .btn, body#Home .catalog__text .btn {
  margin: 50px 0 0;
}

body[id*=index] .catalog__img, body#Home .catalog__img {
  width: calc(50% - 50px);
  margin-left: 50px;
}

@media (max-width: 959px) {
  body[id*=index] .catalog__img, body#Home .catalog__img {
    width: calc(50% - 30px);
    margin-left: 30px;
  }
}

@media (max-width: 640px) {
  body[id*=index] .catalog__text, body#Home .catalog__text {
    width: 80%;
    text-align: center;
    margin: 0 auto;
  }
  body[id*=index] .catalog__text h3.section-title, body#Home .catalog__text h3.section-title {
    display: inline-block;
  }
  body[id*=index] .catalog__text p, body#Home .catalog__text p {
    text-align: left;
  }
  body[id*=index] .catalog__text .btn, body#Home .catalog__text .btn {
    margin: 30px auto 0;
  }
  body[id*=index] .catalog__img, body#Home .catalog__img {
    display: none;
  }
}

body[id*=index] .contactArea, body#Home .contactArea {
  text-align: center;
}

body[id*=index] .contactArea .uk-container, body#Home .contactArea .uk-container {
  position: relative;
}

body[id*=index] .contactArea__mizobutakun, body#Home .contactArea__mizobutakun {
  position: absolute;
  right: -50px;
  bottom: -80px;
  width: 150px;
}

body[id*=index] .contactArea__mizobutakun img, body#Home .contactArea__mizobutakun img {
  width: 100%;
  height: auto;
}

@media (max-width: 1299px) {
  body[id*=index] .contactArea__mizobutakun, body#Home .contactArea__mizobutakun {
    right: 0;
    width: 120px;
  }
}

@media (max-width: 959px) {
  body[id*=index] .contactArea__mizobutakun, body#Home .contactArea__mizobutakun {
    bottom: -50px;
  }
}

@media (max-width: 640px) {
  body[id*=index] .contactArea__mizobutakun, body#Home .contactArea__mizobutakun {
    width: 80px;
  }
}

body[id*=index] .contactArea h3, body#Home .contactArea h3 {
  font-weight: bold;
  font-size: 36px;
  margin-top: 0;
}

@media (max-width: 640px) {
  body[id*=index] .contactArea h3, body#Home .contactArea h3 {
    font-size: 28px;
  }
}

body[id*=index] .contactArea p, body#Home .contactArea p {
  font-weight: 500;
}

body[id*=index] .contactArea__inner, body#Home .contactArea__inner {
  display: flex;
  flex-wrap: wrap;
  background: #fff;
  padding: 50px 30px;
  box-sizing: border-box;
  border-radius: 20px;
  margin-top: 30px;
}

@media (max-width: 640px) {
  body[id*=index] .contactArea__inner, body#Home .contactArea__inner {
    padding: 30px 20px;
  }
}

body[id*=index] .contactArea__inner > *, body#Home .contactArea__inner > * {
  width: 50%;
}

body[id*=index] .contactArea__inner > *:first-child, body#Home .contactArea__inner > *:first-child {
  position: relative;
}

body[id*=index] .contactArea__inner > *:first-child::after, body#Home .contactArea__inner > *:first-child::after {
  content: '';
  width: 1px;
  height: 100%;
  background: #000;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  right: 0;
}

body[id*=index] .contactArea__inner > * h4, body#Home .contactArea__inner > * h4 {
  font-weight: bold;
  font-size: 24px;
}

body[id*=index] .contactArea__inner > * .btn, body#Home .contactArea__inner > * .btn {
  margin-top: 25px;
}

body[id*=index] .contactArea__inner > *.tel a, body#Home .contactArea__inner > *.tel a {
  font-weight: bold;
  font-size: 40px;
  font-family: "Roboto Condensed", sans-serif;
  position: relative;
  padding-left: 45px;
}

body[id*=index] .contactArea__inner > *.tel a::before, body#Home .contactArea__inner > *.tel a::before {
  content: '';
  width: 40px;
  height: 40px;
  background: url(../img/common/ico_tel.png) no-repeat center/contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  left: 0;
}

@media (max-width: 767px) {
  body[id*=index] .contactArea__inner > *, body#Home .contactArea__inner > * {
    width: 100%;
  }
  body[id*=index] .contactArea__inner > *:first-child, body#Home .contactArea__inner > *:first-child {
    padding-bottom: 30px;
    margin-bottom: 30px;
  }
  body[id*=index] .contactArea__inner > *:first-child::after, body#Home .contactArea__inner > *:first-child::after {
    content: '';
    width: 100%;
    height: 1px;
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    right: auto;
    bottom: 0;
    top: auto;
  }
  body[id*=index] .contactArea__inner > * h4, body#Home .contactArea__inner > * h4 {
    font-size: 20px;
  }
}

/*--------------------------
 タッチデバイスの場合
----------------------------*/
.touch-device #Home .mv, .touch-device body[id*=index] .mv {
  height: auto;
  min-height: 100vh;
  /* カスタムプロパティ未対応ブラウザ用のフォールバック */
  min-height: calc(var(--vh, 1vh) * 100);
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv, .touch-device body[id*=index] .mv {
    min-height: auto;
    padding-top: 80%;
  }
}

.touch-device #Home .mv h2, .touch-device body[id*=index] .mv h2 {
  margin: 0;
}

@media (orientation: portrait) {
  .touch-device #Home .mv h2, .touch-device body[id*=index] .mv h2 {
    width: 35%;
  }
}

@media (orientation: portrait) and (max-width: 640px) {
  .touch-device #Home .mv h2, .touch-device body[id*=index] .mv h2 {
    width: 32%;
    top: calc(50% - 20px);
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv h2, .touch-device body[id*=index] .mv h2 {
    top: 40%;
    width: 30%;
  }
}

.touch-device #Home .mv .news__btn, .touch-device body[id*=index] .mv .news__btn {
  animation: none;
  right: 0;
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv .news__btn, .touch-device body[id*=index] .mv .news__btn {
    position: absolute;
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv #output, .touch-device body[id*=index] .mv #output {
    display: flex;
    padding: 30px;
    flex-wrap: wrap;
  }
  .touch-device #Home .mv #output .kekka, .touch-device body[id*=index] .mv #output .kekka {
    width: 40%;
  }
  .touch-device #Home .mv #output .kekka #omikekka, .touch-device body[id*=index] .mv #output .kekka #omikekka {
    position: relative;
    height: 100%;
  }
  .touch-device #Home .mv #output .kekka #omikekka img, .touch-device body[id*=index] .mv #output .kekka #omikekka img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
  }
  .touch-device #Home .mv #output .other, .touch-device body[id*=index] .mv #output .other {
    width: calc(60% - 20px);
    margin-left: 20px;
  }
}

.touch-device #Home .mv .mb, .touch-device body[id*=index] .mv .mb {
  /* 会社のこと */
  /* 製品のこと */
  /* 道順 */
  /* お問い合わせ */
  /* カタログ */
}

.touch-device #Home .mv .mb-nav a::after, .touch-device body[id*=index] .mv .mb-nav a::after {
  opacity: 1;
}

.touch-device #Home .mv .mb__about a img, .touch-device body[id*=index] .mv .mb__about a img {
  animation: ani-about 2s infinite;
}

@media (orientation: portrait) {
  .touch-device #Home .mv .mb__about, .touch-device body[id*=index] .mv .mb__about {
    width: 25%;
    left: 5%;
  }
  .touch-device #Home .mv .mb__about a::after, .touch-device body[id*=index] .mv .mb__about a::after {
    right: -90px;
  }
}

@media (orientation: portrait) and (max-width: 640px) {
  .touch-device #Home .mv .mb__about, .touch-device body[id*=index] .mv .mb__about {
    width: 30%;
    left: -10px;
  }
  .touch-device #Home .mv .mb__about a::after, .touch-device body[id*=index] .mv .mb__about a::after {
    right: -70px;
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv .mb__about, .touch-device body[id*=index] .mv .mb__about {
    left: 5%;
  }
}

.touch-device #Home .mv .mb__product a img, .touch-device body[id*=index] .mv .mb__product a img {
  animation: ani-product 2s infinite;
}

@media (orientation: portrait) {
  .touch-device #Home .mv .mb__product, .touch-device body[id*=index] .mv .mb__product {
    width: 25%;
    left: auto;
    right: calc(2% + 130px);
    top: 5%;
  }
}

@media (orientation: portrait) and (max-width: 640px) {
  .touch-device #Home .mv .mb__product, .touch-device body[id*=index] .mv .mb__product {
    right: 30px;
    top: 30px;
    width: 30%;
  }
  .touch-device #Home .mv .mb__product a::after, .touch-device body[id*=index] .mv .mb__product a::after {
    background: url(../img/top/text_product_spn.svg) no-repeat center/contain;
    width: 70px;
    height: 70px;
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    bottom: -65px;
    left: 40%;
    top: auto;
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv .mb__product, .touch-device body[id*=index] .mv .mb__product {
    left: auto;
    right: calc(2% + 95px);
    top: 5%;
  }
}

.touch-device #Home .mv .mb__access a img, .touch-device body[id*=index] .mv .mb__access a img {
  animation: ani-access 2s infinite;
}

@media (orientation: portrait) {
  .touch-device #Home .mv .mb__access, .touch-device body[id*=index] .mv .mb__access {
    width: 25%;
    bottom: 50%;
  }
  .touch-device #Home .mv .mb__access a::after, .touch-device body[id*=index] .mv .mb__access a::after {
    right: -20px;
    top: 20%;
  }
}

@media (orientation: portrait) and (max-width: 640px) {
  .touch-device #Home .mv .mb__access, .touch-device body[id*=index] .mv .mb__access {
    bottom: 50%;
    width: 30%;
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv .mb__access, .touch-device body[id*=index] .mv .mb__access {
    bottom: 35%;
  }
  .touch-device #Home .mv .mb__access a::after, .touch-device body[id*=index] .mv .mb__access a::after {
    right: -15px;
    top: 25%;
  }
}

.touch-device #Home .mv .mb__contact a img, .touch-device body[id*=index] .mv .mb__contact a img {
  animation: ani-contact 3s infinite;
}

@media (orientation: portrait) {
  .touch-device #Home .mv .mb__contact, .touch-device body[id*=index] .mv .mb__contact {
    width: 22%;
    left: 2%;
    bottom: 15%;
  }
  .touch-device #Home .mv .mb__contact a::after, .touch-device body[id*=index] .mv .mb__contact a::after {
    top: 40%;
    right: -115px;
  }
}

@media (orientation: portrait) and (max-width: 640px) {
  .touch-device #Home .mv .mb__contact, .touch-device body[id*=index] .mv .mb__contact {
    bottom: 20%;
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv .mb__contact, .touch-device body[id*=index] .mv .mb__contact {
    left: 5%;
    width: 15%;
  }
  .touch-device #Home .mv .mb__contact a::after, .touch-device body[id*=index] .mv .mb__contact a::after {
    top: 25%;
  }
}

.touch-device #Home .mv .mb__catalog a img, .touch-device body[id*=index] .mv .mb__catalog a img {
  animation: ani-catalog 3s infinite;
}

@media (orientation: portrait) {
  .touch-device #Home .mv .mb__catalog, .touch-device body[id*=index] .mv .mb__catalog {
    bottom: 15%;
  }
  .touch-device #Home .mv .mb__catalog a::after, .touch-device body[id*=index] .mv .mb__catalog a::after {
    top: -55px;
  }
}

@media (orientation: portrait) and (max-width: 640px) {
  .touch-device #Home .mv .mb__catalog, .touch-device body[id*=index] .mv .mb__catalog {
    bottom: 20%;
  }
  .touch-device #Home .mv .mb__catalog a::after, .touch-device body[id*=index] .mv .mb__catalog a::after {
    left: 55%;
    top: -60px !important;
  }
}

@media (max-width: 959px) and (orientation: landscape) {
  .touch-device #Home .mv .mb__catalog, .touch-device body[id*=index] .mv .mb__catalog {
    width: 30%;
    bottom: 30%;
  }
  .touch-device #Home .mv .mb__catalog a::after, .touch-device body[id*=index] .mv .mb__catalog a::after {
    top: -40px !important;
    left: 20%;
  }
}

/*--------------------------
 タッチデバイスの場合（テスト）
----------------------------*/
.touch-device body[id*=index] .mv {
  height: auto;
  min-height: 70vh;
}

@media (orientation: landscape) and (max-width: 767px) {
  .touch-device body[id*=index] .mv {
    padding-top: 0;
    min-height: 100vh;
  }
}

.touch-device body[id*=index] .mv .mb {
  /* 道順 */
  /* お問い合わせ */
}

.touch-device body[id*=index] .mv .mb__product {
  right: 5%;
}

.touch-device body[id*=index] .mv .mb__access {
  bottom: 40%;
}

@media (orientation: landscape) {
  .touch-device body[id*=index] .mv .mb__access {
    bottom: 15%;
  }
}

@media (orientation: landscape) and (max-width: 767px) {
  .touch-device body[id*=index] .mv .mb__access {
    bottom: 40%;
  }
}

.touch-device body[id*=index] .mv .mb__contact {
  bottom: 5%;
}

/*--------------------------
 下層ページ　共通
----------------------------*/
.page__title {
  text-align: center;
}

.page__title h2.ttl01 {
  display: none;
  width: 30%;
  margin: 0 auto;
  position: relative;
}

.page__title h2.ttl01 .svg-wrap {
  padding-top: 20%;
}

.page__title h2.ttl01::after {
  content: '';
  width: 50px;
  height: 6px;
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  bottom: -20px;
  z-index: 1;
}

@media (max-width: 959px) {
  .page__title h2.ttl01 {
    display: block;
    margin: 40px auto;
  }
}

@media (max-width: 640px) {
  .page__title h2.ttl01 {
    width: 70%;
    max-width: 200px;
  }
  .page__title h2.ttl01::after {
    width: 35px;
    height: 4px;
    bottom: -10px;
  }
}

.page h3.section-title {
  font-weight: bold;
  font-size: 20px;
  padding-left: 10px;
  border-left: 20px solid;
  margin-bottom: 30px;
  line-height: 1.0;
}

@media (max-width: 767px) {
  .page h3.section-title {
    font-size: 17px;
  }
}

/*--------------------------
 製品について
----------------------------*/
@media (max-width: 959px) {
  body[id*=product] h2.ttl01::after {
    background: #45b6ff;
  }
}

body[id*=product] h3.section-title {
  border-left-color: #45b6ff;
}

body[id*=product] .catalog .uk-grid > div:first-child {
  position: relative;
}

body[id*=product] .catalog .uk-grid > div:first-child::after {
  content: '';
  width: 2px;
  height: 100%;
  background: #ccc;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  right: 0px;
}

@media (max-width: 959px) {
  body[id*=product] .catalog .uk-grid > div:first-child::after {
    right: -20px;
  }
}

@media (max-width: 767px) {
  body[id*=product] .catalog .uk-grid > div:first-child::after {
    right: -30px;
  }
}

@media (max-width: 640px) {
  body[id*=product] .catalog .uk-grid > div:first-child::after {
    content: none;
  }
}

body[id*=product] .catalog__cont .text h4 {
  font-size: 16px;
  margin: 30px 0 15px;
  text-align: center;
  font-weight: bold;
}

@media (max-width: 767px) {
  body[id*=product] .catalog__cont .text h4 {
    font-size: 15px;
  }
}

body[id*=product] .catalog__cont .text a {
  padding: 10px;
  color: #fff;
  font-weight: 700;
  display: block;
  text-align: center;
  background: #036eb8;
  max-width: 180px;
  position: relative;
}

body[id*=product] .catalog__cont .text a:hover {
  filter: brightness(110%);
}

body[id*=product] .catalog__cont .text a.torisetsu {
  background: #fff;
  border-radius: 8px;
  color: #333;
  border: 1px solid #333;
}

body[id*=product] .catalog__cont .text a.torisetsu small {
  font-size: 11px;
  display: block;
}

body[id*=product] .catalog__cont .text a.torisetsu span::before {
  background: url(../img/product/ico_pdf_black.svg) no-repeat center/contain !important;
}

body[id*=product] .catalog__cont .img a:hover img {
  opacity: .7;
}

body[id*=product] .catalog__cont.cat01 {
  margin: 20px 0;
}

@media (max-width: 640px) {
  body[id*=product] .catalog__cont.cat01 {
    position: relative;
    margin: 20px 0 60px;
  }
  body[id*=product] .catalog__cont.cat01::after {
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    top: auto;
    right: auto;
    width: 100%;
    height: 2px;
    bottom: -40px;
    content: '';
    background: #ccc;
  }
}

body[id*=product] .catalog__cont.cat01 .img {
  text-align: center;
}

body[id*=product] .catalog__cont.cat01 .img img {
  max-width: 200px;
}

body[id*=product] .catalog__cont.cat01 a {
  margin-left: auto;
  margin-right: auto;
}

body[id*=product] .catalog__cont.cat01 a span {
  margin-left: -10px;
}

body[id*=product] .catalog__cont.cat01 a span::before {
  content: '';
  width: 30px;
  height: 20px;
  background: url(../img/product/ico_catalog.svg) no-repeat center/contain;
  display: inline-block;
  vertical-align: top;
  margin-right: 8px;
}

@media (max-width: 959px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont {
    flex-wrap: wrap;
    margin-left: 50px;
    margin-top: 20px;
    padding: 0 20px;
  }
}

@media (max-width: 959px) and (max-width: 959px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont {
    margin-left: 30px;
  }
}

@media (max-width: 959px) and (max-width: 767px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont {
    padding: 0 10px;
  }
}

@media (max-width: 959px) and (max-width: 640px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont {
    margin-left: 0;
  }
}

@media (max-width: 959px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont .img {
    width: 20%;
  }
}

@media (max-width: 959px) and (max-width: 767px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont .img {
    width: 25%;
  }
}

@media (max-width: 959px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont .text {
    width: calc(80% - 30px);
    margin-left: 30px;
  }
}

@media (max-width: 959px) and (max-width: 767px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont .text {
    width: calc(75% - 15px);
    margin-left: 15px;
  }
}

@media (max-width: 959px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont .text h4 {
    text-align: left;
  }
}

@media (max-width: 959px) and (max-width: 959px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont .text h4 {
    margin-top: 10px;
  }
}

@media (max-width: 959px) {
  body[id*=product] .catalog .pdf-cat .catalog__cont .text a {
    position: relative;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .text a span {
    margin-left: -10px;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .text a span::before {
    content: '';
    width: 20px;
    height: 20px;
    background: url(../img/product/ico_pdf.svg) no-repeat center/contain;
    display: inline-block;
    vertical-align: top;
    margin-right: 8px;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .text a:nth-child(n+2) {
    margin-top: 20px;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont:nth-child(n+2) {
    margin-top: 60px;
    position: relative;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont:nth-child(n+2)::before {
    content: '';
    width: 100%;
    height: 2px;
    background: #ccc;
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    top: -30px;
  }
}

@media (min-width: 960px) {
  body[id*=product] .catalog .pdf-cat {
    display: flex;
    flex-wrap: wrap;
    margin-left: -30px;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont {
    width: calc(50% - 30px);
    margin: 20px 0;
    margin-left: 30px;
    box-sizing: border-box;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont:nth-child(n+3) {
    margin-top: 50px;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .uk-flex {
    flex-wrap: wrap;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .img {
    width: 100%;
    max-width: 180px;
    margin: 0 auto;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .text {
    width: 100%;
    text-align: center;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .text a {
    margin: 20px auto 0;
    position: relative;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .text a span {
    margin-left: -10px;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .text a span::before {
    content: '';
    width: 20px;
    height: 20px;
    background: url(../img/product/ico_pdf.svg) no-repeat center/contain;
    display: inline-block;
    vertical-align: top;
    margin-right: 8px;
  }
  body[id*=product] .catalog .pdf-cat .catalog__cont .text h4 {
    margin-top: 15px;
    margin-bottom: 0;
  }
}

body[id*=product] .handling ul {
  margin-left: 15px;
}

@media (max-width: 640px) {
  body[id*=product] .handling ul {
    margin-left: 5px;
  }
}

body[id*=product] .handling ul li {
  position: relative;
  padding-left: 25px;
}

body[id*=product] .handling ul li::after {
  content: '';
  width: 10px;
  height: 3px;
  background: #036eb8;
  position: absolute;
  left: 5px;
  top: 12px;
}

body[id*=product] .maker ul {
  margin-left: -30px;
  display: flex;
  flex-wrap: wrap;
}

body[id*=product] .maker ul li {
  position: relative;
  margin-left: 30px;
  width: calc(25% - 30px);
  margin-top: 0;
}

body[id*=product] .maker ul li:nth-child(n+5) {
  margin-top: 30px;
}

@media (max-width: 767px) {
  body[id*=product] .maker ul li {
    width: calc(33.33% - 30px);
  }
  body[id*=product] .maker ul li:nth-child(n+4) {
    margin-top: 30px;
  }
}

@media (max-width: 640px) {
  body[id*=product] .maker ul li {
    width: calc(50% - 30px);
  }
  body[id*=product] .maker ul li:nth-child(n+3) {
    margin-top: 30px;
  }
}

body[id*=product] .maker ul li a:hover img {
  opacity: .7;
}

body[id*=product] .tokuchu__inner {
  padding: 50px;
  background: #efefef;
  text-align: center;
}

@media (max-width: 767px) {
  body[id*=product] .tokuchu__inner {
    padding: 40px 25px;
  }
}

body[id*=product] .tokuchu__inner h3 {
  font-weight: bold;
  font-size: 18px;
}

body[id*=product] .tokuchu__inner .btn {
  max-width: 400px;
  margin: 30px auto 0;
}

body[id*=product] .tokuchu__inner .btn a {
  background: #e95513;
  font-weight: bold;
  display: block;
  color: #fff;
  padding: 10px;
  position: relative;
}

body[id*=product] .tokuchu__inner .btn a span {
  margin-left: -10px;
}

body[id*=product] .tokuchu__inner .btn a span::before {
  content: '';
  width: 20px;
  height: 20px;
  background: url(../img/product/ico_pdf.svg) no-repeat center/contain;
  display: inline-block;
  vertical-align: top;
  margin-right: 8px;
}

body[id*=product] .tokuchu__inner .btn a:hover {
  filter: brightness(110%);
}

@media (max-width: 640px) {
  body[id*=product] .tokuchu p {
    text-align: left;
  }
}

body[id*=product] .tokuchu .btm-text {
  margin-bottom: 0;
  margin-top: 30px;
  font-size: 16px;
  text-align: center;
  font-weight: 600;
}

body[id*=product] .tokuchu .btm-text a {
  color: #45b6ff;
  display: inline-block;
  margin: 0 3px;
  text-decoration: underline;
}

@media (max-width: 640px) {
  body[id*=product] .tokuchu .btm-text {
    font-size: 15px;
  }
}

/*--------------------------
 会社のこと
----------------------------*/
@media (max-width: 959px) {
  body[id*=about] h2.ttl01::after {
    background: #ffc02e;
  }
}

body[id*=about] h3.section-title {
  border-left-color: #ffc02e;
}

body[id*=about] .outline .sdgs {
  max-width: 600px;
  margin: 0px auto 50px;
}

body[id*=about] .outline .sdgs a {
  display: block;
}

body[id*=about] .outline .sdgs .svg-wrap {
  padding-top: 15%;
}

body[id*=about] .outline .text {
  width: 50%;
}

@media (max-width: 767px) {
  body[id*=about] .outline .text {
    width: 100%;
  }
}

body[id*=about] .outline .text table th, body[id*=about] .outline .text table td {
  padding: 20px 30px;
  border-bottom: 1px solid #e5e5e5;
}

@media (max-width: 959px) {
  body[id*=about] .outline .text table th, body[id*=about] .outline .text table td {
    display: block;
    padding: 15px 15px;
  }
}

body[id*=about] .outline .text table th {
  font-size: 16px;
  font-weight: 600;
  color: #000;
  width: 5em;
  position: relative;
  vertical-align: top;
}

body[id*=about] .outline .text table th::after {
  content: '';
  width: 100%;
  height: 3px;
  left: 0;
  bottom: -1px;
  background: #ccc;
  position: absolute;
}

@media (max-width: 959px) {
  body[id*=about] .outline .text table th::after {
    content: none;
  }
}

@media (max-width: 959px) {
  body[id*=about] .outline .text table th {
    border-bottom: none;
    padding-bottom: 0;
  }
}

body[id*=about] .outline .text table td {
  font-size: 15px;
}

@media (max-width: 959px) {
  body[id*=about] .outline .text table td {
    padding-top: 10px;
    font-size: 14px;
  }
}

body[id*=about] .outline .gaikan {
  width: calc(50% - 50px);
  margin-left: 50px;
}

@media (max-width: 767px) {
  body[id*=about] .outline .gaikan {
    width: 100%;
    margin-left: 0;
    text-align: center;
    margin-top: 50px;
    padding-top: 85%;
    overflow: hidden;
    position: relative;
  }
}

@media (max-width: 767px) {
  body[id*=about] .outline .gaikan img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
  }
}

body[id*=about] #access h3.section-title {
  border-left-color: #00d08a;
}

/*--------------------------
 ブログ
----------------------------*/
body[id*=news] {
  /* シングル */
}

body[id*=news] .page__title h2.ttl01 {
  margin-bottom: 0 !important;
}

@media (max-width: 959px) {
  body[id*=news] .page__title h2.ttl01::after {
    background: #ff9425;
  }
}

@media (max-width: 640px) {
  body[id*=news] .page__title h2.ttl01 {
    max-width: 250px;
  }
}

body[id*=news] h3.section-title {
  border-left-color: #ff9425;
  margin: 30px 10px;
}

body[id*=news] .menu {
  position: relative;
  width: 250px;
  margin-left: 50px;
}

@media (max-width: 767px) {
  body[id*=news] .menu {
    width: 100%;
    margin-left: 0;
  }
}

body[id*=news] .widget-area h2 {
  font-weight: 600;
  font-size: 18px;
  position: relative;
  padding-left: 20px;
  margin-top: 50px;
}

body[id*=news] .widget-area h2::before {
  content: '';
  width: 5px;
  height: 100%;
  background: #ff9425;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  left: 0;
}

body[id*=news] .widget-area ul {
  list-style: none;
  padding-left: 0;
  margin-left: 0px;
}

body[id*=news] .widget-area ul li:nth-child(n+2) {
  margin-top: 20px;
}

body[id*=news] .widget-area ul li a {
  font-size: 13px;
  position: relative;
  padding-left: 1.4em;
  display: block;
  text-decoration: underline;
}

body[id*=news] .widget-area ul li a::before {
  content: '▶︎';
  position: absolute;
  top: 0;
  left: 0;
  color: #ccc;
}

body[id*=news] .news__cont__inner .main-cont {
  width: calc(100% - 300px);
}

@media (max-width: 767px) {
  body[id*=news] .news__cont__inner .main-cont {
    width: 100%;
  }
}

body[id*=news] .news__cont__inner .main-cont .post {
  border-bottom: 1px dotted #ccc;
  padding: 50px 15px;
}

body[id*=news] .news__cont__inner .main-cont .post:first-child {
  padding-top: 30px;
}

body[id*=news] .news__cont__inner .main-cont .post .titlearea {
  display: flex;
  justify-content: space-between;
  padding-bottom: 30px;
}

body[id*=news] .news__cont__inner .main-cont .post .titlearea .post__title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 0;
}

body[id*=news] .news__cont__inner .main-cont .post .titlearea .post__date {
  margin-left: auto;
  font-family: "Roboto Condensed", sans-serif;
}

@media (max-width: 640px) {
  body[id*=news] .news__cont__inner .main-cont .post .titlearea {
    display: block;
  }
  body[id*=news] .news__cont__inner .main-cont .post .titlearea h3 {
    font-size: 17px;
  }
}

body[id*=news] .news__cont__inner .main-cont .post .img-eye-catch {
  max-width: 200px;
  margin: 20px 20px 0;
}

body[id*=news] .news__cont__inner .main-cont .post .honbun {
  font-size: 15px;
  line-height: 1.8;
}

body[id*=news] .news__cont__inner .main-cont .post .honbun a.detail {
  color: #45b6ff;
}

body[id*=news] .news__cont__inner .main-cont .post .honbun a.detail::before {
  content: '…';
  display: inline-block;
  margin: 0 3px;
}

@media (max-width: 640px) {
  body[id*=news] .news__cont__inner .main-cont .post .honbun {
    font-size: 14px;
  }
}

body[id*=news] .news__cont__inner .pagination {
  margin: 40px 0;
}

body[id*=news] .news__cont__inner .pagination span {
  margin: 0 10px;
}

body[id*=news] .news__cont__inner .pagination span.number {
  margin: 0 5px;
}

body[id*=news] .news__cont__inner .pagination span.number.current {
  color: #221815;
}

body[id*=news] .news__cont__inner .pagination a {
  text-decoration: underline;
}

body[id*=news] .blog-single article {
  margin-bottom: 40px;
}

body[id*=news] .blog-single .cate {
  margin: 0 15px;
}

@media (max-width: 640px) {
  body[id*=news] .blog-single .cate {
    margin: 0 5px;
  }
}

body[id*=news] .blog-single .cate a {
  color: #fff;
  font-size: 13px;
  background: #ff9425;
  padding: 3px 15px;
  border-radius: 20px;
  font-weight: 600;
}

body[id*=news] .blog-single .titlearea {
  border-bottom: 2px solid #ccc;
  margin-bottom: 30px;
  padding: 15px !important;
}

@media (max-width: 640px) {
  body[id*=news] .blog-single .titlearea {
    padding: 15px 5px !important;
  }
}

body[id*=news] .blog-single .box .img-eye-catch {
  margin-bottom: 20px !important;
}

body[id*=news] .blog-single .box .post-body {
  font-size: 15px;
  line-height: 1.8;
  padding: 15px;
}

@media (max-width: 640px) {
  body[id*=news] .blog-single .box .post-body {
    padding: 0 5px;
    font-size: 14px;
  }
}

body[id*=news] .blog-single .contents-navi .btn {
  max-width: 250px;
  margin: 30px auto;
}

body[id*=news] .blog-single .contents-navi .btn a {
  background: #fff;
  border: 2px solid #221815;
  padding: 10px;
  border-radius: 30px;
  display: block;
  font-weight: 700;
}

body[id*=news] .blog-single .contents-navi .btn a:hover {
  background: #221815;
  color: #fff;
}

body[id*=news] .blog-single .contents-navi .prev-link, body[id*=news] .blog-single .contents-navi .next-link {
  font-size: 13px;
  color: #999;
}

/*--------------------------
 お問い合わせ
----------------------------*/
body[id*=contact] .page__title {
  padding-bottom: 30px;
}

body[id*=contact] .page__title h2.ttl01 {
  font-size: 24px;
}

body[id*=contact] .page__title h2.ttl01::after {
  background: #ff7470;
  opacity: 1;
}

body[id*=contact] .contactbtn {
  display: none;
}

@media (max-width: 959px) {
  body[id*=contact] .contactbtn {
    display: block;
  }
}

body[id*=contact] .mail-description {
  text-align: left;
}

body[id*=contact] .mail-description .form-message {
  border: #eec8c7 5px solid;
  margin: 30px 0;
  padding: 30px 50px;
  text-align: center;
}

@media (max-width: 640px) {
  body[id*=contact] .mail-description .form-message {
    padding: 30px 20px;
  }
}

body[id*=contact] .mail-description .form-message p {
  font-size: 18px;
  margin-bottom: 0;
  color: #e95513;
  font-weight: 600;
}

body[id*=contact] .mail-description .form-message p a.tel {
  font-size: 30px;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: bold;
  color: #111;
  line-height: 35px;
  margin-top: 10px;
  text-align: center;
}

body[id*=contact] .mail-description .form-message p a.tel::before {
  content: '';
  margin-right: 5px;
  display: inline-block;
  vertical-align: top;
  height: 35px;
  width: 60px;
  background: url(../img/common/ico_tel_brown.svg) no-repeat center;
}

body[id*=contact] .mail-description {
  margin-bottom: 30px;
}

body[id*=contact] .alert-message {
  color: #c71212;
}

body[id*=contact] form table {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}

body[id*=contact] form table tr:last-child th, body[id*=contact] form table tr:last-child td {
  border: none;
}

body[id*=contact] form table tr th, body[id*=contact] form table tr td {
  color: #111;
  box-sizing: border-box;
  display: block;
  width: 100%;
}

body[id*=contact] form table tr th {
  position: relative;
  font-weight: normal;
  vertical-align: top;
  padding: 15px 15px 0;
  font-weight: bold;
}

body[id*=contact] form table tr th span.required {
  background: #e50012;
  color: #fff;
  padding: 1px 5px;
  margin-left: 10px;
  display: inline-block;
  font-size: 11px;
  font-weight: normal;
}

body[id*=contact] form table tr th span.normal {
  display: none;
}

body[id*=contact] form table tr td {
  padding: 10px 15px 15px;
}

body[id*=contact] form table tr input[type="text"], body[id*=contact] form table tr input[type="email"], body[id*=contact] form table tr textarea, body[id*=contact] form table tr select, body[id*=contact] form table tr input[type="password"] {
  -webkit-appearance: none;
  appearance: none;
  margin: 3px 0px;
  padding: 10px;
  border: 1px solid #d5d5d5;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #fff;
  box-sizing: border-box;
  width: 100%;
  color: #111;
}

body[id*=contact] form table tr input:focus, body[id*=contact] form table tr textarea:focus {
  border: 1px solid #e95513;
  outline: 0;
}

body[id*=contact] form table tr input, body[id*=contact] form table tr textarea, body[id*=contact] form table tr select {
  box-sizing: border-box;
}

body[id*=contact] form table tr input.form-error, body[id*=contact] form table tr textarea.form-error, body[id*=contact] form table tr select.form-error {
  border: 1px solid #e95513;
  outline: 0;
}

@media (max-width: 640px) {
  body[id*=contact] form table tr input[size="5"], body[id*=contact] form table tr input[size="3"] {
    width: auto !important;
  }
}

body[id*=contact] form table tr .error-message {
  color: red;
  margin: 5px 0 10px;
  font-size: 13px;
}

body[id*=contact] form table tr span.mail-description {
  text-align: left;
}

body[id*=contact] form table tr #FieldMessageInquiry, body[id*=contact] form table tr #FieldMessagePurpose {
  position: relative;
}

body[id*=contact] form table tr #FieldMessageInquiry::after, body[id*=contact] form table tr #FieldMessagePurpose::after {
  content: '▼';
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  right: 18px;
  font-size: 12px;
  pointer-events: none;
}

body[id*=contact] form table tr select option:first-child {
  color: #ccc;
}

body[id*=contact] form table tr select .selector-hide {
  display: none;
}

body[id*=contact] form .submit {
  margin: 40px 0;
  text-align: center;
}

body[id*=contact] form .submit input {
  padding: 12px 20px;
  border: none;
  display: block;
  transition: all 0.5s ease 0s;
}

@media (max-width: 640px) {
  body[id*=contact] form .submit input {
    display: block;
    margin: 10px 0;
    max-width: 400px;
    width: 100%;
  }
}

body[id*=contact] form .submit input:hover {
  transition: all 0.5s ease 0s;
}

body[id*=contact] form .submit input.btn-gray {
  background: #ccc;
  color: #7d7d7d;
  display: none;
}

body[id*=contact] form .submit input.form-submit {
  background: #fff;
  color: #221815;
  border: 2px solid #221815;
  width: 90%;
  max-width: 500px;
  font-weight: bold;
  box-sizing: border-box;
  font-size: 18px;
  margin: 0 auto;
}

body[id*=contact] form .submit input.form-submit:hover {
  background: #221815;
  color: #fff;
}

body[id*=contact] form .submit input#BtnMessageBack {
  background: none;
  border: none;
  margin-top: 30px;
}

body[id*=contact] form .submit input#BtnMessageBack:hover {
  color: #221815;
}

body[id*=contact] form .submit input#BtnMessageSubmit {
  margin-top: 50px;
}

body[id*=contact] .pparea {
  margin: 50px 0;
  font-size: 14px;
}

body[id*=contact] .pparea a {
  color: #45b6ff;
  text-decoration: underline;
}

body[id*=contact] #privacypolicy {
  z-index: 9999;
}

body[id*=contact] #privacypolicy .uk-modal-dialog {
  width: 90%;
  height: calc(100% - 100px);
  max-width: 800px !important;
  overflow-y: scroll;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  box-sizing: border-box;
  padding: 50px;
}

@media (max-width: 640px) {
  body[id*=contact] #privacypolicy .uk-modal-dialog {
    padding: 40px 25px;
  }
}

body[id*=contact] #privacypolicy .uk-modal-dialog .uk-modal-close {
  border: none;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 30px;
  height: 30px;
  background: rgba(0, 0, 0, 0.9);
  border-radius: 15px;
}

body[id*=contact] #privacypolicy .uk-modal-dialog .uk-modal-close span {
  color: #fff;
  font-size: 16px;
  line-height: 1.0;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  font-weight: 900;
}

body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner {
  box-sizing: border-box;
  width: 100%;
  text-align: left;
}

body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner h4 {
  font-size: 16px;
  font-weight: bold;
}

@media (max-width: 640px) {
  body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner h4 {
    font-size: 15px;
  }
}

body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner p {
  font-size: 14px;
  text-align: justify;
}

@media (max-width: 640px) {
  body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner p {
    font-size: 12px;
  }
}

body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner ul {
  list-style: none;
}

body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner ul li {
  font-size: 14px;
  padding-left: 1em;
  text-indent: -1em;
}

@media (max-width: 640px) {
  body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner ul li {
    font-size: 12px;
  }
}

body[id*=contact] #privacypolicy .uk-modal-dialog .privacypolicy__inner ul li::before {
  content: '・';
  display: inline-block;
  width: 1em;
}

body[id*=contact] .thanks-cont {
  padding: 150px 0;
}

@media (max-width: 640px) {
  body[id*=contact] .thanks-cont {
    padding: 50px 0;
  }
}

body[id*="confirm"] #flashMessage {
  text-align: center;
  margin-bottom: 60px;
  background: #fbeded;
  padding: 10px;
}

body[id*="confirm"] .mail-description {
  text-align: center;
}

body[id*="confirm"] table td .error-message {
  margin-left: 10px !important;
}

body[id*="confirm"] #FieldMessageInquiry::after, body[id*="confirm"] #FieldMessagePurpose::after {
  content: none !important;
}

body[id*="confirm"] #RowMessageEmail2 {
  /* display: none; */
}

body[id*="thanks"] h3 {
  text-align: center;
  font-weight: bold;
  font-size: 18px;
}