@charset "utf-8";

/* 全体 */
html,body,header,footer,h1,h2,h3,h4,h5,h6,section,article,div,nav,table,th,tr,td {margin:0; padding:0; margin-block-start:0; margin-block-end:0;}
html {font-size:62.5%;}		/* 大元を10pxに設定 これがremの基準になる */
body {font-size:1.4em;}		/* 表示領域の基本サイズを14pxに設定 */

*, *:before, *:after {box-sizing:border-box;}
div.clear {clear:both;}
a {text-decoration:none;}
br.on-off {display:block;}

body {width:100%; background-color:#fff;}

/* ********************************************************************** */
/* 見出し関連 */
/* ********************************************************************** */
h1 {font-size:1.8rem; font-weight:bold; margin:0 0 0 0; color:#557;}
h2.h2-a {font-size:1.2rem; font-weight:bold; margin:0 0 1rem 0; color:#557;}
h1 img {width:12rem; height:100%; object-fit:cover;}
h2.catch {font-size:1.4rem; font-weight:bold; color:#fff;}
h2 {font-size:2rem; font-weight:bold; color:#fff;} /* 見出し大 1e90ff*/
h2.side {font-size:1.6rem; font-weight:bold; color:#fff;} /* 見出し大 1e90ff*/
div.h2div-l {width:100%; margin:0 0 3rem 0; padding:1rem 4rem 1rem 2rem; background-color:#7fbfff; text-align:center;}
div.h2div-l-tri {width:100%; height:2rem; margin:0 0 4rem 0; background-color:#7fbfff; clip-path:polygon(0 0, 100% 0, 100% 5%, 50% 100%, 0 5%);}
h3.comp {color:#039; background-color:#fff; border-top:2px solid #039; border-bottom:2px solid #039; vertical-align:middle; padding:1.2rem 0; margin-bottom:2rem; font-size:2rem; font-weight:bold; display:block; text-align:center;}
h4.thumb-title {font-size:1.6rem; font-weight:bold; line-height:2.6rem; color:#84c1ff;}
h4.thumb-title:hover {font-size:1.6rem; font-weight:bold; line-height:2.6rem; color:#84c1ff; text-decoration:underline;}
h5 {}
h6 {}
@media screen and (min-width:600px)
{
h1 {font-size:3rem; font-weight:bold; margin:0 0 0 0; color:#557;}
h2.h2-a {font-size:1.6rem; font-weight:bold; margin:0 0 1rem 0; color:#557;}
h1 img {width:16rem; height:100%; object-fit:cover;}
h2.catch {font-size:1.4rem; font-weight:bold; color:#fff;}
h2 {font-size:2rem; font-weight:bold; color:#fff;} /* 見出し大 1e90ff*/
h2.side {font-size:1.4rem; font-weight:bold; color:#fff;} /* サイドの見出し大 1e90ff*/
div.h2div-l {width:100%; margin:0 0 3rem 0; padding:1rem 0 1rem 0; background-color:#7fbfff; text-align:center;}
div.h2div-l-tri {width:100%; height:2rem; margin:0 0 4rem 0; background-color:#7fbfff; clip-path:polygon(0 0, 100% 0, 100% 5%, 50% 100%, 0 5%);}
div.h2div-r {text-align:center; margin:0 0 2rem 0; padding:1rem 0; background-color:#bcddff; border-bottom:4px solid #84c1ff; border-radius:2rem 2rem 0 0;}
h3.comp {color:#039; background-color:#fff; border-top:2px solid #039; border-bottom:2px solid #039; vertical-align:middle; padding:1.2rem 0; margin-bottom:4rem; font-size:2rem; font-weight:bold; display:block; text-align:center;}
h4.thumb-title {font-size:1.6rem; font-weight:bold; line-height:2.6rem; color:#84c1ff; margin:0 0 1rem 0;}
h5 {}
h6 {}
}

/* ********************************************************************** */
/* 以下「ヘッダー」「グローバルメニュー」全ページ共通 */
/* ********************************************************************** */
/* ヘッダー部分 */
header#header-base {width:100%; height:auto; margin:0 0 1rem 0; padding:0 0 2rem 0; background-color:#fff; border-bottom:2px solid #557; position:fixed; z-index:1000; top:0; left:0;}
div.header-spacer {width:100%; height:14rem; background-color:#fff; display:block;}/* なにこれ？ */
div.header-catch-area {width:100%; margin:0 0 1rem 0; padding:0.6rem 0; background-color:#557;}
div.header-catch {width:90%; margin:0 auto; text-align:left;}
div.header-in {width:90%; margin:0 auto; padding-top:0.5rem;}
div.title {width:auto; height:auto; margin:0 auto 0 0; /*padding:1rem 1rem;*/ background-color:#fff; /*border:2px solid #557;*/ float:left;}
div.info-a {width:auto; height:auto; padding:0 1rem; text-align:right; background-color:#bbb; float:right; display:none;}
/* モバイル用のメニューボタン */
div.menu-bottun {width:6rem; height:6rem; margin:0 0 0 auto; padding:0.6rem 0; background-color:#557; display:block; text-align:center;}
div.menu-bottun p {color:#fff; font-size:1.4rem; font-weight:bold;}
.nav {display:none;}
@media screen and (min-width:600px) /* w600px以上のヘッダーからグローバルナビ */
{
header#header-base {width:100%; height:auto; margin:0 0 0 0; padding:0 0 0.6rem 0; background-color:#fff; position:relative;}
div.header-spacer {width:100%; height:auto; background-color:#ddd; display:none;}
div.header-catch-area {width:100%; margin:0 0 1rem 0; padding:0.6rem 0; background-color:#557;}
div.header-catch {width:90%; margin:0 auto; text-align:left;}
div.header-in {width:90%; margin:0 auto 1rem auto; padding-top:0.5rem;}
div.title {width:auto; height:auto; margin:0 auto 0 0; /*padding:1rem 1rem;*/ background-color:#fff; /*border:2px solid #557;*/ float:left;}
div.info-a {width:auto; height:auto; padding:0 1rem; text-align:right; background-color:#fff; float:right; display:block;}
div.info-a p {font-size:1.2rem; color:#039; margin:0 0 0.6rem 0;}
/* グローバルメニュー */
.nav {width:100%; height:auto; vertical-align:middle; padding:0; background-color:#fff; display:block;}
.nav ul {width:100%; font-size:0; margin:0 auto;}
.nav ul li {width:calc(100% / 6); font-size:1.6rem; display:inline-block; position:relative; text-align:center;}
.nav ul li a {color:#fff; background-color:#557; text-decoration:none; display:block; padding:1.4rem 0;}
.nav ul li a:hover {color:#fff; background-color:#557; transition:.4s;}
.nav li ul {width:100%; margin:0; padding:0; position:absolute; z-index:9999; left:0; text-align:left;}
.nav li ul li {width:100%; display:block; transition:.4s;}
.nav li ul li a {padding:1.4rem 0; color:#fff; background-color:#9ac; border-bottom:1px solid #557;}
.nav li ul li {overflow:hidden; height:0; transition:.2s;}
.nav li:hover ul li{overflow:visible; height:auto; transition:.4s;}
div.menu-bottun {display:none;}
}
/* ********************************************************************** */
/* ココマデ「ヘッダー」「グローバルメニュー」全ページ共通 */
/* ********************************************************************** */

/* ********************************************************************** */
/* ココカラ「キーヴィジュアル」トップのみ */
/* ランダム、スライダー、一枚固定…どれにしましょう？ */
/* ********************************************************************** */
div#key-vis2 {width:100%; height:40rem; margin:0 auto 4rem auto;}
div#key-vis2 img {width:100%; height:100%; object-fit:cover; object-position:50% 50%; overflow:hidden;}
/* ********************************************************************** */
/* ココマデ「キーヴィジュアル」トップのみ */
/* ********************************************************************** */

/* 本体 */
div.bg {width:100%; height:auto; background-image:url(/img/bc-log-bg.png); background-repeat:repeat;}
/* トップページでの仕様 */
div#cont {width:100%; height:auto; margin:0 auto 2rem auto; padding:1rem; background-color:#fff; background-image:url(/v-college/img/bc-log-bg.png); background-repeat:repeat;}
/* トップ以外下層ページの本体（キービジュアルのmargin-bottomがないのでここだけ特別にtopにmarginを入れる） */
div#contb {width:100%; height:auto; margin:0rem auto 2rem auto; padding:1rem; background-color:#fff; background-image:url(/v-college/img/bc-log-bg.png); background-repeat:repeat;}
/* PC以上でのサイトコンテンツの幅 */
@media screen and (min-width:1024px)
{
/* トップページでの仕様 */
div#cont {width:85%; height:auto; margin:0 auto 2rem auto; padding:1rem; background-color:#fff; min-width:1000px;}
/* トップ以外下層ページの本体（キービジュアルのmargin-bottomがないのでここだけ特別にtopにmarginを入れる） */
div#contb {width:85%; height:auto; margin:2rem auto 2rem auto; padding:1rem; background-color:#fff; min-width:1000px;}
}

/* ********************************************************************** */
/* ココカラ「メインエリア」 */
/* ********************************************************************** */
/* サイズ */
div#main {width:100%; height:auto; padding:0 1rem 0 1rem; background-color:#fff; border-radius:0.8rem;}
@media screen and (min-width:1025px)
{
div#main {width:70%; height:auto; padding:3rem 2rem 0 2rem; background-color:#fff; border-radius:0.8rem; float:left;}
}

/* 0208いきなり追加 */
/* 新着動画 */
section.new-area-box {width:100%; margin:0 auto;}
div.new-area {width:100%; height:auto; margin:0 auto 10rem auto; padding:1rem; background-color:#fffff0; border-radius:1rem;}
@media screen and (min-width:1025px)
{
section.new-area-box {width:100%; margin:0 auto;}
div.new-area {width:100%; height:auto; margin:0 auto 10rem auto; padding:1rem; background-color:#fffff0; border-radius:1rem;}
}

/* 直近のセミナー トップページのみ */
section.top-sem {width:100%; height:auto; margin:0 0 10rem 0;}
div.sem-prom-cover {width:90%; height:auto; margin:0 auto 1rem auto; border:1px solid #888;}
  div.sem-prom-cover img {width:100%; height:100%; object-fit:cover;}
div.sem-prom {width:90%; height:auto; padding:2rem; margin:0 auto 2rem auto; background-image:url(/img/texture.png); background-repeat:none;}
div.sem-mottomiru-area {}
div.sem-mottomiru-button {width:160px; text-align:center; margin:0 0 0 auto; padding:6px 16px; color:#fff; background-color:#f66; border-radius:6px; font-weight:bold; font-size:1.6rem;}
p.sem-motto-title {font-size:1.8rem; line-height:2.8rem; color:#666;}
p.sem-motto-honbun {font-size:1.2rem; line-height:2.2rem; color:#666; text-align:justify;}
/* 掲示するライブ配信の日程 */
div.sem-date-box {width:100%; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; align-content:flex-start; margin:0 0 1rem 0;}
div.sem-date-box-parts {width:calc(100% / 6.2); margin:0 1rem 1rem 0; padding:0.2rem 0.3rem; background-color:#8eb8ff; color:#fff; border-radius:0.4rem; font-size:1rem; text-align:center; line-height:1.8rem;}
    
/* ジャンルで選ぶボタン2 トップページのみ flexboxやってみる */
div.genre-ul-box-fb {width:100%; height:auto; margin:0 0 4rem 0; display:flex; justify-content:space-between; flex-wrap:wrap;}
div.genre-tag-fb {width:calc(100% / 2.1); background-color:#fff; display:block; text-decoration:none; text-align:center; margin:0 0 1rem 0;}
div.genre-tag-fb a {font-size:1.4rem; color:#039; background-color:#fff; text-decoration:none; display:block; padding:1.4rem 0; border-left:2px solid #039; border-right:2px solid #039;}
div.genre-tag-fb a:hover {font-size:1.4rem; color:#fff; background-color:#039; padding:1.4rem 0; border-left:2px solid #039; border-right:2px solid #039; transition:.4s;}

@media screen and (min-width:600px) {
/* ジャンルで選ぶボタン2 トップページのみ flexboxやってみる */
div.genre-ul-box-fb {width:100%; height:auto; margin:0 0 4rem 0; display:flex; justify-content:space-around;}
div.genre-tag-fb {width:calc(100% / 5.5); background-color:#fff; display:block; text-decoration:none; text-align:center;}
div.genre-tag-fb a {font-size:1.4rem; color:#039; background-color:#fff; text-decoration:none; display:block; padding:2rem 0; border-left:2px solid #039; border-right:2px solid #039;}
div.genre-tag-fb a:hover {font-size:1.4rem; color:#fff; background-color:#039; padding:2rem 0; border-left:2px solid #039; border-right:2px solid #039; transition:.4s;}

/* ダミー */
div.genre-dum-fb {width:calc(100% / 5.5); margin-bottom:1rem; background-color:#fff; text-decoration:none; display:none; text-align:center; border-radius:1rem;}
div.genre-dum-fb a {font-size:1.4rem; color:#fff; background-color:#fff; text-decoration:none; display:block; padding:4rem 0; border-radius:1rem;}
}

/* 記事サムネイル　基本形 */
/* ジャンル・カテゴリ、検索結果一覧でも流用 */
section.mov-area {width:100%; height:auto;}

section.kiji-kukuri {margin-bottom:2rem; padding:0; border:1px solid #fff;}
article.kiji-thumb-new {width:100%; height:auto;}
article.kiji-thumb {width:100%; height:auto; padding:2rem 1rem 0 1rem; margin:0; border-bottom:0.2rem dotted #ccc;}
  article.kiji-thumb-last {width:100%; height:auto; padding:2rem 1rem 0 1rem; margin:0 0 6rem 0; border-bottom:0.2rem dotted #ccc;}
article.kiji-thumb-2-comp {width:100%; height:auto; padding:2rem 1rem 0 1rem; margin:0; border-bottom:0.2rem dotted #ccc; background-color:#fafafa;}
  article.kiji-thumb-2-comp-last {width:100%; height:auto; padding:2rem 1rem 0 1rem; margin:0 0 6rem 0; border-bottom:0.2rem dotted #ccc; background-color:#fafafa;}
div.kiji-thumb-img {width:90%; height:auto; background-color:#fff; margin:0 auto 1.6rem auto;}
  div.kiji-thumb-img img{width:100%; height:auto; object-fit:cover;}
div.kiji-thumb-txt {width:90%; margin:0 auto; padding:0 0 0 0;}
/* タグリボン */
div.kiji-thumb-ribon {width:90%; padding:0.8rem 0; margin:0 auto; position:relative; right:0; bottom:0; display:flex; justify-content:space-between; flex-wrap:wrap;}
div.ribon-seminar {width:calc(100% / 2.1); font-size:1.2rem; color:#fff; background-color:#99a; padding:0.6rem 0.6rem; margin:0 0.3rem 1rem 0.3rem; border-radius:0.6rem;}

p.kiji-thumb-honbun {font-size:1.2rem; line-height:2.2rem; text-align:justify; color:#888;}

/* もっと見るボタン */
div.kiji-mottomiru-area {margin:1rem 0 6rem 0;}
div.kiji-mottomiru-button {width:16rem; text-align:center; margin:0 0 0 auto; padding:0.6rem 1.6rem; color:#fff; background-color:#222; border-radius:6px; font-weight:bold; font-size:1.6rem;}

@media screen and (min-width:600px) and (max-width:1024px) {
section.mov-area {width:100%; height:auto; margin:0 auto;}

section.kiji-kukuri {width:95%; margin:0 auto 2rem auto; padding:0; border:1px solid #fff; display:flex; justify-content:space-between; flex-wrap:wrap;}
article.kiji-thumb-new {width:90%; height:auto; margin:0 auto;}
article.kiji-thumb {width:calc(100% / 2.05); height:auto; padding:2rem 1rem; margin:0 0 1rem 0; background-color:#fff;}
article.kiji-thumb-last {width:calc(100% / 2.05); height:auto; padding:2rem 1rem; margin:0 0 6rem 0; background-color:#fff;}
article.kiji-thumb-2-comp {width:calc(100% / 2.05); height:auto; padding:2rem 1rem; margin:0 0 1rem 0; background-color:#fff;}
div.kiji-thumb-img {width:100%; height:auto; background-color:#fff; border:1px solid #888; margin:0 0 1rem 0;}
  div.kiji-thumb-img img {width:100%; height:auto; object-fit:cover;}
div.kiji-thumb-txt {width:100%; padding:0 0 0 0;}
/* タグリボン */
div.kiji-thumb-ribon {width:100%; position:relative; right:0; bottom:0; display:flex; justify-content:space-between; flex-wrap:wrap;}
div.ribon-seminar {width:calc(100% / 2.1); font-size:1.2rem; color:#fff; background-color:#99a; padding:0.6rem 0.6rem; margin:0 0 1rem 0; border-radius:0.6rem;}

p.kiji-thumb-title {font-size:2rem; font-weight:bold; line-height:2.6rem; color:#666;}
p.kiji-thumb-title a {text-decoration:underline;}
p.kiji-thumb-honbun {font-size:1.2rem; line-height:2.4rem; text-align:justify; color:#888;}

/* もっと見るボタン */
div.kiji-mottomiru-area {width:100%; margin:1rem 0 10rem 0; text-align:center;}
div.kiji-mottomiru-button {width:100%; text-align:center; margin:0 auto 0 auto; padding:1.6rem 3rem; color:#fff; background-color:#222; border-radius:6px; font-weight:bold; font-size:1.6rem; display:inline-block;}
}

@media screen and (min-width:1025px) {
section.mov-area {width:90%; height:auto; margin:0 auto;}

section.kiji-kukuri {margin-bottom:2rem; padding:0; border:1px solid #fff;}
article.kiji-thumb-new {width:100%; height:auto;}
article.kiji-thumb {width:100%; height:auto; padding:2rem 1rem 0 1rem; margin:0; border-bottom:0.2rem dotted #ccc;}
  article.kiji-thumb-last {width:100%; height:auto; padding:2rem 1rem 0 1rem; margin:0 0 6rem 0; border-bottom:0.2rem dotted #ccc;}
article.kiji-thumb-2-comp {width:100%; height:auto; padding:2rem 1rem 0 1rem; margin:0; border-bottom:0.2rem dotted #ccc; background-color:#fafafa;}
  article.kiji-thumb-2-comp-last {width:100%; height:auto; padding:2rem 1rem 0 1rem; margin:0 0 6rem 0; border-bottom:0.2rem dotted #ccc; background-color:#fafafa;}
div.kiji-thumb-img {width:30%; height:auto; background-color:#fff; float:left;}
  div.kiji-thumb-img  img{width:100%; height:auto; object-fit:cover;}
div.kiji-price-label-muryo {position:absolute; right:1rem; bottom:1rem; padding:1.4rem; background-color:#f00;}
  div.kiji-price-label-muryo p {font-size:2rem; color:#fff;}
div.kiji-price-label-yuryo {position:absolute; right:1rem; bottom:1rem; padding:1.4rem; background-color:#00f;}
  div.kiji-price-label-yuryo p {font-size:2rem; color:#fff;}
div.kiji-thumb-txt {width:70%; padding:0 0 0 3rem; float:right;}
/* タグリボン */
div.kiji-thumb-ribon {width:100%; padding:0.8rem 0; position:relative; right:0; bottom:0; display:flex; justify-content:flex-end; flex-flow:row wrap;}
div.ribon-seminar {width:auto; font-size:1.2rem; color:#fff; background-color:#99a; padding:0.6rem 1rem; margin:0 0.6rem 1rem 0.6rem; border-radius:0.6rem; display:inline-block;}

p.kiji-thumb-title {font-size:2.4rem; font-weight:bold; line-height:2.6rem; color:#666;}
p.kiji-thumb-title a {text-decoration:underline;}
p.kiji-thumb-honbun {font-size:1.4rem; line-height:2.6rem; text-align:justify; color:#888; margin:0 0 1rem 0;}

/* もっと見るボタン */
div.kiji-mottomiru-area {margin:1rem 0 6rem 0; text-align:right;}
div.kiji-mottomiru-button {width:auto; text-align:center; margin:0 0 0 auto; padding:6px 16px; color:#fff; background-color:#039; border-radius:6px; font-weight:bold; font-size:1.6rem; display:inline-block;}
}

/* お知らせエリア トップページのみ */
div#news {width:100%; height:auto; margin:0 0 3rem 0; line-height:2.4rem;}
  span.news-day {font-size:1.2rem; display:inline-block; width:auto; padding:0.2rem 0.6rem; margin:0 2rem 0 0; background-color:#f36; color:#fff;}
  span.news-news {font-size:1.2rem;}
  hr.news-line {border-bottom:1px dotted #aaa; margin:1rem 0; border-top:1px solid #ddd;}

/* ********************************************************************** */
/* ココカラ「一覧ページ」id="main"の中身　ジャンル、カテゴリ問わず検索結果は共通 */
/* 基本形はトップの一覧を流用 */
/* ********************************************************************** */
div#page-no-area {margin:0 auto 30px auto; text-align:center; display:flex; justify-content:center;}
div.page-no {width:30px; height:30px; overflow:hidden; text-align:center; vertical-align:middle; font-size:1.4rem; padding:0.6rem; color:#557; display:inline-block; margin:0 0.6rem; border:2px solid #557;}
div.page-no-current {width:30px; height:30px; overflow:hidden; text-align:center; vertical-align:middle; font-size:1.4rem; padding:0.6rem; color:#fff; display:inline-block; margin:0 0.6rem; border:2px solid #557;background-color:#557; }
div.page-no:hover {color:#fff; display:inline-block; margin:0 0.6rem; border:2px solid #779; background-color:#779; transition:.4s;}

/* ********************************************************************** */
/* ココカラ「動画の詳細・個別ページ」 /kiji-page/kiji-page.html（仮 */
/* ********************************************************************** */
/* サムネイル部分 */
div.thumb-area {width:100%; height:auto; text-align:center;}
div.thumb-img {width:100%; height:auto; border:1px solid #aaa; margin:0 auto; margin-bottom:3rem;}
div.mov-mottomiru-area {width:100%; margin:1rem 0 6rem 0;}
div.mov-mottomiru-button {width:100%; text-align:center; margin:0 0 0 auto; padding:2rem 1.6rem; color:#fff; background-color:#f66; border-radius:0.6rem; font-weight:bold; font-size:1.8rem;}
div.photo-booth {width:100%; margin-bottom:6rem; display:flex; flex-flow:row wrap; justify-content:space-around;}
div.photo {width:calc(100% / 4.1); height:auto;}
div.photo img {width:100%; height:auto; object-fit:cover;}

video.umekomi {width:100%; object-fit:cover;}
div.yt-umekomi {width:100%; height:auto; margin:0 auto 3rem auto; position:relative; padding-top:56.25%;}
div.yt-umekomi iframe.yt-move {position:absolute; top:0; right:0; width:100%; height:100%;}


/* 記事ページテキスト関連 */
div.kiji-honbun-area {width:100%; text-align:justify; margin:0 0 4rem 0;}
p.kiji-honbun {font-size:1.6rem; color:#777; line-height:3rem;}
p.kiji-komidashi {font-size:1.8rem; font-weight:bold; color:#59f; line-height:3rem; margin:0 0 2rem 0;}

/* ********************************************************************** */
/* ココカラ「イベントカレンダーページ」 /calender/calender.html（仮 */
/* ********************************************************************** */
table#calender {width:90%; border:2px solid #666; margin-bottom:30px; border-collapse:collapse; border-spacing:0; margin:0 auto;}
tr {}
th.th-nichiji {width:20%; background-color:#039; padding:6px 10px; color:#fff; font-size:1.6rem; border-right:1px solid #fff;}
th.th-naiyou {width:80%; background-color:#039; padding:6px 10px; color:#fff; font-size:1.6rem;}
td.nichiji {width:20%; height:40px; border:1px solid #666; padding:6px 10px;}
td.nichiji-sat {width:20%; height:40px; border:1px solid #666; background-color:#def; padding:6px 10px;}
td.nichiji-sun {width:20%; height:40px; border:1px solid #666; background-color:#fdd; padding:6px 10px;}
td.naiyou {width:80%; height:40px; border:1px solid #666; padding:6px 10px;}

/* ********************************************************************** */
/* ココカラ「ユーチューブなどの様々な動画へのリンクページ」 */
/* ********************************************************************** */
div.read {width:100%; font-size:1.2rem; color:#666; line-height:2.4rem; text-align:justify; margin:0 0 20px 0;}
div.om-select {width:100%; margin:0 0 2rem 0;}
div.om-select-2 {width:100%; margin:0 0 2rem 0;}
  div.om-block {width:100%; height:auto; padding:1rem; margin:0 0 3rem 0;}
  div.om-thumb {position:relative; padding-top:56.25%; width:100%; height:0; margin:0 0 1rem 0;}
  div.om-thumb iframe {position:absolute; top:0; right:0; width:100%; height:100%;}
  div.om-thumb img {width:100%; height:auto; object-fit:cover;}
  div.om-txt-area {width:100%; height:auto; text-align:justify; background-color:#fff;}
  p.om-sel-tl {font-size:1.4rem; color:#777; margin:0 0 1rem 0;}
  p.om-sel-tx {font-size:1.2rem; color:#777;line-height:2.6rem;}
@media screen and (min-width:600px) and (max-width:1024px) {
div.read {width:100%; font-size:1.2rem; color:#666; line-height:2.4rem; text-align:justify; margin:0 0 20px 0;}
div.om-select {width:100%; margin:0 0 2rem 0; display:flex; flex-wrap:wrap; justify-content:space-between;}
div.om-select-2 {width:100%; margin:0 0 2rem 0; display:flex; flex-wrap:wrap; justify-content:space-between;}
  div.om-block {width:calc(100% / 2); height:auto%; margin:0 0 3rem 0;}
  div.om-thumb {position:relative; padding-top:56.25%; width:100%; height:0; margin:0 0 1rem 0;}
  div.om-thumb iframe {position:absolute; top:0; right:0; width:100%; height:100%;}
  div.om-thumb img {width:100%; height:auto; object-fit:cover;}
  div.om-txt-area {width:100%; height:auto; text-align:justify; background-color:#fff;}
  p.om-sel-tl {font-size:1.4rem; color:#777; margin:0 0 1rem 0;}
  p.om-sel-tx {font-size:1.2rem; color:#777;line-height:2.6rem;}
}
@media screen and (min-width:1025px) {
  div.read {width:100%; font-size:1.2rem; color:#666; line-height:2.4rem; text-align:justify; margin:0 0 20px 0;}
  div.om-select {width:100%; margin:0 0 2rem 0; display:flex; flex-wrap:wrap; justify-content:space-between;}
  div.om-select-2 {width:100%; margin:0 0 2rem 0; display:flex; flex-wrap:wrap; justify-content:space-between;}
    div.om-block {width:calc(100% / 2); height:auto; margin:0 0 2rem 0;}
    div.om-thumb {position:relative; padding-top:56.25%; width:100%; height:0; margin:0 0 1rem 0;}
    div.om-thumb iframe {position:absolute; top:0; right:0; width:100%; height:100%;}
    div.om-thumb img {width:100%; height:auto; object-fit:cover;}
    div.om-txt-area {width:100%; height:auto; text-align:justify; background-color:#fff;}
    p.om-sel-tl {font-size:1.4rem; color:#777; margin:0 0 1rem 0;}
    p.om-sel-tx {font-size:1.2rem; color:#777;line-height:2.6rem;}  
}

/* ********************************************************************** */
/* ココマデ「メインエリア」 全ページで共通サイズ */
/* ********************************************************************** */


/* ********************************************************************** */
/* 以下「サイド」全ページ共通 */
/* ********************************************************************** */
div#side {width:100%; height:auto; padding:3rem 2rem 3rem 2rem; background-color:#fff;}
@media screen and (min-width:1025px)
{
div#side {width:29%; height:auto; float:right; padding:3rem 2rem 3rem 2rem; background-color:#fff;}
}

/* キーワード検索 */
div#keyword-area {width:100%; height:auto; margin:0 0 30px 0; background-color:#faebd7; padding:10px 15px;}
div.search-win {background-color:#fff; border-radius:2px; margin:0 auto; width:80%; height:auto; vertical-align:middle; padding:0 1rem;}

/* 直近のセミナー サイド版＝常時表示 */
div#sem-prom-s {width:100%; height:auto; padding:1rem; margin:0 auto 2rem auto; background-image:url(/img/texture.png); background-repeat:none;}
div#sem-mottomiru-area {}
div#sem-mottomiru-button {width:160px; text-align:center; margin:0 0 0 auto; padding:6px 16px; color:#fff; background-color:#f66; border-radius:6px; font-weight:bold; font-size:1.6rem;}

/* イベントカレンダーミニ 実際にはCMSのウィジェットでできるといいなぁ */
div#cal-mini {width:100%; margin:0 auto;}
table#mini {width:100%; border:2px solid #aaa; border-collapse:collapse; border-spacing:0; margin:0 auto; background-color:#fff;}
table#mini tr {height:60px;}
table#mini td {width:calc(100% / 7); height:60px; border:1px solid #aaa; text-align:center; vertical-align:middle;}
table#mini td.sun {width:calc(100% / 7); background-color:#fdd; height:60px; border:1px solid #aaa; text-align:center; vertical-align:middle;}
table#mini td.sat {width:calc(100% / 7); background-color:#def; height:60px; border:1px solid #aaa; text-align:center; vertical-align:middle;}
p.event-day {font-size:1.2rem; color:#f55;}

div.an-nai {width:80%; margin:10px auto 30px auto; padding:4px 0; text-align:center; border:2px solid #f33; font-size:1.4rem; color:#f33;}

/* ジャンル・カテゴリ一覧エリア 簡易版サイトマップもどき */
div.easy-map {width:100%; margin-bottom:3rem; padding:1rem 1.6rem; display:flex; justify-content:space-between; flex-wrap:wrap; font-size:1.4rem; line-height:2rem; border-top:0.3rem solid #999; border-bottom:0.3rem solid #999; background-color:#eee;}
div.easy-map-box {width:calc(100% / 2.1); padding:1rem 0.8rem; font-size:1.4rem; line-height:3rem;}
hr.easy-map-line {border-bottom:0.1rem dotted #aaa; margin:1rem 0; border-top:0.1rem solid #eee;}
div.e-m-g {width:240px; margin:0 auto -0.6rem auto; font-size:1.4rem; color:#777;}
div.e-m-c {width:240px; margin:0 auto -0.6rem auto; text-indent:2rem; font-size:1.4rem; color:#777;}
div.e-m-c-last {width:240px; margin:0 auto 0 auto; text-indent:2rem; font-size:1.4rem; color:#777;}
/* リストで */
ul {width:100%; line-height:3.4rem; display:inline-block;}
ul li {color:#777; width:100%; font-size:1.4rem; line-height:3.4rem;}
li ul {padding:0 0 0 2rem; line-height:3.4rem; display:inline-block;}
li ul li {color:#777; text-indent:2rem; font-size:1.4rem; line-height:3.4rem;}
@media screen and (min-width:1025px)
{
/* ジャンル・カテゴリ一覧エリア 簡易版サイトマップもどき */
div.easy-map {width:100%; margin-bottom:3rem; padding:1rem; border-top:0.3rem solid #999; border-bottom:0.3rem solid #999; background-color:#eee;}
div.easy-map-box {width:100%; padding:1rem; line-height:2rem;}
hr.easy-map-line {border-bottom:0.1rem dotted #aaa; margin:1rem 0; border-top:0.1rem solid #eee;}
/* リストで */
ul.emb {width:100%; line-height:3.4rem;}
ul.emb li {width:100%; font-size:1.4rem; color:#888; line-height:3.4rem;}
ul.emb li ul {padding:0 2rem; line-height:3.4rem; display:inline-block; text-indent:1.6rem;}
ul.emb li ul li {text-indent:2rem; font-size:1.2rem; line-height:3.4rem; color:#888;}
}
/* サイドのバナー */
div.s-bunner-area {width:100%; margin:0 auto; text-align:center; display:flex; justify-content:space-between; flex-wrap:wrap;}
div.s-bunner-area img {width:calc(100% / 3.2); height:auto; margin-bottom:1rem; object-fit:cover;}
@media screen and (min-width:1025px) {
div.s-bunner-area {width:90%; margin:0 auto; text-align:center;}
div.s-bunner-area img {width:100%; height:auto; margin-bottom:2rem; object-fit:cover; border:1px solid #888;}
}
/* ********************************************************************** */
/* ココマデ「サイド」全ページ共通 */
/* ********************************************************************** */


/* ********************************************************************** */
/* ココカラ「フッター」全ページ共通 */
/* ********************************************************************** */
/* フッター */
footer#footer-base {width:100%; height:auto; background-color:#557; padding:20px 0;}
div.footer-in {width:90%; height:auto; margin:0 auto; display:flex; justify-content:space-between; flex-wrap:wrap;}
div.footer-t {width:100%; padding:0 0 2rem 0; margin:0 0 2rem 0; border-bottom:3px dotted #fff;}
div.footer-t p {color:#fff; font-size:1.2rem; line-height:2.8rem;}
div.footer-m {width:calc(100% / 2.1); padding:0 0.1rem; margin:0 0 2rem 0; border-bottom:3px dotted #fff;}
div.footer-m p {color:#fff; font-size:1rem; line-height:2.6rem;}
div.footer-b {width:100%; padding:0 0 2rem 0; margin:0 0 2rem 0;}
div.footer-b p {color:#fff; font-size:1rem; line-height:1.6rem;}
@media screen and (min-width:1025px) {
footer#footer-base {width:100%; height:auto; background-color:#557; padding:20px 0;}
div.footer-in {width:90%; height:auto; margin:0 auto; display:flex; justify-content:space-between; flex-wrap:wrap;}
div.footer-t {width:100%; padding:0 0 2rem 0; margin:0 0 2rem 0; border-bottom:3px dotted #fff;}
div.footer-t p {color:#fff; font-size:1.4rem; line-height:2.8rem;}
div.footer-m {width:calc(100% / 3.1); padding:0 0.1rem; border-bottom:3px dotted #fff;}
div.footer-m p {color:#fff; font-size:1.2rem; line-height:2.6rem;}
div.footer-b {width:100%; padding:0 0 2rem 0; margin:0 0 2rem 0;}
div.footer-b p {color:#fff; font-size:1rem; line-height:1.6rem;}
}
/* ********************************************************************** */
/* ココマデ「フッター」全ページ共通 */
/* ********************************************************************** */


/* ********************************************************************** */
/* 注意・補足・説明文章 */
/* ********************************************************************** */
p.hosoku-bun {font-size:1rem; color:#f00; line-height:2.2rem; margin:2rem 0; padding:1rem; border:0.1rem solid #f00;}
