@charset "UTF-8";/* CSS変数の宣言 */
/* テンプレートで対応しきれないスタイルをこちらに記入します。ASのみ書き込み可能 */
a{
	text-decoration:none;
}

.br::before{
	content:"\A";
	white-space:pre;
}

@media only screen and (max-width: 767px) {
	.sp-br::before{
		content:"\A";
		white-space:pre;
	}
}

/*#main-title h1 {
color:var(--accentColor);
}*/

#main-title h1{
  font-size: 1.5rem;
	position:relative;
	margin-left:32px;
}

#main-title h1::before {
	content:"";
	position:absolute;
	background-image:url(../images/com_mark_3c.png) ;
	top:2px;
	left:-35px;
	 width:2.0rem;
	height: 2.0rem;
	background-size:contain;
}

#intro > .intro-container > .intro-txt-jpn{
	padding: 2rem 0 0.5rem;
}

#intro > .intro-container > .intro-txt-eng{
	padding: 0.5rem 0 2rem;
	padding-top:2em;
}

/*グローバルメニュー表示*/
#contents-menu {
	text-align:center;
	background: linear-gradient(#fff,rgba(255, 255, 255, 0.5));
}

#contents-menu a{
	padding: 0.5rem;
	/*padding: 0 0.5rem 0.5rem;*/
}

@media (max-width:999px) { /* レスポンシブ非表示 */
	#contents-menu{
		display:inline-block;
	}
	#contents-menu li{
		width: 33%;
	}
	/*表示に変更*/
	/*  #slide-area h2 {
  display:none;
  }*/
}
@media (max-width: 616px) {
	#contents-menu li{
		width: 50%;
		min-width:50%;
		border:1px solid #eaeaea;
		border-collapse:collapse;
	}
}

/*contents-menu*/
#contents-menu {
	z-index:1000;
	position:absolute;
}

.bg-white {
	background:#fff;
	box-shadow: 4px 4px 4px rgba(0,0,0,0.3);
}
/*.bg-white a{
  color: var(--accentColor);
  }*/

/*wide1280を解除*/
.width-full {
	width:100%;
	max-width:100%;
}

/* search-center---- */
.container#search-center-wrap {
	padding-top:2rem;
}

/*アーカイブ名タイトル*/
.hiroshima-city-college-title{
	position: relative;
	width: 100%;
}
/*スライドに20%フィルター*/
.splide::before {
	content:"";
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, .2);
	/*background:url(../images/hato.png) center center / contain;*/
	position: absolute;
	top: 0;
	bottom: 50%;
	left: 0;
	right: 0;
	z-index: 3;
}

.hiroshima-city-college-title h2 {
	position: absolute;
	height: auto; 
	line-height:1.0;
	left:50%;
	width:90%;
	z-index: 4;
	color:#fff;
}

.hiroshima-city-college-title h2.jp {
	font-size: clamp(2rem, 0.5rem + 3.125vw, 3rem);
	font-weight:900;
	line-height:1.1;
	width:90%;
	top:45%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	margin:0 auto;
	text-align:center;
	white-space:nowrap;
}

.hiroshima-city-college-title h2.en {
	font-size: clamp(1.6rem, 1rem + 1.25vw, 2rem);
	/*font-size: clamp(1.8rem, 1.0889rem + 1.4815vw, 2.2rem);*/
	transform: scaleX(0.8);/*縦長*/
	font-weight:400;
	/*top:70%;*/
	top:75%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	margin:0 auto;
	text-align:center;
	letter-spacing:0.15rem;
}

.hiroshima-city-college-title .title-border {
	position:absolute;
	top:62%;
	left:35%;
	display:flex;
	width:30%;
	height:6px;
	  background: linear-gradient(
    to right, 
    #53A2D7 0%, #53A2D7 25%, /*青*/
    #58A84A 25%, #58A84A 50%, /*緑*/
    #D4343A 50%, #D4343A 75%, /*ピンク*/
	#A2883E 75%, #A2883E 100% /*きんちゃ*/
	/*#d9b44a 75%, #d9b44a 100% きんちゃ明るく*/
  );
	background-size: 50% 6px;
	z-index:99;
}

@media (max-width: 767px) {
	.hiroshima-city-college-title h2.jp {
		font-size: clamp(1.8rem, -1.7556rem + 7.4074vw, 3.8rem);
		top:45%;
	}

	.hiroshima-city-college-title h2.en {
		font-size: clamp(1.3rem, -0.8333rem + 4.4444vw, 2.5rem);
		top:65%;
	}

	.hiroshima-city-college-title .title-border {
		top:55%;
	}
}

/* インジケーター 再生・停止・前へ・次へ ボタン前面へ*/
.splide__pagination.splide__pagination--ltr, .splide__arrows > button{
	z-index:999;
}

/*以下スライドの高さ指定公文書館と同等の指定に変更*/
.splide__slide img{
	/*width:100%;
	height:45vh;
	min-height:400px;
	max-height:800px;
	object-fit: cover;
	padding:0 ;*/
	width:100%;
	height:340px;
	min-height:340px;
	max-height:340px;
	object-fit: cover;
	padding:0 ;
  }

#intro{
	/*margin-top: 2rem;*/
	margin-top:1rem;
}

/*見出し*/
/*adeac-styleより
[class^="list-design"] h3{
  margin-bottom: 2rem;
  line-height: 1.5;
}

section h3 {
	  padding: 0 2rem;
  font-size: 2.0rem;
}*/

/*上書き*/
[class^="list-design"] h3, .container h3{
	position:relative;
	font-size:2.5rem;
	color:#575757;
	font-weight:900;
	padding:0;
	padding-top:2rem;
	padding-bottom:2rem;
}

[class^="list-design"] h3:before, .container h3:before {
	position:absolute;
	top:-.5rem;
	left:calc(50% - 4.5rem);
	left:50%;
	transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
	margin:0 auto;
	display:block;
	font-size:3.0rem;
	font-weight:300;
	letter-spacing: 0.3rem;
	padding-bottom:2rem;
	color:#cdcdcd;
	z-index:2;
}

[class^="list-design"]#cont0 h3:before {
	content:"ARCHIVES";
}
.container#news h3:before {
	content:"NEWS";
}

.container#external-link h3:before {
	content:"LINK";
}

#external-link ul{
	justify-content: center;
  }

[class^="list-design"]#cont0 h3:after, .container h3:after {
	content:"　";
	position:absolute;
	display:block;
	top:1.0rem;
		left:50%;
	  transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	width:5%;
	height:6px;
	  background: linear-gradient(to right, #00798C 0%, #00798C 50%, /*グレー*/ transparent 50%, transparent 100%);
	background-size: 4px 6px;
	background-repeat:repeat;
	z-index:99;
}


.list-design4 .item{
	margin: 0.5rem;
	/*border: 1px solid var(--borderColor);*/
	border: 1px solid #dedede;
	background-color: #ffffff;
		-moz-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
	-webkit-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
	box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
  display: block;
  padding:0;

}

.list-design4 .item > h4{
	  display: block;
  padding: 1rem 1.5rem ;
	/*  font-size: 1.5rem;*/
	font-size:1.7rem;
  line-height:0;
	transition: .3s ease;
	background:#fff;
	padding:0;
}

/*adeac-styleをリセット*/
.list-design4 .item > h4 a:hover{
	/*  background:var(--accentColor);*/
	background:transparent;
}

.list-design4 .item > h4.art {
	border-bottom:solid 4px #FF0066;
}

.list-design4 .item > h4.art:hover {
	background:#FF0066 ;
}

.list-design4 .item > h4.peace {
	border-bottom:solid 4px #B58E26;
}

.list-design4 .item > h4.peace:hover {
	background:#B58E26;
}

.list-design4 .item > h4 a{
	line-height:0.9;
	padding:0;
}


.item > h4 a span.eng {
	font-size:0.7em;
	line-height:1.2;
	color:#696969;
	display:block;
}

.list-design4 .item > h4 a span {
	display:block;
	padding-bottom:0;
}

.list-design4 .item > h4 a{
  display: block;
}

.list-design4 .item > h4:hover a,
.list-design4 .item > h4:hover a .eng{
  color: #fff;
  opacity: 1;
}



/* 2列-中央 */
.list-design4.column2 .item > h4 {
	padding:1.2rem 1.0rem .5rem;
}

.list-design4.column2 .item > h4 a{
	/*padding: 1.25rem 1.5rem;*/
	padding: 0.1rem 0.2rem 0.2rem;
}
/*所蔵機関のイメージポジション指定*/
.list-design4.column2 .item img#cont1, .list-design4.column2 .item img#cont2 {
	object-position: 50% 40%;
}

.list-design4.column2 .item p{
	/*  padding: 0.5rem 1.65rem 2rem;*/
	padding: 0.5rem 1.6rem 2rem 1.2rem;
	font-size: 1.0rem;
	line-height:1.65;
	text-align:left;
}

/*footer*/
footer {
	background:var(--accentColor);
	color:#fff;
}

nav#footer-links ul li a {
	color:#fff;
}
/*再生停止インジケータ非表示を解消*/
@media (max-width:999px) {
  .splide__arrows > button.splide__toggle{
    padding:0;
z-index:9999;
  }
}


  /* 検索ウィンドウ */
.hiroshima-search #search-center-box {
    border: 2px solid #444444 !important;
}

.hiroshima-search #search-center-box button[type="submit"] {
    background-color: #444444 !important;
    border-color: #444444 !important;
    /* ボタン内のアイコンや文字が消えないように白指定 */
    color: #ffffff !important;
}

.hiroshima-search #search-center-box button[type="submit"]:hover {
    background-color: #222222 !important;
    opacity: 0.9;
}

/* 2段目バナー横並び中央寄せ */
#external-link-second-row ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
}

#external-link-second-row li {
    flex: 0 1 auto;
}
