@charset "utf-8";
	body {margin: 0; padding:0;}
	.wrapper {width:100%;  height: auto; /*背景画像は高さを持たないため、heightの指定が必要*/ 
  background-image: url(img/background-image.jp);/*相対パスで画像ファイルを指定*/
	background-size: cover;}	
	
.container {width:1000px; margin: 0px auto 0;background: #fff;padding:50px 0px 50px;

}
.main_img {margin: 0 auto 30px; width:35%;}	
.way_use {background: #aaa; color: #fff; text-align: center; border-radius: 30px; padding:10px; margin: 50px auto 30px; width:100%;  box-sizing:border-box;}	

	h1 {font-size: 30px; font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"}
	
ol.sample1{
  counter-reset:list;
  list-style-type:none;
  font: 14px/1.6 'arial narrow', sans-serif;
  padding: 0px;

}
  
ol.sample1 li{
  position:relative;
  line-height: 30px;
  margin: 7px 0 7px 40px;
  padding-left: 10px;
  font-weight: ;
  font-size:14px;
}
  
ol.sample1 li:before{
  counter-increment: list;
  content: counter(list);
  position: absolute;
  left: -35px;
  width: 30px;
  height: 30px;
  background: #fff;
  text-align: center;
  color: #333;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
	
	.attention {background: #eee; color:#555; padding:15px; font-size: 14px; border-radius: 10px; margin: 15px;}	
	
	.f-container-kira {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
	width:100%;
	margin: 15px 0;
}
    .heading-kira {margin-bottom:30px;}
	
	.heading-kira p {margin: 0;
    padding: 5px 0 20px;
	font-weight:bold;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    font-size: 25px;
}

	.f-container-kira p {font-size:20px; font-weight: bold;} 
.f-item-kira {
    width: 28%;
    margin-right: 1%;
	margin-bottom:70px;
}
	
 
.f-item-kira-text {
    width: 68%;
    margin-right: 1%;
	margin-bottom:10px;
}
	
	.f-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
	width:100%;
}
 
.f-item {
    width: 49%;
    margin-right: 1%;
	margin-bottom:10px;
}
 
.f-item:nth-child(2n) {
    margin-right: 0;
}
.f-item-buy {
    width: 49%;
    margin-right: 1%;
	margin-bottom:10px;
}
 
.f-item-buy:nth-child(2n) {
    margin-right: 0;
}


.f-item-otakiage {
    width: 100%;
    margin-right: 1%;
	margin-bottom:10px;
}
 




	.f-container-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
	width:1000px;
	margin:0 auto;
	 padding:50px auto;
}
 
 
 
 
img {max-width:100%;}
	
.text {margin: 10px 15px 70px;}	
	
.youtube-embed {  width: 100%; /* 親要素の幅に合わせる */
  aspect-ratio: 16 / 9; /* YouTubeの標準アスペクト比 */
  height: auto; /* 高さは自動調整 */	
  margin:10px auto 70px;
  }
  
  
  .f-item-kira-text p {margin:0; padding:5px 0 20px; font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; font-size:25px;}
  
    .ttl_line3 {
  font-weight: ;
  border-bottom: 1px solid #e3e3e3;
  padding: 0.3em;
  margin-bottom: 1.3em;
  position: relative;
  font-size:32px;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; 
}
.ttl_line3::after {
  content: '';
  background-color: #555;
  width: 2em;
  height: 2px;
  position: absolute;
  bottom: -3px;
  left: 0;
  z-index: 1;
}
    .ttl_line3a {
  font-weight: ;
  border-bottom: 1px solid #fff;
  padding: 0.3em;
  margin-bottom: 1.3em;
  position: relative;
  font-size:25px;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; 
}
.ttl_line3a::after {
  content: '';
  background-color: #555;
  width: 2em;
  height: 2px;
  position: absolute;
  bottom: -3px;
  left: 0;
  z-index: 1;
}

.footer {margin:0px auto; background:#E4E9FD; padding:50px 0;}
.footer-container {max-width:1000px; margin:0 auto} 

 .btn-simple-solid {	 
  background: #555;
  width:100%;

  border: none;
  padding: 12px 32px;
  font-size: 23px;
  color:#fff;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; 
  border-radius: 6px;
  cursor: pointer;
  font-weight: 200;
  transition: all 0.3s ease;
  
  &:hover {
    background: #777;
    transform: translateY(-2px);
  }
  
  &:active {
    transform: translateY(0);
  }
  }

  
  @media (max-width: 1024px) {
  .container {
    width: 100%;
    padding: 0 25px;
	box-sizing:border-box;
  }
  div.text {width:100%; margin:0 auto 50px;}
  .ttl_line3 {font-size:20px;}
  .ttl_line3a {font-size:20px;}
  .youtube-embed {margin:20px auto;}
  .f-container-kira {display: ;}
  .f-item-kira {width:100%; text-align:center;}
  .f-item-kira-text {width:80%; margin:auto;}
  .f-container-footer {width:100%; padding:10px; box-sizing:border-box;}
  .f-container {margin:60px autox 30px;}
  .footer-container {width:100%; margin:0 0px; padding:0 15px;box-sizing:border-box;} 
   .btn-simple-solid {	font-size:18px;
  }
  /* CSS Document */