@charset "UTF-8";
@import url(./all.css);
/* ------------------------------
 Base
------------------------------ */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

html {
  -webkit-text-size-adjust: 100%;
}

* {
  border: none;
  margin: 0;
  padding: 0;
  font-weight: inherit;
  font-size: inherit;
  letter-spacing: inherit;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

section, article, aside, dialog, figure, footer, header, hgroup, nav, li {
  display: block;
}

body {
  font-size: 16px;
  font-weight: 400;
  font-family: "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
  line-height: 1.8;
  letter-spacing: .05rem;
  text-align: left;
  color: #2B2B2B;
  background: #FAF6F3;
  font-feature-settings: "palt";
}

a {
  color: #2B2B2B;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  outline: none;
  text-decoration: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
}

a.hover {
  cursor: pointer;
}

li {
  list-style-type: none;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
  -webkit-tap-highlight-color: transparent;
}
img.objectfit {
  object-fit: cover;
  object-position: center center;
  font-family: 'object-fit: cover;';
  width: 100%;
  height: 100%;
}
img.objectfit.contain {
  object-fit: contain;
}

svg {
  width: 100%;
  height: 100%;
  fill: currentColor;
  vertical-align: middle;
}

select {
  background: transparent;
}

::selection {
  background: rgba(213, 213, 213, 0.3);
}

::-moz-selection {
  background: rgba(213, 213, 213, 0.3);
}

body {
  overflow: auto !important;
}

body.no-scroll,
body.modaal-noscroll {
  overflow: hidden !important;
}

/* ---------- Animation-Setting ---------- */
.anime-fade {
  opacity: 0;
  transition: transform, opacity, 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.anime-fade.is-active {
  opacity: 1;
}

.anime-fade-up {
  transform: translateY(10px);
  opacity: 0;
  filter: blur(5px);
  transition: transform, opacity, 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.anime-fade-up.is-active {
  transform: translateY(0);
  opacity: 1;
  filter: none;
}

.anime-fade-down {
  transform: translateY(-10px);
  opacity: 0;
  filter: blur(5px);
  transition: transform, opacity, 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.anime-fade-down.is-active {
  transform: translateY(0);
  opacity: 1;
  filter: none;
}

.anime-fade-toright {
  transform: translateX(-10px);
  opacity: 0;
  filter: blur(5px);
  transition: transform, opacity, 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.anime-fade-toright.is-active {
  transform: translateX(0);
  opacity: 1;
  filter: none;
}

.anime-fade-toleft {
  transform: translateX(10px);
  opacity: 0;
  transition: transform, opacity, 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  filter: blur(5px);
}
.anime-fade-toleft.is-active {
  transform: translateX(0);
  opacity: 1;
  filter: none;
}

.anime-shutter {
  position: relative;
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  transition: transform, opacity, 1.8s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  filter: blur(7px);
}
.anime-shutter.is-active {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  filter: none;
}

.anime-blur {
  position: relative;
  opacity: 0;
  transition: opacity, 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  filter: blur(15px);
}
.anime-blur.is-active {
  opacity: 1;
  filter: none;
}

.mask {
  z-index: 0;
  -webkit-mask-image: url(../images/mask.png);
  mask-image: url(../images/mask.png);
  mask-mode: alpha;
  -webkit-mask-position: center bottom;
  mask-position: center bottom;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: auto 200%;
  mask-size: auto 200%;
  opacity: 0;
}
.mask.on {
  -webkit-animation: 1.8s mask-animation cubic-bezier(0, 0.4, 0.48, 1) 0s forwards;
  animation: 1.8s mask-animation cubic-bezier(0, 0.4, 0.48, 1) 0s forwards;
}

@-webkit-keyframes mask-animation {
  0% {
    -webkit-mask-position: center bottom;
    mask-position: center bottom;
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  to {
    -webkit-mask-position: center 0%;
    mask-position: center 0%;
    -webkit-mask-size: auto 500%;
    mask-size: auto 500%;
    opacity: 1;
  }
}
@keyframes mask-animation {
  0% {
    -webkit-mask-position: center bottom;
    mask-position: center bottom;
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  to {
    -webkit-mask-position: center 0%;
    mask-position: center 0%;
    -webkit-mask-size: auto 500%;
    mask-size: auto 500%;
    opacity: 1;
  }
}
/* ------------------------------
 Base END
------------------------------ */
main {
  display: block;
}

.wrapper {
  max-width: 1200px;
  margin: 0 auto;
  text-align: left;
  clear: both;
}
.wrapper.wide {
  max-width: 1600px;
  padding-left: 50px;
  padding-right: 50px;
}
.wrapper.narrow {
  max-width: 800px;
}

.pcnone {
  display: none;
}

.pctabnone {
  display: none;
}

.fotorama__thumb-border {
  border-color: #E1A990 !important;
}

/* ------------------------------
 Header
------------------------------ */
#header {
  position: fixed;
  z-index: 1000;
  left: 0;
  right: 0;
  top: 0;
}
#header .midnightInner {
  overflow: hidden !important;
  padding: 40px 3vw 0;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.hd_logo {
  width: 160px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.hd_logo a {
  width: 100%;
  display: block;
}
.hd_logo a svg {
  height: auto;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.hd_logo a svg * {
  fill: #2B2B2B;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.global_navi {
  display: flex;
  align-items: center;
  padding-right: 85px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.global_navi ul {
  display: flex;
}
.global_navi ul li {
  padding: 0 15px;
}
.global_navi ul li a {
  display: block;
  position: relative;
  padding-left: 20px;
  color: #2B2B2B;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.global_navi ul li a::before {
  content: "";
  width: 5px;
  height: 1px;
  background: #2B2B2B;
  position: absolute;
  left: 0;
  top: 50%;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.global_navi ul li a::after {
  content: "";
  background-color: currentColor;
  width: 0;
  height: 1px;
  position: absolute;
  bottom: 3px;
  left: 20px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.global_navi ul li a:hover::after {
  width: calc(100% - 20px);
}
.global_navi .link_contact {
  margin-left: 15px;
}
.global_navi .link_contact a {
  display: block;
  background: #444;
  color: #fff;
  padding: 5px 20px;
  border-radius: 50px;
  box-sizing: border-box;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.global_navi .link_contact a:hover {
  opacity: .7;
}

#navibutton {
  width: 35px;
  height: 35px;
  position: absolute;
  right: 3vw;
  top: 40px;
  z-index: 100;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.midnightHeader.white .hd_logo a svg * {
  fill: #fff;
}
.midnightHeader.white .global_navi ul li a {
  color: #fff;
}
.midnightHeader.white .global_navi ul li a::before {
  background: #fff;
}

/* ------------------------------
 Fat-Navigation
------------------------------ */
.fat-nav, .hamburger__icon,
.hamburger__icon:after,
.hamburger__icon:before {
  -webkit-transition-duration: .4s;
  transition-duration: .4s;
}

.hamburger {
  width: 100%;
  box-sizing: border-box;
  touch-action: manipulation;
  padding: 12px 0 0;
  height: 35px;
  display: block;
  position: relative;
  z-index: 910;
}
.hamburger::after {
  content: "menu";
  text-align: center;
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  line-height: 1.2;
  width: 100%;
  letter-spacing: 0;
  color: #2B2B2B;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 12px;
}

.hamburger__icon {
  position: relative;
  width: 35px;
  margin: 0 auto;
  height: 0;
  display: block;
}

.hamburger__icon:before,
.hamburger__icon:after {
  position: absolute;
  content: "";
  right: 0;
  display: block;
  height: 2px;
  background-color: #2B2B2B;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.hamburger__icon:before {
  top: -5px;
  width: 35px;
}

.hamburger__icon:after {
  top: 5px;
  width: 35px;
}

.fat-nav {
  display: none;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 900;
  position: fixed;
  width: 100vw;
  text-align: left;
  box-sizing: border-box;
  background: #FAF6F3;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transition-duration: .5s;
  transition-duration: .5s;
  -webkit-overflow-scrolling: touch;
  overflow: hidden;
}
.fat-nav.active .fat-nav__wrapper {
  -webkit-transform: translateY(0) !important;
  transform: translateY(0) !important;
}
.fat-nav .fat-nav__wrapper {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  display: table;
}
.fat-nav .fat-nav__inner {
  overflow-y: scroll;
  width: 100%;
  height: 100%;
  padding: 120px 7vw;
  box-sizing: border-box;
  align-content: center;
}
.fat-nav .fat-nav__menu {
  display: flex;
  justify-content: space-between;
  max-width: 1400px;
  margin: 0 auto;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: translateY(15px);
  opacity: 0;
  filter: blur(10px);
}
.no-scroll .fat-nav .fat-nav__menu {
  transform: translateY(0);
  opacity: 1;
  filter: blur(0);
}
.fat-nav .fat-nav__menu a:hover {
  opacity: .5;
}
.fat-nav .fat-nav__menu .menu_main {
  display: flex;
  flex: 1;
}
.fat-nav .fat-nav__menu .menu_main .column {
  flex: 1;
}
.fat-nav .fat-nav__menu .menu_main .column + .column {
  margin-left: 5%;
}
.fat-nav .fat-nav__menu .menu_main .column .sec + .sec {
  margin-top: 60px;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .sec_title a {
  display: block;
  line-height: 1.6;
  font-size: clamp(21px, 2vw, 30px);
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  letter-spacing: 0.1em;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .list_wrap {
  position: relative;
  padding-left: 22px;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .list_wrap::before {
  content: "";
  background-color: #ccc;
  width: 1px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 5px;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .list_wrap ul + ul {
  margin-top: 20px;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .icon.blank {
  line-height: 1;
  display: inline-block;
  vertical-align: middle;
  margin-left: .5em;
  width: 10px;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .icon.blank img {
  vertical-align: middle;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .list_level1 > li > a {
  display: block;
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.6;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .list_level2 {
  margin: 7px 0 0 10px;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .list_level2 > li + li {
  margin-top: 5px;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .list_level2 > li > a {
  display: block;
  font-size: 14px;
  color: #b5b5b5;
}
.fat-nav .fat-nav__menu .menu_main .column .sec .list_level2 > li > a::before {
  content: "";
  background-color: #b5b5b5;
  width: 4px;
  height: 4px;
  border-radius: 100%;
  display: inline-block;
  vertical-align: middle;
  margin: -2px 8px 0 0;
}
.fat-nav .fat-nav__menu .menu_side {
  width: 260px;
  flex-shrink: 0;
  order: 2;
  margin-left: 5%;
}
.fat-nav .fat-nav__menu .menu_side .btn {
  margin-top: 10px;
}
.fat-nav .fat-nav__menu .menu_side .btn .btn_item {
  margin: 0;
}
.fat-nav .fat-nav__menu .menu_side .btn .btn_item + .btn_item {
  margin-top: 10px;
}
.fat-nav .fat-nav__menu .menu_side .btn .btn_item a {
  display: block;
  text-align: center;
  border: 1px solid #CBC3BE;
  border-radius: 3px;
  color: #A1948B;
  font-size: 13px;
  padding: 15px 10px 13px;
}
.fat-nav .fat-nav__menu .menu_side .btn .btn_item.contact {
  margin-bottom: 30px;
}
.fat-nav .fat-nav__menu .menu_side .btn .btn_item.contact a {
  background-color: #444;
  color: #fff;
  border: none;
}
.fat-nav .fat-nav__menu .menu_side .privacy {
  margin-top: 20px;
}
.fat-nav .fat-nav__menu .menu_side .privacy a {
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 14px;
}
.fat-nav .fat-nav__menu .menu_side .sns {
  display: flex;
  margin-top: 30px;
}
.fat-nav .fat-nav__menu .menu_side .sns li + li {
  margin-left: 10px;
}
.fat-nav .fat-nav__menu .menu_side .sns li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  background-color: #d5d5d5;
  color: #fff;
  font-size: 13px;
}

.midnightHeader.white .hamburger::after {
  color: #fff;
}
.midnightHeader.white .hamburger__icon:before,
.midnightHeader.white .hamburger__icon:after {
  background-color: #fff;
}

.no-scroll .hd_logo a svg * {
  fill: #2B2B2B !important;
}
.no-scroll .global_navi {
  opacity: 0;
  visibility: hidden;
}
.no-scroll .hamburger::after {
  content: "close";
  color: #2B2B2B !important;
}
.no-scroll .hamburger .hamburger__icon {
  background-color: transparent;
}
.no-scroll .hamburger .hamburger__icon::before, .no-scroll .hamburger .hamburger__icon::after {
  width: 24px;
  right: 6px;
  background-color: #2B2B2B !important;
}
.no-scroll .hamburger .hamburger__icon::before {
  transform: translateY(-2px) rotate(45deg);
}
.no-scroll .hamburger .hamburger__icon::after {
  transform: translateY(-12px) rotate(-45deg);
}

/* ------------------------------
 Footer
------------------------------ */
#pagetop {
  position: fixed;
  right: -70px;
  bottom: 20px;
  z-index: 500;
  text-align: center;
  line-height: 1;
  transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  opacity: 0;
}
#pagetop a {
  color: #fff;
  display: block;
  width: 70px;
  height: 70px;
  padding: 9px 0 0;
  border: 1px solid #FFF;
  border-right: none;
  box-sizing: border-box;
  background-color: #666666;
}
#pagetop a:hover {
  padding-top: 4px;
}
#pagetop a:hover i {
  margin-bottom: 5px;
}
#pagetop span {
  display: block;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  font-size: 12px;
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  letter-spacing: 0;
  vertical-align: middle;
}
#pagetop i {
  font-size: 32px;
  display: block;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.is-scroll #pagetop {
  opacity: 1;
  right: 0;
}

#footer {
  background: #fff;
  padding: 180px 0;
}
#footer .ft_main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row-reverse;
}
#footer .ft_link .ft_link_banner {
  width: 430px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 50px;
  /*.link_sdgs {
  	width: 48%;
  	a {
  		height: 60px;
  		justify-content: center;
  		flex-direction: column;
  		border: 1px solid $lgray;
  		padding: 12px 30px;
  		box-sizing: border-box;
  		text-align: center;
  		img {
  			opacity: .7;
  			max-width: 160px;
  			margin-bottom: 7px;
  		}
  		p {
  			color: #5190CC;
  			line-height: 1.4;
  			font: {
  				size: 16px;
  			}
  			span {
  				display: block;
  				font: {
  					size: 11px;
  				}
  			}
  		}
  	}
  }
  .link_sod {
  	width: 48%;
  	a {
  		height: 60px;
  		justify-content: center;
  		border: 1px solid $lgray;
  		padding: 10px 30px;
  		box-sizing: border-box;
  		text-align: center;
  		img {
  			filter: grayscale(100%);
  		}
  		p {
  			//color: #5190CC;
  			line-height: 1.4;
  			font: {
  				size: 16px;
  			}
  			span {
  				display: block;
  				font: {
  					size: 11px;
  				}
  			}
  		}
  	}
  }*/
}
#footer .ft_link .ft_link_banner li a {
  height: 70px;
  display: flex;
  align-items: center;
  border-radius: 5px;
}
#footer .ft_link .ft_link_banner li a:hover {
  opacity: .7;
}
#footer .ft_link .ft_link_banner .link_contact {
  width: 430px;
  margin-bottom: 15px;
}
#footer .ft_link .ft_link_banner .link_contact a {
  justify-content: space-between;
  background: #444;
  color: #fff;
  padding: 5px 30px;
  box-sizing: border-box;
}
#footer .ft_link .ft_link_banner .link_contact a .en {
  display: block;
  font-size: 20px;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#footer .ft_link .ft_link_banner .link_contact a .jp {
  display: block;
  font-size: 14px;
}
#footer .ft_link .ft_link_banner .link_cnt {
  width: 48%;
}
#footer .ft_link .ft_link_banner .link_cnt a {
  height: 60px;
  justify-content: center;
  flex-direction: column;
  border: 1px solid #d5d5d5;
  box-sizing: border-box;
  text-align: center;
}
#footer .ft_link .ft_link_banner .link_cnt a p {
  line-height: 1.4;
  font-size: clamp(13px, 1.8vw, 16px);
}
#footer .ft_link .ft_link_banner .link_cnt a p span {
  display: block;
  font-size: clamp(10px, 1.3vw, 11px);
}
#footer .ft_address address {
  font-style: normal;
}
#footer .ft_address address .ft_logo {
  width: 180px;
  margin-bottom: 60px;
}
#footer .ft_address address .ft_logo a {
  width: 100%;
  display: block;
}
#footer .ft_address address .ft_logo a svg * {
  fill: #2B2B2B;
}
#footer .ft_address address .ft_tel {
  margin-bottom: 10px;
  font-size: 21px;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#footer .ft_address address .ft_tel span {
  font-size: 21px;
  font-family: "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
#footer .ft_address address .text {
  line-height: 1.45;
  margin-bottom: 5px;
  font-size: 14px;
}
#footer .ft_address address .text i {
  margin-left: 10px;
}
#footer .ft_address .ft_sns {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-top: 20px;
}
#footer .ft_address .ft_sns li {
  width: 60px;
  height: 60px;
  margin-right: 15px;
}
#footer .ft_address .ft_sns li a {
  width: 100%;
  height: 100%;
  display: block;
  background: #444;
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
  font-size: 22px;
}
#footer .ft_address .ft_sns li a:hover {
  opacity: .7;
}
#footer .ft_sub {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
#footer .ft_sub .ft_textlink {
  margin-right: 35px;
}
#footer .ft_sub .ft_textlink a {
  font-size: 13px;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#footer .ft_sub .ft_textlink a i {
  margin-left: 10px;
}
#footer .ft_sub .copy {
  font-size: 13px;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

/* ------------------------------
  BreadCrumbs
------------------------------ */
#breadcrumbs {
  margin: 50px 0 30px;
}
#breadcrumbs ul {
  text-align: right;
  letter-spacing: -.4em;
  line-height: 1.4;
}
#breadcrumbs ul li {
  display: inline-block;
  letter-spacing: 0;
  font-size: 12px;
}
#breadcrumbs ul li a {
  font-size: inherit;
  text-decoration: underline;
}
#breadcrumbs ul li a::after {
  content: "-";
  display: inline-block;
  margin: 0 6px;
  vertical-align: 0;
}
#breadcrumbs ul li strong {
  font-size: inherit;
}

/* ------------------------------
 Contents
------------------------------ */
.more {
  width: 170px;
  height: 46px;
}
.more .more_inner {
  height: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border: 1px solid #616161;
  text-align: left;
  padding: 0 45px 0 30px;
  border-radius: 50px;
  position: relative;
  font-size: clamp(11px, 1.6vw, 14px);
  font-family: "Marcellus", "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro";
}
.more .more_inner::after {
  content: "";
  width: 18px;
  height: 8px;
  mask-position: center center;
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-image: url(../images/arrow.svg);
  background: #2B2B2B;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.more .more_inner.outsidelink::after {
  content: "\f08e";
  width: 15px;
  height: 15px;
  mask-image: none;
  background: transparent;
  color: #AEAAA7;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  line-height: 1;
  font-size: 15px;
  font-family: "Font Awesome 6 free", "Font Awesome 6 Brands";
  font-weight: 900;
}
.more.wh .more_inner {
  border-color: #fff;
  color: #fff;
}
.more.wh .more_inner::after {
  background: #fff;
}

.more_arrow .more_inner {
  width: 24px;
  height: 10px;
  padding: 10px;
  position: relative;
  display: block;
}
.more_arrow .more_inner::after {
  content: "";
  width: 18px;
  height: 8px;
  mask-position: center center;
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-image: url(../images/arrow.svg);
  background: #2B2B2B;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.down_arrow {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%) rotate(90deg);
  width: 16px;
  height: 6.6px;
  mask-position: center center;
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-image: url(../images/arrow.svg);
  background: #2B2B2B;
}

.page_title {
  padding: 200px 0 120px;
}
.page_title .title .en {
  line-height: 1.2;
  letter-spacing: .4rem;
  display: block;
  visibility: hidden;
  font-size: clamp(32px, 5.8vw, 60px);
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.page_title .title .en.is-ready {
  visibility: visible;
}
.page_title .title .en .text {
  opacity: 0;
  display: inline-block;
}
.page_title .title .jp {
  display: block;
  transition-delay: 1.2s;
}
.page_title:has(#mv_bg) {
  position: relative;
  z-index: 2;
  padding: 370px 0 100px;
  overflow: hidden;
}
.page_title:has(#mv_bg) .title {
  color: #FFF;
}
.page_title:has(#mv_bg) .title small {
  display: block;
  font-size: 13px;
}
.page_title:has(#mv_bg) .title small::before {
  content: "";
  display: inline-block;
  vertical-align: 2px;
  margin: 0 10px 0 0;
  width: 6px;
  height: 6px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  background-color: #FFF;
}
.page_title:has(#mv_bg) #mv_bg {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.page_title:has(#mv_bg) #mv_bg figure {
  width: 100%;
  height: 100%;
}
.page_title:has(#mv_bg) #mv_bg::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #2B2B2B;
  opacity: .26;
}

.sec_title .en {
  display: block;
  line-height: 1.2;
  font-size: clamp(26px, 4.2vw, 35px);
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.sec_title .jp {
  display: block;
  font-size: clamp(12px, 1.6vw, 14px);
}

.jp_title .en {
  display: block;
  line-height: 1.2;
  color: #616161;
  font-size: clamp(12px, 1.6vw, 16px);
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.jp_title .jp {
  display: block;
  font-size: clamp(20px, 3.1vw, 26px);
  font-weight: 500;
}

/* ---------- Event ---------- */
.navi_event {
  margin-bottom: 80px;
}
.navi_event ul {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.navi_event ul li {
  min-width: 30%;
  padding-right: 60px;
  box-sizing: border-box;
}
.navi_event ul li a {
  display: block;
  padding: 5px 15px;
  border-bottom: 1px solid #616161;
  position: relative;
}
.navi_event ul li a::after {
  content: "";
  width: 24px;
  height: 10px;
  mask-position: center center;
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-image: url(../images/arrow.svg);
  background: #2B2B2B;
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}
.navi_event ul li a.current::after {
  content: "";
  width: 14px;
  height: 14px;
  mask-image: none;
  background: #E1A990;
  opacity: .5;
  border-radius: 50%;
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.list_event {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin: 0 -25px 60px;
}
.list_event li {
  width: calc(100% / 3);
  padding: 0 25px;
  box-sizing: border-box;
  margin-bottom: 70px;
}
.list_event li a {
  display: block;
}
.list_event li figure {
  width: 100%;
  aspect-ratio: 7 / 5;
  margin-bottom: 20px;
  position: relative;
}
.list_event li figure.end::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(43, 43, 43, 0.6);
  z-index: 2;
}
.list_event li figure.end::after {
  content: "終了しました";
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  z-index: 2;
  font-size: 15px;
  font-weight: 500;
}
.list_event li .text_area {
  padding: 0 10px;
}
.list_event li .text_area .category {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.list_event li .text_area .category span {
  margin-right: 5px;
  display: block;
  width: fit-content;
  background: #fff;
  padding: 5px 12px 3px;
  font-size: 11px;
}
.list_event li .text_area .post_title {
  line-height: 1.6;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 500;
}
.list_event li .text_area .text {
  line-height: 1.6;
  margin-bottom: 20px;
  font-size: clamp(12px, 1.6vw, 13px);
}
.list_event li .text_area .event_info {
  margin-bottom: 10px;
  padding-top: 10px;
  border-top: 1px dashed #AEAAA7;
}
.list_event li .text_area .event_info .date {
  position: relative;
  padding-left: 40px;
  line-height: 1.4;
  margin-bottom: 6px;
  font-size: 14px;
}
.list_event li .text_area .event_info .date::before {
  content: "";
  width: 15px;
  height: 15px;
  mask-position: center center;
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-image: url(../images/icon_calendar.svg);
  background: #616161;
  position: absolute;
  left: 11px;
  top: 1px;
}
.list_event li .text_area .event_info .add {
  position: relative;
  padding-left: 40px;
  line-height: 1.4;
  font-size: 14px;
}
.list_event li .text_area .event_info .add::before {
  content: "\f3c5";
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #616161;
  position: absolute;
  left: 10px;
  top: 0;
  font-size: 14px;
  font-family: "Font Awesome 6 free", "Font Awesome 6 Brands";
  font-weight: 900;
}

/* ---------- policy-navi ---------- */
#concept_navi {
  margin-top: 120px;
  background-color: #EDE8E2;
  padding: 100px 0 120px;
}
#concept_navi .jp_title {
  text-align: center;
  margin-bottom: 40px;
}
#concept_navi .jp_title .jp {
  font-size: clamp(17px, 3.1vw, 21px);
}

.list_policy {
  display: flex;
  flex-wrap: wrap;
}
.list_policy li {
  width: 50%;
  box-sizing: border-box;
  padding: 45px;
}
.list_policy li:not(:nth-child(1), :nth-child(2)) {
  border-top: 1px solid #777;
}
.list_policy li:nth-child(even) {
  border-left: 1px solid #777;
}
.list_policy li a {
  display: flex;
}
.list_policy li a:hover .ph img {
  transform: scale(1.05);
}
.list_policy li a:hover .textarea .more {
  opacity: .6;
}
.list_policy li a .ph {
  order: 2;
  margin-left: 5%;
  flex-shrink: 0;
  align-self: flex-start;
  width: 30%;
  overflow: hidden;
}
.list_policy li a .ph img {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.list_policy li a .textarea .num {
  position: relative;
  font-size: 13px;
  color: #AEAAA7;
  margin-bottom: 8px;
}
.list_policy li a .textarea .num::before {
  content: "";
  background-color: #AEAAA7;
  width: 6px;
  height: 6px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  border-radius: 100%;
  margin-top: -3px;
}
.list_policy li a .textarea .title {
  font-size: 22px;
  line-height: 1.6;
  font-weight: 500;
  margin-bottom: 15px;
}
.list_policy li a .textarea .text {
  font-size: 15px;
}
.list_policy li a .textarea .more {
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  width: auto;
  height: auto;
  margin-top: 15px;
  font-size: 14px;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.list_policy li a .textarea .more::after {
  content: "";
  width: 18px;
  height: 8px;
  mask-position: center center;
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-image: url(../images/arrow.svg);
  background: #2B2B2B;
  display: inline-block;
  vertical-align: middle;
  margin-left: 10px;
}

/* ---------- 商品ラインナップ ---------- */
.lineup_navi {
  background-color: #EDE8E2;
  padding: 100px 0 70px;
}
.lineup_navi .jp_title {
  text-align: center;
  margin-bottom: 30px;
}
.lineup_navi .jp_title .jp {
  font-size: clamp(17px, 3.1vw, 21px);
}
.lineup_navi .list_lineup {
  display: flex;
  justify-content: flex-start;
  margin: 0 -45px 70px;
}
.lineup_navi .list_lineup li {
  width: 50%;
  padding: 0 45px;
  box-sizing: border-box;
}
.lineup_navi .list_lineup li a {
  display: block;
}
.lineup_navi .list_lineup li a:hover figure img {
  transform: scale(1.05);
}
.lineup_navi .list_lineup li a figure {
  width: 100%;
  aspect-ratio: 1 / .6;
  overflow: hidden;
  margin-bottom: 40px;
}
.lineup_navi .list_lineup li a figure img {
  height: calc(100% + 50px);
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.lineup_navi .list_lineup li a .text_area {
  padding: 0 20px;
}
.lineup_navi .list_lineup li a .text_area .sub_title {
  font-size: 16px;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.lineup_navi .list_lineup li a .text_area .post_title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 15px;
}
.lineup_navi .list_lineup li a .text_area .post_title .en {
  font-size: clamp(30px, 4.2vw, 35px);
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.lineup_navi .list_lineup li a .text_area .post_title .jp {
  padding-left: 10px;
  font-size: 12px;
}
.lineup_navi .list_lineup li a .text_area .catch {
  line-height: 1.6;
  margin-bottom: 20px;
  font-size: clamp(15px, 2.2vw, 18px);
  font-weight: 500;
}
.lineup_navi .list_lineup li a .text_area p:not([class]) {
  text-align: justify;
  font-size: clamp(12px, 1.8vw, 14px);
}
.lineup_navi .list_lineup li a .text_area .more {
  margin-top: 40px;
}

/* ---------- 会社紹介関連 ---------- */
.company_navi {
  background-color: #EDE8E2;
  padding: 70px 0;
  margin-top: 60px;
}
.company_navi .navi_title {
  color: #616161;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 14px;
  margin-bottom: 20px;
}
.company_navi .navi_title::before {
  content: "";
  width: 15px;
  height: 1px;
  background-color: #616161;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}
.company_navi ul {
  display: flex;
}
.company_navi ul li {
  flex: 1;
}
.company_navi ul li + li {
  margin-left: 40px;
}
.company_navi ul li a {
  display: block;
}
.company_navi ul li a:hover figure img {
  transform: scale(1.05);
}
.company_navi ul li a figure {
  object-ratio: 1 / .6;
  overflow: hidden;
}
.company_navi ul li a figure img {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.company_navi ul li a .title {
  font-size: 14px;
  margin-top: 10px;
  font-weight: 500;
}

/* ---------- Next Banner ---------- */
.nextbnr {
  margin-top: 110px;
}
.nextbnr a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  color: #fff;
  box-sizing: border-box;
  height: 400px;
  padding: 0 5vw;
}
.nextbnr a:hover figure::after {
  opacity: .4;
}
.nextbnr a:hover figure img {
  transform: scale(1.03);
}
.nextbnr a figure {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.nextbnr a figure::after {
  content: "";
  background: #111;
  opacity: .5;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.nextbnr a figure img {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.nextbnr a .ontext {
  text-align: center;
  position: relative;
  z-index: 1;
}
.nextbnr a .ontext .title .en {
  display: block;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 40px;
  line-height: 1.2;
  letter-spacing: 0.1em;
}
.nextbnr a .ontext .title .jp {
  display: block;
  font-size: 12px;
}
.nextbnr a .ontext .text {
  font-size: 14px;
  margin-top: 20px;
}
.nextbnr a .ontext .more {
  margin: 30px auto 0;
}
.nextbnr a .ontext .more .more_inner {
  backdrop-filter: blur(6px);
}

/* ---------- Typography ---------- */
.post_body_wrap {
  text-align: center;
}

.postbody {
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-all;
  text-align: left;
  display: inline-block;
}
.postbody .center {
  text-align: center;
}
.postbody p + p {
  margin-top: 1em;
}
.postbody img {
  max-width: 100%;
  width: auto;
  height: auto;
  vertical-align: middle;
}
.postbody img.alignleft {
  float: left;
  margin-right: 40px;
  margin-bottom: 1em;
}
.postbody img.alignright {
  float: right;
  margin-left: 40px;
  margin-bottom: 1em;
}
.postbody img.aligncenter {
  display: block;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.postbody img.alignnone {
  padding: 5px;
  box-sizing: border-box;
}
.postbody ul:not([class]) {
  margin: 20px 0;
}
.postbody ul:not([class]) li {
  padding-left: 16px;
  margin: 6px 0;
  text-indent: -16px;
  position: relative;
  line-height: 1.5;
}
.postbody ul:not([class]) li::before {
  content: "";
  background-color: #AEAAA7;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  vertical-align: 2px;
}
.postbody dl:not([class]) {
  margin: 20px 0;
}
.postbody dl:not([class]) dt {
  font-weight: 700;
  margin-bottom: 1em;
}
.postbody dl:not([class]) dd {
  line-height: 1.4;
  margin: 6px 0;
  padding-left: 18px;
  text-indent: -18px;
}
.postbody dl:not([class]) dd::before {
  content: "";
  width: 8px;
  height: 8px;
  background-color: #AEAAA7;
  display: inline-block;
  margin-right: 10px;
  border-radius: 50%;
  text-indent: 0;
  vertical-align: 2px;
}
.postbody h1 {
  font-size: 180%;
  margin: 50px 0 40px;
}
.postbody h1 * {
  font-size: inherit;
}
.postbody h2 {
  font-size: 160%;
  font-weight: bold;
  margin: 50px 0 40px;
}
.postbody h2 * {
  font-size: inherit;
}
.postbody h3 {
  font-size: 140%;
  font-weight: bold;
  margin: 50px 0 40px;
}
.postbody h3 * {
  font-size: inherit;
}
.postbody h4 {
  font-size: 120%;
  font-weight: bold;
  margin: 50px 0 30px;
}
.postbody h4 * {
  font-size: inherit;
}
.postbody h5 {
  font-size: 110%;
  font-weight: 700;
  margin: 40px 0 25px;
}
.postbody h5 * {
  font-size: inherit;
}
.postbody h6 {
  font-weight: bold;
  margin: 30px 0 20px;
}
.postbody h6 * {
  font-size: inherit;
}
.postbody strong {
  font-weight: 700;
}
.postbody strong * {
  font-weight: inherit;
}
.postbody a {
  text-decoration: underline;
  color: #2B2B2B;
}
.postbody blockquote {
  width: 80%;
  margin: 0 auto;
  border: 1px dashed #d5d5d5;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 5px;
}
.postbody hr {
  background-color: #d5d5d5;
  border: 0;
  height: 1px;
  margin: 2em -10px;
}
.postbody table {
  border-collapse: collapse;
  border: #d5d5d5 1px solid;
}
.postbody table caption {
  font-size: 1.2em;
  margin-bottom: 10px;
  text-align: center;
}
.postbody table tr {
  border-bottom: #d5d5d5 1px solid;
}
.postbody table th {
  padding: 15px 20px;
  font-weight: bold;
  border-right: #d5d5d5 1px solid;
  text-align: center;
}
.postbody table td {
  padding: 15px 20px;
  border-right: #d5d5d5 1px solid;
}
.postbody .mt10 {
  margin-top: 10px;
}
.postbody .mt20 {
  margin-top: 20px;
}
.postbody .mt30 {
  margin-top: 30px;
}
.postbody .mt40 {
  margin-top: 40px;
}
.postbody .mb10 {
  margin-bottom: 10px;
}
.postbody .mb20 {
  margin-bottom: 20px;
}
.postbody .mb30 {
  margin-bottom: 30px;
}
.postbody .mb40 {
  margin-bottom: 40px;
}
.postbody .bold {
  font-weight: 700;
}
.postbody .flex {
  display: flex;
  justify-content: space-between;
}
.postbody .flex > * {
  margin: 0 10px;
}

/* ---------- PageNavi ---------- */
.pageback {
  margin: 0 auto 80px;
}

.pagenavi {
  margin: 20px 0;
}
.pagenavi ul {
  overflow: hidden;
  position: relative;
}
.pagenavi ul li {
  width: 40%;
}
.pagenavi ul li a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  letter-spacing: 0;
  padding: 0 30px;
}
.pagenavi ul li a::after {
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  color: #616161;
  top: 50%;
  transform: translateY(-50%);
  position: absolute;
  font-size: 20px;
  font-weight: 900;
  font-family: "Font Awesome 6 free", "Font Awesome 6 Brands";
}
.pagenavi ul li a figure {
  width: 100px;
  height: 100px;
}
.pagenavi ul li a p {
  flex: 1;
  line-height: 1.45;
  font-size: 90%;
  /*white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;*/
}
.pagenavi ul li.next {
  float: left;
}
.pagenavi ul li.next a {
  text-align: left;
}
.pagenavi ul li.next a::after {
  content: "\f104";
  left: 0;
}
.pagenavi ul li.next a figure {
  margin-right: 10px;
}
.pagenavi ul li.prev {
  float: right;
}
.pagenavi ul li.prev a {
  justify-content: flex-end;
  /*text-align: right;*/
}
.pagenavi ul li.prev a::after {
  content: "\f105";
  right: 0;
}
.pagenavi ul li.prev a figure {
  margin-left: 10px;
}

.pagination {
  clear: both;
  margin: 80px auto 40px;
  text-align: center;
  letter-spacing: -.4em;
}
.pagination span, .pagination a {
  border: #AEAAA7 1px solid;
  display: inline-block;
  margin: 0 3px;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  letter-spacing: 0;
  overflow: hidden;
  color: #AEAAA7;
}
.pagination a:hover {
  background-color: #d5d5d5;
}
.pagination .page-of {
  border-color: transparent;
  width: auto;
  margin-right: 10px;
}
.pagination .current_page {
  background-color: #444;
  border-color: #444;
  color: #fff;
}

/* ------------------------------
 Mail-Form
------------------------------ */
.sec_form {
  background: #fff;
  padding: 80px 0;
}
.sec_form .sec_title {
  text-align: center;
  margin-bottom: 60px;
}
.sec_form .inner {
  max-width: 800px;
  margin: 0 auto;
}

.mfp_element_text, .mfp_element_number, .mfp_element_select-one, .mfp_element_email, .mfp_element_tel, .mfp_element_textarea {
  box-shadow: none;
  border: none;
  background-color: #F4F4F4;
  border-radius: 0;
  padding: 5px;
  box-sizing: border-box;
}

form#mailformpro {
  padding: 0;
}
form#mailformpro table.inputform {
  width: 100%;
  margin: 60px 0 40px;
  border-collapse: collapse;
  border-bottom: 1px solid #d5d5d5;
}
form#mailformpro table.inputform th, form#mailformpro table.inputform td {
  padding: 20px 0;
  border-top: 1px solid #d5d5d5;
}
form#mailformpro table.inputform th {
  width: 30%;
  font-size: 15px;
  font-family: "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
form#mailformpro table.inputform td {
  position: relative;
  padding-left: 20px;
}
form#mailformpro table.inputform td ul {
  overflow: hidden;
}
form#mailformpro table.inputform td ul.float li {
  float: left;
  margin: 6px 6px 0 0;
}
form#mailformpro table.inputform textarea {
  height: 120px !important;
  width: 100% !important;
}
form#mailformpro table.inputform input[type="text"], form#mailformpro table.inputform input[type="tel"], form#mailformpro table.inputform input[type="email"], form#mailformpro table.inputform textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 8px;
  margin: 0 0 5px;
  border-radius: 0;
  vertical-align: middle;
  background-color: #F4F4F4;
  box-shadow: none;
  font-size: 16px;
  font-family: "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
form#mailformpro table.inputform input[type="text"]:focus, form#mailformpro table.inputform input[type="tel"]:focus, form#mailformpro table.inputform input[type="email"]:focus, form#mailformpro table.inputform textarea:focus {
  border: none;
  outline: none;
}
form#mailformpro table.inputform input[type=radio], form#mailformpro table.inputform input[type=checkbox] {
  vertical-align: middle;
  margin-left: 5px;
}
form#mailformpro table.inputform select {
  border-radius: 0;
  margin: 0 0 5px;
  padding: 10px 8px;
  vertical-align: middle;
  box-shadow: none;
  background-color: #F4F4F4;
}
form#mailformpro table.inputform input.noborder {
  border: none;
}
form#mailformpro table.inputform .hissu {
  padding: 1px 8px 0;
  color: #fff;
  background-color: #616161;
  border-radius: 0;
  vertical-align: middle;
  margin-left: 10px;
  display: inline-block;
  font-size: 10px;
  font-family: "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
form#mailformpro table.inputform :placeholder-shown {
  color: #bbb;
}
form#mailformpro table.inputform ::-webkit-input-placeholder {
  color: #bbb;
}
form#mailformpro table.inputform :-moz-placeholder {
  color: #bbb;
  opacity: 1;
}
form#mailformpro table.inputform ::-moz-placeholder {
  color: #bbb;
  opacity: 1;
}
form#mailformpro table.inputform :-ms-input-placeholder {
  color: #bbb;
}
form#mailformpro table.inputform .mfp_err {
  clear: both;
}
form#mailformpro table.inputform .zipsearch {
  display: inline-block;
  border: 1px solid #616161;
  border-radius: 50px;
  padding: 4px 8px;
  font-size: 12px;
  vertical-align: middle;
  margin-left: 10px;
}
form#mailformpro table.inputform .zipsearch:hover {
  background-color: #F4F4F4;
}
form#mailformpro table.inputform .togglebox {
  margin-top: 20px;
  padding: 20px 15px;
  background-color: #FAF6F3;
}
form#mailformpro table.inputform .togglebox .toibox_item + .toibox_item {
  margin-top: 15px;
  border-top: #d5d5d5 solid 1px;
  padding-top: 15px;
}
form#mailformpro table.inputform .togglebox .toggle_title {
  margin-bottom: 5px;
  color: #616161;
  font-size: 90%;
  font-weight: 500;
}
form#mailformpro table.inputform .togglebox input[type="text"],
form#mailformpro table.inputform .togglebox input[type="tel"],
form#mailformpro table.inputform .togglebox input[type="email"],
form#mailformpro table.inputform .togglebox select, form#mailformpro table.inputform .togglebox textarea {
  background-color: #FFF;
}
form#mailformpro table.inputform .link {
  margin-top: 5px;
}
form#mailformpro table.inputform .link a {
  color: #464343;
  font-size: 90%;
}
form#mailformpro table.inputform .link a::after {
  content: "\f105";
  display: inline-block;
  vertical-align: -3%;
  color: #AEAAA7;
  margin-left: 8px;
  font-size: 16px;
  font-weight: 900;
  font-family: "Font Awesome 5 free";
}
form#mailformpro table.inputform .attention {
  display: block;
  font-size: 80%;
}

/* ---------- label override ---------- */
form#mailformpro label {
  white-space: nowrap;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  display: block;
  box-sizing: border-box;
  margin: 0;
  border: none;
  background-color: #F4F4F4;
  position: relative;
}
form#mailformpro label input[type="radio"],
form#mailformpro label input[type="checkbox"] {
  display: none;
}

form#mailformpro label.mfp_checked {
  padding: 4px 10px 4px 24px;
  box-shadow: none;
  color: #2B2B2B;
  border: none;
  background-color: #FAF6F3;
}
form#mailformpro label.mfp_checked::before {
  content: "\f00c";
  width: 20px;
  height: 20px;
  line-height: 1;
  text-shadow: none;
  color: #2B2B2B;
  background-color: transparent;
  top: 50%;
  left: 7px;
  margin-top: -8px;
  font-size: 18px;
  font-family: "Font Awesome 6 free", "Font Awesome 6 Brands";
  font-weight: 900;
}

form#mailformpro label,
form#mailformpro label.mfp_not_checked {
  padding: 4px 10px 4px 24px;
  background-color: #fff;
  border-radius: 2px;
  border: none;
}
form#mailformpro label::before,
form#mailformpro label.mfp_not_checked::before {
  content: "";
  width: 16px;
  height: 16px;
  background-color: #F4F4F4;
  display: inline-block;
  margin-top: -8px;
  vertical-align: middle;
  position: absolute;
  top: 50%;
  left: 5px;
}

/* ---------- button override ---------- */
.mfp_element_all {
  max-width: none;
}

#mfp_buttons p {
  text-align: center;
  width: auto;
  margin: 0 auto;
  box-shadow: none;
}

#mfp_buttons button#btn_confirm {
  border: none;
  border-radius: 50px;
  background: #616161;
  display: block;
  margin: 0 auto;
  width: 300px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  color: #fff;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  padding: 0;
  overflow: hidden;
  text-shadow: none;
  font-size: 18px;
  font-family: "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
#mfp_buttons button#btn_confirm:hover {
  background-color: #E1A990;
  border: none;
  box-shadow: none;
}

/* ---------- confirm.css override ---------- */
div#mfp_phase_confirm {
  margin: 0;
}

div#mfp_phase_confirm h4 {
  color: #2B2B2B;
  padding: 0;
  text-align: center;
  margin: 50px 0 20px;
  font-size: clamp(16px, 2.3vw, 20px);
  font-family: "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
  font-weight: 500;
}

table#mfp_confirm_table {
  border-bottom: #F4F4F4 1px solid;
  width: 100%;
  margin: 0 auto;
}
table#mfp_confirm_table tr.mfp_colored {
  background-color: transparent !important;
}
table#mfp_confirm_table tr th, table#mfp_confirm_table tr td {
  padding: 20px 0;
  box-sizing: border-box;
  text-align: left;
  border-top: #F4F4F4 1px solid;
}
table#mfp_confirm_table tr th {
  width: 30%;
  white-space: nowrap;
  font-size: 15px;
}
table#mfp_confirm_table tr td {
  font-size: 16px;
  padding-left: 20px;
}

.mfp_buttons {
  margin: 40px auto 0;
  vertical-align: middle;
}

div.mfp_buttons button {
  border: none;
  color: #fff;
  border-radius: 50px;
  cursor: pointer;
  margin: 0 10px;
  padding: 0;
  text-align: center;
  text-shadow: none;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  overflow: hidden;
  vertical-align: middle;
  font-family: "IBM Plex Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
div.mfp_buttons button:hover {
  border: none;
  box-shadow: none;
}
div.mfp_buttons button#mfp_button_send {
  width: 300px;
  height: 60px;
  line-height: 60px;
  background: #616161;
  font-size: 18px;
}
div.mfp_buttons button#mfp_button_send:hover {
  background-color: #E1A990;
}
div.mfp_buttons button#mfp_button_cancel {
  width: 140px;
  height: 40px;
  line-height: 40px;
  background: #AEAAA7;
  color: #fff;
  font-size: 16px;
}
div.mfp_buttons button#mfp_button_cancel:hover {
  background-color: #2B2B2B;
}

/* ------------------------------
 Thanks
------------------------------ */
.thanks .sec_thanks {
  margin-bottom: 60px;
}
.thanks .sec_thanks .thanks_title {
  margin-bottom: 30px;
}
.thanks .sec_thanks .thanks_title .en {
  display: block;
  line-height: 1.2;
  color: #AEAAA7;
  font-size: 16px;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.thanks .sec_thanks .thanks_title .jp {
  display: block;
  font-size: clamp(18px, 3.1vw, 26px);
  font-weight: 500;
}
.thanks .tel_area {
  margin-bottom: 80px;
  background: #fff;
}

/* ------------------------------
 Tel
------------------------------ */
.tel_area {
  padding: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FAF6F3;
}
.tel_area .tel_title .en {
  display: block;
  color: #616161;
  font-size: 16px;
  font-family: "Marcellus", "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.tel_area .tel_title .jp {
  display: block;
  font-size: 18px;
}
.tel_area .tel_info {
  padding-left: 40px;
  margin-left: 40px;
  padding-top: 10px;
  position: relative;
}
.tel_area .tel_info::before {
  content: "";
  width: 1px;
  height: 100px;
  background: #d5d5d5;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.tel_area .tel_info .tel_num {
  font-size: clamp(22px, 3.6vw, 30px);
  font-weight: 500;
}
.tel_area .tel_info .attention {
  font-size: 11px;
}
.tel_area .tel_info .department {
  margin-top: -10px;
  font-size: 14px;
}

#ft_navi_fix {
  position: fixed;
  z-index: 99;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
#ft_navi_fix .navi_list {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#ft_navi_fix .navi_list li {
  line-height: 1;
}
#ft_navi_fix .navi_list li a {
  padding: 30px 15px;
  color: #FFF;
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  white-space: nowrap;
  line-height: 1.4;
  background-color: #444444;
  font-size: 16px;
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#ft_navi_fix .navi_list li a:hover {
  opacity: .85;
}
#ft_navi_fix .navi_list li:first-child a {
  -webkit-border-top-left-radius: 8px;
  border-top-left-radius: 8px;
}
#ft_navi_fix .navi_list li:nth-child(2) a {
  -webkit-border-bottom-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-1 ( 1300px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 1300px) {
  .wrapper {
    margin-left: 50px;
    margin-right: 50px;
  }
  .wrapper.wide {
    margin-left: 0;
    margin-right: 0;
  }
  .wrapper.narrow {
    margin-left: auto;
    margin-right: auto;
  }

  .fat-nav .fat-nav__menu {
    display: block;
  }
  .fat-nav .fat-nav__menu .menu_side {
    width: auto;
    margin: 70px 0 0;
  }
  .fat-nav .fat-nav__menu .menu_side .btn {
    display: flex;
    flex-wrap: wrap;
    margin: -6px;
  }
  .fat-nav .fat-nav__menu .menu_side .btn .btn_item {
    width: 50%;
    padding: 6px;
    box-sizing: border-box;
  }
  .fat-nav .fat-nav__menu .menu_side .btn .btn_item + .btn_item {
    margin: 0;
  }
  .fat-nav .fat-nav__menu .menu_side .btn .btn_item.contact {
    margin-bottom: 0;
  }
  .fat-nav .fat-nav__menu .menu_side .privacy {
    text-align: right;
    margin-top: 40px;
  }
  .fat-nav .fat-nav__menu .menu_side .sns {
    justify-content: flex-end;
  }

  .page_title:has(#mv_bg) {
    padding: 350px 0 80px;
  }

  /* ---------- policy-navi ---------- */
  .list_policy {
    margin-left: -50px;
    margin-right: -50px;
  }

  #concept_navi {
    padding: 90px 0 100px;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-2 ( 959px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 959px) {
  body {
    line-height: 1.8;
    font-size: 14px;
  }

  .wrapper {
    padding-right: 6vw;
    padding-left: 6vw;
    margin-left: 0;
    margin-right: 0;
  }
  .wrapper.wide {
    padding-right: 3vw;
    padding-left: 3vw;
  }
  .wrapper.narrow {
    max-width: initial;
  }

  .pcnone {
    display: block;
  }

  /* ------------------------------
   Header
  ------------------------------ */
  #header .midnightInner {
    padding: 40px 6vw 0;
  }

  .hd_logo {
    width: 160px;
  }

  .global_navi {
    padding-right: 60px;
  }
  .global_navi ul {
    display: none;
  }
  .global_navi .link_contact {
    margin-left: 0;
  }

  #navibutton {
    top: 38px;
    right: 6vw;
  }

  .fat-nav .fat-nav__inner {
    padding: 0 6vw;
    align-content: start;
  }
  .fat-nav .fat-nav__menu {
    padding: 120px 0 200px;
  }
  .fat-nav .fat-nav__menu .menu_main {
    display: block;
  }
  .fat-nav .fat-nav__menu .menu_main .column {
    display: contents;
  }
  .fat-nav .fat-nav__menu .menu_main .column:first-of-type .sec:first-of-type {
    margin-top: 0;
  }
  .fat-nav .fat-nav__menu .menu_main .column .sec {
    margin-top: 60px;
  }
  .fat-nav .fat-nav__menu .menu_main .column .sec + .sec {
    margin-top: 60px;
  }

  /* ------------------------------
   Footer
  ------------------------------ */
  #footer {
    padding: 120px 0;
  }
  #footer .wrapper.wide {
    padding-right: 6vw;
    padding-left: 6vw;
  }
  #footer .ft_link {
    width: 45%;
  }
  #footer .ft_link .ft_link_banner {
    width: 100%;
    /*.link_sdgs {
    	width: calc(65% - 15px);
    	a {
    		padding: 10px;
    		p {
    			font: {
    				size: 12px;
    			}
    		}
    	}
    }
    .link_sod {
    	width: 35%;
    	a {
    		padding: 10px;
    		img {
    			max-width: 86px;
    		}
    	}
    }*/
  }
  #footer .ft_link .ft_link_banner li a {
    border-radius: 3px;
  }
  #footer .ft_link .ft_link_banner .link_contact {
    width: 100%;
  }
  #footer .ft_address {
    width: 50%;
  }
  #footer .ft_address address .text {
    font-size: 12px;
  }
  #footer .ft_sub .ft_textlink a {
    font-size: 12px;
  }
  #footer .ft_sub .copy {
    font-size: 12px;
  }

  /* ------------------------------
    BreadCrumbs
  ------------------------------ */
  #breadcrumbs {
    margin: 40px 0 20px;
  }

  /* ------------------------------
   Contents
  ------------------------------ */
  .page_title:has(#mv_bg) {
    padding: 320px 0 75px;
  }
  .page_title:has(#mv_bg) .title small {
    font-size: 12px;
  }
  .page_title:has(#mv_bg) .title small::before {
    vertical-align: 1px;
    margin: 0 8px 0 0;
  }

  /* ---------- Event ---------- */
  .navi_event ul li {
    min-width: 40%;
    padding-right: 40px;
  }

  .list_event li {
    width: calc(100% / 2);
  }

  /* ---------- policy-navi ---------- */
  .list_policy {
    display: block;
    margin: 0;
  }
  .list_policy li {
    width: auto;
    padding: 40px 0;
    border-top: 1px solid #d5d5d5;
  }
  .list_policy li:not(:nth-child(1), :nth-child(2)) {
    border-top: 1px solid #d5d5d5;
  }
  .list_policy li:nth-child(even) {
    border-left: none;
  }
  .list_policy li:last-child {
    border-bottom: 1px solid #d5d5d5;
  }

  #concept_navi {
    margin-top: 100px;
    padding: 70px 0 90px;
  }

  /* ---------- 商品ラインナップ ---------- */
  .lineup_navi .list_lineup {
    margin: 0 -20px 50px;
  }
  .lineup_navi .list_lineup li {
    padding: 0 20px;
  }
  .lineup_navi .list_lineup li a figure {
    margin-bottom: 20px;
  }
  .lineup_navi .list_lineup li a .text_area {
    padding: 0 10px;
  }
  .lineup_navi .list_lineup li a .text_area .more {
    margin-top: 30px;
  }

  /* ---------- 会社紹介関連 ---------- */
  .company_navi {
    padding: 70px 0 30px;
  }
  .company_navi ul {
    flex-wrap: wrap;
    margin: 0 -2%;
  }
  .company_navi ul li {
    flex: initial;
    width: 50%;
    box-sizing: border-box;
    padding: 0 2% 60px;
  }
  .company_navi ul li + li {
    margin: 0;
  }

  /* ---------- PageNavi ---------- */
  .pagenavi ul li {
    width: 48%;
  }
  .pagenavi ul li a {
    padding: 0 20px;
  }
  .pagenavi ul li a::after {
    font-size: 17px;
  }
  .pagenavi ul li a figure {
    width: 60px;
    height: 60px;
  }

  /* ------------------------------
   Mail-Form
  ------------------------------ */
  .sec_form {
    padding: 60px 0;
  }
  .sec_form .sec_title {
    margin-bottom: 40px;
  }
  .sec_form .inner {
    max-width: initial;
    padding: 0 5vw;
  }

  /* ---------- button override ---------- */
  #mfp_buttons button#btn_confirm {
    width: 260px;
  }

  /* ---------- confirm.css override ---------- */
  table#mfp_confirm_table tr td {
    font-size: 15px;
    padding-left: 20px;
  }

  div.mfp_buttons button#mfp_button_send {
    width: 250px;
  }

  /* ------------------------------
   Tel
  ------------------------------ */
  .tel_area {
    padding: 40px;
  }
  .tel_area .tel_info {
    padding-left: 30px;
    margin-left: 30px;
  }

  #ft_navi_fix {
    height: 60px;
    top: inherit;
    bottom: 0;
    transform: translateY(-50%);
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-border-top-right-radius: 8px;
    border-top-right-radius: 8px;
    -webkit-border-top-left-radius: 8px;
    border-top-left-radius: 8px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    width: 100%;
    max-width: 400px;
  }
  #ft_navi_fix nav {
    flex: 1;
  }
  #ft_navi_fix .navi_list {
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: inherit;
  }
  #ft_navi_fix .navi_list li {
    border-left: #FFF solid 1px;
    width: 50%;
    line-height: inherit;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  #ft_navi_fix .navi_list li:first-child {
    border-left: none;
  }
  #ft_navi_fix .navi_list li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: auto;
    color: #FFF;
    background-color: #444444;
    font-size: 14px;
    line-height: 1;
    padding: 0;
    -webkit-writing-mode: horizontal-tb;
    -moz-writing-mode: horizontal-tb;
    -ms-writing-mode: lr-tb;
    writing-mode: horizontal-tb;
    white-space: normal;
    line-height: 1.6;
    border-radius: 0 !important;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-3 ( 644px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 644px) {
  .wrapper {
    padding-right: 5vw;
    padding-left: 5vw;
  }
  .wrapper.wide {
    padding-right: 3vw;
    padding-left: 3vw;
  }
  .wrapper.narrow {
    padding-right: 5vw;
    padding-left: 5vw;
  }

  .spnone {
    display: none;
  }

  .pctabnone {
    display: block;
  }

  /* ------------------------------
   Header
  ------------------------------ */
  #header .midnightInner {
    padding: 25px 5vw 0;
  }

  .hd_logo {
    width: 130px;
  }

  .global_navi {
    padding-right: 50px;
  }

  #navibutton {
    top: 25px;
  }

  /* ------------------------------
   Fat-Navigation
  ------------------------------ */
  .fat-nav .fat-nav__menu {
    padding: 90px 0 150px;
  }
  .fat-nav .fat-nav__menu .menu_main .column .sec {
    margin-top: 40px;
  }
  .fat-nav .fat-nav__menu .menu_main .column .sec + .sec {
    margin-top: 40px;
  }
  .fat-nav .fat-nav__menu .menu_main .column .sec .sec_title a {
    margin-bottom: 12px;
  }
  .fat-nav .fat-nav__menu .menu_main .column .sec .list_wrap ul + ul {
    margin-top: 15px;
  }
  .fat-nav .fat-nav__menu .menu_main .column .sec .list_level1 > li > a {
    font-size: 14px;
    margin-top: 10px;
  }
  .fat-nav .fat-nav__menu .menu_main .column .sec .list_level2 > li > a {
    font-size: 13px;
  }
  .fat-nav .fat-nav__menu .menu_side .btn {
    display: block;
    margin: 0;
  }
  .fat-nav .fat-nav__menu .menu_side .btn .btn_item {
    padding: 0;
    width: auto;
  }
  .fat-nav .fat-nav__menu .menu_side .btn .btn_item + .btn_item {
    margin-top: 12px;
  }

  /* ------------------------------
   Footer
  ------------------------------ */
  #footer {
    padding: 50px 0 30px;
  }
  #footer .wrapper.wide {
    padding-right: 5vw;
    padding-left: 5vw;
  }
  #footer .ft_main {
    display: block;
  }
  #footer .ft_link {
    width: 100%;
  }
  #footer .ft_link .ft_link_banner {
    margin-bottom: 70px;
  }
  #footer .ft_address {
    width: 100%;
  }
  #footer .ft_address address .ft_logo {
    width: 150px;
    margin-bottom: 30px;
  }
  #footer .ft_address .ft_sns li {
    width: 40px;
    height: 40px;
    margin-right: 10px;
  }
  #footer .ft_address .ft_sns li a {
    font-size: 19px;
  }
  #footer .ft_sub {
    margin-top: 20px;
  }
  #footer .ft_sub .ft_textlink {
    margin-right: 20px;
  }

  /* ------------------------------
   Contents
  ------------------------------ */
  .more {
    width: 110px;
    height: 32px;
  }
  .more .more_inner {
    padding: 0 30px 0 10px;
  }
  .more .more_inner::after {
    width: 14px;
    height: 6px;
    right: 10px;
  }
  .more .more_inner.outsidelink::after {
    width: 11px;
    height: 11px;
    right: 15px;
    font-size: 11px;
  }

  .page_title {
    padding: 110px 0 50px;
  }
  .page_title .title .en {
    line-height: 1.4;
    letter-spacing: .2rem;
  }
  .page_title:has(#mv_bg) {
    padding: 300px 0 40px;
  }
  .page_title:has(#mv_bg) .title small {
    font-size: 11px;
  }
  .page_title:has(#mv_bg) .title small::before {
    margin: 0 7px 0 0;
    width: 6px;
    height: 6px;
  }

  /* ---------- Event ---------- */
  .navi_event {
    margin-bottom: 30px;
  }
  .navi_event ul {
    flex-wrap: wrap;
  }
  .navi_event ul li {
    min-width: 45%;
    padding-right: 20px;
  }
  .navi_event ul li a {
    padding: 5px;
  }
  .navi_event ul li a::after {
    width: 14px;
    height: 6px;
    right: 5px;
  }
  .navi_event ul li a.current::after {
    width: 12px;
    height: 12px;
    right: 5px;
  }

  .list_event {
    margin: 0 0 40px;
  }
  .list_event li {
    width: 100%;
    padding: 0;
    margin-bottom: 60px;
  }
  .list_event li .text_area {
    padding: 0;
  }

  /* ---------- policy-navi ---------- */
  .list_policy li {
    padding: 30px 0;
  }
  .list_policy li a .textarea .title {
    font-size: 17px;
    margin-bottom: 12px;
  }
  .list_policy li a .textarea .text {
    font-size: inherit;
  }

  #concept_navi {
    margin-top: 80px;
    padding: 50px 0 60px;
  }

  /* ---------- 商品ラインナップ ---------- */
  .lineup_navi {
    padding: 50px 0 1px;
  }
  .lineup_navi .list_lineup {
    display: block;
    margin: 0 0 50px;
  }
  .lineup_navi .list_lineup li {
    width: 100%;
    padding: 0;
    margin-bottom: 50px;
  }
  .lineup_navi .list_lineup li a .text_area {
    padding: 0;
  }
  .lineup_navi .list_lineup li a .text_area .sub_title {
    font-size: 14px;
  }
  .lineup_navi .list_lineup li a .text_area .post_title {
    margin-bottom: 5px;
  }
  .lineup_navi .list_lineup li a .text_area .catch {
    margin-bottom: 15px;
  }
  .lineup_navi .list_lineup li a .text_area .more {
    margin-top: 20px;
  }

  /* ---------- 会社紹介関連 ---------- */
  .company_navi {
    margin-top: 40px;
    padding: 40px 0 20px;
  }
  .company_navi ul li {
    padding-bottom: 30px;
  }
  .company_navi ul li .title {
    font-size: 12px;
    letter-spacing: 0.05em;
    margin-top: 8px;
  }

  /* ---------- Next Banner ---------- */
  .nextbnr {
    margin-top: 70px;
  }
  .nextbnr .wrapper {
    padding-left: 0;
    padding-right: 0;
  }
  .nextbnr a {
    height: 280px;
  }
  .nextbnr a .ontext .title .en {
    font-size: 32px;
  }
  .nextbnr a .ontext .title .jp {
    font-size: 11px;
  }
  .nextbnr a .ontext .text {
    font-size: 12px;
    margin-top: 15px;
  }
  .nextbnr a .ontext .more {
    margin-top: 20px;
  }

  /* ---------- Page-Back ---------- */
  .pageback {
    margin: 0 auto 40px;
  }

  .pagenavi ul li {
    width: 100%;
    padding: 5px 0;
  }
  .pagenavi ul li a {
    background: rgba(255, 255, 255, 0.5);
    padding: 10px 15px;
  }
  .pagenavi ul li a figure {
    width: 40px;
    height: 40px;
  }
  .pagenavi ul li a p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .pagenavi ul li.next {
    float: none;
  }
  .pagenavi ul li.next a {
    text-align: left;
    padding-left: 30px;
  }
  .pagenavi ul li.next a::after {
    content: "\f104";
    left: 10px;
  }
  .pagenavi ul li.next a figure {
    margin-right: 10px;
  }
  .pagenavi ul li.prev {
    float: none;
  }
  .pagenavi ul li.prev a {
    justify-content: flex-end;
    /*text-align: right;*/
    padding-right: 30px;
  }
  .pagenavi ul li.prev a::after {
    content: "\f105";
    right: 10px;
  }
  .pagenavi ul li.prev a figure {
    margin-left: 10px;
  }

  /* ------------------------------
   Mail-Form
  ------------------------------ */
  .sec_form {
    padding: 40px 0;
  }
  .sec_form .sec_title {
    margin-bottom: 30px;
  }
  .sec_form .inner {
    padding: 0 6vw;
  }

  form#mailformpro table.inputform {
    margin: 40px 0 30px;
  }
  form#mailformpro table.inputform th, form#mailformpro table.inputform td {
    display: block;
    width: 100%;
  }
  form#mailformpro table.inputform th {
    padding: 15px 0 0;
    font-size: 13px;
    font-weight: 500;
  }
  form#mailformpro table.inputform td {
    border-top: none;
    padding: 7px 0 15px;
  }
  form#mailformpro table.inputform td ul.float li {
    float: none;
    margin: 6px 0 0;
  }

  /* ---------- label override ---------- */
  form#mailformpro label::before, form#mailformpro label.mfp_not_checked::before {
    margin-top: -10px;
  }

  form#mailformpro label.mfp_checked::before {
    margin-top: -9px;
    font-size: 15px;
  }

  /* ---------- button override ---------- */
  #mfp_buttons button#btn_confirm {
    width: 80%;
    height: 50px;
    line-height: 50px;
    background-color: #E1A990;
    font-size: 16px;
  }

  /* ---------- confirm.css override ---------- */
  table#mfp_confirm_table {
    border-bottom: #d5d5d5 1px solid;
    width: 100%;
    margin: 0 auto;
  }
  table#mfp_confirm_table tr th, table#mfp_confirm_table tr td {
    display: block;
    width: 100%;
    border-top: #d5d5d5 1px solid;
  }
  table#mfp_confirm_table tr th {
    padding: 10px 0 0;
    font-size: 12px;
    font-weight: 500;
  }
  table#mfp_confirm_table tr td {
    padding: 7px 0 10px;
    border-top: none;
    font-size: 15px;
  }

  .mfp_buttons {
    margin: 30px auto 0;
  }

  div.mfp_buttons button#mfp_button_send {
    display: block;
    margin: 0 auto;
    width: 80%;
    height: 50px;
    line-height: 50px;
    font-size: 16px;
    background-color: #E1A990;
    margin-bottom: 20px;
  }

  div.mfp_buttons button#mfp_button_cancel {
    display: inline-block;
    margin: 0 auto;
    width: auto;
    height: auto;
    line-height: 1.6;
    font-size: 14px;
    text-decoration: underline;
    background: none;
    color: #2B2B2B;
  }

  /* ------------------------------
   Thanks
  ------------------------------ */
  .thanks .sec_thanks {
    margin-bottom: 40px;
  }
  .thanks .tel_area {
    margin-bottom: 50px;
  }
  .thanks .tel_area .tel_num a {
    background: #FAF6F3;
  }

  /* ------------------------------
   Tel
  ------------------------------ */
  .tel_area {
    display: block;
    padding: 30px;
  }
  .tel_area .tel_title {
    margin-bottom: 10px;
  }
  .tel_area .tel_info {
    text-align: center;
    padding: 0;
    margin-left: 0;
  }
  .tel_area .tel_info::before {
    width: 0;
    height: 0;
    background: none;
  }
  .tel_area .tel_info .tel_num {
    margin-bottom: 7px;
  }
  .tel_area .tel_info a {
    background: #fff;
    display: block;
    border-radius: 50px;
    padding: 7px 0;
  }
  .tel_area .tel_info .attention {
    font-size: 10px;
  }
  .tel_area .tel_info .department {
    margin-top: -5px;
    font-size: 12px;
  }

  #ft_navi_fix {
    max-width: 360px;
    height: 54px;
  }
  #ft_navi_fix .navi_list li a {
    font-size: 11px;
  }
}