@charset "utf-8";
/* CSS Document */
@property --scroll {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --scroll-delayed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --scroll-direction {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@keyframes setScrollProps {
  to {
    --scroll: 1000;
    --scroll-delayed: 1000
  }
}
:root {
  animation: setScrollProps linear both;
  animation-timeline: scroll(root);
  --header-effect-duration: .5s
}
body {
  transition: --scroll-delayed calc(var(--header-effect-duration) + .01s);
  --scroll-velocity: calc(var(--scroll) - var(--scroll-delayed));
  --scroll-speed: max(var(--scroll-velocity), -1 * var(--scroll-velocity));
  --scroll-direction: calc(var(--scroll-velocity) / var(--scroll-speed))
}
header {
  position: fixed;
  z-index: 998;
  inset: 0 0 auto;
  will-change: transform;
  transition: transform var(--header-effect-duration);
  transform: translateY(var(--translate));
  width: 100%;
  padding-top: 50px;
  background: #fff
}
.top-navber {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 40px;
  min-height: 40px;
  position: fixed;
  top: 0;
  z-index: 9999;
  background: #fff
}
.top-navber h1 {
  margin-left: 10px
}
.top-navber h2 {
  margin-left: 10px
}
.top-navber div {
  margin-right: 30px
}
.daysnavi-logo {
  width: 320px;
  height: 100px;
  padding-left: 10px;
  overflow: hidden
}
*, ::before, ::after {
  box-sizing: border-box
}
body {
  counter-reset: scroll calc(var(--scroll)) scroll-delayed calc(var(--scroll-delayed)) scroll-direction calc(var(--scroll-direction))
}
.nav_first {
  width: calc(100% - 10px);
  padding-right: 10px
}
.pref_area {
  width: calc(100% - 320px);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-top: auto;
  gap: 10px
}
.cm_area {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px
}
.cmShop {
  width: 320px;
  height: 50px;
  max-height: 50px;
  overflow: hidden
}
.cmShop img {
  width: 320px;
  height: 50px;
  object-fit: cover
}
.cmJob_l {
  display: none
}
.cmJob_l img {
  width: 100%;
  height: auto
}
.cmJob_r {
  display: none
}
.cmJob_r img {
  width: 100%;
  height: auto
}
@media (min-width: 1200px) {
  .cm_area {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px
  }
  .cmJob_l {
    display: inline-block;
    width: 172px;
    height: 50px;
    overflow: hidden
  }
  .cmJob_l img {
    width: 100%;
    height: auto
  }
  .cmJob_r {
    display: none
  }
  .cmJob_r img {
    width: 100%;
    height: auto
  }
}
@media (min-width: 1400px) {
  .cm_area {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px
  }
  .cmJob_l {
    width: 172px;
    height: 50px;
    overflow: hidden
  }
  .cmJob_l img {
    width: 100%;
    height: auto
  }
  .cmJob_r {
    display: inline-block;
    width: 172px;
    height: 50px;
    overflow: hidden
  }
  .cmJob_r img {
    width: 100%;
    height: auto
  }
}
.cmJob {
  width: 172px;
  height: 50px;
  overflow: hidden
}
.cmJob img {
  width: 100%;
  height: auto
}
.search-shop {
  display: flex;
  justify-content: space-between;
  align-items: center;
  overflow: hidden;
  border: 2px solid #f66;
  border-radius: 3px
}
.search-shop input {
  width: 250px;
  height: 45px;
  padding: 5px 10px;
  border: none;
  box-sizing: border-box;
  font-size: 1em;
  outline: none
}
.search-shop input::placeholder {
  color: #777
}
.search-shop button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 45px;
  border: none;
  background-color: #f66;
  cursor: pointer
}
.search-shop button::after {
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  content: ''
}
.pref_area ul {
  display: flex;
  justify-content: flex-end;
  align-items: baseline;
  margin-left: auto
}
.pref_area ul li {
  font-size: 1rem;
  border-right: 1px solid #999
}
.pref_area ul li:last-child {
  border-right: none
}
.pref_area ul li a {
  display: inline-block;
  padding: 5px 20px 0
}
.pref_area ul li a:hover, .pref_area ul li a:active {
  font-weight: 700
}
.pref_active {
  font-size: 1.1rem !important;
  font-weight: 700;
  border-bottom: 2px solid;
  padding: 5px 20px 0
}