@charset "UTF-8";


#header
{
width: 100%;
margin: 0px auto;
padding: 0px;
background: url(../images/lib/back/headerback01.png) bottom left repeat-x;
overflow: hidden;
height: 80px;
text-align: left;
position: relative;
}


/*---------------------------*/


#titleback
{
width: 100%;
margin: 0px 0px;
padding: 0px 0px;
height: 80px;
display: block;
z-index: 10;
overflow: hidden !important;
}


/*---------------------------*/


#siteid
{
width: 225px;
margin: 0px 0px;
padding: 0px;
height: 70px;
text-indent: -9999px;
position: absolute;
z-index: 10000;
}

#siteid a
{
display: block;
width: 225px;
margin: 0px 0px;
padding: 0px;
background: url(../images/lib/siteid/siteid01.png) 0px 0px no-repeat;
background-size:65%;
height: 70px;
text-indent: -9999px;
}

#siteid a:hover
{
opacity:0.5;
transition:background 0.5s;
}


#liner
{
width: 225px;
margin: 0px 0px;
padding: 0px;
height: 70px;
text-indent: -9999px;
position: absolute;
background: url(../images/lib/liner/liner01.png) 0px 0px no-repeat;
z-index: 1000;
}


/*---------------------------*/


#gnav
{
width: 100%;
margin: 0px 0px 0px 0px;
padding: 0px;
height: 70px;
background: url(../images/lib/back/gnavback01.jpg) 0px 0px no-repeat;
position: absolute;
z-index: 100;
right: 0px;
}


#gnav ul.gnav
{
margin: 7px 10px 0px 0px;
padding: 0px 0px;
width: 635px;
height: 55px;
float: right;
}

#gnav ul.gnav li
{
list-style-type: none;
float: left;
}

#gnav ul.gnav li.nav a
{
height: 55px;
text-indent: -9999px;
cursor: pointer;
display: block;
width: 90px;
}


#gnav ul.gnav li.nav.home a
{
width: 95px;
background:url(../images/lib/gnav/gnav01.png) 0px 0px no-repeat;
}

#gnav ul.gnav li.nav.info a
{
background:url(../images/lib/gnav/gnav01.png) -95px 0px no-repeat;
}

#gnav ul.gnav li.nav.works a
{
background:url(../images/lib/gnav/gnav01.png) -185px 0px no-repeat;
}

#gnav ul.gnav li.nav.aboutus a
{
background:url(../images/lib/gnav/gnav01.png) -275px 0px no-repeat;
}

#gnav ul.gnav li.nav.recruit a
{
background:url(../images/lib/gnav/gnav01.png) -365px 0px no-repeat;
}

#gnav ul.gnav li.nav.contact a
{
background:url(../images/lib/gnav/gnav01.png) -455px 0px no-repeat;
}

#gnav ul.gnav li.nav.staffblog a
{
background:url(../images/lib/gnav/gnav01.png) -545px 0px no-repeat;
}


/*-----------------------------------*/


#gnav ul.gnav li.nav.home a:hover
{
width: 95px;
background:url(../images/lib/gnav/gnav01_s2.png) 0px 0px no-repeat;
}

#gnav ul.gnav li.nav.info a:hover
{
background:url(../images/lib/gnav/gnav01_s2.png) -95px 0px no-repeat;
}

#gnav ul.gnav li.nav.works a:hover
{
background:url(../images/lib/gnav/gnav01_s2.png) -185px 0px no-repeat;
}

#gnav ul.gnav li.nav.aboutus a:hover
{
background:url(../images/lib/gnav/gnav01_s2.png) -275px 0px no-repeat;
}

#gnav ul.gnav li.nav.recruit a:hover
{
background:url(../images/lib/gnav/gnav01_s2.png) -365px 0px no-repeat;
}

#gnav ul.gnav li.nav.contact a:hover
{
background:url(../images/lib/gnav/gnav01_s2.png) -455px 0px no-repeat;
}

#gnav ul.gnav li.nav.staffblog a:hover
{
background:url(../images/lib/gnav/gnav01_s2.png) -545px 0px no-repeat;
}


#gnav ul.gnav li.nav.home a:hover,
#gnav ul.gnav li.nav.info a:hover,
#gnav ul.gnav li.nav.works a:hover,
#gnav ul.gnav li.nav.aboutus a:hover,
#gnav ul.gnav li.nav.recruit a:hover,
#gnav ul.gnav li.nav.contact a:hover,
#gnav ul.gnav li.nav.staffblog a:hover
{
transition:0.3s linear background;
}






@media screen and (max-width: 979px) {
	
#header
{
height:49px;
}	
.home #header
{
width: 100%;
margin: 0px auto;
padding: 0px;
height:300px;
overflow:hidden;
}

.home #liner,
.home #siteid,
.home #siteid a
{
height:290px;
}
#siteid a
{
width: 100px;	
height:45px;
background: url(../images/lib/siteid/siteid01_sp.png) top center no-repeat;
background-position:center center;
background-size:contain;
}
	
.home #titleback
{
height:250px !important;
margin:40px 0px 0px 0px;
}

#titleback
{
height:175px;
}

#titleback img
{
position:absolute !important;
bottom:0px !important;
}


/*------------------------------*/

#gnav
{
width: 100%;
margin: 0px 0px;
padding: 0px;
background:#111;
height: 40px;
}

#gnav ul.gnav
{
margin: 0px 0px 0px 0px;
padding: 0px 0px;
width: 70%;
height: 40px;
float:right !important;
position:relative;
display:block ;
text-align:right;
}
	
#gnav ul.gnav li
{
width:auto;
height: 40px;
display:inline;
}

#gnav ul.gnav li.nav a,
#gnav ul.gnav li.nav.home a,
#gnav ul.gnav li.nav.info a,
#gnav ul.gnav li.nav.works a,
#gnav ul.gnav li.nav.aboutus a,
#gnav ul.gnav li.nav.recruit a,
#gnav ul.gnav li.nav.contact a,
#gnav ul.gnav li.nav.staffblog a
{
text-indent:0px;
display: block;
width: auto;
height: 40px;
padding:0em 0.8em;
font-size:70%;
background:#111;
text-align:center;
color:#eee;
border-right:1px dotted #666;
text-decoration:none;
line-height:40px;
box-sizing:border-box;
}

#gnav ul.gnav li.nav.staffblog a
{
border-right:none;
}

#gnav ul.gnav li.nav a:hover,
#gnav ul.gnav li.nav.home a:hover,
#gnav ul.gnav li.nav.info a:hover,
#gnav ul.gnav li.nav.works a:hover,
#gnav ul.gnav li.nav.aboutus a:hover,
#gnav ul.gnav li.nav.recruit a:hover,
#gnav ul.gnav li.nav.contact a:hover,
#gnav ul.gnav li.nav.staffblog a:hover
{
background:#F00;
text-decoration:none;
width: auto;
}

}



@media screen and (max-width: 767px) {
#header
{
height:auto !important;
background:none;
}

.home #header
{
height:auto !important;
min-height:none;
background:none;
}

#liner,
#titleback
{
display:none;
}

#siteid,
.home #siteid
{
height:90px;
margin:10px auto 0px auto;
position:relative;
z-index:1;
}
	

#siteid a,
.home #siteid a
{
width: 225px;
height:80px;
background: url(../images/lib/siteid/siteid01_sp.png) top center no-repeat;
background-position:center center;
background-size:contain;
}

.home #liner
{
display:none;
}

.home #titleback
{
display:none;
}


#gnav
{
width: 100%;
margin: 0px 0px 0px 0px;
padding: 0px;
height: auto;
position: relative;
background:#cf0;
float:none;
}

#gnav ul.gnav
{
margin: 0px 0px;
padding: 0px 0px;
width: 100%;
background:#111;
display:block;
height:auto;
}
	
#gnav ul.gnav li
{
list-style-type: none;
float:left;
width:25%;
height:auto;
}


#gnav ul.gnav li.nav a,
#gnav ul.gnav li.nav.home a,
#gnav ul.gnav li.nav.info a,
#gnav ul.gnav li.nav.works a,
#gnav ul.gnav li.nav.aboutus a
{
height: auto;
text-indent:0px;
display: block;
width: auto;
padding:0em 0.8em;
font-size:80%;
background:#111;
text-align:center;
color:#eee;
border-right:1px dotted #666;
border-bottom:1px dotted #666;
box-sizing:border-box;
}

#gnav ul.gnav li.nav.recruit a,
#gnav ul.gnav li.nav.contact a,
#gnav ul.gnav li.nav.staffblog a
{
height: auto;
text-indent:0px;
display: block;
width: auto;
padding:0em 0.8em;
font-size:80%;
background:#111;
text-align:center;
color:#eee;
border-right:1px dotted #666;
border-bottom:none;
box-sizing:border-box;
}

#gnav ul.gnav li.nav a:hover,
#gnav ul.gnav li.nav.home a:hover,
#gnav ul.gnav li.nav.info a:hover,
#gnav ul.gnav li.nav.works a:hover,
#gnav ul.gnav li.nav.aboutus a:hover,
#gnav ul.gnav li.nav.recruit a:hover,
#gnav ul.gnav li.nav.contact a:hover,
#gnav ul.gnav li.nav.staffblog a:hover
{
background:#F00;
text-decoration:none;
}

#titleback
{
width:100%;
position:relative;
}

#titleback img
{
width:100%;
}
}



@media screen and (max-width: 479px) {

#gnav ul.gnav li
{
float:left;
width:50%;
}

#gnav ul.gnav li.nav.home
{
display: none;
}

#gnav ul.gnav li.nav a,
#gnav ul.gnav li.nav.home a,
#gnav ul.gnav li.nav.info a,
#gnav ul.gnav li.nav.works a,
#gnav ul.gnav li.nav.aboutus a,
#gnav ul.gnav li.nav.recruit a
{

height: auto;
text-indent:0px;
display: block;
width: auto;
padding:0em 0.8em;
font-size:80%;
background:#111;
text-align:center;
color:#eee;
border-right:1px dotted #666;
border-bottom:1px dotted #666;
box-sizing:border-box;
}

#gnav ul.gnav li.nav.contact a,
#gnav ul.gnav li.nav.staffblog a
{
height: auto;
text-indent:0px;
display: block;
width: auto;
padding:0em 0.8em;
font-size:80%;
background:#111;
text-align:center;
color:#eee;
border-right:1px dotted #666;
border-bottom:none;
box-sizing:border-box;
}


}


@media only screen and (-webkit-min-device-pixel-ratio: 2),only screen and (min-device-pixel-ratio: 2) {
	
#siteid a,
.home #siteid a
{
width: 100%;
margin: 0px auto;
background: url(../images/lib/siteid/siteid01@2x.png) top center no-repeat;
background-size: contain;
}

}