/* =============================================================================
   HTML5 Boilerplate CSS: h5bp.com/css
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif; color: #414141; }
body { margin: 0; font-size: 1em; line-height: 1.4; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

a { color: #0046d2; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

/*ul, ol { margin: 1em 0; padding: 0 0 0 40px; }*/
ul, ol { margin: 0; padding: 0 0 0 0; }
/*dd { margin: 0 0 0 40px; }*/
dd { margin: 0 0 0 0; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom; }

svg:not(:root) { overflow: hidden; }

figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }
h1,h2,h3,h4,h5{padding: 0; margin: 0;}

/* ----------------------------------------
 html要素デフォルト設定 
 ---------------------------------------- */
html{
	background: #fff;
}
body{
	background:#fff;
	color:#32302f;
	font-size:14px;
	line-height:1.8em;
}
ul>li,
ol>li{
	list-style-type:none;
}
a{
	color:#0046d2;
	text-decoration: underline;
}
a:visited{
	color:#0046d2;
}
a:hover{
	color:#0046d2;
	text-decoration: none;
}
p{margin: 0;}
::selection {
	background: #3297FD;
	color: #fff;
	text-shadow: none;
}
::-moz-selection {
	background: #3297FD;
	color: #fff;
	text-shadow: none;
}
/*■文字の設定*/
.fnt10	{font-size: 71% !important; letter-spacing: -0.5px;} /*10px*/
.fnt12	{font-size: 86% !important;} /*12px*/
.fnt13	{font-size: 93% !important;} /*13px*/
.fnt16	{font-size: 114% !important;} /*16px*/
.fnt18	{font-size: 128.5% !important;} /*18px*/
.fnt20	{font-size: 143% !important;} /*20px*/
.fnt24	{font-size: 171% !important;} /*24px*/

.Bld	{font-weight: bold !important;}
.Nml	{font-weight: normal !important;}
.clrBlk {color: #424c4f;}
.clrRed {color: #e80000;}
.clrPle {color: #996699;}
.aClr { color: #C91; text-decoration: underline;}

.LineH16{line-height: 1.6em}
/*■配置の設定*/

/*縦位置*/
.vlgnT	{vertical-align: top !important;}
.vlgnM	{vertical-align: middle !important;}
.vlgnB	{vertical-align: bottom !important;}

/*横位置*/
.algnR	{text-align: right !important;}
.algnL	{text-align: left !important;}
.algnC	{text-align: center !important;}

/*■マージン、パディング設定*/
/*上マージ*/
.mgT1	{margin-top: 1px !important; }.mgT3	{top-bottom: 3px !important;}
.mgT5	{margin-top: 5px !important; }.mgT10{margin-top: 10px !important;}
.mgT15	{margin-top: 15px !important;}.mgT20{margin-top: 20px !important;}
.mgT25	{margin-top: 25px !important;}.mgT30{margin-top: 30px !important;}
.mgT35	{margin-top: 35px !important;}.mgT40{margin-top: 40px !important;}
.mgT45	{margin-top: 45px !important;}.mgT50{margin-top: 50px !important;}
.mgT60	{margin-top: 60px !important;}.mgT70{margin-top: 70px !important;}
.mgT80	{margin-top: 80px !important;}.mgT90{margin-top: 90px !important;}
.mgT100 {margin-top: 100px !important;}
/*下マージ*/
.mgB1	{margin-bottom: 1px !important; }.mgB3	{margin-bottom: 3px !important;}
.mgB5	{margin-bottom: 5px !important; }.mgB10	{margin-bottom: 10px !important;}
.mgB15	{margin-bottom: 15px !important;}.mgB20	{margin-bottom: 20px !important;}
.mgB25	{margin-bottom: 25px !important;}.mgB30	{margin-bottom: 30px !important;}
.mgB35	{margin-bottom: 35px !important;}.mgB40	{margin-bottom: 40px !important;}
.mgB45	{margin-bottom: 45px !important;}.mgB50	{margin-bottom: 50px !important;}
.mgB60	{margin-bottom: 60px !important;}.mgB70	{margin-bottom: 70px !important;}
.mgB80	{margin-bottom: 80px !important;}.mgB90	{margin-bottom: 90px !important;}
.mgB100 {margin-bottom: 100px !important;}
/*右マージン*/
.mgR10	{margin-right: 10px !important;}.mgR15	{margin-right: 15px !important;}
.mgR20	{margin-right: 20px !important;}.mgR30	{margin-right: 30px !important;}
/*左右マージン*/
.mgRL5	{margin-right: 5px !important; margin-left: 5px !important;}.mgRL10	{margin-right: 10px !important; margin-left: 10px !important;}
.mgRL15	{margin-right: 15px !important; margin-left: 15px !important;}.mgRL20	{margin-right: 20px !important; margin-left: 20px !important;}

/*全てのマージン*/
.pg		{padding: 0 30px;}
.pg2	{padding: 0 40px;}

/*左右パディング*/
.pgRL5	{padding-left:5px !important; padding-right: 5px !important;}
.pgRL10	{padding-left:10px !important; padding-right: 10px !important;}
.pgRL15	{padding-left:15px !important; padding-right: 15px !important;}
.pgRL20	{padding-left:20px !important; padding-right: 20px !important;}
/*上下パディング*/

.pgT30	{padding: 30px 0 0 !important;}
.pg0	{padding:0 !important;}
.pgTB5	{padding: 5px 0 !important;}
.pgTB10	{padding: 10px 0 !important;}
.pgTB15	{padding: 15px 0 !important;}
.pgTB20	{padding: 20px 0 !important;}

/*■テキスト装飾設定*/

/*共通UL,OLの設定*/

ul.Dul {
	margin-left: 2em;
	list-style-type: disc;
}

ol.Dol {
	margin-left: 2em;
	list-style-type: decimal;
}
.arw{
	padding-left: 10px;	
	background: transparent url(../images/arw_1.png) left center no-repeat;
	text-decoration: underline;	
}

select.slcM{
	width: 45px;
	margin-right: 3px;
}
select.slcL{
	width: 195px;
}
table.Dtable{
	width: 100%;
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
}
table.Dtable th,
table.Dtable td{
	border-bottom: 1px solid #CCC;
	border-right: 1px solid #CCC;
	padding: 13px;
}
table.Dtable th{
	font-weight: bold;
	font-size: 108%;
	background: #EFEEF0;
	text-align: left;
	width: 161px;
	
}

.posiR{position: relative;}
.posiS{position: absolute;
}
/*■ハック関連*/

/*段落ち回避用ハック*/
.cfix:after{content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.cfix { display: inline-block;}
/*Hides from IE-mac\*/
*html .cfix{height:1%;}
.cfix{display: block}

/*段落ち回避用ハック*/
.cfixH:after{content: ".";display: block;clear: both;visibility: hidden;}
.cfixH { display: inline-block;}
/*Hides from IE-mac\*/
*html .cfixH{height:1%;}
.cfixH{display: block}

.hover:hover{
	-ms-filter: "alpha( opacity=50 )";
	filter: alpha( opacity=50 );
	opacity: 0.5;
}

.block{display: block !important;}

/* ----------------------------------------
 基本ページ構造 
 ---------------------------------------- */
/*ヘッダー*/
header{width: 100%; height: 107px; border-bottom: 2px solid #e90000;}
header h1{position: absolute; left: 0px; top:13px;}
header nav{position: absolute; right: 0px; top:33px;}

footer{width: 100%; border-top: 6px solid #1b3b8b;}
footer .footer-top{background: #fff9e7; padding: 22px 0;}
footer .footer-top ul{text-align: center;}
footer .footer-top ul li{display: inline-block; /display: inline; /zoom:1; width: 189px; height: 31px; margin: 0 10px;}
footer .footer-top ul li a{display: block; vertical-align: top;}
footer .footer-top ul li img{vertical-align: top;}
footer .footer-bottom{background: #000; height: 50px; color: #fff;}
footer .footer-bottom ul{position: absolute; top: 17px; left: 0px;}
footer .footer-bottom ul li{float: left; border-right: 1px solid #fff; padding-right: 10px;}
footer .footer-bottom ul li.last{border:none; padding-left: 10px;}
footer .footer-bottom a{ display: block; color: #fff; font-size: 12px; height: 15px; line-height: 15px; text-decoration: underline;}
footer .footer-bottom a:hover{text-decoration: none;}
footer .footer-bottom .copyright{position: absolute; top: 17px; right: 0px; font-size: 12px; line-height: 15px; height: 15px;}
@media screen and (max-width: 940px) {
	header,footer{width: 940px;}
}

#main{position: relative;}
#main #alpha-contents{
	position: relative;
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	-ms-filter: alpha(opacity=0);
	    filter: alpha(opacity=0);
	opacity: 0;
}
#page-top-btn{position: absolute; right: 0px; top: 40px; z-index: 200;}
/*アルファベット、ドット背景ボックス*/
#box-contents{
	width: 3000px;
	margin-left: -1030px;
	background: url("../img/box-contents-header.png") 0 top no-repeat;
	padding-top: 118px;
}
#box-contents #box-contents-bg{
	background: url("../img/box-contents-footer.png") 0 bottom no-repeat;
	padding-bottom: 123px;
}
#box-contents #box-contents-bg #box-contents-inner {
	position: relative;
	background: url("../img/box-contents-inner.png") repeat-y 0 0;
	z-index: 10;
}
#alphabet-left{
	position: absolute;
	background: url("../img/alphabet-left.png") repeat-y 0 0;
	width: 130px;
	height: 895px;
	top: 0px;
	left: 0px;
	z-index: 10;
}
#alphabet-right{
	position: absolute;
	background: url("../img/alphabet-right.png") repeat-y 0 0;
	width: 120px;
	height: 895px;
	top: 0px;
	right: 0px;
	z-index: 10;
}

.wrap{width: 940px; margin: 0 auto; z-index: 20; padding: 0; position: relative;}

/* ----------------------------------------
 トップ
 ---------------------------------------- */
#main #top-header-box{position: relative; width: 100%; height: 394px;margin: 0 auto; overflow: hidden; border-bottom: 1px solid #d4d4d4;}
#main #top-header-box h1{position: absolute; left: 50%; top: 0px; margin-left: -650px;}
#main #top-header-box .txt1{position: absolute; width: 532px; height: 111px; left: 50%; top: 156px; margin-left: -60px;}
#main #top-header-box .txt2{position: absolute; width: 477px; height: 65px; left: 50%; top: 284px; margin-left: -60px;}

.top-sct1{position: relative; margin-bottom: 48px !important;}
.top-sct1 h1{position: absolute; left: 0; top: -72px;}
.top-sct1 ul{padding-top: 30px;}
.top-sct1 ul li{float: left; position: relative;}
.top-sct1 ul li a{position: absolute; bottom: 21px; left:40px;}
.top-sct1 ul li .chara{position: absolute; top: -60px; right: -47px;width: 257px; height: 316px;}

.top-sct2 ul li{float: left; position: relative;}
.top-sct2 ul li a{position: absolute; top: 117px; left:40px; display: block;}
.top-sct2 ul li a img{vertical-align: bottom;}
.top-sct2 ul.height{height: 100px;}
.top-sct2 ul.height li a{position: absolute; top: 115px; left:40px; display: block;}



/* ----------------------------------------
 チェックシート
 ---------------------------------------- */
#main #check-haeder-top{background: #fff9e7; width: 100%; height: 83px; border-bottom: 1px solid #d4d4d4;}
#main #check-haeder-top ul{position: absolute; top: 20px; left: 166px; }
#main #check-haeder-top ul li{ background: #fff; position: relative; width: 294px; height: 64px; float: left; margin-right: 20px;}
#main #check-haeder-top ul li .coming{position: absolute; top: -5px; left: 188px;}

#main #check-haeder-btm{background: #fff; width: 100%; height: 58px; border-bottom: 1px solid #d4d4d4;}
#main #check-haeder-btm ul{position: absolute; top: 9px; left: 47px;}
#main #check-haeder-btm ul li{position: relative; float: left; margin-right: 19px;}
#main #check-haeder-btm ul li img{vertical-align: top;}
#main #check-haeder-btm2{background: #fff; width: 100%; height: 20px; border-bottom: 1px solid #d4d4d4;}
@media screen and (max-width: 940px) {
	#main #check-haeder-top,#main #check-haeder-btm,#main #check-haeder-btm2{width: 940px;}
}

/*アルファベット、ドット背景ボックス*/
.box-note{
	position: relative;
	width: 940px;
	background: url("../img/box-note-header.png") 0 top no-repeat;
	padding-top: 30px;
	margin: 0 auto;
}
.box-note .box-note-bg{
	background: url("../img/box-note-footer.png") 0 bottom no-repeat;
	padding-bottom: 30px;
}
.box-note .box-note-bg .box-note-inner {
	position: relative;
	background: url("../img/box-note-inner.png") repeat-y 0 0;
	padding: 0 0 31px;
}

.check-title{position: relative; z-index: 2;}
.check-title h1{position: absolute; width: 558px; height: 31px; left: 193px; top: -106px;}
.check-title p.left{position: absolute; width: 174px; height: 370px; left: -33px; top: -119px; background:url("../img/check-illustration1.png") no-repeat; white-space: nowrap; text-indent: -1000%; overflow:hidden;}
.check-title p.right{position: absolute; width: 162px; height: 375px; left: 806px; top: -117px; background:url("../img/check-illustration2.png") no-repeat; white-space: nowrap; text-indent: -1000%; overflow:hidden;}

.box-note-inner section.quest{display: none;}
.box-note-inner section.quest.open{display: block;}
.box-note-inner section.quest h1{text-align: center; margin-bottom: 27px;}
.box-note-inner section.quest h2{width: 670px; margin: 0 auto; font-size: 22px; font-weight: bold; color: #1b3b8b; margin-bottom: 29px; line-height: 1.6em;}
.box-note-inner section.quest h2 span.key{float: left; display:block; width: 20px;}
.box-note-inner section.quest h2 span.val{float: right; display:block; width: 643px;}

.box-quest{
	position: relative;
	width: 661px;
	background: url("../img/box-quest-header.png") 0 top no-repeat;
	padding-top: 34px;
	margin: 0 auto;
}
.box-quest .box-quest-bg{
	background: url("../img/box-quest-footer.png") 0 bottom no-repeat;
	padding-bottom: 20px;
}
.box-quest .box-quest-bg .box-quest-inner {
	position: relative;
	background: url("../img/box-quest-inner.png") repeat-y 0 0;
	padding: 14px 20px 0px;
}
.box-note-inner section.quest h3{position: absolute; width: 661px; height: 34px; top: -34px; left: 0px; font-size: 19px; font-weight: bold; line-height: 34px; text-align: center; color: #fff;}
.box-note-inner section.quest ul.answer{width: 610px; height: 61px; margin-left: 199px;}
.box-note-inner section.quest ul.answer li{position: relative; float: left; width: 241px; height: 61px; margin-right: 60px;}
.box-note-inner section.quest ul.answer li img{width: 241px; height: 61px;}
.box-note-inner section.quest .balloon{position: relative;}
.box-note-inner section.quest .balloon ul{position: absolute; width: 622px; left: 160px; top: 18px;}
.box-note-inner section.quest .balloon ul li span.key{float: left; display:block; width: 20px;}
.box-note-inner section.quest .balloon ul li span.val{float: right; display:block; width: 602px;}

.box-note-inner section.success{display: none;}
.box-note-inner section.success .top-img{position: relative; width: 940px; height: 390px;}
.box-note-inner section.success h1{position: absolute; background: url("../img/check-success-h1.png") no-repeat; width: 940px; height: 422px; left: 0px; top: -50px;text-indent: 100%; overflow: hidden; white-space: nowrap;}


.box-note-inner section.failure{display: none;}
.box-note-inner section.failure .top-img{position: relative; width: 940px; height: 266px;}
.box-note-inner section.failure h1{position: absolute; background: url("../img/check-failure-h1.png") no-repeat; width: 940px; height: 302px; left: 0px; top: -36px;text-indent: 100%; overflow: hidden; white-space: nowrap;}
.box-note-inner section.failure ul.ng{margin-left: 91px; margin-bottom: 60px;}
.box-note-inner section.failure ul.ng li{margin-bottom: 40px; display: none;}
.box-note-inner section.failure ul.ng li>img{margin-bottom: 10px;}
.box-note-inner section.failure ul.ng li h2{width: 755px; margin: 0 0 5px 5px; font-size: 16px; font-weight: bold; line-height: 1.5em;}
.box-note-inner section.failure ul.ng li h2 span.key{float: left; display:block; width: 20px;}
.box-note-inner section.failure ul.ng li h2 span.val{float: right; display:block; width: 735px;}
.box-ng{
	position: relative;
	width: 751px;
	background: url("../img/box-ng-header.png") 0 top no-repeat;
	padding-top: 38px;
}
.box-ng .box-ng-bg{
	background: url("../img/box-ng-footer.png") 0 bottom no-repeat;
	padding-bottom: 15px;
}
.box-ng .box-ng-bg .box-ng-inner {
	position: relative;
	background: url("../img/box-ng-inner.png") repeat-y 0 0;
}
.box-ng-inner .left{display: block; float: left; width: 106px; text-align: center; font-size: 15px; font-weight: bold; color: #fff;}
.box-ng-inner .right{display: block; float: right; width: 615px; padding: 0 15px; font-weight: bold; color: #1b3b8b;}

.box-note-inner .check-contents{position: relative; width: 571px; height: 226px; background: url("../img/check-finish-top.png") no-repeat; margin: 0 auto; padding-top: 94px;}
.box-note-inner .check-contents h2,.box-note-inner .check-contents h3{width: 0px; height: 0px; display: block; overflow: hidden; text-indent: 100%;}
.box-note-inner .check-contents .btn1{position: absolute; left: 60px; top: 96px; width: 168px; height: 34px;}
.box-note-inner .check-contents .btn2{position: absolute; left: 60px; top: 134px; width: 168px; height: 36px;}
.box-note-inner .check-contents .btn3{position: absolute; left: 60px; top: 174px; width: 193px; height: 36px;}
.box-note-inner .check-contents .btn4{position: absolute; left: 330px; top: 96px; width: 168px; height: 34px;}
.box-note-inner .check-contents .btn5{position: absolute; left: 330px; top: 134px; width: 192px; height: 36px;}
.box-note-inner .check-contents .bg{position: absolute; background: url("../img/check-finish-bg2.png") no-repeat; width: 171px; height: 186px; top: -31px; left: -138px;}
.box-note-inner .check-contents .check-contents-bg{
	background: url("../img/check-finish-bottom.png") 0 bottom no-repeat;
	padding-bottom: 11px;
}
.box-note-inner .check-contents .check-contents-bg .check-contents-inner{
	border-left: 2px solid #ff9711;
	border-right: 2px solid #ff9711;
	background: #fff;
}
.box-note-inner .check-contents ul{width: 272px; padding-left: 10px;}
.box-note-inner .check-contents ul li{height: 40px; background: url("../img/check-icon.png") left center no-repeat; padding-left: 38px;}
.box-note-inner .check-contents ul li a{line-height: 40px; font-size: 14px; font-weight: bold; color: #32302F; letter-spacing: -0.5px; background: url("../img/check-arrow.png") right center no-repeat; padding-right: 12px;}

/* ----------------------------------------
 七つの特長
 ---------------------------------------- */
.grades-inner{height: 1300px;}
.grades-box{position: absolute; width:100%; height: 1499px; top: 146px;z-index: 20; overflow: hidden;}
.grades-box .bg{position: relative; width: 940px; height: 1499px;white-space: nowrap;overflow: hidden;}
.grades-box .btn1,
.grades-box .btn2,
.grades-box .btn3,
.grades-box .btn4,
.grades-box .btn5,
.grades-box .btn6,
.grades-box .btn7{position: absolute; left: 122px; top: 362px; width: 103px; height: 25px; vertical-align: top;}
.grades-box .btn2{left: 239px;}
.grades-box .btn3{left: 358px;}
.grades-box .btn4{left: 475px;}
.grades-box .btn5{left: 594px;}
.grades-box .btn6{left: 711px;}
.grades-box .btn7{left: 829px;}
.grades-box .btn{position: absolute; left: 176px; top: 732px; width: 226px; height: 46px;}

/* ----------------------------------------
 AI検定の受験を準備している方へ
 ---------------------------------------- */
.f-left{float: left;}
.f-right{float: right;}

#main aside{float: left; width: 170px; margin-top: -80px;}
.box-border-btm{border-bottom: 1px dashed #bfbfbf; padding-bottom: 40px;}

/*吹き出し*/
.balloon1{
	position: relative;
	width: 490px;
	background: url("../img/content/balloon1-header.png") 0 top no-repeat;
	padding-top: 18px;
	margin-left: 128px;
}
.balloon1 .balloon1-bg{
	background: url("../img/content/balloon1-footer.png") 0 bottom no-repeat;
	padding-bottom: 21px;
}
.balloon1 .balloon1-bg .balloon1-inner {
	position: relative;
	background: url("../img/content/balloon1-inner.png") repeat-y 0 0;
	padding: 0 10px 0 25px;
	line-height: 1.5em;
	font-weight: bold;
}
.balloon1 .balloon1-bg .balloon1-inner .chara{
	position: absolute;
	width: 101px;
	height: 112px;
	top: -18px;
	left: -133px;
	background: url("../img/content/balloon1-chara.png") no-repeat;
}
.balloon1 .balloon1-bg .balloon1-inner .arrow{
	position: absolute;
	width: 21px;
	height: 16px;
	bottom: 2px;
	left: -19px;
	background: url("../img/content/balloon1-arrow.png") no-repeat;
}

.balloon2{
	position: relative;
	width: 620px;
	background: url("../img/content/balloon2-header.png") 0 top no-repeat;
	padding-top: 19px;
	margin-left: 128px;
}
.balloon2 .balloon2-bg{
	background: url("../img/content/balloon2-footer.png") 0 bottom no-repeat;
	padding-bottom: 19px;
}
.balloon2 .balloon2-bg .balloon2-inner {
	position: relative;
	background: url("../img/content/balloon2-inner.png") repeat-y 0 0;
	padding: 0 5px 0 25px;
	line-height: 1.5em;
	letter-spacing: -0.5px;
	font-weight: bold;
}
.balloon2 .balloon2-bg .balloon2-inner .chara{
	position: absolute;
	width: 101px;
	height: 112px;
	top: -18px;
	left: -133px;
	background: url("../img/content/balloon1-chara.png") no-repeat;
}
.balloon2 .balloon2-bg .balloon2-inner .arrow{
	position: absolute;
	width: 21px;
	height: 16px;
	bottom: 2px;
	left: -19px;
	background: url("../img/content/balloon1-arrow.png") no-repeat;
}

.balloon3{
	position: relative;
	width: 565px;
	background: url("../img/content/balloon3-header.png") 0 top no-repeat;
	padding-top: 19px;
	margin-left: 128px;
}
.balloon3 .balloon3-bg{
	background: url("../img/content/balloon3-footer.png") 0 bottom no-repeat;
	padding-bottom: 19px;
}
.balloon3 .balloon3-bg .balloon3-inner {
	position: relative;
	background: url("../img/content/balloon3-inner.png") repeat-y 0 0;
	padding: 0 5px 0 25px;
	line-height: 1.5em;
	font-weight: bold;
}
.balloon3 .balloon3-bg .balloon3-inner .chara{
	position: absolute;
	width: 101px;
	height: 112px;
	top: -18px;
	left: -133px;
	background: url("../img/content/balloon1-chara.png") no-repeat;
}
.balloon3 .balloon3-bg .balloon3-inner .arrow{
	position: absolute;
	width: 21px;
	height: 16px;
	bottom: 2px;
	left: -19px;
	background: url("../img/content/balloon1-arrow.png") no-repeat;
}

.balloon4,.balloon5{
	position: relative;
	width: 257px;
	background: url("../img/content/balloon4-header.png") 0 top no-repeat;
	padding-top: 20px;
}
.balloon4 .balloon4-bg,.balloon5 .balloon5-bg{
	background: url("../img/content/balloon4-footer.png") 0 bottom no-repeat;
	padding-bottom: 20px;
}
.balloon4 .balloon4-bg .balloon4-inner,.balloon5 .balloon5-bg .balloon5-inner{
	position: relative;
	background: url("../img/content/balloon4-inner.png") repeat-y 0 0;
	padding: 0 5px 0 18px;
	line-height: 1.5em;
	font-size: 14px;
	font-weight: bold;
}
.balloon4 .balloon4-bg .balloon4-inner .arrow{
	position: absolute;
	width: 18px;
	height: 14px;
	bottom: -2px;
	right: -16px;
	background: url("../img/content/balloon4-arrow.png") no-repeat;
}
.balloon5 .balloon5-bg .balloon5-inner .arrow{
	position: absolute;
	width: 18px;
	height: 14px;
	top: 65px;
	left: -16px;
	background: url("../img/content/balloon4-arrow2.png") no-repeat;
}


/*ボックス*/
.box1{
	position: relative;
	width: 750px;
	background: url("../img/content/box1-header.png") 0 top no-repeat;
	padding-top: 10px;
}
.box1 .box1-bg{
	background: url("../img/content/box1-footer.png") 0 bottom no-repeat;
	padding-bottom: 10px;
}
.box1 .box1-bg .box1-inner {
	position: relative;
	background: url("../img/content/box1-inner.png") repeat-y 0 0;
	padding: 0 0px 0 18px;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.6em;
}
.box1 .box1-bg .box1-inner .chara{
	position: absolute;
	width: 131px;
	height: 134px;
	bottom: -9px;
	right: -19px;
	background: url("../img/content/box1-chara.png") no-repeat;
}

.box2{
	position: relative;
	width: 579px;
	background: url("../img/content/box2-header.png") 0 top no-repeat;
	padding-top: 1px;
	margin: 0 auto;
}
.box2 .box2-inner{
	background: url("../img/content/box2-footer.png") 0 bottom no-repeat;
	border-left: 1px solid #c2c2c2;
	border-right: 1px solid #c2c2c2;
	padding: 7px 0 10px 20px;
	
}
.box2 h4{background: url("../img/content/box2-question.png") 0 center no-repeat; font-size: 18px; line-height: 31px; padding-left: 35px;}
.box2 p{font-size: 12px; line-height: 1.6em; font-weight: bold; margin-top: 3px;width: 360px;}
.box2 p.txt2{width: 330px;}
.box2 a.btn1{diplay: block; position: absolute; bottom: 25px; right: 20px;}
.box2 a.btn2{diplay: block; position: absolute; bottom: 20px; right: 15px;}

.box3{
	position: relative;
	width: 750px;
	background: url("../img/content/box3-header.png") 0 top no-repeat;
	padding-top: 31px;
}
.box3 .box3-bg{
	background: url("../img/content/box3-footer.png") 0 bottom no-repeat;
	padding-bottom: 12px;
}
.box3 .box3-bg .box3-inner {
	position: relative;
	border-left: 2px solid #cacaca;
	border-right: 2px solid #cacaca;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.8em;
}
.box3 .box3-bg .box3-inner .chara{
	position: absolute;
	width: 131px;
	height: 134px;
	bottom: -9px;
	right: -19px;
	background: url("../img/content/box1-chara.png") no-repeat;
}
.box3 .box3-bg .box3-inner h4{line-height: 31px; position: absolute; width: 750px; height: 31px; top:-31px; left: 0px; text-align: center; font-size: 17px;}
.box3 .box3-bg .box3-inner .frame{width: 308px; padding: 25px 25px 15px 40px; float: left;}
.box3 .box3-bg .box3-inner .frame .info{float: left; width: 175px;}
.box3 .box3-bg .box3-inner .frame .info .strong{font-size: 18px;}
.box3 .box3-bg .box3-inner .frame .img{float: right; 132px; margin-top: -15px;}
/*リスト*/
ul.list1 li{background: url("../img/list-icon1.png") 0 6px no-repeat; padding-left: 13px; line-height: 1.8em; font-size: 12px;}

/*リンク*/
ul.link1{width: 750px;}
ul.link1>li{float: left; width: 360px; padding-left: 15px;}
ul.link1>li .img{float: left; width: 46px; margin-top: 5px;}
ul.link1>li ul{float: right; width: 300px; font-size: 12px;line-height: 1.6em;}
ul.link1>li ul li a{text-decoration: underline;}
ul.link1>li ul li a:hover{text-decoration: none;}

ul.link2{width: 750px;}
ul.link2>li{float: left; width: 225px; padding-left: 25px; margin-bottom: 10px;}
ul.link2>li>.img{float: left; width: 46px; height: 21px;}
ul.link2>li>.img img{vertical-align: top;}
ul.link2>li>a{float: right; width: 167px; font-size: 12px;line-height: 21px; display: block; vertical-align: top;}

ul.link3>li{margin-bottom: 5px;}
ul.link3>li>.img{float: left; width: 46px; height: 21px; margin-top: 2px;}
ul.link3>li>.img img{vertical-align: middle;}
ul.link3>li>a{float: right; width: 102px; font-size: 12px; display: block; vertical-align: middle; line-height: 1.4em;}

.icon-check1{background: url("../img/content/icon-check1.png") left center no-repeat; height: 24px; line-height: 24px; padding: 5px 0 5px 32px;}
.icon-check1 a{background: url("../img/content/arrow1.png") right center no-repeat; line-height: 24px; padding-right: 14px;}

a.download{background: url("../img/download-icon.png") right center no-repeat; padding-right: 20px; line-height: 19px; display: inline-block;}

/*共通*/
section.r-side{position: relative; margin-left: 190px; width: 750px;}
section.r-side h1{position: absolute; top: -70px; left: 0px;}

ul.tab{border-bottom: 7px solid #e90000; text-align: center; background: #fff;}
ul.tab li{display: inline-block; /display: inline; /zoom: 1; vertical-align: bottom;}

/*合格に向けて*/
.step5{width: 750px; position: relative;}
.step5 .balloon4{float: left;}
.step5 .balloon5{float: right;}
.step5>img{position: absolute; top: 0px; left: 220px;}

/*お役立ち練習用(マークシート)*/
.mark-box{width: 750px; padding: 28px 0 40px;}
/*.mark-box>.txt{width: 590px; display: inline-block;/display: inline; /zoom:1;vertical-align: top;}
.mark-box>img{width: 152px;height: 108px;display: inline-block;/display: inline;/zoom:1;vertical-align: top;}*/

.mark-box2{width: 750px;}
.mark-box2 .f-left{width: 557px ;float: left;}
.mark-box2 .f-right{width: 171px;float: right}

.mark-box2 .f-left>ul>li,.mark-box2 .f-right>ul>li{ float: left; width: 171px; margin-right: 22px;}
.mark-box2 .f-left>ul>li.last,.mark-box2 .f-right>ul>li.last{ margin-right: 0px;}

.mark-img{}

/*試験を受ける上での注意*/
table.caution{width: 750px;}
table.caution tr.brd{border-bottom: 1px dashed #bfbfbf;}
table.caution th{width: 304px; vertical-align: middle;}
table.caution td{width: 446px; vertical-align: middle;}
table.caution td h3{background: url("../img/caution/check-icon.png") left center no-repeat; padding-left: 40px; color: #e80000; font-size: 14px;line-height: 1.4em; letter-spacing: -0.8px;}
table.caution td h3.line1{height: 32px; line-height: 32px;}
table.caution td ul.list1{font-size: 12px; letter-spacing: -0.5px;}
table.caution td p{font-size: 12px;}

.caution-keyimg{position: relative;}
.caution-keyimg .img{position: absolute; top: -39px; right: -23px;}

/*会場に向かう前に確認！*/
ul.schedule-list{width: 750px;}
ul.schedule-list li.left{width: 375px; text-align: left; display: inline-block; /display: inline; /zoom: 1;}
ul.schedule-list li.right{width: 375px; text-align: right; display: inline-block;/display: inline; /zoom: 1;}
.schedule-bg{
	width: 750px;
	background: url("../img/schedule/border.png") repeat-y;
}
.schedule-bg2{
	width: 750px;
	background: url("../img/schedule/border2.png") repeat-y;
}
.schedule-box{
	position: relative;
	width: 428px;
	margin-left: 322px;
	padding: 20px 0px 20px 0px;
	border-bottom: 2px solid #bfbfbf;
}
.schedule-box.last{border:none; padding-top: 60px;}
.schedule-box.last2{border:none;}
.schedule-box .schedule-box-inner{position: relative; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px dashed #bfbfbf;}
.schedule-box h3{font-size: 16px; font-weight: bold; color: #e80000; letter-spacing: -0.5px;}
.schedule-box a.download{line-height: 34px; font-size: 12px; margin-left: 10px;}
.schedule-box .img-top{position: absolute; top: 0px; left: -322px;}
.schedule-box .schedule-box-inner .img-top{position: absolute; top: -20px; left: -322px;}
.schedule-box .img-btm{position: absolute; bottom: 0px; left: -322px;}

.iframe-pdf{background: url("../img/iframe-pdf-bg.png") left top repeat-x; width: 100%; margin: 0 auto; text-align: center; padding-bottom: 30px; border-bottom: 7px solid #e90000;}


/*fancy box close*/
#fancybox-close {
	position: absolute !important;
	top: -47px !important;
	right: -47px !important;
	width: 47px !important;
	height: 47px !important;
	background: transparent url('../img/close.png') -47px 0px !important;
	cursor: pointer !important;
	z-index: 1103 !important;
}

/* =============================================================================
   Non-Semantic Helper Classes
   ========================================================================== */

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* =============================================================================
   Print Styles
   ========================================================================== */

@media print {
  * { /*background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important;*/ } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  /*a[href]:after { content: " (" attr(href) ")"; }*/
  /*abbr[title]:after { content: " (" attr(title) ")"; }*/
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
	body {
		-webkit-print-color-adjust: exact;
	}
#main .grades-box{width: 100% !important;}
#main #alpha-contents{width: 100% !important;}
#box-contents{width: 100% !important;margin-left:0 !important;}
#topcontrol{display: none !important;}

/*.grades-box .bg{position: absolute; width: 940px; height: 1499px; left:0px; top: 0px; white-space: nowrap;overflow: hidden;}*/
}

.wrap_grade h1{
	text-align: center;
}
.wrap_grade .table_wrap {
	width: 960px;
	height: 700px;
	overflow: scroll;
}


.wrap_grade .table_wrap .bgimage{
	width: 1448px;
	height: 1165px;
	background: url(../img/grades-td2.png) no-repeat 0 0;
}
.table_wrap .scroll-hint-text {
    line-height: 1.4;
}
.table_wrap .scroll-hint-icon {
    top: calc(20%)!important;
}
.bgimage{
	position: relative;
}
.bgimage ul {
    display: flex;
    width: 1426px;
    position: relative;
    top: 182px;
    left: 11px;
    justify-content: space-between;
}
.bgimage li a{
	background-color: #FF7800;
	border: 1px solid #D6661D;
	color: #fff;
	text-decoration: none;
	padding: 3px 20px;
	display: inline-block;
	border-radius: 4px;
}
.bgimage li a:hover{
	background-color: #F64B01;
}
.bgimage li a img{
	margin: 0 6px 0 0;
	position: relative;
	top: -6px;
}
.bgimage .btn {
    background-color: #FF7800;
    border: 1px solid #D6661D;
    color: #fff;
    text-decoration: none;
    padding: 5px 20px 5px 46px;
    display: inline-block;
    border-radius: 8px;
    position: absolute;
    width: 170px;
    height: 37px;
    line-height: 1.3;
    top: 510px;
    left: 13px;
}
.bgimage .btn:hover{
	background-color: #F64B01;
}
.bgimage .btn img{
	position: absolute;
	left: 25px;
    top: 18px;
}

  .table_wrap  .fixed01,
  .table_wrap  .fixed02{
	position: sticky;
	top: 0;
	left: 0;
  }
  

	.table_wrap .fixed01{
	z-index: 2;
  }
  .table_wrap .fixed01:before,
  .table_wrap .fixed02.bgw:before{
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid #fff;
	background: #fff;
	z-index: -1;
  }
  .table_wrap .fixed02{
	z-index: 1;
  }
  .grades-box {
	height: auto;
  }
  .grades-inner {
    height: 730px;
}