:root{
	--base-color-dark    : #777;
	--base-color-light   : #f5f5f5;
	--accent-color-dark  : #2C65B0;
	--accent-color-light : #f0f8ff;
	--no-color           : #FFF;
	--default-color      : #000;
}


a {
	text-decoration: none;
}

h2 {
	padding    : 0.5em;
	color      : var(--base-color-dark);
	background : var(--base-color-light);
	border-left: solid 5px var(--base-color-dark);
	margin-top : 3.5em;
}

.book_img {
	/*box-shadow: 5px 5px 3px var(--base-color-dark);*/
	margin    : 1% 0 30% 0;
	max-height: 233px;
}

.row{
    display  : flex;
    flex-wrap: wrap;
}

.with-browsing {
	display: inline-block;
	position: relative;
	height: 30px;
	line-height: 30px;
	text-align: center;
	padding: 0 20px 0 10px;
	font-size: 15px;
	background: var(--accent-color-dark);
	color: var(--no-color);
	box-sizing: border-box;
	overflow-x: hidden;
}

.no-browsing {
	display: inline-block;
	position: relative;
	height: 30px;
	line-height: 30px;
	text-align: center;
	padding: 0 20px 0 10px;
	font-size: 15px;
	background: var(--no-color);
	color: var(--no-color);
	box-sizing: border-box;
	overflow-x: hidden;
}

.browsing:after {
	position: absolute;
	content: '';
	width: 0px;
	height: 0px;
	z-index: 1;
}

.browsing:after {
	top: 0;
	right: 0;
	border-width: 15px 15px 15px 0px;
	border-color: transparent var(--no-color) transparent transparent;
	border-style: solid;
}

.intro {
    font-size : 12pt;
}

.search-genre {
	font-weight: bold;
}

.search:hover,
.search:visited,
.search:link{
    text-decoration:none;
}

.more{
    margin-left: 2em;
    margin-top : 2em;
}

.new-title:hover,
.new-title:visited,
.new-title:link{
	text-decoration: none;
}

.panel-new {
	margin-top: 3em;
}

.table_area{
	margin-top: 3em;
}

.table-title {
	font-size: larger;
}

.page-title {
	margin-bottom: 3em;
}

.page-title-link:hover {
	opacity: 0.6;
}

.society-table-month {
	text-align: center;
	font-size : x-large;
	color     : var(--accent-color-dark) !important;
	margin    : 80px 0 40px 0 !important;
}

.to-index{
    margin-top : 6em;
	text-align: center;
}



.society-name{
	color: var(--accent-color-dark);
	font-weight: bold;
}

.society-title {
	position: relative;
	text-shadow: 0 0 2px var(--no-color);
	text-align: center;
	line-height: 1.5em;
	margin-bottom: 0;
}
.society-title:before {
	content: "";
	position: absolute;
	background: var(--accent-color-light);
	width: 100px;
	height: 100px;
	border-radius: 50%;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	z-index: -1;
}

.date {
	text-align: center;
	margin-top: 0;
}


.announce {
	background: var(--accent-color-light);/*背景色*/
	padding: 1em;/*文字まわり（上下左右）の余白*/
	margin: 6.5em 0 1em 0;
}

.announce h3 {
	color:var(--accent-color-dark);
	font-weight: bold;
	margin-bottom:1em;
	text-align: center;
}

.announce div {
	padding: 0 3em;
}

.announce div div {
	padding: 0;
	margin: 2em 1em;
}

.announce h4 {
	border-left: 5px solid var(--accent-color-dark);
	padding-left: 0.5em;
	margin-bottom: 1em;
}

.announce li {
	margin-bottom: 1em;
}

.row:before,
.row:after {
	width:0px;
}

.society-container {
	padding-left: 0;
}

.society-list-name {
	font-size: larger;
}


.society-card {
	transition-duration: 0.4s;	/*変化に掛かる時間*/
	box-shadow         : 0px 0px 6px 3px var(--base-color-light);
	border-radius      : 10px;
	padding            : 10px;
	margin             : 10px 0;
}

.society-card:hover {
	transform: scale(1.05);	/*画像の拡大率*/
	transition-duration: 0.4s;	/*変化に掛かる時間*/
}

.book_img {
	transition-duration: 0.4s;
}

.book_img:hover {
	transform: scale(1.05);	/*画像の拡大率*/
	transition-duration: 0.4s;	/*変化に掛かる時間*/
}


.society-link,
.society-link:hover,
.society-link:visited,
.society-link:link {
	color          : var(--default-color);
	text-decoration: none;
}


.society-card span {
	color: var(--base-color-dark);
}

.society-card p {
	font-size: large;
}


/* lg */
@media (min-width: 1199px) {
	.society-card-big {
		min-height: 290px;
	}
	.society-card-small {
		min-height: 100px;
	}
}

/* md */
@media (min-width: 992px) and (max-width: 1199px) {
	.society-card-big {
		min-height: 255px;
	}
	.society-card-small {
		min-height: 125px;
	}
}

/* sm */
@media (min-width: 768px) and (max-width: 991px) {
	.society-card-big {
		min-height: 293px;
	}
	.society-card-small {
		min-height: 100px;
	}
	.society-card-big div img{
		margin-top:10px;
	}
}

/* xs */
@media (max-width: 767px) {
	.container,
	.container-fluid {
		padding-left : 0;
		padding-right: 0;
	}
}

.attention {
	margin-top: 3em;
}

.society-card-big div img{
	opacity:0.8;
}