/* 基本のリセット */
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap');
/* @group Reset */
*{ margin: 0;padding: 0;box-sizing: border-box;}
a { text-decoration : none}
ul, ol { list-style : none}
img { vertical-align : top}
/* @end */
/* @group Fluid-img */
img { max-width : 100%;height: auto}
/* @end */
/* @group HTML */
html {
font-family : verdana, sans-serif;
font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
font-size : 95%;
line-height : 1.6;
word-wrap: break-word;
scroll-behavior: smooth;
}




/* ベースのスタイル */
body {
background: #090d11;
color: rgb(255,255, 255);counter-reset: number 0;
/*font-family: 'Noto Serif JP','Yu Mincho',  "メイリオ" , sans-serif;*/
font-family: "M PLUS 1", "メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
line-height: 1.6;
}

p {
/*font-family: 'Noto Serif JP','Yu Mincho',  "メイリオ" , sans-serif;*/
font-family: "M PLUS 1", "メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.header, .footer {
    background-color: #000;
    color: #fff;
    text-align: center;
    padding: 1em;
}
header {
	background-color: #000;height: 7vh;
}

#header_logo { padding:10px;width: 90%;text-align: left;z-index: 1;
}


@media only screen and (min-width: 999px) {

#header_logo {  width: 100%;padding:14px;

}
#header_logo img {/*height: 10vh;*/
}
}
a:hover img{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
transition: all .5s;
}

.container {
    display: flex;
    flex-direction: column; /* モバイルでは1カラム表示 */
   /*  gap: 1em;
   padding: 1em;*/margin: 0;
    padding: 0;
}

.column {background-color: #f4f4f4;
    /*background-color: #f4f4f4;
    padding: 1em;
    border: 1px solid #ddd;
*/}



/* タブレットサイズ以上（2カラム） */
@media (min-width: 768px) {
    .container {
        /*flex-direction: row; /* 横並びに変更 */
        /*flex-wrap: wrap;*/
    }
    .column {
        flex: 1 1 45%; /* 幅を2カラムにする */
    }
}

/* デスクトップサイズ以上（3カラム） */
@media (min-width: 1024px) {
    .container {
       /* flex-direction: row;*/
    }
    .column {
        flex: 1 1 30%; /* 幅を3カラムにする */
    }
}



.container-row {
    display: flex;
    flex-direction: column; /* モバイルでは1カラム表示 */
    gap: 1em;
    padding: 1em;
}

.column-row {
    background-color: none;
    /*padding: 1em;
    border: 1px solid #ddd;*/
	text-align:center
}
.column-row img {
   width: 100%;
}

.ft-rm { font-family:Reimin Medium,  Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
.ft-rbkl { font-family:Ryumin Bold KL,  Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
.ft-notoserif { font-family:"Noto Serif JP", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }

/* タブレットサイズ以上（2カラム） */
@media (min-width: 768px) {
    .container-row {
        flex-direction: row; /* 横並びに変更 */
        flex-wrap: wrap;
    }
    .column-row {
        flex: 1 1; /* 幅を2カラムにする */
    }
}

/* デスクトップサイズ以上（3カラム） */
@media (min-width: 1024px) {
    .container-row {
        flex-direction: row;height: 90vh;
    }
    .column-row {
        flex: auto; /* 幅を2カラムにする */
    }
}


.column-row-flex {
  display: flex;flex-direction: column;
  justify-content: center;
  align-items: center;
  /*background: #ccc;*/
}

.column-row-title{
	color: #fff;
	font-size: 1.6em;padding : 0px 20px 24px;
	line-height: 1.5;
	font-weight: bold;
	text-shadow: 1px 1px 1px #000;
	margin:0 auto;
}
.column-row-txt{
	color: #fff;
	font-size: 0.85em;padding : 0px 0px;
	line-height: 1.5;
	font-weight: 200;
}
/* タブレットサイズ以上（2カラム） */
@media (min-width: 768px) {
.column-row-title{
	font-size: 2em;
}
.column-row-txt{

	font-size: 1.4em;
}
}

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
.div_pc { display: none !important; }
.div_sp { display: block !important; }
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
@media only screen and (min-width: 999px) {
.div_pc { display: block !important; }
.div_sp { display: none !important; }
}


/* .grid
------------------------- */

.grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(200px, 1fr));
}
.grid-2 {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(1, minmax(200px, 1fr));
}
.grid-3 {
  display: grid;
  gap: 3%;
  grid-template-columns: repeat(1, minmax(100%, 1fr));
}
.grid-4 {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(40%, 1fr));
}

.grid-1-2 {
  display: grid;
  gap: 2%;
  grid-template-columns: repeat(1, minmax(100%, 1fr));
}
.grid-1-4 {
  display: grid;
  gap: 2%;
  grid-template-columns: repeat(1, minmax(100%, 1fr));
}
.grid-2-3 {
  display: grid;
  gap: 2%;
  grid-template-columns: repeat(1, minmax(100%, 1fr));
}
.grid-3-2 {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(1, minmax(200px, 1fr));
}
.grid-in-2 {
  display: grid;
  gap: 2%;
  grid-template-columns: repeat(2, minmax(40%, 1fr)) ;
}
.grid-185 {
  display: grid;
  grid-gap: 24px 10px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.place-items-center {
place-items: center;
}
.place-items-center-start {
place-items: center start;
}


@media only screen and (min-width: 999px) {
.grid-2 {
  grid-gap: 20px 5%;
  grid-template-columns: repeat(2, minmax(200px, 1fr));
}
.grid-3 {
  display: grid;
  gap: 3%;
  grid-template-columns: repeat(3, minmax(30%, 1fr));
}
.grid-4 {
  grid-gap: 20px 10px;
  grid-template-columns: repeat(4, minmax(200px, 1fr));
}

.grid-1-2 {
  display: grid;
  gap: 5%;
  grid-template-columns: minmax(100px, 1fr) 2fr;
}
.grid-1-4 {
  display: grid;
  gap: 5%;
  grid-template-columns: minmax(100px, 1fr) 4fr;
}
.grid-2-3 {
  display: grid;
  gap: 5%;
  grid-template-columns: minmax(100px, 2fr) 3fr;
}
.grid-3-2 {
  display: grid;
  gap: 5% 2%;
  grid-template-columns: minmax(100px, 3fr) 2fr;
}
.grid-in-2 {
  display: grid;
  gap: 10% 2%;
  grid-template-columns: repeat(2,1fr) ;
}



.grid-185 {
  grid-gap: 20px 10px;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
}


}
/* .switchBtn
------------------------- */
.switchBtn {
	margin-top: 15px;
	padding: 10px 0;
	width: 100%;
	text-align: center;
	background: #efefef;
	clear: both;
}

.switchBtn a {
	margin: 0 10px;
	padding: 5px 15px;
	text-align: center;
	display: inline-block;
	overflow: hidden;
	background: #efefef;
	border: #333 solid 1px;
	color:#333
}

.switchBtn a.btnAcv {
	background: #fff;
}
/* トップへ戻るボタン
---------------------------------------------------- */

#page-top {
    position: fixed;
    bottom: 2%;
    right: 2%;
    font-size: 70%;
}
#page-top a {
    display: block;
    text-decoration: none;
    padding-top: 20px;
    width: 120px;
    height: 0px;
    overflow: hidden;
    background: url("../images/pagetop.png") no-repeat 0 0;/*画像のURLを指定。*/
}
  
#page-top a:hover {
    background-position: 0 -20px;
}


/* flexbox */

.items {
  display: -webkit-flex;
  display: flex;
  box-sizing: border-box;
}
.items img {
  padding: 0;
}


.items5 {
  display: -webkit-flex;
  display: flex;
  box-sizing: border-box;
}
.items5 img {
  padding: 0;
}
.items6 {
  display: -webkit-flex;
  display: flex;
  box-sizing: border-box;
}
.items6 img {
  padding: 0;
}

.items-header {
  display: -webkit-flex;
  display: flex;
  box-sizing: border-box;
}




.im-all1 {
margin:1%;
}
.im-all2 {
margin:2%;
}
.im-all3 {
margin:3%;
}
.im-all4 {
margin:4%;
}
.im-all5 {
margin:5%;
}

.im-l1-r1 {
margin-left:1%;margin-right:1%;
}
.im-l2-r2 {
margin-left:2%;margin-right:2%;
}
.im-l3-r3 {
margin-left:3%;margin-right:3%;
}
.im-l4-r4 {
margin-left:4%;margin-right:4%;
}
.im-l5-r5 {
margin-left:5%;margin-right:5%;
}

.im-l1 {
margin-left:1%;
}
.im-l2 {
margin-left:2%;
}
.im-l3 {
margin-left:3%;
}
.im-l4 {
margin-left:4%;
}
.im-l5 {
margin-left:5%;
}

.im-r1 {
margin-right:1%;
}
.im-r2 {
margin-right:2%;
}
.im-r3 {
margin-right:3%;
}
.im-r4 {
margin-right:4%;
}
.im-r5 {
margin-right:5%;
}

.im-t1 {
margin-top:1%;
}
.im-t2 {
margin-top:2%;
}
.im-t3 {
margin-top:3%;
}
.im-t4 {
margin-top:4%;
}
.im-t5 {
margin-top:5%;
}

.im-b1 {
margin-bottom:1%;
}
.im-b2 {
margin-bottom:2%;
}
.im-b3 {
margin-bottom:3%;
}
.im-b4 {
margin-bottom:4%;
}
.im-b5 {
margin-bottom:5%;
}



.ip-all1 {
padding:1%;
}
.ip-all2 {
padding:2%;
}
.ip-all3 {
padding:3%;
}
.ip-all4 {
padding:4%;
}
.ip-all5 {
padding:5%;
}

.ip-l1-r1 {
padding-left:1%;padding-right:1%;
}
.ip-l2-r2 {
padding-left:2%;padding-right:2%;
}
.ip-l3-r3 {
padding-left:3%;padding-right:3%;
}
.ip-l4-r4 {
padding-left:3%;padding-right:4%;
}
.ip-l5-r5 {
padding-left:5%;padding-right:5%;
}



.ip-t1 {
padding-top:1%;
}
.ip-t2 {
padding-top:2%;
}
.ip-t3 {
padding-top:3%;
}
.ip-t4 {
padding-top:4%;
}
.ip-t5 {
padding-top:5%;
}

.ip-b1 {
padding-bottom:1%;
}
.ip-b2 {
padding-bottom:2%;
}
.ip-b3 {
padding-bottom:3%;
}
.ip-b4 {
padding-bottom:4%;
}
.ip-b5 {
padding-bottom:5%;
}


/**/
.item-justify-content-fa {
  justify-content: flex-start;
}

.item-justify-content-sb {
  justify-content: space-between;
}
.item-justify-content-sa {
  justify-content: space-around;
}
.item-justify-content-se {
  justify-content: space-evenly;
}
.item-justify-content-ce {
  justify-content: center;
}

/* 位置による配置 
justify-content: center;     /* アイテムを中央に寄せる 
justify-content: start;      /* アイテムを先頭に寄せる 
justify-content: end;        /* アイテムを末尾に寄せる 
justify-content: flex-start; /* フレックスアイテムを先頭に寄せる 
justify-content: flex-end;   /* フレックスアイテムを末尾に寄せる 
justify-content: left;       /* アイテムを左端に寄せる 
justify-content: right;      /* アイテムを右端に寄せる 
*/



.items-center {
display:flex;
-webkit-align-items: center;
-webkit-justify-content: center; 
align-items: center; /*上下中央*/
justify-content: center; /*左右中央*/
}



.item-justify-content-left {
  justify-content: left;
}
.item-justify-content-right {
  justify-content: right;
}

.item-align-c {
   align-items: center;
}
.item-align-s {
   align-items: flex-start;
}
.item-align-e {
   align-items: flex-end;
}
.items {
    flex-direction: column;
  }
  .items .item2 {
    width: 100%;
  }

  .item1all {
    width: 100%;
  }
  .item3 {
    width: 100%;
  }

  .items .item3all {
    width: 100%;
  }
  .items3over .item3 {
    width: 50%;
  } 
  .items .item4 {
    width: 50%;
  }
  .items4over .item4 {
    width: 48%;margin:1%;
  }
  .item4-top {
  width: 50%;
}
  .item5 {
  width: 45%;
}
.items5 {
 flex-wrap: wrap;
}
.items5 a{
width: calc(100% / 2 - 10px);color: #fff;margin-bottom:3%;
}
.items5 a:hover {
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
}
.items5-photo a {
margin-bottom:5%;
}

.items5-banner a {
margin-bottom:3%;
}

.item6 {
  width: 48%;
}

.items6 {
 flex-wrap: wrap;
}
.items6 a{
width: calc(100% / 2 - 10px);color: #fff;margin-bottom:3%;
}


.items6 a:hover {
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
}
.items6-photo a {
margin-bottom:5%;
}

.item7 {
  width: 48%;
}

.item-aside {
  width: 50%;
}

.flex-grow1,
.flex-grow2,
.flex-grow3,
.flex-grow4,
.flex-grow5,{
  flex-grow: 1;
}

#item-main {
  width: 100%;
}
#item-aside {
  width: 100%;
}

.items-buy {
    flex-direction: row;
  }
  

  
.widget {
  width: 100%;
}


.bg_k1 {
background:#202021;
}
.bg_gr1 {
background:#f1f1f1; 
}

.bg_gr2 {
background:#f1f1f1;
}
.bg_gr2 h2 {
color: #000;
}
.bg_gr2 p {
color: #000;
}

@media screen and (min-width: 999px) {
  /*.items-header {
    flex-direction: column;  
  }*/
.items {
    flex-direction: row;
  }
/*.items-header {
    flex-direction: row; width: 100%;
  }	*/
/*逆順*/
.item-reverse {
flex-direction: row-reverse;
}
/*折り返しあり*/
.item-wrap {
  flex-wrap: wrap;
}
.item-column {
  flex-direction: column;
}
}
/* デスクトップサイズ以上（3カラム） */
@media screen and (min-width: 1024px) {
	



.item2 {
  width: 48%;margin-right:1%;
}
.item1all {
  width: 50%;
}
.item2all {
  width: 50%;
}
.item3 {
  width: 30%;
}
.item3all {
  width: 33.3%;
}

.item4-top {
  width: 25%;
}
.item5 {
  width: 19%;
}
.items5  {
 flex-direction: row;
}
.items5 a {
  width: calc(100% / 5 - 10px);line-height: 1.3;
}

.items5::after{
  content:"";
  display: block;
  width: calc(100% / 5 - 10px);
} 

.items5-photo a {
margin-bottom:1%;
}


.item6 {
  width: 15%;
}
.items6  {
 flex-direction: row;
}
.items6 a {
  width: calc(100% / 6 - 10px);line-height: 1.3;
}
.items6-photo a {
margin-bottom:1%;
}
.item7 {
  width: 13%;
}

.item-aside {
  width: 100%;
}

.widget {
  width: 48%;margin-right:1%;
}

.items-header {
    width: 100%;max-width: 1400px;
	margin:0 auto;
  }	
  
.items-1400 {
    width: 1400px;
	margin:0 auto;
  }
    
.items-1300 {
    width: 1300px;
	margin:0 auto;
  }
  .items-1200 {
    width: 1200px;
	margin:0 auto;
  }
  

.item-width-10 {
  flex-basis: 10%;
}
.item-width-20 {
  flex-basis: 20%;
}
.item-width-25 {
  flex-basis: 25%;
}
.item-width-30 {
  flex-basis: 30%;
}
.item-width-35 {
  flex-basis: 35%;
}
.item-width-40 {
  flex-basis: 40%;
}
.item-width-50 {
  flex-basis: 50%;
}
.item-width-60 {
  flex-basis: 60%;
}
.item-width-70 {
  flex-basis: 70%;
}
.item-width-80 {
  flex-basis: 80%;
}
/*要素の大きさを調整*/
.flex-grow1 {
  flex-grow: 1;
}
.flex-grow2 {
  flex-grow: 2;
}
.flex-grow3 {
  flex-grow: 3;
}
.flex-grow4 {
  flex-grow: 4;
}
.flex-grow5 {
  flex-grow: 5;
}
.flex-grow10 {
  flex-grow: 10;
}
}





/*@media screen and (max-width: 480px) {*/

/*}*/


/**/
.grid-gnav-bg {
	display:none;/*background-color: rgba(255, 255, 255, 0.7);*/
}

@media screen and (min-width: 1024px) {
.grid-gnav {
  display: grid;
  gap: 0px 0%;
  grid-template-columns: repeat(auto-fit, minmax(15.2%, 1fr));width: 100%;margin: 0 auto;
}
.grid-gnav-bg {
	display:block;width: 100%;
  padding: 0px 0;
 /* border-top: 1px solid #d9d6d0;border-bottom: 1px solid #d9d6d0;
  background-image: linear-gradient(#ffffff, #f3f3f3 50%, #e6e6e6 75% 100%);*/

}

/*.grid-gnav  {
  list-style: none;
  padding: 0;
  margin: 0 auto;
}*/
.grid-gnav ul {
  list-style: none;width: 100%;
  padding: 0;
  margin: 0 auto;
}
.grid-gnav li {
  display: inline-block;
  padding: 2px 6px;
  /*border-left: 1px solid #cdcdcd;
  border-left:10px solid #104fb6;
  border-left: 1px solid #1d2f55;*/
  position: relative;vertical-align: middle;

}

/*.grid-gnav li a {
  display: block;
	padding: 0.75em 10px;
	color: #000;height:3em;text-align: center;
	
}
.grid-gnav li::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 100%;
    width: 1px;
    height: 100%;
    margin: 0 auto;
    text-align: center;

}


.grid-gnav a.active, .grid-gnav a:hover {
  -webkit-transition:0.5s;
	transition:0.5s;
	background:#e60020;color: #fff;
}*/

/**/
.grid-gnav li a {
  display: block;text-align:center;
	padding: 1% 0.5% ;/*0.75em 6px*/margin:1% 5% ; 
	/*background-color: #aa994b;*/color: #fff;height:2.2em;/*3em*/
	line-height:1.1
	
	
}
.grid-gnav li a[target^="_blank"]{
	padding-right:2px;padding-bottom:12px;
	background:url(../images/link_blank.gif) 100% 20%/*right center */no-repeat;
}
/*.item-gnav li::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 100%;
    width: 1px;
    height: 100%;
    margin: 0 auto;
    text-align: center;
	background-image: -webkit-linear-gradient(top, transparent, #fff 80%, #fff 100%, transparent);
    background-image: linear-gradient(to bottom, transparent, #d9c97b 60%, #d9c97b 80%, transparent);
    background-position: center;

    background-repeat: no-repeat;
}*/
.grid-gnav a::before {
	font-family: "Font Awesome 5 Free";
	content:"\f105";margin-right:0.5em;font-weight: 900;
   /* position: absolute;
    bottom: 0;
    left: 0;
    right: 100%;
    width: 1px;
    height: 100%;
    margin: 0 auto;
    text-align: center;
	background-image: -webkit-linear-gradient(top, transparent, #fff 80%, #fff 100%, transparent);
    background-image: linear-gradient(to bottom, transparent, #d9c97b 60%, #d9c97b 80%, transparent);
    background-position: center;
    background-repeat: no-repeat;*/
}

.grid-gnav a {
  text-decoration: none;display: block; 
  /*line-height:1.5em;/* padding-bottom: 2px;height:1.5em;*/
  color: #333333;
}
.grid-gnav a.active, .grid-gnav a:hover {
  /*border-bottom: 3px solid #006ab6;*/
  -webkit-transition:0.5s;
	transition:0.5s;
	/*background:#aa994b;*/
	border-bottom: 1px solid #66cc33;
}

}

/* gnav*/

.gnav {
	display: none;
}

/* タブレットサイズ以上（2カラム） */
@media screen and (min-width: 999px) {

.gnav {
    width: 60%;margin:0px;

}


/*.item-gnav-item-auto li {
	font-size:80%;width: 33.3%;
}
.item-gnav-item3 li {
	font-size:80%
}
.item-gnav-item4 li {
	font-size:80%
}
.item-gnav-item5 li {
	font-size:80%
}
.item-gnav-item6 li {
	font-size:80%
}
.item-gnav-item7 li {
	font-size:80%
}
.item-gnav-item8 li {
	font-size:70%
}
*/
}

/* デスクトップサイズ以上（3カラム） */
@media screen and (min-width: 1024px) {
.gnav {
	display:block;
}

.item-gnav {
  display: flex;text-align:left;width: 100%;
  align-items: center;
  justify-content: flex-start/*space-between*/;
  height: 7vh;padding: 0px 0;font-size:110%;color: #fff;
  /*box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.16);
  padding: 0 24px;*/
  /*background-color: #aa994b;/*height:60px;*/
  /*border-top: 1px solid #d9d6d0;border-bottom: 1px solid #d9d6d0;background-color: #ebe8e3;*/
}


.item-gnav ul {
  list-style: none;width: 100%;
  padding: 0;
  margin: 0 auto;
}
.item-gnav li {
  display: inline-block;
  /*padding: 2px 6px;
  /*border-left: 1px solid #cdcdcd;*/vertical-align: middle;
  /*border-left:10px solid #104fb6;*/
  /*border-left: 1px solid #1d2f55;*/position: relative;
}

.item-gnav li a {
  display: block;text-align:center;
	padding: 1% 0.5% ;/*0.75em 6px*/margin:1% 5% ; 
	/*background-color: #aa994b;*/color: #fff;height:2.2em;/*3em*/
	line-height:1.1
	
	
}
.item-gnav li a[target^="_blank"]{
	padding-right:20px;
	background:url(../images/link_blank.gif) right center no-repeat;	
}
/*.item-gnav li::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 100%;
    width: 1px;
    height: 100%;
    margin: 0 auto;
    text-align: center;
	background-image: -webkit-linear-gradient(top, transparent, #fff 80%, #fff 100%, transparent);
    background-image: linear-gradient(to bottom, transparent, #d9c97b 60%, #d9c97b 80%, transparent);
    background-position: center;

    background-repeat: no-repeat;
}*/
.item-gnav a::before {
	font-family: "Font Awesome 5 Free";
	content:"\f105";margin-right:0.5em;font-weight: 900;
   /* position: absolute;
    bottom: 0;
    left: 0;
    right: 100%;
    width: 1px;
    height: 100%;
    margin: 0 auto;
    text-align: center;
	background-image: -webkit-linear-gradient(top, transparent, #fff 80%, #fff 100%, transparent);
    background-image: linear-gradient(to bottom, transparent, #d9c97b 60%, #d9c97b 80%, transparent);
    background-position: center;
    background-repeat: no-repeat;*/
}

.item-gnav a {
  text-decoration: none;display: block; 
  /*line-height:1.5em;/* padding-bottom: 2px;height:1.5em;*/
  color: #333333;
}
.item-gnav a.active, .item-gnav a:hover {
  /*border-bottom: 3px solid #006ab6;*/
  -webkit-transition:0.5s;
	transition:0.5s;
	/*background:#aa994b;*/
	border-bottom: 1px solid #66cc33;
}
.item-gnav-item-auto li {
  width: auto;font-size:80%;padding: 0 1% 0 0;
}
.item-gnav-item3 li {
  width: 33.3%;font-size:75%;
}
.item-gnav-item4 li {
  width: 23%;font-size:83%;
}
.item-gnav-item5 li {
  width: 20%;font-size:80%;
}
.item-gnav-item6 li {
  width: 15%;font-size:75%;
}
.item-gnav-item7 li {
  width: 13%;
}
.item-gnav-item8 li {
  width: 10%;
}
}



/*ドロワー
---------------------------------------------------- */

#drawer {
display: block;
    position: fixed;
    top: 0;right: 0;z-index: 3000;
background-color: rgba(247,172,27,0.9);padding: 6px 6px 0px 6px;
		/*position: relative;
		width: 100%;*/
}

/* 以下はメニューのスタイリングなど */
 #drawer ul {
    padding:0;
    list-style:none;
    border-top: solid 1px #ccc;
    color: #000;
}
#drawer ul li {
    border-bottom: solid 1px #ccc;
    padding: 12px 20px;font-size: 90%;
}

header:after {
    content:"";
    display: block;
    clear: both;
}
#drawer ul li a {
    color: #000;
}

#drawer-icon {
  cursor: pointer;
  display: inline-block;
  height: 50px;
  position: relative;
  width: 50px;
}
#drawer-icon span {
  background:  #fff;
  border-radius: 0px;/*4*/
  display: block;
  height: 16%;
  left: 50%;
  margin: -8% 0 0 -42%;
  position: absolute;
  top: 50%;
  transition: all 0.3s ease-in-out;
  width: 84%;
}
#drawer-icon span::before,
#drawer-icon span::after {
  -webkit-transform: rotate(0);
  background: #fff;
  border-radius: 0px;/*4*/
  content: "";
  display: block;
  height: 100%;
  left: 50%;
  margin: -8% 0 0 -50%;
  position: absolute;
  top: 50%;
  transform: rotate(0);
  transition: all 0.3s ease-in-out;
  width: 100%;
}
#drawer-icon span::before {
  margin-top: -38%;
}
#drawer-icon span::after {
  margin-top: 19%;
}
#drawer-checkbox:checked ~ #drawer-icon span {
  background: rgba(51, 51, 51, 0);
}
#drawer-checkbox:checked ~ #drawer-icon span::before,
#drawer-checkbox:checked ~ #drawer-icon span::after {
  content: "";
  display: block;
  height: 100%;
  left: 50%;
  margin: -8% 0 0 -42%;
  position: absolute;
  top: 50%;
  width: 100%;
}
#drawer-checkbox:checked ~ #drawer-icon span::before {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
#drawer-checkbox:checked ~ #drawer-icon span::after {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
#drawer-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 4000;
  width: 250px;
  max-width: 90%;
  height: 100%;
  background: #fff;
  transition: all 0.3s ease-in-out 0s;
  transform: translateX(-100%);
}
#drawer-checkbox:checked ~ #drawer-content {
  transform: translateX(0);
  box-shadow: 6px 0 25px rgba(0, 0, 0, 0.16);
}

#drawer-close {
  display: none;
  position: fixed;
  z-index: 3900;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0;
  transition: all 0.3s ease-in-out 0s;
}
#drawer-checkbox:checked ~ #drawer-close {
  display: block;
  opacity: 0.3;
}
#drawer-checkbox {
  display: none;
}
/* タブレットサイズ以上（2カラム） */
@media screen and (min-width: 1024px) {
#drawer {
  display: none;
}
}



.header_tel01 {margin:0.1em 0.2em -0.2em 0;color:#fff/*e8182c*/;font-weight:bold;font-size:220%;
font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;}
.header_tel01 a{text-decoration: none; color:#fff/*e8182c*/;}



/* section */
.sec01, .sec02 { width: auto; margin-left: 10px; margin-right: 10px; }
.sec1400 { width: auto; margin-left: 3%; margin-right: 3%;z-index:3; }
.sec1200 { width: auto; margin-left: 10px; margin-right: 10px; }
.sec970 { width: auto; margin-left: 3%; margin-right: 3%;z-index:3; }
.sec_blog { width: auto; margin-left: 3%; margin-right: 3%;z-index:3; }
.sec500, .sec600, .sec700, .sec800  { width: auto; margin-left: 10px; margin-right: 10px; }

.sec1400-topimg { width: auto; margin-left: 0px; margin-right: 0px; }

@media only screen and (min-width: 1400px) {

.sec1400 { width: 1400px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border: 0px;padding:0;z-index:3;}
.sec1400-topimg { width: 1400px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border: 0px;padding:0;background:#000}
.sec1200 { width: 1200px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }

}

@media only screen and (min-width: 999px) {
.sec01, .sec02, .sec03 { width: 980px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }

/*.sec1400 { width: 999px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border: 0px;padding:0;z-index:3;}
.sec1400-topimg { width: 999px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border: 0px;padding:0;background:#000}
.sec1200 { width: 999px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }*/
.sec970 { width: 970px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }

.sec500 { width: 500px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }
.sec600 { width: 600px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }
.sec700 { width: 700px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }
.sec800 { width: 800px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }
.sec80 { width: 80%; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent; }

.sec_blog { width: 980px; margin-left: auto; margin-right: auto; box-sizing: border-box; display: block; border-top: 1px solid transparent;margin-bottom: 29px; }
/*.sec_blog img { margin: 12px; }
.sec_blog p { margin: 12px; }*/
}
/*@media screen and (max-width: 1024px) {
.sec01 { width: 768px; }
.sec02, .sec03 { width: 730px; }
.sec1400-topimg  { width: 768px; }
.sec1400 { width: 768px; }
.sec1200 { width: 768px; }
.sec970 { width: 768px; }
.sec_blog { width: 768px; }
.sec800 { width: 768px; }
}
@media screen and (max-width: 767px) {
}
*/



/*figure {  
position: relative;
display: inline-block;
margin-right: 20px;
width: 500px;
}  
figure img {
	max-width: 100%;
	vertical-align: top;  }  
figure figcaption {
	position: absolute;
	left: 0;    bottom: 0;
	padding: 5px 10px;
	font-size: 150%;width: 100%;
	color: #fff;
	background: rgba(0, 0, 0, 0.4); backdrop-filter: blur(6px);border-bottom: 5px solid #e2b327;
}
a:hover figure figcaption {
background: rgba(0, 0, 0, 0.1);border-bottom: 5px solid #fff;
transition: 0.5s;
}*/

/*a:hover img{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
transition: 0.5s;
}*/

/**/

.transparent_box {

}

.transparent {
  position: relative;  /* 基準位置とする */
  margin: 0%;overflow:hidden;
}
.transparent::before {
  content: "";         /* 疑似要素に必須 */
  width: 100%;         /* 幅いっぱい */
  height: 100%;        /* 高さいっぱい */
  display: block;      /* 高さを指定するためにブロック要素にする */
  background: linear-gradient(rgba(0,0,0,0) 0, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 80%, rgba(0,0,0,0.8) 100%); /* 徐々に透明にする */
  position: absolute;  /*  */
  top: 0;
  left: 0;
}

.transparent_caption {
	position: absolute;
	left: 0;    bottom: 0;
	padding: 2%;
	font-size: 150%;width: auto;width: 100%;
	color: #fff;
	border-bottom: 5px solid #e2b327;
}
.t_c_b_b_r {
	border-bottom: 5px solid #bf4303;
}
.t_c_b_b_b {
	border-bottom: 5px solid #0c2f7f;
}

.transparent_caption_dai {
	position: absolute;
	left: 0;    bottom: 10%;
	padding: 2%;
	font-size: 150%;width: 100%;
	color: #fff;
	border-bottom: 5px solid #e2b327;
}
.transparent_caption_txt {
	font-size: 60%;padding: 1%;
	color: #fff;
}

.schedule_box {
background-color: rgba(0, 0, 0, 0.0);
padding: 2%;border: 1px solid #fff;text-align:center;margin: 2%;
}

.report_box {
background-color: rgba(0, 0, 0, 0.0);
padding: 2%;border: 1px solid #fff;text-align:center;margin: 1%;font-size: 80%;
}


.schedule_box p {
font-size: 150%;
}
.box_red{
background-color: rgba(230,0,18,0.5);
}
.box_blue{
background-color: rgba(0,82,152,0.5);
}
.box_yellow{
background-color: rgba(254,238,2,0.5);
}
.box_green{
background-color: rgba(102,204,51,0.5);
}
.box_white{
background-color: rgba(255,255,255,0.3);
}
.box_orange{
background-color: rgba(255,165,0,0.5);
}
@media screen and (min-width: 1024px) {
.report_box {
padding: 5%;margin: 2%;font-size: 100%;
}
.transparent::before {
  background: linear-gradient(rgba(0,0,0,0) 0, rgba(0,0,0,0) 50%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0.8) 100%); /* 徐々に透明にする */
}
.transparent_caption_txt {
	font-size: 70%;padding: 2%;
}
}
.transparent img{
 transition:1s all;width: 100%;
}
.transparent_box a:hover img{
  transform:scale(1.2,1.2);
  transition:1s all;
}
/*.transparent img:hover{
  transform:scale(1.2,1.2);
  transition:1s all;
}*/

/**/
.heading-33 {
    border-bottom: 3px solid #000000;
}

.heading-33 span {
    display: inline-block;
    position: relative;
    padding: 0 .4em .2em;
    color: #ffffff;
}

.heading-33 span::before {
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #ffffff;
    content: '';
}
.heading-2 {
    padding:0 .0em .2em ;
    border-bottom: 1px solid #fff;
    background-color: none;
    color: #fff;font-size: 120%;margin-bottom: 2%;
}

.heading-2 {
    padding:0 .0em .2em ;
    border-bottom: 1px solid #fff;
    background-color: none;
    color: #fff;font-size: 100%;margin-bottom: 2%;
}
@media screen and (min-width: 999px) {
.heading-2 {
    font-size: 120%;
}
}
.heading-2-end {
 margin-top: auto;
} 
.example{
    /*コレ*/display: flex;
    /*コレ*/justify-content: flex-end;
    /*コレ*/align-items: flex-end;
   /* height: 100px;
    border: 1px solid #333;
    background: none;*/
}
.example>div{
    /*border: 1px solid #333;*/
    background: #66cc33;padding:.5em 1em ;text-align:center
}
.heading08 {
	font-size: 32px;
	text-align:left
}

.heading08 span {
	display: flex;
	align-items: center;
	color: #498ee0;
	font-size: 18px;
	text-transform: uppercase;
}

.heading08 span::before {
	content: '';
	display: inline-block;
	margin-right: 20px;
	width: 40px;
	height: 1px;
	background-color: #498ee0;
}

.heading09 {
	font-size: 130%;text-align:left
}

.heading09::before {
	content: attr(data-en);
	display: block;
	color: #fff;
	font-size: 22px;
}

.heading09::after {
	content: '';
	display: block;
	width: 120px;
	height: 1px;
	background-color: #fff;
}


.heading20 {
	font-size: 30px;
	font-weight: bold;
	display: flex;
	align-items: center;color: #498ee0;
}
.heading20 span {
	font-size: 30px;
	font-weight: bold;color: #000;
}
.heading20 span::before {
	content: "｜";
	font-size: 30px;
	margin: 0 14px;
}

.heading21 {
  font-weight: bold;
  padding-bottom: 0.5em;
  text-align: center;
  position: relative;font-size: 2.2em;margin: 40px 0;
}
.heading21::after {
  content: '';
  background-color: #498ee0;
  width: 2em;
  height: 5px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.heading21-1 {
  font-weight: bold;
  padding-bottom: 0.5em;
  text-align: center;
  position: relative;font-size: 2.2em;margin: 10px 0 24px;
}
.heading21-1::after {
  content: '';
  background-color: #498ee0;
  width: 2em;
  height: 5px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.heading22 {
  position: relative;
  display: inline-block;
  padding: 0 55px;
}

.heading22:before, .heading22:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color: #fff;
}

.heading22:before {
  left:0;
}
.heading22:after {
  right: 0;
}

.heading22-left {
  position: relative;
  display: inline-block;
  padding: 0 55px; font-size:2.5em;
}

.heading22-left:before {
  content: '';
  position: absolute;
  top: 55%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color: #66cc33;
}

.heading22-left:before {
  left:0;
}
.heading-6 {
    display: inline-block;
    position: relative;
    padding: 0 2.5em;
    color: #fff;text-align: center;margin: 10px  auto;
}

.heading-6::before,
.heading-6::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 50%;
    width: 45px;
    height: 3px;
    background-color: #66cc33;
}

.heading-6::before {
    left: 0;
}

.heading-6::after {
    right: 0;
}
.articletitle {
color:#333;
text-align : center;padding: 14px 20px;

border:solid 1px #ddd;text-align : left;font-size : 120%;border-top: 3px solid #f7ac1b;margin:0 0 12px 0;
  background: #eee;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
    background: -moz-linear-gradient(top,  #fff,  #eee);
    padding: 10px 8px;
  -pie-background:linear-gradient(top,  #fff,  #eee);
  background: -ms-linear-gradient(top,  #fff,  #eee); /* IE10+ */clear: both;
}
.articletitle a {
color:#333;
}
.articletitle span {
  border-left:10px #f7ac1b solid;
  padding-left:13px;
}
.articletitle-c {
  font-weight: bold;
  padding: 1% 4em;
  width: fit-content;
  margin: 20px auto;
  text-align: center;
  position: relative;font-size : 200%;color: #fff;line-height: 1.2;
}
.articletitle-c::before, .articletitle-c::after {
  content: '';
  background: #f7ac1b;
  width: 3em;
  height: 1px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.articletitle-c::before {
  left: 0;
}
.articletitle-c::after {
  right: 0;
}

.schedule{
  font-style: italic;
  font-weight: bold;font-size:600%;
}

.articletitle-bg_red {
  font-weight: bold;
  padding: 0.5em 1em;
  width: fit-content;
  margin: 0px auto;
  text-align: center;
  position: relative;font-size : 200%;color: #fff;line-height: 1.5;
  
 background-color: rgba(230,0,18,0.5); 
/*background-color: rgba(102,204,51,0.5);*/
}

.articletitle-bg_green {
  font-weight: bold;
  padding: 0.5em 1em;
  width: fit-content;
  margin: 0px auto;
  text-align: center;
  position: relative;font-size : 200%;color: #fff;line-height: 1.5;
  
background-color: rgba(102,204,51,0.75);
}

.articletitle-bg_orange {
  font-weight: bold;
  padding: 0.5em 1em;
  width: fit-content;
  margin: 0px auto;
  text-align: center;
  position: relative;font-size : 200%;color: #fff;line-height: 1.5;
  
background-color: rgba(247,172,27,0.75);
}

.heading-23-gradient {
    padding: .5em .7em;margin: 30px auto 18px;
    background: linear-gradient(to right, #d18e04, #f7ac1b);box-shadow: 0px 0px 12px #f7ac1b; 
    color: #ffffff;
 
}
.heading-23-gradient2 {
    padding: .5em .7em;

    background: linear-gradient(to right, #e60020, #ea545d);box-shadow: 0px 0px 12px #ea545d; 
    color: #ffffff;
}

.articletitle_underline3{
    padding: 0.1rem 0 0.5rem;
    margin-bottom: 0.1rem;
    font-weight: bold;
    font-size: 26px;
    border-bottom: 1px solid #fff;line-height : 1.5;
}

@media (max-width: 768px) {
.heading22-left {
	position: static;display: block;
font-size:2.0em;

text-align:center
}
.heading22-left:before {
position: static;
  width: 0px;
  height: 0px;
}
.articletitle-c {
font-size : 150%;
}
.articletitle-bg_red {
font-size : 150%;
}
.articletitle-bg_green {
font-size : 150%;
}
.articletitle-bg_orange {
font-size : 150%;
}

.schedule{
font-size:300%;
}

.articletitle_underline3{ 
font-size : 120%;
}
}

@media (max-width: 480px) {

.articletitle-c {
font-size : 120%;
}


}

#top_bg {
background:#090d11 ;margin: 0px 0px 0px;height: auto;padding: 5% 5%;

}

#top001_bg {
background:#fff url("../images/topimg/001-w.png") ;margin: 0px 0px 0px;height: auto;
	background-position:center 100%;
	background-size: cover;
	display: flex;
	/*align-items: center;*/
	justify-content: center;
	background-attachment: fixed;position: relative;z-index:1;flex-direction: column;
}
/*#top001_bg::after { background-color: rgba(255, 255, 255, 0.2); background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 50%, transparent 50%), linear-gradient(rgba(255, 255, 255, 0.1) 50%, transparent 50%); background-size: 2px 2px; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; content: ""; z-index: 2; }*/
#top001_bg::after { background-color: rgba(0, 0, 0, 0.2); background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.2) 50%, transparent 50%), linear-gradient(rgba(0, 0, 0, 0.2) 50%, transparent 50%); background-size: 2px 2px; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; content: ""; z-index: 2; }

@media screen and (max-width: 1000px) {
#top001_bg{
/*height: 300px;*/	background-size: cover;background-position:30% 20%;background-attachment: scroll;
}
}

#top002_bg {
background:#fff url("../images/topimg/04.jpg") ;margin: 0px 0px 0px;height: auto;
	background-position: center 100%;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
	background-attachment: fixed;position: relative;z-index:1;flex-direction: column;
}
#top002_bg::after { background-color: rgba(0, 0, 0, 0.5); background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.5) 50%, transparent 50%), linear-gradient(rgba(0, 0, 0, 0.5) 50%, transparent 50%); background-size: 2px 2px; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; content: ""; z-index: 2; }


@media screen and (max-width: 1000px) {
#top002_bg{
/*height: 300px;*/	background-size: cover;background-position:30% 20%;background-attachment: scroll;
}
}

.topimg_bg {
margin: 0px;height: auto;width: 100%;min-height: 250px;
	display: flex;
	/*align-items: center;*/
	justify-content: center;
	text-align: left;flex-wrap: wrap;flex-direction: column;position: relative;z-index:1;

}

.topimg_bg::after { background-color: rgba(0, 0, 0, 0.5); background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.5) 50%, transparent 50%), linear-gradient(rgba(0, 0, 0, 0.5) 50%, transparent 50%); background-size: 2px 2px; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; content: ""; z-index: 2; }

@media (max-width: 768px) {
}

@media (max-width: 480px) {
.topimg_bg {
min-height: 150px;
}
}


.button_map {
	display: inline-block;
	width: 70%;
	height: auto;
	text-align: center;
	text-decoration: none;
	/*line-height: 50px;*/
	outline: none;
	font-size: 16px;
		position: relative;
	z-index: 2;
	background-color: #000;
	border: 1px solid #fff;
	color: #fff;
	vertical-align:middle;padding: 2% 2% ;

}
.button_map::before, .button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button_map, .button_map::before, .button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button_map:hover {
	background-color: #fff;
	border-color: #000;
	color: #000;
}
.button_map::before, .button::after {
	top: 0;
	width: 50%;
	height: 100%;
	background-color: #000;
}
.button_map::before {
	right: 0;
}
.button_map::after {
	left: 0;
}
.button_map:hover::before, .button_map:hover::after {
	width: 0;
	background-color: #000;
}


.button_map_green {
	background-color: #66cc33;border: none;width: 70%;

}
.button_map_green::before, .button::after {
	background-color: #66cc33;
}

@media screen and (max-width: 1000px) {
.button_map {
	width: 100%;
}
}

/* fadeInTop */
.fadeInTop {
    animation: fadeInTop 1.5s ease 0s 1 normal;
}
.fit {

}
.fit_02 {
    animation: fadeInTop 1.5s ease 0.3s 1 normal;
}
.fit_03 {
    animation: fadeInTop 1.5s ease 0.6s 1 normal;
}

@keyframes fadeInTop {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
  }
}

/* fadeInLeft */
.fadeInLeft {

}
.fil {

}
.fil_01 {
    animation: fadeInLeft 1.5s ease 0.0s 1 normal;
}
.fil_02 {
    animation: fadeInLeft 1.5s ease 0.3s 1 normal;
}
.fil_03 {
    animation: fadeInLeft 1.5s ease 0.6s 1 normal;
}
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
  }
}

/* fadein-scroll */

.fadein-scroll {
    opacity: 0;
    transform: translate(0,0);
    transition: all 2.5s;
  &.fadein-left{
      transform: translate(-30px,0);
  }
  &.fadein-right{
      transform: translate(30px,0);
  }
  &.fadein-up{
      transform: translate(0,-30px);
  }
  &.fadein-bottom{
      transform: translate(0,30px);
  }
  &.scrollin{
    opacity: 1 !important;
    transform: translate(0, 0) !important;
  }
}

/* fadein-top */
.fadein-top-bg {
	animation: fadein 2s forwards;
}
.fadein-top-l {
	animation: fadein 6s forwards;
}
.fadein-top-r {
	animation: fadein 10s forwards;
}


@keyframes fadein {
	0% {opacity: 0}
	100% {opacity: 1}
}


.matrix .bg-wrap,
.matrix .bg-wrap .inn {
  display: block;color: #fff;
}
 
.matrix .bg-wrap {
  overflow: hidden;
  opacity: 0;
}
 
.matrix .bg-wrap + .bg-wrap {
  margin-top: 10px;
}
 
.matrix .bg-wrap .inn.large {
  font-size: 36px;
  font-weight: bold;
}
.matrix .bg-wrap .inn.small {
  font-size: 15px;
}
 
.matrix .bg-wrap .inn {
  opacity: 0;
  transform: matrix(1, 0, 0, 1, 0, 100);
  transition: 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}
 
.matrix.is-animated .bg-wrap {
  opacity: 1;
}
 
.matrix.is-animated .bg-wrap .inn {
  opacity: 1;
  transform: matrix(1, 0, 0, 1, 0, 0);
}


/*フォント*/
.ft-60 {
  font-size: 60%;
}
.ft-70 {
  font-size: 70%;
}
.ft-80 {
  font-size: 80%;
}
.ft-90 {
  font-size: 90%;
}
.ft-100 {
  font-size: 100%;
}
.ft-110 {
  font-size: 110%;
}
.ft-120 {
  font-size: 120%;
}
.ft-130 {
  font-size: 130%;
}
.ft-150 {
  font-size: 150%;
}
.ft-170 {
  font-size: 170%;
}
.ft-180 {
  font-size: 180%;
}

.ft-170 br {
line-height: 170%;
}
.fh-200 br {
line-height: 200%;
}

.ft-normal {
  font-weight:normal;
}
.ft-bold {
	font-weight:bold;
}


.ft-orange {
color: #ee7700;
}
.ft-red {
color: #ff0000;
}
.ft-w {
color: #fff;
}
.ft-k {
color: #000;
}
.ft-yellow  {
color: #d4b02d;
}

.ft-red {
  color:#D71920;
}
.ft-center{
  text-align: center;
}
.ft-left{
  text-align: left;
}
.ft-right{
  text-align: right;
}
.ft-red-b {
  color:#D71920;font-weight:bold;
}
.ft-yellow  {
  color:#ffff00;
}
.ft-gray {
  color:#b4b4b4;
}
.ft-black {
  color:#333;
}
.ft-yellow-b {
  color:#ffff00;font-weight:bold;
}
.ft-skyblue  {
  color:#00ffff;
}
.ft-skyblue-b {
  color:#00ffff;font-weight:bold;
}
.ft-blue  {
  color:#004098;
}
.ft-blue-b {
  color:#004098;font-weight:bold;
}
.ft-navy  {
  color:#000024;
}
.f-tnavy-b {
  color:#000024;font-weight:bold;
}


@media screen and (max-width: 1000px) {
.ft-130, .ft-150 {
  font-size: 110%;
}
.ft-170, .ft-180 {
  font-size: 130%;
}
#example1 p.ft-tb-r {	
  font-size: 80%;
}
#example1 h1.ft-180 {	
  font-size: 130%;
}
}

hr {
	margin: 0px;
	padding: 0px;
	height: 0px;
	border: 0px;clear:both;
}
.hr_b10 {
    	margin-bottom: 10%;
}

.hr_section {

  border-top: 2px dotted #777;
    	margin: 6% 0;
}

.hr_section2 {
	background-color: #fff;
  border-top: 2px dotted #bbb;
  	margin: 24px 0;
}

.hr_section3 {
	/*position: relative;
	overflow: visible;*/
	text-align: center;
	/*color: #f06292;
	border-width: 3px 0 0 0;
	border-style: double;
	border-color: #f06292;*/
	/*margin: 24px 0 48px 0;*/
	padding :52px 0;
	margin:24px 0;
}

.hr_section3::after {
	/*position: absolute;
	top: -0.7em;
	left: 50%;*/
	display: inline-block;
	content: '';
	/*background:#fff url("../images/icon_logo.png") no-repeat;*/
	
	content: url(../images/icon_logo.png);

    vertical-align: middle;
    -webkit-transform: scale(0.7);
    transform: scale(0.7);

}

.hr_section4 {
	position: relative;
	overflow: visible;
	text-align: center;
	/*color: #f06292;
	border-width: 3px 0 0 0;
	border-style: double;
	border-color: #f06292;*/
	margin: 48px 0 48px 0;
      border-top: dotted 6px #f1b718;
}

.hr_section4::after {
	position: absolute;
	top: -2.0em;
	left: 50%;
	display: inline-block;
	content: '';
	/*background:#fff url("../images/icon_logo.png") no-repeat;*/
	
	content: url(../images/icon_logo.png);

    vertical-align: middle;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
}

.hr_section5 {
	text-align: center;
	margin: 48px 0 48px 0;
      border-top: dotted 6px #f1b718;
}

.hr_section5::after {

	display: inline-block;
	content: '';
	/*background:#fff url("../images/icon_logo.png") no-repeat;*/
	
	content: url(../images/icon_logo.png);

    vertical-align: middle;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
	margin-top: -34px;
}

.hr_section6 {
	text-align: center;
	margin: 48px 0 48px 0;
      border-top: dotted 2px #f1b718;
}

.hr_section6::after {

	display: inline-block;
	content: '';
	/*background:#fff url("../images/icon_logo.png") no-repeat;*/
	
	content: url(../images/icon_logo6.png);

    vertical-align: middle;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
	margin-top: -34px;
}

.hr_section7 {
	text-align: center;
	margin: 48px 0 48px 0;
      border-top: dotted 4px #f1b718;
}

.hr_section7::after {

	display: inline-block;
	content: '';
	/*background:#fff url("../images/icon_logo.png") no-repeat;*/
	
	content: url(../images/icon_logo4.png);

    vertical-align: middle;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
	margin-top: -34px;
}



.hr_section8 {
	line-height: 1em;
	position: relative;
	outline: 0;
	border: 0;
	color: black;
	text-align: center;
	height: 1.5em;
	opacity: .5;
}
.hr_section8:before {
	content: '';
	background: -webkit-linear-gradient(left, transparent, #818078, transparent);
	background: linear-gradient(to right, transparent, #818078, transparent);
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	height: 1px;
}
.hr_section8:after {
	content: attr(data-content);
	position: relative;
	display: inline-block;
	color: black;
	padding: 0 .5em;
	line-height: 1.5em;
	color: #818078;
	background-color: #fcfcfa;
}

.eventlist li {
  border-bottom: 2px dotted #555;
  	padding: 40px 0;
}

/* イベントテーブル2
---------------------------------------------------- */
.table-event2 {
  margin: 5px 0px auto;

  border-spacing: 1px;
  width: 100%;
  font-size: 100%;
}

.table-event2 th {
  padding: 10px;
  /*border-right: 1px solid #c7ddf3;*/border-left: 1px solid #cccccc;border-right: 1px solid #cccccc;
  border-bottom: 1px solid #c7ddf3;
  background: #66cc33;
    color:#fff; font-weight:bold; 
}
.table-event2 td {
  padding: 10px;

  /*border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;*/
  border: 1px solid #cccccc;
  color: #333333;
  background: #ffffff;white-space: nowrap;
}
table.table-event2 a:link{
text-decoration:none; color:#222;text-decoration:underline;
}
table.table-event2 a:visited{
text-decoration:none; color:#222;
}
table.table-event2 a:hover{
color:#c4161c;text-decoration:none;
}
table.table-event2  tr:hover td {
  background: #C0DD98;  /* 列のハイライト色 */
}
table.table-event2 a[target^="_blank"]{
	padding-right:20px;
	background:url(../images/link_blank.gif) right center no-repeat;	
}
@media screen and (min-width: 999px) {
.table-event2 {
  width: 95%;
}
}

/* 加盟店
---------------------------------------------------- */
/*プロフ*/
table.list {
  border-top: 1px solid #ccc;
  width: 100%;
  border-collapse: collapse;
  font-size:90%;
}

table.list tr {
  
}

table.list td {
  border: none;
  text-align: left;
  vertical-align: middle;
  padding: 16px 2%;background-color: #fff;color:#333;border: 1px solid #ccc;
}
table.list td:first-child {
  background: #D6E7C3;  /* 一列目のセルの色 */width: 35%;
}
table.list th {
  text-align: center;
  padding: 16px;color:#333;

  font-weight:bold;
  background-color:#A4C566; font-size: 130%;border: 1px solid #ccc;
}
table.list a:link{
text-decoration:none; color:#222;
}
table.list a:visited{
text-decoration:none; color:#222;
}
table.list a:hover{
text-decoration:underline;color:#c4161c;
}

/*マウスオーバしたセルのスタイル  */
table.list tr:hover td {
  background: #C0DD98;  /* 列のハイライト色 */
}

table.list a[target^="_blank"]{
	padding-right:20px;
	background:url(../images/link_blank.gif) right center no-repeat;	
}

@media screen and (max-width:600px) { /*600px以下(スマホ用)*/
table.list {
  border-top:none;
}
table.list tr {
border-bottom: none;
}
table.list td:first-child {
 /* 一列目のセルの色 */width: 100%;border:none;
}
table.list th, table.list td {
display: block;
width: 100%;
max-width: 100%; /*スマホ画面ほぼ一杯に広がる感じ*/
padding: 10px 5px;
border:none;/*text-align: left;*/
}
}


/*プロフ*/
table.prof {
  border-top: 1px solid #ccc;
  width: 95%;
  border-collapse: collapse;
  font-size:90%;
}

table.prof tr {
  
}

table.prof td {
  border: none;
  text-align: left;
  vertical-align: middle;
  padding: 16px 2%;background-color: #fff;color:#333;border: 1px solid #ccc;
}
table.prof td:first-child {
  background: #f7691b;  /* 一列目のセルの色 */width: 20%;
}
table.prof th {
  text-align: center;
  padding: 16px;color:#333;

  font-weight: normal;/*bold*/
  background-color:#f7ac1b; font-size: 110%;border: 1px solid #d6d6d7;
}
table.prof a:link{
text-decoration:none; color:#222;
}
table.prof a:visited{
text-decoration:none; color:#222;
}
table.prof a:hover{
text-decoration:underline;color:#c4161c;
}

/*マウスオーバしたセルのスタイル  */
table.prof tr:hover td {
  background: #f6ca73;  /* 列のハイライト色 */
}

@media screen and (max-width:600px) { /*600px以下(スマホ用)*/
table.prof {
  border-top:none;
}
table.prof tr {
border-bottom: none;
}
table.prof td:first-child {
 /* 一列目のセルの色 */width: 100%;border:none;
}
table.prof th, table.prof td {
display: block;
width: 100%;
max-width: 100%; /*スマホ画面ほぼ一杯に広がる感じ*/
padding: 10px 5px;
text-align: left;border:none;
}
}


/*===========
.scroll-box
===========*/

.scroll-box {
  max-width: 1200px;
  height: 100%;
  overflow-x: auto;
  overflow-y: auto;
  padding-right: 10px;
  padding-bottom: 10px;
  -webkit-overflow-scrolling: touch;margin-bottom: 24px;
}

.scroll-box.h700 {
  height: 700px;
}

@media only screen and (max-width: 480px) {
.scroll-box {
  max-width: 970px; height: 500px;
}

.scroll-box.h700 {
  height: 400px;
}
}

/*===========
scrollbar
===========*/

/*スクロールバー全体の高さ*/

.scroll-box::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

/*スクロールバー全体の背景*/

.scroll-box::-webkit-scrollbar-track {
  background: #eee;
}

/*スクロールバーの動く部分*/

.scroll-box::-webkit-scrollbar-thumb {
  background: #aaa;
  border: none;
}

/*スクロールバーの動く部分のホバー（マウスオーバー）*/

.scroll-box::-webkit-scrollbar-thumb:hover {
  background: #999;
}




@media print {
    a[href]:after {
      content:"[" attr(href) "]";
      font-size:93%;
      color:#999;
    }
}

/**/

.gallery_box  {
	background-color: rgba(255, 255, 255, 0.7);
	/*box-shadow:0 2px 5px rgba(0, 0, 0, 0.3);*/
    cursor:pointer;position:relative;padding : 3%;color: #000;
}
.gallery_box p  {
    overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  padding : 0;
}
.gallery_box-img {
 margin-top: auto;
  }
.gallery_box h3 {
 margin: 0.5em 0.5em 0;
  }
.gallery_box span {
 margin: 0 0.5em 0.5em;
  }
.gallery_box-img-in {
  width: 100%;
  padding-top: 52.5%;/*he is my hero*/
  }
.gallery_box-img img:hover{
transform:scale(1.2);
}
.gallery_box a {
text-decoration: none;
color: #000;
}


.gallery_box-img {
    overflow:hidden;
}
 
.gallery_box-img img {
        transition:transform 0.3s;
}
 
.gallery_box-img img:hover{
        transform:scale(1.2);
}
/**/

/*　YouTubeのiframeをレスポンシブに　*/
.youtube{
  width: 100%;
  position: relative;
  padding-top: 56.25%;
}
.youtube iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}


/* YouTubeを幅100%で埋め込む */
.iframe-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* アスペクト比16:9の場合 */
    padding-top: 0px;
    height: 0;
    overflow: hidden;
    margin-bottom: 2rem; /* YouTubeの下に余白をつける */
	margin-top: 0px;/*36*/
}
.iframe-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* =======================================
	wordpress追加
======================================= */
/****************************************

          Main

*****************************************/

#main .post,
#main .page{
	overflow: hidden;
	margin-bottom: 59px;
	border-bottom: 1px solid transparent;
}

.sticky{
	/* 先頭固定ポストのスタイル */
}

.post-meta{
	margin-bottom: 1.5em;
}
	.post-meta .post-date,
	.post-meta .category{
		padding-right: 1em;
	}
	.comment-num{ white-space: nowrap; }

.more-link{
	float: right;
}

.navigation{
	overflow: hidden;
	margin-bottom: 40px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	background: url(images/gray.gif) repeat-y 50% 0;
}
	.navigation > div{
		width: 50%;
	}

@media screen and (max-width: 767px) {
	.navigation > div{
		width: 100%;
	}
}

	.navigation .alignright{
		text-align: right;
	}

	.navigation a{
		display: block;
		padding: 1em;
		border: none;
	}
		.navigation a:hover{
			background: #feebbe;
			color: #000;
		}
			.navigation .alignright a:hover{
				border-left: 1px solid #ddd;
			}

.footer-post-meta{
	margin-top: 40px;
	text-align: right;
}
	.post-author{ padding-left: 1em; }

.page-link{
	margin: 3em 0;
}
.comment-page-link{
	margin: 0 0 3em;
}

	.page-link span,
	.comment-page-link span,
	.comment-page-link a{
		display: inline-block;
		margin-right: 3px;
		padding: 5px 8px;
		border: 1px solid #ddd;
		background: #ddd;
	}
		.page-link a span,
		.comment-page-link a{
			background: #fff;
		}
	
	.page-link a{
		border-bottom: none;
		color: #000;
	}
	
	.page-link a span:hover,
	.comment-page-link a:hover{
		background: #ffeff7;
		color: #000;

	}


/****************************************

          Comments Area

*****************************************/

#comment-area h3{
	font-size: 150%;
	font-family: 'Josefin Sans', sans-serif;
}

.required{ color: #fe56aa;}

.commets-list,
.trackback-list{
	overflow: hidden;
	margin-top: -20px;
	margin-bottom: 40px;
}
	.commets-list li,
	.trackback-list li{
		overflow: hidden;
		margin-top: -1px;
		padding: 20px 0 0;
		width: 100%;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid transparent;
	}
		.commets-list .avatar{
			float: left;
			padding-right: 10px;
			padding-bottom: 10px;
		}

		.comment-meta,
		.reply,
		.comment-notes,
		.form-allowed-tags,
		span.small{
			font-size: 80%;
		}

		.comment-body p{
			clear: both;
		}
		.reply{
			text-align: right;
		}

.bypostauthor{
	/* 記事投稿者のコメントのスタイル */
}

.children{
	padding-left: 2em;
}

#respond{
	margin-bottom: 40px;
}

/****************************************

          index.php Main

*****************************************/

.content-box{
	float: right;
	margin-top: -0.25em;
	width: 420px;
}
	.content-box .more-link{
		margin: 0;
	}

.thumbnail-box{
	float: left;
	width: 160px;
}
	.thumbnail-box img{
		width: 160px;
		height: 160px;
	}


/****************************************

          Sidebar

*****************************************/

#sidebar_top p{
	padding:10px;font-size: 14px;
	color:#333;line-height: 150%;/*letter-spacing: -0.05em;*/
}



/****************************************

          Footer

*****************************************/

#footernavi{
	padding: 10px 0;
	font-size: 80%;/*border-bottom:1px solid #ddd;*/
}
#footernavi a{
	color:#fff;
}
#cp{
	padding: 5px 0 20px 0;
	font-size: 80%; text-align: right;
}
#cp_prof{
	padding: 0px 0;
	font-size: 90%; text-align: left;line-height: 170%;
}

/****************************************

          Form

*****************************************/

input[type="text"],
input[type="password"],
input[type="email"],
input[type="search"],
textarea {
	margin: 0;
	margin-bottom: 20px;
	padding: 6px 4px;
	max-width: 100%;
	width: 290px;
	outline: none;
	border: 1px solid #ddd;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	background: #eee;
	color: #777;
	vertical-align: bottom;
	font-size: 13px;
}

#comment-area input[type="text"],
#comment-area textarea{
	display: block;
}

textarea {
	overflow: auto;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus {
	border: 1px solid #ee7702/*ff69b4*/;
	background: #fff;
	-webkit-box-shadow: 0 0 3px rgba(255,105,180,1);
 	-moz-box-shadow: 0 0 3px rgba(255,105,180,1);
	box-shadow:  0 0 3px rgba(255,105,180,1);
 	color: #444;
}

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
	display: inline-block;
	margin-bottom: 20px;
	padding: 4px 12px;
	padding: 8px 10px;
	border: 1px solid #b15e0c/*fe56aa*/;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background: #e68e38/*ff89c4*/;
	color: #333;
	text-decoration: none;
	text-shadow: 0 1px rgba(255, 255, 255, .75);
	font-weight: bold;
	font-size: 12px;
	line-height: normal;
	cursor: pointer;
	/* Old browsers */
}

	.button:hover,
	button:hover,
	input[type="submit"]:hover,
	input[type="reset"]:hover,
	input[type="button"]:hover {
	  	border: 1px solid #b15e0c/*fe56aa*/;
		background: #f47f0d/*ff89c4*/;
		color: #fff;
	  	text-shadow: 0 -1px rgba(0, 0, 0, .4);

	}

	.button:active,
	button:active,
	input[type="submit"]:active,
	input[type="reset"]:active,
	input[type="button"]:active {
		position: relative;
		top:1px;
	}


/****************************************

          WordPress Misc

*****************************************/

.aligncenter {
	display: block;
	margin-right: auto;

	margin-left: auto;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}
@media screen and (max-width: 767px) {
.alignleft {
	float: none;
}

.alignright {
	float: none;
}
}
.wp-caption {
	margin: 10px;
	padding-top: 4px;
	border: 1px solid #ddd;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color: #f3f3f3;
	text-align: center;
}

.wp-caption-text,
.gallery-caption{
	font-size: 80%;
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption-dd {
	margin: 0;
	padding: 0 4px 5px;
	font-size: 11px;
	line-height: 17px;
}

img.alignright {
    display: inline-block;
    margin: 0 0 0 0 /*1em 1.5em*/;
}


img.alignleft {
    display: inline-block;
    margin: 0 /*1.5em 1em*/ 0 0 0;
}


/****************************************

          Clearfix

*****************************************/

#container:after,
#header .menu- > ul:after,
#header ul.menu:after,
.clearfix:after {
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	content: " ";
	font-size: 0;
}

/* clearfix for ie7 */
#container,
#header .menu- > ul,
#header ul.menu,
.clearfix {
	display: inline-block;
}

#container,
#header .menu- > ul,
#header ul.menu-,
.clearfix {
	display: block;
}

#searchform{
	position: relative;margin:30px auto 10px;
	/*margin-top:30px;*/width: 80%;max-width: 300px;
}
	#s{
		padding: 6px 20% 6px 5%;
		width: 75%;
		-webkit-border-radius: 25px;
		-moz-border-radius: 25px;
		border-radius: 25px; 
		font-size: 10px;
	}
	#searchsubmit{
		position: absolute;
		top: 0;
		right: 0;
		width: 30px;
		height: 26px;
		border: none;
		background: url(../images/search.png) no-repeat 50% 50%;
	}


/****************************************

          sidebar

*****************************************/
#sidebar {
	/*float: right;
	width: 210px;/*320*/
	/*background: #fff;border:1px solid #ddd;padding: 6px;*/
	/*outline:solid 1px #dcdddd;border-bottom: 1px solid transparent;*/
	/*margin-bottom: 29px;	
	background: none;text-align : left;*/
}
/*#sidebar img{
	margin: 0px;padding:0px;
}*/




/*#sidebar .widget {
	margin-bottom: 15px;
}

#sidebar .widget p{
	padding:0 10px;font-size: 12px;
	color:#333;line-height: 130%;letter-spacing: -0.05em;
}

#sidebar .widget ul{
	padding:0 10px;font-size: 12px;
	list-style-position: outside;
	list-style-type: none;color:#333;
}
#sidebar .widget_search {
	padding:0 10px;
}
#sidebar_top {
	float: left;
	width: 320px;
}

#main,
#sidebar{
	margin-bottom: 59px;
	border-bottom: 1px solid transparent
}

#sidebar a {
	font-weight:bold;
	text-decoration: underline;
}*/

#sidebar .widget {
	padding:0 0 24px 0;margin-bottom: 24px;margin-top: 0px;clear: both;
}


#sidebar .widget {
background:#fff;border:solid 1px #dcdddd;border-top:none;
}


#sidebar .widgettitle a {
color:#fff;
}
#sidebar .widgettitle {
	margin:0 0 10px 0;font-size: 1em;
	padding:12px 10px;
	background: #1d8ade; /* Old browsers */
	background: -moz-linear-gradient(left, #1d8ade 0%, #53a2e2 50%, #1d8ade 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#1d8ade), color-stop(50%,#53a2e2), color-stop(100%,#1d8ade)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, #1d8ade 0%,#53a2e2 50%,#1d8ade 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, #1d8ade 0%,#53a2e2 50%,#1d8ade 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(left, #1d8ade 0%,#53a2e2 50%,#1d8ade 100%); /* IE10+ */
	background: linear-gradient(left, #1d8ade 0%,#53a2e2 50%,#1d8ade 100%); /* W3C */
	color:#FFF;
	text-shadow:1px 1px 2px #333;
	box-shadow:0 2px 3px rgba(0, 0, 0, 0.4) , inset 0 0 50px rgba(0, 0, 0, 0.1) ;
	position:relative;
	color:#fff;
	}
 
#sidebar .widgettitle:before,
#sidebar .widgettitle:after{
	content: ' ';
	position: absolute;
	z-index: -1;
	width: 40%;
	height: 20px;
	left: 4px;
	bottom:7px;
	-webkit-box-shadow: 0 8px 15px rgba(0,0,0, 0.7);
	-moz-box-shadow: 0 8px 15px rgba(0, 0, 0, 0.7);
	box-shadow: 0 8px 15px rgba(0, 0, 0, 0.7);
	background-color: #F00;
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	transform: rotate(-3deg);
}
#sidebar .widgettitle:after{
	  -webkit-transform: rotate(3deg);
	  -moz-transform: rotate(3deg);
	  -o-transform: rotate(3deg);
	  -ms-transform: rotate(3deg);
	  transform: rotate(3deg);
	  right: 10px;
	  left: auto;
}
@media screen and (max-width: 767px) {
#sidebar .widgettitle { 
font-size : 130%;
}

}

.widgettitle {
color:#333;
text-align : center;padding: 14px 20px;

border:solid 1px #ddd;text-align : left;font-size : 120%;border-top: 3px solid #f7ac1b;margin:0 0 12px 0;
  background: #eee;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
    background: -moz-linear-gradient(top,  #fff,  #eee);
    padding: 10px 8px;
  -pie-background:linear-gradient(top,  #fff,  #eee);
  background: -ms-linear-gradient(top,  #fff,  #eee); /* IE10+ */clear: both;
}
.widgettitle a {
color:#333;
}

.widget p{
	padding:0 10px;font-size: 12px;
	color:#333;line-height: 130%;letter-spacing: -0.05em;
}

.widget ul{
	padding:0px;margin:0px 10px 24px;
}

.widget ul li{
display: inline-block;font-size: 20px;
	margin: 5px 10px 5px 0px;
	background: none;
-moz-border-radius: 6px; /* Firefox */  
   -webkit-border-radius: 6px; /* Safari and Chrome */  
   border-radius: 6px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */ 
   border:1px #f7ac1b solid;color: #f7ac1b;
   
}

.widget ul li a{
	color: #f7ac1b;display: block;padding: 10px 10px;text-align:center;
	min-width: 120px;height: auto;line-height: auto;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	
	max-width:260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.widget ul li a:hover {
text-decoration: none;color: #fff;background: #f7ac1b
}
.widget ul li img{
 float: left;
padding-top: 2px;
 padding-right: 10px;
}

.widget_archive ul li a{
	font-size: 55%;
	padding: 6px 6px;
	min-width: 60px;
	max-width:140px;
}


.widget_meta ul li a, .widget_recent_comments ul li a, .widget_recent_entries ul li a, .widget_categories ul li a{
	font-size: 55%;
	padding: 6px 6px;
	min-width: 60px;
	max-width:260px;
}

/*160418 select */

select{
	border:0;
	border:solid 1px #ccc;
	color:#444;
	margin:3px 0;
	padding:10px;
	width:300px;
	font-family:Arial, sans-serif;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
			border-radius: 3px;
}
/* 画面サイズが768px以下の場合に適用 */
@media only screen and (max-width: 768px) {
.widget ul  {margin: 0px;padding:0px;}
.widget ul li a{margin: 0px;padding:0px;}
	
.widget ul{
 margin: 0px 0 12px 0;
 }
.widget ul li {
width: 100%;padding: 0px;height: auto;margin: 0px 0px;border:none;

}
.widget ul li a {
	max-width:90%;
display: block;
position: relative;
padding: 10px 25px 10px 10px;height: 60px;line-height:60px;
border-bottom: 1px solid #D9D9D6;
background: none;
font-size: 14px;
font-weight: bold;
text-decoration: none;width: 90%;text-align:left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.widget ul li a:after {
display: block;
content: "";
position: absolute;
top: 50%;
right: 10px;
width: 6px;
height: 6px;
margin: -4px 0 0 0;
border-top: solid 2px #cdcdcd;
border-right: solid 2px #cdcdcd;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
}

.widget ul li a:hover {
text-decoration: none;color: #333;
}

}


.infobox_orenge {
width: 90%;border: 2px solid #bf7a39;margin: 10px;background: #f7ac1b;
}
.infobox_orenge p {
font-size: 110%;text-align: left;padding: 10px;line-height: 150%;margin:  0;color:#603500;font-weight:bold;
}


/* faq details */

.accordion-wrapper {
  display: grid;
  grid-auto-rows: min-content;
  row-gap: 16px;
}

summary {
  /* display: list-item;以外を指定してデフォルトの三角形アイコンを消します */
  display: block;
  /* Safariで表示されるデフォルトの三角形アイコンを非表示にします */
  &::-webkit-details-marker {
    display: none;
  }
}

.summary_inner {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  border: 1px solid #002255;/*d2beff*/
  font-weight: bold;
  color: #002255;
}

summary h3::first-letter {
  font-size: 1.5rem;
  font-weight: bold;
  color: brown;
}

.details-icon {
  display: block;
  position: relative;
  width: 24px;
  margin-left: 6px;
  flex-shrink: 0;
  transform-origin: center 43%;
  transition: transform 0.4s;

  /* アイコンのバーのスタイル */
  &::before,
  &::after {
    content: "";
    position: absolute;
    display: block;
    width: 15px;
    height: 3px;
    background-color: #002255;/*7050ff*/
  }
  &::before {
    left: 0;
    transform: rotate(45deg);
  }
  &::after {
    right: 0;
    transform: rotate(-45deg);
  }
}

/* is-openedクラスが付与されたときのスタイル */
details.is-opened .details-icon {
  transform: rotate(180deg);
}

/* --------アコーディオンの中身のスタイル-------- */
.content {
  overflow: hidden;
  /*background-color: #f0f2ff;*/color: #002255;

  /* details直下のタグにpaddingを設定すると挙動がおかしくなるので、ここには指定しない */
}

.content_inner {
  padding: 24px 48px;
  display: flex;
  flex-direction: column;
  gap: 16px;font-size: 1.2rem;
}
.content_inner p::first-letter {
  font-size: 1.5rem;
  font-weight: bold;
  color: brown;
}


/*メールフォーム
-------------------------------------------*/
#formWrap {
	width:100%;
	margin:0 auto;
	/*color:#555;*/
	line-height:1.5;
	font-size:100%;
}
table.formTable{
	width:100%;color:#555;
	margin:24px auto ;
	border-collapse:collapse;
}
table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:10px;
}
table.formTable th{
	font-weight:bold;
	background:#eae9e8;
	text-align:left;
}
table.formTable td{
	font-weight:normal;
	background:#fff;
	text-align:left;
}

table.formTable textarea{
width:90%;
}


#formWrap h3 {
	color:#555;
}
#formWrap h4 {
	color:#555;
}

/*動画
-------------------------------------------*/
div.vid_contents {
width: 100%;/*背景色を横幅いっぱいに広げる*/
text-align: center;
margin: auto 0px;
padding: 0;/*padding: 4% 4% 4% 4%;/*ここで動画の周りの余白を調整*/
background: none;/*background: #e6e6e6;/*余白の背景色*/
}
video.vid_main {
width: 100%;
max-width: 1100px;/*PC版での最大幅*/
}