@charset "UTF-8";

body	{margin: 0;
        font-family: 'メイリオ',
        'Hiragino Kaku Gothic Pro', sans-serif}


/* サイト名 */
.site h1 a    {color: #000000;
              text-decoration: none}

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

/* ナビゲーション */
.menu ul      {margin: 0;
              padding: 0;
              list-style: none}

.menu li a    {display: block;
              padding: 10px 7px;
              color: #000000;
              font-size: 11px;
              text-decoration: none}

.menu li a:hover     {background-color: #eeeeee}

.menu ul after       {content: "";
              display: block;
              clear: both}

.menu li      {float: left;
              width: auto}



/* ヘッダー画像 */
.topimg       {max-width: 100%;
              height: auto;
              vertical-align:bottom}

/* キャッチコピー */
.catch       {margin: 0;
             padding: 15px;
             background-color: rgba(255,255,255,0.7);
             font-size: 16px}

/* ヘッダー画像にキャッチコピーを重ねる */
.top         {position: relative}

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


/* アバウトページ（投稿フォームのデザイン） */
table, th, td	{border: solid 1px #333333}

table	{border-collapse: collapse;
	margin-top: 30px;
	margin-bottom: 30px;}

th, td	{padding: 10px 20px 10px 20px}

th	{width: 150px;
	background-color: #9cd31a;
	text-align: left}

td	{width: 450px;
	background-color: #fdffc9}

caption	{font-weight: bold;
	background-color: #b1c500;
	padding: 5px;
	margin-bottom: 10px}


/* 投稿フォームのデザイン設定 */
input, textarea	{display: block;
	background-color: #ffffff}

input	{width: 400px}

input[type="submit"]	{width: 200px;
	background-color: #137f86;
	background-image: -webkit-gradient(
		linear, 
		left top, left bottom, 
		from(#72f7ff), 
		to(#137f86));
	background-image: -webkit-linear-gradient(
		top, 
		#72f7ff 0%, 
		#137f86 100%);
	background-image: linear-gradient(
		to bottom, 
		#72f7ff 0%, 
		#137f86 100%);
	color: white;
	border: solid 1px #aaaaaa;
	padding-top: 10px;
	padding-bottom: 10px}

textarea	{width: 600px;
	height: 120px}

form	{margin-bottom: 30px}


/* 投稿フォームのデザイン＿記事 */
article2	{background-color: #daed2b;
	        overflow: hidden}

article2 >  *	{width: 640px;
	  margin-left: auto;
	  margin-right: auto}

/* ヘッダー（投稿フォームのデザインページの） */
header	{background-color: #ffffff;
	padding-top: 20px;
	padding-bottom: 15px;
	zoom: 1}

header h1	{font-family: 'Bowlby One', cursive;
	font-size: 38px;
	line-height: 40px;
	width: 640px;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: auto;
	margin-right: auto}

header h1 a	{text-decoration: none;
	display: block;
	width: 200px}

header h1 a:hover	{color: #000000}

header h1 img	{display: none;}

/* フッター（投稿フォームのデザインページの） */
footer	{background-color: #1e4100;
	color: #ffffff;
	padding-top: 30px;
	padding-bottom: 30px}

footer small	{display: block;
	width: 640px;
	margin-left: auto;
	margin-right: auto}




/* 案内 */
.annnai a   {display: block;
            text-align: center;
            text-decoration: none}

.annnai a:hover     {opasity: 0.8}

.annnai h2  {margin-top: 0;
            margin-bottom: 0;
            padding-top: 0px;
            padding-bottom: 0px;
            background-color: #eee8aa;
            font-size: 16px;
            font-weight: normal

}

.annnai h1  {margin-top: 0;
            margin-bottom: 0;
            padding-top: 5px;
            padding-bottom: 5px;
            background-color: #293f4c;
            font-size: 20px;
            font-weight: normal}

.annnai p   {margin-top: 0;
             margin-bottom: 0;
             padding-top: 5px;
             padding-bottom: 5px;
             background-color: #eee8aa;
             font-size: 12px}

.annnai img{
           vertical-align:bottom;
}

/* 案内1 */
.annnai1 a   {display: block;
            text-align: center;
            text-decoration: none}

.annnai1 a:hover     {opasity: 0.8}

.annnai1 h2  {margin-top: 5;
            margin-bottom: 0;
            padding-top: 0px;
            padding-bottom: 0px;
            background-color: #ffcc66;
            font-size: 16px;
            font-weight: normal

}

.annnai1 h1  {margin-top: 0;
            margin-bottom: 5;
            padding-top: 5px;
            padding-bottom: 5px;
            background-color: #000000;
            font-size: 20px;
            font-weight: normal}

.annnai1 p   {margin-top: 0;
             margin-bottom: 0;
             padding-top: 5px;
             padding-bottom: 5px;
             background-color: #eee8aa;
             font-size: 12px}

.annnai1 img{
           vertical-align:bottom;
}






/* 案内2 */
.annnai2 a   {display: block;
            text-align: center;
            text-decoration: none}

.annnai2 a:hover     {opasity: 0.8}

.annnai2 h2  {margin-top: 5;
            margin-bottom: 0;
            padding-top: 0px;
            padding-bottom: 0px;
            background-color: #99cccc;
            font-size: 16px;
            font-weight: normal

}

.annnai2 h1  {margin-top: 0;
            margin-bottom: 5;
            padding-top: 5px;
            padding-bottom: 5px;
            background-color: #000000;
            font-size: 20px;
            font-weight: normal}

.annnai2 p   {margin-top: 0;
             margin-bottom: 0;
             padding-top: 5px;
             padding-bottom: 5px;
             background-color: #eee8aa;
             font-size: 12px}

.annnai2 img{
           vertical-align:bottom;
}


/* 案内3 */
.annnai3 a   {display: block;
            text-align: center;
            text-decoration: none}

.annnai3 a:hover     {opasity: 0.8}

.annnai3 h2  {margin-top: 5;
            margin-bottom: 0;
            padding-top: 0px;
            padding-bottom: 0px;
            background-color: #cccc99;
            font-size: 16px;
            font-weight: normal

}

.annnai3 h1  {margin-top: 0;
            margin-bottom: 5;
            padding-top: 5px;
            padding-bottom: 5px;
            background-color: #000000;
            font-size: 20px;
            font-weight: normal}

.annnai3 p   {margin-top: 0;
             margin-bottom: 0;
             padding-top: 5px;
             padding-bottom: 5px;
             background-color: #eee8aa;
             font-size: 12px}

.annnai3 img{
           vertical-align:bottom;
}











/* 仕事 */
.sigoto a   {display: block;
            text-align: center;
            text-decoration: none}

.sigoto a:hover     {opasity: 0.8}

.sigoto h2  {margin-top: 10;
            margin-bottom: 0;
            padding-top: 10px;
            padding-bottom: 0px;
            background-color: #ffffff;
            font-size: 20px;
            font-weight: normal

}

.sigoto h1  {margin-top: 0;
            margin-bottom: 0;
            padding-top: 5px;
            padding-bottom: 5px;
            background-color: #ffffff;
            font-size: 20px;
            font-weight: normal}

.sigoto p   {margin-top: 0;
             margin-bottom: 5;
             padding-top: 5px;
             padding-bottom: 5px;
             padding-left: 10px;
             background-color: #ffffff;
             text-align: center;
             font-size: 14px}

.sigoto img{
           vertical-align:bottom;
}

/* お知らせ */
.news              {padding: 20px;
                    border: solid 5px #dddddd}

.news h1           {margin-top: 0;
                    margin-bottom: 5px;
                    font-size: 20px;
                    color: #666666}

.news ul           {margin: 0;
                    padding: 0;
                    list-style: none}

.news li a         {display: block;
                    padding: 7px;
                    border-bottom: dotted 2px #dddddd;
                    color: #000000;
                    font-size: 18px;
                    text-decoration: none}

.news li a:hover   {background-color: #eeeeee}

.news time     {color: #888888;
               font-weight: bold}

.news a:after       {content: "";
               display: block;
               clear: both}

.news time     {float: left;
               width: 6px}

.news .text    {float: none;
               width: auto;
               margin-left: 6px}


/* SNSメニュー */
.follow ul   {margin: 0;
             padding: 0;
             list-style: none}

.follow li a {display: block;
             margin-bottom: 10px;
             padding: 10px;
             border-radius: 4px;
             color: #ffffff;
             font-size: 14px;
             text-decoration: none}

.follow li a:hover   {opacity: 0.8}

.follow-tw  {background-color: #63bafb}
.follow-fb  {background-color: #5288f7}
.follow-gp  {background-color: #f65d4a}

.follow i   {margin-right: 10px;
            font-size: 24px;
            vertical-align: middle}

/* 補足説明 */
.follow p    {margin-top: 0;
             margin-bottom: 20px;
             padding: 10px;
             background-color: #dddddd;
             font-size: 14px;
             text-align: center}

.follow-info {
             position: relative;
             background: #dddddd;
}

.follow-info:after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(221, 221, 221, 0);
	border-top-color: #dddddd;
	border-width: 15px;
	margin-left: -15px;
}

/* 「好日とは」の記事の枠の設定 */
.toha        {border: solid 2px #dddddd;
             padding-top: 14px;
             padding-bottom: 14px;
             padding-right: 16px;
             padding-left: 16px}

.toha h1     {margin-top: 0;
             margin-bottom: 20px;
             padding-left: 20px;
             border-left: solid 20px #c50018;
             font-size: 36px;
             font-weight: normal}

.toha h2     {margin-top: 20px;
             margin-bottom: 20px;
             border-bottom: solid 1px #dddddd;
             font-size: 28px;
             font-weight: normal}

.toha h2 i   {margin-right: 7px;
             color: #888888}

.toha h3     {max-width: 100%;
             font-size: 20px;
             color: #333333;
             margin-top: 20px;
             margin-bottom: 20px;
             font-weight: normal}

.toha h4     {max-width: 100%;
             font-size: 20px;
             color: #000000;
             margin-top: 20px;
             margin-bottom: 20px;
             font-weight: bold}

.toha p      {max-width: 640px;
             margin-top: 0;
             margin-bottom: 20px;
             line-height: 1.5;
             word-spacing:1em}


.toha .lead  {max-width: 100%;
             font-size: 20px;
             color: #666666}

.toha .kiji  {max-width: 100%;
             height: auto}

.toha img    {max-width: 100%;
             height: auto;
             margin-bottom: 20px}

/* 「叢書」の記事の枠の設定 */
.sousyo ul      {background-color: #bdb76b;
                border-top: solid 6px #bdb76b;
                border-bottom: solid 6px #bdb76b;
                margin: 0;
                padding: 0;
                list-style: none}


.sousyo li      {background-color: #ffffff;
                display: block;
                margin-top: 12px;
                margin-bottom: 22px;
                margin-right: 12px;
                margin-left: 12px;
                color: #000000;
                font-size: 16px;
                text-decoration: none}


.sousyo h1     {margin-top: 0;
                  margin-bottom: 0px;
                  padding-left: 0px;
                  border-left: solid 20px #c50018;
                  font-size: 36px;
                  font-weight: normal}

.sousyo h2     {margin-top: 0px;
                  margin-bottom: 0px;
                  border-bottom: solid 1px #dddddd;
                  font-size: 20px;
                  font-weight: normal}

.sousyo h2 i   {margin-right: 7px;
                  color: #888888}

.sousyo h3     {background-color: #ffffff;
               max-width: 100%;
               font-size: 22px;
               color: #333333;
               margin-top: 15px;
               margin-bottom: 20px;
               font-weight: normal}

.sousyo h4     {max-width: 100%;
                  font-size: 20px;
                  color: #000000;
                  margin-top: 0px;
                  margin-bottom: 0px;
                  font-weight: bold}

.sousyo p         {margin-top: 5px;
                  margin-bottom: 5px;
                  line-height: 1.5;
                  word-spacing:1em}


.sousyo .lead  {max-width: 100%;
                  font-size: 20px;
                  color: #666666}

.sousyo .kiji  {max-width: 100%;
                  height: auto}

.sousyo img    {max-width: 100%;
                  height: auto;
                  margin-bottom: 0px}

.sousyo input[type=text]{width:320px;
                        height:40px;
                        font-size: 1.0em}



/* 「叢書以外」の記事の枠の設定 */
.sousyo2 ul      {background-color: #9acd32;
                border-top: solid 6px #9acd32;
                border-bottom: solid 6px #9acd32;
                margin: 0;
                padding: 0;
                list-style: none}


.sousyo2 li      {background-color: #ffffff;
                display: block;
                margin-top: 12px;
                margin-bottom: 22px;
                margin-right: 12px;
                margin-left: 12px;
                color: #000000;
                font-size: 16px;
                text-decoration: none}

/* 「好日誌」の記事の枠の設定 */
.koujitusi ul      {background-color: #bdb76b;
                border-top: solid 6px #bdb76b;
                border-bottom: solid 6px #bdb76b;
                margin: 0;
                padding: 0;
                list-style: none}


.koujitusi li      {background-color: #ffffff;
                display: block;
                margin-top: 12px;
                margin-bottom: 22px;
                margin-right: 12px;
                margin-left: 12px;
                color: #000000;
                font-size: 16px;
                text-decoration: none;
                list-style: none}


.koujitusi h1     {margin-top: 0;
                  margin-bottom: 0px;
                  padding-left: 0px;
                  border-left: solid 20px #c50018;
                  font-size: 36px;
                  font-weight: normal}

.koujitusi h2     {margin-top: 0px;
                  margin-bottom: 0px;
                  border-bottom: solid 1px #dddddd;
                  font-size: 20px;
                  font-weight: normal}

.koujitusi h2 i   {margin-right: 7px;
                  color: #888888}

.koujitusi h3     {background-color: #ffffff;
               max-width: 100%;
               font-size: 22px;
               color: #333333;
               margin-top: 15px;
               margin-bottom: 20px;
               font-weight: normal}

.koujitusi h4     {max-width: 100%;
                  font-size: 20px;
                  color: #000000;
                  margin-top: 0px;
                  margin-bottom: 0px;
                  font-weight: bold}

.koujitusi p         {margin-top: 5px;
                  margin-bottom: 5px;
                  line-height: 1.5;
                  word-spacing:1em}


.koujitusi .lead  {max-width: 100%;
                  font-size: 20px;
                  color: #666666}

.koujitusi .kiji  {max-width: 100%;
                  height: auto}

.koujitusi img    {max-width: 100%;
                  height: auto;
                  margin-bottom: 0px}








/* 記事 */
.kiji h1     {margin-top: 0;
             margin-bottom: 20px;
             padding-left: 20px;
             border-left: solid 20px #c50018;
             font-size: 36px;
             font-weight: normal}

.kiji h2     {margin-top: 20px;
             margin-bottom: 20px;
             border-bottom: solid 1px #dddddd;
             font-size: 28px;
             font-weight: normal}

.kiji h2 i   {margin-right: 7px;
             color: #888888}

.kiji h3     {max-width: 100%;
             font-size: 20px;
             color: #333333;
             margin-top: 20px;
             margin-bottom: 20px;
             font-weight: normal}

.kiji h4     {max-width: 100%;
             font-size: 20px;
             color: #000000;
             margin-top: 20px;
             margin-bottom: 20px;
             font-weight: bold}

.kiji p      {max-width: 640px;
             margin-top: 0;
             margin-bottom: 20px;
             line-height: 1.5;
             word-spacing:1em}


.kiji .lead  {max-width: 100%;
             font-size: 20px;
             color: #666666}

.kiji .kiji  {max-width: 100%;
             height: auto}

.kiji img    {max-width: 100%;
             height: auto;
             margin-bottom: 20px}

/* パンくずリスト */
.bread             {margin-bottom: 10px}

.bread ol          {margin: 10;
                   padding: 0;
                   list-style: none}

.bread li a        {display: inline-block;
                   padding: 5px;
                   color: #000000;
                   font-size: 14px;
                   text-decoration: none}

.bread li a:hover  {background-color: #eeeeee}

.bread ol:after    {content: "";
                   display: block;
                   clear: both}

.bread li          {float: left;
                   width: auto}

.bread li:after    {content: '\003e';
                   margin-left: 10px;
                   margin-right: 10px;
                   color: #888888}


/* シルバーとは？文字背景設定 */
.silver             {margin-bottom: 10px}

.silver p           {font-size: 24px;
                    color: #333300;
                    font-weight: normal}

.silver             {padding-top: 3px;
                    padding-bottom: 0px;
                    padding-right: 5px;
                    padding-left: 20px}

.silver             {border: solid 0px #9acd32;
                    border-radius: 20px}

.silver             {background-color: #9acd32}


/* サイドメニュー */
.sidemenu            {border: solid 6px #dddddd}

.sidemenu h1         {margin: 0;
                     padding: 10px;
                     font-size: 16px;
                     font-weight: normal}

.sidemenu h1 i       {margin-right: 5px;
                     color: #8abc60;
                     font-size: larger}

.sidemenu ul         {margin: 0;
                     padding: 0;
                     list-style: none}

.sidemenu li a       {display: block;
                     padding: 10px;
                     border-top: solid 1px #dddddd;
                     color: #000000;
                     word-spacing:1.5em;
                     font-size: 14px;
                     text-decoration: none}

.sidemenu li a:hover {background-color: #eeeeee}

.sidemenu img        {max-width: 100%;
                     height: auto;
                     margin-bottom: 0px}


/* みんなの歌 */
.minnnanouta             {padding: 20px;
                         border: solid 5px #dddddd}

.minnnanouta h1          {margin-top: 0;
                         margin-bottom: 5px;
                         font-size: 18px;
                         color: #666666}

.minnnanouta ul          {margin: 0;
                         padding: 0;
                         list-style: none}

.minnnanouta li a        {display: block;
                         padding: 5px;
                         border-bottom: dotted 2px #dddddd;
                         color: #000000;
                         font-size: 14px;
                         text-decoration: none}

.minnnanouta li a:hover  {background-color: #eeeeee}

.minnnanouta time        {color: #888888;
                         font-weight: bold}

.minnnanouta a:after     {content: "";
                         display: block;
                         clear: both}

.minnnanouta time        {float: left;
                         width: 60px}

.minnnanouta .text       {float: none;
                         width: auto;
                         margin-left: 60px}


/* 各地の歌会ページと書庫ページの＿外枠 */
.kakai            {margin: left: 0px;
                  border: solid 16px #daa520;
                  padding-top: 10px;
                  padding-bottom: 10px;
                  padding-right: 0px;
                  padding-left: 0px}


.kakai ul         {list-style: none}



/* 各地の歌会及び書庫＿個々の枠 */
.kakai2            {margin-top: 0px;
                   margin-bottom: 0px;
                   margin-right: 0px;
                   margin-left: 0px;
                   padding: 15px;
                   border-bottom: solid 16px #daa520;
                   display: block;
                   color: #000000;
                   font-size: 16px;
                   text-decoration: none}

.kakai2 img        {margin: 7px}


/* 書庫のページ外枠 */
.syoko            {margin: left: 0px;
                  border: solid 16px #daa520;
                  padding-top: 10px;
                  padding-bottom: 10px;
                  padding-right: 0px;
                  padding-left: 0px}


.syoko ul         {list-style: none}



/* 書庫＿個々の枠 */
.syoko2            {margin-top: 0px;
                   margin-bottom: 0px;
                   margin-right: 0px;
                   margin-left: 0px;
                   padding: 0px;
                   border-bottom: solid 16px #daa520}

.syoko2 p          {display: block;
                   list-style: none;
                   padding: 30px;
                   color: #000000;
                   font-size: 16px;
                   text-decoration: none}

.syoko2 img        {margin: 7px}


/* WEB歌会の文章の設定 */
.webkakai          {border: solid 16px #daa520;
                   padding: 0px}

.webkakai p        {display: block;
                   list-style: none;
                   padding: 15px;
                   border-bottom: solid 12px #daa520;
                   color: #000000;
                   font-size: 16px;
                   text-decoration: none}

.webkakai img      {margin: 7px}



/* 入会説明会日程 */
.nyuukaisetumei             {padding: 20px;
                            border: solid 5px #dddddd}

.nyuukaisetumei h1          {margin-top: 0;
                            margin-bottom: 5px;
                            font-size: 18px;
                            color: #666666}

.nyuukaisetumei ul          {margin: 0;
                            padding: 0;
                            list-style: none}

.nyuukaisetumei li a        {display: block;
                            padding: 5px;
                            border-bottom: dotted 2px #dddddd;
                            color: #000000;
                            font-size: 14px;
                            text-decoration: none}

.nyuukaisetumei li a:hover  {background-color: #eeeeee}

.nyuukaisetumei time        {color: #888888;
                            font-weight: bold}

.nyuukaisetumei a:after          {content: "";
                            display: block;
                            clear: both}

.nyuukaisetumei time        {float: left;
                            width: 60px}

.nyuukaisetumei .text       {float: none;
                            width: auto;
                            margin-left: 60px}

/* コピーライト */
.copyright p {margin: 0;
             color: #666666;
             font-size: 14px}


/* 仕事いろいろの行間設定 */
.kiji2        {padding: 1px;
              border: solid 5px #ffffff}


.kiji2 h1     {margin-top: 5px;
              margin-bottom: 5px;
              padding-left: 10px;
              border-left: solid 20px #ffffff;
              font-size: 36px;
              font-weight: normal}

.kiji2 h2     {margin-top: 1px;
              margin-bottom: 10px;
              border-bottom: solid 1px #ffffff;
              background-color: #eee8aa;
              font-size: 28px;
              font-weight: normal}

.kiji2 h2 i   {margin-right: 7px;
              color: #888888}


.kiji2 p      {margin-top: 1;
              margin-bottom: 1px;
              line-height: 1.5;
              word-spacing:1em;
              font-size: 18px}

.kiji2 .lead  {max-width: 100%;
              font-size: 20px;
              color: #666666}

.kiji2 .kiji  {max-width: 100%;
              height: auto}

.kiji2 img    {max-width: 100%;
             height: auto;
             margin-bottom: 0px}

.kiji2 ul    {list-style: none}




/* 仕事いろいろのボックスを中央ぞろえにする設定 */
.box11-1-1,.box11-1-2
          {text-align: center}


.contents .boxA{border-bottom: solid 1px #dddddd}

.box5        {padding-top: 15px;
             padding-bottom: 15px;
             background-color: #dddddd}

/* ボックスの左右 */
.boxA,.box3,.box4,.box5,.box6,.box7,.box8,.box9,.box10,.box11,.box12,.box13,.box14,.box15,.box16,.box17,.box18,.box19,.box20,.box21,.box26
             {padding-left: 15px;
             padding-right: 15px}

/* ボックスの上下 */
.boxA        {padding-top: 20px;
             padding-bottom: 10px}

.box4        {padding-top: 20px;
             padding-bottom:20px}

.box4-1      {padding-bottom: 20px}

.box6        {padding-top: 0px}

.box6-1,.box6-2,.box6-3
             {padding-bottom: 10px}

.box7        {padding-top: 25px;
             padding-bottom: 25px}

.box7-1,.box7-2   {padding-top: 0px;
                    padding-bottom: 0px}

.box8        {padding-top: 25px;
             padding-bottom: 25px}

.box9        {padding-top: 25px;
             padding-bottom: 25px}

.box10       {padding-top: 25px;
             padding-bottom: 25px}

.box11       {padding-top: 25px;
             padding-bottom: 25px}

.box12       {padding-top: 25px;
             padding-bottom: 25px}

.box13       {padding-top: 25px;
             padding-bottom: 25px}

.box14       {padding-top: 25px;
             padding-bottom: 25px}

.box15       {padding-top: 25px;
             padding-bottom: 25px}

.box16       {padding-top: 25px;
             padding-bottom: 25px}

.box17       {padding-top: 25px;
             padding-bottom: 25px}

.box18       {padding-top: 25px;
             padding-bottom: 25px}

.box19       {padding-top: 25px;
             padding-bottom: 25px}

.box20        {padding-top: 20px;
              padding-bottom: 20px}

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

.box26        {padding-top: 20px;
              padding-bottom: 20px}



/* ########### 359px以下 ########### */
@media (max-width:359px) {

/* サイト名 */
.site img      {width: 225px;
               height: auto}

}

/* ########### 599px以下 ########### */
@media (max-width: 599px){

/* ナビゲーション */
.menu li a     {padding: 10px 7px;
               font-size: 18px}

/* キャッチコピー */
.catch         {padding: 5px 10px;
               font-size: 12px}

/* 記事 */
.kiji h1    {font-size: 26px}

.kiji h2    {font-size: 20px}

.kiji h3    {font-size: 16px}

.kiji .lead {font-size: 16px}

/* 記事2 */
.kiji2 h1    {font-size: 26px}

.kiji2 h2    {font-size: 20px}

.kiji2 .lead {font-size: 16px}

/* 好日誌の設定 */
.koujitusi h1    {font-size: 24px}

.koujitusi h2    {font-size: 18px}

.koujitusi h3    {font-size: 16px}


/* シルバーとは背景色つき文字 */
.silver h1    {font-size: 26px}

.silver h2    {font-size: 20px}

.silver .lead {font-size: 16px}

.silver p     {font-size: 16px}

/* 叢書の設定 */
.sousyo h1    {font-size: 18px}

.sousyo h3    {font-size: 14px}

.sousyou li   {font-size: 12px}


}

/* ########### 767px以下 ########### */
@media (max-width: 767px) {

/* ナビゲーションメニュー（縦並び） */

#menu            {display: none}

.menu ul         {margin: 0;
                 padding: 0;
                 list-style: none}

.menu li a       {display: block;
                 padding: 5px;
                 color: #000000;
                 font-size: 14px;
                 text-decoration: none}

.menu li a:hover {background-color: #eeeeee}

/* トグルボタン */
#menubtn        {padding: 6px 12px;
                border: solid 1px #aaaaaa;
                border-radius: 5px;
                background-color: #ffffff;
                position: absolute;
                top: 20px;
                right: 15px;
                cursor: pointer}

#menubtn:hover  {background-color: #dddddd}

#menubtn:focus  {outline: none}

#menubtn i      {color: #888888;
                font-size: 18px}

#menubtn span   {display: inline-block;
                text-indent: -9999px}

/* ナビゲーションメニュー（縦並び） */
.menu ul        {margin: 0;
                padding: 0px;
                list-style: none}

.menu li a      {display: block;
                padding: 5px;
                color: #000000;
                font-size: 18px;
                text-decoration: none}

.menu li a:hover {background-color: #eeeeee}

.menu img        {vertical-align: bottom}

/* 叢書の設定  */
.sousyo h1       {font-size: 20px}

.sousyo h3       {font-size: 16px}

.sousyo li       {font-size: 14px}





}

/* ########### 768px以上 ########### */
@media (min-width: 768px) {

/* トグルボタン */
#menubtn      {display: none}

/* ナビゲーション */
#menu         {display: block !important}

.menu ul      {margin: 0;
              padding: 0;
              list-style: none}

.menu li a    {display: block;
              padding: 10px 15px;
              color: #000000;
              font-size: 18px;
              text-decoration: none}

.menu li a:hover    {background-color: #eeeeee}

.menu ul:after      {content: "";
                    display: block;
                    clear: both}

.menu li      {float: left;
              width: auto}

/* BOX1とBOX2を横に並べる設定 */
.box A:after   {content: "";
               display: block;
               clear: both}

.box1          {float: left;
               width: auto}

.box2          {float: right;
               width: auto}

/* BOX4-1とBOX4-2を横に並べる設定 */
.box4:after  {content: "";
             display: block;
             clear: both}

.box4-1      {float: left;
             width: 70%;
             padding-right: 35px;
             -moz-box-sizing: border-box;
             -webkit-box-sizing: border-box;
             box-sizing: border-box}
             
.box4-2      {float: left;
             width: 30%}

/* BOX6-1、BOX6-2、BOX6-3を横に並べる設定 */
.box6:after  {content: "";
             display: block;
             clear: both}

.box6-1      {float: left;
             width: 32%;
             margin-right: 2%}

.box6-2      {float: left;
             width: 32%;
             margin-right: 2%}

.box6-3      {float: left;
             width: 32%}


/* BOX26-1、BOX26-2、BOX26-3を横に並べる設定 */
.box26:after  {content: "";
             display: block;
             clear: both}

.box26-1      {float: left;
             width: 32%;
             margin-right: 2%}

.box26-2      {float: left;
             width: 32%;
             margin-right: 2%}

.box26-3      {float: left;
             width: 32%}






/* BOX7-1とBOX7-2を横に並べる設定 */
.box7:after{content: "";
           display: block;
           clear: both}

.box7-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box7-2    {float: left;
           width: 20%}

/* BOX11-1-1とBOX11-1-2を横に並べる設定 */
.box11-1:after{content: "";
           display: block;
           clear: both}

.box11-1-1    {float: left;
           width: 50%}

.box11-1-2    {float: left;
           width: 50%}



/* BOX8-1とBOX8-2を横に並べる設定 */
.box8:after{content: "";
           display: block;
           clear: both}

.box8-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box8-2    {float: left;
           width: 20%}

/* BOX9-1とBOX9-2を横に並べる設定 */
.box9:after{content: "";
           display: block;
           clear: both}

.box9-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box9-2    {float: left;
           width: 20%}

/* BOX10-1とBOX10-2を横に並べる設定 */
.box10:after{content: "";
           display: block;
           clear: both}

.box10-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box10-2    {float: left;
           width: 20%}

/* BOX11-1とBOX11-2を横に並べる設定 */
.box11:after{content: "";
           display: block;
           clear: both}

.box11-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box11-2    {float: left;
           width: 20%}


/* BOX12-1とBOX12-2を横に並べる設定 */
.box12:after{content: "";
           display: block;
           clear: both}

.box12-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box12-2    {float: left;
           width: 20%}

/* BOX13-1とBOX13-2を横に並べる設定 */
.box13:after{content: "";
           display: block;
           clear: both}

.box13-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box13-2    {float: left;
           width: 20%}

/* BOX14-1とBOX14-2を横に並べる設定 */
.box14:after{content: "";
           display: block;
           clear: both}

.box14-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box14-2    {float: left;
           width: 20%}

/* BOX15-1とBOX15-2を横に並べる設定 */
.box15:after{content: "";
           display: block;
           clear: both}

.box15-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box15-2    {float: left;
           width: 20%}

/* BOX16-1とBOX16-2を横に並べる設定 */
.box16:after{content: "";
           display: block;
           clear: both}

.box16-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box16-2    {float: left;
           width: 20%}

/* BOX17-1とBOX17-2を横に並べる設定 */
.box17:after{content: "";
           display: block;
           clear: both}

.box17-1    {float: right;
           width: 80%;
           padding-left: 50px;
           -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box}

.box17-2    {float: left;
           width: 20%}

/* BOX18-1とBOX18-2を横に並べる設定 */
.box B:after   {content: "";
               display: block;
               clear: both}

.box18-1          {float: left;
               width: 48%}

.box18-2          {float: right;
               width: 48%}




/* BOX19-1とBOX19-2を横に並べる設定 */
.box C:after   {content: "";
               display: block;
               clear: both}

.box19-1          {float: left;
               width: 48%}

.box19-2          {float: right;
               width: 48%}


}

/* ########### 1190以上 ########### */
@media (min-width: 1190px){

/* 全体の横幅を固定 */
.box3,.box4,.boxA-inner,.box5-inner,.box6,.box7,.box8,.box9,.box10,.box11,.box12,.box13,.box14,.box15,.box16,.box17,.box18,.box19,.box20,.box21,.box26
              {width: 1140px;
               margin-left: auto;
               margin-right: auto}

/* BOX Aの下に罫線を挿入 */
.boxA         {margin-bottom: 20px;
              border-bottom: solid 1px #dddddd}



}