/*small screens*/


body {
    background: #F8F8F8;
    font-size: 14px;
    font-family: Verdana, sans-serif;
    margin: 0;
    color: #333;
    }
    
p {
    line-height: 2;
    }

.container {
   width: 90%;
   margin: 0 auto;
   }

.section-title {
   text-align: center;
   font-weight: normal;
   font-size: 28px;
   }
.section-subtitle {
   text-align: center;
   font-weight: bold;
   margin: 0 0 60px;
   font-family: serif;
   }
   
body > section {
   padding: 60px 0;
   }
   
body > section:nth-of-type(odd) {
   background: #fff;
   }


   
#menu {
   position: absolute;
   /*横幅いっぱい*/
   top: 0;
   left: 0;
   right: 0;
   background: rgba(0, 0, 0, .9); /*ちょっと透明の黒*/
   color: #fff;
   display: none;
   }

/*Javascriptで.shown切り替えを実装*/
#menu.shown {
	display: block;
	}
   
#menu ul {
	list-style: none;
	margin: 0;
	padding: 10px 20px;
	}

#menu li {
	line-height: 2;
	}

#menu a {
	text-decoration: none;
	color: inherit;
	}
   
#open_menu {
   float: right;
   font-size: 24px;
   cursor: pointer;
   }
   
#close_menu {
	padding: 15px;
	float: right;
	cursor: pointer;
	}
.mv {
    width:100%;height:800px;
    background: #F8F8F8 url(mv.jpg) no-repeat center center;
    background-size: cover;
}

audio {width:200px;height:25px;}

.feature img {
   width: 100%;
   }
   
.feature:not(:last-child) {
   margin-bottom: 60px;
   }
   
.news-item img {
   width: 100%;
   }
.news-item {line-height:30px;}
   
.how-to-use div.video {
   /*動画をiframe-wrapperいっぱいに表示*/
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   }

.how-to-use img {
   /*動画をiframe-wrapperいっぱいに表示*/
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   }

.news-item:not(:last-child) {
   margin-bottom: 60px;
   }
   
 .how-to-use .iframe-wrapper {
    /* background: pink;*/
    /* padding-bottom: 25%; 4:3のBOX*/
    padding-bottom: 56.25%; /*16:9のBOX*/
    height: 0;
    position: relative;
    }
   
footer {
   text-align: center;
   padding: 60px 0;
   color: #ccc;
   }







/*medium screens*/
@media (min-width: 570px) {

  .feature img {
    width: 50%;
  }

  .feature p {
    width: 45%;
  }

  .feature:nth-of-type(odd) p {
    float: right;
    padding-left: 5%;
  }

  .feature:nth-of-type(even) p {
    float: left;
    padding-right: 5%;
  }

  .feature {
    overflow: hidden;
  }

  .news .flex {
    display: flex;
    justify-content: space-between;
  }

  .news-item {
    width: 30%;
  }

}

/*large screens*/
@media (min-width: 912px) {
	
	.container {
		width: 820px;
		}
	#open_menu {
		display: none;
		}
	#close_menu {
		display: none;
		}
	#menu {
		display: block;
		position: static;
		background: transparent;
		color: #333;
		}
	#menu ul {
		padding: 0;
		float: right;
		}
	#menu li {
		display: inline-block;
		width: 60px;
		text-align: center;
		}
	}

.feature ul {
	list-style-image:url(images/list03.png);
	}

.feature li {
	line-height: 3;
	}
.feature td {
	vertical-align: top;
	border-bottom: solid 1px #ccc;
	padding: 7px;
	}


.map img {
	width:100%;
	}