@charset "utf-8";

/*	Bace
================================*/
body {
 margin: 0;
 font-family: "Rounded Mplus 1c", "メイリオ", "Meiryo", verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
 font-size: 12px;
 line-height: 1.7em;
 -webkit-text-size-adjust: 100%;
 -webkit-appearance: none;
 overflow-x: hidden;
 color: #F2F2F2;
 background: #2b2b2b;
 letter-spacing: 0px;
}

* html body {
 /* for IF6 */
 font-family: 'Rounded Mplus 1c', sans-serif, "ヒラギノ角ゴ Pro W6", "ＭＳ Ｐゴシック", Osaka, sans-serif;
}

a {
 color: inherit;
 text-decoration: none;
}

a:hover {
 /* color: #737373; */
 /* color: #59443C; */
 color: #A6A6A6;
 transition: 0.5s;
}

.fas {
 color: #F2F2F2;
}

/*float-clear
================================*/
.clearfix:after {
 content: "";
 clear: both;
 display: block;
}

/*Type
================================*/
.page-header-inner h1 {
 color: #F2D649;
 font-family: 'Montserrat', sans-serif;
 font-size: 20px;
 font-weight: 500;
 letter-spacing: 2px;
 margin: 0 auto;
 max-width: 50%;
 text-align: center;
}

h1.type-A, h2.type-A, h3.type-A, h4.type-A, h5.type-A, h6.type-A {
 font-family: 'Montserrat', sans-serif;
 font-size: 160%;
 font-weight: 400;
 margin-bottom: 40px;
 letter-spacing: 0px;
}

h1.type-B, h2.type-B, h3.type-B, h4.type-B, h5.type-B, h6.type-B {
 font-family: 'Montserrat', sans-serif;
 font-size: 120%;
 font-weight: 600;
 letter-spacing: 0px;
}

h1.type-C, h2.type-C, h3.type-C, h4.type-C, h5.type-C, h6.type-C {
 font-family: 'Montserrat', sans-serif;
 font-weight: 500;
 letter-spacing: 0px;
}

.title01 {
 font-family: "M PLUS Rounded 1c";
 font-size: 120%;
 font-weight: normal;
 letter-spacing: 0px;
 line-height: 1.0em;
 margin-top: 5px;
 margin-bottom: 5px;
 padding-bottom: 5px;
 /*text-transform: uppercase;*/
 border-left: solid 0px #2b2b2b;
 /*点線*/
 border-right: dashed 0px #2b2b2b;
 /*点線*/
 border-top: dashed 0px #2b2b2b;
 /*点線*/
 border-bottom: solid 1px #A6A6A6;
}

.title-bottom {
 padding-bottom: 15px;
}

.date {
 font-family: 'Montserrat', sans-serif;
 font-size: 100%;
 font-weight: 500;
 letter-spacing: 0em;
 line-height: 1.34;
 margin-bottom: 1.34em;
}

.categories01 {
 font-family: 'Montserrat', sans-serif;
 font-size: 100%;
 font-weight: 600;
 line-height: 1.1em;
 letter-spacing: -0.05em;
}

.categories01 a {
 font-weight: 300;
}

.type-more {
 font-family: 'Montserrat', sans-serif;
 font-weight: 500;
 letter-spacing: -0.05em;
 text-transform: uppercase;
}

h1.type-46 {
 font-family: 'Montserrat', sans-serif;
 font-size: 380%;
 font-weight: 500;
 letter-spacing: -2px;
 line-height: 0.8em;
 margin-bottom: 0px;
 margin-top: 0px;
 padding: 0em;
 -webkit-appearance: none;
}
h1.type-30 {
  font-family: 'Montserrat', sans-serif;
  font-size: 300%;
  font-weight: 700;
  letter-spacing: -2px;
  line-height: 0.8em;
  margin-bottom: 0px;
  margin-top: 0px;
  padding: 0em;
  -webkit-appearance: none;
 }

.foogallery-album-header {
 font-family: 'Montserrat', sans-serif;
 font-size: 100%;
 font-weight: 500;
 letter-spacing: 0px;
}

.foogallery-pile h3 {
 font-family: 'Montserrat', sans-serif;
 font-weight: 500;
}

/*	TopScroll
================================*/
#page-top {
  bottom: 90px;
  font-family: 'Montserrat', sans-serif;
  font-size: 90%;
  font-weight: 700;
  letter-spacing: 0px;
  position: fixed;
  right: 40px;
  color: #666664;
 }
 
/*Mainbg
================================*/
.mainbg {
 /*背景画像表示の設定*/
 align-items: center;
 /*フレックスコンテナのクロス軸の中央に揃える*/
 background-position: center center;
 /*画像背景を上下中央に配置*/
 background-size: cover;
 /*画像をコンテナーいっぱいに大きく拡大縮小*/
 display: flex;
 /*フレックスボックスを利用*/
 justify-content: center;
 /*アイテムを中央に寄せる*/
 width: 100%;
 /*幅100％*/
}
.mainbg img{
  width: 100%;
  /*幅100％*/
 }
.bmainbg::before {
 content: "";
 /*何も表示しない*/
 display: block;
 /*親要素の大きさが継承され１つのブロックとして認識*/
 padding-top: 50%;
 /* 比率を指定 */
}

.mainbg_title {
 /*表示させたい文字の設定*/
 color: #ccc;
 font-family: 'Montserrat', sans-serif;
 font-size: 450%;
 font-weight: 700;
 line-height: 1.0em;
 padding-top: 0px;
 /*何も設定しなければ上下中央*/
 text-align: center;
}

.glitch {
 position: relative;
 width: 100%;
 overflow: hidden;
 animation: glitch_effect 10s infinite;
 
 }
 
 .glitch3 {
  position: relative;
  width: 100%;
  overflow: hidden;
  animation: glitch3_effect 5s infinite;
  }
  
  
  
  @keyframes glitch3_effect {
    10.1% {opacity: 1; filter: invert(70%);}
    10.5% {opacity: 0; filter: invert(0%);}
    10.9% {opacity: 1;opacity: 0; filter: invert(50%);}
    12.1% {opacity: 1;opacity: 0; filter: invert(0%);}
    12.5% {opacity: 0;}
    12.9% {opacity: 1;　
  }  }
  


/*	swiper
================================*/

.container-swiper {
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 20px;
 margin-top: 10px;
 position: relative;
 overflow: hidden;
}

.swiper-slide {
background: #2b2b2b;
}

/*PageHeader
================================*/
.page-header {
 padding-top: 40px;
 padding-bottom: 10px;
 position: static;
}

.page-header .transform {
 left: 0;
 position: fixed;
 top: 0;
 transition: .5s;
 width: 100%;
 z-index: 9998;
}

.page-header-inner {
 margin-bottom: 0px;
 margin-top: 0px;
}

.page-header.hide {
 transform: translatey(-100%);
}

.page-header-inner svg {
 margin-top: 0;
 width: 160px;
}
.st0{fill:#261711;}
.site-logo a:hover path{
 fill: #59443C;
 transition: 0.5s;
}

.page-header-inner img {
 margin-top: 0;
}

.site h1 a {
 color: #59443C000;
 text-decoration: none;
}

.site h1 {
 font-size: 30px;
 margin: 0;
}

.site img {
 border: none;
}

.site-logo {
 float: left;
 margin-top: 10px;
}

.topimg {
 height: auto;
 max-width: 100%;
 vertical-align: bottom;
}

.catch {
 background-color: rgba(255, 255, 255, 0.7);
 font-size: 28px;
 margin: 0;
 padding: 15px;
}

.top {
 position: relative;
}

.catch {
 bottom: 7%;
 left: 3%;
 position: absolute;
}

/*	Container 左右
================================*/
.box5, .container00, .container01, .container02, .container03, .page-header, .footer {
 padding-left: 20px;
 padding-right: 20px;
}

/*	Container 上下
================================*/
.container01 {
 padding-top: 40px;
 padding-bottom: 0px;
}

.container02 {
 padding-top: 80px;
 padding-bottom: 0px;
}

.container03 {
 padding-top: 0px;
 padding-bottom: 0px;
}


.page-header, .footer {
 background: ;
}

.container01-1 {
 /* background: #FFF744; */
}

.container01-2 {
 /* background: #FFFA91; */
}

.container02-1 {
 background: #2CCDFF;
}

.container02-2 {
 background: #23A4CC;
}

.container02-3 {
 background: #78DFFF;
}

.container03-1 {
 background: #FF6922;
}

.container03-2 {
 background: #FF9C6E;
}

/*	Profile
================================*/
.profile table {
 width: 90%;
 border-spacing: 0;
}

.profile table th {
 border-bottom: solid 1px #A6A6A6;
 padding-top: 15px;
 font-weight: normal;
 width: 100px;
}

.profile table td {
 border-bottom: solid 1px #A6A6A6;
 text-align: left;
 padding-top: 15px;
}

.profile p {
 padding-bottom: 15px;
 padding-top: 0px;
}

/*	Single
================================*/
.entry01 img {
 margin-bottom: 0px;
}

.entry01 img {
 height: auto;
 max-width: 100%;
 vertical-align: bottom;
}

/*	PostNavi single.php
================================*/
.postnavi {
 padding-bottom: 20px;
 padding-top: 10px;
}

.postnavi {
 margin: 0;
}

.prev {
 font-family: 'Montserrat', sans-serif;
 font-weight: 500;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: -10px;
}

.prev a {
 font-weight: normal;
 line-height: 25px;
 margin-bottom: 7px;
}

.prev a:hover {
 color: #a9b879;
}

.next {
 font-family: 'Montserrat', sans-serif;
 font-weight: 500;
 margin-left: auto;
 margin-right: auto;
}

.next a {
 font-weight: normal;
 line-height: 25px;
 margin-bottom: 7px;
}

.next a:hover {
 color: #a9b879;
}

.categories {
 font-family: 'Montserrat', sans-serif;
 font-size: 110%;
 font-weight: 700;
 margin-top: 0px;
}

.recentcategories {
 font-family: 'Montserrat', sans-serif;
 padding-bottom: 0px;
 padding-top: 10px;
}

/*  Post List02  
================================*/
.postlist02 {
 font-family: "M PLUS Rounded 1c";
 /* background: #FCFCFC; */
 border-top: dashed 0px #292F33;
 /*点線*/
 border-bottom: dashed 0px #292F33;
 /*点線*/
 word-wrap: break-word;
 max-width: 100%;
 border-radius: 0px;
 margin-top: 10px;
 margin-bottom: 15px;
 padding-left: 0px;
 padding-right: 0px;
 padding-top: 10px;
 padding-bottom: 0spx;
 /* sp用 ※4 */
}

.postlist02 a {
 text-decoration: none;
}

/* .postlist02-title {
   display: block;
   } */
.postlist02-thumbnail {
 font-size: 18px;
 float: left;
 padding-top: 0px;
 padding-bottom: 0px;
 padding-left: 0px;
 padding-right: 10px;
 border-radius: 0%;
 overflow: hidden;
}

.postlist02-thumbnail img {
 width: 80px;
 height: 60px;
 object-fit: cover;
 margin-right: .4rem;
 border: solid 1px #a6a;
 border-radius: 0px;
 display: block;
 padding: 0;
 -webkit-transition: 0.3s ease-in-out;
 -moz-transition: 0.3s ease-in-out;
 -o-transition: 0.3s ease-in-out;
 transition: 0.3s ease-in-out;
}

.postlist02-thumbnail img {
 margin-bottom: initial;
 margin: 0px;
 padding: 0px;
 border: 0px;
 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
 /*画像をモノクロに*/
 filter: grayscale(95%);
 /*画像をモノクロに*/
 -webkit-filter: grayscale(95%);
 /*画像をモノクロに*/
}

.postlist02-thumbnail img:hover {
 filter: none;
 /*画像をカラーに*/
 transition: 1.5s;
 -webkit-filter: grayscale(0%);
 /*画像をカラーに*/
}

.postlist02-content {
 line-height: 120%;
}

.postlist02-title {
 font-size: 100%;
 line-height: 1.5em;
}

.postlist02-excerpt {
 color: #333;
 line-height: 1.5em;
}

.postlist02 .clear {
 clear: both;
}

.postlist02-site {
 color: #b2b2b2;
 font-size: 11px;
 padding-left: 5px;
}

.postlist02-view {
 color: #FCFCFC;
 background-color: black;
 font-size: 80%;
 width: 50px;
 text-align: center;
}

#FCFCFC .sga-ranking {
 padding: 0;
 margin-top: 20px;
}

.sga-ranking ol {
 counter-reset: num;
 list-style-type: none !important;
 padding: 0;
 margin: 0;
}

.sga-ranking ol li {
 position: relative;
 padding-left: 30px;
 line-height: 1em;
 padding: 0.5em 0.5em 0.5em 25px;
}

.sga-ranking ol li:before {
 content: "";
 position: absolute;
 counter-increment: num;
 content: counter(num);
 display: inline-block;
 background: #2b2b2b;
 color: #FCFCFC;
 font-family: 'Montserrat', sans-serif;
 font-weight: 700;
 font-weight: bold;
 font-size: 100%;
 border-radius: 50%;
 left: 0;
 width: 20px;
 height: 20px;
 line-height: 20px;
 text-align: center;
 top: 2px;
}

.sga-rankingdate {
 padding-left: 25px;
 font-family: 'Montserrat', sans-serif;
 font-size: 18px;
 font-weight: 600;
 letter-spacing: 0px;
 margin-bottom: 4px;
}

/* PLUGIN WP-Page Navi　角丸
*=============================== */
.navigation {
 clear: both;
 font-size: 80%;
 line-height: 20px;
 padding: 15px 0;
}

.wp-pagenavi {
 clear: both;
 font-size: 80%;
 font-family: 'Montserrat', sans-serif;
}

.wp-pagenavi a, .wp-pagenavi span {
 /*全体の指定*/
 color: #2b2b2b;
 background-color: #F2F2F2;
 border: solid 1px #59443C;
 /*ボーダ色*/
 padding: 5px 5px;
 margin: 0 2px;
 white-space: nowrap;
 -moz-border-radius: 3px;
 -webkit-border-radius: 3px;
 border-radius: 3px;
 -webkit-transition: 0.2s ease-in-out;
 -moz-transition: 0.2s ease-in-out;
 -o-transition: 0.2s ease-in-out;
 transition: 0.2s ease-in-out;
 text-align: center;
 text-decoration: none;
}

.wp-pagenavi a:hover {
 /*マウスオン時の指定*/
 color: #F2F2F2;
 background-color: #59443C;
 /*背景色*/
 border: solid 1px #59443C;
 /*ボーダ色*/
}

.wp-pagenavi span.current {
 /*現在ページの指定*/
 color: #F2F2F2;
 background-color: #59443C;
 /*背景色*/
 border: solid 1px #59443C;
 /*ボーダ色*/
 font-weight: 700;
}

/*	Sidemenu
================================*/
.sidemenu {
 padding-bottom: 5px;
 padding-top: 15px;
}

.sidemenu p {
 padding-bottom: 0px;
 padding-top: 0px;
}

.sidemenu a {
 font-family: 'Montserrat', sans-serif;
 font-size: 100%;
 font-weight: 500;
}

.post_date {
 font-family: 'Montserrat', sans-serif;
 font-size: 100%;
 font-weight: 500;
 letter-spacing: 0em;
}

.recentcategories {
 padding-bottom: 10px;
}

.recentcategories ul {
 list-style: none;
}

.recentcategories li {
 padding-left: 15px;
 line-height: 1.6em;
 background: url(../img/link-solid.svg) left 0px top 3px no-repeat;
 background-size: 12px auto;
}

.recentcategories img {
 fill: #0060e6;
}

/*	Privacy
================================*/
.privacy p {
 padding-bottom: 15px;
 padding-top: 15px;
}

.privacy a {
 font-family: 'Montserrat', sans-serif;
 font-size: 100%;
 font-weight: 500;
}

/*	Pages
================================*/
.pages p {
 padding-bottom: 15px;
 padding-top: 15px;
}

.pages a {
 font-family: 'Montserrat', sans-serif;
 font-size: 100%;
 font-weight: 500;
}

/*	Footer
================================*/
.footer {
 padding-bottom: 50px;
 padding-top: 50px;
}

.footer-inner {
 margin: auto;
 padding-bottom: 60px;
 padding-top: 0px;
}

/*  Copyright */
.copyright {
 float: left;
 font-family: 'Montserrat', sans-serif;
 font-size: 100%;
 font-weight: 500;
 letter-spacing: 0px;
 line-height: 1.2em;
 padding-top: 0px;
 text-transform: uppercase;
}

/* .copyright a:hover {
 color: #bdc3c7;
} */

/*  Search
 ================================*/
.searchform {
 float: left;
 margin-top: 10px;
 margin-bottom: 0px;
}

.search_container {
 box-sizing: border-box;
}

.search_container input[type="text"] {
 border: none;
 width: 100px;
 border-bottom: 1px solid #A6A6A6;
 padding: 0px 0px;
 background: #2b2b2b;
 overflow: hidden;
}

.search_container input[type="text"]:focus {
 outline: 0;
 background: #2b2b2b;
}

.search_container input[type="submit"] {
 cursor: pointer;
 font-family: FontAwesome;
 font-size: 1.2m;
 border: none;
 background: none;
 color: #f2f2f2;
 ;
 outline: none;
 display: inline-block;
 vertical-align: middle;
}

.searchform2 {
 visibility: hidden;
}

/*	ContactForm7-2
================================*/
.wpcf7 {
 width: 450px;
}

/* .form-width { max-width: 100%;} */
.wpcf7 form input[type="text"],
.wpcf7 form textarea {
 width: 450px;
 /* background-color: #ffcfba; */
 border: none;
 border-bottom: 0px solid #A6A6A6;
 padding: 0px 0px;
}

.wpcf7 form p {
 text-transform: uppercase;
 border-bottom: 1px solid #A6A6A6;
 padding-bottom: 0;
}

.wpcf7 {
 font-size: 100%;
 font-weight: 600;
 font-family: 'Montserrat', sans-serif;
}

.wpcf7 form textarea {
 height: 100px;
 line-height: 180%;
}

.wpcf7 form input[type="submit"] {
 background: #F2F2F2;
 border: none;
 color: #261711;
 cursor: pointer;
 font-size: 14px;
 font-weight: 700;
 height: 40px;
 letter-spacing: -1px;
 margin-top: 20px;
 -moz-transition: background-color 0.2s linear;
 -o-transition: background-color 0.2s linear;
 -webkit-transition: background-color 0.2s linear;
}

.wpcf7 form input[type="submit"]:hover {
 color: #bdc3c7;
}

.wpcf7 form input[type="email"] {
 border: none;
 font-size: 100%;
 padding: 0px 0px;
 vertical-align: text-bottom;
 width: 450px;
}

.wpcf7 .noline {
 border-bottom: 0px solid #A6A6A6;
}

.wpcf7-response-output {
 width: 400px;
 font-weight: normal;
 background: #fff;
 border-radius: 15px;
 border: 0px;
 line-height: 25px;
 text-align: center;
}

span.wpcf7-not-valid-tip {
 color: #f00;
 font-size: 1em;
 font-weight: normal;
 display: block;
 position: absolute;
 top: 0;
 width: 450px;
 text-align: right;
}

.div .wpcf7-mail-sent-ok {
 border: 0px solid #398f14;
}

@media (max-width: 767px) {
 span.wpcf7-not-valid-tip {
  width: 100%;
 }

 .wpcf7-response-output {
  width: 85%;
 }

 .form-width {
  max-width: 100%;
 }

 .wpcf7 {
  width: 100%;
 }
}

/*GoogleMap
================================*/
.ggmap {
 height: 0;
 overflow: hidden;
 /*はみ出た部分を隠せ*/
 padding-bottom: 50%;
 /*表示させる高さの比率を設定*/
 position: relative;
 /*相対位置指定*/
}

.ggmap iframe {
 position: absolute;
 /*絶対位置*/
 left: 0;
 top: 0;
 height: 100%;
 width: 90%;
}

/*===============================
	Less than 767
================================*/
@media (max-width: 767px) {

 /*　画面サイズが767px以下の場合ここの記述が適用　*/

 .container01 {
  padding-top: 37px;
  padding-bottom: 0px;
 }

 /*Mainbg
================================*/
 .mainbg {
  height: 300px;
 }

 .glitch6 {
  position: relative;
width: 100%;
overflow: hidden;
animation: glitch6_effect 7s infinite;
animation-timing-function:steps(5, end);
}
@keyframes glitch6_effect {
20.0% {transform: translate(-2px, 0px);}
80% {transform: translate(2px, 0px);filter:grayscale(80%);}
}

 /*	navigation
================================*/
 .page-nav {
  /* background-color: #DCE4F2; */
  height: 10px;
  width: 100%;
 }

 a#menu {
  display: inline-block;
  height: 30px;
  margin-top: 40px;
  margin-bottom: 20px;
  margin-right: 20px;
  margin-left: 20px;
  position: relative;
  width: 40px;
 }

 #menubtn {
  background: #f2f2f2;
  display: block;
  height: 2px;
  left: 50%;
  margin: -1px 0 0 -7px;
  position: absolute;
  top: 20%;
  transition: .2s;
  width: 18px;
 }

 #menubtn:before, #menubtn:after {
  background: #f2f2f2;
  content: "";
  display: block;
  height: 2px;
  left: 0;
  position: absolute;
  top: 50%;
  transition: .3s;
  width: 18px;
 }

 #menubtn:before {
  margin-top: -7px;
 }

 #menubtn:after {
  margin-top: 5px;
 }

 a#menu .close {
  background: transparent;
 }

 a#menu .close:before, a#menu .close:after {
  margin-top: 0;
 }

 a#menu .close:before {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
 }

 a#menu .close:after {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
 }

 .panel {
  display: none;
  left: 0;
  overflow: hidden;
  position: relative;
  top: 0px;
  width: 100%;
  z-index: 100;
 }

 #mainnav {
  margin-top: 0px;
  position: absolute;
  right: 0;
  text-align: right;
  top: 0;
  width: 100%;
  z-index: 500;
 }

 #mainnav ul {
  background: #f0f0eecb;
  border-bottom: 1px solid #ccc;
  text-align: left;
 }

 #mainnav li a {
  border-bottom: 1px solid #eee;
  display: block;
  font-weight: 600;
  padding: 15px 50px;
  position: relative;
 }

 #mainnav li a:before {
  border-right: solid 2px #59443C;
  border-top: solid 2px #59443C;
  content: "";
  display: block;
  height: 6px;
  left: 5px;
  margin: -4px 0 0 25px;
  position: absolute;
  top: 50%;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 6px;
 }

}

/*===============================
	Over 768px
================================*/
@media (min-width: 768px) {

 /*　画面サイズが768px以上960px以下の場合ここの記述が適用　*/
 .container01:after {
  clear: both;
  content: "";
  display: block;
 }

 .container01-1 {
  box-sizing: border-box;
  float: left;
  padding-right: 20px;
  width: 75%;
 }

 .container01-2 {
  box-sizing: border-box;
  float: left;
  padding-left: 100px;
  width: 25%;
 }

 .container02-1 {
  box-sizing: border-box;
  float: left;
  width: 35%;
 }

 .container02-2 {
  box-sizing: border-box;
  float: left;
  width: 35%;
 }

 .container02-3 {
  box-sizing: border-box;
  float: left;
  width: 30%;
 }

 .container03-1 {
  box-sizing: border-box;
  float: left;
  width: 50%;
 }

 .container03-2 {
  box-sizing: border-box;
  width: 50%;
  float: left;
 }

 .page-header-inner {
  width: 100%;
 }


 /*	navigation
================================*/
 .page-header-inner {
  width: 100%;
 }

 a#menu {
  display: none;
 }

 .panel {
  display: block !important;
 }

 #mainnav {
  float: right;
  font-size: 100%;
  letter-spacing: 0;
  margin-top: -25px;
  text-transform: uppercase;
 }

 #mainnav ul {
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-align: right;
 }

 #mainnav li {
  display: inline;
  display: inline-block;
  display: -moz-inline-box;
  zoom: 1;
 }

 #mainnav a {
  display: inline-block;
  padding-bottom: 0;
  padding-left: 1.36em;
  padding-right: 0;
  padding-top: 0;
  position: relative;
  transition: .3s;
 }

 /* #mainnav a::after {
  background-color: #59443C;
  bottom: 0.2em;
  content: '';
  height: 1px;
  left: 1.3em;
  position: absolute;
  transition: .3s;
  width: 0;
 }

 #mainnav a:hover::after {
  width: 80%;
 } */

 /* #mainnav a:hover {
  color: #59443C;
 } */

 /* #mainnav a:hover {
  background-position: 0 100%;
  color: #fff;
 }

 #mainnav.changenav {
  background: rgba(255, 255, 255, 1);
  border-bottom: 1px solid #d1d1d1;
 } */

 #mainnav.changenav li {
  padding: 20px 10px;
 }

 .page-nav {
  border-bottom: solid 0px #292F33;
  border-top: 0px solid #476834;
  height: 40px;
  width: 100%;
 }

 .page-nav .transform {
  background: rgba(255, 255, 255, .8);
 }


}

/*===============================
	Over 960px
================================*/
@media (min-width: 960px) {

 /*　画面サイズが960px以上の場合ここの記述が適用　*/

 /*  Container
================================*/
 .container00, .container01, .container02, .container03, .page-header, .footer {
  margin-left: auto;
  margin-right: auto;
  width: 960px;
 }
}