@charset "UTF-8";

/* 
色の設定
Main : #26305d
Sub : #42548b
Balance : #b4d6f3
*/

/*　ページ全体の設定　*/
body {
    margin: 0;
    font-family: sans-serif;
}

/*　リンク　*/
a {
	text-decoration: none;   
} 
a:hover {
    opacity: 0.7;
}

/*　「ヘッダー」ブロック　*/
header {
    padding: 25px 15px;
    font-size: 36px;
    text-align: center;
}

.hat {
	margin-bottom: 20px;
	display: flex;/*　横に並べる　*/
	justify-content: space-between;/*　両端に表示　*/
}

.hat a {
	padding-top: 20px;
	color: #26305d;
	font-size: medium;
	text-decoration: none;
}



.containerHeader {
    font-weight: bold;
    text-align: center;
}

#siteName {
	font-size: xx-large;
	color: #26305d; 
	text-decoration: none;
} 

header h1 {
	margin: 0;
}

/*　ナビゲーションメニュー　*/ 
.headlines a {
	color: #666666;
	font-weight: bold;
	text-decoration: none;
}

.headlines ul {
	list-style-type: none;
    padding: 0; 
    color: #666666;
    font-size: 8px;
    display: flex;
    justify-content: center;
}

.headlines li:not(:last-child) {
    margin-right: 20px;
}  

/*　サブメニュー：注目記事メニュー（トピックス）　*/
.topics ul {
    list-style-type: none;
    padding: 0;
}

.topics a {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.topics figure {
    width: 100px;
    flex: none;
}

/*　「コンテンツ」ブロック　*/
.contents {
    background-color: #42548b;
    padding: 40px 15px;
}

.containerBodyArticles {
	background-color: #42548b;
}

.topics img {
    vertical-align: bottom;
}

.topics h3 {
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 10px;
}

/*　パンくずリスト　*/
.breadcrumbs ul {
	padding: 0;
	margin-top: 0;
	margin-bottom: 30px;
}
.breadcrumbs li {
	display: inline;
	list-style-type: none;
	font-size: small;
}

/*　記事　*/
article {
    background-color: #ffffff;
    padding: 10px;
} 

article h1 { /*　記事の大見出し　*/
    font-size: x-large;
		margin: 0;
}   /*　記事の大見出し　*/

.subtitle ul { /*　記事の小見出し一覧（内部リンクにより、それぞれの記事に飛ぶ）　*/
	list-style-image: url(images/castle4.png);
}

.subtitle li {
	margin: 10px 0;
}

.EnclosureSubtitle { /*　それぞれの記事の小見出し　*/
	background-color: #b4d6f3;
	padding: 5px;
	font-size: large;
}

.textImg {
	padding: 0 20px;
}

p {
    line-height: 2;
}


/*　画像　*/
img {
    width: 100%;
    height: auto;
}

figure {
    margin: 0;
}


/*　記事ページの画像　*/
.picture ul {
    list-style-type: none;
    padding: 0;
}

.picture figure {
    flex: none;
    margin: 20px 0;
}

.picture img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
    display: inline-block;
}

/*　グーグル・マップ　*/
#map {
    list-style-image: url(images/place1.png);
}

#map a {
	color: #26305d;
	font-size: 12px;
	/* margin-left: 20px; */
}


/*　最終更新日　*/
time {
  color: #666666;
  margin-bottom: 0px;
  display: block;
	font-size: 12px;
}

.clock p {
  margin: 0;
  margin-right: 5px;
    
}

.clock ul {
	list-style-image: url(images/clock2.png);
	margin-left: 0;
}


/*　A8の広告　*/
/*　.A8Program {
    text-align: center;
}

.A8Program p {
    color: #999999;
    font-size: small;
    margin: 0;
}　*/

/* asideタグたちの下敷き */
.others {
	background-color: #ffffff;
	padding: 20px;
	margin-top: 40px;
}

/*　サブメニュー　(記事ページ？)*/
aside {
    background-color: #ffffff;
    padding: 20px;
}

/*　参考文献（記事ページの下部）　*/
.References {
	padding: 0;
}

.References h3 {
	color: #ffffff;
    font-weight: normal;
    text-align: center;
	background-color: #26305d;
	padding: 10px;
}

.References ul {
    list-style-type: none;
    padding: 10px;
}

.References a {
    display: flex;
    align-items: center;
}

.References img {
	width: 20px;
    flex: none;
    margin-right: 10px;
}

/*　関連記事（記事ページの下部）　*/
.RelatedArticles {
	padding: 0;
}

.RelatedArticles h3 {
	color: #ffffff;
    font-weight: normal;
    text-align: center;
	background-color: #26305d;
	padding: 10px;
}

.RelatedArticles ul {
    list-style-type: none;
    padding: 10px;
}

.RelatedArticles a {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.RelatedArticles img {
	width: 80px;
    flex: none;
    margin-right: 10px;
}

/*　外部リンク（記事ページの下部）　*/
.ExternalLinks {
	padding: 0;
}

.ExternalLinks h3 {
	color: #ffffff;
  font-weight: normal;
  text-align: center;
	background-color: #26305d;
	padding: 10px;
}

.ExternalLinks ul {
  list-style-type: none;
  padding: 10px;
	list-style-image: url(images/link5.png);
}

.ExternalLinks a {
    display: flex;
    align-items: center;
}

/*　「フッター」ブロック　*/
footer {
    background-color: #26305d;
    padding: 25px 15px;
    color: #efe8e1;
    font-size: 14px;
    text-align: center;
}

/*　トップへ戻るボタン　*/
.ReturnTop {
	text-align: right;
}

.ReturnTop a { 
	font-weight: bold;
	color: #666666;
}

/*　トップイメージ：　ヒーローイメージ　*/
.hero {
    background-image: url(images/hero-04.jpg); 
    background-size: cover;
    background-position: center;
    height: 232px;
    color: #ffffff;
    padding: 15px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.hero h2 {
    font-size: x-large;
    text-shadow: 0 0 5px #444444;
    text-align: center;
    margin: 0;
} 


.hero p {
    font-weight: bold;
    text-shadow: 0 0 10px #444444;
    margin-top: 0;
}

.hero a {
    border: solid 2px #ffffff;
    padding: 10px 40px;
    border-radius: 10px;
    background-color: rgba(41, 171, 226,0.7);
    margin-top: 10px;
}

/*　ホーム：記事一覧　*/
.toppost {
   padding: 15px
}

.containerHome {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between; 
}

.toppost article {
   padding: 0;
   width: 48%;
   flex: none;
}

.toppost article:not(:nth-last-child(-n+2)) {
   margin-bottom: 12px;
}

.toppost h2 {
	color: #42548b;
  font-weight: normal;
  text-align: center;
	text-shadow: 1px 1px 1px #26305d;
}

.toppost h3 {
  color: #000000;
  margin-top: 0;
  margin-bottom: 5px;
  font-size: medium;   
}

.toppost figcaption {
	color: #333333;
	font-size: small;
}

.placeHome {
	list-style-image: url(images/place2.png);
	margin: 0;
	padding-left: 20px;
}

.placeHome li {
	color: #333333;
	font-size: small;
	margin-bottom: 20px;
}

.lastUpdatedHome {
	list-style-image: url(images/clock2.png);
	margin: 0;
	padding-left: 23px;
}

.lastUpdatedHome time {
	color: #333333;
	font-size: small;
	margin: 0;
}


/* ====　ここから下はPC版　==== */
@media (min-width: 600px) {
	
.hat {
	max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

/*　PC版：コンテナ　*/
.containerHome {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}	
	
.containerHeader {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.containerBodyArticles {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}	
	
/*　PC版：「ヘッダー」ブロック内のコンテナ　*/
header .containerHeader {
    display: flex;
    justify-content: space-between;
}

.headlines ul {
  font-size: 12px;　/*　ナビリストの文字の大きさ　*/
}	
	
h1 {
    font-size: xx-large;
}	
	
/*　PC版：記事　*/	
article {
	padding: 20px 30px;
} 

.timeTextImg {
	padding: 0 30px;	
}	
	
p {
    font-size: 18px;
}
    
 /*　PC版：画像　*/
.picture ul {
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.picture li {
    padding: 0;
    width: 48%;
    flex: none;
} 
    
.picture article:not(:nth-last-child(-n+2)) {
    margin-bottom: 12px;
}    
    
.picture h3 {
    margin: 0;
    font-size: 18px;
    margin-bottom: 30px;
    line-height: 2;
}   

/*　PC版：関連記事（記事ページの下部）　*/ 
.RelatedArticles figure {
    width: 120px;
}    
        
/*　PC版：トップページ：　ヒーローイメージ　*/   
.hero h2 {
    font-size: x-large;
}

/*　PC版：トップページ：　記事一覧　*/
.toppost article {
    width: 23%;
}

.toppost article:not(:nth-last-child(-n+2)) {
    margin-bottom: 0;
}    
	
/* PC版：asideタグたちの下敷き */
.others {
	padding: 20px 30px;
}

/*　PC版：参考文献（記事ページの下部）　*/	
.References ul {
    padding: 10px 20px;
}	

/*　PC版：関連記事（記事ページの下部）　*/	
.RelatedArticles ul {
    padding: 10px 20px;
}	

/*　外部リンク（記事ページの下部）　*/
.ExternalLinks ul {
    padding: 10px 20px;
}	

	
	
}

/* ====　PC版の設定ここまで　==== */

