@charset "UTF-8";

/* --------------------------------
 * base
 * -------------------------------- */
* {
  box-sizing: border-box;
}

body,
a,
.table {
  color: #666;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 0.3rem;
}

h1 {
  font-size: 1em;
  font-weight: normal;
}

h2 span {
  border-bottom:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
  line-height: 3.5rem;
  padding-bottom: .5em;
}

.text-blue {
  color: #6b90db !important;
}

.bg-blue,
.thead-blue,
.badge-primary {
  background-color: #00B7CE !important;
}

.bg-lightblue {
  background-color: #ecf7fb !important;
}

.bg-pink {
  background-color: #DB8F81 !important;
}

.bg-emerald {
  background-color: #56ccb9 !important;
}

.border-blue {
  border-color: #B2C2E1 !important;
}

.border-top {
  border-width: 2px !important;
}

p {
    line-height: 1.6rem;
    text-align: left;
}
.w-80{width:80%!important}

/* --------------------------------------------------
    ファーストビュー
-------------------------------------------------- */
.header {
  height: 100vh;
}

.header .jumbotron {
  background-image: url("../img/main1-img.jpg");
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  background-color: #fff;
  position: relative;
  height: 90%;
  margin-bottom: 0;
  padding: 2rem 0;
}

.header .jumbotron-fluid {
    padding-right: 0;
    padding-left: 0;
    border-radius: 0;
}


/* nav
-------------------------------------------------- */
nav.fixed {
  position: fixed;
  top: 0;
  z-index: 999;
  width: 100%;
}

.navbar-brand {
  margin-right: 0 !important;
}
.navbar-toggler {
  border-color: rgba(0, 0, 0, 0) !important;
  outline: none;
}
.navbar-toggler-icon {
  background-image: none;
}
.navbar-toggler-icon {
    position: relative;
    width: 40px;
    height: 40px;
    background: none;
    appearance: none;
    cursor: pointer;
}
.navbar-toggler-icon, .navbar-toggler-icon span {
    display: inline-block;
    transition: all 0.4s;
    box-sizing: border-box;
}
.navbar-toggler-icon span {
    position: absolute;
    left: 5px;
    width: 80%;
    height: 2px;
    background-color: #a5a5a5;
    border-radius: 1px;
}
.navbar-toggler-icon span:nth-of-type(1) {
    top: 8px;
}
.navbar-toggler-icon span:nth-of-type(2) {
    top: 20px;
}
.navbar-toggler-icon span:nth-of-type(3) {
    top: 32px;
}
.navbar-toggler[aria-expanded='true'] span.navbar-toggler-icon span:nth-of-type(1) {
    transform: translateY(12px) rotate(-315deg);
}
.navbar-toggler[aria-expanded='true'] span.navbar-toggler-icon span:nth-of-type(2) {
    opacity: 0;
}
.navbar-toggler[aria-expanded='true'] span.navbar-toggler-icon span:nth-of-type(3) {
    transform: translateY(-12px) rotate(315deg);
}

.navbar-toggler:focus {
    box-shadow: none;
}
li.nav-item a{
    display: block;
    height: 100%;
    width: 100%
}
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {color: #00b7ce !important}
.nav-link:focus, .nav-link:hover {
    color: #00b7ce !important;
}

/*    キービジュアル
-------------------------------------------------- */
/*下層ページ*/
.under-layer .jumbotron {
  background-image: url("../img/main1-img.jpg");
  background-size: cover;
  background-position: center top;
  margin-bottom: 0;
}

/* --------------------------------------------------
    メイン
-------------------------------------------------- */

/*    トップページ
-------------------------------------------------- */
.tokucho h3 span {
  font-family: 'Libre Caslon Text', serif;
  margin-right: 1rem;
  border-bottom: 5px solid #B2C2E1;
}

/*   チャート
-------------------------------------------------- */
.flow {margin-top: 3em;}

.flow > li .flow-icon {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  line-height: 50px;
  width: 50px;
  color: #fff;
  background-color: #00B7CE;
  margin: 0 auto 20px;
  display: block;
  text-align: center;
  position: relative;
  letter-spacing: 2px;
}
/*
.flow > li .flow-icon::before {
  content: ""; 
  border: solid transparent;
  border-width: 8px;
  border-top-color: #00B7CE;
  position: absolute;
  top: calc(100% - .2rem);
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
*/
/* --------------------------------------------------
    会員専用ページ
-------------------------------------------------- */
/*   一覧
-------------------------------------------------- */
ul#newsList{
  list-style: none;
  padding-left: 0;
}

ul#newsList li{
  display: flex;
  border-bottom: 1px dotted #00B7CE;
  padding: 1em .5em;
}

ul#newsList li .up_ymd {
  margin-right: 1em;
}
ul#newsList a:hover{
  text-decoration: none;
  color: #666;
}
ul#newsList li:hover {
  background-color: rgba(0,183,206,0.10) !important;
}

/* Pager style（外部化可） */
.pager{
	text-align:right;
	padding:10px;
	clear:both;
}
/*ページャーボタン*/
.pager a{
    border: 1px solid #56ccb9;
    border-radius: 5px;
    color: #56ccb9;
    font-size: 1em;
    padding: .5em .7em;;
    text-decoration: none;
	  margin:0 1px;
}

/*現在のページのボタン*/
.pager a.current{
    background: #56ccb9;
    border: 1px solid #56ccb9;
    border-radius: 5px;
    color: #fff;
    font-size: 1em;
    padding: .5em .7em;;
	  margin:0 1px;
    text-decoration: none;
}

.pager a:hover{
    background:#56ccb9;
    color: #fff;
}

/*   詳細ページ
-------------------------------------------------- */
#detail #up_ymd{
	margin: 1em 0 .5em;
}
#detail h2 {
  border-bottom: 1px dotted #56ccb9;
  padding-bottom: .5em;
}
.detailText {
  margin-top: .5em;
}
.detailUpfile{
	margin:5px 0 35px;
	text-align:center;
}
.backORcloseBtn{
	text-align:center;
	line-height:100%;
	margin-top:15px;
}
.backORcloseBtn a{
	display:inline-block;
	padding:.5em 1em;
	border:1px solid #56ccb9;
	color:#fff;
  background-color: #56ccb9;
	border-radius:6px;
	text-decoration:none;
}
.backORcloseBtn a:hover{
	display:inline-block;
	padding:.5em 1em;
	border:1px solid #56ccb9;
	color:#56ccb9;
  background-color: rgba(86,204,185,0.10);
	border-radius:6px;
	text-decoration:none;
}
.detailUpfile img{
	max-width:100%;
	height:auto;
}
.pNav{
	font-size:11px;	
}

/* --------------------------------------------------
    お問い合わせページ
-------------------------------------------------- */

.error_messe {
    color: red;
    font-size: 1.4em !important;
}
table.formTable{
	width:100%;
	margin:0 auto;
	border-collapse:collapse;
}
table.formTable td,table.formTable th{
	border:1px solid #00b7ce;
	padding:10px;
}
table.formTable th{
	width:30%;
	font-weight:normal;
	background:#00b7ce;
  color: #fff;
	text-align:left;
  border-bottom: 1px solid #fff;
}
#formWrap h3 {
  text-align: center;
}
.formBtn {
  margin-top: 1em;
  text-align: center;
}

.col-form-label{
  padding-top:calc(.375rem + 1px);
  padding-bottom:calc(.375rem + 1px);
  margin-bottom:0;font-size:inherit;
  line-height:1.5
}
.form-group{margin-bottom:1rem}

/* --------------------------------------------------
    コース・料金
-------------------------------------------------- */
.courses_fees {
  margin-top: 2em;
  border-bottom:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
  padding-bottom: .5em;
}

.courses_fees img{
  text-align: center;
}

.courses_fees p{
  line-height: 1.5rem;
}

.courses_fees ul {
  list-style: none;
  padding-left: 0;
}

.courses_fees ul li{
  margin-bottom: 1em;
}

/******************
    独自設定
******************/
.text-muted {
  margin-bottom: 0;
  padding-bottom: 0;
}

/* 画像 */
img {
  pointer-events: none;
}
.logo img {
  pointer-events: auto;
}

.logo img:hover {
  opacity: 0.7;
}

.btn-primary {
    color: #fff;
    background-color: #56ccb9 !important;
    border-color: #56ccb9 !important;
}
/* table */
footer table {
  width: 100%;
}

footer caption {
  caption-side: top;
  padding: 10px;
  font-weight: bold;
  color: #00B7CE !important;
}

footer table th{
  background-color: #56ccb9 !important;
  color: white;
  padding: .5em;
  text-align: center;
  border: 2px solid #fff;
  font-weight: normal;
}

footer table td{
  background-color: #00B7CE !important;
  color: white;
  padding: .5em;
  text-align: center;
  border: 2px solid #fff;
}

footer img {
  width: 100%;
  max-width: 100%;
}

footer #footer-map {
    padding-top: 0;
/*  width: 100%; */
    position: relative;
    overflow: hidden
}
footer iframe {
    width: 100%;
    height: calc(100% + 70px);
    margin-top: -70px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border: none;
}
