﻿
/************************
*  基本設定
*************************/

* {
    font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    letter-spacing: .01rem;
}

html, body {
    margin: 0px;
    padding: 0px;
    height: 100%;
}

body {
    background-color: #fff;
}

#screen {
    width: 100%;
}

#screenContent {
    clear: both;
    width: 100%;
    margin: 0px;
    padding: 0px;
}

/************************
*  画面の共通実装 
*************************/

/* ヘッダ */
#screenHeader {
    width: 100%;
    height: 50px;
    /*background-color: #a94195;*/
    background-color: #555;
}

#headerContent {
    width: 900px;
    height: 50px;
    margin: 0px auto;
    padding: 10px 10px;
}

#headerContent img {
    float: left;
}

#headerContent #headerUtil {
    float: right;
    padding-top: 5px;
    color: #fff;
    font-size: small;
}

#headerUtil span {
    padding-left: 20px;
}

#headerUtil a {
    color: #555;
}

/* フッター */
#screenFooter {
    width: 100%;
    clear: both;
    color: #aaa;
    text-align: center;
    font-size: 0.8rem;
    margin-top: 40px;
    margin-bottom: 20px;
}

.splitViewRight .flashMessage {
    margin-top: 30px;
}

.singleView .flashMessage {
    margin: 30px auto 20px auto;
}

/* メイン表示欄 */

#mainContent {
    width: 100%;
    padding: 0px;
}

.contentBox {
    margin: 10px auto 30px auto;
    padding: 0px 40px 10px 40px;
    /*box-shadow: 0px 1px 8px 1px rgba(0, 0, 0, 0.1);*/
}

.singleView {
    width: 980px;
    margin: 0px auto;
}

.splitView {
    width: 1120px;
    margin: 0px auto;
}

.splitView .splitViewLeft {
    width: 900px;
    min-height: 550px;
    float: left;
}

.splitView .splitViewRight {
    width: 220px;
    float: left;
}

.splitViewRight .contentBox {
    width: 300px;
    padding: 20px 15px 30px 25px;
    /*position: fixed;*/
    background-color: #fff;
}


/*********************
* 入力欄 
**********************/

.itemTitle {
    color: #333;
}

/* 基本的 width は上書きしてしてください */
.itemInput input[type=text], .itemInput input[type=password],
.itemInput select, .itemInput textarea, .topContents select {
    border: 1px solid #ccc;
    padding: 5px 7px;
    border-radius: 4px 4px;
    overflow: hidden;
    background-color: #fafafa;
}

.itemInput input[type=text]:focus, .itemInput input[type=password]:focus,
.itemInput select:focus, .itemInput textarea:focus, .topContents select:focus {
    background-color: #ffffcc;
}

.clear {
    clear: both;
}

.menuTitle {
    color: #4195a9;
    width: 200px;
    margin-bottom: 18px;
    padding-left: 5px;
    padding-bottom: 8px;
    border-bottom: 1px solid #ddd;
}

/* itemXXX が menu の下にある場合 */
.menu .itemTitle {
    color: #666;
}

.menu .itemTitle {
    float: none !important;
    display: block !important;
    margin-top: 10px;
    margin-bottom: 5px;
    font-size: 0.8rem;
}

.menu .itemInput {
    float: none !important;
    display: block !important;
    margin-bottom: 5px;
}

.menu .itemInput input {
    width: 180px;
}

.menu .itemInput select {
    width: 190px;
}

.shortInput {
    width: 160px;
}

.middleInput {
    width: 220px;
}

.longInput {
    width: 660px;
}

/* ボタン */
.buttonBase {
    background-color: #fff;
    cursor: pointer;
    border-radius: 20px;
    padding: 5px 40px;
    text-align: center;
    font-size: 0.9rem;
}

.linkBase {
    background-color: #fff;
    cursor: pointer;
    border-radius: 20px;
    padding: 3px 25px;
    font-size: 0.8rem;
    text-align: center;
    text-decoration: none;
}

 #topContent .linkBase {
    padding: 5px 40px;
    font-size: 0.9rem;
     line-height: 32px;
 }

.submitApply, #mainContent a {
    border: 1px solid #4195a9;
    color: #4195a9;
}

.submitApply:hover, #mainContent a:hover {
    background-color: #4195a9;
    color: #fff;
}

.submitAppend, .submitUpdate {
    border: 1px solid #00AD2C !important;
    color: #00AD2C !important;
}

.submitAppend:hover, .submitUpdate:hover {
    background-color: #00AD2C !important;
    color: #fff !important;
}

.submitDelete, .submitIrreversible {
    border: 1px solid #ee5b34;
    color: #ee5b34;
}

.submitDelete:hover, .submitIrreversible:hover {
    background-color: #ee5b34;
    color: #fff;
}

/* menu の下にあるボタンは幅固定 */
.menu .buttonBase  {
    display: block;
    width: 200px !important;
    height: 34px;
    font-size: 0.9rem;
}

.menu .linkBase {
    display: block;
    width: 200px !important;
    padding: 5px 0px;
}

.itemElement ~ .buttonBase {
    margin-top: 20px;
}

a.textLink  {
    display: inline-block;
    text-decoration: underline;
    border: none !important;
    font-size: 0.9rem;
    margin-left: 5px;
}

a.textLink:hover {
    color: #4195a9 !important;
    background-color: #dcf7fa !important;
}

.topPageView {
    min-height: 400px !important;
}

.topPageView > h2 {
    width: 880px; 
    margin-bottom: 20px; 
    padding-bottom: 10px; 
    border-bottom: 1px solid #ddd;
}

.topPageView > .textLink {
    font-size: 1.1rem;
    line-height: 28px;
}

.topPageMessage {
    font-size:0.9rem; 
    color: #999;
}

/* 概要 */

.splitView h2, .singleView h2  {
    margin: 25px 0 0 0;
    padding: 0;
    font-size: 1.2rem;
    font-weight: normal;
    color: #555;
}

.splitView h3, .singleView h3 {
    margin: 10px 0;
    padding: 0px;
    font-size: 1rem;
    font-weight: normal;
    color: #666;
}

.overViewMessage {
     width: 850px; 
     border: 1px solid #ccc; 
     background-color: #fafafa; 
     padding: 15px; 
     margin: 10px 0px 20px 0px; 
     border-radius: 5px 5px; 
     color:#666; 
     font-size: 0.9rem;
}

.diplomaPolicyMessage {
     width: 850px; 
     border: 1px solid #ccc; 
     background-color: #fafafa; 
     padding: 15px; 
     margin: 10px 0px 20px 0px; 
     border-radius: 5px 5px; 
     color:#666; 
     font-size: 0.9rem;
     white-space: pre-line;
}

.curriculumPolicyMessage {
     width: 850px; 
     border: 1px solid #ccc; 
     background-color: #fafafa; 
     padding: 15px; 
     margin: 10px 0px 30px 0px; 
     border-radius: 5px 5px; 
     color:#666; 
     font-size: 0.9rem;
     white-space: pre-line;
}

.syllabusList {
    width: 890px;
}

.syllabusList td:first-child {
    text-align: left;
    width: 280px;
}

.syllabusList td:nth-child(3) {
    padding-left: 20px;
    width: 170px;
}

.syllabusList td:nth-child(4) {
    width: 170px;
}

.syllabusList .submitApply {
    display: inline-block !important;
    width: 140px !important;
}

.kamokuList {
    width: 890px;
}

.kamokuList td:first-child {
    text-align: left;
    width: 380px;
}

.kamokuList td:nth-child(2) {
    text-align: left;
    width: 150px;
}

.JitumuKeikenList {
    width: 890px;
}

.JitumuKeikenList td:first-child {
    text-align: left;
    width: 170px;
}

.JitumuKeikenList td:nth-child(2) {
    text-align: left;
    width: 280px;
}

.JitumuKeikenList td:nth-child(3) {
    width: 170px;
}

.JitumuKeikenkamokuList {
    width: 890px;
}

.JitumuKeikenkamokuList td:first-child {
    text-align: left;
    width: 280px;
}

.JitumuKeikenkamokuList td:nth-child(2) {
    text-align: left;
    width: 380px;
}

.JitumuKeikenkamokuSumList {
    width: 890px;
}

.JitumuKeikenkamokuSumList td:first-child {
    border-bottom: none;
    width: 280px;
}

.JitumuKeikenkamokuSumList td:nth-child(2) {
    border-bottom: none;
    width: 380px;
}

.JitumuKeikenkamokuSumList td:nth-child(3) {
    border-top: 1px solid #ddd;
}

.JitumuKeikenkamokuSumList td:nth-child(4) {
    border-top: 1px solid #ddd;
}

.searchResultWrapper .kamokuList td:first-child {
    width: 50px !important;
}

.searchResultWrapper .kamokuList td:nth-child(2) {
    width: 380px !important;
}

.searchResultWrapper .kamokuList td:nth-child(3) {
    text-align: left;
}

.historyBack {
    display: inline-block;
    margin: 15px 0px 30px 0px;
}

.cellSelector {
    vertical-align: top;
    border-collapse: collapse;
    margin-top: 20px;
    margin-bottom: 40px;
    color: #666;
}

.cellSelector th,
.cellSelector td {
    /*border-bottom: 1px solid #ddd;*/
    padding: 10px 20px;
    font-weight: normal;
    font-size: 0.9rem;
    border: 1px solid #ddd;
}

.cellSelector th {
    background-color: #fafafa;
}

.cellSelector .cellSelectorRow td:nth-child(1) {
    width: 180px;
}

.cellSelector a {
    border: none !important;
    text-decoration: none;
}

.cellSelector a:hover {
    border: none !important;
    color: #4195a9 !important;
    background-color: #dcf7fa !important;
    text-decoration: none;
}

.timetableList {
    width: 890px;
}

.timetableList td:first-child {
    text-align: left;
    width: 380px;
}

.timetableList th:first-child {
    width: 380px;
}

.timetableList .classCell {
    width: 150px;
}

.timetableList td.kyouinCell {
    text-align: left;
    width: 150px;
}

.timetableList th.kyouinCell {
    width: 150px;
}

.selectorList {
    width: 890px;
}

.selectorList td {
    text-align: left !important;
}

.syllabusContent table th,
.syllabusContent table td {
    /*border-bottom: 1px solid #ddd;*/
    padding: 10px;
    border: 1px solid #ddd;
}



.syllabusContent h3 {
    margin-bottom: 10px;
}

.syllabusContent > table {
    vertical-align: top;
    border-collapse: collapse;
    margin-top: 20px;
    margin-bottom: 40px;
    border: 1px solid #ddd;
    width: 820px;
}

.syllabusContent table th,
.syllabusContent table td {
    /*border-bottom: 1px solid #ddd;*/
    padding: 10px;
    border: 1px solid #ddd;
}

.syllabusContent table th {
    font-size: 0.9rem;
    font-weight: normal;
    color: #777;
    background-color: #fafafa;
    text-align: left;
    width:120px;
}

.syllabusContent table td {
    font-size: 0.9rem;
    font-weight: normal;
    color: #444;
}

.syllabusContent table th:nth-child(1) {
    width: 120px;
}

.syllabusContent h3 {
    border-bottom: 1px solid #ddd;
    padding: 5px 10px;
}

.preformatted td {
    white-space: pre-line;
    padding: 10px 35px 10px 20px !important;
}

.syllabusWrapper {
    width: 830px;
    margin: 0px auto;
}

.autolink a {
    border: none !important;
    color: #4195a9 !important;
}

.autolink a:hover {
    border: none !important;
    color: #4195a9 !important;
    background-color: #dcf7fa !important;
}

.shedule {
    width: 200px;
    word-break: break-all;
}

/* テーブル共通 */

.listTable {
    border-collapse: separate;
    border-spacing: 0px;
    text-align: left;
    padding: 0px;
}

.listTable td, .listTable th {
    border-bottom: 1px solid #ddd;
    padding: 8px 10px;
    text-align: left;
    color: #666;
    font-size: 0.9rem;
    white-space: nowrap;
    font-weight: normal;
}

.listTable th {
    color: #4195a9;
    font-weight: normal;
    font-size: 0.9rem;
    background-color: #fff;
    text-align: center;
}

.listTable td {
    background-color: #fff;
    text-align: center;
}

.listTable td:nth-child(1) {
    padding-left: 20px;
}

.listTable td:last-child {
    padding-right: 20px;
}

.listTable tr:hover td {
    background-color: #f9f9f9;
}

#element
{
    width:570px;
}
#add
{
    width:560px;
}
.dpcpView h3 {
    color: #4195a9;
    margin-top: 20px;
    margin-bottom: 5px;
    padding-left: 5px;
    padding-bottom: 8px;
    font-size: 1.2rem;
}

.dpcpTable {
    border-collapse: collapse;
    margin-bottom: 50px;
}

.dpcpTable th {
    width: 230px;
    padding: 20px 10px;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    color: #666;
    font-weight: normal;
}

.dpcpTable td {
    padding: 20px 10px 30px 10px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    color: #666;
}

.dpcpTable div {
    width: 610px; 
    font-size: 0.9rem; 
    white-space: pre-line;
}

.dpcp {
    border: 1px solid #00AD2C !important;
    color: #00AD2C  !important;
    cursor: pointer;
    border-radius: 30px;
    padding: 3px 15px !important;
    text-align: center;
    font-size: 0.7rem !important;
    text-decoration: none;
}

.dpcp:hover {
    color: #fff !important;
    background-color: #00AD2C  !important;
}

.diagram {
    border: 1px solid #4195a9 !important;
    color: #4195a9  !important;
    cursor: pointer;
    border-radius: 30px;
    padding: 3px 20px !important;
    text-align: center;
    font-size: 0.8rem !important;
    text-decoration: none;
}

.diagram:hover {
    color: #fff !important;
    background-color: #4195a9  !important;
}

/* 印刷用の設定 */
@media only print {
    * {
        font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
        font-size: 12pt;
        color: #000 !important;
    }
    .linkBase {
        display: none !important;
    }
    .syllabusContent td, .syllabusContent th {
        padding: 0px 2px !important;
        border-color: #000 !important;
    }
    h3 {
        border-color: #000 !important;
    }
    #screenHeader {
        display: none;
    }
    .splitViewRight {
        display: none;
    }
    .splitView {
        width: 980px !important;
        margin: 0px auto !important;
        border: 1px solid transparent;
    }
    .splitViewLeft, .syllabusWrapper {
        width: 830px !important;
        margin: 0px auto !important;
        float: none !important;
        border: 1px solid transparent;
    }
    .preformatted {
        margin-bottom: 20px !important;
    }
    /* #dpcpRow, #diagramRow, 2019年改修により対象外*/ #screenFooter {
        display: none;
    }
    #dpcpRow, #diagramRow{
        height: 40px !important;
    }
    #mainContent {
        border: 1px dotted transparent;
    }
    #screenContent {
        border: 1px solid transparent;
    }
}
