@charset "utf-8";
/* CSS Document */

*, *:before, *:after {
  margin: 0; padding: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
/*body{line-height:1;}*/
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}

body { margin: 0; padding: 0 0 30px 0; background: #FFFFFF; color: #222; font-size : 14px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
a:link { color: #5B5B5B; }
a:visited { color: #5B5B5B; }
a:hover { color: #5B5B5B; }
a:active { color: #5B5B5B; }

select, input { outline: none; } /*フォーカス時の枠線を消す*/

/*----------------------------------------------------------------------*/
/* 共通フッター */
#footer50, #footer60, #footer70, #footer80, #footer90, #footer00 { width: 100%; margin: 0 auto; background: #CC4043; }
#footer60 { background: #017BBE; }
#footer70 { background: #038760; }
#footer80 { background: #BB6905; }
#footer90 { background: #F8B500; }
#footer00 { background: #FFA033; }
#copyright { padding: 15px 0; color: #ebe7d2; text-align: center; font-size: 14px; }

/*----------------------------------------------------------------------*/
/* 共通ヘッダー・コンテンツ */
#header50, #header60, #header70, #header80, #header90 { position: fixed; z-index:100; top: 0; height: 100px; width: 100%; margin: 0 auto; padding: 5px 0; background: #FDFDFD; border-top: 5px solid #CC4043; }
#header60 { border-top: 5px solid #017BBE; }
#header70 { border-top: 5px solid #038760; }
#header80 { border-top: 5px solid #BB6905; }
#header90 { border-top: 5px solid #F8B500; }
#header00 { border-top: 5px solid #FFA033; top: 0; height: 100px; width: 100%; margin: 0 auto; padding: 5px 0; background: #FDFDFD; }
#contents { width: 100%; margin: 100px auto 0; padding: 0; background: #FFF7EE;}
#contents_edit { width: 100%; margin: 0 auto; padding: 0; background: #FFF7EE; }
#contents_pre { width: 100%; margin: 0 auto; padding: 42px 0 45px 0; background: #FFF7EE; }
.inner { display: flex; flex-direction: row; justify-content: space-between; width: 1280px; margin: 0 auto; /*border: 1px solid #F00;*/ }
#main { width: 984px; margin: 40px 0; padding: 0; }
.temp #main { width: 969px; }
.mondaihyo_area { background: #FFFCFA; }
.guide {
	display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.guide a#helplink { display: block; width: 70px; text-align: center; }
.guidebox { display: block; text-align: center; font-weight: bold; text-decoration: none; margin-left: 23px; display: flex; flex-direction: column; align-items: center; }
.guidebox p { display: inline-block; font-size: 16px; line-height: 16px; padding: 0 0 1px 0; margin: 0; border-bottom: 2px solid #FFA033; white-space: nowrap; }
#header50 .guidebox p { color: #CC4043; border-color: #CC4043; }
#header60 .guidebox p { color: #017BBE; border-color: #017BBE; }
#header70 .guidebox p { color: #038760; border-color: #038760; }
#header80 .guidebox p { color: #BB6905; border-color: #BB6905; }
#header90 .guidebox p { color: #F8B500; border-color: #F8B500; }
.guidebox img { margin: 8px 0 6px 0; }

.typepreview { margin: 0 auto; }

#navigation{ width: 270px; margin: 40px 0; padding: 0; }

#pagetoplink,#pagetoplinkfloat { display: block; width: 130px; text-align: center; margin: 10px 0; float: right; }/*ページの先頭に戻る*/
#pagetoplink { position: static; visibility: visible; }
.showflatlink #pagetoplink { visibility: hidden; }
#pagetoplinkfloat { position: fixed; right: 0; bottom: 0; padding: 10px; width: 150px; background-color: #FFFFFF; border-radius: 5px 0 0 5px; z-index: 998; visibility: hidden; }
.showflatlink #pagetoplinkfloat { visibility: visible; }

/***************算数編集ツール**************/
.math_contents { background: #FFFCFA; padding: 20px; }
/* クリアフィックス */
.math_contents ul:after {
	content: "";
	clear: both;
	display: block;
}
/* 一覧のリストの設定 */
.math_contents ul li {
	list-style-type: none;
	display: block;
	float: left;
	margin-bottom: 2.87%;
	height: 70px;/* 見た目の調整 */
	line-height: 70px;/* 見た目の調整 */
	background: #FFF;/* 見た目の調整 */
	border: 3px solid #F63;
	border-radius: 10px;
	text-align: center;/* 見た目の調整 */
}
.math_contents ul li > a, a:visited { 
	color: #F63; 
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
}
.math_contents ul li:hover { background-color: #FF6; }
/* 横並びに3等分 */
.math_contents ul.al-3 li {
	width: 31.42%;
	margin-right: 2.87%;
}
.math_contents ul.al-3 li:nth-child(3n) {
	margin-right: 0;
}
/* 横並びに4等分 */
/*.math_contents ul.al-4 li {
	width: 22.84%;
	margin-right: 2.88%;
}
.math_contents ul.al-4 li:nth-child(4n) {
	margin-right: 0;
}*/
#math_nen {
	background-color: #F93;
	color: #fff;
	font-size: 20px;
	margin-bottom: 10px;
	padding: 3px 0 3px 20px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}
/***************算数編集ツール**************/


/*----------------------------------------------------------------------*/
/* トップページ 教科書・学年選択エリア */ 
.setbox {
	display: flex; flex-direction: row; justify-content: space-around;
	padding: 18px;
	margin-bottom: 50px;
	background: #FFA033;
	border-radius: 7px;
}
.setbox form {
	display: inline-block;
	padding: 0;
	margin: 5px;
}
.setbox select {
	position: relative;
	width: 250px;
	font-size: 16px;
	padding: 12px 15px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
	border-radius: 7px;
	background: #FFF;
}
.setbox label {
	position: relative;
}
/* 教科書・学年プルダウンテキスト画像 */
.pulltext {
	vertical-align: middle;
	margin-right: 5px;
}
.setbox label:after {
	display: block;
	content: url(../img/arrow.jpg);
	position: absolute;
	top: 55%;
	width: 20px;
	height: 20px;
	margin-top: -13px;
	background-size: 20px;
	pointer-events: none;
}
.setbox #book label:after {
	left: 360px;
	z-index: 3;
}
.setbox #nen label:after {
	left: 335px;
	z-index: 3;
}
select::-ms-expand {
	display: none;
}
/* トップページ お知らせ */
#news { width: 100%; padding: 0; }
#news img {
	witdh: 38px;
	height: 30px;
	vertical-align: middle;
	padding: 0 3px 3px 0;
}
#newstable {
	list-style:none;
	width: 100%;
	padding: 5px 30px;	
	background: #FFE7CC;
	border-radius: 7px;
	font-size: 12px;
	color: #000;
}
#newstable li { border-bottom: 1px dashed #BFAD99; }
#newstable span { display: inline-block; padding: 12px 30px; }
span.newsdate { width: 10%; }
span.newstext { width: 90%; }

/*----------------------------------------------------------------------*/
/*--- テンプレート[プリントデータ]出力（印刷）ボタン ---*/
.output_menu {
	display: block;
	margin: 10px 0 20px 10px;
	padding: 0;
	height: 62px;
}
/* 印刷ボタン格納域 */
.output_menu input.printBtnParent {
    display: none;
}
.output_menu label.printButton {
	position:relative;
    z-index: 3;
}
/* 印刷ボタン本体 */
.output_menu a.printButton {
    cursor: pointer;
	display:inline-block;
	position:relative;
    visibility: hidden;
    transition-property:left, visibility;
    transition-duration:250ms;
    transition-timing-function:linear;
    transition-delay:0;
}
.output_menu a.printPDF {
    width:62px;
    left:-100px;
    z-index: 2;
}
.output_menu a.printWord {
    width:62px;
    left:-150px;
    z-index: 1;
}
.output_menu a.printIchi {
    width:62px;
    left:-200px;
    z-index: 0;
}
/* 印刷ボタン格納域選択時の印刷ボタン表示 */
.output_menu input.printBtnParent:checked ~ a.printButton {
	left: 0;
    visibility: visible;
}

/*--- 評価観点説明表示(2020.01.27) ---*/
#kanten_ex { float: right; }


/* 国語フリー　選択項目表示 */
#columnbox {
	display: flex;
    flex-direction: column;
}
#columnbox p { padding: 5px 0; }
#columnbox p:last-child { margin-bottom: 10px; }
#columnbox p input[type="text"] { width: 400px; height: 30px; }
#columnbox p { font-size: 16px; font-weight: bold; }
/* 国語フリー　ラジオボタン */
#radiobox {
	position: relative;
	width: 540px;
}
p#radiobox span { margin-right: 15px; }
#radiobox label {
	padding: 0 0 0 20px;	/* ラベルの位置 */
	font-size: 12px;
	line-height: 12px;		/* ボタンのサイズに合わせる */
	display: inline-block;
	width: 90px;
	cursor:	pointer;
	position: relative;
}
#radiobox label.nameradio { width: 60px; }
#radiobox label:before {	/* ラベルテキストの前に丸を描く */
	content: '';
	width: 12px;		/* ボタンの横幅 */
	height: 12px;		/* ボタンの縦幅 */
	position: absolute;
	top: 0;
	left: 0;
	background-color:#fff;
	border: 1px solid #CCC;
	border-radius: 50%;
}
#radiobox input[type="radio"] { display: none; }
#radiobox input[type="radio"]:checked + label:after {
	content: '';
	width: 6px;		/* マークの横幅 */
	height: 6px;		/* マークの縦幅 */
	position: absolute;
	top: 3px;
	left: 3px;
	background-color: #FFA034;
	border-radius: 50%;
}
#putprintbox { width: 270px; display: flex; flex-direction: row; justify-content: space-between; }


/* 国語用　東書準拠チェックボックス */
/* 英語用　東書準拠タブボタン */
#sub_box {
	display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
p#conformity { padding: 20px 10px; background: #FFE7CD; }
/*--- チェックボックスデザイン ---*/
input[type=checkbox] {
  display: none;
}
.check_css, .tjcheck_css {	/* tjcheck_css = 漢字書き取り */
  -webkit-transition: background-color 0.2s linear;
  transition: background-color 0.2s linear;
  position: relative;
  display: inline-block;
  padding: 0 0 0 36px;
  vertical-align: middle;
  cursor: pointer;
  color: #5B5B5B;
  z-index: 1;
}
.tjcheck_css { padding: 0 0 0 38px; }
.check_css:hover:after, .tjcheck_css:hover:after {
  border-color: #5B5B5B;
}
.check_css:after, .tjcheck_css:after {
  -webkit-transition: border-color 0.2s linear;
  transition: border-color 0.2s linear;
  position: absolute;
  top: 50%;
  left: 8px;
  display: block;
  margin-top: -10px;
  width: 20px;
  height: 20px;
  background: #FFF;
  border: 1px solid #ccc;
  content: '';
  z-index: 2;
}
.tjcheck_css:after { left: 0; margin-top: -10px; }
.check_css:before, .tjcheck_css:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;
  left: 14px;
  display: block;
  margin-top: -10px;
  width: 9px;
  height: 15px;
  border-right: 1.5px solid #5B5B5B;
  border-bottom: 1.5px solid #5B5B5B;
  content: '';
  opacity: 0;
  z-index: 3;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.tjcheck_css:before { left: 4px; margin-top: -10px; }
input[type=checkbox]:checked + .check_css:before,
input[type=checkbox]:checked + .tjcheck_css:before {
  opacity: 1;
}


/*----------------------------------------------------------------------*/
/* -- タブ切り替え表示 -- */
/* タブボタン */
#tabbtn, #tabbtn2 {
	width: 350px;
	height: 50px;
	display: flex;
    flex-direction: row;
}
/*タブのスタイル*/
label.tab_item_btn, label.tab_item_btn1, label.tab_item_btn2 {
	display: block;
	width: calc(100%/2);
	height: 48px;
	background-color: #FFA034;
	border: 1px solid #FFA034;
	line-height: 50px;
	font-size: 16px;
	text-align: center;
	color: #fff;
}
/* 小英用（標準版/NEW HORIZON Elementary準拠）ボタン幅改編[2020.01.27] */
label.tab_item_btn1 { height: 50px; line-height: 52px; }
label.tab_item_btn2 { height: 50px; line-height: 20px; padding-top: 5px; }
/*タブ切り替え全体のスタイル*/
.tabs {
  /*padding-bottom: 40px;*/
  background-color: #d9d9d9;
  margin: 0 auto;
}
/*label.tab_item_btn:hover {
  opacity: 0.75;
}*/
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
  /*padding: 40px 40px 0;*/
  clear: both;
  overflow: hidden;
  display:none;
}
/*選択されているタブのコンテンツのみを表示*/
.tab_content_current {
  display: block;
}
/*#tab_type_0:checked ~ #tab_content_0,
#tab_type_1:checked ~ #tab_content_1,
#tab_type_2:checked ~ #tab_content_2,
#tab_type_3:checked ~ #tab_content_3,
#tab_type_4:checked ~ #tab_content_4,
#tab_type_5:checked ~ #tab_content_5,
#tab_type_6:checked ~ #tab_content_6,
#tab_type_7:checked ~ #tab_content_7,
#tab_type_8:checked ~ #tab_content_8,
#tab_type_9:checked ~ #tab_content_9,
#tab_type_10:checked ~ #tab_content_10,
#tab_type_11:checked ~ #tab_content_11,
#tab_type_12:checked ~ #tab_content_12 {
  display: block;
}*/
/*選択されているタブのスタイルを変える*/
input[name="tab_item"]:checked + label.tab_item_btn, input[name="tab_item"]:checked + label.tab_item_btn1, input[name="tab_item"]:checked + label.tab_item_btn2 {
  background-color: #fff;
  color: #FFA034;
}
#tabhyojun { border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
#tabtosho { border-top-right-radius: 5px; border-bottom-right-radius: 5px; }


/*----------------------------------------------------------------------*/
/* ローディング表示 */
.loading_cover{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    background-color: rgba(255,255,255,0.5);
	z-index: 999;
	text-align:center;
	vertical-align:middle;
	overflow-x: hidden;
	overflow-y: hidden;
}
.loading_cover * {
    pointer-events: none;
}
.loading_cover > * {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}


/*----------------------------------------------------------------------*/
/* FAQ・PDF印刷プレビュー */
#faqbox, #prevewbox {
	display: flex;
    flex-direction: column;
	color: #5C5C5C;
	font-size: 20px;
}
#prevewbox { padding: 30px 0 5px; }
#header00 > .inner #titlerogo { margin-top: 8px; }
.inner_pre { 
	width: 1280px; margin: 0 auto;
	display: flex;
    flex-direction: row;
    justify-content: space-between;
	 }
#prevew_print { width: 130px; margin: 0 auto; }
#prevew_print2 { width: 130px; margin: 0 445px 0 575px; }

ol#faq_link {
  counter-reset:number;
  list-style-type: none;
  width: 100%;
  padding-top: 30px;
  background: #FFE7CC;
  border-radius: 20px;
}
ol#faq_link li a {
	display: block;
	width: 1000px;
	background: #FFFCFB;
	border: solid 1px #D1D1CF;
	border-radius: 10px;
	position: relative;
	margin: 0 auto 30px;
	padding: 13px 50px 13px;
	line-height: 30px;
	text-decoration: none;
	display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
ol#faq_link li a p {
	display: inline-block;
	width: 809px;
	margin-left: 30px; 
}
ol#faq_link li a:hover {
	border: solid 1px #FFA033;
	color: #FFA033;
}
ol#faq_link li a img { width: 61px; height: 61px; }
#support {
	width: 850px;
	background: #FDFDFD;
	border-radius: 15px;
	padding: 0 0 25px 0;
	margin: 30px auto;
	text-align: center;
	line-height: 50px;
}
#titleline { 
	margin-top: 15px;
	padding: 0 37px;
	border-bottom: solid 2px #FFA033;
}
.btnreturn { margin: 0 auto; }

.rowset, .rowset50 {
	display: flex;
    flex-direction: row;
    justify-content: flex-start;
	margin-bottom: 25px;
}
/*.rowset > .pdfbox {
	width: 410px;
	height: 580px;
	padding: 8px 10px 12px;
	background-color: #CCC;
	border-radius: 4px;
	margin-left: 25px;
}*/
.rowset > iframe, .rowset50 > iframe {
	padding: 20px;
	background-color: #CCC;
	border-radius: 4px;
	margin-left: 40px;
}
.rowset50 > iframe { margin-left: 50px; }
.rowset > iframe:first-child, .rowset50 > iframe:first-child { margin-left: 0; }
.pageup {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}