/* ==========================
  @ Common
================================== */
:root {
  --mc:#3d7bae;
  --mw:1100px;
}
@media only screen and (max-width: 599px){
  :root {
    --mw:100%;
  }  
}
body{color: #333;}
.bg--ccc{background:#eee;padding: 2rem 0;margin:2rem 0;}

.df{display:flex;}.df--fw{flex-wrap: wrap;}
.df--jcsb{justify-content: space-between;}
.df--aic{align-items: center;}

.afu_on{
  animation-name:fadeUpAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
  opacity:0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
    transform: translateY(100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ==========================
  @ Header
================================== */
.wbf__header {
  background: var(--mc);
}
.wh__inr{width:var(--mw);margin:0 auto;}
.wh__logo{width:240px;}
.wh__menu{
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
}
.wh__menu-li{padding: 1.5rem 1rem;}
.wh__menu-li.wh__sel{
  color: var(--mc);
  background: #fff;
}
.wh__menu-linr {
  z-index:1;
  display:none;
  position: absolute;
  width: 100%;
  left: 0;
  background: #fff;
  top: 80px;
  padding-bottom:1rem;
  border-bottom:1px solid var(--mc);
}
.whm {
  width: var(--mw);
  margin: 0 auto;
  padding: 1rem 0;
  font-size: .9rem;
}
.whm li{}

.wh__sel .wh__menu-linr{display:block;}


/* ==========================
  @ News
================================== */
.newsLine{
  padding: 0.5rem 0;
  border-bottom: 1px solid #ccc;
}
.newsLine__wrap{width:var(--mw);margin:0 auto;display:block;font-size:14px;}
.newsLine__wrap::after {
  margin-left: 1rem;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f054";
  color: var(--mc);
}
.newsLine__wrap span{
  background: #DE646D;
  color: #fff;
  padding: 5px 10px;
  display: inline-block;
  border-radius: 15px;
  font-size: .9rem;
  font-weight: bold;
  margin-right:.5rem;
  display: none;
}

.wh__ec{position:relative;}
.wh__ec--ttl{
  width:100%;
  position:absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  margin: auto;
  color: #fff;
    font-size: 1.6rem;
    text-shadow: 0px 1px 10px #333;
    font-weight: bold;
    text-align: center;
}
.wh__ec--ttl span{display:block;}
.wh__ec--ttl span:nth-of-type(1){font-size:40px;}
.wh__ec--ttl span:nth-of-type(2){font-size:20px;}

/* ==========================
  @ Main
================================== */
.wh__news{width:var(--mw);margin: 2rem auto 4rem;}
.wh__news--ttl{
  font-size: 1.6rem;
  font-weight: bold;
  margin: 1rem 0;
  border-bottom: 2px solid var(--mc);
}
.wn-l{
  align-items: center;
}
.wn-l span:nth-of-type(1) {
    color: #666;
    font-size: 14px;
}
.wh__news--ttl span:nth-of-type(2){
  font-size: 1rem;
  color: #888;
  margin-left: 1rem;
}
.news__cat span {
    color: #fff !important;
    display: inline-block;
    background: #3d7bae;
    color: #fff;
    padding: 2px 6px !important;
    font-size: 12px !important;
    text-align: center;
    margin-left: 8px;
}
/* .wn-l{width:21%;} */
.wn-r {
    width: 100%;
    margin-left: 0;
    margin-top: 5px;
}
.wh__news-line a{
  padding: 5px 0;
}
.wh__news .wh__news-line:last-of-type{border-bottom:none;}
.wh__news-line {
  margin-bottom: 0.5rem;
  border-bottom: solid 1px #ccc;
  padding-bottom: 0.5rem;
}
.wh__news .wh__btn.ptn2 {
  font-size: 100%;
  width: 180px;
  margin: 1rem auto 0;
}
.wh__btn:hover{
  color:#fff;
}

.wh__pre-wrap {
    width: 900px;
    margin: 0 auto;
    padding: 5.2rem 0 0;
}
.wh__pre {
    opacity: 0;
    height: 410px;
    overflow: hidden;
    background: linear-gradient(321deg, #7da7c8 0%, #7DA7C8 40%, #3d7bae 40%, #3d7bae 100%);
}
.wh__pre--ttl{line-height:1.2;color: #C9DAE8;}
.wh__pre--ttl strong{font-size: 3rem;}
.wh__pre--ttl span{font-size: 1.25rem;display:block;}
.wh__pre--txt{
  color: #fff;
  margin: 1rem 0;
  line-height: 1.8;
}
.wh__btn{
  display:block;
  border:1px solid #fff;
  font-weight:bold;
  text-align:center;
  padding:.5rem;
  color:#fff;
}
.wh__btn.ptn2{
  background: #333;
  margin: 0.5rem 0;
  font-size: 120%;
}

.wh__pre-r {
  width: 230px;
  margin-left: 15rem;
  margin-top: -3rem;
}

.wh__3col{width:var(--mw);margin: 4rem auto;}
.wh3__con{
  opacity:0;
  width: calc(100% / 3 - 4rem);
}
.wh3__con h3{
  font-size: 1.6rem;
  font-weight: bold;
  margin: 2rem 0 1.5rem;
}
.wh3__con p{
  height: 6.5rem;
  line-height: 1.8;
  font-size:.9rem;
}

/* ==========================
  @ Footer
================================== */
.wbg__footer{
  color:#fff;  
  background: var(--mc);
  padding: 2rem 0 0;  
}
.wbg__footer > div:nth-of-type(1){width:var(--mw);margin: 0 auto 2rem;}
.wf__logo {width: 240px;}
.wf__menu {
  width: calc(100% - 440px - 2rem);
}
.wf--ttl{font-size:1.2rem;margin-bottom:.5rem;}
.wf--txt,.wf--ttl a{display:flex;align-items: center;font-weight:normal;}
.wf--txt::before{
  margin-right: 1rem;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  content: "\f054";
  font-size: 70%;
}
.whm .wf--txt::before{content:none;}
.whm .wf--txt::after,.whm .wf--ttl a::after{
  margin-left: 1rem;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  content: "\f054";
  font-size: 70%;
}


.wf__cpr {
  background: #333;
  text-align: center;
  font-size: .8rem;
  padding: 5px 0;
}

/* ==========================
  @ about/Message
================================== */
.eye {
    width: var(--mw);
    margin: 3rem auto 5rem;
    position: relative;
}
.eye img {
    width: 250px;
    position: absolute;
    right: 162px;
    bottom: -82px;
}
.eye--ttl {
  font-size: 3rem;
  color: var(--mc);
  line-height: 1.2;
  border-bottom: 4px solid;
  width: 400px;
  padding-bottom: 0.5rem;
}
.eye--ttl span{font-size: 1.2rem;display: block;}
.eye--ttl.ptn2 {color: #333;border: none;margin: 3rem 0;}

.mss {
  background: #EAEFF4;
  padding: 3rem 0;
  line-height: 2;
}
.mss-txt{ 
  width:var(--mw);
  margin:0 auto;
}

/* ==========================
  @ about/Business
================================== */

.bwrap,.bwrap2,.bwrap3{opacity:0;}
.bw__i{
  color:#fff;
background-image: radial-gradient(circle at 67% 83%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 1%,transparent 1%, transparent 5%,transparent 5%, transparent 100%),radial-gradient(circle at 24% 80%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 27%,transparent 27%, transparent 63%,transparent 63%, transparent 100%),radial-gradient(circle at 23% 5%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 26%,transparent 26%, transparent 82%,transparent 82%, transparent 100%),radial-gradient(circle at 21% 11%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 35%,transparent 35%, transparent 45%,transparent 45%, transparent 100%),radial-gradient(circle at 10% 11%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 21%,transparent 21%, transparent 81%,transparent 81%, transparent 100%),radial-gradient(circle at 19% 61%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 20%,transparent 20%, transparent 61%,transparent 61%, transparent 100%),radial-gradient(circle at 13% 77%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 63%,transparent 63%, transparent 72%,transparent 72%, transparent 100%),radial-gradient(circle at 30% 93%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 33%,transparent 33%, transparent 82%,transparent 82%, transparent 100%),linear-gradient(90deg, rgb(22, 176, 207),rgb(61 123 174));
  padding: 4rem 0;
  text-align: center;
}
.bwi__ttl{font-size: 1.6rem;font-weight: bold;}
.bw--txt {
  text-align: center;
  width: var(--mw);
  margin: 2rem auto;
  line-height: 1.8;
}
.bw__l{width: var(--mw);margin: 2rem auto;  }
.bw__li{width:calc(100% / 3 - 3rem);}
.bw__li h3{
  font-size: 1.6rem;
  font-weight: bold;
  color: var(--mc);
  border-bottom:1px solid var(--mc);
}
.bw__li p {
  font-size: .9rem;
  margin: 1rem 0;
  line-height: 1.8;
  height:180px;
}

/* ==========================
  @ about/company
================================== */
.cpWrap{opacity:0;}
.cpttl{
  width: var(--mw);
  color: #333;
  margin: 0 auto;
  font-size: 1.4rem;
  font-weight: bold;
  border-bottom: 2px solid var(--mc);
}
.cp__tbl{width: var(--mw);margin: 1rem auto;}
.cp__tbl tr{border-bottom: 2px solid #fff;}
.cp__tbl th {
  color:#fff;
  background: var(--mc);
  padding: 1rem 0;
  width: 10rem;
}
.cp__tbl td {
  background: #f4f4f4;
  width: calc(100% - 10rem);
  padding: 1rem 0 1rem 2rem;
}
.cp__tbl td span{
  display: block;
  font-size: .8rem;
  color: #666;
}

.cpl{width: var(--mw);margin: 1rem auto 0;}
.cpl li{
  width: calc(100% / 4 - 1rem);
  background: #fff;
  padding: 2rem;
}
.cpl h3{font-weight: bold;font-size: 1.2rem;}
.cpl p{font-size:.9rem;}
.cpl span{
  display: block;
  font-weight: bold;
  color: var(--mc);
}
p.bb{
  border-top: solid #ccc 1px;
  margin-top: 0.5rem;
}
p.bb > span:nth-of-type(1){margin-top:.5rem;}

.cp__tbl2{margin:2rem auto;width: var(--mw);}
.cp__tbl2 td {
  border-left: 2px solid #ccc;
  padding: 1rem;
}
.cp__tbl2 th{
  position:relative;
  padding: 1rem 0;
  width: 6rem;
  text-align: left;
}
.cp__tbl2 th::after {
  content: "●";
  color:var(--mc);
  position: absolute;
  right: -8px;
}
.cp__tbl2 b{display:block;}

/* ==========================
  @ about/Access
================================== */
.accWrap{
  width:var(--mw);
  margin:0 auto;
}
.accBox {
  opacity:0;
  width:100%;
  margin: 0 0 2rem;
  padding: 2rem;
  border: 2px solid #ccc;
}
.acc-ttl {
  font-size: 1.6rem;
  font-weight: bold;
  color: var(--mc);
  border-left: 8px solid;
  padding-left: 0.5rem;
}
.accBox p{margin:1rem 0;}
.accBox iframe{width:100%;height:250px;}
.accBox span{
  display: block;
  font-weight: bold;
  color: var(--mc);
}

/* ==========================
  @ about/PHILPSOPHY
================================== */
.phWrap{opacity:0;}
.phWrap:nth-of-type(2) .ph__txt{margin: 4rem auto 16rem;}
.ph__ttl{
  padding: 2rem 0;
background-image: linear-gradient(330deg, rgba(225, 225, 225, 0.05) 0%, rgba(225, 225, 225, 0.05) 33.333%,rgba(114, 114, 114, 0.05) 33.333%, rgba(114, 114, 114, 0.05) 66.666%,rgba(52, 52, 52, 0.05) 66.666%, rgba(52, 52, 52, 0.05) 99.999%),linear-gradient(66deg, rgba(181, 181, 181, 0.05) 0%, rgba(181, 181, 181, 0.05) 33.333%,rgba(27, 27, 27, 0.05) 33.333%, rgba(27, 27, 27, 0.05) 66.666%,rgba(251, 251, 251, 0.05) 66.666%, rgba(251, 251, 251, 0.05) 99.999%),linear-gradient(225deg, rgba(98, 98, 98, 0.05) 0%, rgba(98, 98, 98, 0.05) 33.333%,rgba(222, 222, 222, 0.05) 33.333%, rgba(222, 222, 222, 0.05) 66.666%,rgba(228, 228, 228, 0.05) 66.666%, rgba(228, 228, 228, 0.05) 99.999%),linear-gradient(90deg, rgb(61,123,174),rgb(40, 160, 253));
  color: #fff;
  
}
.ph__ttl h2{
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}
.ph__ttl h2 span{display:block;}.ph__ttl h2 span:nth-of-type(2){font-size: .9rem;}
.ph__imp{
  position:relative;
  font-size:1.1rem;
  color: var(--mc);
  font-weight: bold;
  text-align: center;
  margin: 2rem 0;
  line-height: 1.8;
}
.ph__imp::before {
  content: "";
  width: 10rem;
  height: 6px;
  background: var(--mc);
  position: absolute;
  bottom: -18px;
  left: 44%;
}
.ph__txt{width:900px;margin:4rem auto 10rem;}
.ph__txt dt img:nth-of-type(2) {
    position: absolute;
    width: 70%;
    bottom: -145px;
    left: 333px;
}
.ph__txt dt {
  width: 400px;
  background: #eee;
  position: relative;
}
.ph__txt dt img:nth-of-type(2){
  position:absolute;
}
.ph__txt dd {
  font-size: .9rem;
  padding-left: 2rem;
  line-height: 1.8;
  width: calc(100% - 400px);
}

.phList{width:900px;margin:0 auto;}
.phList li {
  margin-bottom: 1rem;
  width: calc(100% / 2 - 1rem);
  border-bottom: solid #3d7bae 1px;
}
.phList span{
  font-size: 1.4rem;
  background: var(--mc);
  color: #fff;
  padding: 0.5rem 1rem;
  display: inline-block;
  font-weight: bold;
  margin-right: 1rem;
  width: 4rem;
  text-align: center;
}
.ph__txt2{
    text-align: center;
    margin: 2rem 0 3rem;
    line-height: 1.8;
}

/* ==========================
  @ about/recruit
================================== */
.recImg{
  height: 400px;
  position:relative;
  background-size: 100% auto !important;
}
.riWrap{width:var(--mw);margin:0 auto;padding-top: 2.5rem;}
.recImg h2 {
  text-align: center;
  border: 1px solid #fff;
  width: 400px;
  padding: 4rem;
  color: #fff;
  font-size: 2.5rem;
}
.recImg h2 span:nth-of-type(2){font-size:.9rem;display:block;}

.recList{width:var(--mw);margin:2rem auto;opacity:0;}
.rec--ttl {
    opacity:0;
    color: var(--mc);
    width: var(--mw);
    margin: 2rem auto 4rem;
    font-size: 3rem;
    font-weight: bold;
    position: relative;
}
.rec--ttl::after {
    content: "";
    width: 300px;
    height: 10px;
    background: var(--mc);
    position: absolute;
    bottom: -23px;
    left: 0;
}
.rec--ttl span{display:block;font-size:.9rem;}
.recList li{
  background:#eee;
  padding:2rem;
}
.recList li:nth-of-type(even){
  border: 2px solid var(--mc);
  background: #fff;
  margin: 2rem 0;
}
.recList p{font-size: .9rem;line-height: 1.8;}
.recList b{display:block;font-size:1.2rem;}

.recTb{width:var(--mw);margin:0 auto 2rem;opacity:0;}
div.afu > .recTb{opacity:1;}
.recTb th{
  font-weight:bold;
  background:#eee;
  border-top: 1px solid var(--mc);
  border-bottom: 1px solid var(--mc);
}
.recTb td{
  padding:1rem;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.wh3__con img{border:1px solid #ccc;}
.bw__btn{
    display: block;
    text-align: center;
    background: var(--mc);
    padding: 1rem;
    color: #fff;
    font-weight: bold;
    margin-bottom: 2rem;
}
.bw__btn.ptn2{width: 300px;margin: 0 auto 3rem;}
.bw__btn i{font-weight:bold;}
.bw__btn:hover{color:#fff;}

.csrWrap .txt{
  font-weight: bold;
  width: var(--mw);
  margin: 3rem auto;
  line-height: 2;
  text-align: center;
}
.csrWrap .recImg {
  height: 200px;
}
.csrWrap .recImg h2 {
  border: none;
  font-size: 4rem;
  margin: 0 auto;
  padding: 3.5rem;
  font-weight:bold;
}
.cwList{
  overflow:hidden;
  width: var(--mw);
  margin: 0 auto;
}
.cwList li {
    width: calc(100% / 5 - 1rem);
    background: #ff0030;
    padding: 32px 16px;
    color: #fff;
}
.cwList li:nth-of-type(2){
  background:#ff6018;
}
.cwList li:nth-of-type(3){
  background:#12a300;
}
.cwList li:nth-of-type(4){
  background:#1d9acb;  
}
.cwList li:nth-of-type(5) {
    background: transparent;
    border: 2px solid #085eaf;
    display: flex;
    align-items: center;
}
.cwList li:nth-of-type(5) img{
  width: 100%;
  margin:0;
}
.cwAct_tab__li {
    background: #ebf0f5;
    padding: 16px;
    margin: 12px 0;
    border-radius: 8px;
}
.cwAct_tab__li li{
    display: flex;
    gap: 8px;
}
.cwAct_tab__li li::before{
  content:"・";
}

.cwList li strong {
    font-size: 1.1rem;
    border-bottom: 1px solid #fff;
    display: block;
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
}
.cwList li p {
    font-size: .9rem;
    line-height: 2;
}
.cwList img{
  width: 60%;
  float: right;
  margin: 2rem 0 0;
}
/* .cwList li:last-of-type{margin-right:auto;} */

.cwAct{background:#eee;padding-bottom:3rem;}
.cwAct_inr{
  width:var(--mw);
  margin:0 auto;
  padding: 2rem 0;
}
.cwAct_inr h2{font-weight:bold;padding:1rem 0;}
.cwAct_inr h2 span:nth-of-type(1) {font-size:1.2rem;}
.cwAct_inr h2 span:nth-of-type(2) {
    display: block;
    font-size: 2.5rem;
    line-height: 1;
}
.cwAct_tab{align-items: baseline;}
.cwAct_tab li{
  font-weight:bold;
  width:calc(100% /5 - 1rem);
  margin-bottom: 1rem;
  cursor:pointer;
  font-size: 14px;
}
.cwAct_tab li.sel{font-weight:bold;}
.cwAct_tab li i {
    margin-right: 0.5rem;
}
.cwAct_tab li.sel i {
    color: #fff;
    background: #ff0034;
    display: inline-block;
    padding: 0.3rem 0.5rem;
    border-radius: 10rem;
    margin-right: 0.5rem;
    transition: 0.4s ease;
}
.cwAct_tab li:nth-of-type(2).sel i {background:#ff6018;}
.cwAct_tab li:nth-of-type(3).sel i {background:#12a300;}
.cwAct_tab li:nth-of-type(4).sel i {background:#1d9acb;}
.cwAct_tab li:nth-of-type(5).sel i {background:#085eaf;}
.cwAct_tab__wrap{
  border-top: 3px solid #ff0034;
}
.cwAct_tab__wrap dl {
    background: #fff;
    padding: 2rem;
    margin-top: 2rem;
    border-radius: 4px;
    box-shadow: 11px 9px 0px 2px #ff0034;
}
.cwAct_tab__wrap dl.on{
  opacity:1;
}
.cwAct_tab__wrap dt{
  font-weight: bold;
  font-size: 1.2rem;
}
.cwAct_tab__wrap dd{
  padding: 1rem 0;
  line-height: 1.8;
  align-items: flex-start;
}
.cwAct_tab__wrap dd i{font-weight:bold;margin-right: 0.5rem;}
.cwAct_tab__wrap dd a{font-weight:bold;display:block;color:#ff0034;}
.cwAct_tab__wrap dd img{width:30%;}.cwAct_tab__wrap dd img + *{width:68%;}
.cwAct_tab__wrap dd div p b{
  font-size: 110%;
}
.cwAct_tab__wrap dd div p:nth-of-type(2){
  margin: 1rem 0;
  border-top: 2px dotted #ccc;
  padding-top: 1rem;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 2px dotted #ccc;
}
.cwAct_tab__wrap:nth-of-type(2){border-color: #ff6018;}
.cwAct_tab__wrap:nth-of-type(2) dd a{color:#ff6018;}
.cwAct_tab__wrap:nth-of-type(3){border-color: #12a300;}
.cwAct_tab__wrap:nth-of-type(3) dd a{color:#12a300;}
.cwAct_tab__wrap:nth-of-type(4){border-color: #1d9acb;}
.cwAct_tab__wrap:nth-of-type(4) dd a{color:#1d9acb;}
.cwAct_tab__wrap:nth-of-type(5){border-color: #085eaf;}
.cwAct_tab__wrap:nth-of-type(5) dd a{color:#085eaf;}
.cwAct_tab__wrap:nth-of-type(2) dl{box-shadow: 11px 9px 0px 2px #ff6018;}
.cwAct_tab__wrap:nth-of-type(3) dl{box-shadow: 11px 9px 0px 2px #12a300;}
.cwAct_tab__wrap:nth-of-type(4) dl{box-shadow: 11px 9px 0px 2px #1d9acb;}
.cwAct_tab__wrap:nth-of-type(5) dl{box-shadow: 11px 9px 0px 2px #085eaf;}

.fadeUp {
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
.delay-time02{
animation-delay: 0.2s;
}
.delay-time04{
animation-delay: 0.4s;
}
.delay-time06{
animation-delay: 0.6s;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* add */
.rec__tab {
    width: var(--mw);
    margin: 2rem auto 0;
    display: flex;
    border-bottom: 4px solid var(--mc);
}
.rec__tab li {
    width: 200px;
    font-size: 20px;
    cursor:pointer;
    font-weight: bold;
    border: 4px solid var(--mc);
    border-bottom:none;
    text-align: center;
    padding: 10px;
    position:relative;
}
.rec__tab li.sel {
  background:var(--mc);
  color:#fff;
}
.rec__tab li.sel::before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f105";
	margin-right:5px;
}
.rec__subTtl{
    width: var(--mw);
    margin: 0 auto 1.5rem;
    font-size: 30px;
    font-weight: bold;
    border-left: 10px solid var(--mc);
    padding-left: 10px;
}
.recTbBox{opacity:0;}
.recTbBox a{
  text-decoration:underline;
}

@media only screen and (max-width: 599px){
  #spMenu{
    color: #fff;
    font-size: 2rem;
    margin-right: 1rem;
  }
  #spMenu.on{
    background:#fff;
    color:var(--mc);
    padding: 1rem;
    margin: -1rem 0;
  }
  .wh__menu{
    display: none;
  }
  .wh__menu.on {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 65px;
    left: 0;
    background: #fff;
    color: #3d7bae;
    z-index: 1;
  } 
  #spMenu .fa-bars{display:block;} #spMenu.on .fa-bars{display:none;}
  #spMenu .fa-times{display:none;} #spMenu.on .fa-times{display:block;}
  .wh__logo {width: 200px;}
  .wh__logo img{width: 80%;padding: 1rem;}
  .newsLine{font-size:.8rem;padding: 0.5rem;}
  .newsLine__wrap{font-size:.7rem;}
  .newsLine__wrap span {padding: 2px 8px;font-size:.7rem;}
  .wh__ec--ttl{font-size:1.2rem;}.wh__news--ttl{font-size: 1.3rem;}
  .wh__news{margin:0rem;padding: 1rem 1rem 2rem;}
  
  .wh__news-wrap span:nth-of-type(1){width:100px;font-size:.6rem;display:block;}
  .wh__news-wrap span:nth-of-type(2) {padding:0;font-size: .8rem;display:block;}
  .wh__news-wrap{font-size:.8rem;align-items:center;}
  .wh__pre{height:inherit;}
  .wh__pre-wrap {
    width: 100%;
    padding: 2rem 1rem 0;
    justify-content: space-between;
  }
  .wh__pre-l {
    font-size: 70%;
    width: 55%;
    padding-bottom:2rem;
  }
  .wh__pre--txt br{display:none;}
  .wh__pre--ttl strong {font-size: 2.4rem;}
  .wh__pre-r {
    width: calc(100% - 55% - 1rem);
    margin-left: inherit;
    margin-top: inherit;
  } 
  .wh3__con {
    width: 90%;
    margin: 0 auto 2rem;
  }
  .wf__logo {
    order: 2;
    width: 100%;
    padding: 1rem;
    text-align:center;
  }
  .wf__logo img {width: 60% !important;}
  .wf__menu{width:100%;}
  .wf__menu li {
      width: 100%;
      border-bottom: 1px solid #fff;
  }
  .wf--txt{
    display:none;
    padding: 1rem;
    border-top: 1px solid #fff;
    color: #fff6f6;
  }
  .wf--ttl {padding: 1rem;margin: 0;}
  .wf--ttl b {
      font-weight: normal;
      border-left: 4px solid #fff;
      padding-left: 0.5rem;
  }
  .wbg__footer{padding:0;}
  .wh__menu-linr {
    display:block;
    position: inherit;
    top:inherit;
    border-bottom:none;
    padding-bottom:0;
  }
  .wh__menu-li{border-bottom:1px solid #ccc;padding: 1rem;}
  .wh__menu-linr .wf--ttl{padding:0;font-size: .9rem;}
  .whm .wf--ttl b{
    padding:0;margin:0;
  }
  .whm{padding:0;}
  .whm li {
    width: 100%;
    border-bottom: 1px solid #ccc;
    padding: 0.5rem 0;
  }
  .whm li:last-of-type{border-bottom:none;}
  .whm .wf--txt a::after {
      margin-left: 1rem;
      font-family: "Font Awesome 5 Free";
      font-weight: 600;
      content: "\f054";
      font-size: 70%;
  }

  .eye--ttl {font-size: 2rem;width: 200px;}
  .eye {margin: 2rem auto;padding: 0 1rem;}  
  .eye img {
      width: 160px;
      right: 0;
      bottom: -32px;
  }
  .mss-txt{padding: 0 2rem;font-size: .9rem;} 
  .ph__txt,.phList{width:80%;}
  .ph__txt {margin: 4rem auto 2rem;}
  .ph__imp {
      font-size: .9rem;
      margin: 2rem auto;
      width: 80%;
  }
  .ph__imp::before {width: 6rem;left: 37%;}  
  .ph__txt dt{width:100%;}
  .ph__txt dd {
    width: 100%;
    padding: 1rem 0;
  }
  .ph__txt dt img:nth-of-type(2){display:none;}
  .phWrap:nth-of-type(2) .ph__txt {
      margin: 4rem auto 2rem;
  }
  .ph__txt2 {
      text-align: center;
      margin: 2rem auto 3rem;
      line-height: 1.8;
      font-size: .9rem;
      width: 80%;
  }
  .phList li{width:100%;font-size: .8rem;}
  .phList span {
    font-size: 1rem;
    width: 2rem;
    padding:0;
    margin-right:.5rem;
  }  
  .cp__tbl th,.cp__tbl td{display:block;width:100%;padding: 1rem;}
  .cpWrap{
    padding: 1rem;
  }
  .cpl li {
      width: 100%;
      margin-bottom: 1rem;
  }  
  .cp__tbl{margin:0;}.eye--ttl span{font-size:1rem;}
  .bw--txt {
    width: 90%;
    text-align:left;
    font-size: .9rem;
  }
  .bw__l{width:90%;}
  .bw__li{width:100%;}
  .accBox {width: 90%;margin: 0 auto 2rem;}  
  .rec--ttl {
    width: 90%;
    font-size: 2rem;
  }
  .recList li,.recList li:nth-of-type(even){width:90%;margin:0 auto;}
  .recList li:nth-of-type(even){margin:1rem auto;}
  .recTb th,.recTb td{display:block;width:100%;}
  .recTb {
      width: 90%;
      margin: 0 auto 2rem;
  }  
  .recTb th{
      padding: 1rem;
      background: var(--mc);
      color: #fff;
  } 
  .recTb td {
      border: none;
      padding: 1rem;
      font-size: .9rem;
      line-height: 1.8;
      margin-bottom: 1rem;
      border: 1px solid var(--mc);
  }
  .recImg {
       height: 300px;
      background: url(/upload/tenant_1/recruit_top_sp.webp) no-repeat !important;
      background-size: 100% auto !important;
  }
  .recImg h2 {
      width: 320px;
      padding: 2rem;
      margin: 2rem auto;
  }
  .bw__li p{height:auto;}
  .wn-l {width: 100%;}
  .wn-r{margin-left:0;width:calc(100% - 28%);}
  .wh__pre--ttl strong {font-size: 2rem;}
  .wh__pre--ttl span {font-size: .9rem;}
  .wh3__con h3{font-size:1.4rem;}
  .wh__news-wrap > div span:nth-of-type(1){font-size:.7rem;width:4rem;padding:0;}
  .news__cat {
      width: calc(100% - 4rem);
      display: flex;
      align-items: center;
      flex-wrap: wrap;
  }
  .news__cat span{
    width: auto !important;
    font-size: 10px !important;
  }
  .wbg__footer > div:nth-of-type(1){margin:0 auto;}
  .wf--ttl{font-size:1rem;}
  .wf--txt {background: #285b84;}
  .csrWrap .txt{
    padding: 0 1rem;
    margin: 2rem auto;
    font-size: 14px;
  }
  .cwList li {
    width: 100%;
    margin: 0rem 1rem 1rem;
  }
  .cwList li {opacity:0;}
  .cwList img {
    width: 90%;
    margin: 0;
  }  
  .cwAct_tab li{width:100%;}
  .cwAct_inr {margin: 0 auto;padding: 2rem 1rem;}
  .cwAct_tab__wrap dd {
      font-size: .9rem;
  }
  .cwAct_tab li.sel{order: 4;}
  .cwAct_tab__wrap dd img{width:100%;}
  .cwAct_tab__wrap dd img + * {
      width: 100%;
      margin: 1rem 0;
  }
  .cwAct_tab__wrap dl{padding:1.5rem;}
  .csrWrap .recImg {
      height: 150px;
      background: url(/upload/tenant_1/csr_img3.webp) no-repeat !important;
      background-size: auto 100% !important;
  }
  .csrWrap .recImg h2 {
      font-size: 3rem;
      padding: 2.5rem;
  }
  .rec__tab,.rec__subTtl{width:90%;}
  .wn-r {
    width: 100%;
  }
  .wh__ec--ttl span:nth-of-type(2) {
    font-size: 10px;
}
}