@charset "UTF-8";
/* CSS Document */
/* START:★★★ 9/23までは下記ACTIVE.　9/24以降は無効化予定 
#header-box ul{
 visibility:hidden;
}*/
/* FIN:★★★ 9/23までは下記ACTIVE.　9/24以降は無効化予定 */

/* Font Include */
@font-face { font-family: 'Noto Sans JP'; font-style: normal; font-weight: 300; src: url('../fonts/NotoSansJpLight.woff2.woff') format('woff2'); font-display: swap; }
@font-face { font-family: 'Noto Sans JP'; font-style: normal; font-weight: 400; src: url('../fonts/NotoSansJpRegular.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: 'Noto Sans JP'; font-style: normal; font-weight: 700; src: url('../fonts/NotoSansJpBold.woff2') format('woff2'); font-display: swap; }


/* Reset */
* { zoom: 1; }
:root { --vw: 1vw; }
html, body, header, footer, h1, h2, h3, h4, h5, h6, p, pre, address, ul, ol, li, dl, dt, em, dd, caption, img, form
{ margin: 0; padding: 0; border: none; font-style: normal; font-weight: normal; font-size: 100%; text-align: left; list-style-type: none; }
img { width: 100%; height: auto; vertical-align: bottom; }
sup, sub { font-size: 70%; height: 0; line-height: 1; vertical-align: baseline; _vertical-align: bottom; position: relative; }
sup { bottom: 1ex; }
sub { top: .5ex; }
hr { display: none; }
a { color: #06C; text-decoration: none; transition: .4s; }
a:hover { color: #C00; }

/* Base */
html { height: -webkit-fill-available; }
body { font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif; font-size: 15px; line-height: 1.8em; color: #333; min-height: 100vh; min-height: -webkit-fill-available; -webkit-text-size-adjust: none; -webkit-print-color-adjust: exact; position: relative;  overflow: auto;}
body.show { overflow: hidden; }
noscript p { line-height: 1.2em; text-align: center; font-weight: bold; color: #FFF; padding: .8em 0; background: #C00; }
#pagetop { position: absolute; left: 0; top: 0; }
.noto-l { font-family: "Noto Sans JP"; font-style: light; font-weight: 300; }
.noto-r { font-family: "Noto Sans JP"; font-style: Regular; font-weight: 400; }
.noto-b { font-family: "Noto Sans JP"; font-style: bold; font-weight: 700; }
.clearfix { zoom: 1; overflow: hidden; }
.clearfix:after { content: ""; display: block; clear: both; }

/* Header */
header { width: 100%; background: rgba(255,255,255,.8); box-shadow: 0 0 .5em rgba(0,0,0,.3); position: fixed; top: 0; transition: .4s; z-index: 10; }
#header-box { width: calc(100% - 40px); height: auto; margin: 0 auto; padding: 20px 0; display: flex; align-items: center; justify-content: flex-start; transition: .4s; }
#lecture-head #header-box { justify-content: space-between; }
#header-box h1 { width: 270px; transition: .4s; }
#header-box h1 a:hover { opacity: .8; }
#header-box ul { width: 330px; display: flex; justify-content: space-between; }
#lecture-head #header-box ul { margin-right: 60px; }
#header-box ul li { width: 160px; }
#header-box ul li:first-child a { background: #1E72A2; display: block; }
#header-box ul li:last-child a { background: #004375; display: block; }
#header-box ul li a:hover { opacity: .8; }
header.is-animation { background: rgba(255,255,255,.95); }
header.is-animation #header-box { padding: 10px 0; }
@media only screen and (max-width: 520px) and (orientation: portrait) {
  header #header-box { width: 92%; padding: 15px 0; }
  header.is-animation #header-box { padding: 8px 0; }
  #lecture-head #header-box { flex-direction: column; align-items: flex-start; }
  #lecture-head #header-box h1 { width: min(85%,440px); margin-bottom: .5em; }
  #header-box ul { width: min(85%,440px); }
  #lecture-head #header-box ul { width: 100%; margin-right: 0; }
  #header-box ul li { width: 49%; }
}


/* Hamburger Menu */
#toggle-box { width: 56px; height: 80px; display: flex; align-items: center; position: fixed; top: 0; right: 0; transition: .3s; z-index: 1000; }
#toggle-box.is-animation { height: 60px; }
#toggle { width: 36px; height: 30px; cursor: pointer; }
.nav_toggle { width: 100%; height: 100%; position: relative; display: block; z-index: 1001; }
.nav_toggle i { width: 100%; height: 4px; background-color: #004375; position: absolute; display: block; transition: transform .3s, opacity .3s; }
.nav_toggle i:nth-child(1) { top: 0; }
.nav_toggle i:nth-child(2) { top: 0; bottom: 0; margin: auto; }
.nav_toggle i:nth-child(3) { bottom: 0; }
.nav_toggle.show i:nth-child(1) { background-color: #FFF; transform: translateY(13px) rotate(-45deg); }
.nav_toggle.show i:nth-child(2) { opacity: 0; }
.nav_toggle.show i:nth-child(3) { background-color: #FFF; transform: translateY(-13px) rotate(45deg); }

#hamburger .nav { width: 100vw; height: 100vh; background: rgba(0,67,117,0.9); display: flex; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; z-index: 999; }
#hamburger .nav ul {  }
#hamburger .nav ul li { font-size: 2.5vw; line-height: 1.2; text-align: center; }
#hamburger .nav ul li a { color: #FFF; padding: 1vw 0; display: block; }
#hamburger .nav ul li a:hover { color: #999; }
#hamburger .nav ul li.active a { color: #F93; }
#hamburger .nav ul li.active a:hover { color: #F93; }
#hamburger .nav.show { opacity: 1; visibility: visible; }
@media screen and (max-width: 768px) {
  #hamburger .nav ul li { font-size: 5vw; line-height: 1.2; }
  #hamburger .nav ul li a { padding: 2vw 0; }
}
@media screen and (max-width: 520px) and (orientation: portrait) {
  #toggle-box { width: 45px; height: 16.5vw; }
  #toggle-box.is-animation { height: 13vw; }
  #toggle { width: 30px; height: 24px; padding-top: 0; top: 15px; right: 4%; }
  .nav_toggle.show i:nth-child(1) { transform: translateY(10px) rotate(-45deg); }
  .nav_toggle.show i:nth-child(3) { transform: translateY(-10px) rotate(45deg); }
}
@media screen and (max-width: 320px) {
  #toggle-box { width: 50px; height: 18vw; }
  #toggle-box.is-animation { height: 14vw; }
}

/* Key Visual */
#keyvisual { width: 100%; height: 100vh; height: calc(100svh - 5rem); padding-top: 5rem; background: url("../images/common/main_bg.jpg") center center no-repeat; background-size: cover; position: relative; }
#main-title { width: min(960px,92%); position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
#main-title h1 { width: min(90%,960px); position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
#period { width: 100%; background: rgba(205,230,238,.7); position: absolute; bottom: 0; }
#period dl { width: min(960px,92%); margin: 0 auto; padding: .5rem 0; display: flex; align-items: center; justify-content: space-between; }
#period dl dt, #period dl dd { width: 50%; }
@media only screen and (max-width: 960px) {

}
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #main-title { transform: translate(-50%,-100%); }
  #period dl { padding: .5rem 0 0 0; flex-direction: column; }
  #period dl dt, #period dl dd { width: 100%; }
}


/* Read */
#read { border-bottom: solid 1px #005A8E; }
#main-read { width: min(92%,960px); margin: 0 auto; padding: 2.5em 0 1.8em 0; }
#main-read h1 { font-size: 160%; line-height: 1.2; text-align: center; color: #005A8E; padding-bottom: .5em; }
#main-read h1 strong { position: relative; }
#main-read h1 strong::before { content: ""; width: 2em; height: 1px; background: #005A8E; position: absolute; top: 50%; left: -2.5em; }
#main-read h1 strong::after { content: ""; width: 2em; height: 1px; background: #005A8E; position: absolute; top: 50%; right: -2.5em; }
#main-read p { font-size: 115%; line-height: 1.8; text-align: center; padding-bottom: .8em; }
#main-read p span::before { content: "\A"; white-space: pre; }
#sub-read { background: #D9E6EE; }
#sub-read dl { width: min(92%,960px); margin: 0 auto; padding: .8em 0; }
#sub-read dl dt { font-size: 105%; line-height: 1.6; color: #005A8E; }
#sub-read dl dd { line-height: 1.6; text-align: justify; }
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #main-read { padding: 2em 0 1em 0; }
  #main-read h1 { font-size: 150%; line-height: 1.2; }
  #main-read h1 strong::before, #main-read h1 strong::after { display: none; }
  #main-read p { font-size: 105%; line-height: 1.6; text-align: justify; }
  #main-read p span::before { content: ""; }
  #sub-read dl dd { line-height: 1.4; }
}
@media only screen and (max-width: 750px) and (orientation: landscape) {
  #main-read h1 { font-size: 150%; line-height: 1.2; }
  #main-read p { font-size: 105%; line-height: 1.8; }
}

article { padding-bottom: 4em; display: flex; justify-content: space-between; }
main { width: calc(((100% - 960px) / 2) + 700px); }
aside { width: calc(((100% - 960px) / 2) + 200px); padding-top: 3em; background-size: 380px; }
@media only screen and (max-width: 960px) {
  main { width: 74%; }
  aside { width: 22%; }
}
@media only screen and (max-width: 520px) and (orientation: portrait) {
  article { flex-direction: column; }
  main { width: 96%; padding-bottom: 3em; }
  aside { width: 100%; padding-top: 1em; border-top: solid 1px #005A8E; }
}

main .column { margin-top: -3em; padding-top: 6em; display: flex; flex-direction: column; align-items: flex-end; }
main .column .column-title { width: 100%; margin-bottom: 1.2em; background: url("../images/common/title_bg.jpg") center center no-repeat; background-size: cover; display: flex; justify-content: flex-end; }
main .column h1 { width: 700px; display: flex; align-items: center; justify-content: space-between; }
main .column h1 strong { width: 160px; display: block; }
main .column h1 span { font-size: 100%; line-height: 1.2; font-weight: bold; color: #FFF; padding-right: .5em; }
main .column .column-box { width: 700px; }
@media only screen and (max-width: 960px) {
  main .column h1 { width: 100%; }
  main .column h1 strong { padding-left: .5em; }
  main .column .column-box { width: calc(100% - .5em); }
}
@media only screen and (max-width: 520px) and (orientation: portrait) {
  main .column { margin-top: -4em; padding-top: 6em; }
  main .column .column-title { margin-bottom: .8em; }
  main .column h1 strong { padding-left: 4%; }
  main .column .column-box { width: 96%; }
}

#news ul { height: 8em; overflow: auto; }
#news ul li { line-height: 1.4; text-align: justify; padding: .4em 0 .4em 6em; border-bottom: dotted 1px #CCC; position: relative; }
#news ul li:first-child { padding-top: 0; }
#news ul li:last-child { padding-bottom: 0; border-bottom: none; }
#news ul li h3 { color: #999; position: absolute; left: 0; }
#news ul li ul { height: auto; }
#news ul li ul li { padding: 0 0 .2em .7em; border-bottom: none; }
#news ul li ul li::before { content: ""; width: 0; height: 0; border-style: solid; border-width: .3em .4em; border-color: transparent transparent transparent #005A8E; position: absolute; top: .4em; left: 0; }
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #news ul li { line-height: 1.4; padding: .4em 0 .4em 0; }
  #news ul li h3 { padding-bottom: .3em; position: relative; }
}

#keynote p.notes { line-height: 1.4; text-align: justify; color: #F63; margin-bottom: .5em; padding-left: .8em; position: relative; }
#keynote p.notes::before { content: ""; width: 0; height: 0; border-style: solid; border-width: .4em .6em; border-color: transparent transparent transparent #F63; position: absolute; top: .7em; left: 0; transform: translateY(-50%); }
#keynote h2 { line-height: 1.2; margin-bottom: .6em; border-bottom: solid 1px #D9E6EE; display: flex; align-items: center; justify-content: flex-start; }
#keynote h2 strong { line-height: 1.2; text-align: center; color: #005A8E; width: 6em; margin-right: 1.5em; padding: .4em 0; background: #D9E6EE; display: block; position: relative; }
#keynote h2 strong::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 1em 1em; border-color: transparent transparent transparent #D9E6EE; position: absolute; top: 50%; right: -1.95em; transform: translateY(-50%); }
#keynote h3 { font-size: 150%; line-height: 1.4; text-align: justify; padding-bottom: .4em; }
#keynote h3 span { padding-left: .0em; }
#keynote h3 span::before { content: ""; }
#keynote p { text-align: justify; padding-bottom: .5em; }
#keynote h4 { font-size: 105%; line-height: 1.2; padding-bottom: .5em; }
#keynote h4 strong { font-size: 150%; line-height: 1.2; vertical-align: baseline; padding-left: .5em; }
#keynote dl { padding-top: 1.2em; display: flex; align-items: stretch; justify-content: space-between; }
/*#keynote dl dt { width: 26%; overflow: hidden; position: relative; }2024年仕様*/
#keynote dl dt { width: 40%; overflow: hidden; position: relative; }
#keynote dl dt img { width: auto; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
#keynote dl dt strong { font-size: 75%; line-height: 1.2; font-weight: normal; text-align: right; text-shadow: 0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF,0 0 3px #FFF;; position: absolute; right: .5em; bottom: .5em; }
/*#keynote dl dd { width: 70%; }2024年仕様*/
#keynote dl dd { width: 58%; }
#keynote dl dd h5 { line-height: 1.2; margin-bottom: .5em; padding: .3em .4em; background: #D9E6EE; }
#keynote dl dd p { font-size: 93%; line-height: 1.5; padding-bottom: 0; }
@media only screen and (max-width: 768px) {
  #keynote dl dt { width: 30%; }
  #keynote dl dd { width: 66%; }
  #keynote dl dd p { font-size: 85%; line-height: 1.4; }
}
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #keynote h3 { font-size: 123%; line-height: 1.4; padding-bottom: .4em; }
  #keynote h3 span { padding-left: 0; }
  #keynote h3 span::before { content: "\A"; white-space: pre; }
  #keynote p { line-height: 1.6; padding-bottom: .8em; }
  #keynote dl { padding-top: .8em; flex-direction: column; }
  #keynote dl dt { width: 100%; height: auto; margin-bottom: .8em; }
  #keynote dl dt img { width: 100%; height: auto; position: relative; top: 0; left: 0; transform: translate(0,0); }
  #keynote dl dd { width: 100%; }
}

#program p.notes { line-height: 1.4; text-align: justify; color: #F63; margin-bottom: 1.5em; padding-left: .8em; position: relative; }
#program p.notes::before { content: ""; width: 0; height: 0; border-style: solid; border-width: .4em .6em; border-color: transparent transparent transparent #F63; position: absolute; top: .7em; left: 0; transform: translateY(-50%); }
#program1 { margin-bottom: 2em; }
#program h2 { line-height: 1.2; border-bottom: solid 1px #D9E6EE; display: flex; align-items: center; justify-content: flex-start; }
#program h2 strong { line-height: 1.2; text-align: center; color: #005A8E; width: 6em; margin-right: 1.5em; padding: .4em 0; background: #D9E6EE; display: block; position: relative; }
#program h2 strong::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 1em 1em; border-color: transparent transparent transparent #D9E6EE; position: absolute; top: 50%; right: -1.95em; transform: translateY(-50%); }

#program dl a { padding: 1em 0; border-bottom: dotted 1px #CCC; display: flex; align-items: center; justify-content: space-between; }
#program dl a dt { width: 26%; }
#program dl a dd { width: 70%; }
#program dl a dd h3 { font-size: 123%; line-height: 1.3; text-align: justify; color: #005A8E; word-break: break-all; font-weight: bold; padding-bottom: .2em; transition: .3s; }
#program dl a:hover dd h3 { color: #F63; }
#program dl a dd h3 span { font-size: 85%; line-height: 1.3; }
#program dl a dd h4 { font-size: 93%; line-height: 1.3; color: #333; transition: .3s; }
#program dl a:hover dd h4 { color: #F63; }
#program p.attention { font-size: 93%; line-height: 1.4; text-align: justify; text-indent: -1em; padding: .8em 0 0 1em; }
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #program dl a { padding: .8em 0 .7em 0; flex-direction: column; align-items: flex-start; }
  #program dl a dt { width: 60%; padding-bottom: .5em; }
  #program dl a dd { width: 100%; }
  #program dl a dd h3 { font-size: 115%; line-height: 1.3; padding-bottom: .1em; }
  #program dl a dd h4 { font-size: 85%; line-height: 1.3; }
  #program p.attention { font-size: 85%; line-height: 1.4; }
}

#overview ul li { line-height: 1.4; text-align: justify; padding: .8em 0 .8em 7em; border-bottom: dotted 1px #CCC; position: relative; }
#overview ul li:first-child { padding-top: 0; }
#overview ul li:last-child { padding-bottom: 0; border-bottom: none; }
#overview ul li h3 { color: #005A8E; position: absolute; left: 0; }
#overview ul li ul.attention li { font-size: 93%; line-height: 1.4; text-indent: -1em; padding: 0 0 .2em 1em; border-bottom: none; }
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #overview ul li { line-height: 1.3; padding: .8em 0 .8em 0; }
  #overview ul li h3 { line-height: 1.3; padding-bottom: .2em; position: relative; }
  #overview ul li h3::before { content: "■"; }
}

#banner-box { width: 200px; }
#banner-box h1 { font-size: 105%; line-height: 1.2; height: 1.2em; margin-bottom: 1em; position: relative; }
#banner-box h1 strong { text-align: center; font-weight: normal; color: #005A8E; width: 6em; background: #FFF; display: block; position: absolute; left: 50%; transform: translateX(-50%); z-index: 2; }
#banner-box h1::after { content: ""; width: 100%; height: 1px; background: #005A8E; display: block; position: absolute; top: 50%; }
#banner-box ul li { padding-bottom: .8em; }
#banner-box ul li a { display: block; box-shadow: 0 0 .3em rgba(0,0,0,.3); }
#banner-box ul li a:hover { opacity: .8; }
#banner-box ul li a img {
    width: 97%;
    height: 100px;
    margin-left:2%;
    vertical-align: bottom;
    object-fit: contain;
}
#banner-box h1#h1jrebld strong {
    text-align: center;
    font-weight: normal;
    color: #005A8E;
    width: 85%;
    background: white;
    display: block;
    position: absolute;
    left: 30%;
    transform: translateX(-26%);
    z-index: 2;
}
ul#sidebar2nd ul li { padding-bottom: .8em; }
ul#sidebar2nd ul li a { display: block; box-shadow: 0 0 .3em rgba(0,0,0,.3); }
ul#sidebar2nd ul li a:hover { opacity: .8; }
ul#sidebar2nd ul li a img {
    width: 97%;
    height: 100px;
    margin-left:2%;
    vertical-align: bottom;
    object-fit: contain;
}



@media only screen and (max-width: 960px) {
  #banner-box { width: calc(100% - .5em); }
}
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #banner-box { width: 92%; margin: 0 auto; }
  #banner-box h1 { height: auto; }
  #banner-box h1 strong { text-align: center; width: 100%; padding: .4em 0; background: #D9E6EE; position: relative; }
  #banner-box h1::after { display: none; }
  #banner-box ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
  #banner-box ul li { width: 48.5%; padding-bottom: 3%; }
}

#faq { margin-top: -6em; padding-top: 6em; }
#faq-inner { padding: 8em 0 1em 0; background: #EFEFEF; background: linear-gradient(120deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.1) 100%); position: relative; }
#faq h1 { color: #FFF; width: 120px; height: 120px; border-radius: 50%; background: #005A8E; display: flex; flex-direction: column; align-items: center; justify-content: center; position: absolute; top: -20px; left: 50%; transform: translateX(-50%); }
#faq h1 strong { font-size: 200%; line-height: 1.2; }
#faq h1 span { font-size: 85%; line-height: 1.2; padding: .3em 0; }
.faq-box { width: min(92%,960px); margin: 0 auto; padding-bottom: 3em; }
#faq h2 { font-size: 135%; line-height: 1.2; text-align: center; color: #005A8E; margin-bottom: .3em; padding: .5em 0; background: #FFF; }
#faq dl { border-bottom: solid 1px #999; }
#faq dl dt.question { font-family: "Noto Sans JP"; font-size: 123%; line-height: 1.3; font-style: bold; font-weight: 700; min-height: 5rem; padding: .5rem 3rem; display: flex; align-items: center; position: relative; transition: .3s; }
#faq dl dt.question::before { content: "Q"; font-size: 1.2rem; line-height: 1.4rem; text-align: center; color: #FFF; width: 2rem; padding: .2rem 0 .4rem 0; border-radius: 50%; background: #005A8E; display: block; position: absolute; top: 50%; left: .2rem; transform: translateY(-50%); }
#faq dl dt.question::after { content: ""; width: .8em; height: .8em; border-right: solid 1px #005A8E; border-bottom: solid 1px #005A8E; display: block; position: absolute; top: 50%; right: 1em; transform: translateY(-70%) rotate(45deg); transition: transform .3s ease-in-out, top .3s ease-in-out; }
#faq dl dt.question.open::after { transform: rotate(-135deg); }
#faq dl dt.question:hover { color: #005A8E; cursor: pointer; }
#faq dl dd.answer { line-height: 1.3; font-style: light; font-weight: 300; padding: .2rem 0 1rem 3rem; position: relative; display: none; }
#faq dl dd.answer::before { content: "A"; font-family: "Noto Sans JP"; font-size: 1.2rem; line-height: 1.4rem; font-style: bold; font-weight: 700; text-align: center; color: #FFF; width: 2rem; padding: .2rem 0 .4rem 0; border-radius: 50%; background: #E87967; display: block; position: absolute; top: 0; left: .2rem; }
#faq dl dd.answer p { line-height: 1.8; text-align: justify; }
#faq dl dd.answer h3 { padding-top: .8em; }
#faq dl dd.answer ul li { line-height: 1.4; text-align: justify; text-indent: -1em; padding: .2em 0 0 1em; }
#faq dl dd.answer ol { padding-top: .4em; }
#faq dl dd.answer ol li { line-height: 1.4; text-align: justify; text-indent: -1em; padding: .4em 0 0 1em; }
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #faq { margin-top: -10em; padding-top: 10em; }
  #faq-inner { padding: 8em 0 0 0; }
  .faq-box { padding-bottom: 2em; }
  #faq h2 { font-size: 115%; line-height: 1.2; }
  #faq dl dt.question { font-size: 105%; line-height: 1.3; padding: .5rem 2.5rem .5rem 3rem; }
  #faq dl dd.answer p { line-height: 1.4; }
}

#privacy { margin-bottom: 2em; padding: 3em 0 2em 0; border-bottom: solid 1px #EDEDED; }
#privacy-box { width: min(92%,960px); margin: 0 auto; }
#privacy h1 { font-size: 123%; line-height: 1.2; font-weight: bold; text-align: center; color: #005A8E; padding-bottom: .8em; }
#privacy p { line-height: 1.6; text-align: justify; padding-bottom: .8em; }
#privacy p.attention { text-indent: -1em; padding-left: 1em; }

#access { margin-top: -5em; padding-top: 5em; }
#access h1 { font-size: 123%; line-height: 1.2; font-weight: bold; text-align: center; color: #005A8E; padding: 1em 0 .8em 0; }
#access iframe { width: 100%; height: 560px; }
#access-box { width: min(92%,960px); margin: 0 auto 2em auto; }
#access ul li { text-indent: -1em; line-height: 1.4; text-align: center; padding: 0 0 .4em 1em; }
#access ul li span { color: #005A8E; }
#access ul.attention li { font-size: 93%; line-height: 1.4; text-align: center; color: #C00; padding: .5em 0 0 1em; }
@media only screen and (max-width: 520px) and (orientation: portrait) {
  #access { margin-top: -8em; padding-top: 8em; }
  #access iframe { height: 360px; }
  #access ul li, #access ul.attention li { text-align: justify; }
}


/* Footer */
footer { width: 100%; height: 20em; padding-top: 4em; background: url("../images/common/foot_bg.png") center center no-repeat; background-size: cover; position: relative; }
footer.lecture-foot { border-top: solid 1px #CCC; }

footer h1 { width: min(92%,450px); margin: 0 auto; padding-bottom: 1.5em; }
footer h2 { font-size: 105%; line-height: 1.2; font-weight: bold; text-align: center; color: #005A8E; padding-bottom: .3em; }
footer p { line-height: 1.4; text-align: center; }
footer ul#sns { margin-top: 1.5em; display: flex; align-items: center; justify-content: center; }
footer ul#sns li { width: 40px; margin: 0 5px; }
footer ul#foot-img { width: 100%; display: flex; align-items: flex-end; justify-content: space-between; position: absolute; bottom: 0; background: url("../images/common/building_c.png") no-repeat bottom; background-size: 100% 30px; z-index: -1; }
footer ul#foot-img li:first-child { width: 450px; }
footer ul#foot-img li:last-child { width: 300px; }
@media only screen and (max-width: 960px) {
  footer ul#foot-img li:first-child { width: 45%; }
  footer ul#foot-img li:last-child { width: 30%; }
}
@media only screen and (max-width: 520px) and (orientation: portrait) {
  footer { height: 18em; padding-top: 1.5em; }
  footer p span::before { content: "\A"; white-space: pre; }
}


/* Return Button */
#returnbtn { width: 50px; height: 50px; position: fixed; bottom: 10px; right: 10px; z-index: 3; }
#returnbtn a img { opacity: .6; transition: .2s; }
#returnbtn a:hover img { opacity: .8; }
@media only screen and (max-width: 520px) {
  #returnbtn { right: 5px; }
}



/* Lecture */
#lecture-title { width: 100%; height: 8em; padding-top: 100px; background: url("../images/common/main_bg.jpg") center center; background-size: cover; display: flex; align-items: center; justify-content: center; }
#lecture-title h1 { font-size: 200%; line-height: 1.2; letter-spacing: .2em; color: #005A8E; margin-left: .2em; }
@media only screen and (max-width: 520px) {
  #lecture-title { height: 6em; padding-top: 33vw; }
  #lecture-title h1 { font-size: 160%; line-height: 1.2; }
}

#lecture-contents { width: min(92%,800px); margin: 0 auto; display: block; }
.lecture-column { padding-top: 4em; }
#lecture { padding-bottom: 3em; border-bottom: dotted 1px #CCC; }
#lecture h1 { font-size: 150%; line-height: 1.3; font-weight: bold; text-align: justify; color: #005A8E; padding: .4em 0; border-top: solid 1px #005A8E; border-bottom: solid 1px #CCC; }
#lecture ul { margin-bottom: 1em; border-bottom: solid 1px #005A8E; }
#lecture ul li { font-size: 93%; line-height: 1.2; padding: .5em 0 .5em 4.5em; border-bottom: dotted 1px #CCC; position: relative; }
#lecture ul li:last-child { border-bottom: none; }
#lecture ul li h3 { text-align: center; color: #FFF; width: 3em; padding: .2em 0; background: #005A8E; display: block; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#lecture ul li h3::after { content: ""; width: 0; height: 0; border-style: solid; border-width: .8em .8em; border-color: transparent transparent transparent #005A8E; position: absolute; top: 50%; right: -1.6em; transform: translateY(-50%); }
#lecture ul li strong { font-size: 123%; line-height: 1.2; }
#lecture ul li span { line-height: 1.2; padding-left: 1em; }
#lecture dl { display: flex; justify-content: space-between; }
#lecture dl dt { width: 30%; }
#lecture dl dd { width: 66%; }
#lecture dl dd p { text-align: justify; }

#college dl { display: flex; flex-direction: row-reverse; justify-content: space-between; }
#college dl.no-img { flex-direction: row; }
#college dl dt { width: 36%; }
#college dl dd { width: 60%; }
#college dl.no-img dd { width: 100%; }
#college dl dd h1 { padding-bottom: 1em; }
#college dl dd h1.short img { width: 240px; }
#college dl dd h1.middle img { width: min(100%,360px); }
#college dl dd p { line-height: 1.6; text-align: justify; }
#college p.link-btn { margin-top: 3em; }
#college p.link-btn a { line-height: 1.2; text-align: center; color: #FFF; width: 14em; margin: 0 auto; padding: .6em 0; border-radius: 1.2em; background: #005A8E; display: block; position: relative; }
#college p.link-btn a::after { content: ""; width: .6em; height: .6em; border-top: solid 2px #FFF; border-left: solid 2px #FFF; position: absolute; top: 50%; left: 1em; transform: translateY(-50%) rotate(-45deg); }
#college p.link-btn a:hover { opacity: .8; }

.no-justify { text-align: left !important; }

@media only screen and (max-width: 520px) {
  .lecture-column { padding-top: 2em; }
  #lecture { padding-bottom: 2em; }
  #lecture h1 { font-size: 135%; line-height: 1.3; }
  #lecture ul li span { padding-left: 0; display: block; }
  #lecture dl { flex-direction: column; }
  #lecture dl dt { width: 60%; margin: 0 auto 1em auto; }
  #lecture dl dd { width: 100%; }
  #lecture dl dd p { line-height: 1.4; }
  #college dl { flex-direction: column-reverse; }
  #college dl dt { width: 100%; }
  #college dl dd { width: 100%; padding-bottom: 1em; }
  #college dl dd h1 { text-align: center; }
  #college dl dd p { line-height: 1.4; }
}


