@charset "UTF-8";
/*書式設定
----------------------------------*/
@font-face {
  font-family: "Yu Mincho";
  src: local(Yu Mincho Medium),
       local(Yu Mincho);
  font-weight: 500;
}

@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}

body{
	margin: 0;
	padding: 0;
	border: 0 none;
	font-size:16px;
	color: #333;
	font-family:"游ゴシック体", "Yu Gothic", YuGothic,"メイリオ", Meiryo, sans-serif;
	line-height:1.5em;
	background:#FFFFFF;
}
.font_min { font-family: "Sawarabi Mincho","游明朝体", "Yu Mincho", YuMincho, "メイリオ", Meiryo, sans-serif; }

/*floatの解除*/
.clearfix:after { 
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}

a {
	color:#ab0d00;
}
a:hover {
	color:#cb2d20;
}

a img {
	-webkit-transition: 0.3s ease-in-out;
	   -moz-transition: 0.3s ease-in-out;
	     -o-transition: 0.3s ease-in-out;
	        transition: 0.3s ease-in-out;
}
a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
}

a.btn {
	display: inline-block;
	text-decoration:none;
	color: #fff;
	background-color: #ab0d00;
	font-weight: bold;
	padding: 5px 10px;
	border-radius: 4px;
	line-height: 1em;
}
a.btn:hover { background-color: #cb2d20; }

.btn.btnM {
	text-align: center;
	padding: 5px 40px;
	line-height: 40px;
	height: 40px;
	font-size: 24px;
	border-radius: 6px;
	margin:20px auto;
	position: relative;
}
.btn.btnM:after {display: block; content: ''; width: 14px; height: 14px; border-top: 2px #fff solid; border-right: 2px #fff solid; transform: rotate(45deg); position: absolute; right: 15px; top:50%; margin-top: -8px;} 

.btn.btnL {
	display: block;
	text-align: center;
	width: 680px;
	padding: 0;
	line-height: 120px;
	height: 120px;
	font-size: 32px;
	border-radius: 6px;
	margin:20px auto;
	position: relative;
}
.btn.btnL:after {display: block; content: ''; width: 14px; height: 14px; border-top: 2px #fff solid; border-right: 2px #fff solid; transform: rotate(45deg); position: absolute; right: 40px; top:50%; margin-top: -8px;} 
.btn.btnW {color: #ab0d00; background-color: #fff; border:2px solid #ab0d00;}
.btn.btnW:hover {color: #fff; background-color: #ab0d00;}
.btn.btnW.btnM:after,.btn.btnW.btnL:after { border-color: #ab0d00;}
.btn.btnW.btnM:hover:after,.btn.btnW.btnL:hover:after  { border-color: #fff;}

.scrollBox {position: relative;}
.scroll {
  position: absolute;
  bottom: 10%;
  left: 50%;
  z-index: 2;
  display: inline-block;
  -webkit-transform: translate(-50%,0);
  transform: translate(-50%,0);
  text-decoration: none;
  padding-top: 60px;
  color: #fff;
}
.scroll span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 30px;
  height: 50px;
  margin-left: -15px;
  border: 2px solid #fff;
  border-radius: 50px;
  box-sizing: border-box;
}
.scroll span::before {
  position: absolute;
  top: 10px;
  left: 50%;
  content: '';
  width: 6px;
  height: 6px;
  margin-left: -3px;
  background-color: #fff;
  border-radius: 100%;
  -webkit-animation: sdb 2s infinite;
  animation: sdb 2s infinite;
  box-sizing: border-box;
}
.scroll:hover { color:#f5f5f5; }
.scroll:hover span {border-color: #f5f5f5;}
.scroll:hover span::before {background-color: #f5f5f5;}

@-webkit-keyframes sdb {
  0% {
    -webkit-transform: translate(0, 0);
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  80% {
    -webkit-transform: translate(0, 20px);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes sdb {
  0% {
    transform: translate(0, 0);
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  80% {
    transform: translate(0, 20px);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.content {
	max-width: 1120px;
	margin: 0 auto;
}
.smp,
.spbr {display: none;}
.pcsp {display: inline;}
.pc {display: block;}

/* header */
header {z-index: 998; top: 0; position: fixed; width: 100%; background: #fff; font-size: 14px;}
header .content {display: flex; justify-content: space-between; padding:11px 0; align-items:center;}
header .header .content a {color: #000; text-decoration: none;}
header .header .content h1 {display: inline-block; padding-left: 65px; padding-top: 5px; padding-bottom: 5px; font-weight: bold; background: url(../images/bbt_logo.jpg) no-repeat 0% 50%; font-size: 19px; letter-spacing: 1px; line-height: 1em;}
header .header .content h1 span {display: block; font-size: 14px; line-height: 1em; margin-bottom: 5px;}
header .header .content .btn {line-height: 30px;color: #fff;}

header .linkBox a {margin-left: 10px;}
header .header .content .linkBox .mail {box-sizing: border-box; color:#ab0d00; border:1px solid #ab0d00; background-color: #FFF;}
header .header .content .linkBox .mail:hover {background-color:#ab0d00; color: #fff; }

header nav {background: #ab0d00;}
header .navi {padding:0px;  }
header .navi li a {display: inline-block; height: 40px; line-height: 40px; padding:0 10px; color: #fff; font-weight: bold; text-decoration:none;}
header .navi li a:hover {text-decoration: underline;}
header nav .navi li.sp {display: none;}

header.fixed {position: fixed; top:0; left:0; width: 100%; z-index: 999;}

/* main */
main {margin-top: 102px;}

#wrap .content {padding: 100px 0;}

.lity-close,.lity-close:hover {text-shadow:none; right: 50%; top:60%; transform: translateX(50%); display: inline-block; width: auto; font-size: 14px; line-height: 1em; font-weight: bold; padding: 5px 10px; border:1px solid #fff; border-radius: 10px;}
.lity-close:after {display: inline-block; content: '閉じる'; padding-left: 10px; }
.lity-close:hover {background-color: #fff; color: #333;}
#wrap .btnBox {text-align: center;}
#wrap .btnBox .btnL {width: 100%; margin:60px auto 20px; box-sizing: border-box;}
#wrap .btnList {display: flex; margin: auto -20px; }
#wrap .btnList li {width: 50%; box-sizing: border-box; padding:0 20px;}
#wrap .btnList li a {width: 100%;}
#wrap .btnList li a:after {right: 20px;}

#wrap #sec00 {background-color: #eee; background-image: url(../images/mainback.jpg)/*url(../images/backW.png)*/; background-position: 60% 30%; background-size: cover; min-height: 600px; text-align: center;}
#wrap #sec00 h1 {position: relative; padding-top: 60px;}
#wrap #sec00 h1 .pc {display: inline-block;}
#wrap #sec00 h1 .titlepop {position: absolute; left: 100px; top:-46px;}
/*
#wrap #sec00 h1 {margin: 0; display: inline-block; position: relative; padding: 40px; background-color:rgba(255,255,255,0.85); border:1px solid #eee; text-align: left; font-size: 24px; color: #333; line-height: 2em;}
#wrap #sec00 h1 b {display: block; font-size: 78px; line-height: 1em; color: #ab0d00; border-bottom: 2px solid #ab0d00; letter-spacing: 5px; margin-bottom: 20px; padding-bottom: 20px; }
#wrap #sec00 h1 .campaignTitle {position: absolute; right:40px; bottom: 20px; padding:15px 0 35px; width: 150px; height: 100px; border-radius: 50%; font-weight: bold; text-align: center; background-color: #ab0d00; color: #fff; font-size: 18px; letter-spacing: 0; line-height: 1.5em;}
#wrap #sec00 h1 .campaignTitle .coff {font-size: 40px; line-height: 1.2em;}
#wrap #sec00 h1 .campaignTitle .coff span {font-size:0.8em;}*/

#wrap .content .left {float: left;}
#wrap .content .right {float: right;}
#wrap .content .text_box { margin: 30px auto; font-size: 18px; line-height: 2.5em;}

#wrap .content .campaign {padding: 30px; border-radius: 20px; border:2px solid #eee; margin-bottom: 40px;}
#wrap .content .campaign h1 {margin:auto auto 10px; font-weight: bold; }
#wrap .content .campaign h1 span {display: inline-block; padding: 15px 20px 10px; margin-left: 20px; vertical-align: text-bottom; font-size: 0.8em; color: #fff; background-color:#ab0d00; border-radius: 4px; line-height: 1em; }
#wrap .content .campaign .sub { text-align: center; font-size: 20px; font-weight: bold; background-color: #eee; line-height: 2em; height: 2em; margin-bottom: 20px; }
#wrap .content .campaign h2 {text-align: center; font-size: 30px; line-height: 1.5em; font-weight: bold; color: #ab0d00; letter-spacing: 2px; margin:0 auto 20px;}
#wrap .content .campaign h3 {text-align: center; font-weight: bold; font-size: 20px; margin-bottom: 20px;}
#wrap .content .campaign .caption {text-align: center; font-size: 18px;}

#wrap .content .campaign .earlyReservation { margin-top: 80px; background-color:#f5f5f5; padding: 20px; border-radius: 6px; position: relative; }
#wrap .content .campaign .earlyReservation::before,
#wrap .content .campaign .earlyReservation::after {display: block; content: ''; width: 40px; height: 2px; background-color: #ab0d00; position: absolute; top:-40px; left: 50%; margin-left: -20px; }
#wrap .content .campaign .earlyReservation::after {transform: rotate(90deg);}
#wrap .content .campaign .earlyReservation h2 {border: none; background-color:#ab0d00; color: #fff; padding: 18px 0; font-size: 34px; line-height: 1em; position: relative; }
#wrap .content .campaign .earlyReservation h2 span {display: block; position: absolute; border:2px solid #ab0d00; left: 20px; bottom: 5px; background-color: #fff; color:#ab0d00; width: 70px; height: 70px; line-height: 70px; border-radius: 50%; font-weight: bold; font-size: 20px; letter-spacing: 0;}
#wrap .content .campaign .earlyReservation h2 span::after {display: block; content: ""; position: absolute; bottom: -10px; right: -10px; margin-top: -15px; border: 15px solid transparent; border-left: 15px solid #fff; z-index: 0; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);}
#wrap .content .campaign .earlyReservation h3 {line-height: 2em; margin-bottom: 10px;}
#wrap .content .campaign .earlyReservation h3 b {color:#ab0d00; font-size: 32px; line-height: 1.5em;}

#wrap .content .priceBox {font-size: 40px; font-weight: bold; color:#ab0d00; line-height: 1.5em; text-align: center; }
#wrap .content .priceBox .line {display: inline-block; position: relative; color: #333;}
#wrap .content .priceBox .line:before {display: block; content: ''; position: absolute; width: 100%; border-top:2px solid #333; top:50%; left:0;}

#wrap .content .point h2 {font-size: 27px; padding-left: 65px; background:url(../images/circle_01.png) 0% 50% no-repeat; padding-top: 20px; margin-top: 40px; text-align: left; line-height: 1.5em; font-weight: bold; margin-bottom: 30px; padding-bottom: 10px; border-bottom: 1px solid #aaaaaa;}
#wrap .content .point h2:nth-of-type(2) {background-image:url(../images/circle_02.png); }
#wrap .content .point h2:nth-of-type(3) {background-image:url(../images/circle_03.png); }
#wrap .content .point h2:nth-of-type(4) {background-image:url(../images/circle_04.png); }
#wrap .content .point h2:nth-of-type(5) {background-image:url(../images/circle_05.png); }
#wrap .content .point h2:nth-of-type(6) {background-image:url(../images/circle_06.png); }
#wrap .content .point h2:nth-of-type(7) {background-image:url(../images/circle_07.png); }
#wrap .content .point h2:nth-of-type(8) {background-image:url(../images/circle_08.png); }
#wrap .content .point h2:nth-of-type(9) {background-image:url(../images/circle_09.png); }
#wrap .content .point h2:nth-of-type(10) {background-image:url(../images/circle_10.png); }
#wrap .content .point .pointBox {font-size: 18px; line-height: 2.5em;}
#wrap .content .point .pointBox .prof {font-size: 14px; line-height: 1.5em; margin-top: 20px; padding: 30px; background-color: #f5f5f5; border-radius: 6px;}
#wrap .content .point .pointBox .prof h3 { font-size: 21px; font-weight: bold; margin-bottom: 20px; }
#wrap .content .point .pointBox .prof .left {width: 76%;}
#wrap .content .point .pointBox .prof .right {width: 22%;}
#wrap .content .point .pointBox .prof .right b {font-size: 16px; font-weight: bold; margin-top: 10px; display: inline-block;}
#wrap .content .point .pointBox .prof .right img {width: 100%; height: auto;}
#wrap .content .point .pointBox .auxiliary {display: flex; flex-wrap: wrap;}
#wrap .content .point .pointBox .auxiliary li {width: 25%; box-sizing: border-box; padding: 20px;}
#wrap .content .point .pointBox .auxiliary li img {width: 100%; height: auto; box-shadow: 0 0 3px rgba(0,0,0,0.4);}
#wrap .content .point .pointBox .auxiliary li h3 { margin-top:10px; font-size: 16px; line-height: 1.5em;}

/* :nth-of-type(odd)  */

#wrap .content h1 {text-align: center; font-size: 60px; line-height: 1.5em; font-weight: 500; color: #ab0d00; letter-spacing: 2px; margin-bottom: 60px;}
#wrap .content h2 {font-size: 32px; font-weight: bold; text-align: center; border-bottom: 1px solid #ab0d00; padding-bottom: 15px; margin:80px auto 30px; }
#wrap .content h2.font_min {font-weight: normal;}
#wrap .content .textbox { max-width: 800px; margin:40px auto; }
#wrap .content .whiteboxlist {display: flex; justify-content: space-between; flex-wrap: wrap;}
#wrap .content .whiteboxlist li { width: 300px; padding: 20px 0; text-align: center; font-size: 18px; font-weight: bold; line-height: 1.4em; background-color: #fff; margin-bottom: 40px; }
#wrap .content #strategicInfo {}
#wrap .content #strategicInfo .strategicBox { margin:auto auto 100px auto;}
#wrap .content #strategicInfo .strategicBox h3 {text-align:center; overflow-x: visible; margin: 65px auto 10px;}
#wrap .content #strategicInfo .strategicBox h3 span{
	font-size: 38px;
    display: inline-block;
    height: 1em;
    line-height: 1em;
    position: relative;
}
#wrap .content #strategicInfo .strategicBox h3 span:before{
	display: block;
	content: '';
	width: 308px;
	height: 1em;
	background-image: url(../images/right_img.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	top: 0px;
	right: -310px;
}
#wrap .content #strategicInfo .strategicBox h3 span:after{
	display: block;
	content: '';
	width: 308px;
	height: 1em;
	background-image: url(../images/left_img.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	top: 0px;
	left: -310px;
}
#wrap .content #strategicInfo .strategicBox h4 { text-align: center; margin: 60px auto 20px; }
#wrap .content #strategicInfo .strategicBox .h5_box{ margin: 60px auto;}
#wrap .content #strategicInfo .strategicBox h5{ font-size: 36px;}
#wrap .content #strategicInfo .strategicBox .h5_box .left{ width: 240px; float: left;}
#wrap .content #strategicInfo .strategicBox .h5_box .right{ width: 840px; margin-top: 20px; float: right;}
#wrap .content #strategicInfo .strategicBox .h5_box .right h5 span{ font-size: 24px;}
#wrap .content #strategicInfo .strategicBox .h5_box .right p{ font-size: 16px; line-height: 1.4em;}
#wrap .content #strategicInfo .strategicBox .h5_box .right p span {font-size: 18px; display: block; margin: 20px auto 10px;}
/*#wrap .content #strategicInfo .strategicBox .text_box,
#wrap .content #strategicInfo .strategicBox .h5_box {max-width:980px;}*/

/*アコーディオン*/
#wrap .content #strategicInfo .strategicBox .qa {text-align: left; line-height: 2em; max-width: 980px; margin: auto;}
#wrap .content #strategicInfo .strategicBox .qa dt {
    counter-increment: q;
    padding: 20px 0px 20px 20px;
    position: relative;
    border: 1px solid #aaa;
    margin-top: 10px;
    cursor: pointer;
    font-size: 24px;
    font-weight: bold;
    background: #f4f4f4;
}

#wrap .content #strategicInfo .strategicBox .qa dt:after {
	content: '▼';
	display: block;
	font-size: 20px;
	transform: scale(1,0.8);
	color: #333;
	position: absolute;
	top:20px; right:20px;
}
#wrap .content #strategicInfo .strategicBox .qa dt.close:after { transform: rotate(180deg) scale(1,0.6); }
#wrap .content #strategicInfo .strategicBox .qa dd {
	padding:20px 0px 20px 0px;
	position: relative;
	margin-top: 10px;
	display: none;
}


/*テーブル*/
#wrap .content #strategicInfo .strategicBox table {
  width: 100%;
  background-color: #ffffff;
}
#wrap .content #strategicInfo .strategicBox table th,
#wrap .content #strategicInfo .strategicBox table td {
  padding: 15px 10px;
  border: 1px solid #282835;
  font-size: 14px;
}
#wrap .content #strategicInfo .strategicBox table th {
  background-color: #282835;
  color: #ffffff;
  border-right: 1px solid #ffffff;
}
#wrap .content #strategicInfo .strategicBox table th:last-child {
  border-right: 1px solid #282835;
}
#wrap .content #strategicInfo .strategicBox table thead .time {
  width: 60px;
}
#wrap .content #strategicInfo .strategicBox table tbody td ul li {
  padding-left: 1em;
  text-indent: -1em;
}
#wrap .content #strategicInfo .strategicBox table tbody td ul li span {
  font-size: 13px;
}
#wrap .content #strategicInfo .strategicBox table tbody td ul li + li {
  margin-top: 5px;
}
#wrap .content #strategicInfo .strategicBox table tbody td ul.num li {
  padding-left: 2em;
  text-indent: -2em;
}


#wrap .content #auxiliary h3 {font-size: 24px; font-weight: bold; line-height: 1.5em; margin-bottom: 20px;}
#wrap .content #auxiliary p {line-height: 1.8em;}
#wrap .content #auxiliary .left { width: 38%; }
#wrap .content #auxiliary .left img {width: 100%; height: auto;}
#wrap .content #auxiliary .right { width: 60%; }

#wrap .content .couse {display: flex; margin: auto -20px;}
#wrap .content .couse li {width: 50%; box-sizing: border-box; padding:0 20px;}
#wrap .content .couse h2 {text-align: left; font-size: 24px; padding-bottom: 5px; margin:20px auto 10px;}
#wrap .content .couse .text_box {margin-top:10px; margin-bottom: 20px; font-size: 16px; line-height: 2em;}
#wrap .content .program {margin: 60px auto;}

#wrap .content .cpBox {
	margin: 40px auto 0; 
	border-top: 1px solid #eeeeee; 
	border-right: 1px solid #eeeeee; 
}
#wrap .content .cpBox tr {
	border-bottom: 1px solid #eeeeee; 
}
#wrap .content .cpBox tr th {
	font-size: 18px;
	font-weight: bold;
	line-height: 2em;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	background-color: #ab0d00;
	width: 22%;
	padding: 35px 0;
}
#wrap .content .cpBox tr td {
	font-size: 18px;
	line-height: 2em;
	width: 78%;
	padding: 35px 0 35px 35px;
	text-align: left;
	vertical-align: middle;
	background-color: #fff;
}
#wrap .content .cpBox tr .top {
	vertical-align: top;
}
}
#wrap .content .cpBox tr td a {
	text-decoration: underline;
}
#wrap .content .cpBox tr td a:hover {
	color: #ab0d00;
}
#wrap .content .cpBox tr td ul li{
    padding-left: 1em;
    text-indent: -1em;
 }
#wrap .content .cpBox tr td ul .indent_none{
 	padding-left: 0em;
    text-indent: 0em;
 }
 #wrap .content .cpBox .priceBox { font-size: 20px; text-align: left; color: #333; }
 #wrap .content .cpBox .priceBox .red { color:#ab0d00;}

/* footer */
footer {background-color:#ab0d00; color: #fff;}
footer a {color: #fff;}
footer .content {padding: 40px 0;}
footer .content .left {font-size: 14px; float: left; display: inline-block;}
footer .content .left ul {margin-top: 30px;}
footer .content .left ul li {margin-bottom: 10px;}
footer .content .right {font-size: 15px; float: right; display: inline-block; text-align: center; font-weight: bold; padding-top: 20px;}
footer .content .right h2 {font-size: 18px; letter-spacing: 2px;}
footer .content .right .font_min {font-size:40px; margin: 10px 0;}
footer .content .right .font_min img {height: 38px; width: auto; margin-right: 10px; vertical-align: text-bottom; }
footer .copy {text-align: center; font-size: 14px; margin-top: 60px;}

@media all and (-ms-high-contrast:none){
  #wrap .content .campaign h1 span {vertical-align:text-top !important;}
}
@supports (-ms-ime-align: auto) {
  #wrap .content .campaign h1 span {vertical-align:middle !important;}
}