/** style-top.css **/


/*==========================================
トップページ用修正
===========================================*/




/*********
 mainNavi
**********/
#headContents #headContentsTop #headConInner #mainNavi{
	padding-bottom:10px;
}

/*********
 #headTop_mb
**********/
@media screen and (max-width: 768px) {
	/** headTop_mb **/
	#headTop_mb{
		margin-bottom: 0;
	}
	
		main {
		padding: 20px 0 70px;
	}

}



/*==========================================
 top_mainImg メインイメージ関連
===========================================*/

#headLogo h1{
	display: none;
}

#headContents #headContentsTop #headContentsTopInner{
	background: #FFBF00;
	
}
@media screen and (max-width: 768px) {
	/** headTop_mb **/
	#headTop_mb{
		background: #FFBF00;
	}
}

/** top_mainImg **/
#top_mainImg{
	width: 100%;
	background: #FFBF00;
}


/** topmainImg_bg **/
#topmainImg_bg{
	height: calc(100vh - 110px);
	background: url("../img_top/top_mainImg_bg.png") right top / auto 100% no-repeat;
	background-size: 690px;
	position: relative;
	padding-bottom: 0;
	min-height: 800px;
}

@media screen and (max-width: 768px) {
	#topmainImg_bg{
		height: 80vh;
		min-height: 80vh;
		min-height: auto;
		background: url("../img_top/top_mainImg_bg.png") center top no-repeat;
		background-size: contain;
		background-size: 90%;
	}
}


/*==========================================
 topImg_logo
===========================================*/

#topImg_logo{
	display: block;
	max-width: 300px;
	margin: 0 auto 0 20px;
	padding-top: 90px;
}

@media screen and (max-width: 768px) {
	#topImg_logo{
		display: none;
	}
}


/*==========================================
 slide_txt 動くテキスト
===========================================*/

#slide_txt{
	font-size:5em;
	font-weight: bold;
	text-align: left;
	width: 98%;
	margin: 0 auto;
	padding-top: 70px;
}

#slide_txt p{
	line-height: 1.3;
	margin-bottom: 5px;
}

#slide_txt p:nth-child(1){
	animation-delay: 0s; 
}


#slide_txt p:nth-child(2){
	animation-delay: 1s; 
}

#slide_txt p:nth-child(3){
	animation-delay: 2s;
}

@media screen and (max-width: 768px) {
	#slide_txt{
		position: absolute;
		bottom: 80px;
	}
	#slide_txt p{
		font-size: 4rem;
	}

}





/*==========================================
 topImg_title
===========================================*/

#topImg_title{
	position: absolute;
	bottom: -10px;
	left: 0;
	margin: 0;
}

#topImg_title img{
	width: 100%;
	max-width: 960px;
	margin: 0 auto 0 0;
}

/**
#topImg_title{
	color: #fff;
	font-size: 16rem;
	font-weight: bold;
	position: absolute;
	bottom: -70px;
	left: 0;
	margin: 0;
}
**/
@media screen and (max-width: 768px) {
	#topImg_title{
		position: absolute;
		bottom: -5px;
		left: 0;
		margin: 0;
	}
	
	#topImg_title img{
		max-width: 700px;
	}
	/**
	#topImg_title{
		font-size:clamp(50px, 16vw, 100px);
		font-weight: bold;
		position: absolute;
		bottom: 0px;
		left: 0;
		margin: 0;
		text-align: left;
		line-height: 1;
	}
**/

}


/*==========================================
 見出し
===========================================*/

.topContents_txt h2{
	margin-bottom: 50px;
}
.topContents_txt h2 span {
	border-top: solid 2px #ccc;
	position: relative;
	font-size: 5rem;
	letter-spacing: 0.12em;
	color: #333;
	padding-top: 10px;
}

.topContents_txt h2 span:before {
  position: absolute;
  content: " ";
  display: block;
  border-top: solid 2px #F7931E;
  top: -2px;
  width: 30%;
}



/*==========================================
top_vision
===========================================*/
#top_vision{}

#top_vision .topContents_img{
	width: 40%;
	order: 1;
}

#top_vision .topContents_img img{
	width: 100%;
	max-width: 500px;
	margin: 0 auto 0 0;
}


#top_vision .topContents_txt{
	width: 50%;
	order: 2;
	padding-top: 50px;
}

#top_vision .topContents_txt p{
	font-size: 1.1em;
}


@media screen and (max-width: 768px) {
	#top_vision .topContents_img{
		width: 100%;
	}
	#top_vision .topContents_txt{
		width: 100%;
		order: 1;
		padding-bottom: 40px;
	}
}


/*==========================================
top_entry
===========================================*/
#top_entry{
	width: 100%;
	min-height: 600px;
}

#top_entry > div#top_entry_topImg{
	background: -webkit-linear-gradient(#fff 0%, #fff 50%, #FFF8E1 50%, #FFF8E1 100%);
	background: -o-linear-gradient(#fff 0%, #fff 50%, #FFF8E1 50%, #FFF8E1 100%);
	background: linear-gradient(#fff 0%, #fff 50%, #FFF8E1 50%, #FFF8E1 100%);
	text-align: right;
}
#top_entry > div#top_entry_topImg img{
	margin: 0 15px 0 auto;
	max-width: 110px;
}


/** top_entry_wrap **/

#top_entry #top_entry_wrap{
	position: relative;
	min-height: 560px;
}

/** top_entry_img_scroll **/
#top_entry #top_entry_wrap #top_entry_img_scroll {
	width: 46%;
    height: 506px;
    background: url('../img_top/top_entry_img_scroll.png') repeat-x;
    background-repeat: repeat-x;
    background-size: auto 506px;
    animation: top_entry_img_scroll_loop 60s linear infinite;
	position: absolute;
	top: 0;
	right: 0;
}
@keyframes top_entry_img_scroll_loop {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -2000px 0;
    }
}

@media screen and (max-width: 768px) {
	#top_entry #top_entry_wrap #top_entry_img_scroll {
		position: static;
		width: 100%;
		height: 306px;
		background-size: auto 306px;
	}
}


#top_entry .topContents_txt{
	width: 50%;
}

#top_entry .topContents_txt h2{
	margin-bottom: 0;
	padding-top: 40px;
}

#top_entry .topContents_txt h3{
	font-size:1.1em;
	margin: 5px 0 40px;
}

@media screen and (max-width: 768px) {
	#top_entry .topContents_txt{
		width: 100%;
	}
	
}



/*==========================================
top_group
===========================================*/
#top_group{
	padding-top: 70px;
}

#top_group .topContents_img{
	width: 46%;
}

#top_group .topContents_img ul{
	width: 100%;
	border-bottom: 1px solid #000;
}
#top_group .topContents_img ul li{
	border-top: 1px solid #000;
}

#top_group .topContents_img ul li a{
	display:block;
	position: relative;
	padding: 25px 0;
}

#top_group .topContents_img ul li a::after{
	content: "\f054";
	font-family:'Font Awesome 5 Free';
	font-weight:900;
	font-size: 3rem;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%) translateX(-50%);
	margin: auto;
	color: #F1520B;
}

#top_group .topContents_img ul li a img{
	width: 100%;
	max-width: 452px;
}


#top_group .topContents_txt{
	width: 46%;
	padding-top: 50px;
	background: url("../img_top/top_group_bg.png") right bottom no-repeat;
}

#top_group .topContents_txt h2{
	margin-bottom: 0;
	padding-top: 20px;
}

#top_group .topContents_txt h3{
	font-size:1.1em;
	margin: 5px 0 40px;
}

#top_group .topContents_txt p{
	font-size: 1.1em;
}


@media screen and (max-width: 768px) {
	#top_group .topContents_img{
		width: 100%;
	}
	#top_group .topContents_txt{
		width: 100%;
		padding-bottom: 40px;
	}
	
	#top_group .topContents_img ul li a img{
		width: 80%;
		max-width: 452px;
	}
}




/*==========================================
top_visit
===========================================*/
#top_visit{
	margin-top: 150px;
	padding-top: 50px;
}

#top_visit .topContents_img{
	width: 40%;
	order: 1;
	position: relative;
}

#top_visit .topContents_img img#top_visit_img{
	width: 100%;
	max-width: 370px;
	margin: 0 auto 0 0;
}


#top_visit .topContents_img img#top_visit_img_human{
	width: 100%;
	max-width: 120px;
	position: absolute;
	right: 0;
	bottom: 0;
}

#top_visit .topContents_txt{
	width: 50%;
	order: 2;
	padding-top: 50px;
}

#top_visit .topContents_txt h2{
	margin-bottom: 0;
}

#top_visit .topContents_txt h2 span{
	font-size: 4.3rem;
}

#top_visit .topContents_txt h3{
	font-size:1.1em;
	margin: 5px 0 40px;
}

#top_visit .topContents_txt p{
	font-size: 1.1em;
}



@media screen and (max-width: 768px) {
	#top_visit{
		margin-top: 150px;
		padding-top: 20px;
	}

	#top_visit .topContents_txt{
		width: 100%;
		order: 1;
		padding-bottom: 40px;
	}
	#top_visit .topContents_img{
		width: 100%;
		text-align: center;
	}
	#top_visit .topContents_img img#top_visit_img{
		margin: 0 auto;
	}


	#top_visit .topContents_img img#top_visit_img_human{
		width: 100%;
		max-width: 100px;
		right: -10px;
		bottom: -80px;
	}
}




/*==========================================
top_staff
===========================================*/
#top_staff{
	margin-top: 150px;
	padding-top: 50px;
}

#top_staff .topContents_img{
	width: 40%;
	order: 2;
	position: relative;
}

#top_staff .topContents_img img#img_staff{
	width: 100%;
	max-width: 590px;
	margin: 0 auto 0 0;
}

#top_staff .topContents_img img#img_human{
	width: 100%;
	max-width: 87px;
	position: absolute;
	bottom: 40px;
	left: 0;
}

#top_staff .topContents_txt{
	width: 50%;
	order: 1;
	padding-top: 50px;
}

#top_staff .topContents_txt h2{
	margin-bottom: 0;
}

#top_staff .topContents_txt h2 span{
	font-size: 4.3rem;
}

#top_staff .topContents_txt h3{
	font-size:1.1em;
	margin: 5px 0 40px;
}

#top_staff .topContents_txt p{
	font-size: 1.1em;
}



@media screen and (max-width: 768px) {
	#top_staff{
		margin-top: 150px;
		padding-top: 20px;
	}

	#top_staff .topContents_img{
		width: 100%;
	}
	#top_staff .topContents_txt{
		width: 100%;
		order: 1;
		padding-bottom: 40px;
	}
	#top_staff .topContents_img img#img_human{
		bottom: -46px;
		max-width: 76px;
	}
}



/*==========================================
top_news
===========================================*/
#top_news{
	margin-top: 100px;
}

#top_news .topContents_img{
	width: 70%;
	order: 2;
}

#top_news .topContents_img img{
	width: 100%;
	max-width: 590px;
	margin: 0 auto 0 0;
}

#top_news .topContents_txt{
	width: 20%;
	order: 1;
	padding-top: 50px;
}

#top_news .topContents_txt h2{
	margin-bottom: 0;
}

#top_news .topContents_txt h2 span{
	font-size: 4.3rem;
}

#top_news .topContents_txt h3{
	font-size:1.1em;
	margin: 5px 0 40px;
}

#top_news .topContents_txt p{
	font-size: 1.1em;
}



@media screen and (max-width: 768px) {
	#top_news{
		margin-top: 150px;
		padding-top: 20px;
	}

	#top_news .topContents_img{
		width: 100%;
	}
	#top_news .topContents_txt{
		width: 100%;
		order: 1;
		padding-bottom: 40px;
	}
}

