/* Reset */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,dialog,figure,footer,header,hgroup,nav,section{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline}article,aside,dialog,figure,footer,header,hgroup,nav,section{display:block}body{line-height:1}a img{border:none}table{border-collapse:separate;border-spacing:0}caption,th,td{text-align:left;font-weight:normal}table,td,th{vertical-align:middle}blockquote:before,blockquote:after,q:before,q:after{content:""}blockquote,q{quotes:""""}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}button::-moz-focus-inner{border:0}

body{font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-size:14px;
  line-height:1.6;
  color:#333;
}
html{scroll-behavior: smooth;}

#pagetop{
  display: none;
  position: fixed;
  bottom:0;
  right:0;
  padding:0;
  margin:0;
  width:40px;
  height: 40px;
  cursor:pointer;
  z-index:9999;
}

.s_hide{display: none;}

a{text-decoration: none; color:#004890; transition: .2s ease-in-out;}
a:visited {color:#004890;}
a:hover,
a:focus {color:#7097bc;}

h2{padding: 30px 0; text-align: center; font-size: 26px; font-weight: bold;}
h3{padding: 20px 0; text-align: center;font-size: 22px; font-weight: bold;}
p{margin-bottom:0.8em;}
/*** PC ***/
@media screen and (min-width: 768px){
body{font-size:16px;line-height:1.8;}
.s_hide{display:block;}
.l_hide{display: none;}
h2{padding: 50px 0 20px; font-size: 28px;}
}

/********* ヘッダー *********/
header{width: 100%; height:60px; box-shadow: 0 0 10px rgba(0,0,0,0.7); position: relative; z-index: 9999;display: flex; align-items: center;}
.logo_box{width: 25%; max-width:100px; padding: 10px; display: inline-block;}
.logo_box img{max-width: 100%; height: auto;}
h1{line-height: 60px; font-size: 14px; width:4em; white-space: nowrap;}
#contact_box{width: 100px; height: 60px; margin-left: auto; display: table;}
#contact_box a{ display:table-cell; text-align: center; vertical-align: middle; background: #0095ae; color: #FFF; text-decoration: none; font-size:0.9em; line-height: 1.5;}
#contact_box a span{display: block; font-size:0.8em;}
/*** PC ***/
@media screen and (min-width: 768px){
header{height:80px;}
.logo_box{max-width:150px;}
h1{line-height: 80px; font-size: 18px;}
#contact_box{width: 150px; height: 80px;}
#contact_box a:hover,
#contact_box a:focus{opacity: 0.75;}

}

/********* スライダー *********/
.slider {
	width:100%;
	height:230px;
	overflow: hidden;
	position: relative;
	max-width: 100%;
}

.slider div {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: 10;
	opacity: 0;
	animation-name: slide-fade;
	animation-duration: 15s;
	animation-iteration-count: infinite;
}

@keyframes slide-fade {
	0%{opacity: 0;}
	20%{opacity: 1;}
	80%{opacity: 0;}
	100%{opacity: 0;z-index: 0;	}
}
.slider div:first-of-type{background-image: url("../images/recruit/mv01_sp.png"); background-position: 90%;}
.slider div:nth-of-type(2){background-image: url("../images/recruit/mv02_sp.png"); animation-delay: 5s;}
.slider div:last-of-type{background-image: url("../images/recruit/mv03_sp.png"); animation-delay: 10s;}

/*** PC ***/
@media screen and (min-width: 768px){
.slider {height:450px; max-width:1000px; margin: 40px auto 0;}
.slider div:first-of-type{background-image: url("../images/recruit/mv01.png"); background-position:center;}
.slider div:nth-of-type(2){background-image: url("../images/recruit/mv02.png"); animation-delay: 5s;}
.slider div:last-of-type{background-image: url("../images/recruit/mv03.png"); animation-delay: 10s;}
}

/********* アンカーリンク *********/
.ankerlink_list{display: flex; flex-wrap:wrap; border-top: 1px solid #00568e; border-left: 1px solid #00568e; list-style: none; position: relative; z-index: 9999;}
.ankerlink_list li{width:calc(100% / 2 - 1px); text-align: center; border-bottom: 1px solid #00568e; border-right: 1px solid #00568e;}
.ankerlink_list li a{display: block; padding: 7px 0; color: #333; background: #FFF;}
/*** PC ***/
@media screen and (min-width: 768px){
.ankerlink_list{width: 80%; max-width: 800px; margin: -20px auto 20px; flex-wrap:nowrap;}
.ankerlink_list li a:hover,
.ankerlink_list li a:focus
{color: #FFF; background: #00568e;}
}

/********* 採用メッセージ *********/
#Message{padding: 40px 10px;}
#Message .message_lead{color:#00568e; text-align: center; font-size: 20px; font-weight: bold; line-height: 1.7;}
#Message .message_txt{background: url("../images/recruit/bg_message.png") no-repeat 50% 10%; background-size: 90%;}
#Message h2{padding: 20px 0 40px; text-align: center; font-size: 18px; font-weight: normal;}
/*** PC ***/
@media screen and (min-width: 768px){
#Message{width: 96%; max-width: 770px; margin: auto; padding: 40px 10px;}
#Message .message_lead{font-size: 28px; line-height: 1.7;}
#Message .message_txt{background: url("../images/recruit/bg_message.png") no-repeat 50% top; background-size: 70%; font-size:1.1em;}
#Message h2{padding: 40px 0 60px; text-align: center; font-size: 24px;}
}

/********* 社員紹介 *********/
#Interviews{background: #e5eef3; padding:0 15px 30px;}
#Interviews ul{list-style: none; margin: 40px 0;}
#Interviews ul li{background: #FFF; box-shadow: 5px 5px 2px rgba(0,0,0,0.2); padding:30px 20px 40px; margin-bottom: 30px; position: relative;}
#Interviews h3{font-size: 20px; text-align: left; font-weight: bold; width: calc(100% - 50px); padding:0; }
#Interviews .profile{margin: 10px 0; font-size:0.9em;}
#Interviews .q{margin: 0; font-weight: bold;}
.o-en{margin: 20px 0 0;}
.o-en .title_o-en{text-align: center;}
.o-en .txt_o-en{background: #fff6dd; box-shadow: 5px 5px 0 #ffd659; padding: 20px;}
.profile_img{position: absolute; top: 15px; right:-10px; width: 80px;}
.profile_img img{width: 100%; height: auto;}
.clr_green{color:#388b78;}
.clr_blue{color: #234181;}
.clr_brown{color: #7f4608;}
.clr_darkgreen{color: #115908;}
/*** PC ***/
@media screen and (min-width: 768px){
#Interviews{background: #e5eef3; padding:0 0 30px;}
#Interviews>p{text-align: center; font-size: 18px;}
#Interviews ul{width:94%; max-width: 1000px; margin: 40px auto; display: flex; flex-flow: wrap; justify-content:space-between;}
#Interviews ul li{width: calc(46% - 40px); margin: 0 4% 50px 0; font-size: 15px;}
#Interviews h3{font-size: 22px; line-height: 1.5;}
.profile_img{position: absolute; top: -20px; right:-25px; width:auto;}
}

/********* 福利厚生 *********/
#Benefits ul{list-style: none; width: 90%; margin: 0 auto;}
#Benefits ul li{border: 1px solid #00568e; padding: 20px; margin: 0 0 30px;}
#Benefits .benefits_type{font-size: 24px; font-weight: bold; padding:0 0 5px 0; border-bottom: 2px solid #00568e; color:#00568e; margin: 0 0 20px;}
#Benefits .benefits_img{margin: 15px 0 0; text-align: center;}
#Benefits .benefits_img img{max-width: 100%; height: auto;}
p.footnote{font-size: 0.8em;}
/*** PC ***/
@media screen and (min-width: 768px){
#Benefits{padding:0 0 80px;}
#Benefits ul{width: 90%; max-width: 1000px; margin: 0 auto;}
#Benefits ul li{display: flex; justify-content: space-between;}
#Benefits .benefits_txtbox{width:56%;}
#Benefits .benefits_img{width: 40%; max-width: 400px; margin: 15px 0 0; text-align: center;}
}


/********* 募集要項 *********/
#JobDescription{background: #e5eef3; padding:0 15px 30px;}
.jobtable_box{background: #FFF; padding: 15px; width: 90%; margin: 0 auto;}
.jobtable_box th{width: 7em; white-space: nowrap; border-bottom: 1px dotted #00568e; padding: 5px 0;}
.jobtable_box td{border-bottom: 1px dotted #00568e; padding: 5px 0;}
.contact_box{text-align: center;}
.contact_box p{font-size: 15px; margin: 30px 0 15px;}
.department{font-size: 16px; font-weight: bold;}
.tel_box{font-weight: bold;}
.tel_box a{font-size: 26px; color: #333;}
.btn{width: 75%; height: 40px; line-height: 40px; margin: 20px auto; text-align: center;}
.btn a{display: block; color: #FFF; background: #00568e; border-radius:20px;}
/*** PC ***/
@media screen and (min-width: 768px){
a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
}
#JobDescription{padding:0 0 80px;}
.jobtable_box{padding: 40px 80px; width:calc(90% - 160px); max-width: 840px; margin: 0 auto;}
.jobtable_box table{width:100%;}
.jobtable_box th{width: 9em; padding: 10px 0;}
.jobtable_box td{border-bottom: 1px dotted #00568e; padding: 5px 0;}
.contact_box p{font-size: 20px;}
.department{font-size: 20px;}
.tel_box{margin-bottom: 30px;}
.tel_box a{font-size: 38px; color: #333; line-height: 1.2;}
.btn{width:475px; height: 70px; line-height: 70px; margin: 20px auto; text-align: center;}
.btn a{border-radius:35px; font-size: 22px;}
.btn a:hover,
.btn a:focus{background: #7097bc;}
}

/********* フッター *********/
footer{text-align: center;}
.footer_logo_box{width:100px; margin: 20px auto;}
.footer_logo_box img{max-width:100%; height: auto;}
.footerlink{display:inline-block;}
.footerlink li{list-style-image: url("../images/recruit/arrow.png");}
#copyright{font-size: 0.7em; margin:20px 0 10px;}
/*** PC ***/
@media screen and (min-width: 768px){
footer{display: flex; flex-flow: wrap; justify-content:space-between; align-items:center; padding: 30px 2%;}
.footer_logo_box{width:110px; margin:0 30px 0 0; display: inline-block;}
#copyright{margin:0 0 0 auto; display: inline-block;}


}