@charset "utf-8";
/* CSS Document */

body {
	text-align:center;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	margin: 0px;
	padding: 0px;
	color:#333333;
}

* ~~ エレメント / タグセレクター ~~ */
ul, ol, dl { /* ブラウザー間の相違により、リストの余白とマージンをゼロにすることをお勧めします。一貫性を保つために、量をここで指定するか、リストに含まれるリスト項目 (LI、DT、DD) で指定できます。より詳細なセレクターを記述しない限り、ここで指定する内容が .nav リストにも適用されることに注意してください。 */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin: 0;	
}



a img { /* このセレクターは、一部のブラウザーでイメージをリンクで囲んだ場合にイメージの周囲に表示される初期設定の青いボーダーを削除します。 */
	border: none;
	border-style:none;
}

img {
    border-style:none;
}

img.icon:hover{
    opacity: 0.7;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
}



/************************************************* HEADER ***/


header {
	min-height: 100%;
	background:url(../img/bg_ec.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	
}


		
.header_box {
	padding-top:5px;
	max-width:980px;
	width:100%;
	 margin:0 auto;
}

.headertop_left {
	width:60%;
	height:60px;
	text-align:left;
	float:left;
	margin-left:-10px;
	padding-top:5px;
}

.logo {
	float:left;
	margin-left:12px;
	margin-top:5px;	
}



.headertop_right {
	text-align:right;
	width:35%;
	height:60px;
	padding-top:5px;
	float:right;

}



ul.header_menu li{
	list-style:none;
	float:left;
	font-size:10px;
	padding:0 !important;
	margin:0 !important;
}

ul.header_menu li:hover{
	opacity:0.7;
}

.page_header{
	width:100%!important;
	height:75px!important;
	background-color:#fff!important;
	margin:auto;
}

.page_header h1{
	margin-top:5px;
	margin-left:15px;
	font-size:10px;
	font-weight:normal;
	line-height:1.2;
}


.pageheader_box{
	max-width:980px;
	width:100%;
	height:100px;
	margin:auto;
}



.space {
	height:270px;
	
}

.space_a{
	height:100px;
	
}







/************************************************* FOOTER ***/


.footer {
	overflow:hidden;
    margin:0 auto;
	padding:10px 0 !important;	
}

.footer_box {
	width:980px;

	height:250px;
	margin:0 auto;
}

.footer_menu {
	padding-top:20px;
	width:980px;
	margin:0 auto;
}


.footer #f_menu{
    margin:0 auto;
    padding:12px 0 12px;
    width:980px;
	height:30px;
}

.footer #f_menu li{
        display:inline;
        padding:0 10px 0 10px;
        font-size:12px;
        border-left:1px solid #FFF;
        color:#FFF;
		

    }


.footer #f_menu li:first-child{
        border-left:none;
        line-height:1;

    }
        
		
.footer #f_menu li a{
            color:#FFF;
        }
		
#footerarea_copyright {
	margin:  8px 0;
	font-size: 9px;
}
		
		
.footer #f_menu li a:hover{
            color:#9e8f6b;
        }


.footer_co {
	padding-top:30px;
	width:700px;
	margin:0 auto;
	height:200px;
}


.footer_co1 {
	float:left;
	width:180px;
	margin-top:10px;
}

.footer_co2 {
	float:left;
	width:250px;
	margin-top:10px;
}

.footer_co3 {
	margin-left:15px;
	float:left;
	font-size:11px;
	line-height: 1.5em;
	color:#000;
	width:255px;
	font-size-adjust:inherit;
	text-align:left;
}






/***************** 問合せボタン　20160317 ****************/
#contact{
	width:98%;
	display:inline-block;
	background:#333;
	color:#fff;
	padding:1%;
}

#contact a{
	text-decoration:none;
	color:#fff;
}



#btn_siryo {
	display:block;
	background:#ff6600;
	color: #fff;
	width:44%;
	float:left;
	padding:1%;
	text-align:center;
	
	font-size:150%;
	/* kakumaru */
	border-top-left-radius: 6px;     /* 左上 */
	border-top-right-radius: 6px;    /* 右上 */
	border-bottom-right-radius: 6px; /* 右下 */
	border-bottom-left-radius:6px;  /* 左下 */
	/* box-shadow */
	box-shadow:rgba(120, 120, 120, 0.639216) 2px 3px 2px 1px;
	-webkit-box-shadow:rgba(120, 120, 120, 0.639216) 2px 3px 2px 1px;
	-moz-box-shadow:rgba(120, 120, 120, 0.639216) 2px 3px 2px 1px;
	/* move-slow*/
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;

}

#btn_siryo:hover{
	box-shadow:none;
	margin-top:3px;
	margin-bottom:-3px;
	}
	
#btn_demo {
	display:block;
	background:#1473d1;
	color: #fff;
	width:44%;
	float:right;
	padding:1%;
	text-align:center;
	
	font-size:150%;
	/* kakumaru */
	border-top-left-radius: 6px;     /* 左上 */
	border-top-right-radius: 6px;    /* 右上 */
	border-bottom-right-radius: 6px; /* 右下 */
	border-bottom-left-radius:6px;  /* 左下 */
	/* box-shadow */
	box-shadow:rgba(120, 120, 120, 0.639216) 2px 3px 2px 1px;
	-webkit-box-shadow:rgba(120, 120, 120, 0.639216) 2px 3px 2px 1px;
	-moz-box-shadow:rgba(120, 120, 120, 0.639216) 2px 3px 2px 1px;
	/* move-slow*/
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;

}

#btn_demo:hover{
	box-shadow:none;
	margin-top:3px;
	margin-bottom:-3px;
	}



#contact p{
	font-size:24px;
	margin:20px 0;
	display:block;
}
#contact .big{
	font-size:160%;	
}

#contact .tel_area{
	clear:both;
	text-align:center;
	padding:30px 0;
}
#contact .tel_area p{
	font-size:16px;
	margin:0;
	padding:0;
	display:block;
}
#contact .tel_area .co_name{
	font-size:200%;
}
#contact .tel_area .co_tel{
	font-size:220%;
}
#contact .tel_area .co_telh{
	border-top:1px solid #ffffff;
	border-bottom:1px solid #ffffff;
	padding:5px 0;
	max-width:890px;
	width:100%;
	margin:0 auto;
}
#contact .tel_area .co_time{
	font-size:90%;
}



/****************************************************************MOT-EC******/

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


.margin_t20{
	margin-top:20px !important;
}

.blue_bg {
	max-width:850px;
	width:100%;
	margin:0 auto;
	background-color:#8ddaff;
	display:inline-block;
	padding:20px 20px 30px 20px;
}

header h2{
	padding-bottom:20px;
	color:#fff;
	text-align:center;
	font-size:32px;
	text-shadow: 2px 1px 2px #969696;  

}

.box33 { 
    width:28.9%;
	margin:0 1%;
	float:left;
	height:180px;
	padding:10px;
	background-color:#fff;
	/* kakumaru */
	border-top-left-radius: 6px;     /* 左上 */
	border-top-right-radius: 6px;    /* 右上 */
	border-bottom-right-radius: 6px; /* 右下 */
	border-bottom-left-radius:6px;  /* 左下 */
	  }

.box33 p{
	text-align:left;
	font-size:14px;
	line-height:1.5;
	padding:10px 15px 5px 15px;

}

.glay_bg{
	background-color:#B1E5FF;
	width:100%;
	padding:30px 0 50px 0;
	margin-bottom:-45px;
}

.content890 {
	width:890px;
	margin:0 auto;
}

.content890 h2{
	font-size:46px;
	text-align:center;
	color:#333333;
	margin:0 auto;

}

.box100 {
    width:100%;
	background-color:#fff;
	display:inline-block;
	/* kakumaru */
	border-top-left-radius: 10px;     /* 左上 */
	border-top-right-radius: 10px;    /* 右上 */
	border-bottom-right-radius: 10px; /* 右下 */
	border-bottom-left-radius:10px;  /* 左下 */
	  }

.boxleft{
	width:35%;
	float:left;
	padding:20px 1%; 

}


.boxright{
	width:60%;
	float:right;
	padding:20px 1%; 
	text-align:left;

	
}

.boxright p{
	text-align:left;
	font-size:18px;
	line-height:1.5;
}

.keikoupen{
  background: linear-gradient(transparent 90%, #ffff00 0%);
  font-size:120%;
  font-weight:bold;
}

.orange {
	color:#ff723a;
}

.bold {
	font-weight:bold;}


.br980{ display:none;}
.br880{ display:none;}
.br480{ display:none;}
.brclear780{ display:none;}
.boxright p.kome{ font-size:12px; line-height:1.2;}
img.main_sp {
	display:none;
}

@media screen and (max-width: 1080px) {
#contact dl dd a{
	font-size:24px;
}
#contact dl dt a{
	font-size:24px;
}
}


@media screen and (max-width: 980px) {
.br980{ display:block;}
.page_header h1{
	margin-top:2px;
	margin-left:15px;
	font-size:8px;
	font-weight:normal;
	line-height:1.2;
}
#contact dl dd a{
	font-size:20px;
}
#contact dl dt a{
	font-size:20px;
}
}
@media screen and (max-width: 890px) {
.br880{ display:block;}
.header_box {
	padding-top:5px;
	width:100%;
	 margin:0 auto;
}
header img{
	width: 100%;
}

.blue_bg {
	width:100%;
	margin:0 auto;
	background-color:#8ddaff;
	display:inline-block;
	padding:20px 0 30px 0;
}

.box33 { 
    width:29%;
	margin:0 1.5%;
	float:left;
	height:auto;
	padding:5px;
	background-color:#fff;
}

.content890 {
	width:100%;
	margin:0 auto;
}

.content890 h2{
	font-size:36px;
	text-align:center;
	color:#333333;
	margin:0 auto;

}



.box100 {
    width:90%;
	background-color:#fff;
	display:inline-block;
	margin:0 5%;
	  }
#contact .big{
	font-size:100%;	
}
img.main_pc {
	display:none;
}
img.main_sp {
	display:block;
}
#btn_area{
	width:90%;
	margin:0 auto;
}
}

@media screen and (max-width: 780px) {
.brclear780{ display:block;}
.blue_bg {
	width:100%;
	margin:0 auto;
	background-color:#8ddaff;
	display:inline-block;
	padding:20px 0 30px 0;
}

.boxleft img {
	width:100%;

}
.box33 { 
    width:29%;
	margin:0 1.1%;
	float:left;
	height:auto;
	padding:5px;
	background-color:#fff;
}

.headertop_left {
	width:50% ;
}


.headertop_right {
	width:50%;
	margin-top:10px;
}

.headertop_right img{
	width:100%;

}
.page_header h1{
	margin-top:2px;
	margin-left:15px;
	font-size:5px !important;
	font-weight:normal;
	line-height:1.2;
}

#contact dl dt a{
	width:60%;
	height:120px;
	line-height:120px;
	background:#ff6600;
	margin:0 auto;
	padding:0px 5%;
	clear:left;
	text-align:center;
	display:inline-block;
	font-size:20px;
	color:#fff;
	text-decoration:none;

}

#contact dl dd a{
	width:60%;
	height:120px;
	line-height:120px;
	background:#1473d1;
	margin:0 auto;
	margin-top:20px;
	padding:0px 5%;
	clear:right;
	text-align:center;
	display:inline-block;
	font-size:20px;
	color:#fff;
	text-decoration:none;
}

.boxright p{
	text-align:left;
	font-size:14px;
	line-height:1.5;
}
.boxright p.kome{ font-size:12p; line-height:1.2;}

header h2{
	font-size:30px;
}
.content890 h2{
	font-size:30px;
}
#btn_siryo p{ font-size:20px !important;}
#btn_demo p{ font-size:20px !important;}
}


@media screen and (max-width: 520px) {
.br480{ display:block;}
img.logo {
	width:40%;
}

header img{
	margin-top:-20px;
}
#contact dl{

	width:100%;

}
#contact dl dt a{
	width:100%;
	height:120px;
	line-height:120px;
	background:#ff6600;
	margin:0 auto;
	padding:0px 5%;
	clear:left;
	text-align:center;
	display:inline-block;
	font-size:20px;
	color:#fff;
	text-decoration:none;

}

#contact dl dd a{
	width:100%;
	height:120px;
	line-height:120px;
	background:#1473d1;
	margin:0 auto;
	margin-top:20px;
	padding:0px 5%;
	clear:right;
	text-align:center;
	display:inline-block;
	font-size:20px;
	color:#fff;
	text-decoration:none;
}	
.box33 { 
    width:85%;
	margin:10px 7%;
	float:left;
	height:auto;
	padding:5px;
	background-color:#fff;
}

.box33 img{
	width:60%;
	margin:0 20%;
}
.glay_bg{
	width:100%;
	padding:30px 0 50px 0;
	margin-bottom:-45px;
}
.box100 {
    width:90%;
	background-color:#fff;
	display:inline-block;
	margin:0 auto;
	padding:0;
	  }
	  
.boxleft{
	width:98%;
	clear:left;
	padding:1%;
	margin-top:20px;	
}

.boxleft img{
	width:70%;
	margin:0 15%;
}

.boxright{
	width:98%;
	clear:right;
	padding:1%;
	margin-bottom:20px;
}

.boxright p
{
	
	padding:0 30px;
	text-align:center;
	font-size:14px;
	line-height:1.5;
}

.boxright p.kome{ font-size:12px; line-height:1.2; padding-left:20px; text-align:center;}
header h2{font-size:26px;}
.content890 h2{font-size:26px;}
}

@media screen and (max-width: 360px) {
header h2{font-size:20px; }
.content890 h2{font-size:20px; }
#contact .tel_area p{font-size:13px;}
#btn_siryo p{ font-size:16px !important;}
#btn_demo p{ font-size:16px !important;}
}