@import url("https://fonts.googleapis.com/earlyaccess/sawarabimincho.css");
@import url("https://fonts.googleapis.com/earlyaccess/sawarabigothic.css");

*{
	box-sizing: border-box;
}

.warpper-line-blue{ padding: 22px 0 0;}

.intro{ padding:18px 63px 18px 18px; position: relative; }
.intro strong{ color:#2162d8; font-size: 26px; font-weight: normal; font-family: "Sawarabi Mincho"; display: block; text-align:  center; }
.intro strong span{font-size: 37px;}
.intro .man { position: absolute; right: 0; bottom: -40px; } 
@media(max-width:480px){
	.intro .man { bottom: -100px; width: 80px; } 
  }

.warrper-blue{background: #e4f7fe;}
.top-line{background: url(../images/curve-bottom.png) repeat-x top; height: 30px;}
.footer-line{background: url(../images/curve-top.png) repeat-x bottom; margin: 0 0 20px; height: 30px;}

/* maintenance content */
.content-maintenance { width: 100%; padding-right: 60px; padding-bottom: 65px;  }
.maintenance { display: block; background: url(../images/bg-dot.png); padding-bottom: 6px; padding-right: 6px; margin-top: 65px; }
.maintenance .bg-white { background: #fff; display: flex; flex-wrap: wrap; }
.text-maintenance { display: block; padding: 12px 0 12px 12px; width: 68%; }
.title-maintenance  { position: relative; font-size: 20px; font-weight: bold; padding: 12px 8px 12px 60px; text-align: center; }
.title-maintenance .number { position: absolute; left: 0; top: -15px; }
.text-maintenance p { font-size: 16px; line-height: 1.8; padding: 12px; }
.images-maintenance { display: block; width: 32%; }
.images-maintenance img { max-width: 100%; height: auto; position: relative; top: 35px; right: -60px; }

.line-yellow { display: block; width: 100%; height: 5px; background: url(../images/line-yellow.png) repeat-x; }
/* .line-blue { display: block; width: 100%; height: 5px; background: url(../images/line-blue.png) repeat-x; } */


.box-contact{ display:table; width: 100%; text-align: center;}
.box-contact a{ color: #fff;}
.box-contact .tel{ background: url(../images/pattern-tile-darkblue.png); width: 50%; display: table-cell; padding: 15px;}
.box-contact .tel span{ display: inline-block; width: 200px; vertical-align: middle; font-size: 24px; font-weight: bold;}
.box-contact .tel small{ display: block; font-size: 12px; font-weight: normal;}
.box-contact .mail{ background: url(../images/pattern-tile-blue.png); width: 50%; display: table-cell; padding: 15px;}
.box-contact .mail span{ display: inline-block; width: 60%; vertical-align: middle; font-size: 22px; font-weight: bold;}
@media(max-width:1273px){
	.box-contact{ display: none;}
  }
@media(max-width:768px){
	.box-contact .mail span{ font-size: 18px;  width: 80% !important;}
}

@media(max-width:767px) {
	.content-maintenance { padding-right: 0; }
	.title-maintenance { font-size: 18px; }
	.images-maintenance { padding: 12px 8px; }
	.images-maintenance img { right: 0; top: 25px; }
}

@media(max-width:620px) {
	.text-maintenance { padding: 12px; width: 100%; }
	.images-maintenance { width: 100%; padding: 0 12px 12px; text-align: center; }
	.images-maintenance img { top: 0; }
}

@media(max-width:580px){
	.intro strong { font-size: 20px; }
	.intro strong span { font-size: 30px; }

	.box-contact{ display: block;}
	.box-contact .tel, .box-contact .mail{ display: none; width: 100%;}

	.title-maintenance { font-size: 16px; }
	.text-maintenance p { font-size: 14px; }
}