@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&family=M+PLUS+Rounded+1c:wght@400;500&display=swap');


/* ======================================================

	structure CSS

========================================================= */
.container{
	width:100%;
	min-height: 100vh;
	min-height: 100%;
}

.header{
}

.headerArea{
	margin:0 auto;
	width:1040px;
	
	@media screen and (max-width: 1140px) {
		width: 94%;
	}
}

.contents{
	margin:0 auto;
	width:1040px;
	padding: 30px 0 8px;
	display: flex;
	justify-content: space-between;
	
	@media screen and (max-width: 1140px) {
		width: 94%;
	}
}

.main {
	position: relative;
	width:760px;
	padding: 0 0 50px 0;
	/*padding: 0 20px 180px 15px;
	min-height: calc(100vh - 110px);*/
	min-height: calc( 100vh - 500px);

}

.side{
	width:270px;
	padding: 0 20px 30px;
	/*padding: 0 20px 120px;
	min-height: calc(100vh - 110px);*/
}

#footer{
	width:100%;
}


.copyright{
	width:100%;
}

/* clear */
.headerArea:after,
.contents:after,
.footerArea:after{
	content:".";
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	font-size:0;
}

.mt5{ margin-top: 5px!important;}

@media screen and (max-width: 835px) {
	.container{
		min-width:100%;
		overflow: hidden;
	}

	.contents, .contents_top {
		padding:  0;
		width:100%;
	}

	.main, .main_top{
		float:none;
		width:100%;
		min-height: calc(100vh - 465px);
		padding-bottom: 40px;
		/*padding: 0 0 250px;
		min-height: calc(100vh - 170px);*/
	}

	.side {
		width: 100%;
		float: none;
	}

	.footerArea{
		width:100%;
	}

}
@media screen and (max-width: 599px) {
	.main, .main_top{
		min-height: calc(100vh - 513px);
		/*padding-bottom: 300px;
		min-height: calc(100vh - 154px);*/
	}
}


/* ======================================================

	body

========================================================= */
body {
	min-height: 100vh;
	color:#444;
	font-size:18px;
	font-size: 1.8rem;
	line-height:1.5em;
	position: relative;

	&::before {
		content:"";
		display:block;
		position:fixed;
		top:0;
		left:0;
		z-index:-1;
		width:100%;
		height:100vh;
		height:100lvh;
		/*background: linear-gradient(#fff, #eee);*/
	}
}
.container{
	width: 100%;
	height: auto;
	min-height: 100vh;
	position: relative;
}

@media screen and (max-width: 835px) {
	body{
		width:100%;
		min-width:100%;
		word-wrap:break-word;
		font-size: 1.4rem;
		background: none;
	}
	.container::before, .container::after {
		display: none;
	}
	/*body, .container {
		min-height: auto;
	}*/
}


/* ======================================================

	header

========================================================= */
.header{
	width: 100%;
	height: auto;
	position: relative;
	z-index: 99;
}



/* ======================================================

	gnav

========================================================= */
.sp_btn, .sp_nav {
	display: none;
}

.sp_gnavArea h2 {
	font-size: 4.1vw;
	line-height: 1.3em;
}

@media screen and (max-width:835px){
	.sp_gnavArea_w {
		position: fixed;
		z-index: 9999;
		width: 100%;
	}
	.sp_gnavArea {
		padding: 12px 0 0;
		height: 54px;
	
		& h2 {
			padding-left: 3%;
			padding-top: 1px;
			font-size: 3vw;
			line-height: 1em;
			width: calc(100% - 50px);
			font-family: 'Kosugi Maru', sans-serif;
			font-weight: 400;
		
			& img {
				height: 30px;
				width: auto;
			}
		}
		@media screen and (max-width:599px){
			padding: 14px 0 0;
		}
	}
	.sp_gnav_btn{
		width:auto;
		padding:5px 5px;
		text-align:right;}

	.sp_gnav {
		display:none;
		z-index:100;
		margin-bottom:0;
		background-color: rgba(0,0,0,0.15);
		position: relative;

		& li{
			position:relative;
			width: 50%;
			float: left;
			background-color: rgba(255,255,255,.97);
		
			&:nth-child(even) { border-left: 1px solid #ccc;}
		}
	}
	.sp_gnav li a {
		display:block;
		padding: 15px 7px;
		border-bottom:1px solid #ccc;
		color:#333;
		text-decoration:none;
		position: relative;
		
		&::before {
			content: ">";
			position: relative;
			font-size: 2vw;
			margin-right: .5em;
			top: -2px;
		}
		&:hover{ opacity:0.7;}
	}
	
	/*sp_btn*/
	.sp_btn {
		position: absolute;
		display: block;
		width: 30px;
		height: 30px;
		top: 14px;
		right: 10px;
		cursor: pointer;
		z-index: 1002;
	
		& div { position: relative;}
		
		& span {
			display: block;
			position: absolute;
			height: 4px;
			width: 100%;
			background: #ff8b50;
			left: 0;
		}
	}
	.sp_btn span {
		&:nth-child(1) { top: 0;}
		&:nth-child(2) { top: 11px;}
		&:nth-child(3) { top: 22px;}
	}

	.sp_btn.open span {
		&:nth-child(1) {
			top: 11px;
			transform: rotate(315deg);
			transition: all 0.3s ease-out;
		}
		&:nth-child(2) {
			width: 0;
			left: 50%;
		}
		&:nth-child(3) {
			top: 11px;
			transform: rotate(-315deg);
			transition: all 0.3s ease-out;
		}
	}

}

@media screen and (max-width:440px){
	.sp_gnavArea h2 {
		padding-left: 3%;
		padding-top: 0;
		font-size: 4.5vw;
		line-height: 1.3em;
		
		& img {
			width: 100%;
			height:auto;
		}
	}
	.sp_gnav li{
		font-size:13px;
		font-size: 1.3rem;
		line-height: 1.5em;
		
		& a { padding: 10px 7px;}
	}
}


/*headerArea*/
.headerArea {
	padding: 20px 10px;
	text-align: center;
	position: relative;

	& h1 {
		font-family: 'M PLUS Rounded 1c', sans-serif;
		letter-spacing: .1em;
		font-size: 2em;
		line-height: 1.4em;
		font-weight: 500;
	}
	& h2 {
		font-size: 1.8em;
		line-height: 1.4em;
		margin-bottom: 10px;
	}
	& h3 {
		font-size: 1.3em;
		line-height: 1.5em;
	}
}

.h_info {
	& li {
		display:inline-block;
		vertical-align:middle;}

	& a {
		color:#333;
		text-decoration:none;
		
		&:hover{ opacity:0.7;}
	}
}

.mv {
	width: 100%;
	position: relative;
	padding-left: 10px;
	padding-right: 15px;
}
.mv_img {
	width: 100%;
	position: relative;
	border-top: 8px solid #31B1E7;
	border-bottom: 8px solid #31B1E7;

	& img {
		width: 100%;
		height: auto;}
}

@media screen and (max-width:835px){
	.mv { padding: 0;}
	.mv_img {
		text-align: center;
	
		& img {
			width: 100%;
			height: auto;}
	}
}

.sub_logo {
	padding: 12px 0 14px;
	
	& img {
		width: 35%;
		height: auto;
	}
	@media screen and (max-width:835px){
		opacity: 0;
	}
}

.sub_ttl {
	width: 100%;
	text-align: center;
	padding: 15px 10px;
	margin: 0 auto;
	position: relative;
	border-radius: 0;

	& h1 {
		font-family: 'M PLUS Rounded 1c', sans-serif;
		font-weight: 500;
		font-size: 24px;
		font-size: 2.4rem;
		line-height: 1.25em;
		
		& a { text-decoration: none;}
	}

	& h2 {
		color: #fff;
		font-size: 36px;
		font-size: 3.6rem;
		line-height: 1.5em;
	}
	
	@media screen and (max-width:1040px){
		width: 96%;
	}
	
	@media screen and (max-width:835px){
		width: 100%;
		padding: 54px 0 0;
		background: none;
		border-bottom: none;
	}

}

/* clear */
.headerArea::after, .sp_gnavArea::after{
	content:" ";
	display:block;
	clear:both;
	font-size:0;
}

@media screen and (max-width:835px){
	.headerArea {
		width: 100%;
		padding: 54px 0 0;
		
		& h1 img,
		& h2 img {
			width: 94%;
			height: auto;
		}
	}
	.headerArea h1, .sub_ttl h1 {
		display: none;
	}
}
@media screen and (max-width:599px){
	.h_logomark { display: none;}
	.headerArea {
		width:100%;
		height:auto;
		margin: 0 auto;
	
		& h1 {
			padding: 5px 0 0;
			margin: 0 0 5px;
			width: 100%;
			height: auto;
			text-align: center;
		}
		& h2 {
			position: relative;
			width: 100%;
			text-align: center;
			margin: 0;
			padding: 0;
		}
	}
	.headerArea .h_info {
		& dt {
			top: 10%;
			
			& img {
				width: 90%;
				height: auto;
			}
		}
		& dd {
			&:first-of-type {
				bottom: auto;
				top: 28%;
				left: 5%;
				width: 30%;
			}
			&:last-of-type {
				bottom: 20px;
				width: 90%;
				left: 4%;
			}
			& img{
				width: 100%;
				height: auto;}
		}
	}

}

@media screen and (max-width: 450px) {
	.h_info li.h_address { display: none;}
	.h_logo {
		padding-left: 5px;
		
		& img {
			height: 50px;
		}
	}

}


/* ======================================================

	contents

========================================================= */
.contents {
	position: relative;
	z-index: 2;
	background: rgba(255,255,255,1);
}

.inner {
	padding-left: 10px;
	padding-right: 15px;
}

@media screen and (max-width: 835px) {
	.inner {
		width: 94%;
		margin: 0 auto;
		padding: 0;
	}
}

/* ======================================================

	main

========================================================= */
.anchor {
	padding-top: 20px;
	margin-top: -20px;
}

.top_btn {
	margin: 30px 0 70px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: space-between;
	
	& li {
		font-size: 22px;
		font-weight: bold;
		flex-grow: 1;
		margin: 0 5px;
		
		& a {
			display: block;
			padding: 1em 5px;
			text-decoration: none;
			color: #fff;
			background: #ff8b50;
			border-radius: 10px;
			
			&:hover {
				background: #418086;
			}
		}
	}
}
.top_btn li {
	& dt {
		font-family: 'Kosugi Maru', sans-serif;
		font-weight: 400;
	}
	& dd {
		font-weight: normal;
		font-size: 13px;
	}
} 
.top_btn li.line1 a {
	line-height: 2.45em;
}
.top_btn li.line3 a {
	line-height: 1em;
	padding: .73em 5px;
}

.top_btn li.poster a {
	padding: 0;
	background: none;

	&:hover {
		background: none;
		opacity: .9;
	}
	& img {
		border: 1px solid #ccc;
	}
}
.balloonoya {
	position   : relative;                /* 指定した分だけ相対的に移動 */
}
.balloonoya:hover .balloon {
	display: inline;                /* インライン要素として表示 */
}
.balloon {
	position   : absolute;                /* 親要素を基準 */
	display: none;                        /* 要素を非表示 */
	padding: 2px;                         /* テキストの前後の余白 */
	background-color: rgba(0, 161, 233, 0.50);       /* 背景色（透明度） */
	width:180px;                          /* 吹き出し全体の幅 */
	right : 0;                           /* 表示位置 */
	top : 105%;                           /* 表示位置 */
	margin-top : 12px;                    /* 表示位置 */
	font-size: 70%;                       /* 文字サイズ */
	color: #fff;
}
.balloon:after{
	border-bottom: 12px solid rgba(0, 161, 233, 0.50); /* 吹き出し口の高さ・色 */
	border-left: 10px solid transparent;    /* 吹き出し口の幅１／２ */
	border-right: 10px solid transparent;   /* 吹き出し口の幅１／２ */
	top: -12px;                             /* 吹き出し口の位置調整 */
	right : 20%;                              /* 吹き出し口の横位置 */
	content: "";                       /* コンテンツの挿入 */
	position: absolute;                /* 親要素を基準 */
}

.top_news {
	display: flex;
	justify-content: space-between;
}
.top_history {
	overflow-y: scroll;
	font-size: .95em;
	margin-top: 5px;
	padding: 1em 20px;
	border: 1px solid #ddd;
	background: rgba(255,255,255,.90);
	max-height: 220px;
	width: 100%;

	& div {
		margin-bottom: 10px;
		border-bottom: 1px dotted #ccc;
	}
	& dt { color: #aaa; margin-bottom: 5px;}
	& dd {
		padding-bottom: 10px;
	}
}
.top_history.col2 {
	width: 48%;
	height: 400px;
	max-height: 400px;
	
	@media screen and (max-width: 835px) {
		width: 100%;
		height: auto;
		max-height: 220px;
	}
}
.top_tw {
	width: 48%;
}

@media screen and (max-width: 835px) {
	.anchor {
		padding-top: 70px;
		margin-top: -70px;
	}

	.top_btn {
		gap: 0 2%;
		
		& li {
			font-size: 3vw;
			line-height: 1.2em;
			margin: 0 0 10px;
		}
	}
}
@media screen and (max-width: 599px) {
	.top_btn {
		flex-wrap: wrap;
		gap: 0 2.5%;
		
		& li {
			width: 48%;
			margin-bottom: 10px;
			height: auto;
			font-size: 4.5vw;
			
			& dd {
				font-size: 3.2vw;
				line-height: 1.2em;
				margin-top: 5px;
			}
			
			& a { padding: 1.7em 0;}
		}
	}
	.top_btn li.line1 a {
		line-height: 2.14em;
	}
	.top_btn li.line3 a {
		padding: 1.23em 0;
	}
	.top_history, .top_history.col2 {
		max-height: 170px;
		padding-top: 10px;
	}
	.top_history, .top_history.col2 {
		width: 100%;
	}
}

/*おしらせ*/
.notice {
	border: 7px double #fff;
	margin-bottom: 30px;
	padding: 10px;
	text-align: center;
	line-height: 1.7em;
	background: #eee;

	& dt {
		padding: 5px 0 7px;
		letter-spacing: .1em;
	}
	& dd.notice_btn a {
		display: block;
		width: 80%;
		margin: 10px auto;
		padding: 10px;
		text-decoration: none;
		color: #fff;
		font-size: 1.1em;
		font-weight: bold;
		border-radius: 15px;
		border: 2px solid #fff;
		text-align: center;
	}
}
.box_bd {
	border: 7px double #ccc;
	border-radius: 20px;
	padding: 20px 15px;
	margin: 30px 0 50px;
	text-align: center;
	line-height: 1.7em;
}

/*プログラム*/
.prgrm_btn {
	text-align: center;

	& li {
		text-align: center!important;
		width: 43%!important;
		
		&:last-child { margin-left: 5%;}
	}
	& li.single:last-child {
		margin-left: 0;
	}
}

.li_btn.filedl_btn.prgrm_btn li a {
	padding-right: 15px;
}
.program_list > li {
	margin-bottom: 30px;

	&:last-child { margin-bottom: 0;}
}
.program_list li h3 {
	position: relative;
	background: #fff;
	border-bottom: 3px solid #ccc;
	font-size: 2.0rem;
	line-height: 1.5em;
	margin-bottom:.5em;
	padding: 3px 5px;

	& span {
		position: absolute;
		bottom: 0;
		right: 0;
		padding: 3px 10px;
		background: #ccc;
		color: #fff;
		font-size: 1.4rem;
		line-height: 1.5em;
	}
	& span.day1 { color: #0D55C4;}
	& span.day2 { color: #C71215;}
	
	@media screen and (max-width: 835px){
		border-bottom: none;
		padding: 0;

		& span {
			position: relative;
			left: 0;
			top: 0;
			bottom: auto;
			display: block;
			text-align: right;
		}
	}
	@media screen and (max-width: 599px){
		font-size: 1.6rem;
		line-height: 1.3em;
	}
}

.program_list li > dl > dt {
	font-size: 1.2em;
	line-height: 1.3em;
	margin-bottom:.5em;
	font-weight: bold;
}
.program_list li > dl > dd > dl {
	margin-bottom: 5px;
}
.program_list li > dl > dd > dl > dt {
	color: #fff;
	font-weight: bold;
	font-size: 1.3rem;
	text-align-last: justify;
	clear: both;
	float: left;
	width: 4em;
	padding: 1px .5em;
	
	@media screen and (max-width: 599px){
		float: none;
		padding: 0.5px 0.5em;
		margin-bottom: 2px;
	}
}
.program_list li > dl > dd > dl > dt.sf_ver {
	width: 7.2em;
	letter-spacing: -.2em;
	float: none;
}
.program_list li > dl > dd > dl > dd {
	padding-left: 3.5em;
	margin-bottom: 5px;
	font-size: 1em;
	line-height: 1.5em;
	
	@media screen and (max-width: 835px){
		padding-left: 4.5em;
	}
	@media screen and (max-width: 599px){
		padding-left: 1em;
		margin-bottom: 1em;
	}
}
.program_list li > dl > dd > dl > dd.sf_ver {
	padding-left: 1em;
	margin-bottom: 0;
	margin-top: 2px;
	
	@media screen and (max-width: 599px){
		margin-bottom: 5px;
	}
}
.program_list li > dl > dd > dl > dd p {
	float: left;
	margin-right: .5em;
}
.program_list li > dl > dd > dl > dd span.dblock {
	display: block;
}

.program_list li > dl > dd > dl > dd::after {
	content:" ";
	display:block;
	clear:both;
}
.program_list li > dl > dd > p {
	font-size: 95%;
	line-height: 1.3em;
	margin-top: 10px;
}
.program_list li > dl > dd > p.program_ttl {
	font-size: 105%;
	font-weight: bold;
	line-height: 1.3em;
	margin-bottom: 5px;
}

.ttl_prg {
	margin-bottom: 15px;
	font-weight: bold;
	font-size: 1.1em;
	color: #0590D1;

	& span { padding-left: 10px;}
}

@media screen and (max-width: 599px){
	.program_list li > dl > dd > dl > dd span {
		display: inline-block;
	}
}


.f_support li {
	display: inline-block;
	margin: 0 1em 5px -.05em;

	@media screen and (max-width: 599px){
		display: block;
		margin: 0 0 5px 0;
	}
}


/* ======================================================

	side

========================================================= */
.side {
	text-align: center;

	& dt { padding: 20px 0 15px;}
	& dd { margin-bottom: 2px;}
	
	@media screen and (max-width: 835px) {
		display: none;
	}
}

.side_nav {
	padding-top: 2px;
	margin-bottom: 30px;
	border-radius: 10px;
	border: 1px solid #9A9A9A;
	background: #9A9A9A;
	position: relative;

	&::before {
		content: "menu";
		color: #fff;
		line-height: 2em;
	}
	& li {
		position: relative;
		width: 100%;
		text-align: left;
		border-top: 1px solid #aaa;
		background: #fff;
		
		&:last-child { border-radius: 0 0 10px 10px;}
		& a {
			position: relative;
			display: block;
			padding: 10px 0 10px 20px;
			text-decoration: none;
			font-family: 'Kosugi Maru', sans-serif;
			font-weight: 400;
			color: #444;
			background: linear-gradient(#fff, #eee);
		}
	}
}
.side_nav li a:hover, .side_nav li.current a, .side_nav li a:hover, li.index_arrow a {
	background: #fff
}
.side_nav li.current::after, .side_nav li.current2::after, li.index_arrow::after{
	content: "▼";
	transform: rotate(-90deg);
	font-size: 15px;
	color: #ccc;
	position: absolute;
	right: 10px;
	top: 11px;
}
.side_nav li:last-child a, .side_nav li:last-child.current {
	border-radius: 0 0 10px 10px;
}

.poster_side {
	text-align: center;
	
	& a { text-decoration: none;}
	& img { border: 1px solid #ccc;}
	& span {
		display: block;
		font-size: .75em;
		margin-top: 5px;
	}
	
	@media screen and (max-width: 835px) {
		margin-top: 30px;
	}
}



/* ======================================================

	footer

========================================================= */
#footer{
	position: sticky;
	top: 100vh;
	width: 100%;
	
	@media screen and (max-width: 835px) {
		padding-top: 10px;
		background: #fff;
	}
}

.inner_f {
	width: 1040px;
	margin: 0 auto;
	padding: 10px 0 5px;
	
	@media screen and (max-width: 1100px) {
		width: 94%;
	}
}

.footerArea {
	background: #F3EFEB;
	position: relative;
	padding: 0;
	
	@media screen and (max-width: 835px) {
		& .inner_f {
			padding: 0;
			width: 100%;
			background: #b3ada2;
		}
	}
}
.fnav {
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0 15px;
	
	@media screen and (max-width: 835px) {
		gap: 0;
		justify-content: flex-start;
	}

	& li {
		position: relative;
		font-size: 1.4rem;
		margin-bottom:5px;
		
		@media screen and (max-width: 835px) {
			margin: 0;
			font-size: 1.2rem;
			display: block;
			border-bottom:1px solid rgba(255,255,255,.50);
			border-right: 1px solid rgba(255,255,255,.50);
			width: 33.3%;
		}
	
		@media screen and (max-width: 440px) {
			font-size: 13px;
			font-size: 1.3rem;
		}
	}
	
	@media screen and (max-width: 835px) {
		text-align: left;
	}
}
#footer .fnav li a {
	text-decoration:none;
	position: relative;
	
	@media screen and (max-width: 835px) {
		display:block;
		padding: 7px 2vw;
		min-height:23px;
		color: #fff;
	}
	
	&:visited {
		@media screen and (max-width: 835px) {
			color: #fff;
		}
	}
}
.fnav li a::before {
	position: relative;
	content: ">";
	font-size: 10px;
	margin-right: .5em;
	top: -2px;
}

.inner_f.gakkaibn {
	background-color: #fff;
	border-top: 1px dotted #ddd;
	padding-top: 15px;
	padding-bottom: 30px;
}

.f_kyosan {
	position: relative;

	& h3 {
		text-align: center;
		font-size: 13px;
		line-height: 1.5em;
		color: #418086;
		position: absolute;
		top: -8px;
		left: 0;
		right: 0;
		margin: 0 auto;
		width: 7em;
		background: #fff;
	}
}

.fbn_link {
	text-align: center;
	margin-bottom: 20px;
	padding: 10px 0 5px;
	border-top: 2px dotted #D9E1E1;
	border-bottom: 2px dotted #D9E1E1;

	& li {
		display: inline-block;
		margin: 5px;
		border: 1px solid #D9E1E1;
		
		&:hover { border: 1px solid #ff8b50;}
	}
}

@media screen and (max-width: 835px) {
	.fnav li:nth-child(3n) {
		border-right: none;
	}
	.fnav li:first-child::before, .fnav li::after, .fnav li:nth-child(8)::before {
		content: "";
	}
	
}
@media screen and (max-width: 730px) {
	.fbn_link {
		padding: 10px 2%;

		& li {
			width: 31%;
			margin-left: .5%;
			margin-right: .5%;
			
			& img {
				width: 100%;
				height: auto;
			}
		}
	}
}
@media screen and (max-width: 599px) {
	.fbn_link li {
		width: 48%;
	}
	
	.footerArea::before {
		content: "";
		border-bottom: 1px solid #eee;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
	}

	.fnav li.f_w100 {
		width: 100%;
		border-left: none;
		border-right: none;
	}
	.fnav li, .fnav li:last-child{
		width: 50%;
		border-left: none;
		border-right: none;
	}
	.fnav li:nth-child(3n){
		border-left: none;
		border-right: none;
	}
	.fnav li:nth-child(odd) {
		border-right: 1px solid rgba(255,255,255,.50);
	}
	
	.fnav_bd {
		border-right: 1px solid rgba(255,255,255,.50)!important;
	}
}


/* ==============================================

	copyright

================================================= */
.copyright{
	position: relative;
	z-index: 3;
	bottom: 0;
	clear:both;
	padding: 10px;
	font-size:1.4rem;
	text-align:center;
	color: #444;
	background: #a7a195;

	& a { color: #444;}
	
	@media screen and (max-width: 599px) {
		position: relative;
		padding: 10px 70px 10px 3%;
		font-size: 2.8vw;
		line-height: 1.4em;
		text-align: left;
	}
}


/* =======================================

	#pageTop

========================================== */
#pageTop{
	position:fixed;
	right:30px;
	bottom:20px;
	z-index: 100;
	padding:20px 22px 17px 22px;
	-moz-border-radius:7px ;
	-webkit-border-radius:7px ;
	border-radius:7px ;

	&:link,
	&:visited {
		color: #fff;
		font-size: 20px;
		font-size: 2.0rem;
		text-decoration: none;
	}
	&:hover{ opacity:0.7;}
	
	@media screen and (max-width: 835px) {
		bottom:10px;
		right:10px;
		padding:15px 15px 12px 15px;
	}
}


.dnone { display: none;}

.bd_bg {
	border: 1px solid #aaa;
	background: #343434;
}
.ot_btn {
	text-align: center;

	@media screen and (max-width: 440px) {
		width: 100%;
		height: auto;
	}
}

/*バナー*/
.bn_flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: .75em .75em;
	width: 96%;
	margin: 0 auto;
	
	& img {
		@media screen and (max-width: 599px) {
			max-width: 100%;
			height: auto;
			max-height: 100px;
		}
	}
	& img.w_bn {
		max-height: 100px;
		max-width: 100%;
		width: auto;
		
		@media screen and (max-width: 599px) {
			max-height: 200px;
			max-width: 320px;
			height: auto;
		}
		@media screen and (max-width: 340px) {
			max-width: 100%!important;
			max-height: auto;
		}
	}
	& img.h_bn {
		max-height: 100px;
		max-width: 350px;
		height: auto;
		
		@media screen and (max-width: 450px) {
			max-width: 100%;
			width: 100%;
			height: auto;
		}
	}
}
.bn_flex.left {
	justify-content: flex-start;
	
	@media screen and (max-width: 599px) {
		justify-content: center;
	}
}

.bn_link {
	width: 200px;
	margin: 0 auto;

	& a {
		display: block;
		text-decoration: none;
		text-align: center;
		padding: 7px 0;
	}
	& span {
		display: block;
		margin: 2px;
		line-height: 2.5em;
		font-family: 'Kosugi Maru', sans-serif;
	}
	
	@media screen and (max-width: 835px) {
		margin: 0 auto;
	}
}
.bn_link2 {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 5px 0 30px;
	gap: 10px 2.5%;

	@media screen and (max-width: 340px) {
		width: 100%;
	}
	@media screen and (max-width: 835px) {
		padding-bottom: 20px;
		border-bottom: 1px dotted #ccc;
	}

	& li {
		margin-top: 10px;
		max-width: 230px;
		
		@media screen and (max-width: 835px) {
			max-width: 300px;
			margin-top: 0;
		}

		& img {
			max-width: 100%;
			height: auto;
			
			@media screen and (max-width: 835px) {
				width: 100%;
				height: auto;
			}
		}
	}
	
}

.f_bn {
	padding-top: 20px;
	
	@media screen and (max-width: 835px) {
		& .inner_f {
			border-top: 1px dotted #ccc;
		}
	}
}



.award a {
	display: block;
	text-decoration: none;
	background: url("images/award.png") no-repeat left 5px center,url("images/award_bg.png") no-repeat right bottom,linear-gradient(#a8eb7b, #6BAF4C);
	border: 4px solid #5C9B42;
	border-radius: 15px;
	padding: 30px 10px 30px;
	font-size: 2em;
	font-family: 'Kosugi Maru', sans-serif;
	letter-spacing: .3em;
	text-align: center;
	color: #fff!important;
	text-shadow: 1px 1px 3px #5C9B42, 0 1px 3px #5C9B42, 1px 0 3px #5C9B42, -1px -1px 3px #5C9B42;

	&:hover {
		opacity: .7;
		border: 4px solid #2C6F36;
		color: #2C6F36!important;
		text-shadow: none;
		text-shadow: 1px 1px 3px #FBFC63, 0 1px 3px #FBFC63, 1px 0 3px #FBFC63, -1px -1px 3px #FBFC63;
	}
	
	@media screen and (max-width: 599px) {
		background: url("images/award.png") no-repeat left 0 center,url("images/award_bg.png") no-repeat right -100px bottom,linear-gradient(#a8eb7b, #6BAF4C);
		padding-left: 100px;
		text-align: left;
	}
}