html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box
}

body {
  line-height: 1
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block
}

nav ul {
  list-style: none
}

ul, ol, li, dl, dt, dd {
  list-style-type: none;
  list-style-position: outside
}

blockquote, q {
  quotes: none
}

blockquote:before, blockquote:after, q:before, q:after {
  content: none
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent
}

ins {
  text-decoration: none
}

img {
  vertical-align: top;
  border: 0;
  image-rendering: optimizeQuality;
  -ms-interpolation-mode: bicubic
}

del {
  text-decoration: line-through
}

hr {
  display: block;
  height: 0;
  border: 0;
  margin: 0;
  padding: 0
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

em, strong {
  font-weight: bold
}

input, select, textarea {
  margin: 0;
  padding: 0;
  vertical-align: baseline
}

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold
}

main {
  display: block
}

figure {
  font-size: 0
}

input, textarea, select {
  outline: none
}

a, input, button {
  outline: none
}

a:focus, input:focus, button:focus, *:focus {
  outline: none
}

input[type="submit"]::-moz-focus-inner {
  border: 0px
}

input[type="submit"] {
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  box-sizing: border-box
}

button::-moz-focus-inner {
  border: 0px
}

html {
  overflow-x: hidden;
  font-family: source-han-sans-japanese, sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: 1px;
  color: #444
}

html.safari {
  font-family: source-han-sans-japanese, sans-serif
}

body {
  width: 100%;
  background: #383A43;
  height: 100%;
  overflow: hidden;
  -webkit-text-size-adjust: 100%;
  word-wrap: break-word
}

a {
  color: #444;
  outline: none;
  display: block;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(57, 60, 61, 0.2);
  -webkit-transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  position: relative
}

@media screen and (min-width: 1025px) {
  a:hover {
    color: #c4c4c4
  }
}

a:hover {
  color: #020A8D
}

a:hover img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}

a * {
  cursor: pointer
}

picture {
  display: block
}

img {
  -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  width: 100%;
  display: block
}

select, input, textarea {
  align-self: center;
  display: block;
  border: none;
  outline: none;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none
}

select:placeholder-shown, input:placeholder-shown, textarea:placeholder-shown {
  color: #d0d0d0
}

select::-webkit-input-placeholder, input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #d0d0d0
}

select:-moz-placeholder, input:-moz-placeholder, textarea:-moz-placeholder {
  color: #d0d0d0;
  opacity: 1
}

select::-moz-placeholder, input::-moz-placeholder, textarea::-moz-placeholder {
  color: #d0d0d0;
  opacity: 1
}

select:-ms-input-placeholder, input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #d0d0d0
}

input[type=text], input[type=email], input[type=tel] {
  line-height: normal
}

select {
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  width: auto
}

select::-ms-expand {
  display: none
}

span, label {
  display: block
}

@media all and (-ms-high-contrast: none) {
  html {
    overflow: auto;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "sans-serif"
  }
}

@media all and (max-width: 767px) {
  body {
    min-width: 320px;
    font-size: 3.5vw
  }
}

.sp {
  display: none !important
}

.tb {
  display: none !important
}

@media all and (min-width: 768px) and (max-width: 1024px) {
  .pc {
    display: none !important
  }
  .sp {
    display: none !important
  }
  .tb {
    display: block !important
  }
}

@media all and (max-width: 767px) {
  .pc {
    display: none !important
  }
  .tb {
    display: none !important
  }
  .sp {
    display: block !important
  }
  img.sp {
    display: inline-block !important
  }
}

.flex {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

.flex.nowrap {
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap
}

.flex.reverse {
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse
}

.flex.center {
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center
}

.flex.row {
  flex-flow: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify
}

.centering {
  display: flex;
  justify-content: center;
  align-items: center
}

.textof {
  text-overflow: ellipsis;
  overflow: hidden
}

.ofi {
  font-family: 'object-fit: cover;';
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center
}

.textfit {
  -webkit-line-clamp: 3;
  height: 100px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden
}

.dammybtn {
  cursor: pointer;
  -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1)
}

.overflow {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0
}

.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #202227;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: none
}

.scroll-x {
  overflow-x: scroll;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
  -ms-overflow-style: none;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap
}

.scroll-x::-webkit-scrollbar {
  display: none
}

.tbrl {
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl
}

@keyframes fadein {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}

@keyframes menu-close {
  30% {
    transform: scale(0);
    opacity: 0
  }
  100% {
    transform: scale(1);
    opacity: 1
  }
}

@-webkit-keyframes menu-open {
  30% {
    -webkit-transform: scale(0);
    opacity: 0
  }
  100% {
    -webkit-transform: scale(1);
    opacity: 1
  }
}

@keyframes menu-open {
  30% {
    transform: scale(0);
    opacity: 0
  }
  100% {
    transform: scale(1);
    opacity: 1
  }
}

@keyframes filterWidth {
  from {
    width: 100%
  }
  to {
    width: 0%
  }
}

@keyframes filterHeight {
  from {
    height: 100%
  }
  to {
    height: 0%
  }
}

@keyframes slideIn {
  0% {
    margin-left: -100px
  }
  100% {
    margin-left: 0
  }
}

@keyframes filterWidthIn {
  from {
    width: 0%
  }
  to {
    width: 100%
  }
}

@keyframes filterWidthOut {
  from {
    left: 0
  }
  to {
    left: 100%
  }
}

@keyframes filterWidthOpacity {
  from {
    opacity: 0
  }
  to {
    opacity: 1
  }
}

@keyframes filterWidthImg {
  from {
    margin-left: -50px
  }
  to {
    margin-left: 0px
  }
}

.sa {
  -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  opacity: 0
}

.sa.show {
  opacity: 1;
  transform: none;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none
}

.sa_lr {
  transform: translate(-70px, 0);
  -webkit-transform: translate(-70px, 0);
  -moz-transform: translate(-70px, 0);
  -ms-transform: translate(-70px, 0);
  -o-transform: translate(-70px, 0)
}

.sa_rl {
  transform: translate(70px, 0);
  -webkit-transform: translate(70px, 0);
  -moz-transform: translate(70px, 0);
  -ms-transform: translate(70px, 0);
  -o-transform: translate(70px, 0)
}

.sa_up {
  transform: translate(0, 70px);
  -webkit-transform: translate(0, 70px);
  -moz-transform: translate(0, 70px);
  -ms-transform: translate(0, 70px);
  -o-transform: translate(0, 70px)
}

.sa_down {
  transform: translate(0, -70px);
  -webkit-transform: translate(0, -70px);
  -moz-transform: translate(0, -70px);
  -ms-transform: translate(0, -70px);
  -o-transform: translate(0, -70px)
}

.sa_scaleUp {
  transform: scale(0.5);
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5)
}

.sa_scaleDown {
  transform: scale(1.5);
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5)
}

.sa_rotateL {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg)
}

.sa_rotateR {
  transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  -moz-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  -o-transform: rotate(-180deg)
}

.filter_r {
  position: relative;
  overflow: hidden;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d
}

.filter_r::after {
  content: "";
  width: 0%;
  height: 100%;
  background: #444;
  position: absolute;
  top: 0;
  left: 0
}

.filter_r * {
  opacity: 0
}

.filter_r.show {
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards
}

.filter_r.show::after {
  animation: filterWidthIn 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) 0.25s, filterWidthOut 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
  -webkit-animation: filterWidthIn 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) 0.25s, filterWidthOut 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards
}

.filter_r.show * {
  animation: filterWidthOpacity 0s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
  -webkit-animation: filterWidthOpacity 0s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards
}

.filter_r.show img {
  animation: filterWidthOpacity 0s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s, filterWidthImg 0.7s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
  -webkit-animation: filterWidthOpacity 0s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s, filterWidthImg 0.7s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards
}

@keyframes loadinganim {
  0% {
    background-position-x: 0px
  }
  100% {
    background-position-x: 72px
  }
}

@keyframes loadinganim_r {
  0% {
    background-position-x: 0
  }
  100% {
    background-position-x: -72px
  }
}

@keyframes loadinganim-sp {
  0% {
    background-position-x: 0px
  }
  100% {
    background-position-x: 11vw
  }
}

@keyframes loadinganim_r-sp {
  0% {
    background-position-x: 0
  }
  100% {
    background-position-x: -11vw
  }
}

@keyframes loadingcomp {
  0% {
    width: 0%
  }
  100% {
    width: 410px
  }
}

@keyframes loadingcomp-sp {
  0% {
    width: 0%
  }
  100% {
    width: calc(100% - 4vw)
  }
}

#LoadingGroup {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1000;
  background: #fff;
  -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  min-height: 720px
}

#LoadingGroup.remove {
  opacity: 0;
  pointer-events: none
}

#LoadingGroup .inner {
  width: 100%;
  height: 100%
}

#LoadingGroup .inner .inner_box {
  text-align: center
}

#LoadingGroup .inner .inner_box span {
  width: 320px;
  height: 38.96px;
  margin: 0 auto
}

@media all and (max-width: 767px) {
  #LoadingGroup {
    min-height: 568px
  }
  #LoadingGroup .inner .inner_box span {
    width: 60vw;
    height: auto
  }
}

#Page {
  width: 100%;
  overflow: hidden;
  position: relative;
  opacity: 0
}

#Page .border {
  width: 100%;
  height: 20px;
  position: fixed;
  top: 0;
  left: 0;
  background: #fff;
  z-index: 100
}

#Page .border span {
  content: "";
  width: 20px;
  height: 100vh;
  position: absolute;
  top: 0;
  background: #fff
}

#Page .border span:first-child {
  left: 0
}

#Page .border span:last-child {
  right: 0
}

#Page.active {
  opacity: 1
}

#Page.search #Search {
  opacity: 1;
  pointer-events: auto
}

@media all and (max-width: 767px) {
  #Page {
    width: 100%;
    padding: 0
  }
  #Page .border {
    display: none
  }
}

section {
  position: relative;
  z-index: 1;
  padding: 100px 0;
  background: #e0ddd8
}

section .inner {
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 100px;
  position: relative;
  z-index: 3
}

section .inner .section_title, section .inner .article_title {
  font-weight: 500;
  font-size: 24px;
  line-height: 24px;
  letter-spacing: 1px;
  color: #444;
  text-align: center
}

section .inner .section_sub, section .inner .article_sub {
  margin: 10px auto 30px auto;
  text-align: center
}

section .inner .section_sub label, section .inner .article_sub label {
  font-family: urw-din, sans-serif;
  font-weight: 600;
  font-size: 50px;
  line-height: 50px;
  letter-spacing: 1px;
  color: #c2b094;
  background: #a08b74;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent
}

section .inner .section_sub img, section .inner .article_sub img {
  display: none
}

section .inner .section_text {
  font-weight: 500;
  font-size: 18px;
  line-height: 30px;
  letter-spacing: 1px;
  color: #444;
  margin: 80px 0 0 0
}

section .inner .article_title {
  font-size: 70px;
  line-height: 70px;
  letter-spacing: 9px;
  margin: 0 auto
}

section .inner .article_sub {
  font-size: 22px;
  line-height: 22px;
  letter-spacing: 1.5px;
  margin: 10px auto 70px auto
}

section .inner .article_sub::after {
  display: none
}

.column2 .column2_l {
  width: 73%;
  flex: 1 0 auto;
  padding: 0 40px 0 0
}

.column2 .column2_r {
  width: 27%;
  flex: 1 0 auto;
  max-width: 320px
}

body.low #Contents {
  position: relative;
  background: #fff;
  background: -moz-linear-gradient(left, #fff 0%, #fff 62%, #F5F7FF 62%, #F5F7FF 100%);
  background: -webkit-linear-gradient(left, #fff 0%, #fff 62%, #F5F7FF 62%, #F5F7FF 100%);
  background: linear-gradient(to right, #fff 0%, #fff 62%, #F5F7FF 62%, #F5F7FF 100%)
}

@media all and (min-width: 768px) and (max-width: 1279px) {
  section .inner {
    padding: 0 50px
  }
}

@media all and (max-width: 767px) {
  section {
    padding: 13.33333vw 0
  }
  section .inner {
    padding: 0 4vw
  }
  section .inner .section_title, section .inner .article_title {
    font-weight: 500;
    font-size: 4.8vw;
    line-height: 4.8vw;
    letter-spacing: .5vw;
    color: #444
  }
  section .inner .section_sub, section .inner .article_sub {
    margin: 1.6vw auto 5.33333vw auto
  }
  section .inner .section_sub label, section .inner .article_sub label {
    font-weight: bold;
    font-size: 10.66667vw;
    line-height: 10.66667vw;
    letter-spacing: .5vw;
    color: #c2b094;
    text-align: center
  }
  section .inner .section_text {
    font-weight: 500;
    font-size: 3.73333vw;
    line-height: 6.4vw;
    letter-spacing: .5vw;
    color: #444;
    margin: 3.46667vw 0 0 0
  }
  section .inner .article_title {
    font-size: 8vw;
    line-height: 8vw;
    letter-spacing: 1.2vw
  }
  section .inner .article_sub {
    font-size: 3.46667vw;
    line-height: 3.46667vw;
    letter-spacing: .5vw;
    margin: 2vw auto 13.33333vw auto
  }
  .column2 .column2_l {
    width: 100%;
    padding: 0
  }
  .column2 .column2_r {
    width: 100%;
    padding: 10.66667vw 0 0 0
  }
}

.morebtn {
  width: 240px;
  margin: 30px auto 0 auto;
  background: #fff;
  height: 60px;
  -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  position: relative
}

.morebtn a, .morebtn span {
  width: 100%;
  height: 100%;
  border: solid 1px #c2b094;
}

.morebtn a label, .morebtn span label {
  display: block;
  font-weight: bold;
  font-size: 22px;
  line-height: 22px;
  letter-spacing: .5px;
  color: #c2b094;
  cursor: pointer;
  -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1)
}

@media screen and (min-width: 1025px) {
  .morebtn:hover {
    background: #c2b094;
  }
  .morebtn:hover label {
    color: #fff
  }
}

.mini {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto
}

#Scrollbtn {
  width: 50px;
  height: 50px;
  position: fixed;
  bottom: -50px;
  right: 30px;
  z-index: 100
}

@media screen and (min-width: 1025px) {
  #Scrollbtn:hover {
    filter: brightness(75%)
  }
}

#Scrollbtn.active {
  bottom: 30px
}

@media all and (max-width: 767px) {
  .morebtn {
    width: 58.66667vw;
    margin: 5.33333vw auto;
    height: 13.33333vw
  }
  .morebtn a label, .morebtn span label {
    font-size: 4.26667vw;
    line-height: 4.26667vw;
    letter-spacing: .2vw
  }
  #Scrollbtn {
    width: 10.66667vw;
    height: 10.66667vw;
    bottom: -10.66667vw;
    right: 4vw
  }
  #Scrollbtn.active {
    bottom: 4vw
  }
}

#Header {
  position: relative;
  z-index: 100;
  background: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%
}

#Header .inner {
  padding: 0 100px;
  align-items: center;
  position: relative;
  z-index: 11;
  height: 70px;
  background: #f2e9dc;
  border: 2px solid #f2e9dc;
  border-style: none none solid none;
  box-sizing: border-box
}

#Header .inner h1 a {
  align-items: center
}

#Header .inner h1 a img {
  width: 250px;
  height: 30.44px
}

#Header .inner #NavMenu {
  height: calc(100% + 2px);
  z-index: 3
}

#Header .inner #NavMenu .menugroup {
  height: 100%
}

#Header .inner #NavMenu .menugroup li {
  margin-right: 30px
}

#Header .inner #NavMenu .menugroup li:last-child {
  margin-right: 0
}

#Header .inner #NavMenu .menugroup li.contact a {
  background: #a4896c;
  color: #fff;
  padding: 0 20px
}

#Header .inner #NavMenu .menugroup li.contact a.active {
  pointer-events: none;
  background: #c2b094;
  color: #fff
}

@media screen and (min-width: 1025px) {
  #Header .inner #NavMenu .menugroup li.contact a:hover {
    background: #c2b094;
    color: #fff
  }
}

#Header .inner #NavMenu .menugroup li a {
  width: 100%;
  height: 100%;
  font-weight: 500;
  font-size: 16px;
  line-height: 16px;
  letter-spacing: 1px;
  color: #444
}

#Header .inner #NavMenu .menugroup li a.active {
  pointer-events: none;
  color: #c2b094;
}

@media screen and (min-width: 1025px) {
  #Header .inner #NavMenu .menugroup li a:hover {
    color: #c2b094;
  }
}

#Header #Menubtn {
  width: 70px;
  height: 70px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 12
}

#Header #Menubtn .inner_box {
  width: 40px;
  height: 30px;
  position: relative;
  -webkit-animation: menu-close .6s;
  animation: menu-close .6s
}

#Header #Menubtn .inner_box span {
  width: 100%;
  height: 2px;
  background: #c2b094;
  -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  position: absolute;
  left: 0
}

#Header #Menubtn .inner_box span:nth-child(1) {
  top: 0
}

#Header #Menubtn .inner_box span:nth-child(2) {
  top: calc(50% - 1px)
}

#Header #Menubtn .inner_box span:nth-child(3) {
  bottom: 0;
  width: 30px
}

#Header #Menubtn.active .inner_box {
  -webkit-animation: menu-open .6s;
  animation: menu-open .6s
}

#Header #Menubtn.active .inner_box span:nth-child(1) {
  transform: translate(0, 14px) rotate(45deg);
  -webkit-transform: translate(0, 14px) rotate(45deg);
  -moz-transform: translate(0, 14px) rotate(45deg);
  -ms-transform: translate(0, 14px) rotate(45deg);
  -o-transform: translate(0, 14px) rotate(45deg)
}

#Header #Menubtn.active .inner_box span:nth-child(2) {
  opacity: 0
}

#Header #Menubtn.active .inner_box span:nth-child(3) {
  width: 100%;
  transform: translate(0, -14px) rotate(-45deg);
  -webkit-transform: translate(0, -14px) rotate(-45deg);
  -moz-transform: translate(0, -14px) rotate(-45deg);
  -ms-transform: translate(0, -14px) rotate(-45deg);
  -o-transform: translate(0, -14px) rotate(-45deg)
}

#Header.active .inner #NavMenu {
  top: 70px
}

@media all and (min-width: 768px) and (max-width: 1279px) {
  #Header .inner {
    padding: 0 50px
  }
}

@media all and (max-width: 1024px) {
  #Header .inner {
    border: none;
    padding: 0 15px
  }
  #Header .inner::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    border: 2px solid #f2e9dc;
    border-style: none none solid none;
    box-sizing: border-box
  }
  #Header .inner h1 {
    z-index: 5
  }
  #Header .inner #NavMenu {
    position: fixed;
    top: -350px;
    left: 0;
    width: 100%;
    pointer-events: all;
    -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
    overflow: hidden;
    height: 350px
  }
  #Header .inner #NavMenu .menugroup {
    display: block;
    background: #f2e9dc;
    height: auto
  }
  #Header .inner #NavMenu .menugroup li {
    width: 100%;
    height: 70px;
    padding: 0 50px
  }
  #Header .inner #NavMenu .menugroup li.contact a {
    background: none;
    color: #444;
    border: none;
    padding: 0
  }
  #Header .inner #NavMenu .menugroup li.contact a.active {
    color: #c2b094;
    background: #fff
  }
  #Header .inner #NavMenu .menugroup li a {
    width: 100%;
    height: 100%;
    justify-content: flex-start;
    border: solid 1px #5e4b40;
    border-style: none none solid none;
    position: relative
  }
  #Header .inner #NavMenu .menugroup li a.active {
    color: #c2b094;
  }
  #Header .inner #NavMenu .menugroup li a::after {
    content: "";
    border-style: solid;
    border-width: 5px 0 5px 7px;
    border-color: transparent transparent transparent #444;
    position: absolute;
    top: 28px;
    right: 10px
  }
  #Header #Menubtn {
    display: flex !important
  }
}

@media all and (max-width: 767px) {
  #Header .inner {
    padding: 0 4vw;
    height: 13.33333vw
  }
  #Header .inner h1 a img {
    width: 48vw
  }
  #Header .inner #NavMenu {
    top: -80vw;
    height: 80vw
  }
  #Header .inner #NavMenu .menugroup li {
    height: 16vw;
    padding: 0 4vw
  }
  #Header .inner #NavMenu .menugroup li.contact a {
    padding: 0
  }
  #Header .inner #NavMenu .menugroup li a::after {
    border-width: 1.33333vw 0 1.33333vw 1.6vw;
    top: 6.66667vw;
    right: 2.66667vw
  }
  #Header .inner #NavMenu .menugroup li a h4 {
    font-weight: 500;
    font-size: 4.26667vw;
    line-height: 4.26667vw;
    letter-spacing: .5vw;
    color: #444
  }
  #Header #Menubtn {
    width: 13.33333vw;
    height: 13.33333vw;
    display: flex !important
  }
  #Header #Menubtn .inner_box {
    width: 8vw;
    height: 5.33333vw
  }
  #Header #Menubtn .inner_box span {
    height: 2px
  }
  #Header #Menubtn .inner_box span:nth-child(2) {
    top: calc(50% - .5px)
  }
  #Header #Menubtn .inner_box span:nth-child(3) {
    width: 5.33333vw
  }
  #Header #Menubtn.active .inner_box span:nth-child(1) {
    transform: translate(0, 2.4vw) rotate(45deg);
    -webkit-transform: translate(0, 2.4vw) rotate(45deg);
    -moz-transform: translate(0, 2.4vw) rotate(45deg);
    -ms-transform: translate(0, 2.4vw) rotate(45deg);
    -o-transform: translate(0, 2.4vw) rotate(45deg)
  }
  #Header #Menubtn.active .inner_box span:nth-child(3) {
    transform: translate(0, -2.4vw) rotate(-45deg);
    -webkit-transform: translate(0, -2.4vw) rotate(-45deg);
    -moz-transform: translate(0, -2.4vw) rotate(-45deg);
    -ms-transform: translate(0, -2.4vw) rotate(-45deg);
    -o-transform: translate(0, -2.4vw) rotate(-45deg)
  }
  #Header.active .inner #NavMenu {
    top: 13.33333vw
  }
}

#KasouHeader {
  margin: 70px 0 0 0;
  padding: 100px 0;
  background: url("../images/headerbg1_pc.jpg") center center;
  background-size: cover
}

#KasouHeader .inner {
  padding: 0
}

#KasouHeader .inner .inner_box {
  position: relative
}

#KasouHeader .inner .inner_box h2 {
  font-weight: 500;
  font-size: 24px;
  line-height: 36px;
  letter-spacing: 1px;
  color: #fff;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  text-align: center
}

#KasouHeader .inner .inner_box label {
  font-family: urw-din, sans-serif;
  font-weight: bold;
  font-size: 60px;
  line-height: 68px;
  letter-spacing: 2px;
  color: #fff;
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
  text-align: center
}

@media all and (max-width: 767px) {
  #KasouHeader {
    margin: 13.33333vw 0 0 0;
    padding: 10.66667vw 0;
    background: url("../images/headerbg1_sp.jpg") center center;
    background-size: cover
  }
  #KasouHeader .inner .inner_box h2 {
    font-weight: 500;
    font-size: 3.73333vw;
    line-height: 5.33333vw;
    letter-spacing: .5vw;
    color: #fff
  }
  #KasouHeader .inner .inner_box label {
    font-family: urw-din, sans-serif;
    font-weight: bold;
    font-size: 8vw;
    line-height: 10.13333vw;
    letter-spacing: .3vw;
    color: #fff
  }
}

#FooterNav {
  padding: 30px 0;
  background: url("../images/footernav_bg_pc.jpg") top center;
  background-size: cover
}

#FooterNav .inner .inner_l {
  width: calc(100% - 340px)
}

#FooterNav .inner .inner_l h3 {
  font-weight: 500;
  font-size: 20px;
  line-height: 20px;
  letter-spacing: 1px;
  color: #fff
}

#FooterNav .inner .inner_l label {
  margin-top: 5px;
  font-family: urw-din, sans-serif;
  font-weight: 600;
  font-size: 50px;
  line-height: 50px;
  letter-spacing: 1px;
  color: #fff
}

#FooterNav .inner .inner_l p {
  font-weight: 500;
  font-size: 18px;
  line-height: 24px;
  letter-spacing: 1px;
  color: #fff;
  margin-top: 10px
}

#FooterNav .inner .inner_r {
  width: 340px;
  align-items: center;
  display: -webkit-flex;
  display: flex
}

#FooterNav .inner .inner_r .morebtn {
  margin: 0 0 0 auto;
  width: 320px;
  border-radius: 60px
}

#FooterNav .inner .inner_r .morebtn a {
  border: none;
  position: relative
}

#FooterNav .inner .inner_r .morebtn a label {
  font-weight: 500;
  font-size: 21px;
  line-height: 31px;
  letter-spacing: 1px;
  color: #a5896c;
  margin-top: 0;
  margin-left: -10px
}

#FooterNav .inner .inner_r .morebtn a::before {
  content: '';
  width: 9px;
  height: 9px;
  border: 0px;
  border-top: solid 2px #a5896c;
  border-right: solid 2px #a5896c;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 40px;
  margin-top: -6px;
  -webkit-transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all .5s cubic-bezier(0.215, 0.61, 0.355, 1)
}

@media screen and (min-width: 1025px) {
  #FooterNav .inner .inner_r .morebtn a:hover::before {
    border-top: solid 2px #fff;
    border-right: solid 2px #fff
  }
  #FooterNav .inner .inner_r .morebtn a:hover label {
    color: #fff
  }
}



@media all and (max-width: 767px) {
  #FooterNav {
    padding: 5.33333vw 0;
    background: url("../images/footernav_bg_sp.jpg") top center;
    background-size: cover
  }
  #FooterNav .inner .inner_l {
    width: 100%
  }
  #FooterNav .inner .inner_l h3 {
    font-weight: 500;
    font-size: 4.26667vw;
    line-height: 4.26667vw;
    letter-spacing: .5vw;
    color: #fff
  }
  #FooterNav .inner .inner_l label {
    margin-top: .53333vw;
    font-family: urw-din, sans-serif;
    font-weight: 600;
    font-size: 10.66667vw;
    line-height: 10.66667vw;
    letter-spacing: .3vw;
    color: #fff
  }
  #FooterNav .inner .inner_l p {
    font-weight: 500;
    font-size: 3.73333vw;
    line-height: 6.4vw;
    letter-spacing: .2vw;
    color: #fff;
    margin-top: 1.33333vw
  }
  #FooterNav .inner .inner_r {
    width: 100%;
    margin-top: 5.33333vw
  }
  #FooterNav .inner .inner_r .morebtn {
    margin: 0 auto;
    width: 73.33333vw;
    border-radius: 13.33333vw;
    height: 13.33333vw
  }
  #FooterNav .inner .inner_r .morebtn a label {
    font-weight: 500;
    font-size: 4.8vw;
    line-height: 6.6vw;
    letter-spacing: .3vw;
    color: #a5896c;
    margin-left: -2.66667vw
  }
  #FooterNav .inner .inner_r .morebtn a::before {
    content: '';
    width: 2.13333vw;
    height: 2.13333vw;
    right: 9.33333vw;
    margin-top: -1.38667vw
  }
}

#Footer {
  position: relative;
  z-index: 10;
  background: #383A43;
  margin: 0 auto;
  padding: 60px 100px
}

#Footer .inner .inner_l h2 {
  width: 260px
}

#Footer .inner .inner_l h2 img {
  width: 260px;
  height: 31.65px
}

#Footer .inner .inner_l .linklist {
  margin-top: 30px;
  -webkit-justify-content: flex-start;
  justify-content: flex-start
}

#Footer .inner .inner_l .linklist li {
  margin-right: 30px
}

#Footer .inner .inner_l .linklist li:last-child {
  margin-right: 0
}

#Footer .inner .inner_l .linklist li a {
  font-weight: 500;
  font-size: 16px;
  line-height: 16px;
  letter-spacing: 1px;
  color: #ddd
}

@media screen and (min-width: 1025px) {
  #Footer .inner .inner_l .linklist li a:hover {
    color: #c2b094;
  }
}

#Footer .inner .inner_r p {
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 1px;
  color: #ddd
}

#Footer .inner .inner_r p.copyright {
  margin-top: 3px;
  font-family: urw-din, sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 12px;
  letter-spacing: .5px;
  color: #ddd
}

@media all and (max-width: 1024px) {
  #Footer {
    padding: 60px 50px
  }
  #Footer .inner {
    display: block
  }
  #Footer .inner .inner_r {
    margin-top: 20px
  }
}

@media all and (max-width: 767px) {
  #Footer {
    padding: 8vw 4vw
  }
  #Footer .inner .inner_l {
    width: 100%
  }
  #Footer .inner .inner_l h2 {
    width: 48vw;
	margin: auto;
  }
  #Footer .inner .inner_l h2 img {
    width: 48vw;
    height: auto
  }
  #Footer .inner .inner_l .linklist {
    margin-top: 4vw
  }
  #Footer .inner .inner_l .linklist li {
    margin-right: 0
  }
  #Footer .inner .inner_l .linklist li:nth-child(2n-1) {
    width: 33.33333vw
  }
  #Footer .inner .inner_l .linklist li:last-child {
    margin-bottom: 0
  }
  #Footer .inner .inner_l .linklist li a {
    font-weight: 500;
    font-size: 3.73333vw;
    line-height: 8vw;
    letter-spacing: .5vw;
    color: #ddd
  }
  #Footer .inner .inner_r {
    width: 100%;
    margin-top: 3.2vw
  }
  #Footer .inner .inner_r p {
    font-weight: 500;
    font-size: 3.2vw;
    line-height: 4.8vw;
    letter-spacing: .5vw;
    color: #ddd
  }
  #Footer .inner .inner_r p.copyright {
    font-weight: 500;
    font-size: 2.66667vw;
    line-height: 2.66667vw;
    letter-spacing: .2vw;
    color: #ddd;
    margin-top: 5.33333vw;
    text-align: center
  }
}

@media screen and (max-width: 767px) {
  #FooterNav .inner {
    flex-direction: column;      /* 縦並びに変更 */
    align-items: center;         /* 中央寄せ */
    text-align: center;          /* テキスト中央揃え */
  }

  #FooterNav .inner_l {
    margin-bottom: 20px;         /* ボタンとの間に少し余白 */
  }

  #FooterNav .inner_r .morebtn a {
    display: inline-block;       /* ボタンを中央に */
    margin: 0 auto;
  }
}

@media screen and (min-width: 768px) {
  .sp-only {
    display: none;
  }
}


@media screen and (max-width: 767px) {
  #FooterNav .inner_r .morebtn a {
    display: inline-block;
    margin: 0 auto;
    text-align: center;
    padding: 12px 32px;
    border-radius: 30px;
    line-height: 1.5;
    font-size: 15px;
    white-space: nowrap;
  }

  /* ボタン内テキストの左右余白を調整 */
  #FooterNav .inner_r .morebtn a label {
    display: inline-block;
    letter-spacing: 0.05em;
  }
}

@media screen and (max-width: 767px) {
  #FooterNav {
    padding: 60px 0; /* セクション全体の上下余白は維持 */
  }

  #FooterNav .inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  #FooterNav .inner_l h3 {
    font-size: 20px;
    margin-bottom: 4px; /* 「お問い合わせ」とCONTACTの距離をやや詰める */
  }

  #FooterNav .inner_l label {
    display: block;
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 8px; /* CONTACTと説明文の距離をさらに詰める */
  }

  #FooterNav .inner_l p {
    line-height: 1.9;
    margin-bottom: 10px; /* ボタンとの距離をかなり詰める */
  }

  #FooterNav .inner_r .morebtn a {
    display: inline-block;
    margin: 0 auto;
    padding: 13px 36px; /* バランスの良い見た目に */
    border-radius: 30px;
    text-align: center;
    font-size: 16px;
  }
}

@media screen and (max-width: 767px) {
  /* Serviceセクション下の余白を詰める */
  #Service {
    margin-bottom: 40px; /* 今よりも小さく（例: 元が100px前後ならこれで自然） */
  }

  /* li間の間隔が広すぎる場合 */
  #Service .itemlist li {
    margin-bottom: 40px; /* 各ブロック間の間隔も調整 */
  }

  /* 最後のブロックだけ下の余白をさらに詰める */
  #Service .itemlist li:last-child {
    margin-bottom: 0;
  }
}

/* ── Service：SPの縦間隔と画像の下の隙間を解消 ── */
@media (max-width: 767px) {
  /* セクション末尾を詰める（お問い合わせに寄せる） */
  #Service { padding-bottom: 0 !important; margin-bottom: 0 !important; }

  /* 各ブロック間の“余白”は margin ではなく padding で管理する */
  #Service .itemlist { gap: 0; }               /* 万一の gap 指定の無効化 */
  #Service .itemlist li { 
    margin: 0;                                  /* 上下の隙間を作らない */
    padding: 28px 20px;                         /* 内側の余白だけ確保 */
    overflow: hidden;                           /* ::before のはみ出しも抑制 */
  }
  #Service .itemlist li + li { margin-top: 0; } /* 念のため */

  /* 画像下に出る数pxの帯を消す（ベースライン対策） */
  #Service .itemlist figure { margin: 0; }
  #Service .itemlist figure img { 
    display: block;                             /* ←これで下の白帯が消える */
    width: 100%;
    height: auto;
  }

  /* 見出しの上マージンが“帯”になるのを防ぐ */
  #Service .itemlist .section_title { margin-top: 0; }
  #Service .itemlist .section_sub   { margin-top: 6px; }
  #Service .itemlist .section_text  { margin-top: 10px; }

  /* 最後の項目だけ下を詰める（お問い合わせ手前の空白対策） */
  #Service .itemlist li:last-child { padding-bottom: 20px; }

  /* 仕切り線・疑似要素があれば強制無効化（テーマ対策） */
  #Service .inner::after,
  #Service .itemlist::after,
  #Service .itemlist li::after { content: none !important; border: 0 !important; }
}



@media screen and (min-width: 768px) {
  #LoadingGroup .inner_box img {
    display: block;
    margin-top: -110px !important;
  }
}