@charset "utf-8";

/*-----------------------------------------------------
10周年ポータルページ用
import.cssでの読み込みではなくheader.php内での分岐条件で該当ページのみ適応してます。
------------------------------------------------------*/


/*----
一時非表示
各項目公開時はphp側のclass消す
----*/
.display_none{
	display:none;
}



/*ページ全体*/
html{
	scroll-behavior: smooth;
}

#contents{
	background: #f3f3f3;
  background-image: image-set(
   url("../images/anniversary/bg_pc.webp") type("image/webp"),
   url("../images/anniversary/bg_pc.png") type("image/png")
  );
  background-size: cover;
	background-attachment: fixed;
}


.portal_contents p{
	font-family: "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
	font-size:22px;
	font-weight:bold;
	color:#666;
	margin:0 2% 3%;
}

.portal_contents{
	margin:7% 0 14%;
}



/*トップ画像*/

.portal_top_kv{
	width:100%;
	margin:0 auto;
	text-align:center;
}

/*メニュー*/

.portal_nav ul{
	display: inline-flex;
	justify-content:space-between;
	width:100%;
	margin:3% 0;
}

.portal_nav ul li{
	list-style-type:none;
	margin:0;
	border-right:solid 2px #a58538;
	padding:0 4%;

}


.portal_nav ul li:last-child{
	border:none;
}

/*帯*/

/*test用*/

.obi_test{
font-weight:bold;
font-size:40px;
/*text-decoration: underline #b98e1b solid 5px;*/
border-bottom:#b98e1b solid 5px;
}


.portal_obi{
	margin-bottom:3%;
}

/*動画*/

.movie_video{
	text-align:center;
}

.movie_video video{
	width:97%;
	height:auto;
	object-fit:fill;
}


/*CPバナー*/

.portal_bn{
	margin:2% auto 4%;
	text-align:center;
}
.portal_bn_img{
	width:70%;
	height:auto;
}

.portal_bn a p{
	text-align:center;
	text-decoration:underline;
}


/*ランダム挿絵*/
#random-gallery {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin:0 2%;
}

#random-gallery a {
	display: block;
}

#random-gallery img {
	display: block;
	width: 100%;
	height: auto;
}


/*読み放題エリア*/

.store_free{
	display: flex;
	justify-content:space-around;
	flex-wrap:wrap;
	margin-bottom:2%;
}

.store_free_bn{
	width:46%;
	height:auto;
	margin-bottom:3%;
}

/*-----------------------------------------------------
レスポンシブ
------------------------------------------------------*/

@media (max-width:767px){

	/*ページ全体*/

	#contents{
	  background: #f3f3f3;
	  background-image: image-set(
	    url("../images/anniversary/bg_sp.webp") type("image/webp"),
	    url("../images/anniversary/bg_sp.png") type("image/png")
	  );
	  background-size: cover;
		background-attachment: fixed;
	}


/*	@supports (hanging-punctuation: first)
	and (font: -apple-system-body)
	and (-webkit-appearance: none) {

    #wrapper {
position:relative;
z-index:0;
isolation:isolate;
    }

    #wrapper::before {
content:'';
position:fixed;
inset:0;
z-index:-1;
			  background: #f1f1f1;
			  background-image: image-set(
			    url("../images/anniversary/bg_sp.webp") type("image/webp"),
			    url("../images/anniversary/bg_sp.png") type("image/png")
			  );
        background-position: center top;
        background-size:contain;
        background-repeat: no-repeat;
        pointer-events: none;
    }
	}
*/

	.inner{
		padding:0 1%;
	}

	.summary{
		margin-top:3%;
	}

	.portal_contents{
		margin-top:10%;
		margin-bottom:20%
	}

	.portal_contents p{
		font-size:16px;
		margin-bottom:4%;
	}


	/*メニュー*/
	.portal_nav ul li{
		padding:0 1%;
		border-right:solid 1px #a58538;
	}

	.portal_nav ul li:nth-child(1){
		padding:0 1% 0 0;
	}

	.portal_nav ul li:nth-child(4){
		padding:0 0 0 1%;
	}

	/*帯*/

	.portal_obi{
		margin-bottom:4%;
	}


	/*CPバナー*/
	.portal_bn_img{
		width:95%;
		height:auto;
	}


	/*ランダム挿絵*/
   #random-gallery {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

	/*読み放題エリア*/

	.store_free{
		display:block;
		margin-bottom:7%;
	}

	.store_free_bn{
		width:96%;
		margin-left:2%;
		margin-right:2%;
	}

}