/* ==========================
   結果ページ全体
========================== */

.dx-result-wrap {
	max-width: 1250px !important;
	margin: 0 auto 50px;
	padding: 20px;
}

.dx-result-wrap span {
	vertical-align: unset;
}

/* ==========================
   共通セクション
========================== */

.dx-result-section {
	padding: 10px 0;
	margin-bottom: 10px;
	background: transparent;
} 

/* ページタイトル（青い左ボーダー付き見出し） */
.dx-result-heading {
	font-size: 30px !important;
	font-weight: 700 !important;
	color: #333;
	margin: 0 0 30px !important;
	padding-left: 14px !important;
	border-left: 4px solid #008CD6 !important;
	line-height: 1.4 !important;
}

/* ==========================
   回答者情報
========================== */

.dx-info-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 18px;
	margin-bottom: 10px !important;
}

.dx-info-table th {
	width: 150px;
	text-align: center !important;
	font-weight: bold;
	min-width: 80px;
	background: #f2f7fc;
	text-align: left;
	padding: 10px;
	border: 1px solid #d9d9d9;
	color: #666;
}

.dx-info-table td {
	min-width: 300px;
	text-align: left;
	padding: 10px 20px;
	font-weight: normal;
	border: 1px solid #d9d9d9;
}

/* ==========================
   円グラフエリア
========================== */
/* 業界別回答（円グラフ）領域 */


#department-message {
	width: 100%;
	font-size: 20px;
	margin-bottom: 100px;
}

.dx-chart-container {
	display: flex;
	flex-wrap: wrap;
	gap: 4%;
	justify-content: space-between;
	margin-bottom: 100px;
}

.department-percent {
	color: #008CD6;
}

/* 業界別回答（円グラフ）個別円グラフ */
.dx-section-chart {
	width: 48%;
}

/* ==========================
   スコアテーブル　＋ レーダーチャート
========================== */
/* 採点スコアテーブル、レーダーチャートコンテナ */
.dx-score-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4%;
		justify-content: space-between;
		align-items: center;
	margin-bottom: 100px;
}

.dx-section-score {
	width: 48%;
}

/* スコアテーブル */
.dx-score-table {
	width: 100%;
	min-width: 100px;
	border-collapse: collapse;
	font-size: 18px;
}

.dx-score-table th {
	padding: 10px;
	text-align: center;
	border: 1px solid #d9d9d9;
	background: #f2f7fc;
	font-weight: bold;
	color: #666;
}

.dx-score-table td {
	padding: 10px;
	text-align: center;
	border: 1px solid #d9d9d9;
	font-weight: normal;
}


/* 評価ラベル */
.score {
	font-size: 25px;
	font-weight: bold !important;
}

.rank-a {
	font-size: 20px;
	color: #16a34a;
	font-weight: 700;
}

.rank-b {
	font-size: 20px;
	color: #f59e0b;
	font-weight: 700;
}

.rank-c {
	font-size: 20px;
	color: #dc2626;
	font-weight: 700;
}

/* 採点基準凡例 */
.dx-rank-legend {
	padding: 0px !important;
	font-size: 18px;
	text-align: start !important;
	border: none !important;
}

/* ==========================
   図形画像サイズ
========================== */

canvas {
	width: 100% !important;
	height: auto !important;
}

/* ==========================
   DXロードマップ
========================== */

.roadmapWrap {
	overflow: auto;
}

.tblSlide {
	display: none;
}


.dx-roadmap-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 20px;
	margin-bottom: 0px !important;
	min-width: 768px;
}

.dx-roadmap-table th {
	border: 1px solid #d9d9d9;
	padding: 10px;
	vertical-align: middle;
	background: #f2f7fc;
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	color: #666;
}

.dx-roadmap-table td {
	border: 1px solid #d9d9d9;
	padding: 20px;
	vertical-align: middle;
}

.dx-roadmap-table td:last-child {
	font-weight: normal;
}

.dx-step-column {
	width: 330px;
	min-width: 100px;
	text-align: center;
	line-height: 2;
	font-size: 18px;
}

.dx-score-column {
	width: 80px;
	text-align: center;
	font-size: 25px;
	font-weight: 700;
}

.dx-roadmap-items {
	min-width: 200px;
	list-style: none;
	padding: 0;
	margin: 0 !important;
}

.dx-roadmap-items li {
	padding: 3px 0;
	line-height: 1.5;
	font-size: 18px;
}

.dx-step-title {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 10px;
	color: #008CD6;
}

.dx-step-description {
	background: #CDF7FF;
	padding: 5px 18px;
	line-height: 1.6;
	color: #333;
	border-radius: 10px;
	box-sizing: border-box;
}



/* ==========================
   ボタンエリア
========================== */
.dx-result-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    padding: 24px;
}

.dx-btn {
    padding: 12px 28px;
	width: 200px;
    font-size: 20px;
    font-weight: 600;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s, opacity 0.15s;
}

.dx-btn:hover {
    opacity: 0.85;
}

/* 戻るボタン */
.dx-btn-back {
	display: inline-block;
	padding: 14px 70px;
	background: linear-gradient(90deg, #008cd6, #58b9e2) !important;
	color: #fff;
	border: none;
	border-radius: 50px;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
	transition: .3s;
}



.dx-btn-back:hover {
	opacity: 0.8;
}


/* PDF出力ボタン */
.dx-btn-pdf {
    background: #2563eb;
    color: #fff;
}




/*******************************************************************/
/* TB：幅1200px以下 
/*******************************************************************/
@media screen and (max-width: 1200px) {

	#main_col {
		width: 100% !important;
		max-width: 1000px;
	}
}

/*******************************************************************/
/* TB：幅1000px以下 
/*******************************************************************/
@media screen and (max-width: 1000px) {

	/* ==========================
		円グラフエリア
	========================== */
	/* 業界別回答（円グラフ）領域 */

	.dx-chart-container {
	display: block;
	}

	/* 業界別回答（円グラフ）個別円グラフ */
	.dx-section-chart {
	width: 100%;
	max-width: 500px;
	margin: 0 auto 20px;
	}

	/* ==========================
		スコアテーブル　＋ レーダーチャート
	========================== */
	/* 採点スコアテーブル、レーダーチャートコンテナ */
	.dx-score-container {
	display: block;
	}

	.dx-section-score {
	width: 100%;
	max-width: 500px;
	margin: 0 auto 20px;
	}

	.dx-section-score:first-child {
		max-width: none;
	}

	/* スコアテーブル */
	.dx-score-table {
	width: 100%;
	margin-bottom: 20px;
	}

}

/*******************************************************************/
/* SP：幅768px以下 
/*******************************************************************/
@media screen and (max-width: 768px) {

	/* ==========================
   結果ページ全体
========================== */

body.page #main_contents {
	max-width: 100%;
}


	.dx-result-wrap {
		padding: 0;
	}

	/* ==========================
   共通セクション
========================== */


/* ページタイトル（青い左ボーダー付き見出し） */
.dx-result-heading {
	padding-left: 9px !important;
	line-height: 1 !important;
}

/* ==========================
   回答者情報
========================== */

.dx-info-table {
	font-size: 16px;
}

.dx-info-table th {
	width: 100px;
	min-width: 80px;
	padding: 5px;
}

.dx-info-table td {
	min-width: unset;
	padding: 5px 10px;
}


/* ==========================
   円グラフエリア
========================== */
/* 業界別回答（円グラフ）領域 */


#department-message {
	font-size: 16px;
	margin-bottom: 40px;
}

.dx-chart-container {
	margin-bottom: 40px;
}


/* ==========================
   スコアテーブル　＋ レーダーチャート
========================== */
/* 採点スコアテーブル、レーダーチャートコンテナ */
.dx-score-container {
	margin-bottom: 40px;
}

/* スコアテーブル */
.dx-score-table {
	font-size: 16px;
}

.dx-score-table th {
	padding: 5px;
}

.dx-score-table td {
	padding: 5px;
}


/* 評価ラベル */
.score {
	font-size: 16px;
}

.rank-a, .rank-b, .rank-c {
	font-size: 16px;
}


/* 採点基準凡例 */
.dx-rank-legend {
	font-size: 16px;
}


/* ==========================
   DXロードマップ
========================== */

.dx-roadmap-table {
	font-size: 16px;
}

.dx-roadmap-table th {
	padding: 5px;
	font-size: 16px;
}

.dx-roadmap-table td {
	padding: 10px;
}

.dx-step-column {
	width: 230px;
	font-size: 16px;
}

.dx-score-column {
	width: 60px;
	font-size: 20px;
}

.tblSlide {
	display: block;
	font-size: 14px;
	color: #666;
	margin-bottom: 0 !important;
}

.dx-roadmap-items li {
	line-height: 1.4;
	font-size: 15px;
}

.dx-step-title {
	font-size: 16px;
}

.dx-step-description {
	padding: 5px 10px;
}


/* ==========================
   ボタンエリア
========================== */
.dx-result-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    padding: 24px;
}

.dx-btn {
    padding: 12px 28px;
	width: 200px;
    font-size: 20px;
    font-weight: 600;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s, opacity 0.15s;
}

.dx-btn:hover {
    opacity: 0.85;
}

/* 戻るボタン */
.dx-btn-back {
	display: inline-block;
	padding: 14px 70px;
	background: linear-gradient(90deg, #008cd6, #58b9e2) !important;
	color: #fff;
	border: none;
	border-radius: 50px;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
	transition: .3s;
}



.dx-btn-back:hover {
	opacity: 0.8;
}

}
  
  








/* ==========================
   印刷・PDF出力
========================== */
@media print {

    /* ページ設定（縦向きA4 / 余白最小） */
    @page {
        size: A4 portrait;
		margin: 8mm;
    }

	/* WordPress テーマのコンテンツラッパーの余白をリセット */
    .entry-content,
    .site-content,
    #primary, #main, #content,
    .wp-block-post-content {
        padding: 0 !important;
        margin: 0 !important;
        max-width: none !important;
    }

    /* WordPress テーマ・管理バーの共通要素を非表示 */
    #wpadminbar,
    header, .site-header, #header, #masthead,
    footer, .site-footer, #footer, #colophon,
    nav, .site-navigation, #site-navigation, .nav-links,
    aside, .sidebar, #sidebar, .widget-area,
    .dx-result-actions {
        display: none !important;
    }

    /* body の余白をリセット */
    body, html {
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
    }

    /* 結果エリアを 1200px 固定で出力 */
	.dx-result-wrap {
		width: 1200px !important;
		max-width: 1200px !important;
		margin: auto !important;
		padding: 0px !important;
		box-shadow: none !important;
		zoom: 0.80 !important;   /* ← 追加: A4縦の印刷可能幅に収まるよう縮小 */
	}


	#page_header {
		display: none;
	}

	#main_contents {
		margin-top: 0;
		padding-top: 0;
	}

	body.hide_sidebar #main_col {
		padding-top: 0;
	}

	.dx-result-wrap {
		padding-top: 0;
	}
	



}