@charset "utf-8";

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

style.css

Copyright (C) 2017 Impress Corporation, an Impress Group company. All rights reserved.
----------------------------------------
Content

    1. Global Navigation
    2. Content
        1. Summary
        2. Overview
        3. Timetable
        4. Caution
    3. Footer
    4. Media Query

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

html,body,h1,h2,h3,h4,h5,h6 {
    margin:0;
    padding:0;
}
body {
/*    background:#666 url("../images/Crosshatch_touka8.png");*/
    background: linear-gradient(0deg, #333 0%, #666 50%, #555 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#333333', GradientType=0);
    background-attachment: fixed;
    font-size:100%;
    font-family: 'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
}
h1 {
    line-height:0;
    text-align:center;
}
h1 img {
    max-width:100%;
    max-height:300px;
}
h2{
    color: #fff;
    text-align:center;
    letter-spacing:1px;
    margin:2em 0 .5em;
    padding:.5em;
    background: linear-gradient(0deg, #333 0%, #444 50%, #333 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#333333', GradientType=0);
    border-radius:4px;
}

h3.greeting{
margin-top: 1em;
/*padding: 0.25em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/

}

ul,ol,dl {
    margin:0;
}
p {
    line-height:1.4;
}
em {
    padding: 0 3px;
    background: #ff9;
    font-weight: bold;
    font-style: normal;
}
a {
    color: #428bca;
}
table,th,td {
    height:100%;
    font-size:100%;
}
table {
    width:100%;
    border-spacing:0;
    border-collapse:collapse;
}
th {
    padding:0;
}
td {
    text-align:left;
    vertical-align:middle;
    padding:1em;
}

#wrapper {
    background:#fff;
}
.closed {
    border:1px solid #f00;
    margin:1em;
    padding:2em;
    text-align:center;
    font-weight:bold;
}
.label {
    margin:3em 0;
    padding: .25em 1em;
    border-radius: 4px;
    background: #999;
    color: #fff;
    font-size:80%;
    font-weight:normal;
    text-align: center;
}
.label-bl { background:#0666a3; }
.label-dg { background:#606060; }

a.label {
	display: inline-block;
	margin-top: .2em;
	text-decoration: none;
}

.submit {
    color:#fff;
    text-decoration:none;
    text-align:center;
    vertical-align:middle;
    background:#f1b000 !important;
    display:block;
}
.submit:hover {
    background:#f0c246 !important;
}
.txt-bold {font-weight:bold;}
.txt-size-80 {font-size:80%;}
.txt-size-90 {font-size:90%;}
.txt-size-95 {font-size:95%;}
.txt-aln-r {text-align:right;}
.txt-aln-l {text-align:left;}
.txt-aln-c {text-align:center;}
.txt-red {color:#f00;}
.txt-dgy {color:#333;}
.margin-t0 {margin-top:0 !important;}
.margin-t05 {margin-top:.5em !important;}
.margin-t1 {margin-top:1em !important;}
.margin-t2 {margin-top:2em !important;}
.margin-t3 {margin-top:3em !important;}
.margin-b1 {margin-bottom:1em !important;}
.margin-b2 {margin-bottom:2em !important;}
.margin-r05 {margin-right:.5em !important;}
.margin-r1 {margin-right:1em !important;}
.margin-r2 {margin-right:2em !important;}
.margin-l1 {margin-left:1em !important;}
.margin-l2 {margin-left:2em !important;}
.border-1 {border:1px solid #ccc;}
.inline-block {display:inline-block !important;}
.bottom20 {margin-bottom: 20px !important;}
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* --- 1. Global Navigation --- ////////////////////////////////////////*/

#global-nav ul {
    letter-spacing:-.4em;
    padding:0;
}
#global-nav li {
    list-style:none;
    letter-spacing:normal;
}
#global-nav li a {
    color:#fff;
    text-decoration:none;
    text-align:center;
    letter-spacing:.1em;
    padding:.5em;
    background:linear-gradient(0deg, #333 0%, #444 50%, #333 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#333333', GradientType=0);
    display:block;
}
#global-nav li a:hover {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#777777', endColorstr='#5c5c5c', GradientType=0);
    opacity:.7;
    text-shadow:0 0 10px #fff;
}
#global-nav li .submit {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1b000', endColorstr='#f1b000', GradientType=0);
}
#global-nav li .submit:hover {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0c246', endColorstr='#f0c246', GradientType=0);
    opacity:inherit;
    text-shadow:none;
}

/* --- 2. Content --- //////////////////////////////////////////////////*/

.btn-entry {
    margin:3em 0;
}
.btn-entry .submit {
    width:55%;
    font-size:120%;
    margin:0 auto;
    padding:1em 0.5em;
    border-radius:4px;
}
.btn-pagetop a {
    color:#666;
}
.btn-pagetop a:hover {
    color:#888;
}
#overview th,
#timetable th {
    color:#333;
    font-weight:bold;
    text-align:center;
    background:#eee;
}

/*------------------------------------------------
    2-1. Summary
------------------------------------------------*/
#summary {
    padding:1em 1em 0;
}
#summary p {
    color:#333;
    text-indent:1em;
    margin-top:2em;
}

.summaryInfo {
  margin-top: 2.5em;
  border: 2px solid #cccccc;
  padding: 1.5em;
  color:#333333;
}

/*------------------------------------------------
    2-2. Overview
------------------------------------------------*/


/*------------------------------------------------
    2-3. Timetable
------------------------------------------------*/
#timetable th {
    vertical-align:top;
}
#timetable tr td p:last-child {
    margin-bottom:0;
}
#timetable strong {
    display:block;
}
#timetable strong strong {
    font-size:150%;
    margin-top:.5em;
}
#timetable .line6 strong strong {
    margin-top:0;
}
#timetable .lecture-title {
    margin:0;
}
#timetable .lecture-detail,
#timetable .lecturer-biography,
#cboxContent .lecturer-biography {
    color:#333;
    font-size:90%;
    line-height:1.4;
    letter-spacing:1px;
}
#timetable .lecturer-pic {
    float:left;
    margin-right:1em;
    margin-bottom: 1em;
}
#timetable .lecturer-pic img {
    border:1px solid #ccc;
}
#timetable .lecturer-name {
    font-size:125%;
    font-weight:bold;
    padding-top:.25em;
}
#timetable .lecturer-name:after {
    content:"氏";
    font-size:75%;
    font-weight:normal;
    margin-left:.5em;
    display:inline-block;
}
#timetable .lecturer-name-en {
    font-size:125%;
    font-weight:bold;
    padding-top:.25em;
}
#timetable .lecturer-name-en:after {
    content:none;
    font-size:75%;
    font-weight:normal;
    margin-left:.5em;
    display:inline-block;
}
/* モデレータ */
#timetable .lecturer-name2 {
    font-size:125%;
    font-weight:bold;
    padding-top:.25em;
}
/* ./モデレータ */
#timetable .lecturer-company,
#timetable .lecturer-division,
#timetable .lecturer-post {
    font-size:95%;
    line-height:1.3;
    margin:.4em 0;
}
#timetable .lecturer-biography {
    margin:0.5em 0 1.5em 0;
    clear:both;
}

#timetable .lecturerBox {
	display: flex;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
}
#timetable .lecturerBox .lecturer-name {
	margin-top: 0;
}

.label + .lecturer-biography {
	margin-top: 1em !important;
}


/*------------------------------------------------
    2-4. Caution
------------------------------------------------*/
#content .caution {
  margin: 30px 5.33333% 0;
  padding: 1em 1.5em;
  border: 2px solid #E80047;
}
#content .caution p {
  margin: 1.8em 0;
}
#content .caution p:first-child {
  margin-top: 1em;
}
#content .caution p:last-child {
  margin-bottom: 1em;
}
#content .caution em {
  color: #E80047;
  background: transparent;
}
#content .caution dt {
  text-align: center;
  margin: .5em 0 1em;
}
#content .caution dt em {
  display: inline-block;
  padding: 0 1.5em .2em 1.5em;
  border-bottom: 1px solid #E80047;
}
#content .caution dd {
  margin-left: 0;
}
#content .caution .fz20 {
    font-size: 20px;
}

/*------------------------------------------------
    2-5. Common parts
------------------------------------------------*/
ul.note {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
ul.note li {
	padding-left: 1em;
	text-indent: -1em;
	color: #CC0000;
	font-size: 87.5%;
}
/*------------------------------------------------
    2-5EX. iframe
------------------------------------------------*/
iframe {
	width: 100%;
	aspect-ratio: 16/9; /*アスペクト比（縦横比）を指定*/
	margin-top: 10px;
}

/* --- 3. Footer --- ///////////////////////////////////////////////////*/

#footer {
    color:#fff;
    font-size:80%;
    text-align:right;
    padding:1em;
    background:#333;
}
#footer dt,
#footer dd {
    display:inline-block;
}
#footer dt {
    vertical-align:top;
    margin-top:.3em;
    margin-right:1em;
    padding:.5em;
    border:1px solid #fff;
}
#footer dd {
    text-align:left;
    margin:0;
}
#footer p {
    line-height:1.2;
    margin:.3em 0;
}
#footer a {
    color:#fff;
}
#footer a:hover {
    opacity:.7;
}

/* --- 4. Media Query --- //////////////////////////////////////////////*/

@media only screen and (max-width:770px) {
    h2{
        font-size:inherit;
        margin:1em 0 0;
        border-radius:0;
    }
    table,tbody,tr,th,td {
        display:block;
    }
    tr {
        margin-bottom:1em;
    }
    th {
        padding:.5em 0;
    }
    td {
        border-right:none;
        border-bottom:1px solid #aaa;
    }
    td:last-child {
        border:none;
    }
    .summaryInfo {
      margin-top: 1.5em;
    }
    #overview tr:last-child,
    #timetable tr:last-child {
        margin-bottom:0;
    }
    #overview tr:last-child td,
    #timetable tr:last-child td {
        padding-bottom:0;
    }
    #timetable strong strong {
        font-size:140%;
    }
    #timetable .line1 td,
    #timetable .line2 td {
        text-align:center;
    }
    #footer {
        text-align:left;
    }
    #footer dt {
        margin-bottom:.3em;
    }
    .btn-entry {
        margin:2em auto;
    }
    .btn-entry .submit {
        width:75%;
        letter-spacing:.1em;
    }
    .btn-pagetop {
        text-align:center;
        margin-bottom:2em;
    }
}

@media only screen and (min-width:771px)  {
    h2 {
        font-size: 100%;
    }

    h3.greeting{
    margin-top: 1em;
    padding: 0.25em 0.5em;/*上下 左右の余白*/
    color: #494949;/*文字色*/
    background: transparent;/*背景透明に*/
    border-left: solid 0.8em #c6c9d2;/*左線*/
    }

    #wrapper {
        max-width:960px;
        margin:0 auto;
        box-shadow: 0 0 2px 1px rgba(0,0,0,0.3);
    }
    #global-nav,
    #content {
        width:98%;
        margin:0 1%;
    }
    #global-nav li {
        /*width:25%;*/
        width:33%;
        display:inline-block;
    }
    #summary {
        padding-left:3.5em;
        padding-right:3.5em;
    }
    #summary p,
    .summaryInfo {
        font-size:95%;
    }

    #overview th,
    #timetable th {
        width:17%;
        /* width:20%; */
        font-size:80%;
        padding:20px 4px;
        border-bottom:1px solid #fff;
    }
    .btn-pagetop {
        text-align:right;
        margin-top:-1em;
    }
    .btn-pagetop a {
        font-size:80%;
        text-decoration:none;
        padding:.6em 1em;
        display:inline-block;
        background:#eee;
        border:1px solid #666;
        border-radius:4px;
    }
    .btn-pagetop a:hover {
        background-color:#f5f5f5;
        border-color:#888;
    }
}


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

  /*------------------------------------------------
      2-1. Summary
  ------------------------------------------------*/
  .summaryInfo {
    padding: 1em;
  }

}




@media print {
    body,h2 {
        background:transparent;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0);    }
    #global-nav,
    .btn-entry,
    .btn-pagetop {
        display:none;
    }
    #footer,
    #summary p,
    #overview tr,
    #timetable tr {
        page-break-inside:avoid;
    }
    h2 {
        color:inherit;
        margin-top:2em;
        padding:0;
    }
    #wrapper {
        width:100%;
        margin:0 auto;
    }
    #overview th,
    #timetable th {
        width:17%;
        font-size:80%;
        padding:20px 4px;
        border-bottom:1px solid #fff;
    }
    #timetable {
        padding-bottom:2em;
    }

}