/******************** ベース ********************/
html{
	overflow-y:scroll;
}
body{
	font-family:"メイリオ","Meiryo";
	line-height:200%;
	min-width:320px;
}
body::before{
	z-index                 : -1;
	background-color        : #cccccc;
	background-image        : url("../images/background01.jpg");
	background-size         : 2000px 1000px;
	position                : fixed;
	top                     : 0;
	left                    : 0;
	width                   : 150%;
	height                  : 150%;
	content                 : "";
	min-height              : 1000px;
}

table.table:not(.jqplot-table-legend) {
	border: 1px solid #000000;
	width:100%;
	border-collapse:collapse;
	background-color:#ffffff;
	margin-top:5px;
}
table.table:not(.jqplot-table-legend) tr {
	border: 1px solid #000000;
}
table.table:not(.jqplot-table-legend)  tr th {
	border: 1px solid #000000;
	width: 100px;
}
table.table:not(.jqplot-table-legend)  tr td {
	border: 1px solid #000000;
}

textarea {
	width:98%;
	height:100px;
}

div {
	box-sizing: border-box;
}

caption { text-align:left;}

/* 上書き */
.checkbox-inline + .checkbox-inline {
	margin-left: 0px;
	margin-right: 10px;
}

/* 追加 */
.checkbox-inline:first-child {
	margin-right: 10px;
}

.info_box {
	height:100px;
	overflow:auto;
}

/******************** レイアウト ********************/
#root { max-width: 1200px; width:100%; margin: 0 auto; }
#top {
	width: 100%;
	height:100px;
	background-color: rgba(255,255,255,0.5);
	border:0px solid #000000;
	line-height:100px;
	margin-bottom:20px;
}
.title { color:#ffffff; text-shadow: -1px -1px #000, 1px -1px #000, -1px 1px #000, 1px 1px #000; font-size:40px; margin-left:20px;}
.title-img {
	margin-top:5px;
	margin-left:20px;
	width:90%;
	max-width:325px;}
.welcome { margin-right:20px; font-weight: bold; color: #003E4C;}
#footer { width: 100%; min-height:100px; background-color: rgba(255,255,174,0.0); border:0px solid #000000; line-height:150%; padding-left:20px;}

#frmData1Detail .dataParam { width:150px;}

#data2HeadKanaNav.pagination > li > a,
#data2HeadKanaNav.pagination > li > span {
  padding: 10px 26px;
  font-size: 18px;
  width : 70px;
}
#data2HeadKanaNav.pagination > li:first-child > a,
#data2HeadKanaNav.pagination > li:first-child > span {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
#data2HeadKanaNav.pagination > li:last-child > a,
#data2HeadKanaNav.pagination > li:last-child > span {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.data2White { background-color:#ffffff; }
.data2Gray  { background-color:#dddddd; }
.data2ListBox {width:850px;}
.data2ListBox .timebox { display:block; float:left; margin:5px; width:80px;}
.data2ListBox .timebox .time {margin-left:auto; margin-right:auto; display:inline-block;}
.data2Name {width: 200px; line-height:80px; margin-left:35px;}
.data2Plan {width: 200px; margin-left:35px;}
.data2Detail {padding-left:35px;}

.data3List {width:100%;}
.data3Plan {width:120px; margin-left:5px;}
.data3Nav {width: 30px;}

.data5dd {margin-left:0px; padding-left:5px; padding-right:5px;}

.data7List { width:100%; }
.data7Name { width:150px; text-align:left;}
.data7Subject { width:50px; text-align:left;}
.data7Title { width:320px; text-align:left;}
.data7Download { width:100px; text-align:left;}

.data8Plan {width: 120px; margin-left:5px;}
.data8Nav {width: 30px;}
.data8DetailBox { border:1px solid #000000; background-color:#ffffff; width:100%}

.data9Sort {width: 70px;}

.data14Name {width: 200px;}

#frmData11Import th { width:200px;}

.login-title {
	margin-top:50px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	color:#555555;
}

.login {
	width: 300px;
	margin-left:auto;
	margin-right:auto;
	border:2px solid #00a2e8;
	background-color:#f0f0f0;
}

.login-contents {
	margin-top:50px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	color:#555555;
	font-size:8px;
}

.overlay {
	position: fixed;
	display: none;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background-color: rgba(255,255,255,0.50);

}

.overlay .dialog{
	background-color: #fff;
	display: inline-block;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 300px;
	margin-top: -50px;
	margin-left: -50px;
}

.overlay img {
	display: inline-block;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 100px;
	height: 100px;
	margin-top: -50px;
	margin-left: -50px;
}

.main-nav {
	color:#000000;
	line-height:400%;
	list-style:none;
	padding-left:20px;
}
.main-nav li{
	width: 170px;
	float: left;
	margin-bottom:20px;
	margin-right: 20px;
	filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;
	background-image:url("../images/menu_pull_down.png");
	background-repeat:no-repeat;
	background-position:10px 49%;
	background-size:20px 20px;
}
.main-nav li.active {
	filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;
}
.main-nav li.original_link {
	filter: alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;
	background-image: none;
	content:"\e114";
	float: right;
}

.main-nav li:not(.original_link) a{
	display: block;
	width: 170px;
	float: left;
	padding-left: 40px;
	text-decoration: none;
	color:#555555;
}
.main-nav li:not(.original_link) a:hover{
	display: block;
	width: 170px;
	float: left;
	padding-left: 40px;
	text-decoration: none;
	color:#222222;
}
.main-nav li.original_link a{
	display: block;
	width: 170px;
	float: left;
	text-decoration: none;
	color:#fff;
}
.main-nav li.original_link a:hover{
	display: block;
	width: 170px;
	float: left;
	text-decoration: none;
	color:#ddd;
}
.main-nav li span.glyphicon {
	margin-left: 10px;
	margin-right: 10px;
	font-size: 20px;
}



.form-inline {
	margin-top:5px;
}
.table {
	margin-bottom:0px;
}

.ml-auto {
	margin-left:auto;
}
.mr-auto {
	margin-right:auto;
}

/******************** モジュール ********************/

.box {
	float: left;
}

.box-right {
	float: right;
}

.displayBox {
	min-width: 10px;
}

.secret { display: none; visibility: hidden;}
.open-box { display:;}
.close-box { display:none;}
.full {width:100%;}
.border {border:1px solid #000000;}
.scroll {overflow:scroll}
.level3Numeric {width:60px;}
.level4Numeric {width:80px;}
.transferMark {width:30px;}
.subjectName {width:80px;}

.dataLine {
	width:100%; background-color:#ffffff; border:1px solid #000000;
}
td .dataLine {
	width:100%; background-color:#ffffff; border:1px solid #CCCCCC;
}
.dataLine .dataParamBig{
	width:300px; margin-left:5px; margin-right:5px;
}
.dataLine .dataParamMiddle1{
	width:200px; margin-left:5px; margin-right:5px;
}
.dataLine .dataParamMiddle2{
	width:100px; margin-left:5px; margin-right:5px;
}
.dataLine .dataParamLittle{
	width:50px; margin-left:5px; margin-right:5px;
}
.dataLine .header{
	width:100px;
}
.dataLine .data{
	width:100%;
}
.dataParam { padding-left:5px; padding-right:5px;}


.frmBody {width: 100%}

.input-box { padding:5px;}
.view-box { padding:5px;}

.nameDiv    { width:100px; margin-left:5px;}
.KanaDiv    { width:200px; margin-left:5px;}
.gradeDiv   { width:100px; margin-left:5px;}
.dutyDiv    { width:100px; margin-left:5px;}
.dateDiv    { width:150px; margin-left:5px;}
.subjectDiv { width:100px; margin-left:5px;}
.detailDiv  { width:150px; margin-left:5px;}
.textbookDiv{ width:200px; margin-left:5px;}
.pointDiv   { width:100px; margin-left:5px;}
.grayDiv	{ background-color:#dddddd; }
.palegrayDiv	{ background-color:#f1f1f1; }

.div-200 {
	width:200px; margin-left:5px;
}

.name{ width: 200px;}
.post{ width: 50px;}
.mail{ width: 400px;}
.tel { width: 400px;}
.date{ width: 200px;}
.file{ width: 400px;}
.sort {width:70px;}
.long {width:400px;}

.input-name {width: 200px }
.input-tel  {width: 400px }
.input-mail {width: 400px }
.input-date {width: 200px }
.input-duty { }
.input-id   {width: 200px }
.input-pass {width: 200px }
.input-subject {width: 150px}


.info_list {width: 100%; padding-left:20px; padding-right:20px;}
.menuContainer {width: 100%; margin-bottom:5px; padding-left:20px; padding-right:20px;}
.shadow {width: 100%; box-shadow: 2px 2px rgba(0,0,0,0.4);}
.menuBox { width: 100%; background-color: rgba(255,255,255,0.8);}

.data { width: 100%; background-color:rgba(255,255,255,0.8); border:0px solid #222222; padding:20px;}

.phone-portrait-view   { visibility:hidden; display:none;}
.thDiv { font-weight:bold; padding-left:5px;}
.plotArea { height:300px; margin-left: 15px;}

.moveIcon { height:25px; width:25px; background-image:url("../images/arrow216.png"); background-repeat:no-repeat; background-size:100% 100%;}
.editIcon { height:25px; width:25px; background-image:url("../images/pencil.png"); background-repeat:no-repeat; background-size:100% 100%;}

.mini-button { font-size:8pt}
.download-ico { width: 200px; line-height:400%;
                background-image:url("../images/download.png"); background-repeat:no-repeat; background-position:0px 49%;}

.config-container {margin-top:5px; }
.config-ico {height:20px; width:20px; background-image:url("../images/config.png"); background-repeat:no-repeat; background-size:100% 100%; margin-left:5px; margin-top:5px}
.config-controller {margin-top:5px;}

.common-nav {
	color:#000000;
	line-height:200%;
	list-style:none;
	margin-left: -40px;
}
.common-nav li{
	width: 200px;
	float: left;
	margin-bottom:5px;
	margin-right: 20px;
	border: 1px solid #aaaaaa;
}
.common-nav li.download{
	background-image:url("../images/arrow_down.png");
	background-repeat:no-repeat;
	background-position:10px 49%;
	background-size:20px 20px;
}
.common-nav li.update{
	background-image:url("../images/refresh.png");
	background-repeat:no-repeat;
	background-position:10px 49%;
	background-size:20px 20px;
}
.common-nav li a{
	display: block;
	width: 160px;
	float: left;
	padding-left: 40px;
	text-decoration: none;
}
.common-nav li.li-right {
	float: right;
	margin-right: 0px;
}

.btn_attention { border-color:#d4402b; color:#fff; background-color: #d4402b;}
.btn_move  { border-color:#1166e7; color:#fff; background-color: #1166e7;}
.btn_save  { border-color:#1166e7; color:#fff; background-color: #1166e7;}
.btn_normal{ border-color:#05a35e; color:#fff; background-color: #05a35e;}

.clickable { cursor: pointer;}
.clickable:hover   { color: #555; }
tr.clickable:hover { background-color: #eee; }
td.clickable:hover { background-color: #eee; }
div.clickable:hover { background-color: #eee; }

.space-5  {margin-top:5px;}
.space-10 {margin-top:10px;}
.space-15 {margin-top:15px;}
.space-20 {margin-top:20px;}

.calendar_calendarBox {
	width: 50%;
}
.calendar_detailBox {
	width: 50%;
}
.calendar_detailBox .info_section {
	width: 100%;
}

/******************** ステータス ********************/

.yet { height:19px; width:19px; background-image:url("../images/icon-yet.png"); background-repeat:no-repeat; background-size:cover;}
.fin { height:19px; width:19px; background-image:url("../images/icon-fin.png"); background-repeat:no-repeat; background-size:cover;}

span.error { color:red; }
span.required { color:red; }

.data2Nav {width: 600px;}
.data2Nav li { display:block; float:left; margin:5px; width:120px; height:60px; position:relative; font-size:30px;}
.data2Nav li.onclick:hover {box-shadow: 2px 2px rgba(0,0,0,0.2); margin-top:3px;}
.data2Nav li.come       { background-image:url("../images/icon-come.png"); background-repeat:no-repeat; background-size:100% 100%;}
.data2Nav li.comeSelect { background-image:url("../images/icon-come-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}
.data2Nav li.back       { background-image:url("../images/icon-back.png"); background-repeat:no-repeat; background-size:100% 100%;}
.data2Nav li.backSelect { background-image:url("../images/icon-back-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}

.data2Nav li {
  display: -webkit-box; /* safari, Chrome */
  display: -moz-box;    /* Firefox */
  display: -o-box;      /* Opera */
  display: -ms-box;     /* IE */
  display: box;         /* ベンダープレフィックスなし */

  -webkit-box-align: center; /* safari, Chrome */
  -moz-box-align: center;    /* Firefox */
  -o-box-align: center;      /* Opera */
  -ms-box-align: center;     /* IE */
  box-align: center;         /* ベンダープレフィックスなし */
}

.data2Nav li.time { display: block;}

.data2SubNav        { width: 50px;}
.data2SubNav li     { display:block; float:left; width:40px; height:20px;}
.data2SubNav li:hover {box-shadow: 2px 2px rgba(0,0,0,0.2);}
.data2SubNav li.off       { background-image:url("../images/icon-off.png");  background-repeat:no-repeat; background-size:100% 100%;}
.data2SubNav li.offSelect { background-image:url("../images/icon-off-hover.png");  background-repeat:no-repeat; background-size:100% 100%;}

.data2List     {background-image:url("../images/close-icon.png"); background-repeat:no-repeat; background-position:10px 49%;}
.data2ListOpen {background-image:url("../images/open-icon.png"); background-repeat:no-repeat; background-position:10px 49%;}

.data2PlanList     {background-image:url("../images/close-icon.png"); background-repeat:no-repeat; background-position:10px 10%;}
.data2PlanListOpen {background-image:url("../images/open-icon.png"); background-repeat:no-repeat; background-position:10px 10%;}

.close-ico {background-image:url("../images/close-icon.png"); background-repeat:no-repeat; background-position:10px 49%;}
.open-ico  {background-image:url("../images/open-icon.png"); background-repeat:no-repeat; background-position:10px 49%;}

.menu{
	width: 250px;
	background-color: rgba(50,232,98,1.0);
	padding-left:45px;
	color:#000000;
	line-height:300%;
	background-image:url("../images/close-icon.png");
	background-repeat:no-repeat;
	background-position:10px 45%;
	background-size: 30px;}
.selectedMenu{
	width: 250px;
	background-color: rgba(50,232,98,1.0);
	padding-left:45px;
	color:#000000;
	line-height:300%;
	background-image:url("../images/open-icon.png");
	background-repeat:no-repeat;
	background-position:10px 45%;}
.inactiveMenu{
	width: 250px;
	background-color: rgba(204,204,204,1.0);
	padding-left:45px;
	color:#000000;
	line-height:300%;
	background-image:url("../images/close-icon.png");
	background-repeat:no-repeat;
	background-position:10px 45%;
	filter:alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5; }

.menu-green  {
	background-color: rgba(121,241,89,1.0);
	color : #444;
	font-size: 25px;
}
.menu-blue   {
	background-color: rgba(89,176,222,1.0);
	color : #444;
	font-size: 25px;
}
.menu-yellow {
	background-color: rgba(236,253,94,1.0);
	color : #444;
	font-size: 25px;
}
.menu-red    {
	background-color: rgba(229,57,53,1.0);
	color: #fff;
	font-size: 25px;
}

div.ref_attention {
	background-color : #FFF9C4;
}
div.ref_retry {
	background-color : #DCEDC8;
}
div.ref_reconsider {
	background-color : #ffcdd2;
}
div.ref_overrun {
	background-color : #BBDEFB;
}

.invalid_text {
	color : #bbb;
}

/******************** テーマ ********************/

/*****************************************/

/* Laptop/Tablet (1024px) */
@media only screen and (min-width: 951px) and (max-width: 1024px) and (orientation: landscape) {

	/* PCと同様 */
	.calendar_calendarBox {
	}
	.calendar_detailBox {
	}
	.calendar_detailBox .info_section {
	}
}

/* Laptop/Tablet (950px) */
@media only screen and (min-width: 751px) and (max-width: 950px) and (orientation: landscape) {

	/* PCと同様 */
	.data2ListBox {width:635px;}
	.data2Name {width: 100px; line-height:80px; margin-left:35px;}

	.data2Nav {width: 500px;}
	.data2Nav li { display:block; float:left; margin-right:5px; width:100px; height:50px; position:relative; font-size:30px;}

	.calendar_calendarBox {
	}
	.calendar_detailBox {
	}
	.calendar_detailBox .info_section {
	}
}

/* Laptop/Tablet (750px) */
@media only screen and (min-width: 481px) and (max-width: 750px) and (orientation: landscape) {

	/* PCと同様 */
	.data2ListBox {width:100%;}
	.data2Name {width: 100px; line-height:80px; margin-left:35px;}

	.data2Nav {width: 100%;}
	.data2Nav li { display:block; float:left; margin-right:5px; width:80px; height:40px; position:relative; font-size:30px;}
	.data2Nav li.onclick:hover {box-shadow: 2px 2px rgba(0,0,0,0.2); margin-top:3px;}
	.data2Nav li.come       { background-image:url("../images/icon-come.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.comeSelect { background-image:url("../images/icon-come-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.back       { background-image:url("../images/icon-back.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.backSelect { background-image:url("../images/icon-back-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}

	.calendar_calendarBox {
	}
	.calendar_detailBox {
	}
	.calendar_detailBox .info_section {
	}
}

/* Tablet Portrait (768px) */
@media only screen and (min-width: 521px) and (max-width: 1024px) and (orientation: portrait) {


	/******************** レイアウト ********************/
	.data2ListBox .timebox { display:block; float:left; margin:5px; width:80px;}
	.data2ListBox .timebox .time {margin-left:auto; margin-right:auto; display:inline-block;}
	.data2ListBox {width:100%;}
	.data2Name {width: 100px; line-height:80px; margin-left:35px;}

	.data2Nav {width: 100%;}
	.data2Nav li { display:block; float:left; margin-right:5px; width:80px; height:40px; position:relative; font-size:30px;}
	.data2Nav li.onclick:hover {box-shadow: 2px 2px rgba(0,0,0,0.2); margin-top:3px;}
	.data2Nav li.come       { background-image:url("../images/icon-come.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.comeSelect { background-image:url("../images/icon-come-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.back       { background-image:url("../images/icon-back.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.backSelect { background-image:url("../images/icon-back-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}

	.data3DetailTestDetail {width: 100%}

	.data7Name { width:125px; text-align:left;}
	.data7Subject { width:50px; text-align:left;}
	.data7Title { width:175px; text-align:left;}
	.data7Download { width:100px; text-align:left;}

	/******************** モジュール ********************/

	.input-name-container {width: 100%}
	.input-name {width: 100% }
	.input-tel  {width: 100% }
	.input-mail {width: 100% }
	.input-date {width: 100% }
	.input-duty {width: 100% }
	.input-id   {width: 100% }
	.input-pass {width: 100% }
	.input-subject {width: 150px}

	.file{ width: 100%;}

	.lt-tablret-port-100 {width: 100%}
	.lt-tablret-port-50  {width: 49%}

	.calendar_calendarBox {
		width: 100%;
	}
	.calendar_detailBox {
		width: 100%;
	}
	.calendar_detailBox .info_section {
	}

	/******************** ステータス ********************/

	/******************** テーマ ********************/

	/*****************************************/
}
@media only screen and (min-width: 321px) and (max-width: 520px) and (orientation: portrait) {


	/******************** レイアウト ********************/

	.data2ListBox {width:100%;}
	.data2ListBox .timebox { display:block; float:left; margin:5px; width:80px;}
	.data2ListBox .timebox .time {margin-left:auto; margin-right:auto; display:inline-block;}
	.data2InputForm {width: 100%;}
	.data2Name {width: 100px; line-height:80px; margin-left:35px;}

	.data2Nav {width: 100%;}
	.data2Nav li { display:block; float:left; margin-right:5px; width:80px; height:40px; position:relative; font-size:30px;}
	.data2Nav li.onclick:hover {box-shadow: 2px 2px rgba(0,0,0,0.2); margin-top:3px;}
	.data2Nav li.come       { background-image:url("../images/icon-come.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.comeSelect { background-image:url("../images/icon-come-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.back       { background-image:url("../images/icon-back.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.backSelect { background-image:url("../images/icon-back-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}

	.data3DetailTestSubject {width: 100%}
	.data3DetailTestDetail  {width: 100%}
	.data3HomeworkGradeContainer   {width:  50%}
	.data3HomeworkGrade            {width: 100%}
	.data3HomeworkSubjectContainer {width:  50%}
	.data3HomeworkSubject          {width: 100%}
	.data3HomeworkDetailContainer  {width: 100%}
	.data3HomeworkDetail           {width: 100%}

	.data5dd      {width: 100%}
	.data5ddInput {width: 100%}

	.data7Name { width:50%; text-align:left;}
	.data7Subject { width:50%; text-align:left;}
	.data7Title { width:50%; text-align:left;}
	.data7Download { width:50%; text-align:left;}

	.data9Sort {width:100%;}

	/******************** モジュール ********************/

	.input-name-container {width: 100%}
	.input-name {width: 100% }
	.input-tel  {width: 100% }
	.input-mail {width: 100% }
	.input-date {width: 100% }
	.input-duty {width: 100% }
	.input-id   {width: 100% }
	.input-pass {width: 100% }
	.input-title{width: 100% }
	.input-subject {width: 100%}

	.file{ width: 100%;}

	.lt-tablret-port-100   {width: 100%}
	.lt-tablret-port-50    {width: 49%}
	.lt-l-tablret-port-100 {width: 100%}
	.lt-l-tablret-port-50  {width: 49%}

	.calendar_calendarBox {
		width: 100%;
	}
	.calendar_detailBox {
		width: 100%;
	}
	.calendar_detailBox .info_section {
		width: 100%;
	}

	/******************** ステータス ********************/

	.data2Nav {width: 100%;}

	/******************** テーマ ********************/

	/*****************************************/
}

/* Phone Landscape (480px) */
@media only screen and (min-width: 321px) and (max-width: 480px) and (orientation: landscape) {

	/******************** レイアウト ********************/

	.data2ListBox {width:100%;}
	.data2ListBox .timebox { display:block; float:left; margin:5px; width:80px;}
	.data2ListBox .timebox .time {margin-left:auto; margin-right:auto; display:inline-block;}
	.data2InputForm {width: 100%;}
	.data2Name {width: 100px; line-height:80px; margin-left:35px;}

	.data2Nav {width: 100%;}
	.data2Nav li { display:block; float:left; margin-right:5px; width:80px; height:40px; position:relative; font-size:30px;}
	.data2Nav li.onclick:hover {box-shadow: 2px 2px rgba(0,0,0,0.2); margin-top:3px;}
	.data2Nav li.come       { background-image:url("../images/icon-come.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.comeSelect { background-image:url("../images/icon-come-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.back       { background-image:url("../images/icon-back.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.backSelect { background-image:url("../images/icon-back-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}

	.data3DetailTestSubject {width: 100%}
	.data3DetailTestDetail  {width: 100%}
	.data3HomeworkGradeContainer   {width:  50%}
	.data3HomeworkGrade            {width: 100%}
	.data3HomeworkSubjectContainer {width:  50%}
	.data3HomeworkSubject          {width: 100%}
	.data3HomeworkDetailContainer  {width: 100%}
	.data3HomeworkDetail           {width: 100%}

	.data5dd      {width: 100%}
	.data5ddInput {width: 100%}

	.data7Name { width:50%; text-align:left;}
	.data7Subject { width:50%; text-align:left;}
	.data7Title { width:50%; text-align:left;}
	.data7Download { width:50%; text-align:left;}

	.data9Sort {width:100%;}

	/******************** モジュール ********************/

	.data { width: 100%; background-color: #f0f0f0; border:1px solid #222222; padding:2px;}

	.input-name-container {width: 100%}
	.input-name {width: 100% }
	.input-tel  {width: 100% }
	.input-mail {width: 100% }
	.input-date {width: 100% }
	.input-duty {width: 100% }
	.input-id   {width: 100% }
	.input-pass {width: 100% }
	.input-title{width: 100% }
	.input-subject {width: 100% }

	.file{ width: 100%;}

	.lt-tablret-port-100   {width: 100%}
	.lt-tablret-port-50    {width: 49%}
	.lt-l-tablret-port-100 {width: 100%}
	.lt-l-tablret-port-50  {width: 49%}
	.eq-phone-port-100     {width: 100%}
	.eq-phone-port-50      {width: 49%}

	.phone-portrait-secret { visibility:hidden; display:none;}
	.phone-portrait-view   { visibility:visible; display:block;}

	.calendar_calendarBox {
		width: 100%;
	}
	.calendar_detailBox {
		width: 100%;
	}
	.calendar_detailBox .info_section {
		width: 100%;
	}

	/******************** ステータス ********************/

	.data2Nav {width: 100%;}

	/******************** テーマ ********************/

	/*****************************************/
}

/* Phone Portrait (320px) */
@media only screen and (max-width: 320px) {

	/******************** レイアウト ********************/

	.data2ListBox {width:100%;}
	.data2ListBox .timebox { display:block; float:left; margin:5px; width:80px;}
	.data2ListBox .timebox .time {margin-left:auto; margin-right:auto; display:inline-block;}
	.data2InputForm {width: 100%;}
	.data2Name {width: 100px; line-height:80px; margin-left:35px;}

	.data2Nav {width: 100%;}
	.data2Nav li { display:block; float:left; margin-right:5px; width:80px; height:40px; position:relative; font-size:30px;}
	.data2Nav li.onclick:hover {box-shadow: 2px 2px rgba(0,0,0,0.2); margin-top:3px;}
	.data2Nav li.come       { background-image:url("../images/icon-come.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.comeSelect { background-image:url("../images/icon-come-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.back       { background-image:url("../images/icon-back.png"); background-repeat:no-repeat; background-size:100% 100%;}
	.data2Nav li.backSelect { background-image:url("../images/icon-back-hover.png"); background-repeat:no-repeat; background-size:100% 100%;}

	.data3DetailTestSubject {width: 100%}
	.data3DetailTestDetail  {width: 100%}
	.data3HomeworkGradeContainer   {width:  50%}
	.data3HomeworkGrade            {width: 100%}
	.data3HomeworkSubjectContainer {width:  50%}
	.data3HomeworkSubject          {width: 100%}
	.data3HomeworkDetailContainer  {width: 100%}
	.data3HomeworkDetail           {width: 100%}

	.data5dd      {width: 100%}
	.data5ddInput {width: 100%}

	.data7Name { width:50%; text-align:left;}
	.data7Subject { width:50%; text-align:left;}
	.data7Title { width:50%; text-align:left;}
	.data7Download { width:50%; text-align:left;}

	.data9Sort {width:100%;}

	/******************** モジュール ********************/

	.data { width: 100%; background-color: #f0f0f0; border:1px solid #222222; padding:2px;}

	.input-name-container {width: 100%}
	.input-name {width: 100% }
	.input-tel  {width: 100% }
	.input-mail {width: 100% }
	.input-date {width: 100% }
	.input-duty {width: 100% }
	.input-id   {width: 100% }
	.input-pass {width: 100% }
	.input-title{width: 100% }
	.input-subject {width: 100% }

	.file{ width: 100%;}

	.lt-tablret-port-100   {width: 100%}
	.lt-tablret-port-50    {width: 49%}
	.lt-l-tablret-port-100 {width: 100%}
	.lt-l-tablret-port-50  {width: 49%}
	.eq-phone-port-100     {width: 100%}
	.eq-phone-port-50      {width: 49%}

	.phone-portrait-secret { visibility:hidden; display:none;}
	.phone-portrait-view   { visibility:visible; display:block;}

	.calendar_calendarBox {
		width: 100%;
	}
	.calendar_detailBox {
		width: 100%;
	}
	.calendar_detailBox .info_section {
		width: 100%;
	}

	/******************** ステータス ********************/

	.data2Nav {width: 100%;}

	/******************** テーマ ********************/

	/*****************************************/
}