@charset "UTF-8";

*{
	list-style-type:none;
	box-sizing: border-box;
}

body {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	overflow-x: hidden;
	font-family: 'Noto Sans JP', sans-serif;
	line-height: 1.8;
}

@media (max-width: 767px){
	body {
		width: 100%;
		max-width: 100%;
		overflow-x: hidden;
	}
}

.container-fluid {
	width: 1200px;
/*	margin: 0 auto;*/
}

@media (max-width: 767px){
	.container-fluid {
		width: 100%;
/*		margin-left: 10px;*/
/*		margin-right: 10px;*/
	}
}

a {
	text-decoration:none;
}
a:hover {
	text-decoration:none;
}
.img-responsive-overwrite{
    margin: 0 auto;
    box-sizing: border-box;
}

@media (max-width: 767px){
	.img-responsive-overwrite{
		max-width: 100%;
	}
}

.jumbotron {
	width: 100vw;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}

.img-box:hover {
    opacity: 0.8;
}
.img-box-mini{
  position: absolute;
  bottom: 60px;
  left: 0px;
  width: 100%;
  color: #FFFFFF;
  text-shadow: 1px 1px 1px #666666;
 }

.img-box-mini a {
	padding: 10px 30px; 
	font-weight:bold;
	font-size: 24px;
	border: 3px solid;
	border-color :#FFFFFF;
}

.img-box-mini a:hover {
	border-color :#DDDDDD;
}

.img-box-text{
  text-align: center;
  width: 100%;
  font-size: 50px;
  font-weight: bold;
}

.img-box-lg{
  position: absolute;
  bottom: 25%;
  left: 0px;
  width: 100%;
  color: #FFFFFF;
  text-align: center;
 }

.img-box-lg a {
	padding: 20px 10px; 
	font-size: 18px;
	width: 60%;
}

.img-box-lg a:hover {
	border-color :#DDDDDD;
}

.img-box-lg-text{
  text-align: center;
  margin: 0 auto;
  padding-top: 40px;
  padding-bottom: 5px;
  color: #111;
  text-shadow: 2px 2px 4px #FFF;
  font-size: 20px;
  font-weight: bold;
}

@media (max-width: 767px){
	.img-box-lg-text{
	  text-align: center;
	  margin: 0 auto;
	  padding-top: 0;
	  font-size: 18px;
	}
}

/* ボックスの左右に確保する余白 */
.box1, .boxA {
	padding-left: 40px;
	padding-right: 10px;
}
@media (max-width: 767px){
	.box1, .boxA {
		padding-left: 10px
	}
}

/* サイト名 */
.site h1 a {
	color: #FFFFFF;
	text-decoration: none;
}

.site h1:hover {
	opacity: 0.8;
}

.site h1 {
	margin: 0;
	color: #FFFFFF;
	font-size: 32px;
	font-weight: bold;
	font-family: 'Noto Sans JP',sans-serif;
	text-shadow: 1px 1px 1px #999999;
	padding-top: 0px;
	padding-left: 0px;
	margin-top: 10px;
}

/* ヘッダー画像にキャッチコピーを重ねる */
.top {
	position: relative;
}

.icon i {
	display: block;
	padding-top: 20px;
	padding-bottom: 10px;
	font-size: 100px;
	text-align: center;
	color: #f3c759;
}

.icon_mini i {
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 60px;
/*	text-align: right;*/
}

.news h1 {
	margin-top: 0px;
	margin-bottom: 5px;
	font-size: 18px;
	color: #666666;
}

.news ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.news li a {
	display: block;
	padding: 5px;
	border-bottom: dotted 2px #dddddd;
	color: #000000;
	font-size: 14px;
	text-decoration: none;
}

.news time {
	color: #888888;
	font-weight: bold;
}

.news a:after {
	content: "";
	display: block;
	clear: both;
}

.news time {
	float: left;
	width: 60px;
}

.news .text {
	float: none;
	width: auto;
	margin-left: 120px;
}

.news li a:hover {background-color: #eeeeee}

.news {
    width: 100%;
    margin: 10px;
    padding: 0px;
}

.news dl {
    border-bottom: 1px solid #CCC;
}

.news dt {
    font-weight: normal;
    float: left;
}

.news dd {
    margin-left: 120px;
    margin-bottom: 10px;    
}

.history dl {
    border-bottom: 1px solid #CCC;
}

.history dt {
    font-weight: normal;
    float: left;
    font-size: 18px;
}

.history dd {
    margin-left: 120px;
    margin-bottom: 10px;    
    font-size: 18px;
}

.about {
	padding: 10px;
}

.about-txt {
	text-align: center;
	line-height: 150%;
}

@media (max-width: 767px){
	.about-txt {
		text-align: left;

	}
}

.new-seminar {
	width:400px;
	/* margin-left:80px; */
}

@media (max-width: 767px){
	.new-seminar {
		width: 100%;
		/* margin-left:10px; */
		/* margin-right:10px; */
	}
}

li {
	margin-top: 0;
	margin-bottom: 0;
}

.logo {
	margin: 0px;
	display: inline-block;
	padding: 30px 10px;
	background-color: #ffffff;
	color: #3DB680;
	border: 2px solid;
	border-color: #3DB680;
	font-size: 16px;
	font-weight: bold;
}

/* BOX Aの下に罫線を挿入（コンテンツページのみ） */
.contents .boxA{border-bottom: solid 1px #dddddd}

.btn input {
    background: #09C;
    border: 1px solid #DDD;
    color: #FFF;
    text-shadow: 2px 2px 1px rgba(0,0,0,0.5);
    width: 100px;
    padding: 10px 0;
}

.btn {
    border-radius: 0px;
}

.btn-seminar {
	padding:15px 40px; 
	margin:40px 0px 0px 0px;
	border-radius: 40px;
	color: #FFFFFF;
	background-color:rgba(0,0,0,0.1);
	border: 3px solid #FFFFFF;
}

.btn-seminar:hover {
	border-radius: 40px;
	color: #FFFFFF;
	background-color:rgba(0,0,0,0.1);
	border: 3px solid #FFFFFF;
	opacity: 0.8;
}

/* BOXの背景色 */
.boxA {
	background-color: #000055;
/*	max-width: 1190px;*/
	margin: 0 auto;
}

.box2 {
	padding-left:  0px;
	padding-right: 0px;
	margin: 15px 0px 0px 0px;
}

.box2 a {
	background-color: #000055;
    width: 120px;
    padding: 10px 0;
}

.box2 a:hover {
	opacity: 0.8;
}

/* ボックスの左右 */
.boxA {
	padding-left: 15px;
	padding-right: 15px;

}

/* ボックスの上下 */
.boxA {
	padding-top: 10px;
	padding-bottom: 5px;
}

/* プルダウンリスト用追加 */
ul.ulmenu li {
	float: left;
	position: relative;
	z-index: 500;
}

ul.ulmenu li a {
	display: block;
	color: #FFFFFF;
	font-size: 16px;
	padding: 5px 0 10px 0;
	text-align: center;
}

ul.ulmenu li a:hover{
	opacity: 0.8;
}

ul.ulmenu li ul.sub {
	position:absolute;
}

ul.ulmenu {
	zoom: 1;
}

ul.ulmenu:after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}

.iframe-content {
    position: relative;
    width: 100%;
    padding: 75% 0 0 0;
}
.iframe-content iframe {
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
}

.carousel {
	width: 100vw;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}

.carousel-caption h2 {
	font-size: 40px;
}

.carousel-caption p {
	font-size: 16px;
}

.menu li a {
	padding: 0px;
}

.fontawesome i {
	font-size: 50px;
}

.mail-reg {
	background-color: #EEE;
	padding:0 20px;
	width: 100vw;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}

.mail-reg span {
	display: inline-block;
	font-size: 20px;
	margin: 20px;
}

.mail-reg input {
	font-size: 18px;
	width: 40%;
}

.required {
	border: 1px solid #E06A3B;
	color: #FFFFFF;
	font-weight: normal;
	background-color: #E06A3B;
	margin-left: 10px;
	margin-bottom: 10px;
	padding: 0 10px;
}

ul.pageNav01 {
	margin: 0 0px 10px;
	padding: 10px 10px 5px;
	/*background: #eee;*/
	text-align: center;
	border-top: 2px solid #aaa;
	border-bottom: 2px solid #aaa;
}

ul.pageNav01 li {
	display: inline;
	margin: 0 2px;
	padding: 0;
}

ul.pageNav01 li span,
ul.pageNav01 li a {
	display: inline-block;
	margin: 0 20px 5px 20px;
	padding: 5px 10px;
	font-size: 16px;
	text-decoration: none;
	vertical-align: middle;
}

span.page {
	display: inline-block;
	border: 1px solid #000055;
	background-color: #000055;
	color: #FFFFFF;
}

ul.pageNav01 li a:hover {
	background: #eeeff7;
	border-color: #00f;
}

.page-header {
	border-bottom: 1.5px solid #444;
	font-weight: bold;
	max-width: 90%;
}

th, td {
	border: 1px solid black;
	padding: 5px;
	font-weight: normal;
}


.table-responsive .wrap_scroll_table {
  /* overflow-x: scroll; */
  margin: 0 auto;
}

@media (max-width: 767px){
	.wrap_scroll_table {
		margin: 0 5px 0 5px;
	}
}

.table-responsive .scroll_table {
  margin-top: 10px;
  margin: 0 auto;
}

.table-responsive .scroll_table,
.table-responsive .scroll_table td,
.table-responsive .scroll_table th {
  border: 1px solid #cbced2;
  border-collapse: collapse;
  text-align: center;
}

.table-responsive .scroll_table th {
  background: #01214d;
  color: #fff;
  padding: 4px 12px;
}

.table-responsive .scroll_table td {
	background: #f5f6f8;
	padding: 4px 12px;
}

@media (max-width: 767px){
	.scroll_table td {
		white-space: normal;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 33%;
	}
}

.table-responsive .txt {
  margin: 0 auto;
  font-size: 14px;
  font-size: 1.4rem;
  margin-top: 2px;
}

.table-supervision {
	width: 1100px;
	box-sizing: border-box;
}

@media (max-width: 767px){
	.table-supervision {
		margin-left: 15px;
		margin-right: 15px;
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
	}
}

.text-supervision {
	width: 1100px;
	box-sizing: border-box;
	text-align: left;
}

@media (max-width: 767px){
	.text-supervision {
		margin-left: 5px;
		margin-right: 5px;
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;

	}
}


@media screen and (max-width: 767px){
	.br-pc {display: none; }
}

@media screen and (min-width: 768px){
	.br-sp {display: none; }
}

.access {
	margin-top:20px;
}

@media (max-width: 767px){
	.access {
		padding-left: 10px;
	}
}

.access li {
	padding-left: 5px;
}

@media (max-width: 767px){
	.access li {
		padding-left: 5px;
	}
}

.recommend {
	width: 850px;
	text-align: left;
}

@media (max-width: 767px){
	.recommend {
		width: 100%;
		padding: 0 10px;
	}
}

.program-txt {
	font-size: 16px;
}

@media (max-width: 767px){
	.program-txt {
		padding-left: 10px;
	}
}

.footer {
	text-align: center;
	background-color:#000055; 
	padding: 10px 0; 
	margin-bottom: 0; 
	color:#FFF; 
	width:auto;
	width: 100vw;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}


/* ################ 767px以下 ################ */
@media (max-width: 767px){

.carousel-caption h2 {
	font-size: 12px;
	margin-bottom: 0px;
}

.carousel-caption p {
	font-size: 5px;
	margin-top: 0px;
}

#row-1st {
	overflow: scroll;
}
#row-1st-in {
	width: 100%;
}  

.mail-reg span {
	display: inline-block;
	font-size: 16px;
	margin: 10px 0px;
}

.mail-reg input {
	font-size: 16px;
	width: 80%;
	margin-bottom: 10px;
}

/* ナビゲーション */
.menu li a {
	padding: 20px 7px 10px 7px;
	font-size: 8px;
}
ul.ulmenu li {
	font-size: 8px;
}

.carousel {
/*	background-color: #3DB680;*/
}

.carousel-caption h2 {
	font-size: 20px;
	margin-bottom: 5px;
}

.carousel-caption p {
	margin-top: 5px;
	font-size: 12px;
}

ul.pageNav01 li span,
ul.pageNav01 li a {
	display: inline-block;
	margin: 0 5px 5px 5px;
	padding: 5px 5px;
	font-size: 12px;
	text-decoration: none;
	vertical-align: middle;
}

/* トグルボタン */
#menubtn {
	padding: 6px 12px;
	border: solid 1px #aaaaaa;
	border-radius: 5px;
	background-color: #ffffff;
	position: absolute;
	top: 20px;
	right: 15px;
	cursor: pointer;
}

#menubtn:hover {
	background-color: #dddddd;
}

#menubtn:focus {
	outline: none;
}

#menubtn i {
	color: #888888;
	font-size: 18px;
}

#menubtn span {
	display: inline-block;
	text-indent: -9999px
}

/* ナビゲーションメニュー（縦並び） */
#menu {display: none}

.menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.menu li a {
	display: block;
	padding: 5px 0 5px 0;
	margin:0;
	color: #3DB680;
	font-size: 14px;
	text-decoration: none;
}

.menu li a:hover {opacity:0.8;}

.img-box-lg{
  bottom: 25%;
  left: 0px;
  width: 100%;
 }

.img-box-lg a {
	padding: 15px 10px; 
	font-size: 14px;
	width: 60%;
}

p {
	font-size: 14px;
}

}

/* ################ 768px以上 ################ */
@media (min-width: 768px){

/* トグルボタン */
#menubtn {display: none}

/* ナビゲーション */
#menu {display: block !important}

.menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.menu ul a {
	display: block;
	padding: 5px 0px 5px 0px;
	margin:0;
	color: #666666;
	font-size: 14px;
	text-decoration: none;
}

.menu ul a:hover {opacity: 0.8}

.menu ul:after {
	content: "";
	display: block;
	clear: both;
}

.menu li {
	float: left;
	width: auto;
}

/* BOX1 と BOX2 を横に並べる設定 */
.boxA:after {
	content: "";
	display: block;
	clear: both;
}

.box1 {
	float: left;
	width: auto;
}

.box2 {
	float: right;
	width: auto;
}

}

/* ################ 1190px以上 ################ */
@media (min-width: 1190px){

/* 全体の横幅を固定 */
.boxA-inner{
	width: 1140px;
	margin-left: auto;
	margin-right: auto;
}

/* BOXA のした下に罫線を挿入 */
.boxA {
	border-bottom: solid 2px #000055;
}

}
