@charset "utf-8";
/* ------------------------------------------------------------ common */
body { color: #070b0c; font-size: 16px; min-width: 1300px; font-family: 'Noto Sans Japanese'; position: relative; }
a:link 		{ color: #070b0c; text-decoration: none; }
a:visited 	{ color: #070b0c; text-decoration: none; }
a:hover,
a:hover img,
input[type="submit"]:hover { color: #070b0c; text-decoration: none; 
	filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8; }
    
input[type="text"],
select,
textaera	{ border: 1px solid #b5b5b5; }

input[type="submit"] { -webkit-appearance: button; cursor: pointer; padding: 0; border: none; }

h1 		{ font-size: 12px; padding: 0 0 5px;}

.inner 	{ width: 1100px; margin: 0 auto; }
.btn 	{ text-align: center; padding: 30px 0 0;}
.btn a 	{ display: inline-block; *display: inline; *zoom: 1; color: #fff; font-size: 15px; font-family: 'Noto Sans Japanese';}
.btn.common a { background: url(../images2/common/btn.gif) 97% center no-repeat #000; width: 320px; height: 52px; line-height: 52px;}
.btn.top { padding: 90px 0 110px;}

#top { position: relative;}

h3.h3 { text-align: center; padding: 0 0 30px; font-family: 'Noto Sans Japanese medium';}
h3.h3 span { font-size: 46px; font-family: 'JosefinSans-BoldItalic'; display: block; letter-spacing: 5px; line-height: 100%;}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 200;
  src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans Japanese demiLight';
	font-style: normal;
	font-weight: 300;
	src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-DemiLight.woff2) format('woff2'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-DemiLight.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-DemiLight.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans Japanese regular';
	font-style: normal;
	font-weight: 400;
	src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.otf) format('opentype');
}

@font-face {
  font-family: 'Noto Sans Japanese medium';
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.otf) format('opentype');
}

@font-face {
   font-family: 'Noto Sans Japanese bold';
   font-style: bold;
   font-weight: 700;
   src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.otf) format('opentype');
}

@font-face {
    font-family: 'JosefinSans-BoldItalic';
    font-style: bold;
    font-weight: 700;
    src: url('../fonts/JosefinSans-BoldItalic.eot'); 
    src: url('../fonts/JosefinSans-BoldItalic?#iefix') format('embedded-opentype'), 
         url('../fonts/JosefinSans-BoldItalic.woff') format('woff'), 
         url('../fonts/JosefinSans-BoldItalic.ttf') format('truetype'),
         url('../fonts/JosefinSans-BoldItalic.otf') format('otf'),
         url('../fonts/JosefinSans-BoldItalic.svg') format('svg');

}


/*
@font-face {
    font-family: 'BIZUDPMincho-Regular';
    font-style: bold;
    font-weight: 400;
    src: url('../fonts/BIZUDPMincho-Regular.ttf') format('truetype'), 

}

@font-face {
    font-family: 'BIZUDPMincho-Bold';
    font-style: bold;
    font-weight: 700;
    src: url('../fonts/BIZUDPMincho-Bold.ttf') format('truetype'), 

}
*/
.SP { display: none;}

/* ------------------------------------------------------------ header */

#header { padding: 20px 0; position: fixed; width: 100%; background: #fff; min-width: 1300px; z-index: 500;}
#header a{ color: #000; }
#header .header_box{display: flex; padding: 0 3%;}
#header #logo {width: 165px; min-width: 165px;}
#header #logo img { width: 165px; height: auto;}
#header #header_internal{padding: 0 0 0 20px;}
#header #header_box { width: 280px; padding: 0 20px;}
#header ul { position: relative; width: auto; vertical-align: middle; padding: 15px 0 0; margin: 0 0 0 auto;}
#header ul li {text-align: center; width: auto; display: inline-block;}
#header ul li:not(:last-child){padding-right: 46px;}
#header ul li a { font-size: 14px; padding: 0 0 3px; display: inline-block; *display: inline; *zoom: 1; text-align: right; font-family: 'Noto Sans Japanese medium';}
#header ul li a.on { border-bottom: 3px solid #4462b1;}

#header .header-child{ position: absolute; left: -25%; top: 60px; width: 900px; background: rgba(88,88,88,.9); }
#header .header-child__inner{ display: flex; align-items: flex-start; justify-content: center; gap: 10%; padding: 40px; }
#header .header-child__col{ width: 17%; color:#fff; font-family: 'Noto Sans Japanese medium'; }
#header .header-child__col--pic{ width: 42%; }
#header .header-child__col--pic img{ width: 100%; height: auto; }

#header .header-child__heading{ margin:0 0 20px; font-size: 18px; text-align: left; }
#header .header-child__link{ position:relative; display: block; padding: 0 0 20px 25px; color:#fff; font-size: 14px; letter-spacing:.05em; text-align: left; }
#header .header-child__link:before{ position: absolute; content: ""; left: 0; top: 10px; width: 15px; height: 1px; background: #fff; }

#header .header-child__pic{ margin-top: 10px; }
#header .header-child__pic img{ width:100%; height:auto; }

#header .header-child {
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s;
}
#header .header-child.is-open {
  opacity: 1!important;
  visibility: visible;
  display: block;
}


/* ------------------------------------------------------------ fv */
#fv_wrapper { padding: 100px 0 0; }
#fv { padding: 285px 0 270px;}
#fv h2 { padding: 0 0 30px; letter-spacing: 2px; font-family: 'Noto Sans Japanese medium'; line-height: 110%;}
#fv h2 span { font-family: 'JosefinSans-BoldItalic' ; font-size: 70px; letter-spacing: 10px; display: block; line-height: 110%;}
#fv p { font-size: 12px; letter-spacing: 2px;}

/* ------------------------------------------------------------ bread */

#bread { padding: 40px 0 30px;}
#bread ol li { list-style-type: none; display: inline-block; *display: inline; *zoom: 1; text-align: center; background: url(../images2/common/bread.gif) left center no-repeat; padding: 0 0 0 28px; margin: 0 3px 0 0; position: relative;}
#bread ol li:first-child { padding: 0; background: none;}
#bread ol li a { color: #4461b1; font-size: 12px;}
#bread ol li strong { font-size: 12px;} 

/* ------------------------------------------------------------ entrance */

#entrance { padding: 30px 0 0;}
#entrance li { float: left; width: 360px; text-align: center; margin: 0 0 0 10px;}
#entrance li:first-child { margin: 0;}
#entrance li div { padding: 20px 0;}
#entrance li div h4 { font-family: 'Noto Sans Japanese medium'; line-height: 130%;}
#entrance li div h4 span { font-size: 26px; display: block; font-family: 'JosefinSans-BoldItalic' ; letter-spacing: 2px; line-height: 130%;}


/* ------------------------------------------------------------ bnr */

#bnr { padding: 65px 0 60px; background: #f2f2f2;}
#bnr a.recruitbnr { display: block; margin: 0 auto 50px; }
#bnr a.recruitbnr img { width: 100%; height: auto; }
#bnr ul li { width: 100%; height: auto;}
#bnr ul li a{display: block; width: 100%; height: auto;}
#bnr ul li a img.bnr{width: 100%; height: auto; display: block; border: 1px solid gray;}
#bnr ul li:first-child { margin: 0 10px 0 0;}
#bnr ul li p { padding: 15px 0 0; font-size: 14px; font-family: 'Noto Sans Japanese medium';}
#bnr ul li p img { padding: 0 15px 0 0;}


/* ------------------------------------------------------------ footer */

#foot #f_nav { background: url(../images2/common/footer/bg.jpg) center center no-repeat; background-size: cover; padding: 70px 0 85px; font-family: 'Lato', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, sans-serif;}
#foot #f_nav h3 { padding: 0 0 15px;}
#foot #f_nav h3 a { color: #fff; }
#foot .box { float: left; width: 260px;}
#foot .box ul li a { background: url(../images2/common/footer/arw.png) left center no-repeat; padding: 0 0 0 15px; font-size: 14px; color: #fff; }
#foot #f_bottom { padding: 65px 0 35px;}
#foot #f_bottom h3 { padding: 0 0 30px;}
#foot #f_bottom p { font-size: 14px; }
#foot #f_bottom ul { padding: 25px 0 45px;}
#foot #f_bottom ul li { display: inline-block; *display: inline; *zoom: 1; padding: 0 5px;}
#foot #address { font-size: 10px; color: #767676; padding: 80px 0 0; }
#foot #totop { position: absolute; right: 25px; bottom: 35px;}

/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){

body { color: #070b0c; font-size: 14px; min-width: inherit;}
a:link 		{ color: #070b0c; text-decoration: none; }
a:visited 	{ color: #070b0c; text-decoration: none; }
a:hover,
a:hover img,
input[type="submit"]:hover { color: #070b0c; text-decoration: none; 
	filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8; }
    
input[type="text"],
select,
textaera	{ border: 1px solid #b5b5b5; }

input[type="submit"] { -webkit-appearance: button; cursor: pointer; padding: 0; border: none; }

h1 		{ font-size: 10px;}

.inner 	{ width: 90%; margin: 0 auto; }
.btn 	{ text-align: center; padding: 15px 0 0;}
.btn a 	{ display: inline-block; *display: inline; *zoom: 1; color: #fff; font-size: 15px; font-family: 'Noto Sans Japanese';}
.btn.common a { background: url(../images2/common/btn.gif) 97% center no-repeat #000; width: 90%; height: 52px; line-height: 52px;}
.btn.top { padding: 45px 0 50px;}

#top { position: relative;}

h3.h3 { text-align: center; padding: 0 0 15px;}
h3.h3 span { font-size: 30px; font-family: ; display: block; letter-spacing: 2px; line-height: 150%;}

.PC { display: none;}
.SP { display: block;}

/* ------------------------------------------------------------ header */
body.stop{}
#header { padding: 10px 0; position: fixed; min-width: auto; transition: 0.5s; }
#header h1 { padding: 0 0 3px; position: relative; z-index: 100;}
#header #header_internal{padding: 0 0 0 14px;transition: 0.5s;position: relative; z-index: 100;}
#header ul{display: none; width: 100%; position: absolute; top: 0px; left: 0px;background: #fff;padding: 86px 0 0;height: 100vh;z-index: 100;}
#header ul li {  text-align: left;  width: 90%; border-bottom: 1px solid #000;margin: 0 5%;}
#header #logo {position: relative; z-index: 100; width: 106px; min-width: inherit; padding: 4px 0 0; }
#header ul li a{display: block; width: auto; height: auto; text-align: left; position: relative; padding: 14px 5% 15px;line-height: 160%; color: #000;}
#header ul li a:before{content: ""; position: absolute; right: 5%; top: 50%; transform: translateY(-50%) rotateZ(-45deg); width: 8px; height: 8px; border-bottom: 1px solid #000; border-right: 1px solid #000;}
#header #logo img { width: 100px; height: auto;}
#header #header_box { float: left; width: 50%; padding: 0 0 0 2%; position: relative; z-index: 100;}
#header #header_box  #google_translate_element .goog-te-gadget-simple { font-size: 10px; }
#navigation p#close{ position: absolute; top: 10px; right: 3%; }

#header .header-child{ display: none; }
#header .header-child{ position: initial; width: 90%; margin: 0 0 0 auto; padding: 0 0 25px; background: none; overflow-y: auto; display: none; opacity: 1; visibility: visible; }
#header .header-child__inner{ flex-direction: column; gap: 15px; padding: 0; }
#header .header-child__col,
#header .header-child__col--pic{ width: 100%; }

#header .header-child__heading{ font-size: 14px; margin-bottom: 9px; color: #000; }
#header .header-child__link{ font-size: 12px; padding: 0 0 11px 22px; color: #000; }
#header .header-child__link:before{ transform: none; border: none; top: 9px; width: 12px; background: #000; }

#header .header-child__pic{ margin-top: 15px; }
#header .header-child__pic img{ width: 100%; height: auto; border-radius: 6px; }
#header .header-child__col--pic img{ width: 60%; }
 
  
/* ------------------------------------------------------------ fv */

#fv_wrapper { padding: 64px 0 0; }
#fv { padding: 18% 0;}
#fv h2 { padding: 0 0 15px; letter-spacing: 2px; font-size: 14px;}
#fv h2 span { font-family: ; font-size: 35px; letter-spacing: 5px; display: block; line-height: 130%;}
#fv p { font-size: 10px; letter-spacing: 1px; line-height: 130%;}

/* ------------------------------------------------------------ bread */

#bread { padding: 10px 0;}
#bread ol li { list-style-type: none; display: inline-block; *display: inline; *zoom: 1; text-align: center; background: url(../images2/common/bread.gif) left center no-repeat; padding: 0 0 0 30px; margin: 0 3px 0 0;}
#bread ol li:first-child { padding: 0; background: none;}
#bread ol li a { color: #4461b1; font-size: 12px;}
#bread ol li strong { font-size: 12px;} 

/* ------------------------------------------------------------ entrance */

#entrance { padding: 25px 0 0;}
#entrance li { float: none; width: 100%; text-align: center; margin: 0 0 10px;}
#entrance li:first-child { margin: 0 0 10px;}
#entrance li img { float: left; width: 50%; height: auto;}
#entrance li div { padding: 4% 0; float: left; width: 50%; }
#entrance li div h4 { font-size: 13px;}
#entrance li div h4 span { font-size: 18px; display: block; letter-spacing: 1px;}


/* ------------------------------------------------------------ bnr */

#bnr { padding: 50px 0; background: #f2f2f2;}
#bnr a.recruitbnr { margin: 0 auto 30px; }
#bnr ul li { float: none; width: 100%;}
#bnr ul li:first-child { margin: 0 0 20px;}
#bnr ul li img.bnr { width: 100%; height: auto;}
#bnr ul li p { padding: 5px 0 0; font-size: 12px;}
#bnr ul li p img { padding: 0 15px 0 10px;}


/* ------------------------------------------------------------ footer */

#foot #f_nav { background: url(../images2/common/footer/bg.jpg) center center no-repeat; background-size: cover; padding: 35px 0 40px; font-family: 'Lato', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, sans-serif;}
#foot #f_nav h3 { padding: 10px 0;}
#foot #f_nav h3 a { color: #fff; display: inline-block; *display: inline; *zoom: 1; float: left; width: 70%;}
#foot .box { float: none; width: 100%;}
#foot .box ul li a { background: url(../images2/common/footer/arw.png) left center no-repeat; padding: 5px 0 5px 15px; font-size: 12px; color: #fff; display: block; }
#foot #f_bottom { padding: 35px 0 15px;}
#foot #f_bottom h3 { padding: 0 0 15px;}
#foot #f_bottom p { font-size: 12px; padding: 0 3%;}
#foot #f_bottom ul { padding: 15px 0 20px;}
#foot #f_bottom ul li { display: inline-block; *display: inline; *zoom: 1; padding: 0 5px;}
#foot #address { font-size: 10px; color: #767676; padding: 40px 0 0; }
#foot #totop { position: absolute; right: 3%; bottom: 30px;}
#foot #totop img { width: 30px; height: auto;}

#foot #f_nav h3 img { float: right; padding: 10px 0 0;}
#foot #f_nav .box ul { display: none; margin: 0 0 10px;}

/* ------------------------------------------------------------ menu */

#menu-btn { position: relative;
    z-index: 100;margin: 0 0 0 auto; } 
#menu-btn img { display: inline !important; }

#open_modal { cursor: pointer; display: block;}

.fixed { position: fixed; z-index: 10;}
#mask { display: none; height: 100%; width: 100%; height: 100%; min-height: 100%; background: #fff; position: fixed; /* opacity: 0.7; filter: alpha(opacity=70); -moz-opacity:0.70; */ top: 0; left: 0; right: 0; bottom: 0; z-index: 11999; }

/* #open_modal { cursor: pointer; right: 10px; top: 10px; z-index: 999; position: fixed; } */
#navigation { text-align: center; margin: 0 auto; top: 0; right: 0; left: 0; margin: 0; z-index: 12000; position: absolute; display: none; color: #000;}
#navigation #menu-box  { position: relative; padding: 60px 3% 70px;}
#navigation #menu-box h3 { text-align: center; padding: 0 0 20px; }
#navigation #main-menu 			{ font-size: 14px; z-index: 999; width: 100%; padding: 0 0 25px;}
#navigation #main-menu .box 	{ width: 100%; text-align: left; border-bottom: 1px solid #000;}
#navigation #main-menu .box a 	{ color: #000; text-align: left; padding: 15px 0; display: inline-block; *display: inline; *zoom: 1; font-size: 16px; }
/* #navigation p#close 		{ position: absolute; top: 10px; right: 3%; } */
#navigation p#close img { padding: 10px;}

#menu-box h4 img { float: right; padding: 25px 0 0;}
#menu-box h4 a { float: left; width: 60%;}
#navigation #main-menu .box ul { display: none; margin: 0 0 10px;}
#navigation #main-menu .box ul li a { font-size: 14px; background: url(../images2/common/footer/arw.png) left center no-repeat;
padding: 5px 0 5px 15px; display: block;}


 
}