@import url('https://fonts.googleapis.com/css2?family=Kaisei+Tokumin&display=swap');

@charset "UTF-8";

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

/* 背景画像 */

body.contents-kanrenbon  {background-image: url(../contents.p/miyajimakiyomori1.jpg); 
                          background-repeat: no-repeat;
                          background-attachment: fixed;
                          background-position: right bottom; background-size:550px auto}

body.contents-shiryou  {background-image: url(../contents.p/miyajimakiyomori1.jpg); 
                          background-repeat: no-repeat;
                          background-attachment: fixed;
                          background-position: right bottom; background-size:550px auto}

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

.site h1       {margin: 0;font-family: 'Kaisei Tokumin', serif;
                font-size: 26px}

.site h1 img {margin-bottom: -10px; margin-top: -10px}

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

.kiji h3        {margin-top: 0;
                 margin-bottom: 20px;
                 padding-left: 20px;
                 border-left: solid 20px #585858;
                 font-size: 36px;
                 font-weight: normal}

.kiji h4        {margin-top: 0;
                 margin-bottom: 20px;
                 padding-left: 20px;
                 border-left: solid 20px #2f4f4f;
                 font-size: 36px;
                 font-weight: normal}




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

body.contents-jinbutsu .kiji h2 i   {margin-right: 7px;
                                     color: #aaa52a}

body.contents-zenshoudan .kiji h2 i {margin-right: 7px;
                                     color: #585858}

body.contents-kanrenbon .kiji h2 i  {margin-right: 7px;
                                     color: #2f4f4f}

body.contents-shiryou .kiji h2 i  {margin-right: 7px;
                                     color: #2f4f4f}

.kiji p         {max-width: 640px;
                 margin-top: 0;
                 margin-bottom: 20px}


.kiji p i        {color: #2f4f4f}


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

.kiji a         {color: #000000;
                 text-decoration: none}

.kiji a:hover  {color: #708090}


/* パンくずリスト */
.bread ol      {marign: 0;
                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 {color: #708090}

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

.bread li       {display: inline-block; 
                 font-size: 14px;
                 color:#000000}

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



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

.sidemenu h1   {margin: 0; 
                font-size: 16px;
                color: #373737;
                font-weigh: bold;
                padding: 10px}

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

.sidemenu h2   {margin: 0; 
                font-size: 16px;
                color: #373737;
                font-weigh: bold;
                padding: 10px}

.sidemenu h2 i {margin-right: 5px;
                color: #a0522d;
                font-size: larger}

.sidemenu h3   {margin: 0; 
                font-size: 16px;
                color: #373737;
                font-weigh: bold;
                padding: 10px}

.sidemenu h3 i {margin-right: 5px;
                color: #859146;
                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: #373737;
                font-size: 14px;
                text-decoration: none}

.sidemenu li a:hover {color: #bbbbbb; background-color: rgba(255,255,255,0.5)}



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

/* headerの下に罫線を挿入 */
.contents .header{border-bottom: solid 1px #cccccc}

/* footerをバーの形にする */
.footer          {padding-top: 15px;
                 padding-bottom: 15px;
                 background-color: rgba(255,255,255,0.5)}


/* ボックスの左右 */
.header, .footer, .pickup, .box7
                 {padding-left: 15px;
                  padding-right: 15px}

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



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


/* headerとinfoの背景 */
.header            {background-color: none}

/* headerの下に罫線を挿入 */
.header            {margin-bottom: 10px;
                  border-bottom: solid 1px #cccccc}



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

/* ナビゲーション */
.site h1       {font-size: 18px}

.menu li a      {padding: 10px 7px;
                 font-size: 12px;}

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

.kiji h2        {font-size: 18px}


body.contents-shiryou     {background-size: 320px auto}

}


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

.catch          {visibility: hidden;}

.title          {padding: 5px 10px;
                 font-size: 34px}



/* トグルボタン */
#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     {display: none}

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

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

.menu li a:hover {color: #bbbbbb; background-color: rgba(255,255,255,0.5)}




}


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

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

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

.menu ul       {margin: 0;
                padding: 0}

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

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

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

.menu li          {float: left;
                   width: auto;
                   list-style-type: none;
                   border-right:  solid 1px #aaaaaa}

.menu li:first-child  {border-left:  solid 1px #aaaaaa}



/* header-siteとheader-navを横に並べる設定 */

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

.header-site           {float: left;
                 width: auto}

.header-nav           {float: right;
                 width: auto}


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

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

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


}


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

/* 全体の幅を固定 */
.photo, .info, .header-inner, .footer-inner, .pickup, .box7
                 {width: 1140px;
                 margin-left: auto;
                 margin-right: auto; }

}