@charset "utf-8";

/*******************************************************************************
 *      
 *  Web Site Title  : 
 *  File      : design.css
 *
 *******************************************************************************/


* {
	margin: 0;
}
html, body {
	height: 100%;
}



body {
	padding:  0;
	font:15px/1.4 "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック",Helvetica, Arial, sans-serif;
	text-align:center;
	background-color: #e3e4e5;
	text-align:center;
	color: #333333;
}

.bgswitch{
	padding-top: 18px; 
	width: 100%;
	height: auto; 
	/* overflow:scroll; */
	background-repeat: no-repeat;
	background-size:  auto 100%;
	background-attachment: fixed;	
	z-index: -1;

}


.wrapper{ width: 960px; margin: 0 auto; position:relative; text-align: left; }

.wrapper.page{ margin-bottom: 60px; }

/*//========テンプレート========================================================================================/*/

/*///////////ヘッダー //////////////////////////////////////////////////*/

#header{
	width: 100%;
	height: 65px;
	background-image: url(../img/bg_header.png);
	background-repeat: no-repeat;
	background-position: center center;
	position: relative;
	z-index: 100;
	 
	}

a#logo{ display: inline-block; margin: 10px 0 0 52px;  float: left; }



#header ul{ float: right; }
#header li{
	float:left;
	font-family: "Century Gothic", Arial;
	font-size: 18px;
	font-weight: bold;
	vertical-align: middle;
	letter-spacing: 0.1em;
} 
#header li, #header li a{ display:inline-block;   height: 58px;  color: #2908FC; }
#header li a{
	padding: 7px 1.8rem 0 1.8rem;
	background-image: url(../img/bg_white.gif);
	background-repeat: no-repeat;
	background-position: center -70px;

	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all  0.2s ease;
	
	}
#header li a:hover, #header li a.active{
	color: #3EACFD;
	background-position: center bottom;	

} 
#header li a span { display:block;  font-size: 12px; color: #333333; font-weight: normal; letter-spacing: 0; }

/*///////////メインナビゲーション//////////////////////////////////////////////////*/


/*--サービスメニュー--*/
#serviceList{ }
#serviceList ul{ }
#serviceList li{}
#serviceList li{ width: 31%; letter-spacing: 0.1em;}
#a1{ background-image: url(../img_top/btn_a1.jpg);}
#a2{ background-image: url(../img_top/btn_a2.jpg);}
#a3{ background-image: url(../img_top/btn_a3.jpg);}
#a4{ background-image: url(../img_top/btn_a4.jpg);}
#a5{ background-image: url(../img_top/btn_a5.jpg);}
#a6{ background-image: url(../img_top/btn_a6.jpg);}

#serviceList li a p{ background-image: url(../img_top/arw1.png); color: #fff;}

/*--実績メニュー--*/

#resultList{}
#resultList ul{}
#resultList li{ }
#resultList li{ width: 48%; letter-spacing: 0.5em; }

#b1{ background-image: url(../img_top/btn_b1.jpg);}
#b2{ background-image: url(../img_top/btn_b2.jpg);}
#b3{ background-image: url(../img_top/btn_b3.jpg);}
#b4{ background-image: url(../img_top/btn_b4.jpg);}

#resultList li a p{  background-image: url(../img_top/arw2.png); color: #333333;}

/*--共通スタイルー--*/

.menuList{  margin-top: 40px; margin-left: 2%; position:relative; z-index: 10; }
h2{ clear:both; }
.menuList ul{ margin-top: 12px; }
.menuList li{ float:left;  margin-right: 2%;  margin-bottom:  2%; background-color: #fff; line-height: 108px;   }
.menuList li a{ 
display: block;  width: 100%; height: 108px; 
background-repeat: no-repeat!important;
background-position: right top;  font-size: 18px; text-indent: 1em; } 

 .menuList li a span{
	background-image: url(../img/yajirusi2.png);
	background-repeat: no-repeat;
	background-position: right center;
	padding-right: 20px; 
	position: relative;	
	
   -webkit-transition:padding-right 0.4s ease;
    -moz-transition: padding-right 0.4s ease;
    -o-transition: padding-right 0.4s ease;
    transition: padding-right  0.4s ease;
	
} 
 .menuList li a:hover span{ 
	
 }

.iconPdf{
	position:absolute;
	top: -10px;
	left: 120px; 
} 
 .menuList li a p{
 	margin-top: 0!important;
	line-height: 108px!important; 
 	display:block; 
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: -30% top;

   -webkit-transition: background-position 0.2s ease;
    -moz-transition: background-position 0.2s ease;
    -o-transition: background-position 0.2s ease;
    transition: background-position  0.2s ease;
		
}
 .menuList li a:hover p{ background-position: -1% top; }



/*///////////フッター部 //////////////////////////////////////////////////*/

#bottomFixed{
	padding-top: 40px;
}

#footer{
	padding: 8px 0; 
	width: 100%; 
	background-color: #f3f4f4; 
	
	}
address, #contact{  display: block; width: 960px; margin: 12px auto 0 auto; text-align: left;}

a#logo2{ float: left; margin-right: 12px; border: solid 1px #CCCCCC; }
address .p1{ font-size: 14px; font-weight: bold; border-bottom: none; text-shadow: none; color: #333333;} 
address .p2{ font-size: 18px; font-weight: bold; letter-spacing: 0.1em;} 
address .p3{ font-size: 13px;  } 

#contact{   margin-top: 24px;  overflow: hidden; } 
#contact img{  } 
img#tel{  float: left; }
img#fax{  float: left; margin-left: 16px; }
a#inqBtn img{ border: solid 1px #999999; float: right;}

#pageBottom{
	margin-top: 40px; 
	border-top: solid 1px #333333; 
	background-color:#81859E;
	font-size: 12px; 
	line-height: 3;
	 overflow:hidden;
	
}
#pageBottom p{
	float:left;
	color: #444158;
	font-family:"Courier New", Courier, mono;
}
#pageBottom a{
	margin-right: 80px; 
	float: right;
	color: #fff;
	background-image: url(../img/pointer.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 12px; 
}

a#goTop{
	display:inline-block;
	float: none;
	width: 40px;
	height: 3em;
	position: absolute;
	top:0;
	right: 0;
	margin: 0;
	background-color: #444158;
	background-image: border: none;
	background-image: url(../img/yajirusi3.png);
	background-repeat: no-repeat;
	background-position: center center;
	text-indent: -9999px; 
}
a:hover#goTop{
	background-color:#2C2E52;
}

/*--コンテンツ-------------------------------------------------------------------*/

.page h1{ width: 100%; height: 140px; margin: 1em auto 0 auto; background-color: #2908FC;  text-align: center;font-weight: normal; }
.page h1 img{ margin:0; }
.page h1 p{ color: #fff; font-size: 32px; font-family: "Century Gothic", Arial, Helvetica; line-height: 0.25em; line-height: 1.4; margin-top: 0!important;  } 
.page h1 span{ color: #c1c1f4; font-size: 14px; display: block;  line-height: 1; }

#mainContents{
	padding: 1.5em 1em;
	margin: 0 auto 28px auto;
	position: relative;
	text-align: left;
	background-image: url(../img/bg_box1.png);
	background-repeat: repeat;
}


ul.subNavi{ width: 100%; text-align:center; margin: 2rem auto;}
ul.subNavi li{
	display:inline-block;
	margin-left: 1.5em;
	padding-right: 2em;
	background-image: url(../img/slash.png);
	background-repeat: no-repeat;
	background-position: right center;
}
ul.subNavi li a{ color: #333333;}
ul.subNavi li a:hover{ border-bottom: dotted 1px #2908FC;}

#mainContents h2{
	margin-top: 1.5rem;
	color: #2908fc;
	font-size: 1.35rem;
	background-image: url(../img/h2_icon.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 1.5rem;
	letter-spacing: 0.15rem;

}

#mainContents h3{
	margin-top:0.75rem;
	font-size: 1rem;
}
#mainContents p{ line-height: 1.6; margin-top: 0.5em;}

/*///////////TOPページ部品 //////////////////////////////////////////////////*/

/*---カバーエリア--------------------------*/

#cover{ }




/*//========共通部品 ========================================================================================/*/


/*---配置・レイアウト-----------------------------------------------*/

.fl-l{ float: left;}
.fl-r{ float:right;}
.centering{ width: 100%; text-align:center;}
.cb{ clear:both;} 
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

/*--要素を縦にセンタリング--*/
.vCenter {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

/*---見出し---------------------------------------------------------*/


/*---テキストスタイル-----------------------------------------------*/


.p1{
	font-size: 1.05rem;
	color:#0033FF;
	border-bottom: solid 1px #0033ff;
	text-shadow: 1px 1px 2px #666;}

.ib1{
	font-size: 15px; 
	font-weight: normal;
	display:inline-block;
	background-color: #F0FCFF;
	border: solid 1px #0066CC;
	padding: 0 0.5rem;
	margin: 0 1rem;
	color: #0066CC;
	border-radius: 3px;
}

.ib2{
	display:inline-block;
	background-color: #fff;
	border: 1px solid #9EA2A7;
	padding: 0 0.5rem;
	color: #61656;
	border-radius: 3px;
	line-height: 1.85em!important;
}

.cation1{ color: #FF0000;}
.small-text{  font-size: 0.75rem; color: #666666; }

/*---リンクボタン----------------------------------------------------*/


/*---画像スタイル-----------------------------------------------*/
	

/*---リストスタイル--------------------------------------------------*/

/*dl1,ul1*/

dl.dl1, ul.ul1{ overflow: hidden; }
dl.dl1 dt, ul.ul1 li{ clear:both; float:left; width:40%; }
dl.dl1 dt, ul.ul1 li, dl.dl1 dd{ margin-bottom: 0.5em;   } 
dl.dl1 dd{ float:left;   }

/*dl2,ul2*/

dl.dl2, ul.ul2{ margin: 20px ;  overflow: hidden; width: 100%;}
dl.dl2 dt, ul.ul2 li{ clear:both; float:left; width:20%; text-align:right; padding-right: 5%!important; }
dl.dl2 dt,  dl.dl2 dd, ul.ul2 li{ margin-bottom: 0.5em;  border-bottom: solid 1px #999999;  padding: 0.5em 0; } 
dl.dl2 dd{ float:left; width:70%;  }

/*dl3,ul3*/

dl.dl3, ul.ul3{}
dl.dl3 dt, ul.ul3 li{}



/*---テーブルスタイル----------------------------------------------*/

/*tb1*/
/*tb1*/
table.tb1{ 
	margin: 0 2% 28px;
	width: 96%;
	border: solid 1px #CCCCCC; font-size: 14px; border-spacing : 6px;
        border-collapse : separate ;  }
table.tb1 caption{}
table.tb1 tr{}
table.tb1 th, table.tb1 td{ padding: 6px 12px; }
table.tb1 th{ background-color: #C1C1F4; text-align:center; letter-spacing: 0.2em;}
table.tb1 td{
	border-bottom: solid 1px #CCCCCC;
	background-color: #F7F7F7;
}
table.tb1 tr:last-child td{ border-bottom: none; } 



/*tb2*/
table.tb2{
	margin: 30px auto;
	line-height: 1.8;
	width: 90%;

	}

table.tb2 tbody{
	padding: 0 10px;


}

table.tb2 th, table.tb2 td{
	padding: 14px;
	border-bottom: solid 1px #CEE2F9;
}
table.tb2 tr:last-child th, table.tb2 tr:last-child td{
  border-bottom: none;
}


table.tb2 th{
	text-align: center;
	font-weight: bold;
	color:  #1B4970;
	width: 25%;
}

table.tb2 td{}


/*tb3*/
table.tb3{}
table.tb3 caption{}
table.tb3 tr{}
table.tb3 th{}
table.tb3 td{}



/*--フォーム関連--------------------------------------------------------------------*/

/*--フォーム部品--*/

input, textarea, select{
	margin: 0 8px 8px 0;
	padding: 4px;
	border: 1px solid #5183A8;
	background-color:  #fff;
}
input:focus, textarea:focus, select:focus{
	border: 2px solid #1CB7DD;
	background-color:  #fff;
}


input.form-btn{
	border: none;
	border-radius: 6px;
	background-color: #1759AF;
	font-size: 18px; 
	color: #fff;
	padding: 12px 24px;
	font-family: "メイリオ";
}
input.form-btn:hover{
	background-color: #00ABE9;
}
input.form-btn:focus{
	background-color: #0080B0;
}



/*---ブロックスタイル--------------------------------------*/
.block1{ }

/*---幅・高さ-----------------------------------------------------*/

.wd01{}
.ht01{}

/*---幅・高さ-----------------------------------------------------*/

.wd01{ width: 4px; }
.wd02{ width: 8px;}
.wd03{ width: 12px;}
.wd04{ width: 16px; }
.wd05{ width: 20px;}
.wd06{ width: 24px;}
.wd07{ width: 28px; }
.wd08{ width: 32px; } 
.wd09{ width: 36px;}
.wd10{ width: 40px;}

.wd11{ width: 44px; }
.wd12{ width: 48px;}
.wd13{ width: 52px;}
.wd14{ width: 56px; }
.wd15{ width: 60px;}
.wd16{ width: 64px;}
.wd17{ width: 68px; }
.wd18{ width: 72px; } 
.wd19{ width: 76px;}
.wd20{ width: 80px;}

.wd21{ width: 84px;}
.wd22{ width: 88px;}
.wd23{ width: 92px;}
.wd24{ width: 96px;}
.wd25{ width: 100px;}
.wd26{ width: 104px;}
.wd27{ width: 108px;}
.wd28{ width: 112px;}
.wd29{ width: 116px;}
.wd30{ width: 120px;}


.wd40{ width: 160px;}

.wd41{ width: 164px;}
.wd42{ width: 168px;}
.wd43{ width: 172px;}
.wd44{ width: 176px;}
.wd45{ width: 180px;}

.wd50{ width: 200px;}

.wd60{ width: 240px;}

.wd70{ width: 280px;}

.wd80{ width: 320px;}

.wd90{ width: 360px;}

.wd100{ width: 400px;}

.wd110{ width: 440px;}

.wd120{ width: 480px;}

.wd130{ width: 520px;}

.wd140{ width: 560px;}

.wd150{ width: 600px;}

.wd160{ width: 640px;}

.wd170{ width: 680px;}

.wd180{ width: 720px;}

.wd180{ width: 760px;}

.wd200{ width: 800px;}

/*高さ*/
.ht70{ height: 280px;}

/*---マージン・パディング-(4px単位)---------------------*/

.mg1{ margin: 4px; }
.mg2{ margin: 8px; }
.mg3{ margin: 12px;}
.mg4{ margin: 16px; }
.mg5{ margin: 20px; }
.mg6{ margin: 24px; }
.mg7{ margin: 28px; }
.mg8{ margin: 32px;}
.mg9{ margin: 36px;}
.mg10{ margin: 40px;}


.mgT1{ margin-top: 4px; }
.mgT2{ margin-top: 8px;}
.mgT3{ margin-top: 12px;}
.mgT4{ margin-top: 16px;}
.mgT5{ margin-top: 20px;}
.mgT6{ margin-top: 24px;}
.mgT7{ margin-top: 28px;}
.mgT8{ margin-top: 32px;}
.mgT9{ margin-top: 36px;}
.mgT10{ margin-top: 40px;}
.mgT20{ margin-top: 80px;}
.mgT30{ margin-top: 120px;}
.mgT40{ margin-top: 160px;}
.mgT50{ margin-top: 200px;}
.mgT60{ margin-top: 240px;}
.mgT70{ margin-top: 280px;}

.mgB1{ margin-bottom: 4px; }
.mgB2{ margin-bottom: 8px;}
.mgB3{ margin-bottom: 12px;}
.mgB4{ margin-bottom: 16px;}
.mgB5{ margin-bottom: 20px;}
.mgB6{ margin-bottom: 24px;}
.mgB7{ margin-bottom: 28px;}
.mgB8{ margin-bottom: 32px;}
.mgB9{ margin-bottom: 36px;}
.mgB10{ margin-bottom: 40px;}


.mgR1{ margin-right: 4px;}
.mgR2{ margin-right: 8px;}
.mgR3{ margin-right: 12px;}
.mgR4{ margin-right: 16px;}
.mgR5{ margin-right: 20px;}
.mgR6{ margin-right: 24px;}
.mgR7{ margin-right: 28px;}
.mgR8{ margin-right: 32px;}
.mgR9{ margin-right: 36px;}
.mgR10{ margin-right: 40px;}


.mgL1{ margin-left: 4px; }
.mgL2{ margin-left: 8px;}
.mgL3{ margin-left: 12px; }
.mgL4{ margin-left: 16px; }
.mgL5{ margin-left: 20px;}
.mgL6{ margin-left: 24px;}
.mgL7{ margin-left: 28px;}
.mgL8{ margin-left: 32px;}
.mgL9{ margin-left: 36px;}
.mgL10{ margin-left: 40px;}


/*--パディング--*/


.pd1{ padding:　4px; }
.pd2{ padding: 8px;}
.pd3{ padding: 12px;}
.pd4{ padding: 16px;}
.pd5{ padding: 20px;}
.pd6{ padding: 24px;}
.pd7{ padding: 28px;}
.pd8{ padding: 32px;}
.pd9{ padding: 36px;}
.pd10{ padding: 40px;}


.pdT1{ padding-top: 4px;}
.pdT2{ padding-top: 8px;}
.pdT3{ padding-top: 12px;}
.pdT4{ padding-top: 16px;}
.pdT5{ padding-top: 20px;}
.pdT6{ padding-top: 24px;}
.pdT7{ padding-top: 28px;}
.pdT8{ padding-top: 32px;}
.pdT9{ padding-top: 36px}
.pdT10{ padding-top: 40px;}

.pdB1{ padding-bottom: 4px;}
.pdB2{ padding-bottom: 8px;}
.pdB3{ padding-bottom: 12px;}
.pdB4{ padding-bottom: 16px;}
.pdB5{ padding-bottom: 20px;}
.pdB6{ padding-bottom: 24px;}
.pdB7{ padding-bottom: 28px;}
.pdB8{ padding-bottom: 32px;}
.pdB9{ padding-bottom: 36px}
.pdB10{ padding-bottom: 40px;}


.pdR1{ padding-right: 4px;}
.pdR2{ padding-right: 8px;}
.pdR3{ padding-right:12px;}
.pdR4{ padding-right: 16px;}
.pdR5{ padding-right: 20px;}
.pdR6{ padding-right: 24px;}
.pdR7{ padding-right: 28px;}
.pdR8{ padding-right: 32px;}
.pdR9{ padding-right: 36px;}
.pdR10{ padding-right: 40px;}


.pdL1{ padding-left: 4px;}
.pdL2{ padding-left: 8px;}
.pdL3{ padding-left: 12px;}
.pdL4{ padding-left: 16px;}
.pdL5{ padding-left: 20px;}
.pdL6{ padding-left: 24px;}
.pdL7{ padding-left: 28px;}
.pdL8{ padding-left: 32px;}
.pdL9{ padding-left: 36px;}
.pdL10{ padding-left: 40px;}




/*//====各ページスタイル========================================================================================/*/

/*---会社案内--------------------------------------*/

.place1{ float:left; clear: both; width: 30%;}
.place2{ float:right; margin-bottom: 16px;}


/*---サービス案内--------------------------------------*/

img.photo1{ margin: 1em 0;   float:right }

/*---採用情報--------------------------------------*/

.frame2{ clear:both; margin: 1em 0;   float:left;   position:relative; }
img.tape{ position: absolute; top: -14px; left:42px; }
img.photo{ box-shadow: 2px 2px 0 #ccc;}

.box1{ float: right;  width: 680px; }