/* ************************************************** */
/*                                                    */
/* CSS for CPSY web                                   */
/*                            by T.Tsumura (2017.02)  */
/*                                                    */
/* ************************************************** */

/* --------------------------------------------------
   base
-------------------------------------------------- */

html { 
    font-size: 62.5%;
}

@media (min-width: 1280px) {
    html { 
        font-size: 75.0%;
    }
}

body { 
    font-family: 'Lato', 'Noto Sans JP', sans-serif;
    font-size: 1.4rem;
    background-color: #fcfcfc;
    color: #333;
    line-height: 1.65;
    line-height: 1.8;
    font-weight: 400;
}

body,html{
    height: 100%;
/*  font-feature-settings: "palt", "kern", "hkna", "liga"; */
}


/* --------------------------------------------------
   main contents
-------------------------------------------------- */

.main{
    margin: 0;
    padding: 0;
    margin-bottom: 6.4rem;
}

.main div.section { 
    min-height: 100vh;
/*  padding-top: 50px; */
}

.main div.section p { 
    margin: 2px 20px 2px 20px;
    text-indent: 1rem;
}

/* --------------------------------------------------
   navbar
-------------------------------------------------- */

nav.sidebar, .main{
    webkit-transition: margin 200ms ease-out;
    moz-transition: margin 200ms ease-out;
    o-transition: margin 200ms ease-out;
    transition: margin 200ms ease-out;
}

a.navbar-brand { 
    font-family: 'Crimson Text', serif;
    font-size: 3.0rem;
    letter-spacing: 0;
    text-shadow: 0 -1px 10px rgba(255,255,255,0.2),
	1px 0 10px rgba(255,255,255,0.2),
	1px 0 10px rgba(255,255,255,0.2);
}

nav.sidebar ul.navbar-nav li.copy { 
    text-align: center;
    font-size: 1.0rem;
    font-weight: normal;
    letter-spacing: 0;
}

.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus { 
    background-color: #428bca;
}

.newcount {
    font-size: 1.0rem;
    line-height: 1.2rem;
    display: inline-block;
    margin: 0;
    padding: 0;
    text-align: center;
    vertical-align: middle;
    position: absolute;
    top: 1.0rem;
    right: 1.2rem;
    text-indent: 0;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 0.6rem;
    background-color: #ff8c00;
/*  background-color: #e57e00; */
    color: #fff;
}


/* --------------------------------------------------
   for all display
-------------------------------------------------- */

/* --------------------------------------------------
   for small display
-------------------------------------------------- */

@media (max-width: 1280px) { 
    table#upcoming td span.year {
        display: none;
    }
}


/* --------------------------------------------------
   for middle-width display
-------------------------------------------------- */

@media (min-width: 765px) {
    .main{
        position: absolute;
/*
        width: calc(100% - 40px); 
        margin-left: 40px;
*/
/*      width: calc(100% - 200px);  */
        width: calc(100% - 20rem); 
/*      margin-left: 200px; */
        margin-left: 20rem;
        float: right;
    }

    .main h1.header { 
        font-size: 3.2rem;
    }

    nav.sidebar:hover + .main{
/*      margin-left: 200px; */
        margin-left: 20rem;
    }

    nav.sidebar.navbar.sidebar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
        margin-left: 0;
    }

    nav.sidebar .navbar-brand, nav.sidebar .navbar-header{
        text-align: center;
        width: 100%;
        margin-left: 0;
    }

    nav.sidebar a{
        padding-right: 13px;
    }

    nav.sidebar .navbar-nav > li:first-child{
        border-top: 1px #e5e5e5 solid;
        border-style: none;
    }

    nav.sidebar .navbar-nav > li{
        border-bottom: 1px #e5e5e5 solid;
        border-style: none;
    }

    nav.sidebar .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        webkit-box-shadow: none;
        box-shadow: none;
    }

    nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{
        padding: 0 0 0 0;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
        color: #777;
    }

    nav.sidebar{
/*      width: 200px; */
        width: 20rem;
        height: 100%;
/*
        margin-left: -160px;
*/
        margin-left: 0;
        float: left;
        margin-bottom: 0;
        position: fixed;
    }

    nav.sidebar li {
        width: 100%;
    }

    nav.sidebar:hover{
        margin-left: 0;
    }

    .forAnimate{
        opacity: 0;
    }

    
    div.section { 
        padding-top: 0;
    }

/*
    col.venue { 
        width: 0px;
        visibility: collapse;
        overflow: hidden;
    }
*/

}

/* --------------------------------------------------
   for wide display
-------------------------------------------------- */

/* @media (min-width: 1330px) { */
@media (min-width: 1280px) {

/*
    html { 
        font-size: 75.0%
    }
*/

    .main{
        margin-left: 240px;
        width: calc(100% - 240px);
    }

    nav.sidebar:hover + .main { 
        margin-left: 240px;
    }

    nav.sidebar{
        width: 240px;
        height: 100%;
        margin-left: 0;
        float: left;
        margin-bottom: 0;
        position: fixed;
    }

    nav.sidebar .forAnimate{
        opacity: 1;
    }

    div.section { 
        padding-top: 0;
    }

}

/* ------------------------------------------------------------- */

nav.sidebar .navbar-nav .open .dropdown-menu>li>a:hover, nav.sidebar .navbar-nav .open .dropdown-menu>li>a:focus {
    color: #CCC;
    background-color: transparent;
}

/*
nav:hover .forAnimate{
    opacity: 1;
}
*/

section{
    padding-left: 15px;
}


/* ------------------------------------------------------------- */

ul.navbar-nav li.child a { 
    padding-left: 3.0rem;
}

ul.navbar-nav i.fa { 
    float: right !important;
}

nav.sidebar.navbar { 
    background-color: #5f6d7e;
    background-color: #063060;
    background-color: #31708f;
    background-color: #2a6496;
    color: #fff;
    font-weight: bold;
    font-size: 1.6rem;
    letter-spacing: 0.2rem;
}

nav.sidebar.navbar a { 
    color: #fff;
}

nav.sidebar.navbar ul.navbar-nav hr { 
    border-color: rgba(0,0,0,0.1);
    border-width: 1px;
    border-style: solid;
}

.navbar .nav > li > a:active { 
    background-color: #495461;
}
.navbar .nav > li > a:active:hover { 
    background-color: #495461;
}
.navbar .nav > li > a:focus { 
    background-color: #495461 !important;
    background-color: rgba(0,0,0,0.2) !important;
}

.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus { 
    background-color: #495461 !important;
    background-color: rgba(0,0,0,0.2) !important;
/*
    color: #c4e3f3 !important;
    color: #5bc0de !important;
    color: #f0ad4e !important;
*/
}


nav.sidebar.navbar li a { 
    box-sizing: border-box;
    border-left: solid 5px rgba(0,0,0,0);
}

nav.sidebar.navbar li.active a:after,
nav.sidebar.navbar li.active a:focus:after,
nav.sidebar.navbar li.active a:hover:after,
nav.sidebar.navbar li a:hover:after { 
    font-family: 'FontAwesome';
    font-size: 1.2rem;
    content: ' \f054';
    vertical-align: top;
}


nav.sidebar.navbar li.active a#ref-info,
nav.sidebar.navbar li.active a#ref-info:focus,
nav.sidebar.navbar li.active a#ref-info:hover { 
    color: #fac8ff !important;
    border-color: #fac8ff;
}

nav.sidebar.navbar li.active a#ref-sched,
nav.sidebar.navbar li.active a#ref-sched:focus,
nav.sidebar.navbar li.active a#ref-sched:hover { 
    color: #ffc0cb !important;
    border-color: #ffc0cb;
}

nav.sidebar.navbar li.active a#ref-award,
nav.sidebar.navbar li.active a#ref-award:focus,
nav.sidebar.navbar li.active a#ref-award:hover { 
    color: #ffe799 !important;
    border-color: #ffe799;
}

nav.sidebar.navbar li.active a#ref-apply,
nav.sidebar.navbar li.active a#ref-apply:focus,
nav.sidebar.navbar li.active a#ref-apply:hover { 
    color: #fafaaf !important;
    color: #affaaf !important;
    border-color: #affaaf;
}

nav.sidebar.navbar li.active a#ref-comm,
nav.sidebar.navbar li.active a#ref-comm:focus,
nav.sidebar.navbar li.active a#ref-comm:hover { 
    color: #98fb98 !important;
    color: #affbfa !important;
    border-color: #affbfa;
}

nav.sidebar.navbar li.active a#ref-about,
nav.sidebar.navbar li.active a#ref-about:focus,
nav.sidebar.navbar li.active a#ref-about:hover { 
    color: #87cefa !important;
    color: #cecefa !important;
    border-color: #cecefa;
}


.navbar .nav > li > a:hover { 
    background-color: #5b6878;
    background-color: rgba(0,0,0,0.3);
    border-color: #fff;
}

.navbar { 
    box-shadow: 1px -1px 3px 3px rgba(95,109,126,0.4);
    box-shadow: 1px -1px 3px 3px rgba(95,109,192,0.4);
}





.main h1.header { 
    margin: 0;
    padding: 20px;
/*  background-color: #ffcefa; */
    font-size: 3.0rem;
/*  border: solid; */
/*  background-image: url(../img/blue-decimal-system.jpg); */
    background-image: url(../img/blue-decimal-system-bg.jpg);
/*  background-position: -500px; */
    background-position: -400px;
    color: #fff;
    text-shadow: 0 -1px 1px #000, -1px 0 1px #000, 1px 0 1px #000;
    font-weight: 700;
    font-feature-settings: "palt", "kern", "hkna", "liga" !important;
}

.main h1.header small { 
/*  font-family: 'Crimson Text', serif; */
    color: #ddd;
    font-weight: bold;
}

.main h1.header .parent { 
    font-size: 2.4rem;
}

.main h1.header a { 
    color: #fff;
    text-decoration: none;
}

.main h1.header a:hover { 
    color: #fff;
    text-decoration: underline;
}

.main h2 { 
    padding: 20px;
 /* background-color: #ffcefa; */
    font-size: 2.4rem;
    font-weight: bold;
}

.main h2 small { 
/*
    font-family: 'Alex Brush', 'Roboto', 'Noto Sans Japanese', sans-serif;
    font-family: 'Blenda Script', 'Roboto', 'Noto Sans Japanese', sans-serif;
    font-family: 'Pattaya', 'Roboto', 'Noto Sans Japanese', sans-serif;
    font-size: 1.8rem;
    color: #999;
    margin-left: 0.5rem;
*/
}

div.section h3 { 
    margin-left: 20px;
}

/* --------------------------------------------------
   panel
-------------------------------------------------- */

div.section div.panel { 
    margin-left: 20px;
    margin-right: 10px;
    margin-bottom: 30px;
}

.panel-heading { 
    font-weight: bold;
    font-size: 1.6rem;
}

.main div.section .panel p { 
    margin: 0;
    text-align: justify;
    text-justify: inter-ideograph;
    text-align-last: left;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* --------------------------------------------------
   div#info
-------------------------------------------------- */

div#info div.col-lg-3 { 
    padding: 0;
}

/*
div.info div.panel-heading:before { 
    font-family: 'FontAwesome';
    content: '\f0a1   ';
}
*/

div#info div.panel-body { 
    margin-top: 0;
}

div#info .panel-footer { 
    text-align: right;
}

div#info .panel-footer:before { 
    font-family: 'FontAwesome';
    content: '\f0a4 ';
}

div#info div.panel-heading span.date { 
    float: right;
    font-size: 1.4rem;
    vertical-align: bottom;
}

div#info div.panel-heading .new { 
    margin-right: 2px;
    padding: 0 2px 0 2px;
}

.media img { 
    height: 128px;
    width: 128px;
    border-radius: 64px;
    -webkit-border-radius: 64px;
    -moz-border-radius: 64px;
/*
    box-shadow: 1px -1px 3px 3px rgba(95,109,126,0.4);
*/
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
    box-shadow: 0 0 10px rgba(95,109,192,0.4)
}


.media img:after { 
    content: '';
    position: absolute;
    display: block;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset 0 0 50px rgba(0,0,0,0.5), inset 0 0 100px rgba(0,0,0,0.2);
}

/* --------------------------------------------------
   div#sched
-------------------------------------------------- */

div#sched table.schedule tr.current { 
    background-color: #dff0d8;
}
div#sched table.schedule tr.upcoming { 
    background-color: #fcf8e3;
    background-color: #fffff6;
}

div#sched      table.schedule col.type,
div#past-sched table.schedule col.type { 
    width: 9.0rem;
}
div#sched      table.schedule col.name,
div#past-sched table.schedule col.name { 
    width: 33%;
}

div#past-sched table.schedule col.status { 
    overflow: hidden;
    visibility: collapse;
}

/*
td.mtg, td.event, td.coop { 
    font-size: 1.2rem;
}
*/

td.mtg:before { 
    font-family: 'FontAwesome';
    display: inline-block;
    font-size: 1.6rem;
    width: 2.0rem;
    height: 2.0rem;
    margin-right: 2px;
    text-align: center;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    color: #d9534f;
/*    background-color: #ebccd1; */
    content: '\f0e6 ';
}
td.event:before { 
    font-family: 'FontAwesome';
    content: '\f11d ';
    display: inline-block;
    font-size: 1.6rem;
    width: 2.0rem;
    height: 2.0rem;
    margin-right: 2px;
    text-align: center;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    color: #f0ad4e;
/*    background-color: #faebcc; */
}
td.coop:before { 
    font-family: 'FontAwesome';
    content: '\f2b5 ';
    display: inline-block;
    font-size: 1.4rem;
    width: 2.0rem;
    height: 2.0rem;
    margin-right: 2px;
    text-align: center;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
/*    background-color: #d6e9c6; */
    color: #5cb85c;
}

div#sched table .label {
    font-size: 1.4rem;
    padding: 0 2px 0 2px;
}
div#sched table .open:before { 
    font-family: 'FontAwesome';
    content: '\f14b  ';
    content: '\f040  ';
    content: '\f044  ';
    content: '\f109  ';
    color: #ffd700;
    font-weight: normal;
}
div#sched table .socialopen:before { 
    font-family: 'FontAwesome';
    content: '\f0f5  ';
    color: #ffd700;
    font-weight: normal;
}
div#sched table .attendopen:before { 
    font-family: 'FontAwesome';
    content: '\f2c1  ';
    color: #ffd700;
    font-weight: normal;
}
div#sched table .closed:before { 
    font-family: 'FontAwesome';
    content: '\f05e  ';
    color: #933;
}
div#sched table .notyet:before { 
    font-family: 'FontAwesome';
    content: '\f017  ';
    color: #999;
}

/* --------------------------------------------------
   div#award
-------------------------------------------------- */

div#award table .name { 
    width: 10.0rem;;
}
div#award table .affi { 
    width: 20%;
}

div#award table .month { 
    min-width: 14.0rem;
}

@media only screen and (max-width: 640px) { 
    #unseen table td:nth-child(4) {  display: none; }
}


/* --------------------------------------------------
   div#apply
-------------------------------------------------- */

table#upcoming col.type { 
    width: 14rem;
}

table#upcoming col.deadline { 
    width: 10rem;
}
table#upcoming col.remaindays { 
    width: 10rem;
}

table#upcoming col.deadline,
table#upcoming col.remaindays { 
    background: #fff3f3;
}

table#upcoming tr:hover { 
    background-color: #fffff6;
    background-color: rgba(255,192,192,0.2);
    background-color: rgba(192,224,255,0.2);
}

table#upcoming tr.outdated { 
    visibility: collapse;
}

table#upcoming td.today { 
    font-weight: bold;
    color: #d9534f;
}

table#upcoming td.oral:before,
table#upcoming td.poster:before { 
    display: inline-block;
    font-size: 1.4rem;
    width: 2.0rem;
    height: 2.0rem;
    border-radius: 1rem;
    background-color: #d9534f;
    color: #fff;
    margin-right: 2px;
    text-align: center;
    font-family: 'FontAwesome';
    content: '\f044  ';
    content: '\f109  ';
    font-weight: normal;
}
table#upcoming td.paper:before { 
    display: inline-block;
    font-size: 1.4rem;
    width: 2.0rem;
    height: 2.0rem;
    border-radius: 1rem;
    background-color: #d9534f;
    color: #fff;
    margin-right: 2px;
    text-align: center;
    font-family: 'FontAwesome';
    content: '\f040  ';
    font-weight: normal;
}
table#upcoming td.social:before { 
    display: inline-block;
    font-size: 1.4rem;
    border-radius: 1rem;
    background-color: #f0ad4e;
    color: #fff;
    width: 2.0rem;
    height: 2.0rem;
    margin-right: 2px;
    text-align: center;
    font-family: 'FontAwesome';
    content: '\f0f5  ';
    font-weight: normal;
}
table#upcoming td.accom:before { 
    display: inline-block;
    font-size: 1.4rem;
    border-radius: 1rem;
    background-color: #f0ad4e;
    color: #fff;
    width: 2.0rem;
    height: 2.0rem;
    margin-right: 2px;
    text-align: center;
    font-family: 'FontAwesome';
    content: '\f236  ';
    font-weight: normal;
}
table#upcoming td.attend:before { 
    display: inline-block;
    font-size: 1.4rem;
    border-radius: 1rem;
    background-color: #5cb85c;
    color: #fff;
    width: 2.0rem;
    height: 2.0rem;
    margin-right: 2px;
    text-align: center;
    font-family: 'FontAwesome';
    content: '\f2c1  ';
    font-weight: normal;
}

table#upcoming .label {
    font-size: 1.4rem;
}

table#upcoming .site:before { 
    font-family: 'FontAwesome';
    content: '\f044  ';
    font-weight: normal;
}
table#upcoming .mail:before { 
    font-family: 'FontAwesome';
    content: '\f003  ';
    font-weight: normal;
}

table#upcoming td span.year { 
    color: #c0c0c0;
}

div#apply .panel .dl-horizontal dt { 
    white-space: normal;
    width: 14.0rem;
}
div#apply .panel .dl-horizontal dd { 
    margin-left: 16.0rem;
}

/* --------------------------------------------------
   div#comm
-------------------------------------------------- */

div#comm table .title { 
    width: 20%;
}
div#comm table .name { 
    width: 20%;
}

/* --------------------------------------------------
   div#about
-------------------------------------------------- */

div#about .panel .dl-horizontal dt { 
    white-space: normal;
    width: 24.0rem;
}
div#about .panel .dl-horizontal dd { 
    margin-left: 26.0rem;
}



dd { 
    margin-bottom: 10px;
}

.addrdummy { 
    display: none;
}