@import url("/files/co/css/suzuki.css?d=95641adf50ecf2a79a0da7e103bd5ec2");

@charset "UTF-8";
/*
	ページ専用スタイルシート

	////////// id・class名の命名規則 //////////

	（１） クラスの命名規則としてprefix（接頭辞）を付与すること。また先頭は必ず小文字指定とする。
	（例：「.exampleClass」というクラスを作る場合、頭にhogeを付けて「.hoge-exampleClass」とすること。「hoge」の部分は何でもよい。「page」など）
*/

/* -------------------------------------------------------------
	【 ブレイクポイント値・カラーコード参照 】
	以下の数値・カラーコードは、ページ内で使用しているものです。
	スタイルを記述する際に参考にしてください。
------------------------------------------------------------- */
:root {
	--breakpoint-sp: 736px;

	//  size
	//----------------------------------------------------------------------
	--page-width: 1200px;
	--main-width: 860px;
	--side-width: 300px;

	//  colors
	//----------------------------------------------------------------------
	--txtColor: #333;
	--overlayBg: rgba(0, 0, 0, 0.8);
	--red: #f43838;
	--red-light: #ff5c5c;
	--blue: #0f218b;
	--blue-light: #749ddb;
	--gray: #cccccc;
	--gray-dark: #959595;
	--gray-light: #dcdcdc;
	--gray-exLight: #f8f8f8;
	--gray-border: #dcdcdc;
	--gray-bg: #f8f8f8;
	--gray-bgDark: #e9e9e9;
	--black: #222;
	--green: #63c5d2;
}

/*
	hoge-exampleClass
------------------------------------------------------------- */
.hoge-exampleClass {
	color: #f00;
	background-color: #eee;
	border: 1px solid #f00;
}
/* PC style only */
@media screen and (min-width: 737px) {
}
/* SP style only */
@media screen and (max-width: 736px) {
}


/*
	アイラーニング様記述分↓※横線内に記述をお願いします
------------------------------------------------------------- */
.headLine3{
	line-height:1.5;
}
.recommend .recommend_body{
	justify-content:flex-start;
}
/* .pageID-leadership  */
.pageID-leadership {

	.pageLinkGraph_block{
		min-height:180px;
	}
	.pageLinkGraph_txt{
		min-height:3em;
	}
}

/* .pageID-itss */
.pageID-itss{

	.headLine2{
		margin-top:60px;
	}
	.headLine3{
		margin-top:60px;
	}
	h3.n-bl{
		border-left:none;
		padding-left:0;
	}
	.box{
		padding:20px 30px;
		margin:10px 0 0;
		background-color:#eff2f4;
	}
	.box_member{
		margin-top:20px;
	}
	.box_head{
		padding:0;
	}
	.box p{
		padding:5px 0 0;
		margin:0;
	}
	.level_head{
		font-size:16px;
		font-weight:bold;
		margin:30px 0 15px;
		border-bottom:solid 1px #869ab2;
	}
	.box_head strong,
	.level_head strong{
		margin-left:1em;
	}
	.ancList-freeCol{
		justify-content:flex-start;
	}
	.scrollTable table{
		font-size:0.9rem;
	}
	.scrollTable table thead{
		font-size:0.8rem;
	}
	.scrollTable table .th_left{
		width:8em;
		text-align:center;
		position:relative;
	}
	.scrollTable table .th_pro{
		background-color:#333333;
		border-color:#333333;
	}
	.scrollTable table .th_ad{
		background-color:#00347d;
		border-color:#00347d;
	}
	.scrollTable table .th_ba{
		background-color:#749ddb;
		border-color:#749ddb;
	}
	.scrollTable table .th_en{
		background-color:#63c5d2;
		border-color:#63c5d2;
	}
	.scrollTable table .th_left::before{
		content:"";
		clip-path: polygon(0 100%, 50% 0, 100% 100%);
		position:absolute;
		bottom:-1px;
		left:0;
		right:0;
		margin:auto;
		width:100%;
		height:15px;
	}
	.scrollTable table .th_pro::before{
		background-color:#00347d;
	}
	.scrollTable table .th_ad::before{
		background-color:#749ddb;
	}
	.scrollTable table .th_ba::before{
		background-color:#63c5d2;
	}
	.scrollTable table .th_left span{
		display:inline-block;
		padding:0 5px;
		font-size:0.8rem;
		color:#869ab2;
		background-color:#fff;
		border-radius:5px;
	}
	.scrollTable table .th_level{
		width:5em;
		text-align:center;
		background-color:#e9e9e9;
	}
	.scrollTable table .th_level span{
		font-weight:bold;
		font-size:1.5em;
	}
	.scrollTable table .th_gray{
		background-color:#d3d3d3;
	}
	.scrollTable table .td_gray{
		background-color:#f8f8f8;
	}
	.scrollTable table .th_blank{
		background-color:transparent;
		border:0;
	}
}

/* .wysiwyg */
.wysiwyg .desc{

	.box_c{
		display:flex;
		justify-content:center;
	}
	.box_c .i-box{
		width:80%;
		padding:30px 40px;
	}
	.box_c .i-box-blue .ilon{
		margin-top:0;
	}
	@media screen and (max-width: 736px) {
		.box_c .i-box{
			width:100%;
			padding:1em;
		}
	}
}	


/* .pageID-coursesDetail */

.pageID-coursesDetail .target{

	.headLine2{
		margin-top:80px;
	}
	.sec_inner{
		padding-top:0;
	}
}

/* .pageID-guideLocation */
.pageID-guideLocation {

	@media screen and (min-width: 737px) {
		.col4 .ancList {
			grid-template-columns:repeat(4, 1fr);
		}
	}
	@media screen and (max-width: 736px) {
		.col4 .ancList a{
			margin-top:0;
		}
	}
}

/* .pageID-pduCourse */
.pageID-pduCourse {

	.i-programTable{

	td {
		width:auto;
	}
	td[data-th="コード"],
	td[data-th="PDU"]{
		width:6em;
		text-align:center;
	}
	td[data-th="トライアングル"]{
		width:13em;
		text-align:center;
	}
	}
}

/* .pageID-guideLocationNewhire */
.guide-application{

	.imgTxt .btnSquareNavy{
		grid-template-columns:repeat(2,1fr);
	}
}

/* .pageID-recruit */
.pageID-recruit{

	.hover-bg .hover-text{
		padding-top:23%;
		background:none;
	}
	.hover-bg .hover-text>h4{
		color:#fff;
	}
}

/* .pageID-dxcenter */
.pageID-dxcenter{

	.ndheader_inner{
		padding:15px 10px 18px 10px;
	}
	.ndheader a{
		color:#fff;
	}
}
/* .pageID-illustratedThinking */
.pageID-illustratedThinking{

	.d_feature dd .merit li span{
		margin-right:0.5em;
	}
}

/*
	アイラーニング様記述分↑
------------------------------------------------------------- */




/*
	通常時、非表示要素のものをwysiwygエディタに登録すると、wysiwygエディタの「ビジュアルモード」だと【非表示の状態】が再現されてしまうので何も見えない状態になります。
	これを防ぐために、wysiwygエディタ内で表示する要素のみに対して、非表示要素を表示しておく処理が必要になります。
	※可能な範囲で大丈夫です。

	.mce-content-body  ←  wysiwygエディタ編集エリアを囲っている親のclass
------------------------------------------------------------- */
.mce-content-body .sampleClass {
	display: block;
	opacity: 1;
}