@charset "utf-8";
/* CSS Document */
#header_text{
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    max-width: 1000px;
	width: 90%;
}

.fixed{
	top: 22px; 
}
.blk_video{
	line-height: 0;
}
video{
	width: 100%;
	position: relative;
}
.blk_video [class^="icon-"]{
	z-index: 10;
    font-size: 2em;
    position: absolute;
    display: block;
    bottom: 20px;
    right: 30px;
}
.blk_video [class^="icon-"].hide{
	display: none;
}
.blk_blog .area_ttl{
	padding:3em 3em 3em;
}
.blk_blog .area_txt{
	width: calc(100% - 252px);
	padding: 3em 3% 0;
}
.blk_blog .area_txt dt,
.blk_blog .area_txt dd{
	display: inline-block;
}
.blk_blog .area_txt dt{
	width: 5em;
	transform: translateY(5px);
}
.blk_blog .area_txt dd{
	width: calc(100% - 6em);
	margin-bottom: 1em;
}
.blk_blog .area_txt .bgc_lightgreen{
	padding: 1px 5px 2px;
	display: inline-block;
    margin-bottom: 5px;
    margin-right: 1em;
}
.box_slide{
	height: 50%;
	width: 100%;
}
#sec_ttl .blk_blog{
	padding-bottom: 0.5em;
	border-bottom: 2px solid #33CC4B;
}
#sec_ttl dt,
#sec_ttl dd{
	width: auto;
}
#sec_ttl dt{
	padding-right: 0.5em;
	margin-bottom: 0.5em;
}
#sec_tgc .blk_ttl_left{
	transform: translateY(-50%);
	margin-top: 11em;
}
#sec_tgc .blk_cnt{
	margin-top: -110px;
}
#sec_tgc .box_tgc{
	padding-top: 15em;
}
#sec_tgc .area_img{
	width: 60%;
}
#sec_tgc .area_txt{
	width: 48%;
	position: relative;
}
#sec_tgc .out_right{
	margin-right: -10%;
}
#sec_tgc .out_left{
	margin-left: -10%;
}
.counter_increment .box_tgc{
	counter-increment: title;
}
.counter_increment .box_tgc .area_txt::before{
	content: counter(title, decimal-leading-zero);
	font-family: 'Roboto Condensed', sans-serif;
    font-weight: 300;
	color: #BDF29B;
	font-size: 14.285em;
	position: absolute;
	top: 0;
	left: 0;
	transform: translateY(-0.9em);
	z-index: -1;
}
#sec_voice .blk_voice{
	padding: 20px 5% 60px;
}
#sec_voice .blk_voice h3{
	font-size:4.285em;
	line-height: 0.75;
	transform: translateY(-40px);
}
#sec_voice .blk_voice .blk_voice_inner{
	overflow: hidden;
}
#sec_voice .blk_voice h3 span{
	font-size: 0.33em;
}
#sec_voice .box_voice{
	max-width: 617px;
	width: 90%;
}
#sec_voice .box_voice .area_img{
	width: 70px;
	padding-top: 1em
}
#sec_voice .box_voice .area_txt{
	width: calc(100% - 70px);
	overflow: hidden;
}
#sec_voice [class^="icon-"]{
	font-size: 5em;
}
#sec_voice .icon-voice2{
	color: #FCB442;
}
#sec_voice hr{
	margin: 0.25em 0 1em;
    border-top: 1px solid #000;
}
#sec_voice .txt_uline{
	background-image: linear-gradient(90deg, transparent, #FFF);;
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: 0 30%;
	transition: all 5s ease-in-out;
}
 #sec_voice.active .txt_uline{
  background-size: 100% 40%; /* '40%'の部分にマーカーの太さを記入 */
  
}
.flex_row_3 > a{
	width: 30%;
}
.bnr_taiken_footer{
	position: absolute;
    max-width: 230px;
    width: 20%;
    bottom: 3em;
    right: 0;
}
/*===============================================*/
@media screen and (max-width: 1199px) {
	#sec_tgc .area_img{
		width: 55%;
	}
	#sec_tgc .out_right{
		margin-right: -5%;
	}
	#sec_tgc .out_left{
		margin-left: -5%;
	}
	.flex_row_3 > a{
		width: 45%;
	}
}
/*===============================================*/
@media screen and (max-width: 999px) {
	/*.bnr_taiken_footer{
		display: none;
	}*/
	#footer_nav{
		width: 15vw;
	}
}
/*===============================================*/
@media screen and (max-width: 767px) {
	.blk_blog .area_ttl{
		width: 100%;
		padding-top:3em;
	}
	
	.blk_blog .area_txt{
		width: 100%;
	}
	.blk_blog .area_txt dd{
		width: 100%;
	}
	#sec_tgc .blk_ttl_left h3{
		font-size: 5.22vw;
	}
	.bnr_taiken_footer{
		display: block;
		width: 30%;
	}
	
}
/*===============================================*/
@media screen and (max-width:640px){
	
}
/*===============================================*/
@media screen and (max-width:640px){
	#header_text{
		overflow: hidden;
	}
	#header_text h1{
	  display     : inline-block;
	  padding-left: 100%;
	  white-space : nowrap;
	  line-height : 1em;
	  animation   : animate-banner 20s linear infinite;
	}
	@keyframes animate-banner {
	  0% {
		transform: translateX(0);
	  }
	  100% {
		transform: translateX(-100%);
	  }
	}
}
/*===============================================*/
@media screen and (max-width: 480px) {
	#sec_tgc .area_img{
		width: 105%;
		order: 2;
	}
	#sec_tgc .area_txt{
		width: 100%;
		order: 1;
		margin-bottom: 1em;
	}
	#sec_tgc .out_right{
		margin-right: -5%;
	}
	#sec_tgc .out_left{
		margin-left: -5%;
	}
	.blk_blog .area_ttl{
		padding: 2em 2em 1em;
	}
	.blk_blog .area_ttl h3{
		display: inline-block;
		margin-right: 1em;
    vertical-align: top;
	}
}