@charset "utf-8";
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:13px;
	color: #444;
	vertical-align:baseline;
	background:transparent;
}

body {
	line-height:1;
}

html { line-height: 0;}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
	display:block;
}

nav ul {
	list-style:none;
}

blockquote, q {
	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}

a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
    text-decoration: none;
	color:444;
}

a:hover {
	opacity: 0.5;
}

a:visited {
	color:444;
}


/* change colours to suit your needs */
ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}

/* change colours to suit your needs */
mark {
	background-color:#ff9;
	color:#000; 
	font-style:italic;
	font-weight:bold;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom:1px dotted;
	cursor:help;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

/* change border colour to suit your needs */
hr {
	display:block;
	height:1px;
	border:0;   
	border-top:1px solid #cccccc;
	margin:1em auto;
	padding:0;
    max-width:1000px; 
}

input, select {
	vertical-align:middle;
}

li {
	list-style: none;
}

/*****************

clearfix

*****************/
.clearfix:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
}

.clearfix {
		display: inline-table;
		min-height: 1%;
}

/* Hides from IE-mac */
* html .clearfix {
		height: 1%;
}
.clearfix {
		display: block;
}
/* End hide from IE-mac */



/* setting */
body {
	font-family:"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	/* font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; */
	line-height: 1.5;
	color: #444;
	-webkit-text-size-adjust: 100%;
    letter-spacing: 1px;
}

.pc_disp {display: block;}
.sp_disp {display: none;}
.pc_img {display: inline-block;}
.sp_img {display: none;}

a img:hover,
input[type=image]:hover {
    opacity:0.5;
}

a:hover {
    -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

h1 { display: none; }

#wrapper {
    width: 100%;
}

/*header */
header #header {
    background: rgba(255,255,255,1.00);
	height: 60px;
	width: 100%;
}

header .logo {
	margin: 30px auto 0;
	text-align: center;
}


header .subnav {
    width: auto;
    margin: auto;
    position: absolute;
    right:2%;
	top:0;
}

header .subnav li:hover {
	opacity: 0.6;
}

header .subnav .header_contact {
    width: 130px;
    color: #FFF;
    text-align: center;
    padding: 6px 0px;
    float: left;
	background: #ddc17f;
}

header .subnav .header_recruit {
    width: 130px;
    color: #FFF;
    text-align: center;
    padding: 6px 0px;
    float: left;
	background: #000;
}

header h1 {
    text-align: center;
    font-size: 25px;
    color: #FFF;
    position: relative;
    top: 55px;
}

header nav a {
    color: #000;
}

header nav  {
    width: 100%;
	max-width: 1000px;
    margin: auto;
    text-align: center;
    background: #FFF;
}

header nav ul {
    display: table;
	text-align: center;
	margin: auto;
}

header nav li {
    padding: 18px 15px 20px 15px;
    vertical-align: top;
    letter-spacing: 1px;
	display: table-cell;
}


/*detail btn */

.btn_box_black {
    clear: both;
	width: 250px;
    color: #fff;
	background: #000;
    text-align: center;
    padding: 15px 0;
    margin: 30px auto;
    letter-spacing: 4px;
	display: block;
}

.btn_box_white {
    clear: both;
    color: #000;
	background: #fff;
    text-align: center;
    padding: 15px 30px;
    margin: 0;
    letter-spacing: 2px;
	border: solid 1px #000;
	width: 380px
}


/* Contact */

.contact_box {
	width: 100%;
	padding: 100px 0 100px;
	margin: 50px 0 200px;
	background: url(../img/top/bg_contact.png) top center no-repeat;
	background-size: 110%;
	overflow: hidden;
}

.contact_inner {
	width: 90%;
	max-width: 1000px;
	margin: auto;
	text-align: left;
}

.contact_box h2 {
	margin-bottom: 50px;
}

.contact_box .contact_inner .contact_detail p {
	float: left;
	margin: 0 30px 15px 0;
}




/* footer */

footer {
    width: 90%;
	max-width: 1000px;
    background: rgba(255,255,255,1.00);
    text-align: center;
    margin: 50px auto 10px;
	border-top:  solid 1px #ddd;
}

footer .footer_inner img {
	padding: 150px 0 100px;
}

footer a,
footer a:hover,
footer a:active,
footer a:visited {
    color: #000;
}

.pagetop {
	position: fixed;
	bottom:20px;
	right: 40px;
	opacity: 0.7;
}


/*txt setting */
.txt_box { margin: 20px auto;}
.txt_box p { margin-bottom: 30px; line-height: 180%;}
.txt_lead {
    font-size: 100%;
	padding: 30px 0 50px;
	line-height: 1.8;
}

.txt_s { font-size: 80%;}

.txt_cnt { text-align: center;}
.txt_left { text-align: left;}
.txt_cc { 
    font-size: 140%;
	border-top: solid 1px #000;
	display: inline-block;
	padding: 20px 0;
	margin: 70px 0 10px;
}
.txt_normal { letter-spacing: 2px;}
.txt_right {text-align: right;}

.txt_pagettl {
    text-align: center;
    padding: 40px 0;
    font-size: 230%;
    letter-spacing: 1px;
	background: rgba(239,233,218,1.0);
	color: #000;
	clear: both;
}


strong { font-weight: bold; color: #0096af;}


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


    
	.pc_disp {display: none;}
	.sp_disp {display: block;}
	.pc_img {display: none;}
	.sp_img {display: inline-block;}
	
	
	/* Header */

	header #header {
		height: 50px;
	}
	
	header .logo img {
		width: 50%;
	}
    
	header nav a {
    	color: #FFF;
	}

	header nav  {
    	width: 100%;
    	margin: auto;
    	text-align: left;
	}

	header nav ul {
    	width: 100%;
    	display: block;
	}

	header nav li {
    	padding: 0;
    	display: block;
    	font-size: 100%;
    	width: 100%;
    	border-left: none;
    	border-bottom: .5px #FFF solid;
    	vertical-align: top;
    	letter-spacing: 2px;
    	float: none;
	}
	
	
	
	/* Contact */
	
	.contact_box {
		background: url(../img/top/bg_contact.png) top left no-repeat;
		background-size: 170%;
		margin: 50px 0 40px;
	}
	
	.contact_box img {
		width: 100%;
	}
	
	.contact_box h2 img {
		width: 60%;
		margin: auto;
	}
	
	.contact_box .contact_inner .contact_detail p {
		float: none;
		margin: 0 0 30px 0;
	}
	
	
	/* Footer */

	footer {
    	margin: o auto 10px;
		border-top:  solid 1px #ddd;
	}

	footer .footer_inner img {
		padding: 50px 0 30px;
		width: 60%;
	}
	
	.pagetop {
		position: fixed;
		bottom:15px;
		right: 15px;
		opacity: 0.7;
	}
	
	.pagetop img {
		width: 80%;
	}

	
	.txt_pagettl {
    	text-align: center;
    	padding: 40px 0;
    	font-size: 180%;
    	letter-spacing: 1px;
		background: rgba(239,233,218,1.0);
		color: #000;
		clear: both;
}

	.txt_cc { 
    	font-size: 120%;
    	font-weight: bold;
		letter-spacing: 0px;
	}
    
    
	.btn_box_black {
    	width: 70%;
    	margin: 30px auto;
		font-size: 90%;
    }
	
	.btn_box_white {
    	width: 80%;
    	margin: 0 auto;
		font-size: 90%;
	}
    
    
	/* navigation */
	.toggle {
    	position: fixed; /* bodyに対しての絶対位置指定 */
    	right: 10px;
    	top: 10px;
    	display: block;
    	width: 50px;
    	height: 50px;
    	cursor: pointer;
    	z-index: 3;
    	background:rgba(255,255,255,0.70)
	}
	.toggle span {
    	display: block;
    	position: absolute; /* .toggleに対して */
    	width: 70%;
    	border-bottom: solid 1px #333;
    	-webkit-transition: .35s ease-in-out;
    	-moz-transition: .35s ease-in-out;
    	transition: .35s ease-in-out;
    	padding-top: 5px;
    	right: 7px;
	}
	.toggle span:nth-child(1) {
    	top: 8px;
	}
	.toggle span:nth-child(2) {
    	top: 20px;
	}
	.toggle span:nth-child(3) {
    	top: 32px;
	}
	
	/* 最初のspanをマイナス45度に */
	.toggle.active span:nth-child(1) {
    	top: 20px;
    	left: 6px;
    	-webkit-transform: rotate(-45deg);
    	-moz-transform: rotate(-45deg);
    	transform: rotate(-45deg);
	}
	/* 2番目と3番目のspanを45度に */
	.toggle.active span:nth-child(2),
	.toggle.active span:nth-child(3) {
    	top: 20px;
		left: 9px;
    	-webkit-transform: rotate(45deg);
    	-moz-transform: rotate(45deg);
    	transform: rotate(45deg);
	}
	
	.toggle.active span:nth-child(2) {
		opacity: 0;	
	}
    
	/* .global_nav */
	.global_nav {
    	position: fixed;
    	top: 0;
    	left: 0;
    	width: 100%;
    	transform: translateY(-100%);
    	z-index: 2;
    	padding-top: 0px;
    	text-align: left;
    	color: #FFF;
    	background:rgba(51,51,51,0.95);
    	transition: all 0.8s;  
	}
    

	.global_nav .nav_li {
    	width: 100%;
    	padding: 15px 0;
    	background: url(../img/common/icon_arrow_W.png) no-repeat;
    	background-position: center left 10px;
    	list-style-type: none;
	}

	.global_nav .nav_li:hover {
    	background: rgba(0,0,0,0.80);
    	}
    
	.global_nav .nav_li a {
    	display: block;
    	color: #FFF;
	}
    
	/* .global_navに.activeが追加 */
	.global_nav.active {
    	transform: translateY(0%);
    	z-index: 1;
	}
    
}