@charset "utf-8";
/* @import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css); */
@import url(https://fonts.googleapis.com/css?family=Bad+Script);

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

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_

全デバイス共通のスタイルとスマートフォンおよび小型タブレット向けレイアウトの指定

/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

/*==========================================
 body
==========================================*/
body {
	width: 100%;
	min-width: 320px;
	background-color: #fff;
	/* background-color: #e5e5e5; */
	font-family:"Courier New", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #373737;
	/* font-size: 15px; */
	font-size: 16px;
	line-height: 1.5em;
	/* overflow-x: scroll; */
	/* background-color: #e5e5e5; */
	background-image: url(../img/bg.gif);
	background-attachment: fixed;
	/* background-size: cover; */
	background-size: 100%;
	background-repeat:no-repeat;
}
body {
	-webkit-print-color-adjust: exact;
}


a {
	color: #373737;
	text-decoration: none;

}
a:hover {
	/* text-decoration: underline; */
}

/* a, a:hover {
	-o-transition: color 0.25s ease-in;
	-webkit-transition: color 0.25s ease-in;
	-moz-transition: color 0.25s ease-in;
	transition: color 0.25s ease-in;
}
 */

img {
	max-width: 100%;
	heigth: auto;
	display: block;
}

.tr {
	text-decoration: none;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	-ms-transition: 0.4s;
	transition: 0.4s;
}
.hover_img:hover{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
a img:hover{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
a img {
	text-decoration: none;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	-ms-transition: 0.4s;
	transition: 0.4s;	
}
ul {
	list-style-type: none;	
}
h1,h2,h3,h4,h5,h6 {
	margin: 0px;
	font-weight: normal;
	font-size: auto;
	/* line-height: normal; */
}
.eng {
	font-family: 'Bad Script', cursive;
	/* font-style: italic; */
	/* color: #7d7d7d; */
	color: #6886aa;
}
.noto {
    font-family: 'Noto Sans Japanese';
}

.thin {
    font-weight: 100;
}

.light {
    font-weight: 200;
}

.demi-light {
    font-weight: 300;
}

.regular {
    font-weight: 400;
}

.medium {
    font-weight: 500;
}

.bold {
    font-weight: 700;
}

.black {
    font-weight: 900;
}

/* cite,  */address {
	font-style: normal;	
}

html {
  font-size: 62.5%; /* sets the base font to 10px for easier math */
}
@media screen and (min-width: 1280px) {
  html {
    font-size: 100%;
  }
}


.sp_only {
	display: inline;
}
.pc_only {
	display: none;	
}

.btn {
	display: block;
	padding: 15px;
	margin: 10px 0;
	background-color: #1f3c5e;
	color: #fff;
	-moz-border-radius: 5px;    /* 古いFirefox */
	-webkit-border-radius: 5px; /* 古いSafari,Chrome */
	border-radius: 5px;         /* CSS3 */
	max-width: 300px;
	text-align: center;
}
.btn:hover {
	background-color: #e3e3e3;
	color: #7f7f7f;
}



.mintyou {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;	
}









/*==========================================
 ヘッダーのスタイル
==========================================*/

header {
	width: 100%;
	height: auto;
}

div#title {
	margin: 5px 10px 0 7px;	
}

div#title #name {
	width: 100%;	
}
div#title #name img#ifl {
	float: left;
	width: 19%;
	max-width: 70px;
}
div#title #name #name_right {
	float: left;
	width: 79%;
	margin-top: 3px;
	margin-left: 5px;
	line-height: 1.8;
}

div#title #name #name_right p {
	font-size: 12px;
}

div#title #contact {
	width: 100%;
	margin-top: 3px;
}
div#title #contact img#contact_tel {
	float: left;
	width: 52%;
	max-width: 250px;
	margin-left: 1%;
}
div#title #contact a#contact_mail {
	float: right;
	width: 43%;
	font-size: 12px;
	line-height: 1.5;
	padding-top: 5px;
	padding-bottom: 2px;
	display: block;
	text-align: center;
	background-color: #fff;
	-moz-border-radius: 5px;    /* 古いFirefox */
	-webkit-border-radius: 5px; /* 古いSafari,Chrome */
	border-radius: 5px;         /* CSS3 */
	/* box-shadow */
	box-shadow:rgba(204, 204, 204, 0.37) 0px 0px 2px 2px;
	-webkit-box-shadow:rgba(204, 204, 204, 0.37) 0px 0px 2px 2px;
	-moz-box-shadow:rgba(204, 204, 204, 0.37) 0px 0px 2px 2px;
	margin-top: 3px;
}
div#title #contact a#contact_mail:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}

div#meanmenu {
	margin-top: 9px;	
}

/*==========================================
 コンテンツエリア ->共通のスタイル
==========================================*/
div#contents {
	width: 100% auto;
	padding: 10px;
	background-color: rgba(255,255,255,0.8);
}
div#contents_service {
	width: 100% auto;
	padding: 10px;
	background-color: rgba(255,255,255,0.8);
}


div#box {
	width: 100% auto;
	/* margin-top: 15px; */
	/* background: #9FC; */
}


div#box_art {
	
}
p.box_art_w {
	margin-top: 10px;	
}

div#box_btn {
	margin-top: 15px;
}
div#box_btn ul li {
	width: 33.3%;
	float: left;
}

/*==========================================
 コンテンツエリア -> ★★★のスタイル
==========================================*/



/*==========================================
 ページトップへボタンのスタイル
==========================================*/
a#pagetopBtn img {
	position: fixed;
	bottom: 10px;
	right: 1px;
}


/*==========================================
 フッターのスタイル
==========================================*/

footer {
	width: 100% auto;
	margin-top: 30px;
	padding: 30px 10px 60px 10px;
	/* background: #f3f2f1; */
	background: #e5e5e5;
	font-size: 14px;
}
div#footer_company {
	max-width: 980px;
	margin: auto;
}
address a {
	text-decoration: underline;
}
address a:hover {
	text-decoration: none;
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

div#link_pp {
	margin-top: 30px;
	text-align: center;
}
div#link_pp ul li {
	display: inline-block;	
}
div#link_pp ul li a {
	padding: 3px 4px 1px 4px;
	border: 1px solid #777;
	-moz-border-radius: 5px;    /* 古いFirefox */
	-webkit-border-radius: 5px; /* 古いSafari,Chrome */
	border-radius: 5px;         /* CSS3 */
}
div#link_pp ul li a:hover {
	background: #777;
	color: #fff;
}

/*==========================================
 中ページの共通スタイル
==========================================*/
div#contents h2 , div#contents_service h2 {
	font-size: 20px;
	font-weight: bold;
	color: #666;
	border-bottom: 2px solid #666;
	padding-bottom: 6px;
	margin-top: 10px;
	margin-bottom: 20px;
}
div#contents p , div#contents_service p {
	margin-bottom: 20px;
}


/*==========================================
 （中ページ）経営理念ページのスタイル
==========================================*/
p#ps_text {
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
		font-size: 17px;
		line-height: 1.5em;
}
div#ps {
	/* text-align: center; */
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	border-top: 1px solid #ccc;
	padding-top: 30px;
}
div#ps img {
	margin: auto;
}

div#ps h3 {
	font-size: 23px;
	font-weight: bold;
	margin-top: 25px;
}
div#ps p {
	margin-top: 25px;
	font-size: 15px;
	line-height: 2.0;
	text-align: left;
}


/*==========================================
 （中ページ）事業紹介ページの共通スタイル
==========================================*/
div#service_title {
	width: 100% auto;
	padding : 15px 10px 10px 10px;
	color: #fff;
}

div#hp div#service_title { 
	background-color: #49addc;
}
div#mouse div#service_title { 
	background-color: #af6b7c;
}
div#flying div#service_title { 
	background-color: #d25b03;
}
div#up div#service_title { 
	background-color: #9f7559;
}
div#bird div#service_title { 
	background-color: #31ab35;
}
div#mold div#service_title { 
	background-color: #3eb7ad;
}


div#service_title_l h3 {
	font-size: 25px;
	font-weight: bold;
	line-height: 1.2em;
	border-bottom: 1px solid #fff;
	padding-bottom: 3px;
}
div#service_title_l_h img {
	max-width: 130px;
	margin: auto;
	margin-top: 5px;
}

div#service_title_l ul {
	margin-top: 5px;
	list-style-type: disc;
	padding-left: 15px;
}
div#service_title_r p {
	margin-top: 10px;
	font-size: 15px;
}
img#service_icon {
	width: 100% auto;
	margin: auto;
	margin-bottom: 10px;
}

div.service_item {
	margin-top: 15px;
	width: 100% auto;
	border-bottom: 1px dotted #555;
	padding-bottom: 10px;
}
div.service_item h4 {
	font-size: 19px;
	font-weight: bold;
	margin-top: 15px;
	border-bottom: 2px solid;
	margin-bottom: 20px;
}
div.img_box {
	background: #dfe8ec;
}
div.img_box p.img_cap {
	font-size: 90%;
	margin: 0;
	padding: 5px;
	text-align: center;
}





div#hp h4 , div#hp i  {
	color: #036eb8;
}
div#mouse h4 , div#mouse i  {
	color: #a8001f;
}
div#flying h4 , div#flying i  {
	color: #d25b03;
}
div#up h4 , div#up i  {
	color: #9f7559;
}
div#bird h4 , div#bird i  {
	color: #07913a;
}
div#mold h4 , div#mold i  {
	color: #3eb7ad;
}



div.service_item p {
	margin-top: 15px;	
}
/* 
div.service_item_l {
	float: left;
	width: 77%;
}
div.service_item_r {
	float: right;
	width: 20%;
}
*/

/* ▼balloon-1 bottom */
p.balloon-1-bottom {
	font-size: 90%;
	position: relative;
	display: inline-block;
	/* padding: 0 15px; */
	padding: 7px 3px 5px 7px;
	width: auto;
	/* min-width: 115px; */
	/* height: 40px; */
	height: auto;
	/* line-height: 34px; */
	/* color: #19283C;*/
	/* text-align: center; */
	text-align: left;
	background: #fff;
	/* border: 3px solid #19283C; */
	border: 2px solid #176db5;
	z-index: 0;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px; 
	border-radius: 7px;
}
p.balloon-1-bottom:before {
	content: "";
	position: absolute;
	bottom: -8px; left: 50%;
	margin-left: -9px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 9px 9px 0 9px;
	border-color: #fff transparent transparent transparent;
	z-index: 0;
}
p.balloon-1-bottom:after {
	content: "";
	position: absolute;
	bottom: -12px; left: 50%;
	margin-left: -10px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 10px 0 10px;
	border-color: #176db5 transparent transparent transparent;
	z-index: -1;
}
/* ▲balloon-1 bottom */

div.service_item_r {
	text-align: center;
}
div.service_item_r p span{
	display: block;
	color: #176db5;
	font-weight: bold;
	text-align: center;
}
div.service_item_r img {
	margin: auto;
	width: 65px;
}

p.service_arrow {
	font-size: 40px;
	text-align: center;
}
ul.service_item_btn {
	width: 100% auto;	
}
ul.service_item_btn li {
	
}
ul.service_item_btn li a {
	background: #3eb7ad;
	padding: 1.5% 2% 1% 2%;
	color: #fff;
	float: left;
	width: 44%;
	margin: 1%;
	-moz-border-radius: 5px;    /* 古いFirefox */
	-webkit-border-radius: 5px; /* 古いSafari,Chrome */
	border-radius: 5px;         /* CSS3 */
}


/*==========================================
 （中ページ）会社案内ページのスタイル
==========================================*/
div#company {
	width: 100% auto;
}
div#company ul li {
	border-bottom: 1px solid #ccc;	
	padding: 15px;
}
div#company ul#company_list_pco li , div#company ul#company_list_other li  {
	border-bottom: 0;
	padding: 0;
}
div.company_r ul {
	margin-bottom: 15px;	
}
div.company_r ul li {
	list-style-type: disc;
	margin-left: 25px;
}


div.company_l {
	font-size: 17px;
	font-weight: bold;
	color: #2492f9;
}
div.company_r {
	margin-top: 7px;
}
div.company_r iframe {
	height: 300px;
}


/*==========================================
 （中ページ）★★★ページのスタイル
==========================================*/




/*==========================================
 （中ページ）プライバシーポリシー・サイトマップページのスタイル
==========================================*/
ul#privacy li {
	margin-top: 30px;
	border-bottom: 1px solid #aaa;
	padding-bottom: 15px;
}
ul#privacy li h3 , ul#sitemap li h3 {
	font-weight: bold;
	border-left: 1px solid #555;
	padding-left: 15px;
	padding-bottom: 3px;
}
ul#privacy li p {
	margin-top: 10px;
	margin-left: 15px;
	font-size: 14px;
}

ul#sitemap li {
	margin-top: 30px;
}
ul#sitemap li a:hover {
	color: #666;
}
ul#sitemap_service {
	margin-left: 20px;
}
ul#sitemap_service li {
	width: 100% auto;
	margin-top: 5px;
}
ul#sitemap_service li a {
	float: left;
	width: 30%;
	min-width: 120px;
	padding-top: 15px;
	padding-bottom: 12px;
	
	margin: 1px;
	border: 1px solid #666;
	text-align: center;
}
ul#sitemap_service li a:hover {
	background: #666;
	color: #fff;
}


/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_

メディアクエリによる切り替え

/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/


/* PC向けおよび大型タブレット向けのレイアウトの指定：769px ～ 960px)  @media print, screen and (min-width: 769px) { */

@media print, screen and (min-width:769px) {
	
	.sp_only {
		display: none;
	}
	.pc_only {
		display: inline;	
	}

	
	/*==========================================
	 ヘッダーのスタイル
	==========================================*/
	header {
		
	}
	div#title {
		width: 983px; /* 左右余白10pxずつ(左は7px) */
		margin-left: auto;
		margin-right: auto;
	}
	div#title #name {
		width: 600px;
		float: left;
	}
	div#title #name img#ifl {
		max-width: 100px;
	}
	div#title #contact {
		width: 250px;
		float: right;
		/* margin-top: 3px; */
	}
	
	div#title #name #name_right {
		margin-top: 15px;
	}	
	div#title #name #name_right p {
		font-size: 15px;
	}
	
	div#title #contact {
		margin-top: 10px;	
	}
	div#title #contact img#contact_tel {
		float: none;
		width: auto;
		display: block;
		margin-left: 0;
	}
	div#title #contact a#contact_mail {
		float: none;
		width: auto;
		font-size: 15px;
		margin-top: 8px;
	}
	
	
	
	/* ▼ナビメニュー(PC用) */
	header nav {
		width: 100%;
		min-height: 45px;
		text-align: center;
		background: #f3f2f1;
		border-top: 3px solid #fff;
		border-bottom: 3px solid #fff;
	}
	
	header nav ul {
		/* max-width: 1000px;*/
		width: 1000px;
		margin-left: auto;
		margin-right: auto;
		list-style-type: none;
		/* width:100%; */
		border-right: 1px dotted #666;
	}
	header nav ul li {
		float:left;
		width: 20%;
		margin: 0;
		text-align: center;
	}
	header nav ul li a {
		display: block;
		background: #f3f2f1;
		margin:0;
		padding:10px 20px;
		border-left: 1px dotted #666;
		box-sizing:border-box;
		text-decoration: none;
	}
	header nav ul li a:hover {
		background: #fff;
	}
	
	
	
	header nav ul li ul {
	  display: none;  /*サブメニューは最初は非表示にしておく*/
	  position: absolute;  /*絶対配置にしておかないとうまくいかない*/
	  /* top: 2em; */
	  /* left: 30%; */
	  
	}
	header nav ul li:hover ul {
	  display: block;    /*マウスオーバー時にサブメニューを表示する*/
	  width: 250px;
	  border-right: none;
	  /* box-shadow */
		box-shadow:rgba(100, 100, 100, 0.37) 0px 3px 2px 2px;
		-webkit-box-shadow:rgba(100, 100, 100, 0.37) 0px 0px 2px 2px;
		-moz-box-shadow:rgba(100, 100, 100, 0.37) 0px 0px 2px 2px;
		z-index: 999999;
	
	}
	

		
	header nav ul li ul li {
	  float: none;  /*サブメニューはフロートさせないので解除*/
	  text-align: left;
	  border-top: 1px solid #ccc;
	  width: 100%;
	}
	header nav ul li ul li a {
		border-left: none;
		width: 100%;
		background: #fff;
		
	}
	header nav ul li ul li a:hover {
		color: #fff;
	}
	header nav ul li ul li#nav_hp a:hover {
		background: #2D81C5;
	}
	header nav ul li ul li#nav_mouse a:hover {
		background: #990D65;
	}
	header nav ul li ul li#nav_flying a:hover {
		background: #D6742C;
	}
	header nav ul li ul li#nav_up a:hover {
		background: #8E6553;
	}
	header nav ul li ul li#nav_bird a:hover {
		background: #22AC38;
	}
	header nav ul li ul li#nav_mold a:hover {
		background: #3AAEB1;
	}
	
	/* ▲ナビメニュー */
	
	
	

	/*==========================================
	 コンテンツエリア -> 共通のスタイル
	==========================================*/
	div#contents {
		width: 980px;
		padding: 10px;
		margin: 10px auto 0 auto;
		background-color: rgba(255,255,255,0.8);
	}
	div#contents_service {
		width: 980px;
		padding: 10px;
		margin: 10px auto 0 auto;
		background-color: rgba(255,255,255,0.0);
	}
	
	div#contents_service div#box {
		margin-left: 10px;
		background-color: rgba(255,255,255,0.8);
		padding: 10px 10px 10px 25px;
	}
	div#box_art {
		width: 750px;
		float: left;
	}
	div#contents_service div#box_art {
		width: 715px;
		float: left;
	}
	
	p.box_art_w {
		width: 82%;	
	}
	
	div#box_btn {
		width: 190px;
		float: right;
		/* margin-top: 0; */
	}
	div#box_btn ul li {
		width: 100%;
		float: none;
	}
	
	

	
	/*==========================================
	 （中ページ）経営理念ページのスタイル
	==========================================*/
	p#ps_text {
		font-size: 20px;
		line-height: 1.7em;
	}
	div#ps h3 {
		font-size: 23px;
		margin-top: 0;
	}
	div#ps p {
		/* font-size: 17px; */
		/* text-align: center; */
	}
	div#ps img {
		width: 47%;	
		float: left;
	}
	div#ps_r {
		width: 51%;
		float: right;
	}
	

	
	/*==========================================
	 （中ページ）事業紹介ページの共通スタイル
	==========================================*/
	div#service_title {
		width: 930px;
		height: 105px;
		padding : 10px 25px 40px 25px;
		background-color: rgba(255,255,255,0.0);
		background-repeat: no-repeat;
		background-position: left;
	}
	
	div#hp div#service_title {
		background-image: url(../img/hp/belt.gif);
		background-color: rgba(255,255,255,0.0);
	}
	div#mouse div#service_title {
		background-image: url(../img/mouse/belt.gif);
		background-color: rgba(255,255,255,0.0);
	}
	div#flying div#service_title {
		/* background-image: url(../img/flying/belt.gif);
		background-color: rgba(255,255,255,0.0); */
		/* background: #d25b03; */
	}
	div#up div#service_title {
		/* background-image: url(../img/up/belt.gif);
		background-color: rgba(255,255,255,0.0); */
	}
	div#bird div#service_title {
		background-image: url(../img/bird/belt.gif);
		background-color: rgba(255,255,255,0.0);
	}
	div#mold div#service_title {
		/* background-image: url(../img/mold/belt.gif);
		background-color: rgba(255,255,255,0.0); */
		/* background: #3eb7ad; */
		
	}


	
	
	
	div#service_title_l h3 {
		font-size: 37px;
		margin-top: 13px;
		border-bottom: none;
		padding-bottom: none;
	}
	

	
	
	div#service_title_l {
		float: left;
		width: 440px;
	}
	div#service_title_r {
		float: right;
		width: 460px;
	}
	
	
	div.service_item_l {
		float: left;
		width: 77%;
	}
	div.service_item_r {
		float: right;
		/* width: 20%; */
		width: 17%;
	}
	div.service_item_r p span{
		text-align: left;
	}
	div.service_item_r img {
		width: 90px;
	}
	
	
	div#service_title_l_h {
		width: auto;	
	}
	div#service_title_l_h h3 {
		width: auto;	
		float: left;
	}
	div#service_title_l_h img {
		/* width: 80px;	 */
		max-height: 120px;
		float: left;
		margin-left: 5px;
		margin-top: 0;
	}
	
	
	
	
	/*==========================================
	 （中ページ）会社案内ページのスタイル
	==========================================*/
	div.company_l {
		float: left;
		width: 20%;
	}
	div.company_r {
		float: right;
		width: 80%;
		margin-top: 0;
	}
	div#company ul#company_list_pco , div#company ul#company_list_other {
		float: left;
		width: 49%;
	}
	
	
	/*==========================================
	 （中ページ）お問い合わせページのスタイル
	==========================================*/
	div#contact_thanks {
		margin-bottom: 300px;
	}

	
	/*==========================================
	 フッターのスタイル
	==========================================*/
	footer {
		font-size: 15px;
	}	
	address {
		width: auto;
		float: left;
	}
	div#link_pp {
		width: auto;
		float: right;
		text-align: right;
		margin-top: 50px;
	}
	
	
	/*==========================================
	 コンテンツエリア -> ●●●のスタイル
	==========================================*/
	


	

	
	
}

/* PC向けレイアウトの指定：961px以上では固定レイアウト */
@media print, screen and (min-width: 961px) {

}