@charset "utf-8";

/**************************************************
 mainVisual
**************************************************/
#mainVisual{
	margin: 0 0 60px 0;
	padding: 0;
  background: #F5F6F7;
}

.visual_image{
  width: 90%;
  margin: auto;
}

.slick-dots{ bottom: -35px;}
.slick-dots li button:before{ font-size: 12px;}

.slick-dots li:hover button:before,
.slick-dots li.slick-active button:before{ color: #2C1F86;}

/**************************************************
 article
**************************************************/
article{
  max-width: 1100px;
  margin: auto;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;/*--- IE10 ---*/
	-webkit-justify-content: space-between; /* Safari */
	justify-content: space-between;
	-webkit-box-align: stretch;/*--- Androidブラウザ用 ---*/
	-ms-flex-align: stretch;/*--- IE10 ---*/
	-webkit-align-items: stretch;/*--- safari（PC）用 ---*/
	align-items: stretch;
  flex-wrap: wrap;
}

/** btnHanger ********************/
#btnHanger{
	width: 100%;
	text-align: center;
	margin: 0 0 30px;
}

#btnHanger span{
	font-size: 16px;
	font-size: 1.6rem;
}

.btn_flex{
	width: 100%;
	display: flex;
	justify-content: center;
	
}

.btn_flex .btnFb{ margin: 0 0 20px 20px;
}

/** banner ********************/
.bannerArea{
  width: 40%;
  padding: 0 5% 0 0;
}

.bannerArea p span{
	font-size: 18px;
	font-size: 1.8rem;
}
.bannerArea ul li{
  margin: 0 0 15px 0;
  line-height: 0;
}

.bannerArea ul li span{
  position: relative;
  display: block;
  padding: 18px 15px;
  background: #F5F6F7;
  font-size: 21px;
	font-size: 2.1rem;
  font-family: '新ゴ M', sans-serif;
  line-height: 1;
}

.bannerArea ul li span::before{
  content: '';
  position: absolute;
  top: 18px;
  right: 10px;
  width: 26px;
  height: 26px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #2C1F86;
  z-index: 10;
}
.bannerArea ul li span::after{
  content: '';
  position: absolute;
  top: 26px;
  right: 20px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 10;
}

.bannerArea ul li a:hover{ color: #00A3D9;}
.bannerArea ul li a:hover span::before{ background: #00A3D9;}

/** content ********************/
.contentArea{
  width: 60%;
  padding: 0 0 0 5%;
  border-left: 1px solid #2C1F86;
}

.contentArea h3{
  width: 100%;
  margin: 0 0 20px 0;
  padding: 0;
  background: #F5F6F7;
  border-top: 2px solid #2C1F86;
  color: #FFFFFF;
  font-size: 18px;
  font-size: 1.8rem;
  font-family: '新ゴ M', sans-serif;
  font-weight: normal;
}
.contentArea h3 span{
  display: inline-block;
  padding: 10px 15px;
  background: #2C1F86;
}

.movieHanger{ margin: 0 0 30px 0;}

.profHanger{
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;/*--- IE10 ---*/
	-webkit-justify-content: space-between; /* Safari */
	justify-content: space-between;
	-webkit-box-align: flex-start;/*--- Androidブラウザ用 ---*/
	-ms-flex-align: flex-start;/*--- IE10 ---*/
	-webkit-align-items: flex-start;/*--- safari（PC）用 ---*/
	align-items: flex-start;
  flex-wrap: wrap;
}

/*.profHanger ul li{
  margin: 0 0 15px 0;
  line-height: 0;
}

.profHanger ul li span{
  position: relative;
  display: block;
  padding: 18px 15px;
  background: #F5F6F7;
  font-size: 21px;
	font-size: 2.1rem;
  font-family: '新ゴ M', sans-serif;
  line-height: 1;
}

.profHanger ul li span::before{
  content: '';
  position: absolute;
  top: 18px;
  right: 10px;
  width: 26px;
  height: 26px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #2C1F86;
  z-index: 10;
}
.profHanger ul li span::after{
  content: '';
  position: absolute;
  top: 26px;
  right: 20px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 10;
}

.profHanger ul li a:hover{ color: #00A3D9;}
.profHanger ul li a:hover span::before{ background: #00A3D9;}*/

.prof_image{ width: 30%;}

.prof_text{ width: 65%;}

.prof_text h4{
  margin: 0;
  padding: 0;
  font-size: 26px;
  font-size: 2.6rem;
  font-family: '新ゴ M', sans-serif;
  line-height: 1.2;
}
.prof_text h4 span{
  display: block;
  font-size: 18px;
  font-size: 1.8rem;
}

.prof_text p{
  padding: 15px 0;
	font-size: 16px;
	font-size: 1.6rem;
}

.prof_text .moreBtn{ margin: 0 0 20px 0;}

.prof_text .moreBtn a{
  min-width: inherit;
  padding: 10px 50px 10px 15px;
  border: 1px solid #2C1F86;
  border-radius: 3em;
	font-size: 16px;
	font-size: 1.6rem;
}
.prof_text .moreBtn a::after{
  top: 19px;
  right: 15px;
  border-top: 2px solid #2C1F86;
  border-right: 2px solid #2C1F86;
}
.prof_text .moreBtn a:hover{
  background: #F5F6F7;
  color: #2C1F86;
}

.btnFb{ margin: 0 0 20px 0;}

/**************************************************
 news
**************************************************/
.newsHanger{
  width: 100%;
	margin: 30px auto;
	padding: 0;
	vertical-align: middle;
  border: 2px solid #2C1F86;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;/*--- IE10 ---*/
	-webkit-justify-content: space-between; /* Safari */
	justify-content: space-between;
	-webkit-box-align: stretch;/*--- Androidブラウザ用 ---*/
	-ms-flex-align: stretch;/*--- IE10 ---*/
	-webkit-align-items:stretch;/*--- safari（PC）用 ---*/
	align-items: stretch;
  flex-wrap: wrap;
}

.newsHanger h3{
  width: 30%;
  background: #2C1F86;
  color: #FFFFFF;
	font-size: 22px;
	font-size: 2.2rem;
  text-align: center;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;/*--- IE10 ---*/
	-webkit-justify-content: center; /* Safari */
	justify-content: center;
	-webkit-box-align: center;/*--- Androidブラウザ用 ---*/
	-ms-flex-align: center;/*--- IE10 ---*/
	-webkit-align-items: center;/*--- safari（PC）用 ---*/
	align-items: center;
}

.newsList{
  width: 70%;
  padding: 0 15px;
}

.newsList dl{
  width: 100%;
  margin: 0;
  padding: 15px 0;
  border-bottom: 1px dotted #EEEEEE;
	font-size: 16px;
	font-size: 1.6rem;
}
.newsList dl:last-child{ border: none;}

.newsList dt{
  padding: 0;
	font-size: 14px;
	font-size: 1.4rem;
}

.newsList dd{
  margin: -27px 0 0 160px;
  padding: 0;
}

.fb{ width: 500px;}


/**************************************************
 Responsive
**************************************************/

@media screen and (max-width: 640px){
	
	/** mainVisual ********************/ 
  .visual_image{ width: 100%;}
  
	/** article ********************/
  article{ padding: 15px;}
	
	#btnHanger{
		text-align: left;
	}
	
	#btnHanger span{
		font-size: 15px;
		font-size: 1.5rem;
	}
	
	.btn_flex{
		display: block;
	}
	
	.btn_flex .btnFb{ margin: 0 0 20px 0;
}
	
  
  .bannerArea{
    width: 100%;
    padding: 0;
  }
  
  .contentArea{
    width: 100%;
    padding: 30px 0 0 0;  
    border: none;
  }
  
  .prof_image{
    width: 100%;
    text-align: center;
  }
  
  .prof_text{
    width: 100%;
    padding: 10px 0;
  }
  
  .prof_text h4{ text-align: center;}
  
  .prof_text .moreBtn a{ width: 100%;}
  
  .btnFb{
    margin: 0;
    text-align: center;
  }
	
	/** news ********************/
	.newsHanger{
    margin: 20px auto;
    padding: 15px;
  }
  
  .newsHanger h3,
  .newsList{
    width: 100%;
    padding: 0;
  }
  
  .newsList dd{ margin: 0;}

}