@charset "UTF-8";

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

body,
a,
.table {
  font-family:  "Montserrat",
  "游ゴシック",YuGothic,
  "ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN",
  "Helvetica Neue",  Arial,  "Hiragino Sans",  sans-serif;
  color: #000;
}

.tategakiwrap {
  text-align: center;
  max-width: 100vw;
}

.tategaki{
  writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode:vertical-rl; 
  line-height: 1.9;
  letter-spacing: 0.03em;
  margin: 0 auto;
  text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 0.3rem;
  font-family: 'Sawarabi Mincho', sans-serif;
}

.text-white {
  color: #fff !important;
}
.text-blue {
  color: #6b90db !important;
}
.text-gray {
  color: #333 !important;
}
.text-pink {
  color: #DB8F81;
}
.text-red {
  color: #ff0000;
}

.text-b {
  font-weight: bold;
}
/* --------------------------------------------------
    縁取り
-------------------------------------------------- */
.futidori{
  display     : inline-block;
  font-size   : 160%;
  font-weight : bold;
  color       : #ffffff;
  text-shadow:  2px  2px 10px #777 ,
               -2px  2px 10px #777 ,
                2px -2px 10px #777 ,
               -2px -2px 10px #777;
}

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

.bg-lightblue {
  background-color: #ecf7fb !important;
}
.bg-lightgray {
  background-color: #eeeeee !important;
}
.bg-pink {
  background-color: #DB8F81 !important;
}
.bg-gray {
  background-color: #566270 !important;
  color: #fff;
}
.bg-white {
  background-color: #ffffff !important;
}
.bg-kotei {
  background-image: url("https://tagawasekizai.com/img/bg-kotei.jpg");
  background-attachment: fixed;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
 
.bg-kotei-box {
  background:rgba( 255,255,255, 0.8 );
  margin: 0 auto;
}

.bbg {
  position: relative;
  width: 100%;
  min-height: 100vh;
  background: url(../img/hasu.jpg) center / cover; 
  z-index: 9;
  }

.border-blue {
  border-color: #B2C2E1 !important;
}
.border-top {
  border-width: 2px !important;
}

p {
  line-height: 1.6rem;
}
.text-muted{
  font-weight: bolder;
  color: #000;
}
.btn:hover{
  opacity: 0.9;
}
/* --------------------------------------------------
    ファーストビュー
-------------------------------------------------- */

.carousel{
  position: relative;
  margin: 0;
}
.carousel-item .img-fluid {
  width:100%;
  height:auto;
}
.carousel-item{
  height: auto;
}
.carousel-caption{
  bottom: 25%;
}

.header {
  height: 100vh;
}

.header .jumbotron {
  background-image: url("../img/index/top1.jpg");
  background-size: cover;
  background-position: center top;
  position: relative;
  height: 86%;
  margin-bottom: 0;
}

.main-img{
  background-color:rgba(0,0,0,0.8);
  opacity:0.8;
}

/*下層ページ*/
.under-layer{
  background-image: url("../img/main-img.jpg") center;
  background-size: cover;
  background-position: center top;
  margin-bottom: 0;
}

.jumbotron-1 {
  background-size: cover;
  background-position: center top;
  padding-bottom: 100px;
  height: 85vh;
}

.jumbotron-2 {
  background-size: cover;
  background-position: center top;
  position: relative;
  margin: 0;
  min-height: 450px;
}
/* nav
-------------------------------------------------- */
nav.fixed {
  position: fixed;
  top: 0;
  z-index: 999;
  width: 100%;
  font-weight: bold;
}
.dropdown-menu{
  background-color: #f8f9fa;
  padding: 10px;
  width: 300px;
  opacity: 0.9;
}
.dropdown-item {
  color: #000;
  font-weight: bolder;
}
.navbar-brand {
  min-width: 200px;
}
.tel1{
  color: #000;
  font-size: x-large;
  letter-spacing: 2px;
  margin-left: 20px;
}



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

/*    トップページ
-------------------------------------------------- */
.tokucho h3 span {
  margin-right: 1rem;
  border-bottom: 5px solid #B2C2E1;
}

/*    figcaption
-------------------------------------------------- */
figcaption {
  padding-left: 1rem;
  border-left: 3px solid #6b90db;
}

/* --------------------------------------------------
    サンプルページ
-------------------------------------------------- */

/*   チャート
-------------------------------------------------- */
.flow > li .flow-icon {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  line-height: 80px;
  width: 180px;
  color: #fff;
  background-color: #6b90db;
  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: #6b90db;
  position: absolute;
  top: calc(100% - .2rem);
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

/*   付箋
-------------------------------------------------- */
.fusen {
  padding: 15px;
  margin-bottom: 10px;
  background-color: #519D9E;
  color: #fff;
  }
  
/*   waku
-------------------------------------------------- */
.waku {
  border:5px solid #000;
  }

  /*   sukebako
-------------------------------------------------- */
.sukebako {
  background-color: #fff;
  opacity: 0.8;
}

/* リボン付きタイトル
-------------------------------------------------- */
.ribbon16-wrapper {  
  display: block;
  color: #333;
	position: relative;
	margin: 15px auto;
	padding: 10px;
	width: 80%;
	background: #f1f1f1;
	box-sizing: border-box;
	}
  .ribbon16 {  
	display: inline-block;
	position: absolute;
	top: -6px;
	right: 10px;
	margin: 0;
	padding: 10px 0 7px;
	width: 40px;
	text-align: center;
	color: white;
	font-size: 13px;
	background: #fa8383;
	border-radius: 2px 0 0 0;
	}
  .ribbon16:before {
	position: absolute;
	content: '';
	top: 0;
	right: -5px;
	border: none;
	border-bottom: solid 6px #d07676;
	border-right: solid 5px transparent;
  }
  .ribbon16:after {
	content: '';
	position: absolute;
	left: 0;
	top: 100%;
	height: 0;
	width: 0;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 10px solid #fa8383;
  }

/* アコーディオン
-------------------------------------------------- */
.listAccordion label {
  background-color: #f6f6f6;
  margin-bottom: -2px;
  padding: 7px;
  display: block;
  cursor: pointer;
  text-align: left;
  font-weight: bold;

}
.listAccordion label:hover {
  background: #e1e1e1;
}
.listAccordion input[type="checkbox"].on-off {
  display: none;
}
.listAccordion .listTips {
  background: #fff;
  margin: 0;
  padding: 0 5px;
  text-decoration: none;
}
.listAccordion input[type="checkbox"].on-off + .listTips {
  height: 0;
  overflow: hidden;
}
.listAccordion input[type="checkbox"].on-off:checked + .listTips {
  height: auto;
  background-color: #ddd;
}


/* テーブル company 
-------------------------------------------------- */
table.company {
  width: 100%;
  margin: 0 auto;
  border-collapse: separate;
  border-spacing: 0px 15px;
  }
  table.company th {
  background-color: #6b90db;
  padding: 10px;
  }
  table.company td {
  padding: 10px;
  text-align:justify;
  text-justify:inter-ideograph; 
  letter-spacing: 2px;
  }
  table.company th {
  background: #295890;
  vertical-align: middle;
  width: 100px;
  overflow: visible;
  position: relative;
  color: #fff;
  }
  table.company th:after {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-left-color: #295890;
  border-width: 10px;
  margin-top: -10px;
  }

    /* balloon
-------------------------------------------------- */
.balloon {
  position: relative;
  display: inline-block;
  background-color: #fff;
  border: solid 2px #525252;
  padding: 16px;
  min-width: 240px;
  max-width: 90vw;
  margin: 0 auto;
}
.balloon:before,
.balloon:after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.balloon:before {
  border: solid 12px transparent;
  border-top: solid 12px #525252;
}
.balloon:after {
  border: solid 14px transparent;
  border-top: solid 14px #fff;
  margin-top: -5px;
}
.balloon-end {
  position: relative;
  display: inline-block;
  background-color: #fff;
  border: solid 2px #525252;
  padding: 16px;
  min-width: 240px;
  max-width: 90vw;  
  margin: 0 auto;
}
    /* モーダルウィンドウ
-------------------------------------------------- */
.thumbnail {
  width: 150px;
  height: auto;
}

.modal-middle {
  margin: 5% auto;
 }
  
 .modal-img_footer {
  padding: .5em;
  text-align: center;
 }

 .gmap {
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  }
  .gmap iframe {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  }

/* --------------------------------------------------
    お問い合せページ
-------------------------------------------------- */
/*WEBでのご予約・お問合せ*/