@charset "utf-8";
/* CSS Document */

/* 基本的なページスタイル */
body {
    font-family: sans-serif;
    margin: 0;
	background: url('../images/main_bg.jpg') repeat-y;
    color: #FFFFFF;
	text-align: center;
}

.header {
    text-align: center;
    padding: 5px;
    background-color: #B50014;
    border-bottom: 1px solid #ddd;
	color: #ffffff;
}
.header h1{
	padding: 0;
	margin: 0;
}
#mainTitle img{width: 95%;max-width: 741px;}
main {
    max-width: 1200px;
    margin: 20px auto;
    padding: 0 20px;
}
footer img.imagePhoto{width:95%;max-width: 941px;}
footer a img{width:80%;max-width: 459px;}
/* PDFビューワースタイル */
.viewer-container {
    width: 100%;
    margin-bottom: 40px;
}

#pdf-viewer {
    width: 60%;
    /* A4用紙の縦横比 (約1:1.414) を設定 */
    aspect-ratio: 1 / 1.5;/* ビューワーの高さ */
    border: 1px solid #ccc;
	margin: 0 auto;
	display: block;
}

/* アーカイブスタイル */
section.archive-container{
	width: 90%;
	margin: 0 auto;
}

.archive-container h2 {
  position: relative;
  display: inline-block;
	width: 95%;
    text-align: center;
	background: #B50014;
	color: #ffffff;
    margin:0 0 20px;
	padding: 0.2em 0 0.5em;
}
.archive-container h2::after {
	  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #B50014;
}
.archive-container h2 p {
  margin: 0;
  padding: 0;
}

.archive-container h2 p span{
	display: block;
	font-size: 0.7em;
}

.archive-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 横3列のグリッド */
    gap: 10px; /* サムネイル間の余白 */
}

.thumbnail-item {
    text-align: center;
/*    border: 1px solid #ddd;
    background-color: #fff;*/
    padding: 10px;
    cursor: pointer;
    transition: box-shadow 0.3s;
}

.thumbnail-item img:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.thumbnail-item img {
    width: 100%;
    max-width: 292px;
    height: auto;
    border: 2px solid #B50014;
    margin-top: 10px;
}

.thumbnail-item p {
    max-width: 292px;
    margin: 0 auto;
	padding: 0.5em 0;
    font-size: 1em;
	background: #B50014;
    border: 2px solid #B50014;
	color: #ffffff;
}
footer{
	background: #FFFFFF;
	border-bottom: 20px solid #B50014;
	padding: 50px;
}
footer a{
	display: block;
	margin-top: 20px;
}
br.spBR{display: none;}
.pcBR{display: inline;}
/* レスポンシブ対応 (画面幅が狭い場合) */
/* style/style.css */

@media (max-width: 768px) {
    /* 以前追加したコード...*/
    #pdf-viewer {
        height: 70vh;
        aspect-ratio: unset;
    }
    
    /* ↓↓↓ これを追加 ↓↓↓ */
    #pdf-viewer-section {
        display: none; /* PDFビューワーのセクション全体を非表示にする */
    }

    .archive-grid {
        grid-template-columns: repeat(2, 1fr);
    }
	br.spBR{display: inline;}
	.pcBR{display: none;}

}
/*
@media (max-width: 480px) {
    .archive-grid {
        grid-template-columns: 1fr; /* 1列に */
/*    }
}*/