@charset "utf-8";

/******************** base of the browser style ********************/

body{
	font-family: 'メイリオ','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',Meiryo,sans-serif,'ＭＳ Ｐゴシック';
	color: #333;
	text-align: center;
	font-size: 0.9em;
	line-height: 1.6em;
	background: url(../images/common/bg_header.gif) repeat-x left top;
}

@media screen and (max-width: 640px) {
	body {
		overflow-x: hidden;
	}
}

body#mainpage {
	background: url(../images/common/bg_header2.gif) repeat-x left top;
}

a:link,
a:visited {
	color: #176dcb;
	text-decoration: none;
}
a:hover,
a:active {
	color: #176dcb;
	text-decoration: underline;
}

.center {
	text-align:center;
}

.img-l {
	float:left;
}

.img-r {
	float:right;
}

img {
	max-width: 100%;
	height: auto;
}

@media screen and (max-width: 640px) {
	picture > img {
		width: 100%;
	}
}

/*************************************/
/********** header **********/
/*************************************/

#wrapper {
	width: 100%;
	text-align:left;
}

/**/

#header {
	margin:0 0 30px 0;
}

#header .siteDescription {
	background:#0b51a1;
	width:100%;
	min-width:990px;
}

#header .siteDescription h1 {
	width:980px;
	margin:0 auto 0;
	color:#fff;
	font-size:11px;
	line-height:18px;
}

@media screen and (max-width: 640px) {
	#header .siteDescription {
		min-width: 100%;
	}
	#header .siteDescription h1 {
		width: 100%;
	}
}

/**/

#header .wrapper {
	width:980px;
	margin:0 auto 0;
	}

#header .logo {
	float:left;
}

#header .wrapper p {
	float:left;
}

/* main-visual */

#header .main-visual {
	width:100%;
	background: url(../images/main_visual_bg.jpg) no-repeat top center #d8edfa;
	height:490px;
}

#header .main-visual .wrapper {
	width:980px;
	position:relative;
}

#header .main-visual .text-red {
	color:#ff4500;
	font-size:20px;
	font-weight:bold;
}

#header .main-visual .text01 {
	position: absolute;
	top:123px;
	left:0;
}

#header .main-visual .text02 {
	width:540px;
	position: absolute;
	top:300px;
	left:15px;
	font-size:20px;
	font-weight:bold;
	color:#007fd8;
}

#header .main-visual .text03 {
	width:375px;
	position: absolute;
	top:330px;
	left:25px;
	font-size:16px;
	line-height:24px;
}

#header .main-visual .text04 {
	width:370px;
	position: absolute;
	top:415px;
	left:25px;
	font-size:12px;
	line-height:16px;
	color:#0054a1;
}

@media screen and (max-width: 640px) {
	#header .wrapper {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#header .logo {
		width: 100%;
		text-align: center;
	}
	.header__info01,
	.header__info02 {
		width: 22%;
	}
	.header__info03 {
		width: 50%;
	}
	#header .main-visual {
		height: auto;
	}
	#header .main-visual .wrapper {
		width: 100%;
	}
}

/*************************************/
/********** main **********/
/*************************************/

#main {
	width: 100%;
	text-align: left;
}

.title01 {
	margin:0 0 20px 0;
}

/* trouble */

#trouble {
	width:980px;
	margin:0 auto 0;
}

#trouble > .wrapper {
	background: url(../images/trouble_bg.jpg) no-repeat left bottom #f5f5f5;
	width:940px;
	margin:0 auto 20px;
	padding:20px;
}

#trouble > .wrapper > .price {
	float:right;
	width:680px;
}

#trouble .trouble-stit {
	font-size:24px;
	line-height:32px;
	font-weight:bold;
	color:#007ec8;
	margin:0 0 10px 0;
}

#trouble .price td {
	width:290px;
	font-size:0.9em;
}

#trouble .price td.bder-r {
	border-right: dotted 1px #c3ced8;
}

#trouble .price td.bder-b {
	border-bottom: dotted 1px #c3ced8;
}

#trouble .price td.price-td01 {
	padding:5px 15px 0 15px;
}

#trouble .price td.price-td02 {
	padding:15px 15px 20px 15px;
}

#trouble .price td.price-td03 {
	padding:20px 15px 0 15px;
}

#trouble .price td.price-td04 {
	padding:20px 15px 5px 15px;
}

#trouble .btn-price-box {
	text-align:center;
}

#trouble .etc-price-text {
	font-size:15px;
	font-weight:bold;
	padding:5px 0 10px 0;
}

#trouble .text-red {
	color:#eb2222;
	font-size:19px;
}

#trouble .area-info-bg {
	background:url(../images/arw01.gif) no-repeat center bottom;
	height:125px;
	padding:10px 0 0 0;
}

#trouble .area-info-text {
	font-size:18px;
	line-height:34px;
	font-weight:bold;
}

#trouble .area-info-text > .text01 {
	font-size:24px;
}

#trouble .area-info-text > .text02 {
	font-size:26px;
	color:#e30000;
}

@media screen and (max-width: 640px) {
	#main {
		width: 90%;
		margin: 0 auto;
	}
	#trouble {
		width: 100%;
	}
	#trouble > .wrapper {
		width: 100%;
		background-image: none;
		padding: 0;
	}
	#trouble > .wrapper > .price {
		width: 100%;
	}
	#trouble .trouble-stit {
		font-size: 17px;
		line-height: 1em;
	}
	#trouble .text-red {
		font-size: 18px;
	}

	#trouble .area-info-bg {
		background-size: contain;
		height: auto;
	}

	#trouble .area-info-text {
		font-size:16px;
		line-height:1.5em;
	}
	
	#trouble .area-info-text > .text01 {
		font-size:18px;
	}
	
	#trouble .area-info-text > .text02 {
		font-size:20px;
	}
}

/**/

#reason {
	width:990px;
	margin:0 auto 0;
}

#reason h1 {
	text-align:center;
	margin-bottom:29px;
}

#reason > .wrapper {
	background: url(../images/reason_bg.gif) no-repeat left bottom;
	margin-bottom:25px;
}

#reason > .wrapper > .leftbox {
	float:left;
	width:324px;
	margin-right:9px
}

#reason > .wrapper > .centerbox {
	float:left;
	width:324px;
	margin-right:9px
}

#reason > .wrapper > .rightbox {
	float:left;
	width:324px;
}

#reason > .wrapper .leftboxinner,
#reason > .wrapper .centerboxinner,
#reason > .wrapper .rightboxinner {
	padding:10px 16px 20px;
}

#reason > .wrapper .leftboxinner span.blue-icon {
	color:#6fbeec;
}

#reason > .wrapper .txt12 {
	font-size:12px;
}

#reason .text-red {
	color:#e30000;
}

@media screen and (max-width: 640px) {
	#reason > .wrapper {
		background: none;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	#reason {
		width: 100%;
	}

	#reason > .wrapper > .leftbox {
		margin-right: 0;
		margin-bottom: 20px;
		box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	}
	
	#reason > .wrapper > .centerbox {
		margin-bottom: 20px;
		box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	}
	
	#reason > .wrapper > .rightbox {
		box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	}
}

/**/

#flow {
	width:980px;
	margin:0 auto 0;
}

#flow ol {
	list-style-type:none;
}

@media screen and (max-width: 640px) {
	#flow {
		width: 100%;
	}
}

/**/

#faq {
	width:980px;
	margin:0 auto 0;
}

#faq > .wrapper {
	background: url(../images/faq_bg.gif) no-repeat left bottom;
	margin-bottom:30px;
}

#faq dl.leftbox {
	float:left;
	width:470px;
}

#faq dl.rightbox {
	float:right;
	width:470px;
	margin-right:5px;
}

#faq dl {
	width:470px;
}

#faq dd {
	padding:10px 22px 35px 75px;
}

#faq dd ul {
	width:406px;
	margin:15px 0 10px -33px;
}

#faq dd ul li {
	float:left;
}

#faq dd ul li:first-child {
	margin-right:20px;
}

@media screen and (max-width: 640px) {
	#faq > .wrapper {
		background-image: none;
	}

	#faq {
		width: 100%;
	}
	#faq dl.leftbox {
		width: 100%;
		margin-bottom: 20px;
		box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
	}
	
	#faq dl.rightbox {
		margin-bottom: 20px;
		box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
		width: 100%;
	}

	#faq dd ul {
		width: 100%;
	}

	.faq__banner {
		display: flex;
		justify-content: space-between;
	}
}

/**/

#voice {
	width:980px;
	margin:0 auto 0;
}

#voice img {
	vertical-align:top !important;
}

.voice__content {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

@media screen and (max-width: 640px) {
	#voice {
		width: 100%;
	}

	.voice__content {
		display: block;
		padding: 20px 0;
	}
}

/**/

#company {
	width:980px;
	margin:0 auto 0;
	padding:0 0 25px;
	background:#ebf6fd;
}

#company .item-logo {
	text-align:center;
	padding:27px 0 17px 0;
}

#company > .wrapper {
	margin:0 30px 0;
	padding:30px 40px 70px 40px;
	background:#fff;
	border-top:solid 3px #0054a1;
}

#company > .wrapper > .inner {
	border-bottom:solid 1px #c3ced8;
	margin-bottom:25px;
	font-size:12px;
	line-height:20px;
}

#company > .wrapper h3 {
	font-size:16px;
	font-weight:bold;
	margin-bottom:5px;
}

#company > .wrapper > .inner > .leftbox {
	float:left;
	width:546px;
	border-right:solid 1px #c3ced8;
	padding-right:30px;
	padding-bottom:30px;
}

#company > .wrapper > .inner > .leftbox .leftboxinner {
	float:right;
	width:265px;
}

#company > .wrapper > .inner > .rightbox {
	float:right;
	width:233px;
	padding-bottom:30px;
	padding-left:30px;
}

#company .item-station {
	padding:0 0 0 0;
}

#company .item-station ul {
	float:left;
	width:33%;
}

.btn-company-info {
	text-align:center;
	margin-top:-56px;
}

@media screen and (max-width: 640px) {
	#company {
		width: 100%;
	}

	#company > .wrapper > .inner > .leftbox {
		width: 100%;
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		flex-wrap: wrap;
		flex-direction: column;
	}

	#company > .wrapper > .inner > .leftbox .leftboxinner {
		width: 100%;
	}
	.companyimg01 {
		width: 100%;
	}

	#company > .wrapper h3 {
		width: 100%;
	}

	#company > .wrapper > .inner > .rightbox {
		width: 100%;
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		flex-wrap: wrap;
		float: none;
		padding: 0;
		flex-direction: column;
	}


	.rightbox__txt {
		width: 100%;
	}
	.companyimg02 {
		width: 100%;
	}

	#company .item-station ul {
		display: flex;
		flex-direction: column;
		width: 100%;
	}
}

/* bnr */

.bnr_free_dial {
	background: url(../images/bnr_free_dial_bg.gif) repeat-x;
	width:100%;
	min-width:990px;
	height:348px;
}

.bnr_free_dial > .wrapper {
	width:980px;
	margin:0 auto 0;
}

@media screen and (max-width: 640px) {
	.bnr_free_dial {
		min-width: 100%;
		height: auto;
		margin: 0 calc(50% - 50vw);
		width: 100vw;
	}
	.bnr_free_dial > .wrapper {
		width: 100%;
	}
}

/*************************************/
/********** footer **********/
/*************************************/

#footer {
	width:100%;
	background:#;
}

#footer p {
	width:980px;
	text-align:center;
	margin:0 auto 0;
	font-size:14px;
	line-height:46px;
}

@media screen and (max-width: 640px) {
	#footer {
		width: 100%;
	}
	#footer p  {
		width: 100%;
	}
}

/*********************************/
/***** clearfix *****/
/*********************************/

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}


/*********************************/
/***** margin_padding *****/
/*********************************/

.mt00 { margin-top: 0;}
.mt05 { margin-top: 5px;}
.mt10 { margin-top: 10px;}
.mt15 { margin-top: 15px;}
.mt20 { margin-top: 20px;}
.mt25 { margin-top: 25px;}
.mt30 { margin-top: 30px;}
.mt40 { margin-top: 40px;}

.mb00 { margin-bottom: 0;}
.mb05 { margin-bottom: 5px;}
.mb10 { margin-bottom: 10px;}
.mb15 { margin-bottom: 15px;}
.mb20 { margin-bottom: 20px;}
.mb25 { margin-bottom: 25px;}
.mb30 { margin-bottom: 30px;}
.mb40 { margin-bottom: 40px;}
.mb50 { margin-bottom: 50px;}

.ml00 { margin-left: 0;}
.ml05 { margin-left: 5px;}
.ml10 { margin-left: 10px;}
.ml15 { margin-left: 15px;}
.ml20 { margin-left: 20px;}
.ml25 { margin-left: 25px;}
.ml30 { margin-left: 30px;}
.ml40 { margin-left: 40px;}

.mr00 { margin-right: 0;}
.mr05 { margin-right: 5px;}
.mr10 { margin-right: 10px;}
.mr15 { margin-right: 15px;}
.mr20 { margin-right: 20px;}
.mr25 { margin-right: 25px;}
.mr30 { margin-right: 30px;}
.mr40 { margin-right: 40px;}

.pt00 { padding-top: 0;}
.pt05 { padding-top: 5px;}
.pt10 { padding-top: 10px;}
.pt15 { padding-top: 15px;}
.pt20 { padding-top: 20px;}
.pt25 { padding-top: 25px;}
.pt30 { padding-top: 30px;}
.pt40 { padding-top: 40px;}

.pb00 { padding-bottom: 0;}
.pb05 { padding-bottom: 5px;}
.pb10 { padding-bottom: 10px;}
.pb15 { padding-bottom: 15px;}
.pb20 { padding-bottom: 20px;}
.pb25 { padding-bottom: 25px;}
.pb30 { padding-bottom: 30px;}
.pb40 { padding-bottom: 40px;}

.pl00 { padding-left: 0;}
.pl05 { padding-left: 5px;}
.pl10 { padding-left: 10px;}
.pl15 { padding-left: 15px;}
.pl20 { padding-left: 20px;}
.pl25 { padding-left: 25px;}
.pl30 { padding-left: 30px;}
.pl40 { padding-left: 40px;}

.pr00 { padding-right: 0;}
.pr05 { padding-right: 5px;}
.pr10 { padding-right: 10px;}
.pr15 { padding-right: 15px;}
.pr20 { padding-right: 20px;}
.pr25 { padding-right: 25px;}
.pr30 { padding-right: 30px;}
.pr40 { padding-right: 40px;}


/*********************************/
/***** text-align *****/
/*********************************/

.text-l {
	text-align: left;
}

.text-c {
	text-align: center;
}

.text-r {
	text-align: right;
}


/*********************************/
/***** vertical-align *****/
/*********************************/

.vertical-t {
	vertical-align: top;
}

.vertical-tt {
	vertical-align: text-top;
}

.vertical-m {
	vertical-align: middle;
}

.vertical-b {
	vertical-align: bottom;
}

.vertical-bl {
	vertical-align: baseline;
}


/*********************************/
/***** others *****/
/*********************************/

.clear {
	clear: both;
}

.float-l {
	float: left;
}

.float-r {
	float: right;
}

/*************************************/
/********** 画像ロールオーバー **********/
/*************************************/

.img-rollover a:hover img {
	opacity: .8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
	background: #fff;
}
.img-rollover input:hover {
	opacity: .8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
	background: #fff;
}


/*************************************/
/********** display **********/
/*************************************/
.disPC {
	display: block;
}

@media screen and (max-width: 640px) {
	.disPC {
		display: none;
	}
}