@charset "UTF-8";


/* ========================================================================== */
/* 01) 基本設定 全体 */
/* ========================================================================== */

.step_top{  margin:0px 0px 0px 40px;}
.step_naka{ padding:40px 10px 10px 10px; margin:0px 0px 0px 30px; margin-top:-50px;
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	}

.step_naka table th,
.step_naka table td {padding:5px 5px ;}



.step1_naka01{ 
	border:3px #46BBF2 solid;
	}



.step2_naka01{
	border:3px #46BBF2 solid;

	}
.step2_naka01_waku_l,
.step2_naka01_waku_r{

 background-color: #F4F4F4; padding: 10px; font-size:15px; line-height:26px; margin:0px auto 30px auto; 
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	width:46%;
	min-height:280px;
	}
	.step2_naka01_waku_l{ float: left;}
	.step2_naka01_waku_r{ float: right;}

.step3_naka01{
	border:3px #F387B8 solid;

	}


.denki_comment01{ background-color: #FFFED2; padding: 10px; font-size:15px; line-height:26px; margin:20px auto 30px auto; 
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	width: 85%;
	
}









table.table_hikaku{
	border-collapse: separate;
	border-spacing: 0; padding:0px;

	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	width:100%;
	margin-bottom:6px;

}
table.table_hikaku th {
	width:150px;
	padding: 10px 5px;
	font-weight: bold;
	vertical-align: top;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	background: #EB6AA4;
}




table.table_hikaku th.th_title{background: #768B35; color:#FFF; border-bottom: 1px solid #fff;}


table.table_hikaku td {
	padding: 10px;
	vertical-align: top;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	text-align: left;
}

.step3_td03{ background-color:#FFF!important; font-size:120%;}
.mf_table01 table td ul{margin:6px 0px 6px 24px;}


.mobile_only{ display:none; visibility:hidden;}
















#contents .button_submit input[type="submbuttonit"],
#contents .button_submit input[type="submit"]{
	background-color:#FE7F1E;
	border:1px #FE7F1E solid;
	color:#fff;
	display: block; width:75%; padding: 10px 10px;
	margin:20px auto 0px auto;
		-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	font-size: 16px; line-height: 22px;
	}



#contents .button_submit input[type="button"]:hover,
#contents .button_submit input[type="submit"]:hover{
	background-color:#923922;
	border:1px #923922 solid;
	color:#fff;
	}








.step_naka table {
	border-collapse: separate;
	border-spacing: 0;

	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	width:100%;
	margin-bottom:6px;

}

.step_naka table th {
	width:150px;
	padding: 10px 5px;
	font-weight: bold;
	vertical-align: top;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	background: #eee;
	text-align: left;
}
.step1_naka01 table th{ 	background: #EBF5FC;	}
.step2_naka01 table th { 	background: #EBF5FC; width: 100px;	}
.step3_naka01 table th { 	background: #FFF2F9; text-align: center; 	padding:4px 5px; font-size: 13px;}




.step_naka table th.th_title{background: #46BBF2; color:#FFF;
	border: 1px solid #46BBF2;
	}


.step_naka table td {
	padding: 10px;
	vertical-align: top;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	text-align: left;
	background-color: #fff;
}
.step3_naka01 table td{ padding:5px 5px; font-size: 14px;}

.step3_naka01 table {  table-layout: fixed; }
.step3_naka01 table th,
.step3_naka01 table td{width:7%;}
.step3_naka01 table tr th:last-child,
.step3_naka01 table tr td:last-child { width:9%;}





#contents input{ font-size:16px; line-height:22px;
	margin-left:2px; margin-right:2px;
	vertical-align:middle;
}






#contents button,
#contents input,
#contents select{
  font-size:16px; line-height:22px;
	margin-left:2px; margin-right:2px;
	vertical-align:middle;
  color: #333; margin-bottom:3px;
}

#contents textarea{ padding:2px; font-size:14px; line-height:20px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
    border: 1px solid #999;
	}
#contents select{
 font-size:16px; line-height:22px;
color: #333;
font-size:14px; line-height:20px;
height:24px;
vertical-align: middle;
margin-left:2px; margin-right:2px;
  background-color: #fff;
  border: 1px solid #CCC;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
}


button,input {
  *overflow: visible;
  line-height: normal;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0; border: 0;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button;
}

label,
select,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
input[type="radio"],
input[type="checkbox"] {
  cursor: pointer;
}

input[type="search"] {
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
  -webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

textarea {
  overflow: auto;
  vertical-align: top;
}






#contents input[type="text"],
#contents input[type="number"],
#contents input[type="password"]{
    height:1.6em;
    padding:0px 3px;
    vertical-align: middle;

    background-color: #ffffff;
    border: 1px solid #ccc;
    color: #555555;
  -webkit-border-radius:3px;
     -moz-border-radius:3px;
          border-radius:3px;
}


#contents textarea,
#contents input[type="text"],
#contents input[type="password"],
#contents input[type="datetime"],
#contents input[type="datetime-local"],
#contents input[type="date"],
#contents input[type="month"],
#contents input[type="time"],
#contents input[type="week"],
#contents input[type="number"],
#contents input[type="email"],
#contents input[type="url"],
#contents input[type="search"],
#contents input[type="tel"],
#contents input[type="color"],
#contents .uneditable-input {
  background-color: #ffffff;
  border: 1px solid #cccccc;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
     -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
       -o-transition: border linear 0.2s, box-shadow linear 0.2s;
          transition: border linear 0.2s, box-shadow linear 0.2s;
}

#contents textarea:focus,
#contents input[type="text"]:focus,
#contents input[type="password"]:focus,
#contents input[type="datetime"]:focus,
#contents input[type="datetime-local"]:focus,
#contents input[type="date"]:focus,
#contents input[type="month"]:focus,
#contents input[type="time"]:focus,
#contents input[type="week"]:focus,
#contents input[type="number"]:focus,
#contents input[type="email"]:focus,
#contents input[type="url"]:focus,
#contents input[type="search"]:focus,
#contents input[type="tel"]:focus,
#contents input[type="color"]:focus,
#contents .uneditable-input:focus {
  border-color: rgba(82, 168, 236, 0.8);
  outline: 0;
  outline: thin dotted \9;
  /* IE6-9 */
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
		  background-color:#FEFDEF;

}


#contents select:focus,
#contents input[type="file"]:focus,
#contents input[type="radio"]:focus,
#contents input[type="checkbox"]:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
  background-color:#FEFDEF;
}

.y_gasu_title{ 
width: 80px; padding: 3px 10px;
background-color:#EF789C; color: #fff;
text-align: center;
float: left;
margin:0px 3px 5px 0px;
		-moz-border-radius:3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
.y_gasu_plan{ 
min-width:150px; padding:3px 10px;
color: #333;
text-align: left;
float: left;
margin:0px 6px 5px 0px;
font-size: 18px;
		-moz-border-radius:3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background-color:#FFF2F9;
}



.c_den_title{ 
width: 80px; padding: 3px 10px;
background-color:#999999; color: #fff;
text-align: center;
float: left;
margin:0px 3px 5px 0px;
		-moz-border-radius:3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
.c_den_plan{ 
min-width:150px; padding:3px 10px;
color: #333;
text-align: left;
float: left;
margin:0px 6px 5px 0px;
font-size: 18px;
		-moz-border-radius:3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background-color:#F0F0F0;
}
.tani{ width: 120px; text-align: right; float: right; margin: 10px 6px 0px 0px; font-size: 92%;}
.kei{ font-size: 120%; font-weight: bold;}
td.r{ text-align: right!important;}


.total_area_waku{
border: 3px #F387B8 solid;
padding:20px 30px;
margin: 26px 0px 0px 30px;
    margin-top: 0px;
				min-width: 900px;

-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.total_area{ float: left; width:395px; background-color: #sa4a6d4}
.total_area_waku_r{ float: right; width:450px;
padding:16px 10px;
background-color: #FFF2F9;
	-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
	
	}


.total_l_area{ float: left; width:180px;}



.total_l_title{
background-color:#7D7D7D;
color: #fff;
text-align: center; padding:10px 3px;
-moz-border-radius:3px 3px 0px 0px;
-webkit-border-radius:3px 3px 0px 0px;
border-radius:3px 3px 0px 0px;}

.total_l_kei{
background-color:#F2F2F2;
color: #333;
text-align: center;  padding:15px 5px;
-moz-border-radius:0px 0px 3px 3px;
-webkit-border-radius:0px 0px 3px 3px;
border-radius:0px 0px 3px 3px;
font-size:26px; line-height: 125%;}


.total_r_area{ float: right; width:180px;}

.total_r_title{
background-color:#ED638C;
color: #fff;
text-align: center; padding:10px 3px;
-moz-border-radius:3px 3px 0px 0px;
-webkit-border-radius:3px 3px 0px 0px;
border-radius:3px 3px 0px 0px;}

.total_r_kei{
background-color:#FFF2F9;
color: #D7226A; 
text-align: center; padding:15px 5px;
-moz-border-radius:0px 0px 3px 3px;
-webkit-border-radius:0px 0px 3px 3px;
border-radius:0px 0px 3px 3px;
font-size:26px; line-height: 125%;}


.triangle {
  width:0px; float: left;
  height: 0; margin:25px 0px 0px 8px;
  border-top: 30px solid transparent;
  border-right:0px solid transparent;
  border-bottom: 30px solid transparent;
  border-left: 20px solid #616161;

}

.taw_r_title{
border: 3px #E94375 solid;
background-color: #E94375;
padding: 5px 20px;
margin: 26px 0px ;
margin-top: 0px;
text-align: center;
color: #fff;

-moz-border-radius: 30px;
-webkit-border-radius: 30px;
border-radius: 30px;

font-size:20px; line-height: 125%;
}



.taw_koumoku{ width:85%; margin: auto; border-bottom:2px #ccc dotted; padding-bottom: 4px;}

.taw_r_koumoku{ 
width:120px; padding:8px 10px;
background-color:#F387B8; color: #fff;
text-align: center;
font-size: 16px; ;image-orientation: 125%;
float: left;
margin:0px 12px 0px 0px; margin-top: -10px;
		-moz-border-radius:30px;
	-webkit-border-radius: 30px;
	border-radius: 30px;
	vertical-align: middle;
}
.taw_r_ritu{ width:350px; text-align: right; font-size:30px; ;image-orientation: 125%; margin:24px 12px 0px 0px;  vertical-align: middle;}



/* □□==========================================================================□□ */
/*　30) タブレット用（481-800px）環境の設定  */
/* □□==========================================================================□□ */

@media (min-width:481px) and (max-width:800px){

.step_naka{width:650px; margin-top:-40px;}

#side,
.mobile_only{ display:none; visibility:hidden;}


}










/* □□==========================================================================□□ */
/*　20) スマートフォン用（480px以下）環境の設定  */
/* □□==========================================================================□□ */


/*表示を切り替えるウィンドウサイズの指定*/
@media (max-width : 480px){
.step_top{margin:0px;}



.step_naka {width: auto;
    margin:0px 0px 0px 5px; margin-top:-30px;
    padding:20px 10px 20px 10px;
}

.total_area_waku {width:auto;
    margin:0px 10px;
    padding:20px 10px 20px 10px;
				min-width: inherit;
				display: block;
}
.total_area{ float: none; clear: both; margin-bottom: 26px; width: auto;}
.total_area_waku_r{ margin-top: 20px; float: none; clear: both; width: auto;}
.total_area:after,
.total_area_waku_r:after,
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

.step_naka table{ width:100%;}
.step_naka table th,
.step_naka table td { border-bottom:1px #E1E0DB solid;
	width:auto; display:block; padding:5px; font-size:14px; line-height:20px;}


table.table_hikaku th,
table.table_hikaku td {	width: auto;}
.taw_koumoku .clearfix{display:block;}

.mobile_only{ display: inline; visibility: inherit; font-size:x-small; font-weight:bold;}
#side,
.pc_only{ display:none; visibility:hidden;}
.step2_naka01_waku_l,
.step2_naka01_waku_r{ float: none; width: auto; min-height: inherit;}

.taw_koumoku,
.taw_r_ritu,
.total_area_waku_r{ min-width:inherit; width: auto}

.total_r_area{margin:auto; width: 95%;}
.total_l_area{margin:16px auto; width: 95%;}

.total_l_kei,
.total_r_kei{padding: 10px 5px;}

.total_l_area,
.total_r_area,
.taw_r_koumoku,
.taw_r_ritu{  float: none;}
.taw_koumoku{ margin-bottom: 16px; padding: 3px 6px; width: auto;}
.taw_r_koumoku{ padding: 3px 6px; width: auto;}

.taw_r_ritu{text-align: left; margin:16px 0px 16px 6px;} 
.taw_r_title{ font-size:13px; line-height: 110%; padding:10px 5px;}

.triangle{
  border-top: 15px solid #F0897F;
  border-right: 10px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 10px solid transparent;
		float: none;
height: 0;
margin:0px auto;

}

}