@CHARSET "UTF-8";
@import url('../column.css');
@import url('rissisha.css');
/*
base #fff2b2
blue #00509d

green #06d6a0
yellow #ffd500
pink #ef476f
*/

.forSp{
  display: block;
}
.forPc{
  display: none;
}
.commingSoon{
  pointer-events: none;
}
#tabWrap nav ul.menuBox li.commingSoon:after{
  content: "近日公開";
  color: #fff;
  background: #ef476f;
  height: auto;
  line-height: 1;
  width: auto;
  padding: .5rem;
  bottom: 3.5rem;
  left: calc( 50% - 2rem - .5rem);
  transform: rotate(15deg);
}
#tabWrap nav .menuBox li.commingSoon.become{
  background: #ccc;
}

.newArticle figure img,
.articleBox ul a img{
  max-width: 100%;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto 
}

.articleBox ul a img{
  max-width: 100%;
  height: auto;
}

.contentHeader{
  background: #fff2b2;
  color: #00509d;
  position: relative;
  height: 250px;
}
.contentHeader:after{
  bottom: -130px;
  content: "";
  height: 100px;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 1;
}
.contentHeader h1.contentTitle{
  padding: 2rem 1rem 0;
  text-align: center;
}

/* 20210430 */
.articleHeader{
  display: flex;
  flex-direction: column-reverse;
}
.articleHeader nav{
  background: #fff2b2;
  padding: .25rem 0;
}
.articleHeader nav div{
  display: block;
  margin: .25rem auto;
  max-width: 200px;
}
.articleHeader nav ul{
  display: flex;
  justify-content: space-around;
  list-style: none;
  line-height: 1;
  margin: .5rem;
  padding: 0;
  
}
.articleHeader nav ul a{
  background: #ccc;
  border-radius: 3px;
  display: block;
  font-size: .7em;
  line-height: 1;
  padding: .25rem .25rem .3rem .6rem;
  position: relative;
}
.articleHeader nav ul a:after{
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  content: "";
  height: 0.3em;
  left: .1rem;
  transform: rotate( 45deg );
  position: absolute;
  top: calc(50% - 0.15em);
  width: 0.3em;
}
.articleHeader h1.contentTitle{
  border-bottom: 4px double #333;
}
.articleHeader h1 span{
  font-size: .6em;
  font-weight: 500;
}

/*----*/

h1.contentTitle{
  border: none;
  margin: 0;
  padding: 0;
}
h1.contentTitle img,
.articleHeader nav img{
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}
h1.contentTitle+figure{
  margin: .5rem .75rem;
  
}
/*h1.contentTitle div:first-of-type{
  align-items: center;
  background: #fff2b2;
  display: flex;
  justify-content: center;
  line-height: 1;
  padding: .25rem;
  }
h1.contentTitle div:first-of-type span{
  box-sizing: border-box;
  color: #fff;
  display: inline-block;
  font-weight: 400;
  font-size: .9em;
  padding: .25rem .5rem .25rem .5rem;
}
h1.contentTitle div:first-of-type span:first-of-type{
  width: 45%;
  display: table-cell;
}
h1.contentTitle div:first-of-type span:last-of-type{
  border-radius: 1rem;
  font-size: .8em;
}*/
h1.contentTitle {
  color: #333;
  display: block;
  line-height: 1.3;
  margin: .75rem .75rem 0;
  padding-bottom: .75rem;
  text-align: left;
}

.contentWrap h2{
  border-left: 5px solid #00509d;
  font-size: 1.2em;
  line-height: 1.5;
  margin: 1.5rem .75rem;
  padding-left: .5rem;
  position: relative;
}
.contentWrap h2:before{
  background: #7fa7ce;
  content: "";
  width: 5px;
  height: 50%;
  position: absolute;
  top: 0;
  left: -5px;
}
.vocational .contentWrap h2:before,
.vocationalWrap  h2:before,.animal .contentWrap h2:before{
  background: #06d6a0;
}
.workStyle .contentWrap h2:before,
.workStyleWrap  h2:before{
  background: #ffd500;
}
.become .contentWrap h2:before,
.becomeWrap  h2:before{
  background: #ef476f;
}
.contentWrap h3{
  border-bottom: 1px solid #666;
  font-size: 1.1em;
  line-height: 1.5;
  margin: 1rem .75rem;
}
.contentWrap h4{
  font-size: 1em;
  margin: 1rem .75rem;
}

.contentHeader p{
  font-size: .9em;
  margin: .75rem;
}
.contentHeader p b{
  display: block;
  font-size: 1.3em;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 320px){
  .contentHeader p b{
    font-size: 1.1em;
    }
  }
.contentHeader figure{
  float: right;
  margin: 0 .25rem 0 0;
  position: relative;
  width: 29%;
  z-index: 2;
}
#tabWrap{
  position: relative;
  z-index: 4;
}
#tabWrap nav{
  clear: both;
}
#tabWrap nav p{
  text-align: center;
  line-height: 1;
}

#tabWrap nav ul.menuBox{
  display: flex;
  justify-content: space-between;
  margin: 1rem;
  padding: 0;
  list-style: none;
  
}


  #tabWrap nav ul.menuBox li:hover::before{
    opacity:.5;
  }

  #tabWrap nav ul.menuBox li{
    width: 32%;
    }

    

#tabWrap nav ul.menuBox li.become{
  position: relative;
}

/* #tabWrap nav ul.menuBox li.become::before{
  background: url("../../../../img/page/newcolumn/job/ttl_column_job_icon_bec.png") no-repeat;
    z-index: 1;
    width: 30px;
    height: 50px;
    content: '';
    display: inline-block;
    background-size: contain;
    vertical-align: middle;
    top:70%;
    left:10px;
    transform:translate(0,-50%);
    position:absolute;
} */


#tabWrap nav ul.menuBox li.workStyle{
  position: relative;
}

/* #tabWrap nav ul.menuBox li.workStyle::before{
  background: url("../../../../img/page/newcolumn/job/ttl_column_job_icon_wor.png") no-repeat;
    z-index: 1;
    width: 30px;
    height: 50px;
    content: '';
    display: inline-block;
    background-size: contain;
    vertical-align: middle;
    top:70%;
    left:10px;
    transform:translate(0,-50%);
    position:absolute;
} */
#tabWrap nav ul.menuBox li.current::before{
    left: 80px;
    }


@media screen and (max-width: 320px){
  #tabWrap nav ul.menuBox li{
    padding: .75rem .25rem;
    font-size: .9em;
  }
}
#tabWrap nav ul.menuBox li a{
  border-radius: 3px;
  color: #00509d;
  display: block;
  font-size: 1em;
  line-height: 1.3;
  padding: .75rem .5rem;
  position: relative;
  text-align: center;
  box-sizing: border-box;
 
}


#tabWrap nav ul.menuBox li a:before{
  content: "";
  border: 7px solid transparent;
  border-top-color: #fff;
  position: absolute;
  top: 0;
  left: calc(50% - 7px);
}
#tabWrap nav ul.menuBox li.current a:before{  
  border-top-color: #00509d;
  top: -5px;
}
#tabWrap nav ul.menuBox li a:after{
  content: "";
  height: 2rem;
  left: calc(50% - 2px);
  bottom: -2rem;
  position: absolute;
  width: 4px;
  z-index: 3;
}
#tabWrap nav .menuBox li.vocational a,
#tabWrap nav ul li.vocational.current a:after,
.articleHeader nav a.voc{
  background: #06d6a0;
}
.vocational .articleHeader h1.contentTitle span{
  color: #0BB786;
}
#tabWrap nav .menuBox li.workStyle a,
#tabWrap nav ul li.workStyle.current a:after,
.workStyle h1.contentTitle div:first-of-type span:last-of-type,
.articleHeader nav a.wor{
  background: #ffd500;
}
.workStyle .articleHeader h1.contentTitle span{
  color: #EDBF00;
}
#tabWrap nav .menuBox li.become a,
#tabWrap nav ul.menuBox li.become.current a:after,
.become h1.contentTitle div:first-of-type span:last-of-type,
.articleHeader nav a.bec{
  background: #ef476f;
  color: #fff;
}

.become .articleHeader h1.contentTitle span{
  color: #ef476f;
}

.newArticle{
  border-top: 4px solid transparent;
  background: #fff;
  margin: 1rem .75rem;
  z-index: 5;
  position: relative;
}
.newArticle a{
  display: flex;
  flex-direction: column;
  position: relative;
  padding-bottom: 1.75em;
}
.newArticle a:after{
  display: inline-block;
  background: #666;
  border-radius: 1rem;
  color: #fff;
  content: "この記事を読む";
  font-size: .8em;
  line-height: 1;
  text-align: center;
  padding: .25rem .5rem;
  position: absolute;
  bottom: 0;
  left: calc( 50% - 3.5em - .5rem );
  
}
/*.newArticle.first a{
  pointer-events: none;
}*/
.newArticle figure{
  margin: 0;
/*  order: 1;*/
  position: relative;
}
.vocationalWrap .newArticle{
  border-top-color: #06d6a0;
}
.workStyleWrap .newArticle{
  border-top-color: #ffd500;
}
.becomeWrap .newArticle{
  border-top-color: #ef476f;
}
.newArticle figure:before{
  background: linear-gradient( to bottom , rgba(255,255,255, 0) 0% , #fff 100%);
  content: "";
  width: 100%;
  height: 10rem;
  position: absolute;
  bottom: -1px;
  left: 0;
}
.newArticle a>div{
/*
  order: 2;
*/
  padding: 0 .5rem;
  position: relative;
  z-index: 7;
  }
.newArticle p{
  font-size: .9em;
  line-height: 1.5;
  margin: 0;
}
.newArticle .title{
  font-size: 1.2em;
  font-weight: 700;  
  margin-top: -5rem;
}

/*first*/
.newArticle.first figure:before{
  content: none;
}
.newArticle.first .title{
  margin: 1rem 0;
}

.toggle+.articleBox{
  display: none;
}
.toggle.active{
  display: none;
}
.column .articleBox ul{
  list-style-type: none;
  padding: 0;
  margin: 1.5rem .75rem;
}
.articleBox ul li{
  border-top:1px dashed #666;
  padding: .5rem 0;
}
.articleBox ul a{
  display: block;
  justify-content: space-between;
}
.articleBox ul a span:first-of-type{
  width: 40%;
  position: relative;
}
.articleBox ul a span:first-of-type:before{
  content: "";
  border: 7px solid transparent;
  position: absolute;
  top: 0;
  left: 0;
}
.vocationalWrap .articleBox ul a span:first-of-type:before{
  border-color: #06d6a0 transparent transparent #06d6a0;
}
.workStyleWrap .articleBox ul a span:first-of-type:before{
  border-color: #ffd500 transparent transparent #ffd500;
}
.becomeWrap .articleBox ul a span:first-of-type:before{
  border-color: #ef476f transparent transparent #ef476f;
}

.articleBox ul a span:last-of-type{
  width: 100%;
  display: block;
}

.more,
a.goToContentTop{
  background: #00509d;
  border-radius: 3px;
  color: #fff;
  display: block;
  padding: 1rem 0;
}
ul.pagenation{
  display: flex;
  justify-content: space-between;
  align-items: center;
  list-style-type: none;
  line-height: 1;
  padding: 0;
  margin: .75rem 0;
}
ul.pagenation li a,
ul.pagenation li span{
  background: #00509d;
  color: #fff;
  display: block;
  position: relative;
}
ul.pagenation li span{
  background: #ccc;
}
ul.pagenation li a:before{
  content: "";
  border: 5px solid transparent;
  top: calc( 50% - 5px);
  position: absolute;
}
ul.pagenation li:first-of-type a:before{
  left: .25rem;
  border-right-color: #fff;
}
ul.pagenation li:last-of-type a:before{
  right: .25rem;
  border-left-color: #fff;
}
ul.pagenation li:first-of-type a{
  border-radius: 0 3px 3px 0; 
  padding: 1rem 1rem 1rem 1.5rem;
}
ul.pagenation li:last-of-type a{
 border-radius: 0 0 3px 3px;  
  padding: 1rem 1.5rem 1rem 1rem;
}

/*#tabWrap>div{
  display: none;
}*/
.tab_1 #tab_1, .tab_2 #tab_2, .tab_3 #tab_3{
    display: block;
}

nav.pageIndex {
  background: #f2f6fa url("../../../../img/page/newcolumn/job/img_voc_05_05@3x.png") right top repeat-y;
  background-size:30% auto; 
  clear: both;
  margin: 2rem .5rem 1.5rem .5rem;
  padding: .75rem 0 1px 0;
  position: relative;
}
nav.pageIndex {
  background: #F2F6FA;
  background-size:30% auto;
  clear: both;
  margin: 2rem .5rem 1.5rem .5rem;
  padding: .75rem 0 1px 0;
  position: relative;

}

nav.pageIndex>div {
    position: relative;
}/*
nav.pageIndex>div:before{
  border-top: 1px dashed #00509d;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  top: -1em;
  width: 100%;
}*/
nav.pageIndex>div span {
    background: #00509d;
    border-radius: 1rem;
    color: #fff;
    font-size: .9em;
    line-height: 1;
    padding: .25em .5em;
    position: absolute;
    top: calc( -1em + -.75rem);
    left: calc(50% - 2.3em);
}
nav.pageIndex ul {
    list-style-type: none;
    margin: .5rem;
    padding: 0;
}
nav.pageIndex .mokuzi{
  overflow: hidden;
  position: relative;
}
nav.pageIndex .mokuzi::before{
  pointer-events: none;
  content: '';
  position: absolute;
  z-index: 1;
  top: 10px;
  right: -30px;
  width: 30%;
  height: 150%;
  background: url("../../../../img/page/newcolumn/job/img_voc_05_05@3x.png") right top repeat-y;
  background-size: 80% auto;
}
nav.pageIndex ul a {
  color: #00509d;
    display: block;
    padding: .5rem 0 .5rem 1.25rem;
    line-height: 1.3;
    position: relative;
}
nav.pageIndex ul a:before, nav.pageIndex ul a:after {
    content: "";
    border: 5px solid transparent;
    border-left-color: #00509d;
    left: .5rem;
    top: calc(50% - 5px);
    position: absolute;
    z-index: 1;
}
nav.pageIndex ul a:after {
    border-left-color: #f2f6fa;
    left: calc(.5rem - 2px);
    z-index: 2;
}

aside .shigotoWrap{
  border: 2px solid #fbd500;
  margin: .75rem;
  position:relative;
}
aside .shigotoWrap:after{
  background: #fbd500;
  content: "おすすめコンテンツ";
  font-size: .8em;
  left: 0;
  line-height: 1;
  padding: .1rem .25rem;
  position: absolute;
  top: 0;
}
aside .shigotoWrap figure{
  background: #fff2b2 url("../../../../img/page/newcolumn/job/img_bg_shigoto.png") center bottom repeat-x;
  margin: 0;
  padding-top: 1.5rem;
}
aside .shigotoWrap p{
}
aside .shigotoWrap ul{
  list-style-type: none;
  margin: .75rem;
  padding: 0;
}
aside .shigotoWrap ul li+li{
  border-top: 1px dashed #ccc;
}
aside .shigotoWrap ul a{
  display: block;
  padding: .5rem .5rem .5rem 1rem;
  position: relative;
}
aside .shigotoWrap ul a:before{
  content: "";
  border: 5px solid transparent;
  border-left-color: #fbd500;
  position: absolute;
  left: .25rem;
  top: calc( 50% - 5px );
}
/* common */
table.fixed{
  table-layout: fixed;
}
table.basic{
  font-size: .85em;
  margin: 1rem .75rem;
  width: calc( 100% - 1.5rem );
}
table.basic td{
  vertical-align: top;
}
table.tuitionFee{
  table-layout: fixed;
}
table.tuitionFee th{
  white-space: nowrap;
  text-align: right;
}
table.tuitionFee td,
table td.money{
  white-space: nowrap;
  text-align: right;
}
table.annualIncome td:last-of-type{
  width: 6em;
  text-align: right;
}

dl.basic{
  margin: 1rem .75rem;  
}
dl.basic dt{
  font-weight: 700;
}
dl.basic dt:not(:first-of-type){
  margin-top: .5em;
}
dl.basic dd{
  margin-left: 0;
}
dl.jobList{
  border-top: 1px dashed #00509d;
  border-bottom: 1px dashed #00509d;
  margin: 1rem .75rem;
  padding: 1rem .25rem;
}
dl.jobList  dt{
  font-weight: 700;
  vertical-align: middle;
}
dl.jobList  dt:before{
  content: "○ ";
  font-size: .8em;
}
  dl.jobList  dt:not(:first-of-type){
  margin-top: .5rem;
}
dl.jobList  dd{
  margin-left: 0;
}
table td.animal{
  white-space: nowrap;
  padding: 0;
}
.newline {
  margin: 15px 0;
}
.animal .articleHeader h1.contentTitle span{
  color: #0BB786;
}
.t-animal td:nth-child(1){
  width:30%;
}

.t-animal td:nth-child(2){
  width:30%;
}
.t-animal td:nth-child(3){
  width:30%;
}
.t-animal td:nth-child(4){
  width:30%;
}
.niku img{
  width: 250px;
}

.dogphoto img , .childphot img{
  width: 500px;
  display: block;
}
.vocational table.basic th{
  background: #c6ffe2;
}
 .vocational tr {
  background-color:#f4fff9;
}
.vocational table.basic tr{
  background-color:#f4fff9; 
}
.animal figure {
  float:none !important;
}
.animal figure img{
  margin: 0 auto;
}
.contentWrap dl dt {
  margin-left: 10px;
}
.contentWrap h2.jobmenu{
  border-left: 0; 
  font-size:15px;
  margin: 0px;
  margin-top: 15.2px;
  padding-left: 0px;

}
.contentWrap h2.jobmenu::before{
  display:none;
}
.contentWrap ul p {
  margin-left: 0px;
  font-size: 13px;
}
.become table.basic th{
  background:#FFD2E1;
   border: 1px solid #B2B1B9;
}
 .become tr {
  background-color:#f4fff9;
}
.become table.basic tr{
  background-color:#FDEFF4; 
  
}
.become table.basic td{
  border: 1px solid #B2B1B9;
}
.childphot figure {
  clear: both;
  margin: 2rem .5rem 1.5rem .5rem;
  padding: .75rem 0 1px 0;
  position: relative;
  overflow: hidden;
  margin-top: 0px;
padding-top: 20px;
}
.childphot figure::after {
content: "";
position: absolute;
top: 5px;
left: -30px;
width: 120%;
height: 100%;
background:  url("../../../../img/page/newcolumn/job/img_bec_03_01_03.png") left top no-repeat,url("../../../../img/page/newcolumn/job/img_bec_03_01_04.png") right top no-repeat;
background-size:30% auto; 

}

.become .contentWrap h2.bearicon::before{
content: "";
position: absolute;
top: 50%;
left: 0.25em;
background:  url("../../../../img/page/newcolumn/job/img_bec_03_01_05.png") left top no-repeat;
background-size:auto 100%;
transform: translate(0,-50%);
width: 1.5em;
height: 1.5em;
}
.become .contentWrap h2.bearicon{
  padding-left: 1.7em;
  border-left: 0;
  margin-left: 4px;
}
span.oneday {
  font-weight: bold;
  color: #F94892;
}

/* vocボタン */
#tabWrap .bottom nav ul.menuBox li.current a::before{
  background: #ffd500;
}
#tabWrap .bottom nav  ul.menuBox li a::before {
  border:none;
}
li.vocational a, #tabWrap .bottom nav ul li.vocational.current a::before{
  background: #06d6a0;
}
#tabWrap .bottom.vocational nav ul.menuBox li a::before{
  content: "";
  height: 1rem;
  left: calc(50% - 2px);
  bottom: -2rem;
  position: absolute;
  width: 4px;
  top: -1rem;
}
#tabWrap .bottom nav ul.menuBox li a::after{
  content: none;
}
.contentHeader{
  border-top: 2px solid #00509d;
  border-bottom: 2px solid #00509d;
}
.bottom{
  border-top: 4px solid #06d6a0;
}

/* worボタン */
.bottom.workStyle{
  border-top: 4px solid #ffd500;
}
#tabWrap .bottom.workStyle nav ul.menuBox li a::before{
  content: "";
  height: 1rem;
  left: calc(50% - 2px);
  bottom: -2rem;
  position: absolute;
  width: 4px;
  top: -1rem;
}

/* decボタン */
.bottom.become{
  border-top: 4px solid #ef476f;
}
#tabWrap nav .bottom.become ul.menuBox li a::before{
  content: "";
  height: 1rem;
  left: calc(50% - 2px);
  bottom: -2rem;
  position: absolute;
  width: 4px;
  top: -1rem;
}
li.vocational a, #tabWrap .bottom nav ul li.become.current a::before{
  background: #ef476f;
 
}
#tabWrap .bottom.become nav ul.menuBox li a::before{
  content: "";
  height: 1rem;
  left: calc(50% - 2px);
  bottom: -2rem;
  position: absolute;
  width: 4px;
  top: -1rem;
}

.cmWrap.bottom{
  border-top:none;
}
.bottomphoto img{
  width: 130px;
  
}
.animallink a{
  background-color: rgba(255,81,0,1);
  color: #fff;
  padding: 1rem 0;
  padding: 10px 100px;
  font-size: 20px;
  border-radius: 6px;
}

.animallink{
  text-align: center;
  margin-bottom: 30px;
  margin-top: 20px;
}
.photoside p.bold{
  font-weight: bold;
  margin-top: 0px;
  margin-bottom: 0px;
  font-size: 22px;
  text-align: center;

}
.animallink p{
  margin-top: 0px;
}
.animallink ul{
  list-style: none;
  text-align:left;
  margin-bottom: 30px;
  margin-top: 0px;
}

.readbook{
  border-radius: 10px;
  margin-left: 13px;
  margin-right: 13px;
}
.dogs{
  margin-left: 12px;
}
.arrow{
  text-align: center;
  margin-bottom: 20px;
}

a.readlink{
  background-color: rgba(255,81,0,1);
  color: #fff;
  padding: 1rem 0;
  padding: 10px 50px;
  font-size: 16px;
  border-radius: 6px;
  margin-left: 10px;
}
.animallink .searchlink{
  position: relative;
  margin-bottom: 20px;
  margin-top: 10px;
}
.animallink .searchlink::after{
  pointer-events: none;
  content: '';
  position: absolute;
  bottom: 0;
  right: -1rem;
  width: 6.5rem;
  height: 100px;
  background: url('../../../../img/page/newcolumn/job/img_voc_05_06.png') left top no-repeat;
  background-size: auto;
  background-size: 100% auto;
}
.photosidebottom p.bold{
  font-weight: bold;
  margin-bottom: 0;
}
.readbook{
  border: solid 1px #333;
  border-radius: 10px;
  margin-left: 13px;
  margin-right: 13px;
}

.mezaseruSchool{
  width: 288px;
  margin: 50px auto;
}
.mezaseruSchool.twoBtn{
  margin-bottom: 0;
}
.mezaseruSchool a{
   padding: 20px;
   background-color: #ffd500;
   color: #00509d;
   border-radius: 5rem;
   box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.2);
   border:0!important;
   display: block;
   text-align: center;
   font-weight: 700;
   position: relative;
}
.mezaseruSchool a::before{
  content: "";
  background: url('../../../../img/page/newcolumn/job/iconSearch.webp') left top no-repeat;
  border-left-color: #00509d;
  left: .5rem;
  top: -26px;
  position: absolute;
  z-index: 1;
  width: 46px;
  height: 73px;
  background-size: contain;
}
.mezaseruSchool span{
  font-weight: 700;

}
.mezaseruSchool.Company{
  margin-top: 0;
}
.mezaseruSchool.Company a{
  background-color: #01a0d5;
  color: #fff;
}
.bottomseikyu h3{
  background: #39b34a;
  border-radius: 1rem;
  padding: 2rem;
  width: 287px;
  margin: 20px auto;
  margin-top: 70px;
}
.bottomseikyu .left .leftimg{
  margin: 0 auto;  
  width: 250px;
}
.bottomseikyu .left img{
  width: 250px;
}
p.green{
  color: #39b34a;
  font-weight: 700;
}
.bottomseikyu ul{
  background: #fffff4;
  border: 2px solid #39b34a;
  border-radius: 1rem;
  font-weight: 700;
  margin: 3rem 0 2rem;
  padding: 1.5rem 1rem 1.5rem 2rem;
  position: relative;
  margin: 10px;
  margin-top: 50px;
}
.bottomseikyu ul::before::after{
  pointer-events: none;
  position: absolute;
}
.bottomseikyu ul::before {
  content: "内容をチェック！";
  left: 0;
  position: absolute;
  top: -33px;
  color: #39b34a;
}
.omakaseSeikyu{
  background-color: #fffaf3;
  padding: 10px;
  margin-top: 46px;
}
.omakaseSeikyu p{
  text-align: center;
  font-size: 19px;
  font-weight: 700;
  color: #EB6363 !important;
}
.omksBtn a{
  background-color: #DD3350;
  padding: 1rem;
  color: #fff!important;
  font-size: 19px;
  width: 200px;
  margin: 0 auto;
  text-align: center;
  border-radius: 10px;
  font-weight: 700;
  box-shadow: 0 5px 10px 1px rgba(0, 0, 0, 0.2);
  padding-bottom: .8rem;
  padding-top: 6px;
  display: block;
}
.omksPursueBtn{
  width: 310px;
  margin: 0 auto;
  position: fixed;
  bottom: 7%;
  z-index: 10;
  right: 59px;
  animation: late-open ease-in 1s forwards;
}
.snow{
  display: none;
}

/* late-open = display: block; */
@keyframes late-open {
  from {
  opacity: 0;
  transform: translateY(-10px);
}
  to {
    display: block;
  }
}
.omksPursueBtn img{
  width: 320px;
}

ol{
  list-style:none;
  counter-reset: leftIn_number;
}
ol li::before{

  color: #39b34a;
  right: 10px;
  position: relative;
  font-weight: 700;
}
.mezaseruSchool.Company a::before{
  content: none;
}
.tamesiyomi{
  width: 300px;
  margin: 20px auto;
}
.tamesiyomi p{
  width: 135px;
  margin: 25px auto;
  bottom: 5px;
  position: relative;
}
.tamesiyomi a{
  padding: 5px;
  border: 2px solid #4d89d1;
  border-bottom: 2px solid #4d89d1!important;
  border-radius: 30px;
  width: 100px;
  display: block;
  text-align: center;
}
/* -------------------------
  /* for pc only
  --------------------------*/
  @media screen and (min-width: 768px) {

    @CHARSET "UTF-8";
@import url('../column_pc.css');
@import url('rissisha_pc.css');

.forSp{
  display: none;
}
.forPc{
  display: block;
}
.contentArea{
  display: flex;
  justify-content: space-between;
}
.contentHeader{
  border-top: 2px solid #00509d;
  border-bottom: 2px solid #00509d;
}
.contentWrap{
  box-sizing: border-box;
  margin: 0;
  width: 68%;
}
.cmWrap{
  width: 30% ;
}

.articleHeader{
  border-top: 2px solid #00509d;
}
.articleHeader nav{
  display: flex;
  justify-content: left;
  padding: .5rem .75rem;
}
.articleHeader nav ul li{
  margin: 0 .25rem;
}
.articleHeader nav>div{
  display: flex;
  align-items: center;
  margin: 0;
}
.articleHeader h1.contentTitle{
  font-size: 1.7em;
  margin: 0;
  padding: .5rem;
}
.articleHeader h1 span{
  font-weight: 700;
}
.articleHeader nav ul a{
  font-size: .9em;
  padding: .5rem .75rem .5rem 1rem;
}
.articleHeader nav ul a:after{
  border-width: 2px 2px 0 0;
  width: .4rem;
  height: .4rem;
  top: calc(50% - .3rem);
}
h1.contentTitle div:first-of-type{
  justify-content: start;
  padding: .5rem;
}
h1.contentTitle div:first-of-type span:first-of-type{
  width: 200px;
}
h1.contentTitle div:last-of-type{
  font-size: 1.3em;
  margin: 1rem 0;
  padding: 0 .75rem .5rem;
}
h1.contentTitle+figure{
  margin: 2rem 1rem;
}
.contentWrap h2{
  margin: 2rem .75rem;
  font-size: 1.5em;
}
.contentWrap h3{
  margin: 2rem .75rem 1rem;
  font-size: 1.2em;
}
.contentWrap h4{
  font-size: 1em;
}
#tabWrap{
  max-width: 800px;
  margin: 0 auto;
}

#tabWrap nav ul li:before{
  content: "";
  border-width: 10px;
  left: calc(50% - 10px);
}
#tabWrap.tab_1 li.tab_1,
#tabWrap.tab_2 li.tab_2,
#tabWrap.tab_3 li.tab_3{
  font-weight: 700;
}

.newArticle a{
  flex-wrap: wrap;
  flex-direction: row;
}
.newArticle a>*{
  margin: 0;
}
.newArticle p.title{
  font-size: 1.4rem;
  margin-top: 0;
  order: 1;
  width: 100%;
}
.newArticle p.text{
  font-size: 1.05em;
  margin: 0 1rem 1rem 1rem;
  order: 3;
  width: calc( 60% - 2rem );
}
.newArticle figure{
  text-align: left;
  order: 2;
  width: 40%;
}
.newArticle figure:before{
  content: none;
}
.contentHeader figure{
  margin: -2.5rem 2rem 0 0;
  z-index: 2;
  position: relative;
}
.contentHeader:after{
  height: 50px;
  bottom: -80px;
}
.contentHeader p:last-of-type{
  margin-left: 140px;
}


.articleBox ul{
  margin: 1rem 1.5rem;
}
/* .articleBox ul a span:first-of-type{
  width: 30%;
}
.articleBox ul a div{  
  width: 68%;
} */
.contentWrap figure:first-child{
  float: left;
}

.child .contentWrap figure:first-child{
  float: none;
}

nav.pageIndex{
  margin-top: 3rem;
}
nav.pageIndex ul a{
  padding: .25rem 0 .25rem 1.25rem;
}

aside .shigotoWrap{
  margin: 0;
}
aside .shigotoWrap p{
  font-size: .8em;
}
aside .shigotoWrap ul{
  font-size: .9em;
}

/* common */
table.basic{
  font-size: 1em;
}
dl.jobList{
  padding: 1rem;
}

/* voc_05_animal */
.t-animal td:nth-child(1){
  width:10%;
}
.t-animal td:nth-child(2){
  width:20%;
}
.t-animal td:nth-child(4){
  width:30%;
}
nav.pageIndex .mokuzi::before{
  transform: rotate(-30deg);
   right: 30px;
  top: -10px;
}
.articleBox ul a{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.articleBox ul a span:first-of-type{
  width: 30%;
}
.articleBox ul a div{  
  width: 68%;
}
.child figure img {
  margin: 0 auto;
}
.childphot figure::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background:  url("../../../../img/page/newcolumn/job/img_bec_03_01_03.png") left top no-repeat,url("../../../../img/page/newcolumn/job/img_bec_03_01_04.png") right top no-repeat;
  background-size:30% auto; 
  }
  #tabWrap nav ul.menuBox li:hover::before{
  opacity:.5;
  }

  #tabWrap nav ul.menuBox li.vocational::before{
  background: url("../../../../img/page/newcolumn/job/ttl_column_job_icon.png") no-repeat;
  z-index: 1;
  width: 30px;
  height: 23px;
  content: '';
  display: inline-block;
  background-size: contain;
  vertical-align: middle;
  top: 49%;
  left:10px;
  transform:translate(0,-50%);
  position:absolute;
  }

  #tabWrap nav ul.menuBox li.become{
  position: relative;
}

  #tabWrap nav ul.menuBox li.become::before{
  background: url("../../../../img/page/newcolumn/job/ttl_column_job_icon_bec.png") no-repeat;
  z-index: 1;
  width: 22px;
  height: 59px;
  content: '';
  display: inline-block;
  background-size: contain;
  vertical-align: middle;
  top: 79%;
  left:10px;
  transform:translate(0,-50%);
  position:absolute;
  
}
#tabWrap nav ul.menuBox li.become.current::before{
  background: url("../../../../img/page/newcolumn/job/ttl_column_job_icon_bec.png") no-repeat;
  z-index: 1;
  width: 22px;
  height: 59px;
  content: '';
  display: inline-block;
  background-size: contain;
  vertical-align: middle;
  top: 80%;
  left: 70px;

}

  #tabWrap nav ul.menuBox li.current{
  width: 50%;
  margin-right: 20px;
}
  #tabWrap nav ul.menuBox li.workStyle{
  position: relative;
}

  #tabWrap nav ul.menuBox li.workStyle::before{
  background: url("../../../../img/page/newcolumn/job/ttl_column_job_icon_wor.png") no-repeat;
  z-index: 1;
  width: 24px;
  height: 50px;
  content: '';
  display: inline-block;
  background-size: contain;
  vertical-align: middle;
  top:70%;
  left: 4px;
  transform:translate(0,-50%);
  position:absolute;
  }
  #tabWrap .bottom.workStyle nav ul.menuBox li a::before{
  top: -1rem;
  }
  #tabWrap nav ul.menuBox li.current::before{
    left: 65px;
  }
  #tabWrap nav  ul.menuBox li.current{
  width: 50%;
  margin-right: 20px;
  }
  #tabWrap nav ul.menuBox li{
  width: 25%;
  margin-right: 20px;
  position: relative;
  }
  #tabWrap nav ul.menuBox li.vocational{
  margin-left: 20px;
  }
  #tabWrap .bottom nav ul.menuBox li.vocational::before{
  background: url("../../../../img/page/newcolumn/job/ttl_column_job_icon.png") no-repeat;
  z-index: 1;
  width: 30px;
  height: 22px;
  content: '';
  display: inline-block;
  background-size: contain;
  vertical-align: middle;
  top: 56%;
  transform:translate(0,-50%);
  position:absolute;
  }
  
.animallink{
  display: flex;
  margin-top: 50px;
}
.photoside p{
  margin-left: 30px;
  }
.readbook{
  margin-right: 0px;
  }
.bookimg{
  padding-top: 0;
  }
.animallink a.searchlink{
  margin-left: 20px;
  }
.photosidebottom{
  text-align:left;
  margin-bottom: 30px;
  }
.photosidebottom p.bold{
  margin-left: 30px;
  }
a.readlink{
  padding: 10px 50px;
  margin-left: 150px;
}
.photosidebottom ul{
  margin-bottom: 30px;
}
.animallink.bookver{
  margin-left: 60px;
}
.movie{
  margin: 0 10px;
}
.bottomseikyu h3{
  background:none;
  border-bottom:0;
}
.left{
  display: flex;
  flex-direction: row;
  width: 709px;
  margin-left: 25px;
}
.leftIn{
  margin-left: 15px;
}
.bottomseikyu h3{
  width: 740px;
  padding: 0;
}
.bottomseikyu h3 img{
  width: 740px;
  margin: 6rem .75rem 3rem;
}
.omakaseSeikyu{
  width: 655px;
  margin-top: 40px;
  margin-bottom: 20px;
}
.omksPursueBtn{
  right: 413px;
  bottom: 20px;
}
.tamesiyomi p{
  width: 135px;
  margin: 25px auto;
  bottom: 14px;
  position: relative;
}
.tamesiyomi a{
  padding: 5px;
  border: 2px solid #4d89d1;
  border-bottom: 2px solid #4d89d1!important;
  border-radius: 30px;
  width: 100px;
  display: block;
  text-align: center;
}
.tamesiyomi li{
  width: 408px;
  height: auto;
  margin: auto 0;
}
.tamesiyomi{
  display: flex;
  flex-direction: row;
  height: 71px;
  border-bottom: aliceblue solid 4px;
  width: 571px;
}

  }