/*===================================================================

	第二階層
	support/index.html

=====================================================================*/

/*---ファーストビューCSS---*/
.fv h1 {
    position: absolute;
    top: calc( 50% - 30px );
    left: 0;
    right:  0;
    margin: auto;
    width: 1100px;
    font-size: 50px;
    color: #FFF;
}
.fv {
    width: 100vw;
    height: 15em;
    margin-bottom: 30px;
    background: linear-gradient(135deg, #014186 10%, #bdeeff 90%);
    margin-left: calc(50% - 50vw);
    position: relative;
    }

/*---ファーストビューCSS_SP---*/
@media (max-width:768px) {
	/*.fv h1＝位置と大きさ、.fv＝背景高さ*/
	.fv h1 {
    	    font-size: 30px;
    	    left: 1em;
    	    width: auto;
	    }
	    .fv {
    	    height: 10em;
    }
}
    .fv_{
      width: 100vw;
      margin-bottom: 30px;
   }
    .fv_ h1 {
      position: relative;
      display: inline-block;
      padding-bottom: 10px; /* 文字と下線の間に余白を作る */
      top: calc(50% - 30px);
      left: 0;
      right: 0;
      margin: auto;
      width: 1100px;
      font-size: 2.5em;
    }

    .fv_ h1::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    border-bottom: 5px solid #0084B2;
    border-top: 12px solid #0084B2;
    height: 3px;
    }
@media (max-width: 768px) {
    .fv_ h1 {
        font-size: 30px;
        left: 1em;
        top: 1em;
        margin-bottom:1em;
    }
    .fv_ h1::after {
        content: "";
        left: -1em;
    }
}
/*---コンテンツCSS---*/
.sup a {
    color:#086183;
}
.sup a:hover {
    text-decoration:underline solid #333;
}
.margin-h2em {
    margin: 2em 0;
}
.soft > ul{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    justify-content: center;
}
.soft > ul li{
    margin:0 1em;
    width:calc(25% - 2em);
    height:auto;
}
.soft > p {
    margin-left: 1em; margin-bottom: 1em;
}

.content_title{
    margin-left: 1em;
    margin-bottom: 1em;
    padding-left: 1em;
    padding-top: 0.3em;
    border-left: 0.3em solid var(--accent-color);
}

/*---コンテンツCSS_SP---*/

@media only screen and (max-width: 767px) {
    .sup {
        margin: 0 20px;
    }
    .soft > table {
        margin: 0 auto;
    }
}


/*===================================================================

	コメントアウト

=====================================================================*/

/*---画像サイズ高さ設定、ページ依存-----------------*/
/*.main_visual--item{
	height:20em;
}
*/

/*---切替アニメーション設定、ページ依存-----------------*/
/*.main_visual--item--bgimg{
	animation:mv_fade;
	animation-duration:5s;
	animation-iteration-count:1;
	animation-fill-mode: forwards;
}
*/

/*---表示画像設定、ページ依存-----------------*/
/*.main_visual--item > .src1 {
	background-image:url(../images/mv_industry.jpg);
	animation-delay:0s;
}
*/

/*---アニメーション最終状態設定、ページ依存-----------------*/
/*@keyframes mv_fade {
	100% { opacity: 1; transform: scale(1.05,1.05);}
}
*/

/*---前面テキスト設定、サイズ・色-----------------*/
/*.main_visual--item--text{
	height:20em;
	padding-top:8em;
	padding-left:8em;
	background:linear-gradient(to right,rgba(var(--main_color),0.8),
		rgba(var(--main_color),0.1) 60%,rgba(var(--main_color),0.0));
	top:0em;
	left:0em;
	animation-duration:1s; 
	animation-fill-mode:both;

}
@media (max-width:768px){
	.main_visual--item{
		height:12em;
	}

	.main_visual--item--bgimg{
		animation:none;
		opacity:1;
		height:12em;
	}
	.main_visual--item > .src1{
		background-image:url(../images/index_mv02.jpg);
		background-position:top; 
		background-repeat: no-repeat;
		background-size:100%;
	}
	.main_visual--item--text{
		top:0;
		left:0;
		width:100%;
		height:100%;
		padding-top:4em;
		padding-left:5em;
		animation:none;
		color:#fff;
		h1{font-size:6vw;}
	}

}
*/

/*===============================================
	メインビジュアル下　サブメニュー
	ボックス型
	全体リンク（ホバー色付け）
===============================================*/
/*.submenu_boxtype >.inner{
		display:flex;
		width:80%;
		margin:0 auto;
		margin-bottom:3em;
		border-bottom:1px solid #bbb;
		text-align:center;
	}
	.container:has(ul.submenu){
		justify-content:space-between;
		width:100%;
		display:flex;
	}
	ul.submenu{
		width:100%;
		flex-wrap:wrap;

		padding:0;
		list-style:none;
		text-align:center;
	}
	ul.submenu li{
		display:inline-block;
		position: relative;
		top:0;
		width:30%;
		height:8em;
		vertical-align: top;

	}
	ul.submenu .text_area{
		padding-top:1.2em;
		height:30%;
	}
	ul.submenu .text_area > p{
		padding:0 1em;
		overflow-wrap:break-word;
		font-size:smaller;
	}
	ul.submenu .img_area{
		height:70%;
	}
	ul.submenu .img_area img{
		height:90%;
		margin:0 auto;
		filter: invert(80%);
	}
	ul.submenu li a{
		display:block;
		width:100%;height:100%;
		transition:.5s;
		border:1px solid #bbb;
	}

	ul.submenu li a:hover{
		background:rgba(var(--main_color),0.5);
		h3,p{color:#fff;}
		img{filter: invert(0%);}
	}
*/

/*---SP表示--------------------*/
/*@media (max-width:768px){
	.submenu_boxtype{
		width:100%;
		top:0em;
	}
	.submenu_boxtype >.inner{
		width:90%;
		margin-left:5%;
	}
	ul.submenu li{
		display:block;
		width:100%;
		height:5em;
		margin-bottom:0.3em;
	}
	ul.submenu li .text_area > h3{
		margin:0;
	}
	ul.submenu li .text_area{
		padding-top:0.5em;
	}
	ul.submenu li .text_area > p{
		font-size:smaller;
		margin:0;
		text-align:left;
		br{display:none;}
	}

	ul.submenu li a{
		display:block;
		width:100%;height:100%;
		transition:.5s;
		color:#333333;
		background-color:transparent;
	}

	ul.submenu li a:hover{
		opacity:1;
		color:#333333;
	}
}
*/


/*---ページ内リンクの位置調整--------------------*/
/*.content h3:before{
	content:'';
	display:block;
	padding-top:7em;
	margin-top:-7em;
}
*/

/*===============================================
	コンテンツ
	サムネイル表示
	hover画像拡大、全体リンク
===============================================*/
/*.content >.inner{
	width:80%;
	margin-left:10%;
	margin-bottom:5em;
}

.thumbnail_area{
	margin-top:1em;
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
}

.thumbnail_area a img{
	transform:scale(1);
	transition:.3s
}
.thumbnail_area a:hover img{
	transform:scale(1.03);
	transition:.3s
}
.thumbnail_area--item{
	margin-bottom:1em;
	border:1px solid #eee;

}
.thumbnail_area--item .img_area > img{
	width:100%;
	height:auto;
	filter:drop-shadow(0 0 0.2em #333);
}
.thumbnail_area--item .text_area{
	width:100%;
	overflow-wrap:normal;
	padding-top:0.5em;
}
.thumbnail_area--item .text_area span{
	color:#f00;
}
.thumbnail_area--item .img_area{
	width:100%;
	height:14em;
	max-height:14em;
	overflow: hidden;
	background-color:#eee;
	padding:0.4em 0;
}
*/

/*===============================================
	サムネイル表示_4列
===============================================*/
/*.thumbnail_col4 .thumbnail_area--item{
	width:24%;
	height:18em;
	text-align:center;
}
.thumbnail_col4 .thumbnail_area--item .img_area img{
	width:auto;
	height:100%;
	margin:0 auto;
}
*/

/*---SP表示_サムネイル表示_4列→2列-----------------*/
/*@media (max-width:768px){
	.thumbnail_area {
		margin-bottom:2em;
	}
	.thumbnail_area > .blank_item{
		display:none;
	}
	.col5 .thumbnail_area--item{
		width:47%;
		height:20em;
	}
	.thumbnail_col4 .thumbnail_area--item{
		width:47%;
		height:12em;
	}
}
.table_area{
	border:1px solid #999;
}
.table_area h4{
	line-height:2.8em;
	padding-left:1em;
	background-color:#ddd;
	border-bottom:1px solid #999;
}
.table_area .table--item{
	height:3em;
	border-bottom:1px solid #999;
}
.table_area .table--item .text_area{
	width:80%;
	float:left;
	line-height:2.8em;
	padding-left:2em;
}
.table_area .table--item .img_area{
	width:20%;
	border-left:1px solid #999;
	float:right;
	height:100%;
	line-height:2.8em;
}
.table_area .table--item .img_area img{
	float:left;
	height:100%;
	padding-left:1em;
	padding-top:0.5em;
	padding-bottom:0.5em;
	margin-right:0.3em;
}
*/