@charset "utf-8";
/* 
html5doctor.com Reset Stylesheet v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
*/

html {-webkit-text-size-adjust: 100%;/* 2 */-ms-text-size-adjust: 100%;}
* { font-family:&#039;Noto Sans JP&#039;, sans-serif, "arial","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
body { width:100%; overflow-x:hidden; font-family: sans-serif ;}

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; list-style:none; vertical-align:baseline; background:transparent; outline:none;}
body { line-height:1;}
img {border-style: none;} 
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { display:block;}
nav ul, ul, li { list-style:none;}
blockquote, q { quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:&#039;&#039;;content:none;}
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;}
@media screen and (max-width: 320px){html, body { min-width:320px;}}

/*===================
 LINK
=====================*/
a, a img, a *{-webkit-transition:0.4s; -moz-transition:0.4s; -o-transition:0.4s; transition:0.4s;}
a{ text-decoration: underline;}
a:hover, a:hover img { opacity:0.8; filter: alpha(opacity=90); text-decoration: none;}
@media screen and (max-width: 660px) {body, html { width:100%; overflow-x:hidden;}}
@media screen and (max-width: 480px) {body { background: #fff;}}
/*============================
selection
==============================*/
::selection { background: #ddd; color: #777;}
::-moz-selection { background: #ddd; color: #777;}
/*===================
 FONT
=====================*/
h1,h2,h3,h4,h5,h6 {line-height:1.6em; font-size:18px; font-weight: bold; color:#333;	letter-spacing:1px;}
p,li,dt,dl,span { font-size:16px; letter-spacing:1px; line-height:1.6em; color:#444;}
@media screen and (max-width: 640px) {
p,li,dt,dl,span { font-size:15px;}
}
@media screen and (max-width: 400px) {
h1,h2,h3,h4,h5,h6 {line-height:1.5em; font-size:16px;}
p,li,dt,dl,span { line-height:1.5em; font-size:14px;}
}
/*=====================================
 CONTENTS
=======================================*/
main, header, fotter, section { width:100%; display: block;}
.contMin{ margin:0 auto; overflow:hidden\9; *overflow:hidden;}
main{ position: relative; z-index: 1;}
img{ max-width: 100%; width: 100%; height: auto;}


/*------------------------------------------------------------
  header
==============================*/
header{ height: 100px; margin-bottom: 90px; background:url(https://fukuya-hd.co.jp/recruit/lp/asset/form/img.png) 50% 100% #0db9e1 no-repeat; background-size: auto 100%;}
.kakunin header{ margin-bottom: 0;}
header .contMin{ width: 900px; text-align: right; position: relative; padding-top: 30px;}
header .contMin h1{ position: absolute; left:0; top: 30px;}
header .contMin h1 img{ width: 180px; height: auto;}
header .contMin p { display: block;}
header .contMin p a{ text-decoration: none; display: inline-block; line-height: 30px; border: solid 2px #fff; padding: 0 10px; color: #fff; font-size: 14px; font-weight: bold;}
header .contMin p a:hover{ background: #777; border:solid 2px #222; color: #fff;}
@media screen and (max-width: 1100px) {
header .contMin{ width: 94%; margin-top: 0 3%;}

}
@media screen and (max-width: 900px) {
header{ height: 70px;}
header .contMin{ padding-top: 20px;}
header .contMin h1{ top: 20px;}
header .contMin h1 img{ width: 150px;}
}
@media screen and (max-width: 600px) {
header{ height: 50px; margin-bottom: 60px;}
header .contMin{ padding-top: 10px;}
header .contMin h1{ top: 8px;}
header .contMin h1 img{ width: 100px;}
}


/*------------------------------------------------------------
  infoArea
==============================*/
.infoArea{}
.infoArea .contMin{ width: 900px;}
.infoArea.top .contMin > *{ display: block;}
.infoArea.top .contMin h2{ margin-top: 30px; font-size: 22px; padding:5px 4%; color: #222; font-weight: bold; border-bottom: solid 1px #ccc; font-weight: normal;}
.kakunin .infoArea.top .contMin h2{ text-align: center; border-bottom: none;}
.infoArea.top .contMin ul{ margin: 20px 2% ;}
.infoArea.top .contMin ul li{ display: block; font-size: 15px; padding-left: 1.3em;  color: #777; position: relative; margin: 8px 0;}
.infoArea.top .contMin ul li::before{ content: "・"; position: absolute; left: 0; top: 0;}
.kakunin .infoArea.top .contMin p{ width: 90%; margin: 0px 5% 20px; font-size: 14px; text-align: center; display: block;}
.kakunin .infoArea.top .contMin p br{ display: none;}
@media screen and (max-width: 1000px) {
.infoArea .contMin{ width: 90%; margin: 0 5%;}
.kakunin .infoArea.top .contMin p br{ display: block;}

}
@media screen and (max-width: 500px) {
.infoArea .contMin{ width: 94%; margin: 0 3%;}
.infoArea.top .contMin h2{ font-size: 26px;}
.infoArea.top .contMin ul li{ font-size: 13px; margin: 5px 0;}
.kakunin .infoArea.top .contMin p{ font-size: 14px;}

}


/*------------------------------------------------------------
  formArea
==============================*/
.formArea{}
.kakunin .formArea{ display: block;}
.formArea .contMin{ width: 900px;}
.formArea .contMin .inner{ width: 94%; margin: 0 3%; display: block;}
.formArea .contMin .inner * { box-sizing: border-box;}
.formArea .contMin .inner .button_box{ display: block; padding-top: 30px; min-height: 270px;}
.kakunin .formArea .contMin .inner .button_box{ display: flex; flex-direction: row-reverse; justify-content: space-between;}
@media screen and (max-width: 1000px) {
.formArea .contMin{ width: 94%; margin: 0 3%;}
}
@media screen and (max-width: 700px) {
.kakunin .formArea .contMin .inner .button_box{ flex-direction: column;}
.kakunin .formArea .contMin .inner{ width: 100%; margin: 0;}

}

/*------------------------------------------------------------
  footer
==============================*/
footer{ width: 100%; padding: 20px 0 60px; display: block; text-align: center;}
footer img{ width: 140px; height: auto; margin: 0 auto;}
@media screen and (max-width: 900px) {
footer img{ text-align: center;}

}

/*------------------------------------------------------------
  Common フォーム
==============================*/
/*///////////
 select
/////////////*/

 select {
	padding:0 10px;
    line-height: 30px;
    color: #555;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
    cursor: pointer;
}
@media screen and (max-width: 600px){
input, textarea, select{ font-size: 18px;}
}

/*///////////
 次へボタン
　submit
/////////////*/
.btnA{ width: 50%; margin: 20px 25% 150px; background: #cd4d4d; color: #fff; border-radius: 6px; line-height: 70px; box-shadow: 1px 4px 12px #aaa; font-size: 20px;  letter-spacing: 4px; border: none; cursor: pointer; transition:0.4s; -moz-transition:0.4s;}
.btnAA{ width: 60%; float: right; display: inline-block; margin: 20px 2% 150px; background: #cd4d4d; color: #fff; border-radius: 6px; line-height: 70px; box-shadow: 1px 4px 12px #aaa; font-size: 20px;  letter-spacing: 4px; border: none; cursor: pointer; transition:0.4s; -moz-transition:0.4s;}
.btnB{ width: 30%; float: left; display: inline-block; text-align: center; margin: 20px 2% 150px; text-decoration: none; background: #fff; color: #000; border: solid 1px #999; border-radius: 4px; line-height: 70px; box-shadow: none; font-size: 16px;  letter-spacing: 4px; cursor: pointer; transition:0.4s; -moz-transition:0.4s;}

.btnc{ width: 70%; display: inline-block; text-align: center; margin: 20px 2% 150px; text-decoration: none; background: #43af3e; color: #fff; border-radius: 4px; line-height: 120px; box-shadow: 1px 4px 12px #aaa; font-size: 22px;  letter-spacing: 4px; border: none; cursor: pointer; transition:0.4s; -moz-transition:0.4s; font-weight: bold; border: solid 8px #43af3e;}

.btnA:hover, 
.btnAA:hover{ box-shadow: 0 0 0 1px #cd4d4d; color: #cd4d4d; background: #fff; border-radius: 2px;}
.btnB:hover{ border: solid 1px #aaa; background: #eee;}
.btnc:hover{ color: #43af3e; background: #fff; box-shadow:none;}

@media screen and (max-width: 700px) {
.btnA, 
.btnc{ width: 70%; margin: 20px 15% 60px; line-height: 60px; -webkit-appearance: none;}
.btnAA{ width: 90%;  margin: 20px 5% ; -webkit-appearance: none;}
.btnB{ width:40%; line-height: 40px; margin: 40px 5% 100px; border-radius: 1px; -webkit-appearance: none;}

}

/*///////////
　input
/////////////*/
::placeholder { color:#999;}
#formTable > p > div{ display: none;}
#form > tbody > tr:nth-child(5) > td > div > div br{ display: none;}
/* text */
input[type="text"]{ width: 100%; min-width: 140px; line-height: 50px;  vertical-align:middle; outline: none; background: #eee; -webkit-transition: all .3s; transition: all .3s; border-radius:6px; padding: 0 5% 0 3%; font-size: 18px; color: #000; border: solid 1px #aaa;}
input[type="text"]:focus, 
textarea:focus{ box-shadow:0 0 0 1px #ccc; background: #fff; border-radius: 0px; color: #000; border: solid 1px #43af3e;}

/* textarea */
textarea { width: 100%; height: 150px; border: none; border-radius:4px; padding: 10px 5%; -webkit-transition: all .3s; transition: all .3s; outline: none; background: #eee; font-size: 18px;}

/* radio */
input[type="radio"] { width: 16pt; height: 16pt; vertical-align:middle;}
input[type="radio"] + label { cursor: pointer; padding: 0 20px 0 3px; border-radius : 5px; transition: .2s; line-height:40px; vertical-align:sub;}
input[type="radio"]:checked + label {}
input[type="radio"]:not(:checked) + label:hover { font-weight: bold;}

/**/
select{ padding: 5px 15px; margin: 5px; min-width: 50px; text-align: center; background: #eee; border:none; font-size: 18px;}
select:focus{ box-shadow:0 0 0 1px #ccc; background: #fff; border-radius: 0px; color: #000;}


@media screen and (max-width: 700px) {
input[type="text"]{ line-height: 60px; font-size: 18px; }
textaream, 
input[type="radio"], 
select{ font-size: 18px;}

}

/*------------------------------------------------------------
  table レイアウト
==============================*/

/*-------------------
  table id="form"
--------------------*/
#form{ width: 100%;}
.kakunin #form{ border: solid 1px #999; padding: 10px;}
#form tbody tr{ border-bottom: dotted 1px #ccc;}
.kakunin #form tbody tr{ border-bottom: dotted 1px #eee;}

.kakunin #form tbody tr{ width: 100%; padding: 0 10%; display: block;}
#form tbody tr td{ padding: 20px 0 20px; position: relative;}
#form tbody tr th{ width: 250px; height: 60px; vertical-align: middle; padding: 20px 0; margin-bottom: 20px; font-weight: normal; position: relative;}
.kakunin #form tbody tr th{ color: #999;}
#form tbody tr th span.red{ font-size: 0;}
#form tbody tr th span.red::after{ content: "必須"; background:#D14749; font-size: 14px; color: #fff; font-weight: bold; line-height: 28px; display: inline-block; padding: 0 5px; margin-left: 10px;}



/*確認ページ*/
#form.confirm tbody tr {border-bottom: dotted 1px #ccc;}

#form.confirm tbody tr td{ font-size: 18px; padding: 20px 20px; line-height: 1.4em;}
#form.confirm tbody tr th{ height: auto; padding: 20px 0; margin-bottom: 0;}
#form.confirm tbody tr th .cred{ margin-top: -12px;}

/**/
.cap{ width: 100%; float: left; margin-bottom: 25px; font-size: 12px; font-weight: normal;}

.pp{ width: 100%; text-align: center; font-size: 14px; padding: 4px 5%; margin:10px 0 15px;}
.bt_confirm{ margin: 30px auto; text-align: center;}
.bt_confirm input{ max-width: 400px; border-bottom: solid 10px #000; border-radius: 4px; -webkit-transition: all .3s; transition: all .3s;}
.bt_confirm input:hover{ border-bottom: solid 0px #000; margin-top: 10px;}

/*確認*/
.bt_confirm2{ display: block; float: left; padding: 30px 10%; margin-bottom: 100px; text-align: center;}
.bt_confirm2 > *{ display: inline-block;}
.bt_confirm2 a{ float: left; width: 20%; line-height: 80px; border-radius: 8px; border: solid 4px #000; text-align: center; color: #000; text-decoration: none; font-weight: bold;}
.bt_confirm2 a:hover{ background: #000; color: #fff;}
.bt_confirm2 input{ width:70%; float:right;}
.bt_confirm2 input:hover{ opacity: 0.7;}


@media screen and (max-width: 700px) {
.kakunin #form{ border: none;}
.kakunin #form tbody tr{ padding: 0 2%;}

#form tbody tr th{ width: 100%; padding: 0 0 0 5px; border-left: solid 5px #000; display: block; float:left; text-align: left; line-height: 1.2em; height: auto; margin: 20px 0 ;}
#form tbody tr td{ width: 100%; float: left; display: block; padding: 0 0 30px;}
#form tbody tr:last-child { border-bottom: none;}
#form tbody tr th .cred{ position: absolute; top:0%; margin-top: -5px;}
#form > tbody > tr:nth-child(5) > th > span{ top: 40px;}
#form > tbody > tr:nth-child(5) > th br{ display: none;}
#form tbody tr td, 
#form tbody tr th, 
#form tbody tr td span{ font-size: 15px;}
.kakunin #form tbody tr td, 
.kakunin #form tbody tr th, 
.kakunin #form tbody tr td span{ font-size: 18px;}

/**/
#form.confirm tr {border-bottom: dotted 1px #ccc;}
#form.confirm tr td{ font-size: 15px; padding: 10px 20px; line-height: 1.4em;}
#form.confirm tr th{ height: auto; padding: 4px 1%; margin-bottom: 0; background: #f6f6f6;}
#form.confirm tr th .cred{ margin-top: 0px;}
/*確認*/
.bt_confirm2{ padding: 50px 0%;}
.bt_confirm2 a{ width: 20%; line-height: 80px;}
.bt_confirm2 input{ width:70%; float:right;}

}
@media screen and (max-width: 600px) {
.bt_confirm2 a{ width: 100%; line-height: 30px; margin-bottom: 40px; border:solid 2px #000;}
.bt_confirm2 input{ width:100%;}

}
@media screen and (max-width: 500px) {
.bt_confirm input{ max-width: 600px; width: 100%; height: auto; margin-bottom: 100px;}
}


/*------------------------
confirm
-----------------------*/
.fin{ width: 100%; margin: 40px 0 ; display: block;}
.fin .contMin p{box-sizing:border-box;}
.fin .contMin p br{ display: block !important;}

.fin .contMin #fintxt{width: 90%; margin: 20px 5% 0; text-align: center; line-height: 1.8em; font-size: 18px;}
.fin .contMin #fintxt b{ display:inline-block; padding: 5px 30px; margin-bottom: 20px; border: solid 1px #000; border-radius: 50px;}
/**/
.fin .contMin #fininfo{ width: 70%; margin: 20px 15% 30px; padding: 20px 30px; font-size: 14px; background:#eee; border-radius: 20px; text-align: left;}
.fin .contMin #fintxt br.sp-block{ display: none !important;}

@media screen and (max-width: 700px) {
.fin .contMin #fintxt{ font-size: 18px;}
.fin .contMin #fintxt br.sp-block{ display: block !important;}
}

@media screen and (max-width: 600px) {
.fin .contMin #fintxt{ font-size: 3.4vw;}
.fin .contMin #fininfo{ width: 90%; margin: 10px 5% 30px; padding: 10px 20px; border-radius: 10px;}

}


/**/
@media screen and (min-width: 801px) {
.h_br{ display: none;}
}
@media screen and (max-width: 800px) {
#form > tbody > tr:nth-child(3) > td{ line-height: 40px;}
}

.table tr th{ text-align: left; width: 20%;}
input[type="submit"] {
-webkit-appearance: none;
}
.red_txt { width: 100%; float: left;}
.red_txt ul{ width: 100%; float: left; padding: 10px 0 10px 26%; margin:0 0 30px; border: solid 3px #d06550;  border-radius: 10px;}
.red_txt br{ display: none;}
.red_txt ul li{ font-size: 14px; color: #d06550;}

@media screen and (max-width: 700px) {
.red_txt ul{ padding: 10px 5%; margin: 0 2% 30px; width: 96%; float: left;}
.red_txt ul li{ font-size: 12px;}

}



/*------------------------
pp
-----------------------*/
.nyuuryoku #form > tbody > tr:nth-child(11) > th{ text-align: right;}

#form > tbody > tr:nth-child(11){ border:none;}
.ppt{ width: 100%; text-align: center; font-size: 20px; font-weight: bold;}
.ppt br{ display: none;}
.ppp{ width: 100%; height: 300px; display: block; overflow-y:scroll; padding: 20px 5%; margin:10px 0 15px; border: solid 1px #ccc; background: #eee;}
.ppp > *{ display: block; font-size: 14px;}
.ppp > span{ margin-bottom: 30px;}
.ppp > span.right{ text-align: right;}

@media screen and (max-width: 700px) {
#form > tbody > tr:nth-child(11) > th{ text-align: left;}
.ppt{ font-size: 16px;}
.ppt br{ display: block;}

}

/*------------------------
pp
-----------------------*/
.finLink{ display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 10px;}

.finLink .txt{ display: block; margin-bottom: 20px; padding: 10px; border-radius: 4px; background: #555; color: #fff;}
.kakunin .infoArea.top .contMin .finLink .txt br{ display: none !important;}
.finLink .link{ display: flex; justify-content: center;}

.finLink .link a{ width: 31%; height: 50px; margin: 0px 1%; display: flex; justify-content: center; align-items: center; background:#008342; color: #fff; font-weight: bold; text-decoration: none; }
@media screen and (max-width: 900px) {
.finLink .link a{ font-size: 14px;}

}
@media screen and (max-width: 700px) {
.kakunin .infoArea.top .contMin .finLink .txt br{ display: block !important;}
.finLink .link{ flex-direction: column;}

.finLink .link a{ width: 100%; height: 50px; margin:6px 0;}

}