
body {
  padding-top: 4.5rem;
  font-family: "Open Sans", 'Century Gothic', 'Muli', "Helvetica Neue", Helvetica, "Arial", 'Kosugi Maru', "メイリオ", Meiryo, "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #737273;
  background-color: #F2F2F2;
}

html {
  -webkit-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: transparent;
}

@-ms-viewport {
  width: device-width;
}

@media (max-width: 576px){
	footer { font-size: 3.5vw}
}

h2{
    margin:  0;             /* デフォルトCSS打ち消し */
    position:  relative;    /* 位置調整 */
    font-weight:  normal;   /* 文字の太さ調整 */
    margin-bottom: 35px;    /* 周りの余白指定 */
    font-size: 40px;        /* 文字サイズ指定 */
    text-align:  center;    /* 文字位置指定 */
    font-family: kan415typos-std,sans-serif;
    font-style: normal;
}

h2 span {
    display:  block;        /* ブロック要素にする */
    font-size:  30px;       /* 文字サイズ指定 */
    margin-top:  10px;      /* 周りの余白指定 */
    position:  relative;    /* 位置調整 */
    width: 200px;           /* 幅指定 */
    margin: 10px auto 0;    /* 周りの余白指定 */
    background-color:  #F2F2F2;/* 背景色指定 */
    font-family: kan415typos-std,sans-serif;
    font-style: normal;
	text-align: justify;
	color: rgba(115,114,115,0.5)
}
 
h2 span::before {
    content: '';            /* 空の要素を作る */
    height:  1px;           /* 高さ指定 */
    background-color: rgba(115,114,115,0.5);/* 背景色指定 */
    position:  absolute;    /* 位置調整 */
    top: 0;                 /* 位置調整 */
    bottom:  0;             /* 位置調整 */
    margin:  auto;          /* 位置調整 */
    z-index: -1;            /* 重なり調整 */
    width: 260px;           /* 幅指定 */
    left:  -30px;           /* 位置調整 */
}

.box01 {
    position: relative;/*相対位置*/
	padding: 0.5em 0.5em 0.5em 2em;/*アイコン分のスペース*/
    margin: 1rem 0;
    font-weight: bold;
    color: #737273;/*文字色*/
    border: solid 3px #BFA19F;/*線*/
    border-radius: 10px;/*角の丸み*/
}

.box01:before{ 
font-family: "Font Awesome 5 Free";/*忘れずに*/
content: "\f10d";/*アイコンのユニコード*/
font-weight:900;
position: absolute;/*絶対位置*/
font-size: 1em;/*サイズ*/
left: 0.5em;/*アイコンの位置*/
top: 0.5em;/*アイコンの位置*/
color: #BFA19F; /*アイコン色*/
}

.box01 p {
    margin: 0; 
    padding: 0;
}

.box02 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #BFA19F;
}
.box02 .box-title {
    position: absolute;
    display: inline-block;
    top: -32px;
    left: -3px;
    padding: 0 9px;
    height: 30px;
    line-height: 30px;
    vertical-align: middle;
    font-size: 1rem;
    background: #BFA19F;
    color: #F2F2F2;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.box02 p {
    margin: 0; 
    padding: 0;
}

.under {
  background: linear-gradient(transparent 70%, #F7CFC6 70%);
  }

.question {
	position: relative;/*相対位置*/
	padding: 0.5em 0.5em 0.5em 1.5em;/*アイコン分のスペース*/
	line-height: 1.4;/*行高*/
	color: #737273;/*文字色*/
  font-family: kan415typos-std,sans-serif;
    font-style: normal;
	font-size: 18px;
}

.question:before{ font-family: "Font Awesome 5 Free";/*忘れずに*/
content: "\f138";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size: 1em;/*サイズ*/
font-weight:900;
left: 0.25em;/*アイコンの位置*/
top: 0.9rem;/*アイコンの位置*/
color: rgba(191,161,159,0.80); /*アイコン色*/
}

.church a:not(.churcbtn){
  transition: .3s;
  color: #BFA19F;
}

.church a:hover :not(.churcbtn){
  color: #F7CFC6;
  text-decoration: none;
  border-bottom: dotted 3px #F7CFC6;
}

span.churcbtn a{
  transition: .3s;
  color: #BFA19F;
  border: solid thin #BFA19F;
  padding: 5px;
  margin: 3px 0;
  border-radius: 5px;
  display: inline-block;
}

span.churcbtn a:hover{
  color: #F2F2F2;
  background-color: #BFA19F;
  opacity: .8;
  text-decoration: none;
}
