.head_top{
    width: 100%;
    height: auto;
    margin-top: 0px;
    margin-left: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    color: #FFFFFF;
    float: left;
    background-color: #FFFFFF;
}
.head_logo{
    float: left;
    width: 30%;
    
}
.head_tel{
    float: right;
    width: 50%;
}
.head_mail{
    float: right;
    width: 20%;
}
.img_100{
    width: 100%;
    float: left;
    
}

/*火葬の種類*/
.tab {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.tab__label {
  color: #fff;
  background: #ccc;
  margin-right: 5px;
  padding: 6px 16px;
  order:-1;
  cursor: pointer;
}

.tab__content {
  width: 100%;
  display: none;
  border: 1px solid #ccc;
  padding: 16px; 
}

.tab__switch {
  display: none; 
}

.tab__switch:checked + .tab__label {
  background: red;  
}

.tab__switch:checked + .tab__label + .tab__content {
  display: block; 
}
.jin{
    color: #FFFFFF!important;
}
.c66{
    color: #666666!important;
    
    
}


/*---------------------------------
問い合わせボックス
--------------------------------*/
.formabox{
    width: 100%;
    height: 100%;
    float: left;
    background-repeat: no-repeat;
}
.formabox_tel{
    float: left;
    height: auto;
    width: 40%;
    margin-left: 5%;

}

.formabox_mail{
    float: left;
    height: auto;
    width: 30%;
    
}


/* ---------- フッター 固定CTA ---------- */
.foot_fix_btn {
z-index:10000;    
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100% !important;
/*    -webkit-transition: all 0.5s;
    transition: all 0.5s;*/
}
/*.foot_fix_btn.js_hide {
    transform: translateY(100%);
}*/
.foot_fix_btn ul li{
    text-align: center;
}

.f_tel{width:50%;
float: left;
background: #8CC63F;
opacity: 0.9;    
    padding-top: 3%;
padding-bottom: 3%;
text-align: center !import；

}

.f_b a{
font-size: xx-large; 
font-weight: bold;
display: inline-block;
}



.f_mail{width:50%;
float: left;
background: #99EBFF;
opacity: 0.9;        
padding-top: 3%;
padding-bottom: 3%;
text-align: center !import；

}



.c_b{
    color: #130101;
    padding-top: 3%;
}
.fo_h2{
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: x-large;
    color: #2F0405;
}
.btn01 {
  display: inline-block;
  padding: 16px 32px;
  background: #e41313;
  border-bottom: solid 4px #bd1111;
  border-radius: 8px;
  color: #ffffff;
  text-decoration: none;
  font-size: 18px;
  font-weight: bold;
  line-heigt: 1.2em;
  -webkit-transition: .100s;
  transition: .100s;
}
.btn01:hover {
  border-bottom: none;
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
}


.wid80{
    width: 80%;
    float: left;
    margin-left: 10%;
    padding-bottom: 10%;
    font-size: larger;
    line-height: 1.5em;
}



.mizu{
    width: 100%;
    float: left;
    background-color: #3FA9F5;
}
.wid{
    width: 80%;
    float: left;
    margin-left: 10%;
    padding-top: 3%;
    padding-bottom: 3%;
}
.wid p{
    font-size: x-large;
    color: #ffffff;
    line-height: 1.5em;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-weight: bold;
}

.formboxx
{
    width: 100%;
    padding-bottom: 5%;
    padding-top: 5%;
    background-color:#E6E6E6;    
    float: left;
}
.normalboxx
{
    width: 100%;
    float: left;
    padding-bottom: 5%;
    padding-top: 5%;
    background-color:#E3F7FF;    
}

.image70{
    width: 80%;
    float: left;
    margin-left: 10%;
}
.image80{
    width: 80%;
    float: left;
    margin-left: 10%;
}





.accordion {
margin: 3em auto;
max-width: 80vw;
}
.toggle {
display: none;
}
.option {
position: relative;
margin-bottom: 1em;
}
.title,
.content {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all 0.3s;
}
.title {
border: solid 1px #006837;
padding: 1em;
display: block;
color: #333;
font-weight: bold;
    background-color: FFFFF;
    font-size: x-large;
}
.fxl{font-size: x-large;
}

.title::after,
.title::before {
content: "";
position: absolute;
right: 1.25em;
top: 1.25em;
width: 2px;
height: 0.75em;
background-color: #999;
transition: all 0.3s;
}
.title::after {
transform: rotate(90deg);
}
.content {
max-height: 0;
overflow: hidden;
}
.content p {
margin: 0;
padding: 0.5em 1em 1em;
font-size: 0.9em;
line-height: 1.5;
}
.toggle:checked + .title + .content {
max-height: 500px;
transition: all 1.5s;
}
.toggle:checked + .title::before {
transform: rotate(90deg) !important;
}

.q{
    color: #FF0004;
    font-size: large;
    font-weight: bold;
}
.a{
    color: #009245;
    font-size: large;
    font-weight: bold;
}