@charset "UTF-8";
/* -------------CSS Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-style: normal; font-weight: normal; font-size: 100%; vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

html { overflow-y: scroll; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

input, textarea { margin: 0; padding: 0; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th { text-align: left; }

a:focus { outline: none; }

.clearfix:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; }

.clearfix { min-height: 1px; }

* html .clearfix { height: 1px; /*¥*/ /*/ height: auto; overflow: hidden; /**/ }

.both { clear: both; }

.inline_block { display: inline-block; *display: inline; *zoom: 1; }

/* ----------//Reset END */
/* -------------------------//1024px END */
@media screen and (max-width: 959px) { header .nav_slide { display: block; border-top: 0.5px solid #fff; padding-bottom: 15px; }
  header .nav_slide span { display: block; width: 150px; clip-path: polygon(8% 100%, 0% 0%, 100% 0%, 92% 100%); padding: 5px 0; margin: auto; text-align: center; background: #5970af; cursor: pointer; }
  header .nav_slide span i { display: inline-block; transform: scale(1.8); font-weight: bold; color: #fff; }
  header ul.page_nav { display: flex; justify-content: center; flex-wrap: wrap; padding: 10px 0; transition: 1s; }
  header ul.page_nav li:nth-child(n + 8) { font-size: 0.9rem; }
  header ul.nav_none { display: none; transition: 1s; }
  nav ul.content_nav { justify-content: flex-start; flex-wrap: wrap; }
  nav ul.content_nav li { width: calc(100% / 3); }
  .entry_application ul.entry_btn_col { width: 90%; }
  section .main_content { width: 90%; margin-top: 30px; }
  section .movie_content_wrap { width: 90%; }
  section .comment_box { width: 90%; } }

/* -------------------------//959px END */
@media screen and (max-width: 559px) { header .main_header h1 { text-align: center; }
  header .main_header h1 img { display: block; margin: auto auto 10px auto; }
  header .netz_title { padding: 15px 0; }
  header .netz_title h2 { width: 50%; margin-bottom: 15px; }
  header .netz_title p { padding: 15px 10px 0 10px; }
  nav ul.content_nav { display: block; }
  nav ul.content_nav li { width: 100%; margin-bottom: 10px; }
  nav ul.content_nav li div.photo_prof { padding-bottom: 10px; margin-bottom: 0; }
  nav ul.content_nav li:nth-child(n+4) { margin-top: 0; }
  div.entry_application img { width: 80%; }
  div.entry_application ul.entry_btn_col { display: block; }
  div.entry_application ul.entry_btn_col li { width: 95%; margin-bottom: 15px; }
  div.movie_play_btn { width: 60px; height: 60px; line-height: 60px; top: 40%; right: 40%; }
  div.movie_play_btn i { font-size: 2.5rem; margin-left: 5px; }
  footer .footer_inner p img { width: 60%; } }

/* --------------//559px END */
/* -----------------------------CSS To-Top */
#page-top { width: 50px; height: 50px; display: none; position: fixed; right: 16px; bottom: 16px; z-index: 999; }

#page-top p { margin: 0; padding: 0; text-align: center; background: #3b3b3b; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

#page-top p:hover { background: #8b8b8b; }

#move-page-top { color: #fff; line-height: 50px; text-decoration: none; display: block; cursor: pointer; }

/* -----------------------------//CSS To-Top END */
body { font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif; }

.row { width: 100%; }

.row_inner { width: 90%; margin: auto; }

img { display: block; width: 100%; }

.main_header, .footer_inner { width: 90%; margin: auto; }

.main_header { padding: 10px 0; text-align: center; }

.main_header h1 img { display: inline-block; width: 200px; }

.main_header h1 span { font-weight: bold; position: relative; bottom: 3px; margin-left: 10px; font-size: 1.2rem; }

.main_header h1 a { text-decoration: none; color: #000; }

.footer_inner { text-align: center; padding-bottom: 100px; }

.footer_inner img { width: 15%; margin: 0 auto 15px auto; }

.footer_inner p { font-size: 0.9rem; font-weight: bold; }

.netz_title { box-sizing: border-box; width: 100%; padding: 30px 0 15px 0; background: #0C56A6; }

.netz_title h2 { width: 18%; margin: auto auto 30px auto; }

.netz_title p { margin-top: 15px; text-align: center; color: #fff; font-size: 0.8rem; border-top: 1px solid #fff; padding-top: 15px; }

.nav_slide { display: none; }

ul.page_nav { width: 100%; display: flex; justify-content: center; background: #5970af; }

ul.page_nav li { width: 130px; text-align: center; }

ul.page_nav li:first-child i { display: inline-block; transform: scale(1.3); margin-right: 7px; }

ul.page_nav li:nth-child(n + 8) { font-size: 0.9rem; }

ul.page_nav a { display: block; box-sizing: border-box; width: 100%; height: 100%; padding: 8px 0; font-weight: bold; color: #fff; text-decoration: none; }

ul.page_nav a i { display: inline-block; transform: scale(1.5); margin-right: 7px; }

ul.page_nav a:hover { color: #0C56A6; background: #fff; transition: 0.3; }

ul.page_nav li.current_page { background: #fff; }

ul.page_nav li.current_page a { color: #0C56A6; }

.play_notice { text-align: center; padding: 5px; }

.play_notice p { font-size: 0.8rem; }

.bodypage_notice { background: #0C56A6; }

.bodypage_notice p { color: #fff; }

ul.content_nav { width: 100%; margin: auto; display: flex; justify-content: space-between; flex-wrap: wrap; }

ul.content_nav li { width: calc(100% / 3); background: #0C56A6; }

ul.content_nav li:nth-child(even) { background: #5970AF; }

ul.content_nav a:hover { opacity: 0.7; transition: 0.2s; }

ul.content_nav li:nth-child(n+4) { margin-top: 5px; }

a.photo_box { display: block; width: 100%; cursor: pointer; position: relative; }

a.photo_box div.play_btn { width: 45px; height: 45px; line-height: 45px; background: #fff; text-align: center; margin: auto; position: absolute; top: 40%; right: 45%; border-radius: 50%; opacity: 0.7; }

a.photo_box div.play_btn i { font-size: 1.5rem; margin-left: 3px; color: #0C56A6; }

.photo_prof { width: 90%; margin: 10px auto; position: relative; }

.photo_prof p { font-size: 0.8rem; color: #fff; text-align: center; }

.photo_prof p.prof_name { font-size: 0.9rem; font-weight: bold; }

.photo_prof span.alphabet { font-size: 0.7rem; margin-left: 10px; font-weight: bold; }

.photo_prof span.person_num { display: inline-block; font-size: 3rem; line-height: 1rem; color: rgba(255, 255, 255, 0.2); position: absolute; top: 10px; font-style: italic; }

.entry_application { width: 100%; margin: 60px auto 80px auto; text-align: center; }

.entry_application img { width: 30%; margin: auto; }

ul.entry_btn_col { width: 60%; margin: auto; display: flex; justify-content: center; }

ul.entry_btn_col li { box-sizing: border-box; width: 48%; margin: 0 10px; }

ul.entry_btn_col li a { display: block; box-sizing: border-box; width: 100%; padding: 15px 10px; text-decoration: none; color: #fff; font-weight: bold; background: #0C56A6; border-radius: 5px; }

ul.entry_btn_col li a i { display: inline-block; transform: scale(1.2); margin-right: 5px; }

ul.entry_btn_col li a:hover { opacity: 0.7; transition: 0.2s; }

.main_content { width: 70%; margin: 60px auto 15px auto; }

.main_content h2 { font-size: 1.5rem; line-height: 50px; font-weight: bold; color: #0C56A6; }

.main_content h2 span { display: inline-block; width: 50px; height: 50px; line-height: 50px; background: #0C56A6; color: #fff; text-align: center; border-radius: 50%; margin-right: 5px; }

.main_content p { margin: 15px 0 0 23px; padding: 5px 0 5px 10px; font-size: 1.1rem; font-weight: bold; border-left: 4px solid #0C56A6; }

.movie_content_wrap { width: 70%; margin: auto auto 30px auto; padding-bottom: 30px; }

.content_left { box-sizing: border-box; width: 100%; position: relative; border: 1px solid #ccc; }

.content_left video { display: block; width: 100%; cursor: pointer; }

.movie_play_btn { width: 100px; height: 100px; line-height: 100px; background: #fff; position: absolute; top: 45%; right: 45%; text-align: center; border-radius: 50%; }

.movie_play_btn i { font-size: 4rem; font-weight: bold; margin-left: 10px; }

.content_right { padding-top: 15px; text-align: center; }

.content_right h3 { font-size: 1.3rem; font-weight: bold; border-bottom: 1px solid #0C56A6; margin-bottom: 5px; }

.content_right h3 span.content_alphabet { font-size: 0.8rem; font-weight: bold; margin-left: 5px; }

.comment_box { width: 70%; margin: 0 auto 60px auto; padding-bottom: 30px; text-align: center; border-bottom: 1px solid #0C56A6; }