@charset 'utf-8';

body{
    margin:0;
    padding:0;
    color:#222;
}

.wrap {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

header{
    background:rgba(255,255,255,0.8);
    filter:drop-shadow(5px 5px 5px rgba(0,0,0,0.1));
    position:fixed;
    width:100%;
    top:0;
    z-index:10;
}
.logo{
    max-width:960px;
    display:flex;
    justify-content:center;
    align-items:center;
    margin:30px auto;
}
.logo img{
    width:60px;
}
.title{
    margin-left:10px;
}
.logo h1{
    display:block;
    font-size:2.0em;
}
.logo p{
    display:block;
				text-align: center;
				font-size: 1.8em;
}
header nav{
    width:100%;
}
header nav ul{
    display:flex;
    max-width:960px;
    justify-content:center;
    margin:0 auto;
}
header nav ul li{
    width:20%;
}
header nav ul li a:visited,
header nav ul li a:link{
    text-decoration:none;
    color:#222;
    display:block;
    text-align:center;
    font-size:1.2em;
    font-weight:bold;
    padding:0;
}
header nav ul li a span{
    display:block;
    font-size:0.8em;
    font-weight:normal;
    letter-spacing:1px;
    margin:-3px 0 6px 0;
				color: #0D7400
}
header nav ul li a::after{
    content:'';
    display:block;
    border-bottom:3px solid #0D7400;
    margin:0 auto;
    width:0;
    transition:all .3s;
}
header nav ul li a:hover::after{
    width:100%;
}
.main_img img {
  width: 100%;
		margin-top: 190px;
}
.content{
    width:100%;
    padding:100px 0;
}
.content_area{
    text-align:center;
    max-width:960px;
    margin:0 auto;
}
.content_area h2{
    display:block;
    margin:0 auto;
    font-size:1.5em;
    position:relative;
}
.content_area h2 span{
    display:block;
    font-size:0.6em;
    letter-spacing:2px;
    margin:-4px auto 0;
    color:#0D7400;
}
.content_area h3 {
  border-bottom: solid 4px #dbebc4;
  position: relative;
		font-size: 1.5em;
		text-align: left;
		padding: 5px 0 ;
		margin: 20px 0
}
.content_area h3:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 4px #026537;
  bottom: -3px;
  width: 20%
}
.content_area h4 {
  font-size: 1.4em;
		text-align: left;
  padding: 0.25em 0.5em;
  color: #494949;
  background: transparent;
  border-left: solid 5px #a5c9c1;
		margin: 20px 0
}

.h4_live {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 26px;
	font-weight: bold;
	text-align: center;
	margin: 50px 0
}

.h4_live::before,
.h4_live::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: #026537;
}

.h4_live::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}
.h4_live::after {
	margin-left: 30px;
	transform: rotate(35deg)
}

.h4_live02 {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 26px;
	font-weight: bold;
	text-align: center;
	margin: 50px 0
}
.h4_live02::before,
.h4_live02::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: #026537;
}
.h4_live02::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}
.h4_live02::after {
	margin-left: 30px;
	transform: rotate(35deg)
}

.live img {
 border: 5px solid #d4dcd3;
	border-radius: 3%
}
.about h2::after {
  content: "";
  display: block;
  position: absolute;
  bottom: -25px;
  height: 8px;
  background: #A9D8B6;
  width: 70%;
  margin: auto;
  left: 0;
  right: 0;
}
.content_area p {
  margin: 10px auto 0;
  width: 100%;
  font-size: 1.2em;
  line-height: 2.3;
		text-align: left;
}

.news {
  background: url("../images/news_bg.png") no-repeat center center;
		background-size:cover;
}

.news_area {
  height: 200px;
  overflow-y: scroll;
  margin-top: 30px;
  width: 95%;
  margin: 0 auto;
}
.news_area table {
  width: 100%;
  font-size: 1.1em;
		font-weight: bold;
}
.news_area table tr {
  border-bottom: 1px solid #9d9d9d;
}
.news_area table tr td {
  padding: 16px 0 4px 0;
}
.news_area table tr td time::before {
  font-family: FontAwesome;
  content: "\f140";
  font-size: 0.8em;
  color: #9d9d9d;
  margin-right: 5px;
}
footer{
    background:#222;
}
footer p{
    color:#fff;
    text-align:center;
    letter-spacing:1px;
    font-size:0.9em;
    line-height:6;
}

/*---------------------------
下層ページ
---------------------------*/
#page_header{
    padding-top:10px;
    filter: drop-shadow(5px 0px 5px rgba(0,0,0,0.1));
    background:rgba(255,255,255,0.9);
}

@media screen and (max-width:579px){
    .logo{
        margin:20px auto 20px;
    }
    header{
        position:relative;
    }
    header nav ul{
        flex-wrap:wrap;
    }
    header nav ul li{
        width:30%;
    }
    header nav ul li a:visited,
    header nav ul li a:link{
        margin-top:5px;
    }
    header nav ul li a::after{
        width:80%;
        border-bottom:1px solid #222;
    }
    header nav ul li a span{
        margin:-3px 0 3px 0;
    }		
				.main_img img {
				width: 100%;
				margin-top:0px
				}
  .content {
    padding: 50px 10px;
  }
  .content_area p {
    font-size: 1.1em;
  }
  .news_area table tr td {
    vertical-align: top;
  }
  .news_area table tr td time {
    margin-right: 10px;
  }
		.news {
  background-image: url("../images/news_bg.png");
		width: 100%;
		
  }
		
		.h4_live02 {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin: 50px 0
}
.h4_live02::before,
.h4_live02::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: #026537;
}
.h4_live02::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}
.h4_live02::after {
	margin-left: 30px;
	transform: rotate(35deg)
}
		
    footer p{
        line-height:4;
    }
/*---------------------------
下層ページ
---------------------------*/
    #page_header{
        position:fixed;
    }
    #page_header+.content{
        padding-top:135px;
    }
}