/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
index
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.top_exp{	background-color:#E8380D;	padding:10px 0 20px;	}
.top_logo{ display: flex; display: -webkit-flex; justify-content: space-between;}
.top_logo_img{width: 30%;}
.top_logo_txt{width: 40%;}

.exp_point{ background-color:#fff;	margin:6px 0px;}
.exp_point_title{ display: flex; display: -webkit-flex; align-items: center; column-gap: 15px;	padding:10px 0px;	position:relative;}
.exp_point_title.active{display: flex !important;}
.point_li1 {width: 15%;}
.point_li2 {width: 60%;}

.exp_point--01 .point_li2 img {width: 119px;}
.exp_point--02 .point_li2 img {width: 155px;}
.exp_point--03 .point_li2 img:first-child{width: 55px;}
.exp_point--03 .point_li2 img:last-child{width: 243px;}

.exp_point_title::before, .exp_point_title::after {content: ""; width: min(4vw,20px); height:4px;background: #00468c; position: absolute; right: 5px; top: 50%; transition: 0.3s all ease-in-out;}
.exp_point_title::before {transform: translateY(-50%);}
.exp_point_title::after {transform: translateY(-50%) rotate(90deg);}
.exp_point_title.active::after {transform: translateY(-50%) rotate(0);}

.exp_point_det {padding: 0 15px 15px; font-size: 14px; display: none;}


@media (min-width: 768px) {
 .top_exp{padding:10px 0 30px;	}
 .top_logo{	padding:20px 0 10px;	}
 .exp_point_title {cursor: pointer; padding: 20px 0;}
 .top_logo_img img, .top_logo_txt img, .point_li1 img, .exp_point--01 .point_li2 img, .exp_point--02 .point_li2 img, .exp_point--03 .point_li2 img {width: auto !important;}
 .point_li1 , .point_li2, .top_logo_txt{width: auto;}
 .exp_point--03 .point_li2 img:first-child{margin-bottom: 10px;}
 .exp_point_det {display: block;}
.exp_point_title::before, .exp_point_title::after {content: none;}

}

/* icon menu */
.top_icon_menu__wrap {padding: 15px 0; background: #faf0dc;}
#footer__nav.top_icon_menu__wrap  {padding: 30px 0 20px;}
body:not(.fire-top) #footer__nav.top_icon_menu__wrap {padding-bottom: 0;}
.icon_menu_fire {display: flex; display: -webkit-flex; flex-wrap: wrap; justify-content: space-between; }
.icon_menu_fire li{background: #fff; width: 32.5%;}
.icon_menu_fire li:not(:nth-child(-n+3)) {margin-top: 1%; text-align: center;}
.icon_menu_fire li a {display: block; text-align: center; padding: 15px 5px; color:#E8380D; }
.icon_menu_fire li a img {display: block; width: 45px; margin: 0 auto 10px;}
.icon_menu_fire li a p {font-size: 13px; font-weight: bold; line-height: 1.3;}
.icon_menu_fire li:last-child a p {letter-spacing: -1.5px;}

#fire.join-fire #footer__nav {display: none;}

@media (min-width: 768px) {
 .top_icon_menu__wrap{padding: 40px 0;}
 .icon_menu_fire {justify-content: center; column-gap: 1%; flex-wrap: wrap; }
 .icon_menu_fire li {width: 18%; margin: 0; flex-grow: 4;}
 .icon_menu_fire li a{padding:20px 10px;}
 .icon_menu_fire li a img {width: 55px; }
 .icon_menu_fire li a p {font-size: 15px;} 
 .icon_menu_fire li:nth-child(-n+5) {margin-top: 0;}
}


/* simulation */
.top_simulation {background:#fff; padding: 20px 0;}
.top_simulation_title{	color:#E8380D; text-align: center;	font-weight:bold;	font-size:22px;	letter-spacing:3px; margin-bottom: 15px;}
.sim_title--02 {	background:#E8380D; color: #fff; letter-spacing: normal; font-size:20px; padding: 5px 0;}
.top_sim__cont {border-bottom: 1px solid #ccc; padding-bottom: 15px; margin-bottom: 15px;}
.top_simulation_q{	color:#444;	font-weight:bold;	font-size:14px; padding-left: 1em; border-left: 3px solid #E8380D; }

@media (min-width: 768px) {
 .top_simulation {padding:40px 0;}
 .top_simulation_title{font-size:28px; margin-bottom: 25px;}
 .sim_title--02 {width: 90%; max-width: 1000px; margin-inline: auto; border-radius: 5px; padding: 10px; font-size: 24px;}
 .top_sim__cont { padding-bottom: 20px; margin-bottom: 25px;}

 .top_simulation_q{	font-size:18px; font-weight: bold; border-left: 5px solid #E8380D; }
}

.top_simulation_form_radio {width: 80%; margin: 0 auto;}
.top_simulation_form_radio input{ display: none;} 
.radio_box{width: 100%;	font-size:14px; display: flex; display: -webkit-flex; margin: 15px 0;}
.radio_box li {flex: 1;}

.radio_box a:link {color:#444;}
.radio_box a:visited {color:#444;}

.top_sim__attention {color:#444;	font-size:12px; display: flex; display: -webkit-flex; justify-content: flex-end; column-gap: 5px;}
.top_sim__attention li{padding-left: 1em; position: relative;}
.top_sim__attention li::before {content: "▲"; position: absolute; left: 0; top: 50%; transform: translate(0, -50%) rotate(90deg); font-size: 0.8em;}

.radio_box li label{ 
  display: block; 
  cursor: pointer; 
  margin: 0;
  padding: 12px 5px; 
  background:#ffffff; 
  color:#E8380D; 
  font-size: 14px; 
  text-align: center; 
  line-height: 1; 
  transition: .2s;     
  letter-spacing:1px;
  border-top:1px solid #E8380D;
  border-bottom:1px solid #E8380D;
} 
.radio_box li:first-of-type label{ 
  border-radius: 5px 0 0 5px;     
  border:1px solid #E8380D;
} 
.radio_box li:last-of-type label{ 
 border-right: 0px; 
 border-radius: 0 5px 5px 0;
 border:1px solid #E8380D;
} 

.top_simulation_form_radio input[type="radio"]:checked + label { 
 background-color:#E8380D; 
 color: #fff;
 box-shadow: 0px 0px 5px 0 #999999;
}

.top_simulation_form_radio input[type="radio"]:checked + label.label_left{
	box-shadow: -1px 1px 5px 0 #999999;
}

.top_simulation_form_radio input[type="radio"]:checked + label.label_right{
	box-shadow: 1px 1px 5px 0 #999999;
}

.q4{font-weight:bold;	font-size:14px;	color:#444; display: flex; column-gap: 10px; width: 80%; margin: 15px auto 0;}

.q4__input, .q4__unit{display: flex; display: -webkit-flex; align-items: flex-end; column-gap: 5px;}
.q4__input li input[type="text"] {
 font-size:14px;
	color:#444;
	padding:6px 6px 6px 6px;
	background-color:#fff;
	border-radius:5px;
	border:1px solid #E8380D;
}
.q4__input li:first-child input[type="text"] {width:50px;}
.q4__input li:last-child input[type="text"] {width:2em;}
.top_simulation_form_dot{
	font-weight:bold;
	font-size:30px;
 line-height: 1;
	color:#444;
}
.q4__unit input[type=radio] { display: inline-block; margin-right: 6px;}
.q4__unit input[type=radio] + label {
 position: relative;
 display: inline-block;
 margin-right: 9px;
 font-size: 14px;
 line-height: 30px;
 cursor: pointer;
}

@media (min-width: 768px) {
 .radio_box{	font-size:16px;margin: 25px 0;}
 .top_sim__attention {font-size:14px;}
 .radio_box li label{ padding: 18px 5px; font-size: 16px;} 
 .q4 {font-size:16px;	column-gap: 30px; width: 80%; margin: 25px auto 0;}
 .q4__input li input[type="text"] { font-size:16px; padding:6px 15px;}
 .q4__input li:first-child input[type="text"] {width:6em;}
 .q4__input li:last-child input[type="text"] {width:3em;}
 .q4__unit input[type=radio] + label {margin-right: 10px; font-size: 16px;}
}

 
@media (min-width: 1px) {
 .q4__unit input[type=radio] {
     display: none;
     margin: 0;
 }
 .q4__unit input[type=radio] + label {
     padding: 0 0 0 24px;
 }
 .q4__unit input[type=radio] + label::before {
     content: "";
     position: absolute;
     top: 50%;
     left: 0;

     -moz-box-sizing: border-box;
     box-sizing: border-box;
     display: block;
     width: 22px;
     height: 22px;
     margin-top: -11px;

     background: #FFF;
 }
 .q4__unit input[type=radio] + label::before {
     border: 1px solid #E8380D;
     border-radius: 30px;
 }
 .q4__unit input[type=radio]:checked + label::after{
     content: "";
     position: absolute;
     top: 50%;

     -moz-box-sizing: border-box;
     box-sizing: border-box;
     display: block;
 }
 .q4__unit input[type=radio]:checked + label::after {
     left: 0px;

     width: 22px;
     height: 22px;
     margin-top: -11px;

     background:#E8380D;
     border-radius: 22px;

    box-shadow: 0 0 0 1px #E8380D inset , 0 0 0 4px #ffffff inset;
 }
}

.exp_text{
	font-size:12px;
	color:#444;
 margin-top: 15px;
}

.top_simulation_form{	text-align:center; 	margin:20px 0px 40px 0px;	}
.top_simulation_form input{
	font-weight:bold;
	font-size:14px;
	letter-spacing:2px;
	color:#fff;	
	padding:10px 24px 9px 24px;
	background-color:#E8380D;
	border-radius:5px;
	text-align:center;
	border-style:none;	
	-webkit-appearance: none;
}

@media (min-width: 768px) {
.exp_text{text-align: right;}
.top_simulation_form{	margin:20px 0px 80px 0px;	}
.top_simulation_form input{	font-size:18px;	padding:15px 40px;}

}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

underlayer

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.pageTitle {margin-bottom: 30px;}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

protection

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.fire_simulation_sub { margin:0 auto 20px; color: var(--c-fire-01); font-weight: bold; font-size: 24px; letter-spacing: 1px; text-align: center;}

.fire_simulation_table table { border: solid 1px var(--c-fire-01); letter-spacing: 1px; width: 100%; margin: 0px;}
.fire_simulation_table table th,
.fire_simulation_table table td {padding: 10px; font-size: 14px; color: #444; font-weight: normal; border: solid 1px var(--c-fire-01);}
.fire_simulation_table thead th {font-weight: normal; text-align: right;}
.fire_simulation_table tbody tr td {text-align: right;}
.fire_simulation_table tbody tr td:first-child { text-align: center;}
.fire_simulation_table tbody tr:last-child td {
 color: #fff;
 background: var(--c-fire-01);
 border-right-color: #fff;
 font-size: 16px;
 font-weight: 600;
}
.fire_simulation_table tbody tr:last-child td:last-child {border-right-color: var(--c-fire-01);}

.clist_com {font-size: 14px; margin: 5px 0 0; line-height: 1.4;}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

flow

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.flowIndex p {margin-bottom: 1em;}
.flowIndex p img {width: 24px; }



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

insurance

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.fire-insurance figure {margin: 20px auto;}
.ins-block,.ins-block_pc {overflow: hidden;}
.ins-block figure {width: 40%; margin: 0 0 10px 10px; float: right;}
.insStrong {color: var(--c-fire); font-weight: 600; margin: 15px 0;}

@media (min-width: 768px) {
.fire-insurance figure {text-align: center;}
.fire-insurance figure img {width: auto; max-width: 100%;}
.ins-block,.ins-block_pc {margin: 50px auto;}
.ins-block_pc figure {width: 40%; margin: 0 10px 10px 0; float: left;}

}