@charset "utf-8";
/* ------------------------------------------------------------ common */
html, body{ overflow-x: hidden; font-family:'Noto-Sans-JP-Regular'; font-weight:normal; }
body { min-width: 1100px; }
a:link 		{ color: #111; text-decoration: none; }
a:visited 	{ color: #111; text-decoration: none; }
a:hover,
a:hover img,
input[type="submit"]:hover { color: #111; text-decoration: none; filter:alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8; }
    
input[type="text"],
select,
textaera	{ border: 1px solid #b5b5b5; border-radius: inherit; outline: inherit; -webkit-appearance: none; -moz-appearance: none; appearance: none;}

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

.inner 	{ width: 1100px; margin: 0 auto; }
.SP { display: none; }

@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-JP-Regular';
  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');
 }
 


.recruit { max-width: 1300px; margin: 0 auto 145px; }
.recruit .left { display: block; width: 550px; height: 500px; float: left; background-color: #eeeeee; padding: 0 48px 0 60px; position: relative; }
.recruit .left::before { content: ''; display: block; width: 100%; height: 100%; position: absolute; z-index: -1; top: 39px; left: -33px; border: 1px dotted #ebebeb; }
.recruit .left:hover { opacity: 1; }
.recruit .left .title { font-family: 'Nexa-Bold'; font-weight: bold; font-size: 46px; color: #1b1b1b; margin-top: -20px; margin-bottom: 42px; }
.recruit .left .title .sub { display:block;font-family: 'Noto-Sans-JP-Regular'; font-style: normal; font-size: 19px; margin-top: 15px; }
.recruit .left h4 { font-family: 'Noto Sans Japanese'; font-style: normal; font-size: 26px; line-height: 48px; margin-bottom: 30px; }
.recruit .left p { font-family: 'Noto-Sans-JP-Regular'; font-style: normal; line-height: 32px; }
.recruit .left .btn-black { font-family: 'Noto-Sans-JP-Regular'; font-style: normal; font-size: 15px; color: #000000; border-bottom: 1px solid; background: none; position: absolute; left: 60px; bottom: 75px; padding: 12px 78px 12px 0; }
.recruit .right { width: calc(100% - 550px); float: left; position: relative; bottom: 97px; }
.recruit .right img { width: 100%; }

.wrapper-breadcrumb-intro { width: calc((100% - 1300px) / 2 + 1300px); padding-bottom: 190px; background-color: #ffffff; margin-top: -165px; position: relative; }

.breadcrumb { padding: 45px 66px 80px; list-style: none; }
.breadcrumb li { display: inline; font-size: 12px; font-family: 'Noto-Sans-JP-Regular'; font-style: normal; position: relative; }
.breadcrumb li+li { margin-left: 35px; }
.breadcrumb li+li:before { content: ''; display: block; width: 1px; height: 35px; background-color: #000000; position: absolute; left: -17px; top: -8px; transform: rotate(30deg); -webkit-transform: rotate(30deg); -moz-transform: rotate(30deg); -ms-transform: rotate(30deg); -o-transform: rotate(30deg); }
.breadcrumb li a { text-decoration: none; }
.breadcrumb li a:hover { text-decoration: underline; }

.banner-common{ height: 100vh; max-height: 800px; background: url('../images/company/banner.jpg') center no-repeat; background-size: cover; position: relative; top: -50px; }
.banner-common h2{width: 740px;text-align: center;letter-spacing: 5px;font-family: 'Nexa-Bold'; font-weight: bold; font-size: 70px; color: #ffffff; position: absolute; top: 46%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); }
.banner-common h2 .sub{ display:block;letter-spacing: 2px;text-align: center; font-family: 'Noto-Sans-JP-Regular'; font-style: normal; font-size: 17px; margin-top: 10px; }

.intro { width: 100%; max-width: 1300px; max-width: 1300px; margin-left: auto; text-align: center; }
.intro h3 { font-family: 'Noto Sans Japanese'; font-style: normal; font-size: 32px; line-height: 60px; margin-bottom: 40px; }
.intro .disc { font-family: 'Noto-Sans-JP-Regular'; font-style: normal; line-height: 32px; margin-bottom: 30px; }

.scroll-to-top{ width: 75%; max-width: 328px; height: 73px; text-align: center; line-height: 73px; border: 1px solid #000000; font-family: 'Noto-Sans-JP-Regular'; font-style: normal; font-size: 15px; background-color: #ffffff; display: block; margin: 114px auto 0; transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; -ms-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; }
.scroll-to-top:hover{ background-color: #000000; color: #ffffff; }
/* ------------------------------------------------------------ fonts */

@font-face {
   font-family: 'Noto-Sans-JP-Light';
   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-weight: 300;
 }

 @font-face {
    font-family: 'Noto-Sans-JP-Regular';
    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-weight: 400;
  }
 @font-face {
    font-family: 'Noto-Sans-JP-Medium';
    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-weight: 500;
 }
 
 @font-face {
    font-family: 'Noto-Sans-JP-Bold';
    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-weight: 700;
     font-style: bold;
 
 }

@font-face {
    font-family: 'JosefinSans-BoldItalic';
    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: 'Nexa-Bold';
   src: url('../fonts/Nexa-Bold.woff') format('woff'),
        url('../fonts/Nexa-Bold.ttf') format('truetype'),
        url('../fonts/Nexa\ Bold.otf') format('otf');
}


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

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




/* ------------------------------------------------------------ mobile ------------------------------------------------------------ */
@media only screen and (max-width:640px){
.inner { width: 90%; margin: 0 auto; }
.PC { display: none; }
.SP { display: block; }  
body { min-width: 100%; }

.recruit { position: relative; padding: 0 15px; margin-bottom: 30px; }
.recruit .left { width: 100%; height: auto; margin-left: 15px; padding: 38px 15px 65px 25px; position: relative; z-index: 1; }
.recruit .left::before { content: none; }
.recruit .left .title { font-size: 12px; margin-top: 0; margin-bottom: 15px; }
.recruit .left .title .sub { display: none; }
.recruit .left h4 { font-size: 18px; line-height: 32px; margin-bottom: 20px; }
.recruit .left p { font-size: 14px; line-height: 26px; }
.recruit .right { position: absolute; z-index: 0; width: calc(100% - 30px); top: -173px; bottom: auto; }
.recruit .left .btn-black { padding: 5px 36px 5px 0; font-size: 12px; bottom: 30px; left: auto; right: 0; }

.banner-common{ height: 250px; }
.banner-common h2 { width:auto;font-size: 29px; width: 100%; text-align: center; top: 50%; letter-spacing: 2px;}
.banner-common h2 .sub { font-size: 12px; }

.breadcrumb { padding: 0; margin-bottom: 70px; }
.breadcrumb li { font-size: 11px; }
.breadcrumb li+li { margin-left: 16px; }
.breadcrumb li+li:before { height: 18px; top: 0; left: -10px; }

.wrapper-breadcrumb-intro { width: calc(100% - 15px); padding: 20px 15px; margin-top: -85px; }
.wrapper-breadcrumb-intro .intro h3 { font-size: 14px; text-align: left; line-height: 16px; margin-bottom: 20px; }
.wrapper-breadcrumb-intro .intro h3 .sub{ font-size: 30px; line-height: 32px; margin-top: 20px; }
.wrapper-breadcrumb-intro .intro .disc { font-size: 12px; line-height: 24px; margin-bottom: 20px; text-align: justify; }

.scroll-to-top { margin-top: 50px; height: 50px; line-height: 50px; }
}