@charset "utf-8";
*{ margin:0;padding:0;border:0;}

body {
  font-family: "Hiragino Kaku Gothic Pro", "メイリオ", "sans-serif";
  font-size: 22px;
  line-height: 1.5;
  min-width: 1000px;
}

h2 {
  width: 960px;
  border-top: 5px solid #00A3D9;
  font-size: 36px;
  color: #FF0000;
  font-weight: normal;
  padding: 30px 0 30px 0;
  text-align:center;
  margin: 0;
  line-height: 1.3em;
  font-weight: bold;
}

h3 {
  border-bottom: 2px solid #B20000;
  font-size: 28px;
  text-align: center;
}

h4 {

  font-size: 28px;
  text-align: center;
}

h5 {
  width: 1000px;
  border-top: 5px solid #ffa914;
  font-size: 44px;
  color: #FF0000;
  font-weight: normal;
  padding: 30px 0 50px 0;
  text-align:center;
  margin: 0;
  line-height: 1.3em;
  font-weight: bold;
}

h6 {
  width: 1000px;
  border-top: 5px solid #FFA500;
  font-size: 46px;
  color: #FF0000;
  font-weight: normal;
  padding: 30px 0 50px 0;
  text-align:center;
  margin: 0;
  line-height: 1.3em;
}

p {
  padding: 20px 0 0 0;
  font-size: 30px;
}

pre {
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  white-space: pre-wrap;
  padding: 20px 0 0 0;
  font-size: 30px;
}

input,select,select {
  padding: 10px;
  font-size: 1em;
}

#header {
  width: 100%;
  height: 100px;
  background: #000000;
  overflow: hidden;
}

#header-c {
  width: 960px;
  margin: 0 auto;
  padding: 20px 0 20px 0;
}

#header-nav {
  float: right;
  width: 681px;
  overflow: hidden;
}

#header-nav img {
  float: left;
}

#footer {
  width: 100%;
  padding: 20px 0 20px 0;
  background-color: #000000;
  color: #ffffff;
  text-align: center;
}

#footer a:link { color: #ffffff; text-decoration: none; }
#footer a:visited { color: #ffffff; text-decoration: none; }
#footer a:hover { color: #ffffff; text-decoration: underline; }
#footer a:active { color: #ffffff; text-decoration: underline; }

#main {
  background: url(images/header.png) center no-repeat;
  background-color: #C9D9E9;
  width: 100%;
  height: 190px;
}

#main1 {
  background: url(images/header-front.png) center no-repeat;
  background-color: #C9D9E9;
  width: 100%;
  height: 650px;
}

#main2 {
  background: url(images/header-backend.png) center no-repeat;
  background-color: #C9D9E9;
  width: 100%;
  height: 674px;
}

#main-c {
  width: 960px;
  height: auto;
  margin: 0 auto;
}

.txtbox {
  width: 650px;
  margin: 0 auto;
}

.wide {
  width: 100%;
  height: auto;
}

.section {
  width: 960px;
  height: auto;
  margin: 0 auto;
  overflow: hidden;
}

.contact {
  margin: 60px 0;
  text-align: center;
}

.bg01 {
  background: url(images/bg01.png) repeat-x;
}

.bg02 {
  background: url(images/h2_bg01.png) repeat-y;
  background-position: center center;
  height: auto;
  font-size: 16px;
  color: #ffffff;
  padding-bottom: 40px;
  overflow: hidden;
}

.bg03 {
  background: url(images/h2_bg02.png) repeat-y;
  background-position: center center;
  height: auto;
  color: #ffffff;
  padding-bottom: 40px;
  overflow: hidden;
}

.bg04 {
  background: url(images/bg02.png);
  padding: 20px 0 20px 0;
}

.bg05 {
  background-color: #E4F8F8;
  padding-bottom: 40px;
}

.img-m {
  float: left;
  margin: 0 20px 20px 0;
}

.img-m-r {
  float: right;
  margin: 0 0 0 20px;
}

.tro {
  width: 270px;
  height: auto;
  font-size: 20px;
  float: left;
  margin: 25px 25px 0 25px;
  text-align: center;
}

.tro img {
  margin-bottom: 20px;
}

.c-box {
  width: 876px;
  height: auto;
  padding: 40px;
  margin-bottom: 20px;
  background-color: #ffffff;
  border-right: 4px solid #D6D6D6;
  border-bottom: 4px solid #D6D6D6;
  color: #333333;
}

.l-frame {
  width: 960px;
  height: auto;
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 1px dashed #999999;
}

.voice-head {
  float: left;
  width: 100%;
  padding-bottom: 2px;
  margin-bottom: 20px;
  border-bottom: 5px solid #EEEEEE;
}

.voice-copy {
  font-size: 44px;
  font-weight: bold;
  line-height: 1.4;
}

.q {
  background: url(images/common/ico_q.png) no-repeat;
  padding: 10px 20px 20px 70px;
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: bold;
}

.a {
  background: url(images/common/ico_a.png) no-repeat;
  padding: 0 20px 10px 70px;
}

.t-comp table,.t-comp tr,.t-comp td {
  border-collapse: collapse;
  border: 1px solid #CCCCCC;
}

.t-comp table {
  background-color: #ffffff;
}

.t-comp td {
  padding: 10px;
  font-size: 15px;
  line-height: 1.4;
}

.t-form td {
  padding: 10px;
  font-size: 20px;
  line-height: 1.4;
  text-align: left;
}

.bg-gr {
  background-color: #DDDDDD;
}

.bg-g {
  background-color: #009F9F;
  color: #ffffff;
}

.f-bold {
  font-weight: bold;
}

.f-w40 {
  width: 40%;
}

.f-w80 {
  width: 80%;
}

.req {
  background: url(images/ico_req.png) no-repeat;
  padding: 2px 4px 4px 60px;
}

.txt24b {
  font-size: 24px;
  font-weight: bold;
}

.co-style01 {
  position:relative;
  left:-40px;
  width: 650px;
  background-color: #005493;
  color: #FFFFFF;
  padding: 40px;
  font-size: 18px;
}

.co-style01 img {
  width: 230px;
  margin: 0 0 20px 20px;
  float: right;
}

.tit_name {
  border-bottom: 2px solid #B20000;
  font-size: 46px;
  width: 100%;
  margin-bottom: 20px;
  padding-bottom: 10px;
  font-weight: bold;
}

.num {
  background-color: #00A3D9;
  color: #FFFFFF;
  padding: 10px 20px;
}

.check {
  padding: 15px 15px 15px 40px;
  background: url(images/common/check_icon.png) no-repeat 0 10px;
  border-bottom: 1px solid #DDDDDD;
  font-weight: bold;
}

.co-style02 {
  color: #000000;
  position:relative;
  left:-40px;
  width: 650px;
  border: 2px solid #B20000;
  background-color: #EEEEEE;
  padding: 40px;
  font-size: 16px;
}

.co-style02 img {
  width: 220px;
  margin: 0 0 20px 20px;
  float: right;
}

.co-style03 {
  color: #000000;
  position:relative;
  left:-40px;
  width: 650px;
  border: 2px solid #B20000;
  background-color: #f0fff0;
  padding: 40px;
  font-size: 16px;
}

.co-style03 img {
  width: 200px;
  margin: 0 0 20px 20px;
  float: right;
}

.co-style04 {
  color: #000000;
  position:relative;
  left:-40px;
  width: 650px;
  border: 2px solid #B20000;
  background-color: #FEECED;
  padding: 40px;
  font-size: 16px;
}

.co-style04 img {
  width: 200px;
  margin: 0 0 20px 20px;
  float: right;
}

.lec_list {
  width:200px;
  border-bottom: 1px dotted #666666;
  margin-bottom: 10px;
}

.co_r {
  color: #B20000;
}

ul li{
  padding-left: 20px;
  list-style:none;
}

ul ol {
  padding-left: 40px;
  list-style:none;
}

.bg-blue {
  background-color: #DFECF4;
}

#box {
  width: 500px;
  /* height: 170px; */
  padding: 20px;
  border: 1px solid gray;
  background-color: rgb(210, 232, 247);
  box-sizing: border-box;
}

#box li {
  margin-top: 2px;
  margin-left: 50px;
}

.inner{
  width: 80%;
  margin: 0 auto;
  max-width: 500px;
}

/* ::::: Q&A ここから ::::: */
.faq {
  width:100%;
  border: 1px solid #DDDDDD;
  margin-bottom: 20px;
}

.faq-q {
  background: url(images/common/icon_q.png) no-repeat 10px 10px;
  padding: 14px 14px 14px 60px;
  color: #005392;
  font-size: 20px;
  border-bottom: 1px solid #DDDDDD;
  background-color: #F7F7F7
}

.faq-a {
  background: url(images/common/icon_a.png) no-repeat 10px 10px;
  padding: 14px 14px 14px 60px;
  border-bottom: 1px solid #DDDDDD;
}

/* ::::: Q&A ここまで ::::: */

/* ::::: テーブル ここから ::::: */
.schedule table {
  width: 100%;
  margin-bottom: 40px;
  border: 1px #B20000 solid;
}
.schedule td, th {
  border: 1px #B20000 solid;
  padding: 10px;
  text-align: center;
}

.schedule th {
  background-color: #EEEEEE;
}

.schedule table.ex {
border-collapse: collapse;
}
/* ::::: テーブル ここまで ::::: */

/* ::::: 申し込みボタン ここから ::::: */

button.button1,
button.button1 span {
	position: relative;
        display: inline-block;
    background:none;
    border:0;
}
button.button2,
button.button2 span {
	position: relative;
        display: inline-block;
    background:none;
    border:0;
}
button.button1 span {
	padding: .80em 1em;
	background: -webkit-linear-gradient(#32b081 , #32b081);
	background: linear-gradient(#0BD318 , #00ff7f , #0BD318);
	border: 3px solid #008000;
	border-radius: 20px;
	font-size: 52px;
	font-family: "メイリオ","Meiryo"; font-weight: bold;
	text-shadow: 
	2px 2px 5px #000000,
	-2px 2px 5px #000000,
	2px -2px 5px #000000,
	-2px -2px 5px #000000,
	5px 5px 2px #999999;;
	color: #ffffcc;
	text-decoration: none;
	text-align: center;
	-webkit-animation: 2s float float ease-in-out infinite;
	animation: 2s float ease-in-out infinite;
	cursor: pointer;
}
button.button2 span {
	padding: .80em 1em;
	background: -webkit-linear-gradient(#32b081 , #32b081);
	background: linear-gradient(#0BD318 , #00ff7f , #0BD318);
	border: 3px solid #008000;
	border-radius: 20px;
	font-size: 70px;
	font-family: "メイリオ","Meiryo"; font-weight: bold;
	text-shadow: 
	2px 2px 5px #000000,
	-2px 2px 5px #000000,
	2px -2px 5px #000000,
	-2px -2px 5px #000000,
	5px 5px 2px #999999;;
	color: #ffffcc;
	text-decoration: none;
	text-align: center;
	-webkit-animation: 2s float float ease-in-out infinite;
	animation: 2s float ease-in-out infinite;
	cursor: pointer;
}
button.button1::after{
	position: absolute;
	bottom: -15px;
	left: 50%;
	content: '';
	width: 100%;
	height: 24px;
	background-color: rgba(0,0,0,.1);
	border-radius: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	-webkit-animation: 2s shadow ease-in-out infinite;
	animation:  2s shadow ease-in-out infinite;
}
button.button2::after{
	position: absolute;
	bottom: -15px;
	left: 50%;
	content: '';
	width: 100%;
	height: 24px;
	background-color: rgba(0,0,0,.1);
	border-radius: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	-webkit-animation: 2s shadow ease-in-out infinite;
	animation:  2s shadow ease-in-out infinite;
}
@-webkit-keyframes float {
	50% {
		-webkit-transform: translateY(-10px);
	}
}
@keyframes float {
	50% {
		transform: translateY(-10px);
	}
}
@-webkit-keyframes shadow {
	50% {
		width: 70%;
		height: 18px;
	}
}
@keyframes shadow {
	50% {
		width: 70%;
		height: 18px;
	}
}

button.button1:hover {
    filter: alpha(opacity=60);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=60)";  /* ie 8 */
    -moz-opacity:0.6;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.6;              /* Safari 1.x */
    opacity:0.6;
    zoom:1;
	-webkit-animation: bounce 3s ease-in-out;
	animation: bounce 3s ease-in-out;
}
button.button2:hover {
    filter: alpha(opacity=60);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=60)";  /* ie 8 */
    -moz-opacity:0.6;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.6;              /* Safari 1.x */
    opacity:0.6;
    zoom:1;
	-webkit-animation: bounce 3s ease-in-out;
	animation: bounce 3s ease-in-out;
}
@-webkit-keyframes bounce {
	5%  { -webkit-transform: scale(1.1, .8); }
	10% { -webkit-transform: scale(.8, 1.1) translateY(-5px); }
	15% { -webkit-transform: scale(1, 1); }
}
@keyframes bounce {
	5%  { transform: scale(1.1, .8); }
	10% { transform: scale(.8, 1.1) translateY(-5px); }
	15% { transform: scale(1, 1); }
}

/* ::::: 申し込みボタン ここまで ::::: */


/*--------------------------------*/
.mt10 { margin-top: 10px; } .mb10 { margin-bottom: 10px; }
.mt20 { margin-top: 20px; } .mb20 { margin-bottom: 20px; }
.mt30 { margin-top: 30px; } .mb30 { margin-bottom: 30px; }
.mt40 { margin-top: 40px; } .mb40 { margin-bottom: 40px; }
.mt50 { margin-top: 50px; } .mb50 { margin-bottom: 50px; }
.mt60 { margin-top: 60px; } .mb60 { margin-bottom: 60px; }
.mt70 { margin-top: 70px; } .mb70 { margin-bottom: 70px; }
.mt80 { margin-top: 80px; } .mb80 { margin-bottom: 80px; }

.left {
  float: left;
}

.t-center {
  text-align: center;
}