@import"https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;500;600&display=swap";

.pvisual .image.white .blk{
	color:#fff!important;
}
@media only screen and (max-width: 768px) {
.pvisual .image.white .sp{
	display: block!important;
}	
}

.att {
  padding-left:1em;
  text-indent:-1em
}
.att02 {
  padding-left:1.3em;
  text-indent:-1.3em
}
.ps {
  overflow:hidden !important;
  overflow-anchor:none;
  -ms-overflow-style:none;
  touch-action:auto;
  -ms-touch-action:auto
}
.ps__rail-x {
  display:none;
  opacity:0;
  transition:background-color .2s linear,opacity .2s linear;
  -webkit-transition:background-color .2s linear,opacity .2s linear;
  height:15px;
  bottom:0px;
  position:absolute
}
.ps__rail-y {
  display:none;
  opacity:0;
  transition:background-color .2s linear,opacity .2s linear;
  -webkit-transition:background-color .2s linear,opacity .2s linear;
  width:15px;
  right:0;
  position:absolute
}
.ps--active-x>.ps__rail-x,
.ps--active-y>.ps__rail-y {
  display:block;
  background-color:rgba(0,0,0,0)
}
.ps:hover>.ps__rail-x,
.ps:hover>.ps__rail-y,
.ps--focus>.ps__rail-x,
.ps--focus>.ps__rail-y,
.ps--scrolling-x>.ps__rail-x,
.ps--scrolling-y>.ps__rail-y {
  opacity:.6
}
.ps .ps__rail-x:hover,
.ps .ps__rail-y:hover,
.ps .ps__rail-x:focus,
.ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking,
.ps .ps__rail-y.ps--clicking {
  background-color:#eee;
  opacity:.9
}
.ps__thumb-x {
  background-color:#aaa;
  border-radius:6px;
  transition:background-color .2s linear,height .2s ease-in-out;
  -webkit-transition:background-color .2s linear,height .2s ease-in-out;
  height:6px;
  bottom:2px;
  position:absolute
}
.ps__thumb-y {
  background-color:#aaa;
  border-radius:6px;
  transition:background-color .2s linear,width .2s ease-in-out;
  -webkit-transition:background-color .2s linear,width .2s ease-in-out;
  width:6px;
  right:2px;
  position:absolute
}
.ps__rail-x:hover>.ps__thumb-x,
.ps__rail-x:focus>.ps__thumb-x,
.ps__rail-x.ps--clicking .ps__thumb-x {
  background-color:#999;
  height:11px
}
.ps__rail-y:hover>.ps__thumb-y,
.ps__rail-y:focus>.ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
  background-color:#999;
  width:11px
}
@supports(-ms-overflow-style: none) {
  .ps {
    overflow:auto !important
  }
}
@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none) {
  .ps {
    overflow:auto !important
  }
}
:root {
  --offset: 20vw;
  --move-initial: calc(-25% + var(--offset));
  --move-final: calc(-50% + var(--offset))
}
.bg_image {
  --offset: 20vw;
  --move-initial: calc(-25% + var(--offset));
  --move-final: calc(-50% + var(--offset))
}
*::-ms-backdrop,
:root {
  --move-initial: 50vw;
  --move-final: -150vw
}
.marquee {
  width:100vw;
  overflow:hidden
}
.marquee__inner {
  width:100%;
  width:-moz-fit-content;
  width:fit-content;
  display:flex;
  justify-content:space-between;
  position:relative;
  transform:translate3d(var(--move-initial), 0, 0);
  animation:marquee 20s linear infinite;
  -webkit-animation:marquee 20s linear infinite
}
.marquee__inner span {
  display:block;
  width:100vw;
  margin:0 3rem;
  flex-shrink:0
}
.marquee__inner.life01 span {
  width:80vw
}
@media only screen and (max-width: 768px) {
  .marquee__inner.life01 span {
    width:100vw
  }
}
.marquee__inner.life02 span {
  width:65vw
}
@media only screen and (max-width: 768px) {
  .marquee__inner.life02 span {
    width:100vw
  }
}
.marquee__inner.rezi04 span {
  width:50vw
}
@media only screen and (max-width: 768px) {
  .marquee__inner.rezi04 span {
    width:100vw
  }
}
.marquee__inner.rezi05 span {
  width:40vw
}
@media only screen and (max-width: 768px) {
  .marquee__inner.rezi05 span {
    width:80vw
  }
}
*::-ms-backdrop,
.marquee__inner {
  width:800vw;
  margin:0;
  animation:marquee_ie 20s linear infinite;
  -webkit-animation:marquee_ie 20s linear infinite
}
*::-ms-backdrop span,
.marquee__inner span {
  display:block;
  width:500px;
  margin:0
}
@keyframes marquee_ie {
  0% {
    transform:translate3d(0vw, 0, 0)
  }
  100% {
    transform:translate3d(-150vw, 0, 0)
  }
}
@keyframes marquee {
  0% {
    transform:translate3d(var(--move-initial), 0, 0)
  }
  100% {
    transform:translate3d(var(--move-final), 0, 0)
  }
}
@keyframes loop {
  0% {
    transform:translateX(100%)
  }
  to {
    transform:translateX(-100%)
  }
}
@keyframes loop2 {
  0% {
    transform:translateX(0)
  }
  to {
    transform:translateX(-200%)
  }
}
@keyframes loop3 {
  0% {
    transform:translateX(-100%)
  }
  to {
    transform:translateX(100%)
  }
}
@keyframes loop4 {
  0% {
    transform:translateX(-200%)
  }
  to {
    transform:translateX(0)
  }
}
div.insefa {
  width:100%;
  overflow:hidden;
  display:flex
}
.text {
  margin:0 1rem;
  animation:flowing 40s linear infinite;
  transform:translateX(0%)
}
@keyframes flowing {
  100% {
    transform:translateX(-100%)
  }
}
/*! locomotive-scroll v4.1.1 | MIT License | https://github.com/locomotivemtl/locomotive-scroll */html.has-scroll-smooth {
  overflow:hidden
}
html.has-scroll-dragging {
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none
}
.has-scroll-smooth body {
  overflow:hidden
}
.has-scroll-smooth [data-scroll-container] {
  min-height:100vh
}
[data-scroll-direction=horizontal] [data-scroll-container] {
  height:100vh;
  display:inline-block;
  white-space:nowrap
}
[data-scroll-direction=horizontal] [data-scroll-section] {
  display:inline-block;
  vertical-align:top;
  white-space:nowrap;
  height:100%
}
.c-scrollbar {
  position:absolute;
  right:0;
  top:0;
  width:11px;
  height:100%;
  transform-origin:center right;
  transition:transform .3s,opacity .3s;
  opacity:0
}
.c-scrollbar:hover {
  transform:scaleX(1.45)
}
.c-scrollbar:hover,
.has-scroll-dragging .c-scrollbar,
.has-scroll-scrolling .c-scrollbar {
  opacity:1
}
[data-scroll-direction=horizontal] .c-scrollbar {
  width:100%;
  height:10px;
  top:auto;
  bottom:0;
  transform:scaleY(1)
}
[data-scroll-direction=horizontal] .c-scrollbar:hover {
  transform:scaleY(1.3)
}
.c-scrollbar_thumb {
  position:absolute;
  top:0;
  right:0;
  background-color:#000;
  opacity:.5;
  width:7px;
  border-radius:10px;
  margin:2px;
  cursor:grab
}
.has-scroll-dragging .c-scrollbar_thumb {
  cursor:grabbing
}
[data-scroll-direction=horizontal] .c-scrollbar_thumb {
  right:auto;
  bottom:0
}
html {
  font-size:62.5%
}
body {
  color:#222;
  font-size:1.6rem;
  line-height:1.8;
  letter-spacing:.5px;
  font-family:futura-pt,a-otf-ryumin-pr6n,serif
}
@media only screen and (max-width: 768px) {
  body {
    font-size:1.4rem
  }
}
.eng {
  font-family:sans-serif !important
}
.en {
  font-family:futura-pt,sans-serif
}
.enc {
  font-family:"Libre Baskerville",serif
}
.serif {
  font-family:a-otf-ryumin-pr6n,serif
}
.gothic {
  font-family:a-otf-ud-shin-go-pr6n,sans-serif;
  font-weight:bold;
  letter-spacing:.05em
}
.pc {
  display:block
}
@media only screen and (max-width: 768px) {
  .pc {
    display:none
  }
}
.sp {
  display:none
}
@media only screen and (max-width: 768px) {
  .sp {
    display:block
  }
}
.adelay01 {
  animation-delay:.1s !important
}
@media only screen and (max-width: 768px) {
  .adelay01 {
    animation-delay:0s !important
  }
}
.adelay02 {
  animation-delay:.2s !important
}
@media only screen and (max-width: 768px) {
  .adelay02 {
    animation-delay:0s !important
  }
}
.adelay03 {
  animation-delay:.3s !important
}
@media only screen and (max-width: 768px) {
  .adelay03 {
    animation-delay:0s !important
  }
}
.adelay04 {
  animation-delay:.4s !important
}
@media only screen and (max-width: 768px) {
  .adelay04 {
    animation-delay:0s !important
  }
}
.adelay05 {
  animation-delay:.5s !important
}
@media only screen and (max-width: 768px) {
  .adelay05 {
    animation-delay:0s !important
  }
}
.adelay06 {
  animation-delay:.6s !important
}
@media only screen and (max-width: 768px) {
  .adelay06 {
    animation-delay:0s !important
  }
}
.adelay07 {
  animation-delay:.7s !important
}
@media only screen and (max-width: 768px) {
  .adelay07 {
    animation-delay:0s !important
  }
}
.adelay08 {
  animation-delay:.8s !important
}
@media only screen and (max-width: 768px) {
  .adelay08 {
    animation-delay:0s !important
  }
}
.adelay09 {
  animation-delay:.9s !important
}
@media only screen and (max-width: 768px) {
  .adelay09 {
    animation-delay:0s !important
  }
}
.adelay10 {
  animation-delay:1s !important
}
@media only screen and (max-width: 768px) {
  .adelay10 {
    animation-delay:0s !important
  }
}
.clearfix::after {
  content:"";
  display:block;
  clear:both
}
.inview.fadeInup {
  opacity:0
}
.inview.fadeInup.active {
  animation:fadeInup .5s ease-out;
  animation-fill-mode:forwards
}
.inview.leftright {
  opacity:0
}
@media only screen and (max-width: 768px) {
  .inview.leftright {
    opacity:1
  }
}
.inview.leftright.active {
  animation:leftright_anim .5s ease;
  animation-fill-mode:forwards
}
@media only screen and (max-width: 768px) {
  .inview.leftright.active {
    animation:none
  }
}
.inview.rightleft {
  opacity:0
}
.inview.rightleft.active {
  animation:rightleft_anim .5s ease-out;
  animation-fill-mode:forwards
}
@media only screen and (max-width: 768px) {
  .inview.rightleft.active {
    animation:none
  }
}
.inview.show {
  opacity:0
}
.inview.show.active {
  animation:show 1s ease-out;
  animation-fill-mode:forwards
}
.image-anime-mask {
  overflow:hidden;
  transform:translate3d(-100%, 0, 0);
  transition:all .5s ease;
  transform-origin:left
}
.image-anime-mask.active {
  transform:translate3d(0, 0, 0)
}
.image-anime-main {
  display:block;
  transform:translate3d(100%, 0, 0);
  transition:all .5s ease
}
.image-anime-main.active {
  transform:translate3d(0, 0, 0)
}
.anim_box span {
  position:relative;
  overflow:hidden;
  display:inline-block;
  opacity:0;
  transition:all .5s ease;
  transition-delay:.3s;
  line-height:1.5;
  transform:translateY(12px)
}
.anim_box span.gr:before {
  background:#31955b
}
.anim_box span:before {
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  content:"";
  z-index:9;
  background:#31955b;
  transform:translateX(-101%)
}
.anim_box span.adelay02 {
  transition-delay:.6s
}
.anim_box.is-active span {
  opacity:1;
  transform:translateY(0)
}
.anim_box.is-active span:before {
  animation-name:copyslide;
  animation-duration:.8s;
  animation-timing-function:cubic-bezier(0.86, 0, 0.07, 1);
  animation-delay:.1s
}
.anim_box.is-active span.adelay02:before {
  animation-delay:.3s
}
.anim_box.is-active span.adelay04:before {
  animation-delay:.6s
}
.anim_box.is-active.ren span:nth-of-type(1):before {
  animation-delay:.3s
}
.anim_box.is-active.ren span:nth-of-type(2):before {
  animation-delay:.4s
}
.anim_box.is-active.ren span:nth-of-type(3):before {
  animation-delay:.5s
}
.anim_box.is-active.ren span:nth-of-type(4):before {
  animation-delay:.6s
}
@keyframes fadeInup {
  0% {
    transform:translateY(25px);
    opacity:0
  }
  100% {
    transform:translateY(0px);
    opacity:1
  }
}
@keyframes leftright_anim {
  0% {
    transform:translatex(-30px);
    opacity:0
  }
  100% {
    transform:translateX(0px);
    opacity:1
  }
}
@keyframes rightleft_anim {
  0% {
    transform:translatex(30px);
    opacity:0
  }
  100% {
    transform:translateX(0px);
    opacity:1
  }
}
@keyframes flash {
  0% {
    opacity:.4
  }
  100% {
    opacity:1
  }
}
@keyframes show {
  0% {
    opacity:0
  }
  100% {
    opacity:1
  }
}
@keyframes spin {
  0% {
    transform:rotate(0deg)
  }
  100% {
    transform:rotate(360deg)
  }
}
.mt0 {
  margin-top:0px
}
.mb0 {
  margin-bottom:0px
}
.ml0 {
  margin-left:0px
}
.mr0 {
  margin-right:0px
}
.pt0 {
  padding-top:0px
}
.pb0 {
  padding-bottom:0px
}
.pl0 {
  padding-left:0px
}
.pr0 {
  padding-right:0px
}
.mt5 {
  margin-top:5px
}
.mb5 {
  margin-bottom:5px
}
.ml5 {
  margin-left:5px
}
.mr5 {
  margin-right:5px
}
.pt5 {
  padding-top:5px
}
.pb5 {
  padding-bottom:5px
}
.pl5 {
  padding-left:5px
}
.pr5 {
  padding-right:5px
}
.mt10 {
  margin-top:10px
}
.mb10 {
  margin-bottom:10px
}
.ml10 {
  margin-left:10px
}
.mr10 {
  margin-right:10px
}
.pt10 {
  padding-top:10px
}
.pb10 {
  padding-bottom:10px
}
.pl10 {
  padding-left:10px
}
.pr10 {
  padding-right:10px
}
.mt15 {
  margin-top:15px
}
.mb15 {
  margin-bottom:15px
}
.ml15 {
  margin-left:15px
}
.mr15 {
  margin-right:15px
}
.pt15 {
  padding-top:15px
}
.pb15 {
  padding-bottom:15px
}
.pl15 {
  padding-left:15px
}
.pr15 {
  padding-right:15px
}
.mt20 {
  margin-top:20px
}
.mb20 {
  margin-bottom:20px
}
.ml20 {
  margin-left:20px
}
.mr20 {
  margin-right:20px
}
.pt20 {
  padding-top:20px
}
.pb20 {
  padding-bottom:20px
}
.pl20 {
  padding-left:20px
}
.pr20 {
  padding-right:20px
}
.mt25 {
  margin-top:25px
}
.mb25 {
  margin-bottom:25px
}
.ml25 {
  margin-left:25px
}
.mr25 {
  margin-right:25px
}
.pt25 {
  padding-top:25px
}
.pb25 {
  padding-bottom:25px
}
.pl25 {
  padding-left:25px
}
.pr25 {
  padding-right:25px
}
.mt30 {
  margin-top:30px
}
.mb30 {
  margin-bottom:30px
}
.ml30 {
  margin-left:30px
}
.mr30 {
  margin-right:30px
}
.pt30 {
  padding-top:30px
}
.pb30 {
  padding-bottom:30px
}
.pl30 {
  padding-left:30px
}
.pr30 {
  padding-right:30px
}
.mt35 {
  margin-top:35px
}
.mb35 {
  margin-bottom:35px
}
.ml35 {
  margin-left:35px
}
.mr35 {
  margin-right:35px
}
.pt35 {
  padding-top:35px
}
.pb35 {
  padding-bottom:35px
}
.pl35 {
  padding-left:35px
}
.pr35 {
  padding-right:35px
}
.mt40 {
  margin-top:40px
}
.mb40 {
  margin-bottom:40px
}
.ml40 {
  margin-left:40px
}
.mr40 {
  margin-right:40px
}
.pt40 {
  padding-top:40px
}
.pb40 {
  padding-bottom:40px
}
.pl40 {
  padding-left:40px
}
.pr40 {
  padding-right:40px
}
.mt45 {
  margin-top:45px
}
.mb45 {
  margin-bottom:45px
}
.ml45 {
  margin-left:45px
}
.mr45 {
  margin-right:45px
}
.pt45 {
  padding-top:45px
}
.pb45 {
  padding-bottom:45px
}
.pl45 {
  padding-left:45px
}
.pr45 {
  padding-right:45px
}
.mt50 {
  margin-top:50px
}
.mb50 {
  margin-bottom:50px
}
.ml50 {
  margin-left:50px
}
.mr50 {
  margin-right:50px
}
.pt50 {
  padding-top:50px
}
.pb50 {
  padding-bottom:50px
}
.pl50 {
  padding-left:50px
}
.pr50 {
  padding-right:50px
}
.parenthesis {
  position:relative
}
.parenthesis::before,
.parenthesis::after {
  position:absolute;
  top:0%;
  content:"";
  width:10px;
  height:100%;
  border-top:1px solid #fff;
  border-bottom:1px solid #fff;
  box-sizing:border-box
}
.parenthesis::before {
  left:0;
  border-left:1px solid #fff
}
.parenthesis::after {
  right:0;
  border-right:1px solid #fff
}
::-webkit-scrollbar {
  width:10px
}
::-webkit-scrollbar-track {
  box-shadow:inset 0 0 6px rgba(0,0,0,.1)
}
::-webkit-scrollbar-thumb {
  background-color:#ccc;
  box-shadow:0 0 0 1px rgba(255,255,255,.3)
}
.bevel {
  background:linear-gradient(45deg, transparent 0, rgba(0, 0, 0, 0.9) 0),linear-gradient(135deg, transparent 50px, rgba(0, 0, 0, 0.9) 50px),linear-gradient(225deg, transparent 0, rgba(0, 0, 0, 0.9) 0),linear-gradient(315deg, transparent 50px, rgba(0, 0, 0, 0.9) 50px);
  background-position:bottom left,top left,top right,bottom right;
  background-size:50% 50%;
  background-repeat:no-repeat
}
.bevel.white {
  background:linear-gradient(45deg, transparent 0, #ffffff 0),linear-gradient(135deg, transparent 20px, #ffffff 20px),linear-gradient(225deg, transparent 0, #ffffff 0),linear-gradient(315deg, transparent 20px, #ffffff 20px)
}
.image100 img {
  width:100%
}
@keyframes masking {
  0% {
    transform:translate(0, -101%)
  }
  42%,
  58% {
    transform:translate(0, 0%)
  }
  100% {
    transform:translate(0, 101%)
  }
}
@keyframes copyslide {
  0% {
    transform:translateX(-100%)
  }
  30% {
    transform:translateX(0)
  }
  65% {
    transform:translateX(0)
  }
  100% {
    transform:translateX(100%)
  }
}
@keyframes copyslide_stop {
  0% {
    transform:translateX(-100%)
  }
  30% {
    transform:translateX(0)
  }
  75% {
    transform:translateX(0)
  }
  100% {
    transform:translateX(0)
  }
}
.sc_box {
  position:absolute;
  right:0;
  bottom:5rem;
  display:flex;
  z-index:7000;
  width:3em
}
.sc_box a {
  display:block;
  position:absolute;
  width:100%;
  height:200%;
  top:-100%;
  left:0;
  content:"";
  z-index:999
}
.sc_box p {
  color:#fff;
  font-size:10px;
  font-size:1rem;
  margin-top:-5em;
  transform:translateX(46%)
}
.scroll_arrow {
  content:"";
  height:50px;
  width:1px;
  background:#fff;
  overflow:hidden
}
@media only screen and (max-width: 768px) {
  .scroll_arrow {
    height:30px
  }
}
.scroll_arrow .in {
  width:1px;
  height:50px;
  background:#333;
  z-index:999;
  animation:masking 2s ease infinite
}
@media only screen and (max-width: 768px) {
  .scroll_arrow .in {
    height:30px
  }
}
.scroll_arrow .in2 {
  position:absolute;
  width:1px;
  height:50px;
  background:#000;
  z-index:999;
  animation:masking 2s ease infinite
}
.scroll_arrow a {
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  content:"";
  z-index:2000
}
@keyframes masking {
  0% {
    transform:translate(0, -101%)
  }
  42%,
  58% {
    transform:translate(0, 0%)
  }
  100% {
    transform:translate(0, 101%)
  }
}
@keyframes arrows {
  0% {
    top:0%
  }
  100% {
    top:100%
  }
}
.image100 img {
  width:100%
}
.animate_btn.rv a:after {
  color:#000;
  position:absolute;
  font-family:"ionicons";
  top:50%;
  right:90%;
  margin-top:-0.5em;
  line-height:1;
  content:"";
  font-size:12px;
  font-size:1.2rem;
  z-index:999;
  transition:all .3s ease;
  transform:rotate(180deg)
}
.animate_btn a {
  display:inline-block;
  position:relative;
  transition:all .3s ease;
  padding:1rem 3rem 1rem 3rem;
  font-weight:bold
}
@media only screen and (max-width: 768px) {
  .animate_btn a {
    font-size:13px;
    font-size:1.3rem
  }
}
.animate_btn a:before {
  display:block;
  position:absolute;
  width:0%;
  height:100%;
  top:0;
  left:0;
  content:"";
  z-index:0;
  background:#000;
  transition:all .3s ease;
  right:0;
  left:auto
}
.animate_btn a:after {
  position:absolute;
  font-family:"Flaticon";
  top:50%;
  right:2rem;
  margin-top:-0.5em;
  line-height:1;
  content:"";
  font-size:18px;
  font-size:1.8rem;
  z-index:999;
  transition:all .3s ease
}
.animate_btn a span {
  position:relative;
  z-index:99
}
@media only screen and (max-width: 768px) {
  .animate_btn a:hover {
    color:#000
  }
}
.animate_btn a:hover span {
  color:#fff
}
@media only screen and (max-width: 768px) {
  .animate_btn a:hover span {
    color:#fff
  }
}
.animate_btn a:hover:before {
  width:100%;
  left:0
}
.animate_btn a:hover:after {
  color:#fff
}
@media only screen and (max-width: 768px) {
  .animate_btn a:hover:after {
    color:#fff
  }
}
@keyframes animate_btn_on {
  0% {
    left:-100%
  }
  100% {
    left:0
  }
}
@keyframes animate_btn_off {
  0% {
    left:0%
  }
  100% {
    left:100%
  }
}
.clearfix::after {
  content:"";
  display:block;
  clear:both
}
.image_wrap {
  width:100%;
  position:relative
}
@media only screen and (max-width: 768px) {
  .image_wrap {
    width:100%
  }
}
.image_wrap.bg01 {
  padding:0 5rem 0 0
}
@media only screen and (max-width: 768px) {
  .image_wrap.bg01 {
    padding:0
  }
}
.image_wrap.bg01:after {
  background:#31955b;
  height:100%;
  top:-5rem;
  left:5rem
}
.image_wrap.bg02 {
  padding:0 0 0 5rem;
  margin:0 0 10rem 0
}
@media only screen and (max-width: 768px) {
  .image_wrap.bg02 {
    padding:0;
    margin:0
  }
}
.image_wrap.bg02:after {
  background:#000;
  height:70%;
  bottom:-5rem;
  left:-5rem
}
.image_wrap.bg03 {
  padding:0 5rem 0 0
}
@media only screen and (max-width: 768px) {
  .image_wrap.bg03 {
    padding:0
  }
}
.image_wrap.bg03:after {
  background:#666;
  height:100%;
  top:-5rem;
  left:5rem
}
.image-mask {
  transform:translate3d(-100%, 0, 0);
  transition:.5s ease;
  transform-origin:left;
  overflow:hidden;
  display:block
}
.image-mask.active {
  transform:translate3d(0, 0, 0)
}
.image-mask.active .img_main {
  transform:translate3d(0, 0, 0)
}
.image-mask .img_main {
  transform:translate3d(101%, 0, 0);
  transition:.8s ease
}
@keyframes hoverElem {
  0% {
    transform:translate3D(0, 0, 0)
  }
  49% {
    transform:translate3D(100%, 0, 0);
    visibility:hidden
  }
  50% {
    transform:translate3D(-100%, 0, 0);
    visibility:hidden
  }
  52% {
    visibility:visible
  }
  100% {
    transform:translate3D(0, 0, 0)
  }
}
.image_wrap {
  position:relative;
  margin:0 0 0 .1rem
}
.image-mask {
  transform:translate3d(-100%, 0, 0);
  transition:1s ease;
  transform-origin:left;
  overflow:hidden;
  display:block
}
.image-mask.active {
  transform:translate3d(0, 0, 0)
}
.image-mask.active .img_main {
  transform:translate3d(0, 0, 0) scale(1)
}
.image-mask .image {
  position:relative
}
.image-mask .img_main {
  transform:translate3d(101%, 0, 0) scale(1.2);
  transition:1s ease
}
@keyframes hoverElem {
  0% {
    transform:translate3D(0, 0, 0)
  }
  49% {
    transform:translate3D(100%, 0, 0);
    visibility:hidden
  }
  50% {
    transform:translate3D(-100%, 0, 0);
    visibility:hidden
  }
  52% {
    visibility:visible
  }
  100% {
    transform:translate3D(0, 0, 0)
  }
}
@keyframes hoverElem {
  0% {
    transform:translate3D(0, 0, 0)
  }
  49% {
    transform:translate3D(100%, 0, 0);
    visibility:hidden
  }
  50% {
    transform:translate3D(-100%, 0, 0);
    visibility:hidden
  }
  52% {
    visibility:visible
  }
  100% {
    transform:translate3D(0, 0, 0)
  }
}
.ps {
  touch-action:auto;
  overflow:hidden !important;
  -ms-overflow-style:none
}
@supports(-ms-overflow-style: none) {
  .ps {
    overflow:auto !important
  }
}
@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none) {
  .ps {
    overflow:auto !important
  }
}
.ps.ps--active-x>.ps__scrollbar-x-rail,
.ps.ps--active-y>.ps__scrollbar-y-rail {
  display:block;
  background-color:rgba(0,0,0,0)
}
.ps.ps--in-scrolling.ps--x>.ps__scrollbar-x-rail {
  background-color:#eee;
  opacity:.9
}
.ps.ps--in-scrolling.ps--x>.ps__scrollbar-x-rail>.ps__scrollbar-x {
  background-color:#999;
  height:11px
}
.ps.ps--in-scrolling.ps--y>.ps__scrollbar-y-rail {
  background-color:#eee;
  opacity:.9
}
.ps.ps--in-scrolling.ps--y>.ps__scrollbar-y-rail>.ps__scrollbar-y {
  background-color:#999;
  width:11px
}
.ps>.ps__scrollbar-x-rail {
  display:none;
  position:absolute;
  opacity:0;
  transition:background-color .2s linear,opacity .2s linear;
  bottom:0px;
  height:15px
}
.ps>.ps__scrollbar-x-rail>.ps__scrollbar-x {
  position:absolute;
  background-color:#aaa;
  border-radius:6px;
  transition:background-color .2s linear,height .2s linear,width .2s ease-in-out,border-radius .2s ease-in-out;
  bottom:2px;
  height:6px
}
.ps>.ps__scrollbar-x-rail:hover>.ps__scrollbar-x,
.ps>.ps__scrollbar-x-rail:active>.ps__scrollbar-x {
  height:11px
}
.ps>.ps__scrollbar-y-rail {
  display:none;
  position:absolute;
  opacity:0;
  transition:background-color .2s linear,opacity .2s linear;
  right:0;
  width:15px
}
.ps>.ps__scrollbar-y-rail>.ps__scrollbar-y {
  position:absolute;
  background-color:#aaa;
  border-radius:6px;
  transition:background-color .2s linear,height .2s linear,width .2s ease-in-out,border-radius .2s ease-in-out;
  right:2px;
  width:6px
}
.ps>.ps__scrollbar-y-rail:hover>.ps__scrollbar-y,
.ps>.ps__scrollbar-y-rail:active>.ps__scrollbar-y {
  width:11px
}
.ps:hover.ps--in-scrolling.ps--x>.ps__scrollbar-x-rail {
  background-color:#eee;
  opacity:.9
}
.ps:hover.ps--in-scrolling.ps--x>.ps__scrollbar-x-rail>.ps__scrollbar-x {
  background-color:#999;
  height:11px
}
.ps:hover.ps--in-scrolling.ps--y>.ps__scrollbar-y-rail {
  background-color:#eee;
  opacity:.9
}
.ps:hover.ps--in-scrolling.ps--y>.ps__scrollbar-y-rail>.ps__scrollbar-y {
  background-color:#999;
  width:11px
}
.ps:hover>.ps__scrollbar-x-rail,
.ps:hover>.ps__scrollbar-y-rail {
  opacity:.6
}
.ps:hover>.ps__scrollbar-x-rail:hover {
  background-color:#eee;
  opacity:.9
}
.ps:hover>.ps__scrollbar-x-rail:hover>.ps__scrollbar-x {
  background-color:#999
}
.ps:hover>.ps__scrollbar-y-rail:hover {
  background-color:#eee;
  opacity:.9
}
.ps:hover>.ps__scrollbar-y-rail:hover>.ps__scrollbar-y {
  background-color:#999
}
:root {
  --offset: 40vw;
  --move-initial: calc(-30% + var(--offset));
  --move-final: calc(-50% + var(--offset))
}
.bg_image {
  --offset: 30vw;
  --move-initial: calc(-30% + var(--offset));
  --move-final: calc(-50% + var(--offset))
}
*::-ms-backdrop,
:root {
  --move-initial: -40vw;
  --move-final: -150vw
}
.marquee {
  width:100vw;
  overflow:hidden
}
section.lead .inner {
  padding:0 0 3rem 0
}
.marquee__inner {
  width:600%;
  display:flex;
  justify-content:space-between;
  position:relative;
  transform:translate3d(var(--move-initial), 0, 0);
  animation:marquee 20s linear infinite;
  -webkit-animation:marquee 20s linear infinite
}
*::-ms-backdrop,
.marquee__inner {
  width:800vw;
  margin:0;
  animation:marquee_ie 20s linear infinite;
  -webkit-animation:marquee_ie 20s linear infinite
}
*::-ms-backdrop span,
.marquee__inner span {
  display:block;
  margin:0
}
@keyframes marquee_ie {
  0% {
    transform:translate3d(0vw, 0, 0)
  }
  100% {
    transform:translate3d(-150vw, 0, 0)
  }
}
@keyframes marquee {
  0% {
    transform:translate3d(var(--move-initial), 0, 0)
  }
  100% {
    transform:translate3d(var(--move-final), 0, 0)
  }
}
@keyframes loop {
  0% {
    transform:translateX(100%)
  }
  to {
    transform:translateX(-100%)
  }
}
@keyframes loop2 {
  0% {
    transform:translateX(0)
  }
  to {
    transform:translateX(-200%)
  }
}
@keyframes loop3 {
  0% {
    transform:translateX(-100%)
  }
  to {
    transform:translateX(100%)
  }
}
@keyframes loop4 {
  0% {
    transform:translateX(-200%)
  }
  to {
    transform:translateX(0)
  }
}
body {
  color:#000
}
a {
  color:#000;
  text-decoration:none
}
a:hover {
  color:#333;
  text-decoration:none
}
a:hover {
  text-decoration:none;
  outline:none !important
}
img {
  vertical-align:bottom;
  line-height:1
}
.pc {
  display:block
}
@media only screen and (max-width: 768px) {
  .pc {
    display:none !important
  }
}
.sp {
  display:none
}
@media only screen and (max-width: 768px) {
  .sp {
    display:block
  }
}
img[src$=".svg"] {
  width:100%;
  height:auto
}
.tate {
  -o-writing-mode:vertical-rl;
  writing-mode:vertical-rl
}
@media only screen and (max-width: 768px) {
  .tate {
    writing-mode:horizontal-tb
  }
}
.tatete {
  -o-writing-mode:vertical-rl;
  writing-mode:vertical-rl
}
html.win.gecko .ro,
html.win.gecko .la {
  transform:rotate(0.001deg)
}
a,
img {
  outline:none !important
}
* {
  -o-box-sizing:border-box;
  -ms-box-sizing:border-box;
  box-sizing:border-box
}
.unborder::after {
  content:"";
  display:block;
  margin:1rem auto 1rem auto;
  text-align:center;
  width:50px;
  height:1px;
  background:#000
}
@media only screen and (max-width: 768px) {
  .unborder::after {
    margin:.8rem auto
  }
}
.lborder::after {
  content:"";
  display:block;
  margin:1rem 0 1rem 0;
  text-align:center;
  width:50px;
  height:1px;
  background:#000
}
.unborder_big::after {
  content:"";
  display:block;
  margin:2rem auto 2rem auto;
  text-align:center;
  width:50px;
  height:1px;
  background:#fff
}
@media only screen and (max-width: 768px) {
  .unborder_big::after {
    margin:1.4rem auto
  }
}
ul,
li {
  list-style:none
}
ul.normal_list {
  margin:0;
  padding:0 0 0 1em
}
ul.normal_list li {
  padding:0 0 0 0;
  margin:0 0 0 .3em;
  position:relative;
  list-style-type:disc;
  line-height:1.5
}
.d02s {
  animation-delay:.2s
}
.d03s {
  animation-delay:.3s
}
.d04s {
  animation-delay:.4s
}
.d06s {
  animation-delay:.6s
}
.d08s {
  animation-delay:.8s
}
.d1s {
  animation-delay:1s
}
@font-face {
  font-family:"Flaticon";
  src:url("/ja/career/font/Flaticon.eot");
  src:url("/ja/career/font/Flaticon.eot#iefix") format("embedded-opentype"),
  url("/ja/career/font/Flaticon.woff2") format("woff2"),
  url("/ja/career/font/Flaticon.woff") format("woff"),
  url("/ja/career/font/Flaticon.ttf") format("truetype"),
  url("/ja/career/font/Flaticon.svg#Flaticon") format("svg");
  font-weight:normal;
  font-style:normal
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family:"Flaticon";
    src:url("/ja/career/font/Flaticon.svg#Flaticon") format("svg")
  }
}
.fi:before {
  display:inline-block;
  font-family:"Flaticon";
  font-style:normal;
  font-weight:normal;
  font-variant:normal;
  line-height:1;
  text-decoration:inherit;
  text-rendering:optimizeLegibility;
  text-transform:none;
  -moz-osx-font-smoothing:grayscale;
  -webkit-font-smoothing:antialiased;
  font-smoothing:antialiased
}
.flaticon-menu:before {
  content:""
}
.flaticon-next:before {
  content:""
}
.flaticon-go-back:before {
  content:""
}
.flaticon-forward:before {
  content:""
}
.flaticon-down-arrow:before {
  content:""
}
.flaticon-chevron:before {
  content:""
}
.flaticon-back:before {
  content:""
}
.flaticon-undo:before {
  content:""
}
.flaticon-right-arrow:before {
  content:""
}
.flaticon-left-arrow:before {
  content:""
}
.flaticon-plus:before {
  content:""
}
.flaticon-play-button:before {
  content:""
}
.flaticon-play:before {
  content:""
}
.flaticon-left-arrow-1:before {
  content:""
}
.flaticon-right-arrow-1:before {
  content:""
}
.flaticon-left-arrow-2:before {
  content:""
}
.flaticon-download:before {
  content:""
}
.flaticon-down-arrow-1:before {
  content:""
}
.flaticon-checked:before {
  content:""
}
.flaticon-question:before {
  content:""
}
.flaticon-play-button-1:before {
  content:""
}
.flaticon-up-arrow:before {
  content:""
}
.flaticon-file:before {
  content:""
}
.flaticon-chat:before {
  content:""
}
.flaticon-up-arrow-1:before {
  content:""
}
.flaticon-smartphone:before {
  content:""
}
.flaticon-cloud-computing:before {
  content:""
}
.flaticon-login:before {
  content:""
}
.flaticon-close:before {
  content:""
}
main {
  width:100%;
  overflow:hidden
}
a.txt_link {
  text-decoration:underline
}
.english_link {
  max-width:1200px;
  margin:auto;
  padding:5% 5% 0 5%;
  text-align:right
}
.english_link a {
  display:inline-block;
  text-decoration:underline
}
.rec_em_btn {
  width:800px;
  margin:3rem auto 0 auto;
  padding:0 5%
}
@media only screen and (max-width: 768px) {
  .rec_em_btn {
    width:100%
  }
}
.rec_em_btn ul {
  display:flex;
  justify-content:space-between
}
.rec_em_btn ul li {
  width:49.7%
}
.rec_em_btn ul li a {
  display:block;
  padding:1rem 0;
  text-align:center;
  background:#62b0e2;
  color:#fff;
  transition:all .3s ease
}
.rec_em_btn ul li a:hover {
  background:#8dc6ea;
  color:#fff
}
#requirements .inner {
  max-width:1300px;
  margin:auto;
  padding:0 5%
}
#requirements .lead {
  margin:0 0 5rem 0;
  text-align:center
}
#requirements .lead.narrow {
  width:640px;
  text-align:left;
  margin:auto
}
@media only screen and (max-width: 768px) {
  #requirements .lead.narrow {
    width:100%
  }
}
@media only screen and (max-width: 768px) {
  #requirements .lead {
    text-align:left
  }
}
#requirements .lead p {
  padding:0 1rem
}
#requirements .hr_block {
  width:800px;
  margin:10rem auto 0 auto
}
@media only screen and (max-width: 768px) {
  #requirements .hr_block {
    width:100%
  }
}
#requirements .hr_block .box {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0 0 2rem 0;
  margin:0 0 2rem 0;
  border-bottom:1px dotted #ccc
}
#requirements .hr_block .box:last-child {
  border-bottom:none
}
#requirements .hr_block .box .num {
  font-size:5rem;
  color:#62b0e2;
  width:3em
}
#requirements .hr_block .box div.jp {
  flex:1;
  font-weight:bold
}
.loop {
  padding-top:30px;
  padding-bottom:30px;
  overflow:hidden
}
.loop__box {
  display:flex;
  width:100vw
}
.loop__box img {
  min-width:100vw
}
.loop__box img:first-child {
  animation:loop 50s -25s linear infinite
}
.loop__box img:last-child {
  animation:loop2 50s linear infinite
}
@keyframes loop {
  0% {
    transform:translateX(100%)
  }
  to {
    transform:translateX(-100%)
  }
}
@keyframes loop2 {
  0% {
    transform:translateX(0)
  }
  to {
    transform:translateX(-200%)
  }
}
.read-txt{
	font-size: 1.6rem;
	margin-top: 20px;
}
p.table_title {
  padding:0 0 0 3rem;
  font-weight:bold;
  font-size:1.8rem;
  font-family:a-otf-ud-shin-go-pr6n,sans-serif;
}
p.table_title span{
	font-size: 1.5rem;
}
p.table_title.big {
  font-size:2rem
}
.sp{
	display: none!important
}
@media only screen and (max-width: 768px) {
  p.table_title {
	  padding: 0;
    text-align:center
  }
.read-txt{
	font-size: 1.4rem;
	margin-top: 15px;
}
	.sp{
		display: block;
	}
p.table_title span{
	display: block;
	line-height: 1.5;
}
}
table.rec_table {
  width:100%;
  display:block
}
table.rec_table p {
  margin:0 0 1.2rem 0;
  line-height:1.5
}
@media only screen and (max-width: 768px) {
  table.rec_table.mb50 {
    margin:0 0 3rem 0
  }
}
table.rec_table tbody {
  width:100%;
  display:block
}
table.rec_table tr {
  display:flex;
  width:100%
}
@media only screen and (max-width: 768px) {
  table.rec_table tr {
    display:block
  }
}
table.rec_table th {
  width:25%
}
@media only screen and (max-width: 768px) {
  table.rec_table th {
    width:100%;
    border-bottom:1px solid #eee
  }
}
table.rec_table td {
  flex:1;
  border-left:3px solid #eee
}
table.rec_table td.nobs {
  border-left:0
}
@media only screen and (max-width: 768px) {
  table.rec_table td {
    border-left:none
  }
}
table.rec_table th,
table.rec_table td {
  padding:1rem 3rem 1rem 3rem;
  margin:0 0 2rem 0
}
@media only screen and (max-width: 768px) {
  table.rec_table th,
  table.rec_table td {
    display:block;
    padding:1rem;
    margin:0
  }
}
table.rec_table h2 {
  margin:0 0 2rem 0;
  position:relative;
  display:flex;
  align-items:center
}
table.rec_table h2:before {
  content:"";
  width:1.2rem;
  margin:0 1rem 0 0;
  height:1px;
  background:#333;
  display:block
}
table.rec_table a.btn {
  display:inline-block;
  padding:.6rem 1rem;
  border-radius:3px;
  border:1px solid #ccc
}
@media only screen and (max-width: 768px) {
  table.rec_table a.btn {
    display:block;
    text-align:center;
    margin:0 0 1rem 0;
    padding:1rem
  }
}
table.rec_table p.mm {
  margin:0 0 2rem 0
}
table.rec_table02 {
  display:table;
  border-bottom:1px solid #ccc;
  border-right:1px solid #ccc;
  width:100%;
  margin:0 0 5rem 0
}
table.rec_table02 td.tit {
  background:#666;
  color:#fff;
  padding:1rem
}
table.rec_table02.new th,
table.rec_table02.new td {
  width:40%;
  height:100%
}
@media only screen and (max-width: 768px) {
  table.rec_table02.new th,
  table.rec_table02.new td {
    width:100%
  }
}
table.rec_table02.new td.nar,
table.rec_table02.new th.nar {
  width:20%
}
@media only screen and (max-width: 768px) {
  table.rec_table02.new td.nar,
  table.rec_table02.new th.nar {
    width:100%
  }
}
table.rec_table02.new td.bgblue {
  background:#62b0e2;
  color:#fff
}
table.rec_table02.new td.nar02 {
  width:35%
}
@media only screen and (max-width: 768px) {
  table.rec_table02.new td.nar02 {
    width:100%
  }
}
table.rec_table02.new td.wide {
  width:60%;
  padding:0 0 0 1rem
}
@media only screen and (max-width: 768px) {
  table.rec_table02.new td.wide {
    width:100%
  }
  table.rec_table02.new td.wide.spnone {
    display:none
  }
}
table.rec_table02.flat td {
  width:20%;
  text-align:center;
  padding:1rem 0
}
@media only screen and (max-width: 768px) {
  table.rec_table02.flat td {
    width:100%;
    text-align:center;
    display:table-cell;
    width:20% !important
  }
}
table.rec_table02 tbody {
  display:table;
  width:100%
}
table.rec_table02 th {
  background:#fafafa;
  padding:1rem
}
table.rec_table02 tr {
  display:table;
  width:100%
}
table.rec_table02 tr.bg {
  background:#fafafa
}
table.rec_table02 td {
  border:none
}
table.rec_table02 th,
table.rec_table02 td {
  border-top:1px solid #ccc;
  border-left:1px solid #ccc;
  text-align:left
}
.faq_cont h3 {
  font-size:2.4rem;
  margin:0 0 5rem 0;
  position:relative;
  display:flex;
  align-items:center
}
.faq_cont h3:before {
  display:block;
  content:"";
  width:3rem;
  height:5px;
  background:#ffa700;
  margin:0 2rem 0 0
}
.faq_cont .faq_box {
  border-left:1px solid #555;
  border-right:1px solid #555;
  margin:0 0 1rem 0
}
@media only screen and (max-width: 768px) {
  .faq_cont .faq_box {
    margin:0 0 1rem 0
  }
}
.faq_cont .faq_box .faq_title {
  border-top:1px solid #555;
  border-bottom:1px solid #555;
  position:relative;
  cursor:pointer
}
.faq_cont .faq_box .faq_title:hover {
  background:rgba(85,85,85,.1)
}
.faq_cont .faq_box .faq_title:after {
  position:absolute;
  font-family:"Flaticon";
  top:50%;
  right:3%;
  margin-top:-0.5em;
  line-height:1;
  content:"";
  font-size:20px;
  font-size:2rem;
  z-index:999;
  color:#555;
  transition:all .3s
}
.faq_cont .faq_box .faq_title.active:after {
  transform:rotate(45deg)
}
.faq_cont .faq_box .faq_title dl {
  display:flex
}
.faq_cont .faq_box .faq_title dl dt {
  display:flex;
  align-items:center;
  justify-content:center;
  background:#666;
  color:#fff;
  font-weight:bold;
  width:8em;
  line-height:1
}
@media only screen and (max-width: 768px) {
  .faq_cont .faq_box .faq_title dl dt {
    font-size:1.4rem;
    padding:1rem;
    width:4em;
    background:#999
  }
}
.faq_cont .faq_box .faq_title dl dd {
  flex:1;
  padding:2rem 0 2rem 5rem;
  font-weight:bold
}
@media only screen and (max-width: 768px) {
  .faq_cont .faq_box .faq_title dl dd {
    padding:1rem 4rem 1rem 2rem;
    font-size:1.3rem;
    font-weight:normal
  }
}
.faq_cont .faq_box .faq_answer {
  padding:4rem;
  border-bottom:1px solid #000;
  display:none
}
@media only screen and (max-width: 768px) {
  .faq_cont .faq_box .faq_answer {
    padding:2rem
  }
}
.faq_cont .faq_box .faq_answer .answer {
  color:#000;
  font-size:2.4rem
}
.faq_cont .faq_box .faq_answer .blc {
  display:flex;
  justify-content:space-between
}
.faq_cont .faq_box .faq_answer .blc .txt {
  flex:1
}
.faq_cont .faq_box .faq_answer .blc p.answer {
  width:10rem
}
.faq_cont .faq_box .faq_answer p a {
  padding:1rem 2.6rem 1rem 2rem;
  border:1px solid #000;
  margin:2rem 0 0 0;
  color:#000;
  position:relative;
  display:inline-block;
  border-radius:3px
}
.faq_cont .faq_box .faq_answer p a:hover {
  background:#000;
  color:#fff
}
.faq_cont .faq_box .faq_answer p a:hover:after {
  color:#fff
}
.faq_cont .faq_box .faq_answer p a:after {
  font-family:"ionIcons";
  content:"";
  font-size:14px;
  font-size:1.4rem;
  z-index:999;
  transition:all .3s;
  margin:0 0 0 1.5rem
}
.rec_flex {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap
}
@media only screen and (max-width: 768px) {
  .rec_flex {
    display:block
  }
}
.rec_flex .box {
  width:46%;
  margin:0 0 5rem 0
}
@media only screen and (max-width: 768px) {
  .rec_flex .box {
    width:100%;
    margin:0 0 3rem 0
  }
}
.rec_flex .box h3 {
  font-weight:bold;
  margin:0 0 1rem 0;
  border-bottom:1px solid #ccc
}
h2.rh2 {
  font-size:2rem;
  margin:0 0 5rem 0;
  padding:1rem 0 1rem 3rem;
  border-left:3px solid #000
}
@media only screen and (max-width: 768px) {
  h2.rh2 {
    font-size:1.6rem;
    margin:0 0 3rem 0
  }
}
.frontier_block dl {
  display:flex;
  margin:0 0 2rem 0
}
.frontier_block dl dt {
  width:5em
}
.frontier_block dl dd {
  flex:1
}
a.txtlink {
  position:relative
}
a.txtlink span {
  display:inline-block;
  position:relative
}
a.txtlink span:before {
  display:block;
  position:absolute;
  width:0%;
  height:1px;
  bottom:0;
  left:0;
  content:"";
  z-index:999;
  background:#555;
  transition:all .3s ease
}
a.txtlink:hover span:before {
  width:100%
}
p.entry_btn {
  margin:2rem 0 0 0
}
.group_zu {
  width:760px;
  margin:0 auto 5rem auto;
  transform:translateX(2rem)
}
@media only screen and (max-width: 768px) {
  .group_zu {
    width:100%;
    transform:none;
    margin:0 0 3rem 0
  }
}
.group_flex {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap
}
@media only screen and (max-width: 768px) {
  .group_flex {
    display:block
  }
}
.group_flex .box {
  width:44%;
  margin:0 0 8rem 0
}
@media only screen and (max-width: 768px) {
  .group_flex .box {
    width:100%;
    margin:0 0 3rem 0
  }
}
.group_flex .box .image {
  margin:0 0 2rem 0;
  transition:all .3s ease
}
.group_flex .box .image:hover {
  opacity:.8
}
@media only screen and (max-width: 768px) {
  .group_flex .box .image {
    margin:0 0 1rem 0
  }
}
.group_flex .box h2 {
  font-weight:bold;
  font-size:1.6rem;
  margin:0 0 1rem 0
}
.group_flex .box .txt {
  margin:0 0 2rem 0
}
@media only screen and (max-width: 768px) {
  .group_flex .box .txt {
    margin:0 0 1rem 0
  }
}
.group_flex .box .link_btns a {
  display:inline-block;
  border:1px solid #ccc;
  padding:1rem 2rem;
  font-size:1.4rem;
  position:relative
}
@media only screen and (max-width: 768px) {
  .group_flex .box .link_btns a {
    display:block;
    text-align:center;
    padding:1.4rem 0
  }
}
.group_flex .box .link_btns a:hover {
  background:#555;
  color:#fff
}
.group_flex .box .link_btns a:hover:after {
  background:url("/ja/career/img/common/blank_w.svg") no-repeat 0 0
}
.group_flex .box .link_btns a:after {
  content:"";
  display:inline-block;
  width:16px;
  height:16px;
  background:url("/ja/career/img/common/blank.svg") no-repeat 0 0;
  position:relative;
  top:.2rem;
  left:.5rem;
  background-size:16px;
  background-size:contain
}


table.rec_table td.nobs a{
  text-decoration: underline;
}

table.rec_table > tbody > tr > td.nobs{
  line-height: 1.5;
}



table.rec_table > tbody > tr > td.nobs *{
  line-height: 1.8;
}

table.rec_table > tbody > tr > td.nobs > p,table.rec_table > tbody > tr > td.nobs > p *{
  line-height: 1.5;
}

table.rec_table > tbody > tr > td.nobs > p > span{
  line-height: 1.8;
}

table.rec_table > tbody > tr > td.nobs > div p{
  margin: 0;
}

#normal_title.mbl{margin:0 0 3rem 0}
@media only screen and (max-width: 768px){#normal_title.mbl{margin:0 0 3rem 0}
}