@charset "utf-8";
/*-------------------- Body,Head --------------------*/
body{
    -webkit-text-size-adjust: 100%; font-size:10px; font-size:1.0rem;
    background-color:white;
    font-family:'Helvetica','Arial','メイリオ',Arial,Meiryo,'Noto Sans JP';
}
*{ margin:0; padding:0; -webkit-text-size-adjust: 100%;}
#whole{ width:100%; margin:0 auto; padding:0px; background-color:white;}

/*===== PC */
@media screen and (min-width: 500px){

}
/*===== Mobile */
@media screen and (max-width: 500px){
    body{ font-size:14px;}
    html{}
}

/* -------------------- Header --------------------*/
#header{
    overflow:hidden;
    height:60px;
    padding:0px; vertical-align: middle; text-align:center; color:white;
    background: #2255bb; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #113377, #2255bb); /* For Safari 5.1 to 6.0 */
    background: -moz-linear-gradient(bottom, #113377, #2255bb); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom, #113377, #2255bb);
}

/*===== PC */
@media screen and (min-width: 500px){
    #hdleft{ float:left; text-align:center; height:60px; width:100%; padding-left:60px; margin-right:-60px; padding-right:60px;box-sizing: border-box;}
    #menuswitch{ background-color:#3366cc; float:right; height:60px;line-height:60px; text-align:center; width:60px; min-width:60px; cursor: pointer;}
    .submenu:before{ content:"MENU";}
    #submenu {
        position:absolute; right:0px; top:60px; background:#25b;
        padding:10px 30px 10px 30px;
        visibility:hidden;
        color:white;
    }
    #submenu P{margin:0.6rem 0px;}
    #submenu A{color:white !important;}

#header h1 {/*color:#e8f8ff;*/color:#eee; font-size:26px; font-weight:100;height:60px; line-height:60px; vertical-align:middle;}
#hdleft h1 {/*color:#e8f8ff;*/color:#eee; font-size:26px; font-weight:100;height:60px; line-height:60px; vertical-align:middle;}


}
/*===== Mobile */
@media screen and (max-width: 500px){
    #header{ height:50px;}
    #header h1{ line-height:50px; font-size:22px;}
    #hdleft{ float:left; text-align:center; height:50px; padding-left:30px; margin-right:-30px; padding-right:30px; box-sizing:border-box; width:100%;}
    #hdleft P#l { font-size:26px; font-weight:600; height:50px; line-height:50px; vertical-align:middle;}
    #menuswitch{  background-color:#3366cc; float:right; height:50px;line-height:50px; text-align:center; width:30px; min-width:30px;}
    .submenu:before{ content:"≣";}
    #submenu {
        position:absolute; right:0px; top:50px; background:#25b;
        padding:10px 30px 10px 30px;
        visibility:hidden;
        color:white;
    }
    #submenu P{margin:0.6rem 0px;}
    #submenu A{color:white !important;}

    #header h1 {/*color:#e8f8ff;*/color:#eee; font-size:18px; font-weight:bold; height:50px; line-height:50px; vertical-align:middle;}
    #hdleft h1 {/*color:#e8f8ff;*/color:#eee; font-size:18px; font-weight:bold; height:50px; line-height:50px; vertical-align:middle;}

}

/* -------------------- Cover --------------------*/
#coverimage{
    width:100%; text-align:center;
    background: #eeeeee; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #ffffff, #eeeeee); /* For Safari 5.1 to 6.0 */
    background: -moz-linear-gradient(bottom, #ffffff, #eeeeee); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom, #ffffff, #eeeeee);
}
#covermessage{
    width:100%; text-align:center;
    background: #2255bb; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #113377, #2255bb); /* For Safari 5.1 to 6.0 */
    background: -moz-linear-gradient(bottom, #113377, #2255bb); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom, #113377, #2255bb);
}
#coverimage img{
    width:100%; border-radius:6px; padding:2px 0px;
}

/*===== PC */
@media screen and (min-width: 500px){
    #coverimage img{ max-width:500px;}
    #covermessage{ padding:5px 0px;}
    #covermessage P{ font-size:0.9rem; font-weight:100;color:white;}
}
/*===== Mobile */
@media screen and (max-width: 500px){
    #coverimage img{ min-width:100%;}
    #covermessage{ padding:10px 0px;}
    #covermessage P{ font-size:0.7rem; line-height:0.8rem; font-weight:100; padding:0px 10px; color:white;}
}



/* -------------------- Contents --------------------*/
.mainbox P{ text-indent:1em;}
.mainbox h3{ border-radius:0px; font-weight:normal !important;/*font-weight:bold !important;*/ padding:0px 4px 0px 8px;}
.mainbox h4{ font-weight:bold !important;}
.mainbox h4:before{ content:"「";}
.mainbox h4:after{ content:"」";}

.mainbox A{
    font-weight:normal; color:#00f; text-decoration:none;
    border-width:0px 0px 2px 0px; border-color:#6cf; border-style:solid;
}

DIV[type^="column"] h3{
  color:#f8fff8;
  background:#0a6;
/*  background: #fcfffc; /* For browsers that do not support gradients */
/*  background: -webkit-linear-gradient(right, #f0fff0, #fcfffc); /* For Safari 5.1 to 6.0 */
/*  background: -moz-linear-gradient(top, #f0fff0, #fcfffc); /* For Firefox 3.6 to 15 */
/*  background: linear-gradient(to top, #f0fff0, #fcfffc);*/
}
DIV[type="factory"] h3{ color:#c72;}
DIV[type="alumni"] h3{
  color:#f60;
  background: #fff8e0; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(right, #fff8e0, #ffffff); /* For Safari 5.1 to 6.0 */
  background: -moz-linear-gradient(top, #fff8e0, #ffffff); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to top, #fff8e0, #ffffff);
}
DIV[type='etc'] h3{ color:#333;}
DIV[type='news'] h3{
   color:#f8f8ff;
   background:#04b;
/*   background: #f4fcff; /* For browsers that do not support gradients */
/*   background: -webkit-linear-gradient(right, #e0e8ff, #f4fcff); /* For Safari 5.1 to 6.0 */
/*   background: -moz-linear-gradient(top, #e0e8ff, #f4fcff); /* For Firefox 3.6 to 15 */
/*   background: linear-gradient(to top, #e0e8ff, #f4fcff);*/
 }
DIV[type='teacherm'] h3{
  margin:0px 0px 2px 0px;
  color:#06d;
  background: #e0f0ff; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(right, #e0f0ff, #ffffff); /* For Safari 5.1 to 6.0 */
  background: -moz-linear-gradient(top, #e0f0ff, #ffffff); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to top, #e0f0ff, #ffffff);
}
DIV[type='teachere'] h3{ color:#06d;}

DIV[type^="column"] h4{ color:#0a3;}
DIV[type="factory"] h4{ color:#c72;}
DIV[type="alumni"] h4{ color:#0a3;}
DIV[type='etc'] h4{ color:#333;}
DIV[type='news'] h4{ color:#02c;}
DIV[type='teacherm'] h4{ color:#02c;}
DIV[type='teachere'] h4{ color:#02c;}

DIV[type^="column"]{
/*    background: #f0fff0; /* For browsers that do not support gradients */
/*    background: -webkit-linear-gradient(right, #f0fff0, #fcfffc); /* For Safari 5.1 to 6.0 */
/*    background: -moz-linear-gradient(top, #f0fff0, #fcfffc); /* For Firefox 3.6 to 15 */
/*    background: linear-gradient(to top, #f0fff0, #fcfffc);*/
      background: white;
}
DIV[type="factory"]{
    background: #f0e8e0; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(right, #f0e8e0, #fff8f0); /* For Safari 5.1 to 6.0 */
    background: -moz-linear-gradient(top, #f0e8e0, #fff8f0); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to top, #f0e8e0, #fff8f0);
}
DIV[type="alumni"]{
/*    background: #f0fff0; /* For browsers that do not support gradients */
/*    background: -webkit-linear-gradient(right, #f0fff0, #fcfffc); /* For Safari 5.1 to 6.0 */
/*    background: -moz-linear-gradient(top, #f0fff0, #fcfffc); /* For Firefox 3.6 to 15 */
/*    background: linear-gradient(to top, #f0fff0, #fcfffc);*/
  background: white;
}
DIV[type="etc"]{
background: #e8e8e8;
}
DIV[type="news"]{
/*    background: #d0e0ff; /* For browsers that do not support gradients */
/*    background: -webkit-linear-gradient(right, #e8e8ff, #ffffff); /* For Safari 5.1 to 6.0 */
/*    background: -moz-linear-gradient(top, #e8e8ff, #ffffff); /* For Firefox 3.6 to 15 */
/*    background: linear-gradient(to top, #e8e8ff, #ffffff);*/
      background: white;
}
DIV[type="teacherm"]{
/*    background: #d0e0ff; /* For browsers that do not support gradients */
/*    background: -webkit-linear-gradient(right, #f0f0ff, #ffffff); /* For Safari 5.1 to 6.0 */
/*    background: -moz-linear-gradient(top, #f0f0ff, #ffffff); /* For Firefox 3.6 to 15 */
/*    background: linear-gradient(to top, #f0f0ff, #ffffff);*/
    background:white;
}
DIV[type="teachere"]{
    background: #d0e0ff; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(right, #f0f0ff, #ffffff); /* For Safari 5.1 to 6.0 */
    background: -moz-linear-gradient(top, #f0f0ff, #ffffff); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to top, #f0f0ff, #ffffff);
}

.date{ font-size:0.6rem; color:#6be !important; margin-left:10px; font-weight:normal;}
.date:before{ content:"(";}
.date:after{ content:"更新)";}

.alumyear{ font-size:0.8rem; color:#d50 !important; margin-left:10px; font-weight:normal;}
.alumyear:before{ content:"【";}
.alumyear:after{ content:"年度卒業】";}


.fullpage{ color:#00f; text-decoration:none; }
.fullpage:before{ content:"";}
.fullpage:after{ content:"続きを読む >>";}


DIV[type^="teacher"] .key{font-weight:600; color:#04c;}
DIV[type^="teacher"] .key:before{ content:"■";}
DIV[type^="teacher"] .key:after{ content:"：";}

.pagenow {font-weight:bold; color:#fff0c0;}



/*===== PC */
@media screen and (min-width: 500px){
    #contents{ overflow:hidden; text-align:center; background-color:white; font-size:0.9rem;}
    .mainbox{
        width:340px; margin:5px; padding:10px; text-align:left; vertical-align:top;
        word-wrap:break-word; display:inline-block;
        background: #ffffff;
        box-shadow: 2px 2px 5px rgba(100,100,100,0.4);border-radius: 3px;
        border-width:1px;border-color:#ccc;border-style:solid;
    }

    DIV[type^="teacher"] IMG{ max-width:150px;}
    DIV[type^="teacher"] ul{ padding:0px 0px 0px 0px; list-style-type:none; font-size:0.9rem;}

    DIV[type="columnwide"] {width:800px !important;}
    .mainbox h3{ font-size:1.1rem; font-weight:600;}
    .mainbox h4{ font-size:1rem; font-weight:300;}
    .mainbox P{ line-height:1.7rem; font-weight:100; padding:0px 0px 0.9rem 0px;}
    .mainbox br.after {content:"　";}
}
/*===== Mobile */
@media screen and (max-width: 500px){
    #contents{ overflow:hidden; text-align:center; background-color:white; font-size:1rem; margin:0px 5px;}
    .mainbox{
        width:100%; min-width:100%; margin:5px 0px 0px 0px; padding:0px 0px 10px 0px; text-align:left;
        word-wrap:break-word;
        background: #fffff8;
        border-radius: 3px;
    }

    DIV[type^="teacher"] IMG{ margin-left:10px; max-height:200px;}
    DIV[type^="teacher"] ul{ padding:0px 0px 0px 6px; list-style-type:none; font-size:1rem;}

    .mainbox h3{ font-size:1.1rem; padding: 5px 6px 5px 6px; font-weight:600;}
    .mainbox h4{ font-size:1rem; padding: 0px 6px 5px 6px; font-weight:300;}
    .mainbox P { padding:0px 6px 1rem 6px; line-height:1.5rem;}
}



/* -------------------- Footer --------------------*/
#footer{
    overflow:hidden;
    padding:0px;line-height:60px;
    vertical-align: middle; text-align:center;
    background:#2255bb; color:white;
}
#footer P{ font-size:11px; font-family:Arial;}
/*===== PC */
@media screen and (min-width: 500px){
}
/*===== Mobile */
@media screen and (max-width: 500px){
}


/* -------------------- ????????--------------------*/
/*===== PC */
@media screen and (min-width: 500px){

}
/*===== Mobile */
@media screen and (max-width: 500px){

}

/* -------------------- ????????--------------------*/
/*===== PC */
@media screen and (min-width: 500px){

}
/*===== Mobile */
@media screen and (max-width: 500px){

}

/* -------------------- ????????--------------------*/
/*===== PC */
@media screen and (min-width: 500px){

}
/*===== Mobile */
@media screen and (max-width: 500px){

}