@charset "UTF-8";

body {
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic",'Avenir', Arial, sans-serif;
	margin: 0 auto;
	padding: 0;
	position:relative;
  background-color:#fff;
}
* {
	-webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
img { vertical-align: top; }
h2 {
  margin:0 auto 80px;
  font-size: 36px;
  line-height:1;
  letter-spacing:0.01em;
  text-align:center;
  color:#502F1F;
	font-weight: normal;
  font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
h2 img {
  margin:0 auto 40px;
  height:36px;
  display:block;
}
p {
  padding:0;
  margin:0;
}
p.big {
  font-size:24px;
  line-height:3;
}
p.mid {
  font-size:18px;
  line-height:2.2;
}
p.sml {
  font-size:16px;
  line-height:2;
}
p.ano { font-size:14px; }
.clear { clear:both; }
.fl { float:left; }
.fr { float:right; }
.tl { text-align:left; }
.tr { text-align:right; }

/*content*/
.main { overflow: hidden; }
section {
  width:100%;
  margin:0;
  padding:0;
  position:relative;
}
section .inner {
  width: 82%;
  max-width:1120px;
  margin:0 auto;
  padding:0;
	position:relative;
}

.totop {
  width:1.1%;
  position:fixed;
  bottom:14%;
  right: 6%;
  z-index:9000;
  background: url('images/totop.png');
  background-size: cover;
}
.totop div {
	width:100%;
	height:100%;
	position:relative;
}
.totop div::before {
  content: '';
  display: block;
  padding-top: 890%;
}
.totop.white {
  background: url('images/totop_w.png');
  background-size: cover;
}

.totop img { width:100% }
.cv_btn_area {
  width:4%;
  max-width:77px;
  position:fixed;
  bottom:30px;
  right:0;
  z-index:9999;
}
.cv_btn_area .cv_btn01 , .cv_btn_area .cv_btn02 {
  width:100%;
  display: block;
}
.cv_btn_area .cv_btn01 { margin:0 0 14px; }
.cv_btn_area .cv_btn01 img , .cv_btn_area .cv_btn02 img { width:100%; }

.pc { display:block; }
.tablet { display:none; }
.smp { display:none; }

/*firstview*/
#firstview {
  width: 100%;
  background: url('images/top_bg.png');
  background-size: cover;
  z-index:9500;
}
#firstview .inner {
  width:95%;
	max-width:1920px;
	max-height:1100px;
  height:100%;
	padding:0;
}
#firstview .inner::before {
  content: '';
  display: block;
  padding-top: 59%;
}
#firstview .inner .logo {
  height:88px;
  position:absolute;
  top:35px;
  left:0.02%;
}
#firstview .inner .copy {
  width:51%;
  position:absolute;
  top:50%;
  left:7%;
  transform:translateY(-50%);
}
#firstview .inner .copy .copy_img {
  width: 0;
  margin:0 0 44px;
  overflow: hidden;
}
#firstview .inner .copy .copy_img img {
  width: 0;
  display:block;
}
#firstview .inner .copy .scroll {
  display:inline-block;
  padding:15px 20px;
  border:1px solid #fff;
  opacity:0;
}
#firstview .inner .copy .scroll .text {
  margin-right:14px;
  height:15px;
  display:inline-block;
  vertical-align:middle;
}
#firstview .inner .copy .scroll .arrow {
  height:16px;
  display:inline-block;
  vertical-align:middle;
  animation: flash 2s linear infinite;
}
@keyframes flash {
  0%,100% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }
}

/*about*/
#about {
  background: url('images/bg-pattern01.png') repeat;
  background-size: auto 40%;
}
#about .inner.about { padding:280px 0 116px; }
#about .inner.about p { color:#111; }
#about .inner.about .mid { margin:0 0 64px; }
#about .inner.about .embaj  {
  width:50%;
  padding:0 6% 0 0;
  float:left;
}
#about .inner.about .embag {
  width:50%;
  padding:0 0 0 6%;
  float:right;
  border-left:1px solid #111;
}
#about .inner.about .embaj .head , #about .inner.about .embag .head {
  width:100%;
  margin:0 0 40px;
  padding: 10px 0 10px;
  font-size:28px;
  letter-spacing:0.05em;
  color:#fff;
  text-align:center;
}
#about .inner.about .embaj .head { background-color:#005929; }
#about .inner.about .embag .head { background-color:#00457C; }
#about .inner.vision { padding:0 0 200px; }
#about .inner.vision h2 { margin:0 0 80px; }
#about .inner.vision p { color:#444; }
#about .inner.vision .schema {
  width:100%;
  margin:0 0 64px;
}

/*characteristic*/
#characteristic { background-color:#96D8E2; }
#characteristic .inner { padding:195px 0 200px; }
#characteristic .inner h2 { color:#fff; }
#characteristic .inner > p { margin:0 0 72px; color:#fff; }
#characteristic .inner .text-divider {
  margin:0 0 64px;
  font-size:36px;
  letter-spacing:0.05em;
  display: flex;
  align-items: center;
  color:#B59E3C;
  background-color:#12294A;
}
#characteristic .inner .text-divider::before,
#characteristic .inner .text-divider::after {
  content: '';
  height: 1px;
  background-color: #B59E3C;
  flex-grow: 1;
}
#characteristic .inner .text-divider::before { margin-right:28px; }
#characteristic .inner .text-divider::after { margin-left:28px; }
#characteristic .inner .subtitle {
  margin:0 0 64px;
  font-size:60px;
  letter-spacing:0.05em;
  color:#B59E3C;
  text-align:center;
}
#characteristic .inner .characteristic_con {
  margin:0 0 160px;
  position:relative;
}
#characteristic .inner .characteristic_con:last-child { margin:0; }
#characteristic .inner .characteristic_con .subimg_r {
  width:57%;
  position:absolute;
  right:-8%;
  top:0;
  border-radius:8px;
  box-shadow: 12px 12px 18px rgba(0, 0, 0, .25);
}
#characteristic .inner .characteristic_con .subimg_l {
  width:57%;
  position:absolute;
  left:-8%;
  top:0;
  border-radius:8px;
  box-shadow: 12px 12px 18px rgba(0, 0, 0, .25);
}
#characteristic .inner .characteristic_con .subimg_rt {
  width:57%;
  position:absolute;
  right:-8%;
  top:0px;
  border-radius:8px;
  box-shadow: 12px 12px 18px rgba(0, 0, 0, .25);
  z-index:1000;
}
#characteristic .inner .characteristic_con .characteristic_box {
  width:45%;
}
#characteristic .inner .characteristic_con .characteristic_box.fl { float:left;}
#characteristic .inner .characteristic_con .characteristic_box.fr { float:right; }
#characteristic .inner .characteristic_con .characteristic_box .head {
  margin:0 0 8px;
}
#characteristic .inner .characteristic_con .characteristic_box .head img {
  width:100%;
}
#characteristic .inner .characteristic_con .characteristic_box p { margin:0 0 40px; color:#111; }
#characteristic .inner .characteristic_con .characteristic_box a {
  width:100%;

  display: block;
  box-shadow: 12px 12px 18px rgba(0, 0, 0, .16);
}
#characteristic .inner .characteristic_con .characteristic_box a::before {
  content: '';
  display: block;
  padding-top: 16.8%;
}
#characteristic .inner .characteristic_con .characteristic_box a.chara_a01 {
  background: url('images/chara_btn01.png');
  background-size: cover;
}
#characteristic .inner .characteristic_con .characteristic_box a.chara_a01:hover {
  background: url('images/chara_btn01_h.png');
  background-size: cover;
}
#characteristic .inner .characteristic_con .characteristic_box a.chara_a02 {
  background: url('images/chara_btn02.png');
  background-size: cover;
}
#characteristic .inner .characteristic_con .characteristic_box a.chara_a02:hover {
  background: url('images/chara_btn02_h.png');
  background-size: cover;
}
#characteristic .inner .characteristic_con .box {
  padding:80px;
  border:2px solid rgba(80,47,31,1);
  position:relative;
}
#characteristic .inner .characteristic_con .box::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 8px;
  right: 8px;
  border: solid 2px rgba(80,47,31,1);
}
#characteristic .inner .characteristic_con .box .con {
  padding:0 0 48px 56px;
  position:relative;
}
#characteristic .inner .characteristic_con .box .con:last-child { padding:0 0 0 56px;; }
#characteristic .inner .characteristic_con .box .con img {
  width:42px;
  position:absolute;
  top:0;
  left:0;
}
#characteristic .inner .characteristic_con .box .con .head {
  margin:0 0 20px;
  padding: 4px 0 0;
  font-size:24px;
  color:#502F1F;
  line-height:1.5;
  font-weight:bold;
}
#characteristic .inner .characteristic_con .box .con .head span { font-weight: normal;}
#characteristic .inner .characteristic_con .box .con p { color:#111; }

/*curriculum*/
#curriculum { background-color:#96D8E2; }
#curriculum .inner { padding:0 0 200px; }
#curriculum .inner h2 { color:#fff; }
#curriculum .inner .head {
  margin:0 0 12px;
  padding:8px 0;
  letter-spacing:0.05em;
  font-size:32px;
  color:#fff;
  text-align:center;
}
.h01 { background-color:#8E1928; }
.h02 { background-color:#00457C; }
.h03 { background-color:#005929; }
#curriculum .inner .curri_img {
  width:100%;
  margin:0 0 40px;
}
#curriculum .inner .ano {
  margin:0 0 64px;
  line-height:1.5;
  color:#111;
	text-align:left;
}
#curriculum .inner .pickup_box {
	padding:60px 80px;
	border:1px solid  #B59E3C;
	position:relative;
}
#curriculum .inner .pickup_box .text {
	padding:0 14px;
  margin:0;
  text-align:: center;
  color:#B59E3C;
  background-color:#12294A;
	position:absolute;
	top:-14px;
	left:50%;
	transform:translateX(-50%);
}
#curriculum .inner .pickup_box .ano {
	margin:0;
	text-align: center;
}
#curriculum .inner .pickup_box .text img { height:28px; }
#curriculum .inner .movie_box {
  width:45%;
  margin:0 0 50px;
  text-align:center;
}
#curriculum .inner .movie_box .youtube_box {
	margin: 0 auto 30px;
  position: relative;
  width:100%;
  height:0;
  padding-top: 56.25%;
	border-radius: 8px;
	overflow: hidden;
}
#curriculum .inner .movie_box .youtube_box iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#curriculum .inner .movie_box .title {
  margin:0 0 16px;
  font-size:18px;
  line-height:1.5;
  color:#fff;
}
#curriculum .inner .movie_box .ano { margin:0; }
#curriculum .inner .movie_box img {
  margin:0 0 30px;
  width:100%;
  box-shadow: 10px 10px 16px rgba(0, 0, 0, .16);
}
#curriculum .inner  > a {
  width:500px;
  display: block;
  box-shadow: 6px 6px 12px rgba(0, 0, 0, .16);
}
#curriculum .inner > a::before {
  content: '';
  display: block;
  padding-top: 17.6%;
}
#curriculum .inner a.dwl02 {
  margin:0 auto;
  background: url('images/app_btn02.png');
  background-size: cover;
}
#curriculum .inner a.dwl02:hover {
  background: url('images/app_btn02_h.png');
  background-size: cover;
}
#curriculum .inner a.dwl03 {
  margin:0 auto 40px;
  background: url('images/app_btn03.png');
  background-size: cover;
}
#curriculum .inner a.dwl03:hover {
  background: url('images/app_btn03_h.png');
  background-size: cover;
}

/*schedule*/
#schedule { background-color:#96D8E2; }
#schedule .inner { padding:0 0 200px; color:#111; }
#schedule .inner h2 { color:#fff; }
#schedule .inner .slide_area { margin:0 0 39px; }
#schedule .inner .slide_area img {
  width:100%;
}
#schedule .inner .ano { margin:0 0 40px; }
#schedule .inner .head {
  margin:0 0 28px;
  font-size:24px;
}
#schedule .inner .schedule_box { margin:0; }
#schedule .inner .schedule_box .kamoku {
  width:210px;
  margin:0 20px 0 0;
  padding:10px 0;
  font-size:18px;
  color:#502F1F;
  display:inline-block;
  vertical-align: middle;
  border:1px solid #502F1F;
  text-align:center;
}
#schedule .inner .schedule_box .date {
	width: 68%;
	color:#502F1F;
  display:inline-block;
  vertical-align: middle;
}
#schedule .inner .schedule_box .date .ano { font-size:14px; }
#schedule .inner .schedule_box .v_m {
	display:inline-block;
  vertical-align: middle;
}
#schedule .inner .ano:last-child { margin:0; }

/*lecturers*/
#lecturers { background-color:#96D8E2; }
#lecturers .inner { padding:0 0 200px; color:#fff; }
#lecturers .inner h2 { color:#fff; }
#lecturers .inner > img { width:100%; }
#lecturers .inner p.big { color:#502F1F; }

/*voice*/
#voice {
  background: url('images/bg-pattern01.png') repeat;
  background-size: 850px 850px;
}
#voice .inner.voice {
  padding:200px 0;
}
#voice .inner.voice .flex01 {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin:0 0 70px;
}
#voice .inner.voice .flex02 {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
#voice .inner.voice .movie {
	width:46.4%;
}
#voice .inner.voice .movie .youtube_box {
	margin: 0 auto;
  position: relative;
  width:100%;
  height:0;
  padding-top: 56.25%;
	border-radius: 8px;
	overflow: hidden;
}
#voice .inner.voice .movie .youtube_box iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
	border-radius: 8px; overflow: hidden;
}


/*application*/
#voice .inner.application {
  padding:0 0 200px;
}
#voice .inner.application .application_area { padding:0 0 100px; }
#voice .inner.application .application_area .box {
  margin:0 0 48px;
  padding:0 0 48px;
  border-bottom:1px solid #A6A9AA;
}
#voice .inner.application .application_area .box:last-child { margin:0; padding:0; border-bottom:none; }
#voice .inner.application .application_area .box .head {
  width:22%;
  padding:0 1.5% 0 0;
  color:#fff;
  text-align:center;
}
#voice .inner.application .application_area .box .head img { width:100%; }
#voice .inner.application .application_area .box .v_m {
  display:inline-block;
  vertical-align:middle;
}
#voice .inner.application .application_area .box .v_t {
  display:inline-block;
  vertical-align:top;
}
#voice .inner.application .application_area .box p { width: 77%; color:#111; }
#voice .inner.application .application_area .box p span { color:#82CED9; }
#voice .inner.application .application_area .box p span img {
	height:16px;
	vertical-align: middle;
	display: inline-block;
	margin: 0 5px 5px 0;
}
#voice .inner.application .application_area .box p a {
	color:#00457C;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
}
#voice .inner.application  > a {
  width:500px;
  display: block;
  box-shadow: 6px 6px 12px rgba(0, 0, 0, .16);
}
#voice .inner.application > a::before {
  content: '';
  display: block;
  padding-top: 17.6%;
}
#voice .inner.application > a.dwl01 {
  margin:0 auto 40px;
  background: url('images/app_btn01.png');
  background-size: cover;
}
#voice .inner.application > a.dwl01:hover {
  background: url('images/app_btn01_h.png');
  background-size: cover;
}
#voice .inner.application > a.dwl02 {
  margin:0 auto;
  background: url('images/app_btn02.png');
  background-size: cover;
}
#voice .inner.application > a.dwl02:hover {
  background: url('images/app_btn02_h.png');
  background-size: cover;
}

/*facebook*/
#voice .inner.facebook {
  padding:0 0 150px;
}
#voice .inner.facebook .fb_box {
  width:500px;
  margin:0 auto;
}

/*faq*/
#voice .inner.faq {
  padding:0 0 200px;
}
#voice .inner.faq .faq_area { margin:0 0 100px; }
#voice .inner.faq .faq_area .box_q { margin:0 0 24px; }
#voice .inner.faq .faq_area .box_a { margin:0 0 48px; padding:0 0 48px; border-bottom:1px solid #A6A9AA; }
#voice .inner.faq .faq_area .box_a:last-child { margin:0; padding:0; border-bottom:none; }
#voice .inner.faq .faq_area .box_q .head , #voice .inner.faq .faq_area .box_a .head { width:6%; }
#voice .inner.faq .faq_area .box_q .head img , #voice .inner.faq .faq_area .box_a .head img { width:100%; }
#voice .inner.faq .faq_area .box_q .q_text {
	width:92%;
	padding:0 0 0 25px;
  font-size:22px;
  color:#82CED9;
  font-weight:bold;
}
#voice .inner.faq .faq_area .box_q .v_m , #voice .inner.faq .faq_area .box_a .v_m {
  display:inline-block;
  vertical-align:middle;
}
#voice .inner.faq .faq_area .box_q .v_t , #voice .inner.faq .faq_area .box_a .v_t {
  display:inline-block;
  vertical-align:top;
}
#voice .inner.faq .faq_area .box_a p {
	width:92%;
	padding:0 0 0 25px;
	color:#111;
}
#voice .inner.faq a {
  width:500px;
  display: block;
  box-shadow: 6px 6px 12px rgba(0, 0, 0, .16);
}
#voice .inner.faq a::before {
  content: '';
  display: block;
  padding-top: 17.6%;
}
#voice .inner.faq a.dwl01 {
  margin:0 auto 40px;
  background: url('images/app_btn01.png');
  background-size: cover;
}
#voice .inner.faq a.dwl01:hover {
  background: url('images/app_btn01_h.png');
  background-size: cover;
}
#voice .inner.faq a.dwl02 {
  margin:0 auto;
  background: url('images/app_btn02.png');
  background-size: cover;
}
#voice .inner.faq a.dwl02:hover {
  background: url('images/app_btn02_h.png');
  background-size: cover;
}
#voice .inner.faq a.dwl03 {
  margin:0 auto 40px;
  background: url('images/app_btn03.png');
  background-size: cover;
}
#voice .inner.faq a.dwl03:hover {
  background: url('images/app_btn03_h.png');
  background-size: cover;
}

/*footer*/
footer {
  padding:27px 0;
  font-size:16px;
  color:#fff;
  background-color:#12294A;
  text-align:center;
}

.mincho {
  font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

/*読み込み時のスプラッシュとその後の動き*/
.splash01 {
	position: fixed;
	width: 100%;
	height: 100vh;
  background: #1C3962;
	z-index: 9999999;
	text-align:center;
	color:#fff;
  top: 0;
  left: 0;
  transform:scaleY(1);
}
.splash02 {
	position: fixed;
	width: 100%;
	height: 100vh;
  background: #96D8E2;
	z-index: 9999999;
	text-align:center;
	color:#fff;
  top: 0;
  left: 0;
  transform:scaleY(1);
}
body.appear .splash01 {
	animation-name:PageAnime01 ;
	animation-duration:1s;
	animation-timing-function:ease-in-out;
	animation-fill-mode:forwards;

}
@keyframes PageAnime01 {
	0% {
		transform-origin:top;
	}
	100% {
		transform-origin:top;
		transform:scaleY(0);
	}
}
body.appear .splash02 {
	animation-name:PageAnime02;
	animation-duration:0.8s;
	animation-timing-function:ease-in-out;
	animation-fill-mode:forwards;

}
@keyframes PageAnime02 {
	0% {
		transform-origin:top;
	}
	100% {
		transform-origin:top;
		transform:scaleY(0);
	}
}
#firstview .inner .copy .copy_img.img-wrap {
  width:0;
  animation: img-wrap 1s forwards;
  overflow: hidden;
}
@keyframes img-wrap {
  0% {
    width:0%;
  }
  100% {
    width:100%;
  }
}
#firstview .inner .copy .scroll.fade_in {
  opacity:0;
  animation: fade-in 2s forwards;
}
@keyframes fade-in {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
