@charset "UTF-8";

/*common setting*/

html{
  color: #333;
  font-family:Lato,'Noto Sans JP', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 14px;
  line-height: 1.75;
  letter-spacing: 1px;
  text-align: left;
  font-variant-ligatures:none;
}

body{
  background-color: #fff;
}

::selection{
background: #667EEA;
color: #fff;
}

p::-moz-selection,
p span::-moz-selection {
background: #667EEA;
color: #fff;
}

a{
  color: inherit;
  text-decoration: none;
  line-height: 1;
  pointer-events: auto!important;
}

img{
  display: block;
}

ul{
  list-style: none;
}

.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}

/* loading */

.no-js #loading{
  display: none!important;
}

#loading {
  display: block;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background-image: linear-gradient(-45deg, #EAEDFC 0%, #ECE6F2 100%);
  background: -moz-linear-gradient(top left, #EAEDFC 0%, #ECE6F2 100%);
  background: -webkit-linear-gradient(top left, #EAEDFC 0%, #ECE6F2 100%);
  z-index: 99;
}

.loading_inner{
  width: 100%;
  position: absolute;
  display: inline-block;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
}

.loading_logo{
  width: 240px;
  height: 58px;
  margin: 0 auto 8px;
  background: url(../image/logo.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/logo.svg) no-repeat 0 0; /* modern browser */
  -webkit-background-size: contain;
  background-size: contain;
}

.loading_text{
  text-align: center;
  margin-left: 23px;
}

#loading span {
  font-size: 14px;
  color: #4A2270;
  letter-spacing: 23px;
  display: inline-block;
  margin: 0 0;
  animation: loading 1.2s infinite alternate;
}
#loading span:nth-child(2) {
  animation-delay: .1s;
}
#loading span:nth-child(3) {
  animation-delay: .2s;
}
#loading span:nth-child(4) {
  animation-delay: .3s;
}
#loading span:nth-child(5) {
  animation-delay: .4s;
}
#loading span:nth-child(6) {
  animation-delay: .5s;
}
#loading span:nth-child(7) {
  animation-delay: .6s;
}
@keyframes loading {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.page {
    animation: fadeIn 1s ease-in-out 0s 1 normal;
    -webkit-animation: fadeIn 1s ease-in-out 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

















/* contents */

.contents{
  margin: 76px auto 64px;
}

.width90,
.width45,
.width72_sp90,
.width86_sp90{
  margin-left: auto;
  margin-right: auto;
}
.width90,
.width45,
.width72_sp90,
.width86_sp90{
  width: 88.8888%;
  margin: 0 auto 0;
}

.width100{
  width: 100%;
  margin: 0 auto 0;
}

.width90_sp100{
  width: 100%;
  margin: 0 auto 0;
}

/* contents margin */
.mb80{
  margin: 0 auto 48px!important;
}
.mb112{
  margin: 0 auto 64px!important;
}

/* background color */

.bgcolor{
  width: 100%;
  padding: 64px 0;
  margin: 0 auto;
  background-image: linear-gradient(-45deg, #EAEDFC 0%, #ECE6F2 100%);
  background: -moz-linear-gradient(top left, #EAEDFC 0%, #ECE6F2 100%);
  background: -webkit-linear-gradient(top left, #EAEDFC 0%, #ECE6F2 100%);
}

/* cancel br */

.cancel_sp,
.cancel_sp2{
  display: none;
}

/* btn */

.btn_box,
.btn_box2{
  width: 100%;
}

.btn_box3{
  width: 88.8888%;
  margin: 0 auto;
}

.btn_box4{
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

.btn_box,
.btn_box3{
  text-align: center;
}
.btn_box2{
  text-align: right;
}

.btn_box_sp{
  display: block;
  position: absolute;
  bottom: -40px;
  left: 0;
  width: 100%;
  text-align: center;
}


.btn_vm,
.btn_vm2,
.txt_vm,
.txt_vm2{
  white-space: nowrap;
  display: inline-block;
  font-size: inherit;
  letter-spacing: 7px;
  padding: 0 0 6px 5px;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.btn_vm{
  text-align: center;
  border-bottom: 1px solid #667EEA;
  border-top-width: 0;
  border-left-width: 0;
  border-right-width: 0;
  border-image: linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);
  border: -moz-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  border: -webkit-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  border-image-slice: 1;
}
.btn_vm2{
  float: none;
  text-align: center;
  border-bottom: 1px solid #667EEA;
}

.btn_gra,
.btn_graBg{
  border-radius: 25px;
}

.btn_gra{
  width: 100%;
  margin: 0 auto auto;
  line-height: 1;
  display: block;
  border: 1px solid transparent;
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  background-origin: border-box;
}

.btn_gra p{
  display: block;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
  letter-spacing: 1px;
  font-size: 14px;
  padding: 16px 0 16px;
  border: 1px solid transparent;
  background-color: transparent;
}

.btn_graBg{
  display:block;
  background-color: #fff;
}

.txt_vm,
.txt_vm2{
  border-bottom: 1px solid #667EEA;
  border-top: 1px solid #fff;
}

.txt_vm,
.txt_vm2{
  float: none;
  text-align: center;
}

.btn_scrl_box2,
.btn_scrl_box3{
  margin: -32px auto 64px;
}

.btn_scrl_con2,
.btn_scrl_con3{
  float: left;
  line-height: 1;
  display: block;
  border: 1px solid transparent;
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  background-origin: border-box;
}

.btn_scrl_con2,
.btn_scrl_con3,
.btn_scrl_conBg{
  border-radius: 18px;
}

.btn_scrl_conBg{
  display:block;
  background-color: #fff;
}

.btn_scrl_con2,
.btn_scrl_con3{
  text-align: center;
}

.btn_scrl_con2{
  width: 100%;
  margin: 0 0 10px 0;
}
.btn_scrl_con3{
  width: 100%;
  margin: 0 0 10px 0;
}

.btn_scrl_con2:last-child,
.btn_scrl_con3:last-child{
  margin: 0 0 0 0;
}


.btn_scrl_con2 .btn_scrl_conBg p,
.btn_scrl_con3 .btn_scrl_conBg p{
  display: block;
  padding: 10px 0;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.btn_scrl_con2 .btn_scrl_conBg p::after,
.btn_scrl_con3 .btn_scrl_conBg p::after{
  content: url(../image/icon_arrow_down.svg);
  position: relative;
  top: 0px;
  left: 6px;
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
       -o-transition: all 0.5s ease-in-out;
}

/*  sp header*/

.spHead{
  width: 100%;
  background-color: #fff;
  position: fixed;
  z-index: 2;
  top: 0;
  left: 0;
}

.spHeadLogo,
.spHeadLogo_img{
  float: left;
}

.spHeadLogo{
  height: 56px;
}

.spHeadLogo a {
   display: inline-block;
 }


.spHeadLogo_img{
  width: 201px;
  height: 48px;
  margin: 0 32px 0 0;
  background: url(../image/logo.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/logo.svg) no-repeat 0 0; /* modern browser */
  -webkit-background-size: contain;
  background-size: contain;
}


/*nav*/

.menu-btn {
    position: fixed;
    top: 0px;
    right: 0px;
    width: 56px;
    height: 56px;
    cursor: pointer;
    z-index: 5;
}

.icon-animation{
  width: 22px;
  height: 20px;
  top: 20px;
  right: 16px;
  display: block;
  position: absolute;
}

.icon-animation span {
    width: 22px;
    height: 2px;
    display: block;
    background: #667EEA;
    position: absolute;
    right: 0;
    top: 10px;
}

.type-3 span {
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
  }
.type-3 .middle {
    transform: translateX(0px) translateY(0px);
  }
.type-3 .top {
    transform: translateY(-9px);
  }
.type-3 .bottom {
    transform: translateY(9px);
  }

.type-3.is-open .middle {
    transform: translateX(100px);
  }
.type-3.is-open .top {
    transform: rotate(-45deg) translateY(0px);
  }
.type-3.is-open .bottom {
    transform: rotate(45deg) translateY(0px);
  }

/* 開閉用ボタンがクリックされた時のスタイル */

body.open {
/*  overflow: hidden;*/
  position: fixed;
}

.spMenu {
  position: fixed;
  top: 56px;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  z-index: 5;
  overflow-y: auto;
  background-image: linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);
  background: -moz-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  background: -webkit-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
       -o-transition: all 0.5s ease-in-out;
}

.spMenu ul {
  font-size: 14px;
  line-height: 1;
  color: #fff;
  margin: 24px 20px 32px;
}

.spMenu li {
  border-bottom: solid 1px #fff;
  position: relative;
}

.spMenu li a,
.spMenu li p{
  width: 100%;
  font-size: 16px;
  display: inline-block;
  letter-spacing: 3px;
  padding: 16px 0 15px;
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
       -o-transition: all 0.5s ease-in-out;
}

.spMenu_smtxt{
  font-size: 10px;
  padding: 0 0 0 8px;
  letter-spacing: 1px;
  display: inline-block;
}

.spMenu li a.spMenu_txtsub{
  font-size: 14px;
}

.spMenu li p{
  cursor: pointer;
}

.spMenu li p span.spMenu_arrow::after{
  content: url(../image/icon_arrow_r.svg);
  position: absolute;
  top: 16px;
  right: 8px;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
       -o-transition: all 0.5s ease-in-out;
}

.spMenu li p span.open::after{
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
}

.spMenu__dropdown{
  margin: 0!important;
  display: none;
}

.spMenu__dropdown li{
  border-bottom: solid 1px #fff;
}

.spMenu__dropdown li a{
  color: #fff;
  padding: 17px 0 15px 15px;
}

.spMenu__dropdown li:first-child{
  border-top: solid 1px #fff;
}

.spMenu__dropdown li:last-child{
  border-bottom: none;
}

/* 開閉用ボタンがクリックされた時のスタイル */
.open .spMenu {
    visibility: visible;
    opacity: 1;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
       -moz-transition: all 0.5s ease-in-out;
         -o-transition: all 0.5s ease-in-out;
}

.spMenu__name,
.spMenu__address,
.spMenu__tel{
  text-align: center;
  color: #fff;
}

.spMenu__name{
  font-weight: bold;
  margin: 0 auto 16px;
}

.spMenu__tel{
  margin: 0 auto 32px;
}

.spMenu__btn{
  text-align: center;
  margin: 0 auto 48px;
}

.spMenu__btn_box{
  display: inline-block;
}

.spMenu__btnMail,
.spMenu__btnSns{
  float: left;
}

.spMenu__btnMail img,
.spMenu__btnSns img{
  width: 32px;
  height: 32px;
}

.spMenu__btnMail{
  margin: 0 0 0 0;
}

.spMenu__btnSns{
  margin: 0 32px 0 0;
}

/* footer banner */

.footerBnr{
  position: relative;
  padding: 32px 5.5556%;
  margin: 0 auto 0;
  background: url(../image/footerBnr_bg.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}

.footerBnr_contents{
  display: block;
  float: left;
  width: 100%;
  margin: 0 0 6px 0;
  text-align: center;
}

.footerBnr_contents:last-child{
  margin: 0 0 0 0;
}

.footerBnr_con_box{
  display: inline-block;
  padding: 18px 0 16px;
}

.footerBnr_contents>a{
  display: block;
  background: rgba(255, 255, 255, .8);
  cursor: pointer;
}

.footerBnr_contents img,
.footerBnr_con_inner{
  float: left;
}

.footerBnr_contents img{
  width: 42px;
  height: auto;
  margin: 0 16px 0 0;
}

.footerBnr_contents h3,
.footerBnr_contents p{
  text-align: left;
  color: #4A2270;
  line-height: 1;
  width: 136px;
  white-space: nowrap;
}

.footerBnr_contents h3{
  font-size: 14px;
  padding-top: 6px;
  margin-bottom: 4px;
}
.footerBnr_contents p{
  font-size: 10px;
}

/* breadcrumb */

.breadcrumb{
  margin: 0 auto 8px;
  display: inline-block;
}

.breadcrumb li{
  float: left;
  font-size: 12px;
  line-height: 1;
  padding: 0 0 0;
  margin: 0 4px 0 0;
}

/* footer */

#footer{
  position: relative;
  border-top: 1px solid #4A2270;
  padding: 32px 0 16px;
}

.footer_l,
.footer_r{
  float: none;
}

.footerLogo{
  position: static;
}

.footerLogo>a{
  display: block;
}

.footerLogo_img{
  width: 267px;
  height: 64px;
  margin: 0 auto;
  background: url(../image/logo.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/logo.svg) no-repeat 0 0; /* modern browser */
  -webkit-background-size: contain;
  background-size: contain;
}

#footer>p{
  display: none;
}

/* copyright */

.copyright{
  position: static;
}

.copyright p{
  font-size: 10px;
  line-height: 1;
  letter-spacing: 2px;
  text-align: center;
  margin: 0 0 48px;
}

/*go top & facebook icon */

.gotop a{
  position: fixed;
  z-index: 10;
  width: 32px;
  height: 32px;
  display: block;
}

.gotop a{
  bottom: 32px;
  right: 16px;
  background: url(../image/icon_gotop_h.png) no-repeat  center center; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/icon_gotop_h.svg) no-repeat center center; /* modern browser */
}

.gotop a img{
  position: absolute;
  top: 0;
  left: 0;
  width: 32px;
  height: 32px;
  pointer-events: none;
  display: block;
  opacity: 1;
}

/* mainvisual */

.mainvisual{
  position: relative;
  margin: 0 auto 32px;
  padding-top: 152.238%;
  background: url(../image/01top_main_sp.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}

.mainvisual h1,
.mainvisual h2{
  position: absolute;
}

.mainvisual h1{
  top: 16px;
  right: -8px;
  width: 73.4328%;
}

.mainvisual h1 img{
  width: 100%;
  height: auto;
  background: url(../image/01top_catch.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/01top_catch.svg) no-repeat 0 0; /* modern browser */
  -webkit-background-size: contain;
  background-size: contain;
}
.mainvisual h2{
  bottom: 16px;
  left: 0;
}

.mainvisual h2 span{
  font-size: 18px;
  padding: 8px 12px 8px 12px;
  margin: 0 0 4px 0;
  display: inline-block;
  color: #000;
  background-color: #fff;
  font-weight: bold;
  line-height: 1;
}

/* close */

.close_top,
.close_sub{
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  padding: 16px 24px 16px;
  background-image: linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);
  background: -moz-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  background: -webkit-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
}

.close_top{
margin: 0 auto 32px;
}
.close_sub{
  margin: -32px auto 48px;
}


/* news */

.news{
  max-height: 200px;
  border-left:none;
  border-right:none;
}

.newsTitle,
.newsContents,
.newsText>time,
.newsText>p{
  float: left;
}

.newsTitle{
  width: 100%;
}

.newsTitle h3{
  text-align: left;
  margin: 0 auto 16px;
  padding: 0 0;
  letter-spacing: 4px;
  font-size: 32px;
  width: 100%;
  line-height: 1;
  display:inline-block;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.newsContents{
  width: 100%;
  max-height: 152px;
  padding: 0 0;
  margin: 0 0;
  overflow: scroll;
  -ms-overflow-style: none;
}

.newsText{
  line-height: 1.5;
  margin: 0 10px 16px 0;
}

.newsText>time{
  margin: 0 0 0 0;
}

.newsText>p>a{
  text-decoration: underline;
}

/* top message */

.topMessage>h3{
  font-size: 32px;
  letter-spacing: 4px;
  margin: 0 auto 32px;
  line-height: 1;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.topMessage>h4{
  font-size: 18px;
  letter-spacing: 2px;
  margin: 0 auto 28px;
}

.topMessage>p{
  letter-spacing: 2px;
  margin: 0 auto 32px;
}

/* top banner */

.topBnr_contents{
  display: block;
  float: left;
  width: 48.3582%;
  margin: 0 3.2836% 10px 0;
}

.topBnr_contents:nth-child(2){
  margin: 0 0 10px 0;
}

.topBnr_contents:nth-child(3){
  margin: 0 3.2836% 0 0;
}

.topBnr_contents:last-child{
  margin: 0 0 0 0;
}

.topBnr_contents>a{
  display: block;
  background-image: linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);
  background: -moz-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  background: -webkit-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
}

.topBnr_contents img{
  width: 38px;
  height: auto;
  padding: 36px 0 0;
  margin: 0 auto 24px;
}

.topBnr_contents h3,
.topBnr_contents p{
  text-align: center;
  color: #fff;
  line-height: 1;
}

.topBnr_contents h3{
  font-size: 14px;
  margin-bottom: 6px;
}
.topBnr_contents p{
  font-size: 10px;
  padding-bottom: 36px;
}

/* top contents */

.topCon_l,
.topCon_r,
.topCon_2{
  position: relative;
  overflow: visible;
  display: block;
  margin: 0 auto 96px;
}

.topCon_l:before,
.topCon_r:before,
.topCon_2:before{
  content:"";
  display: block;
}
.topCon_l:before,
.topCon_r:before,
.topCon_2:before{
  padding-top: 62%;
}

.topCon_2{
  float: none;
  width: 100%;
}

.topCon_l_img,
.topCon_r_img,
.topCon_2_img{
  overflow: hidden;
  position: absolute;
  height: 100%;
}

.topCon_l_img,
.topCon_r_img,
.topCon_2_img{
  width: 100%;
}
.topCon_2_img{
  float: none;
}

.topCon_l_img,
.topCon_2_img{
  top: 0;
  right: 0;
}

.topCon_r_img{
  top: 0;
  left: 0;
}

.topCon_l_imgBg,
.topCon_r_imgBg,
.topCon_2_imgBg{
  width: 100%;
  height: 100%;
  display: inline-block;
}

.topCon_l_imgBg_ws{
  background: url(../image/01top_workstyle_sp.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.topCon_r_imgBg_ms{
  background: url(../image/01top_message_sp.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.topCon_2_imgBg_gl{
  background: url(../image/01top_gallery_sp.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.topCon_2_imgBg_rec{
  background: url(../image/01top_recruit_sp.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.topCon_2_imgBg_sr{
  background: url(../image/04workstyke_sr.jpg) no-repeat;
  background-position: top center;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.topCon_2_imgBg_as{
  background: url(../image/04workstyke_assitant.jpg) no-repeat;
  background-position: top center;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}




.topCon_l_contents,
.topCon_r_contents,
.topCon_2_contents{
  z-index: 1;
  position: static;
}

.topCon_l_contents,
.topCon_2_contents{
  top: 0;
  left: 0;
}

.topCon_r_contents{
  top: 0;
  right: 0;
}

.topCon_l>a,
.topCon_r>a,
.topCon_2>a{
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
}





.topCon_l_contents h1,
.topCon_r_contents h1,
.topCon_2_contents h1{
  position: absolute;
  top: -15px;
  left: 10px;
  height: 30px;
  margin: 0 0 0;
}

.topCon_l_contents h1 img,
.topCon_r_contents h1 img,
.topCon_2_contents h1 img{
  width: auto;
  height: 30px;
}

.topCon_l_contents h2,
.topCon_r_contents h2,
.topCon_2_contents h2{
  position: absolute;
  bottom: 12px;
  left: 0;
  margin: 0 auto 0;
}

.topCon_l_contents h2 span,
.topCon_r_contents h2 span,
.topCon_2_contents h2 span{
  font-size: 13px;
  letter-spacing: 0;
  margin: 0 0 2px 0;
  display: inline-block;
  color: #000;
  background-color: #fff;
  font-weight: bold;
  line-height: 1;
  white-space: nowrap;
}
.topCon_l_contents h2 span,
.topCon_2_contents h2 span{
  padding: 6px 12px 6px 8px;
}

.topCon_r_contents h2 span{
  padding: 6px 12px 6px 8px;
}

/******************** sub page ********************/

/* sub pagetitle */

.pagetitle{
  position: relative;
  margin: 0 auto 48px;
}

.pagetitle_ms{
  padding-top: 30.2778%;
  background: url(../image/02message_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_as{
  padding-top: 30.2778%;
  background: url(../image/03aboutus_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_ws{
  padding-top: 30.2778%;
  background: url(../image/04workstyle_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_ws_sr{
  padding-top: 30.2778%;
  background: url(../image/04-1sr_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_ws_as{
  padding-top: 30.2778%;
  background: url(../image/04-2assistant_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_rec{
  padding-top: 30.2778%;
  background: url(../image/05recruit_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_rec_sr{
  padding-top: 30.2778%;
  background: url(../image/05-1sr_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_rec_as{
  padding-top: 30.2778%;
  background: url(../image/05-2assistant_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_rec_sys{
  padding-top: 30.2778%;
  background: url(../image/05-3system_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.pagetitle_rec_ga{
  padding-top: 30.2778%;
  background: url(../image/05-4generalaffairs_main.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
/*
.pagetitle>h1{
  font-size: 24px;
  line-height: 1;
  letter-spacing: 6px;
  transform: translateY(-50%) translateX(0%);
  -webkit-transform: translateY(-50%) translateX(0%);
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}
*/
.pagetitle_inner>h1{
  font-size: 24px;
  line-height: 1;
  letter-spacing: 6px;
  margin: 0 auto 6px;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.pagetitle_inner>p.pagetitle_jp{
  font-size: 10px;
  padding: 0 0 0;
  margin: 0 auto 0;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 4px;
  border-bottom: none;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.pagetitle_inner{
  position: absolute;
  top: 50%;
  left: 8.3334%;
  transform: translateY(-50%) translateX(0%);
  -webkit-transform: translateY(-50%) translateX(0%);
}

.pagetitle_inner>p{
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0px;
  font-weight: bold;
  padding: 0 0 4px;
  margin: 0 auto 6px;
  border-bottom: 1px solid #667EEA;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.pagetitle_inner>p span{
  font-size: 6px;
}


/* sub contents title */
.contentstitle,
.contentstitle2{
  width: 100%;
  text-align: center;
}

.contentstitle{
  margin: 0 auto 32px;
}
.contentstitle2{
  margin: 16px auto 32px;
}

.contentstitle h2,
.contentstitle2 h2{
  width: 100%;
  font-size: 24px;
  line-height: 1;
  letter-spacing: 6px;
  text-align: center;
  margin: 0 auto 6px;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.contentstitle p,
.contentstitle2 p{
  font-size: 10px;
  line-height: 1;
  width: 100%;
  letter-spacing: 4px;
  font-weight: bold;
  text-align: center;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}



/* sub common catch */
.sub_catch{
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.sub_catch{
  font-size: 18px;
  margin: 0 auto 24px;
}

/* sub layout01 */

.sub_layout01_order{
  display: flex;
  display:-webkit-box;
  display: -webkit-flex;
  display:-ms-flexbox;
  flex-wrap:wrap;
  -webkit-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
}

.sub_layout01_o01{
  order:2;
  -webkit-box-ordinal-group:2;
  -ms-flex-order:2;
  -webkit-order:2;
}
.sub_layout01_o02{
  order:1;
  -webkit-box-ordinal-group:1;
  -ms-flex-order:1;
  -webkit-order:1;
}

.sub_layout01_img,
.sub_layout01_con{
  width: 100%;
  min-height: none;
  overflow: visible;
  display: block;
  position: relative;
  float: left;
}

.sub_layout01_img:before{
  content:'';
  display:block;
  width:100%;
  height:0;
  padding-top: 61.75%;
}

.sub_layout01_con:before{
  content:'';
  display:none;
}

.sub_layout01_inner,
.sub_layout02_inner{
  width: 100%;
  position: static;
}

.sub_layout01_inner{
  padding: 32px 5% 64px;
}

.sub_layout02_inner{
  padding: 32px 5% -64px;
}

.sub_layout01_order .sub_layout01_inner{
  padding: 32px 5% 0;
}

.sub_layout01_listTitle p{
  font-size: 14px;
  margin: 0 auto 16px;
  padding: 0 0 2px;
  border-bottom: 1px solid #667EEA;
  display: inline-block;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.sub_layout01_w01,
.sub_layout01_w02{
  margin: 0 auto 0;
}

.sub_layout01_w01,
.sub_layout01_w02{
  width: 100%;
}

.sub_layout01_listCon li{
  line-height: 1.5;
  margin: 0 auto 10px;
  background: url(../image/icon_oval.png) no-repeat 0 9px; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/icon_oval.svg) no-repeat 0 9px; /* modern browser */
  background-size: 4px;
  padding: 0 0 0 12px;
}

.sub_layout01_msImg01{
  background: url(../image/02message_01.jpg) no-repeat;
  background-position: center right;
  background-size: cover;
  -webkit-background-size: cover;
}
.sub_layout01_msImg02{
  background: url(../image/02message_02.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}

.sub_layout01_wsSrImg01{
  background: url(../image/04-1sr_01.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.sub_layout01_wsSrImg02{
  background: url(../image/04-1sr_02.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.sub_layout01_wsAsImg01{
  background: url(../image/04-2assistant_01.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.sub_layout01_wsAsImg02{
  background: url(../image/04-2assistant_02.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}

/* sub message */

.msValue{
  display: block;
  margin: 0 auto 0;
}

.msValue_contents{
  float: none;
  width: 100%;
  margin: 0 0 16px 0;
  background-color: #fff;
}

.msValue_contents:last-child{
  margin: 0 0 0 0;
}

.msValue_con_box{
  display: inline-block;
  margin: 64px 10% 48px;
}

.msValue_contents img{
  width: 64px;
  height: auto;
  margin: 0 auto 48px;
}

.msValue_contents h5{
  font-size: 18px;
  letter-spacing: 2px;
  line-height: 1;
  margin-bottom: 24px;
  text-align: center;
  width: auto;
  color: #4A2270;
}

.msCulture01,
.msCulture02{
  position: relative;
}
.msCulture01{
  margin: 0 auto 64px;
}
.msCulture02{
  position: relative;
  margin: 0 auto 64px;
}
.msCulture01:last-child{
  margin: 0 auto 0;
}

.msCul_img_l,
.msCul_img_r{
  width: 100%;
  display: block;
  position: relative;
}
.msCul_img_l{
  float: none;
}

.msCul_img_r{
  float: none;
}

.msCul_img_l::before,
.msCul_img_r::before{
  content:'';
  display:block;
  width:100%;
  height:0;
  padding-top: 61.8056%;
}

.msCul_img01{
  background: url(../image/02message_03.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.msCul_img02{
  background: url(../image/02message_04.jpg) no-repeat;
  background-position: center left;
  background-size: cover;
  -webkit-background-size: cover;
}
.msCul_img03{
  background: url(../image/02message_05.jpg) no-repeat;
  background-position: center right;
  background-size: cover;
  -webkit-background-size: cover;
}

.msCul_con_l,
.msCul_con_r{
  float: none;
  width: 100%;
}
.msCul_con_l{
  float: none;
  padding: 32px 5% 0;
}
.msCul_con_r{
  float: none;
  padding: 32px 5% 0;
}

.msCul_con_link{
  margin: 0 auto 32px;
}

/* sub about us */

.as_detail{

}

.asDetail_list,
.asDetail_map{
  float: none;
}

.asDetail_list{
  width: 100%;
  margin: 0 0 16px 0;
  border: none;
  border-collapse: collapse;
  display: table;
}

.asDetail_list th,
.asDetail_list td{
  padding: 4px 0;
  float: left;
  display: table-cell;
  font-weight: normal;
  vertical-align: middle;
}
.asDetail_list th{
border-bottom: solid 1px #D8D8D8;
}

.asDetail_list td{
  border-bottom: none;
  margin: 0 auto 24px;
}

.asDetail_list th{
  width: 100%;
}

.asDetail_list td{
  width: 100%;
}

.asDetail_history{
  width: 100%;
  border: none;
  border-collapse: collapse;
  display: table;
}

.asDetail_history th,
.asDetail_history td{
  padding: 0 0;
  border-bottom: none;
  vertical-align: top;
}

.asDetail_history th{
  width: 94px;
}

.asDetail_history td{
  width: calc(100% - 94px);
  margin: 0 auto 0;
}

.asDetail_map{
  width: 100%;
}

.asDetail_mapCon{
  margin: 0 auto 32px;
}
.asDetail_mapCon:last-child{
  margin: 0 auto 0;
}

.asDetail_map iframe{
  width: 100%;
  height: 300px;
}

.asDetail_map ul{
  width: 100%;
  margin: 0 auto 16px;
  font-size: 14px;
  letter-spacing: 0;
}

.asDetail_map ul li{
  float: left;
}

.asDetail_map ul li:first-child{
  width: 100%;
  border-bottom: solid 1px #D8D8D8;
  padding: 0 0 4px 0;
  margin: 0 0 4px 0;
}

.asDetail_map ul li:last-child{
  width: 100%;
}

.asGallery{
  margin: 0 0 0;
}

.asGallery_img,
.asGallery_img2,
.asGallery_imgB,
.asGallery_imgB2{
  float: left;
  display: inline-block;
  padding: 0 0 0;
  margin: 0 0 10px;
}

.asGallery_img,
.asGallery_img2,
.asGallery_imgB,
.asGallery_imgB2{
  width: 100%;
}
.asGallery_img2{
  margin-top: 0;
}
.asGallery_imgB{
  margin-top: 0;
}

.asGallery_img img,
.asGallery_imgB img,
.asGallery_img2 img,
.asGallery_imgB2 img{
  width: 100%;
  height: auto;
}

/* sub recruit */

.recruit_con{
  float: none;
  width: 100%;
  margin: 0 0 16px 0;
  display: block;
}

.recruit_con:last-child{
  margin: 0 0 0 0;
}

.recruit_con a{
  display: block;
  cursor: pointer;
  width: 100%;
  height: 100%;
}


.recCon_bg{
  position: relative;
  width: 100%;
  background-image: linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);
  background: -moz-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  background: -webkit-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
}

.recCon_bg::before{
  content:"";
  display: block;
  padding-top: 61.7142%;
}

.recCon_inner{
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
}

.recruit_con h3,
.recruit_con p{
  color: #fff;
  line-height: 1;
  text-align: center;
}

.recruit_con h3{
  font-size: 32px;
  letter-spacing: 6px;
  margin: 0 auto 12px;
  font-weight: reguler;
}

.recruit_con p{
  font-size: 14px;
  letter-spacing: 2px;
}

/* sub workstyle detail */

.workstyle_slider{
  margin: 0 auto 0;
}

.wsDs_slideBox{
  padding: 0 20px 32px 0;
}

.swiper-slide:first-child{
  margin-left: 0;
}

.wsDs_timeBox{
  width: 100%;
  display: block;
  overflow: hidden;
}

.wsDs_timeBox time,
.wsDs_timeLine{
  float: left;
}

.wsDs_timeBox time{
  font-size: 16px;
  margin: 0 auto 14px;
  padding-right: 6px;
  line-height: 1;
  font-weight: bold;
}

.wsDs_timeLine{
  position: relative;
  margin-top: 8px;
}

.wsDs_timeLine::before{
  content: "";
  position: absolute;
  display: block;
  top: 50%;
  left: 0;
  transform: translateY(-50%) translateX(0%);
  -webkit-transform: translateY(-50%) translateX(0%);
  width: 7px;
  height: 7px;
  background-color: #667EEA;
  border-radius: 100%;
  z-index: 2;
}

.wsDs_timeLine span{
  width: 240px;
  position: absolute;
  display: block;
  top: 50%;
  left: 0;
  transform: translateY(-50%) translateX(0%);
  -webkit-transform: translateY(-50%) translateX(0%);
  height: 1px;
  border-bottom: 1px solid #667EEA;
}


.wsDs_contents h4{
  font-size: 16px;
  margin: 0 auto 10px;
  letter-spacing: 4px;
  line-height: 1.25;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.wsDs_contents h4.wsDs_contents_l1{
  padding: 10px 0 10px;
}

.wsDs_contents p{
  letter-spacing: 0;
  padding: 0 20px 0 0;
}

.wsAj_contents{
  margin: 0 auto 64px;
}

.wsAj_contents:last-child{
  margin: 0 auto 48px;
}

.wsAj_img,
.wsAj_inner{
  overflow: hidden;
  display: block;
  position: relative;
  float: none;

}
.wsAj_img{
  width: 100%;
  margin: 0 0 32px 0;
}
.wsAj_inner{
  width: 100%;
}

.wsAj_img:before{
  content:'';
  display:block;
  width:100%;
  height:0;
  padding-top: 61.8056%;
}
.wsAj_img:before{
  padding-top: 61.8056%;
}

.wsAj_text_inner{
  width: 90%;
  margin: 0 auto;
}

.wsAj_imgSr01{
  background: url(../image/04-1sr_03.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.wsAj_imgSr02{
  background: url(../image/04-1sr_04.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.wsAj_imgSr03{
  background: url(../image/04-1sr_05.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.wsAj_imgAs01{
  background: url(../image/04-2assistant_03.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.wsAj_imgAs02{
  background: url(../image/04-2assistant_04.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.wsAj_imgAs03{
  background: url(../image/04-2assistant_05.jpg) no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}

.wsAj_text_title,
.wsAj_text_inner h5{
  letter-spacing: 4px;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.wsAj_text_title{
  font-size: inherit;
  margin: 0 auto 16px;
  font-weight: bold;
  border-bottom: solid 1px #667EEA;
  display: inline-block;
}


.wsAj_text_inner h5{
  font-size: 18px;
  margin: 0 auto 16px;
}

/* sub recruit */

.rec_detail{
  width: 100%;
  margin: 0 0 8px 0;
  border: none;
  border-collapse: collapse;
  display: table;
}

.recDetail_list{
  width: 100%;
  margin: 0 auto 0;
}

.recDetail_list th,
.recDetail_list td{
  padding: 4px 0;
  float: left;
  display: table-cell;
  font-weight: normal;
  vertical-align: middle;
}
.recDetail_list th,
.recDetail_list td{
  width: 100%;
}

.recDetail_list th{
  border-bottom: solid 1px #D8D8D8;
}

.recDetail_list td{
  border-bottom: none;
  margin: 0 auto 24px;
}

.recDetail_list td.recDetail_list_nb{
  padding-bottom: 0;
  margin-bottom: 16px;
  border-bottom: none;
}

.recDetail_list td ul{
  width: 100%;
  margin: 0 auto;
}

.recDetail_list td ul li{
  font-size: inherit;
  margin: 0 auto;
  background: url(../image/icon_oval.png) no-repeat 0 9px; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/icon_oval.svg) no-repeat 0 9px; /* modern browser */
  background-size: 4px;
  padding: 0 0 0 12px;
}













.rec_process{

}

.recPro_inner01,
.recPro_inner02,
.recPro_inner03,
.recPro_inner04,
.recPro_inner04-02,
.recPro_inner05{
  position: relative;
  overflow: hidden;
}
.recPro_inner01,
.recPro_inner02,
.recPro_inner03,
.recPro_inner04{
  padding: 6px 0 32px 60px;
}
.recPro_inner04-02,
.recPro_inner05{
  padding: 6px 0 0 60px;
}

.recPro_inner01::before,
.recPro_inner02::before,
.recPro_inner03::before,
.recPro_inner04::before{
  border-left: solid 1px #667EEA;
  content: '';
  display: inline-block;
  position: absolute;
  left: 21px;
  top: 42px;
  height: 320px;
}

.rec_process h3,
.rec_process p{
  float: none;
}

.rec_process h3{
  width: 100%;
  font-size: 18px;
  margin: 0 auto 8px;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.rec_process p{
  width: 100%;
  line-height: 1.5;
  padding-top: 4px;
}

.recPro_inner01 h3::before,
.recPro_inner02 h3::before,
.recPro_inner03 h3::before,
.recPro_inner04 h3::before,
.recPro_inner04-02 h3::before,
.recPro_inner05 h3::before{
  content: '';
  display: inline-block;
  position: absolute;
  width: 42px;
  height: 42px;
  left: 0;
  top: 0;
}

.recPro_inner01 h3::before{
  background: url(../image/icon_no01.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/icon_no01.svg) no-repeat 0 0; /* modern browser */
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.recPro_inner02 h3::before{
  background: url(../image/icon_no02.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/icon_no02.svg) no-repeat 0 0; /* modern browser */
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.recPro_inner03 h3::before{
  background: url(../image/icon_no03.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/icon_no03.svg) no-repeat 0 0; /* modern browser */
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.recPro_inner04 h3::before,
.recPro_inner04-02 h3::before{
  background: url(../image/icon_no04.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/icon_no04.svg) no-repeat 0 0; /* modern browser */
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}
.recPro_inner05 h3::before{
  background: url(../image/icon_no05.png) no-repeat 0 0; /* for IE7 IE8 */
  background: rgba(0,0,0,0) url(../image/icon_no05.svg) no-repeat 0 0; /* modern browser */
  background-position: center center;
  background-size: cover;
  -webkit-background-size: cover;
}

.rec_entry{
  display: block;
}

.recEnt_inner{
  width: 100%;
  margin: 0 0 10px 0;
  padding: 32px 24px 32px;
  border: solid 1px #667EEA;
}

.recEnt_inner:last-child{
  margin: 0 0 0 0;
}

.recEnt_inner h4{
  font-size: 18px;
  margin: 0 auto 16px;
    letter-spacing: 4px;
  letter-spacing: 2px;
  line-height: 1.5;
  color: #667EEA;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}

.recEnt_inner p{
  margin: 0 auto 16px;
}

.recEnt_inner:first-child p{
  margin: 0 auto 0;
}

















































































/********** for tablet **********/
@media (min-width: 768px) {

  /* loading */

  .loading_logo{
    width: 280px;
    height: 68px;
  }

  #loading span {
    font-size: 16px;
    letter-spacing: 30px;
  }


  /* contents */

  .width72_sp90,
  .width90_sp100{
    width: 88.8888%;
  }


  /* cancel br */

  .cancel{
    display: none;
  }


  /* btn */

  .btn_box,
  .btn_box2{
    width: 100%;
  }
  .btn_box{
    text-align: left;
  }
  .btn_box2{
    text-align: right;
  }

  .btn_box3{
    width: 100%;
    margin: 0 auto;
  }


  .btn_vm{
    text-align: left;
  }

  .txt_vm{
    float: left;
    text-align: left;
  }

  .txt_vm2{
    float: right;
    text-align: right;
  }

  .btn_gra{
    width: 100%;
  }

  .txt_vm--bg{
    width: auto!important;
    position: absolute;
    background-color: #fff;
    padding: 6px 6px 0 0;
  }

  /* footer banner */

  .footerBnr{
    padding: 48px 40px;
    margin: 0 auto 0;
  }

  .footerBnr_contents{
    width: 31.25%;
    margin: 0 3.125% 0 0;
  }

  .footerBnr_con_box{
    padding: 36px 0 48px;
  }

  .footerBnr_contents img,
  .footerBnr_con_inner{
    float: none;
  }

  .footerBnr_contents img{
    width: 48px;
    margin: 0 auto 16px;
  }

  .footerBnr_contents h3,
  .footerBnr_contents p{
    text-align: center;
    width: auto;
  }

  .footerBnr_contents h3{
    font-size: 14px;
    margin-bottom: 10px;
  }
  .footerBnr_contents p{
    font-size: 10px;
  }

  /* mainvisual */

  .mainvisual{
    padding-top: 75%;
    background: url(../image/01top_main.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
  }

  .mainvisual h1{
    top: -16px;
    right: -32px;
    width: 64%;
  }

  .mainvisual h2 span{
    padding: 8px 0 8px 12px;
  }

  .mainvisual h2 span.mainvisual_cancel{
    padding: 8px 12px 8px 0;
  }

  /* news */

  .news{
    max-height: 112px;
  }

  .newsContents{
    max-height: 64px;
  }

  /* top banner */

  .topBnr_contents{
    width: 22.9167%;
    margin: 0 2.7778% 0 0;
  }

  .topBnr_contents:nth-child(2),
    .topBnr_contents:nth-child(3){
    margin: 0 2.7778% 0 0;
  }

  .topBnr_contents:last-child{
    margin: 0 0 0 0;
  }

  /* top contents */

  .topCon_l,
  .topCon_r,
  .topCon_2{
    overflow: hidden;
    margin: 0 auto 80px;
  }
  .topCon_l:before,
  .topCon_r:before{
    padding-top: 41.625%;
  }
  .topCon_2:before{
    padding-top: 75%;
  }
  .topCon_2{
    float: left;
    width: 47.2222%;
    margin: 0 5.5556% 80px 0;
  }

  .topCon_2:last-child{
    margin: 0 0 80px 0;
  }

  .topCon_l_img,
  .topCon_r_img,
  .topCon_2_img{
    background-image: linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);
    background: -moz-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
    background: -webkit-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  }

  .topCon_l_img,
  .topCon_r_img{
    width: 75%;
  }
  .topCon_2_img{
    float: left;
    width: 75%;
  }

  .topCon_l_imgBg_ws{
    background: url(../image/01top_workstyle.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
  .topCon_r_imgBg_ms{
    background: url(../image/01top_message.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
  .topCon_2_imgBg_gl{
    background: url(../image/01top_gallery.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
  .topCon_2_imgBg_rec{
    background: url(../image/01top_recruit.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
  .topCon_2_imgBg_sr{
    background: url(../image/04workstyke_sr.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
  .topCon_2_imgBg_as{
    background: url(../image/04workstyke_assitant.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  .topCon_l_contents,
  .topCon_r_contents,
  .topCon_2_contents{
    position: absolute;
  }

  .topCon_l_contents,
  .topCon_r_contents{
    transform: translateY(-50%) translateX(0%);
    -webkit-transform: translateY(-50%) translateX(0%);
  }

  .topCon_2_contents{
    transform: translateY(-62%) translateX(0%);
    -webkit-transform: translateY(-62%) translateX(0%);
  }

  .topCon_l_contents,
  .topCon_2_contents{
    top: 50%;
    left: 0;
  }

  .topCon_r_contents{
    top: 50%;
    right: 0;
  }

  .topCon_l>a,
  .topCon_r>a,
  .topCon_2>a{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
  }

  .topCon_l_contents h1,
  .topCon_r_contents h1,
  .topCon_2_contents h1{
    position: static;
    height: 42px;
    margin: 0 0 16px;
  }

  .topCon_l_contents h1 img,
  .topCon_r_contents h1 img,
  .topCon_2_contents h1 img{
    height: 42px;
  }

  .topCon_l_contents h2,
  .topCon_r_contents h2,
  .topCon_2_contents h2{
    position: static;
    margin: 0 auto 16px;
  }

  .topCon_l_contents h2 span,
  .topCon_r_contents h2 span,
  .topCon_2_contents h2 span{
    font-size: 14px;
    letter-spacing: inherit;
    margin: 0 0 4px 0;
  }
  .topCon_l_contents h2 span,
  .topCon_2_contents h2 span{
    padding: 10px 16px 10px 0;
  }

  .topCon_r_contents h2 span{
    padding: 10px 16px 10px 16px;
  }

/******************** sub page ********************/
  /* sub pagetitle */

  .pagetitle>h1,
  .pagetitle_inner>h1{
    font-size: 32px;
    letter-spacing: 10px;
  }

  .pagetitle_inner>p.pagetitle_jp{
    font-size: 14px;
    letter-spacing: 6px;
  }


  .pagetitle_inner>p{
    font-size: 12px;
    letter-spacing: 4px;
    margin: 0 auto 4px;
  }

  .pagetitle_inner>p span{
    font-size: 8px;
  }


  /* sub contents title */
  .contentstitle h2,
  .contentstitle2 h2{
    font-size: 32px;
    margin: 0 auto 8px;
  }

  .contentstitle p,
  .contentstitle2 p{
    font-size: 14px;
  }


  /* sub layout01 */

  .sub_layout01_order{
    display: block;
  }

  .sub_layout01_o01{
    display: block;
  }
  .sub_layout01_o02{
    display: block;
  }

  .sub_layout01_img,
  .sub_layout01_con{
    width: 50%;
    min-height: 380px;
    overflow: hidden;
  }

  .sub_layout01_img:before,
  .sub_layout01_con:before{
    content:'';
    display:block;
    width:100%;
    height:0;
    padding-top: 61.75%;
  }

  .sub_layout01_inner{
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
  }
  .sub_layout01_inner{
    padding: 32px 10% 32px;
  }

  .sub_layout01_order .sub_layout01_inner{
    padding: 32px 10% 32px;
  }

  .sub_layout01_listTitle p{
    font-size: 16px;
    margin: 0 auto 32px;
  }

  .sub_layout01_w01{
    width: 56.25%;
    min-width: 360px;
  }
  .sub_layout01_w02{
    width: 56.25%;
    min-width: 300px;
  }


  /* sub message */

  .msValue{
    display: flex;
  }

  .msValue_contents{
    float: left;
    width: 30.5556%;
    margin: 0 4.1667% 0 0;
  }

  .msValue_contents:last-child{
    margin: 0 0 0 0;
  }

  .msCul_con_l{
    float: left;
    padding: 32px 0 0;
  }
  .msCul_con_r{
    float: right;
    padding: 32px 0 0;
  }

  .msCul_con_link{
    margin: 0 auto 24px;
  }

  /* sub about us */

  .asDetail_list{
    width: 100%;
    margin: 0 0 32px 0;
  }

  .asDetail_map{
    width: 100%;
  }

  .asDetail_mapCon{
    margin: 0 auto 48px;
  }

  .asDetail_map iframe{
    width: 100%;
    height: 426px;
  }

  .asDetail_map ul li{
    float: left;
  }

  .asDetail_map ul li:first-child{
    width: 104px;
    border-bottom: none;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
  }

  .asDetail_map ul li:last-child{
    width: calc(100% - 104px);
  }

  .asGallery{
    margin: 0 -1.0204% 0;
  }

  .asGallery_img,
  .asGallery_img2,
  .asGallery_imgB,
  .asGallery_imgB2{
    float: left;
    display: inline-block;
    padding: 1.0204% 1.0204% 1.0204%;
    margin: 0 0 0;
  }

  .asGallery_img,
  .asGallery_img2{
    width: 33.3333%;
  }

  .asGallery_imgB,
  .asGallery_imgB2{
    width: 66.6666%;
  }
  .asGallery_img2{
    margin-top: -24.2%;
  }
  .asGallery_imgB{
    margin-top: -22.15%;
  }

  /* sub recruit */

  .rec_detail{
    margin: 0 0 64px 0;
  }

  .recruit_con{
    float: left;
    width: 48.6111%;
    margin: 0 2.7778% 2.7778% 0;
  }
  .recruit_con:nth-child(2){
    margin: 0 0 2.7778% 0;
  }


  /* sub workstyle detail */

  .wsAj_text_inner{
    width: 100%;
    margin: 0 auto;
  }

  /* sub recruit */

  .recDetail_list th,
  .recDetail_list td{
    padding: 14px 0;
    float: none;
    border-bottom: solid 1px #D8D8D8;
  }

  .recDetail_list th{
    width: 124px;
  }

  .recDetail_list td{
    width: calc(100% - 124px);
    margin: 0 auto 0;
  }
  .recDetail_list td.recDetail_list_nb{
    margin-bottom: 0;
  }

  .recDetail_list td ul li{
    background: url(../image/icon_oval.png) no-repeat 0 12px; /* for IE7 IE8 */
    background: rgba(0,0,0,0) url(../image/icon_oval.svg) no-repeat 0 12px; /* modern browser */
    background-size: 4px;
    padding: 0 0 0 12px;
  }

  .rec_process h3,
  .rec_process p{
    float: left;
  }

  .rec_process h3{
    width: 120px;
  }

  .rec_process p{
    width: calc(100% - 120px);
  }

  .rec_entry{
    display: flex;
  }

  .recEnt_inner{
    width: 48.6111%;
    margin: 0 2.7778% 0 0;
  }




























































}
/********** for pc **********/
@media (min-width: 992px) {

  html{
    font-size: 16px;
  }

  /* contents */

  .contents{
    margin: 112px auto 80px;
  }
  .width90,
  .width90_sp100{
    width: 90%;
  }
  .width45{
    width: 90%;
  }

  .width72_sp90{
    width: 90%;
  }

  .width86_sp90{
    width: 86%;
  }

  /* contents margin */
  .mb80{
    margin: 0 auto 80px!important;
  }
  .mb112{
    margin: 0 auto 112px!important;
  }

  /* cancel br */

  .cancel_sp{
    display: block;
  }

  .cancel_sp2{
    display: none;
  }

  /* background color */

  .bgcolor{
    padding: 112px 0;
  }


  /* hover animation */

  .btn_vm,
  .btn_vm2,
  .btn_gra p,
  a.btn_gra .btn_graBg,
  .headLogo>a>.headLogo_img,
  .headNav>ul>li>a,
  .headNav_contact,
  .footerLogo>a .footerLogo_img,
  .gotop a img,
  .facebook a img,
  .insta a img,
  .newsText>p>a,
  .topBnr_contents>a,
  .footerBnr_contents>a,
  .topCon_l a .topCon_l_contents p.txt_vm,
  .topCon_r a .topCon_r_contents p.txt_vm2,
  .topCon_2 a .topCon_2_contents p.txt_vm,
  .topCon_l a .topCon_l_imgBg,
  .topCon_r a .topCon_r_imgBg,
  .topCon_2 a .topCon_2_imgBg,
  .btn_scrl_con2 .btn_scrl_conBg a,
  .btn_scrl_con3 .btn_scrl_conBg a,
  a.btn_scrl_con2 .btn_scrl_conBg,
  a.btn_scrl_con2 .btn_scrl_conBg p,
  a.btn_scrl_con3 .btn_scrl_conBg,
  a.btn_scrl_con3 .btn_scrl_conBg p,
  .recruit_con a{
    -webkit-transition: 0.5s ease-in-out;
       -moz-transition: 0.5s ease-in-out;
         -o-transition: 0.5s ease-in-out;
            transition: 0.5s ease-in-out;
  }

  /* btn */

  a:hover.btn_vm,
  a:hover.btn_vm2{
    letter-spacing: 12px;
    opacity: .6;
  }

  .topCon_l a:hover .topCon_l_contents .btn_box p.txt_vm,
  .topCon_r a:hover .topCon_r_contents .btn_box p.txt_vm2,
  .topCon_2 a:hover .topCon_2_contents .btn_box p.txt_vm{
    letter-spacing: 12px;
  }

  .btn_vm2{
    float: right;
    text-align: right;
  }

  .btn_gra,
  .btn_graBg{
    border-radius: 41px;
  }

  .btn_gra p{
    letter-spacing: 6px;
    font-size: 24px;
    padding: 28px 0 28px;
  }

  a:hover.btn_gra .btn_graBg{
    background-color: transparent;
  }

  a:hover.btn_gra p{
    color: #fff;//非対応のブラウザでの文字色を設定
    background: -webkit-linear-gradient(-45deg, #fff 0%, #fff 100%);//背景色にグラデーションを指定
    -webkit-background-clip: text;//テキストでくり抜く
    -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
  }

  .btn_scrl_box2,
  .btn_scrl_box3{
    margin: -48px auto 112px;
  }

  .btn_scrl_con2,
  .btn_scrl_con3,
  .btn_scrl_conBg{
    border-radius: 24px;
  }

  .btn_scrl_con2{
    width: 48.6111%;
    margin: 0 2.7778% 0 0;
  }
  .btn_scrl_con3{
    width: 31.4583%;
    margin: 0 2.81255% 0 0;
  }

  .btn_scrl_con2 .btn_scrl_conBg p,
  .btn_scrl_con3 .btn_scrl_conBg p{
    padding: 16px 0;
  }

  a:hover.btn_scrl_con2 .btn_scrl_conBg,
  a:hover.btn_scrl_con3 .btn_scrl_conBg{
    background-color: transparent;
  }

  a:hover.btn_scrl_con2 .btn_scrl_conBg p,
  a:hover.btn_scrl_con3 .btn_scrl_conBg p{
    color: #fff;//非対応のブラウザでの文字色を設定
    background: -webkit-linear-gradient(-45deg, #fff 0%, #fff 100%);//背景色にグラデーションを指定
    -webkit-background-clip: text;//テキストでくり抜く
    -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
  }

  a:hover.btn_scrl_con2 .btn_scrl_conBg p::after,
  a:hover.btn_scrl_con3 .btn_scrl_conBg p::after{
    content: url(../image/icon_w_arrow_down.svg);
    top: -2px;
  }
























  /* header */

  .head{
    width: 100%;
    height: 80px;
    margin: 0 auto 0;
    background-color: #fff;
    position: fixed;
    top: 0;
    z-index: 10;
  }

  .headLogo{
    position: absolute;
    top: 0;
    left: 32px;
    margin: 0;
    padding: 0;
    background-color: #fff;
  }

  .headLogo>a:hover>.headLogo_img{
    opacity: .6;
  }

  .headLogo_img{
    width: 334px;
    height: 80px;
    margin: 0;
    background: url(../image/logo.png) no-repeat 0 0; /* for IE7 IE8 */
    background: rgba(0,0,0,0) url(../image/logo.svg) no-repeat 0 0; /* modern browser */
    -webkit-background-size: contain;
    background-size: contain;
  }

  .headNav{
    position: absolute;
    right: 0;
  }

  .headNav>ul,
  .headNav>ul>li,
  .headNav_contact{
    float: left;
  }

  .headNav>ul>li{
    font-size: inherit;
    margin: 24px 32px 24px 0;
    line-height: 1;
    position: relative;
    white-space: nowrap;
  }
  .headNav>ul>li>a span{
    font-size: 11px;
  }

  .headNav>ul>li>a:hover{
    color: #667EEA;
  }

  .headNav_contact{
    width: 80px;
    height: 80px;
    background-image: linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);
    background: -moz-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
    background: -webkit-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  }

  .headNav_contact img{
    width: 36px;
    margin: 22px auto;
    vertical-align: middle;
  }

  .headNav_contact:hover{
    opacity: .8;
  }

  /* footer banner */

  .footerBnr{
    padding: 112px 80px;
  }

  .footerBnr_con_box{
    padding: 52px 0 62px;
  }

  .footerBnr_contents>a:hover{
    opacity: .7;
  }

  .footerBnr_contents img{
    width: 64px;
    margin: 0 auto 32px;
  }

  .footerBnr_contents h3{
    font-size: 20px;
  }
  .footerBnr_contents p{
    font-size: 14px;
  }

  /* breadcrumb */

  .breadcrumb{
    margin: 0 auto 16px;
  }

  .breadcrumb li{
    font-size: 14px;
    margin: 0 8px 0 0;
  }

  .breadcrumb li a{
    opacity: 1;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
  }

  .breadcrumb li a:hover{
    color: #667EEA;
  }

  /* footer */

  #footer{
    padding: 80px 0 112px;
  }

  .footerLogo{
    position: absolute;
    top: 36px;
    left: 0;
    margin: 0;
    padding: 0;
    background-color: #fff;
  }

  .footerLogo>a:hover>.footerLogo_img{
    opacity: .6;
  }

  .footerLogo_img{
    width: 409px;
    height: 98px;
    margin: 0 0;
  }

  #footer>p{
    position: absolute;
    top: 32px;
    right: 0;
    text-align: right;
    display: inline-block;
    white-space: nowrap;
  }

  /*go top & facebook icon */

  .facebook a,
  .insta a{
    position: fixed;
    z-index: 10;
    width: 32px;
    height: 32px;
    display: block;
  }

  .facebook a{
    bottom: 156px;
    right: 8px;
    background: url(../image/icon_fb_h.png) no-repeat  center center; /* for IE7 IE8 */
    background: rgba(0,0,0,0) url(../image/icon_fb_h.svg) no-repeat center center; /* modern browser */
  }
  .insta a{
    bottom: 94px;
    right: 8px;
    background: url(../image/icon_insta_h.png) no-repeat  center center; /* for IE7 IE8 */
    background: rgba(0,0,0,0) url(../image/icon_insta_h.svg) no-repeat center center; /* modern browser */
  }

  .gotop a{
    right: 8px;
  }

  .facebook a img,
  .insta a img{
    position: absolute;
    top: 0;
    left: 0;
    width: 32px;
    height: 32px;
    pointer-events: none;
    display: block;
    opacity: 1;
  }

  .gotop a:hover img,
  .facebook a:hover img,
  .insta a:hover img{
    opacity: 0;
  }

  /* copyright */

  .copyright{
    position: fixed;
    top: 50%;
    transform: translateY(-50%)
  }

  .copyright p{
    font-size: 12px;
    line-height: 1;
    letter-spacing: 2px;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    margin: auto 18px;
  }

  /* mainvisual */

  .mainvisual{
    padding-top: 41.625%;
  }

  .mainvisual h1{
    top: -16px;
    right: -48px;
    width: 47.4306%;
  }

  .mainvisual h2{
    bottom: 28px;
    left: 0;
  }

  .mainvisual h2 span{
    font-size: 24px;
    padding: 10px 0 10px 16px;
  }

  .mainvisual h2 span.mainvisual_cancel{
    padding: 10px 16px 10px 0;
  }

  /* close */

  .close_top,
  .close_sub{
    font-size: 20px;
    padding: 16px 24px 16px;
  }

  .close_sub{
    margin: -64px auto 32px;
  }

  /* news */

  .news{
    height: 80px;
    border-left:1px solid #667EEA;
    border-right:1px solid #764BA2;
  }

  .news:before,
  .news:after {
    content:"";
    display:block;
    height:1px;
    width:100%;
    background-image: linear-gradient(-45deg, #667EEA 0%, #764BA2 100%);
    background: -moz-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
    background: -webkit-linear-gradient(top left, #667EEA 0%, #764BA2 100%);
  }

  .newsTitle,
  .newsContents,
  .newsText>time,
  .newsText>p{
    float: left;
  }

  .newsTitle{
    width: 13.8889%;
  }

  .newsTitle h3{
    text-align: center;
    margin: 16px auto 0;
    padding: 8px 0px;
    letter-spacing: 0;
    border-right: solid 1px #667EEA;
  }

  .newsContents{
    width: 86.1111%;
    height: 48px;
    padding: 0 48px;
    margin: 16px 0;
  }

  .newsText{
    line-height: 1.25;
    margin: 0 10px 6px 0;
  }

  .newsText>time{
    margin: 0 16px 0 0;
  }

  .newsText>p>a:hover{
    color: #667EEA;
  }

  /* top message */

  .topMessage>h3{
    font-size: 48px;
    letter-spacing: 10px;
    margin: 0 auto 48px;
  }

  .topMessage>h4{
    font-size: 24px;
    letter-spacing: 6px;
    margin: 0 auto 40px;
  }

  .topMessage>p{
    letter-spacing: 2px;
    margin: 0 auto 48px;
  }

  /* top banner */

  .topBnr_contents>a:hover{
    opacity: .8;
  }

  .topBnr_contents img{
    width: 64px;
    padding: 88px 0 0;
    margin: 0 auto 32px;
  }

  .topBnr_contents h3{
    font-size: 20px;
    margin-bottom: 10px;
  }
  .topBnr_contents p{
    font-size: 14px;
    padding-bottom: 88px;
  }

  /* top contents */

  .topCon_l,
  .topCon_r,
  .topCon_2{
    margin: 0 auto 112px;
  }
  .topCon_2{
    margin: 0 5.5556% 112px 0;
  }
  .topCon_2:last-child{
    margin: 0 0 112px 0;
  }


  .topCon_l a:hover .topCon_l_imgBg,
  .topCon_r a:hover .topCon_r_imgBg,
  .topCon_2 a:hover .topCon_2_imgBg{
    opacity: .4;
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }




  .topCon_l_contents h1,
  .topCon_r_contents h1,
  .topCon_2_contents h1{
    height: 48px;
    margin: 0 0 36px;
  }

  .topCon_l_contents h1 img,
  .topCon_r_contents h1 img,
  .topCon_2_contents h1 img{
    height: 48px;
  }

  .topCon_l_contents h2,
  .topCon_r_contents h2,
  .topCon_2_contents h2{
    margin: 0 auto 42px;
  }

  .topCon_l_contents h2 span,
  .topCon_r_contents h2 span,
  .topCon_2_contents h2 span{
    font-size: 24px;
    margin: 0 0 4px 0;
  }

/******************** sub page ********************/

  /* sub pagetitle */

  .pagetitle{
    margin: 0 auto 80px;
  }

  .pagetitle>h1,
  .pagetitle_inner>h1{
    font-size: 48px;
  }

  .pagetitle_inner>p.pagetitle_jp{
    font-size: 20px;
  }

  .pagetitle_inner>p{
    font-size: 16px;
    margin: 0 auto 6px;
  }

  .pagetitle_inner>p span{
    font-size: 11px;
  }


  /* sub contents title */

  .contentstitle{
    margin: 0 auto 80px;
  }
  .contentstitle2{
    margin: 32px auto 80px;
  }

  .contentstitle h2,
  .contentstitle2 h2{
    font-size: 48px;
    margin: 0 auto 12px;
  }

  .contentstitle p,
  .contentstitle2 p{
    font-size: 18px;
  }

  /* sub common catch */
  .sub_catch{
    font-size: 24px;
    margin: 0 auto 32px;
  }

  /* sub layout01 */

  .sub_layout01_listCon li{
    background: url(../image/icon_oval.png) no-repeat 0 10px; /* for IE7 IE8 */
    background: rgba(0,0,0,0) url(../image/icon_oval.svg) no-repeat 0 10px; /* modern browser */
    background-size: 4px;
    padding: 0 0 0 14px;
  }

  .sub_layout01_img,
  .sub_layout01_con{
    min-height: 460px;
  }

  .sub_layout01_w02{
    width: 70.3125%;
    min-width: 360px;
  }


  /* sub message */

  .msValue_con_box{
    margin: 80px 10% 64px;
  }

  .msValue_contents img{
    width: 80px;
  }

  .msValue_contents h5{
    font-size: 20px;
    margin-bottom: 32px;
  }

  .msCulture01{
    margin: 0 auto 17.7778%;
  }
  .msCulture02{
    position: relative;
    margin: 0 auto 7.7778%;
  }
  .msCulture01:last-child{
    margin: 0 auto 5%;
  }

  .msCul_img_l,
  .msCul_img_r{
    width: 60%;
    min-height: 500px;
  }
  .msCul_img_l{
    float: left;
  }

  .msCul_img_r{
    float: right;
  }

  .msCul_img_l::after,
  .msCul_img_r::after{
    content:'';
    position: absolute;
    display:block;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(-45deg, #EAEDFC 0%, #ECE6F2 100%);
    background: -moz-linear-gradient(top left, #EAEDFC 0%, #ECE6F2 100%);
    background: -webkit-linear-gradient(top left, #EAEDFC 0%, #ECE6F2 100%);
  }
  .msCul_img_l::after{
    top: 13.4831%;
    left: 66.6667%;
  }

  .msCul_img_r::after{
    top: -13.4831%;
    left: -66.6667%;
  }

  .msCul_con_l,
  .msCul_con_r{
    float: left;
    width: 40%;
  }
  .msCul_con_l{
    padding: 12% 4.4444% 32px;
  }
  .msCul_con_r{
    padding: 0 4.4444% 32px;
  }

  .msCul_con_link{
    margin: 0 auto 24px;
  }

  /* sub about us */

  .as_detail{

  }

  .asDetail_list,
  .asDetail_map{
    float: left;
  }

  .asDetail_list{
    width: 47.9167%;
    margin: 0 4.1667% 0 0;
  }

  .asDetail_list th,
  .asDetail_list td{
    padding: 14px 0;
    float: none;
  }
  .asDetail_list th,
  .asDetail_list td{
  border-bottom: solid 1px #D8D8D8;
  }

  .asDetail_list th{
    width: 124px;
  }

  .asDetail_list td{
    width: calc(100% - 124px);
    margin: 0 auto 0;
  }

  .asDetail_history th,
  .asDetail_history td{
    padding: 0 0;
    border-bottom: none;
  }

  .asDetail_history th{
    width: 110px;
  }

  .asDetail_history td{
    width: calc(100% - 110px);
  }

  .asDetail_map{
    width: 47.9167%;
  }

  /* sub recruit */

  .recruit_con a:hover{
    opacity: .6;
  }

  .recruit_con h3{
    font-size: 48px;
    letter-spacing: 8px;
  }

  .recruit_con p{
    font-size: 18px;
    letter-spacing: 3px;
  }

  /* sub workstyle detail */

  .wsDs_slideBox{
    padding: 0 20px 80px 0;
  }

  .wsDs_timeBox time{
    font-size: 20px;
    margin: 0 auto 20px;
    padding-right: 10px;
  }

  .wsDs_timeLine{
    margin-top: 8px;
  }

  .wsDs_contents h4{
    font-size: 18px;
    margin: 0 auto 12px;
  }

  .wsDs_contents h4.wsDs_contents_l1{
    padding: 11px 0 11px;
  }

  .wsDs_contents p{
  padding: 0 30px 0 0;
  }












  .wsAj_contents{
    margin: 0 auto 32px;
  }

  .wsAj_contents:last-child{
    margin: 0 auto 64px;
  }

  .wsAj_img,
  .wsAj_inner{
    min-height: 400px;
    position: relative;
    float: left;
  }
  .wsAj_img{
    width: 40%;
    margin: 0 2.8% 0 0;
  }
  .wsAj_inner{
    width: 57.2%;
  }

  .wsAj_img:before,
  .wsAj_inner:before{
    content:'';
    display:block;
    width:100%;
    height:0;
    padding-top: 61.8056%;
  }
  .wsAj_img:before{
    padding-top: 61.8056%;
  }
  .wsAj_inner:before{
    padding-top: 43.2039%;
  }

  .wsAj_text_inner{
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
  }

  .wsAj_text_title{
    margin: 0 auto 32px;
  }


  .wsAj_text_inner h5{
    font-size: 24px;
    margin: 0 auto 32px;
  }

  /* sub recruit */

  .recDetail_list th,
  .recDetail_list td{
    padding: 14px 0;
    float: none;
    border-bottom: solid 1px #D8D8D8;
  }

  .recDetail_list th{
    width: 136px;
  }

  .recDetail_list td{
    width: calc(100% - 136px);
    margin: 0 auto 0;
  }

  .recDetail_list td ul li{
    background: url(../image/icon_oval.png) no-repeat 0 12px; /* for IE7 IE8 */
    background: rgba(0,0,0,0) url(../image/icon_oval.svg) no-repeat 0 12px; /* modern browser */
    background-size: 4px;
    padding: 0 0 0 12px;
  }

  .rec_process{

  }

  .recPro_inner01,
  .recPro_inner02,
  .recPro_inner03,
  .recPro_inner04{
    padding: 18px 0 32px 88px;
  }
  .recPro_inner04-02,
  .recPro_inner05{
    padding: 18px 0 0 88px;
  }

  .recPro_inner01::before,
  .recPro_inner02::before,
  .recPro_inner03::before,
  .recPro_inner04::before{
    border-left: solid 1px #667EEA;
    content: '';
    display: inline-block;
    position: absolute;
    left: 32px;
    top: 64px;
    height: 200px;
  }

  .rec_process h3,
  .rec_process p{
    float: left;
  }

  .rec_process h3{
    width: 132px;
    font-size: 20px;
    margin: 0 auto 24px;
  }

  .rec_process p{
    width: calc(100% - 132px);
    padding-top: 4px;
  }

  .recPro_inner01 h3::before,
  .recPro_inner02 h3::before,
  .recPro_inner03 h3::before,
  .recPro_inner04 h3::before,
  .recPro_inner04-02 h3::before,
  .recPro_inner05 h3::before{
    width: 64px;
    height: 64px;
  }

  .recEnt_inner{
    width: 48.6111%;
    margin: 0 2.7778% 0 0;
    padding: 48px 48px 48px;
  }

  .recEnt_inner:last-child{
    margin: 0 0 0 0;
  }

  .recEnt_inner h4{
    font-size: 24px;
    margin: 0 auto 32px;
    letter-spacing: 4px;
  }

  .recEnt_inner p,
  .recEnt_inner:first-child p{
    margin: 0 auto 24px;
  }




























}
/********** for reguler pc **********/

@media (min-width: 1080px) {


  .width45{
    width: 45%;
  }

  .width72_sp90{
    width: 72%;
  }

  /* cancel br */

  .cancel_sp2{
    display: block;
  }


  /* header */

  .headNav>ul>li{
    margin: 24px 48px 24px 0;
  }

  /*go top & facebook icon */

  .facebook a{
    right: 24px;
  }
  .insta a{
    right: 24px;
  }

  .gotop a{
    right: 24px;
  }

  /* copyright */

  .copyright p{
    margin: auto 32px;
  }

  /* sub message */

  .msCul_con_l{
    float: left;
    padding: 10% 4.4444% 32px;
  }

  /* sub workstyle detail */

  .swiper-slide:first-child{
    margin-left: 10%;
  }




}

/********** for leage pc **********/
@media (min-width: 1260px) {

  /* top contents */
  .topCon_l_contents h1,
  .topCon_r_contents h1,
  .topCon_2_contents h1{
    height: 72px;
  }
  .topCon_l_contents h1 img,
  .topCon_r_contents h1 img,
  .topCon_2_contents h1 img{
    height: 72px;
  }


}