/* **************/
.subtitle {
    font-size: 3.2rem;
    font-family: "Bodoni Std", Georgia, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
}
.subtitle1 {
    font-size: 1.1rem;
font-family:blairitcstd;
font-weight: 600;
 font-style:normal;
 font-stretch:normal;
 line-height:1.29;
 letter-spacing:3.5px;
 text-align:center;
 color:#4d4d4d;
margin: 0px 0px 30px;
padding: 0px 0px 10px;
text-transform: uppercase;
border-bottom: 1px solid #cccccc;
}
.subtitle2 {
    font-size: 1.9rem;
font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
font-weight: lighter;
 font-style:normal;
 font-stretch:normal;
 line-height:1.29;
 letter-spacing:3.5px;
 text-align:left;
 color:#4d4d4d;
margin: 0px 0px 0px;
padding: 50px 0px;
text-transform: uppercase;
}
.subtitle3 {
    font-size:18px;
font-weight: lighter;
 font-style:normal;
 font-stretch:normal;
 line-height:1.29;
 letter-spacing:3.5px;
 text-align:left;
 color:#4d4d4d;
margin: 0px 0px 0px;
padding: 30px 0px 0px;
text-transform: uppercase;
}
.product-item {
font-size: 0.8rem;
color: #B19458;
letter-spacing: .15em;
display: block;
padding: 5px 0 5px;
}
.product-item1 {
font-size: 0.9rem;
letter-spacing: .15em;
display: block;
padding: 5px 0 5px;
color: #B19458;
}
.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}
div.cover {
   display: table;table-layout: fixed; 
     margin: 0px 0px 0px 0px;
   padding: 0px;
   width: 100%;font-size:16px;
border-collapse: separate;border-spacing: 20px 20px;
}
div.cover div.box1 {
   display: table-cell;vertical-align: middle; padding: 30px 0px 30px;
   width: 33.3333333%; border: 1px solid #cccccc;
}
div.cover div.box1:hover {
    border-color:#404040;
  }
div.cover div.box2 {
   display: table-cell;vertical-align: middle; padding: 30px 0px 30px;
   width: 33.3333333%; border: 1px solid #cccccc;
}


div.cover div.box2:hover {
    border-color:#404040;border-left: 1px solid #404040;
  }
div.cover div.box3 {
   display: table-cell;vertical-align: middle; padding: 30px 0px 30px;
border: 1px solid #cccccc;}


div.cover div.box3:hover {
    border-color:#404040;border-left: 1px solid #404040;
  }

div.cover div.box1:empty {
border: 0px none;
}

div.cover div.box2:empty {
border: 0px none;
}

div.cover div.box3:empty {
border: 0px none;
}

@media screen and (max-width: 1050px) {
   div.cover {
      display: block; margin: 0px 0px px 0px;
   }
   div.cover div.box1 {
      display: block;
      width: 100%;vertical-align: top; margin:0px 0px 0px; padding: 10px 0px 20px;
   }
   div.cover div.box2 {
      display: block;
      width: 100%;vertical-align: top; margin:0px 0px 0px; padding: 10px 0px 20px;
   }
   div.cover div.box3 {
      display: block;
      width: 100%;vertical-align: top; margin:0px 0px 0px; padding: 10px 0px 20px;
   }
}

.img-box {
  position: relative;
}
.img-box .active {
  position: absolute;
  width: auto;
height: auto;
max-width: 96%;
max-height:96%;
left: 50%;
top: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
  opacity: 0;
  transition: 1.8s; // ゆっくり
}
.img-box:hover .active {
  opacity: 1;
}
a {
  color: #504E56;
}
#imagesarea li{
    width: auto;
    height: auto;
letter-spacing:0px;
line-height:105%;
    display: block;
    float: left;
    overflow: hidden;
text-align:center;
font-size:10px;
color:#666666;
}
#imagesarea li a img{
-moz-opacity:1;
opacity:1;
filter: alpha(opacity=100);
}
#imagesarea li a:hover img {
-moz-opacity:0.5;
opacity:0.5;
filter: alpha(opacity=50);
} 

#headermenue_deu  { background:transparent; position:relative; top:0px;  width:100%;font-family: Arial, Verdana, Arial, Helvetica, sans-serif;font-size:85.00%;color:#3E3D40;line-height:1.5em;text-align: center;}
#headermenue_engl  { background:transparent; position:relative; top:0px; width:100%;font-family: Arial, Verdana, Arial, Helvetica, sans-serif;font-size:85.00%;color:#3E3D40;line-height:1.5em;text-align: center;}
#headermenue_deu a { color:#3E3D40; background:transparent; text-decoration:none; font-weight:normal; width:100px; margin-right:14px; border-bottom: solid 1px #9C9E9F; display:inline-block; }
#headermenue_deu a:visited  { color:#3E3D40;}
  /* (en) maximum constrast for tab focus - change with great care */
  /* (en) Maximaler Kontrast fur Tab Focus - Andern Sie diese Regel mit Bedacht */
  #headermenue_deu a:focus { color:#003a77; text-decoration:none; outline: 0 none;font-weight:normal; }
  #headermenue_deu a:hover,
  #headermenue_deu a:active { color:#003a77; text-decoration:none; outline: 0 none;font-weight:normal; }
  
  #headermenue_engl a { color:#9EA0A8; background:transparent; text-decoration:none; font-style:italic; font-weight:normal; width:100px; margin-right:14px; display:inline-block; }
  #headermenue_engl a:visited  { color:#9EA0A8; font-style:italic;}

  /* (en) maximum constrast for tab focus - change with great care */
  /* (en) Maximaler Kontrast fur Tab Focus - Andern Sie diese Regel mit Bedacht */
  #headermenue_engl a:focus { color:#003a77; text-decoration:none; outline: 0 none;font-weight:normal; font-style:italic;}
  #headermenue_engl a:hover,
  #headermenue_engl a:active { color:#003a77; text-decoration:none; outline: 0 none;font-weight:normal;font-style:italic; }

img {
    image-rendering: -webkit-optimize-contrast;
}
.site-header{
    display: flex;
    justify-content: space-between;
    position: fixed;
    top: 0;
    transition: .5s;
    width: 100%;
z-index: 3;
}
.site-header.hide{
transform: translateY(-100%);
}

.category_list_wrap {
  width: 100%;
  max-width: 1680px;
  margin: 0 auto 110px;background: #ffffff;
}
.category_list_wrap h2 {
  text-align: center;
  padding: 20px 0;
}
.category_list_wrap h2 span {
  color: #B19458;
}
.category_list_wrap ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;list-style: none;
padding:30px 30px 0px;
}
.category_list_wrap ul li {
  width: 30.1%;
  text-align: center;
  margin: 0 0 30px;
background: #ffffff;
}
.category_list_wrap ul li > a {
  display: block;
}
.category_list_wrap ul li .title {
  margin: 15px 0 0;
  font-size: 1.1rem;
  letter-spacing: .03em;
}
.category_list_wrap ul li .title a {
  transition: opacity .4s ease 0s;
}
.category_list_wrap ul li .title a span {
  font-size: 0.8rem;
  color: #B19458;
  letter-spacing: .15em;
  display: block;
  padding: 5px 0 5px;
}
.category_list_wrap ul li .title a:hover {
  opacity: .6;
}

.font_serif {
    font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
}

@media screen and (max-width: 735px) {
  /* h2 */
  h2 {
    font-size: 3.5rem;
  }
  h2 span {
    margin: 7px 0 0;
    font-size: 1rem;
  }
 .category_list_wrap {
    background: #ffffff;
    margin: 0;
    padding: 0 5px 44px;
    box-sizing: border-box;
  }
.category_list_wrap ul {
list-style: none;
padding:20px 10px 0px;
  }
.category_list_wrap ul li {
    width: 48%;
    margin: 0 0 20px;
  }
.category_list_wrap ul li .title {
    margin: 8px 0 0;
    font-size: 1.1rem;
  }
.category_list_wrap ul li .title a span {
    font-size: .95rem;
  }
 }

.font_serif {
    font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
}

@media screen and (max-width: 735px) {
  /* h2 */
  h2 {
    font-size: 3.5rem;
  }
  h2 span {
    margin: 7px 0 0;
    font-size: 1rem;
  }
 }

div.topicpathlink {
padding-left:20px;
font-family: orpheuspro,"Times New Roman","Yu Gothic","游ゴシック",YuGothic,"游ゴシック体","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,serif;
font-size: 12px;
font-weight: 500;
list-style-type: none;
display: inline;
float:left;
text-align:center;
clear:right;
}

div.topicpathlink a{
text-decoration: none;
color:#003557;
}

div.topicpathlink a:hover{
text-decoration: none;
color:#6f808b;
}

div.topicdate{
float:right;font-size:10px;clear:right;
padding:0px 0px 10px;
}

.nav-toggle-btn_label {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: 3px;
  font-size: 10px;
  transition: all 500ms ease-in-out;
}
.nav-toggle-btn_label.active{
display:none;
}
.nav-open .nav-toggle-btn_label {
  opacity: 0;
}


html {
  font-size: 62.5%;
  font-size: 0.625vw;
  font-size: 16px;
}

@media (max-width: 1024px) {/* iPad Pro*/
  html {
    font-size: 1.5625vw;
  }
}
@media (max-width: 768px) {/* iPad */
  html {
    font-size: 2.0833333333333335vw;
  }
}
@media (max-width: 414px) {/* iPhone11,8Plus */
  html {
    font-size: 3.864734299516908vw;
  }
}
@media (max-width: 375px) {/* iPhone8 */
  html {
    font-size: 4.266666666666667vw;
  }
}

body {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
    text-rendering: auto;
    font-size: 1rem; /* 16px */
    line-height: 1.75;
}

h1 {
  font-size: 2rem;
}
h2 {
  font-size: 1.8rem;
}
h3 {
  font-size: 1.4rem;
}
h4 {
  font-size: 1.2rem;
}
h5 {
  font-size: 1.2rem;
}

.ghost-button-thick-border2 {
  position: relative;
  display: inline-block;
 width: 120px;
  font-size: 14px;font-weight: bold; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; margin: 2px 2px 2px;
padding: 8px;
  color: #000000;
  border: 1px solid #fff;
  text-align: center;
  outline: none;
  text-decoration: none;
}
.ghost-button-thick-border2 a:hover {
color: #00004C;
}
.ghost-button-thick-border2::after {
  position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 4px;
  background: #00004C; color: #00004C;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform .3s;
}
.ghost-button-thick-border2:hover::after {
color: #00004C;
  transform: scale(1, 1);
}
.ghost-button-thick-border5 {
  position: relative;
  display: inline-block;
 width: 150px;
  font-size: 14px;font-weight: bold; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; margin: 2px 2px 2px;
padding: 8px;
  color: #000000;
  border: 1px solid #fff;
  text-align: center;
  outline: none;
  text-decoration: none;
}
.ghost-button-thick-border5 a:hover {
color: #00004C;
}
.ghost-button-thick-border5::after {
  position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 4px;
  background: #00004C; color: #00004C;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform .3s;
}
.ghost-button-thick-border5:hover::after {
color: #00004C;
  transform: scale(1, 1);
}

.jp {
    display: block;
    color: #897240;
    font-size: 12px;
}
.en {
display: block;
font-family: orpheuspro,"Times New Roman","Yu Gothic","游ゴシック",YuGothic,"游ゴシック体","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,serif;
font-size: 16px;color: #000000;
}

hr.style-one {
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.ghost-button-thick-border1 {
 border:.18182rem solid #003a77;
 background-color:#003a77;
 color:#fff;
 font-size:16px;
 font-family: "Bodoni Std", Georgia, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
 font-weight:normal;
 width:100%;
 padding:.40818rem 1.36364rem;
 text-align:center;
 transition:all .3s ease-in-out
}
.ghost-button-thick-border1:hover,
.ghost-button-thick-border1:active {
 box-shadow:0 .36364rem .90909rem rgba(0,0,0,.5);
 color:#fff
}
body {
    user-select:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -khtml-user-select:none;
    -webkit-user-drag:none;
    -khtml-user-drag:none;
}

.boxe6{
max-width:100%;font-size: 16px;text-align: center;background:#003a77; color: #ffffff;
        margin: 0 auto;padding: 30px 0px 10px;font-size:16px;
}
.boxe6 a{ color:inherit; }

div.boxe1920A {
width: 100%;
margin: 0 auto;
max-width: 1920px; 
font-size: 16px;
background:#003a77; color: #ffffff;
margin:0px 0px 0px;
}
div.boxe1680A {
width: 100%;
margin: 0 auto;
max-width: 1680px; 
font-size: 16px;
background:#003a77; color: #ffffff;
margin:0px 0px 0px;
}
div.boxe1440A {
width: 100%;
margin: 0 auto;
max-width: 1440px; 
font-size: 16px;
background:#003a77; color: #ffffff;
margin:0px 0px 0px;
}
div.boxe1280A {
width: 100%;
margin: 0 auto;
max-width: 1280px; 
font-size: 16px;
background:#003a77; color: #ffffff;
margin:0px 0px 0px;
}
div.boxe960A {
width: 100%;
margin: 0 auto;
max-width: 960px; 
font-size: 16px;
background:#003a77; color: #ffffff;
margin:0px 0px 0px;
}
div.boxe1920sb {
width: 100%;
margin: 0 auto;
max-width: 1920px; 
font-size: 16px;
background: #f1f7fd; color: #000000;
margin:0px 0px 0px;padding: 20px 0px 20px;
}

div.boxe1920b {
width: 100%;
margin: 0 auto;
max-width: 1920px; 
font-size: 16px;
background: #6c757d; color: #ffffff;
margin:0px 0px 0px;
padding: 0px 0px 10px;
}

div.boxe1920w {
width: 100%;
margin: 0 auto;
max-width: 1920px; 
font-size: 16px;
background: #ffffff; color: #000000;
margin:0px 0px 0px;
}

div.boxe1680b {
width: 100%;
margin: 0 auto;
max-width: 1680px; 
font-size: 16px;
background: #00004C; color: #ffffff;
margin:5px 0px 5px;
}

div.boxe1680w {
width: 100%;
margin: 0 auto;
max-width: 1680px; 
font-size: 16px;
background: #ffffff; color: #000000;
margin:5px 0px 5px;
}

div.boxe1440b {
width: 100%;
margin: 0 auto;
max-width: 1440px; 
font-size: 16px;
background: #00004C; color: #ffffff;
margin:5px 0px 5px;
}

div.boxe1440w {
width: 100%;
margin: 0 auto;
max-width: 1440px; 
font-size: 16px;
background: #ffffff; color: #000000;
margin:5px 0px 5px;
}
div.boxe1280b {
width: 100%;
margin: 0 auto;
max-width: 1280px; 
font-size: 16px;
background: #00004C; color: #ffffff;
margin:5px 0px 5px;
}

div.boxe1280w {
width: 100%;
margin: 0 auto;
max-width: 1280px; 
font-size: 16px;
background: #ffffff; color: #000000;
margin:0px 0px 5px;
}
div.boxe960w {
width: 100%;
margin: 0 auto;
max-width: 960px; 
font-size: 16px;
background: #ffffff; color: #000000;
margin:0px 0px 0px;
}


.boxe7 {
    width: 100%;
max-width: 1280px;
    text-align: center;
    background: #ffffff;
    margin: 0 auto;
    padding: 0px 0px 5px;
    font-size: 12px;
    color: #000000;
}

@media screen and (max-width:1024px) {
    /*画面サイズが1024pxからはここを読み込む*/
.boxe7 {       display:none;}
div.topicpathlink { display:none;}
}
.boxe77 {
    width: 100%;
max-width: 1280px;
    text-align: center;
    background: #ffffff;
    margin: 0 auto;
    padding: 0px 0px 0px;
    font-size: 12px;
    color: #000000;
}

@media screen and (max-width:760px) {
    /*画面サイズが760pxからはここを読み込む*/
.boxe77 {       display:none;}
}


.boxe10 {
    max-width: 100%;
    text-align: center;
    background: #ffffff;
    margin: 0 auto;
    padding: 0px 0px 0px;
    font-size: 12px;
    color: #000000;
}

@media screen and (min-width:1024px) {
    /*画面サイズが1024px以下からはここを読み込む*/
.boxe10 {display:none;}
}
.boxe11 {
    max-width: 100%;
    text-align: center;
    background: #ffffff;
    margin: 0 auto;
    padding: 0px 0px 0px;
    font-size: 12px;
    color: #000000;
}

@media screen and (min-width:760px) {
    /*画面サイズが1024px以下からはここを読み込む*/
.boxe11 {display:none;}
}

.boxe50 {
width: 90%;
margin: 0 auto;
max-width: 960px; 
margin:20px 20px;
}

.swiper-container {
width: 100%;
      max-width: 1920px;
      max-height: auto;
      margin: 5px 0;
    }

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
 bottom: 15px;
 left:0;
 width:100%
 margin:0 4px;
}

.img-box {
  position: relative;
}
.img-box .active {
  position: absolute;
  width: auto;
height: auto;
max-width: 90%;
max-height: 90%;
left: 50%;
top: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
  opacity: 0;
  transition: 1.8s; // ゆっくり
}
.img-box:hover .active {
  opacity: 1;
}
a {
  color: #504E56;
}

.table-row5 {   display: table;table-layout: fixed; 
   width: 100%;font-size: 16px;}
.table-column5 {  display: table-cell; vertical-align: middle;  margin: 0px 0px 0px; padding: 0px 0px 0px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;}
.table-column5:first-child { width: 25%; /*左カラムのサイズ*/}


@media screen and (max-width: 1050px) {
.table-row5 {  display: block;}
.table-column5 { display: block;
      width: 100%;vertical-align: middle; margin: 0 auto; padding: 20px 0px 0px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;}
.table-column5:first-child { width:25%; /*左カラムのサイズ*/}
}
.table-row {   display: table;table-layout: fixed; 
   width: 100%;font-size: 16px;}
.table-column {  display: table-cell; vertical-align: middle;  margin: 30px 0px 30px; padding: 30px 0px 30px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;}
.table-column:first-child { width: 50%; /*左カラムのサイズ*/}

@media screen and (max-width: 1050px) {
.table-row {  display: block;}
.table-column { display: block;
      width: 100%;vertical-align: middle; margin: 0 auto; padding: 20px 0px 20px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;}
.table-column:first-child { width:100%; /*左カラムのサイズ*/}
}

.mobilemenu {
position: fixed;
left: 0;
bottom: 0;
background: white;
width: 100%;
z-index: 2;
}
.mobilemenu li {
display: table;
table-layout: fixed;
width: 20%;
padding: 5px;
list-style: none;
text-align: center;
}
.mobilemenu a span {
display: block;
font-size: 8px;
}
.mobilemenu km{
    list-style: none;
    display:flex;
    justify-content: center;padding: 0px;
}

@media screen and (min-width:1024px) {
    /*画面サイズが1024px以下からはここを読み込む*/
.mobilemenu { display:none;}
}


.Loadingbox{
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
  -webkit-transition: all 1.2s ease; /* 1.2秒でフェードアウト */
          transition: all 1.2s ease;
  color: #fff; /* ローディングアニメーションカラー */
  background-color: #333; /* 背景カラー */
}

/* ローディング表示を消すための定義 */
.Loadingbox.loaded{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

/* ローディングアニメーション */
.spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-transform-origin: center;
          transform-origin: center;
  width: 120px;
  height: 120px;
}
 
/* Loading テキスト */
.spinner span {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 12px;
}

/* 1番目のアニメーションの場合 */
.spinner.type1 {
  border-radius: 50%;
  border-width: 8px;
  border-style: solid;
  border-color: #fff rgba(255, 255, 255, 0.12) rgba(255, 255, 255, 0.12);
  /* ローディング要素のアニメーションを指定 */
  -webkit-animation: spinner1_1 1.5s infinite linear forwards;
          animation: spinner1_1 1.5s infinite linear forwards;
}
.spinner.type1 span {
  /* Loading テキストのアニメーションを指定 */
  animation: spinner_loading_text 1.5s infinite linear forwards reverse;
}
 
/* ローディング要素のアニメーション内容 */
@-webkit-keyframes spinner1_1 {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0);
            transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
            transform: translate(-50%, -50%) rotate(360deg);
  }
}
 
@keyframes spinner1_1 {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0);
            transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
            transform: translate(-50%, -50%) rotate(360deg);
  }
}
 
/* Loading テキストのアニメーション内容 */
@-webkit-keyframes spinner_loading_text {
  0% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
            transform: translate(-50%, -50%) rotate(0deg);
  }
  50% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
            transform: translate(-50%, -50%) rotate(180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
            transform: translate(-50%, -50%) rotate(360deg);
  }
}
@keyframes spinner_loading_text {
  0% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
            transform: translate(-50%, -50%) rotate(0deg);
  }
  50% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
            transform: translate(-50%, -50%) rotate(180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
            transform: translate(-50%, -50%) rotate(360deg);
  }
}

@media screen and (min-width:1024px) {
    /*画面サイズが1024px以下からはここを読み込む*/
.menu {display:none;}
}
h3 {
    color: #003a77;
    letter-spacing: 2px;
    border-left: 8px solid;
    padding-left: 8px;
    margin: 15px 0px;
    font-size: 18px;
    text-transform: uppercase;
}
table#table-a {
width: 100%;
border: 1px #E3E3E3 solid;
border-collapse: collapse;
border-spacing: 0;
font-size:14px;
line-height: 18px;
color: #444444;

}

table#table-a th {
border: #E3E3E3 solid;
border-width: 0 0 1px 1px;
line-height: 180%;
text-align: left;
vertical-align:middle;
letter-spacing:1px;
background-color: #f5f5f5;
width: 33%;
height: auto;
padding: 10px;
font-weight: normal;
}
table#table-a td {
border: 1px #E3E3E3 solid;
border-width: 0 0 1px 1px;
text-align: left;
vertical-align:middle;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 10px;
}

.ghost-button-thick-border9 {
  display: inline-block;
  width:320px;font-size: 1.2rem;
font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
  margin: 15px;padding: 8px;
  color: #000;
  border: 1px solid #dcdcdc;
  text-align: center; font-weight:bold;
  outline: none;
  text-decoration: none;
  transition: background-color 0.2s ease-out,
              color 0.2s ease-out;
}
.ghost-button-thick-border9:hover,
.ghost-button-thick-border9:active {
  background-color: #333;
   color: #ffffff!important;
    text-decoration: none;
  transition: background-color 0.3s ease-in,
              color 0.3s ease-in;
}
.category_list_wrap1 {
  width: 100%;
  max-width: 1680px;
  margin: 0 auto 0px;
}
.category_list_wrap1 h2 {
  text-align: center;
  padding: 20px 0;
}
.category_list_wrap1 h2 span {
  color: #B19458;
}
.category_list_wrap1 ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;list-style: none;
padding:30px 30px 0px;
}
.category_list_wrap1 ul li {
  width: 24%;
  text-align: center;
  margin: 0 0 30px;
background: #ffffff;
}
.category_list_wrap1 ul li > a {
  display: block;
}
.category_list_wrap1 ul li .title {
  margin: 15px 0 0;
  font-size: 1.1rem;
  letter-spacing: .03em;
}
.category_list_wrap1 ul li .title a {
  transition: opacity .4s ease 0s;
}
.category_list_wrap1 ul li .title a span {
  font-size: 0.8rem;
  color: #B19458;
  letter-spacing: .15em;
  display: block;
  padding: 5px 0 5px;
}
.category_list_wrap1 ul li .title a:hover {
  opacity: .6;
}
@media screen and (max-width: 735px) {
  /* h2 */
  h2 {
    font-size: 3.5rem;
  }
  h2 span {
    margin: 7px 0 0;
    font-size: 1rem;
  }
 .category_list_wrap1 {
    margin: 0;
    padding: 0 5px 44px;
    box-sizing: border-box;
  }
.category_list_wrap1 ul {
list-style: none;
padding:20px 10px 0px;
  }
.category_list_wrap1 ul li {
    width: 48%;
    margin: 0 0 20px;
  }
.category_list_wrap1 ul li .title {
    margin: 8px 0 0;
    font-size: 1.1rem;
  }
.category_list_wrap1 ul li .title a span {
    font-size: .95rem;
  }
  }
.img-box3 {
  position: relative;vertical-align: top; padding: 20px 0px 20px;border: 1px solid #cccccc;
  width: 100%;height: auto;max-width: 357px;max-height:auto;font-size:12px;
}
.img-box3 .active {
  position:absolute;
  width: 100%;
height: auto;
max-width: 357px;
max-height:auto;
left: 50%;
top: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
  opacity: 0;
  transition: 1.8s; // ゆっくり
}
.img-box3:hover .active {
  opacity: 1;
}
.img-box3:hover {
    border-color:#8C8C8C;
  }
.img-box {
  position: relative;
}
.img-box .active {
  position: absolute;
  width: 100%;
height: auto;
max-width:100%;
max-height:auto;
left: 50%;
top: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
  opacity: 0;
  transition: 1.8s;
}
.img-box:hover .active {
  opacity: 1;
}
.category_list_wrap11 {
  width: 100%;
  max-width: 1680px;
  margin: 0 auto 0px;
}
.category_list_wrap11 h2 {
  text-align: center;
  padding: 20px 0;
}
.category_list_wrap11 h2 span {
  color: #B19458;
}
.category_list_wrap11 ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;list-style: none;
padding:30px 30px 0px;
}
.category_list_wrap11 ul li {
  width: 19.2%;
  text-align: center;
  margin: 0 0 30px;
background: #ffffff;
}
.category_list_wrap11 ul li > a {
  display: block;
}
.category_list_wrap11 ul li .title {
  margin: 15px 0 0;
  font-size: 1.2rem;
  letter-spacing: .03em;
}
.category_list_wrap11 ul li .title a {
  transition: opacity .4s ease 0s;
}
.category_list_wrap11 ul li .title a span {
  font-size: 0.8rem;
  color: #B19458;
  letter-spacing: .15em;
  display: block;
  padding: 5px 0 5px;
}
.category_list_wrap11 ul li .title a:hover {
  opacity: .6;
}
@media screen and (max-width: 735px) {
  /* h2 */
  h2 {
    font-size: 3.5rem;
  }
  h2 span {
    margin: 7px 0 0;
    font-size: 1rem;
  }
 .category_list_wrap11 {
    margin: 0;
    padding: 0 5px 44px;
    box-sizing: border-box;
  }
.category_list_wrap11 ul {
list-style: none;
padding:20px 10px 0px;
  }
.category_list_wrap11 ul li {
    width: 48%;
    margin: 0 0 20px;
  }
.category_list_wrap11 ul li .title {
    margin: 8px 0 0;
    font-size: 1.1rem;
  }
.category_list_wrap11 ul li .title a span {
    font-size: .95rem;
  }
  }

.category_list_wrap33 {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto 0px;
}
.category_list_wrap33 h2 {
  text-align: center;
  padding: 20px 0;
}
.category_list_wrap33 h2 span {
  color: #B19458;
}
.category_list_wrap33 ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;list-style: none;
padding:30px 30px 0px;
}
.category_list_wrap33 ul li {
  width: 32%;
  text-align: center;
  margin: 0 0 30px;
background: #ffffff;
}
.category_list_wrap33 ul li > a {
  display: block;
}
.category_list_wrap33 ul li .title {
  margin: 15px 0 0;
  font-size: 1.2rem;
  letter-spacing: .03em;
}
.category_list_wrap33 ul li .title a {
  transition: opacity .4s ease 0s;
}
.category_list_wrap33 ul li .title a span {
  font-size: 0.8rem;
  color: #B19458;
  letter-spacing: .15em;
  display: block;
  padding: 5px 0 5px;
}
.category_list_wrap33 ul li .title a:hover {
  opacity: .6;
}
@media screen and (max-width: 735px) {
  /* h2 */
  h2 {
    font-size: 3.5rem;
  }
  h2 span {
    margin: 7px 0 0;
    font-size: 1rem;
  }
 .category_list_wrap33 {
    margin: 0;
    padding: 0 5px 44px;
    box-sizing: border-box;
  }
.category_list_wrap33 ul {
list-style: none;
padding:20px 10px 0px;
  }
.category_list_wrap33 ul li {
    width: 48%;
    margin: 0 0 20px;
  }
.category_list_wrap33 ul li .title {
    margin: 8px 0 0;
    font-size: 1.1rem;
  }
.category_list_wrap33 ul li .title a span {
    font-size: .95rem;
  }
  }