.main {
  height: 100%;
  width: 100% !important;
  max-width: 100%;
  padding:0!important;
  border: 0;
}

.footer {
  margin-top: 0;
  padding: 0;
}
.content {
    margin-top: 0;
}

#admin-panel{
  display: none;
}

.article-header,.grecaptcha-badge{
  display: none;
}

/* ムービーとフッターの区切り線（黒帯の中央に細い線） */
.movie-foot-divider{
  width: 100%;
  background: #000;
  line-height: 0;
  padding: 0;
}
.movie-foot-divider span{
  display: block;
  max-width: 1100px;
  width: 88%;
  height: 1px;
  margin: 0 auto;
  background: rgba(255,255,255,0.22);
}



@media screen and (min-width:750px) {

body {
font-family: serif,"游明朝","yu mincho","游明朝体","yumincho","ヒラギノ明朝 pro w3","hiragino mincho pro","hiraminpron-w3","hgs明朝e","ＭＳ Ｐ明朝","ms pmincho";
width:100%;
padding:0; margin:0;
background-color: transparent;
z-index:0;
overflow-x: hidden;
}

p{ color:#000; line-height:1.8em; font-size:16px; margin:13px 0px; letter-spacing: 1.2px; font-family: serif,"游明朝","yu mincho","游明朝体","yumincho","ヒラギノ明朝 pro w3","hiragino mincho pro","hiraminpron-w3","hgs明朝e","ＭＳ Ｐ明朝","ms pmincho";}

img{width:100%;}

a{transition: 0.2s;}
a:hover{opacity: 0.8;}

.relative{position:relative;}

button {
  border: none;
  background: none;
  outline:none;
}

p a {text-decoration: none; color:#fff;
transition: 0.3s ;
}
p a:hover{opacity:0.8;}

.sp-none { display: block; }
.pc-none { display: none; }

/*fade*/
.fadeInUp {
  opacity : 0;
  transition: 4s;
}

.fadeIn-left {
  opacity : 0;
  transform: translateX(-30px);
  transition: 2s;
}

.fadeIn-right {
  opacity : 0;
  transform: translateY(-30px);
  transition: 2s;
}

ul {
  list-style: none;
  margin:0;
  padding:0;
}

table{
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

/*パディングとボーダーを幅と高さに含める*/
* {
   box-sizing: border-box;
}


.wrap {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}
.content-n {max-width:1100px; width:90%; margin:0 auto;}
.content-100{width:100%; margin:0 auto;}
.relative{position: relative;}

.clear{clear:both;}



/*ヘッダーデザイン*/
.header-logo{width:140px; padding-top: 2px;
margin-right: 18px;}

.fixed-bg {
  width: 800px;
  position:fixed;
  top:0;
  left:0;
  z-index:-100;
}
header {
   padding: 3px 1.5% 4px;
   position: relative;
   top: 0;
   width: 100%;
   background-color: transparent;
   display: flex;
   align-items: center;
}
/* PCヘッダー：スクロールすると上部に固定（overflow-x:hidden の影響を避けるため fixed 方式） */
.pc-header-wrap.is-stuck header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   background-color: rgba(255, 255, 255, 0.97);
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
   z-index: 9999;
   padding-top: 4px;
   padding-bottom: 6px;
   animation: pcHeaderSlideDown .35s ease;
}
@keyframes pcHeaderSlideDown {
   from { transform: translateY(-100%); }
   to   { transform: translateY(0); }
}
h1 {
   margin: 0; padding: 0;
   font-size: 20px;
}
a {
   text-decoration: none;
   color: #fff;
}
nav {
   margin: 0 0 0 auto;
}
ul {
  display:flex;
  list-style: none;
  margin: 0;
}
.ul-header{
  display: flex;
  list-style: none;
  margin: 0;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;   /* ナビ・SNS・ボタンを縦中央で揃える */
}
li {
   font-size: 14px;
}

.pc-nav li a{ color:#000;}


.pc-nav li {
	display:inline;
	list-style-type:none;
	border-left:0;
  font-size: 14px;
  font-weight:bold;
  float: left;
  padding: 0;
  margin: 8px 10px;
}
/* ヘッダーのSNSアイコン（オンラインストアの左に横並び） */
.pc-nav li.header-sms-li {
  display: flex;
  align-items: center;
  gap: 14px;
  float: none;
  margin: 8px 12px 8px 8px;
}
.pc-nav li.header-sms-li .header-sms {
  float: none;
  margin: 0;
  width: 20px;
  line-height: 0;
}
.pc-nav li.sampleFooterHome {
	border-left:0;
	padding-left:0;
}

/* CONTACT ボタン（ヘッダー：白背景・黒枠・黒文字の四角い上品ボタン） */
.pc-nav li.li-contact,
#navArea li.li-contact {
  border-left: 0;
  padding-left: 0;
  margin: 3px 8px;
}
.header-contact-btn {
  position: relative;
  display: inline-block;
  width: 150px;
  box-sizing: border-box;
  border: 1px solid #000;
  background: #fff;
  color: #000 !important;
  padding: 10px 8px;
  font-size: 13px;
  letter-spacing: .08em;
  text-align: center;
  text-transform: uppercase;
  line-height: 1;
  text-decoration: none;
  transition: background-color .25s ease, color .25s ease;
}
/* 四隅の「」風コーナー装飾（4つ角を囲うフレーム） */
.header-contact-btn::before {
  content: "";
  position: absolute;
  inset: -4px;
  pointer-events: none;
  background:
    linear-gradient(#000,#000) 0 0 / 9px 1px no-repeat,
    linear-gradient(#000,#000) 0 0 / 1px 9px no-repeat,
    linear-gradient(#000,#000) 100% 0 / 9px 1px no-repeat,
    linear-gradient(#000,#000) 100% 0 / 1px 9px no-repeat,
    linear-gradient(#000,#000) 0 100% / 9px 1px no-repeat,
    linear-gradient(#000,#000) 0 100% / 1px 9px no-repeat,
    linear-gradient(#000,#000) 100% 100% / 9px 1px no-repeat,
    linear-gradient(#000,#000) 100% 100% / 1px 9px no-repeat;
}
.header-contact-btn:hover {
  background: #000;
  color: #fff !important;
}

/* フッター最下部バー（左：コピーライト / 右：ユーティリティリンク） */
.footer-bottom-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 4px;
  max-width: 1100px;
  margin: 48px auto 0;
  padding: 12px 24px 0;
  box-sizing: border-box;
}
.footer-bottom-bar .footer-copy-txt {
  margin: 0;
  text-align: left;
}
.footer-nav {
  line-height: 1.9;
}
.footer-nav a {
  color: #bbb;
  font-size: 12px;
  text-decoration: none;
  padding: 0 12px;
  letter-spacing: .04em;
  border-left: 1px solid #555;
  display: inline-block;
}
.footer-nav a:first-child {
  border-left: 0;
}
.footer-nav a:hover {
  color: #fff;
  text-decoration: underline;
}
@media screen and (max-width:749px) {
  .footer-bottom-bar {
    flex-direction: column;
    padding: 12px 16px 0;
  }
  .footer-bottom-bar .footer-copy-txt {
    text-align: center;
  }
  .footer-nav { display: none; }   /* スマホでは利用規約・プライバシー・サイトマップを非表示 */
}

/* 利用規約・サイトマップページ内のリンク */
.sitemap-links a {
  color: #333;
  text-decoration: underline;
}
.sitemap-links a:hover {
  color: #b00;
}

/* フッター上部：右揃えで「ロゴ（右端）→縦書きメニュー（右から順）」 */
footer.back-black {
  position: relative;
}
.footer-top {
  display: flex;
  justify-content: space-between;   /* SNS(左)・メニュー(中)・ロゴ(右)を均等配置 */
  align-items: center;
  gap: 40px;
  padding: 64px 5% 44px;
  box-sizing: border-box;
}
/* SNSアイコン：フッター左端に縦並び */
.footer-sns-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  flex-shrink: 0;
}
.footer-sns-col .header-sms {
  float: none;
  margin: 0;
  width: 24px;
}
.footer-menu {
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
  gap: 30px;
}
.footer-menu a {
  writing-mode: vertical-rl;
  color: #cfcfcf;
  text-decoration: none;
  font-size: 14px;
  letter-spacing: .15em;
  transition: color .2s ease;
}
.footer-menu a:hover {
  color: #fff;
}
/* 各カテゴリ配下のサブ項目（カテゴリ内とわかるよう1文字分下げ・小さめ・淡色） */
.footer-menu a.footer-submenu {
  margin-top: 1.3em;   /* 一文字分下げてサブ項目だと示す */
  font-size: 12px;
  color: #9a9a9a;
  letter-spacing: .12em;
}
.footer-menu a.footer-submenu:hover {
  color: #fff;
}
/* 中間幅のPCでもはみ出さないよう、メニュー間隔を詰める */
@media screen and (min-width:750px) and (max-width:1279px) {
  .footer-top { gap: 32px; padding: 56px 4% 40px; }
  .footer-menu { gap: 13px; }
}
@media screen and (max-width:749px) {
  .footer-menu {
    display: none;
  }
}

/* フッター上部：ロゴ＋SNSは右端に縦積み（ロゴが上・SNSが下） */
.footer-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  flex-shrink: 0;
}
.footer-brand .footer-logo {
  width: 140px;
  margin: 0;
}
@media screen and (max-width:749px) {
  .footer-top {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
    padding: 48px 6% 36px;
  }
  .footer-sns-col {
    order: 1;             /* スマホではロゴの上に */
    margin-right: 0;
    flex-direction: row;  /* 横並び */
    justify-content: center;
    gap: 18px;
  }
  .footer-brand { order: 2; }   /* ロゴはSNSの下・中央 */
  .footer-brand .footer-logo {
    width: 32vw;
    max-width: 140px;
  }
}

/* ヒーロー下の「お知らせ」一列バー */
.news-bar-wrap {
  border-bottom: 1px solid #333;
  background: #000;
  position: relative;
}
/* PCではヒーロー画像下部の透明帯(約4.4%)ぶん上に詰める */
@media screen and (min-width:750px) {
  .news-bar-wrap {
    margin-top: -3.5%;
  }
}
.news-bar {
  display: flex;
  align-items: center;
  gap: 20px;
  max-width: 1040px;
  margin: 0 auto;
  padding: 16px 24px;
  font-size: 14px;
}
.news-bar-main {
  display: flex;
  align-items: center;
  gap: 20px;
  flex: 1;
  min-width: 0;
  color: #fff;
  text-decoration: none;
}
.news-bar-label {
  flex-shrink: 0;
  border: 1px solid #fff;
  color: #fff;
  padding: 3px 16px;
  font-size: 12px;
  letter-spacing: .12em;
}
.news-bar-date {
  flex-shrink: 0;
  color: #aaa;
  font-size: 13px;
  letter-spacing: .04em;
}
.news-bar-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.news-bar-main:hover .news-bar-text {
  text-decoration: underline;
}
.news-bar-btn {
  flex-shrink: 0;
  border: 1px solid #fff;
  padding: 7px 18px;
  font-size: 11px;
  letter-spacing: .12em;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .2s ease, color .2s ease;
}
.news-bar-btn:hover {
  background: #fff;
  color: #000;
}
@media screen and (max-width:749px) {
  .news-bar {
    flex-wrap: wrap;
    gap: 12px 14px;
    padding: 14px 16px;
  }
  .news-bar-main {
    flex-basis: 100%;
    flex-wrap: wrap;
    gap: 8px 14px;
  }
  .news-bar-text {
    flex-basis: 100%;
    white-space: normal;
  }
}

/* お知らせページ（/news/）の記事 */
.news-list {
  max-width: 760px;
  margin: 0 auto;
}
.news-item {
  margin: 0 auto;
  padding: 8px 8px 40px;
}
.news-item + .news-item {
  border-top: 1px solid #e0e0e0;
  padding-top: 40px;
}
.news-item-head {
  text-align: center;
  padding-bottom: 22px;
  margin-bottom: 26px;
  border-bottom: 1px solid #e0e0e0;
}
.news-item-date {
  display: block;
  color: #999;
  font-size: 14px;
  letter-spacing: .08em;
  margin-bottom: 10px;
}
.news-item-title {
  font-size: 21px;
  font-weight: normal;
  line-height: 1.6;
  margin: 0;
}
.news-item-body p {
  line-height: 2;
  margin: 1.2em 0;
  font-size: 15px;
}
.news-item-body .news-emph {
  font-size: 19px;
  text-align: center;
  letter-spacing: .08em;
  margin: 1.4em 0;
}
.news-divider {
  border: 0;
  border-top: 1px solid #ddd;
  width: 120px;
  margin: 2.4em auto;
}
.news-pillars {
  list-style: none;
  padding: 0;
  margin: 1.4em 0;
  text-align: center;
}
.news-pillars li {
  padding: 6px 0;
  font-size: 16px;
  letter-spacing: .04em;
}
@media screen and (max-width:749px) {
  .news-item-title {
    font-size: 19px;
  }
  .news-item-body p {
    font-size: 14px;
  }
}

/* お知らせ一覧（/news/）のリンク行 */
.news-index-item {
  display: flex;
  align-items: baseline;
  gap: 24px;
  padding: 22px 8px;
  border-bottom: 1px solid #e0e0e0;
  text-decoration: none;
  color: #000;
  transition: background-color .2s ease;
}
.news-index-item:first-child {
  border-top: 1px solid #e0e0e0;
}
.news-index-item:hover {
  background: #faf9f7;
}
.news-index-date {
  flex-shrink: 0;
  width: 100px;
  color: #999;
  font-size: 14px;
  letter-spacing: .04em;
}
.news-index-title {
  flex: 1;
  line-height: 1.7;
}
.news-index-item:hover .news-index-title {
  text-decoration: underline;
}
.news-index-arrow {
  flex-shrink: 0;
  color: #bbb;
}
/* 記事下「一覧へ戻る」 */
.news-back {
  margin-top: 34px;
  text-align: center;
}
.news-back a {
  display: inline-block;
  color: #555;
  text-decoration: none;
  font-size: 14px;
  letter-spacing: .04em;
  border: 1px solid #ccc;
  padding: 10px 26px;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.news-back a:hover {
  background: #000;
  color: #fff;
  border-color: #000;
}
@media screen and (max-width:749px) {
  .news-index-item {
    flex-wrap: wrap;
    gap: 4px 16px;
  }
  .news-index-date {
    width: auto;
  }
  .news-index-title {
    flex-basis: 100%;
  }
  .news-index-arrow {
    display: none;
  }
}

.header-sms{ width:20px; margin:20px 15px 0px 15px; float:right;}


/*footer*/
.back-black{background-color: #000; padding:80px 0px 3px;}
.shop-box{background-color: #000; width:100%; padding: 130px 0;  margin:0px auto;}
.shop-txt-box{width:80px; margin:0 auto;}
.shop-title{color:#fff; font-weight: bold; font-size:28px; margin:0; letter-spacing: 12px;}
.shop-txt{color:#fff; font-size:14px; margin:0;}

.footer-logo{width:140px; margin:0 auto;}
.footer-sms-box{text-align: center; margin:60px auto 20px;}
.footer-copy{width:40em; margin:0 auto; text-align: center;}
.footer-copy-txt{font-size: 12px; color:#fff;}
.center{text-align: center;}



.top-title{width:100%; text-align: center; margin:30px 0;}
.top-title-h{font-size: 70px; letter-spacing: 5px;
   line-height: 80px; margin:0 0 0 5px;}
.top-title-s{font-size: 19px; letter-spacing: 2px; color:#828282;
margin:5px 0 70px;}

#page_top{
  width: 54px;
  height: 54px;
  position: fixed;
  right: 28px;
  bottom: 28px;
  background: #aa1d1a;
  border-radius: 50%;
  opacity: 1;
  z-index: 99;
  box-shadow: 0 6px 18px rgba(0,0,0,0.28);
  transition: transform .28s ease, box-shadow .28s ease, background-color .28s ease;
}
#page_top:hover{
  transform: translateY(-5px);
  background: #8f1815;
  box-shadow: 0 12px 28px rgba(0,0,0,0.4);
}
#page_top a{
  position: relative;
  display: block;
  width: 54px;
  height: 54px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

.pc-br::before {
	content: "\A" ;
	white-space: pre ;
}

.gt_float_switcher {
  position: fixed;
  bottom: 0;
  left: 0;
  margin: 0;
  z-index: 9999999999;
}



}/*end*/














@media screen and (max-width:750px) {

  body {
font-family: serif,"游明朝","yu mincho","游明朝体","yumincho","ヒラギノ明朝 pro w3","hiragino mincho pro","hiraminpron-w3","hgs明朝e","ＭＳ Ｐ明朝","ms pmincho";
  width:100%;
  padding:0; margin:0;
  background-image: url(../img/site-back.jpg);
  background-size: auto;
  background-repeat: round;
  z-index:0;
  }

  p{ color:#fff; font-size:3.3vw; margin:13px 0px; letter-spacing: .1em; font-family: serif,"游明朝","yu mincho","游明朝体","yumincho","ヒラギノ明朝 pro w3","hiragino mincho pro","hiraminpron-w3","hgs明朝e","ＭＳ Ｐ明朝","ms pmincho";}

  img{width:100%;}
  .relative{position:relative;}

  button {
    border: none;
    background: none;
    outline:none;
  }

  a {text-decoration: none; color:#fff;
  transition: 0.3s ;
  }
  a:hover{opacity:0.8;}

  .sp-none { display: none; }
  .pc-none { display: block; }

  /*fade*/
  .fadeInUp {
    opacity : 0;
    transition: 4s;
  }

  .fadeIn-left {
    opacity : 0;
    transform: translateX(-30px);
    transition: 2s;
  }

  ul {
    list-style: none;
    margin:0;
    padding:0;
  }
  li{ display: inline-block; vertical-align:top;}

  table{
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
  }

  /*パディングとボーダーを幅と高さに含める*/
  * {
     box-sizing: border-box;
  }


  .content-n {width:90%; margin:0 auto;}
  .content-100{width:100%; margin:0 auto;}
  .relative{position: relative;}

  .clear{clear:both;}

  .header-sms{ width:20px; margin:20px 15px 0px 15px; float:right;}

  .sp-br::before {
  	content: "\A" ;
  	white-space: pre ;
  }




/*============
ハンバーガーメニュー
=============*/
.header-white{width:100%;
height:80px; position:relative;}
.header-img{width:135px; position:absolute; top:12px; right:10px;}

#navArea{
  z-index: 999;
  position: relative;
}

nav {
  display: block;
  position: fixed;
  top: 0;
  left: -350px;
  bottom: 0;
  width: 350px;
  background: #ffffff;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transition: all .5s;
  z-index: 3;
  opacity: 0;
}
.open nav {
  left: 0;
  opacity: 1;
}
nav .inner {
  padding: 25px;
}
nav .inner ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
nav .inner ul li {
  position: relative;
  margin: 0;
  border-bottom: 1px solid #333;
  display: list-item;  /* 縦に並べる */
list-style-type: none;
text-transform: uppercase;
}
nav .inner ul li a {
  display: block;
  color: #333;
  font-size: 3vw;
  padding: 0.9em 2em;
  text-decoration: none;
  transition-duration: 0.2s;
}
nav .inner ul li a:hover {
  background: #e4e4e4;
}
@media screen and (max-width: 767px) {
  nav {
    left: -70%;
    width: 70%;
  }
}
/*============
.toggle_btn
=============*/
.toggle_btn {
  display: block;
  position: fixed;
  top: 30px;
  left: 30px;
  width: 30px;
  height: 30px;
  transition: all .5s;
  cursor: pointer;
  z-index: 99;
}
.open .toggle_btn {
  left: 83%;
}
.toggle_btn span {
  display: block;
  position: absolute;
  left: 0;
  width: 30px;
  height: 2px;
  background-color: #333;
  border-radius: 4px;
  transition: all .5s;
}
.toggle_btn span:nth-child(1) {
  top: 4px;
}
.toggle_btn span:nth-child(2) {
  top: 14px;
}
.toggle_btn span:nth-child(3) {
  bottom: 4px;
}
.open .toggle_btn span {
  background-color: #fff;
}
.open .toggle_btn {
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}
.open .toggle_btn span:nth-child(1), .open .toggle_btn span:nth-child(3) {
  width: 16px;
}
.open .toggle_btn span:nth-child(1) {
  -webkit-transform: translate(-1px,4px) rotate(-45deg);
  transform: translate(-1px,4px) rotate(-45deg);
}
.open .toggle_btn span:nth-child(3) {
  -webkit-transform: translate(-1px,-4px) rotate(45deg);
  transform: translate(-1px,-4px) rotate(45deg);
}
@media screen and (max-width: 767px) {
  .open .toggle_btn {
    left: 85%;
  }
}
/*============
#mask
=============*/
#mask {
  display: none;
  transition: all .5s;
}
.open #mask {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: .8;
  z-index: 2;
  cursor: pointer;
}

.fixed-bg {
  width: 80%;
  position:fixed;
  top:0;
  left:0;
  z-index:-100;
}

/*footer*/

.footer-logo{width:25%; margin:0 auto;}
.footer-sms-box{text-align: center; margin:60px auto 20px;}
.footer-copy{width:100%; margin:0 auto; text-align: center;}
.footer-copy-txt{font-size: 2.5vw; color:#fff; letter-spacing: 0.1em}
.center{text-align: center;}



.top-title{width:100%; text-align: center; margin:50px 0 0;}
.top-title-h{font-size: 10vw; letter-spacing: 5px;
   line-height: 1em; margin:0 0 0 5px;}
.top-title-s{font-size: 3vw; letter-spacing: 2px; color:#828282;
margin:5px 0 20px;}



#page_top{
  width: 46px;
  height: 46px;
  position: fixed;
  right: 16px;
  bottom: 16px;
  background: #aa1d1a;
  border-radius: 50%;
  opacity: 1;
  z-index: 99;
  box-shadow: 0 5px 14px rgba(0,0,0,0.3);
}
#page_top a{
  position: relative;
  display: block;
  width: 46px;
  height: 46px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 20px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

.back-black{background-color: #000; padding:20% 0px .5em;}
.shop-box{background-color: #000; width:90%; padding: 20% 0;  margin:0px auto;}
.shop-txt-box{width:90%; margin:0 auto; text-align: center;}
.shop-title{color:#fff; font-weight: bold; font-size:10vw; margin:0; letter-spacing: 0.3em;}
.shop-txt{font-size: 4vw;
  color: #fff;
  letter-spacing: 0.1em;
  margin: 0px auto;
  width: 100%;}

.gt_float_switcher {
    position: fixed;
    right: 0;
    top:0;
    z-index: 9999999999;
}

}/*end*/

















.fadeIn {
  opacity: 0;
  transition: 3s;
}
.fadeIn.is-show {
  opacity: 1;
}


.fadeIn_left {
  opacity: 0;
  transform: translate(-50%, 0);
  transition: 2s;
}
.fadeIn_left.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

.fadeIn_right {
  opacity: 0;
  transform: translate(50%, 0);
  transition: 2s;
}
.fadeIn_right.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

/* ============================================================
   スマホ用フッター（PCの min-width:750px ブロック外＝トップレベルに
   配置して確実に適用。SNSをロゴ上・中央／メニュー・利用規約等は非表示）
   ============================================================ */
@media screen and (max-width:749px){
  .footer-top{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:20px;
    padding:44px 6% 32px;
    box-sizing:border-box;
  }
  .footer-sns-col{
    order:2;                 /* SNSをロゴの下に */
    margin-right:0;
    display:flex;
    flex-direction:row;      /* 横並び */
    justify-content:center;  /* 中央 */
    gap:18px;
  }
  .footer-sns-col .header-sms{ float:none; margin:0; width:26px; }
  .footer-brand{
    order:1;                 /* ロゴはSNSの上・中央 */
    display:flex;
    flex-direction:column;
    align-items:center;
  }
  .footer-brand .footer-logo{ width:34vw; max-width:150px; margin:0; }
  .footer-menu{ display:none; }   /* 縦書きメニューは非表示 */
  .footer-nav{ display:none; }    /* 利用規約・プライバシー・サイトマップは非表示 */
  .footer-bottom-bar{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    padding:14px 16px 4px;
  }
  .footer-bottom-bar .footer-copy-txt{ text-align:center; margin:0; }
}

/* ============================================================
   ハンバーガーメニュー修正：開いた時に確実にスライドイン＆クリック可能に
   （既存の nav / .open nav がメディアクエリ競合で効かない問題への対処）
   ============================================================ */
@media screen and (max-width:767px){
  #navArea nav{ left:-70%; }
  body.open #navArea nav{ left:0 !important; opacity:1 !important; }
}
#navArea nav{ z-index:1002; }        /* mask より確実に上でクリック可能 */
.open #mask{ z-index:1001; }

/* ============================================================
   お知らせ一覧（/news/）スマホ用：min-width:750px ブロックに
   ネストされ効かない問題の対策としてトップレベルに配置
   ============================================================ */
@media screen and (max-width:749px){
  .news-list{
    max-width:760px;
    margin:0 auto;
    padding:0 5%;
    box-sizing:border-box;
  }
  .news-index-item{
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:4px 14px;
    padding:20px 4px;
    border-bottom:1px solid #e0e0e0;
    text-decoration:none;
    color:#000;
  }
  .news-index-item:first-child{ border-top:1px solid #e0e0e0; }
  .news-index-date{ flex-shrink:0; width:auto; color:#999; font-size:13px; letter-spacing:.04em; }
  .news-index-title{ flex:1 1 100%; line-height:1.7; font-size:15px; }
  .news-index-arrow{ display:none; }
}