@charset "utf-8";

/* reset style
----------------------------------------------------------- */

html {
	overflow-y:scroll;
}
body,div,
dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}
body,x:-moz-broken {
	margin-left:-1px;
}
h1,h2,h3,h4,h5,h6,p {
	font-weight:normal;
	font-size: 100%;
	text-align:left;
}
ol,ul,li{
	list-style:none;
}
ul,li,img{
	margin:0;
	padding:0;
	list-style:none;
	vertical-align:bottom;
	line-height:1.6;
	text-align:left;
}
caption,th {
	text-align:left;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
a{
	text-decoration:none;
	outline:0;
	line-height:1.6;
/* Hides from IE-mac \*/
	overflow:hidden;
/* End hide from IE-mac */
}

img,td,th {
	border:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
td,th{
	text-align: left;
	vertical-align: top;
}


/* CLEAR FIX*/
.clearfix:after,
p.text:after{
	content: ".";  
	display: block;  
	visibility: hidden;  
	height: 0.1px;  
	font-size: 0.1em;  
	line-height: 0;  
	clear: both;  
}
.clearfix,
p.text{display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
* html p.text { height: 1%;}
.clearfix,
p.text{display: block;}
/* End hide from IE-mac */



/* function
----------------------------------------------------------------------------------*/
/* margin */
.mt0  {margin-top:0px!important;}
.mt5  {margin-top:5px!important;}
.mt10 {margin-top:10px!important;}
.mt15 {margin-top:15px!important;}
.mt20 {margin-top:20px!important;}
.mt25 {margin-top:25px!important;}
.mt30 {margin-top:30px!important;}
.mt40 {margin-top:40px!important;}
.mt50 {margin-top:50px!important;}
.mt100 {margin-top:100px!important;}
.mt150 {margin-top:150px!important;}

.mb0  {margin-bottom:0px!important;}
.mb5  {margin-bottom:5px!important;}
.mb10 {margin-bottom:10px!important;}
.mb15 {margin-bottom:15px!important;}
.mb20 {margin-bottom:20px!important;}
.mb25 {margin-bottom:25px!important;}
.mb30 {margin-bottom:30px!important;}
.mb40 {margin-bottom:40px!important;}
.mb50 {margin-bottom:50px!important;}
.mb90 {margin-bottom:90px!important;}
.mb100 {margin-bottom:100px!important;}
.mb150 {margin-bottom:150px!important;}

.mr0  {margin-right:0px!important;}
.mr5  {margin-right:5px!important;}
.mr10 {margin-right:10px!important;}
.mr15 {margin-right:15px!important;}
.mr20 {margin-right:20px!important;}
.mr25 {margin-right:25px!important;}
.mr30 {margin-right:30px!important;}

.ml0  {margin-left:0px!important;}
.ml5  {margin-left:5px!important;}
.ml10 {margin-left:10px!important;}
.ml15 {margin-left:15px!important;}
.ml20 {margin-left:20px!important;}
.ml25 {margin-left:25px!important;}
.ml30 {margin-left:30px!important;}

/* padding */
.pt0  {padding-top:0px!important;}
.pt5  {padding-top:5px!important;}
.pt10 {padding-top:10px!important;}
.pt15 {padding-top:15px!important;}
.pt20 {padding-top:20px!important;}
.pt25 {padding-top:25px!important;}
.pt30 {padding-top:30px!important;}

.pb0  {padding-bottom:0px!important;}
.pb5  {padding-bottom:5px!important;}
.pb10 {padding-bottom:10px!important;}
.pb15 {padding-bottom:15px!important;}
.pb20 {padding-bottom:20px!important;}
.pb25 {padding-bottom:25px!important;}
.pb30 {padding-bottom:30px!important;}

.pr0  {padding-right:0px!important;}
.pr5  {padding-right:5px!important;}
.pr10 {padding-right:10px!important;}
.pr15 {padding-right:15px!important;}
.pr20 {padding-right:20px!important;}
.pr25 {padding-right:25px!important;}
.pr30 {padding-right:30px!important;}

.pl0  {padding-left:0px!important;}
.pl5  {padding-left:5px!important;}
.pl10 {padding-left:10px!important;}
.pl15 {padding-left:15px!important;}
.pl20 {padding-left:20px!important;}
.pl25 {padding-left:25px!important;}
.pl30 {padding-left:30px!important;}

.taL{text-align:left!important;}
.taR{text-align:right!important;}
.taC{text-align:center!important;}

.fR{float:right!important;}
.fL{float:left!important;}

.clear{clear:both!important;}
.wrap{overflow:hidden;zoom:1;}

.fs12{font-size:85.714%!important;}
.c-green{color:#346238;}


ul.dib,
dl.dib{
	letter-spacing:-0.4em;
}
ul.dib li,
dl.dib dt,
dl.dib dd{
	display:inline-block;
	*display:inline;
	vertical-align:top;
	letter-spacing:normal;
	zoom:1;
}


/* common
------------------------------------------------------*/

body {
	margin:0;
	padding:0;
	font-size:87.5%;
	font-family:メイリオ, Meiryo, Osaka, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic';
	line-height:1.8;
	color:#646464;
	vertical-align:top;
	background-color:#ffffff;
	-webkit-text-size-adjust:100%;
	border-bottom:15px #64C832 solid;
}


a:link   {color:#509b58;text-decoration:underline;}
a:visited{color:#509b58;text-decoration:underline;}
a:hover  {color:orange;text-decoration:none;}
a:active {color:#509b58;text-decoration:underline;}

a:hover img{
    opacity:0.50!important;
    filter: alpha(opacity=50);
	transition: all 0.3s linear;
}

img{max-width:100%;}
.pc {display: block!important;}
.sp,
.tb {display: none!important;}
@media screen and (max-width: 990px) {
	.tb {display: block!important;}
}
@media screen and (max-width: 640px) {
	.pc {display: none!important;}
	.sp {display: block!important;}
}


a.tel{
	display:inline-block;
	color:#646464;
	text-decoration:none;
	white-space:nowrap;
	cursor:default;
}
@media screen and (max-width: 990px) {
	a.tel{
		color:#509b58;
		text-decoration:underline;
		cursor:pointer;
	}
	a.tel:hover{
		color:orange;
	}
}

p.note,
span.note{
	font-size:12px;
	line-height:1.5;
}

/* fade-in animation */
div,ul,h2,p,img{
  transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -webkit-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
}
body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

a#pagetop_btn,
a#pagetop_btn img{
	opacity:1!important;
}




/* btn style */
a.btn{
	display:block;
	width:200px;
	padding:12px 15px 9px;
	color:white;
	text-align:center;
	border-radius:30px;
	-webkit-border-radius:30px;
	-moz-border-radius:30px;
	transition: all 0.3s linear;
}
	
	
a.btn.seeds     {background-color:#00afff;}
a.btn.business  {background-color:#64c832;}
a.btn.topics    {background-color:#ff6464;}
a.btn.company   {background-color:#009696;}
a.btn.recruiting{background-color:#0069b1;}
a.btn.inquiry   {background-color:#326464;}
a.btn.sub       {background-color:#326464;}

.seeds a.btn     {background-color:#00afff;}
.business a.btn  {background-color:#64c832;}
.topics a.btn    {background-color:#ff6464;}
.company a.btn   {background-color:#009696;}
.recruiting a.btn{background-color:#0069b1;}
.inquiry a.btn   {background-color:#326464;}
.sub a.btn       {background-color:#326464;}

a.btn:hover{background-color:#ff9600;}
	


/* structure
---------------------------------------- */
div#header,
div#footer{
	clear:both;
	width:calc(100% - 60px);
	margin:5px auto;
	padding:0 30px;
}
div#footer{
	margin-bottom:30px;
	text-align:center;
}
div#container{
	width: calc(100% - 30px);/*コンテンツはヘッダー両側よりはみ出してはいけない*/
	margin:0 auto;
	padding:0;
}
div#contents{
	width:auto;
	margin:0 50px 80px;
	padding:0;
}

@media screen and (max-width: 990px) {
	div#header,
	div#footer{
		width:calc(100% - 40px);
		margin:10px auto 0;
		padding:0 15px;
	}
	div#container{
		margin:0 15px;
	}
	div#contents {
		margin: 0 0 80px;
	}
}


/* header
---------------------------------------- */
div.inner{
	float:left;
}
.btn-menu {
    position: absolute;
    top:15px;
    right:20px;
}

@media screen and (max-width: 990px) {
	div.inner{margin-right:40px;}
	.btn-menu {
		top:10px;
		right:10px;
	}
	.p-groupHeader__companyLogo {
		margin: 0 50px 0 auto;
	}
}
@media screen and (max-width: 768px) {
	.p-groupHeader__companyLogo {
		margin: 0 20px 0 auto;
	}
}


	
/* global_navi
---------------------------------------- */
ul.gnavi {
	display:inline-block;
	margin:0 auto;
	text-align:center;
	z-index:1000;
}
ul.gnavi li {
	position:relative;
}
ul.gnavi li a {
	display:block;
	padding:0 20px 10px 15px;
	font-size:16px;
	white-space:nowrap;
	text-align:center;
	overflow:hidden;
	transition: all 0.3s ease;
	background:url(../img/arr.png) no-repeat left 0.4em;
}
ul.gnavi li a:hover {
	background:url(../img/arr_o.png) no-repeat 3px 0.4em;
}
ul.gnavi li ul {
	display:none;
	position:absolute;
	top:40px;
	left:50%;
	width:300px;
	margin:0 0 0 -150px;
	padding:0;
	border:1px #ccc solid;
	z-index:9999999;
	background:#fff;
}
ul.gnavi li ul li {
	width:100%;
	padding:0;
	border-right:none;
	border-top:1px #ccc solid;
	background:none;
}
ul.gnavi li ul li:first-child{
	border-left:none;
}
ul.gnavi li ul li:last-child{
	border-bottom:none;
}
ul.gnavi li ul li a {
	display:block;
	height:inherit;
	padding:10px 15px 8px;
	font-size:14px;
	text-indent:0;
	text-align:center;
	background:none;
	border-left:none;
	border-right:none;
}
ul.gnavi li ul li a:hover {
	color:white;
	background:orange!important;
	transition-property: all;
	transition: 0.3s linear;
}
ul.gnavi li ul li:last-child a {
	border:none
}
@media screen and (max-width: 990px) {
div.inner{
  width:100%;
  margin-top:15px;
  margin-right:0;
}
ul.gnavi {
  display:none;
  width:100%;
 }
ul.gnavi li {
  display:block;
  width:100%;
  padding:0;
  border-top:1px #ccc solid;
 }
ul.gnavi li:last-child{
 	border-bottom:1px #ccc solid;
}
ul.gnavi li a {
  height:inherit;
  padding:8px 10px;
  text-align:center;
  text-indent:0;
  -moz-border-radius:0;
  -webkit-border-radius:0;
  border-radius:0;
  background:#fff;
  box-shadow:none;
 }
ul.gnavi li a:hover,
ul.gnavi li a ul li a:hover {
  background:none;
 }
 #gnavi ul li a:before {
  position:absolute;
  right:10px;
  top:16px;
  color:#509b58;
  font-family:'FontAwesome';
  content:"\f054"
 }
ul.gnavi li a[href="#"]:before {
  position:absolute;
  right:10px;
  top:16px;
  color:#509b58;
  font-family:'fontAwesome';
  content:"\f078"
 }
ul.gnavi li ul {
  display:none;
  position:static;
  width:100%;
  margin:0;
  padding:0;
  border:none;
  -moz-border-radius:0;
  -webkit-border-radius:0;
  border-radius:0;
  background:#fafafa;
 }
 ul.gnavi li ul li{
	 border-top:1px #ccc solid;
 }
ul.gnavi li ul li a:hover {
  background:none
 }
}


/* footer
------------------------------------------------------*/
div#footer p#pagetop_btn {
	margin:0 auto 30px;
 	text-align:center;
}
div#footer p#pagetop_btn a{
	display:block;
	width:150px;
	margin:0 auto;
	padding-top:90px;
	transition: all 0.3s linear;
	background:url(../img/pagetop.png) no-repeat center top;
}
div#footer p#pagetop_btn a:hover{
    opacity:0.50;
    filter: alpha(opacity=50);
}

/* gnavi */
div#footer ul.gnavi li ul{
	top:auto;
	bottom:40px;
}

/* address */
address{
	margin:60px auto 30px;
}
address a.home{
	display:block;
	padding-bottom:15px;
}
address a.home img{
	display:block;
	margin:0 auto 15px;
}

/* small */
small{
	display:block;
	margin-bottom:30px;
}




/* category_title
----------------------------------------------------------- */
h2#cttl{
	width:100%;
	padding:100px 0;
	color:white;
	text-align:center;
	background-repeat:repeat,repeat-x;
	background-position:center bottom;
	background-size:auto auto,cover;
}
h2#cttl.bg1{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk1.png);}
h2#cttl.bg2{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk2.png);}
h2#cttl.bg3{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk3.png);}
h2#cttl.bg4{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk4.png);}
h2#cttl.bg5{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk5.png);}
h2#cttl.bg6{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk6.png);}
h2#cttl.bg7{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk7.png);}
h2#cttl.bg8{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk8.png);}
h2#cttl.bg9{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk9.png);}
h2#cttl.bg10{background-image:url(../img/bk_stripe.png),url(../img/cttl_bkimg/bk10.png);}

h2#cttl {
-moz-animation: anime1 5s ease;
-webkit-animation: anime1 5s ease;
-o-animation: anime1 5s ease;
-ms-animation: anime1 5s ease;
}

@-moz-keyframes anime1 {
0% {background-position:center center;}
100% {background-position:center bottom;}
}

@-webkit-keyframes anime1 {
0% {background-position:center center;}
100% {background-position:center bottom;}
}

@-o-keyframes anime1 {
0% {background-position:center center;}
100% {background-position:center bottom;}
}

@-ms-keyframes anime1 {
0% {background-position:center center;}
100% {background-position:center bottom;}
}

h2#cttl span{
	display:block;
	margin:0 auto 10px;
}

@media screen and (max-width: 510px) {
	h2#cttl{
		padding:50px 0 40px;
	}
}


/* sitenavi
----------------------------------------------------------- */
ul#sitenavi{
	margin-bottom:50px;
	padding:5px 30px;
	background-color:#f5f5f5;
}
ul#sitenavi li{
	margin-right:15px;
	padding-left:10px;
	background:url(../img/arr.png) no-repeat left 0.5em;
}
ul#sitenavi li.home{
	padding-left:20px;
	background:url(../img/icon_home.png) no-repeat left 0.2em;
}

@media screen and (max-width: 640px) {
	ul#sitenavi{
		margin-bottom:30px;
		padding:5px 15px;
		font-size:12px;
	}
}
@media screen and (max-width: 510px) {
	ul#sitenavi{
		display:none;
	}
}


/* page_title
----------------------------------------------------------- */
h3#pttl{
	text-align:center;
}
.japan_quality h3#pttl{padding-bottom:180px;background:url(../img/mark/japan_quality.png) no-repeat center bottom;}
.technology    h3#pttl{padding-bottom:200px;background:url(../img/mark/technology.png) no-repeat center bottom;}
.toy           h3#pttl{padding-bottom:180px;background:url(../img/mark/toy.png) no-repeat center bottom;}
.molding       h3#pttl{padding-bottom:180px;background:url(../img/mark/molding.png) no-repeat center bottom;}
.quality_check h3#pttl{padding-bottom:180px;background:url(../img/mark/quality_check.png) no-repeat center bottom;}
.oem           h3#pttl{padding-bottom:160px;background:url(../img/mark/oem.png) no-repeat center bottom;}
.company .iso  h3#pttl{padding-bottom:180px;background:url(../img/mark/iso.png) no-repeat center bottom;}
.company       h3#pttl{padding-bottom:180px;background:url(../img/mark/company.png) no-repeat center bottom;}

h3#pttl span{
	margin-right:10px;
}

p.outline_ttl{
	margin:20px auto 15px;
	font-size:20px;
	text-align:center;
}
p.outline{
	margin-bottom:50px;
	text-align:center;
}
@media screen and (min-width: 990px) {
	h3#pttl span.pc{
		display:inline!important;
	}
}
@media screen and (max-width: 640px) {
	div#contents h3#pttl{
		padding-bottom:160px;
	}
	h3#pttl span{
		display:block;
	}
}
@media screen and (max-width: 510px) {
	h3#pttl{
		margin-top:30px;
	}
}

/* local_navi
----------------------------------------------------------- */
ul#lnavi{
	margin:80px auto 0;
	padding:20px 0 0 0;
	text-align:center;
	border-top:1px #ccc solid;
}
ul#lnavi li{
	margin:0 10px 10px;
}


/* column
----------------------------------------------------------- */
ul.column1{
	text-align:center;
	margin:20px auto 0;
}
ul.column1 li{
	width:70%;
	max-width:800px;
	margin:0 auto;
}
ul.column3 li{
	width:31%;
	margin:0 3.5% 10px 0;
}
ul.column3 li:nth-child(3n){
	margin:0 0 10px 0;
}
ul.column3 li img{
	display:block;
	margin:0 auto;
}
ul.column3 li p{
	margin:5px auto 0;
}

@media screen and (max-width: 700px) {
ul.column1 li{
		width:100%;
	}
}
@media screen and (max-width: 640px) {
	ul.column3 li{
		width:100%;
	}
	ul.column3 li img{
		float:right;
		width:49%;
		margin:0 0 2% 2%;
	}
}



/* contact
----------------------------------------------------------- */
div#contact{
	width:70%;
	max-width:700px;
	margin:50px auto 20px;
	padding:15px;
	text-align:center;
	border:5px #e1e1e1 solid;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
}
div#contact h2{
	font-size:28px;
	text-align:center;
	line-height:1.4;
}
div#contact a.tel{
	margin:0 10px;
	font-size:20px;
	text-align:center;
}
div#contact ul{
	text-align:center;
}
div#contact ul li{
	margin: 0 10px;
}

.seeds      div#contact h2{color:#00afff;}
.business   div#contact h2{color:#64c832;}
.topics     div#contact h2{color:#ff6464;}
.company    div#contact h2{color:#009696;}
.recruiting div#contact h2{color:#00afff;}
.sub        div#contact h2{color:#326464;}


/* text style
----------------------------------------------------------- */
h4.ttl{
	margin-bottom:30px;
	padding-bottom:5px;
	font-size:28px;
	text-align:center;
	line-height:1.5;
	letter-spacing:normal;
	border-bottom:3px #ccc solid;
}
.seeds      h4.ttl{color:#00afff;border-color:#00afff;}
.business   h4.ttl{color:#64c832;border-color:#64c832;}
.topics     h4.ttl{color:#ff6464;border-color:#ff6464;}
.company    h4.ttl{color:#009696;border-color:#009696;}
.recruiting h4.ttl{color:#00afff;border-color:#00afff;}
.sub        h4.ttl{color:#326464;border-color:#326464;}

p.ttl{
	margin:10px auto 20px;
	font-size:20px;
	line-height:1.5;
}
p.sttl{
	margin:10px auto 10px;
	padding:5px 0 5px 10px;
	font-size:16px;
	line-height:1.5;
	border-left:3px #64c832 solid;
	border-bottom:1px #ccc dotted;
}
div.unit{
	clear:both;
	margin-bottom:50px;
}
span.pic{
	width:470px;
	float:right;
	display:block;
	margin:0 0 30px 30px;
}
span.pic img{
	margin-bottom:10px;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
}
span.pic p.sttl{
	font-size:18px;
}
span.pic p.note{
	margin:0 0 15px;
}
span.pic.half{
	width:225px;
}

@media screen and (max-width: 990px) {
	span.pic{
		width:50%;
		margin:0 0 20px 15px;
	}
	span.pic.half{
		width:24%;
		margin:0 0 20px 1%;
	}
}
@media screen and (max-width: 510px) {
	h4.ttl{
		font-size:22px;
	}
	p.ttl{
		font-size:18px;
	}
	span.pic{
		width:auto;
		max-width:470px;
		float:none;
		margin:0 auto;
	}
	span.pic.half{
		width:48%;
		float:right;
		margin:0 1% 20px;
	}
}

/* box */
span.box{
	display:block;
	padding:10px;
	border:1px #ccc solid;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
}


/* accept cookie popup
------------------------------------------------*/
div#cookie,div#cookie *{opacity:1!important;}
div#use_cookie{width:calc(100% - 60px);position:fixed;bottom:0;left:0;padding:15px 30px;background-color:rgba(235,235,225,0.9);transition:all 0.3s ease-in;z-index:99999999;}
div#use_cookie.agree{left:100%;}
div#use_cookie h3{margin-bottom:5px;font-size:18px;font-weight:bold;text-align:center;}
div#use_cookie p{width:calc(100% - 212px);float:left;margin-right:30px;font-size:14px;}
div#use_cookie a.btn{width:150px;min-width:0;float:right;margin-top:7px;color:#509b58;background-color:#fff;cursor:pointer;}
div#use_cookie a.btn:hover{color:#fff;background-color:#ff6400;}
@media screen and (max-width:640px){
div#use_cookie p{width:100%;float:none;margin-right:0;margin-bottom:10px;}
div#use_cookie a.btn{width:180px;float:none;margin:0 auto;}
}