/*---------------------------------------------------------------------*/
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　     　*/
/*　           https://www.seiryunone.com/　清流の音　                 */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　     　*/
/*　　　　　　　　　 共通用  CSS　2020.11.22　　　　　　　             */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　     */
/*---------------------------------------------------------------------*/


body{
	font: 15px/1.231 fot-tsukuardgothic-std, 'YuGothic', '游ゴシック', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', sans-serif;
	color: #111;
	margin: 0;
	padding: 0;
	font-family: fot-tsukuardgothic-std, YuGothic, "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}


h1,h2,h3,h4{
 margin: 0;
 padding: 0;
}

img{
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: bottom;
	text-align: center;
}

p{
	font-size: 100%;
	letter-spacing: 0.05em;
	line-height: 150%;
	margin: 0 0 1em 0;
	text-align: center;
}


@media only screen and (max-width: 750px) {

p{
 font-size: 14px;
 letter-spacing: 0.05em;
 line-height: 26px;
 margin: 0 0 1em 0;
}


}


/*ヘッダーここから---------------------------------------*/

#header{
 width: 100%;
 height: 800px;
 object-fit: cover;
 background: url(../img/mainimg.jpg) center center / cover no-repeat;
 margin: 0;
 padding: 0;
 position:relative;
}

#header_top{
 width: 95%;
 height: 100px;
 margin: 0 auto;
 padding: 0 2.5%;
 background-color:rgba(23,74,136,0.75);
 overflow: hidden;
}


.logo{
 margin : 20px 0 0 0;
 padding : 0;
 float : left;
}

.logo img{
 max-width : 130px;
 height: auto;
}

.h_navi{
 float:right;
 width : auto;
 margin : 0;
 padding : 0;
}

.h_navi ul{
 font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
 color: #FFF;
 font-size: 110%;
 letter-spacing : 0.05em;
 text-align:center;
 margin : 45px 0 0 0;
 padding : 0;
}

.h_navi li {
 display : inline;
 margin : 0;
 padding : 0 3em 0 0;
}

.h_navi a{
 color: #fff;
 text-decoration: none;
}

.h_navi a:hover{
 text-decoration: none;
 opacity: 0.7;
 filter: alpha(opacity=70);
}


@media only screen and (max-width: 750px) {

#header{
 width: 100%;
 height: 300px;
 object-fit: cover;
 background: url(../img/mainimg.jpg) center center / cover no-repeat;
 margin: 0;
 padding: 0;
 position:relative;
}

#header_top{
 width: 95%;
 height: auto;
 margin: 0 auto;
 padding: 10px 2.5%;
 background-color:rgba(23,74,136,0.75);
 overflow: hidden;
}

#header h1{
 width : 100%;
}


.logo{
 margin : 0;
 padding : 0;
}

.logo img{
 width : 30%;
 height : auto;
 margin: 0 auto;
 display:block;
}


.h_navi{
	display:none;
}




}




/*共通ここから---------------------------------------*/



#wrap{
 width: 100%;
 margin: 0;
 padding: 0;
 overflow:hidden;
}

#pagewrap{
 width: 1000px;
 margin: 0 auto 70px;
 padding: 0;
 overflow:hidden;
}


.topicpath{
 width : 1000px;
 margin : 0 auto 50px;
 text-align : left;
 overflow : hidden;
 font-size : 85%;
 letter-spacing : 0.05em;
}

.topicpath a {
 color : #333;
 text-decoration : underline;
}

.topicpath a:hover {
 color : #333;
 text-decoration : none;
}

.subtitle {
 font-size : 140%;
 font-weight: 600;
 color: #333;
 letter-spacing : 0.05em;
 border-bottom: solid 3px #ccc;
 margin: 0 0 30px 0;
 padding: 0 0 10px 0;
 position: relative;
}


.kyocyo {
 color:#FFBF00;
}

.cyui {
 color:#FF0000;
}





@media only screen and (max-width: 750px) {



#wrap{
 width: 100%;
 margin: 0;
 padding: 0;
 overflow:hidden;
}

#pagewrap{
 width: 94%;
 margin: 0 auto 70px;
 padding: 0;
 overflow:hidden;
}


.topicpath{
 width: 94%;
 margin : 0 auto 30px;
 text-align : left;
 overflow : hidden;
 font-size : 14px;
 letter-spacing : 0.05em;
}

.topicpath a {
 color : #333;
 text-decoration : underline;
}

.topicpath a:hover {
 color : #333;
 text-decoration : none;
}

.subtitle {
 font-size : 20px;
 font-weight: 600;
 color: #333;
 letter-spacing : 0.05em;
 border-bottom: solid 3px #ccc;
 margin: 0 0 20px 0;
 padding: 0 0 5px 0;
 position: relative;
}





}






/*フッターここから---------------------------------------*/

#footer{
	background-color:#444444;
	width: 100%;
	margin: 0;
	overflow:hidden;
	padding-right: 0;
	padding-left: 0;
	height: 45px;
	line-height: 50px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 18px;
	color: #FFFFFF;
}



.copyright p{
 font-size: 90%;
 letter-spacing: 0.05em;
 color:#fff;
 text-align:center;
 margin: 0;
}

.copyright br{
 display:none;
}



@media only screen and (max-width: 750px) {

#footer{
 background-color:#444444;
 width: 100%;
 margin: 0;
 padding: 1em 0;
 overflow:hidden;
}

.copyright p{
 font-size:12px;
 letter-spacing: 0.05em;
 color:#fff;
 text-align:center;
 margin: 0;
}

.copyright br{
 display:block;
}


}