@charset "UTF-8";
/* gallery.css */


/*------------ pc  ------------*/	
@media screen and (min-width: 501px) {
/*ここにpc用スタイルを記述*/
	
	
	


/*------------  BACKGROUND ------------*/	


#background_top {
	width: 100%;
	background-image: url("../images/news_bg.webp");
	background-repeat: no-repeat;
	background-size:contain;
	padding: 0 0 0 0;
	top:0;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
	position: relative;
	z-index:1;
}



/*------------  MAIN ------------*/	

#wrap_box_w {
	width: 10%;
	position: relative;
	padding: 0 0 22% 0;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
	border-right: 1.5px #ffffff solid;
}

#wrap_box_b {
	width: 90%;
	position: relative;
	padding: 0 0 20% 0;
	margin-left: 10%;
	margin-top: -15%;
	margin-bottom: -0.0em;
	border-left: 1.5px #000000 solid;
	white-space: nowrap;
}

#wrap_box_w h2 {
	font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-style: normal;
	font-weight: 100;
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	color: #ffffff;
	top: 0;
	font-size: 3.0em;
	padding: 120% 0 0 30%;
	position: relative;
	transform: scale(1.25, 1);
	font-display: swap;
	z-index: 20;
}



.font_date {
	text-align: left; 
	font-family: "Montserrat", sans-serif;
	font-style: normal;
	font-weight:400;
	letter-spacing: 0.1rem;
	color: #212121;
	top: 0;
	font-size: 0.98rem;
	padding: 8% 0 0 8%;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
}
	
h2.font_newstitle {
	text-align: left; 
	position: relative;
	font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-style: normal;
	font-weight: 300;
	color: #212121;
	top: 0;
	left: 0;
	font-size: 2.1em;
	line-height: 1.5em;
	letter-spacing: 0.1em;
	padding: 0 0 0 0;
	line-height: 1.4em;
	margin-top: -0.0em;
	margin-left: 8%;
	margin-bottom: 1em;	
	border-bottom: 1.5px #212121 solid;
	display: inline-block;
}	
	
.pad_mainimage {
	max-width: 570px;
	max-height: 470px;	
	height: auto;
	text-align: left;
	padding: 1% 0 5% 8%;
	margin-top: -0.0em;	
	margin-bottom: -0.0em;	
	position: relative;
	}	
	
	
.pad_mainimage img {
	max-width: 570px;
	max-height: 470px;
  	object-fit: contain;	
}
	
.font_main01 {
	text-align: left; 
	font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-style: normal;
	font-weight: 300;
	color: #323232;
	top: 0;
	font-size: 1.3em;
	letter-spacing: 0.1em;
	padding: 0 0 3% 8%;
	line-height: 2.2em;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
}



.banner_archivebu {
	width: 20%;
 	position: relative;
	border-radius: 3px;
  	padding: 1% 2% 1% 4%;
  	background: rgb(11 28 22 / 0%);
	border: 1px #212121 solid;
	font-family: fot-tsukuardgothic-std, sans-serif;
	font-style: normal;
	font-weight: 100;
  	color: #212121;
  	line-height: 1.0em;
	font-size:1.3em;
  	text-align: center;
  	transition: .2s;
	margin-top: 8%;
	margin-bottom: 11%;
	margin-left: 8%;
}
	
.banner_archivebu::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 25px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #212121;
  border-right: 2px solid #212121;
  transform: rotate(-135deg);
  transition: .2s;
  box-sizing: border-box;
}	
	
	
.banner_archivebu:hover {
	background:#FFE820;
	transition: background-color .4s;
}	
	
	
/*------ アーカイブ  -------*/	

	
#box_newsbanner {
	width: 68%;
	border: 1px #989898 solid;
	display: flex;
	position: relative;
	margin-top: -0.0em;
	margin-bottom: 5%;
}	
	
#box_newsbanner a {
	display:block;
	position:absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	z-index: 10;
	transition-duration: 0.5s;
} 

#box_newsbanner .left_icon {
	width: 50%;
	padding: 1% 1% 0 1%;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
}
#box_newsbanner .right {
	width: 42%;
	padding: 2% 2% 2% 3%;
	top: 0;
	position: relative;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
}
	
#box_newsbanner .right .txt {
	text-align: left;
	font-family: fot-tsukuardgothic-std, sans-serif;
	font-style: normal;
	font-weight: 100;
	color: #212121;
	top: 0;
	font-size: 1.1em;
	letter-spacing: 0.1em;
	line-height: 1.6em;
	font-display: swap;
}	
	
#box_newsbanner .right .banner_bu {
	width: 70%;
 	position: relative;
	border-radius: 3px;
  	padding: 4% 3% 4% 3%;
  	background-color: #a09143;
	font-family: fot-tsukuardgothic-std, sans-serif;
	font-style: normal;
	font-weight: 100;
  	color: #ffffff;
  	line-height: 1.0em;
	font-size:1.2em;
  	text-align: center;
  	transition: .2s;
	margin-left: 27%;
}
	
#box_newsbanner .right .banner_bu::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 25px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  transition: .2s;
  box-sizing: border-box;
}	
	
	
#box_newsbanner:hover .right .banner_bu {
	background: #FFD401;
	transition: background-color .4s;
}	
	

	
/*------------  TOPICS ------------*/	
	
#wrap_topics {
	width: 68%;
	border-bottom: 1px #8f8f8f solid;
	display: flex;
	position: relative;
	padding:  0 0 1% 0;
	margin-top: 1%;
	margin-bottom: 1%;
	z-index: 20;
}	

#wrap_topics .font_year {
	width: 15%;
	text-align: left;
	font-family: "Montserrat", sans-serif;
	font-style: normal;
	font-weight:300;
	letter-spacing: 0.06em;
	color: #212121;
	top: 0;
	font-size: 1.1em;
	padding: 1% 0 0 2%;
	position: relative;
}	

#wrap_topics .font_news {
	width: 82%;
	text-align: left;
	font-family: fot-tsukuardgothic-std, sans-serif;
	font-style: normal;
	font-weight: 100;
	color: #212121;
	letter-spacing: 0.06em;
	line-height: 1.2em;
	top: 0;
	font-size: 1.2em;
	padding: 1% 0 0 4%;
	position: relative;
	
}		
	
}



/*------------ smartPhone  ------------*/	
@media screen and (max-width: 500px) {
/*ここにスマホ用スタイルを記述*/



/*-------  BACKGROUND -------*/	


#background_top {
	width: 100%;
	background-image: url("../images/news_bg_smp.webp");
	background-repeat: no-repeat;
	background-size:contain;
	padding: 0 0 0 0;
	top:0;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
	position: relative;
	z-index:1;
}
	

/*------------  MAIN ------------*/	

#wrap_box_w {
	width: 18%;
	position: relative;
	padding: 0 0 22% 0;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
	border-right: 1.5px #ffffff solid;
}

#wrap_box_b {
	width: 82%;
	position: relative;
	padding: 0 0 20% 0;
	margin-left: 18%;
	margin-top: -5%;
	margin-bottom: -0.0em;
	border-left: 1.5px #111111 solid;
}

#wrap_box_w h2 {
	font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-style: normal;
	font-weight: 100;
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	color: #ffffff;
	top: 0;
	font-size: 1.7rem;
	letter-spacing: 0.02em;
	line-height: 1.4rem;
	padding: 20% 0 0 30%;
	position: relative;
	transform: scale(1.25, 1);
	font-display: swap;
	z-index: 20;
}




.font_date {
	text-align: left; 
	font-family: "Montserrat", sans-serif;
	font-style: normal;
	font-weight:400;
	letter-spacing: 0.1rem;
	color: #212121;
	top: 0;
	font-size: 0.68rem;
	padding: 8% 0 0 8%;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
}
	
h2.font_newstitle {
	text-align: left; 
	position: relative;
	font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-style: normal;
	font-weight: 300;
	color: #212121;
	top: 0;
	left: 0;
	font-size: 1.0rem;
	line-height: 1.1rem;
	letter-spacing: 0.06rem;
	padding: 0 0 0 0;
	line-height: 1.4em;
	margin-top: -0.0em;
	margin-left: 8%;
	margin-bottom: 1em;	
	border-bottom: 1.5px #212121 solid;
	display: inline-block;
}	
	
.pad_mainimage {
	max-width: 76%;
	max-height: 45%;
	text-align: left;
	padding: 1% 0 5% 8%;
	margin-top: -0.0em;	
	margin-bottom: -0.0em;	
	}		
	
.pad_mainimage img {
	max-width: 76%;
	max-height: 45%;
  	object-fit: contain;	
}
	
.font_main01 {
	text-align: left; 
	font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-weight: 300;
	color: #323232;
	top: 0;
	font-size: 0.8rem;
	letter-spacing: 0.06rem;
	padding: 0 3% 3% 8%;
	line-height: 1.8em;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
}


.banner_archivebu {
	width: 50%;
 	position: relative;
	border-radius: 3px;
  	padding: 1% 2% 1% 6%;
  	background: rgb(11 28 22 / 0%);
	border: 1px #212121 solid;
	font-family: fot-tsukuardgothic-std, sans-serif;
	font-style: normal;
	font-weight: 100;
  	color: #212121;
	letter-spacing:0.07rem;
	font-size:0.78rem;
  	text-align: center;
  	transition: .2s;
	margin-top: 8%;
	margin-bottom: 11%;
	margin-left: 8%;
}
	
.banner_archivebu::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 25px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 1px solid #212121;
  border-right: 1px solid #212121;
  transform: rotate(-135deg);
  transition: .2s;
  box-sizing: border-box;
}	
	
/*--------  アーカイブ ---------*/	
	
#wrap_topics {
	width: 88%;
	border-bottom: 1px #8f8f8f solid;
	position: relative;
	padding:  0 0 5% 0;
	margin-top: 1%;
	margin-bottom: 1%;
	z-index: 20;
}	

#wrap_topics .font_year {
	text-align: left;
	font-family: "Montserrat", sans-serif;
	font-style: normal;
	font-weight:300;
	letter-spacing: 0.01rem;
	color: #212121;
	top: 0;
	font-size: 0.76rem;
	padding: 4% 0 2% 1%;
	position: relative;
	margin-top: -0.0rem;
	margin-bottom: -0.0rem;
}	

#wrap_topics .font_news {
	text-align: left;
	font-family: fot-tsukuardgothic-std, sans-serif;
	font-style: normal;
	font-weight: 100;
	color: #212121;
	letter-spacing: 0.1rem;
	line-height: 1.06rem;
	top: 0;
	font-size: 0.8rem;
	padding: 0 0 0 1%;
	position: relative;
	margin-top: -0.0rem;
	margin-bottom: -0.0rem;
}
	


/*------------  BANNER 01 ------------*/	
	
#box_newsbanner {
	width: 88%;
	border: 1px #989898 solid;
	position: relative;
	margin-top: -0.0em;
	margin-bottom: 5%;
	z-index: 30;
}	
	
#box_newsbanner a {
	position:absolute;
	display: block;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	z-index: 10;
	transition-duration: 0.5s;
} 

#box_newsbanner .icon {
	width: 95%;
	padding: 3% 1% 0 1%;
	top: 0;
	position: relative;
	margin-top: -0.0em;
	margin-bottom: -0.0em;
}
#box_newsbanner .bottom {
	width: 93%;
	padding: 2% 2% 0 4%;
	top: 0;
	position: relative;
	margin-top: -4%;
	margin-bottom: -0.0em;
}
	
#box_newsbanner .bottom .txt {
	text-align: left;
	font-family: fot-tsukuardgothic-std, sans-serif;
	font-style: normal;
	font-weight: 100;
	color: #212121;
	top: 0;
	font-size: 0.9rem;
	letter-spacing: 0.05rem;
	line-height: 1.05rem;
}	


		
		
		
}