/*!
 * Start Bootstrap - Heroic Features (https://startbootstrap.com/template-overviews/heroic-features)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-heroic-features/blob/master/LICENSE)
 */
body {
  padding-top: 56px;
    color: #555555;
    background-color: #efefef;
    font-family: 'Noto Sans Japanese',   sans-serif;
}

/* breadcrumb */
.breadcrumb{
background-color: #e7e7e7;
    margin-top: 10px;
}

.breadcrumb > li + li:before {
  content: ">";
margin-left: 10px;
}

/* common style */

* { 
    margin: 0px; 
    padding: 0px; 
}
.mt10 {margin-top: 10px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}
.mt50 {margin-top: 50px;}
.mt100 {margin-top: 100px;}

.pd-t-90 {padding-top: 90px;}
.pd-t-110 {padding-top: 110px;}
.pd-l-20 {padding-left: 20px;}

.ft85 {
    font-size: 85%;
}

.ft100 {
    font-size: 100%;
}

.ft120 {
    font-size: 120%;
    font-weight: 500;
}

.ft140 {
    font-size: 140%;
    font-weight: 500;
}

.rogo {
    font-family: ;
}

.ftcolor-w {
    color: white;
}

.mg-center {margin: 0 auto;
text-align: center;}

.img-responsive {
  height: auto;
  max-width: 100%;
}

.w100 {
    width: 100%;
    margin-top: 0;
}

#header-top {
    background-color: black;
    height: 50px;
    margin-top: -56px;
    padding: 15px 0 0 0;
}

#header-top .tel {
    width: 15%;
}

@media screen and (max-width:768px) {
#header-top .tel {
    width: 40%;
}
}

.ta-right {
    text-align: right;
}

.ta-left {
    text-align: left;
}

/* width100% page contents 01*/

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

.pc01 h2 { color: white;
text-align:center;
padding: 10px;
font-size: 24px;
background-color: black;}

.pc01 h3 { color: black;
text-align:center;
padding: 25px;
font-size: 20px;}

.pc01 .box01 {
    background-color: #E2E2E2;
    margin: 5px;
    padding: 5px;
}

.pc01 .ttl-red {
    color: #B42727;
    font-size: 14px;
    font-weight: bold;
    text-align: left;
}

.pc01 .box01 .ttl-red02 {
    color: #B42727;
    font-size: 20px;
    font-weight: bold;
    text-align: left;
}

.pc01 p {
    margin-top: 5px;
    font-size: 12px;
    text-align: left;
}

.pc01 p.ft16 {
    margin-top: 5px;
    font-size: 16px;
    text-align: left;
}

.btn-box {
    border: 2px solid #000;
    padding: 10px;
    margin: 10px;
    background: rgba( 256, 256, 256, 1.0)
}

.btn-box a {
    color: black;
    text-decoration: none;
}

.btn-box a:link,a:active,a:visited,a:hover {
    color: black;
    text-decoration: none;
}

@media screen and (min-width:769px) {
.picsize { width: 180px; height: auto; margin-right: 10px;}
}
@media screen and (max-width:767px) {
.picsize { width: 100%; height: auto;}
}

/* width100% page contents 02*/
.pc02 {
    width: 100%;
    height: auto;
}

.pc02 h2 { color: white;
text-align:center;
padding: 10px;
font-size: 24px;
background-color: black;}

.pc02 h3 { color: black;
text-align:center;
padding: 25px;
font-size: 20px;}

.pc02 .box01 {
    background-color: white;
    margin: 1px;
    padding: 5px;
}

.pc02 p {
    margin-top: 5px;
    font-size: 12px;
    text-align: left;
}

@media screen and (min-width:769px) {
.picsize02 { width: 338px; height: auto; margin-right: 10px;}
}
@media screen and (max-width:768px) {
.picsize02 { width: 320px; height: auto;}
}
@media screen and (max-width:375px) {
.picsize02 { width: 333px; height: auto;}
}


/* width100% page contents 03*/
.pc03 {
    width: 100%;
    height: auto;
}

.pc03 h2 { color: white;
text-align:center;
padding: 10px;
font-size: 24px;
background-color: black;}

.pc03 h3 { color: black;
text-align:center;
padding: 25px;
font-size: 20px;}

.pc03 h3 .ft-red {
    color: #B42727;
}

.pc03 .box01 {
    background: url(../images/top/03bg.png)no-repeat center center;
    padding: 10px;
}

.pc03 p {
    color: white;
    font-size: 16px;
    line-height: 200%;
    font-weight: 500;
}

.pc03 p.muryou {
    color: #B42727;
    font-size: 28px;
    line-height: 100%;
}

.pc03 p span{
    color: #555555;
    font-size: 12px;
}

.pc03 p.line001 {
    font-size: 18px;
    color: #555555;
    margin-top: 5px;
}

.pc03 p.line002 {
    font-size: 12px;
    color: #555555;
    margin-top: 5px;
    line-height: 100%;
}

.pc03 .freedial { width: 50%;}



/* width100% page contents 04*/
.pc04 {
    width: 100%;
    height: auto;
}

.pc04 h2 { color: white;
text-align:center;
padding: 10px;
font-size: 24px;
background-color: black;}

.pc04 h3 { color: black;
text-align:center;
padding: 25px;
font-size: 20px;}

.pc04 h3 .ft-red {
    color: #B42727;
}

.pc04 .box01 {
    background: url(../images/top/04bg.png)no-repeat center center;
    height: 320px;
}

@media screen and (max-width:768px) {
.pc04 .box01 {
    background: url(../images/top/04bg-sp.png)no-repeat center center;
    height: 450px;
}
}

.pc04 p {
    color: white;
    font-size: 16px;
    line-height: 200%;
}


/* width100% page contents 05*/
.pc05 {
    width: 100%;
    height: auto;
}

.pc05 h2 { color: white;
text-align:center;
padding: 10px;
font-size: 24px;
background-color: black;}

.pc05 h3 { color: black;
text-align:center;
padding: 25px;
font-size: 20px;}

.pc05 p {
    color: black;
    font-size: 12px;
    text-align: left;
}

/* contents header */
.jumbotron {
    background-color:floralwhite;
    padding: 15px;
}

.display-3 {
    font-size: 1.7rem;
}

.lead {
    margin-bottom: 0;
}

/* contents header end */

/* contents about */

.bgwhitebox {
    background-color: white;
    width: 100%;
    padding: 10px;
    text-align: center;
    min-height: 70px;
    vertical-align: middle;
}
.ta-center {
    text-align: center;
}
.box-ta-center {
    widows: 100%;
    text-align: center;
}

.blackbox {
    width: 100%;
    text-align: center;
    color: white;
    background-color: black;
    padding: 10px;
}

.triangle3{
width: 0;
height: 0;
border-style: solid;
border-width: 30px 555px 0 555px;
border-color: #000 transparent transparent transparent;
}

.pc01 .box01-borderred {
    background-color: #FFD8D8;
    border: solid 3px #D32222;
    margin: 5px;
    padding: 15px;
    color: #D32222;
    font-size: 120%;
}

.pc01 .box01-borderblack {
    background-color: #FFF;
    border: solid 3px #000;
    margin: 5px;
    padding: 15px;
    color: #OOO;
    font-size: 120%;
}

.pc01 .bigred {
    font-size: 170%;
    color: #D32222;
    font-weight: 500;
}

.inquirybox {
    text-align: center;    
}

.inquirybox h3.bigttl {
    font-size: 180%;
    font-weight: 500;
    color: black;
}

.inquirybox .red {
    color: #D32222;
}


/* フロー */

.flow {
margin: 0 auto 50px;
}

.flow .box {
margin: 0 auto 33px;
padding: 5px;
border: 3px solid #000;
-webkit-border-radius: 5px;
border-radius: 5px;
position: relative;
font-size: 1.5em; /* テキストの指定 */
line-height: 1; /* テキストの指定 */
    background-color: black;
    color: white;
    text-align: center;
}

.flow .box:after {
border-top: 25px solid #000;
border-left: 70px solid transparent;
border-right: 70px solid transparent;
content: "";
position: absolute;
bottom: -28px; /* 三角形の高さ＋ボックスのボーダーをマイナスに */
left: 50%;/* 中央寄せに使用 */
margin-left: -70px; /* 中央寄せに使用 */

}

.flow .box:last-child:after {
border: none; /* 最後のボックスだけ三角形を表示しない */
}




/* contents about end */

/* contents point */

.pointbox01 {
    padding: 20px 20px 20px 10px;
    background-image: url(../point/images/pointbg01.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: auto;
}

.pointbox01 .subttl {
    font-size: 130%;
    font-weight: 500;
}

.pointbox01 .innerbox {
    border: dotted 1px #000;
    padding: 10px;
    width: 85%;
    background-color: rgba( 255, 255, 255, .6);
}

.pointbox02 {
    padding: 20px 20px 20px 10px;
    background-image: url(../point/images/pointbg02.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: auto;
    text-align: right;
}

.pointbox02 .subttl {
    font-size: 130%;
    font-weight: 500;
}

.pointbox02 .innerbox {
    border: dotted 1px #000;
    padding: 10px;
    width: 85%;
    background-color: rgba( 255, 255, 255, .6);
    margin-left : auto;
    margin-right : 0;
    text-align : left;
}

.pointbox03 {
    padding: 20px 20px 20px 10px;
    background-image: url(../point/images/pointbg01.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: auto;
}

.pointbox03 .subttl {
    font-size: 130%;
    font-weight: 500;
}

.pointbox03 .innerbox {
    border: dotted 1px #000;
    padding: 10px;
    width: 85%;
    background-color: rgba( 255, 255, 255, .6);
}

.pointbox04 {
    padding: 20px 20px 20px 10px;
    background-image: url(../point/images/pointbg04.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: auto;
    text-align: right;
}

.pointbox04 .subttl {
    font-size: 130%;
    font-weight: 500;
}

.pointbox04 .innerbox {
    border: dotted 1px #000;
    padding: 10px;
    width: 85%;
    background-color: rgba( 255, 255, 255, .6);
    margin-left : auto;
    margin-right : 0;
    text-align : left;
}

.bg-gray02 {
    background-color: #A4A4A4;
    padding: 20px 0;
}

.bg-gray02 .whitebox02 {
    background-color: #FFF;
    padding: 5px;
    width: 100%;
}

.bg-gray02 .whitebox02 .subttl {
    font-size: 140%;
    font-weight: 500;
}
/* contents point end */


/* contents assessment */
.assessment-box {
    background-color: white;
    padding: 10px;
}

.assessment-box-subttl {
    border-left: solid 4px #000;
    text-align: left;
}

.assessment-box-subttl p {
    font-size: 120%;
    font-weight: 500;
    padding-left: 10px;
}
/* contents assessment end */

/* contents fee */

.boxleft {
    width: 30%;
}

.boxcenter {
    width: 35%;
}
.boxcenter-bg {
    width: 35%;
    background-color: #DEDEDE;
}
.boxright {
    width: 35%;
}
.boxright-bg {
    width: 35%;
    background-color: #DEDEDE;
}

/* contents fee end */


/* contents profile */
.pro-boxleft {
    width: 20%;
}

.pro-boxright {
    width: 80%;
}

@media screen and (max-width:768px) {
.pro-boxleft {
    width: 30%;
}
.pro-boxright {
    width: 70%;
}
}

/* contents profile end */

/* privacy */

.privacy h3 { color: black;
text-align:left;
padding: 25px 25px 10px 0;
font-size: 20px;
border-bottom: solid 1px #000;}

.pri-boxleft {
    width: 100%;
}

.privacy h3 {
    text-align: left;
    margin-left: 0;
}

.privacy p {
    font-size: 100%;
}

.privacy ol,
.privacy ul {
	list-style:none;
}

.privacy ol,
.privacy ul {
	margin:0 0 20px;
	margin:0 0 2rem;
	line-height:1.8;
}

.privacy ul ul,
.privacy ol ol,
.privacy ul ol,
.privacy ol ul {
	margin-bottom:0;
}

.privacy ul {
	list-style:disc outside;
	margin-left:2px;
}

.privacy ul li,
.privacy li {
	margin:0 0 0 13px;
	margin:0 0 0 1.3rem;
}

.privacy ol {
	list-style:decimal outside;
}

.privacy ol li,
.privacy li {
	margin:0 0 0 20px;
	margin:0 0 0 2rem;
}

/* privacy end */


/*bg-switcher start*/
.bg-slider-pc {
    width: 100%;
    height: 550px;
    background-position: center center;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bg-slider__title{
    color: #fff;
    font-size: 30px;
    line-height: 1.5;
    font-weight: bold;
    text-align:center;
    text-shadow: 1px 1px 1px #000;
}

.bg-slider-pc h1 {
    text-align: left;
    width: 980px;
    margin-right: auto;
}

.bg-slider-pc h1 p {
    text-align: left;
    font-size: 16px;
    line-height: 12px;
    font-weight: 400;
    padding-left: 5px;
}

.bg-slider-pc h1 .mt10 {
    margin-top: 10px;
}

.bg-slider-sp {
    width: 100%;
    height: 450px;
    background-position: center center;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bg-slider-sp h1 p {
    text-align: center;
    font-size: 16px;
    line-height: 12px;
    font-weight: 400;
}

.bg-slider-sp h1 .mt10 {
    margin-top: 10px;
}

.sp { display: none !important; }

@media screen and (max-width:768px) {
.pc { display: none !important; }
.sp { display: block !important; }
.bg-slider__title{
    padding-top: 150px;
}
.h-sp {
    width: 350px;
    height: auto;
}
}

/*bg-switcher end*/

/*bg-switcher-inner start*/

.bg-slider-inner {
    width: 100%;
    max-height: 100px;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
background-color: white;
        border-bottom: solid 2px #000;
}

.bg-slider-inner__title{
    color: #000;
    font-size: 30px;
    line-height: 1.2;
    font-weight: bold;
    text-align:center;
    text-shadow: 1px 1px 1px #c3c3c3;
    height: 120px;
    padding-top: 30px;
}

.bg-slider-inner__title p{
    color: #000;
    font-size: 18px;
    font-weight: bold;
    text-align:center;
    text-shadow: 1px 1px 1px #c3c3c3;
}

@media screen and (max-width:768px) {
.bg-slider-inner__title02 {
    color: #000;
    font-size: 25px;
    line-height: 1.2;
    font-weight: bold;
    text-align:center;
    text-shadow: 1px 1px 1px #c3c3c3;
    height: 106px;
    padding-top: 16px;
}
.bg-slider-inner__title02 p{
    color: #000;
    font-size: 16px;
    font-weight: bold;
    text-align:center;
    text-shadow: 1px 1px 1px #c3c3c3;
}
}

.pc01 h2,
.pc02 h2,
.pc03 h2,
.pc04 h2,
.pc05 h2 {
    margin-top: 20px;
    color: #232323;
  text-align: center;
  padding: 0.25em;
  border-top: solid 2px #232323;
  border-bottom: solid 2px #232323;
  background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
  background: repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);    

}

/*bg-switcher-inner end*/


/* appear */

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(150px);
  }
  
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.slideInRight {
  animation-name: slideInRight;
  animation-duration: 1s;
  animation-timing-function: ease-out;
}

#keyvisual {
  overflow: hidden
}

/* appear end */


/* page-top */
.back-to-top {
    cursor: pointer;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display:none;
    font-size: 16px;
}

/* page-top end */

/* btn action */

.button-4{
  width:100%;
  height:50px;
  border:2px solid #000;
  float:left;
  text-align:center;
  cursor:pointer;
  position:relative;
  box-sizing:border-box;
  overflow:hidden;
  margin:0;
    background:#000;
}
.button-4 a{
  font-family:arial;
  font-size:16px;
  color:white;
  text-decoration:none;
  line-height:50px;
  transition:all .5s ease;
  z-index:2;
  position:relative;
}
.eff-4{
  width:100%;
  height:50px;
  left:-100%;
  background:white;
  position:absolute;
  transition:all .5s ease;
  z-index:1;
}
.button-4:hover .eff-4{
  left:0;
}
.button-4:hover a{
  color:#000;
}
/* btn action end */

/* header add */
.bg-dark {
  background-color: rgba(52,58,64,80%) !important;
}

/* header add end */

/* footer add */
.bg-dark-ft {
  background-color: rgba(0,0,0,100%) !important;
}

.footer-nav {
    font-size: 12px;
}

.footer-nav a {
    color: white; 
    text-decoration: none;
}

.hr-white {
    border-top: solid 1px white;
}

.footer-add {
    font-size: 12px; 
    color: white;
}

.footer-tel {
    color: white;
    font-size: 12px;
}

.footer-tel .freedial {
    width: 60%;
    height: auto;
}

@media screen and (max-width:768px) {
p.list-group-item-text {
    font-size: 90%;
}
}
/* footer add end */



/*-----*//*tel*/

a#tel {
  position: fixed;
  height: 44px;
  text-align: center;
  line-height: 40px;
  left:45%;
  bottom: 30px;
  margin-left:-110px;
    padding: 0 10px;
  display: block;
  background: rgba( 186, 26, 26, .8);
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-size:18px;
  font-weight: 600;
  border-radius: 10px;
  border-bottom: solid 5px #771313;
    z-index: 100;
}

a#tel:hover{
  background: rgba(252,201,39,.7);
}

@media screen and (min-width:767px) {
a#tel {
	display: none;
}
}

/*-----*//*tel-end*/

/*-----go to top*/

.page-top {
	display: none ;
	margin: 0 ;
	padding: 0 ;
	z-index: 25;
	position: relative;
}
 
.page-top p {
	margin: 0 ;
	padding: 0 ;

	position: fixed ;
	right: 16px ;
	bottom: 16px ;
}
 
.move-page-top {
	display: block ;
	background: #d26464 ;
	width: 50px ;
	height: 50px ;
	cursor: pointer ;

	color: #fff ;
	line-height: 50px ;
	text-decoration: none ;
	text-align: center ;

	-webkit-transition:all 0.3s ;
	-moz-transition:all 0.3s ;
	transition:all 0.3s ;

	border-radius: 5px;		/* CSS3草案 */
	-webkit-border-radius: 5px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 5px;	/* Firefox用 */
}

@media screen and ( min-width:1290px ) {
	.move-page-top:hover
	{
		opacity: 0.85 ;
	}
}

/*-----go to top end*/