@import url(//fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&subset=japanese);
@import url(//fonts.googleapis.com/css?family=Roboto:400,700&display=swap);
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
 margin:0;
 padding:0;
 border:0;
 font-size:100%;
 font:inherit;
 vertical-align:baseline
}
article,
aside,
details,
figcaption,
figure,
main,
footer,
header,
hgroup,
menu,
nav,
section {
 display:block
}
ol,
ul {
 list-style:none
}
blockquote,
q {
 quotes:none
}
blockquote::before,
blockquote::after,
q::before,
q::after {
 content:'';
 content:none
}
table {
 border-collapse:collapse;
 border-spacing:0
}
* {
 -webkit-box-sizing:border-box;
 box-sizing:border-box
}
*::before,
*::after {
 -webkit-box-sizing:border-box;
 box-sizing:border-box
}
html {
 font-size:14px;
 -webkit-font-smoothing:antialiased;
 -webkit-tap-highlight-color:transparent
}
html,
body {
 font-size:62.5%;
 overflow-x:hidden
}
body {
 font-family:"Noto Sans JP","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif;
 font-weight:300;
 width:100%;
 -webkit-text-size-adjust:100%;
 font-size:14px;
 font-size:1.4rem;
 line-height:2
}
.preload * {
 -webkit-transition:none !important;
 -moz-transition:none !important;
 -ms-transition:none !important;
 -o-transition:none !important;
 transition:none !important
}
#loading {
 background:#fff;
 background:-webkit-linear-gradient(left, #fff 0%, #fff 100%);
 background:-moz-linear-gradient(left, #fff 0%, #fff 100%);
 background:linear-gradient(to right, #fff 0%, #fff 100%);
 width:100%;
 height:100%;
 position:fixed;
 top:0;
 left:0;
 text-align:center;
 z-index:2000;
 pointer-events:none;
 transition:all .8s .3s;
 display:flex;
 justify-content:center;
 align-items:center
}
#loading .loadingBox {
 width:20%;
 max-width:120px;
 -webkit-animation:rotateY 1.5s linear 0s infinite;
 -moz-animation:rotateY 1.5s linear 0s infinite;
 animation:rotateY 1.5s linear 0s infinite;
 transition:all .3s
}
@media all and (max-width: 896px) {
 #loading .loadingBox {
  width:30%;
  max-width:300px
 }
}
#loading.completion {
 opacity:0
}
@keyframes rotateY {
 0% {
  -webkit-transform:rotateY(0deg);
  -moz-transform:rotateY(0deg);
  transform:rotateY(0deg)
 }
 25% {
  -webkit-transform:rotateY(90deg);
  -moz-transform:rotateY(90deg);
  transform:rotateY(90deg)
 }
 50% {
  -webkit-transform:rotateY(180deg);
  -moz-transform:rotateY(180deg);
  transform:rotateY(180deg)
 }
 75% {
  -webkit-transform:rotateY(270deg);
  -moz-transform:rotateY(270deg);
  transform:rotateY(270deg)
 }
 100% {
  -webkit-transform:rotateY(360deg);
  -moz-transform:rotateY(360deg);
  transform:rotateY(360deg)
 }
}
.red {
 color:#c11e3a
}
.btn01 a {
 position:relative;
 display:block;
 margin:0 auto;
 height:60px;
 width:300px;
 border:1px solid #000;
 line-height:60px;
 padding:0 10px;
 text-decoration:none;
 text-align:left;
 color:#000;
 font-weight:bold;
 transition:all .3s
}
.btn01 a:after {
 content:"▶";
 position:absolute;
 top:50%;
 right:10px;
 transform:translateY(-50%);
 font-size:8px
}
.btn01 a:hover {
 border:1px solid #c11e3a;
 background:#c11e3a;
 color:#fff
}
.btn01 a:hover:after {
 color:#fff
}
.btnSp {
 width:100%;
 height:50px;
 margin:15px 0
}
.btnSp a {
 position:relative;
 display:block;
 margin:0 auto;
 height:60px;
 width:300px;
 border:1px solid #000;
 line-height:60px;
 padding:0 10px;
 text-decoration:none;
 text-align:left;
 color:#000;
 font-weight:bold;
 transition:all .3s
}
.btnSp a:after {
 content:"\f2a0";
 font-family:"Font Awesome 5 Free";
 position:absolute;
 top:50%;
 right:10px;
 transform:translateY(-50%);
 font-size:18px;
 font-weight:bold
}
.btnSp a:hover {
 border:1px solid #c11e3a;
 background:#c11e3a;
 color:#fff
}
@media screen and (min-width: 481px) {
 .btnSp {
  display:none
 }
}
.tbl01 {
 width:100%;
 margin-bottom:40px
}
.tbl01 tr th,
.tbl01 tr td {
 text-align:left;
 display:block;
 width:100%;
 padding:15px 0
}
@media screen and (min-width: 769px) {
 .tbl01 tr th,
 .tbl01 tr td {
  display:table-cell;
  width:auto;
  padding:20px 0
 }
}
.tbl01 tr th {
 border-bottom:1px solid #ff7990;
 padding:20px 0 10px
}
@media screen and (min-width: 769px) {
 .tbl01 tr th {
  padding:20px 0
 }
}
.tbl01 tr td {
 border-bottom:1px solid #ffd4d9
}

/*pageTop
-------------------------------------------------*/
.bann_subsidy { display:none!important; }
.bann { display: none!important;}

@media screen and (max-width:800px) {
.pc { display: none!important; }
.bann_subsidy { display: block!important; }
.bann { display: block!important; width: 100%!important;}
.bann img { width: 100% !important;}
}

.banner { position:absolute; top:75.5%; right: 0px; z-index:100; }

.banner img {width: 90%;}

@media screen and (max-width:1350px) {
.banner { position:absolute; top:75%; right: -90px; z-index:100; }
.banner img {width: 70%;}
.kiran img { width: 260px !important;}
.floating-banner {top:19% !important;}
.floating-banner_r {top:19% !important;}
}

.bound {
  animation: bound 3s infinite !important;
}

@keyframes bound {
  0% { transform:translateY(0) }
  5% { transform:translateY(0) }
  10% { transform:translateY(0) }
  20% { transform:translateY(-25px) }
  25% { transform:translateY(0) }
  30% { transform:translateY(-15px) }
  50% { transform:translateY(0) }
  100% { transform:translateY(0) }
}

.floating-banner {
    position: fixed; /* 追従 */
    z-index: 1000; /* 他の要素の下に隠れないように */
    top:18%; /* バナーの上下の位置 */
    left:10px; /* バナーの左右の位置 */
}


.floating-banner a {
 width: 100%;
 height: 100%;
}

/*下層ページ用追従設定*/

.floating-banner_r {
    position: fixed; /* 追従 */
    z-index: 1000; /* 他の要素の下に隠れないように */
    top:18%; /* バナーの上下の位置 */
    right:10px; /* バナーの左右の位置 */
}

.floating-banner_r a {
 width: 100%;
 height: 100%;
}


@media screen and (max-width: 990px) { /* タブレット用のブレイクポイントを指定 */
    .pc {
        display: none; /* タブレットサイズ以下でPC用のバナーを非表示に */
    }
}


/*追従バナー　アニメーション*/
.anim-box.poyopoyo {
  animation: poyopoyo 4s ease-out infinite;
  opacity: 1;
}
@keyframes poyopoyo {
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.95);
  }
}

.keyframe3 {
    animation-name: anim_s;
    transform: rotate(6deg);
    animation-duration: 4s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}
 

@keyframes anim_s {
    50% {
        transform: rotate(-15deg);
    }
    100% {
        transform: rotate(6deg);
    }
}



/*追従バナー　hover　*/

.kiran img {
    width: 300px;
}

.kiran:hover img {
    opacity: 0.9;
}




.pageTop {
 opacity:0;
 pointer-events:none;
 position:fixed;
 bottom:10px;
 right:10px;
 z-index:150;
 transition:all .5s
}


@media all and (max-width: 1024px) {
 .pageTop {
  bottom:3px;
  right:2px;
 }
 }  
.pageTop .up {
 display:block;
 width: 100%;
 text-align: right !important;
 margin:0 10px 1% 0;
 transition:all .3s
}

.pageTop .up img{
    width: 76px;
    height: 44px;
}




.pageTop a:hover {
 opacity:.7
}
.pageTop a img {
 width:100%
}
.pageTop.active {
 opacity:1;
 pointer-events:painted;
 z-index:1000;
}


.bann_subsidy {
width:100%;
float: left;
text-align: center !important;
     z-index:150;
}

.bann_subsidy img {
    width: 98% !important;
}


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

.header {
 width:100%;
 position:fixed;
 top:0;
 left:0;
 z-index:1050;
}
.header .headerInner {
 height:55px;
 display:flex;
 justify-content:space-between;
 align-items:center;
 transition:all 0.5s ease;
 background:rgba(255,255,255,0.8)
}
@media screen and (min-width: 769px) {
 .header .headerInner {
  height:120px
 }
}
@media screen and (min-width: 1200px) {
 .header .headerInner {
  background:none
 }
}
.header .headerInner .headerTop {
 display:flex;
 align-items:center;
 height:100%
}
@media screen and (min-width: 1200px) {
 .header .headerInner .headerTop {
  background:rgba(255,255,255,0.85)
 }
}
.header .headerInner .headerTop h1,
.header .headerInner .headerTop .logo {
 width:180px;
 margin-right:10px;
 padding-left:10px
}
@media screen and (min-width: 769px) {
 .header .headerInner .headerTop h1,
 .header .headerInner .headerTop .logo {
  width:225px;
  margin-right:15px;
  padding-left:15px
 }
}
.header .headerInner .headerTop h1 a img,
.header .headerInner .headerTop .logo a img {
 width:100%;
 height:auto;
 vertical-align:bottom
}
.header .headerInner .headerTop h1 a:hover,
.header .headerInner .headerTop .logo a:hover {
 opacity:.7
}
.header .headerInner .headerTop p {
 font-size:1rem;
 font-family:"Roboto",sans-serif;
 line-height:1.5
}
@media screen and (min-width: 769px) {
 .header .headerInner .headerTop p {
  font-size:1.2rem
 }
}
.header .headerInner .headerTop p img {
 width:80px
}
@media screen and (min-width: 769px) {
 .header .headerInner .headerTop p img {
  width:100px
 }
}
.header .headerInner .headerTopRight {
 display:flex;
 align-items:center
}
@media screen and (min-width: 1200px) {
 .header .headerInner .headerTopRight {
  width:100%;
  -webkit-flex:1;
  flex:1
 }
}
.header .headerInner .navButton {
 display:block;
 cursor:pointer;
 float:right;
 background:#e60012;
 z-index:20;
 position:relative;
 width:55px;
 height:55px
}
@media screen and (min-width: 1200px) {
 .header .headerInner .navButton {
  display:none
 }
}
.header .headerInner .navButton span {
 display:inline-block;
 transition:all .4s;
 position:absolute;
 left:10px;
 width:35px;
 height:4px;
 background-color:#fff
}
.header .headerInner .navButton span:nth-of-type(1) {
 top:13px
}
.header .headerInner .navButton span:nth-of-type(2) {
 top:26px
}
.header .headerInner .navButton span:nth-of-type(3) {
 bottom:12px
}
.header .headerInner .navButton.active span:nth-of-type(1) {
 -webkit-transform:translateY(14px) rotate(-45deg);
 transform:translateY(14px) rotate(-45deg)
}
.header .headerInner .navButton.active span:nth-of-type(2) {
 opacity:0
}
.header .headerInner .navButton.active span:nth-of-type(3) {
 -webkit-transform:translateY(-13px) rotate(45deg);
 transform:translateY(-13px) rotate(45deg)
}
.header .headerInner .nav {
 opacity:0;
 position:fixed;
 right:-100%;
 top:0;
 z-index:10;
 background:rgba(255,255,255,0.85);
 width:100%;
 margin-top:55px;
 transition:all .3s
}
@media screen and (min-width: 769px) {
 .header .headerInner .nav {
  margin-top:120px
 }
}
@media screen and (min-width: 1200px) {
 .header .headerInner .nav {
  opacity:1;
  position:inherit;
  margin:0;
  height:120px
 }
}
.header .headerInner .nav .gNav {
 margin-right:30px;
 width:100%;
 position:relative;
 overflow-x:hidden;
 overflow-y:auto;
 display:flex;
 flex-wrap:wrap;
 transition:all .3s
}
@media screen and (min-width: 1200px) {
 .header .headerInner .nav .gNav {
  height:100%;
  text-align:center;
  justify-content:flex-end
 }
}
.header .headerInner .nav .gNav li {
 display:flex;
 width:100%
}
@media screen and (min-width: 1200px) {
 .header .headerInner .nav .gNav li {
  justify-content:center;
  width:auto;
  align-items:center
 }
}
.header .headerInner .nav .gNav li a {
 text-decoration:none;
 line-height:1.75;
 display:block;
 color:#000;
 padding:20px;
 font-size:1.6rem;
 width:100%;
 border-bottom:1px solid #ccc;
 position:relative
}
.header .headerInner .nav .gNav li a:after {
 content:"▶";
 position:absolute;
 top:50%;
 right:10px;
 transform:translateY(-50%);
 font-size:8px
}
@media screen and (min-width: 1200px) {
 .header .headerInner .nav .gNav li a:after {
  content:none
 }
}
@media screen and (min-width: 1200px) {
 .header .headerInner .nav .gNav li a {
  padding:0 20px;
  font-size:1.4rem;
  border-bottom:none
 }
}
@media screen and (min-width: 1300px) {
 .header .headerInner .nav .gNav li a {
  padding:0 35px
 }
}
.header .headerInner .nav .gNav li a span {
 color:#c11e3a;
 font-family:"Roboto",sans-serif;
 font-weight:bold;
 margin-left:15px;
 font-size:1.2rem
}
@media screen and (min-width: 1200px) {
 .header .headerInner .nav .gNav li a span {
  display:block;
  margin-left:0
 }
}
@media screen and (min-width: 1300px) {
 .header .headerInner .nav .gNav li a span {
  font-size:1.4rem
 }
}
.header .headerInner .nav .gNav li a:hover {
 opacity:.7
}
@media screen and (min-width: 1200px) {
 .header .headerInner .nav .gNav li:nth-of-type(4) {
  margin-right:20px
 }
}
@media screen and (min-width: 1200px) {
 .header .headerInner .nav .gNav li.btnContact,
 .header .headerInner .nav .gNav li.btnRecruit {
  display:none
 }
}
.header .headerInner .nav.open {
 right:0;
 opacity:1
}
.header .headerInner .gNavSub {
 display:none
}
@media screen and (min-width: 1200px) {
 .header .headerInner .gNavSub {
  height:100%;
  width:250px;
  display:block
 }
}
.header .headerInner .gNavSub li {
 height:60px
}
.header .headerInner .gNavSub li a {
 width:250px;
 height:100%;
 display:flex;
 justify-content:center;
 align-items:center;
 color:#fff;
 text-decoration:none
}
.header .headerInner .gNavSub li a.btnContact {
 background:rgba(251,67,99,0.7)
}
.header .headerInner .gNavSub li a.btnRecruit {
 background:rgba(168,40,62,0.7)
}
.header .headerInner .gNavSub li a:hover {
 opacity:.7
}
@media screen and (min-width: 1025px) {
 _:-ms-lang(x)::-ms-backdrop,
 .header .headerInner .gNavSub {
  width:auto
 }
}
.secTtl {
 font-size:1.8rem;
 font-weight:bold;
 margin-bottom:40px;
 line-height:1.5
}
@media screen and (min-width: 374px) {
 .secTtl {
  font-size:2rem
 }
}
@media screen and (min-width: 769px) {
 .secTtl {
  font-size:3.6rem;
  margin-bottom:80px
 }
}
.secTtl .secTtlIcon {
 font-size:2.5rem;
 color:#c11e3a
}
@media screen and (min-width: 769px) {
 .secTtl .secTtlIcon {
  font-size:5rem
 }
}
.secTtl .secTtlEng {
 display:block;
 font-size:1.2rem;
 color:#c11e3a;
 font-family:"Roboto",sans-serif
}
@media screen and (min-width: 769px) {
 .secTtl .secTtlEng {
  font-size:1.6rem
 }
}
.secTtl.secTtlLeft .secTtlEng {
 display:block;
 margin-left:10px;
 vertical-align:middle
}
@media screen and (min-width: 481px) {
 .secTtl.secTtlLeft .secTtlEng {
  display:inline
 }
}
@media screen and (min-width: 769px) {
 .secTtl.secTtlLeft .secTtlEng {
  margin-left:30px
 }
}
.secTtl.secTtlCenter {
 text-align:center
}
.secTtl.secTtlCenter .secTtlEng {
 display:block;
 margin-left:10px;
 vertical-align:middle
}
@media screen and (min-width: 481px) {
 .secTtl.secTtlCenter .secTtlEng {
  display:inline
 }
}
@media screen and (min-width: 769px) {
 .secTtl.secTtlCenter .secTtlEng {
  margin-left:30px
 }
}
.txtCenter {
 text-align:center
}
.txtCenter span {
 display:inline-block;
 text-align:left
}
.secTtlRed {
 color:#c11e3a;
 font-weight:bold;
 font-size:1.6rem;
 margin-bottom:30px
}
@media screen and (min-width: 769px) {
 .secTtlRed {
  font-size:2.4rem
 }
}
.secTtlSub {
 display:inline-block;
 padding-left:18px;
 font-size:1.8rem;
 margin-bottom:25px;
 position:relative;
 border-bottom:1px solid #c11e3a
}
@media screen and (min-width: 769px) {
 .secTtlSub {
  margin-bottom:40px;
  font-size:2.4rem
 }
}
.secTtlSub:after {
 content:"";
 height:100%;
 width:4px;
 background:#c11e3a;
 position:absolute;
 left:4px;
 top:0
}
.secTtlSub:before {
 content:"";
 height:100%;
 width:2px;
 background:#c11e3a;
 position:absolute;
 left:0;
 top:0
}
h4 {
 font-size:1.8rem;
 font-weight:bold
}
.secMainTtl {
 background:url("../img/top/bg_secTtl.jpg") center center no-repeat;
 background-size:cover;
 height:50vh;
 width:100vw;
 display:flex;
 text-align:center;
 align-items:center
}
.secMainTtl.secMainTtlBusiness {
 background:url("/files/img/business/bg_secTtl.jpg") center center no-repeat;
 background-size:cover
}
.secMainTtl.secMainTtlProduct {
 background:url("/files/img/product/bg_secTtl.jpg") center center no-repeat;
 background-size:cover
}
.secMainTtl.secMainTtlQuality {
 background:url("/files/img/quality/bg_secTtl.jpg") center center no-repeat;
 background-size:cover
}
.secMainTtl.secMainTtlEmployment {
 background:url("/files/img/employment/bg_secTtl.jpg") center center no-repeat;
 background-size:cover
}
.secMainTtl.secMainTtlinquiry {
 background:url("/files/img/inquiry/bg_secTtl.jpg") center center no-repeat;
 background-size:cover
}
.secMainTtl.secMainTtlPrivacy {
 background:url("/files/img/privacy/bg_secTtl.jpg") center center no-repeat;
 background-size:cover
}
.secMainTtl .secMainTtlContainer {
 width:100%;
 max-width:960px;
 margin:0 auto
}
.secMainTtl .secMainTtlContainer .secMainTtlBox {
 position:relative
}
.secMainTtl .secMainTtlContainer h1 {
 font-size:3rem;
 color:#fff;
 font-family:"Roboto",sans-serif;
 font-weight:bold;
 line-height:1.2;
 position:absolute;
 top:0;
 right:0;
 bottom:0;
 left:0;
 margin:auto
}
@media screen and (min-width: 481px) {
 .secMainTtl .secMainTtlContainer h1 {
  font-size:4rem
 }
}
@media screen and (min-width: 769px) {
 .secMainTtl .secMainTtlContainer h1 {
  font-size:5rem
 }
}
@media screen and (min-width: 1025px) {
 .secMainTtl .secMainTtlContainer h1 {
  font-size:6rem
 }
}
.secMainTtl .secMainTtlContainer h1.secTtlBlk {
 color:#000;
 opacity:.3;
 animation:jaggy 3s  infinite
}
.secMainTtl .secMainTtlContainer h1.secTtlRed {
 color:#de4761;
 opacity:.3;
 animation:jaggy2 2.6s  infinite
}
.secMainTtl .breadcrumb {
 position:absolute;
 width:100%;
 top:65px;
 margin:0 auto;
 color:#fff;
 font-size:1.1rem
}
@media screen and (min-width: 769px) {
 .secMainTtl .breadcrumb {
  top:130px;
  font-size:1.3rem
 }
}
.secMainTtl .breadcrumb ul {
 display:flex;
 justify-content:flex-start;
 width:100%;
 max-width:1440px;
 margin:0 auto;
 padding:0 20px
}
.secMainTtl .breadcrumb ul li {
 margin-right:15px;
 display:flex;
 align-items:center
}
.secMainTtl .breadcrumb ul li a {
 color:#fff;
 text-decoration:none
}
.secMainTtl .breadcrumb ul li.icon {
 font-size:.6rem;
 vertical-align:middle
}
@keyframes jaggy {
 0% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
 2% {
  transform:translate(0px, -12px) rotateZ(0deg)
 }
 4% {
  transform:translate(-12px, 0px) rotateZ(0deg)
 }
 6% {
  transform:translate(0px, -12px) rotateZ(0deg)
 }
 8% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
 10% {
  transform:translate(-12px, -12px) rotateZ(0deg)
 }
 12% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
 14% {
  transform:translate(0px, -12px) rotateZ(0deg)
 }
 16% {
  transform:translate(-12px, 0px) rotateZ(0deg)
 }
 18% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
 100% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
}
@keyframes jaggy2 {
 0% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
 2% {
  transform:translate(12px, 12px) rotateZ(0deg)
 }
 4% {
  transform:translate(0px, 12px) rotateZ(0deg)
 }
 6% {
  transform:translate(12px, 0px) rotateZ(0deg)
 }
 8% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
 10% {
  transform:translate(12px, 12px) rotateZ(0deg)
 }
 12% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
 14% {
  transform:translate(12px, 0px) rotateZ(0deg)
 }
 16% {
  transform:translate(0px, 12px) rotateZ(0deg)
 }
 18% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
 100% {
  transform:translate(0px, 0px) rotateZ(0deg)
 }
}
.sec {
 padding:80px 0 0
}
.sec .secInner {
 width:100%;
 max-width:1470px;
 padding:0 15px;
 margin:0 auto
}
.sec .secInner .secInnerBox {
 margin-bottom:40px
}
@media screen and (min-width: 769px) {
 .sec .secInner .secInnerBox {
  margin-bottom:80px
 }
}
.sec .secInner .secInnerBox.box860 {
 width:100%;
 max-width:860px;
 margin-left:auto;
 margin-right:auto
}
.sec .secInner .secInnerBox.box1000 {
 width:100%;
 max-width:1000px;
 margin-left:auto;
 margin-right:auto
}
.sec .secInner .secInnerBox.box1000 p {
 width:100%;
 max-width:860px;
 margin-left:auto;
 margin-right:auto
}
.sec .secInner .secInnerBox .secTtlSub1000 {
 width:100%;
 max-width:1000px;
 margin-left:auto;
 margin-right:auto
}
.sec .secInner p {
 font-size:1.4rem
}
@media screen and (min-width: 769px) {
 .sec .secInner p {
  font-size:1.6rem
 }
}
.sec .secInner p.txtIndent {
 padding-left:15px
}
@media screen and (min-width: 769px) {
 .sec .secInner p.txtIndent {
  padding-left:30px
 }
}
.sec.hasMgb {
 margin-bottom:40px
}
@media screen and (min-width: 769px) {
 .sec.hasMgb {
  margin-bottom:80px
 }
}
.sec .secCaution {
 font-size:1.2rem;
 margin:40px 0 20px
}
@media screen and (min-width: 769px) {
 .sec .secCaution {
  font-size:1.4rem;
  margin:80px 0 40px
 }
}
.productsList ul {
 display:flex;
 justify-content:space-between;
 flex-wrap:wrap;
 background:#000
}
.productsList ul li {
 width:50%
}
@media screen and (min-width: 769px) {
 .productsList ul li {
  width:25%
 }
}
.productsList ul li a {
 display:block;
 color:#fff
}
.productsList ul li a .productsListBox {
 position:relative;
 overflow:hidden
}
.productsList ul li a .productsListBox .productsListBoxImg img {
 width:100%;
 vertical-align:bottom;
 transition:all .3s
}
@media screen and (min-width: 769px) {
 .productsList ul li a .productsListBox .productsListBoxImg img {
  opacity:.5
 }
}
.productsList ul li a .productsListBox .productsListBoxOv {
 background:url(/files/img/common/bg_productsList_01.png) center center no-repeat;
 background-size:cover;
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%
}
@media screen and (min-width: 769px) {
 .productsList ul li a .productsListBox .productsListBoxOv {
  transform:translateY(100%);
  transition:all .3s
 }
}
.productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner {
 width:100%;
 position:absolute;
 bottom:10px;
 left:10px
}
@media screen and (min-width: 769px) {
 .productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner {
  bottom:45px;
  left:30px
 }
}
.productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner h3 {
 text-align:left;
 margin-bottom:10px;
 font-size:1.6rem
}
@media screen and (min-width: 481px) {
 .productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner h3 {
  margin-bottom:20px;
  font-size:1.8rem
 }
}
@media screen and (min-width: 1025px) {
 .productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner h3 {
  font-size:2.2rem
 }
}
.productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner .productsListBtn {
 position:relative;
 display:block;
 height:50px;
 width:80%;
 max-width:300px;
 border:1px solid #fff;
 line-height:46px;
 padding:0 10px;
 text-decoration:none;
 text-align:left;
 color:#fff;
 font-weight:bold;
 transition:all .3s
}
@media screen and (min-width: 481px) {
 .productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner .productsListBtn {
  width:70%;
  height:60px;
  line-height:60px
 }
}
@media screen and (min-width: 769px) {
 .productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner .productsListBtn {
  width:100%
 }
}
.productsList ul li a .productsListBox .productsListBoxOv .productsListBoxOvInner .productsListBtn:after {
 content:"▶";
 position:absolute;
 top:50%;
 right:10px;
 transform:translateY(-50%);
 font-size:8px
}
.productsList ul li a:hover .productsListBox .productsListBoxImg img {
 opacity:1;
 transform:scale(1.2, 1.2)
}
.productsList ul li a:hover .productsListBox .productsListBoxOv {
 transform:translateY(0)
}
.footer {
 width:100%;
 text-align:center
}
.footer .footerTop {
 margin-bottom:40px
}
@media screen and (min-width: 769px) {
 .footer .footerTop {
  margin-bottom:80px
 }
}
.footer .footerTop ul {
 display:block;
 width:100%;
 text-align:center
}
@media screen and (min-width: 769px) {
 .footer .footerTop ul {
  display:flex
 }
}
.footer .footerTop ul li {
 width:100%
}
@media screen and (min-width: 769px) {
 .footer .footerTop ul li {
  width:50%
 }
}
.footer .footerTop ul li a {
 display:flex;
 justify-content:center;
 align-items:center;
 width:100%;
 height:180px;
 color:#fff;
 text-decoration:none
}
@media screen and (min-width: 769px) {
 .footer .footerTop ul li a {
  height:250px
 }
}
.footer .footerTop ul li a:hover {
 opacity:.7
}
.footer .footerTop ul li a p {
 display:flex;
 justify-content:center;
 align-items:center;
 border:1px solid #fff;
 width:500px;
 height:100px;
 margin:0 30px;
 font-weight:bold
}
.footer .footerTop ul li .btnContact {
 background:#c11e3a
}
.footer .footerTop ul li .btnRecruit {
 background:#932336
}
.footer .footerNav {
 margin-bottom:40px
}
@media screen and (min-width: 769px) {
 .footer .footerNav {
  margin-bottom:80px
 }
}
.footer .footerNav ul {
 display:block
}
@media screen and (min-width: 769px) {
 .footer .footerNav ul {
  display:flex;
  justify-content:center
 }
}
.footer .footerNav ul li {
 padding:10px 0;
 border-bottom:1px solid #eee
}
@media screen and (min-width: 769px) {
 .footer .footerNav ul li {
  padding:0 50px;
  display:block;
  border:none
 }
}
.footer .footerNav ul li a {
 color:#000;
 font-weight:bold;
 text-decoration:none
}
.footer .footerNav ul li a:hover {
 opacity:.7
}
.footer .footerLogo {
 display:block;
 text-align:center;
 padding:0 15px
}
.footer .footerLogo h2 {
 width:220px;
 margin:0 auto
}
@media screen and (min-width: 769px) {
 .footer .footerLogo h2 {
  width:280px
 }
}
.footer .footerLogo h2 a img {
 width:100%;
 height:auto;
 vertical-align:bottom
}
.footer .footerLogo h2 a:hover {
 opacity:.7
}
.footer .footerLogo .footerTel {
 margin:20px auto 40px;
 font-size:1.6rem;
 font-family:"Roboto",sans-serif
}
.footer .footerLogo p {
 font-size:1rem;
 font-family:"Roboto",sans-serif;
 line-height:1.5;
 margin:30px 0
}
@media screen and (min-width: 769px) {
 .footer .footerLogo p {
  font-size:1.2rem
 }
}
.footer .footerLogo p img {
 width:100px
}
@media screen and (min-width: 769px) {
 .footer .footerLogo p img {
  width:150px
 }
}
.footer .footerLogo p.btnSp {
 margin:10px 0 25px;
 font-size:1.4rem
}
.footer .copy {
 text-align:center;
 margin-bottom:30px;
 font-size:1rem;
 color:#404040
}
@media screen and (min-width: 769px) {
 .footer .copy {
  font-size:1.2rem
 }
}