@charset"utf-8";
/*
AUTO CRAFT Web Site ver.1  --  Primary CSS
Latest Updated : 17 Feb. 2024
*/

/**
 * Table of Contents
 *
 * 1.0 - Typography
 * 2.0 - Alignment
 * 3.0 - Links
 * 4.0 - Navigations
 * 5.0 - layout
 * 6.0 - Clearfix
 * 7.0 - Forms
 * ex. - Media Queries
 *
 */

/* **************************************************************************** */
/*
/* 1.0 Typography
/*
/* **************************************************************************** */


/**
 * 1.1 Import fonts
 */


/**
 * 1.2 Typo
 */

body,
button,
input,
select,
textarea {
	font-family:"Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", sans-serif;
	font-size: 1.5rem;
	line-height: 1;
	color: #000;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-weight:700; line-height:1.5;
}
h1 + h2,
h2 + h3,
h3 + h4,
h4 + h5,
h5 + h6 { margin-top:0 !important;}

h1	{ font-size:3rem;}
h2	{ font-size:2.6rem;}
h3	{ font-size:2rem;}
h4	{ font-size:1.6rem;}
h5	{ font-size:1.4rem;}
h6	{ font-size:1.4rem;}

article h1,
article h2,
article h3 { margin:2em 0 1.5em;}
article h4,
article h5,
article h6 { margin:2em 0 0.5em;}

section h1:first-child, section h2:first-child, section h3:first-child, section h4:first-child, section h5:first-child, section h6:first-child,
.content h1:first-child, .content h2:first-child, .content h3:first-child, .content h4:first-child, .content h5:first-child, .content h6:first-child,
.page-content h1:first-child, .page-content h2:first-child, .page-content h3:first-child, .page-content h4:first-child, .page-content h5:first-child, .page-content h6:first-child,
.entry-content h1:first-child, .entry-content h2:first-child, .entry-content h3:first-child, .entry-content h4:first-child, .entry-content h5:first-child, .entry-content h6:first-child,
.section-content h1:first-child, .section-content h2:first-child, .section-content h3:first-child, .section-content h4:first-child, .section-content h5:first-child, .section-content h6:first-child 
{ margin-top:0 !important;}

p {}
article p { margin-bottom:1.6em; line-height:1.8;}

b,
strong 	{ font-weight: 700;}

em		{ font-style: normal;}

dfn,
cite,
i { font-style: italic;}

blockquote {
	border-left: 4px solid #707070;
	border-left: 4px solid rgba(51, 51, 51, 0.7);
	color: #707070;
	color: rgba(51, 51, 51, 0.7);
	font-size: 18px;
	font-size: 1.8rem;
	font-style: italic;
	line-height: 1.6667;
	margin-bottom: 1.6667em;
	padding-left: 0.7778em;
}

blockquote p { margin-bottom: 1.6667em;}
blockquote > p:last-child { margin-bottom: 0;}

blockquote cite,
blockquote small {
	color: #333;
	font-size: 15px;
	font-size: 1.5rem;
	font-family: "Noto Sans", sans-serif;
	line-height: 1.6;
}

blockquote em,
blockquote i,
blockquote cite {
	font-style: normal;
}

blockquote strong,
blockquote b {
	font-weight: 400;
}

address {
	font-style: normal;
	margin: 0;
}

code,
kbd,
tt,
var,
samp,
pre {
	font-family: Inconsolata, monospace;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

pre {
	background-color: transparent;
	background-color: rgba(0, 0, 0, 0.01);
	border: 1px solid #eaeaea;
	border: 1px solid rgba(51, 51, 51, 0.1);
	line-height: 1.2;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 0.8em;
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

abbr[title] {
	border-bottom: 1px dotted #eaeaea;
	border-bottom: 1px dotted rgba(51, 51, 51, 0.1);
	cursor: help;
}

mark,
ins 	{ background-color: #fff9c0; text-decoration: none;}

sup,
sub 	{ font-size: 75%; height: 0; line-height: 0; position: relative; vertical-align: baseline;}
sup		{ bottom: 1ex;}
sub		{ top: .5ex;}

small	{ font-size: 75%;}

big		{ font-size: 125%;}




/**
 * - 1.3 Lists
 */

ul,
ol {list-style-position:outside; list-style:none;}
ul {}
ol {}

li > ul,
li > ol {
	margin: 1em 0 1em 1.3333em;
}
li > ol li:before {}

nav ul { margin:0;}
h1 + ul,
h2 + ul,
h3 + ul,
h4 + ul,
h5 + ul,
h6 + ul,
h1 + ol,
h2 + ol,
h3 + ol,
h4 + ol,
h5 + ol,
h6 + ol { margin-top:0 !important;}

ul.square,
ul.circle		{ margin: 1.6em 0 1.6em; text-align:left; line-height:1.5;}
ul.square li,
ul.circle li	{ position:relative; margin:0 0 1em; padding:0 0 0 16px;}
ul.square li:before	{ position:absolute; top:4px; left:0; content:''; width:12px; height:12px; background-color:#000; border:0;}
ul.circle li:before	{ position:absolute; top:5px; left:0; content:''; width:12px; height:12px; border:1px solid #464646; border-radius:100px;}


dl { margin-bottom: 1.6em; line-height:1.5;}
dt { font-weight: bold;}
dd { margin-bottom: 1.6em;}



/**
 * - 1.4 Table
 */

table,
th,
td {
	border: 1px solid #eaeaea;
	border: 1px solid rgba(51, 51, 51, 0.1);
}

table {
	border-collapse:collapse;
	border-spacing: 0;
	border-width: 1px 0 0 1px;
	margin: 0 0 1.6em;
	table-layout: fixed; /* Prevents HTML tables from becoming too wide */
	width: 100%;
}

caption,
th,
td { padding: 0.4em; text-align:left; font-weight:normal;}
th { border-width: 0 1px 1px 0; font-weight: 700;}
td { border-width: 0 1px 1px 0;}

caption { margin:0.2em 0; color:#666; caption-side:bottom;}

thead th { vertical-align:middle; font-weight:bold; background-color:#7F9FE1;}
thead td { vertical-align:middle;}

tbody th { vertical-align:middle; background-color:#CFDCF6;}
tbody td { vertical-align:middle; border-color:#ccc; border-width:1px 1px 1px 1px;}

tfoot 	 { border-top:3px double #999;}
tfoot th { vertical-align:middle; font-weight:bold; background-color:#7F9FE1;}
tfoot td { vertical-align:middle;}

table ul,
table ol { margin:.6em 0 .6em 0em; list-style-position:outside; line-height:1.25;}
table ul li:before { top:4px !important;}

table.text-align-center,
table.text-align-center th,
table.text-align-center td,
tr.center th,
tr.center td,
th.center,
td.center { text-align:center;}

.yscroll	{ width:100%; overflow:scroll;}
.yscroll table	{ table-layout:auto;}
.yscroll::-webkit-scrollbar			{ height: 5px;}
.yscroll::-webkit-scrollbar-track	{ background: #F1F1F1;}
.yscroll::-webkit-scrollbar-thumb	{ background: #BCBCBC;}



/**
 * - 1.5 Elements
 */

::selection {background:#FA7402; color:#000;}
::-moz-selection { background:#FA7402; color:#000;}

hr {
	background-color: #eaeaea;
	background-color: rgba(51, 51, 51, 0.1);
	border: 0;
	height: 1px;
	margin-bottom: 1.6em;
}
hr.none { background-color:transparent;}

img {
	-ms-interpolation-mode: bicubic;
	border: 0;
	height: auto;
	max-width: 100%;
	vertical-align: bottom;
}
.image img { width:100%;}

figure 		{ margin:0 auto;}
figcaption 	{}

del { opacity: 0.8;}




/**
 * - 1.6 Decoration
 */

.attention { color:#f00;}
.note		{ font-size:13px; font-size:1.3rem; line-height:1.5; color:#666;}
.caption	{ font-size:13px; font-size:1.3rem; line-height:1.5; color:#666;}
.wp-caption-text{ margin:0.8rem 1.2rem 1.6rem; font-size:13px; font-size:1.3rem; line-height:1.5 !important; color:#666;}
.lead	{ line-height:2.5;}

.border 	{ border-bottom:1px solid #999;}
.bordered 	{ padding:0.8em; border:1px solid #6699FF; border-radius:5px;}
.filled		{ padding:0.5em 0.8em; background-color:#ededed;}
.filledwrap .filled { background-color:#fff;}

/* color */
.dark	{ color:#000;}
.pale	{ color:#999;}

/* family */
.serif	{ font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
.sans	{ font-family: azo-sans-web, 'Roboto', Helvetica, sans-serif;}

/* style */
.normal	{ font-style: normal;}
.italic	{ font-style: italic;}




/* **************************************************************************** */
/*
/* 2.0 Alignments
/*
/* **************************************************************************** */

.alignleft {
	display: inline;
	float: left;
	margin:0 2.6rem 1rem 0;
}

.alignright {
	display: inline;
	float: right;
	margin:0 0 1rem 2.6rem;
}

.aligncenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 1rem;
}

.left	{ text-align:left;}
.right	{ text-align:right;}
.center	{ text-align:center;}



/* **************************************************************************** */
/*
/* 3.0 Links
/*
/* **************************************************************************** */

a {
	color: #141E3C;
	text-decoration: none;
	outline:none;
	transition:all 0.2s ease;
}

a:hover,
a:focus {
	color:#0091FF;
}

nav a { text-decoration:none;}

a[href^="tel:"] {
	color:#000; cursor:default;
}

a.btn img	{ transition:all .2s ease;}
a.btn:hover img	{ opacity:0.6;}




/* **************************************************************************** */
/*
/* 4.0 Navigation
/*
/* **************************************************************************** */



/**
 * - Header navigation
 */
#headnav	{}
#headnav .menu	{ display:none; font-size:0;}
#headnav .menu li	{ display:inline-block; font-size:1.4rem;}
#headnav .menu li a	{ display:block; position:relative; padding:2.2rem 1.5rem 2.1rem; color:#000;}
#headnav .menu li a small	{ display:block; margin:1rem 0 0; font-size:1.0rem; font-weight:500; font-family:azo-sans-web, sans-serif; text-transform:uppercase;}
#headnav .menu li a small	{ display:none;}
#headnav .menu li a:after	{ position:absolute; bottom:0px; left:50%; content:''; width:0; height:0; border-bottom:2px solid #141E3C; transition:all 0.2s ease;}
#headnav .menu li a:hover:after	{ left:10%; width:80%;}
#headnav .menu li a:active	{ color:#0091FF;}

#headnav .menu li.current-menu-item a,
#headnav .menu li.current-menu-ancestor a { color:#141E3C;}
#headnav .menu li.current-menu-item a:after,
#headnav .menu li.current-menu-ancestor a:after	{ left:10%; width:80%;}

#headnav .menu-recruit	{ display:block; position:absolute; top:0; right:50px; font-size:0;}
#headnav .menu-recruit li	{ display:inline-block; margin:0 !important; font-size:.8rem;}
#headnav .menu-recruit li a	{ 
	display:block; position:relative; margin:0 0 0 1px; padding:3.3rem 0 0.8rem; 
	width:60px; color:#141E3C !important; 
	background-color:transparent; background-repeat:no-repeat; background-position:center top 6px; background-size:24px;
}
#headnav .menu-recruit li.rn_rec a	{ background-image:url(../images/icon-boshu-b.png);}
#headnav .menu-recruit li.rn_ent a	{ background-image:url(../images/icon-entry-b.png);}
.bg #headnav .menu-recruit li a	{ color:#fff !important;}
.home .bg #headnav .menu-recruit li.rn_rec a	{ background-image:url(../images/icon-boshu.png);}
.home .bg #headnav .menu-recruit li.rn_ent a	{ background-image:url(../images/icon-entry.png);}
.home #headnav .menu-recruit li.rn_rec a	{ background-image:url(../images/icon-boshu-b.png);}
.home #headnav .menu-recruit li.rn_ent a	{ background-image:url(../images/icon-entry-b.png);}


.page-business #headnav .menu li.hn_bus a:after { left:10%; width:80%; border-color:#0091FF;}
.page-interview #headnav .menu li.hn_int a:after { left:10%; width:80%; border-color:#0091FF;}
.page-facilities #headnav .menu li.hn_fac a:after { left:10%; width:80%; border-color:#0091FF;}
.page-company #headnav .menu li.hn_com a:after { left:10%; width:80%; border-color:#0091FF;}
.page-recruit #headnav .menu li.hn_rec a:after { left:10%; width:80%; border-color:#0091FF;}
.page-contact #headnav .menu li.hn_con a:after { left:10%; width:80%; border-color:#0091FF;}







/**
 * - Buttons
 */
div.btn	{ display:block;}
div.btn a	{ position:relative; display:inline-block; padding:1.8rem 3rem; min-width:290px; text-align:center; font-size:1.4rem; line-height:1.4; text-decoration:none; color:#464646; background-color:#fff; border:1px solid #464646;}
div.btn a:after	{ position:absolute; top:50%; right:10px; content:''; margin:-4px 0 0; width:7px; height:7px; border:solid #464646; border-width:1px 1px 0 0; transform:rotate(45deg);}
div.btn a:hover	{ background-color:#E6E6E6;}

div.btn-w a	{ color:#fff; background-color:transparent; border-color:#fff;}
div.btn-w a:after	{ border-color:#fff;}
div.btn-w a:hover	{ color:#464646; background-color:#fff;}
div.btn-w a:hover:after	{ border-color:#464646;}

span.btn	{ }
span.btn a	{ position:relative; display:inline-block; padding:0 0 0 12px; text-decoration:underline;}
span.btn a:before	{ position:absolute; top:50%; left:0; content:''; margin:-4px 0 0; width:7px; height:7px; border:solid #464646; border-width:1px 1px 0 0; transform:rotate(45deg);}
span.btn a:hover	{ color:#FA7402}


/**
 * - Page top button
 */
#pagetop a { position:fixed; bottom:1rem; right:1rem; z-index:99; width:40px; height:40px; background-color:#002355; background-color:rgba(0,35,85,.9); border-radius:100%; transition:background-color 0.2s ease;}
#pagetop a:after	{ position:absolute; top:40%; left:calc(50% - 5px); content:''; width:10px; height:10px; border:solid #fff; border-width:2px 2px 0 0; transform:rotate(-45deg); transition:all 0.2s ease;}
#pagetop a:hover 	{ background-color:rgba(0,35,85,1);}
#pagetop a:hover:after 	{ top:30%;}
#pagetop.fixed a { position:absolute;}




/*
 * drawer navigation
 */

.drawer-nav		{ position:fixed; z-index:900; top:-100vh; left:0; width:100%; height:100vh; color:#222; background-color:#141E3C; overflow-y:auto; -webkit-overflow-scrolling:touch; transform:translateY(-100px); opacity:1; transition:all 0.25s;}
.drawer-overlay	{ display:none; position:fixed; z-index:1; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.2);}
.drawer-open .drawer-overlay	{ display:block;}

.drawer-hamburger		{ 
	cursor:pointer; position:fixed; z-index:901; top:10px; right:10px; 
	display:block; box-sizing:content-box; width:30px; padding:0 0 10px; font-size:0; 
	-webkit-transition:all .6s cubic-bezier(.19,1,.22,1); transition:all .6s cubic-bezier(.19,1,.22,1); 
	-webkit-transform:translateZ(0); transform:translateZ(0); 
	border:0; outline:0; background-color:transparent;
}
.drawer-hamburger:hover,
.drawer-hamburger:focus	{ border:0; background-color:transparent}
.drawer-hamburger-icon	{ position:relative; display:block; margin-top:14px}
.drawer-hamburger-icon,.drawer-hamburger-icon:after,
.drawer-hamburger-icon:before	{ width:100%; height:1px; -webkit-transition:all .6s cubic-bezier(.19,1,.22,1); transition:all .6s cubic-bezier(.19,1,.22,1); background-color:#141E3C;}
.wh .drawer-hamburger-icon,.wh .drawer-hamburger-icon:after,.wh .drawer-hamburger-icon:before	{ background-color:#fff;}
.drawer-hamburger-icon:after,.drawer-hamburger-icon:before { position:absolute; top:-10px; left:0; content:" "}
.drawer-hamburger-icon:after	{ top:10px}

.drawer-open .drawer-hamburger {}
.drawer-open .drawer-hamburger-icon	{ background-color:transparent}
.drawer-open .drawer-hamburger-icon:after,
.drawer-open .drawer-hamburger-icon:before	{ top:0; background-color:#fff;}
.drawer-open .drawer-hamburger-icon:after	{ -webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.drawer-open .drawer-hamburger-icon:before	{ -webkit-transform:rotate(45deg); transform:rotate(45deg);}
.drawer-open .drawer-nav {
	display:block; top:0;
	transform:scale(1); opacity:1;
}

.drawernav-container	 { padding:0 0 136px;}
.drawernav-container ul	 { margin:0; padding:0; list-style:none;}
.drawer-menu	{}
.drawer-nav ul li	{ margin:0; text-align:left; font-size:1.5rem; font-weight:normal; letter-spacing:0em; border-bottom:1px solid rgba(255,255,255,.4);}
.drawer-nav ul li small	{ display:none; font-family:azo-sans-web, sans-serif; margin-left:1em; font-size:1.2rem; font-weight:500; color:#818797;}
.drawer-nav ul li a	{ position:relative; display:block; padding:1.4rem 1.2em; color:#fff; text-decoration:none; background-color:transparent;}
.drawer-nav ul li a:before	{ position:absolute; top:50%; right:20px; content:''; margin:-4px 0 0; width:7px; height:7px; border:solid #fff; border-width:1px 1px 0 0; transform:rotate(45deg);}
.drawer-nav ul li a:hover	{ background-color:#2F56CC;}
.drawer-nav .sub-menu	{ border-top:1px dashed rgba(255,255,255,.4);}
.drawer-nav .sub-menu li	{ padding-left:1.5em; border-bottom:1px dashed rgba(255,255,255,.4);}
.drawer-nav .sub-menu li:last-child	{ border-bottom:0;}

.drawer-home	{ position:relative; padding:0 50px 0 13px; text-align:left;}
.drawer-home .site-logo	{ display:inline-block; padding:16px 0;}
.drawer-home .site-logo a	{ display:block;
	width:164px; height:28px;
	text-indent:200%; white-space:nowrap; overflow:hidden;
	background:url(../images/logo-autocraft-wh.svg) no-repeat 0 0 / 164px auto;
}

@media screen and (min-width: 1024px) {
	.drawer,
	.drawer-nav,
	.drawer-hamburger	{ display:none;}
}

@media print {
	.drawer,
	.drawer-nav,
	.drawer-hamburger	{ display:none;}
	.ef	{ transform:translateY(0); visibility:visible !important; opacity:1 !important;}
}



/* **************************************************************************** */
/*
/* 5.0 layout
/*
/* **************************************************************************** */

body{
	text-align:center;
}
body.fixed	{
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.not	{ margin-top:0 !important; vertical-align:top;}
.nor	{ margin-right:0 !important;}
.nob	{ margin-bottom:0 !important;}
.nol	{ margin-left:0 !important;}

.nobt	{ border-top:none !important;}
.nobr	{ border-right:none !important;}
.nobb	{ border-bottom:none !important;}
.nobl	{ border-left:none !important;}

.bt		{ border-top:1px solid #ccc !important;}
.br		{ border-right:1px solid #ccc !important;}
.bb		{ border-bottom:1px solid #ccc !important;}
.bl		{ border-left:1px solid #ccc !important;}

.skip-link	{ display:none; font-size:0;}
.screen-reader-text { font-size:0;}
.hide	{ display:none;}
.sm		{ display:block;}
.md		{ display:none;}
.lg		{ display:none;}
.check { position:fixed; z-index:9999;}



/**
 * - 5.1 loading
 */

#loading { 
	position:fixed; top:0; right:0; bottom:0; left:0; z-index:999; width:100vw; height:100vh; color:#fff; background-color:rgba(20,30,60,0);
}
#loading .wrap	{ 
	position: fixed; top:-50vh; right:auto; bottom:auto; left:-50vw; width:200vw; height:200vh;
	transform-origin:50% 50%;
}
#loading.loaded .wrap	{ 
	animation:"loaded" 1.2s ease-out 0.0s 1 normal forwards;
	-webkit-animation:"loaded" 1.2s ease-out 0.0s 1 normal forwards;
}
#loading .left	{
	position:absolute; top:0; left:0; z-index:1; width:100%; height:100vh; background-color:rgba(20,30,60,1);
}
#loading .right	{ 
	position:absolute; top:auto; bottom:0%; right:0; z-index:2; width:100%; height:100vh; background-color:rgba(20,30,60,1);
}
#loading .logo	{ position:absolute; z-index:3; top:calc(50% - 7px); left:calc(50% - 80px); width:160px; height:14px; background:url(../images/logo-autocraft-wh.svg) no-repeat left center / 160px auto;
	animation:"logomotion" 1s ease 0s 1 normal both;
	-webkit-animation:"logomotion" 1s ease 0s 1 normal both;
}
#loading .text	{ display:none !important; position:absolute; z-index:3; top:calc(50% - 18px); left:0; width:100%; text-align:center; font-family:"Roboto",sans-serif; font-size:0.9rem; letter-spacing:0;
	animation:"loadingtext" 0.2s ease 0s infinite normal;
	-webkit-animation:"loadingtext" 0.2s ease 0s infinite normal;
}
#loading .bar	{ display:none !important; position:absolute; z-index:4; top:50%; left:calc(50vw - 35px); width:70px; height:0;}
#loading .bar:before{ position:absolute; top:0; left:0; content:''; width:70px; height:0; border-top:1px solid #aaa;}
#loading .bar:after { position:absolute; top:0; left:0; content:''; width:35px; height:0; border-top:1px solid #666; 
	animation:"loadingbar" 2s ease-in-out 0s infinite normal;
	-webkit-animation:"loadingbar" 2s ease-in-out 0s infinite normal;
}

@keyframes logomotion {
	0%	{ width:0;}
	100%{ width:160px;}
}
@keyframes loadingtext {
	0%	{ opacity:0.7;}
	50%	{ opacity:1.0;}
	100%{ opacity:0.7;}
}
@-webkit-keyframes loadingtext {
	0%	{ opacity:0.7;}
	50%	{ opacity:1.0;}
	100%{ opacity:0.7;}
}
@keyframes loadingbar {
	0%	{ left:0;	right:auto;	width:0;}
	12%	{ left:0;	right:auto;	width:100%;}
	13%	{ left:auto;right:0;	width:100%;}
	25%	{ left:auto;right:0;	width:0;}
	50%	{ left:auto;right:0;	width:0;}
	62%	{ left:auto;right:0;	width:100%;}
	63%	{ left:0;	right:auto;	width:100%;}
	75%	{ left:0;	right:auto;	width:0;}
	100%{ left:0;	right:auto;	width:0;}
}
@-webkit-keyframes loadingbar {
	0%	{ left:0;	right:auto;	width:0;}
	12%	{ left:0;	right:auto;	width:100%;}
	13%	{ left:auto;right:0;	width:100%;}
	25%	{ left:auto;right:0;	width:0;}
	50%	{ left:auto;right:0;	width:0;}
	62%	{ left:auto;right:0;	width:100%;}
	63%	{ left:0;	right:auto;	width:100%;}
	75%	{ left:0;	right:auto;	width:0;}
	100%{ left:0;	right:auto;	width:0;}
}
@keyframes loaded {
	0%	{ transform:rotate(0deg); height:200vh; top:-50vh;}
	100%{ transform:rotate(10deg); height:300vh; top:-100vh; opacity:1;}
}




/**
 * - 5.2 wrapper Include
 */

#wrapper 		{ margin:0 auto;}
#headerwrap 	{ position:fixed; width:100%; z-index:99; background-color:rgba(255,255,255,.95); transition:all 0.4s ease;}
#headerwrap.bg 	{ background-color:rgba(255,255,255,.0);}
#containerwrap 	{ }
#footerwrap 	{ background-color:#141E3C;}



/**
 * - 5.3 Header Include
 */
.site-header{ position:relative;}
#branding .site-title	{ 
	margin:0; padding:16px 0 16px 13px; width:244px;
}
#branding .site-title a	{ 
	display:block;
	height:16px;
	text-indent:200%; white-space:nowrap; overflow:hidden;
	background:url(../images/logo-autocraft.svg) no-repeat 0 0 / 164px auto;
}
#headerwrap.bg #branding .site-title a {
	background-image:url(../images/logo-autocraft-wh.svg);
}


/**
 * - 5.4 container Include
 * #container > article > .content
 * 	.page-header
 * 	.page-title	
 * 	.page-content
 * 
 * #container > section > .content
 * 	.section-header	{}
 * 	.section-title	{}
 * 	.section-content{}
 * 
 */

#container	{ position:relative; text-align:left;}
.content	{}

article			{ margin:0 auto;}
section			{}
.page-content section 	{}
.entry-content section 	{}
.archive-content section{}

.page-header	{}
.page-title		{}
.page-content	{}

.entry-header	{}
.entry-title	{}
.entry-content	{}

.archive-header	{}
.archive-title	{}
.archive-content{}

.section-header	{}
.section-title	{}
.section-content{}

.googlemap { position:relative; margin:0 0 2rem; padding:420px 0 0; height:0; overflow:hidden; background-color:#f0f0f0;}
.googlemap iframe,
.googlemap object,
.googlemap embed { position:absolute; top:0; left:0; width:100%; height:100%;}




/**
 * - 5.5 footer Include
 */

.site-footer	{ position:relative; margin:0 auto; padding:6rem 5%; color:#fff;}
.site-footer .data	{ margin:0 auto 3rem; }
.site-footer .site-title	{ 
	display:block;
	margin: 0 0 2rem; padding:24px 0 0; font-size:1.2rem; font-weight:bold;
	background:url(../images/logo-autocraft-wh.svg) no-repeat center top / 164px auto;
}
.site-footer address	{ display:inline-block; margin:0 auto; padding:0 0 10px; text-align:left; font-size:1.3rem; color:#fff;}
.site-footer .tel		{ margin:0 auto 0.4rem; color:#fff;}
.site-footer .tel span	{}
.site-footer .tel a		{ color:#fff;}

.site-footer .btns	{ margin:0 0 2.4rem; text-align:left;}
.site-footer .btns .btn	{ display:inline-block;}
.site-footer .btns .btn:first-child	{ margin-right:10px;}
.site-footer .btns .btn a	{ padding:1.3rem 2rem; font-size:1.3rem; min-width:auto; background-color:transparent;}
.site-footer .btns .btn a:hover { background-color:#fff;}

#featurenav	{ margin:0 auto; padding:40px 5% 10px; max-width:1080px;}
#featurenav ul	{ font-size:0;}
#featurenav li	{ margin-bottom:22px;}

#footnav	{ font-size:1.4rem; text-align:left;}
#footnav ul	{}
#footnav li	{ margin:0 0 1.4rem;}
#footnav a	{ position:relative; padding:0 0 0 18px; color:#fff; transition:all .2s ease;}
#footnav a:before	{ position:absolute; top:50%; left:0; content:''; margin:-4px 0 0; width:7px; height:7px; border:solid #fff; border-width:1px 1px 0 0; transform:rotate(45deg); transition:all .2s ease;}
#footnav a:hover:before	{ left:4px;}

#copyright	{ margin:0; padding:4.5rem 0 0rem;}
#copyright p{ margin:0; text-align:center; font-size:1.1rem;}



/**
 * - 5.6 Column Layout
 */

/* 2column
----------------------------------------------- */
.col2 { margin:0 0 2rem; text-align:center;}
.col2 > div { display:block; margin:0 0 1.6rem; width:auto; text-align:left;}
.col2 .content	{ padding:0 4%;}


/* 3column
----------------------------------------------- */
.col3 { text-align:center; font-size:0;}
.col3 > div { display:block; text-align:left; font-size:1.4rem;}
.col3 .content	{ padding:0 4%;}





/* **************************************************************************** */
/*
/* 6.0 - clearfix
/*
/* **************************************************************************** */

.cf::after,
.content::after	{ content: ""; display: block; clear: both;}





/* **************************************************************************** */
/*
/* 7.0 Forms
/*
/* **************************************************************************** */

.searchform	{ font-size:0; border-bottom:solid #1B4058; border-width:0 0 2px 0;}
.searchform input[type="text"]	{ vertical-align:bottom; padding:1.5rem 5px 1.5rem; width:calc(100% - 80px); font-size:1.8rem; line-height:1.1; color:#111; background:transparent; border:0;}
.searchform input[type="submit"]	{ 
	vertical-align:bottom; padding:1rem 0; width:50px; height:50px; min-width:auto; 
	font-size:0;
	background:url(../images/searchbtn.png) no-repeat center center / 34px;
	border:0; border-radius:0;
}
.searchform input[type="submit"]:hover { background-color:transparent;}



button,
input,
select,
textarea {
	vertical-align: baseline; 
	margin:0; max-width:100%;
	font-size:16px; font-size:1.6rem; line-height:1.5;
	background-color: #DCDEE5;
	border-radius: 0;
}

button,
input {
	line-height: normal;
}

input,
textarea {
	border: 1px solid #fff;
	color: #707070; border-radius:3px;
}

input:focus,
textarea:focus {
	background-color: #fff;
	border: 1px solid #70BF19;
}

select	{ 
	padding:0.45em; width:100%; max-width:100%;
	font-size:1.5rem;
	background-color:#fff;
	border:1px solid #b4b4b4; border-radius:5px;
}
select:focus {
	background-color:#fff;
	border:1px solid #b4b4b4;
	outline:none;
}

input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	display:inline-block; margin:1rem 1rem; padding:1.5rem 2rem; width:90%; max-width:412px;
	font-size:1.5rem; text-decoration:none; color:#111; 
	background-color:#fff; border:1px solid #6DD400; border-radius:5px;
	transition:all 0.2s ease;
}
input[type="reset"] { color:#F37008; border:1px solid #F37008;}
input[type="submit"] { color:#fff; background-color:#6DD400;}
input[type="submit"][name="privacy-check"] { background-color:#CEEBF7;}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus {
	color:#fff; background-color:#56a700;border:1px solid #56a700;
}
input[type="reset"]:hover,
input[type="reset"]:focus {
	color:#fff; background-color:#F37008;border:1px solid #F37008;
}

button[disabled],
input[disabled],
select[disabled],
textarea[disabled] {
	cursor: default;
	color:#fff; background-color:#ccc; border-color:#ccc;
}
button[disabled]:hover,
input[disabled]:hover,
select[disabled]:hover,
textarea[disabled]:hover {
	cursor: default;
	color:#fff; background-color:#ccc; border-color:#ccc;
}



input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="date"],
input[type="password"],
input[type="search"],
textarea {
	margin:0 0.6rem 0.6rem 0;
	padding: 0.5em;
	width: 100%;
}

textarea {
	height: 8em;
	overflow: auto;
	vertical-align: top;
}
input[type="email"],
input[type="tel"],
input[type="url"]	{
	max-width:20em;
}

input[type="number"],
input[type="date"],
input[type="password"]{
	max-width:12em;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
	outline: 0;
	border:1px solid #78BBE0;
}


input[type="checkbox"],
input[type="radio"] {
	margin:0 5px 0 0; padding: 0;
}

div.mailform dl	{ border-top:1px solid #464D65; font-size:1.4rem;}
div.mailform dt	{ margin:0 0 0.5rem; padding:1em 0 0; font-weight:normal; line-height:1.5;}
div.mailform dd	{ margin:0; padding:0 0 1em; min-height:4.0em; line-height:1.5; border-bottom:1px solid #A9ACB7;}
div.mailform .required	{ font-size:0;}
div.mailform .required:after	{ position:relative; vertical-align:baseline; bottom:2px; content:'必須'; margin:0 0 0 0.5rem; padding:3px; font-size:1.1rem; font-weight:normal; color:#fff; background-color:#093473; border-radius:3px;}
div.mailform .year	{ width:4.5em;}
div.mailform .month	{ width:3.5em;}
div.mailform .day	{ width:3.5em;}
div.mailform .date	{ width:5em;}
div.mailform .zip	{ width:8em;}
div.mailform .address	{}
div.mailform p		{ font-size:1.2rem;}
div.mailform p a	{ color:#0091FF; font-weight:bold; text-decoration:underline;}
div.mailform p a:hover	{ color:#ff0000;}
div.mailform .disabled	{ color:#ccc;}
div.mailform-inner	{ margin:0 auto; max-width:720px;}
div.acception	{ margin:4rem 0; text-align:center;}
div.submit 		{ margin:4rem 0; text-align:center;}
div.backbtn		{}
div.backbtn input[type="submit"]{
	display:inline-block; margin:0.5rem 0.1rem; padding:0.8rem 1rem; max-width:8em;
	font-size:1.4rem; text-decoration:none; color:#111; 
	background-color:#ccc; border:0;
}
div.backbtn input[type="submit"]:hover{ color:#fff; background-color:#2F56CC;}


.mailform-input .required		{ color:#002355;}
.mailform-input .required::after { content:''; background-color:#093473 !important;}
.mailform-input div.radio,
.mailform-input div.checkbox	{ padding:0.5em 0 0 0;}
.vertical-item label { display:block; margin-bottom:0.5em;}
.page-confirm div.mailform dt,
.page-confirm div.radio,
.page-confirm div.checkbox	{}
.page-error div.mailform dt,
.page-error div.radio,
.page-error div.checkbox	{}

.contact-tel	{ text-align:center;}
.contact-tel .tel	{ display:block; font-size:3.0rem;}
.contact-tel .tel a	{}


/**
 *
 * MW WP Form CSS
 *
 * error message
 */
.mw_wp_form .error { font-size:93%; color:#B70000; display:block;}

/**
 * error message of akismet */
.mw_wp_form .akismet_error { display: block;}

/**
 * vertical style of radio and checkbox */
.mw_wp_form .vertical-item { display: block;}
.mw_wp_form .vertical-item + .vertical-item { margin-top: 5px;}

/**
 * horizontal style of radio and checkbox */
.mw_wp_form .horizontal-item + .horizontal-item { margin-left: 10px;}

/**
 * radio and checkbox */
.mwform-checkbox-field label,
.mwform-radio-field label { font-weight:normal; margin-bottom:0;}
.mwform-checkbox-field input,
.mwform-radio-field input { margin-right:5px;}

/**
 * datepicker */
.mw_wp_form .ui-datepicker .ui-datepicker-title select.ui-datepicker-month,
.mw_wp_form .ui-datepicker .ui-datepicker-title select.ui-datepicker-year {
	width: 40%;
	margin: 0 5px;
}

/**
 * deprecated message */
.mw-wp-form-deprecated-message {
	margin:0 0 10px; padding:1em;
	font-size:13px; line-height:1.6; color:#af4040;
	background: #fdeeee;
	border: 1px solid #f7bdb8; border-radius: 5px;
}

/**
 * file */
.mw_wp_form input[type="file"] { display: inline-block;}

/**
 * file delete button */
.mwform-file-delete { cursor: pointer; visibility: hidden;}

/**
 * tel and zip */
.mwform-tel-field input[type="text"],
.mwform-zip-field input[type="text"] { display:inline-block; width:auto;}




/**
 * - .selectors
 */
.select-wrap {
	position: relative;
}
.select-wrap:before {
	position:absolute; top:15px; right:12px; z-index:1; content:'';
	width:14px; height:0;
	border:solid transparent; border-top:solid #000; border-width:10px 7px 0 7px;
	pointer-events: none;
}
select{
	vertical-align:middle; padding:8px 12px; height:40px;
	text-indent:0.01px; font-size:inherit; text-overflow:''; color: inherit;
	background: none transparent;
	border:1px solid #b4b4b4; border-radius:5px;
	-webkit-appearance: button;
	-webkit-appearance: none;
	-moz-appearance: button;
	appearance: button;
	outline:none;
}
select option		{ color:#333; background-color:#fff; }
select::-ms-expand	{ display:none;}
select:-moz-focusring { color:transparent; text-shadow:0 0 0 #000;}





/* **************************************************************************** */
/*
/* 14.0 - Media Queries
/*
/* **************************************************************************** */

@-ms-viewport 	{ width: device-width;}
@viewport 		{ width: device-width;}



@media screen and (max-width: 374px) {

	#branding .site-title	{ 
		margin:0; padding:16px 0 16px 10px; width:150px;
	}
	#branding .site-title a	{ 
		display:block;
		height:16px;
		text-indent:200%; white-space:nowrap; overflow:hidden;
		background:url(../images/logo-autocraft.svg) no-repeat 0 0 / 134px auto;
	}

}



/**
/*  735 <=                              */
@media screen and (min-width: 735px) {

	.sm		{ display:none;}
	.md		{ display:block;}
	.lg		{ display:none;}

	/** - header  **/

	/** - footer  **/
	#footnav	{ padding:6rem 0; text-align:center;}
	#footnav li	{ display:inline-block; margin:0 1.5rem 1.4rem 0;}
	#copyright	{ font-size:1.2rem;}

	/** - Container  **/
	#container	{ background-size:10% auto;}
	#container:before	{ width:10%;}


	/**  3 column  **/
	.col3 { text-align:center; width:auto; font-size:0;}
	.col3 > div { display:inline-block; vertical-align:top; width:33.3333%; width:calc(100%/3); text-align:left; font-size:1.3rem;}
	

}



/**
/*  1024px <=                          */
@media screen and (min-width: 1024px) {

	body,
	button,
	input,
	select,
	textarea { font-size: 1.4rem;}

	.sm		{ display:none;}
	.md		{ display:none;}
	.lg		{ display:block;}


	/**
	 *  - Typography 	**/
	h1	{ font-size:3rem;}
	h2	{ font-size:2.8rem;}
	h3	{ font-size:2.4rem;}
	h4	{ font-size:1.6rem;}
	h5	{ font-size:1.5rem;}
	h6	{ font-size:1.4rem;}
	table td { padding:0.4em 1em;}


	/**
	 *  - header 		**/
	.site-header{ padding:1.5rem 3% 0;}
	#branding	{ position:absolute; top:15px; left:2%;}
	#branding .site-title	{ padding:18px 0 15px 0; width:204px;}
	#branding .site-title a	{ height:25px; background-size:204px auto;}

	#headnav	{ display:inline-block; margin:0 0 0 6%; vertical-align:top;}
	#headnav .menu	{ display:block;}
	.home #headerwrap.bg	{ background-color:rgba(255,255,255,.0);}
	.home #headerwrap.bg #headnav .menu li a { color:#fff;}
	.home #headerwrap.bg #headnav .menu li a:after	{ border-color: #fff;}
	.home .bg #headnav .menu li a { color:#000;}
	.home .bg #headnav .menu li a:after	{ border-color: #141E3C;}
	.home .bg #branding .site-title a	{ background-image:url(../images/logo-autocraft.svg);}

	#headnav .menu-recruit	{ right:0;}
	#headnav .menu-recruit li	{ display:inline-block; margin:0 !important; font-size:1.2rem;}
	#headnav .menu-recruit li a	{ margin:0 0 0 1px; padding:5rem 0 1.0rem; width:98px; color:#fff !important; 
		background-color:#141E3C; background-repeat:no-repeat; background-position:center top 12px; background-size:33px;
	}
	#headnav .menu-recruit li.rn_rec a	{ background-image:url(../images/icon-boshu.png);}
	#headnav .menu-recruit li.rn_ent a	{ background-image:url(../images/icon-entry.png);}
	.home .bg #headnav .menu-recruit li.rn_rec a	{ background-image:url(../images/icon-boshu.png);}
	.home .bg #headnav .menu-recruit li.rn_ent a	{ background-image:url(../images/icon-entry.png);}
	.home #headnav .menu-recruit li.rn_rec a	{ background-image:url(../images/icon-boshu.png);}
	.home #headnav .menu-recruit li.rn_ent a	{ background-image:url(../images/icon-entry.png);}


	/**
	 *  - footer 		**/
	.site-footer	{ text-align:center;}
	.site-footer .site-title	{ 
		display:block;
		margin: 0 0 2rem; padding:24px 0 0; font-size:1.2rem; font-weight:bold;
		background:url(../images/logo-autocraft-wh.svg) no-repeat center top / 164px auto;
	}
	.site-footer .site-title { 
		display:inline-block; vertical-align:middle; margin-right:6rem; padding:34px 0 0;
		width:244px; text-align:center; font-size:1.4rem;
		background-size:244px auto;
	}
	.site-footer .data	{ display:inline-block; vertical-align:middle;}
	.site-footer .data address	{ display:inline-block; vertical-align:middle; line-height:1.5; margin:0 1.5em 0 0; padding:0;}
	.site-footer .data p.tel	{ display:inline-block; vertical-align:middle; line-height:1.5; margin:0; padding:0;}


	/**
	 *  - container 	**/

	/**
	 *  - column 		**/
	/**  2 column		**/
	.col2 { display:flex; flex-wrap:nowrap; flex-direction:row; justify-content:space-between; align-items:flex-start;}
	.col2 > div { width:50%; text-align:left;}
	.col2.separate > div { width:48%; text-align:left;}


	/**  3 column  **/
	.col3 { text-align:center; width:auto; font-size:0;}
	.col3 > div { display:inline-block; vertical-align:top; width:33.3333%; width:calc(100%/3); text-align:left; font-size:1.3rem;}
	

}



/* 1280px =<                            */
@media screen and (min-width: 1280px) {


	body,
	button,
	input,
	select,
	textarea { font-size: 1.5rem;}

	/**
	 *  - Typography 	**/
	h1	{ font-size:3rem;}
	h2	{ font-size:3.3rem;}
	h3	{ font-size:2.8rem;}
	h4	{ font-size:1.6rem;}
	h5	{ font-size:1.5rem;}
	h6	{ font-size:1.4rem;}
	article p { line-height:2.0;}



	#branding .site-title	{ padding:10px 0 15px 0; width:244px;}
	#branding .site-title a	{ height:25px; background-size:244px auto;}


	/** - Header  **/
	#headnav .menu li	{ margin:0 8px; font-size:1.5rem;}
	#headnav .menu-recruit li	{ font-size:1.2rem;}
	#headnav .menu-recruit li a	{ padding:5rem 0 1.1rem;}

	#copyright	{ padding:2.5rem 2% 2rem; font-size:1.4rem;}


}








































