img {
    border-radius: 10px;
}

h5{ 
font-weight:bold;
  margin-top: 10px;
  font-size:18px;
  margin-bottom:1px;
}

h4{ 
font-weight:bold;
  margin-top: 10px;
  font-size:16px;
  margin-bottom:1px;
}

/*角丸box */
div.box-maru {
 border: 2px solid green;
 border-radius: 10px;
 margin: 10px 3px;
 background-color:#FFFFFF;
 width: 99%;
 height: auto;
 padding: 6px;
 display: inline-block;
}

/* メニューフレキシブル */
  .navbar-light .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M6 6L 24 24M24 6L6 24'/%3E%3C/svg%3E");
}

.navbar-dark .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M6 6L 24 24M24 6L6 24'/%3E%3C/svg%3E");
}
#blockskip a {
      position: absolute;
      top: 0;
      left: -9999px;
      display: block;
      text-align: center;
  }
 
  #blockskip a:focus {
      z-index: 11000;
      left: 0;
      right: 0;
      margin: auto;
  }
  .btn-rounded{
      border-radius : 1000px;
  }
 
 
  .color__btn {
      background-color: #80CBC4;
      color: #212121;
  }
  .color__navi {
      background-color: #fff;
  }
  .color__logo {
      color: #212121;
  }
  .navbar.navbar-light .navbar-nav .nav-item.active>.nav-link {
      background-color: transparent;
      border-bottom : 3px solid #303F9F;
  }
 
  .toggler__txt{
      display : block;
      font-size : 0.5em;
  }
  .nav__main{
      font-size : 1.2em;
  }
  .nav__sub{
      font-size : 0.8em;
  }
    /* --->メニューフレキシブル */
   
  @media (max-width: 767.98px) { 
      .nav__main{
      font-size : 1em;
      }
      .nav__sub{
          font-size : 1em;
      }
      .navbar.navbar-light .breadcrumb .nav-item.active>.nav-link, .navbar.navbar-light .navbar-nav .nav-item.active>.nav-link {
          background-color: #efefef;
          border-bottom : none;
      }
  }
  /* メニューフレキシブル */
  
  
/* stckyメニュー固定 */
header {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
	z-index: 10;
	}
header a { color: #ff6600; text-decoration: none; }
header a:hover { color: #993D00; }

/*--> stckyメニュー */

/* ガイド一言枠 */

.float_none {
	clear: both;
	font-size:17px;
	font-weight:800;
	width:auto;
  background-color: rgba( 255, 255, 255, 0.80 );
}
/* -->ガイド一言枠 */

#endtitle{
clear:both;
margin-top:10px;
}

.box-half-l
{
position: relative;z-index: 2;
width:100%;
text-align: left;
margin: 30px 0px 10px 0px;
padding: 5px 0px 5px 5px;
background-color: #f9fde5;
border:1px solid #7cfc00;
}
/* --->コメント枠 */


p.pagelist {
font-size:12px;
clear:both;
padding:5px 0;
text-align:center;
margin:20px 0;
border-top:dotted 1px #ccc;
border-bottom:dotted 1px #ccc;
}
 
p.pagelist a{
text-decoration:none;
padding:4px;
border:1px solid #61dfda;
background:#fff;
color:#61dfda;
}
 
p.pagelist a:hover{
text-decoration:none;
padding:4px;
background:#62e0dc;
color:#fff;
}
 
p.pagelist b{
font-weight:bold;
text-decoration:none;
padding:4px;
border:1px solid #0066cc;
background:#0066cc;
color:#fff;
}

/* タイトル文字フロート */
.itiran-f {/*親div*/
  position: relative;/*相対配置*/
  }
.itiran-f p {
  position: absolute;/*絶対配置*/
  color: white;/*文字は白に*/
  top: 0;
  left: 0;
  background-color: rgba( 255, 255, 255, 0.80 );
  margin: 2px;
  }


.box-wide
{
position: relative;
width: 98%;
height: auto;
text-align: left;
margin: 5px 0px;
  padding: 3px 3px 3px 3px;
border:1px solid;
 border-color:#FF9872 #FF9872 #FF9872 #FF9872;
}


 .title-box
{
position: relative;
width: auto;
text-align: left;
line-height: 1.2;
padding: 5px 3px 0px 3px;;
clear:both;
margin-top: 10px;
margin-left: auto;
margin-right: auto;

}


/* pc */
@media screen and (min-width: 701px)  {

/* タイトル文字フロート（ヘッダー） */
.title-f {/*親div*/
  position: relative;/*相対配置*/
  }

.title-f h1 {
margin: 4px;
color: #ffa500;
background-color: rgba( 255, 255, 255, 0.80 );
font-size: 25px;
font-weight: normal;
line-height: 1.25;
font-family: "HGP創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W8";
position:absolute;
letter-spacing: 0.2em;
  top: 0;
  left: 0;
  }
.title-f img {
  width: 100%;
  }
  
 
 /* box） */
 .box
{
position: relative;
width: 100%;
height: auto;
min-height: auto;
text-align: left;
line-height: 1.2;
padding: 5px;
background-color: #f9fde5;
border:1px solid #7cfc00;
clear:both;
margin-left: auto;
margin-right: auto;
overflow: auto; 
}

 /*メニューバー */
 #g_navi{
  background-color: rgba( 0, 128, 128, 0.80 );
  }
 #g_navi ul {
overflow: hidden;
margin: 0 auto;
padding: 0%;
width: 100%;
max-width: 100%; 
}
#g_navi ul li {
position: relative;
float: left;
width: 14%;
}
#g_navi ul li a {
 display: block;
padding: 1px 3px;
width: 90%;
color: black;
text-align: left;
text-decoration: none;
}
#g_navi a:hover { color: #FF5F17; }
#pagebody
{
position: relative;
width: 88%;
margin: 0 auto;
text-align: left;

}

#pagebody:after
{
content: " ";
display: block;
visibility: hidden;
clear: both;
}

 .img-main
{
float: left;
margin: 0px 5px 8px 0px;
text-align: center;
width:auto;
height:100%;
}

.img-main-r
{
float: right;
margin: 0px 5px 0px 0px;
text-align: center;
max-width:auto;
height:100%;
}
.img-main-l
{
float: left;
margin: 0px 5px 0px 0px;
text-align: center;
max-width:auto;
height:100%;
}
}



/* smartPhone */
@media screen and (max-width: 700px)
{
/* タイトル文字フロート（ヘッダー） */
.title-f {/*親div*/
  position: relative;/*相対配置*/
  }

.title-f h1 {
margin: 0;
color: #ffa500;
background-color: rgba( 255, 255, 255, 0.80 );
font-size: 16px;
font-weight: normal;
line-height: 1.25;
font-family: "HGP創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W8";
position:absolute;
letter-spacing: 0.2em;
text-align: left;
  top: 0;
  left: 0;
  }

.title-f img {
  width: 100%;
  }
  
   /* box） */
 .box
{
position: relative;
width: 100%;
height: auto;
padding: 5px;
text-align: left;
line-height: 1.2;
background-color: #f9fde5;
border:1px solid #7cfc00;
clear:both;
overflow: auto; 
margin-left: auto;
margin-right: auto;

}
#pagebody
{
position: relative;
width: 100%;
margin: 0 auto;
text-align: left;

}

#pagebody:after
{
content: " ";
display: block;
visibility: hidden;
clear: both;
}

.img-main
{
float: left;
margin: 0px 5px 0px 0px;
text-align: center;
width:50%;
height:100%;
}

.img-main-l
{
float: left;
margin: 0px 5px 0px 0px;
text-align: center;
max-width:auto;
height:100%;
}
}


  
  
   html { margin: 0; padding: 0; }
form, input { margin: 0; padding: 0; }
a img { border: 0; }

* {
margin: 0;
padding: 0;
}



/* リンクカラー（ページ全体）

a { color: #0000ff; text-decoration: underline; }
a:hover { color: #ff6600; }

/* リンクカラー（ヘッダー） */

#banner a { color: #ff6600; text-decoration: none; }
#banner a:hover { color: #993D00; }

#main a { color: #0000ff; text-decoration: none; }
#main a:hover { color: #ff6600; }
/* リンクカラー（サイドメニュー） */

#side a { color: #0000ff; }
#side a:hover { color: #ff6600; }
#side a {background-color:#ffffff;}


/* H見出し */

h1, h2, h3, h4, h5, h6 { font-weight: bold; }
h1, h2, h4, h5, h6 { margin: 0px; }

h3{ 
  margin-top: 15px;
  font-size:18px;
  margin-bottom:5px;
  border-bottom: 4px solid #009933;
}

/* ページレイアウト */

body
{width: auto;
margin: 0;
padding: 0;
font-size: 1em;
text-align: center;
color: #333;
line-height: 1.1;
}

p {
margin-top: 1px;
margin-bottom: 0px;
}
#guide
{
position: relative;
margin: auto;
padding: 0 0 0 0;
text-align: left;

}


#container
{
position: relative;
margin: auto;
padding: 0 0 0 0;
text-align: center;
width: 90%;
}

#container:after
{
content: " ";
display: block;
visibility: hidden;
clear: both;
}

/* ヘッダー（レイアウト） */
#banner
{
 position: relative;
 width: auto;
 height: auto;
margin-left:auto;
margin-right:auto;
}

/* ヘッダー（サイトタイトル） */

#banner h1
{
margin: 0;
color: #fff;
font-size: 16px;
font-weight: normal;
line-height: 1.25;
font-family: "HGP創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W8";
position:absolute; top: 33px; left: 0px;
letter-spacing: 0.2em;
}


/* ヘッダー（検索ボックス） */

#banner-search
{
position:absolute; bottom: 10px; right: 10px;
color:#fff;
}


/* ヘッダー（サイト説明） */

#banner-description
{
display: none;
}


/* メインコンテンツ全体 基本レイアウト*/



/* メインコンテンツレイアウト */

#main /* 記事部分 */

{
display: inline;
position: relative;
min-height: 1px;
width: auto;
height:auto;
margin: 10px;
text-align: left;
}

#side /* サイドメニュー */

{
display: inline;
position: relative;
float: right;
min-height: 1px;
margin: 10px;
width: 180px;
text-align: left;
position: absolute;   
top: 0;   
right: 0; 
}

#s-main /* 検索結果記事部分 */

{
display: inline;
position: relative;
float: left;
min-height: 1px;
width: 100%;
margin: 10px;
text-align: left;
}

/* 記事部分見出し */

.header1
{
position: relative;
width: auto;
_width: 100%;
margin: 15px 0;
padding: 3px 0 2px 10px;
border-left: 5px solid #ccc;
border-bottom: 1px solid #ccc;
background: #fff;
line-height: 1.25;
font-size: 1.4em;
font-weight: normal;
font-family: "HGP創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W8";
text-transform: uppercase;
clear: both;
; color: #006600
}


/* 記事部分コンテンツ */

.entry
{
line-height: 1.5;
margin: 10px;
padding-bottom: 10px; 
border-bottom: 1px dotted #dcdcdc;
}

.more
{
text-align: right;
}

.header2
{
position: relative;
margin-top: 10px;
border-left: 5px solid #e0e0e0;
padding: 2px 0 2px 10px;
font-size: 1.1em;
font-weight: normal;
font-family: "HGP創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W8";
line-height: 1.25;
}

.header3
{
position: relative;
margin-top: 10px;
border-left: 4px solid #F30;
padding: 2px 0 2px 10px;
font-size: 1.5em;
font-weight: normal;
font-family: "HGP創英角ｺﾞｼｯｸUB", "ヒラギノ角ゴ Pro W8";
line-height: 0.9;
}


.header1 a, .header2 a 
{
text-decoration: none;
}

.entry-footer
{
margin: 5px 10px 0 0;
border-top: 1px dotted #ccc;
padding: 5px 0;
color: #999;
font-size: 10px;
text-align: right;
}

.bread
{
background: none;
margin: 0 10px;
padding-left: 10px;
text-align: left;
}

.f-navi
{
margin: 5px 0;
text-align: center;
clear: both;
}

.gotop 
{
text-align: right;
clear: both;
padding: 10px;
}

.image-vw {
  max-width : 100vw ; 
  height : auto ; 
}
.img
{
float: left;
margin: 0 5px 5px 0;
text-align: center;
width:auto
}

.tb-info
{
text-align: center;
border: 1px dotted #ccc;
}


/* フッター */

#footer
{
position: relative;
width: auto;
margin-left:auto;
margin-right:auto;
height: 120px;
text-align: left;
padding: 0;
clear: both;
color: #666;
}

#footer p
{
padding: 40px 0 0;
margin: 0;
font-size: 0.8em;
text-align: center;
}

#footer a
{
text-decoration: none;
color: #666;
}

.footer-navi
{
 width: auto;
margin: 0 5px;
padding: 5px 0;
background: #fff;
font-size: 0.8em;
text-align: center;
line-height: 1.25;
clear: both;
}

.footer-navi a
{
color: #999;
}


/* サイドメニュー内部 */

.side-header
{
position: relative;
width: auto;
height: 16px;
margin: 10px 0 5px 0;
padding: 2px 0;
color: #fff;
background: #ff6600;
font-size: 14px;
font-weight: bold;
line-height: 16px;
text-align: center;
letter-spacing: 0.3em;
  /* ▼CSS3 */
border-top-left-radius: 10px;  /* 左上 */
border-top-right-radius: 0px; /* 右上 */

   /* ▼Safari,Chrome */
-webkit-border-top-left-radius: 10px;  /* 左上 */
-webkit-border-top-right-radius: 0px; /* 右上 */

   /* ▼Firefox */
-moz-border-radius-topleft: 10px;  /* 左上 */

}

#side p 
{
padding: 0 5px;
}

#side ul
{
margin: 0;
padding: 0;
list-style: none;
}

#side li a
{
width: 178px;
_width: 180px;
background-color: #fff;
text-indent: 5px;
display: block;
font-size: 12px;
line-height: 1.25;
margin: 2px 0;
padding: 5px 0;
letter-spacing: 0.1em;
border: 1px solid #ccc;
text-decoration: none;
}

#side li a:hover
{
background: #ff9900;
border: 1px solid #ccc;
color: #fff;
}

#side dl
{
padding: 5px;
}

#side dt
{
font-size: 12px;
line-height: 1.5;
}

.haikei{
background-image:url(haikei.jpg);
background-repeat: no-repeat; ; background-position: right top; height: auto; width: auto; font-size: 14px}


.font_b {  font-weight: bold; margin-bottom: 1px; padding-bottom: 1px}

/* サリンクボタン */
#menu_ul2{
margin-left: 1px;
padding: 0;
width: 100%;
background: transparent;
padding-top: 3px;
}

#menu_ul2 ul{
font: bold 13px Arial, Verdana, sans-serif;/*font size*/
margin:0;
padding:0;
list-style:none;
}

#menu_ul2 li{
display:inline;
margin:0 2px 0 0;
padding:0;
text-transform:uppercase;
}


#menu_ul2 a{
float:left;
color: white;
background: #678b3f url(images/color_tabs_left.gif) no-repeat left top;
margin:0 2px 0 0;
padding:0 0 1px 3px;
text-decoration:none;
letter-spacing: 1px; /*font interval*/
}

#menu_ul2 a span{
float:left;
display:block;
background: transparent url(images/color_tabs_right.gif) no-repeat right top;
padding:5px 10px 3px 7px;
}

#menu_ul2 a span{
float:none;
}

#menu_ul2 a:hover{
background-color: #8cb85c;
}

#menu_ul2 a:hover span{
background-color: #8cb85c;
}

#menu_ul2 #current a, #menu_ul2 #current span{ /*currently selected tab*/
background-color: #8cb85c;
}
.font_main {  margin-top: 3px; }

   /* ボタン用 */
#button a{
   display: block; /* ★ブロック化 */
   margin: 0.1em; /* 外側の余白 */
   padding: 0.3em; /* 内側の余白 */
   width: auto; /* 横幅 */
   float: left; /* 続く内容を右側に */
   text-decoration: none; /* 下線を消す */
   
   background-color: #ffffcc; /* ★背景色 */
   color: #000080; /* 文字色 */
   border-width: 2px; /* ★枠線の太さ */
   border-style: outset; /* ★凸型に見えるように */
   border-color: #ffff55; /* ★枠線のベース色 */
}
#button a:hover {
   background-color: #ffffaa; /* ★背景色 */
   color: red; /* 文字色 */
   border-style: inset; /* ★凹型に見えるように */
   text-decoration: underline; /* 下線を引く */
}  

.floatclear {
 clear: both;
 }
 


.box1{
      float : left ;
      width : 460px ;
      height : 350px ;
      padding: 5px 5px 5px 5px;
      background : #fc9 ;
      border : 1px solid #000 ;
      }
.box2{
      float : right ;
      width : 300px ;
      height : 350px ;
        padding: 0 0 0 0;
      background : #fff ;
      border : 0px solid #000 ;
      }
.clr-block{
      clear : both ;
       background : #09f ;
      padding : 5px ;
      }​
	  


@media screen and (max-width: 621px)  {

/* ul複数列*/
.column{
 column-count: 1;
column-gap: 0;
margin: 0 0;
max-width: 400px;
    }
	}
	
@media screen and (min-width:621px) and ( max-width:890px)  {
/* ul複数列*/
.column{
 column-count: 2;
column-gap: 0;
margin: 0 0;
max-width: 690px;
    }
}
	
/* pc */
@media screen and (min-width: 891px)  {
/* ul複数列*/
.column{
 column-count: 3;
column-gap: 0;
margin: 0 0;
max-width: 900px;
    }	}