/*-------------------------------
 *  home
 * -----------------------------*/

/*--------------------------------
最新情報
--------------------------------*/
.feature{
	background:#FFF;
}
.feature .flex-item:first-child{
	flex:1;
	margin-right:10px;
	background:#77ca1e;
}
.feature .flex-item:last-child{
	flex:4;
	padding:12px 0;
}
.feature .flex-item h3{
	color:#FFF;
	padding:14px 7px;
	font-size:1rem;
	text-align:center;
	margin:0;
}
/*--------------------------------
 mainvisual
--------------------------------*/
#mainvisual{
  position: relative; 
	min-height: 500px;
  margin: 0 auto; 
  width: 100%; 
	overflow-x:hidden;
}
#bg_video {
position:fixed;
	top:0;
	left:0;
min-width:100%;
min-height: 600px;
width:auto;
height:auto;
z-index:-1;
}
#mainvisual .overlay{
	position:absolute;
	width:100%;
	height:100%;
	background:rgba(0,139,85,0.6);
}
video{
	display:block;
}
#mainvisual article{
	position:absolute;
	width:100%;
	top:20%;
	text-align:center;
}
#mainvisual .arrow{
	position:absolute;
	width:100%;
	bottom:5%;
	text-align:center;
}
#mainvisual h2{
	text-align:center;
	color:#FFF;
	font-size:1.4em;
	font-weight:700;
	padding-bottom:30px;
}
#mainvisual p{
	font-weight:700;
	color:#FFF;
	padding:0 10px;
	font-size:0.9rem;
}

@media (min-width:360px){
#mainvisual{
	height:240px;
}
}
@media (min-width:480px){
#mainvisual{
	height:300px;
}
}
@media (min-width:40em){
#mainvisual{
	height:400px;
}
}
@media (min-width:64em){
#mainvisual{
	min-height:720px;
	margin:0;
}
#mainvisual p{
	font-size:1.1rem;
	line-height:1.8;
}
}
#business01{
	position:relative;
	background:url(../img/bg_business01.jpg?200317) no-repeat;
	background-size:cover;
	min-height:300px;
}
#business01 article{
	position:absolute;
	top:20%;
	width:100%;
	text-align:center;
	margin:0;
}
.business {
	position:relative;
	border-bottom:1px solid #FFF;
/*	background:#77ca1e;*/
}
.business img{
	width:100%;
	height:auto;
	z-index:1;
}
.business article{
	bottom:0;
	width:100%;
	padding:10px;
	margin:0;
}
.board{
	width:100%;
	height:auto;
	background:rgba(0,0,0,0.7);
	margin:0 auto;
	padding:10px;
}
.board.narrow{
	width:60%;
	height:auto;
	padding:20px 10px;
	background:rgba(0,139,85,.8);
}
.board h3{
	position:relative;
	display:inline-block;
	color:#FFF;
	font-size:1rem;
	font-weight:bold;
	border:none;
}
.board h3:after{
	display:inline-block;
	content:'';
	height:14px;
	width:1px;
	background:#FFF;
	margin: auto 8px;
}
.board h4{
	display:inline;
	color:#FFF;
	font-size:0.9rem;
	border:none;
}
a.sidebutton{
	display:block;
	width:200px;
	background:rgba(0,0,0,0.7);
	color:#FFF;
	font-size:0.9rem;
	font-weight:bold;
	text-align:left;
	padding:10px 20px;
	margin:10px auto;
	transition:all linear 0.3s;
}
a.sidebutton span{
	display:inline-block;
	float:right;
}
/* 202210追加 */
#business01 a.sidebutton{
    position: relative;
    background: #000;
    border-bottom: 3px solid #00ff02;
    text-align: center;
    font-size: 1.1em;
    width: 80%;
    margin: 4vw auto;
    padding-right: 30px;
}
#business01 a.sidebutton:first-of-type{
    margin-top: 6vw;
}
#business01 a.sidebutton::after{
    content: "";
    position: absolute;
    top: 50%;
    right: 1em;
    transform: translateY(-50%) rotate(45deg);
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    width: 0.6em;
    height: 0.6em;
    transition:all linear 0.3s;
}
#business01 a.sidebutton:hover{
    opacity: 0.8;
}
#business01 a.sidebutton:hover::after {
    transform: translate(0.2em, -50%) rotate(45deg);
}
/* /202210追加 */
@media(min-width:40em){
.business {
	border-bottom:none;
}
.business article{
	position:absolute;
	padding:0;
}
.board{
	height:85px;
	padding:1vw;
}
.board.narrow{
	width:70%;
	height:auto;
	padding:20px 10px;
	background:rgba(0,139,85,.8);
}
.board h3{
	display:block;
	font-size:1.1rem;
	margin-bottom:.1rem;
}
.board h3:after{
	display:none;
}
.board h4{
	display:block;
	font-size:0.9rem;
	font-weight:normal;
}
}

@media(min-width:64em){
.board{
	height:80px;
}
.board h3{
	font-size:1.2rem;
	margin-bottom:.1rem;
}
.pcfont-size{
	font-size:1.5rem !important;
}
a.sidebutton{
	display:block;
	width:240px;
	background:rgba(0,0,0,0.7);
	color:#FFF;
	font-size:1rem;
	font-weight:bold;
	text-align:left;
	padding:20px 20px;
	margin:10px auto;
	transition:all linear 0.3s;
}
#business01 a.sidebutton{
    width: 20em;
    margin: 30px auto;
}
#business01 a.sidebutton:first-of-type{
    margin-top: 60px;
}
}
#topics{
}
#information .flex-box{
	display:flex;
	flex-wrap:wrap;
}
#information .flex-item {
	position:relative;
	min-height:60px;
	border-bottom:1px solid #9ee1ba;
	width:100%;
}
#information .flex-box .flex-item .overlay{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,139,85,0.6);
	transition:all linear 0.3s;
}

#information .flex-box .flex-item article{
	position:relative;
	top:10%;
	left:5%;
	width:95%;
	z-index:1;
}

#information .flex-box .flex-item h2{
	font-size:1rem;
	font-weight:bold;
	font-style:italic;
	color:#FFF;
}
#information .flex-box .flex-item h2:after{
	display:block;
	content:'';
	height:1px;
	width:100px;
	background:#FFF;
	margin:5px 0;
}
@media all and (min-width:40em){
#information .flex-item{
	width:calc(100% / 3);
	border-bottom:0;
	min-height:300px;
}

#information .flex-box .flex-item:hover .overlay{
	background:rgba(0,139,85,0);
}
#information .flex-box .flex-item article{
	position:absolute;
	top:40%;
}
#information .flex-box .flex-item:first-child {
	background:url(../img/bg_information01.jpg) no-repeat bottom;
	background-size:cover;
}
#information .flex-box .flex-item:nth-child(2) {
	background:url(../img/bg_information02.jpg) no-repeat bottom;
	background-size:cover;
}
#information .flex-box .flex-item:nth-child(3) {
	background:url(../img/bg_information03.jpg) no-repeat bottom;
	background-size:cover;
}
#information .flex-box .flex-item:nth-child(4) {
	background:url(../img/bg_information04.jpg) no-repeat bottom;
	background-size:cover;
}
#information .flex-box .flex-item:nth-child(5) {
	background:url(../img/bg_information05.jpg) no-repeat bottom;
	background-size:cover;
}
#information .flex-box .flex-item:last-child {
	background:url(../img/bg_information06.jpg) no-repeat bottom;
	background-size:cover;
}
}
@media all and (min-width:64em){
#information .flex-item{
	width:calc(100% / 6 - 0.01%);
	min-height:600px;
}
}
