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


/* 掲示板
--------------------------------------------------------- */
.keiziban{
	background: url("images/keiziban_bg.png") no-repeat center bottom;
	background-size: 100% auto;
	overflow: hidden;
}
.keiziban h3{
	display: none;
}
.keiziban p{
	text-align: center;
	padding: 0 15vw 6em;
	letter-spacing: 0.1em;
	line-height: 1.8;
}
@media screen and (min-width: 1140px){
	.keiziban{
		background: url("images/keiziban_bg_pc.png") no-repeat center bottom;
		background-size: 100% auto;
	}
	.keiziban p{
		padding: 60px 15vw 100px;
	}
}


/* スライダー
--------------------------------------------------------- */
/* レイアウトの為のスタイル */
.wrapper{
	margin-inline: auto;
	margin-top: 10px;
	/*max-width: 600px;*/
	width: 100%;
}
.splide__slide{
}
/* スライド共通のスタイル */
.splide__slide a img{
	/*opacity: .3;  左右のスライドを薄くする */
	transform: scale(0.85); /* 左右のスライドを小さくする */
	transition: 1s ease; /* ゆっくり小さくさせる */
	border-radius: 6px;
}
/* スライドのサイズ調整 */
.splide__slide a img{
	height: auto;
	width: 100%;
}
/* アクティブなスライドのスタイル */
.splide__slide.is-active a img{
	/*opacity: 1;  中央のスライドは薄くしない */
	transform: scale(1.0); /* 中央のスライドは小さくしない */
	z-index: 2; /* 中央のスライドを一番上にする */
}
.wrapper p{
	text-align: center;
}
.splide__arrow{
	background: rgba(17, 51, 102, 0.80);
	z-index: 1;
}
.splide__arrow svg{
	fill: #FFF;
}


/* 公式SNS
--------------------------------------------------------- */
.sns{
	margin: 0 0 4em;
}
.sns h3{
	display: none;
}
.sns ul{
    display: flex;
    justify-content: center;
}
.sns ul li {
    padding: 0 0.5em;
    max-width: 40px;
}
.sns ul li img{
	width: 100%;
}
@media screen and (min-width: 1140px){
	.sns{
	margin: 0 0 6em;
}
}

/* お知らせ
--------------------------------------------------------- */
.topics{
	margin: 0 5vw 2em;
}
.topics h3{
	text-align: center;
	color: #521;
	font-size: 1.5em;
	letter-spacing: 0.2em;
	line-height: 1;
}
.topics h3 span{
	font-size: 0.6em;
}
.topics h3.topics_pc_title{
	display: none;
}
.topics > div div{
	margin: 0;
	padding: 0 0 2em;
}
.topics > div div dl{
	margin: 0 auto;
	padding: 0 0 10px;
}
.topics > div div dl a dt{
	margin: 0;
	padding-top: 1em;
	font-weight: normal;
	font-size: 0.8em;
	line-height: 16px;
	border-top: 1px solid #ccc;
}
.topics > div div dl a dt span{
	background: #666;
	color: #fff;
	padding: .3em .5em;
	font-size: .8em;
}
.topics > div div dl a dd{
	padding: 0.2em 0 0.8em;
	margin-left: 0;
	line-height: 1.5;
}
.topics > div div p{
	margin: 0;
}
.topics > div div p a{
	display: block;
	background: url("common/img/yajirusi01.png") no-repeat right 10px center;
	background-size: 8px 14px;
	margin: 0 auto;
	padding: 1em 0;
	border: 1px solid #ccc;
	text-align: center;
}
.topics > div div iframe{
	width: 94%;
	height: 400px;
	border-radius: 6px;
	padding: 1em 3%;
	background: #e9eef6;
}
@media screen and (min-width: 1140px){
	.topics{
		margin: 0 5vw 6em;
	}
	.topics h3.topics_pc_title{
		display: block;/*display: none解除*/
	}
	.topics > div{
		max-width: 1300px;
		margin: 0 auto;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: stretch;
		align-content: stretch;
	}
	.topics > div h3.topics_sp_title{
		display: none;
	}
	.topics > div div{
		width: 47%;
	}
	.topics > div div dl a dt{
		margin: 0;
		padding: 1.5em 0;
		float: left;
		width: 14.5em;
		border: none;
		font-size: 1em;
		clear: both;
	}
	.topics > div div dl a dd{
		margin: 0;
		padding: 1.2em 0 1.4em 14.5em;
		border-top: 1px solid #ccc;
	}
	.topics > div div p a{
		margin: 18px auto 0;
	}
	.topics > div div iframe{
		width: 100%;
		height: 100%;
	}
}


/* 催し物案内
--------------------------------------------------------- */
.event{
	width: 100vw;
	overflow: hidden;
	margin: 0 0 4em;
}
.event h3{
	text-align: center;
	color: #521;
	font-size: 1.5em;
	letter-spacing: 0.2em;
}
.event h3 span{
	font-size: 0.6em;
	display: block;
}
.event ul li{
	background: #fff;
}
.event ul li a h4{
	background: #136 url("common/img/h4_decoration.png") no-repeat right center;
	background-size: 5px 100%;
	color: #FFF;
	padding: .8em 2em .8em 5vw;
	margin: 0 5vw 1em 0;
}
.event ul li a div{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	align-content: stretch;
	padding: 0 5vw 2em;
}
.event ul li a div img{
	width: 30%;
	height: 100%;
	border-radius: 6px;
}
.event ul li a div p{
	width: 66%;
	margin: 0;
}
.event ul li a div p em{
	display: inline-block;
	font-style: normal;
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 0.2em;
}
.event ul li a div p span{
	display: inline-block;
	background: #911;
	color: #FFF;
	padding: .2em .5em;
	margin-top: .5em;
	font-size: .8em;
}
.event > div{
	padding: 0 5vw;
}
.event > div p a{
	display: block;
	background: url("common/img/yajirusi01.png") no-repeat right 10px center;
	background-size: 8px 14px;
	padding: 1em 0;
	border: 1px solid #CCC;
	text-align: center;
}
@media screen and (min-width: 1140px){
	.event{
	}
	.event ul{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		justify-content: space-around;
		justify-content: center;
		align-items: stretch;
		align-content: stretch;
		max-width: 1300px;
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}
	.event ul li{
		width: 31%;
		margin: 0 1% 2em;
		box-shadow: 0px 2px 8px hsla(0,0%,0%,0.25);
		border-radius: 6px;
	}
	.event ul li a{
		display: block;
		padding: 15px 0;
	}
	.event ul li a h4{
		padding: .8em 20px;
		margin: 0 20px 1em 0;
	}
	.event ul li a div{
		padding: 0 20px;
	}
	.event > div{
		padding: 0;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		align-items: stretch;
		align-content: stretch;
		margin: 0 15vw;
	}
	.event > div p{
		width: 32%;
		margin: 5px;
	}
	.event > div p a{
		display: block;
		background: url("common/img/yajirusi01.png") no-repeat right 10px center;
		background-size: 8px 14px;
		padding: 1em 1.5em 1em 1em;
		border: 1px solid #CCC;
		text-align: center;
	}
}


/* 一関文化センター友の会
--------------------------------------------------------- */
.member a{
	display: block;
	margin: 15px 5vw 60px;
	background: #F6EEE8;
	border-radius: 6px;
	padding: 10px 3vw;
}
.member a h3{
	text-align: center;
	color: #521;
	font-size: 1.5em;
	line-height: 1;
}
.member a h3 span{
	font-size: 0.6em;
	letter-spacing: 0.2em;
}
.member a .member_box_about{
	background: #fff;
	padding: .5em;
}
.member a .member_box_about h4{
	background-color: #666;
	background-size: auto;
	padding: 0.5em;
	color: #fff;
	text-align: center;
	font-size: 1.2em;
	margin: .1em 0 ;
}
.member a .member_box_about p{
	text-align: center;
	line-height: 1.8;
}
@media screen and (min-width: 1140px){
	.member a{
		width: 960px;
		margin: 30px auto 70px;
		display: flex;
		justify-content: space-between;
		border: 2px solid #F6EEE8;
		padding: 0;
	}
	.member a h3{
		text-align: center;
		margin: auto;
		width: 35%;
		padding: 0 2em;
	}
	.member a .member_box_about{
		display: flex;
		background: #fff;
		width: 65%;
		border-radius: 0 4px 4px 0;
	}
	.member a .member_box_about h4{
		margin: auto 1em;
		padding: 1.5em 1em;
		width: 30%;
	}
	.member a .member_box_about p{
		text-align: left;
	}
}