/*
Theme Name: クラシキ文華 ver2025
Version: 202509
Author:Seiki Nishijima

  $Id: style.css,v202509 $
*/
/*===========================================================================
-----------------------------------------------------------------------------
  共通カラー・フォント変数　ここから
-----------------------------------------------------------------------------
===========================================================================*/
:root {
  --color-yuba: #f5f5f0;
  --color-goma: #333;
  --color-gobo: #999;
  --color-tofu: #fff;
  --color-kiku: #ffdc40;
  --color-asagi: #b6d9d8;
  --color-renkon: #d9d6d0;
  --color-komnyaku: #575757;
  --color-kabu: #e9545b;
  --radius-box: 8px;
  --radius-more: 1.5em;
  --anime-big: scale(1.1);
  --font-title: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  --blur-filte: blur(8px);
  --blur-mask1: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 24.6%, rgba(0,0,0,1)),
                linear-gradient(to top,   rgba(0,0,0,0) 0%, rgba(0,0,0,1) 24.6%, rgba(0,0,0,1));
  --blur-mask2: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 24.6%, rgba(0,0,0,1)),
                linear-gradient(to top,   rgba(0,0,0,0) 0%, rgba(0,0,0,1)  4.6%, rgba(0,0,0,1) 95.4%, rgba(0,0,0,0) 100%);
  --blur-cmps1: source-in, source-in;
  --blur-cmps2: intersect;
  --line-edge : 1px var(--color-goma);
  --line-edge-sp: 0.65px var(--color-komnyaku);
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  :root {
    --radius-box: 8px;
    --radius-more: 20px;
    --line-edge: 0.65px var(--color-komnyaku);
  }
}

/*------------------------------------
  共通アニメ 設定　ここから
-------------------------------------*/
@keyframes icon-anime {
    0% { transform: scale(1.0);    }
   50% { transform: scale(0.9091); }
  100% { transform: scale(1.1);    }
}

/*===========================================================================
-----------------------------------------------------------------------------
  共通設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
html {
  -webkit-text-size-adjust: none;
  overscroll-behavior: none;
}
body {
  padding: 0 0 0 0;
  margin:0px auto 0px auto;
  text-align:center;
  background: transparent;
  color: var(--color-goma);
  font-size: 16px;
  background: var(--color-yuba);
}
#background {
  padding: 0 0 0 0;
  margin:0px auto 0px auto;
  text-align:center;
  width: 100%;
  position: relative;
  overflow: hidden;
}
/*-----------------------------------*/
#background a {
  text-decoration: none;
  color: var(--color-goma);
}
#background a[href^="tel:"] {
  pointer-events: none;
}
#background a.no-link {
  cursor: default;
  filter: Alpha(opacity=100);
  opacity: 1;
}
#background a.exlink ,
#background em.exlink {
  display: inline-block;
  position: relative;
  padding-right: 1.8em;
}
#background a.exlink:before ,
#background em.exlink:before {
  content: "";
  display: block;
  width: 1.4em;
  height: 1.4em;
  background: url(./images/icon04.svg) no-repeat 50% 50%;
  background-size: contain;
  position: absolute;
  right: 0;
  top: calc(50% - 0.7em);
}
#background img {
  vertical-align: middle;
  box-sizing: border-box;
  width: 100%;
  height: auto;
}
#background .pcNone {
  display: none;
}
#background .pcCenter {
  text-align: center;
}
#background .nbsp {
  display: inline-block;
  padding-left: 0.5em;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background a[href^="tel:"] {
    pointer-events: auto;
  }
  #background .spNone {
    display: none;
  }
  #background .pcNone {
    display: initial;
  }
  #background .pcCenter {
    text-align: left;
  }
}
/*------------------------------------
  共通レイアウト設定　ここから
-------------------------------------*/
#background header ,
#background footer ,
#background article {
  margin: 0 0 0 0;
  text-align: center;
  width: 100%;
  z-index: 50;
}
#background article {
  padding-bottom: 0.1px;
}
#background #contents25-area {
  width: calc(100% - 190px);
  max-width: 1920px;
  margin: 0 95px;
  padding: 0.1px 0;
}
#background section {
  margin:0 auto 0 auto;
  text-align:center;
  width: 100%;
}
#background .naviMask {
  display: none;
}
/** 大きい画面用分岐 **/
@media screen and (min-width: 2100px) {
  #background #contents25-area {
    margin: 0 auto;
  }
}
/** 大きい画面用分岐 **/
@media screen and (max-width: 901px) {
  #background #contents25-area {
    width: calc(96vw - 95px);
    margin: 0 95px 0 auto;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background #contents25-area {
    width: 86vw;
    margin: 0 auto;
    min-height: initial;
    min-height: auto;
  }
}
/*===========================================================================

  共通飾り設定　ここから

===========================================================================*/
/*------------------------------------
  共通 詳細ボタン設定　ここから
-------------------------------------*/
#background .more {
  display: block;
  text-align: center;
}
#background .more a ,
#background .more button ,
#background .more .dummy-button ,
#background .more input[type=submit] {
  display: inline-block;
  box-sizing: border-box;
  min-width: 30%;
  padding: 1em 2em;
  background: var(--color-goma);
  text-align: center;
  border: 1px solid var(--color-goma);
  border-radius: var(--radius-more);
  color: var(--color-tofu);
  font-size: 0.875em;
  font-weight: 700;
  line-height: 1em;
  letter-spacing: 0.2em;
  position: relative;
  z-index: 10;
}
#background .more a:hover ,
#background .more button:hover ,
#background .more .dummy-button:hover ,
#background .more input[type=submit]:hover {
  border-radius: var(--radius-box);
  filter: Alpha(opacity=100);
  opacity: 1;
  background-color: var(--color-yuba);
  color: var(--color-goma);
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}
/*------------------------------------
  共通 戻るボタン設定　ここから
-------------------------------------*/

/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}
/*------------------------------------
  共通 h2見出し設定　ここから
-------------------------------------*/
#background h2.midashi {
  text-align: center;
  font-weight: 900;
  font-size: 1.5em;
  line-height: 1.8em;
}
#background h2.midashi strong {
  display: block;
  text-align: center;
  font-weight: 900;
  font-size: 1.6em;
  font-family: var(--font-title);
  color: var(--color-kiku);
  text-stroke: var(--line-edge);
  -webkit-text-stroke: var(--line-edge);
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}
/*------------------------------------
  共通 h3見出し設定　ここから
-------------------------------------*/
/** 小さい画面用分岐 **/
@media screen and (max-width: 1400px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}

/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}
/*===========================================================================
-----------------------------------------------------------------------------
  共通ヘッダ設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background header {
  position: static;
}
#background header #main-menu {
  width: calc(100% - 190px);
  margin: 0 95px;
  min-height: 96px;
  display: flex;
  position: relative;
}
#background header h1 {
  width: 270px;
  margin: auto auto;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
#background header #main-menu ul {
  display: flex;
}
#background header #main-menu ul.left-menu {
  margin: auto auto auto 0;
  order: 0;
  border-bottom: 2px solid var(--color-goma);
}
#background header ul.right-menu {
  margin: auto 0 auto auto;
  order: 2;
}
/** 小さいサイズ用分岐 **/
@media screen and (max-width: 1190px) {
  #background header #main-menu ul {
    display: none;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background header #main-menu {
    width: 100%;
    margin: 0 auto;
    height: calc(9.459vw + 20px);
    min-height: auto;
    min-height: auto;
  }
  #background header h1 {
    width: 50%;
    max-width: 200px;
    padding: 0.25em 0 0;/*
    width: 36.486%;*/
  }
}
/*------------------------------------
  メニューレイアウト設定　ここから
-------------------------------------*/
#background header ul.left-menu > li {
  margin: auto 0.75em 0;
  padding: 0 0 0.5em;
  line-height: 1em;
  font-weight: 700;
}
#background header ul.left-menu > li:first-of-type {
  margin-left: 0;
  font-size: 1.25em;
  font-weight: 700;
}
#background header ul.left-menu > li:last-of-type {
  margin-right: 0;
}
#background header ul.right-menu > li {
  margin: auto 1.25em 0;
  padding: 0.4em 0 0.5em;
  line-height: 1em;
  font-weight: 700;
  border-bottom: 2px solid var(--color-goma);
}
#background header ul.right-menu > li small {
  font-size: 0.825em;
  display: block;
  width: 100%;
  text-align: center;
  position: absolute;
  top: -1.2em;
  left: 0;
}

/** 小さいサイズ用分岐 **/
@media screen and (max-width: 1190px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}

/*===========================================================================
-----------------------------------------------------------------------------
  展開メニューセット(PC/SP)設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background header #side-menu {
  display: block;
  filter: Alpha(opacity=0);
  opacity: 0;
  width: 80vw;
  max-width: 1280px;
  height: 500vh;
  min-height: 7680px;
  transition: all 0.5s ease;
  position: fixed;
  right: -130vw;
  top: 0;
  z-index: 990;
  padding: 0;
}
#background header #side-menu:before {
  content: "";
  display: block;
  width: 100%;
  height: 500vh;
  min-height: 7680px;
  position: absolute;
  background: var(--color-tofu);
  transition: all 0.5s ease;
  left: 0;
  top: 0;
  z-index: 980;
}
#background header #side-menu.open {
  filter: Alpha(opacity=100);
  opacity: 1;
  right: -1px;
}
#background header #side-menu:after {
  content: "";
  display: block;
  visibility: visible;
  width: 1600vw;
  height: 500vh;
  min-height: 7680px;
  position: fixed;
  right: -1600vw;
  top: 0;
  backdrop-filter: blur(4px);
  filter: Alpha(opacity=0);
  opacity: 0;
  z-index: 900;
}
#background header #side-menu.open:after {
  right: 0;
  filter: Alpha(opacity=100);
  opacity: 1;
}
#background header #side-menu .side-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 62vw;
  max-width: calc(1280px - 10vw);
  height: 100vh;
  padding: 30px 2vw 60px;
  margin: 0 auto;
  overflow-y: scroll;
  position: relative;
  z-index: 990;
}
.admin-bar #background header #side-menu .side-wrapper {
  padding-top: 62px;
}
/** 小さいサイズ用分岐 **/
@media screen and (max-width: 1050px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background header #side-menu .side-wrapper {
    width: 70vw;
    height: 100vh;
    padding: 30px 1em 60px;
    margin: 0 auto;
    overflow-y: scroll;
    position: relative;
    z-index: 990;
  }
}
/*-----------------------------------*/
#background header #side-menu h3 {
  display: block;
  width: 100%;
  margin: auto auto 2em;
}
#background header #side-menu h3 a {
  display: block;
  width: 50%;
  max-width: 240px;
  margin: 0 auto;
}
#background header #side-menu .menu-set {
  display: block;
  width: 100%;
  margin: auto auto 3em;
}
#background header #side-menu .menu-set > ul {
  width: calc(40% - 3em);
  float: left;
}
#background header #side-menu .menu-set > ul.koto-link {
  width: 60%;
  float: right;
  background: var(--color-asagi);
  border-radius: var(--radius-box);
  padding: 0.5em 1em 0.2em;
}
/** 小さいサイズ用分岐 **/
@media screen and (max-width: 980px) {
  #background header #side-menu h3 {
    margin-bottom: 0em;
  }
  #background header #side-menu h3 a {
    width: 70%;
  }
  #background header #side-menu .menu-set {
    display: flex;
    flex-wrap: wrap;
    margin: auto auto 1em;
  }
  #background header #side-menu .menu-set > ul {
    width: 100%;
    margin-bottom: 2em;
    float: none;
  }
  #background header #side-menu .menu-set > ul.koto-link {
    width: calc(100% + 2em);
    margin: 0 -1em 2em;
    float: none;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background header #side-menu .menu-set > ul.koto-link {
    padding: 0.5em 0.5em 0;
  }
}
/*------------------------------------
  メニュー装飾 設定　ここから
-------------------------------------*/
#background header #side-menu .menu-set li a {
  font-family: var(--font-title);
  font-weight: 900;
  position: relative;
  display: block;
  padding-left: 2em;
}
#background header #side-menu .menu-set li {
  padding: 1em 0 1em 0.5em;
  line-height: 1.4em;
}
#background header #side-menu .menu-set > ul > li {
  border-bottom: 1px solid var(--color-renkon);
}
#background header #side-menu .menu-set > ul.main-link ul {
  margin-top: 0.5em;
}
#background header #side-menu .menu-set > ul.main-link ul li {
  padding-top: 0.4em;
  padding-bottom: 0.4em;
}
#background header #side-menu .menu-set > ul.main-link ul a {
  font-weight: 500;
}
#background header #side-menu .menu-set > ul.koto-link > li {
  border-bottom: none;
  padding-left: 0;
}
#background header #side-menu .menu-set > ul.koto-link a.koto {
  display: block;
  width: 80%;
  max-width: 220px;
  margin: 0 auto 1em;
  padding: 0;
}
#background header #side-menu .menu-set > ul.koto-link ul {
  background: var(--color-tofu);
  border-radius: var(--radius-box);
  padding: 0.6em 1.5em;
  display: flex;
  flex-wrap: wrap;
}
#background header #side-menu .menu-set > ul.koto-link ul li {
  width: 50%;
  border-top: 1px dashed var(--color-gobo);
}
#background header #side-menu .menu-set > ul.koto-link ul li:nth-of-type(1) ,
#background header #side-menu .menu-set > ul.koto-link ul li:nth-of-type(2) {
  border-top: none;
}
#background header #side-menu .menu-set > ul.sns-link {
  display: flex;
  margin-top: 2em;
  justify-content: center;
}
#background header #side-menu .menu-set > ul.sns-link > li {
  display: block;
  border-bottom: none;
  padding: 0;
  margin: 0 1em;
}
#background header #side-menu .menu-set > ul.sns-link > li a {
  display: block;
  padding: 0;
  width: 2.4em;
}
/** 小さいサイズ用分岐 **/
@media screen and (max-width: 980px) {
  #background header #side-menu .menu-set > ul.main-link {
    margin-bottom: 1em;
  }
  #background header #side-menu .menu-set > ul.main-link > li {
    border-bottom: none;
  }
  #background header #side-menu .menu-set > ul.main-link  ul {
    display: flex;
  }
  #background header #side-menu .menu-set > ul.main-link ul li {
    width: 33.33%;
  }
  #background header #side-menu .menu-set > ul.sub-link {
    display: flex;
  }
  #background header #side-menu .menu-set > ul.sub-link li {
    width: 50%;
  }
  #background header #side-menu .menu-set > ul.sns-link {
    margin-top: 0;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background header #side-menu .menu-set > ul.main-link {
    margin: 1.75em -1em 1em;
    width: calc(100% + 2em);
  }
  #background header #side-menu .menu-set > ul.main-link > li {
    background: var(--color-kabu);
    padding: 0.75em 0.5em 0.5em;
    border-radius: var(--radius-box);
    text-align: center;
  }
  #background header #side-menu .menu-set > ul.main-link ul {
    background: var(--color-tofu);
    padding: 0.5em 1em;
    border-radius: var(--radius-box);
  }
  #background header #side-menu .menu-set > ul.koto-link > li {
    padding-bottom: 0.5em;
  }
  #background header #side-menu .menu-set > ul.main-link  ul ,
  #background header #side-menu .menu-set > ul.sub-link {
    display: block;
  }
  #background header #side-menu .menu-set > ul.main-link ul li ,
  #background header #side-menu .menu-set > ul.sub-link li ,
  #background header #side-menu .menu-set > ul.koto-link ul li {
    width: 100%;
  }
  #background header #side-menu .menu-set > ul.koto-link ul li:nth-of-type(2) {
    border-top: 1px dashed var(--color-gobo);
  }
}
/*------------------------------------
  カラバリ設定　ここから
-------------------------------------*/
#background header #side-menu .menu-set a.chishiki ,
#background header #side-menu .menu-set a.privacy {
  letter-spacing: 0;
}
#background header #side-menu .menu-set a.special {
  display: inline-block;
  font-size: 1.525em;
  font-weight: 900;
  color: var(--color-kiku);
  text-stroke: var(--line-edge-sp);
  -webkit-text-stroke: var(--line-edge-sp);
}
#background header #side-menu .menu-set a:before {
  content: "";
  display: block;
  width: 1.4em;
  height: 1.4em;
  background: transparent no-repeat 50% 50%;
  background-size: contain;
  position: absolute;
  left: 0;
  top: calc(50% - 0.75em);
}
#background header #side-menu .menu-set a.special:before {
  background-image: url(./images/icon22.svg);
  width: 1.2em; height: 1.2em;
  top: calc(50% - 0.5em);}
#background header #side-menu .menu-set a.sightseeing:before {
  background-image: url(./images/icon11.svg);}
#background header #side-menu .menu-set a.culture:before {
  background-image: url(./images/icon12.svg);}
#background header #side-menu .menu-set a.sport:before {
  background-image: url(./images/icon13.svg);}
#background header #side-menu .menu-set a.work:before {
  background-image: url(./images/icon14.svg);}
#background header #side-menu .menu-set a.join:before {
  background-image: url(./images/icon15.svg);}
#background header #side-menu .menu-set a.life:before {
  background-image: url(./images/icon16.svg);}

#background header #side-menu .menu-set a.info:before {
  background-image: url(./images/icon02.svg);}
#background header #side-menu .menu-set a.chishiki:before {
  background-image: url(./images/icon24.svg);}
#background header #side-menu .menu-set a.access:before {
  background-image: url(./images/icon23.svg);}
#background header #side-menu .menu-set a.privacy:before {
  width: 0.6em;
  height: 0.6em;
  background: var(--color-gobo);
  border-radius: 50%;
  left: 0.4em;
  top: calc(50% - 0.3em);
}
#background header #side-menu .menu-set > ul.main-link ul a:before {
  width: 1em;
  height: 0.2em;
  background: var(--color-gobo);
  border-radius: 0.1em;
  left: 0.1em;
  top: calc(50% - 0.1em);
}
/*------------------------------------
  バナー 設定　ここから
-------------------------------------*/
#background header #side-menu .menu-set + ul {
  display: flex;
  flex-wrap: wrap;
}
#background header #side-menu .menu-set + ul li {
  width: calc(50% - 0.5em);
  margin: 0 auto 1em 0;
  border-radius: calc( var(--radius-box) / 2 );
  overflow: hidden;
}
#background header #side-menu .menu-set + ul li:nth-of-type(2n) {
  margin: 0 0 1em auto;
}
/** 小さいサイズ用分岐 **/
@media screen and (max-width: 1050px) {
  #background header #side-menu .menu-set + ul {
    width: 80%;
    margin: 0 auto;
  }
  #background header #side-menu .menu-set + ul li {
    width: 100%;
    border-radius: var(--radius-box);
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background header #side-menu .menu-set + ul {
    width: calc(100% + 2em);
    margin: 0 -1em;
  }
}
/*===========================================================================

  メニュー挙動 設定　ここから

===========================================================================*/
#background header p.menu {
  display: block;
  padding: 2em;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
  transition: all 0.5s ease;
}
.admin-bar #background header p.menu {
  top: 32px;
}
#background header p.menu:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  backdrop-filter:        var(--blur-filte);
  -webkit-mask-image:     var(--blur-mask1);
  mask-image:             var(--blur-mask1);
  -webkit-mask-composite: var(--blur-cmps1);
          mask-composite: var(--blur-cmps2);
}
#background header p.menu a {
  display: block;
  width: 1.8em;
  height: 1.5em;
  position: relative;
  text-align: center;
  font-weight: 900;
  line-height: 1em;
  letter-spacing: 0;
  z-index: 100;/*
  filter: drop-shadow(0 0 3px var(--color-yuba));*/
}
#background header p.menu em {
  position: static;
  display: block;
  letter-spacing: 0;
  text-indent: -10em;
  overflow: hidden;
}
#background header p.menu a em:before ,
#background header p.menu a:after ,
#background header p.menu a:before {
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: var(--color-goma);
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  transform: rotate(0deg);
  transition: all 0.5s ease;
}
#background header p.menu a:after {
  top: 0;
}
#background header p.menu a:before {
  top: calc(100% - 2px);
}
#background header p.menu.on-footer a em:before ,
#background header p.menu.on-footer a:after ,
#background header p.menu.on-footer a:before {
  background: var(--color-yuba);
}
/** 小さいサイズ用分岐 **/
@media screen and (max-width: 1180px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background header p.menu {
    top: 0;
    right: 0;
    padding: 4vw;
  }
  #background header p.menu a {
    width: 1.5em;
    height: 1.2em;
  }
  .admin-bar #background header p.menu {
    top: 0;
  }
}
/*-----------------------------------*/
#background header p.menu.open a:after ,
#background header p.menu.open a:before {
  top: 10px;
}
#background header p.menu.open a em:before {
  filter: Alpha(opacity=0);
  opacity: 0;}
#background header p.menu.open a:after {
  transform: rotate(45deg);}
#background header p.menu.open a:before {
  transform: rotate(-45deg);}
#background header p.menu.open.on-footer a em:before ,
#background header p.menu.open.on-footer a:after ,
#background header p.menu.open.on-footer a:before {
  background: var(--color-goma);
}
/** 小さいサイズ用分岐 **/
@media screen and (max-width: 1240px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background header p.menu.open a:after ,
  #background header p.menu.open a:before {
    top: 6px;
  }
}
/*===========================================================================

  サイドバー 設定　ここから

===========================================================================*/
#background #main-sode ,
#background #main-sode #side-bar {
  position: static;
}
#background #contents25-wrapper {
  position: relative;
  margin: 0;
  padding: 0 0 0.1px;
}
/*------------------------------------
  キャンペーンバナー 設定　ここから
-------------------------------------*/
#background #main-sode .campaign-area {
  position: absolute;
  top: 0;
  right: 0;
  width: 95px;/*
  min-height: 100vh;
  overflow-y: scroll;*/
  z-index: 70;
  will-change: transform;
}
#background #main-sode .campaign-area:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  backdrop-filter:        var(--blur-filte);
  -webkit-mask-image:     var(--blur-mask2);
  mask-image:             var(--blur-mask2);
  -webkit-mask-composite: var(--blur-cmps1);
          mask-composite: var(--blur-cmps2);
}
#background #main-sode .campaign-area > figure {
  padding: 1.625em 0.625em;
}
#background #main-sode .campaign-area > h2 {
  width: 95px;
  height: auto;
  writing-mode: vertical-rl;
  white-space: nowrap;
  will-change: transform;
}
/** 小さいサイズ用分岐 **/
@media screen and (max-width: 1200px) {
  #background.non-sode-layout #main-sode .campaign-area {
    display: none;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background #main-sode .campaign-area {
    position: static !important;
    width: 86vw;
    margin: 0 auto;
    padding: 0;
    min-height: initial;
    min-height: auto;
    overflow-y: normal;
  }
  #background.non-sode-layout #main-sode .campaign-area {
    display: block;
  }
  #background #main-sode .campaign-area:before {
    display: none;
  }
  #background #main-sode .campaign-area > figure {
    padding: 0;
  }
  #background #main-sode .campaign-area > h2 {
    width: 86vw;
    margin: 0 auto 0.75em;
    padding: 0;
    min-height: initial;
    min-height: auto;
    overflow-y: normal;
    writing-mode: horizontal-tb;
    white-space: normal;
  }
}
/*-----------------------------------*/
#background #main-sode #side-bar .sns-area {
  padding: 24px 10px;
  text-align: center;
}
#background #main-sode #side-bar .sns-area h3 {
  font-size: 0.75em;
  font-weight: 900;
  font-family: var(--font-title);
  letter-spacing: 0.1em;
  text-align: center;
  margin-bottom: 1em;
}
#background #main-sode #side-bar .sns-area ul {
  display: block;
  width: 32px;
  margin: auto;
}
#background #main-sode #side-bar .sns-area ul li {
  width: 100%;
  margin-bottom: 1em;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background #main-sode #side-bar .sns-area {
    display: none;
  }
}
/*===========================================================================

  サイドタイトル・パン屑 設定　ここから

===========================================================================*/
#background #main-sode #side-bar .page-title {
  position: absolute;
  top: 0;
  left: 0;
  width: 95px;
  height: auto;/*
  min-height: 100vh;
  overflow-y: scroll;*/
  padding: 1.625em 0;
  writing-mode: vertical-rl;
  white-space: nowrap;
  z-index: 70;
  will-change: transform;
}
#background #main-sode #side-bar .page-title:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  backdrop-filter:        var(--blur-filte);
  -webkit-mask-image:     var(--blur-mask2);
  mask-image:             var(--blur-mask2);
  -webkit-mask-composite: var(--blur-cmps1);
          mask-composite: var(--blur-cmps2);
  transform: scaleX(-1);
}
#background #main-sode #side-bar h2 ,
#background #main-sode #side-bar .breadcrumbs > ul {
  font-size: 1.1em;
  font-weight: 900;
  font-family: var(--font-title);
  color: var(--color-goma);
  line-height: 95px;
}
#background #main-sode #side-bar h2 > span ,
#background #main-sode #side-bar .breadcrumbs > ul > li {
  display: inline-block;
  position: relative;
  margin-bottom: 1em;
  padding-bottom: 1em;
  font-family: var(--font-title);
  font-weight: 900;
}
#background #main-sode #side-bar h2 > span:before ,
#background #main-sode #side-bar .breadcrumbs span:before ,
#background #main-sode #side-bar .breadcrumbs > ul > li:before {
  content: "";
  display: block;
  width: 1em;
  height: 1px;
  border-radius: 0.5px;
  background: var(--color-goma);
  position: absolute;
  left: calc(50% - 0.5em);
  top: 100%;
}
#background #main-sode #side-bar h2 > span:last-child ,
#background #main-sode #side-bar .breadcrumbs > ul > li:last-child ,
#background #main-sode #side-bar .breadcrumbs > ul > li.my-title:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}
#background #main-sode #side-bar h2.front-title {
  font-size: 2em;
  color: var(--color-tofu);
  text-stroke: var(--line-edge);
  -webkit-text-stroke: var(--line-edge);
}
#background #main-sode #side-bar h2.front-title > span.color {
  margin: 0 auto;
  padding: 0;
  color: var(--color-kiku);
  display: inline-block;
}
#background #main-sode #side-bar h2 > span:last-child:before ,
#background #main-sode #side-bar h2.front-title > span.color:before ,
#background #main-sode #side-bar .breadcrumbs > ul > li:last-child:before ,
#background #main-sode #side-bar .breadcrumbs > ul > li.my-title:last-child:before {
  display: none;
}
/* 縦中横 */
#background #main-sode #side-bar .breadcrumbs > ul > li > span.hori {
  text-combine-upright: all;
}
#background #main-sode #side-bar .breadcrumbs > ul > li > span.hori:before {
  display: none;
}

/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
  #background.non-sode-layout #main-sode #side-bar {
    padding-bottom: 0.1px;
  }
  #background.non-sode-layout #main-sode #side-bar .page-title {
    position: static !important;
    width: calc(96vw - 95px);
    margin: 0 90px 0.75em auto;
    padding: 0;
    min-height: initial;
    min-height: auto;
    overflow-y: normal;
    writing-mode: horizontal-tb;
    white-space: normal;
  }
  #background.non-sode-layout #main-sode #side-bar .page-title:before {
    display: none;
  }
  #background.non-sode-layout #main-sode #side-bar h2 {
    line-height: 1.5em;
    padding-top: 0.2em;
  }
  #background.non-sode-layout #main-sode #side-bar nav.breadcrumbs {
    line-height: 0.75em;
    margin-top: 0.5em;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs > ul {
    display: block;
    width: 100%;
    padding: 0;
    line-height: 1.2em;
  }
  #background.non-sode-layout #main-sode #side-bar h2 > span ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs > ul > li {
    margin: 0 0.8em 0 0;
    padding: 0 1em 0 0;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs > ul > li {
    display: initial;
    font-size: 1em;
    font-weight: 500;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs > ul > li.my-title {
    font-weight: 500;
    margin-right: 0;
    padding-right: 0;
  }
  #background.non-sode-layout #main-sode #side-bar h2 > span:before ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs > ul > li:before {
    width: 1px;
    height: 1em;
    background: var(--color-goma);
    position: absolute;
    left: 100%;
    top: calc(50% - 0.5em);
  }
  #background.non-sode-layout #main-sode #side-bar h2.front-title {
    font-size: 2em;
  }
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 901px) {
  #background #main-sode #side-bar {
    padding-bottom: 0.1px;
  }
  #background #main-sode #side-bar .page-title {
    position: static !important;
    width: calc(96vw - 95px);
    margin: 0 90px 0.75em auto;
    padding: 0;
    min-height: initial;
    min-height: auto;
    overflow-y: normal;
    writing-mode: horizontal-tb;
    white-space: normal;
  }
  #background #main-sode #side-bar .page-title:before {
    display: none;
  }
  #background #main-sode #side-bar h2 {
    line-height: 1.5em;
    padding-top: 0.2em;
  }
  #background #main-sode #side-bar nav.breadcrumbs {
    line-height: 0.75em;
    margin-top: 0.5em;
  }
  #background #main-sode #side-bar .breadcrumbs > ul {
    display: block;
    width: 100%;
    padding: 0;
    line-height: 1.2em;
  }
  #background #main-sode #side-bar h2 > span ,
  #background #main-sode #side-bar .breadcrumbs > ul > li {
    margin: 0 0.8em 0 0;
    padding: 0 1em 0 0;
  }
  #background #main-sode #side-bar .breadcrumbs > ul > li {
    display: initial;
    font-size: 1em;
    font-weight: 500;
  }
  #background #main-sode #side-bar .breadcrumbs > ul > li.my-title {
    font-weight: 500;
    margin-right: 0;
    padding-right: 0;
  }
  #background #main-sode #side-bar h2 > span:before ,
  #background #main-sode #side-bar .breadcrumbs > ul > li:before {
    width: 1px;
    height: 1em;
    background: var(--color-goma);
    position: absolute;
    left: 100%;
    top: calc(50% - 0.5em);
  }
  #background #main-sode #side-bar h2.front-title {
    font-size: 2em;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background #main-sode #side-bar .page-title ,
  #background.non-sode-layout #main-sode #side-bar .page-title {
    width: 86vw;
    margin: 0 auto 0.75em;
  }
  #background #main-sode #side-bar .breadcrumbs > ul > li ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs > ul > li {
    font-size: 0.75em;
  }
  #background #main-sode #side-bar h2.front-title ,
  #background.non-sode-layout #main-sode #side-bar h2.front-title {
    font-size: 1.75em;
    color: var(--color-tofu);
  }
}
/*------------------------------------
  特集用 サブタイトル設定　ここから
-------------------------------------*/
#background #main-sode #side-bar .breadcrumbs {
  width: 100%;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul {
  display: flex;
  width: 100%;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li {
  margin-left: auto;
  margin-right: auto;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li:first-child {
  display: block;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title {
  display: block;
  margin: 0 auto;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title {
  padding-top: 4em;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title:before {
  display: none;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li > span {
  margin: 0 auto 1em;
  padding: 0 0 1em;
  position: relative;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span.sp-mark {
  display: block;
  width: 3.5em;
  height: 3.5em;
  border: 2px solid var(--color-goma);
  border-radius: 50%;
  margin: 0;
  padding: 0.45em 0.2em 0;
  text-align: center;
  font-size: 0.875em;
  line-height: 1.2em;
  letter-spacing: 0;
  writing-mode: horizontal-tb;
  white-space: normal;
  position: absolute;
  left: calc(50% - 1.75em);
  top: 0;
}
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:last-child:before ,
#background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span.sp-mark:before {
  display: none;
}

/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul {
    display: inline;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li:first-child {
    margin-left: 0;
    margin-right: 0.8em;
    order: 0;
    display: initial;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li:before ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li:first-child:before {
    display: block;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title {
    padding: 0;
    display: inline;
    margin: 0;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title:before {
    display: none;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span {
    display: initial;
    margin: auto 0.9em auto 0;
    padding: 0 1em 0 0;
    font-weight: 500;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 1em;
    margin: 0.1em 0 -0.1em;
    background: var(--color-goma);
    position: relative;
    left: 1em;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:before ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span.sp-mark ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span.sp-mark:before ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:last-child:before ,
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:last-child:after {
    display: none;
  }
  #background.non-sode-layout #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:last-child {
    padding-right: 0;
    margin-right: auto;
  }
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 901px) {
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul {
    display: inline;
  }
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li ,
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li:first-child {
    margin-left: 0;
    margin-right: 0.8em;
    order: 0;
    display: initial;
  }
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li:before ,
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li:first-child:before {
    display: block;
  }
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title {
    padding: 0;
    display: inline;
    margin: 0;
  }
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span {
    display: initial;
    margin: auto 0.9em auto 0;
    padding: 0 1em 0 0;
    font-weight: 500;
  }
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 1em;
    margin: 0.1em 0 -0.1em;
    background: var(--color-goma);
    position: relative;
    left: 1em;
  }
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:before ,
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span.sp-mark ,
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span.sp-mark:before ,
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:last-child:before ,
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:last-child:after {
    display: none;
  }
  #background #main-sode #side-bar .breadcrumbs.feature-title > ul li.my-title > span:last-child {
    padding-right: 0;
    margin-right: auto;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}
/*===========================================================================
-----------------------------------------------------------------------------
  イイネボタン設定　ここから
  @デザインのみ(配置は各css)
-----------------------------------------------------------------------------
===========================================================================*/
#background .like-button button {
  outline: none;
  border: 2px solid var(--color-goma);
  border-radius: var(--radius-box);
  background: var(--color-tofu);
  padding: 1.2em 4em 1.2em 2em;
  line-height: 1em;
  font-weight: 700;
}
#background .like-button button:before {
  content: "";
  display: block;
  width: 2.4em;
  height: 2.4em;
  background: url(./images/icon05.svg) no-repeat 50% 50%;
  background-size: contain;
  position: absolute;
  right: 0.75em;
  top: calc(50% - 1.2em);
}
#background .like-button button:hover {
  border-radius: 4px;
  transform: var(--anime-big);
}
#background .like-button button:before {
  content: "";
  display: block;
  width: 2.4em;
  height: 2.4em;
  background: url(./images/icon05.svg) no-repeat 50% 50%;
  background-size: contain;
  position: absolute;
  right: 0.75em;
  top: calc(50% - 1.2em);
}
/** プラグイン用 **/
#background .like-button .wpulike button.wp_ulike_btn.wp_ulike_put_text {
  font-weight: 700 !important;
  font-size: 1em !important;
  color: var(--color-goma) !important;
  font-family: var(--font-title);
}
#background .like-button .wpulike .wp_ulike_is_liked > button.wp_ulike_btn.wp_ulike_put_text {
  color: var(--color-comnyaku) !important;
  background-color: var(--color-yuba) !important;
}
#background .like-button .wp_ulike_is_liked > button:before {
  background-image: url(./images/icon05l.svg);
}
#background #sp25-old-contents .like-button {
  text-align: right;
  margin-top: 0.5em;
  padding: 0 2em 4em;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background .like-button button {
    margin: 0 0 auto auto;
    padding: 1em 2.4em 1em 1em;
    line-height: 0.875em;
  }
  #background .like-button button:before {
    width: 1.8em;
    height: 1.8em;
    right: 0.5em;
    top: calc(50% - 0.9em);
  }
  /** プラグイン用 **/
  #background .like-button .wpulike button.wp_ulike_btn.wp_ulike_put_text {
    font-size: 0.875em !important;
  }
}
/*===========================================================================
-----------------------------------------------------------------------------
  共通フッター設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background footer {
  background: var(--color-goma);
  color: var(--color-tofu);
  padding: 5em 0 2.8em;
}
#background footer a {
  color: var(--color-tofu);
}
#background footer > section {
  width: 86vw;
  max-width: 1110px;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
  @media screen and (max-width: 740px) {
  #background footer {
    padding: 3em 0 2em;
  }
}
/*------------------------------------
  リンク設定　ここから
-------------------------------------*/
#background footer > section.site-link {
  padding-bottom: 2.8em;
  margin-bottom: 6em;
  border-bottom: 1px solid var(--color-komnyaku);
}
#background footer .site-link h3 {
  text-align: center;
  margin-bottom: 1.5em;
  line-height: 1em;
  font-family: var(--font-title);
  font-weight: 900;
}
#background footer .site-link h3:before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: var(--color-komnyaku);
  position: absolute;
  left: 0;
  top: 50%;
}
#background footer .site-link h3 span {
  display: inline-block;
  padding: 0 1em;
  background: var(--color-goma);
  font-size: 1.125em;
  position: relative;
  z-index: 10;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background footer .site-link h3 {
    margin-bottom: 2em;
  }
  #background footer > section.site-link {
    padding-bottom: 2em;
    margin-bottom: 3em;
  }
  #background footer .site-link h3 span {
    font-size: 1em;
  }
}

/*-----------------------------------*/
#background footer .site-link ul.official {
  display: flex;
  margin: 0 auto 2em;
}
#background footer .site-link ul.official > li {
  width: calc(100% / 3);
  border-right: 1px solid var(--color-komnyaku);
  padding: 1em 0;
  text-align: center;
}
#background footer .site-link ul.official > li:last-child {
  border-right: none;
}
#background footer .site-link ul.official > li a {
  display: block;
  width: 80%;
  max-width: 280px;
  margin: auto;
}
#background footer .site-link ul.official > li img {
  border-radius: calc( var(--radius-box) / 2);
  border: 1px solid var(--color-renkon);
  margin-bottom: 0.5em;
}
#background footer .site-link ul.official > li em {
  display: inline-block;
  color: var(--color-tofu);
  font-family: var(--font-title);
  font-weight: 700;
  line-height: 1.4em;
  letter-spacing: 0;
  position: relative;
}
#background footer .site-link ul.official > li em.exlink:before {
  background-image: url(./images/icon04w.svg);
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background footer .site-link ul.official {
    display: block;
    margin-bottom: 0;
  }
  #background footer .site-link ul.official > li {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid var(--color-komnyaku);
    padding: 0;
    margin-bottom: 1.5em;
    padding-bottom: 1em;
  }
  #background footer .site-link ul.official > li:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }
  #background footer .site-link ul.official > li a {
    width: 100%;
    max-width: auto;
    max-width: initial;
    display: flex;
    flex-direction: column;
  }
  #background footer .site-link ul.official > li img {
    width: 70%;
    max-width: 280px;
    margin: 0 auto 0.7em;
  }
  #background footer .site-link ul.official > li em {
    line-height: 1em;
    font-size: 0.875em;
    margin: 0 auto 0.5em;
  }
}
/*-----------------------------------*/
#background footer .site-link ul.sub-link {
  display: flex;
  margin: 0 3%;
}
#background footer .site-link ul.sub-link > li {
  width: calc(25% - 1.2em);
  margin: auto;
}
#background footer .site-link ul.sub-link > li img {
  border: 1px solid var(--color-komnyaku);
  border-radius: calc( var(--radius-box) / 2);
  overflow: hidden;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background footer .site-link ul.sub-link {
    flex-wrap: wrap;
  }
  #background footer .site-link ul.sub-link > li {
    width: calc(50% - 0.5em);
    margin: 0 auto 1em 0;
  }
  #background footer .site-link ul.sub-link > li:nth-of-type(2n) {
    margin-right: 0;
    margin-left: auto;
  }
  #background footer .site-link ul.sub-link > li img {
    border: 1px solid var(--color-komnyaku);
    border-radius: calc( var(--radius-box) / 2);
    overflow: hidden;
  }
}
/*------------------------------------
  アドレス 設定　ここから
-------------------------------------*/
#background footer > section.site-info h3 {
  width: 50%;
  max-width: 320px;
  margin: 0 auto 2em;
}
#background footer .site-info p {
  display: block;
  text-align: center;
  margin-bottom: 5em;
  font-size: 0.875em;
}
#background footer .site-info p strong {
  display: block;
  font-size: 1.125em;
  font-weight: 700;
}
#background footer .site-info p a ,
#background footer .site-info p .address {
  display: inline-block;
  margin-right: 1em;
}
#background footer .site-info .privacy {
  display: block;
  text-align: center;
}
#background footer .site-info address {
  display: block;
  text-align: center;
  font-size: 0.75em;
  font-style: normal;
}

/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background footer .site-info h3 {
    width: 70%;
  }
  #background footer .site-info p {
    margin-bottom: 4em;
    font-size: 0.875em;
  }
  #background footer .site-info p .address {
    display: block;
    margin-right: 0;
  }
}


/*===========================================================================
-----------------------------------------------------------------------------
  ローディング画面 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #nowLoading {
  display: block;
  width: 100vw !important;
  height: 140vh !important;
  position: fixed;
  background: var(--color-yuba) url(./images/logo.svg) no-repeat 50% 50%;
  background-size: 300px auto;
  top: -20vh;
  left: 0;
  z-index: 9999;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
    #background #nowLoading {
      background-size: 50vw auto;
    }
}
/*===========================================================================
-----------------------------------------------------------------------------
  ページネーション 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background .pagination h2 {
  display: none;
}
#background .pagination .nav-links {
  display: flex;
  justify-content: center;
}
#background .pagination .nav-links > .page-numbers {
  display: block;
  width: 2.857em;
  height: 2.857em;
  margin: 0 0.5em;
  text-align: center;
  color: var(--color-goma);
  font-size: 0.875em;
  font-weight: 700;
  line-height: calc(2.857em - 6px);
  border: 2px solid var(--color-goma);
  border-radius: 50%;
  letter-spacing: 0;
}
#background .pagination .nav-links > .page-numbers.dots {
  width: auto;
  border-color: transparent;
  background-color: transparent;
  color: var(--color-gobo);
}
#background .pagination .nav-links > a.page-numbers:hover {
  border-radius: 20%;
  transform: var(--anime-big);
  filter: Alpha(opacity=100);
  opacity: 1;
}
#background .pagination .nav-links > .page-numbers.current {
  background-color: var(--color-goma);
  color: var(--color-tofu);
}
#background .pagination .nav-links > .page-numbers.prev ,
#background .pagination .nav-links > .page-numbers.next {
  display: none;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background .pagination .nav-links > .page-numbers {
    width: 2em;
    height: 2em;
    line-height: calc(2em - 5px);
  }
}

/*===========================================================================
-----------------------------------------------------------------------------
  404ページ 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #blog-area.not-found {
  padding-top: 3.25em;
}
#background #blog-area.not-found h2 {
  font-size: 2em;
  font-weight: 900;
  line-height: 1.6em;
  margin-bottom: 1em;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background #blog-area.not-found {
    padding-top: 1.25em;
  }
  #background #blog-area.not-found h2 {
    font-size: 1.5em;
  }
}
/*===========================================================================
-----------------------------------------------------------------------------
  メンテナンス画面 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background article#maintenance {
  max-width: 86vw;
  margin: 0 auto;
}
#background article#maintenance section {
  max-width: 940px;
  margin: 0 auto;
  padding: 8vw 0 12vw;
}
#background #maintenance h1 {
  width: 40%;
  max-width: 320px;
  margin: 0 auto 2em;
}
#background #maintenance h2 {
  font-family: var(--font-title);
  font-size: 3.9em;
  font-weight: 900;
  line-height: 1.2em;
  margin-bottom: 1em;
}
#background #maintenance h2 small {
  display: block;
}
#background #maintenance p {
  text-align: center;
}

/** 小さい画面用分岐 **/
@media screen and (max-width: 1160px) {
  #background #maintenance h2 {
    font-size: 5.4vw;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background #maintenance h1 {
    width: 60%;
  }
  #background #maintenance h2 {
    font-size: 1.35em;
  }
  #background #maintenance p {
    text-align: left;
  }
}
/*===========================================================================
-----------------------------------------------------------------------------
  旧・コンテンツ用 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #kb25-old-wrapper {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
#background #page-old-contents ,
#background #sp25-old-contents {
  width: 1200px;
  min-width: 1200px;
  margin: 0 auto;
  padding-bottom: 0.1px;
  word-break: break-all;
  transform-origin: top left;
}
#background #page-old-contents > article ,
#background #sp25-old-contents > article {
  width: 1200px;
  padding-bottom: 0.1px;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1370px) {
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
  #background.non-sode-layout #contents25-area {
    width: calc(100% - 3em);
    margin: 0 auto;
  }
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
  #background.non-sode-layout #contents25-area {
    width: calc(100% - 14vw);
  }
  #background #kb25-old-wrapper {
    width: 100%;
    overflow: visible;
  }
  #background #sp25-old-contents ,
  #background #page-old-contents {
    width: 100vw;
    min-width: 100vw;
    margin: 0 -7vw;
  }
  #background #page-old-contents > article ,
  #background #sp25-old-contents > article {
    width: 100%;
  }
  #background #sp25-old-contents .feature20Area .photoSet img {
    height: auto;
  }
}
/*------------------------------------
  旧・特集用公開日データ設定　ここから
-------------------------------------*/
#background #sp25-old-contents #post-date p {
  display: flex;
  width: auto;
}
#background #sp25-old-contents #post-date p em {
  margin: 0 0 0 auto;
  padding: 0.5em 1em;
  border: 2px solid var(--color-goma);
  background: var(--color-goma);
  color: var(--color-tofu);
  font-size: 0.875em;
  font-weight: 700;
  line-height: 1.25em;
}
#background #sp25-old-contents #post-date p span {
  margin: 0;
  padding: 0.5em 1em;
  border: 2px solid var(--color-goma);
  background: var(--color-tofu);
  line-height: 1em;
}

/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}
/*------------------------------------
  基本 設定　ここから
-------------------------------------*/
#background #page-old-contents .clearfix:after,
#background #page-old-contents article:after,
#background #page-old-contents section:after,
#background #page-old-contents aside:after,
#background #page-old-contents dir:after,
#background #page-old-contents div:after,
#background #page-old-contents dl:after,
#background #page-old-contents menu:after,
#background #page-old-contents nav:after,
#background #page-old-contents ol:after,
#background #page-old-contents ul:after,
#background #page-old-contents td:after {
  content:".";display:block;clear:both;height:0;visibility:hidden;overflow:hidden;zoom:1;font-size:0;
}
#background #sp25-old-contents .clearfix:after,
#background #sp25-old-contents article:after,
#background #sp25-old-contents section:after,
#background #sp25-old-contents aside:after,
#background #sp25-old-contents dir:after,
#background #sp25-old-contents div:after,
#background #sp25-old-contents dl:after,
#background #sp25-old-contents menu:after,
#background #sp25-old-contents nav:after,
#background #sp25-old-contents ol:after,
#background #sp25-old-contents ul:after,
#background #sp25-old-contents td:after {
  content:".";display:block;clear:both;height:0;visibility:hidden;overflow:hidden;zoom:1;font-size:0;
}
#background #page-old-contents h1,
#background #page-old-contents h2,
#background #page-old-contents h3,
#background #page-old-contents h4,
#background #page-old-contents hr,
#background #page-old-contents p.more {
  clear:both;
}
#background #sp25-old-contents h1,
#background #sp25-old-contents h2,
#background #sp25-old-contents h3,
#background #sp25-old-contents h4,
#background #sp25-old-contents hr,
#background #sp25-old-contents p.more {
  clear:both;
}

#background #page-old-contents img {
  max-width: 100%;
  width: auto;
  height: auto;
}
#background #page-old-contents .pcBanner ,
#background #sp25-old-contents .pcBanner {
  display: block;
}
#background #page-old-contents .spBanner ,
#background #sp25-old-contents .spBanner {
  display: none;
}
/** スマートフォン用カウンター **/
@media screen and (max-width: 740px) {
  #background #page-old-contents .pcBanner ,
  #background #sp25-old-contents .pcBanner {
    display: none;
  }
  #background #page-old-contents .spBanner ,
  #background #sp25-old-contents .spBanner {
    display: block;
  }
  #background #page-old-contents img {
    max-width: auto;
    width: 100%;
  }
}


/*===========================================================================

  設定　ここから

===========================================================================*/

/*------------------------------------
  設定　ここから
-------------------------------------*/

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

/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}