@charset "UTF-8";

body { margin:0; font-family: 'verdana', sans-serif; color: #666; background: white; }

a { color: #ccc; text-decoration: none; }
a:visited { color: #ccc; }
a:hover { color: rosybrown; }
a:active { color: rosybrown; }


.wrapper{
    min-height: 100vh;
    position: relative;/*←相対位置*/
    box-sizing: border-box;/*←全て含めてmin-height:100vhに*/
}

header{
width: 100%;
background-color: aliceblue;
color: lightsteelblue;
text-align: center;
padding: 15px 0; 
border-bottom: 1px solid lightsteelblue; }

.headLSB{
width: 100%;
background-color: lightsteelblue;
color: white;
text-align: center;
padding: 15px 0; 
background-color: lightsteelblue;}

.headAB{
width: 100%;
background-color: aliceblue;
color: lightsteelblue;
text-align: center;
padding: 15px 0; 
border-bottom: 1px solid lightsteelblue; }

.headCB{
width: 100%;
background-color: cadetblue;
color: white;
text-align: center;
padding: 15px 0;
border-bottom: 1px solid #608f9f; }

.headX{
width: 100%;
background-color: #566777;
color: white;
text-align: center;
padding: 15px 0; }



.Nav { padding: 5px; } /* MySet */
/* ドロップダウンメニュー */
ul.navLSB {
   margin: 0px; /* メニューバー外側余白 */
   padding: 0px 0px 0px 10px; /* メニューバー内側余白 */
   background-color: white; /* バーの背景色 */
text-align: right; /*MySet */
}
ul.navLSB li {
   width: 120px;		 /* メニュー項目の横幅 */
   display: inline-block;	/* 横並び配置 */
   list-style-type: none;
   position: relative;	/* 重要 */
}
ul.navLSB a {
   background-color: lightsteelblue; 
   color: #efefef;
   line-height: 40px;
   text-align: center;
   text-decoration: none;
   display: block;
border: 1px solid lightsteelblue; /* MySet */
margin-bottom: 3px; /* MySet */
}
ul.navLSB a:hover {
   background-color: lightsteelblue;
   color: rosybrown;
}
   /* サブメニュー */
ul.navLSB li:hover ul {
   display: block;
}
ul.navLSB ul {
   margin: 0px;
   padding: 0px; 
   display: none; /* 重要（非表示にしておく） */
   position: absolute; /* 重要 */
}
ul.navLSB ul li {
   width: 120px; /* サブメニュー1項目の横幅 */
}
ul.navLSB ul li a {
   line-height: 35px; /* サブメニュー1項目の高さ */
   text-align: center;
   padding-left: 5px;
font-size: 90%;
}
ul.navLSB ul li a:hover {
background-color: lightsteelblue;
color: rosybrown;
opacity:1;
}


/* ドロップダウンメニュー別色 */
ul.navAB {
   margin: 0px; /* メニューバー外側余白 */
   padding: 0px 0px 0px 10px; /* メニューバー内側余白 */
   background-color: white; /* バーの背景色 */
text-align: right; /*MySet */
}
ul.navAB li {
   width: 120px;		 /* メニュー項目の横幅 */
   display: inline-block;	/* 横並び配置 */
   list-style-type: none;
   position: relative;	/* 重要 */
}
ul.navAB a {
   background-color: aliceblue; 
   color: lightsteelblue;
   line-height: 40px;
   text-align: center;
   text-decoration: none;
   display: block;
border: 1px solid lightsteelblue; /* MySet */
margin-bottom: 3px; /* MySet */
}
ul.navAB a:hover {
   background-color: lightsteelblue;
   color: aliceblue;
}
   /* サブメニュー */
ul.navAB li:hover ul {
   display: block;
}
ul.navAB ul {
   margin: 0px;
   padding: 0px; 
   display: none; /* 重要（非表示にしておく） */
   position: absolute; /* 重要 */
}
ul.navAB ul li {
   width: 120px; /* サブメニュー1項目の横幅 */
}
ul.navAB ul li a {
   line-height: 35px; /* サブメニュー1項目の高さ */
   text-align: center;
   padding-left: 5px;
font-size: 90%;
}
ul.navAB ul li a:hover {
background-color: lightsteelblue;
color: aliceblue;
opacity:1;
}


/* ドロップダウンメニュー別色 */
ul.navCB {
   margin: 0px; /* メニューバー外側余白 */
   padding: 0px 0px 0px 10px; /* メニューバー内側余白 */
   background-color: white; /* バーの背景色 */
text-align: right; /*MySet */
}
ul.navCB li {
   width: 120px;		 /* メニュー項目の横幅 */
   display: inline-block;	/* 横並び配置 */
   list-style-type: none;
   position: relative;	/* 重要 */
}
ul.navCB a {
   background-color: cadetblue; 
   color: white;
   line-height: 40px;
   text-align: center;
   text-decoration: none;
   display: block;
border: 1px solid #608f9f; /* MySet */
margin-bottom: 3px; /* MySet */
}
ul.navCB a:hover {
   background-color: #9fc4c6;
   color: white;
}
   /* サブメニュー */
ul.navCB li:hover ul {
   display: block;
}
ul.navCB ul {
   margin: 0px;
   padding: 0px; 
   display: none; /* 重要（非表示にしておく） */
   position: absolute; /* 重要 */
}
ul.navCB ul li {
   width: 120px; /* サブメニュー1項目の横幅 */
}
ul.navCB ul li a {
   line-height: 35px; /* サブメニュー1項目の高さ */
   text-align: center;
   padding-left: 5px;
font-size: 90%;
}
ul.navCB ul li a:hover {
background-color: #9fc4c6;
color: white;
opacity:1;
}


/* ドロップダウンメニュー別色 */
ul.navSG {
   margin: 0px; /* メニューバー外側余白 */
   padding: 0px 0px 0px 10px; /* メニューバー内側余白 */
   background-color: white; /* バーの背景色 */
text-align: right; /*MySet */
}
ul.navSG li {
   width: 120px;		 /* メニュー項目の横幅 */
   display: inline-block;	/* 横並び配置 */
   list-style-type: none;
   position: relative;	/* 重要 */
}
ul.navSG a {
   background-color: slategrey; 
   color: #efefef;
   line-height: 40px;
   text-align: center;
   text-decoration: none;
   display: block;
border: 1px solid slategrey; /* MySet */
margin-bottom: 3px; /* MySet */
}
ul.navSG a:hover {
   background-color: slategrey;
   color: rosybrown;
}
   /* サブメニュー */
ul.navSG li:hover ul {
   display: block;
}
ul.navSG ul {
   margin: 0px;
   padding: 0px; 
   display: none; /* 重要（非表示にしておく） */
   position: absolute; /* 重要 */
}
ul.navSG ul li {
   width: 120px; /* サブメニュー1項目の横幅 */
}
ul.navSG ul li a {
   line-height: 35px; /* サブメニュー1項目の高さ */
   text-align: center;
   padding-left: 5px;
font-size: 90%;
}
ul.navSG ul li a:hover {
background-color: slategrey;
color: rosybrown;
opacity:1;
}



.container { padding: 20px; text-align: center; font-size: 90%; }
.content img { padding: 0.5em; }



.flexwrap{
display: flex;
flex-wrap: wrap;
justify-content: center;
text-align: left;
}

.Box1 { padding: 0.5em; text-align: left; }



.inlineblock {
    display:  inline-block;     /* インラインブロック要素 */
    width: auto;               /* 幅指定 */
    padding:  10px;             /* 余白指定 */
    vertical-align:  top;    /* 要素を上揃え */
}

.inlineblockM {
    display:  inline-block;     /* インラインブロック要素 */
    width: auto;               /* 幅指定 */
   padding: 10px;             /* 余白指定 */
    vertical-align:  middle;    /* 要素を上下中央揃え */
}



.Comtop img { width: 280px; height: auto; }
.Comthumb { font-size: 80%; padding: 4px; color: #ddd; }
.ThumbA { line-height: 1.5em; }
.ThumbA img { height: 10px; width: auto; filter: contrast(5%);}
.ThumbA img:hover { filter: contrast(75%); }
.ThumbB img { width: 10px; height: auto; filter: contrast(5%); }
.ThumbB img:hover { filter: contrast(75%); }

.MojiX { font-size: 85%; }
.MojiY {font-size: 80%; }
.MiniMoji { font-size: 75%; padding: 4px; color: #ddd; }
.Col1 { color: #333; }
.Col2 { color: #999; }
.OpaX { opacity: 0.5; }

hr { height: 0; margin: 0; padding: 0; border: 0; }
hr { height: 1px;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(#eee), to(transparent));
background-image: linear-gradient(to right, transparent, #eee, transparent);
 margin: 2em 1em;}


a.Btn01 {
  display: inline-block;
  text-align: center;
  min-width: 100px;
  background-color: slategrey;
  font-size: 15px;
  color: #ccc;
  text-decoration: none;
  padding: 10px 20px ;
  border: 1px solid slategrey;
}

a.Btn02 {
  display: inline-block;
  text-align: center;
  min-width: 100px;
  background-color: lightsteelblue;
  font-size: 15px;
  color: #efefef;
  text-decoration: none;
  padding: 10px 20px ;
  border: 1px solid lightsteelblue;
}

a.Btn_LSB {
  display: inline-block;
  padding: 0.3em 1em;
  text-decoration: none;
  color: lightsteelblue;
  border: solid 2px lightsteelblue;
  border-radius: 3px;
  transition: .4s;
}
a.Btn_LSB:hover,active {
  background: lightsteelblue;
  color: white;
}



@media (max-width: 1000px) {
     .wrapper, .content {
          float: none;
          margin: 0;
          width: auto;
     }
}



/* MySet -Menu style- */
.Naflex1 {
    max-width: 100%;
    margin: 0 auto;
    /* width: 980px; */
    align-items: center;
    height: auto;
}
.flexx {
    display: flex;
    justify-content: center;
line-height: 35px;
}
.flexx li {
margin-left: 10px;
margin-right: 25px ;
    list-style: none;
    border-bottom: 2px solid lightsteelblue;
}
@media screen and (max-width: 600px) {
    .flexx {
        text-align: center;
        display: inline-block;
        line-height: 50px;
        flex-direction: column;
        padding-bottom: 10px;
        padding-left: 0;
    }
    .flexx li {
        margin: 0 auto;
        list-style: none;
        border-bottom: 2px solid lightsteelblue;
    }
}

/* MySet -Link color- */
.mnav1{ font-size: 14px; }
.mnav1 a{ color: lightslategrey; text-decoration: none; font-weight: bold; }
.mnav1 a:visited { color: lightslategrey; }
.mnav1 a:hover { color: rosybrown; }
.mnav1 a:active { color: rosybrown; }

.Lincolx{ font-size: inherit; }
.Lincolx a{ color: lightslategrey; text-decoration: none; }
.Lincolx a:visited { color: lightslategrey; }
.Lincolx a:hover { color: rosybrown; }
.Lincolx a:active { color: rosybrown; }

/* MySet -select etc- */
.selecX {
	overflow: hidden;
width: 40%;  min-width: 300px;
	margin: 2em auto;
	text-align: center;
}
.selecX select {
	width: 100%;
font-size: 0.9em;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}
.selecX select::-ms-expand {
    display: none;
}
.selecX.mineselec {
	position: relative;
	border-radius: 2px;
border-radius: 50px;
background: lightsteelblue;
}
.selecX.mineselec::before {
	position: absolute;
	top: 0.8em;
	right: 0.8em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid white;
	pointer-events: none;
}
.selecX.mineselec select {
	padding: 8px 38px 8px 8px;
	color: white;
}