@charset "utf-8";
/*
	Theme Name: diver_child
	Template: diver
	Description:  Diverの子テーマです。
	Theme URI: http://tan-taka.com/diver/
	Author: Takato Takagi
 */

 /************************************
** webフォント
************************************/
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+2:wght@100;200;300;400;500;600;700;800;900&display=swap');

body {
     font-family: 'M PLUS 2', sans-serif;
     font-size: 100%;
     letter-spacing: 0.1em;
}
/************************************
  ** メニューアイコンSP
  ************************************/

.menusp {
  text-align:center;
  font-size: 0.5rem;
  margin-left: 15px;
}
/************************************
  ** 追従メニューSPのサイズ、色など
  ************************************/
.drawer-nav-btn-wrap/*SPメニューwrap*/{
  position:absolute;
  top:0;
  left:0;
  width:60px;
  height:100%;
  background-color: #1e50a2/*瑠璃色*/;
  color:#fff;/*"MENU"の文字*/
}

.drawer-nav-btn span/*SPメニューの3本線真ん中*/{
  height:3px;
  background-color:#fff!important;
  top:calc(50% - 1.5px);
}

.drawer-nav-btn:before,.drawer-nav-btn:after/*SPメニューの3本線上下*/ {
                border-color: #fff!important;/*important無いとテーマ側が優先されてしまう*/
            }

@media screen and (max-width: 959px){
  #nav_fixed .header-logo{
    width:100%;
    padding:10px 0
    }
  #nav_fixed #nav{
    display:none
    }
  #nav_fixed .logo img{
    height:46px;
    width:auto;
    padding:.3em
    }
  }

@media screen and (max-width: 599px){
  #nav_fixed .logo img{
    height:52px
    }
    }


/************************************
  ** 固定フッターメニューSP
  ************************************/
  .footermenu_col{
    position:relative;
    text-align:center;
    background:#fff;
    color:#555;
    border:4px solid #c53d43;/*赤紅*/
    border-right:none;
    border-left:none;
    padding:0;
    height:100px;
    vertical-align:middle
  }

  .footermenu_col:last-child{
    /*border-right:none*/
    }
    #footer_sticky_menu a,#footer_sticky_menu button{
      position:absolute;
      top:0;
      left:0;
      width:100%;
      height:100%;
      padding:0 !important
      }
    #footer_sticky_menu a i{
      font-size:1.4em;

    }

  #footer_sticky_menu .footermenu_title{
    font-size:1.2rem;
    font-weight: bold;
    }
  .lity-container{
    width:100%
  }

  .footermenu_sns li{
    -webkit-box-flex:1;
    -webkit-flex:1;
    -ms-flex:1;
    flex:1
  }

  .footermenu_sns li a{
    font-size:.6em;
    height:100%;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;-webkit-box-pack:center;
    -webkit-justify-content:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -webkit-align-items:center;
    -ms-flex-align:center;
    align-items:center
  }

  .footermenu_sns a.line{
    padding:1em 0
  }

  .footermenu_sns .sns_name{
    display:none;
    font-weight:bold
    }
    #footer_cta{
      position:fixed;
      bottom:0;
      width:100%;
      padding:.5em 1.5em;
      z-index:999;
      display:none;
      max-height:120px
    }

.footermenu_icon{
  width: 60px;
}

/************************************
  ** 口コミ
  ************************************/
.diver-review-box{
  -webkit-box-shadow:0 5px 5px 0 rgba(18,63,82,.035),0 0 0 1px rgba(176,181,193,.2);
  box-shadow:0 5px 5px 0 rgba(18,63,82,.035),0 0 0 1px rgba(176,181,193,.2);
  border-radius:10px;
  max-width:500px;
  margin:60px auto 1.5em !important;
  padding:1.5em;
  text-align:center;
  background-color: #fff;
}

/************************************
** ボックスナビ
************************************/
.index {
 font-weight: 700;
 text-align: center;
 font-size: 1.8rem;
 color: #1e50a2;
 margin-top: 1.5rem;
}

.p-nav{
margin:2em 0;/* 全体外余白 */
padding:0;/* 全体内余白 */
}
.p-nav ul{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
list-style:none;
margin:0 !important;
padding:0 !important;
border:none;
}
.p-nav ul li{
-ms-flex-preferred-size: calc(100%/3);/* 3列 */
flex-basis: calc(100%/3);/* 3列 */
margin:0 !important;
padding:0 !important;
text-align:center;
box-shadow: inset 2px 2px 0 0 #e0ddd1, 2px 2px 0 0 #e0ddd1, 2px 0 0 0 #e0ddd1;/* 罫線 */
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
min-height:60px;/* 最低の高さ */
cursor:pointer;
background:#fff;/* 背景色 */
}
.p-nav ul li:hover{
z-index:2;
box-shadow: inset 2px 2px 0 0 #1e50a2, 2px 2px 0 0 #1e50a2, 2px 0 0 0 #1e50a2, 0 2px 0 0 #1e50a2;/* 罫線(マウスホバー) */
transition: 0.35s ease-in-out;
}
.p-nav ul li:before{
content:unset !important;
}
.p-nav ul li a{
display:block;
padding: 0.5em 1em;/* 内余白 */
text-decoration:none;
width:100%;
}
.p-nav ul li a:hover{
background:none;
opacity:1;
}
.p-nav ul li a img{
max-width:50% !important;/* 画像横幅 */
height: auto !important;
display: inline-block;
}
.p-nav .p-nav-title{
display: block;
color: #666;/* 文字色 */
font-size: 0.7em;/* 文字大きさ */
letter-spacing: 1px;
font-weight: 600;/* 文字太さ */
text-align: center;
line-height: 1.5;/* 文字行間高さ */
}
/* サイドバー */
.sidebar .p-nav ul li{
-ms-flex-preferred-size: calc(100%/2);/* 2列 */
flex-basis: calc(100%/2);/* 2列 */
}
/* スマホ */
@media screen and (max-width: 559px) {
	.p-nav ul li{
		-ms-flex-preferred-size: calc(100%/2);/* 2列 */
		flex-basis: calc(100%/2);/* 2列 */
	}
}
/* fontawesome */
.p-nav ul li a i,.p-nav ul li a svg{
font-size: 40px;/* アイコン大きさ */
padding: 10px 0;/* アイコン余白 */
color: #f6a068;/* アイコン色 */
display:inline-block;
}
/* fontawesome(2番目) */
.p-nav ul li:nth-of-type(2) a i,.p-nav ul li:nth-of-type(2) a svg{
color:#f6a068;/* アイコン色 */
}
/* fontawesome(3番目) */
.p-nav ul li:nth-of-type(3) a i,.p-nav ul li:nth-of-type(3) a svg{
color:#f6a068;/* アイコン色 */
}
/* fontawesome(4番目) */
.p-nav ul li:nth-of-type(4) a i,.p-nav ul li:nth-of-type(4) a svg{
color:#f6a068;/* アイコン色 */
}

.topb{
margin:2em 0;/* 全体外余白 */
padding:0;/* 全体内余白 */
}
.topb ul{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
list-style:none;
margin:0 !important;
padding:0 !important;
border:none;
}
.topb ul li{
-ms-flex-preferred-size: calc(100%/3);/* 3列 */
flex-basis: calc(100%/3);/* 3列 */
margin:0 !important;
padding:0 !important;
text-align:center;
box-shadow: inset 2px 2px 0 0 #e0ddd1, 2px 2px 0 0 #e0ddd1, 2px 2px 0 0 #e0ddd1;/* 罫線 */
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
min-height:60px;/* 最低の高さ */
cursor:pointer;
background:#1e50a2;/* 背景色 */
}
.topb ul li:hover{
z-index:2;
box-shadow: inset 2px 2px 0 0 #c1ab05, 2px 2px 0 0 #c1ab05, 2px 0 0 0 #c1ab05, 0 2px 0 0 #c1ab05;/* 罫線(マウスホバー) */
transition: 0.35s ease-in-out;
}
.topb ul li:before{
content:unset !important;
}
.topb ul li a{
display:block;
padding: 0.5em 1em;/* 内余白 */
text-decoration:none;
width:100%;
}
.topb ul li a:hover{
background:none;
opacity:0.8;
}
.topb ul li a img{
max-width:50% !important;/* 画像横幅 */
height: auto !important;
display: inline-block;
}
.topb .p-nav-title{
display: block;
color: #fff;/* 文字色 */
font-size: 0.9em;/* 文字大きさ */
letter-spacing: 1px;
font-weight: 600;/* 文字太さ */
text-align: center;
line-height: 1.5;/* 文字行間高さ */
}
/* サイドバー */
.sidebar .topb ul li{
-ms-flex-preferred-size: calc(100%/2);/* 2列 */
flex-basis: calc(100%/2);/* 2列 */
}
/* スマホ */
@media screen and (max-width: 559px) {
	.topb ul li{
		-ms-flex-preferred-size: calc(100%/2);/* 2列 */
		flex-basis: calc(100%/2);/* 2列 */
	}
}



 /************************************
** 評価グラフ
************************************/
.pb-rating-graph {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width:90%;
  margin: 10px auto 0px;
  padding:20px;
  color: #333;
  background: #fafafa;
}
.pb-rating-graph ul {
  margin: 0!important;
  padding: 0!important;
  border: none!important;
}
.pb-rating-graph ul li {
  list-style: none!important;
  margin: 0 !important;
  padding: 0 !important;
}
.pb-rating-graph ul li:before {
  content: unset !important;
}

.wrap-pb-rating-graph__label{
  width:20%;
}

@media screen and (max-width: 768px) {
  .wrap-pb-rating-graph__label{
    width:100%;
  }
}

.pb-rating-graph__label {
  background: #4c6cb3;
  color: #fff;
  display: inline-block;
  padding: 6px 5px;
  font-weight: 600;
  font-size: 0.8rem;
  line-height: 2;

}

@media screen and (max-width: 768px) {
  .pb-rating-graph__label {
    line-height: 1.3;
    margin-bottom:10px;
  }
}

.pb-rating-graph__wrap {
  display: flex;
}

@media screen and (max-width: 768px) {
  .pb-rating-graph__wrap {
    flex-wrap: wrap;
  }
}
.pb-rating-graph li:last-child .pb-rating-graph__wrap {
  margin: 10px 0 0;
}
.pb-rating-graph__axis {
  width: 40%;
  margin-top: 10px;
  position: relative;
  display: flex;
  justify-content: space-between;
}

.pb-rating-graph__axis:before {
  content: "";
  display: inline-block;
  height: 5px;
  background: #E3E6E7;
  width: 100%;
  position: absolute;
}
.pb-rating-graph__basis {
  color: #71828A;
  font-weight: 600;
  font-size: 0.8rem;
  line-height: 1.5;
  margin:10px;
}
.pb-rating-graph__basis-inner {
  display: inline-block;
  text-align: left;
  padding-right:10px;
}
.pb-rating-graph__wrap .pb-rating-graph__basis:first-of-type {
  text-align: right;
  padding-right: 10px;
}
.pb-rating-graph__wrap .pb-rating-graph__basis:last-of-type {
  text-align: left;
  padding-left: 15px;
}
.pb-rating-graph__scale {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 1;
  width: 20px;
  margin-top: 0 !important;
}
.pb-rating-graph__scale:before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  margin-top: -7px;
  margin-bottom: 10px;
  background: #E3E6E7;
}
.pb-rating-graph__axis:after, .pb-rating-graph__scale:after {
  content: unset !important;
}
.pb-rating-graph .pb-rating-graph__scale .pb-rating-graph__item {
  width: 42px;
  display: block;
  font-weight: 600;
  font-size: 0.8rem;
  color: #777;
  text-align: center;
  padding-top: 5px;
  margin-top: -10px !important;
}
@media screen and (max-width:600px) {
  .pb-rating-graph {
    padding: 2em 1em !important;
  }
  .pb-rating-graph__axis {
    width: 40%;
  }
  .pb-rating-graph__basis {
    font-size: 0.8rem;
    letter-spacing: 0px;
    line-height: 1.8;
  }
  .pb-rating-graph__wrap .pb-rating-graph__basis:first-of-type {
    padding-right: 7px;
  }
  .pb-rating-graph__wrap .pb-rating-graph__basis:last-of-type {
    padding-left: 7px;
  }
  .pb-rating-graph__scale {
    width: 16px;
  }
  .pb-rating-graph__scale:before {
    width: 16px;
    height: 16px;
  }
  .pb-rating-graph .pb-rating-graph__scale .pb-rating-graph__item {
    font-size: 12px;
  }
  .pb-rating-graph__scale[data-check='true']:before {
    font-size: 20px;
  }
}

.pb-rating-graph__scale[data-check='true']:before {
  background:#d70035;
}

iframe{
　width: 99%;
　border: 6px solid #C0C0C0;
 border-radius: 10px 10px 10px 10px;
}
/************************************
** Full width 見出し
************************************/
.obi {
width: 80%;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
color: #333;
font-size: 1.8rem;
font-weight: 800;
background-color: white!important;
}

.obi::before,
.obi::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: #333;
}

.obi::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}
.obi::after {
	margin-left: 30px;
	transform: rotate(35deg)
}

.moji {
width: 90%;
margin: 0 auto;
color: black;
font-size: 2rem;
font-weight: bold;
background-color: white!important;
}


/*とぐる①タイトルの背景色と文字色を変更*/
.sc_toggle_title {
     background-color: #eff7ff;
     color: #333;
     text-align: center;
     font-weight: bold;
}

/*②タイトル下の▼の背景色を変更*/
.sc_toggle_title.active:before {
     border-top: 10px solid #eff7ff;
}
/*見積もりフォームのエリア背景と見出し*/

.mitsumori {
  background-color: #ffffcc ;
  margin: 10% calc(50% - 50vw) 0;
  padding: 3% calc(50vw - 50% + 8px) 3%;
  width: 100vw;

}
.don {
  position: relative;
  padding: 1.5rem;
  text-align: center;
  border: 2px solid #000;
  background: #fff;
  color:#333;
}

.don:before,
.don:after {
  position: absolute;
  content: '';
}

.don:before {
  top: -40px;
  left: calc(50% - 40px);
  width: 80px;
  height: 80px;
  border: 2px solid #000;
  border-radius: 50%;
  background: #fff;
}

.don:after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}

.don i {
  font-size: 2rem;
  line-height: 60px;
  position: absolute;
  z-index: 1;
  top: -70px;
  left: calc(50% - 40px);
  width: 80px;
  height: 60px;
  text-align: center;
}

.don span {
  position: relative;
  z-index: 1;
}

/************************************
  ** 記事一覧リスト
  ************************************/

  ul.sc_article li{
      padding: 5px;
      border-bottom: #404040 dotted 1px;
  }

  .sc_article_date{
    font-size: 0.7em;
}

.content ul.sc_article a {
    margin-top: 5px;
    font-weight: 600;
}
