@charset "UTF-8";

/* reset
----------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, caption {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	}
ol, ul { list-style: none;}
:focus,
:active { outline:0;}
table {	border-collapse: collapse;	border-spacing: 0;	}
a{ color:#fff; text-decoration:none;}
a:hover{ color:#ccc;}
table {  border-collapse: collapse;}

.boxTopMe dl.point:after,
.boxTopBox dl.list01:after,
.boxTopBox dl.list02:after,
.clearfix:after,
.schBox:after,
.gridContainer a:after{ content: "."; display:block; height:0.1px; clear:both; visibility:hidden; font-size:0.1em; line-height:0; }

.boxTopMe dl.point,
.boxTopBox dl.list01,
.boxTopBox dl.list02,
.clearfix,
.schBox,
.gridContainer a{ display:inline-block; overflow:hidden; _overflow:visible; display:block; }

* html .boxTopMe dl.point,
* html .boxTopBox dl.list01,
* html .boxTopBox dl.list02,
* html .clearfix,
* html .schBox,
* html .gridContainer a{ height:1%; }

* {
        box-sizing: border-box;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
     -o-box-sizing: border-box;
}


body {
  overflow-x: hidden;  /*  横スクロールバーを消します。 */
  height: 100%;
  background-color:#EBEBEB;
  font:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-family:'Lucida Grande',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight:normal;
  width:100%;

}
/*common*/
.bt10{ margin-bottom:10px;}
.bt20{ margin-bottom:20px;}
.gridContainer { width:960px; margin:0 auto;}
.left{ float:left;}
.right{ float:right;}
.clear{ clear:both;}

 .btn_return a{ margin-right:5px; background:#777;  border:#777777 1px solid; -moz-border-radius: 5px;   -webkit-border-radius: 5px; border-radius:5px; color:#FFFFFF; padding:4px 7px; float:right; display:block; color:#fff ;-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:  2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}


/*header*/
header{background: #FFFFFF url(../images/bg_header01.gif) repeat-x bottom; width:100%; padding:0 0 5px; margin:0;}
h1{ padding:10px 0; margin:0;}
h1 img { width:390px; }

.login_info{ margin-top:-50px; background:#fff; padding:10px; overflow:hidden; zoom:_1;}
.login_info p{ float:left;}
.login_info .btn a{ font-size:12px; margin-right:5px; background:#777;  border:#777777 1px solid; -moz-border-radius: 5px;   -webkit-border-radius: 5px; border-radius:5px; color:#FFFFFF; padding:4px 7px; float:right; display:block; color:#fff ;-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:  2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}


/*login*/

.form-container {   border: 5px solid #fed02c;   background: #ffffff;
   background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
   background: -webkit-linear-gradient(top, #ffffff, #ffffff);
   background: -moz-linear-gradient(top, #ffffff, #ffffff);
   background: -ms-linear-gradient(top, #ffffff, #ffffff);
   background: -o-linear-gradient(top, #ffffff, #ffffff);
   background-image: -ms-linear-gradient(top, #ffffff 0%, #ffffff 100%);  -webkit-border-radius: 8px;   -moz-border-radius: 8px;   border-radius: 8px;
   -webkit-box-shadow: rgba(000,000,000,0.9) 0 1px 2px, inset rgba(255,255,255,0.4) 0 0px 0;
   -moz-box-shadow: rgba(000,000,000,0.9) 0 1px 2px, inset rgba(255,255,255,0.4) 0 0px 0;
   box-shadow: rgba(000,000,000,0.9) 0 1px 2px, inset rgba(255,255,255,0.4) 0 0px 0;
  text-decoration: none;   vertical-align: middle;  padding:20px;   width:400px;   margin:20px auto;
   }
.form-field {   border: 1px solid #c2c2c2;   background: #feef80;
   -webkit-border-radius: 4px;   -moz-border-radius: 4px;   border-radius: 4px;  color: #000;
   -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(000,000,000,0.7) 0 0px 0px;
   -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(000,000,000,0.7) 0 0px 0px;
   box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(000,000,000,0.7) 0 0px 0px;   padding:8px;   margin-bottom:20px;   width:100%;
   }
.form-field:focus {   background: #fff;  color: #000000;   }
.form-container h2 {   text-shadow: #ffffff 0 1px 0;  font-size:18px;  margin: 0 0 20px;   font-weight:bold;   text-align:center;   padding-bottom:10px;   border-bottom:#fed02c 3px solid;    }
.form-title {   margin-bottom:10px;  color: #000;  text-shadow: #ffffff 0 1px 0;  }
.submit-container {  margin:8px 0;  text-align:right;  }
.submit-button {
   border: 0px solid #447314;
   background: #fc865f;
   background: -webkit-gradient(linear, left top, left bottom, from(#fc865f), to(#fc865f));
   background: -webkit-linear-gradient(top, #fc865f, #fc865f);
   background: -moz-linear-gradient(top, #fc865f, #fc865f);
   background: -ms-linear-gradient(top, #fc865f, #fc865f);
   background: -o-linear-gradient(top, #fc865f, #fc865f);
   background-image: -ms-linear-gradient(top, #fc865f 0%, #fc865f 100%);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);
   text-shadow: #634613 0 1px 0;
   color: #ffffff;
   padding: 8.5px 18px;
   font-size: 14px;
   text-decoration: none;
   vertical-align: middle;
   }
.submit-button:hover {
   border: 0px solid #447314;
   text-shadow: #634613 0 1px 0;
   background: #fcb791;
   background: -webkit-gradient(linear, left top, left bottom, from(#fcb791), to(#fcb791));
   background: -webkit-linear-gradient(top, #fcb791, #fcb791);
   background: -moz-linear-gradient(top, #fcb791, #fcb791);
   background: -ms-linear-gradient(top, #fcb791, #fcb791);
   background: -o-linear-gradient(top, #fcb791, #fcb791);
   background-image: -ms-linear-gradient(top, #fcb791 0%, #fcb791 100%);
   color: #fff;
   }


.submit-button:active {
   text-shadow: #634613 0 1px 0;
   border: 0px solid #447314;
   background: #fcb791;
   background: -webkit-gradient(linear, left top, left bottom, from(#fcb791), to(#fcb791));
   background: -webkit-linear-gradient(top, #fcb791, #fcb791);
   background: -moz-linear-gradient(top, #fcb791, #fcb791);
   background: -ms-linear-gradient(top, #fcb791, #fcb791);
   background: -o-linear-gradient(top, #fcb791, #fcb791);
   background-image: -ms-linear-gradient(top, #fcb791 0%, #fcb791 100%);
   color: #fff;
   }

 /*movie*/

 .movieBox{ margin:20px 0 0 0; background:#fff; padding:10px; overflow:hidden; zoom:_1;}
 .movieBox p{ float:left;}
 .movieTitle01{background:#FED02C; padding:10px; text-align:center; font-size:15px; font-weight:bold; margin:2px 0;}
.pager {  padding-left: 0;  margin: 20px 0;  text-align: center;  list-style: none;}
.pager li {  display: inline;}
.pager li > a{ display: inline-block;  padding: 5px 14px;  background-color: #fff;  border: 1px solid #777777; border-radius: 5px; color:#777777;-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:	2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}
 .pager li > a:hover,
.pager li > a:focus {  text-decoration: none;  background-color: #eee;}
 .movieBtn{ width:20%; margin:0 auto 20px;}

/*avatar*/
 .avatarTitle01{background:#FED02C; padding:10px; text-align:center; font-size:15px; font-weight:bold; margin:20px 0 20px;}
.avatarWrap01{ width:400px; float:left;}
.avatarDraw{ border:#FFD92D 5px solid; background:#FFFFFF; padding:10px; text-align:center;display:table; width:400px; height:400px; margin-bottom:20px;}
.avatarDraw img{ width:100%; }
.avatarDraw > *{
    display:table-cell;
    vertical-align: middle;
}

.avatarWrap02{ width:490px; float:right;}
ul.parts{ width:495px; margin:0 -5px 20px 0; overflow:hidden; zoom:_1;}
ul.parts li{ float:left; margin-right:5px; margin-bottom:5px;}
ul.parts li a{ display:block; color:#000; border:#AAA 1px solid; background:#FCF8E2; text-align:center; width:94px; padding:5px 2px; -moz-border-radius: 5px;	-webkit-border-radius: 5px; border-radius:5px; }
ul.parts li a:hover{background:#FFDB00;display:block;}
ul.parts li a.on{ background:#FFDB00;}

.avatarTable01{ width:100%; border-collapse: collapse; margin-bottom:10px;}
.avatarTable01 td{ vertical-align: middle; text-align:center; border: 1px solid #AAA; padding: 6px; width:33%;  background:#fff;}
.avatarTable01 td img { width:150px; height:150px; }

.avatarBox01{ text-align:center;}
.avatarBox01 li {  display: inline; margin-right:2px;}
.avatarBox01 li > a{ display: inline-block; }

.avatarBox02{ overflow:hidden; zoom:_1; padding-bottom:3px;}
.avatarBox02 .prev{ float:left;}
.avatarBox02 .next{ float:right; margin-right:2px;}
.avatarBox02 .prev a,.avatarBox02 .next a{ background:#FFF;  border:#777777 1px solid; -moz-border-radius: 5px;	-webkit-border-radius: 5px; border-radius:5px; color:#FFFFFF; padding:4px 7px;display:block; color:#777777 ; -moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:	2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}
.avatarBox02 .prev a:hover,.avatarBox02 .next a:hover{ background:#eee;}



/*top*/
.columnWrap01{ width:980px; margin: 20px -20px 20px 0; overflow:hidden; zoom:_1;}
.columnTop01{ width:300px; margin-right:20px; float:left;}
.boxTopMe{-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; background:#FEF080; padding:20px; margin-bottom:10px;}
.boxTopMe .course{ margin:0 0 5px;}
.boxTopMe .name{ font-weight:bold; font-size:20px;margin:0 0 5px;}
.boxTopMe .aBox{ border:#ccc 3px solid; background:#FFFFFF; width:140px; float:left; text-align:center;}
.boxTopMe .aBox img{ width:130px;}
.boxTopMe .tBox{ float:right; width:110px; font-size:15px;}
.boxTopMe  .lv{ background:#FED02C; padding:10px; font-weight:bold; margin-bottom:10px;}
.boxTopMe  dl.point{ border-bottom:#000000 1px dotted; padding-bottom:5px; margin-bottom:5px;}
.boxTopMe  dl.point dt{ float:left; line-height:20px; height:20px;}
.boxTopMe  dl.point dd{ float:right; }
.boxTopMe  dl.point dd span { font-size:20px; font-weight:bold;line-height:20px; height:20px;}
.boxTopMe .area{ margin-bottom:10px;}
.boxTopMe .area span{font-size:15px; font-weight:bold; margin-left:10px;}

/*.boxTopBt{ padding:0 20px;}*/

.boxTopBox{-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; background:#FFF;  margin-bottom:20px; border:#EEEEEE 1px solid; padding-top:-10px;}
.boxTopBox .title01{ padding: 10px; border-bottom:#00B5B0 3px solid;margin:0;}

.boxTopBox dl.list01{ margin:10px 20px 10px; border-bottom:#DDDDDD 1px solid; padding-top:7px; padding-bottom:3px;}
.boxTopBox dl.list01 dt{ float:left; line-height:25px; height:25px;}
.boxTopBox dl.list01 dd{ float:right; }
.boxTopBox dl.list01 dd span { font-size:25px; font-weight:bold;line-height:25px; height:25px; color:#00B5AF; margin-right:5px; margin-bottom:-2px;}

.boxTopBox .title02{ padding: 10px; border-bottom:#50B4E3 3px solid; margin:0;}

.boxTopBox dl.list02{ margin:10px 20px 10px; border-bottom:#DDDDDD 1px solid; padding-top:7px; padding-bottom:3px;}
.boxTopBox dl.list02 dt{ float:left; line-height:28px; height:28px;}
.boxTopBox dl.list02 dd{ float:right; }
.boxTopBox dl.list02 dd span { font-size:25px; font-weight:bold;line-height:28px; height:28px; color:#50B4E3; margin-right:5px;}

.boxTopBox .title03{ padding: 10px; margin:0;background:#FCBF00;-webkit-border-top-left-radius: 10px;-webkit-border-top-right-radius: 10px;-moz-border-radius-topleft: 10px;-moz-border-radius-topright: 10px;border-top-left-radius: 10px;border-top-right-radius: 10px;}

.boxTopBox  .commentBox{ padding:10px;}

.boxTopBox  .commentBox .form{ background:#EEEEEE; padding:5px;}
.boxTopBox  .commentBox .text{border:0;padding:10px;font-family:Arial, sans-serif;border:solid 1px #ccc;width:100%;}

.boxTopBox  .commentBox .button{border:solid 1px #ccc;padding:5px 10px;background:#888;font-family:Arial, sans-serif;font-size:1.1em;text-transform:uppercase;color:#fff;float:none;width:100%;}


.commentArea{ width:100%; height:320px;overflow: auto; background:#99CCE3; padding:4px; font-size:12px;}

#scrollbar03::-webkit-scrollbar
{
        overflow:hidden;
        width:5px;
        background:#fafafa;
         
        -webkit-border-radius:3px;
        border-radius:3px;
}
        #scrollbar03::-webkit-scrollbar:horizontal
        {
                height:5px;
        }
#scrollbar03::-webkit-scrollbar-button
{
       display:none;
}
#scrollbar03::-webkit-scrollbar-piece
{
        background:#eee;
}
        #scrollbar03::-webkit-scrollbar-piece:start
        {
                background:#eee;
        }
#scrollbar03::-webkit-scrollbar-thumb
{
        overflow:hidden;
        -webkit-border-radius:3px;
        border-radius:3px;
         
        background:#333;
}
#scrollbar03::-webkit-scrollbar-corner
{
        overflow:hidden;
        -webkit-border-radius:3px;
        border-radius:3px;
         
        background:#333;
}


.commentArea .cmDayBox{ text-align:center; margin:5px auto 5px;}
.commentArea .cmDayBox span{ background:#888888; color:#fff;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius: 20px; padding:2px 10px; }


.commentArea .cmBox{ background:#D9EDF7; padding:5px; margin-bottom:10px; text-align:right;}

.commentArea .left{ float:left; width:100%}
.commentArea .right{ float:right;}

.st_box {
    position: relative;
	float:left;
    padding:10px ;
    text-align:left;
    background-color:#FFE794;
    margin: 5px 5px 15px 5px;
    border-radius: 5px ;
    box-shadow:1px 1px 5px 0px  #a7a8ac ;
	max-width:80% !important;
}
.st_box:after, .st_box:before {
    content: "";
    position: absolute;
    height: 0;
    width: 0;
}
.st_box:after {
    top: 98%;
    left: 8px;
    border: 7px solid transparent;
    border-top: 7px solid #FFE794; /*10px*/
}
.st_box:before {
    top: 100%;
    left: 8px;
    border: 7px solid transparent;
    border-top: 9px solid #FFE794; /*13px*/
}

.st_image{
     width:15%!important;
	 background:#fff; border:#DDD 1px solid; padding:1%;
	 float:left;
	 margin-top:5px;
}

.st_image img{
     width: 100%
}

.prof_box {
    position: relative;
    display:inline-block;
    padding:10px ;
    text-align:left;
    background-color:#ffffff;
    margin: 5px 5px 15px 5px;
    border-radius: 5px ;
    box-shadow:1px 1px 5px 0px  #a7a8ac ;
}
.prof_box:after, .prof_box:before {
    content: "";
    position: absolute;
    height: 0;
    width: 0;
}
.prof_box:after {
    top: 98%;
    right: 8px;
    border: 7px solid transparent;
    border-top: 7px solid #ffffff; /*10px*/
}
.prof_box:before {
    top: 100%;
    right: 8px;
    border: 7px solid transparent;
    border-top: 9px solid #ffffff; /*13px*/
}






.boxTopBox  .commentBox .form{ background:#EEEEEE; padding:5px;}
.boxTopBox  .commentBox .text{border:0;padding:10px;border:solid 1px #ccc;width:100%;}
.boxTopBox  .commentBox .button{border:solid 1px #ccc;padding:5px 10px;background:#888;text-transform:uppercase;color:#fff;cursor:pointer; width:100%; font-size:14px;}

/*.boxTopBox  .commentBox{ padding:10px;}
.boxTopBox  .commentBox .form{ background:#EEEEEE; padding:10px;}
.boxTopBox  .commentBox .text{border:0;padding:10px;font-size:1.2em;font-family:Arial, sans-serif;color:#aaa;border:solid 1px #ccc;width:200px;}
.boxTopBox  .commentBox .button{border:solid 1px #ccc;padding:10px 5px;width:55px;background:#888;font-family:Arial, sans-serif;font-size:1.1em;text-transform:uppercase;color:#fff;float:right;cursor:pointer;}*/



/*table*/
.reTable01 table {	margin: 10px auto 10px;	border-collapse: collapse;	border-spacing:0;	font-size:12px;	width:100%;}
.reTable01 th,.reTable01 td {	margin: 0;	padding: 8px 10px;	border: 1px solid #AAAAAA;}
.reTable01 th {background: #FFE794;}

.reTable01 th .sat{ color:#007DD2;}
.reTable01 th .sun{ color:#FF4C4C;}
.reTable01 td{ background:#FFFFFF;vertical-align:top; min-height: 35px; height: 35px; }
.reTable01 td img{ margin-right:5px;vertical-align:middle;float:left; }
.reTable01 div.event{ background:#FFFFCC; padding:5px; border:1px solid lightgrey; }
.reTable01 div.special{ background:#DFF0D7; padding:5px; border:1px solid lightgrey; }
.reTable01 div.private{ background:#D8EDF8; padding:5px; border:1px solid lightgrey; }

.reTable01.table_scroll td { padding:2px; }

.reTable01 th.w01{ width:2%}
.reTable01 th.w02{ width:14%}


.reTable01 td a{ color:#000000;}
.reTable01 .iconTxt{padding: 0 0 0 35px;  position: relative;}
.reTable01 .iconTxt img{position: absolute; left: 0px; top:0px;
}

.reTable02 table,.reTable03 table {  width: 100%;   border-collapse: collapse;  margin-bottom:20px; background:#fff;}
.reTable02 th,.reTable03 th  {  background: #FFE794;  font-weight: bold; }
.reTable02 td, .reTable02 th ,.reTable03 td, .reTable03 th{  padding: 6px;  border: 1px solid #AAAAAA;  text-align: left; }


.schBox{ margin:20px 0 0 0; background:#fff; padding:10px;}
.schBtn{ float:left;  padding:0; margin:0; width:65%;}
.schBtn li{  font-size:15px;}
.schBtn .day a{ margin-right:5px; background:#fff;  border:#777777 1px solid; -moz-border-radius: 5px;	-webkit-border-radius: 5px; border-radius:5px; color:#FFFFFF; padding:4px 7px; float:left; display:block; color:#777 ;-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:	2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}


.schBtn  .prev a,.schBtn .next a{ margin-right:5px; background:#FFF;  border:#777777 1px solid; -moz-border-radius: 5px;	-webkit-border-radius: 5px; border-radius:5px; color:#FFFFFF; padding:4px 7px; float:left; display:block; color:#777777 ; -moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:	2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}
.schBtn  .prev a:hover,.schBtn .next a:hover,.schBtn .day a:hover{ background:#eee;}


.period{ float:left; line-height:20px; line-height:30px; margin-left:20px; }
.icon_type{ float:right;}
.icon_type img{vertical-align:middle; margin-right:5px; }


.boxInfo{ background:#EEEEEE;-moz-border-radius: 10px;	-webkit-border-radius: 10px; border-radius: 10px; padding:10px; margin-bottom:10px; text-align:left;}
.txtRed{ color:#FF0000;}
.txtOrange{ color:#FC855F;}
.txtGreen{ color:#00B5AF;}
.txtBlue{ color:#6989C0;}


/*button*/
.btOrange {font-size: 16px; display:block; 	color: #ffffff;	padding:10px 15px;	background:#FC855F url(../images/icon_arrow01.png) no-repeat 95%;	text-align:center;	-moz-border-radius: 5px;	-webkit-border-radius: 5px;	border-radius: 5px;	-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}
a:hover.btOrange{ background:#FCB1AE url(../images/icon_arrow01.png) no-repeat 95%; color:#FFFFFF;}

.btOrange02 {font-size: 16px; display:block; 	color: #ffffff;	padding:10px 15px;	background:#FC855F ;	text-align:center;	-moz-border-radius: 5px;	-webkit-border-radius: 5px;	border-radius: 5px;	-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0); width:20%;}
a:hover.btOrange02{ background:#FCB1AE;color:#FFFFFF;}

.btGreen {font-size: 18px;  display:block; 	color: #ffffff;	padding:15px 15px;	background:#00B5AF url(../images/icon_arrow01.png) no-repeat 95%;	text-align:center;-moz-border-radius: 5px;	-webkit-border-radius: 5px;	border-radius: 5px;-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}
a:hover.btGreen{ background:#98D7AD url(../images/icon_arrow01.png) no-repeat 95%; color:#FFFFFF;}

.btSky {font-size: 18px;  display:block; 	color: #ffffff;	padding:15px 15px;	background:#55B5E1 url(../images/icon_arrow01.png) no-repeat 95%;	text-align:center;-moz-border-radius: 5px;	-webkit-border-radius: 5px;	border-radius: 5px;-moz-box-shadow:	2px 2px 1px rgba(000,000,000,0.3),	inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:	2px 2px 1px rgba(000,000,000,0.3),	inset 0px 0px 3px rgba(255,255,255,0);}
a:hover.btSky{ background:#99CCE3 url(../images/icon_arrow01.png) no-repeat 95%; color:#FFFFFF;}

.btBlue {font-size: 18px;  display:block; 	color: #ffffff;	padding:15px 15px;	background:#6989C0 url(../images/icon_arrow01.png) no-repeat 95%;	text-align:center;-moz-border-radius: 5px;	-webkit-border-radius: 5px;	border-radius: 5px;-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:	2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);}
a:hover.btBlue{ background:#7AA0E6 url(../images/icon_arrow01.png) no-repeat 95%; color:#FFFFFF;}

.btGray {font-size: 14px; display:block; 	color: #ffffff;	padding:10px 15px;	background:#777777 ;	text-align:center;	-moz-border-radius: 5px;	-webkit-border-radius: 5px;	border-radius: 5px;	-moz-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);-webkit-box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0);box-shadow:2px 2px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0); width:20%;}
a:hover.btGray{ color:#FFFFFF; background:#AAA;}



.table_fixed{ float:left; width:32px;}
.table_scroll{ float:left; width:200px; overflow-x:auto; overflow-y:hidden; margin-bottom:20px; margin-left: -1px; }

.reTable01.table_fixed table  { width:30px; margin-bottom:0; }
.reTable01.table_scroll table  { width:929px; margin-bottom:0; margin-left: -1px; }




@media only screen and (max-width: 767px) {

 .btn_return a{ font-size:15px; padding:1px 7px;}

.gridContainer {	width: 96%;	padding-left: 2%;padding-right: 2%;clear: none;float: none;margin-left: auto;}

h1{ padding:20px 0 0; margin:0;}
h1 img { width:100%; }

.login_info{ margin-top:0; }


.form-container { width:90%;}
 .movieBtn{ width:80%; margin:0 auto 20px;}

 .submit-button{ width:100%;}

.avatarTitle01{background:#FED02C; padding:5px; text-align:center; font-size:15px; font-weight:bold; margin:20px 0 10px;}

.avatarWrap01{ width:100%; float:none;}
.avatarDraw{ border:#FFD92D 5px solid; background:#FFFFFF; padding:10px; text-align:center;display:table; width:50%; height:150px; margin-bottom:10px; float:left}
.avatarDraw > *{
    display:table-cell;
    vertical-align: middle;
}

.avatarWrap02{ width:100%; float:none;}
ul.parts{ overflow:hidden; zoom:_1; width:100%;}
ul.parts li{ float:left; margin-right:1%; margin-bottom:5px;}
ul.parts li a{ display:block; font-size:12px; color:#000; border:#AAA 1px solid; background:#FCF8E2; text-align:center; width:5em; padding:5px 2px; -moz-border-radius: 5px;	-webkit-border-radius: 5px; border-radius:5px; }
ul.parts li a:hover{background:#FFDB00;display:block;}
ul.parts li a.on{ background:#FFDB00;}

.avatarTable01{ width:100%; border-collapse: collapse; margin-bottom:10px; margin-top:-10px;}
.avatarTable01 tr{ width:100%;    display:inline; padding:0; margin:0 auto; text-align:center;}
.avatarTable01 td{ vertical-align: middle; text-align:center; border: 1px solid #AAA; padding: 6px; width:16%;  background:#fff;    display:inline-block;margin-right:-3px!important;}
.avatarTable01 td img{ width:100%; height:auto;}

.avatarBox01{ text-align:center; padding-bottom:3px; float:right; width:40%; padding-right:5px;}
.avatarBox01 li {}
.avatarBox01 li > a{ display: block; width:100%; margin-bottom: 1em;}


.columnWrap01{ width:100%; margin-bottom:20px;}
.columnTop01{ width:100%;  float:none;}
.boxTopMe{-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; background:#FEF080; padding:20px; margin-bottom:20px;}
.boxTopMe .course{ margin-bottom:5px;}
.boxTopMe .name{ font-weight:bold; font-size:20px; margin-bottom:10px;}
.boxTopMe .aBox{ border:#ccc 3px solid; background:#FFFFFF; width:100%; padding:o; text-align:center; float:none; margin-bottom:10px;}
.boxTopMe .aBox img{ width:100%;}

.boxTopMe .tBox{ float:none; width:100%;}
.boxTopMe  .lv{ background:#FED02C; font-weight:bold; }
.boxTopMe  dl.point{ border-bottom:#000000 1px dotted; padding-bottom:5px; margin-bottom:5px;}
.boxTopMe  dl.point dt{ float:left; line-height:20px; height:20px;}
.boxTopMe  dl.point dd{ float:right; }
.boxTopMe  dl.point dd span { font-size:20px; font-weight:bold;line-height:20px; height:20px;}
.boxTopMe .area{ margin-bottom:10px;}
.boxTopMe .area span{font-size:15px; font-weight:bold; margin-left:10px;}

.boxTopBox  .commentBox{ padding:10px;}

.commentArea .left{  left:0;}
.commentArea .right{right:0;}

.btOrange,.btGreen,.btSky,.btBlue { width:100%;}
/*
.reTable01 table {	display: block;	position: relative;	font-size:12px;	width:100%;border-right:solid 1px #AAAAAA;}
.reTable01 thead {display: block;	float: left;}
.reTable01 tbody {	display: block;	position: relative;	width: auto;	overflow-x: auto;	white-space: nowrap;}
.reTable01 thead th {display: block;}
.reTable01 tbody td {	display: block;}
.reTable01 tbody tr {	display: inline-block;}
.reTable01 th:not(:last-child) {border-bottom: none;}
.reTable01 td:not(:last-child) {	border-bottom: none;}
.reTable01 td {border-left: none;margin-left:-4px;}
.reTable01 td img{ width:15px; }
.reTable01 th.w01{ width:auto;}
.reTable01 th.w02{ width:auto;}
.reTable01 .iconTxt{padding: 0 0 0 20px;  position: relative;}
*/

.reTable02{ margin-bottom:20px;}


.reTable02 table, .reTable02 thead, .reTable02 tbody, .reTable02 th, .reTable02 td, .reTable02 tr { display: block; }
.reTable03 table, .reTable03 thead, .reTable03 tbody, .reTable03 th, .reTable03 td, .reTable03 tr { display: block; }

.reTable02 thead tr ,.reTable03 thead tr{ position: absolute;top: -9999px;left: -9999px;}
.reTable02 tr,.reTable03 tr  { border: 1px solid #000; }
.reTable02 td ,.reTable03 td{ border: none;border-bottom: 1px solid #000; position: relative;padding-left: 35%; }
.reTable02 td:before,.reTable03 td:before { position: absolute;top: 6px;left: 6px;width: 60%; padding-right: 10px; white-space: nowrap;}



.reTable02 td:nth-of-type(1):before { content: "学籍番号"; }
.reTable02 td:nth-of-type(2):before { content: "氏名"; }
.reTable02 td:nth-of-type(3):before { content: "所属"; }
.reTable02 td:nth-of-type(4):before { content: "アバター"; }

.reTable03 td:nth-of-type(1):before { content: "撮影日"; }
.reTable03 td:nth-of-type(2):before { content: "動画"; }
.reTable03 td:nth-of-type(3):before { content: "メモ"; }

.schBox{ margin:20px 0 0 0; background:#fff; padding:10px;}
.schBtn{ float:none;  padding:0; margin:0 0 10px; width:100%;}
.schBtn li{ font-size:15px; margin-right:0;}
.schBtn .day a{ background:#fff;-moz-border-radius: 5px;	-webkit-border-radius: 5px; border-radius:5px; color:#777; padding:5px 5px; float:left; border:#777777 1px solid;}
.schBtn  .prev a,.schBtn .next a{ background:#FFF;  border:#777777 1px solid; -moz-border-radius: 5px;	-webkit-border-radius: 5px; border-radius:5px; color:#FFFFFF; padding:4px 12px; float:left; display:block; color:#777777 ; margin-right:3px;}
.schBtn  .prev a:hover,.schBtn .next a:hover{ background:#eee;}


.period{ float:left; line-height:20px; line-height:30px;  display:block; }
.icon_type{ float:none;}
.icon_type img{vertical-align:middle; margin-right:5px; width:15px; }

}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 768px) and (max-width: 960px) {

.gridContainer {	max-width: 1232px;	width: 98%;	padding-left:1%;	padding-right: 1%;	margin: auto;	clear: none;	float: none;	margin-left: auto;}

 .movieBtn{ width:30%; margin:0 auto;}

.avatarWrap01{ width:45%; float:left;}
.avatarDraw{ border:#FFD92D 5px solid; background:#FFFFFF; padding:10px; text-align:center;display:table; width:100%; height:350px; margin-bottom:20px;}
.avatarDraw > *{
    display:table-cell;
    vertical-align: middle;
}

.avatarWrap02{ width:50%; float:right;}
ul.parts{ overflow:hidden; zoom:_1; width:100%;}
ul.parts li{ float:left; margin-right:1%; margin-bottom:5px;}
ul.parts li a{ display:block; color:#000; border:#AAA 1px solid; background:#FCF8E2; text-align:center; width:5em; padding:5px 2px; -moz-border-radius: 5px;	-webkit-border-radius: 5px; border-radius:5px; }
ul.parts li a:hover{background:#FFDB00;display:block;}
ul.parts li a.on{ background:#FFDB00;}

.avatarTable01{ width:100%; border-collapse: collapse; margin-bottom:10px;}
.avatarTable01 td{ vertical-align: middle; text-align:center; border: 1px solid #AAA; padding: 6px; width:33%;  background:#fff;}
.avatarTable01 td img{ width:100%; height:auto;}

.avatarBox01{ text-align:center; padding-bottom:3px;}
.avatarBox01 li {  display: inline; margin-right:2px;}
.avatarBox01 li > a{ display: inline-block; }



.columnWrap01{ width:104%; margin: 20px -2% 20px 0; overflow:hidden; zoom:_1;}
.columnTop01{ width:31%; margin-right:2%; float:left;}
.boxTopMe{-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; background:#FEF080; padding:20px; margin-bottom:20px;}
.boxTopMe .course{ margin-bottom:5px;}
.boxTopMe .name{ font-weight:bold; font-size:20px; margin-bottom:10px;}
.boxTopMe .aBox{ border:#ccc 3px solid; background:#FFFFFF; width:100%; padding:0; text-align:center; float:none; margin-bottom:10px;}
.boxTopMe .tBox{ float:none; width:100%;}
.boxTopMe  .lv{ background:#FED02C; font-weight:bold; }
.boxTopMe  dl.point{ border-bottom:#000000 1px dotted; padding-bottom:5px; margin-bottom:5px;}
.boxTopMe  dl.point dt{ float:left; line-height:20px; height:20px;}
.boxTopMe  dl.point dd{ float:right; }
.boxTopMe  dl.point dd span { font-size:20px; font-weight:bold;line-height:20px; height:20px;}
.boxTopMe .area{ margin-bottom:10px;}
.boxTopMe .area span{font-size:15px; font-weight:bold; margin-left:10px;}

.boxTopBox  .commentBox{ padding:10px;}

.reTable01 td{ background:#FFFFFF;}

.reTable01 .iconTxt{padding: 0 0 0 35px;  position: relative;}
.reTable01 .iconTxt img{position: absolute; left: 0px; top:0px;
}
.schBtn .day a{ padding:5px 10px;}
.schBtn  .prev a,.schBtn .next a{padding:4px 12px; }


.btOrange,.btGreen,.btSky,.btBlue { width:100%;}
}