@charset "UTF-8";

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

.txtarea{
    width:80%;
    margin:0 auto;
    display: block;
}

.coment{
    font-size: 16px;
}




.titleArea h2 
{	
	text-align:center;
	font-family: "游明朝体","Yu Mincho",YuMincho,"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","ＭＳ Ｐ明朝","MS PMincho",serif;
	font-size:34px!important;
	font-weight:normal;
	letter-spacing:0.09em;
}

.titleArea h2 span.bg {
	background:#FFF;
	padding:0 15px;
}

.titleArea h2 span.ja {
	display:block;
	font-size:12px!important;
	font-family: "游明朝体","Yu Mincho",YuMincho,"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","ＭＳ Ｐ明朝","MS PMincho",serif;
}

.imgarea {
  width: 80%;
  margin: 0 auto;
  text-align:center;
}

.imgarea img{
   text-align:center;
 padding-bottom: 60px;
}
.imgarea p{
  font-size:20px!important;
  font-weight:bold;
}



/*========= モーダル表示のためのCSS ===============*/

/*全て共通：hideエリアをはじめは非表示*/
.hide-area{
    display: none;
  }
  
  /*全て共通：モーダルのボタンの色を変更したい場合*/
  .modaal-close:after, 
  .modaal-close:before{
    background:#ccc;  
  }
  
  .modaal-close:focus:after,
  .modaal-close:focus:before,
  .modaal-close:hover:after,
  .modaal-close:hover:before{
    background:#666;
  }
  
  /*確認を促すモーダル：タイトルの色を変更したい場合*/
  #modaal-title{
    font-size:1.2rem;
    text-align: center;
    margin: 0 0 20px 0;
  }
  
  /*動画表示のモーダル：余白を変更したい場合*/
  .modaal-video .modaal-inner-wrapper{
    padding:0;
  }
  
  /*以下はコンテンツ内のレイアウト*/
  .info-list dl,
  .gallery-list{
    display: flex;
  }
  
  .info-list dt{
    margin:0 10px 0 0;
  }
  
  

/*=== RESPONSIVO ================================*/
@media screen and (max-width: 500px) {

   
    .imglist{
        flex-flow: column;
        
       }
      
       .imglist li{
        width:100%;
       }

}

@media screen and (min-width:500px) and (max-width: 1024px){

    .imglist li{
        width:50%;
        margin:0 auto;
       }

}