﻿@media print{.header, .header_sp, .navi, .weather_info_sp, .search, .share_area, .footer_sp, .footer{display:none;}} 


h3{font-size:1em;font-weight:bold;}

.header{
	background-color:#007DDC;
	position: fixed;
	height:35px;
	width:100%;
	font-size:1.0em;
	z-index:999;
}

.header-flex{height:35px;display:flex;gap:5px;width:98%;max-width:1050px;margin:0 auto;font-weight:bold;align-items:center;}
.header_line{border-right:1px solid #74add3;}
.header-flex a{margin-right:5px;color: #ffffff;transition: all 800ms 0s ease;}
.header-flex a:hover {color: #ffff00;}


/* -------SNS-------- */
#s-share{
	display:flex;
	align-items: flex-start;
	width:260px;margin:0 auto;
}
.s-share-btn{padding:2px;}
.fb_iframe_widget > span {
	vertical-align: baseline !important;
}


/* --------main_img-------- */

#main_img{width:95%;max-width:1050px;margin:0 auto;padding-top:60px;text-align:left;}
#main_img img{border-radius: 10px;}

#main_sponsor{
	display:grid;
	font-weight:bold;
	width:95%;max-width:1050px;
	margin:1em auto 0 auto;grid-template-columns: 3em 1fr;
}

/* --------マウスを載せたときのスタイル-------- */

.file_dl{display:grid;grid-template-columns: 1fr 1fr 1fr;gap:2em;text-align:center;width:100%;max-width:1000px;margin:0 auto;}
.file_dl a{display:block;transition: all 300ms 0s ease;}
.file_dl a:hover{display:block;opacity:0.5;}

.file_dl img{max-width:150px;}
.file_dl_bg{width:100%;border-radius:10px;text-align:center;padding:10px 0;}

.file_dl_bg_blue{background-color:#3397d6;}
.file_dl_bg_green{background-color:#4cb700;}
.file_dl_txt{color:#000;font-weight:bold;font-size:20px;}

/* --------全体-------- */
/*
.link_button{
	margin-bottom:0.8em;
}

.link_button a {
	text-align:center;
	margin:0 auto;
	text-decoration:none;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
        -webkit-transition: all 2s ease-out 250ms;
        transition:all 0.2s;
	font-size:1.3em;font-weight:bold;
	padding:10px;
	width:93%;max-width:600px;
	display:block;
}

.link_button_yellow a {
	background-color:#e2f7ff;border-bottom:5px solid #abdff2;
	color:#3c69ad;
}

.link_button a:hover {
	background-color:#fcffbc;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
}
*/
/*--------------------------------------
	リンク改
--------------------------------------*/
.link_button a {
	position: relative;
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin: 0 auto;
	padding: 10px 25px;
	color: #fff;
	transition: 0.3s ease-in-out;
	font-weight: 600;
	background: #206aa3;
	border-radius: 9999px;
	box-shadow: 0.2rem 0.2rem 0px 0.1rem #cccccc;
	max-width:600px;
}
.link_button a:hover {
	transform: translate3d(0.2rem, 0.2rem, 0);
	box-shadow: none;
	opacity: 1;
	transition: all 0.2s;
	background: #0b3c70;
}
.link_button a:after {
	content: '';
	width: 5px;
	height: 5px;
	border-top: 3px solid #fff;
	border-right: 3px solid #fff;+
	background: #6283b2;

	transform: rotate(45deg) translateY(-50%);
	position: absolute;
	top: 50%;
	right: 20px;
	border-radius: 1px;
	transition: 0.3s ease-in-out;

}


/* --------細かいテキスト対応-------- */
span.txbr{display: inline-block;}

span.red{color:#FF0000;}
span.blue{color:#97cad8;}

.material-icons{font-size:30px;display: inline-flex;vertical-align: middle;}

.small{font-size:0.8em;}


/* -------項目ボックス-------- */
.text_box{
	text-align:left;
	width:100%;
	max-width:1000px;
	margin:0 auto;
	font-size:1.2em;
	line-height:1.7em;
	color:#5e5e5e;
}

/* -------twitterボックス-------- */
/*
.day_box{display:flex;}
#day_box_left{width:50%;}
#day_box_right{width:50%;}
*/

/* -------h4項目タイトル　h5項目内小タイトル-------- */
h2{border-bottom:1px dashed #CCCCCC;font-size:1.5em;font-weight:bold;color:#007DDC;padding-bottom:5px;margin:2em 0 0.5em 0;}
h3{font-size:1.0em;font-weight:bold;color:#636363;}

h1 {
	position: relative;
	padding: 1em;
	font-size:22px;
	background: #e0edff;
	border-radius:10px;
	width: 95%;
	max-width:1050px;
	margin:0 auto;
	margin-top:1em;
}

h1:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 40px;
  border: 12px solid transparent;
  border-top: 12px solid #e0edff;
  width: 0;
  height: 0;
}



/*------------------------------------------
タイトル下、sp用サブメニュー
------------------------------------------*/
/*
.right_icon{
	display: none;
}
*/

/*------トップに戻るボタン-----*/
.pagetop {
	position: fixed;
	bottom: 10px;
	right: 5px;
	z-index:99;
	font-weight:bold;
}

.pagetop a {
	display: block;
	text-align: left;
	text-decoration: none;
	padding: 0;
	color:#FFFFFF;
	transition: all 0.3s;
}

.pagetop a:hover  {
	color: #ffff00;
	padding:0 0 10px 0;
	filter:alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.6;
}


/*------トップに戻るボタン-----*/

/* -------メニュー-------- */
#soc_menu{
	display:grid;
	grid-template-columns:1fr 1fr 1fr;
	gap:0 10px;
	margin:0 auto;
	width: 95%;
	max-width:1050px;
	font-weight:bold;
	text-align:center;
	font-size:1.5em;
}


#soc_menu>div{padding:5px;background: #0e8ff2;border-radius:999px;color:#FFF;font-weight:bold;}
#soc_menu>div a{display:block;transition:all 0.2s;background: #0e8ff2;padding:10px;border:2px solid #FFFFFF;border-radius:999px;}
#soc_menu>div a:hover{opacity:0.5;}


/*
#soc_menu{

	background-color:#FFFFFF;
	z-index:9;

	color:#007EDD;

	font-weight:bold;
	text-align:center;

	position:-webkit-sticky;
	position:sticky;

	top:0;
	width:100%;

	margin:0 auto;

}


#soc_menu>div{
	display:flex;
	width:100%;
	margin:0 auto;
	justify-content: space-between;
	max-width:800px;
}


#soc_menu>div>div{
	padding:1em;
	margin:1em;
	font-size:1.5em;
	flex: 1;
	background: #ffd1d1;
	box-shadow: 0px 0px 0px 5px #ffd1d1;
	border: dashed 2px white;
}


#soc_menu>div>div.is-animation {
	padding: 0.2em;
	font-size: 1em;
}


#soc_menu>div>div:nth-child(1){
	background: #e2f7ff;
	box-shadow: 0px 0px 0px 5px #e2f7ff;
}


#soc_menu>div>div:nth-child(2){
	background: #ffe8e8;
	box-shadow: 0px 0px 0px 5px #ffe8e8;
}

#soc_menu>div>div:nth-child(3){
	background: #e9ffcc;
	box-shadow: 0px 0px 0px 5px #e9ffcc;
}


#soc_menu a{display:block;color:#939393;text-decoration: none;}
#soc_menu a:hover{color:#2e9cea;}
*/

/* -------お知らせ-------- */
#oshirase{
	width:95%;max-width:1050px;margin:10px auto;border-bottom:1px solid #CCCCCC;
	display:flex;
	align-items: center;
	background-color:#e8e8e8;
}


#oshirase .oshirase_left{
	width: 10%;
	min-width:100px;
	padding:10px;
}
#oshirase .tag{
	text-align:center;border-radius:5px;padding:2px 5px;margin-bottom:2px;margin-top:2px;
}


#oshirase .tag_blue{
	background-color:#ff5000;color:#FFF;
}


#oshirase .tag_red{
	background-color:#FF0000;color:#FFFFFF;
}


#oshirase .oshirase_right{
	width: 90%;
	padding:10px;
}

#oshirase .oshirase_day{
	color:#999999;
}


/* -------ダウンロード-------- */
.download_flex{
	display:flex;
	text-align:cneter;
}
.download_flex>div{
	flex:1;
	position: relative;
	color:#3c69ad;
}

.download_flex a{
	display:block;font-size:1.2em;font-weight:bold;
	-webkit-transition: 0.2s;
        transition:all 0.2s;
}

.download_flex a .button_title{
	padding:10px;
}

.download_flex a .button_icon{
	background-color:#256a9e;color:#FFFFFF;width:100%;
}

.button_blue{
	margin:0 5px;
	height:100%;
	background-color:#f9fdff;
	border-bottom:5px solid #abdff2;
	border:1px solid #939393;
	border-radius: 5px;
	text-align:center;
}

.button_blue a:hover{
	opacity:0.5;
}




#sponsor{
	text-align:left;
	width:100%;
	margin:0 auto;
	color:#5e5e5e;
	line-height:1.8em;
	padding-top:2em;
	margin:0 auto;
}

#sponsor dt {
	float: left;
	width:100px;
	margin-bottom:1em;
	font-weight:bold;
}

#sponsor dd {
	margin-left: 100px;
	margin-bottom:1em;
}





/* -------協賛社ボックス-------- */
.kyosan_mes{
	border-top:#ffe493 dotted 10px;
	border-bottom:#ffe493 dotted 10px;
	font-family: 'M PLUS Rounded 1c', sans-serif;color:#FF0000;font-size:1.5em;font-weight:bold;text-align:center;margin:2em 0;padding:15px 0;
}
.mes_box{
	margin: 1em 0 1em 0;
	background-color: #edfce3;
	border: 2px solid #619943;
	border-radius: 0 10px 10px 10px;

	font-size:1.2em;
	line-height:1.8em;

}

.mes_title{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: absolute;
	margin-top: -35px;
	margin-left: -2px;
	background-color: #619943;
	color: #fff;
	border-radius: 10px 10px 0 0;
}

.mes_title div{padding: 4px 20px 4px 10px;}

.mes_txt{padding:1.5em;}


/* -------youtube-------- */
.yt_movie{
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;


}

.yt_movie > iframe{
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100%;
}

.yt_width > iframe{
	width:80%;

	margin:0 auto;
	border:1px solid #000000;
}



@media (min-width: 0px) and (max-width: 768px) {




/* --------main_img-------- */


	#main_img img{border-radius: 0px;}
	#main_img{width:100%;max-width:auto;margin:0 auto;padding-top:35px;}
	#main_sponsor{font-size:0.8em;}

	#oshirase{
		width:100%;margin:0 auto;
	}




	.file_dl{grid-template-columns: 1fr 1fr;gap:1em;}


	#sponsor{width:100%;margin:0 auto;}

	#sponsor dt {
		float: none;
		width:auto;
		margin-bottom:0.3em;
		border-bottom:1px solid #CCCCCC;
		font-weight:bold;
	}

	#sponsor dd {
		margin-left: auto;
	}


	.link_button a {font-size:1.0em;}

	/*h3{font-size:1em;}*/
	h2{font-size:1em;}
	h3{font-size:1em;font-weight:bold;color:#007DDC;}

	.text_box{font-size:1em;width:100%;}

	.kyosan_mes{
		border-top:#ffe493 dotted 6px;
		border-bottom:#ffe493 dotted 6px;
		font-size:0.6em;margin:0.8em 0;padding:15px 0;



	}

	#soc_menu{width:97%;font-size:15px;gap:0 5px;}
	#soc_menu>div{border-radius:999px;padding:4px;}
	#soc_menu>div a{border-radius:999px;padding:8px;}

/*
	#soc_menu>div>div{font-size:1.5em;}
	#soc_menu{}
	#soc_menu>div>div{padding: 4px;width:99%;background: #0e8ff2;color:#FFFFFF;border-radius:8px;}
	#soc_menu a{display:block;background: #0e8ff2;padding:6px;border:2px solid #FFFFFF;border-radius:5px;}
*/
	/*
	#soc_menu>div>div.is-animation {
		padding:0.2em;
		margin:0.6em 0.5em;font-size:0.8em;
	}
	*/


	.mes_box{
		margin:0 0 0 0;
	}
	.mes_title{
		position: static;
		margin-top: -30px;
		margin-left: -2px;
		width:100%;
		border-radius: 10px 10px 0 0;
		padding:2px;
	}
	.mes_title>div{padding: 10px;}
	.mes_box{font-size:0.6em;}

/*
	.day_box{flex-direction:column;}
	#day_box_left{width:100%;padding:0;}
	#day_box_right{width:100%;padding:0;}
*/

	.wrap{overflow:visible;}

}



@media (min-width: 0px) and (max-width: 400px) {

	/* -------メニュー-------- */
	#soc_menu{
		display:grid;
		grid-template-columns:1fr 1fr;
		gap:5px;
		margin:0 auto;
		width: 95%;
		max-width:1050px;
		font-weight:bold;
		text-align:center;
		font-size:1.0em;
	}
}


@media (min-width: 0px) and (max-width: 320px) {

	/*------------------------
		header
	--------------------------*/
	.header{
		font-size:14px;
	}


	/*------------------------
		その他
	--------------------------*/

	h2{font-size:1em;}
	.link_button a {font-size:1.0em;}

	.file_dl{grid-template-columns: 1fr;gap:20px 0;}
	.file_dl_txt{color:#000;font-weight:bold;font-size:20px;}

}

