@charset "utf-8";
/*各ページ共通
------------------------------------------------------------*/
/*メイン画像エリア*/
#main_area{position: relative;top: 0; width:100%;z-index: 1;overflow: hidden;border-bottom:17px solid #ff8ea4;}
#main_area {
  position: relative;
  width: 100%;
  height: 420px;
  background-image: url('../images/recruit/main.webp'); /*ページごとに変更*/
  background-size: cover;     
  background-position: center; /* ページによって変更OK */
  background-repeat: no-repeat;
}
#main_area p{
    position:absolute;
    left:5%;
    bottom:10%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    background:#FFF;
    width:clamp(150px,calc(250/1280*100vw),250px);
    height: clamp(80px,calc(250/1280*100vw),250px);
    font-size:clamp(16px,calc(30/1280*100vw),30px);
    font-weight: 500;
    opacity: 0.8;
}
#main_area p:before{
    content:"Recruit Detail";
    color:#ff8ea4;
    font-size:clamp(12px,calc(25/1280*100vw),25px);
    font-family: "Sniglet", system-ui;
    font-weight: 400;
}
@media only screen and (max-width:768px){
    #main_area {
      background-image: url('../images/recruit/mainTAB.webp'); /*ページごとに変更*/
    }
}
@media only screen and (max-width:450px){
    #main_area {
      background-image: url('../images/recruit/mainSP.webp'); /*ページごとに変更*/
      height: 250px;
    }
    #main_area p{
        left:5%;
        bottom:5%;
    }
}
.gift img{
    position:absolute;
    right:clamp(0rem, -4.688rem + 9.77vw, 3.125rem);
    bottom:clamp(0.625rem, -1.25rem + 3.91vw, 1.875rem);
    z-index: 3;
    width:clamp(110px,calc(260/1500*100vw),260px);
    height: auto;
    transition: transform 0.3s ease;
}
.gift:hover{opacity: 1.0;}
.gift:hover img{transform: scale(1.05);opacity: 0.9;}
/*このページ単体のCSS------------------------------------------------------------*/
#recruit .tih2::before{content:"Recruit";}
.entry{border:1px solid #b3b3b3;padding:clamp(30px,calc(60/1280*100vw),60px) clamp(20px,calc(40/1280*100vw),40px);}
.entry time{display:block;text-align:right;margin-bottom: 1em;color:#2350b5;}
.entry p{margin-bottom: 20px;}
/*見出し*/
.entry h3:first-child{margin-top:0;}
.entry h3 {position: relative; margin: 40px 0 20px;font-size:clamp(22px,calc(24/1280*100vw),25px);}
.entry h3::after {content: "";display: block; height: 3px;margin-top:0.5em;  background: linear-gradient(to right, #004c84 20%, #f2f0ee 20%);}
.entry h4{border-left:5px solid #004c84;color:#004c84;font-size:clamp(20px,calc(24/1280*100vw),22px);margin-bottom:20px;padding:8px 10px;}
.entry h5{color:#004c84; font-weight: 700;font-size:20px;margin-bottom: 20px; }

/*箇条書き*/
.entry ol li:not(:last-child),.entry ul li:not(:last-child){margin-bottom: 10px;}
.entry ul li {position: relative; padding-left: 15px;}
.entry ul li::before {
    content: "";
    background:#ff8ea4; 
    position: absolute;
    border-radius: 50%;
    left: 0; 
    top: 10px;
    width: 6px;
    height: 6px;
}
.entry ol,.entry ul{margin-bottom:2rem;}
.entry ol {
	counter-reset: my-counter;
	list-style: none;
}
.entry ol li {
  line-height: 1.5;
  padding-left: 30px;
  position: relative;
}
.entry ol li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  border: 1px solid #ff8ea4;
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 22px;
  width: 22px;
  color: #ff8ea4;
  font-size: 85%;
  line-height: 1;
  position: absolute;
  top: 1.5px;
  left: 0;
}
.entrylist{
    padding:30px;
}
.entrylist a{align-items: center;padding:5px 0;display: flex; gap:clamp(10px,calc(20/1920*100vw),1.5em);color:#000; text-decoration: underline;}
.entrylist a:hover{color:#ff8ea4;text-decoration: none;}
.entrylist a::before{content:"";display:inline-block;background:url("../images/home/arrow.svg") no-repeat center/cover; width:16px; height: 16px}
/*.pager{display:flex; justify-content: center;align-items: center;gap:20px;}
.pager li{width:48.5%; max-width:200px;}
.pager a{
	display:block;	padding:clamp(5px,10/1280*100vw,10px);text-align: center;
	background:#ff8ea4;
	border-radius: 30px;
	color:#FFF;
}*/
/*フッター*/
.cta{ background:url("../images/recruit/bg_cta.webp") no-repeat center center/cover;}

/* レスポンシブ
------------------------------------------------------------*/
@media screen and (max-width: 1025px) {
}
/* 768px以下から
------------------------------------------------------------*/
@media only screen and (max-width:768px){
    /*フッター*/
    .cta{ background:url("../images/recruit/bg_ctaTAB.webp") no-repeat center center/cover;}
}
/* 450px以下から
------------------------------------------------------------*/
@media only screen and (max-width:450px){
    main{position:relative;}
    .gift img{
        top:-110px;
        right:10px;
        width:clamp(110px,calc(260/1500*100vw),260px);
        height: auto;
        transition: transform 0.3s ease;
    }
    #pager img{width:26px; height: 26px;}
    #pager li:not(.prev):not(.next){ margin:0 1.5%;}
    /*フッター*/
    .cta{background:url("../images/recruit/bg_ctaSP.webp") no-repeat center center/cover;} 

}